  body,
  html {
  	width: 100%;
  	height: 100%;
  	margin: 0;
  	padding: 0;
  	font-family: sans-serif;
  	color: #94a6ba;
  }
#loading{ font-size:25px; color: #000; text-align: center; padding-top:40%; display:none}
#loading p{margin-top: 10px;}
.spinner{text-align: center; width: 150px; margin: 0 auto;}
.spinner>div{ background-color: #2b2b2b; width: 30px; height: 30px; border-radius: 50%; 
display: inline-block; 
-webkit-animation: bouncedelay 1.0s infinite ease-in-out;
 animation: bouncedelay 1.0s infinite ease-in-out;
 }
.spinner .bounce1{
	-webkit-animation-delay: -.32s; 
animation-delay: -.32s;
}
.spinner .bounce2{
	 -webkit-animation-delay: -.16s; 
	 animation-delay: -.16s;
	 }
@-webkit-keyframes bouncedelay {
  0%, 80%, 100% { 
  -webkit-transform: scale3d(.73,.73,1); 
  background-color: #2b2b2b;
  }
  40% { 
  -webkit-transform: scale3d(1,1,1);
   background-color: #d82b27;
   }
}
@keyframes bouncedelay {
  0%, 80%, 100% { 
    transform: scale3d(.73,.73,1);
    -webkit-transform: scale3d(.73,.73,1);
     background-color: #2b2b2b;
  } 
  40% { 
    transform: scale3d(1,1,1);
    -webkit-transform: scale3d(1,1,1);
    background-color: #d82b27;
  }
}
  .main-wrap{
  	display:block;
  }			
  .head-container{
  	margin-top: 10px;
  	color: #00adc1;
  	display: -webkit-box;
  	height: 60px;
	padding:0 5px;
  }
  .head-img {
    height: 60px;
    width: auto;
  	margin-right: 10px;
  }
  .head-title-wrap{
  	-webkit-box-flex:1;
  }


  .head-title strong {	
  	font-size: 22px;
  }
  .head-desc {
  	margin-left: 0px;
  }
      
  .head-change{
	display: block;
	width: 60px;
	margin: 0 3px;
  }
  
  .btn-container {
  	margin-top: 20px;
  	width: 100%;
  	display: table;
  	position: relative;
  }
  .col-xs-3 {
  	width: 25%;
  	float: left;
  	text-align: center;
  }
  .btn-item img {
  	width: 95%;
  }
  .btn-active{
  	width: 95%;
  	height: 3px;
  	background-color: #00ADC1;
  	position: relative;
  	left: 2.5%;
  	top: 2px;
  }
  .no-active{
  	width: 99%;
  	border: none;
  	height: 1px;
  	background-color: #94a6ba;
  }
    .active-today{
  	background-color: #00ADC1;
  	display:none;
  }
  
  .active-tomorrow{
  	background-color: #9BC53F;
  	display:none;
  }
  .active-week{
   	background-color: #F2A91C;
  	display:none; 	
  }
  .active-month{
    background-color: #F87C4B;
  	display:none; 		
  }
  /* alert */
 .alert-containner{
	display: none;
}
.mask-elert{
	position: fixed;
	left: 0;
	top: 0;
	width: 100%; 
	height: 100%;
	background-color: #000;
	opacity: 0.8;
	text-align: center;
	z-index: 100;
	
}

.alert-main{
	position: absolute;
	top: 20%;
	width: 90%;
	left: 5%;
	min-height: 30%;
	z-index: 200;
	background-color: #fff;
	
}

.alert-head{
	width: 100%;
	height: 40px;
	line-height: 40px;
	background-color: #F2A91C;
	color: #fff;
	z-index: 200;
	text-align: center;
}
.alert-content{
	width: 90%;
	margin: auto;
	padding: 10% 5%;
	color: #B4B3B3;
	text-align: center;
}

.alert-btn{
	width: 60%;
	margin: auto;
	color: #fff;
	background-color: #F2A91C;
	text-align: center;
	height: 30px;
	line-height: 30px;
}
