div.hide{display:none;}

#popular-title{
	text-align:left;
	font-weight:500;
	font-size:120%;
	margin:10px;
}
#popular{
	padding-left:10px;
}
.li.point{
	background-image:url(img/point.svg);
}


#title{
	text-align:center;
    	font-size:150%;
	font-weight:500;
	margin-bottom:20px;
}
#block{
	text-align:center;
	border-radius:10px;
	padding:10px;
	background-repeat:no-repeat;
	background-size: 100% 100%;
	background-position: 50% 50%;
	background-image:url(img/ai.jpg);
}

.form_input{
	width:90%;
	max-width:424px;
	height:30px;
	padding:6px;
	padding-left:12px;
	padding-right:12px;
	line-height:24px;
	margin-top:10px;
	margin-bottom:10px;
	border-radius:10px;
	border: 0;
	color:#000;
  	background-color:#fff;
	font-size:16px;
  	font-weight:500;
}


.form_input::placeholder {
  	font-weight:500;
	//color:#fff;
}

.form_input:-webkit-autofill,
.form_input:-webkit-autofill:hover, 
.form_input:-webkit-autofill:focus, 
.form_input:-webkit-autofill:active{
    -webkit-box-shadow: 0 0 0 30px rgba(255,255,255, 1) inset !important;
    	outline: 0;
    	outline-offset: 0;
    	border:0;
    	color:#000;
}
                      

:active, :hover, :focus {
    outline: 0;
    outline-offset: 0;
}
.form_select{
	height:30px;
	width:200px;
	padding:6px;
	border:0;
	border-radius:10px;
	border:2px solid #FFF;
	margin:10px;
}

#buttons{
	margin-top:10px;
	text-align:center;
}


	#go-analys {width:200px}
	#go-analys, #go-clear {
		padding-top:0px;
		padding-bottom:8px;
		text-align:center;
		transition: 1s;
		font-size:150%;
		font-weight:500;
  		background-color:#fff;
		color:#000;
	}
	.disable .form_input, .disable #go-analys, .disable #go-clear{
		//color:#fff;
		background: rgba(255,255,255,0.8);
	}
	#go-analys:hover, #go-clear:hover {
		text-shadow: rgb(0,49,171) 1px 0 10px;
	}
	.disable #go-analys:hover, .disable #go-clear:hover {
		text-shadow: none;
		cursor:auto;
	}


.button.text.red{
	color:rgb(199, 52, 117);
}
#list{
	text-align:center;
}
.li{
	background-image:url(img/paragraf.png);
	background-size:18px;
}
.li.parent{
	background-image:url(img/folder.svg);
}
.li.point{
	background-image:url(img/point.svg);
}
.li .buttons{
	display:none;
}
.li.selected .buttons{
	display:block;
}
#stop-guest{
	text-align:left;
}
#category{
	padding:10px;
	padding-bottom:100px;
}
#history-title{
	margin-top:20px;
	border-top:1px solid grey;
	padding:6px;
	text-align:center;
	color:rgb(199, 52, 117);
	font-weight:500;
}
.li.search{
	background-image:url(img/search.svg);
}

/*************************** LOADER *****************************/

#loader{
	text-align:center;
	font-weight:bold;
	font-size:110%;
}
#loader-img {
  color: #0095ab;
  font-size: 20px;
  margin: 100px auto;
  width: 1em;
  height: 1em;
  border-radius: 50%;
  position: relative;
  text-indent: -9999em;
  -webkit-animation: load4 1.3s infinite linear;
  animation: load4 1.3s infinite linear;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
}
@-webkit-keyframes load4 {
  0%,
  100% {
    box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0;
  }
  12.5% {
    box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
  }
  25% {
    box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
  }
  37.5% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em;
  }
  50% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em;
  }
  62.5% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em;
  }
  75% {
    box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0;
  }
  87.5% {
    box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em;
  }
}
@keyframes load4 {
  0%,
  100% {
    box-shadow: 0 -3em 0 0.2em, 2em -2em 0 0em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 0;
  }
  12.5% {
    box-shadow: 0 -3em 0 0, 2em -2em 0 0.2em, 3em 0 0 0, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
  }
  25% {
    box-shadow: 0 -3em 0 -0.5em, 2em -2em 0 0, 3em 0 0 0.2em, 2em 2em 0 0, 0 3em 0 -1em, -2em 2em 0 -1em, -3em 0 0 -1em, -2em -2em 0 -1em;
  }
  37.5% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 0, 2em 2em 0 0.2em, 0 3em 0 0em, -2em 2em 0 -1em, -3em 0em 0 -1em, -2em -2em 0 -1em;
  }
  50% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 0em, 0 3em 0 0.2em, -2em 2em 0 0, -3em 0em 0 -1em, -2em -2em 0 -1em;
  }
  62.5% {
    box-shadow: 0 -3em 0 -1em, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 0, -2em 2em 0 0.2em, -3em 0 0 0, -2em -2em 0 -1em;
  }
  75% {
    box-shadow: 0em -3em 0 -1em, 2em -2em 0 -1em, 3em 0em 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0.2em, -2em -2em 0 0;
  }
  87.5% {
    box-shadow: 0em -3em 0 0, 2em -2em 0 -1em, 3em 0 0 -1em, 2em 2em 0 -1em, 0 3em 0 -1em, -2em 2em 0 0, -3em 0em 0 0, -2em -2em 0 0.2em;
  }
}

@media screen and (max-width:720px) {
	#back{display:block}
	#night, #light{left:40px;}
	#head{padding-left:100px;}
	#title{
    		font-size:120%;
		font-weight:500;
		max-width:300px;
		margin:auto;
		margin-bottom:10px;
	}
	#go-top{display:block}
	#block{
		background-image:url(img/ai_mob.jpg);
	}

}