@import url(https://fonts.googleapis.com/css?family=Allan:400,700);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700);
/*Reset*/
* {
    margin: 0;
    padding: 0;
    outline: 0;
    font-size: 100%;
    font-family: inherit;
    vertical-align: baseline;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    ?overflow-x: hidden;
}
*, *:after, *:before {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}
body{
 background-size: 100% 100%;
 background-repeat: no-repeat;
 font-family: "Open Sans";
 height:100%;
 }
body>div{
 background:rgba(0,0,0,0.2);
 width:100%;
 height:100%;
 }

#container{
 background:#000;
 width:800px;
 position:absolute;
 text-align:center;
 top:50%;
 left:50%;
 margin-left:-400px;
 margin-top:-250px;
 z-index:1000;
 padding:20px;
 color:#fff;
 font-size: 1.15em;
 line-height: 1.5;
 border:1px solid #162a53;
 }
#container h1{
 font-size:1.4em;
 margin-bottom: 10px;
 }
#container p{
 font-size:0.6em;
 }
#container a{
 margin: 20px;
 margin-top: 35px;
 display:block;
 text-align:center;
 padding:8px 14px;
 border:2px solid #162a53;
 text-decoration:none;
 background:#2f8aeb;
 font-size:2em;
 border-radius: 8px;
 font-weight:bold;
 color:#fff;
 }
#container a:hover{
 background:#6ab7d6;

 }
#container p.alert{
 font-size: 1.45em;
 }
@media screen and (max-width: 680px){
	body{
	 background-size: auto;
	 background: #000!important;
   /*background-position: center center !important;*/ 
	 }
	body>div{
	  background:rgba(0,0,0,0.7);
	 width:100%;
	 height:100%;
	 }
  #container{
   background:transparent;

	 width:auto;
   margin:0px;
   font-size: 1em;
   border:0;
	 top:0;
	 left:0;
	 padding-top:30%;
	 height:100%;
  }
 }
@media screen and (max-width: 440px){
  #container{
   font-size: 0.75em;
   padding:10%;
	 margin-top:0;
	 padding-top:17%;
  }
	#container a{
   font-size: 1.8em;
 	}
 	#container p{
   font-size: 1em;
 	}
 #scrollerwrap{
	display:none;
	}
 #tags{
  display:none;
  }

 }
@media screen and (max-width: 320px){
  #container{
   font-size: 0.7em;
      padding:5%;
	 padding-top:20%;
  }
 }

#scrollerwrap{
 position:fixed;
 bottom:0;
 width:100%;
 height:40px;
 z-index:1000;
 text-align:center;
 font-family:Open Sans;
 font-size:0.8em;
 background:rgba(0,0,0,0.4);
 }
#scroller{
 max-width:1200px;
 margin:0 auto;
 padding-top:3px;
 }
#scroller {
 max-width:1200px;
 height: 164px;
 overflow: hidden;
 }
#carousel{
 position:relative;
 margin:0 auto;
 }
#carousel a{
 width:180px !important;
 float:left !important;
 margin:4px 10px;
 }
#carousel a{
 display:inline-block;
 padding:4px 0;
 text-align:center;
 color:#fff;
 text-decoration:none;
 }
#scrollerwrap a:hover{
 text-decoration:underline;
 }
#scroller>span{
 position:relative;
 color:#ffffff8c;
 }
#scroller>span a{
 color:#ffffff8c;
 }
#scroller>span a:hover{
 text-decoration:none;
 }
#tags{
 background:rgba(0,0,0,0.4);
 font-size:0.8em;
 width:100%;
 }

#tags ul{
 list-style-type:none;
 text-align:center;
 }
#tags ul li{
 display:inline-block;
 padding:4px;
 }
#tags ul li a{
 color:#fff;
 text-decoration:none;
 }
#tags ul li a:hover{
 text-decoration:underline;
 }