/*-----------------------------------------------------------------------------------

	Template Name: eMotion
	Template URI: http://www.themes.shtier.com/html/emotion
	Description: HTML Template for portfolio, agencies, and what you want.
	Author: Shtier [Artem Valchuk]
	Author URI: http://www.shtier.com
	Version: 2.0

-----------------------------------------------------------------------------------

	0.	Media print
	1.	@media (min-width: 768px) and (max-width: 979px)
	2.	@media (max-width: 768px)
	3.	@media (max-width: 767px)
	4.  @media (max-width: 979px)
	5.	@media (min-width: 980px)
	6.  @media (max-width: 568px)
	7.	@media only screen and (min-width: 480px) and (max-width: 767px) 
	8.	@media (max-width: 320px)

-----------------------------------------------------------------------------------*/

@-ms-viewport {
  width: device-width;
}
.input-block-level {
	display: block;
	width: 100%;
	min-height: 30px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.hidden {
	display: none;
	visibility: hidden;
}
.row:before,
.row:after {
	content: '\0020';
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0; 
}
.visible-phone { display: none !important }
.visible-tablet { display: none !important }
.hidden-desktop { display: none !important }
.visible-desktop { display: inherit !important }
.visible-print { display: none !important; }

/*-----------------------------------------------------------------------------------*/
/*	0.	@media print
/*-----------------------------------------------------------------------------------*/

@media print {

	.visible-print {
		display: inherit !important;
	}
	.hidden-print {
		display: none !important;
	}
  
}

/*-----------------------------------------------------------------------------------*/
/*	1.	@media (min-width: 768px) and (max-width: 979px)
/*-----------------------------------------------------------------------------------*/

@media (min-width: 768px) and (max-width: 979px) {

	body { 
		font-size:14px;
		line-height:22px;
	}
	h2 {
		font-size: 30px;
		margin: 0 0 26px 0;
	}
	blockquote small { margin: 5px 0 0 0 }

	#section1 h1 {
		font-size: 180px;
		line-height: 170px;
		margin: 20px 0;
	}
	#section1 h2 { font-size: 45px }
	#section1 .emotion {
		top: -25px;
		font-size: 60%;
	}
	#section2 .head1_animation { margin-top: 0px }
	#section2 h1 { }
	#section2 .descr_animation ul { margin-top: 0px }
	#slideshow { height: 540px }
	#slideshow ul.slides { height: 540px }
	#slideshow li.slide { height: 440px }
	.descr_animation .list li { margin-bottom: 10px }
	.post p { 
		font-size:14px;
		line-height:22px;
	}
	.row {
		margin-left: -20px;
		*zoom: 1;
	}
	.row:before,
	.row:after {
		display: table;
		line-height: 0;
		content: "";
	}
	.row:after { clear: both }
	[class*="span"] {
		float: left;
		min-height: 1px;
		margin-left: 20px;
	}
	.container,
	.navbar-static-top .container,
	.navbar-fixed-top .container,
	.navbar-fixed-bottom .container { width: 724px }
	.span12 { width: 724px }
	.span11 { width: 662px }
	.span10 { width: 600px }
	.span9 { width: 538px }
	.span8 { width: 476px }
	.span7 { width: 414px }
	.span6 { width: 352px }
	.span5 { width: 290px }
	.span4 { width: 228px }
	.span3 { width: 166px }
	.span2 { width: 104px }
	.span1 { width: 42px }
	.offset12 { margin-left: 764px }
	.offset11 { margin-left: 702px }
	.offset10 { margin-left: 640px }
	.offset9 { margin-left: 578px }
	.offset8 { margin-left: 516px }
	.offset7 { margin-left: 454px }
	.offset6 { margin-left: 392px }
	.offset5 { margin-left: 330px }
	.offset4 { margin-left: 268px }
	.offset3 { margin-left: 206px }
	.offset2 { margin-left: 144px }
	.offset1 { margin-left: 82px }
	.row-fluid {
		width: 100%;
		*zoom: 1;
	}
	.row-fluid:before,
	.row-fluid:after {
		display: table;
		line-height: 0;
		content: "";
	}
	.row-fluid:after { clear: both }
	.row-fluid [class*="span"] {
		display: block;
		float: left;
		width: 100%;
		min-height: 30px;
		margin-left: 2.7624309392265194%;
		*margin-left: 2.709239449864817%;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	.row-fluid [class*="span"]:first-child { margin-left: 0 }
	.row-fluid .controls-row [class*="span"] + [class*="span"] { margin-left: 2.7624309392265194% }
	.row-fluid .span12 {
		width: 100%;
		*width: 99.94680851063829%;
	}
	.row-fluid .span11 {
		width: 91.43646408839778%;
		*width: 91.38327259903608%;
	}
	.row-fluid .span10 {
		width: 82.87292817679558%;
		*width: 82.81973668743387%;
	}
	.row-fluid .span9 {
		width: 74.30939226519337%;
		*width: 74.25620077583166%;
	}
	.row-fluid .span8 {
		width: 65.74585635359117%;
		*width: 65.69266486422946%;
	}
	.row-fluid .span7 {
		width: 57.18232044198895%;
		*width: 57.12912895262725%;
	}
	.row-fluid .span6 {
		width: 48.61878453038674%;
		*width: 48.56559304102504%;
	}
	.row-fluid .span5 {
		width: 40.05524861878453%;
		*width: 40.00205712942283%;
	}
	.row-fluid .span4 {
		width: 31.491712707182323%;
		*width: 31.43852121782062%;
	}
	.row-fluid .span3 {
		width: 22.92817679558011%;
		*width: 22.87498530621841%;
	}
	.row-fluid .span2 {
		width: 14.3646408839779%;
		*width: 14.311449394616199%;
	}
	.row-fluid .span1 {
		width: 5.801104972375691%;
		*width: 5.747913483013988%;
	}
	.row-fluid .offset12 {
		margin-left: 105.52486187845304%;
		*margin-left: 105.41847889972962%;
	}
	.row-fluid .offset12:first-child {
		margin-left: 102.76243093922652%;
		*margin-left: 102.6560479605031%;
	}
	.row-fluid .offset11 {
		margin-left: 96.96132596685082%;
		*margin-left: 96.8549429881274%;
	}
	.row-fluid .offset11:first-child {
		margin-left: 94.1988950276243%;
		*margin-left: 94.09251204890089%;
	}
	.row-fluid .offset10 {
		margin-left: 88.39779005524862%;
		*margin-left: 88.2914070765252%;
	}
	.row-fluid .offset10:first-child {
		margin-left: 85.6353591160221%;
		*margin-left: 85.52897613729868%;
	}
	.row-fluid .offset9 {
		margin-left: 79.8342541436464%;
		*margin-left: 79.72787116492299%;
	}
	.row-fluid .offset9:first-child {
		margin-left: 77.07182320441989%;
		*margin-left: 76.96544022569647%;
	}
	.row-fluid .offset8 {
		margin-left: 71.2707182320442%;
		*margin-left: 71.16433525332079%;
	}
	.row-fluid .offset8:first-child {
		margin-left: 68.50828729281768%;
		*margin-left: 68.40190431409427%;
	}
	.row-fluid .offset7 {
		margin-left: 62.70718232044199%;
		*margin-left: 62.600799341718584%;
	}
	.row-fluid .offset7:first-child {
		margin-left: 59.94475138121547%;
		*margin-left: 59.838368402492065%;
	}
	.row-fluid .offset6 {
		margin-left: 54.14364640883978%;
		*margin-left: 54.037263430116376%;
	}
	.row-fluid .offset6:first-child {
		margin-left: 51.38121546961326%;
		*margin-left: 51.27483249088986%;
	}
	.row-fluid .offset5 {
		margin-left: 45.58011049723757%;
		*margin-left: 45.47372751851417%;
	}
	.row-fluid .offset5:first-child {
		margin-left: 42.81767955801105%;
		*margin-left: 42.71129657928765%;
	}
	.row-fluid .offset4 {
		margin-left: 37.01657458563536%;
		*margin-left: 36.91019160691196%;
	}
	.row-fluid .offset4:first-child {
		margin-left: 34.25414364640884%;
		*margin-left: 34.14776066768544%;
	}
	.row-fluid .offset3 {
		margin-left: 28.45303867403315%;
		*margin-left: 28.346655695309746%;
	}
	.row-fluid .offset3:first-child {
		margin-left: 25.69060773480663%;
		*margin-left: 25.584224756083227%;
	}
	.row-fluid .offset2 {
		margin-left: 19.88950276243094%;
		*margin-left: 19.783119783707537%;
	}
	.row-fluid .offset2:first-child {
		margin-left: 17.12707182320442%;
		*margin-left: 17.02068884448102%;
	}
	.row-fluid .offset1 {
		margin-left: 11.32596685082873%;
		*margin-left: 11.219583872105325%;
	}
	.row-fluid .offset1:first-child {
		margin-left: 8.56353591160221%;
		*margin-left: 8.457152932878806%;
	}
	input,
	textarea { margin-left: 0 }
	.controls-row [class*="span"] + [class*="span"] { margin-left: 20px }
	input.span12,
	textarea.span12 { width: 710px }
	input.span11,
	textarea.span11 { width: 648px }
	input.span10,
	textarea.span10 { width: 586px }
	input.span9,
	textarea.span9 { width: 524px }
	input.span8,
	textarea.span8 { width: 462px }
	input.span7,
	textarea.span7 { width: 400px }
	input.span6,
	textarea.span6 { width: 338px }
	input.span5,
	textarea.span5 { width: 276px }
	input.span4,
	textarea.span4 { width: 214px }
	input.span3,
	textarea.span3 { width: 152px }
	input.span2,
	textarea.span2 { width: 90px }
	input.span1,
	textarea.span1 { width: 28px }	
	.hidden-desktop { display: inherit !important }
	.visible-desktop { display: none !important }
	.visible-tablet { display: inherit !important }
	.hidden-tablet { display: none !important }

}
/*-----------------------------------------------------------------------------------*/
/*	2.	@media (max-width: 768px)
/*-----------------------------------------------------------------------------------*/

@media (max-width: 768px) {

	h3 {
		font: normal 22px/1em 'MenschBold', Helvetica, Arial, sans-serif;
		margin: 0 0 10px 0;
	}
	h2 { font: normal 28px/1em 'MenschBold', Helvetica, Arial, sans-serif }
	.blog .posts h3 { margin: 12px 0 }
	.details h3,
	.details h2 {
		font-size: 18px;
		line-height: 1em;
	}
	.post p {
		line-height: 22px;
		font-size: 14px;
	}
	blockquote { font: italic 14px/22px "Droid Serif", Georgia, Times, serif }
	blockquote small { margin: 5px 0 0 0 }
	.tweets time { font: normal 14px/22px "Droid Serif", Georgia, Times, serif }
	.tweets .tweetList li > p { font: normal 14px/22px 'Droid Sans', Helvetica, Arial, sans-serif }

}
/*-----------------------------------------------------------------------------------*/
/*	3.	@media (max-width: 767px)
/*-----------------------------------------------------------------------------------*/

@media (max-width: 767px) {

	#slideshow li.slide { padding: 70px 0 }
	#welcome .img_animation,
	#welcome .descr_animation {
		text-align: center;
		margin-bottom: 20px;
	}
	#welcome .descr_animation h2 { margin: 15px 0 15px 0 }

	#section1 h1 {
		line-height: 120px;
		margin: 20px 0;
		font-size: 115px;
	}
	#section1 h6 { padding: 0 20px }
	#section1 h2 {
		text-align: center;
		z-index: 10;
		font-size: 30px;
	}
	#section1 .emotion {
		top: -22px;
		font-size: 60%;
	}
	#section2 .head1_animation {
		margin-top: 100px;
		margin-right: 50px;
		font-size: 120px;
	}
	#section2 h1 {
		text-align: center;
		font-size: 85px;
	}
	#section2 .p_animation {
		text-align: center;
		margin-top: 5px;
	}
	.testimonials { height: 260px; }
	.cite { height: 230px; }
	.cite ul { height: 240px; }
	.cite li { height: 230px;}
	.section {
		padding-right: 20px;
		padding-left: 20px;
	}
	.marker{width:180px; left: -45px}
	.footermarker p{text-align: center; padding: 15px 0 0 0;}
	.marker .footermarker .btn {margin: 10px 0px 12px 45px;}
	#GoogleMap {
		margin-left: -20px;
		padding: 0 20px;
	}
	#footer .copyright {
		float: none;
		text-align: center;
	}
	.footer .social {
		margin-top: 16px;
		float: none;
		width: 300px;
		margin: 0 auto;
	}
	.tweets .tweetList li > p {
		font-size: 16px;
		line-height: 22px;
	}
	.tweets ul.tweetList {
		min-height: 140px;
	}
	.sep-section{margin: 0 -20px}
	.navbar-fixed-top,
	.navbar-fixed-bottom,
	.navbar-static-top {

	}
	.container { width: 300px; }
	.span12,
	.span11,
	.span10,
	.span9,
	.span8,
	.span7,
	.span6,
	.span5,
	.span4,
	.span3,
	.span2,
	.span1 { width: 300px; }

	/* Offsets */
	.container .offset1,
	.container .offset2,
	.container .offset3,
	.container .offset4,
	.container .offset5,
	.container .offset6,
	.container .offset7,
	.container .offset8,
	.container .offset9,
	.container .offset10,
	.container .offset11,
	.container .offset12 { padding-left: 0; }
	.container-fluid {
		padding: 0;
	}
	.container {
	width: auto;
	}
	.row-fluid {
	width: 100%;
	}
	.row {
	margin-left: 0;
	}
	[class*="span"],
	.row-fluid [class*="span"] {
		display: block;
		float: none;
		width: 100%;
		margin-left: 0;
		-webkit-box-sizing: border-box;
		   -moz-box-sizing: border-box;
				box-sizing: border-box;
	}
	.portfolio .item{
		max-width: 560px;
		text-align: center;
	}
	.span12,
	.row-fluid .span12 {
		width: 100%;
		-webkit-box-sizing: border-box;
		   -moz-box-sizing: border-box;
				box-sizing: border-box;
	}
	.row-fluid [class*="offset"]:first-child {
		margin-left: 0;
	}

	input[class*="span"],
	select[class*="span"],
	textarea[class*="span"] {
		display: block;
		width: 100%;
		min-height: 30px;
		-webkit-box-sizing: border-box;
		   -moz-box-sizing: border-box;
				box-sizing: border-box;
	}
	.input-prepend input,
	.input-append input,
	.input-prepend input[class*="span"],
	.input-append input[class*="span"] {
		display: inline-block;
		width: auto;
	}
	.controls-row [class*="span"] + [class*="span"] { margin-left: 0; }
	.show-grid [class*="span"] { margin-bottom: 5px }

	.hidden-desktop { display: inherit !important }
	.visible-desktop { display: none !important }
	.visible-phone { display: inherit !important }
	.hidden-phone { display: none !important }
}

/*-----------------------------------------------------------------------------------*/
/*	4.	@media (max-width: 979px)
/*-----------------------------------------------------------------------------------*/

@media (max-width: 979px) {

	body { padding-top: 0 }
	.navbar-fixed-top {
		margin-bottom: 20px;
		position: fixed;
	}
	.navbar-fixed-bottom { margin-top: 20px }
	.navbar-fixed-top .navbar-inner,
	.navbar-fixed-bottom .navbar-inner {
		padding: 5px;
		background: #423134;
	}
	.navbar .container {
		width: auto;
		padding: 0 20px;
	}
	.navbar .brand {
		padding-right: 10px;
		padding-left: 10px;
		margin: 0 0 0 -5px;
	}
	.nav-collapse { clear: both }
	.nav-collapse .nav {
		float: none;
		margin: 0 0 10px;
	}
	.nav-collapse .nav > li {
		float: none;
		line-height: 30px;
	}
	.nav-collapse .nav > li > a { margin-bottom: 2px }
	.nav-collapse .nav > .divider-vertical { display: none }
	.nav-collapse .nav .nav-header { text-shadow: none }
	.nav-collapse .nav > li > a,
	.nav-collapse .dropdown-menu a {
		padding: 9px 15px;
		font-weight: bold;
	}
	.nav-collapse .btn {
		padding: 4px 10px 4px;
		font-weight: normal;
	}
	.nav-collapse .dropdown-menu li + li a { margin-bottom: 2px }
	.nav-collapse .nav > li > a:hover,
	.nav-collapse .nav > li > a:focus,
	.nav-collapse .dropdown-menu a:hover,
	.nav-collapse .dropdown-menu a:focus { 
	
	}
	.navbar-inverse .nav-collapse .nav > li > a,
	.navbar-inverse .nav-collapse .dropdown-menu a { 
	
	}
	.navbar-inverse .nav-collapse .nav > li > a:hover,
	.navbar-inverse .nav-collapse .nav > li > a:focus,
	.navbar-inverse .nav-collapse .dropdown-menu a:hover,
	.navbar-inverse .nav-collapse .dropdown-menu a:focus { 
	
	}
	.nav-collapse.in .btn-group {
		padding: 0;
		margin-top: 5px;
	}
	.nav-collapse .dropdown-menu {
		position: static;
		top: auto;
		left: auto;
		display: none;
		float: none;
		max-width: none;
		padding: 0;
		margin: 0 15px;
		background-color: transparent;
		border: none;
		-webkit-border-radius: 0;
		-moz-border-radius: 0;
		border-radius: 0;
		-webkit-box-shadow: none;
		-moz-box-shadow: none;
		box-shadow: none;
	}
	.nav-collapse .open > .dropdown-menu { display: block }
	.nav-collapse .dropdown-menu:before,
	.nav-collapse .dropdown-menu:after { display: none }
	.nav-collapse .dropdown-menu .divider { display: none }
	.nav-collapse .nav > li > .dropdown-menu:before,
	.nav-collapse .nav > li > .dropdown-menu:after { display: none }
	.nav-collapse .navbar-form,
	.nav-collapse .navbar-search {
		float: none;
		padding: 10px 15px;
		margin: 10px 0;
	}
	.navbar .nav-collapse .nav.pull-right {
		float: none;
		margin-left: 0;
		padding: 0;
	}
	.nav-collapse,
	.nav-collapse.collapse {
		height: 0;
		overflow: hidden;
	}
	.navbar .btn-navbar { display: block }
	.navbar-static .navbar-inner {
		padding-right: 10px;
		padding-left: 10px;
	}
  
}

/*-----------------------------------------------------------------------------------*/
/*	5.	@media (min-width: 980px)
/*-----------------------------------------------------------------------------------*/

@media (min-width: 980px) {

	.nav-collapse.collapse {
		height: auto !important;
		overflow: visible !important;
	}
  
}

/*-----------------------------------------------------------------------------------*/
/*	6.	@media (max-width: 568px)
/*-----------------------------------------------------------------------------------*/

@media (max-width: 568px) {

	.light h1 { font-size: 50px; }
	.dark h1 { font-size: 50px; }
	#portfolio .item{max-width: 528px}
	#blog .image{max-width: 528px}
	.nav-collapse .nav > li { line-height: 17px; }
	.marker{width:180px; left: -45px}
	.footermarker p{text-align: center; padding: 15px 0 0 0;}
	.marker .footermarker .btn {margin: 10px 0px 12px 45px;}
}
/*-----------------------------------------------------------------------------------*/
/*	7. @media only screen and (min-width: 480px) and (max-width: 767px)
/*-----------------------------------------------------------------------------------*/
@media only screen and (min-width: 480px) and (max-width: 767px) {

	.light h1 { font-size: 50px; }
	.dark h1 { font-size: 50px; }
    .container { width: 420px; }
	.span12,
	.span11,
	.span10,
	.span9,
	.span8,
	.span7,
	.span6,
	.span5,
	.span4,
	.span3,
	.span2,
	.span1 { width: 420px; }

}

/*-----------------------------------------------------------------------------------*/
/*	7.	@media (max-width: 480px)
/*-----------------------------------------------------------------------------------*/

@media (max-width: 480px) {
	.light h1 { font-size: 50px; }
	.dark h1 { font-size: 50px; }
	.nav-collapse .nav > li { line-height: 17px; }
	#section1 h1 {
		font-size: 700%;
		line-height: 90px;
		margin: 20px 0;
	}
	#portfolio .item{max-width: 432px}
	#blog .image{max-width: 432px}
	.marker{width:180px; left: -45px}
	.footermarker p{text-align: center; padding: 15px 0 0 0;}
	.marker .footermarker .btn {margin: 10px 0px 12px 45px;}
}

/*-----------------------------------------------------------------------------------*/
/*	8.	@media (max-width: 320px)
/*-----------------------------------------------------------------------------------*/

@media (max-width: 320px) {
	.section {
		padding-right: 10px;
		padding-left: 10px;
	}
	h2 {
		font-size: 24px;
		margin: 15px 0 26px 0;
	}
	.light h1 { font-size: 50px; }
	.dark h1 { font-size: 50px; }
	.navbar .btn-navbar,
	.navbar .logo { margin: 10px 0; }
	#welcome .descr_animation h2 { font-size: 26px; }
	#slideshow li.slide {
		padding: 40px 0;
		height: 440px;
	}
	#slideshow {
		height: 510px;
		margin-top: 40px;
	}
	#slideshow ul.slides { height: 540px; }
	#section1 h1 {
		font-size: 500%;
		line-height: 90px;
		margin: 40px 0 20px 0;
	}
	#section1 h6 { padding: 0 20px; }
	#section1 h2 { font-size: 130%; }
	#section1 .emotion {
		top: -12px;
		font-size: 60%;
	}
	#section2 h1 {
		text-align: center;
		font-size: 80px;
	}
	#section2 .head1_animation {
		margin-top: 40px;
		margin-right: 50px;
		font-size: 104px;
	}
	#section2 .p_animation { font-size: 14px; }
	.img_animation img { width: 90%; }
	.navslider { bottom: 105px; }
	.testimonials { height: 300px; }
	.cite { height: 280px; }
	.cite ul { height: 280px; }
	.cite li { height: 270px;}
	#portfolio .item{max-width: 300px}
	#blog .image{max-width: 300px}
	#blog .post h2 { font-size: 20px; }
	.form_contacts .controls span.alert.alert-error {
		font-size: 12px;
		line-height: 16px;
	}
	.marker{width:180px; left: -45px}
	.footermarker p{text-align: center; padding: 15px 0 0 0;}
	.marker .footermarker .btn {margin: 10px 0px 12px 45px;}
}