@import url('https://fonts.googleapis.com/css?family=Baloo&subset=latin-ext');
@import url('https://fonts.googleapis.com/css?family=Ubuntu:400,400i,700&subset=latin-ext');

*, *:before, *:after {
    -webkit-box-sizing: border-box;  box-sizing: border-box; }
    
html { }
body { background-image: url('../images/bg.png'), url('../images/bg_blue.png'); background-repeat: no-repeat, repeat-y; background-position: center top, center 1200px; }
.page { width:100%; max-width:1420px; margin: 0 auto; padding: 40px 160px;}
.logo { display: block; margin: 0 auto;}
h1 { font-family: 'Baloo'; font-size:72px; color: #fff; text-align: center; margin: 50px 0; text-shadow: 5px 5px 10px #009ba4;}
.input__wrapper {max-width:800px; margin:0 auto; position: relative;}
.immybox {height:80px;  width:100%;  border-radius: 40px; text-align: center; font-family: 'Ubuntu'; font-style: italic; font-size: 36px; line-height:80px; text-align: center; margin: 0  auto; border:0; display: block; padding: 0 120px 0 30px;}
.immybox_results { border:0; }
.section { margin: 50px auto; display: none;}
.section.active { display: block; }
.info {text-align: center; color:#5d5d5d; font-size:20px; line-height:30px; margin: 70px 0 0; font-family:'Ubuntu'; }
.rel { position: relative; }
.search {-webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;
	 position: absolute; top:1px; right:1px; width:80px; height:78px; background:url('../images/search.png') no-repeat center center #fafafa;  background-size: 60% auto; display: block; cursor:pointer;
  border-top-right-radius: 50%; border-bottom-right-radius: 50%; -webkit-border-top-right-radius: 50%; -webkit-border-bottom-right-radius: 50%;
}
.search.active {background-color: #86f4fa; }
#section-intro img {margin: 0 0 0 60px; display: block; max-width:100%; height: auto; }
#section-result { width:100%; max-width: 700px; background: #fff; padding:30px 50px 5px; border-radius: 30px; -webkit-border-radius: 30px;}

.ac { text-align: center; }
.ib { display: inline-block; }

.shop { padding: 0 0 40px 145px; background: url('../images/shop_icon.png') no-repeat 0 20px; }
.shop__content { background: #fafeff; padding: 25px; min-height: 70px; font-size: 18px; line-height:30px; font-family:'Ubuntu'; color: #5d5d5d; }
.form {width: 300px;	background: rgba(255,255,255,0.5);	border:2px solid #fff;	padding: 30px;	margin: 100px auto 20px;}
.form .label {font-size: 12px; 	font-family: 'Ubuntu';	padding: 0 0 10px;}
.form .input {	width:240px;	height:30px;	border:0;	margin: 0 0 25px;	padding: 0 20px;	font-family: 'Ubuntu';	background: #fff;	line-height:30px;	font-size:12px;}

.custom-file-upload {	white-space: nowrap; overflow: hidden;}

input[type="file"] { display: none; }

.custom-file-upload {display: inline-block; cursor: pointer; }

.form .submit {	display: block; 	background: #000; 	color: #fff; 	font-family: 'Ubuntu';   line-height:25px;   font-size:14px;  width:80px; text-align: center; margin: 0 auto; border:0;}


@media screen and (max-width: 1100px) {
	body {background: #86f4fa;}
	.page {padding: 40px; }
	#section-intro img {max-width:90%; margin: 0;}
	.info {font-size:17px;}
}

@media screen and (max-width: 750px) {
	 h1 { font-size:50px;}
	 .page {padding: 30px 15px;}
	.immybox { height: 60px; font-size: 20px; padding:0 80px 0 20px;}
	.search { height: 58px; width:60px;}
	 #section-intro img {max-width:100%;}
	 .info {font-size:15px; line-height: 25px;}
	 #section-result {padding: 30px 30px 5px;}
	 .shop { padding: 0 0 40px 70px; background-size: 50px auto;}
	 .shop__content {font-size:16px;}
}

@media screen and (max-width: 450px) {
	.immybox { height: 45px; font-size: 15px; padding:0 60px 0 20px;}
  .search { height: 43px; width:45px;}
  #section-result {padding: 30px 15px 15px;}
  .shop { padding: 0 0 25px; background:none;}
  .shop__content {font-size:14px; padding: 15px;}
}
