@charset "UTF-8";
/*
	Проект: Travel Online.RU
	Веб-разработчик: Андрей Литвинов (FRO1D) - http://f-test.ru/works/
	Дата: 22.03.2017
	Версия: 1.0
*/

/**************** RESET *****************/

html, body, div, span, h1, h2, h3, h4, h5, h6, a, p, img, ol, ul, li,
form, input, button, textarea, label, fieldset, legend, blockquote,
table, caption, tbody, tfoot, thead, tr, th, td, sub, sup, object, iframe  {
	vertical-align: baseline;
	font-size: 100%;
	font: inherit;
	border: 0;
	padding: 0;
	margin: 0;
}
*:focus {outline: 0;}
b, strong {font-weight: 700;}
i, em {font-style: italic;}
li {list-style: none;}
table {border-spacing: 0; border-collapse: collapse;}
th, td {text-align: center; vertical-align: middle;}
a, [type="submit"], [type="button"], [type="reset"], [type="file"], label, select, button, ::-webkit-file-upload-button {cursor: pointer;}
a {color: inherit; text-decoration: none;}
textarea {resize: none; overflow: auto;}
label {display: block;}
sup {vertical-align: super; font-size: 0.7em; line-height: 0;}
sub {vertical-align: sub; font-size: 0.7em; line-height: 0;}
aside, header, footer, article, section, nav {display: block; vertical-align: baseline; font-size: 100%; font: inherit; border: 0; padding: 0; margin: 0;}
html {-webkit-text-size-adjust: none;}
input:not([type="checkbox"]):not([type="radio"]) {-webkit-appearance: none;}
*, *:before, *:after {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
iframe {display: block; position: relative;}


/**************** FONTS *****************/

@font-face {
	font-family: 'Gotham';
	src: url('../fonts/gothaproreg_0.eot');
	src: url('../fonts/gothaproreg_0.eot?#iefix') format('embedded-opentype'),
		 url('../fonts/gothaproreg_0.woff') format('woff'),
		 url('../fonts/gothaproreg_0.ttf') format('truetype'),
		 url('../fonts/gothaproreg_0.svg') format('svg');
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: 'Gotham';
	src: url('../fonts/gothaproita_0.eot');
	src: url('../fonts/gothaproita_0.eot?#iefix') format('embedded-opentype'),
		 url('../fonts/gothaproita_0.woff') format('woff'),
		 url('../fonts/gothaproita_0.ttf') format('truetype'),
		 url('../fonts/gothaproita_0.svg') format('svg');
	font-weight: 400;
	font-style:  italic;
}

@font-face {
	font-family: 'Gotham';
	src: url('../fonts/gothaprobol_0.eot');
	src: url('../fonts/gothaprobol_0.eot?#iefix') format('embedded-opentype'),
		 url('../fonts/gothaprobol_0.woff') format('woff'),
		 url('../fonts/gothaprobol_0.ttf') format('truetype'),
		 url('../fonts/gothaprobol_0.svg') format('svg');
	font-weight: 700;
	font-style: normal;
}

@font-face {
	font-family: 'Gotham';
	src: url('../fonts/gothaprobolita_0.eot');
	src: url('../fonts/gothaprobolita_0.eot?#iefix') format('embedded-opentype'),
		 url('../fonts/gothaprobolita_0.woff') format('woff'),
		 url('../fonts/gothaprobolita_0.ttf') format('truetype'),
		 url('../fonts/gothaprobolita_0.svg') format('svg');
	font-weight: 700;
	font-style:  italic;
}

@font-face {
	font-family: 'Muller';
	src: url('../fonts/mullerthin.eot');
	src: url('../fonts/mullerthin.eot?#iefix') format('embedded-opentype'),
		 url('../fonts/mullerthin.woff') format('woff'),
		 url('../fonts/mullerthin.ttf') format('truetype'),
		 url('../fonts/mullerthin.svg') format('svg');
	font-weight: 100;
	font-style: normal;
}

@font-face {
	font-family: 'Muller';
	src: url('../fonts/mullerblack.eot');
	src: url('../fonts/mullerblack.eot?#iefix') format('embedded-opentype'),
		 url('../fonts/mullerblack.woff') format('woff'),
		 url('../fonts/mullerblack.ttf') format('truetype'),
		 url('../fonts/mullerblack.svg') format('svg');
	font-weight: 900;
	font-style: normal;
}


/***************** MAIN COLORS *******************/
/*-----------------------------------------------*/
/*      NAME    ***   HEX    ***       RGB       */
/*-----------------------------------------------*/
/*   red        ***  ed5456  ***    237,84,86    */
/*   blue       ***  3642ae  ***    54,66,174    */
/*-----------------------------------------------*/


/**************** ANIMATIONS *****************/

/*------ Shake ------*/
@-webkit-keyframes shake-horizontal {25%{-webkit-transform: translateX(2px);}50%{-webkit-transform: translateX(0);}75%{-webkit-transform: translateX(-2px);}100%{-webkit-transform: translateX(0);}}
@-moz-keyframes shake-horizontal {25%{-moz-transform: translateX(2px);}50%{-moz-transform: translateX(0);}75%{-moz-transform: translateX(-2px);}100%{-moz-transform: translateX(0);}}
@-ms-keyframes shake-horizontal {25%{-ms-transform: translateX(2px);}50%{-ms-transform: translateX(0);}75%{-ms-transform: translateX(-2px);}100%{-ms-transform: translateX(0);}}
@-o-keyframes shake-horizontal {25%{-o-transform: translateX(2px);}50%{-o-transform: translateX(0);}75%{-o-transform: translateX(-2px);}100%{-o-transform: translateX(0);}}
@keyframes shake-horizontal {25%{transform: translateX(2px);}50%{transform: translateX(0);}75%{transform: translateX(-2px);}100%{transform: translateX(0);}}

/*------ Blink ------*/
@-webkit-keyframes blink {0%{opacity: 0;}50%{opacity: 1;}100%{opacity: 0;}}
@-moz-keyframes blink {0%{opacity: 0;}50%{opacity: 1;}100%{opacity: 0;}}
@-ms-keyframes blink {0%{opacity: 0;}50%{opacity: 1;}100%{opacity: 0;}}
@-o-keyframes blink {0%{opacity: 0;}50%{opacity: 1;}100%{opacity: 0;}}
@keyframes blink {0%{opacity: 0;}50%{opacity: 1;}100%{opacity: 0;}}


/**************** GLOBAL *****************/

html, body {overflow-x: hidden;}
html {background: #fff; font: 14px/18px Gotham; color: #333;}
#global_wrapper {position: relative; overflow: hidden;}
#global_wrapper:before {content:''; display: block; width: 100%; height: 0; position: fixed; top: 0;}
		.wrapper {display: block; max-width: 1140px; min-width: 320px; margin: auto; position: relative;}

::-moz-selection {background: #ed5456; color: #fff;}
::selection {background: #ed5456; color: #fff;}


	/*------ Classes  ------*/
	
	/* Markup */
	.clear {clear: both;}
	.table {display: table; width: 100%; height: 100%;}
		.cell {display: table-cell; width: 100%; height: 100%; vertical-align: middle;}
	.justify {text-align: justify; line-height: 0; position: relative;}
		.justify:after {content:''; display: inline-block; width: 100%; height: 0;}
	.ellipsis {overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
	.unselectable {-webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
	
	/* Animation */
	.transition {-webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s;}
		.transition:before, .transition:after {-webkit-transition: inherit; -moz-transition: inherit; -ms-transition: inherit; -o-transition: inherit; transition: inherit;}
	
	/* Underline */
	.underline {display: inline-block; position: relative;}
	.underline:after {content:''; display: block; width: 0; height: 1px; background: #333; margin: auto; position: absolute; left: 0; right: 0; bottom: 0; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s;}
		.underline:hover:after {width: 100%;}
	.underlined {display: inline-block; border-bottom: 1px solid;}
		.underlined:hover {border-bottom-color: transparent;}
	
	/* Lightbox */
	.f_lightbox {display: inline-block; vertical-align: top; position: relative; overflow: hidden;}
		.f_lightbox img {display: block; width: 100%; height: 100%;}
		.f_lightbox .overlay {display: block; width: 100%; height: 100%; background: rgba(0,0,0,0.7); margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0; opacity: 0; visibility: hidden;}
			.f_lightbox .overlay:after {content:'+'; display: block; width: 46px; height: 46px; border: 3px solid #fff; border-radius: 50%; font: 36px/40px Arial; color: #fff; text-align: center; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0; -webkit-transform: scale(3); -moz-transform: scale(3); -ms-transform: scale(3); -o-transform: scale(3); transform: scale(3);}
	.f_lightbox:hover {}
		.f_lightbox:hover .overlay {opacity: 1; visibility: visible;}
			.f_lightbox:hover .overlay:after {-webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1);  -o-transform: scale(1); transform: scale(1);}
	
	/* Graphics */
	.icon {display: block; background: url(../images/icons.png) -9999px 0 no-repeat; position: relative;}
	.logo {display: block; width: 220px; height: 75px; background: url(../images/logo.png) no-repeat; -webkit-background-size: cover; background-size: cover; position: relative;}
	
	/* Links */
	.phone {display: inline-block; position: relative;}
		.phone:hover {color: #ed5456 !important;}
		.phone:active {color: #f00 !important;}
	
	/* Other */
	.draggable {cursor: url(data:image/gif;base64,R0lGODlhEAAQAJECAP///wAAAP///wAAACH5BAEAAAIALAAAAAAQABAAAAI0lC8RyLkBgFoMSotrVHsnhHWXdISS+DzRimIWy3Ii7CU0Tdn3mr93bvDBgMFfozg86mKHAgA7), move;}
	.break_line {display: block;}
	
	
	/*------ Headers  ------*/
	h1, h2, h3, h4, h5, h6 {text-align: center;}
	.pre_header {font: 700 14px/18px Gotham; text-align: center; text-transform: uppercase; letter-spacing: 6.5px; margin-bottom: 15px;}
	h2 {font: 900 50px/55px Muller; text-transform: uppercase; margin-bottom: 40px;}
	
	
	/*------ Buttons  ------*/
	.button {
		display: block; width: 100%; height: 80px; background: #ed5456; box-shadow: 160px 0 160px rgba(255,255,255,0.3) inset, 0 2px 0 rgba(255,255,255,0.3) inset; border-radius: 6px; font: 700 16px/80px Gotham; color: #fff; text-align: center; text-transform: uppercase; letter-spacing: 1px; position: relative;
		-webkit-transition: all 1s ease 0s; -moz-transition: all 1s ease 0s; -ms-transition: all 1s ease 0s; -o-transition: all 1s ease 0s; transition: all 1s ease 0s;
	}
		.button:hover {box-shadow: -160px 0 100px rgba(255,255,255,0.3) inset, 0 2px 0 rgba(255,255,255,0.3) inset;}
		.button:active {top: 2px;}
	
	.blue_button {background: #3642ae;}
	
	
	/*------ Forms  ------*/
	form {position: relative;}
		form .form_header {font: 700 18px/22px Gotham; color: #fff; text-align: center; text-transform: uppercase; letter-spacing: 1.5px; margin: 0 auto 15px;}
		form .privacy {font: 14px/20px Gotham; color: #fff; padding-left: 35px; margin: 20px 0 0; position: relative;}
			form .privacy .icon {width: 24px; height: 24px; background-position: -46px 0; position: absolute; left: 0; top: 0;}
		
		/* Fields */
		.field_input {
			-webkit-transition: box-shadow 0.3s ease-out 0s, border-color 0.3s ease-out 0s; -moz-transition: box-shadow 0.3s ease-out 0s, border-color 0.3s ease-out 0s; -ms-transition: box-shadow 0.3s ease-out 0s, border-color 0.3s ease-out 0s; -o-transition: box-shadow 0.3s ease-out 0s, border-color 0.3s ease-out 0s; transition: box-shadow 0.3s ease-out 0s, border-color 0.3s ease-out 0s;
			display: block; width: 100%; background: #fff url(../images/form_icons.png) -9999px 0 no-repeat; border: 1px solid transparent; border-radius: 6px; font: 20px/24px Gotham; text-align: left; padding: 27px 80px; margin: 0 auto 15px; position: relative;
		}
		.field_name {background-position: 30px -572px;}
		.field_phone {background-position: 30px -672px;}
		.field_mail {background-position: 30px -769px;}
			.field_input > .arrow {display: block; width: 14px; height: 9px; background: url(../images/icons.png) -16px 0 no-repeat; margin: auto; position: absolute; top: 0; bottom: 0; right: 30px;}
				.field_input > .arrow:after {content:''; display: block; width: 100%; height: 100%; background: url(../images/icons.png) -16px -27px no-repeat; opacity: 0; visibility: hidden;}
				.field_input:hover > .arrow:after {opacity: 1; visibility: visible;}
				.field_input.active > .arrow {-webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg);}
			.field_input .ruble {display: block; width: 12px; height: 14px; background: url(../images/icons.png) -32px 0 no-repeat; margin: auto; position: absolute; top: 0; bottom: 0; right: 30px;}
				.field_input .ruble:after {content:''; display: block; width: 100%; height: 100%; background: url(../images/icons.png) -32px -16px no-repeat; opacity: 0; visibility: hidden;}
				.field_input:hover .ruble:after {opacity: 1; visibility: visible;}
		
		/* Placeholders */
		.field_input::-webkit-input-placeholder {color: #333;}
		.field_input::-moz-placeholder {color: #333;}
		.field_input::-ms-input-placeholder  {color: #333;}
			.field_input.error::-webkit-input-placeholder {color: #f00 !important;}
			.field_input.error::-moz-placeholder {color: #f00 !important;}
			.field_input.error::-ms-input-placeholder  {color: #f00 !important;}
			.field_input.error {color: #f00 !important; border-color: #f00 !important; -webkit-animation: shake-horizontal 0.1s linear 6; -moz-animation: shake-horizontal 0.1s linear 6; -ms-animation: shake-horizontal 0.1s linear 6; -o-animation: shake-horizontal 0.1s linear 6; animation: shake-horizontal 0.1s linear 6;}
		
		/* Sending */
		form.disabled {cursor: progress;}
		input[name="name"] {display: none;}
		
		.f_submit_progress {display: none; background: rgba(0,0,0,0.7); border-radius: inherit; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 8;}
			.f_submit_progress .progress_items {width: 100%; height: 12px; font-size: 0; text-align: center; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0;}
				.f_submit_progress [class^="progress-"] {display: inline-block; vertical-align: top; width: 12px; height: 12px; margin: 0 3px; background: #ddd; -webkit-animation: blink 1.6s ease-out infinite; -moz-animation: blink 1.6s ease-out infinite; -ms-animation: blink 1.6s ease-out infinite; -o-animation: blink 1.6s ease-out infinite; animation: blink 1.6s ease-out infinite;}
					.f_submit_progress .progress-1 {-webkit-animation-delay: 0.3s; -moz-animation-delay: 0.3s; -ms-animation-delay: 0.3s; -o-animation-delay: 0.3s; animation-delay: 0.3s;}
					.f_submit_progress .progress-2 {-webkit-animation-delay: 0.6s; -moz-animation-delay: 0.6s; -ms-animation-delay: 0.6s; -o-animation-delay: 0.6s; animation-delay: 0.6s;}
					.f_submit_progress .progress-3 {-webkit-animation-delay: 0.9s; -moz-animation-delay: 0.9s; -ms-animation-delay: 0.9s; -o-animation-delay: 0.9s; animation-delay: 0.9s;}


/**************** TOP SCREEN *****************/

#top_screen {height: 1024px; height: 100vh; min-height: 600px; background: url(../images/backgrounds/top_screen_bg.jpg) 50% 50% no-repeat;}
#top_screen .wrapper {height: 100%; padding: 20px 15px;}
	#top_screen .logo {margin: auto; position: absolute; left: 0; right: 0; top: 50px;}
	#top_screen h1 {font: 900 64px/64px Muller; color: #343fac; text-transform: uppercase; margin-bottom: 10px;}
	#top_screen h1 + p {font: 700 22px/26px Muller; color: #040a4c; text-align: center; text-transform: uppercase; margin-bottom: 40px;}
	#top_screen .note {font: 20px/30px Gotham; text-align: center; margin-bottom: 90px;}
	#top_screen form {background: rgba(29,26,35,0.6); border-radius: 6px; padding: 15px; margin: auto;}
		#top_screen form .form_header {width: 100%; height: 38px; background: url(../images/backgrounds/top_form_header.png) 50% 0 no-repeat; font: 700 14px/38px Gotham; margin: auto; position: absolute; left: 0; right: 0; top: -38px;}
		#top_screen form .field_input {width: 65%; float: left; margin: 0;}
		#top_screen form .submit {width: 33%; float: right; margin: 0;}
	#top_screen .view_next {width: 410px; height: 95px; background: url(../images/backgrounds/view_next_mask.png) no-repeat; -webkit-background-size: cover; background-size: cover; text-align: center; padding: 18px 0 0; margin: auto; position: absolute; left: 0; right: 0; bottom: -1px;}
		#top_screen .view_next a {display: inline-block; font: 700 11px/11px Gotham; text-align: center; text-transform: uppercase; letter-spacing: 1px;}
		#top_screen .view_next a:hover {color: #ed5456;}
			#top_screen .view_next a .icon {width: 23px; height: 38px;}
				#top_screen .view_next a .link_icon {background-position: 0 -57px; margin: 0 auto 16px;}
				#top_screen .view_next a .hover_icon {background-position: -25px -57px; opacity: 0; visibility: hidden;}
				#top_screen .view_next a:hover .hover_icon {opacity: 1; visibility: visible;}


/**************** SERVICES *****************/

#services {}
#services .wrapper {padding: 95px 15px 80px;}
	#services h2 {margin-bottom: 55px;}
	/*------ Items ------*/
	#services .items {font-size: 0; text-align: center;}
		#services .items [class*="item"] {display: inline-block; vertical-align: top; width: 220px; height: 205px; background: #fff; font: 700 11px/15px Gotham; text-align: center; text-transform: uppercase; padding: 20px; position: relative;}
			#services .items [class*="item"] .content {-webkit-transform: translateY(40px); -moz-transform: translateY(40px); -ms-transform: translateY(40px); -o-transform: translateY(40px); transform: translateY(40px);}
			#services .items [class*="item"] .icon {width: 60px; height: 60px; margin: 0 auto 20px;}
				#services .items .item-1 .icon {background-position: 0 -97px; left: -10px;}
				#services .items .item-2 .icon {background-position: 0 -159px;}
				#services .items .item-3 .icon {background-position: 0 -221px;}
				#services .items .item-4 .icon {background-position: 0 -283px;}
				#services .items .item-5 .icon {background-position: 0 -345px;}
			#services .items [class*="item"] .button {width: 100%; height: 50px; box-shadow: 60px 0 60px rgba(255,255,255,0.3) inset, 0 2px 0 rgba(255,255,255,0.3) inset; font: 700 11px/50px Gotham; margin: 20px auto 0; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s;}
				#services .items [class*="item"] .button:hover {box-shadow: -60px 0 60px rgba(255,255,255,0.3) inset, 0 2px 0 rgba(255,255,255,0.3) inset;}
		/* Hover */
		#services .items [class*="item"]:hover {box-shadow: 0 0 57px rgba(0,0,0,0.15); z-index: 2;}
			#services .items [class*="item"]:hover .content {-webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0);}
			#services .items [class*="item"]:hover .button {opacity: 1; visibility: visible;}


/**************** REVIEWS *****************/

#reviews {background: url(../images/backgrounds/reviews_bg.jpg) 50% 80% no-repeat;}
#reviews .wrapper {padding: 75px 15px 80px;}
	#reviews h2 {margin-bottom: 70px;}
	#reviews .items {font-size: 0; text-align: center; margin: 0 auto 50px;}
		#reviews .items .item {display: inline-block; vertical-align: top; width: 290px; text-align: center; margin: 0 40px;}
			#reviews .items .item .photo {display: block; width: 90px; height: 90px; border-radius: 50%; margin: 0 auto 15px;}
			#reviews .items .item .author {font: 700 12px/16px Gotham; text-transform: uppercase; letter-spacing: 1px;}
			#reviews .items .item .stars {height: 9px; background: url(../images/backgrounds/stars.png) 50% 50% no-repeat; margin: 5px auto 18px;}
			#reviews .items .item .content {font: italic 14px/20px Gotham;}
		/* Controls */
		.fslider .fslider_controls {width: 100%; height: 100%; position: absolute; left: 0; top: 0; cursor: auto;}
			/* Arrows */
			.fslider_arrow {display: none; width: 26px; height: 52px; margin: auto; position: absolute; top: 0; bottom: 0; z-index: 10;}
			.fslider_arrow.prev {left: -40px;}
			.fslider_arrow.next {right: -40px;}
				.fslider_arrow:before, .fslider_arrow:after {content:''; display: block; width: 35px; height: 3px; background: #000; margin: auto; position: absolute; top: 0; bottom: 0;}
					.fslider_arrow:before {top: 1px;}
					.fslider_arrow:after {bottom: 1px;}
				.fslider_arrow.prev:before, .fslider_arrow.prev:after {left: 0; -webkit-transform-origin: 0 50%; -moz-transform-origin: 0 50%; -ms-transform-origin: 0 50%; -o-transform-origin: 0 50%; transform-origin: 0 50%;}
					.fslider_arrow.prev:before {transform: rotate(-45deg);}
					.fslider_arrow.prev:after {transform: rotate(45deg);}
				.fslider_arrow.next:before, .fslider_arrow.next:after {right: 0; -webkit-transform-origin: 100% 50%; -moz-transform-origin: 100% 50%; -ms-transform-origin: 100% 50%; -o-transform-origin: 100% 50%; transform-origin: 100% 50%;}
					.fslider_arrow.next:before {-webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg);}
					.fslider_arrow.next:after {-webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg);}
			.fslider_arrow:hover {opacity: 1;}
				.fslider_arrow.prev:hover {-webkit-transform: translateX(-2px); -moz-transform: translateX(-2px); -ms-transform: translateX(-2px); -o-transform: translateX(-2px); transform: translateX(-2px);}
				.fslider_arrow.next:hover {-webkit-transform: translateX(2px); -moz-transform: translateX(2px); -ms-transform: translateX(2px); -o-transform: translateX(2px); transform: translateX(2px);}
				.fslider_arrow:hover:before, .fslider_arrow:hover:after {background: #ed5456 !important;}
			.fslider_arrow:active {}
				.fslider_arrow.prev:active:before {-webkit-transform: rotate(-40deg); -moz-transform: rotate(-40deg); -ms-transform: rotate(-40deg); -o-transform: rotate(-40deg); transform: rotate(-40deg);}
				.fslider_arrow.prev:active:after {-webkit-transform: rotate(40deg); -moz-transform: rotate(40deg); -ms-transform: rotate(40deg); -o-transform: rotate(40deg); transform: rotate(40deg);}
				.fslider_arrow.next:active:before {-webkit-transform: rotate(40deg); -moz-transform: rotate(40deg); -ms-transform: rotate(40deg); -o-transform: rotate(40deg); transform: rotate(40deg);}
				.fslider_arrow.next:active:after {-webkit-transform: rotate(-40deg); -moz-transform: rotate(-40deg); -ms-transform: rotate(-40deg); -o-transform: rotate(-40deg); transform: rotate(-40deg);}
			/* Bullets */
			.fslider_bullets {width: 100%; font-size: 0; line-height: 0; text-align: center; margin: auto; position: absolute; left: 0; right: 0; bottom: -50px; z-index: 10;}
				.fslider_bullets .fslider_bullet {display: inline-block; width: 7px; height: 7px; background: #e8e8e8; border-radius: 50%; margin: 0 10px;}
					.fslider_bullets .fslider_bullet:hover {background: #333;}
					.fslider_bullets .fslider_bullet.active {background: #ed5456;}


/**************** CONTACTS *****************/

#contacts {height: 650px; position: relative;}
#contacts .wrapper {max-width: 100%; height: 100%;}
	#map {height: 100%; background: #ccc;}
	#contacts .info {width: 350px; height: 460px; background: #fff; padding: 10px 20px; margin: auto; position: absolute; top: 0; bottom: 0; left: 0; right: -760px; z-index: 10;}
		#contacts h2 {display: none;}
		#contacts .info [class*="item"] {text-align: left; margin: 0 auto 15px;}
		#contacts .info [class*="item"]:last-child {margin-bottom: 0;}
			#contacts .info [class*="item"] .name {display: inline-block; font: 700 16px/20px Gotham; margin-bottom: 18px; position: relative;}
				#contacts .info [class*="item"] .name:after {content:''; display: none; width: 14px; height: 9px; background: url(../images/icons.png) -16px 0 no-repeat; position: absolute; top: 6px; right: 0;}
				#contacts .info [class*="item"].active .name:after {-webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg);}
			#contacts .info [class*="item"] .office_info {display: none;}
			@media all and (min-width: 768px){ #contacts .info [class*="item"] .office_info {display: block !important;} }
				#contacts .info [class*="item"] .address {font: 14px/18px Gotham; margin-bottom: 5px; margin-left: 25px; position: relative;}
					#contacts .info [class*="item"] .address .icon {width: 12px; height: 13px; background-position: -50px -57px; position: absolute; top: 2px; left: -24px;}
				#contacts .info [class*="item"] .show_full {border-style: dashed; line-height: 0.95em; margin-left: 25px;}
				#contacts .info [class*="item"].visible .show_full {display: none;}
				#contacts .info [class*="item"] .full_info {display: none;}
				#contacts .info [class*="item"].visible .full_info {display: block;}
					#contacts .info [class*="item"] .mail {font: 14px/16px Gotham; margin-bottom: 5px; margin-left: 25px; position: relative;}
					#contacts .info [class*="item"] .mail:hover {color: #ed5456;}
					#contacts .info [class*="item"] .mail:hover:after {background: #ed5456;}
						#contacts .info [class*="item"] .mail .icon {width: 12px; height: 10px; background-position: -50px -72px; position: absolute; top: 3px; left: -24px;}
					#contacts .info [class*="item"] .phone {font: 14px/16px Gotham; margin-left: 25px; position: relative;}
						#contacts .info [class*="item"] .phone .icon {width: 12px; height: 11px; background-position: -50px -84px; position: absolute; top: 2px; left: -24px;}


/**************** FOOTER *****************/

footer {}
footer .wrapper {padding: 25px 15px 15px;}
	footer .logo {display: inline-block; vertical-align: middle;}
	footer .copyright {display: inline-block; vertical-align: middle; font: 14px/18px Gotham;}


/**************** BIG SCREENS *****************/

@media all and (min-width: 1921px){
	#top_screen {-webkit-background-size: cover; background-size: cover;}
	#reviews {-webkit-background-size: cover; background-size: cover;}
}



/**************** MODAL WINDOWS *****************/

html:not(.mobile) #global_wrapper {
	width: 100%; width: 100vw;
}

[id^="f_overlay_modal"]  {display: none; width: 100%; height: 100%; margin: auto; position: absolute; left: 0; top: 0; background: rgba(0,0,0,0.7);}
[id^="f_modals"]   {display: none; margin: auto; position: fixed; left: 0; right: 0; top: 0; bottom: 0; overflow: auto; -webkit-transform: translateZ(0px); -webkit-overflow-scrolling: touch;}
#f_overlay_modal, #f_modals {display: none;}

/*------ Animation ------*/
[id^="f_modals"]  {-webkit-perspective: 900px; perspective: 900px;}
.f_modal {-webkit-transition: transform 0.6s linear 0s; -moz-transition: transform 0.6s linear 0s; -ms-transition: transform 0.6s linear 0s; -o-transition: transform 0.6s linear 0s; transition: transform 0.6s linear 0s;}

.f_modal.centered.closed {-webkit-transform: rotateX(25deg); -moz-transform: rotateX(25deg); -ms-transform: rotateX(25deg); -o-transform: rotateX(25deg); transform: rotateX(25deg);}
.f_modal.sent {-webkit-transform: rotateY(90deg); -moz-transform: rotateY(90deg); -ms-transform: rotateY(90deg); -o-transform: rotateY(90deg); transform: rotateY(90deg);}
#modal_success.closed {-webkit-transform: rotateY(-90deg); -moz-transform: rotateY(-90deg); -ms-transform: rotateY(-90deg); -o-transform: rotateY(-90deg); transform: rotateY(-90deg);}
#modal_success.closing {-webkit-transform: rotateY(0) rotateX(25deg); -moz-transform: rotateY(0) rotateX(25deg); -ms-transform: rotateY(0) rotateX(25deg); -o-transform: rotateY(0) rotateX(25deg); transform: rotateY(0) rotateX(25deg);}

.f_modal.switchOut.rtl, .f_modal.switchIn.ltr {-webkit-transform: translateX(-90px); -moz-transform: translateX(-90px); -ms-transform: translateX(-90px); -o-transform: translateX(-90px); transform: translateX(-90px);}
.f_modal.switchIn.rtl, .f_modal.switchOut.ltr {-webkit-transform: translateX(90px); -moz-transform: translateX(90px); -ms-transform: translateX(90px); -o-transform: translateX(90px); transform: translateX(90px);}
.f_modal.switched {-webkit-transform: translateX(0) !important; -moz-transform: translateX(0) !important; -ms-transform: translateX(0) !important; -o-transform: translateX(0) !important; transform: translateX(0) !important;}

/*------ Close button ------*/
.close_modal {display: block; width: 24px; height: 24px; position: absolute; top: 10px; right: 10px; opacity: 0.5; z-index: 10;}
	.close_modal:before, .close_modal:after {content:''; display: block; width: 3px; height: 100%; background: #000; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0;}
	.close_modal:before {-webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg);}
	.close_modal:after {-webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg);}
.close_modal:hover {opacity: 1;}
.close_modal:active {opacity: 1;}
	.close_modal:active:before, .close_modal:active:after {background: #f00;}
	
	
	/*------ All modals ------*/
	.f_modal {display: none; margin: 50px auto; position: absolute; left: 0; right: 0;}
	
	/*------ Success ------*/
	#modal_success {width: 400px; height: 250px; background: #fff; border-radius: 6px; text-align: center;}
		#modal_success strong {display: block; font: 900 34px/34px Muller; color: #040a4c; text-transform: uppercase; margin-bottom: 20px;}
		#modal_success p {font: 20px/26px Gotham;}



/**************** PAGE MESSAGES *****************/

#f_messages_overlay {display: none; width: 100%; height: 100%; margin: auto; position: absolute; left: 0; top: 0; background: rgba(255,255,255,0.8); z-index: 11111;}
#f_messages {display: none; margin: auto; position: fixed; left: 0; right: 0; top: 0; bottom: 0; overflow: auto; -webkit-transform: translateZ(0px); z-index: 11112; -webkit-overflow-scrolling: touch;}
	
	.f_message {
		display: none; width: 95%; max-width: 500px; border-radius: 8px; box-shadow: 0 10px 30px rgba(0,0,0,0.5); padding: 10px; margin: auto; position: absolute; left: 0; right: 0; top: 20px;
		background: #aaa; background: -moz-linear-gradient(-45deg, #aaaaaa 0%, #333333 100%); background: -webkit-linear-gradient(-45deg, #aaaaaa 0%, #333333 100%); background: linear-gradient(135deg, #aaaaaa 0%, #333333 100%);
		-webkit-transform: translateY(-400px); -moz-transform: translateY(-400px); -ms-transform: translateY(-400px); -o-transform: translateY(-400px); transform: translateY(-400px);
		-webkit-transition: all 0.1s cubic-bezier(0.175,0.885,0.32,1.275) 0s; -moz-transition: all 0.1s cubic-bezier(0.175,0.885,0.32,1.275) 0s; -ms-transition: all 0.1s cubic-bezier(0.175,0.885,0.32,1.275) 0s; -o-transition: all 0.1s cubic-bezier(0.175,0.885,0.32,1.275) 0s; transition: all 0.1s cubic-bezier(0.175,0.885,0.32,1.275) 0s;
	}
	.f_message.active {-webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0);}
		.f_message .content {width: 100%; height: 100%; background: #fff; font: 16px/20px Arial; color: #000; text-align: center; padding: 35px 15px;}
			/* Close */
			.f_message .close {display: block; width: 20px; height: 20px; border-radius: 50%; position: absolute; top: 15px; right: 15px; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s;}
				.f_message .close:before, .f_message .close:after {content:''; display: block; width: 2px; height: 70%; background: #333; margin: auto; position: absolute; left: 0; right: 0; top: 0; bottom: 0; -webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s;}
				.f_message .close:before {-webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg);}
				.f_message .close:after {-webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg);}
			.f_message .close:hover {background: #333;}
				.f_message .close:hover:before, .f_message .close:hover:after {background: #fff;}
			/* Text */
			.f_message .text {margin-bottom: 20px;}
			/* Prompt input */
			.f_message input {display: block; width: 100%; background: #fff; border: 1px solid #ccc; padding: 8px 10px; margin: 0 auto 20px;}
				.f_message input:focus {border-color: #6691ce;}
			/* Buttons */
			.f_message .buttons {}
				.f_message button {
					display: inline-block; vertical-align: top; min-width: 80px; max-width: 200px; height: 40px; padding: 0 15px; font-weight: 700; line-height: 38px; color: #fff; text-transform: uppercase; text-shadow: 0 1px 1px #000; border: 1px solid; border-radius: 4px; box-shadow: 0 20px 30px rgba(255,255,255,0.5) inset, 0 1px 0 rgba(255,255,255,0.5) inset; margin: 0 5px; position: relative;
					-webkit-transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -ms-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; transition: all 0.3s ease-out 0s;
				}
				.f_message .confirm_button {background: #5cb811; border-color: #3b7808;}
				.f_message .cancle_button {background: #d42916; border-color: #b73125;}
					.f_message button:hover {box-shadow: 0 -20px 30px rgba(255,255,255,0.5) inset;}
					.f_message button:focus {box-shadow: 0 -20px 30px rgba(255,255,255,0.5) inset, 0 0 15px #6691ce;}
					.f_message button:active {top: 1px;}
	
	#f_alert {}
	#f_confirm {}
	#f_prompt {}

@media all and (max-width: 479px){
	.f_message {padding: 8px;}
	.f_message .content {font: 14px/16px Arial; padding: 25px 10px;}
		.f_message .text {margin-bottom: 15px;}
		.f_message input {margin-bottom: 15px;}
		.f_message button {margin: 0 2px;}
}