@import url('https://fonts.googleapis.com/css?family=Montserrat:400,700,900&subset=cyrillic,latin-ext');

HTML, BODY 
{
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
}

body{
	font-weight:400;
	background: #FFEFBA;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to right, #FFFFFF, #FFEFBA);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to right, #FFFFFF, #FFEFBA); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
	background: #d1ffe7;  /* fallback for old browsers */
	background: -webkit-linear-gradient(to right, #FAFFD1, #d1ffe7);  /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to right, #FAFFD1, #d1ffe7); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
	background: #45636f;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#45636f+0,535d84+100 */
background: rgb(69,99,111); /* Old browsers */
background: -moz-linear-gradient(top, rgba(69,99,111,1) 0%, rgba(83,93,132,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(69,99,111,1) 0%,rgba(83,93,132,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(69,99,111,1) 0%,rgba(83,93,132,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45636f', endColorstr='#535d84',GradientType=0 ); /* IE6-9 */

/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#45636f+0,61848e+100 */
background: rgb(69,99,111); /* Old browsers */
background: -moz-linear-gradient(top, rgba(69,99,111,1) 0%, rgba(97,132,142,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(69,99,111,1) 0%,rgba(97,132,142,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(69,99,111,1) 0%,rgba(97,132,142,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45636f', endColorstr='#61848e',GradientType=0 ); /* IE6-9 */

}

*{font-family: 'Montserrat', sans-serif;}

.form
{
	
}

.form_field
{
	width: 350px;
}

.form TEXTAREA
{
	width: 350px;
	height: 75px;
}

.form LABEL
{
	display: block;
	font-weight: bold;
	margin-top: 10px;
}

.error
{
	color: red;
}

h1{font-size: 30px;font-weight:900;color: #ffffff54;padding: 0 20px;}

.success
{
	color: green;
}

TH
{
	padding: 5px;
	text-align: center;
}

TD
{
	padding: 5px;
}

A
{
	color: #094794;
	font-weight: bold;
}

.navigator_block
{
	padding: 5px;
}

.navigator_block .active
{
	background-color: #094794;
	color: white;
}

.navigator_block H1
{
	display: inline;
	margin-right: 5px;
	padding: 0 7px;
	font-size: 24px;
}

.navigator_block H1 A
{
	text-decoration: none;
}

.translate_result
{
	padding-top: 7px;
	font-size: 1.6em;
	width: 650px;
}

.font_italic
{
	font-style: italic;
}

.font_bold
{
	font-weight: bold;
}



.dict-wrap{/* width:85%; */margin: 0 auto;padding: 100px 0 0 0;}

.source_word{font-weight:bold;font-size:25px;padding:25px 0 10px 10px;color: #fff;padding: 20px 20px 0 20px;}
.translate_word{color: #cae0ec;padding-left:10px;/* min-width: 999px; */padding: 0 20px;}



.dict-inputs{
	position:relative;
	z-index: 10000;
	padding: 0 20px;
	}
.dic_area{
	/* margin-top:30px; */
	width: 75%;
	/* padding: 0 20px 20px 20px; */
	/* background: #ffffff78; */
	/* border: 2px solid #fff; */
	border-radius: 20px;
	box-sizing: border-box;
}


.suggest_area{background-color:#f0f0f0;font-size:14px;border-radius: 20px 20px 5px 5px;background: #fff;border: 2px solid #ddd;padding-top: 45px;margin-top: -40px;box-sizing: border-box;}
.suggest_area div{padding-left:10px !important}
.suggest_word_active{background-color:#e2eaef}

.suggest_word_active{font-weight:bold}

.dict-no-result{padding:55px 0 0 15px}

input.input_field {
	margin:0;
	border: 1px solid #ccc;
	/*width: 300px;*/
	border-radius: 4px;
	text-indent: 5px;
	padding: 8px 12px;
	vertical-align: baseline;
	width: 75%;
	font-size:18px;
	float:left;
	box-shadow:none;
	-webkit-box-shadow:none;
	padding-left: 20px;
	padding-right: 20px;
	/* background: #EAEAEA; */
	-moz-border-radius: 20px;
	-webkit-border-radius: 20px;
	border-radius: 30px;
	box-sizing: border-box;
	font-size: 17px;
	box-shadow: none;
	height: 46px;
	border: solid 3px #b6d8d8;
	outline:none;
}


input.input_field:hover {
border: 3px solid #d8d8d8;
outline: 0;
background: #fff;
box-shadow:none;
	-webkit-box-shadow:none;
	transition: all 0.2s ease-in-out;
	-webkit-transition: all 200ms ease-in-out;
	   -moz-transition: all 200ms ease-in-out;
	     -o-transition: all 200ms ease-in-out
}
input.input_field:active, input.input_field:focus {
	border: 3px solid #55a8ef;
	transition: all 0.2s ease-in-out;
	-webkit-transition: all 200ms ease-in-out;
	-moz-transition: all 200ms ease-in-out;
	-o-transition: all 200ms ease-in-out;
}

input.go_button {
	display:inline-block;
	color: #fff;
	text-indent: 0;
	line-height: 46px;
	height: 46px;
	width: auto;
	border:none;
	margin:0 0 0 10px;
	border-radius:5px;
	padding:0 30px;
	font-size: 17px;
	font-weight:bold;
	color:#fff;
	cursor:pointer;
	background: #888;
	float:left;
	background: #2ECC71;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	-moz-box-shadow: inset 0 -3px 0 0 #029A43;
	-webkit-box-shadow: inset 0 -3px 0 0 #029A43;
	box-shadow: inset 0 -3px 0 0 #029A43;
	transition: all 0.2s ease-in-out;
	-webkit-transition: all 100ms ease-in-out;
	-moz-transition: all 100ms ease-in-out;
	-o-transition: all 100ms ease-in-out;
	outline: none;
}

input.go_button:hover{
	opacity: 0.9;}

input.go_button:active{
			-moz-box-shadow: inset 0px 3px 0px 0px #08843d;
			-webkit-box-shadow: inset 0px 3px 0px 0px #08843d;
			box-shadow: inset 0px 3px 0px 0px #08843d;
			background: #29b564;
}
		 
.no-result{font-size:17px; padding:40px 0 0 15px; font-weight: bold;}
		 
.clear{clear:both; margin:0; padding:0; height:0; line-height:0; font-size:1px}

@media only screen and (max-width: 767px){
	input.go_button{display:none;}
	input.input_field{width:100%}
}