﻿/*
 * epc.Pacific. Styles
 * 
 */

/* ==========================================================================
   Base styles and resets
   ========================================================================== */

html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{*font-size:100%;}legend{color:#000;}
html{-webkit-text-size-adjust: none;}
strong{ font-weight:bold;}
img{ vertical-align:top;}
.cl{ clear:both; font-size:0;}

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }

html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
html, button, input, select, textarea { font-family: sans-serif; color: #222; }
body { margin: 0; font-size: 1em; line-height: 1.4; }

a { color: #00e; }
a:hover { color: #06e; }
a:focus { outline: thin dotted; }
a:hover, a:active { outline: 0; }
abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
pre, code, kbd, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }

q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }

ul, ol { margin: 0; padding: 0; }
li { list-style:none; margin:0; padding:0; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }

img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
svg:not(:root) { overflow: hidden; }
figure { margin: 0; }

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }

label { cursor: pointer; }
legend { border: 0; *margin-left: -7px; padding: 0; white-space: normal; }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
button, input { line-height: normal; }
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; *overflow: visible; }
button[disabled], input[disabled] { cursor: default; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; resize: vertical; }
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }

table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }

.chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }

.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }

/* ==========================================================================
   General
   ========================================================================== */
html { background:#fff; height:100%; }
body { font-family:'HelveticaNeueW01-45Ligh','courier new', Arial; font-size:15px; line-height:20px; color:#fff; height:100%; overflow:hidden; }

a { text-decoration:none; -webkit-transition: all 400ms ease; -moz-transition: all 400ms ease; -ms-transition: all 400ms ease; -o-transition: all 400ms ease; transition: all 400ms ease;
outline:none!important; }
	a:hover {color:#fff;}

input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { /* WebKit browsers */
    color:    #fff;
	opacity:1;
}
input:-moz-placeholder, textarea:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:    #fff;
	opacity:1;
}
input::-moz-placeholder, textarea::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:    #fff;
	opacity:1;
}
input:-ms-input-placeholder, textarea:-ms-input-placeholder { /* Internet Explorer 10+ */
    color:    #fff;
	opacity:1;
}

* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

img {max-width:100%; height:auto;}


/* ==========================================================================
   Styles
   ========================================================================== */
   
#sidebar {width:25%; float:left; background:#141414; overflow:hidden; height:100%;}
	#sidebar-inner {padding:40px 0px 0px 0px; width:100%; height:100%; position:relative;}	

		#header{ width:100%;}
			#logo{ display:block; max-width:306px; height:auto; margin:0px auto 75px auto; padding:30px; border-bottom:1px solid #222;}	
			.menu-toggle {display:none;}
			.nav{ list-style:none; display: block;}
				.nav li{ list-style:none; display:block;  text-align:center; padding:15px 0px;}
					.nav li a{ font-size:17px; line-height:17px; color:#fff; }			
					.nav li a:hover{ color:#999; }
					.nav li.on{background:url(../images/menu-btn-on.png) right center no-repeat;}
	
		#latest-news {position:absolute; bottom:120px; left:0px; width:100%; padding:0px 20px;}
		#latest-news a, #latest-news a:visited, #latest-news a {color: #fff;}
			#latest-news-inner { max-width:305px; margin:0 auto;}			
				#latest-news h3 {font-size:24px; line-height:24px; margin-bottom:45px;}
				.news-cont {height:220px; overflow:hidden;}
					.news-item {margin-bottom:15px;}
						.news-item img {max-width:90px; height:auto; float:left; display:inline-block; margin:6px 10px 10px 0px;}
						.news-item h4 {font-size:15px; line-height:25px; }
						.news-item .news-item-date {font-size:8px; line-height:8px; color:#FBAA19;}	
						
						.news-item .read-more {font-size:8px; line-height:8px; color:#fff; margin-left: 40px; padding-right: 20px; background-image: url(/images/read-arrows.png); background-position: right center; background-repeat: no-repeat; }							
#sidebar .read-more a, #sidebar .read-more a:link, #sidebar .read-more a:hover, #sidebar .read-more a:visited { color: #fff;}
#main {width:75%; height:100%;  float:left; overflow:hidden; background:url(../images/slide.jpg) center center no-repeat #959595; background-size:cover; }
#main.home{background:#959595;}
	#main-inner {width:100%; height:100%; position:relative;}			
		#home-slideshow {width:100%; height:100%; overflow:hidden; z-index: 1;}	
			#home-slideshow .slide {width:100%; height:100%; background-size:cover; background-position:center center; background-repeat:no-repeat;}
				#home-slideshow .slide img {width:100%; height:auto;}
				.project-link {display:block;  position:absolute; top:70px; right:20px; z-index:401; font-size:20px; line-height:20px; color:#D1D3D4; padding-right:24px; background:url(../images/icon-arrows.png) right center no-repeat;}
				.project-link:hover {color:#D1D3D4;}
				
		.slideshow-overlay {position:absolute; top:0px; left:0px; width:100%; height:100%; z-index:400; background:url(../images/slideshow-overlay.png) center center no-repeat; background-size:cover; display: none;}
		
		.cycle-pager {position:absolute; bottom:20px; right:150px;  z-index:401; }
			.cycle-pager span {display:block; width:20px; height:6px; overflow:hidden; text-indent:100%; background:#fff; float:left; margin-left:12px; cursor:pointer; opacity:0.46;}
			.cycle-pager span:hover, .cycle-pager span.cycle-pager-active {opacity:1;}
			
		#home-slideshow .slide-button{position:absolute; top:0px; z-index:401; top:50%; margin-top:-56px; width:22px; height:56px; display:block; cursor:pointer;}
			#home-slideshow #slide-prev { left:23px; background:url(../images/slide-prev.png) 0 0 no-repeat;}
			#home-slideshow #slide-next { right:23px; background:url(../images/slide-next.png) 0 0 no-repeat;}		
					
.news-single .date{ font-size: 14px;line-height: 10px;color: #FBAA19;font-style: italic;color: #fff;margin-top: 40px;margin-bottom: 40px!important;}
.news-single .entry h3 { margin-bottom: 8px; margin-bottom: 8px;
border-bottom: 1px solid #fff;
border-top: 1px solid #fff;
padding: 13px 0 17px;}
.news-single .entry h4 { margin-bottom: 25px;}

.news-single .archive ul, .news-single .archive li{ list-style: none; list-style-position: outside;}
.news-single .archive a:link, .news-single .archive a:visited, .news-single .archive:hover {color: #fff;}
.news-single .archive a img{
    height: 12px;
    width: auto;
    vertical-align: baseline;
}


.news-single .entry ul li:before {
    content:none !important;
    padding-right: 0!important;
}

.clearfix:before,
.clearfix:after { content: " "; display: table; }

.clearfix:after { clear: both; }


.news-single h2 span {font-size: 22px;color: #fff;}

.page {width:100%; height:100%; background:rgb(20,20,20); background:rgba(20,20,20,0.86); padding:75px 8% 0px 8%; height:100%; overflow:hidden; position:relative; z-index: 2;position: absolute;top: 0;}
.close-btn {display:block; width:18px; height:16px; overflow:hidden; text-indent:100%; background:url(../images/icon-close.png) center center no-repeat; position:absolute;  right:8%;}
.scrollarea {height:80%; overflow:hidden;}
	.entry {}
	.entry h2 {font-size:32px; line-height:34px; color:#A9AAAB; margin-bottom:30px;}
	.entry h3 {/* font-size:28px; line-height:30px;  */color:#fff; margin-bottom:25px; font-size: 24px;line-height: 24px;}
	.entry p {padding-bottom:20px;}
	.entry hr {border-color:#d1d3d4; margin:10px 0px 30px 0px;}
	.entry ul {margin-bottom:30px; list-style:none; position: relative;}
		.entry ul li {list-style:none;}
		.entry ul li:before { content: "-"; padding-right:20px;}	
		
		.entry ul li:before { content: "-"; position: absolute;
left: 0px; padding-right: none;}	
		.entry ul li { padding-left: 30px;}
		

	
	.entry  table {margin-bottom:20px;}
	.entry  table tr td {padding-bottom:5px;}
	.entry  table tr td:first-child{font-weight:bold; width:215px;}
	
	.live-link {color:#808285; text-transform:uppercase;}
	
	.content {max-width:745px; padding-bottom:20px;}
	.content.portfolio {max-width:1100px; }
	
	.portfolio-cont {margin:0px -3%;}
		.portfolio-item {float:left; width:25%; padding:0px 3%; margin-bottom:2%; position: relative; min-height: 220px;}
		.portfolio-item a {display:block; color:#fff;}
		.portfolio-item img {display:block; margin-bottom:40px; margin-bottom:15px;}
		.portfolio-item span {display:block; margin:10px 0; font-size:12px; line-height:12px;}
		.portfolio-item .portfolio-item__image{ height: 130px;}
		.portfolio-item span strong {  font-family:'HelveticaNeueW01-55Roma','courier new', Arial;  }
		
	#fancybox-thumbs.bottom {bottom: 25px;}	
		
	.project-info {max-width:64%; float:left;}
	.gallery-thumbs {max-width:20%; float:right; margin-right:4%;}
		.gallery-thumbs a {display:block; margin-bottom:30px;}	

	.gallery-popup {position:absolute;top:0px; left:0px; display:none;}
	.gallery-popup-inner {position:relative;}
	
		#gallery-slideshow {max-width:1245px; heigth:100%; overflow:hidden;}
		#gallery-slideshow  .slide {width:100%;}
				#gallery-slideshow  .slide img {width:100%; height:auto;}
		#gallery-slideshow .slide-button{position:absolute; top:0px; z-index:401; top:50%; margin-top:-56px; width:22px; height:56px; display:block; cursor:pointer; }
			#gallery-slideshow #slide-prev { left:23px; background:url(../images/gallery-prev.png) 0 0 no-repeat;}
			#gallery-slideshow #slide-next { right:23px; background:url(../images/gallery-next.png) 0 0 no-repeat;}
			
		.gallery-close-btn {display:block; width:19px; height:16px; overflow:hidden; text-indent:100%; background:url(../images/gallery-close.png) center center no-repeat; position:absolute;  top:20px; right:25px; z-index:400;}
		
.contact-cont {max-width:520px;}
.contact-form { display:block;}
	.contact-form input[type=text], .contact-form input[type=email], .contact-form textarea {display:block; width:100%; margin-bottom:15px; height:40px; background:rgb(143,145,148); background:rgba(143,145,148,0.63); border:0; padding:0px 20px;}
	 .contact-form textarea {padding:10px 20px; height:185px;}
	 .contact-form input[type=submit] {display:inline-block; width:130px;  background:#8F9194; border:0; padding:15px 0; color:#fff; margin-top:10px;}
	 
	  .contact-form .error {background-color: rgba(251, 90, 90, 0.63)!important;}
	 .two-fields {margin:0px -7px;}
	 	.two-fields .field {width:50%; float:left; padding:0px 7px; }
				
	.entry  table.contact-info {margin-bottom:20px; font-size:14px; line-height:22px;}
	.entry  table.contact-info  tr td {padding-bottom:20px;}
	.entry  table.contact-info  tr td:first-child{font-weight:normal; width:auto; padding-right:20px;}
	.entry  table.contact-info  tr td:last-child{font-weight:normal; width:auto; padding-left:20px;}
	.entry  table.contact-info  tr td:nth-child(2){font-weight:normal; width:auto; padding:0px 10px;}
	
	.contact-info a, .contact-info a:link, .contact-info a:hover, .contact-info a:visited { color: #fff;}
	.thankyou {display: none;}
	.news-hero {margin-bottom: 25px; max-width: 100%; height: auto;}
	
	.gallery-popup {width: 70%;}
	
	

	#cboxTitle {
		position: absolute;
	    bottom: 0;
	    left: 0;
	    color: #fff;
	    z-index: 1000;
	    width: 100%;
	    text-align: center;
	    background-color: rgba(0, 0, 0, 0.5);
	    padding: 10px 0;
	}

	#cboxCurrent{display: none !important;}
	/* .mCustomScrollBox {height: 100%;} */
	
	



/* ==========================================================================
   Colorbox
   ========================================================================== */
   
#cboxClose {
position: absolute;
top: 15px;
right: 15px;
display: block;
background: url(/images/gallery-close.png) no-repeat center center;
width: 19px;
height: 16px;
text-indent: -9999px;
}	

#cboxClose:hover {
background: url(/images/gallery-close.png) no-repeat center center;
}


#cboxNext {
position: absolute;
top: 50%;
right: 15px;
margin-top: -28px;
background: url(/images/gallery-next.png) no-repeat top right;
width: 22px;
height: 56px;
text-indent: -9999px;
}
#cboxNext:hover{
	background: url(/images/gallery-next.png) no-repeat top right;
}


#cboxPrevious {
position: absolute;
top: 50%;
left: 15px;
margin-top: -28px;
background: url(/images/gallery-prev.png) no-repeat top left;
width: 22px;
height: 56px;
text-indent: -9999px;
}

#cboxContent {
margin-top: 0;
}

#cboxLoadedContent {border: none;}


.entry table.contact-info strong{
font-family: 'HelveticaNeueW01-55Roma','courier new', Arial;
}

.entry table.contact-info {
margin-bottom: 20px;
font-size: 15px;
line-height: 25px;
}

.contact-form textarea {
height: 105px;
}

#cboxLoadedContent {overflow: hidden!important;}
/* ==========================================================================
   Media Queries
   ========================================================================== */

/*
@media only screen and (max-width:2155px){
	#gallery-slideshow {max-width: 87%;}
}

@media only screen and (max-width:1850px){
	#gallery-slideshow {max-width: 77%;}
}

@media only screen and (max-width:1635px){
	#gallery-slideshow {max-width: 67%;}
}


@media only screen and (max-width:1243px){
	#gallery-slideshow {max-width: 1243px;}
}
*/


.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0;}

ul.nav.active {
    position: relative;
}

  
/*Height related Queries  for the sidebar */   
@media only screen and (min-height:1100px){
	.news-cont {height: 300px;}
}
@media only screen and (max-height:923px){
	#latest-news {bottom:20px;}
		#latest-news h3 {margin-bottom:15px;}
		.news-cont {height: 180px;}
	#logo {margin: 0 auto 25px;}
	.nav li {padding: 10px 0;}		
}
@media only screen and (max-height:630px) and (min-width:768px){
	.nav{
		width: 74%;
		position: absolute;
		left: 50%;
		transform: translateX(-50%);
			-webkit-transform: translateX(-50%);
			-ms-transform: translateX(-50%);
	}
	.nav li {
    	padding: 10px;
    	display: inline-block;
	}
}





/* ==========================================================================
   iPad
   ========================================================================== */
@media only screen and (max-width: 1023px){	
	.portfolio-cont {margin:0px -1%;}
		.portfolio-item {float:left; width:50%; padding:0px 1%; margin-bottom:2%;}	
}

/* ==========================================================================
   iPhone
   ========================================================================== */
@media screen and (max-width: 765px), screen and (max-height: 522px) {
	
	html { background:#fff; height:100%; }
	body { height:100%; overflow:auto; min-height:100%; }
	body.homepage {height:100%;}
	
	#sidebar {width:100%; float:none; overflow:auto; height:auto;}
		#sidebar-inner {padding:0px 0px 0px 0px; height:auto; }
			#logo {padding-bottom: 15px; margin-bottom:0px; border-bottom:0;}
			.menu-toggle {display:block; cursor:pointer; border-top:1px solid #222; border-bottom:1px solid #222; padding:5px; text-align:center; font-weight:bold;}
			.nav {display:none;}
				.nav li, .nav li a {display:block; width:100%;}
		
		#latest-news {display:none;}	
		
	#main {width:100%; height:100%;  float:none;  }
		.page {height:auto; padding:8%;}
		.page {
height: 100%;
padding: 8%;
}

	.close-btn {display:none;}
	
	.entry  table.contact-info  tr td:first-child{padding-right:0px;}
	.entry  table.contact-info  tr td:last-child{ padding-left:0px;}
	.entry  table.contact-info  tr td:nth-child(2){padding:0px;padding-bottom:20px;}
	.entry  table.contact-info  tr td {padding-bottom:20px; display:block; width:100%;}
	
	.portfolio-item {padding: 0 3%;}
		.portfolio-item img {margin-bottom:15px;}
		
	.cycle-pager {right:30px;}
	
	.project-info {max-width:100%; float:none;}
	.gallery-thumbs {max-width:100%; width:100%; float:none; margin:0 -10px;}
		.gallery-thumbs a {display:block; width:50%; margin-bottom:30px; float:left; padding:0px 10px;}	
}