/*
Theme Name: Hidra
Author: Whatnot developer team
Description: Special theme designed for Hidra
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

/* CSS Document */
body {font-family:Arial, Verdana, Tahoma, sans-serif; background:#fff url(assets/images/bodybg.png) repeat-x left bottom; }
#site-logo a { background:transparent url(assets/images/logo.png) no-repeat; width:137px; height:50px; position:absolute; top:40px; left:40px; z-index:1000; }
#site-socials {  position:absolute; top:45px; right:40px; z-index:1000; }
#site-socials a { background:transparent url(assets/images/socials.png) no-repeat; width:25px; height:25px; display:block; float:right; }
#site-socials a.link-twitter { background-position:0px 0px; margin-right: 10px; }
#site-socials a.link-facebook { background-position:-25px 0px; }
/*
.link-top { background:transparent url(assets/images/bullet-top.png) no-repeat; width:25px; height:25px; display:block; position:absolute; right: 40px; bottom:20px; z-index:999; display:none; }
*/
p { line-height: 1.5em !important; }

#pageOneSpanTop{
	height:10%;
}
#pageOne .arrowDown { position:absolute; right:5px; bottom:5px;}
.porosLogo { display:inline-block; vertical-align:top; margin-right:10px; margin-right: 40px; }
.porosIntro { display: inline-block; font-size: 19px; background: rgba(0, 0, 0, 0.5); padding: 60px 30px; text-align: left; max-width: 360px; line-height: 23px; position: relative; margin-top: 33px; vertical-align: top; }
.porosIntro .bracketLeft { position:absolute; top:30px; left:-20px; }
.porosIntro .bracketRight { position:absolute; top:30px; right:-20px; }

.porosAbout { position: relative; padding: 20px; text-align:center; color:#202020;  }
.porosAboutBrace { width: 57px; position: relative; float:left; }
.page-content.page-home-about-content { text-align:left; position:relative; width: 80%; margin-top: 20px; font-size: 16px; display: inline-block; }
.pageAboutImg { position: absolute; right: 0px; bottom: 0px; box-shadow: 0px 0px 10px #000; -o-box-shadow: 0px 0px 10px #000; -moz-box-shadow: 0px 0px 10px #000; -webkitbox-shadow: 0px 0px 10px #000; border: 3px solid #FFF;}
.page-content.page-home-about-content p { margin-bottom: 20px; }
.page-content.page-home-about-content .main-content { margin-left: 70px; margin-right: 245px; padding-top: 10px; }

.page-organization-title { position: relative; z-index: 3; font-family: "Arial Rounded MT Bold", Arial, Verdana; font-size: 150px; color: #FF7F00; }

.page-organization-title .line1 { display: block; }
.page-organization-title .line2 { display: block; line-height: 45px; margin-left: 105px; }
.page-organization-outer { text-align: center; margin-top: 35px; }
.page-content.page-organization-content { display: inline-block;  position: relative; }
.page-content.page-organization-content .main-content { padding: 20px; background: rgba(0, 0, 0, 0.5); color: #FFF; text-align: left; z-index: 2; position: relative; }
.page-content.page-organization-content .main-content td { font-family:Arial, Verdana, Tahoma, sans-serif; font-size:26px; padding:8px 10px; }
.bracketBigLeft { position: absolute; z-index: 0; left: -122px; top: -61px; }
.bracketBigRight { position: absolute; z-index: 0; right: -65px; top: 0px; }

.pageContactOuter { background: #9999C2; color: #FFF; padding: 10px; text-align: center; font-family:Arial, Verdana, Tahoma, sans-serif; }
.page-content.page-head-office-content, .page-content.page-site-office-content { min-height: 114px; padding-left: 100px; display: inline-block; text-align: left; margin: 5px 20px; vertical-align: top; }
.page-content.page-head-office-content {background:transparent url(assets/images/icon-building.png) no-repeat left center; }
.page-content.page-site-office-content {background:transparent url(assets/images/icon-factory.png) no-repeat left center; padding-left: 120px; }
.page-head-office-title, .page-site-office-title { margin-bottom: 8px; font-weight: bold; }

.page-content.page-vision-content, .page-content.page-mission-content { color: #FFF; line-height: 29px; font-family:Arial, Verdana, Tahoma, sans-serif; padding: 40px; font-size:14px; padding-top: 15%; padding-bottom: 10%; }
.page-content.page-vision-content { padding-bottom: 1%;}

.span-1 { display: inline-block; width: 160px; }
.span-2 { display: inline-block; width: 200px; }
.span-3 { display: inline-block; width: 55px; }
.span-4 { display: inline-block; width: 105px; }
.span-5 { display: inline-block; width: 160px; }
.span-6 { display: inline-block; width: 403px; }
.span-7 { display: inline-block; width: 200px; }

#hidra-contact a {color:#fff;}




/* Photo Backgrounds */
#pageOne {
	background-image:url(assets/images/bg/bg-01.jpg);
	min-height: 100%;
}
.green {
	background-image:url(assets/images/bg/bg-green.jpg);
	background-position:center center;
	background-size: cover;
}
#addressBar {
	font-family : 'Gabriola', 'baskerville-italic', 'Monotype Corsiva', Georgia;
	padding:0px;
	text-align:center;
	color:#DBC64B;
	font-size:18px;
	min-height:110px;
}
#addressBar span {display:inline-block; padding:45px 1%;}

#pageTwo {
	background-image:url(assets/images/bg/bg-02.jpg);
	height: 100%; 
} 
#storyBehind {
	min-height:340px;
}
#pageThree {
	background-image:url(assets/images/bg/bg-03.jpg);
	height: 100%;
}
#pageFour{
	background-image:url(assets/images/bg/bg-04.jpg);
	min-height: 200%;
}
#pageFive{
	background-image:url(assets/images/bg/bg-05.jpg);
	height: auto;
	min-height:115%;
}
#pageSix{
	background:#fff;
	min-height: 100%;
}
#pageGallery{
	height: 100%; overflow:hidden; white-space: nowrap; background-image:url(assets/images/bg/bg-green.jpg);
	cursor:none;
}
.gallery-outer {
	white-space: nowrap; height:100%; position:relative;
}
#foodStory {
	min-height:40%;
}
.gallery .gallery-item {
	width:100%; height:100%; background-size:cover; background-repeat:no-repeat; background-position:center center; display:inline-block;
}

.section-content {
	font-family : 'Helvetica Light', Helvetica, Sans Serif;
	padding:45px 1%;
	color: #F9F5E4;
	font-size:0.8em;
	line-height: 1.3em;
	text-align:center; line-height: 18px;
}
.section-content h1 {
	font-family : 'Gabriola', 'baskerville-italic', 'Monotype Corsiva';
	color:#DBC64B;
	font-size:28pt;
	margin: 0px 0px 45px;
	letter-spacing: 2px;
}
.section-content p {
	margin-top:10px;
	line-height: 1.1em; font-size: 13px;
}

.bar h1.title {
display: block;
position: absolute;
top: 45%;
width: 100%;
color: #FFF;
text-transform: uppercase;
font-family: 'Helvetica Light', Tahoma, Arial, Helvetica, sans-serif;
font-weight: 300;
font-size: 2.3em;
letter-spacing: 0.1em;
text-align: center;
text-shadow: 0px 0px 60px rgba(0, 0, 0, 0.45);
}
.bar h1.title span {
font-family: 'Helvetica Light', Tahoma, Arial, Helvetica, sans-serif;
font-weight: 700;
}
#gal-cursor {width:42px; height:37px; position:absolute; z-index:9999; display:none; top: -1000px; }
/*
#gal-cursor.next { background: transparent url(assets/images/next.png) no-repeat; display:block; }
#gal-cursor.prev { background: transparent url(assets/images/prev.png) no-repeat; display:block; }
*/


* {margin:0;padding:0;text-decoration:none;border:0;}

body,html {
	width: 100%;
	height: 100%;
	-webkit-font-smoothing: antialiased;
	font-size: 16px;
	overflow: hidden;
	-webkit-overflow-scrolling: touch;
}

.wrapper {
	position: absolute;
	height: 100%;
	width: 100%;
	top: 0;
	overflow: auto;
}

.clear {
	clear: left;
}



.bar {
	position: relative;
	width: 100%;
}

.single {
	min-height: 100%;
	background: #fff;
}

.double {
	height: 50%;
	padding-top: 100%;
}

.triple {
	height: 300%; 
}

.heading {
	height: 400px;
}

.heading h1 {
	top: 40% !important;
}


.photo, #pageGalleryOuter, .page-section.page-gallery {
	background-size: cover;
	/*background-attachment: fixed;*/
	padding-bottom: 50px;
}

#mystory {
	height: 75%;
}

#about {
	height: 25%;
}

.white {
	min-height: 300px;
	background-color: #fff;
	-webkit-box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.3);
	box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.3);
	z-index: 800;
	font-family: Arial, Verdana, Tahoma, sans-serif;
	font-weight: 400;
	font-size: 1.063em;
	line-height: 1.25em;
	color: #7E756B;
}

.bar h2 a, .bar ul li a {
	color: #998b7d;
	padding-bottom: 2px;
	-webkit-transition:color 0.35s ease-out, border-bottom 1s ease-out;  
   -moz-transition:color 0.35s ease-out, border-bottom 1s ease-out;  
   -o-transition:color 0.35s ease-out, border-bottom 1s ease-out;  
   transition:color 0.35s ease-out, border-bottom 1s ease-out;
}

.bar h2 a:hover, .bar ul li a:hover {
	color: #2462ae;
	
}

.inner {
	padding: 55px 0 55px 0;
	width: 800px;
	margin: 0 auto;
}

.inner h2 {
	position: static;
	margin-bottom: 28px;
}

.inner ul {
	list-style-type: none;
}

#desktop {
	display: block;
}

#ipad {
	display: none;
}

.inner ul li {
	float: left;
	width: 375px;
}

.inner ul li:first-child {
	margin-right: 30px;
	width: 395px;
}

.inner ul li img {
	max-width: 100%;
}

.col {
	width: 33%;
	height: 100%;
	float: left;
	text-align: center;
	background-size: cover;
	background-position: center;
}

.col a {
	display: block;
	width: 100%;
	height: 100%;
	padding: 15em 0 15em 0;
	background-color: transparent;
	-webkit-transition:background-color 0.35s ease-out;
   -moz-transition:background-color 0.35s ease-out;
   -o-transition:background-color 0.35s ease-out;
   transition:background-color 0.35s ease-out;
}

.col a:hover {
	background-color: rgba(255,255,255,0.3);
}
	

.col h1 {
	width: auto;
	text-align: center;
	margin: 0 auto;
	position: static;
}

#col2 h1 {
	margin-top: -2%;
}

/*
#col2 a {
	padding: 60% 0 58.5% 0;
}*/

#connect h1 {
	top: 50px;
}

#connect h1 a {
	font-weight: 300;
}

#connect a {
	font-weight: 700;
	color: #fff;
	-webkit-transition:color 0.35s ease-out, border-bottom 1s ease-out;  
   -moz-transition:color 0.35s ease-out, border-bottom 1s ease-out;  
   -o-transition:color 0.35s ease-out, border-bottom 1s ease-out;  
   transition:color 0.35s ease-out, border-bottom 1s ease-out;
}

#connect a:hover {
	color: #9EC0E2;
}

#connect a#pdc {
	font-weight: 500;
}

#connect ul {
	margin-top: 140px;
	padding-bottom: 250px;
	color: #fff;
	font-size: 1em;
	line-height: 1.163em;
	font-family:  "proxima-nova", 'Helvetica Neue', Arial, Helvetica, sans-serif;
}

#connect ul span {
	font-weight: 700;
}

#connect ul li:first-child {
	width: 375px;
	margin-right: 80px;
}

#connect ul li {
	width: 300px;
	float: left;
}

/* Navigation */

#top {
	display: none;
}

nav {
padding: 7px 10px !important;
position: fixed;
top: 20px;
left: 0px;
z-index: 999;
padding-left: 20px !important;
}

nav .menu-corner { position:absolute; left: -30px; top:0px;}

nav ul {
	list-style-type: none;
}

nav ul li {
}

nav ul a {
	display: block;
	position: relative;
	font-family: 'coolvetica_rgregular', 'ArialMT', 'Arial', Gadget, sans-serif;
	font-weight:normal;
	font-size: 30px;
	z-index: 401;
	text-align: left;
	color: #000;
	padding: 10px 10px 2px 0px;
	text-transform:uppercase;
}
nav ul a:hover {
	/*text-shadow: 0px 0px 5px #000;*/
	color:#666;
}

.desc {
	position: relative;
	top: -5px;
	opacity: 0;
	-webkit-transition: opacity 0.45s;
	-moz-transition:    opacity 0.45s;
	-o-transition:      opacity 0.45s;
}

.hover {
	opacity: 1;
}

nav ul a div {
	position: relative;
	display: block;
	margin: 0 auto;
	width: 20px;
	height: 1px;
	padding-top: 19px;
	background: url(../img/button_shadow.png) no-repeat;
	background-size: cover;
	background-position: top;
	cursor:pointer;
}

nav ul a div:hover {
	background-position: bottom;
}

.page-content.page-core-values-content {
padding: 30px; position: relative; padding-top: 100px;
}
.page-core-values-title {
	background:transparent url(assets/images/core-values.png) no-repeat top center;
	width:304px; height:390px;
	line-height:10000;overflow:hidden; float: left; position: absolute;
	
}
.core-val-item { font-family:Arial, Verdana, Tahoma, sans-serif; color:#fff; margin-bottom: 15px; text-shadow:0px 0px 5px #000; -moz-text-shadow:0px 0px 5px #000; -o-text-shadow:0px 0px 5px #000; -webkit-text-shadow:0px 0px 5px #000; }
.page-content.page-core-values-content .main-content { margin-top: 65px; }
.core-val-title { font-size: 2em; }
.core-val-item.sustainability { margin-left: 475px; }
.core-val-item.efficiency_amp_effectiveness { margin-left: 340px; }
.core-val-item.competency { margin-left: 400px; }
.core-val-item.care_amp_responsibility { margin-left: 230px; }
.core-val-content ul { list-style: circle; padding-left: 19px; }

.productsOuter { position: relative; height: 100%; white-space: nowrap; }
.productColumn { vertical-align: top; display: inline-block; width: 33%; position: relative; height: 100%; font-family:Arial, Verdana, Tahoma, sans-serif; white-space: normal; 	-webkit-transition:width 0.35s ease-out, border-bottom 1s ease-out; -moz-transition:width 0.35s ease-out, border-bottom 1s ease-out;   -o-transition:width 0.35s ease-out, border-bottom 1s ease-out;  transition:width 0.35s ease-out, border-bottom 1s ease-out; overflow:hidden; }
.productColumn.productColumn1 { background-image:url(assets/images/bg/bg-01.jpg); }
.productColumn.productColumn2 { background-image:url(assets/images/bg/bg-02.jpg); width:34% }
.productColumn.productColumn3 { background-image:url(assets/images/bg/bg-03.jpg); }

.productColumn .page-content { position: absolute; bottom: 0px; padding: 10px; color: #FFF; text-align: center;}
.productColumn .main-content { background: rgba(0, 0, 0, 0.5); padding: 10px; text-align:justify; display:none; max-height:80%; margin-left: 10px; line-height: 23px; }
.productColumn .main-content p{ margin-bottom:10px; }
.page-field-development-title, .page-floating-lng-facility-title, .page-production-title { font-size: 40px; padding: 10px; text-shadow: 0px 0px 10px #000;} 

.core-val-content {
max-width: 500px;
}

.page-content.page-mission-content {
padding-top: 5%;
}

.pgouter {
text-align: left;
max-width: 60%;
display: inline-block;
}

#site-navigation img.site-logo {
margin-left:25px;
width: 100px;
height: auto;
}

div.menu-main-navigation-container {margin-left:25px; display: block; margin-top: 20px;}
#site-navigation div.mobile-title {display:none;}
/*a.active-link {color:#CCC;}*/

div.section-title {
	float: right;
	font-family: "DINBoldRegular", "Myriad Pro", Helvetica, Tahoma, "Nimbus Sans", Arial, sans-serif ;
	color: #FFF;
	text-transform: uppercase;
	font-size: 45px;
	text-align: right;
	width: 50%;
	white-space:normal;
	margin: 30px;
	line-height: 1em;
}
#home div.section-title { display: none; }
div.section-content {
	float: right;
	width: 500px;
	clear: both;
	text-align: left;
	padding: 0px;
	margin: 0px 30px;
	font-family: "Myriad Pro", Helvetica, Tahoma, "Nimbus Sans", Arial, sans-serif ;
	white-space:normal;
	font-size:12px;
}
a.nextpage-link {
position: absolute;
top: -85px;
left: 50%;
margin-left: -25px;
}
#hidra-contact div.section-title {
background: rgba(0, 0, 0, 0) url(assets/images/mail-black.png) no-repeat 1px 0px;
padding-left: 0px;
/*min-width: 600px;*/
position: relative; padding-top: 45px;
}
#hidra-contact div.section-title a.mailIcon {
	background: rgba(0, 0, 0, 0) url(assets/images/mail-big.png) no-repeat;
	display:none;
	position:absolute;
	top:0px;
	left:0px;
	width: 138px;
	height: 89px;
}

#hidra-directors {
/*background: #D49864;
background-image: none !important;*/
}
.section-content-full {
width: 100% !important;
margin: 0px !important; overflow:hidden; height: 100%; position:relative;
left: 0px;
top: 0px;
right: 0px;
bottom: 0px;
}
#hidra-directors .section-content {
width: 100%;
margin: 0px; overflow:hidden; height: 79%; position:relative;
}
.section-content .page-sections, .section-content-full .page-sections {
width: 100%; height:100%;
margin: 0px; display:block; white-space:nowrap; position:relative;
}
.section-content .page-section {
width: 100%; height:100%;
margin: 0px; display:inline-block; vertical-align:top;
}
.section-content .page-section .item-1, .section-content .page-section .item-2 {
width: 49%; height:96%;
display:block;
float:left; position:relative;
}
.section-content .page-section .item-1 .item-img {
position: absolute;
width: 35%;
right: 0px;
top: 0px;
margin-right:10px;
}
.section-content .page-section .item-1 .item-desc {
position: absolute;
left: 300px;
bottom: 60px;
margin-right: 10px;
width: 60%;
white-space: normal;
color: #fff;
font-size:12px;
}
.section-content .page-section .item-2 .item-img {
position: absolute;
width: 35%;
left: 0px;
top: 0px;
margin-left:200px;
}
.section-content .page-section .item-2 .item-desc {
position: absolute;
right: 25px;
top: 320px;
margin-left: 10px;
width: 60%;
white-space: normal;
color: #fff;
font-size:12px;
}
.section-content .page-section .item-title {
font-family : 'DIN-Bold', 'Arial Black', Arial, 'Tahoma', sans-serif;
font-weight:bold; 
text-transform:uppercase;
font-size:22px; 
margin-bottom: 15px;
line-height: 1.1em;
text-align: left;
}
#hidra-directors a.dir-next img, #hidra-directors a.dir-prev img, a.work-next img, a.work-prev img {
	border:0px;
	width:30px; height:auto;
}
#hidra-directors a.dir-next, #hidra-directors a.dir-prev, a.work-next, a.work-prev {
position: absolute;
right: 20px;
bottom: 30px;
z-index:1000;
cursor:pointer;
}
#hidra-directors a.dir-prev, a.work-prev {
right:auto;
left: 20px;
}

#hidras-work a.work-next,#hidras-work  a.work-prev {
bottom: 60px; display:none; 
}
#hidras-work .ngg-galleryoverview {
margin-left: 330px;
}
.page-gallery {
/*background:#999;*/
}

#hidras-work div.section-outer {
	/*text-align:left;*/
	
}
#hidras-work div.section-outer .section-inner {
	max-width:600px;
	padding-top:5%;
}

.gallerybox { margin-left: 30%; text-align:right; margin-top: 15px; white-space: normal; width: 67%;}
.gallerybox .navigation { padding: 3px; text-align:right; }
.galleryLoadingText { text-align: left; margin-left: 25%; margin-top: 30px; }
.gallery-item { display: inline-block; width: 160px; height: 110px; overflow:hidden; margin: 5px; vertical-align:top; border-radius: 8px; -o-border-radius: 8px;  -moz-border-radius: 8px;  -webkit-border-radius: 8px; box-shadow: 2px 2px 5px 0px #999; -o-box-shadow: 2px 2px 5px 0px #999; -moz-box-shadow: 2px 2px 5px 0px #999; -webkit-box-shadow: 2px 2px 5px 0px #999; }
.gallery-item a{display:block; margin:0px; width: 100%; height: 100%; background-size: cover !important; background-position: center center !important; background-repeat: no-repeat !important;}
.gallery-item img {display:block; margin:0px; width: 100%;}
.gallery-item.gallery-menu {background:#000;}
.gallery-item.gallery-menu a { color:#fff; font-size: 14px; padding: 6px 10px; margin: 5px 0px 5px; text-align: left;}
.gallery-item.gallery-menu a:hover, .flink.active { color:#fff; background: #ccc; text-shadow:0px 0px 3px #000; }
.navigation .navitem-gallery {background: #CCC; color: #000; font-size: 16px; display:  inline-block; margin: 3px; padding: 5px 10px; }
.navigation .navitem-gallery.active {background: #000; color: #fff; }


div.section-outer { margin-left: 300px; padding: 20px; text-align: center; color: #000; padding-bottom: 100px; }
div.section-outer .section-inner { max-width:600px; text-align:left; display:inline-block;width:100%; }
div.section-title { float: none; color: #343434; width:95%; text-align:left; font-family:'HelveticaNeue-CondensedBlack'; }
div.section-content { float: none; width: auto; color: #343434; }

section#hidra-directors .section-title {
display: none;
}
section#hidra-directors .section-inner ul a { font-family:'trajanpro-bold'; color:#999; font-size:26px; text-transform:uppercase;}
section#hidra-directors div.section-outer .section-inner ul.director-list {margin-top:15%;}
section#hidra-directors div.section-outer .section-inner ul.director-list li {text-align:center; padding:7px; }

.director-item h1 { margin-bottom: 0.5em; color: #807D78; text-transform: uppercase; text-decoration: underline; font-family: 'trajanpro-bold'; margin-top: 5%; }
.director-item .dir-links { margin-bottom: 5px; }
.director-item .videos .vid-item {display:none;}
.director-item .videos .vid-item iframe {display:block;}
.director-item .videos .vid-item.active {display:block;}
.director-item .dir-links a, .director-item .share-links a {color: #807D78; font-weight:bold;}
.director-item .dir-links a.active { text-decoration:underline; }
.director-item .dir-content .content { display:none; max-width:400px; }
.director-item .dir-content .content.active { display:block; }
.director-item .dir-content .content.bio { white-space: normal; margin-top: 20px; max-width: 410px;}
.director-item .vid-thumbs-outer {height:80px; overflow:hidden; position:relative; display:inline-block; width: 100%; }
.director-item .share-links {margin: 3px 0px 5px; }
.director-item .vid-thumbs { height: 110px; width: 400px; overflow: auto; }
.director-item .vid-thumbs a.vid-thumb-item { display: inline-block; height: 75px; width: 96px; background-color: #000; background-position: center center; background-size: auto 100%; margin: 1px; }

div.contact-item { display: inline-block; width: 48%; margin: 0px 1% 15px 0px; vertical-align: top; font-size: 13px; min-width: 210px;}
div.contact-title { font-family:'HelveticaNeue-CondensedBlack'; text-transform:uppercase; font-size: 15px;}

.vjs-default-skin .vjs-big-play-button {
left: 50%;
top: 50%;
margin-left: -63px;
margin-top: -42px;
}
a.vid-left { position: absolute; left: 0px; bottom: 4px; width: 43px; background: rgba(255, 255, 255, 0.6) url(assets/images/arrow-left-small.png) no-repeat center center; top: 0px; display:none; }
a.vid-left:hover { background-color: rgba(255, 255, 255, 0.9); }
a.vid-right { position: absolute; right: 0px; bottom: 4px; width: 43px; background: rgba(255, 255, 255, 0.6) url(assets/images/arrow-right-small.png) no-repeat center center; top: 0px; display:none; }
a.vid-right:hover { background-color: rgba(255, 255, 255, 0.9); }

div.section-content h2 {
font-family: 'HelveticaNeue-CondensedBlack'; font-size: 15px;
}
section#production-support .section-content {
max-width: 420px;
}
div.share-links {
margin: 5px 0px; color:#333;
}
div.share-links a{
color:#333;
}
#production-support div.share-links a, #production-support div.share-links { font-weight:bold;}
section#hidra-contact * {
color: #666 !important;
}

.player .video-wrapper {
max-height: 300px;
}


/* ============================= */
/* ! Layout for mobile version   */
/* ============================= */

@media handheld, only screen and (max-width: 1000px) {
	.pageAboutImg { 	position: absolute; left: 70px; top: 0px; width: 126px; right:auto; bottom:auto; }
	.page-content.page-home-about-content .main-content { margin-left: 216px; margin-right: 0px; padding:0px; }
}

@media handheld, only screen and (max-width: 767px) {
	section.single {
		padding-top: 45px;
	}
	div.section-title {
		float:none;
		width:auto;
		font-size:30px;
		text-align:left;
	}
	div.section-content {
		float:none;
		width:auto;
	}
	#site-navigation img.site-logo { width: 45px; height: auto; float: left; }
	#site-navigation div.mobile-title {
		display:block;
		text-align: right;
		color: #FFF;
		text-transform: uppercase;
		font-family: 'ArialMT','Arial', Verdana, sans-serif;
		font-weight: bold;
		font-size: 22px;
		padding: 15px 45px 14px 10px;
		background:transparent url(assets/images/list.png) no-repeat right center;
		margin-right:10px;
	}
	div.menu-main-navigation-container {display:none;}
	nav { padding:7px 10px !important; text-align:center; top:0px; left:0px; right:0px; }
	nav li {float:none !important; display:block;}
	nav ul a {font-size:20px; text-align:right; color:#fff; }
	nav ul a:hover {color:#ccc; }
	nav .menu-corner {display:none;}
	#pageOneSpanTop { height: 0%; }
	.porosLogo { margin:0px; }
	.porosLogo img { width: 50%; max-width: 289px; }
	.porosIntro { display: inline-block; font-size: 16px; background: rgba(0, 0, 0, 0.5); padding: 6px 10px 10px; text-align: left; width: auto; line-height: 20px; position: relative; margin-top: 9px; vertical-align: top; text-align:center;}
	.porosIntro .bracketLeft { position: absolute; top: 5%; left: -5%; height: 90%; }
	.porosIntro .bracketRight { position: absolute; top: 5%; right: -5%; height: 90%; }
	.pageAboutImg { position: relative; left: auto; top: auto; float:left; width: 126px; right: auto; bottom: auto; margin: 0px 13px; }
	.page-content.page-home-about-content .main-content { margin-left: 0px; margin-right: 0px; padding: 0px; }
	.page-organization-title {font-size:100px;}
	.page-content.page-organization-content .main-content td { font-size:20px; }
	.bracketBigLeft {width:100px; height:auto; left: -25px;}
	.bracketBigRight {width:80px; height:auto; right: -40px; top: 21px; }
	nav {
		background:rgba(0,0,0,0.8);
	}
	.page-content.page-vision-content {font-size: 10px !important; line-height: 28px; text-align: center; padding-top:  20px; padding-top: 14%; padding-bottom: 11%;}
	.page-content.page-mission-content {font-size: 10px !important; line-height: 28px; text-align: center; padding-top:  20px; padding-top: 14%;
padding-bottom: 0%;}
	#pageFour > div { height:auto !important; min-height:0px !important; }
	.span-6 { display: inline-block; width: 300px; }
	.page-core-values-title { background:transparent url(assets/images/core-values-med.png) no-repeat top center; width:152px; height:192px; line-height:10000;overflow:hidden; float: left; position: absolute; top: 80px; }
	.page-content.page-core-values-content .main-content { margin-top: 50px; }
	.core-val-item { margin-left:170px !important; }
	.productColumn .page-title, .productColumn .main-content {display:block !important; max-width: 100%;}
	.productColumn { vertical-align: top; display: block; width: auto !important; position: relative; height: auto; }
	.productColumn .page-content { position: relative; }

	#hidra-directors .section-content {
	width: 100%;
	margin: 0px; overflow:hidden; position:relative;
	}
	.section-content .page-sections {
	width: 100%; 
	margin: 0px; display:block; white-space:nowrap; position:relative;
	}
	.section-content .page-section {
	width: 100%; height:100%;
	margin: 0px; display:inline-block;
	}
	.section-content .page-section .item-1, .section-content .page-section .item-2 {
	width: 100%; height:auto;
	display:block;
	float:none; position:relative;
	}
	.section-content .page-section .item-1 .item-img {
	position: absolute;
	width: 100px; height:auto;
	left: 20px; top:0px;
	}
	.section-content .page-section .item-1 .item-desc {
	position: relative;
	padding-left: 0px;
	white-space: normal;
	color: #fff;
	top: 0px;
	}
	.section-content .page-section .item-2 .item-img {
	position: absolute;
	width: 100px; height:auto;
	left: 15px; top:20px;
	}
	.section-content .page-section .item-2 .item-desc {
	position: relative;
	padding-left: 0px;
	white-space: normal;
	color: #fff;
	top: 0px;
	margin: 0px;
	right: auto;
	left: 150px;
	padding-top: 20px;
	}
	.section-content .page-section .item-title {
	font-size:20px; 
	}
	a.nextpage-link {
	top: -115px;
	}
	#hidra-contact div.section-title {
	width: auto;
	min-width:inherit;
	}
	#hidra-contact div.section-title a.mailIcon {
	background: rgba(0, 0, 0, 0) url(assets/images/mail.png) no-repeat;
	width: 58px; height: 37px; display:none;
	}
	
	#hidras-work .ngg-galleryoverview {
	margin-left: 0px; margin-top:50px; 
	}
	#hidras-work  .page-section {padding-top:50px;}
	
	.single {
		height: auto;
		min-height: 90%;
		padding-bottom: 10%;
	}

	div.section-outer {margin-left:0px;}
	.video-js, .vidframe {width:100% !important; height:250px !important;}
	.director-item .vid-thumbs { width: 100%; }
	.nextpage-link {display:none;}
	.gallerybox  {width: 100%; margin-left: 0%; text-align: center;}
}

@media handheld, only screen and (max-width: 555px) {
	.pageAboutImg, .porosAboutBrace, .porosIntro .bracketRight, .porosIntro .bracketLeft { display:none; }
	.porosAbout .main-content { background:#fff url(assets/images/bracket-curly-top.png) no-repeat top center; padding-top: 75px !important; text-align: justify; }
	.page-organization-title { font-size: 30px; }
	.page-organization-title .line1, .page-organization-title .line2 {display:inline; line-height:1em; margin:0px;}
	.page-content.page-organization-content .main-content td { font-size:14px; }
	.bracketBigLeft { width:80px; height:auto; left: -20px; top: -20px; }
	.bracketBigRight { width:60px; height:auto; right: -40px; top: 21px; }
	.bracketBigLeft, .bracketBigRight {display:none;}
	.page-content.page-vision-content, .page-content.page-vision-content span {font-size: 25px !important; line-height: 25px; text-align: center; padding-top:  20px;}
	.page-content.page-mission-content, .page-content.page-mission-content span {font-size: 25px !important; line-height: 25px; text-align: center; padding-top:  20px;}
	.page-content.page-vision-content .span-1, .page-content.page-vision-content .span-2 {display:none;}
	.page-content.page-mission-content .span-3, .page-content.page-mission-content .span-4, .page-content.page-mission-content .span-5, .page-content.page-mission-content .span-6, .page-content.page-mission-content .span-7 {display:none;}
	#pageTwo > div {padding:10px 0px !important;}
	#pageTwo .page-organization-title {padding:15px;}
	.page-content.page-head-office-content { background: none; padding:10px; }
	.page-content.page-site-office-content { background: none; padding:10px; }
	#pageThree, #pageThree > div {height:auto !important;}
	#pageFour > div { height:auto !important; min-height:0px !important; }
	#pageFour {min-height:100% !important;}
	.page-core-values-title {
		background: rgba(0, 0, 0, 0) url(assets/images/core-values-med.png) no-repeat top center;
		width: 152px;
		height: 90px;
		line-height: 10000;
		overflow: hidden;
		float: none;
		position: absolute;
		top: 115px;
	}
	.core-val-item {margin-left:0px !important;}
	.page-content.page-core-values-content .main-content { margin-top: 200px; }
	.pgouter { text-align: left; max-width: 100%; display: inline-block; }
	a.nextpage-link {display:block;}
	#about-hidra-production a.nextpage-link {display:inline-block;}
	.section-content .page-section .item-1 .item-desc, .section-content .page-section .item-2 .item-desc {
	position: relative;
	left: 20px;
	bottom: 0px;
	margin-right: 0px;
	width: 87%;
	white-space: normal;
	}
	.section-content .page-section .item-1 .item-img, .section-content .page-section .item-2 .item-img {
	position: relative;
	width: 80px;
	height: auto;
	left: 20px;
	top: 0px;
	}
	.section-content .page-section .item-2 {
	width: 100%;
	height: auto;
	display: block;
	float: none;
	position: relative;
	margin-top: 20px;
	margin-bottom: 120px;
	}
	div.section-outer .section-inner {width:100%; }
	#site-navigation div.mobile-title, section#hidra-directors .section-inner ul a {font-size:15px;}
	.director-item h1 {font-size:20px;}
	.vid-thumbs-outer .vid-left, .vid-thumbs-outer .vid-right {display:block !important;}
}

/*Added For Video to Show !*/

body section#home{
	background: none !important;
}