* {
font-size:17pt;
  text-align: center;
}

html, body {
    height: 100%;
    margin: 0;
    padding: 0;
}

.podsumowanie{
  padding:0px;
  margin:0px;
}

.grupa{
  font-weight:bold;
  margin-bottom:0px;
}

body {
    display: flex;
    flex-direction: column;
}

#voting-content {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.stopka, #spp, #spp-dane {
    margin-top: auto;
}


#top{
  text-align:center;
  font-size:24pt;
  padding-top: 25pt;
  padding-bottom: 10pt;
  font-weight: bold;
}

.name-item:hover {
	color: darkblue;
	text-decoration: underline;
}

.grid{
    display:flex;
  }

.lewa, .prawa{
  padding:5px;
  width:45%
}

.lewa{
  text-align:left;
}

.
.prawa{
  text-align:right;
}

h1, h2, h3{
  margin:5px;
}

h1{
  font-size: 130%;
  text-align:center;
}

h2{
  font-size: 110%;
}

h3{
  text-align: center;
  font-size:100%;
}



.lista-l {
	border: 1px solid #ccc;
	padding: 10px;
	min-height: 50px;
	margin-bottom: 20px;
  background-color:white;
}

.lista-p {
	border: 1px solid #ccc;
	padding: 10px;
	min-height: 50px;
	margin-bottom: 20px;
  background-color:#e0ffd0;
}


.left, .middle, .right{
font-size: 17pt;
}

html{
  scroll-behavior: smooth;
}

.lato-thin {
  font-family: "Lato", serif;
  font-weight: 100;
  font-style: normal;
}

.lato-light {
  font-family: "Lato", serif;
  font-weight: 300;
  font-style: normal;
}

.lato-regular {
  font-family: "Lato", serif;
  font-weight: 400;
  font-style: normal;
}

.lato-bold {
  font-family: "Lato", serif;
  font-weight: 700;
  font-style: normal;
}

.lato-black {
  font-family: "Lato", serif;
  font-weight: 900;
  font-style: normal;
}

.lato-thin-italic {
  font-family: "Lato", serif;
  font-weight: 100;
  font-style: italic;
}

.lato-light-italic {
  font-family: "Lato", serif;
  font-weight: 300;
  font-style: italic;
}

.lato-regular-italic {
  font-family: "Lato", serif;
  font-weight: 400;
  font-style: italic;
}

.lato-bold-italic {
  font-family: "Lato", serif;
  font-weight: 700;
  font-style: italic;
}

.lato-black-italic {
  font-family: "Lato", serif;
  font-weight: 900;
  font-style: italic;
}

body {
margin: 0px;
padding: 0px;
font-family:"Gill Sans MT", "Basic Sans", "Noto Sans", "Lato", sans serif;     
}

a{
color:darkgreen;
text-decoration:none;
-webkit-transition: size 1s, color 1s; /* Safari prior 6.1 */
transition: size 1s, color 1s;
}

#logo{
margin-left:15px;
margin-top:15px;
height:100px;
background-color: white;
}

a:active, a:visited, a:link {
  font-weight:bold;
}

a:hover {
color:black;
}

hr  {
border: 2px solid darkblue;
}

ol{
  list-style-position: inside;
  margin-top:0;
  margin-bottom:0;
  list-style-type:arabic;
  padding-left:5px;
}

.spacer{
height:0.3vw;
background-color:white;
}

#spp{
text-align: center;
color:#00199a;
background-color:darkblue;
-webkit-transition: size 1s, color 1s; /* Safari prior 6.1 */
transition: size 1s, color 1s;
}

#spp-dane{
text-align: center;
color:white;
background-color:darkblue;
}


#spp a, #spp a:active, #spp a:visited{
color:white;                
}

#spp a:hover{
font-size:100%;
  color:lightblue;
}

 .content, .header{
  padding-left: 23%;
  padding-right: 23%;
}

.content{
padding-top:15px;
padding-bottom:15px;
text-align:justify;
}

.content{
  color:black;
  background-color:#e6e6e6;
}

.button{
  text-align: center;
}

.header{
padding-top:10px;
padding-bottom:10px;
font-size:120%;
font-weight:bold;
background-color: #091b00;
background:linear-gradient(270deg, rgb(230, 230, 230) 0%, rgb(0, 0, 139) 70%);
color: white;
}

.active {
background-color: darkblue;
}

.left, .middle, .right{
display:inline-block;
}

.left{
	width:60%;
text-align:right;
}

.middle{
	width:3%;
text-align:center;
}

.right{
	width:30%;
text-align:left;
font-weight:bold;
}

ul{
list-style-position: inside;
margin-top:0;
margin-bottom:0;
}

li{
text-align:left;
}

img {
border-image-width:0px
}

.bold{
  font-weight: bold;
}


@media only screen and (max-width: 600px) {
* {
font-size:15pt;
}

.left, .middle, .right{
font-size: 15pt;
}
  
.content, .header{
padding-left: 5px;
padding-right: 5px;
}

.header{
padding-top: 5px;
padding-bottom: 5px;
font-size:120%;
}

}

@media only screen  and (min-width:601px) and (max-width: 800px) {
* {
font-size:15pt;
}

.left, .middle, .right{
font-size: 15pt;
}
  

 .content, .header{
padding-left:5%;
padding-top:5px;
padding-right:5%;
padding-bottom:5px;
}

 .header{
font-size:120%;
}

#menu{
font-size:80%;
}
}

@media only screen and (min-width:801px) and (max-width: 1200px) {
* {
font-size:16pt;
}

.left, .middle, .right{
font-size: 16pt;
}
  
#lang {
  position: absolute;
  right: 1%;
  top: 0%;
}
  
 .content,   .header{
padding-left:10%;
padding-right:10%;
}

.header{
font-size:150%;
}

#menu{
font-size:90%;
}
}


@media only screen and (min-width:1201px) and (max-width:1500px) {
* {
font-size:16pt;
}

.left, .middle, .right{
font-size: 16pt;
}
  
#menu{
font-size:100%;
}

 .content,   .header{
padding: 10px 15% 10px 15%;
}

.header{
font-size:130%;
}
}