@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.9.1/font/bootstrap-icons.css");

* {
	font-family:"JetBrains Mono",sans-serif;
    color: rgba(255, 255, 255, 0.5);
}

body {
	background-image: url(anim_tunnel.gif);
    image-rendering: pixelated;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: 100%;
	background-position: center;
	background-color: black;
    width: 100%;
	margin: 0px;
	padding: 0px;
}


h2 {color: rgba(255, 255, 255, 1);}
h3 {color: rgba(255, 255, 255, 0.75);}

dt {color:  rgba(255, 255, 255, 1);}

hr {height:1px;  border-width:0; background-color:rgb(58, 63, 100); margin: 40px 0px 40px;}


i:hover,a:hover { transition: 0.3s;
          color: rgb(146, 255, 240);
}

::selection { background: rgb(41, 39, 66); color:rgb(191, 220, 247); }
      
/* ion-icon {
    color:'currentColor';
    font-size: 32px;
    padding: 1em 2em 1em;
    position: inherit;
  
  } */



i { color: 'currentColor';
    font-size: 2em; }


.icons ul { list-style-type:none;
            margin: auto;
                       
        }



.icons li {
           display: inline-block;
           text-align: center;
           width: 30%;
         } 
 


#container {
	width:900px;
	margin:10px auto;
	background: rgba(0,0,0,0.7);
	padding: 10px;
    padding-top: 0px;
    background-image: linear-gradient(rgb(0, 0, 0,0.5),rgba(26, 28, 44, 0.5));
}


#box {
        background-color: rgba(26, 28, 44, 0.7);
        border-radius: 8px;
        padding: 8px 26px 8px;
        margin-top: 8px;
}


#box p {
    
    font-size: 0.9em;

}


header,content,footer {
	margin: 10px;
}

/*

#topbar img  {background-image: url(upflow.gif); }
#topbar img:hover { transition: .3s;                   
                    mix-blend-mode: screen;
                    
} */


#header {
        /* position: sticky; */ 
        top: 0;  
        height: 156px;
        background-image:  url("inercia_2022_original.png"),url("upflow.gif");
        background-position: right;
        background-repeat: no-repeat;
        background-size:auto, 40%;  
        background-color: black;
        
             
    }

#header h1:hover {transition: .3s;
                
            }

#header h1 { max-width: 50%;
             padding-top: 4%;            
}



input {
    background: rgba(105, 105, 105, 0.5);
}


.screenshot {
	image-rendering: auto;
}

#menu {
        margin-top: -5px;
        position: sticky;
        top: 0;
        padding: 10px;          
        background-image: linear-gradient(rgb(0, 0, 0), rgba(26, 28, 44, 1),rgba(26, 28, 44, 0.8)); }


#menu ul li{display:inline-block;padding:5px 10px;}
#menu ul li hr{display:none;}

label{
	margin:5px;
	display:block;
}
    
	#livevoteContainer .votes{list-style:none;padding-left:20px}
    #livevoteContainer .votes .vote{display:inline-block;box-sizing:border-box;width:32px;height:32px;padding:5px;text-align:center;margin:3px;background:#eee;cursor:pointer}
    #livevoteContainer .votes .vote.selected{background:#aea}
    #livevoteContainer .votes .vote.loading{outline:red 1px solid}
    
@media screen and (max-device-width : 900px) {
#container{
	width:100%;
	margin:0
}
}
    
	#livevoteContainer .votes .vote.loading{background-image:url(data:image/gif;base64,R0lGODlhEAAQAPQAAP///wAAAPj4+Dg4OISEhAYGBiYmJtbW1qioqBYWFnZ2dmZmZuTk5JiYmMbGxkhISFZWVgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh/hpDcmVhdGVkIHdpdGggYWpheGxvYWQuaW5mbwAh+QQJCgAAACwAAAAAEAAQAAAFUCAgjmRpnqUwFGwhKoRgqq2YFMaRGjWA8AbZiIBbjQQ8AmmFUJEQhQGJhaKOrCksgEla+KIkYvC6SJKQOISoNSYdeIk1ayA8ExTyeR3F749CACH5BAkKAAAALAAAAAAQABAAAAVoICCKR9KMaCoaxeCoqEAkRX3AwMHWxQIIjJSAZWgUEgzBwCBAEQpMwIDwY1FHgwJCtOW2UDWYIDyqNVVkUbYr6CK+o2eUMKgWrqKhj0FrEM8jQQALPFA3MAc8CQSAMA5ZBjgqDQmHIyEAIfkECQoAAAAsAAAAABAAEAAABWAgII4j85Ao2hRIKgrEUBQJLaSHMe8zgQo6Q8sxS7RIhILhBkgumCTZsXkACBC+0cwF2GoLLoFXREDcDlkAojBICRaFLDCOQtQKjmsQSubtDFU/NXcDBHwkaw1cKQ8MiyEAIfkECQoAAAAsAAAAABAAEAAABVIgII5kaZ6AIJQCMRTFQKiDQx4GrBfGa4uCnAEhQuRgPwCBtwK+kCNFgjh6QlFYgGO7baJ2CxIioSDpwqNggWCGDVVGphly3BkOpXDrKfNm/4AhACH5BAkKAAAALAAAAAAQABAAAAVgICCOZGmeqEAMRTEQwskYbV0Yx7kYSIzQhtgoBxCKBDQCIOcoLBimRiFhSABYU5gIgW01pLUBYkRItAYAqrlhYiwKjiWAcDMWY8QjsCf4DewiBzQ2N1AmKlgvgCiMjSQhACH5BAkKAAAALAAAAAAQABAAAAVfICCOZGmeqEgUxUAIpkA0AMKyxkEiSZEIsJqhYAg+boUFSTAkiBiNHks3sg1ILAfBiS10gyqCg0UaFBCkwy3RYKiIYMAC+RAxiQgYsJdAjw5DN2gILzEEZgVcKYuMJiEAOwAAAAAAAAAAAA==) no-repeat;color:#888}
    
	.entry{float:left;height:220px;width:250px;margin-right:20px}
    
	#votesubmit,#votingform h3{clear:both}
    
	#footer {text-align: center;}
	#visitors td:nth-child(2){font-weight:700}
    
	.success{color:green;padding:20px;border:2px solid green}
    
	.failure,.error{color:red;padding:20px;border:2px solid red}    

@media (max-width: 599px) {

    h2 {font-size: 1.4em;}
    
    #header {   height: auto;
                background-image: url("inercia_2022_mobile.png"),url("upflow.gif");
                background-position-y: top;
                font-size: 0.6em;
                font-weight: 800;
            }
    
     #header h1 {   max-width: 50%;
                    padding-top: 0%;
                }
    
    #menu { padding: 5px; }         
            
            
    #menu ul li{display:inline-block;padding:5px 5px;}


}