/*
Theme Name: Jett Mining
Author: Slick Design
Author URI: http://www.slickdesign.com.au
Description: Website template for Jett Mining
Version: 1.0
*/

/* Jett Blue: rgba(0,66,111,1) #00426F */
/* Jett Bright Blue: rgba(36,171,226,1) #24ABE2 */
/* Jett Grey: rgba(147,152,155,1) #93989b; */
@import url(http://fonts.googleapis.com/css?family=Questrial);
html {zoom:1;}
body {background-color:#00426F;}
body, div, article, section, header, footer {padding:0;margin:0;font-family: 'Questrial', sans-serif;font-weight:300;color:#686E71;line-height:1.5em;}
input, textarea {font-family: 'Questrial', sans-serif;font-size:1em;outline:none;}
* { -webkit-box-sizing: border-box;-moz-box-sizing: border-box;	box-sizing: border-box;}
a, a:hover {text-decoration:none;-webkit-transition: all 0.25s ease-out;-moz-transition: all 0.25s ease-out;-o-transition: all 0.25s ease-out;transition: all 0.25s ease-out;}
.full-width-wrapper {width:100%;position:relative;}
header, footer, .wrapper {
	width:960px;	
	margin:0 auto;
	padding:0;
	overflow:hidden;
}
header {height:375px;width:960px;position:absolute;top:0;left:50%;margin-left:-480px;z-index:2;}
.marg-bottom {padding-bottom:40px;}
.top-holder {height:150px;}
.top-section {width:960px;height:100%;position:absolute;top:0;left:50%;margin-left:-480px;z-index:4;}
h1 {line-height:1.2em;color:#00426F;font-size:1.6em;}
h2 {font-weight:300;color:#24ABE2;font-size:1.6em;}
h3 {font-weight:300;color:#00426F;}

<!-- Slider -->
.rslidesholder {position:absolute;top:0;left:0;width:100%;height:300px;}
.rslides {margin:0;padding:0;}
.rslidesholder ul {margin:0;padding:0;position:relative;list-style: none;overflow: hidden;width:100%;height: 300px;}
.rslidesholder ul li {-webkit-backface-visibility:hidden;position: absolute;display: none;width:100%;left:0;top:0;height: 300px;}
.rslidesholder ul li:first-child {  position: relative;  display: block;  float: left;}
.slide-img {  display: block;  height: 300px;  float: left;  width: 100%;  border: 0;background-repeat:no-repeat;background-size:cover;}
.nav-container {position:absolute !important;bottom:2px;right:-3px;text-align:right;z-index:8;}
.nav-container ul {list-style:none;}
.nav-container ul li {background:url('images/pager.png') no-repeat center center;width:15px;height:14px;margin:2px;float:left;}
.nav-container ul li.rslides_here, .nav-container ul li:hover {background:url('images/pager-active.png') no-repeat center center;}
.nav-container ul li a {color:transparent;}
.nav-container ul li a:after {content:"#"}
.slider-over {position:absolute;bottom:6px;left:0;}

.bg_grid {background: url('images/background.jpg') center center;}
.grey_bg {background-color:#93989b;}
.dgrey_bg {background-color:#686E71;}
.lblue_bg {background-color:#24ABE2;}
.lblue_txt {color:#24ABE2 !important;}
.dlblue_bg {background-color:#177998;}
.blue_bg {background-color:#00426F;}
.dblue_bg {background-color:#013453;}
.white-fade {background: rgba(255,255,255,0.4);position:absolute;top:0;left:0;width:100%;height:80px;}
.white_txt {color:#FFFFFF !important;}

.search-holder {width:100%;margin:10px 0 5px 0;text-align:right;}
.input_text {height:19px;margin:0;}
.searchbutton { 
	background-image: url('images/search-icon.png');
    background-position:  0px 3px;
    background-repeat: no-repeat;
	background-size: 22px 20px;
	background-color:transparent;
    width: 22px;
    height: 22px;
    border: 0px;
    cursor: pointer;
    outline: 0;	
	float:right;
}
.logo-holder {float:left;width:356px;height:84px;margin-right:40px;margin-bottom:30px;}
.logo-holder img {width:100%;border:0;}
.slogan-holder {float:left;width:490px;height:84px;color:#24ABE2;font-size:1.7em;padding-top:14px;margin-bottom:30px;line-height:1.2em;}

.home-banner {background:url('images/home-banner.png') no-repeat top center;background-size:cover;box-shadow:inset 0px 8px 15px rgba(0,0,0,0.4)}

nav {width:100%;}
nav ul {list-style:none;margin:0;padding:0;}
nav ul li {float:left;width:13.4%;margin-right:1%;height:39px;-webkit-transition: all 0.25s ease-out;-moz-transition: all 0.25s ease-out;-o-transition: all 0.25s ease-out;transition: all 0.25s ease-out;}
nav ul li:hover, nav ul li a.active {height:45px;}
nav ul li a {text-decoration:none;color:#FFFFFF;display:block;height:100%;padding-top:10px;text-align:center;background-color:#00426F;}
nav ul li a:hover, nav ul li a.active {color:#00426F;background-color:#24ABE2;padding-top:16px;}
nav ul li:last-of-type {margin-right:0;}

.standard-link {color:#24ABE2;}
.standard-link:hover {color:#00426F;}

/* HOME 
/**************************************************************************************************/
.top-box {width:32.4%;height:120px;float:left;margin-right:1.33%;margin-top:20px;-webkit-transition: all 0.25s ease-out;-moz-transition: all 0.25s ease-out;-o-transition: all 0.25s ease-out;transition: all 0.25s ease-out;}
.top-box.grey_bg:hover {background:#686E71;}
.top-box.blue_bg:hover {background:#013453;}
.top-box:last-of-type {margin-right:0;}
.top-box .title {width:100%;height:44px;margin-top:10px;padding:2px 0 0 24px;color:#FFFFFF;font-size:1.8em;}
.top-box .text {width:100%;margin-top:2px;padding:12px 10px 0 24px;color:#FFFFFF;font-size:0.9em;}
.top-box .text a {display:block;border:1px solid #FFFFFF;height:39px;width:180px;color:#FFFFFF;text-align:center;font-size:1.2em;padding-top:10px;}
.top-box .text a:hover {background:#00426F;}
.top-box-link:hover {color:#24ABE2;}

.left-panel {float:left;width:256px;margin:40px 80px 0 40px;display:none;}
article {margin-bottom:26px;}
article .date {color:#00426F;font-size:1.4em;border-bottom:1px solid;margin-bottom:10px;}
article .excerpt {}
.read-more {display:block;color:#00426F;border:1px solid;width:129px;height:35px;text-align:center;padding-top:6px;margin-top:8px;}
.read-more:hover {color:#24ABE2;border:1px solid;background:#00426F;}

.right-panel {float:left;width:700px;margin:40px 0 0 50px;}
.quote-contact-holder {margin-top:40px;}
.quote-contact-holder h2 {display:inline;color:#00426F;line-height:1.5em;}
.quote-contact-holder .read-more {float:right;margin-top:0;}

/* SERVICES 
/**************************************************************************************************/
.service-section {border-top:1px solid #24ABE2;}

/* PROJECTS 
/**************************************************************************************************/
.project-section {border-top:1px solid #24ABE2;}

/* PRODUCT 
/**************************************************************************************************/
.product-section {border-top:1px solid #24ABE2;}

/* CONTACT
/**************************************************************************************************/
.contact-form-holder {width:50%;float:left;border-top:1px solid #24ABE2;margin-top:20px;padding-top:20px;}
.contact-form-holder:first-of-type {padding-right:30px;}
.contact-form-holder:last-of-type {padding-left:15px;}
.contact-form-holder p {margin:6px 0;color:#93989b;}
.contact-form-holder textarea {height:121px;}
.contact-form-holder input, .contact-form-holder textarea {width:100%;padding:4px;border:1px solid #FFFFFF;background:rgba(255,255,255,0.8);}

.map-holder {width:50%;float:left;border-top:1px solid #24ABE2;margin-top:20px;padding-top:50px;height:436px;}
#map_canvas {height:100%;}

.contact-table tr td {color:#686E71;font-size:1.1em;}
.contact-table a {color:#24ABE2;}
.contact-table a:hover {color:#00426F !important;}
.wpcf7-submit {color:#93989b;-webkit-transition: all 0.25s ease-out;-moz-transition: all 0.25s ease-out;-o-transition: all 0.25s ease-out;transition: all 0.25s ease-out;background:#FFFFFF;}
.wpcf7-submit:hover {color:#FFFFFF;cursor:pointer;background:#00426F;}

/* CAREERS
/**************************************************************************************************/
.job-holder {width:50%;float:left;padding-top:28px;}
.job-holder h3 {margin-top:0;border-bottom:1px solid #24ABE2;padding-bottom:9px;}
.job-holder section {padding-bottom:10px;margin-top:20px;border-bottom:1px solid #24ABE2;}
.job-holder section p:first-of-type {margin-top:0;}
.job-holder section:first-of-type {margin-top:0;}

.careers-form-holder {width:50%;float:left;padding-top:20px;padding-right:20px;}
.careers-form-holder p {margin:6px 0;}
.careers-form-holder textarea {height:121px;}
.careers-form-holder input, .contact-form-holder textarea {width:100%;padding:4px;border:1px solid #FFFFFF;}

/* GALLERY
***************************************************************************************************/
.gallery-holder {width:48%;margin-right:2%;margin-bottom:1%;float:left;}
.gallery-holder:nth-of-type(2n) {margin-right:0;}
.gallery-holder img {cursor:pointer;border:1px solid #24ABE2;}
.fade {display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.4);}
.large_img_holder {display:none;width:100%;text-align:center;position:absolute;top:100px;height:100%;}
.large_img_holder img {border:1px solid #24ABE2;}


/* SEARCH
/**************************************************************************************************/
.search-link {display:block;color:#00426F;border:1px solid;width:129px;height:35px;text-align:center;padding-top:6px;margin-top:8px;}
.search-link:hover {color:#24ABE2;border:1px solid;background:#00426F;}

/* FOOTER 
/**************************************************************************************************/
.footer {border-top:5px solid #24ABE2;padding-top:10px;padding-bottom:30px;}
.contact-holder, .address-holder, .social-holder {float:left;margin-top:20px;}
.footer-wrapper {background:#FFFFFF;border-top:6px solid #00426F;height:200px;}
.contact-holder {width:270px;}
.address-holder {width:350px;}
.social-holder {width:146px;float:right;}
.social-holder table tr td {text-align:right;}
table tr td {color:#000000;}
table {width:100%;font-size:0.9em;}
.small_txt {font-size:0.7em;}
.sep {color:#24ABE2;margin:0 8px;display:inline;font-size:0.8em;}
footer a {color:#000000;}
.align_right {text-alihn:right;}

.copyright, .author {color:#FFFFFF;width:50%;float:left;font-size:0.6em;margin-top:20px;}
.author {text-align:right;}
.author a {margin-right:8px;color:#FFFFFF;}

/* Flipping service CSS - David Walsh */
/* entire container, keeps perspective */
.f-social {margin-right:4px;}
.flip-container, .social-flip-container {-webkit-perspective: 1000;-moz-perspective: 1000;-o-perspective: 1000;-ms-perspective: 1000;perspective: 1000;}
/* flip the pane when hovered */
.flip-container.hover .flipper, .flip-container.flip .flipper, .social-flip-container.hover .social-flipper, .social-flip-container.flip .social-flipper {-webkit-transform: rotateY(180deg);-moz-transform: rotateY(180deg);-o-transform: rotateY(180deg);-ms-transform: rotateY(180deg);transform: rotateY(180deg);}
.flip-container, .front, .back, .social-flip-container, .social-front, .social-back {width:16px;height:18px;background-size:cover;background-repeat:no-repeat;float:right;}
.social-flip-container, .social-front, .social-back {width:36px;height:36px;background-size:cover;background-repeat:no-repeat;float:right;}
/* flip speed goes here */
.flipper, .social-flipper {-webkit-transition: 0.6s;-webkit-transform-style: preserve-3d;-moz-transition: 0.6s;-moz-transform-style: preserve-3d;-o-transition: 0.6s;-o-transform-style: preserve-3d;-ms-transition: 0.6s;-ms-transform-style: preserve-3d;transition: 0.6s;transform-style: preserve-3d;position: relative;}
/* hide back of pane during swap */
.front, .back, .social-front, .social-back {-webkit-backface-visibility: hidden;backface-visibility: hidden;position: absolute;top: 0;left: 0;}
/* back, initially hidden pane */
.back, .social-back {-webkit-transform: rotateY(180deg);-moz-transform: rotateY(180deg);-o-transform: rotateY(180deg);-ms-transform: rotateY(180deg);transform: rotateY(180deg);z-index: 2;}

/* Smartphones (portrait and landscape) ----------- */
.mob-menu-icon, .mob-menu {display:none;}
@media
only screen and (max-width : 480px) {
	.mob-hide {display:none;}
	.mob-menu {
		width:100%;
		height:100%;
		display:none;
		text-align:right;
		box-shadow: 
        inset 0px 11px 8px -10px rgba(0,0,0,0.6),
        inset 0px -11px 8px -10px rgba(0,0,0,0.6);
	}
	.mob-menu a {
		width:100%;
		display:block;
		clear:both;	
		color:#FFFFFF;
		padding:8px 16px 8px 0;
		border-bottom:1px solid rgba(36,171,226,0.2);
	}
	.mob-menu-icon {
		display:block;
		width:100%;
		cursor:pointer;
		background: url('images/mobile-menu.svg') no-repeat 95% center;
		background-size:30px;
		text-align:right;
		padding:10px 60px;
		color:#FFFFFF;
	}
	nav {display:none;}
	ul {padding:0 5%;}
	.wrapper, .top-section {width:100%;margin:0;padding:0 5%;}
	.right-panel {width:100%;margin:0;padding-bottom:30px;}
	header {width:100%;height:200px;}
	.top-holder {height:100%;}
	
	.top-section {position:relative;left:initial;top:initial;height:100%;overflow:hidden;}	
	.logo-holder, .slogan-holder, .search-holder {width:100%;margin:0;float:left;}
	.search-holder {padding-top:20px;}
	.logo-holder {margin-top:20px;}
	.slogan-holder {height:100%;padding-bottom:12px;}
	
	.top-box {display:none;}
	
	.quote-contact-holder h2 {display:block;}
	.quote-contact-holder .read-more {float:left;}
	
	/* CONTACT */
	.contact-form-holder, .map-holder, .job-holder, .careers-form-holder {width:100%;}
	.contact-form-holder, .contact-form-holder:first-of-type, .careers-form-holder {padding-right:0;}
	.mob-margin {margin-right:10px;}
	.map-holder {margin-top: 0px;padding-top: 30px;height:320px;}
	
	/* GALLERY */
	.gallery-holder {margin-right:0;width:100%;}
	
	/* FOOTER */
	footer {width:100%;}
	.footer {padding:0 5%;}
	.contact-holder, .address-holder, .social-holder {width:100%;}
	.contact-holder table tr td, .address-holder table tr td {width:50%;vertical-align:top;}
	.align_right {text-alihn:left;}
	.copyright, .author {width:100%;}
	.author {text-align:left;padding-bottom:10px;}
	.flip-container {float:left;margin:0 10px 0 0;}
}
/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
	html {zoom:0.76;}
}