/*



Theme Name:		Lavarch Productions

Theme URI:		http://www.lavarchproductions.com.au

Author: 		Philboss Design

Author URI: 	http://www.philbossdesign.com.au

Version: 		1.0

Tags:			responsive, icons, social media, hover dropdown menu, black & white, swiper slider



*/









*{margin:0; padding:0; outline:0; border:0}

.content a, .content_internal a{color:#000; font-weight:bold; text-decoration:none}

.content a:hover, .content_internal a:hover{text-decoration:underline}

img{width:100%; height:auto;}

.clearing{clear:both}

#text-2 h3{margin-bottom:10px}
#text-2 .textwidget {
    clear: both;
    color: #fff;
}

@font-face {

    font-family: 'geared_slabregular';

    src: url('fonts/gearedslab-webfont.eot');

    src: url('fonts/gearedslab-webfont.eot?#iefix') format('embedded-opentype'),

url('fonts/gearedslab-webfont.woff') format('woff'),

url('fonts/gearedslab-webfont.ttf') format('truetype'),

url('fonts/gearedslab-webfont.svg#geared_slabregular') format('svg');

    font-weight: normal;

    font-style: normal;



}



body{
	background:url(images/background.jpg);  
	color:#3c3c3c; padding:0 5%; 
	font: lighter 13px/22px Helvetica, Arial, sans-serif; 
	-webkit-text-size-adjust: 100%;
	
	
	}

h2 {font-size:16px}
p{margin-bottom:20px}


/***** Captcha *****/
.gfield_captcha_container img {
    background: none repeat scroll 0 0 #282828;
    float: left;
    max-height: 29px;
    min-height: 29px;
    padding: 8px 2%;
    width: 11%;
}
.gfield_captcha_input_container.math_small {
    float: left;
    margin-left: 7%;
    width: 48%;
}


.widthIndicator{width:100%;}



.widthIndicator {float:left;}

@media only screen and (max-width: 800px){

	.widthIndicator {float:none;}

}

.container{max-width:1120px; margin:6% auto 0; background:#f5f6f6; box-shadow:0 0 5px 1px #AAA; padding:0 40px 60px; position:relative}





.header{ margin-bottom: 0.7%}

.nav .button{background:url(images/menu-control.png) no-repeat ;background-size:200% 100%; width:40px; height:30px; display:block; float:right; margin:45px 40px 0 0}

.nav ul li:hover .button{background-position:right}

/*.nav .home{background:url(images/home.png) no-repeat ;background-size:100% 100%; width:40px; height:30px; float:left; display:block; margin: 47px 0 40px 30px;}*/

h3{font:22px 'geared_slabregular'; color:#FFF; text-transform:uppercase; margin:45px 0 50px; float:left; line-height: 37px;}



.logo{max-width:340px; width:40%; margin:-4% 0 1.5%; float:left; min-width:260px}

.nav{max-width:290px;max-height: 10px; width:100%; position:absolute; z-index:2; right:0}

.nav ul{list-style:none}

.nav ul ul{clear:both}

.nav ul .main-menu{background:url(images/menu-background.png); padding:0 40px; height:0px; visibility:hidden;opacity: 0 ; transition: opacity 0.2s ease;}

.nav ul li:hover .main-menu{height:2116px; visibility:visible;opacity:1;}

.nav ul ul li a{color:#FFF; text-decoration:none; height:40px; line-height:40px; border-bottom:1px solid #282828; display:block; padding:0 10px; background:url(images/menu-arrow.png) 190px 15px no-repeat;transition: all 0.2s linear}

.nav ul li p{font-size:13px; color:#FFF; clear:both; margin-bottom:20px}

.nav ul ul li:first-child a{border-top:1px solid #282828}

.nav ul ul li a:hover{background:#646464 url(images/menu-arrow.png) 190px 15px no-repeat; }



.mobile-menu, .trigger{display:none}







.raster{position:relative}

.raster img{position:absolute}



.raster-hover{position:relative; visibility:hidden; opacity:0; transition:all 0.3s linear}

.raster-hover img{position:absolute; z-index:4}

 a:hover .raster-hover{visibility:visible; opacity:1}



h1{background:url(images/divider.jpg) center bottom repeat-x; padding:15px 0;  font:28px 'geared_slabregular'; color:#282828; text-transform:uppercase; margin-bottom:30px; clear:both}





.intro{float:left; max-width:250px; margin-right:1.6%; width:20.3%}

	.navigation{margin-top:20px}

	.navigation .alignright a{background:url(images/next-arrow.png) no-repeat; background-size: 200% 100%; height:50px; width:50px; display:block; float:left; text-indent:-9999px; margin-left:5px}

	.navigation .alignright a:hover{background-position:right}

	.navigation .alignleft a{background:url(images/prev-arrow.png) no-repeat; background-size: 200% 100%; height:50px; width:50px; display:block; float:left; text-indent:-9999px}

	.navigation .alignleft a:hover{background-position:right}

		

	/*Projects nav internal page*/

	

	

	.project-controls2{margin-top:20px}

	.project-controls2 .next{background:url(images/next-arrow.png) no-repeat; background-size: 200% 100%; height:50px; width:50px; display:block; float:left; text-indent:-9999px; margin-left:5px}

	.project-controls2 .next:hover{background-position:right}

	.project-controls2 .prev{background:url(images/prev-arrow.png) no-repeat; background-size: 200% 100%; height:50px; width:50px; display:block; float:left; text-indent:-9999px}

	.project-controls2 .prev:hover{background-position:right}	

		

.projects{float:left; max-width:830px; margin-bottom:40px; width:76%}



.projects h2{color:#282828; margin-top:20px}

.projects em{font-size:12px; color:#969696; margin-bottom:10px; display:block}

.projects ul{list-style:none}

.projects ul li{float:left; max-width:250px; margin-left:5%; width:30%}

.projects ul li:first-child{margin-left:0}

.projects ul li a{font-weight:bold; text-decoration:none; color:#3c3c3c}

.projects ul li a:hover{text-decoration:underline}







/*----------- Swiper ------------*/



/*

 * Swiper - Mobile Touch Slider CSS

 * http://www.idangero.us/sliders/swiper

 *

 * Vladimir Kharlampidi, The iDangero.us

 * http://www.idangero.us/

 * 

 * Copyright 2012-2013, Vladimir Kharlampidi

 * The iDangero.us

 * http://www.idangero.us

 *

 * Licensed under GPL & MIT

 *

*/



/* ===============================================================

Basic Swiper Styles 

================================================================*/

.hero .mobile-slider {display:none;}

.rsUni, .rsUni .rsOverflow, .rsUni .rsSlide, .rsUni .rsVideoFrameHolder, .rsUni .rsThumbs {

    background: #f5f6f6 !important;
	z-index: 1 /*this fixes the issue where images cannot be swiped due to being shielded by the bullets */;
	
	}



.slide a{width:100%;height:100%; display:block;}

.slide img{height:auto}



.main-slider .rsUni .rsBullets {
		height: 40px ;
		z-index: 0;
		text-align:right;
		position:absolute;
		/* padding-top: 38%;  use padding instead of margin to fix browser consistency issue , however, must set z-index of the main slider to be higher than the bullet's index because padding overlays whereas margin does not */
		cursor:pointer;
		margin-top:410px

		

	}


@media only screen and (max-width:900px) {
	.main-slider .rsUni .rsBullets {
		padding-top: 38.3%;
	}

}

@media only screen and (max-width:800px) {

	.main-slider .rsUni .rsBullets {
		padding-top: 38.6%;
	}
}



@media only screen and (max-width:700px) {

	.main-slider .rsUni .rsBullets {
		padding-top: 38.8%;
	}
}



@media only screen and (max-width:600px) {
	.main-slider .rsUni .rsBullets {
		padding-top: 38.9%;
	}
}


@media only screen and (max-width:500px) {

	.main-slider .rsUni .rsBullets {
		padding-top: 39.3%;
	}
}



@media only screen and (max-width:400px) {

	.main-slider .rsUni .rsBullets {
		padding-top: 39.3%;
	}
}



.main-slider .rsUni .rsBullet {
		width: 10%;
		margin-left: 1%;
		max-width: 80px;
		height: 50%;
		padding: 0;
	}



.main-slider .rsUni .rsBullet span{

		border-radius: 0;

		width: 100%;

		height: 100%;

	}



.main-slider .rsUni .rsBullet.rsNavSelected span	{background: #282828}

.swiper-container {

        margin:0 auto;

        position:relative;

        overflow:hidden;

        -webkit-backface-visibility:hidden;

        -moz-backface-visibility:hidden;

        -ms-backface-visibility:hidden;

        -o-backface-visibility:hidden;

        backface-visibility:hidden;

        /* Fix of Webkit flickering */

        z-index:1;

}

.swiper-wrapper {

        position:relative;

        

        -webkit-transition-property:-webkit-transform, left, top;

        -webkit-transition-duration:0s;

        -webkit-transform:translate3d(0px,0,0);

        -webkit-transition-timing-function:ease;

        

        -moz-transition-property:-moz-transform, left, top;

        -moz-transition-duration:0s;

        -moz-transform:translate3d(0px,0,0);

        -moz-transition-timing-function:ease;

        

        -o-transition-property:-o-transform, left, top;

        -o-transition-duration:0s;

        -o-transform:translate3d(0px,0,0);

        -o-transition-timing-function:ease;

        -o-transform:translate(0px,0px);

        

        -ms-transition-property:-ms-transform, left, top;

        -ms-transition-duration:0s;

        -ms-transform:translate3d(0px,0,0);

        -ms-transition-timing-function:ease;

        

        transition-property:transform, left, top;

        transition-duration:0s;

        transform:translate3d(0px,0,0);

        transition-timing-function:ease;

}

.swiper-free-mode > .swiper-wrapper {

        -webkit-transition-timing-function: ease-out;

        -moz-transition-timing-function: ease-out;

        -ms-transition-timing-function: ease-out;

        -o-transition-timing-function: ease-out;

        transition-timing-function: ease-out;

        margin: 0 auto;

}

.swiper-slide {

        float: left;

}



/* IE10 Windows Phone 8 Fixes */

.swiper-wp8-horizontal {

        -ms-touch-action: pan-y;

}

.swiper-wp8-vertical {

        -ms-touch-action: pan-x;

}



/* ===============================================================

Your custom styles, here you need to specify container's and slide's

sizes, pagination, etc.

================================================================*/

.swiper-container {

        /* Specify Swiper's Size: */



  

	 width:78%;

	

        

}

.swiper-slide {

        /* Specify Slides's Size: */

        

        

		

        

}

.swiper-slide-active {

        

		

        

}

.swiper-slide-visible {

          

		  



}

/* ===============================================================

Pagination Styles

================================================================*/

.swiper-pagination-switch {

        /* Stylize pagination button: */        



}

.swiper-active-switch {

        /* Specific active button style: */        

        

}

.swiper-visible-switch {

        /* Specific visible button style: */        

        

}



.swiper-slide .slide {margin-left: 15%;

    }





.swiper-container h2{color:#282828; margin-top:20px}

.swiper-container em{font-size:12px; color:#969696; display:block; margin-bottom:10px}





.swiper-container a{font-weight:bold; text-decoration:none; color:#3c3c3c; display:inline;}

.swiper-container a:hover{text-decoration:underline}





			/*---------------Pagination----------------*/

			.pagination {

			  position: absolute;

			  z-index: 20;

			  left: 10px;

			  bottom: 10px;

			  display: none;

			}

			.swiper-pagination-switch {

			  display: inline-block;

			  width: 8px;

			  height: 8px;

			  border-radius: 8px;

			  background: #222;

			  margin-right: 5px;

			  opacity: 0.8;

			  border: 1px solid #fff;

			  cursor: pointer;

			}

			.swiper-visible-switch {

			  background: #aaa;

			}

			.swiper-active-switch {

			  background: #fff;

			}

			

			/*----------------Arrows ----------------*/

			 .arrow-left {

			  background: url(css/img/arrows.png) no-repeat left top;

			  position: absolute;

			  left: 10px;

			  top: 50%;

			  margin-top: -15px;

			  width: 17px;

			  height: 30px;

			}

			 .arrow-right {

			  background: url(css/img/arrows.png) no-repeat left bottom;

			  position: absolute;

			  right: 10px;

			  top: 50%;

			  margin-top: -15px;

			  width: 17px;

			  height: 30px;

			}

			



.process ul{list-style:none}

.process ul li{float:left; width:44.6%; max-width:500px; margin:30px 2.6% 0 ;}

.process ul li .img_wrapper {float:left; width: 25%; max-width:125px; }



.process ul li h2{margin:6% 0 10px}

.process ul li .process_wrapper { width: 73%; margin-left: 27%}





.footer {max-width:1120px; padding:30px 40px 0; margin: 0 auto; background: #3E3E3E; color: #c8c8c8; clear:both; box-shadow:0 4px 3px 3px #AAA;}

.footer h1 {font:28px 'geared_slabregular';color: #fff; margin-bottom: 40px; background:none; padding:0;}

.footer h2 {color: #fff; font-weight: normal; margin-bottom: 10px;}

.footer .about{ float: left; width: 48.2%; max-width:540px; margin:0 3.5% 5% 0;}

.footer .about li {list-style:none; margin-bottom:25px}

.footer .about ul img { float:left; max-width:103px; margin-right:5%; width:20%; height:auto; clear:both}

.footer .about ul {list-style:none}

/*.footer .about ul li{margin: 25px 0 0 15px}*/

.profile_outer{margin-bottom:8%}

.profile_wrap {
    float: left;
    width: 75%;
}

.footer .about ul li .profile_wrap{max-width: 400px; width:75%; float:left}



.footer .form {float: left; max-width: 540px; width:48.3%; margin-bottom:5%}

.footer .form ul, .footer .form li{list-style:none;}

.footer .form ul li{  float:left; width:48.2%; max-width: 260px;  margin-bottom:15px; }

.footer .form ul li#field_1_5{width:100%;max-width:540px}

.footer .form ul li#field_1_1, .footer .form ul li#field_1_3, .footer .form ul li#field_1_6{margin-right:3.6%}

.footer .form ul li input {background: #282828; width: 95%; height: 45px; color: #fff; font-size: 14px;  font-family:"Helvetica Neue", Helvetica, Arial, sans-serif; padding-left: 5%; transition: all 0.2s linear;}

/*.footer .form ul li input:focus {border: #fff 1px solid; box-shadow: 0px 0px 6px #fff;}*/

.footer .form .gfield_error input, .footer .form .gfield_error textarea{ border: 1px solid #4b0b17 ;background: #ff3259;  color: #fff; transition: all 0.2s linear; }

/*.footer .form .gfield_error .medium:focus { box-shadow: 0px 0px 6px #ff3259; }*/

.footer .form .validation_error { color: #fff; margin-bottom: 20px; font-weight: lighter; font-size: 13px;}

.footer .form textarea {max-width: 540px; width: 97%; background: #282828; height: 135px;  color: #fff; font-size: 15px; padding:5% 0 0 3%; font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;transition: all 0.2s linear;}

/* .footer .form textarea:focus { box-shadow: 0px 0px 6px #fff;} */			

.footer .form label {color: #fff;}

.footer .form label em {color:#969696}

.footer .form .gform_button { margin-top: 22px; background: #dadada; color: #282828; width:35%; max-width: 150px; height: 45px; border-radius: 3px; font-weight:bold; color:#282828; font-size: 14px;text-shadow: 1px 1px #fff; letter-spacing: -.5px; cursor:pointer; -webkit-appearance: none;

   -moz-appearance: none;

   appearance: none;  }

@media only screen and (max-width:768px) {
.footer .form .gform_button{width:45%; max-width: 200px}
}

@media only screen and (max-width:320px) {
.footer .form .gform_button {
    max-width: 260px;
    width: 100%;
}
}

#gform_ajax_spinner_1{width:16px; height:16px; margin-left: 20px; display:none; }

.copyright {background:#282828; max-width:1120px; padding: 0 40px; margin: 0 auto 6%; color: #fff; border-top: 1px solid #5d5d5d; box-shadow:0px 4px 3px 2px #AAAAAA}

.copyright a, .textwidget a{color:#FFF; text-decoration:none}

.copyright a:hover, .textwidget a:hover{text-decoration:underline}

.copyright p {float: left; width:60%; margin:28px 0; font-size:12px; color:#C8C8C8}

.copyright ul {list-style:none; float:right; margin:25px 0 15px}

.copyright ul li {float:left;}

.copyright ul li img  {width:30px; height: 30px; margin-left: 5px;}



@media only screen and (max-width:850px) {

	.nav .button, .nav h3, {margin-top:35px}
	

}



@media only screen and (max-width:768px) {

	body{background:#f5f6f6; padding:0}

	.container{box-shadow:none; padding:0 20px 60px; margin:0 auto}

	.logo{margin:2% 0 4%}	

	.nav .button{margin:68px 20px 0}
	

	h3{margin:68px 0 52px}

	.nav ul .main-menu{padding:0 20px}

	.nav ul li:hover .main-menu{height:2096px}

	.nav ul ul li a{background-position:230px 15px}

	.project-controls2 .next , .project-controls2 .prev ,.navigation .alignright a , .navigation .alignleft a{height:30px; width:30px}

	

	.blurb .navigation {margin-bottom: 80px;}

	.process ul li {margin:10px 2% 0; width:21%}

	.process ul li h2, .projects h2{font-size:16px}

	.process ul li .img_wrapper {margin:0 auto; float:none; width:60%}

	.process ul li .process_wrapper {margin-left:0; text-align:center; width:100%}

	.footer{padding:30px 20px 0}

	.footer .form ul li{width:100%; max-width:none; float:none}

	.copyright{box-shadow:none; margin:0 auto; padding:0 20px}

	.footer .form ul li#field_1_1, .footer .form ul li#field_1_3{margin-right:0}

	.footer .about ul li .profile_wrap{float:none; width:100%}

	.footer .about ul li{margin-left:0}

}



@media only screen and (max-width:680px) {



	.intro {

		float:none;

   		 max-width:1120px;

    	width: 100%;

		margin-right:none;



		height: 100%;

	

	}

	

	.intro .para{

		float:left;

		width:75%;

		margin-right: 5%;

		margin-bottom: 20px;

	}

	

	.intro .project-controls2{

			

			width: 20%;

			margin-top:0;

			margin-bottom: 20px;

			float:right;

	}

	

		.project-controls2 .float_right{

			float:right;

		}

		

	.swiper-container{

		width:100%;

		clear:both;

		

	}

}



@media only screen and (max-width:600px) {

.nav .button{margin:65px 20px 0}


}





@media only screen and (max-width:520px) {

	.hero .main-slider,.nav{display:none}

	

	.hero .mobile-slider, .mobile-menu, .trigger{display:block}

	

	
	.logo{margin:5% 0 4%}

	.projects{width:54%}

	.projects ul li{width:100%; margin:0 0 15%; max-width:auto}

	.intro{margin-right:3%; width:43%}

	.projects h2{margin-top:10px}

	.process ul li{width:46%}

	.process ul li .img_wrapper{width:40%}

	

	

	.intro {

		float:none;

   		 max-width:1120px;

    	width: 100%;

		margin-right:none;



		height: 100%;

	

	}

	

	.intro .para{

		float:left;

		width:75%;

		margin-right: 5%;

		margin-bottom: 20px;

	}

	

	.intro .project-controls2{

			

			width: 20%;

			margin-top:0;

			margin-bottom: 20px;

			float:right;

	}

	

		.intro .project-controls2 .float_right{

			float:right;

		}

		

	.swiper-container{

		width:100%;

		clear:both;

		

	}

}



@media only screen and (max-width:400px) {

	.footer .about, .footer .form, .copyright p{width:100%}

	.copyright ul{margin:0 0 25px}

	.copyright ul li img{margin:0 5px 0 0}

	.copyright ul{float:left}

}



@media only screen and (max-width:380px) {

	.intro {

		float:none;

   		max-width:1120px;

    	width: 100%;

		margin-right:none;



		height: 100%;

	

	}

	

	.intro .para{

		

		width:100%;

		

		margin-bottom: 20px;

	}

	

	.intro .project-controls2{

			

			width: 100%;

			margin-top:0;

			margin-bottom: 20px;

			

	}

	

		.intro .project-controls2 .float_right{

			float:left;

		}

		

	.swiper-container{

		width:100%;

		clear:both;

		max-height:auto;

	}

	

	

}





@media only screen and (max-width:320px) {

	.intro, .projects, .process ul li{width:100%}

	.intro, .process ul li{margin-bottom:10%}

	.projects{margin-bottom:0}

	.container, .footer, .copyright{padding-left:30px; padding-right:30px}

	.footer .form{margin-bottom:12%}

	.logo{margin:6% 0 8%}
	
	.logo img {width: 95%;}

	.trigger{right:30px !important} 

	

	.swiper-slide .slide {

    margin-left: 0;

}

}



/***** Mobile Slide Menu *****/


#cbp-spmenu-s2 .menu-main-menu-container {
	clear:both;
    height: 225px;

    margin-bottom:10px;

    overflow:auto;
	


}



.mobile-menu{background: #000; position: fixed}

.mobile-menu ul{list-style:none}

.mobile-menu ul li a{height:40px; line-height:40px; text-decoration:none; background:#222 url(images/menu-arrow.png) 92% 50% no-repeat; padding:0 20px; border-bottom:1px solid #000000; transition: all 0.2s linear;}

.mobile-menu ul li a:hover{background:#646464 url(images/menu-arrow.png) 92% 50% no-repeat}

.trigger {position:fixed; right:20px; top:8px; z-index:99}

.trigger button{background:url(images/trigger-tag.jpg); height:34px; width:40px; font-size:0; cursor:pointer}



.mobile-menu h3 {

	color: #FFF;

	font-size: 1.9em;

	padding: 20px;

	margin: 0;

	font-weight: 300;

	background: #000;

	float:left;

}

.mobile-menu .home{
	background:url(images/home.png) no-repeat ;background-size:100% 100%; width:60px; height:45px; display:block; float:right; margin:12px 5px 0
		
}
	

.cbp-spmenu a {

	display: block;

	color: #fff;

	font-size: 1.1em;

	font-weight: 300;

}



/* Orientation-dependent styles for the content of the menu */



.cbp-spmenu-vertical {

	width: 100%;

	top: 0;

	z-index: 1000;

}



.cbp-spmenu-horizontal {

	width: 100%;

	height: 150px;

	left: 0;

	z-index: 1000;

	overflow: hidden;

}



.cbp-spmenu-horizontal h3 {

	height: 100%;

	width: 20%;

	float: left;

}



.cbp-spmenu-horizontal a {

	float: left;

	width: 20%;

	padding: 0.8em;

	border-left: 1px solid #258ecd;

}



/* Vertical menu that slides from the left or right */



.cbp-spmenu-right {

	top: -304px;

}



.cbp-spmenu-right.cbp-spmenu-open {

	top:0px;

}



/* Push classes applied to the body */



.cbp-spmenu-push {

	overflow-x: hidden;

	position: relative;

	top: 0;

}



.cbp-spmenu-push-toleft {

	top: 310px;

}

.cbp-spmenu-push-toleft .trigger{

top: 312px;

}



/* Transitions */



.cbp-spmenu,

.cbp-spmenu-push, .trigger {

	-webkit-transition: all 0.3s ease;

	-moz-transition: all 0.3s ease;

	transition: all 0.3s ease;

}



/* Example media queries */



@media screen and (max-width: 55.1875em){



	.cbp-spmenu-horizontal {

		font-size: 75%;

		height: 110px;

	}



	.cbp-spmenu-top {

		top: -110px;

	}



	.cbp-spmenu-bottom {

		bottom: -110px;

	}



}



@media screen and (max-height: 26.375em){



	.cbp-spmenu-vertical {

		font-size: 90%;

		width: 190px;

	}



	.cbp-spmenu-left,

	.cbp-spmenu-push-toleft {

		left: -190px;

	}



	.cbp-spmenu-right {

		right: -190px;

	}



	.cbp-spmenu-push-toright {

		left: 190px;

	}

}





/*------------------ Internal Page CSS ------------------*/



.content_internal{background: url("images/divider.jpg") repeat-x scroll top left rgba(0, 0, 0, 0);max-width:1120px; margin: auto 0; padding:5% 0 0 }





/*------ Left collumn -----*/

	.blurb {float: left;

    font-size: 12px;

    font-weight: lighter;

    margin-right: 6%;

    max-width: 370px;

    width: 28.8%;}

	

	

	.content_internal ul{list-style:none; }

	.blurb .description p {margin-bottom: 4%;}

	

	

		

	

	

	.content_internal h1{ background:none; font-size:40px; line-height: 35px; padding-bottom: 0px; margin-bottom: 15px;}

	.content_internal .blurb .project_date {background: #666666; color:#f5f6f6; font-size: 12px; text-align: center; display:inline;padding: 7px 12px 4px; }

	

	.otherinfo  img {width: 25px; height: 25px; float:left; margin-right: 10px  ;}

	.otherinfo  h2 {line-height: 30px;}

	.otherinfo .role p, .otherinfo .cast ul, .otherinfo .location p {clear:both; margin: 4% 0 9%; font-weight:lighter;}

	.otherinfo .cast ul li strong {font-weight:bold}

	

	

		





.otherinfo {background: url("images/divider.jpg") repeat-x scroll top left    ; padding-top: 5%; margin-top: 5%; max-width: 370px; width:28.8%; float:left; }





/*------ Right column -----*/



	.gallery {max-width: 730px; width: 65.2%; float:right; min-height:650px}
	.gallery h2{margin-bottom:5px}
	.profile .gallery{min-height:inherit}

	.gallery img{ margin-bottom: 6%;height: auto;}

	

	.video {

    margin-bottom: 6%;

}











	

@media only screen and (max-width:700px) {

	.blurb{float:none; max-width:1120px; width:100%}
	.profile .blurb{width:28.8%; float:left}

	.otherinfo{ max-width:1120px;width:100%;margin-top:2%; padding-top:5%;}

		.otherinfo .role, .otherinfo .cast, .otherinfo .location{float:left; width:30%; margin-right: 5%; font-size: 12px;}

		.otherinfo .location{margin-right:0}

		

	.gallery{float:none; max-width:1120px;width:100%;min-height:inherit}
	.profile .gallery{width:65.2%; float:left}


}
@media only screen and (max-width:480px) {
.content_internal .gallery h1{text-align:center}
.profile .gallery{width:100%; float:none}
.profile .blurb{width:60%; float:none; margin:0 auto}
}
@media only screen and (max-width:320px) {
.content_internal.profile{text-align:left}
.profile .blurb{width:70%; margin:5% auto}
.profile .gallery h1{font-size:36px}
}





@media only screen and (max-width:680px) {



	

	

		

	.swiper-container{

		width:100%;

		clear:both;

		margin-top: 60px;

	}

}



@media only screen and (max-width:650px) {

	

	

		.otherinfo .role {float:none; width:100%; margin-right: 0; font-size: 12px;}

		.otherinfo .cast{float:left; width:35% ; margin-right: 5%; font-size: 12px;}

		.otherinfo .location{float:left; width:60% ; font-size: 12px;}

		

		

		.otherinfo .role p, .otherinfo .cast ul, .otherinfo .location p{margin: 2% 0 4%;}

		

	.gallery{float:none; max-width:1120px;width:100%

}



@media only screen and (max-width:560px) {

	

	

		.otherinfo .role,.otherinfo .cast,.otherinfo .location { font-size: 11px;}

		

		

		

		

}



@media only screen and (max-width:510px) {

	.otherinfo .role,.otherinfo .cast,.otherinfo .location { font-size: 12px;}

	.otherinfo .role {float:none; width:100%; margin-right: 0; }

		.otherinfo .cast{float:none; width:100% ; margin-right: 0; }

			.otherinfo .cast li{ float:none; width: 100%;}

			.otherinfo .cast .first {margin-right:0%}

			

		.otherinfo .location{float:none; width:100%;  margin-top: 10px;}

		

		

}


/*@media only screen and (max-width:425px) {

	.otherinfo .role,.otherinfo .cast,.otherinfo .location { font-size: 12px;}

	.otherinfo .role {float:none; width:100%; margin-right: 0; }

		.otherinfo .cast{float:none; width:100% ; margin-right: 0; }

			.otherinfo .cast li{ float:left; width: 30%;}

			.otherinfo .cast .first {margin-right:25%}

			

		.otherinfo .location{float:none; width:100%;  }

		

		

}



@media only screen and (max-width:320px) {

	.otherinfo .role,.otherinfo .cast,.otherinfo .location { font-size: 12px;}

	.otherinfo .role {float:none; width:100%; margin-right: 0; }

		.otherinfo .cast{float:none; width:100% ; margin-right: 0; }

			.otherinfo .cast li{ float:left; width: 45%;}

			.otherinfo .cast .first {margin-right:10%}

			

		.otherinfo .location{float:none; width:100%; }

		

		

}*/
}

.content_internal .gallery ul {
    list-style: square;
    margin: 0 0 20px 20px;
}