/*! normalize.css v1.1.3 | MIT License | git.io/normalize */
/* This is the minified normalize.css so we can save a request. There is no need to change anything here.
   It simply sets some default options.
*/


/*	==========================================================================
 *	Add Fonts here. These are just opensource sample fonts.
 *	========================================================================== */
@font-face {
	font-family: 'NeuzeitSLTStdBook';
	src: url('../fonts/nuezeit/neuzeitsltstd-book-webfont.eot');
	src: url('../fonts/nuezeit/neuzeitsltstd-book-webfont.eot?#iefix') format('embedded-opentype'),
	url('../fonts/nuezeit/neuzeitsltstd-book-webfont.woff') format('woff'),
	url('../fonts/nuezeit/neuzeitsltstd-book-webfont.ttf') format('truetype'),
	url('../fonts/nuezeit/neuzeitsltstd-book-webfont.svg#NeuzeitSLTStdBook') format('svg');
	font-weight: normal;
	font-style: normal;

}

@font-face {
	font-family: 'NeuzeitSLTStdBookHeavy';
	src: url('../fonts/nuezeitH/neuzeitsltstd-bookheavy-webfont.eot');
	src: url('../fonts/nuezeitH/neuzeitsltstd-bookheavy-webfont.eot?#iefix') format('embedded-opentype'),
	url('../fonts/nuezeitH/neuzeitsltstd-bookheavy-webfont.woff') format('woff'),
	url('../fonts/nuezeitH/neuzeitsltstd-bookheavy-webfont.ttf') format('truetype'),
	url('../fonts/nuezeitH/neuzeitsltstd-bookheavy-webfont.svg#NeuzeitSLTStdBookHeavy') format('svg');
	font-weight: normal;
	font-style: normal;

}






/*CONTROLS THE COLOR OF THE FONTS ON MOBILE DEVICES - MAKE SURE TO GIVE THEM SPAN TAGS FIRST*/
          
		.appleLinks a {color: #fff;
		text-decoration: none;
		font-family: 'NeuzeitSLTStdBookHeavy';
		}


		.appleLinksCT a {
		color: rgba(39,86,76,1.00);
		text-decoration: none;
		font-family: 'NeuzeitSLTStdBookHeavy';
		}
		
		
		/*********THIS IS VERY IMPORTANT --- CORRECTS PADDING ON ALL DIVISIONS- drotar css3 page 447**/
*{
	-moz-box-sizing: border-box;
	box-sizing: border-box;	
}
	
	
/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html,
button,
input,
select,
textarea {
    color: #222;
}

html {
    font-size: 1em;
    line-height: 1.4;
	
	/*ADDED HERE***************************/
	position: relative;
	min-height:100%;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

/*
 * Remove the gap between images, videos, audio and canvas and the bottom of
 * their containers: h5bp.com/i/440
 */

audio,
canvas,
img,
video {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Browse Happy prompt
   ========================================================================== */

.browsehappy {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/* ==========================================================================
   START - THOMAS DROTAR - ANY SCREEN LAYOUT
   These rules here apply to ANY screen!
   ========================================================================== */

body {
	background-color: #111;
	overflow-x: hidden;
	padding-top: 1px;
	margin-top: -1px;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.4;
	font-family: bebas-neue;
	margin: 0 0 100px;
	font-style: normal;
}

h1, h2, h3, h4, h5, h6, * {
	font-weight: normal;
}

/*CONTROLS H2 SUBJECT TITLES*/
.title {
	font-size: 1.5em;
	font-weight: 100;
	text-transform: uppercase;
	font-family: 'NeuzeitSLTStdBook', sans-serif;
	text-shadow: 1px 1px 1px rgba(0,0,0,1.00);
	color: #000;
	text-align: center;
	letter-spacing: 1px;
	margin-top: -0px;   /*CONTROLS THE DISTANCE BETWEEN THE H2 & BACKGROUND PLATE*/	
	border-bottom: 1px solid white;	
}


p {
	font-size: 1em;
	color: #000;
	font-weight: 300;
	/*text-transform: uppercase;*/
	font-family: 'NeuzeitSLTStdBook', sans-serif;
	letter-spacing: .05em;
	text-shadow: 1px 1px 1px #666;	
}

 /*TEXT TRANSFORM UPPERCASE FOR PHONE BUTONS BELOW*/

.list {
	font-size: 1.1em;
	color: #000;
	font-weight: 300;
    text-transform: uppercase;
	font-family: 'NeuzeitSLTStdBook', sans-serif;
	letter-spacing: 0em;
	text-shadow: 1px 1px 1px #666;	
	padding-top: 0px;
	list-style-position: outside;
	list-style-type: square;
}



input[type=checkbox].mobileMenuButton {
	position: absolute;
	top: -9999px;
	left: -9999px;
}

input.mobileMenuButton ~ *,
input.mobileMenuButton ~ header h1,
input.mobileMenuButton ~ footer p {
	-webkit-transition: left 300ms;
	transition: left 300ms;
	left: 0;
}

/*****************************************X COLOR IN MOBILE MENU*/
input.mobileMenuButton:checked ~ *,
input.mobileMenuButton:checked ~ header h1,
input.mobileMenuButton:checked ~ footer p {
	left: 200px !important;
	font-family: NeuzeitSLTStdBook;
	text-transform: uppercase;
	font-style: normal;
	font-weight: 400;
	/*color: green;*/
	color: #A0A0A0;
	
}

input.mobileMenuButton ~ .pageContent {
	position: relative;
}

input.mobileMenuButton:checked ~ label.mobileMenuCloseButton {
	left: 0 !important;
}

label.mobileMenuButton {
	display: block;
	position: fixed;
	color: white;
	font-size: 50px;
	line-height: 0;
	background: #000;
	height: 60px;
	width: 60px;
	cursor: pointer;
	z-index: 10000;
}

label.mobileMenuButton:after {
	position: absolute;
	top: 25px;
	left: 16px;
	content: "\2261";
}

/*CHANGE HEIGHT OF MOBIL BUTTON BELOW*/

label.mobileMenuCloseButton {
	display: block;
	position: fixed;
	color: white;
	font-size: 20px;
	line-height: 0;
	background: #000;
	height: 58px;
	width: 60px;
	cursor: pointer;
	z-index: 10000;
	left: -200px;
}

label.mobileMenuCloseButton:after {
	position: absolute;
	top: 33px;
	left: 23px;
	content: "X";
}


header {
	position: fixed;
	top: 0;
	height: 60px;
	width: 100%;
	z-index: 9999;
	font-family: "NeuzeitSLTStdBookHeavy", sans-serif;	
}

/* the background of the header */
header:after {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(255,255,255,.7); /*CONTROLS COLOR OF MOBILE HEADER*/
	opacity: 0.5;
	content: "";
	z-index: -1;
}

header nav {
	position: absolute;
	width: 200px;
	left: -200px;
}

header nav ul {
	margin: 0;
	width: 200px;
	padding: 0
}

header nav li {
	display: inline-block;
	width: 100%;
	border-bottom: solid 1px #ccc;
}

header nav a {
	display: block;
	padding: 8px 30px;
	text-decoration: none;
	color: white;
	background-color: #000;
}

header nav a:hover,
header nav .active a {
	background: #333;
	
}

header nav .active a  {	
	color: #E5CD7A;
	text-transform: uppercase;
	
  }
	
	header nav .active a:hover {
	/* color: red;*/
 	
}



header h1 {
	margin: 15px auto;
	width: 144px;
	height: 29px;
	/*background: url( '../img/logo.png') no-repeat 0 0;*/

}

/***************FOOTER INFO MOBILE******************/

footer {
	/*clear: both;*/
	position: absolute;
	left: 0;
	padding: 0em 0;
	z-index: 9998;
	bottom: 0;
	width: 100%;
	height: 50px;
	text-align: center;
}

.footerL {
	width: 50%;
	/*border: solid green 1px;*/
	float: left;
}

.footerP {
	margin: 0;
	font-family:"bebas-neue";
	font-weight: 100;
	color: white;
	float: left;
	font-size: 1.1em;
	margin-left: 15px;
	margin-top: 10px;
	text-align: left;
	/*text-transform: uppercase;*/
	text-shadow: 1px 1px 2px rgba(0,0,0,1);
}

.footerC {
	display:none;
	}



.footerR {
	width: 45%;
	/*border: solid yellow 1px;*/
	float: right;
	text-align: right;
	font-style: normal;
	font-weight: 400;
}


/*PHONE NUMBER RIGHT SIDE OF FOOTER*/
.footerPr {
	margin: 0;
	font-family:"bebas-neue";/*font-family: 'NeuzeitSLTStdBookHeavy';*/
	font-weight: 100;
	color: white;
	font-size: 1.2em;
	/*margin-left: 15px;*/
	margin-top: 10px;
	margin-right: 25px;
	text-transform: uppercase;
	text-shadow: 1px 1px 2px rgba(0,0,0,1);
	float: right;  /*JUSTIFIES PHOTO TO RIGHT SIDE*/

}


/* the background of the footer */
footer:after {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: #000;
	opacity: .5;
	/*background-color: pink;*/
	background-color: rgba(0,0,0,1); /*CONTROLS COLOR OF MOBILE FOOTER*/
	content: "";
	z-index: -1;
}


/***************FOOTER INFO FINISH******************/



.pageContent {
	margin: 80px 10px 10px 10px;
	position: relative !important;
	/*clear: both;*/
}

.indexPageVideoLeft {
	display: block;
	float: left;
	width: 100%;
	background-color: rgba(255,0,4,0.0);
	height: 130px;	
}

#animationTopLeft{
		float: left;
		display: block;
		width: 100%;
		height: 100%;
	}	



.indexPageVideoCenterLeft {
	/*clear: both;*/
	display:none;
	float: left;
	width: 100%;
	background-color: rgba(255,4,0,0.0);
	/*background-color: pink;*/
	height: 300px;
}



.indexPageVideoCenter {
	display: block;
	float: left;
	width: 100%;
	background-color: rgba(255,227,0,.00);
	margin: auto;
	border: 2px #bbb solid;
	
	
}

#indexAnimationCenter{
	display: none;
}

/*JEFFERSON MILLER LOGO TURNED OFF ABOVE 769*/
#animationTopCenter{
	width: 100%;
	height: 100%;
}

.indexPageVideoRight {
	/*display: none;
	float: right;
	width: 15%;
	background-color: rgba(255,0,0,0.60);
	height: 20px;*/
	display: none;	
}
#animationTopRight{
	width: 100%;
	height: 100%;
}



/*SIZZLE REEL TEXT STARTS HERE*/


.pageContentSizzleReel {
	clear: both;
	margin: 0px 10px 0px 10px;
	/*clear: both;*/
}

.indexPageVideoLeftSR {
	display: block;
	float: left;
	width: 12%;
	/*background-color: orange;*/
	height: 10px;	
}

.indexPageVideoCenterSR {
	display: block;
	float: left;
	width: 88%;
	/*background-color: pink;*/
	height: 2px;		
}

.ppSR{
	/*font-height:1.25;*/
	color: rgba(255,255,255, 1);
	text-transform: uppercase;
	font-size: 1em;
	font-family:"NeuzeitSLTStdBook";
	/*font-weight: 100;*/
	/*text-shadow: 1px 1px 1px rgba(0,0,0,.50);*/
	padding: .0em 0px 0 30px;	
	text-align: right;
	letter-spacing: 3px;
	margin-top: 1px;
}

.indexPageVideoRightSR {
	display: block;
	float: left;
	width: 0%;
	/*background-color: yellow;*/
	height: 10px;	
}





/* INDEX  START OF SECOND PAGE WITH ANIMATION CENTERED FOR SMART PHONES */
.pageContent.secondary {
	clear:both;
	margin: 70px 10px 20px 10px;	
}

.indexPage2left {
	display: inline-block;
	float:left;
	width: 1%;
	background-color: rgba(255,0,0,.0);
	height: 100px;
}

.indexPage2center {
	display: inline-block;
	float:left;
	width: 98%;
	height: 80px;
	margin-bottom: 10px; /*CONTROLS THE HEIGHT FROM THE NEXT BOX BELOW*/
	margin-top: 20px; /*CONTROLS THE HEIGHT FROM THE NEXT BOX BELOW*/
	background-color: rgba(39,86,76,.00);
}

	#indexAnimation2Row {
	width: 100%;
	height: 100%;
		
	}
	
	.indexPage2right {
	display: inline-block;
	float:right;
	width: 100%;
	background-color: rgba(39,86,76,.00);
	height: 2px;
}




	
/*********************  WORK PAGE STARTS HERE 	********************/

.pageContentWorksTop {
	margin: 80px 10px 20px 10px;
	clear: both;
	position: relative !important;
}

.worksTopLeft {	
	display: block;
	float: left;
	height: 50px;
	width: 22%;
	/*background-color: red;*/
}

.worksTopCenter {	
	display: block;
	float: left;
	height: 100px;
	width: 100%;
	background-color: rgba(255,255,255,.0);
}

#topWorks{
		width: 100%;
		height: 100%;	
	}	

/*RIGHT SIDE DIV THAT PUSHES MIDDLE BOX FROM RIGHT SIDE*/
.worksTopRight {	
	display: block;
	float: left;
	height: 50px;
	width: 14%;
	/*background-color: yellow;*/
}



.pageContentWorksBottom {
	clear: both;
	margin: 80px 10px 200px 10px;
	
	
}

.worksBottomLeft {	
	display: block;
	float: left;
	height: 50px;
	width: 1%;
	/*background-color: red;*/
}

.worksBottomCenter {	
	display: block;
	float: left;
	height: 150px;
	width: 98%;
	background-color: rgba(255,255,255,.0);
	
}

#bottomWorks{
		width: 100%;
		height: 100%;	
	}	

.worksBottomRight {	
	display: block;
	float: left;
	height: 50px;
	width: 1%;
	/*background-color: yellow;*/
}


.pageContentWorks {
	margin: 80px 10px 20px 10px;
	position: relative !important;
	/*clear: both;*/
}

.leftLeftRecent {
	display: none;
	}

.worksPageVideoLeft {	
	display: none;
	
}


.worksPageVideoCenterRecent {
	float: left;
	width: 100%;
	background-color: rgba(0,0,0,.40);
	/*height: 200px;*/
	text-align: center;
	padding-bottom: 0px;		
}

.workPageRight {
	/*display: none;
	float: right;
	width: 15%;
	background-color: rgba(255,0,0,0.60);
	height: 20px;*/
	display: inline-block;
	float: left;
	width: 15%;	
	background-color: rgba(255,0,80,.60);
	height: 50px;
}




/* WORK PAGE START OF SECOND ROW FOR BUFFER ABOVE VIDEO PLAYERS */


/********************INDEX PAGE THIRD**********************/

.pageContent.third {
	clear:both;
	margin: 10px 10px 20px 10px;	
	display: block;
	/*background-color: rgba(255,255,255,0.30);*/
}

.h2h {
	color: rgba(255,255,255,.90);
	text-align: center;
	font-height:1;
	text-transform: uppercase;
	font-size: 2em;
	/*font-family: 'NeuzeitSLTStdBookHeavy';*/
	font-family:bebas-neue;
	font-weight: 100;
	text-shadow: 1px 1px 2px rgba(0,0,0,.50);
	border-bottom: 1px solid white;
	letter-spacing: .05em;
	
}

.h2hContact {
	color: rgba(255,255,255,.90);
	text-align: center;
	font-height:1;
	text-transform: uppercase;
	font-size: 2em;
	/*font-family: 'NeuzeitSLTStdBookHeavy';*/
	font-family:bebas-neue;
	font-weight: 100;
	text-shadow: 1px 1px 2px rgba(0,0,0,.50);
	border-bottom: 1px solid white;
	letter-spacing: .05em;
	
}

.pp{
	font-height:1.25;
	color: white;
	/*text-transform: uppercase;*/
	font-size: 1.25em;
	font-family: 'NeuzeitSLTStdBook';
	font-weight: 100;
	text-shadow: 1px 1px 1px rgba(255,255,255,.00);
	padding: .0em 30px .35em 30px;		
}


/*********************LIST AND FONT SIZE FOR SERVICES AT BOTTOM OF PAGE*/
 .listlist { 
  /* background: #3399ff;*/
    /*padding: 20px;*/
	
	font-height:1.25;
	color:white;
	/*text-transform: uppercase;*/
	font-size: 1.25em;
	font-family: 'NeuzeitSLTStdBook';
	font-weight: 100;
	text-shadow: 1px 1px 1px rgba(255,255,255,.00);
	padding: .0em 30px .35em 30px;
	 
}

 


/*.pageContent.four {
	clear:both;
	margin: 10px 10px 20px 10px;	
	display: block;
}

.pageContent.five {
	clear:both;
	margin: 0px 10px 50px 10px;	
	display: block;
}*/

.indexPageLeft {
	display: inline-block;
	float:left;
	width:1%;
	background-color: rgba(241,16,20,0.0);
	height: 250px;
}

.indexPageCenter {

	display: inline-block;
	float:left;
	width: 98%;
	background-color: rgba(0,0,0,0.30);
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 100px; /*CONTROLS THE HEIGHT FROM THE NEXT BOX BELOW*/
	border-radius: 20px;
	border: #5C5C5C solid 1px;
}
	
	.indexPageRight {
	
	display: inline-block;
	float:right;
	width: 1%;
	background-color: rgba(255,255,255,.0);
	/*height: 200px;*/
}

/*VIDEO COMMERCIALS */

/*TURNS OFF PLAYLIST ON UPPER RIGHT HAND CORNER OF VIDEO PLAYER*/
.jw-related-dock-btn {
  display: none !important;
}





/*++++++++++++++++++Carl Native Player Override HERE*/
.jw-title {
    display: none !important;
}

/****************/


/**********************START OF VIDEO FOR RECENT.HTML PAGE	*/
	
#listbar {
	clear:both;
	overflow:hidden;
	padding:30px 0;
	color: white; /*COLOR OF FONT ON UNSELECTED VIDEO BUTTONS*/
	border-radius: 30px;
}

#listbar_2 {
	clear:both;
	overflow:hidden;
	padding:30px 0;
	color: white; /*COLOR OF FONT ON UNSELECTED VIDEO BUTTONS*/
}
.listbar_item_playing, .listbar_item {
	width:30.5%;
	float:left;
	margin: 1.4% .0% 5px 2%;
	box-sizing:border-box;
	position:relative;
	box-shadow: 0 0 14px 1px #000000;
	cursor:pointer;
}
.listbar_item_playing img, .listbar_item img {
	max-width:100%;
}
.listbar_item_playing:active, .listbar_item:active {
	  box-shadow: 0 0 0 2px red;
}
.listbar_item::before {
	content:'';
	position: absolute;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height:100%;
	background: rgba(0,0,0,0.2); /*COLOR OVELAY OF THE ENTIRE BUTTON NOT SELECTED*/
	transition: background-color,0.25s,linear;
}

/*******************NEW CODE FOR ROLL OVER EFFECT*/

.listbar_item_playing:hover::before, .listbar_item:hover::before{
	background: transparent;
}


.listbar_item_playing img, .listbar_item img {
	display:block;
	float:none;
	width:100%;
	height:auto;
}

.listbar_item_playing img, .listbar_item img {
	max-width:100%;
}

.listbar_item_playing:active, .listbar_item:active {
	  box-shadow: 0 0 0 2px red;
}

/*******************END NEW CODE FOR ROLL OVER EFFECT*/

.listbar_item_playing b, .listbar_item b {
	display: inline-block;
	margin: 0 10px;
  	white-space: nowrap;
  	overflow: hidden;
  	max-width: 90%;
  	box-sizing: border-box;
  	text-overflow: ellipsis;
}

.listbar_item_playing {
	display: block;
	background-color: rgba(201,242,53,.50);  /*DROTAR BACKGROUND FOR HOT BUTTON*/
	background-color: orange;
	color: black; /*COLOR OF FONT ON SELECTED VIDEO BUTTONS*/
}


/*Carl - new video*/
   .listbar_item {
	display: block;
	background-color: rgba(255,255,255,0.67);
	 
}

.listbar_item_playing {
	display: block;
	background-color: rgba(201,242,53,1.00);  /*DROTAR BACKGROUND FOR HOT BUTTON*/
}

.listbar_item_playing:hover, .listbar_item:hover {
	  box-shadow: 0 0 0 3px white;
}

.listbar_item_playing:hover::before, .listbar_item:hover::before{
	background: transparent;
}
.listbar_item_playing img, .listbar_item img {
	display:block;
	float:none;
	width:100%;
	height:auto;
}




/*********************  CONTACT PAGE STARTS HERE 	********************/	

/*****************CONTACT PAGE INFO*****************/



/* CONTACT PAGE START OF SECOND ROW FOR BUFFER ABOVE EMAIL */

.pageContentTopContact {
	clear:both;
	margin: 40px 10px 10px 10px;	
	position: relative !important;
}

.contactPageTopLeft {
	display: inline-block;
	float:left;
	width: 15%;
	/*background-color: rgba(255,100,140,.5);*/
	height: 50px;
}

.contactPageTopCenter {
	display: inline-block;
	float:left;
	width: 100%;
	height: 100px;
	/*margin-bottom: 30px;*/ /*CONTROLS THE HEIGHT FROM THE NEXT BOX BELOW*/
	/*margin-top: 30px;*/ /*CONTROLS THE HEIGHT FROM THE NEXT BOX BELOW*/
	/*background-color: rgba(255,70,0,.5);*/
	text-align: center;
}

#contactTop{
	width: 100%;
	height: 100%;
}
	
	.contactPageTopRight {
	display: inline-block;
	float:right;
	width: 15%;
	/*background-color: rgba(255,255,255,.5);*/
	height: 50px;
}


/************************************EMAIL TWITTER MAP HOLDER*/

	.pageContentContact  {
		position: relative;
		margin: 5px 40px 0px 50px;	
	}

	.leftLeftContact {
	display: none;
	}
	
	
	.contactPageLeft {
	/*float: left;
	width: 100%;
	height: 480px;
	background-color: rgba(255,255,255,.5);
	background-color: pink;
	-moz-box-sizing: border-box; 
	-webkit-box-sizing: border-box; 
	box-sizing: border-box;	
	padding:10px;*/
	display: none;
	}

	/*EMAIL HOLDER*/
	.contactPageCenter {
	float: left;
	width: 100%;
	height: 500px;
	background-color: rgba(255,255,255,.5);
	-moz-box-sizing: border-box; 
	-webkit-box-sizing: border-box; 
	box-sizing: border-box;	
	padding:10px;
	}
	
	.contactPageCenter label{
		text-transform: uppercase;
		/* text-shadow: 1px 1px 2px #ccc; */
		background: none;
		font-size: 15px;
		font-family: 'NeuzeitSLTStdBook';
		color: black;	
		display:block;
	}
	
	.contactPageCenter input[type="text"], input[type="email"], textarea{
		display:block;
		/*width:100%;*/
		width:90%; /*CHANGES LENGTH OF NAME EMAIL CONCERNING BOX*/
		margin-bottom:10px;
	}
	
	.contactPageCenter textarea{
		height:220px;
		width:95%;/*CHANGES LENGTH OF NAME EMAIL CONCERNING BOX*/
	}
	
	#frm_submit{
		text-align:center;
		width:150px;
		height:30px;
		background: rgba(255,255,255,.7);
		-webkit-border-radius: 10px;
		border-radius: 10px;
		-khtml-border-radius: 10px;
		margin:0 auto;
	}
	
	#frm_submit span{
		line-height:30px;
	}
	
	#frm_submit:hover{
		cursor:pointer;
		background: rgba(0,0,0,.7);
		color: white;
	}
	
/*ART WORK RIGHT OF EMAIL*/
	.contactPageRight {
	float: right;
	width: 100%;
	height: 500px;
	/*border: red solid 1px;*/
	text-align:center;
	padding: 10px;
	margin-top: 70px;
	-moz-box-sizing: border-box; 
	-webkit-box-sizing: border-box; 
	box-sizing: border-box;
	border: 1px white solid;
	background-color: rgba(0,0,0,.35);	
	}

	#contactRight{
	width: 100%;
	height: 100%;
}

	.rightRightContact {
	display: none;
	}
	
	
	.contactP {
	color: rgba(39,86,76,1.00);
	/*padding: 10px 10px  20px 10px;*/	
	/*font-size: 1.1em;*/
	font-size: 1.1em;
	font-weight: 300;
	text-transform: uppercase;
	/*font-family: 'NeuzeitSLTStdBookHeavy', sans-serif;*/
	font-family: 'NeuzeitSLTStdBookHeavy', sans-serif;
	letter-spacing: .1em;
	text-shadow: 1px 1px 1px white;	
	text-align: center !important;
	line-height: 50px !important;
	margin: 0 !important;
	padding: 0 !important;	
	}
	





/* CONTACT PAGE START OF SECOND ROW FOR BUFFER ABOVE VIDEO PLAYERS */
.pageContentTwoContact {
	clear:both;
	margin: 70px 10px 20px 10px;	
}

.contactPageTwoLeft {
	display: block;
	float:left;
	width: 15%;
	/*background-color: red;*/
	height: 50px;
}

.contactPageTwoCenter {
	display: block;
	float:left;
	width: 70%;
	height: 50px;
	/*background-color:  orange;*/
}
	
	.contactPageTwoRight {
	display: block;
	float:right;
	width: 15%;
	height: 50px;
	/*background-color:  red;*/
}



/********************CONTACT PAGE THIRD **********************/

.pageContentThreeContact {
	clear:both;
	margin: 10px 10px 50px 10px;	
	display: block;
}

.contactPageThreeLeft {
	display: inline-block;
	float:left;
	width: 15%;
	background-color: rgba(255,255,255,0.30);
	height: 20px;
}

.contactPageThreeCenter {

	display: inline-block;
	float:left;
	width: 70%;
	background-color: rgba(39,86,76,.50);
	height: 20px;
	
}
	
	.contactPageThreeRight {
	
	display: inline-block;
	float:right;
	width: 15%;
	background-color: rgba(74,168,186,.3);
	height: 20px;
}








/*********************CONTACT PAGE END*/

/* ==========================================================================
   END - THOMAS DROTAR - ANY SCREEN LAYOUT
   ========================================================================== */






/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Image replacement
 */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
   START - THOMAS DROTAR - LARGE MOBILE AND TABLET SCREEN LAYOUT
   This ONLY applies to screens that have a width of 450 pixels or more.
   If you want to invalidate rules from the any screen layout, you HAVE
   to overwrite them here.
   ========================================================================== */
/* Screens bigger than 768px will switch to desktop layout */
@media only screen and (min-width: 450px) {
	
	
h2h {
	
	letter-spacing: .15em;
	
}	


.indexPageVideoLeft {
	display: inline-block;
	width: 100%;
}

.indexPageVideoCenter {
	padding-top: 50px;
	display: inline-block;
	width: 100%;
	background-color: rgba(198,220,24,.00)
}

.indexPageVideoRight {
	/*display: inline-block;
	float: right;
	width: 5%;*/
	}

.indexPage2center {
	height: 100px;
}
	
/*JEFFERSON'S BIOGRAPHY*/	
	
	
	
	

.pageContent.third {
	margin: 80px 10px 20px 10px;	
	
}




.pageContent.four {
	
	margin: 50px 10px 20px 10px;
}


.pageContent.five {
	margin: 10px 10px 20px 10px;	
}


/************************************WORK PAGE STARTS HERE*/
	
	
	.pageContentWorksTop {
	margin: 80px 10px 240px 10px;
	
}

.worksTopLeft {	
	width: 1%;
	/*background-color: red;*/
}

.worksTopCenter {	
	width: 98%;
	background-color: rgba(255,255,255,.0);
	height: 250px;
}

/*RIGHT SIDE DIV THAT PUSHES MIDDLE BOX FROM RIGHT SIDE*/
.worksTopRight {	
	height: 50px;
	width: 1%;
	/*background-color: yellow;*/
}
		
	

.leftLeft {
	height: 50px;
	width: 10%;	
	display: inline-block;
	float: left;
	/*background-color: black;*/
	background-color: rgba(255,0,0,0);	
	}
	
	/*KEEPS VIDEO FROM MOVING OVER TO LEFT SIDE*/
	.leftLeftRecent {
	display: none;
	}
	

	
	.rightRight {
	float: left;
	height: 50px;
	width: 10%;	
	display: inline-block;
	/*background-color: black;*/
	background-color: rgba(255,0,255,0.);	
	}
	
	.rightRightRecent {
	float: left;
	height: 50px;
	width:0%;	
	display: inline-block;
	background-color: rgba(255,255,255,0.);
	}
	
	.rightRightArchive {
	float: left;
	height: 50px;
	width: 10%;	
	display: inline-block;
	/*background-color: black;*/
	background-color: rgba(255,255,255,.6);	
	/*background-color: blue;	*/
	}
	
	
	
	.pageContentWorksBottom {
	margin: 100px 10px 230px 10px;
	}

	.worksBottomLeft {	
		height: 50px;
		/*background-color: red;*/
	}

	.worksBottomCenter {	
		height: 150px;
		margin-top: 30px
	}

	.worksBottomRight {	
		height: 50px;
		/*background-color: yellow;*/
	}





/*CONTACT PAGE POSITIONING****************************/
	
	  .pageContentTopContact  {
		margin: 100px 50px 20px 50px;
		}

		.contactPageTopLeft {
			
			width: 5%;
			/*background-color: rgba(255,100,140,.5);*/
			height: 50px;
		}

		.contactPageTopCenter {
			display: inline-block;
			float:left;
			width: 90%;
			height: 150px;
			/*margin-bottom: 30px;*/ /*CONTROLS THE HEIGHT FROM THE NEXT BOX BELOW*/
			/*margin-top: 30px;*/ /*CONTROLS THE HEIGHT FROM THE NEXT BOX BELOW*/
			/*background-color: rgba(255,70,0,.5);*/
			text-align: center;
		}


			.contactPageTopRight {
			display: inline-block;
			float:right;
			width: 5%;
			/*background-color: rgba(255,255,255,.5);*/
			height: 50px;
		}
	

	  .pageContentContact  {
		position: relative;
		clear: both;
		margin: 100px 75px 20px 75px;
		}
	
		.contactPageLeft {
		width: 100%;
		height: 500px;
		}
		
		.contactPageCenter {
		width: 100%;
		height: 500px;	
		}
		
		.contactPageRight {
		width: 100%;
		height: 500px;
		margin-top: 0px;
		margin-bottom: 20px;
		font-family: bangers;
		font-style: normal;
		font-weight: 400;
		}
		
		
		.contactP {
		padding: 10px 10px  20px 10px;	
		font-size: 1.1em;
		letter-spacing: .5em;
		}
	
	
	.contactPageCenter input[type="text"], input[type="email"], textarea{
		width:60%; /*CHANGES LENGTH OF NAME EMAIL CONCERNING BOX*/	
	}
	
	.contactPageCenter textarea{
		width:99%;/*CHANGES LENGTH OF NAME EMAIL CONCERNING BOX*/
	}	
	
	.h2BF_C {
	font-size: 1.6em;
	}
	
	
	.footerP {
	font-size: 1.5em;
	letter-spacing: .1em;
	}
	.footerPr {
	font-size: 1.5em;
	letter-spacing: .1em;
	}	
	
}






/* ==========================================================================
   START - THOMAS DROTAR - MEDIUM SCREEN LAYOUT
   This ONLY applies to screens that have a width of 769 pixels or more.
   If you want to invalidate rules from the any screen layout, you HAVE
   to overwrite them here.
   ========================================================================== */
/* Screens bigger than 768px will switch to desktop layout */
@media only screen and (min-width: 769px) {
	input.mobileMenuButton ~ * {
		-webkit-transition: none;
		transition: none;
	}

	input.mobileMenuButton ~ * h1,
	input.mobileMenuButton ~ * p {
		-webkit-transition: none;
		transition: none;
	}

	input.mobileMenuButton,
	label.mobileMenuButton {
		display: none;
	}
	
	
	.h2h {
	text-align: right;
	padding-right: 30px;
	font-family: bebas-neue;
	font-style: normal;
	font-weight: 400;
	font-size: 3em;
}

	header {
		position: fixed;
		height: 50px;
		background-color: rgba(0,0,0,.6);
		border-bottom: white 1px solid;
	}
	/* the background of the header */
	
header:after {
	background: rgba(255,255,255,.0); /*CONTROLS COLOR OF MOBILE HEADER*/
}

	header nav {
		position: static;
		width: auto;
		left: auto;
	}

	header nav ul {
		text-align: center;
		width: auto;
	}

	header nav li {
		margin-left: 16px;
		width: auto;
	}
	header nav li:first-child {
		margin: 0;
	}

	header nav a {
		border-radius: 6px;
	}
	
		/*THIS CONTROLS DROTAR NAVIGATION BUTTONS TOP*/
	header nav {
		position: absolute;
		margin-top: -55px;
		margin-left: 10px;
		width: auto;
		left: auto;
	}

	header nav ul {
		text-align: center;
		width: auto;
		left: 20px;	/*CONTROLS BUTTONS FROM THE LEFT SIDE*/	
	}

	header nav li {
		margin-left: 0;
		width: auto;
		border-bottom: 0;		
	}

	header nav li:first-child {
		margin: 0;
	}

	header nav a {
		text-transform: uppercase;
		letter-spacing: 0.1em;
		/*text-shadow: 1px 1px 2px #ccc;*/
		background: none;
		font-size: 1.0em;
		font-family: 'NeuzeitSLTStdBook';
		color: white;	
		padding: 8px 10px;
	}
	
	
	header nav a:hover {	
		color: red;
		background-color: rgba(57,255,0,.00); 
	}

		/*ACTIVE LINK*/
	
	header nav .active a  {	
	display: inline-block;
	font-size: 1.0em;
	outline: none;
	text-transform: uppercase;
	font-family: 'NeuzeitSLTStdBook';
	letter-spacing: 0.25em;
	color: #E5CD7A;
	text-shadow: 1px 1px 2px rgba(0,0,0,1);
	background-color: rgba(255,0,4, .0);
  }
	
	header nav .active a:hover {
	 color: #E5CD7A;
 	 background-color: rgba(57,255,0,.00);
	 /*font-size: 1.5em;*/
	
}


/*THIS PLACES THE FOOTER AT THE BOTTOM OF THE PAGE AND YOU SCROLL UNDER IT*/
	/*footer {
		position: fixed;
		bottom: 0;
	}
*/
/*NEVER CHANGE THE LEFT AND RIGHT MARGINS FOR VIDEO/MUST BE CONSITENT THROUGHTOUT!!!!!!!!!!*/
	/*.pageContent {
		margin: 80px 10px 20px 10px;
	}*/
	
	
	
	.pageContent {
	margin: 80px 10px 30px 10px;
	/*clear: both;*/
	padding-bottom: 100px;  /*ALWAYS LEAVES 100PX BETWEEN VIDEO AND NEXT CONTENT BELOW*/
}
	
	/*DIRECTOR/CINEMATOGRAPHER*/
	.indexPageVideoLeft {
	display: inline-block;
	float: left;
	width: 40%;
	background-color: rgba(255,5,9,.0);
	height: 200px;	
}

#animationTopLeft{
	float: left;
		display: block;
		width: 100%;
		height: 100%;	
	}	
	
.indexPageVideoCenterLeft {
	display:block;
	float: left;
	width: 4%;
	height: 100px;	
	background-color: rgba(255,5,109,.0);
}

#animationTopCenter{
	/*width: 100%;
	height: 100%;*/
	display: none;
}



.indexPageVideoCenter {
	display:block;
	padding-top: 0px;
	float: left;
	width: 54%;
	background-color: rgba(255,239,0,.0);
	/*height: 400px;*/	
	
	/*padding-bottom: 50px;*/
}

.indexPageVideoRight {
	display: inline-block;
	/*display: none;*/
	float: right;
	/*width: 15%;*/
	width: 2%;
	background-color: rgba(35,255,0,.0);
	height: 200px;	
}

/*SIZZLE REEL TEXT STARTS HERE*/
	
	
.pageContentSizzleReel {
	
	margin: 0px 10px 0px 10px;
	/*clear: both;*/
}

.indexPageVideoLeftSR {
	width: 12%;
	/*background-color: orange;*/
	height: 10px;	
}

.indexPageVideoCenterSR {
	width: 88%;
	/*background-color: pink;*/
	height: 2px;		
}

.ppSR{
	/*font-height:1.25;*/
	
	font-size: 1.15em;
	padding: .0em 20px 0 30px;	
	letter-spacing: 4px;
	margin-top: 1px;
}

.indexPageVideoRightSR {
	width: 0%;
	/*background-color: yellow;*/
	height: 10px;	
}

	
	
	
	
	
	
/* START OF SECOND PAGE WITH BIOGRAPHY AND TEXT */
.pageContent.secondary {
	clear:both;
	margin: 80px 10px 20px 10px;	
}


/*BUFFER FROM EXPANDING VIDEO PLAYER DIRECTLY ABOVE*/

.indexPageTwoLeft {
	/*background-color: rgba(35,255,0,.0);*/
	height: 2px;
	width: 33%;	
	float: left;	
}

.indexPageTwoCenter {
	/*background-color: rgba(135,115,0,.0);*/
	height: 2px;
	width: 33%;	
	float: left;		
}

.indexPageTwoRight {
	/*background-color: rgba(35,5,214,.5);*/
	height: 2px;
	width: 33%;	
	float: left;		
}

.indexPage2left {
	display: inline-block;
	float:left;
	width: 45%;
	/*background-color: rgba(255,0,0,.5);*/
	height: 100px;
	/*margin-top: 50px;*/ /*CONTROLS THE HEIGHT FROM THE NEXT BOX ABOVE*/
	
}

	/*BIOGRAPHY ANIMATION*/
.indexPage2center {
	display: inline-block;
	float:left;
	width: 54%;
	height: 100px;
	/*margin-bottom: 30px;*/ /*CONTROLS THE HEIGHT FROM THE NEXT BOX BELOW*/
	margin-top: 0px;
	/*background-color: rgba(255,2,255,.5);*/
}

	#indexAnimation2Row {
	width: 100%;
	height: 100%;
		
	}
	
	.indexPage2right {
	display: inline-block;
	float:right;
	width: 1%;
	/*background-color: rgba(2,2,255, .5);*/
	/*background-color: rgba(140,154,28,.00);*/
	height: 100px;
	/*margin-top: 50px;*/ /*CONTROLS THE HEIGHT FROM THE NEXT BOX ABOVE*/
}
	
	
	
/*BELOW VIDEO PLAYER BIO TEXT ********************/

.pageContent.third {
	margin: 10px 10px 20px 10px;	
	/*background-color: rgba(255,255,255,0.30);*/
}
	
.indexPageLeft {
	width: 44%;
	/*background-color: rgba(1,255,255,.5);*/
	height: 250px;
}

.indexPageCenter {
	width: 55%;
	margin-bottom: 100px;
	/*background-color: rgba(1,1,255,.0);*/	
}
	
	.indexPageRight {
	width: 1%;
	height: 350px;
	/*background-color: rgba(1,255,1,.5);*/	
}


	
/*********************  WORK PAGE STARTS HERE *********/

.pageContentWorksTop {
	margin: 80px 10px 20px 10px;
}

.worksTopLeft {	
	height: 50px;
	width: 15%;
	/*background-color: red;*/
}

.worksTopCenter {	
	height: 200px;
	width: 70%;
}


/*RIGHT SIDE DIV THAT PUSHES MIDDLE BOX FROM RIGHT SIDE*/
.worksTopRight {	
	height: 50px;
	width: 15%;
	/*background-color: yellow;*/
}

	/*************WORK VIDEO PLAYERS**************/

.pageContentWorks {
	margin: 80px 10px 20px 10px;
}

.leftLeftRecent {
	display: block;
	clear: both;
	float: left;
	height: 50px;
	width: 15%;
	/*background-color: green;*/
	}

.worksPageVideoLeft {	
	display: none;
	
}


.worksPageVideoCenterRecent {
	float: left;
	width: 70%;
	background-color: rgba(0,0,0,.40);
	/*height: 200px;*/
	text-align: center;
	padding-bottom: 0px;		
}
	
	
	
	/*WORKS UNDER VIDEO BOTTOM STARTS HERE*/
	
.pageContentWorksBottom {
	margin: 80px 10px 200px 10px;	
}

.worksBottomLeft {	
	display: block;
	float: left;
	height: 10px;
	width: 15%;
	/*background-color: red;*/
}

.worksBottomCenter {	
	display: block;
	float: left;
	height: 200px;
	width: 70%;
	background-color: rgba(255,255,255,.0);
	margin-bottom: 200px; /*PUSHES FOOTER DOWN*/
	
}

.worksBottomRight {	
	display: block;
	float: left;
	height: 10px;
	width: 15%;
	/*background-color: yellow;*/
}



/********************PAGE CONTENT CONTACT STARTS HERE**********************/
	
	.pageContentContact  {
		margin: 65px 10px 20px 10px;
		clear: both;
	}
	
	
	.leftLeftContact {
		height: 50px;
		width: 5%;	
		display: inline-block;
		float: left;
		/*background-color: black;*/
		background-color: rgba(255,125,0,.0);	
		}
	
	.contactPageLeft {
		display: block;
		width: 5%;
		height: 500px;
		float: left;
		background-color: rgba(255,255,255,.0);
		/*background-color: pink;*/
		-moz-box-sizing: border-box; 
		-webkit-box-sizing: border-box; 
		box-sizing: border-box;	
		padding:10px;
		}
		
		.contactPageCenter {
		width: 40%;
		height: 500px;	
		}
		
		.contactPageRight {
		float: left;	
		width: 40%;
		height: 500px;
		/*background-color: rgba(0,0,0,0.0);	*/
		}
	
	.rightRightContact {
		height: 50px;
		width: 5%;	
		display: inline-block;
		float: left;
		/*background-color: black;*/
		background-color: rgba(255,0,0,.0);	
		}
		
		.contactPageCenter input[type="text"], input[type="email"], textarea{
		width:96%; /*CHANGES LENGTH OF NAME EMAIL CONCERNING BOX*/	
		}
	
		.contactPageCenter textarea{
		width:99%;/*CHANGES LENGTH OF NAME EMAIL CONCERNING BOX*/
		}	
	
	
	/********************PAGE CONTENT CONTENT ENDS HERE**********************/


/***********************FOOTER INFO********************/

/***************FOOTER INFO MEDIUM******************/



.footerP {
	font-size: 1.5em;
	/*color: red;*/
	}

.footerC {
	display:none;
	}



.footerR {
	width: 35%;
	/*border: solid yellow 1px;*/
	float: right;
	text-align: right;
}


/*PHONE NUMBER RIGHT SIDE OF FOOTER*/
.footerPr {
	font-size: 1.5em;
	/*color: red;*/
	
}



/***************FOOTER INFO FINISH******************/

}

/* ==========================================================================
   END - THOMAS DROTAR - MEDIUM SCREEN
   ========================================================================== */
   
   
   /* ==========================================================================
   START - THOMAS DROTAR - LARGE SCREEN LAYOUT
   This ONLY applies to screens that have a width of 1024 pixels or more.
   If you want to invalidate rules from the any screen layout, you HAVE
   to overwrite them here.
   ========================================================================== */
/* Screens bigger than 768px will switch to desktop layout */
@media only screen and (min-width: 1024px) {
	
	
	/*THIS CONTROLS DROTAR NAVIGATION BUTTONS TOP*/
	header nav {
		margin-left: 20px;
	}

	header nav a {
		font-size: 1.3em;
		padding: 8px 10px;
		/*background-color: green;*/
	}

		/*ACTIVE LINK*/
	
	header nav .active a  {	
	font-size: 1.3em;
  }
	
	header nav .active a:hover {
	 color: #E5CD7A;	
}  

.pageContent {
	margin: 80px 10px 30px 10px;
	/*clear: both;*/
	padding-bottom: 0px;  /*ALWAYS LEAVES 70PX BETWEEN VIDEO AND NEXT CONTENT BELOW*/
}


	.indexPageVideoLeft {
	/*width: 17%;*/
	/*background-color: orange;*/
	height: 200px;	
}

	
.indexPageVideoCenterLeft {
	/*width: 34%;*/
	/*background-color: rgba(255,5,109,.5);*/
	height: 200px;
}

.indexPageVideoCenter {
	/*width: 40%;*/
	/*background-color: rgba(255,239,0,.0);*/
	/*height: 200px;	*/
	
}

.indexPageVideoRight {
	/*width: 9%;*/
	/*background-color: rgba(35,255,0,.5);*/
	height: 200px;	
}


.indexPageTwoLeft {
	background-color: rgba(35,255,0,.0);
	height: 10px;		
}
	
	
	
/*SIZZLE REEL TEXT STARTS HERE*/
	
	
.pageContentSizzleReel {
	
	/*margin: 0px 10px 0px 10px;*/
	/*clear: both;*/
}

.indexPageVideoLeftSR {
	/*width: 12%;*/
	/*background-color: orange;*/	
}

.indexPageVideoCenterSR {
	width: 88%;
	/*background-color: pink;*/		
}

.ppSR{
	/*font-height:1.25;*/
	
	font-size: 1.25em;
	padding: .0em 25px 0 30px;	
	letter-spacing: 4px;
	margin-top: 1px;
}

.indexPageVideoRightSR {
	width: 0%;
	/*background-color: yellow;*/	
}	
		

.indexPageTwoCenter {
	/*background-color: rgba(135,115,0,.5);*/
	height: 10px;		
}

.indexPageTwoRight {
	/*background-color: rgba(35,5,214,.5);*/
	height: 10px;		
}

.pageContent.secondary {
	clear:both;
	margin: 100px 10px 20px 10px;	
}

/*CONTACT PAGE */


 /* CONTACT PAGE TOP --- START OF ANIMATION ABOVE EMAIL */
.pageContentTopContact {
	
	margin: 100px 10px 300px 10px;	
}

.contactPageTopLeft {
	width: 28%;
	/*background-color: rgba(255,100,140,.5);*/
}

.contactPageTopCenter {
	width: 70%;
	height: 150px;
	/*background-color: rgba(255,70,0,.5);*/
}
	
	.contactPageTopRight {
	width: 2%;
	/*background-color: rgba(255,255,255,.5);*/
}

	
	
	/*************************************EMAIL TWITTER & MAP* 1024/ */	

	  .pageContentContact  {
		  	  clear:both; 	
			  margin: 150px 10px 20px 10px;
		  }
	
	
	.leftLeftContact {
	width: 5%;	
	/*background-color: black;*/
	background-color: rgba(255,0,0,.0);
	}
	
	.contactPageLeft{
	width: 27%	
		
	}
	
	.contactPageCenter{
	width: 36%;
		
	}
	
	.contactPageRight{
	width: 27%;	
	float: left;
	/*background-color: rgba(255,0,125,.0);*/	
		
	}
	
	.rightRightContact {
		height: 50px;
	width: 5%;	
	display: inline-block;
	float: left;
	}
	
	
	
	
	
	/*********************  WORK PAGE STARTS HERE *********/


/* WORK PAGE ENDS HERE */
	
	
	
	
	
	
	
	
	/***************FOOTER INFO MEDIUM******************/

footer {
	height: 75px;
}


.footerP {
	font-size: 2.2em;
	/*color: yellow;*/
	}

.footerC {
	display:none;
	}

.footerR {
	width: 35%;
	/*border: solid yellow 1px;*/
	float: right;
	text-align: right;
}


/*PHONE NUMBER RIGHT SIDE OF FOOTER*/
.footerPr {
	font-size: 2.2em;
	/*color: orange;*/	
}

/***************FOOTER INFO FINISH******************/

	
	
	
	
}



 /* ==========================================================================
   END - THOMAS DROTAR - LARGE SCREEN
   ========================================================================== */
   
   
    /* ==========================================================================
   START - THOMAS DROTAR - LARGEST SCREEN LAYOUT
   This ONLY applies to screens that have a width of 1024 pixels or more.
   If you want to invalidate rules from the any screen layout, you HAVE
   to overwrite them here.
   ========================================================================== */
/* Screens bigger than 1280x will switch to desktop layout */




@media only screen and (min-width: 1280px) {
	
	
	
	
	.h2h {
	font-size: 2.5em;
	padding-right: 30px;
}
	
	
	
	/*********************LIST AND FONT SIZE FOR SERVICES AT BOTTOM OF PAGE*/
	
	.listlist{
    /*background: #3399ff;*/
    /*padding: 20px;*/
	/*color: red;*/
	font-size: 1.75em;
	padding: .0em 100px .35em 100px;	
}

 
.h2h {
	font-size: 4em;
	
}	
	
	
	
	.pp{
	font-size: 1.75em;
}
	
	header nav {
		margin-left: 20px;
	}

	header nav a {
		letter-spacing: 0.1em;
		font-size: 1.4em;
		padding: 8px 30px;
		/*background-color: green;*/
	}
	
	
	header nav a:hover {	
		background-color: rgba(57,255,0,.00); 
	}

		/*ACTIVE LINK*/
	
	header nav .active a  {	
	font-size: 1.4em;
	outline: none;
	letter-spacing: 0.25em;
  }
	
	header nav .active a:hover {
	 color: #E5CD7A;
 	 background-color: rgba(57,255,0,.00);
	 /*font-size: 1.5em;*/
	
} 

/*VIDEO PLAYER**************************/

	.indexPageVideoLeft {
	width: 45%;
	/*background-color: rgba(255,5,9,.5);*/
	height: 300px;
}

	
.indexPageVideoCenterLeft {
	width: 5%;
	/*background-color: rgba(255,5,109,.5);*/
	height: 50px;
}

.indexPageVideoCenter {
	width: 49%;
	/*background-color: rgba(255,239,0,.0);*/
	/*height: 200px;*/
		
	
}

.indexPageVideoRight {
	width: 1%;
	/*background-color: rgba(35,255,0,.5);*/
	height: 200px;	
}
	
	
	
	
	
	
	/*SIZZLE REEL TEXT STARTS HERE*/
	
	
.pageContentSizzleReel {
	
	margin: 0px 10px 0px 10px;
	/*clear: both;*/
}

.indexPageVideoLeftSR {
	width: 12%;
	/*background-color: orange;*/
	height: 10px;	
}

.indexPageVideoCenterSR {
	width: 88%;
	/*background-color: pink;*/
	height: 2px;		
}

.ppSR{
	/*font-height:1.25;*/
	
	font-size: 1.25em;
	padding: .0em 20px 0 30px;	
	letter-spacing: 4px;
	margin-top: 0px;
}

.indexPageVideoRightSR {
	width: 0%;
	/*background-color: yellow;*/
	height: 10px;	
}


/*BUFFER BETWEEN VIDEO AND BIOGRAPHY ANIMATION*/
	
.pageContent.secondary {
	margin: 50px 10px 20px 10px;	
	/*border: 3px pink solid;*/
}


.indexPageTwoLeft {
	/*background-color: rgba(35,255,0,.5);*/	
}

.indexPageTwoCenter {
	/*background-color: rgba(135,115,45,.5);*/
			
}

.indexPageTwoRight {
	/*background-color: rgba(35,5,214,.5);*/		
}
	

.indexPage2left {
	width: 40%;
	/*background-color: rgba(255,0,0,.5);*/
	
	/*margin-top: 50px;*/ /*CONTROLS THE HEIGHT FROM THE NEXT BOX ABOVE*/
}
	
 /*BIOGRAPHY ANIMATION*/
	
.indexPage2center {
	width: 59%;
	height: 200px;
	/*background-color: rgba(255,2,255,.5);*/
}
	
	.indexPage2right {
	width: 1%;
	/*background-color: rgba(140,154,28,.50);*/
	
	
}

/*BIOGRAPHY TEXT*/

.pageContent.third {
	margin: 10px 10px 20px 10px;	
	/*background-color: rgba(255,255,255,0.30);*/
}
	
.indexPageLeft {
	width: 47%;
}

.indexPageCenter {
	width: 52%;
	margin-bottom: 100px;
	
	
}
	
	.indexPageRight {
	width: 1%;
	/*background-color: rgba(1,255,1,.5);*/
	
}

	.footerP {
	
	font-size: 2.5em;
	margin-left: 15px;
	margin-top: 7px;
	}
	
	.footerPr {
		font-size: 2.5em;
		margin-right: 15px;
		margin-top: 7px;			
	}
	

.sv_playlist ul.thumbs {
	  width:95.5%;  /*CONTROLS WIDTH OF BUTTON HOLDER*/
	}
	
	
	
	
	
	/*********************  WORK PAGE STARTS HERE *********/

.pageContentWorksTop {
	margin: 100px 10px 20px 10px;
}

.worksTopLeft {	
	height: 50px;
	width: 15%;
	/*background-color: red;*/
}

/*ANIMATION*/
.worksTopCenter {	
	height: 240px;
	width: 70%;
}


/*RIGHT SIDE DIV THAT PUSHES MIDDLE BOX FROM RIGHT SIDE*/
.worksTopRight {	
	height: 50px;
	width: 15%;
	/*background-color: yellow;*/
}

	/*************WORK VIDEO PLAYERS**************/

.pageContentWorks {
	margin: 80px 10px 20px 10px;
}

.leftLeftRecent {
	display: block;
	clear: both;
	float: left;
	height: 50px;
	width: 18%;
	/*background-color: green;*/
	}

.worksPageVideoLeft {	
	display: none;
	
}


.worksPageVideoCenterRecent {
	float: left;
	width: 63%;
	background-color: rgba(0,0,0,.40);
	/*height: 200px;*/
	text-align: center;
	padding-bottom: 0px;		
}
	
	
	
	/*WORKS UNDER VIDEO BOTTOM STARTS HERE*/
	
.pageContentWorksBottom {
	margin: 80px 10px 200px 10px;	
}

.worksBottomLeft {	
	display: block;
	float: left;
	height: 10px;
	width: 15%;
	/*background-color: red;*/
}

.worksBottomCenter {	
	display: block;
	float: left;
	height: 240px;
	width: 70%;
	background-color: rgba(255,255,255,.0);
	margin-bottom: 200px; /*PUSHES FOOTER DOWN*/
	
}

.worksBottomRight {	
	display: block;
	float: left;
	height: 10px;
	width: 15%;
	/*background-color: yellow;*/
}

	

/********************PAGE CONTACT ANIMATION CENTER STARTS HERE 1280**********************/
	
	.pageContentTopContact {
		 
		margin: 120px 50px 270px 50px;
		
		}
	


.contactPageTopLeft {

	width: 40%;
	/*background-color: blue;*/
	height: 50px;
}

.contactPageTopCenter {
	width: 50%;
	/*margin-bottom: 30px;*/ /*CONTROLS THE HEIGHT FROM THE NEXT BOX BELOW*/
	/*margin-top: 30px;*/ /*CONTROLS THE HEIGHT FROM THE NEXT BOX BELOW*/
	/*background-color: rgba(255,70,0,.5);*/
	margin-bottom: 100px; /*PUSHES ANIMATION AWAY FROM MAIL CONTAINER BELOW*/
}
	
	.contactPageTopRight {
	width: 5%;
	/*background-color: rgba(255,255,255,.5);*/
	
}



	
	
	
	/*************************************EMAIL TWITTER & MAP 1280************************/

	  .pageContentContact  {
		  	  clear:both; 	
			  margin: 150px 10px 750px 10px;
		  }
	
	
	.leftLeftContact {
	width: 5%;	
	/*background-color: black;*/
	background-color: rgba(255,0,0,.0);	
	}
	
	.contactPageLeft{
	width: 30%;	
	background-color: rgba(235,55,89,0.0);	
	}
	
	/*EMAIL CONTAINER*/
	
	.contactPageCenter{
	width: 30%;
	padding-bottom: 100px;
	/*background-color: green;*/
		
	}
	
	.contactPageRight{
	width: 30%;	
	float: left;
	/*background-color: rgba(235,255,89,0.0);	*/
		
	}
	
	.rightRightContact {
		height: 50px;
	width: 5%;	
	display: inline-block;
	float: left;
	background-color: rgba(40,255,89,0.0);	
	
	}
	
	.contactP {
	font-size: 1.5em;
	
	letter-spacing: .0em;	
	}
	
	
	
	
	
	
	.contactPageCenter input[type="text"], input[type="email"], textarea{
		width:100%; /*CHANGES LENGTH OF NAME EMAIL CONCERNING BOX*/	
		}
	
		.contactPageCenter textarea{
		width:100%;/*CHANGES LENGTH OF NAME EMAIL CONCERNING BOX*/
					
		}
	
	
	
	
/* CONTACT PAGE START OF SECOND ROW FOR BUFFER ABOVE EMAIL CONTAINER  */
.pageContentTwoContact {
	margin: 100px 10px 200px 10px;	
}

.contactPageTwoLeft {

	background-color: rgba(255,100,140,0);
	
}

.contactPageTwoCenter {
	
	/*margin-bottom: 30px;*/ /*CONTROLS THE HEIGHT FROM THE NEXT BOX BELOW*/
	/*margin-top: 30px;*/ /*CONTROLS THE HEIGHT FROM THE NEXT BOX BELOW*/
	background-color: rgba(255,70,0,.0);
}
	
	.contactPageTwoRight {
	background-color: rgba(255,255,255,0);
}

	
	
/********************CONTACT PAGE THIRD **********************/

.pageContentThreeContact {
	clear:both;
	margin: 10px 10px 150px 10px;	
	display: block;
}

.contactPageThreeLeft {
	display: inline-block;
	float:left;
	width: 15%;
	/*background-color: rgba(255,255,255,0.30);*/
	height: 20px;
}

.contactPageThreeCenter {

	display: inline-block;
	float:left;
	width: 70%;
	/*background-color: rgba(39,86,76,.50);*/
	height: 20px;
	
}
	
	.contactPageThreeRight {
	
	display: inline-block;
	float:right;
	width: 15%;
	/*background-color: rgba(74,168,186,.3);*/
	height: 20px;
}	
	












/* ==========================================================================
   START - RETINA IMAGE REPLACE
   ========================================================================== */

 @media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {
	  

	header h1 {
		background: url( '../img/logo@2x.png') no-repeat 0 0;
		background-size: 144px 29px;
	}
}

/* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}
