@font-face {font-family:"Inter"; font-weight:400; font-style:normal; src:url("/fonts/Inter/inter-regular.woff2") format("woff2"), url("/fonts/Inter/inter-regular.woff") format("woff"); font-display:swap}
@font-face {font-family:"Inter"; font-weight:400; font-style:italic; src:url("/fonts/Inter/inter-italic.woff2") format("woff2"), url("/fonts/Inter/inter-italic.woff") format("woff"); font-display:swap}
@font-face {font-family:"Inter"; font-weight:700; font-style:normal; src:url("/fonts/Inter/inter-semibold.woff2") format("woff2"), url("/fonts/Inter/inter-semibold.woff") format("woff"); font-display:swap}
@font-face {font-family:"Inter"; font-weight:700; font-style:italic; src:url("/fonts/Inter/inter-semibolditalic.woff2") format("woff2"), url("/fonts/Inter/inter-semibolditalic.woff") format("woff"); font-display:swap}
@font-face {font-family:"Inter"; font-weight:800; font-style:normal; src:url("/fonts/Inter/inter-extrabold.woff2") format("woff2"), url("/fonts/Inter/inter-extrabold.woff") format("woff"); font-display:swap}
@font-face {font-family:"Inter"; font-weight:800; font-style:italic; src:url("/fonts/Inter/inter-extrabolditalic.woff2") format("woff2"), url("/fonts/Inter/inter-extrabolditalic.woff") format("woff"); font-display:swap}


html, body {height:100%; overflow:hidden}	
body {font-size:2.5vw; font-family:'Inter', sans-serif; color:#263238; background:#FFF /*url('/o/volby-n4/2021/mega-bg-1.jpg') no-repeat fixed 50% 50%  / cover*/}

.sphra {display:flex; justify-content:center; align-items:center; width:100%; height:100%; margin:0 auto; border-radius:.5rem; text-align:left; color:inherit; background:#EFF3F9}
.sphra, .sphra *, .sphra *::before, .sphra::after {box-sizing:border-box;}
.sphra h3, .sphra > p { margin-left:45px}
.sphra h3 {margin-bottom:.3em; color:#cc1821; font-size:150%;}
.sphra > p {font-size:117%; opacity:.7}
.sphra ul {margin:0; padding:0; list-style-type:none;}
.sphra ul li {float:left; width:50%; line-height:1.2;}
.sphra ul li:nth-child(2n+1) {clear:left;}
.sphra a {float:left; width:100%; padding:.7em; border:1px solid transparent; border-radius:.5em; color:inherit; text-decoration:none;}
.sphra a:hover {border-color:#678AC6; color:inherit; background:#FFF}
.sphra .face {overflow:hidden; float:left; width:2.6em; height:2.6em; margin:0 .6em 0 0; border:2px solid #FFF; border-radius:100%; box-shadow:0 2px 8px 0 rgba(0,0,0,.32); text-align:center; transition:none; background:url('/o/all/nophoto9.jpg') no-repeat 50% 50% / contain}
.sphra .face img {float:none; display:inline-block; width:auto; height:100%; margin:0 -45%}
.sphra a.clicked img {transform:rotate(360deg); transition:transform 1s;}
.sphra a.failed {background-color:#CC1821; transition:background-color .2s;}
.sphra b {float:left; min-width:11em; font-size:100%; font-weight:600}
.sphra b i {display:block; font-style:normal; font-size:75%; font-weight:400}
.sphra .sphra-party, .sphra .sphra-standing {float:left; font-size:108%}
.sphra .sphra-standing {float:right; width:3em; text-align:right; font-weight:800}
.sphra .sphra-zizala {position:relative; float:right; clear:right; width:calc(100% - 3.3em); height:.5em; margin-top:.3em; border-radius:.4em; overflow:hidden; line-height:0; background:#CFDCF1}
.sphra .sphra-zizala .sphra-zizala-value {position:absolute; top:0; left:0; bottom:0; transition:width .2s; background:#1B3E7A;}
.sphra.is-over-voted a:hover {text-decoration:none; color:inherit; background:none; cursor:not-allowed;}

@media all and (max-width:460px){
/*
body {font-size:1.5vw}
.sphra ul li {width:100%}
*/
}