	.hide{display:none;}
	.red{color:rgb(199,52,117);}




	#header{height:100px;}

	#header .tool{top:15px;}
	
	#logo {display:none}
	#menu_mob {display:none}

  	.guest #auth.tool{
		top:22px;
	}


	#head{
		padding-top:10px;
	}



	#search-form{
		max-width:600px;
		background-color:rgba(255,255,255,0);
	}
	#input-bar{
		margin-bottom:0;
		padding-top:6px;
		padding-left:10px;
		padding-right:10px;
		//border-bottom:1px solid grey;
	}

	#search-form input{
		height:25px;
		background-color:rgba(255,255,255,0);
		color:#000;
		font-size:16px;
		font-weight:500;
		border-bottom:1px solid rgb(40,40,40);
	}


	#search-form input:focus{
		border-bottom:2px solid rgb(40,40,40);
	}

	#search-form input::placeholder{
		color:rgb(40,40,40);
		font-size:14px;
		font-weight:400;
		text-align:center;
	}

	#search-clear{
	        position:relative;
		top:8px;
		right:20px;
		width:20px;
		height:20px;
		background-size:20px 20px;
		background-image:url(img/close.svg);
		background-color:rgba(255,255,255,0);
	}
	#buttons{
		text-align:center;
		margin-top:10px;
		margin-bottom:4px;
	}
	#buttons .item{
		padding:6px; 
		padding-left:40px;
		margin:0;
		margin-left:10px; 
		margin-right:10px; 
		font-size:16px;
		font-weight:600;
		color:rgb(40,40,40);                           
		background-position:4px 2px ;
		background-size:30px 30px ;
		cursor:auto;
 		}
	#search-form.active #buttons .item{
 		box-shadow: 0 3px 1px -2px rgba(0, 0, 0, .2), 0 2px 2px 0 rgba(0, 0, 0, .14), 0 1px 5px 0 rgba(0, 0, 0, .12);
	}
	#search-form.active #buttons .item:hover{
		cursor:pointer;
		background-color:rgba(255,255,255,1);
	}

	#global-go {position:static; background-image:url(img/search.svg); }
	#global-go::before {content:"ÏÎØÓÊ ÄÎÊÓÌÅÍÒ²Â" }


	#gps-go{background-image:url(img/school.svg);}
	#gps-go::before { content:"ÀÍÀË²Ç ÏÐÀÊÒÈÊÈ" }

	#search-prompt {top:100px}
	#search-prompt .line{padding-left:10px; background-size:0}

       	#page{top:90px;}


	#content{padding:10px; margin-left:20px;}


 	#message{          
		margin:10px;
		text-align:right;
	}
	#message a{
		text-decoration:none;
		color:rgb(63,63,63);
		font-weight:500;
	}
	#message a:hover{
		cursor:pointer;
		cursor:hand;
		text-decoration:underline;
		color:rgb(0,149,171);
	}

 	#warning{
		background-color:rgb(255, 255, 200);
		padding:10px;
		padding-right:40px;
		background-image:url(img/close.svg);
		background-repeat:no-repeat;
		background-size: 24px;
		background-position: right 6px top 6px;
		margin-bottom:10px;
	}


   	#blocks{
		width:100%;
        	max-width:840px;
		margin:auto;
		margin-top:10px;
		margin-bottom:20px;
	}

	.block{
		margin-bottom:10px;
		border-radius:10px;
		background-repeat:no-repeat;
		background-image:url(img/circle-231.png), url(img/circle-231.png);
		background-position:12px 12px, 4px 4px;
		background-size:24px 24px, 40px 40px;
		box-shadow: 0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12);
	}


	.block-title{
		padding-left:50px;
		padding-right:50px;
		padding-top:10px;
		height:40px;
		font-size:18px;
		font-weight:500;
	}
	.block-content{
		padding-left:40px;
		padding-bottom:10px;
		margin-bottom:10px;
	}
 	.block.selected .block-content{
		display:block;
	}

	.block-item{
		display:inline-block;
		vertical-align:top;
		width:240px;
		height:20px;
		padding:0;
		margin:0;
		margin-bottom:10px;
		margin-left:10px;
		background-size:0;
		font-weight:500;
		color:#2d2d2d;
	}

	.block-item.guest {color:#808080;}

	.night .block-item{
		color:#fff;
	}

	.block-item:hover{
		cursor:pointer;
		cursor:hand;
		text-decoration:underline;
		color:rgb(0,149,171);
	}

	.block-item.visited .extra{
		display:none;
	}

	#recent{
  		width:100%;
      		max-width:840px;
		margin:auto;
		border-radius:10px;
		box-shadow: 0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12);
	}
	#recent-title{
		margin-bottom:10px;
		height:40px;
		padding-left:50px;
		padding-top:10px;
		color:rgb(199, 52, 117);
		font-weight:500;
		font-size:18px;
		background-repeat:no-repeat;
		background-position:4px 4px;
		background-size:40px;
		background-image:url(img-blocks/history.png);	
	}		
	#recent-content{
		padding-left:10px;
		padding-right:10px;
	}

	.test, .about{
		text-align:left;
	}

@media screen and (max-width:880px){
                                             
	#global-go::before {	content:"ÏÎØÓÊ" }
	#gps-go::before { content:"ÀÍÀË²Ç" }
	
}



@media screen and (max-width:720px){	
        

	#header{height:140px;}
	
	#logo{display:block; left:100px; top:0px; height:45px}

	#menu_mob {
		display:block;
		background-image:url(img/menu.svg);	
	}

	#about {display:none}


	#header .tool{top:0px;}

	.guest #auth.tool{
		top:6px;
	}

	#head{padding:10px; padding-top:50px;}

	#search-prompt {top:140px; left:10px}

	#night, #light{left:100px;top:0}

	#container{top:45px; padding:10px; margin-left:0px;}
	#content{margin:0px;}

	.block-title{
		background-repeat:no-repeat;
		background-position:100% 12px;
		background-size:24px;
		background-image:url(img/down.svg) ;
	}
	.night .block-title{
		background-image:url(img/down_w.svg) ;
	}
	.selected .block-title{
		background-image:url(img/up.svg) ;
	}
	.night .selected .block-title{
		background-image:url(img/up_w.svg) ;
	}
	.block-content{
		display:none;
	}
}	               `

