/*
Theme Name: Black Wolf
Description: Custom Wordpress theme for Black Wolf Electrical
Author: The Freeform Foundry
Author URI: http://www.thefreeform.com.au
Template: hero
Version: 1.0
*/
 
@import url("../hero/style.css");

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

}

body {
	color: #000 !important;
	-webkit-font-smoothing: antialiased !important;
}

h1, h2, h3, h4, h5, h6 {
	color: #000;
	font-family: 'bemioregular';
	font-weight: normal !important;
}

#logo img {
	width: 300px;
	height: 84px;
}

#homeBanner {
	height: 250px;
	max-height: 250px !important;
}

#homeBanner h2 {
	font-family: "bemioregular";
}

#homeBanner p {
	font-family: "Arial";
	text-transform: uppercase;
	font-size: 0.9em;
}


hr {
	border: 0;
	background-color: #dfdfde;
	height: 1px;
}

/*** Navigation ***/

#mainNav ul a {
	font-family: "bemioregular";
	text-transform: uppercase;
	-webkit-font-smoothing: antialiased !important;
}

/*** Home Page ***/

.homeSection h3 {
	color: #000;
	margin-bottom: 45px;
	font-family: 'bemioregular';
}

.intro-header {
	padding: 25px 0 25px 0;
}

#featuredPages .service {
	text-align: center;
	margin-right: 50px;
}

#featuredPages a {
	color: #000 !important;
}

#featuredPages .service h4 {
	text-transform: uppercase;
}

#featuredPages .service .domestic, #featuredPages .service .commercial, #featuredPages .service .led-lighting  {
	background-image: url(images/domestic-icon-home.png);
	width: 179px;
	height: 170px;
	text-align: center;
	margin: 0 auto;
	margin-bottom: 20px;
	opacity: 0.3;
}

#featuredPages .service a:hover .domestic, #featuredPages .service a:hover .commercial, #featuredPages .service a:hover .led-lighting {
	opacity: 1;
}

#featuredPages .service .commercial {
	background-image: url(images/commercial-icon-home.png);
	width: 196px;
}

#featuredPages .service .led-lighting {
	background-image: url(images/led-icon-home.png);
	width: 108px;
}

/*** Sub Page Banner ***/

#subPageBanner {	
	height: 140px;
	display: block;
	margin: 0px auto 0;
	width: 100%;
	position: relative;
	padding-top: 1px;
	overflow: hidden;
	background-color: #dddddd;
	background-image: url(images/banner.jpg);
}

#subPageBanner #bannerText {
	position: fixed;
	top: 195px;
	text-align: center;		
	width: 100%;	
}

#subPageBanner h1{	
	text-align: center;
	color:#fff;
	font-size: 42px;
	text-transform: uppercase;
	display: block;
	text-shadow: 0 0 8px rgba(0,0,0,.3);
	position: relative;
	top: 36%;
	margin: 0 auto 0px;
	padding: 0 0px;
	font-family: "bemioregular";
}

#subPageBanner p{	
	text-align: center;
	color:#fff;
	font-family: "bemioregular";
	font-size: 20px;
	display: block;
	text-shadow: 0 0 8px rgba(0,0,0,.7);
	position: relative;
	margin: 1px auto 1px;	
}

#pageHead h1 {
	color: #000;
	font-family: "bemioregular";
}

/*** Sub Pages ***/

#pageHead {
	border-bottom: none;
	border-top: none;
	margin-top: 0;
	margin-bottom: 15px;
}

/*** Sub Pages ***/

#sidebar .widgetBox h3, #footer .widgetBox h3 {
	color: #000;
	font-family: "bemioregular";
	font-size: 1.4em;
	text-transform: uppercase;
}

/***** Services Page *****/

#services h2.title {
	display: none;
}

.service {
	float: left;
	margin-right: 25px;
	min-height: 200px;
	width: 300px;
}

.liquid-slider-wrapper .liquid-nav {
	border-bottom: 1px solid #dfdfde;
	margin-bottom: 40px;
}

.liquid-slider-wrapper .liquid-nav a {
	background: none !important;
	font-family: "bemioregular" !important;
	font-size: 21px !important;
	padding: 0 !important;
	line-height: 53px;
	text-transform: uppercase;
}

.liquid-slider-wrapper li {
	width: 300px;
	margin-right: 25px !important;
	float: left;
	cursor: pointer;
}

.liquid-slider-wrapper .liquid-nav li a {
	padding-left: 70px !important;
	opacity: 0.3;
}

.liquid-slider-wrapper li.tab1 a {
	background: url(images/domestic-icon.png) no-repeat !important;
}

.liquid-slider-wrapper li.tab2 a {
	background: url(images/commercial-icon.png) no-repeat !important;
}

.liquid-slider-wrapper li.tab3 a {
	background: url(images/led-lighting-icon.png) no-repeat !important;
}

.liquid-slider-wrapper li.tab3 {
	margin-right: 0 !important;
}

.liquid-slider-wrapper .liquid-nav ul {
	margin-left: 0 !important;
}

.liquid-slider-wrapper .liquid-slider {
	background: #fff !important;
}

.liquid-responsive .liquid-slider .panel .panel-wrapper {
	padding: 0 !important;
}

.liquid-responsive .liquid-slider .panel .panel-wrapper {
	padding: 0 !important;
}

.liquid-nav li a.current {
	opacity: 1;
}


/*** Gallery Page ***/

.ngg-album-compactbox {
	background: none !important;
	padding: 0 !important;
	margin-right: 50px !important;
}

.ngg-album-compactbox .Thumb {
	min-width: 200px !important;
	min-height: 150px !important;
}

.ngg-album-compact {
	width: auto !important;
	height: auto !important;
}

.ngg-album-compactbox {
	width: auto !important;
	height: auto !important;
}

.ngg-navigation {
	height: 30px;
}

.ngg-album-compactbox .Thumb {
	border: none !important;
}

.ngg-album-desc {
	font-family: "bemioregular", Arial !important;
}

.ngg-album-compact h4 {
	width: auto !important;
}

.ngg-album-compact h4 a {
	color: #000 !important;
}

.ngg-gallery-thumbnail {
	background: none !important;
}

.ngg-gallery-thumbnail img {
	border: none !important;
	padding: 0 !important;
	margin: 0 !important;
}

.ngg-gallery-thumbnail-box {
	width: auto !important;
}

.ngg-gallery-thumbnail {
	margin: 0 50px 50px 0 !important;
}

.ngg-gallery-thumbnail-box.last .ngg-gallery-thumbnail {
	margin-right: 0 !important;
}

.ngg-navigation a.page-numbers, .ngg-navigation a.next, .ngg-navigation a.prev, .ngg-navigation span.page-numbers, .ngg-navigation span.next, .ngg-navigation span.prev {
	border: none !important;
}

.ngg-navigation a {
	color: #616160 !important;
}

.ngg-navigation a.page-numbers:hover, .ngg-navigation a.next:hover, .ngg-navigation a.prev:hover, .ngg-navigation span.page-numbers:hover, .ngg-navigation span.next:hover, .ngg-navigation span.prev:hover {
	background-color: #000 !important;
	color: #fff !important;
}

div#shDisplay img#shTopImg {
	border: none !important;
}

/***** Booking Form *****/

.wpcf7 textarea {
	font-size: 11px;
}

.wpcf7 input.half {
	width: 46%;
}

.wpcf7 input.full, .wpcf7 textarea.full, .wpcf7-form-control.wpcf7-select.wpcf7-validates-as-required.full  {
	width: 96%
}

.wpcf7 span {
	font-family: "Droid Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 12px;
	color: #b6b6b6;
}

.wpcf7-form-control-wrap {
	height: 30px;
	overflow: hidden;
	background: url(images/select-bg.png) no-repeat right;
}

.wpcf7-form-control-wrap select {
   background: transparent;
   color: #b6b6b6;
   width: 57px;
   height: 30px;
   padding: 5px;
   line-height: 1;
   border: 1px solid #ddd;
   border-radius: 0;
   -webkit-appearance: none;
   border-radius: 5px;
   -moz-border-radius: 5px;
   -webkit-border-radius: 5px;
}

.wpcf7-form-control-wrap.day select {
	width: 57px;
}

.wpcf7-form-control-wrap.month select {
	width: 130px;
}

.wpcf7-form-control-wrap.year select {
	width: 77px;
}

.wpcf7-form-control-wrap.time select {
	width: 35%;
}

.wpcf7-form-control-wrap input.wpcf7-date {
	width: 32% !important;
}


.wpcf7-form-control-wrap.service {
	width: 100% !important;
	margin: 4px 0 2px 0;
	min-height: 30px;
}

.wpcf7-form-control-wrap.service select {
	width: 100% !important;
}

.wpcf7-form-control-wrap.details {
	background: none ;
}

.wpcf7 input[type="text"], .wpcf7 textarea {
	background: #fff !important;
	color: #b6b6b6 !important;
}

.wpcf7 input[type="submit"] {
	background-color: transparent !important;
	background: transparent url(images/submit-bg.png) no-repeat !important;
	border: none;
	font-family: Arial;
	text-transform: uppercase;
	padding-right: 95px;
	width: 150px;
	height: 31px;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
}

.button:hover, #searchsubmit:hover, input[type="submit"]:hover {
	background-color: transparent !important;
}

.wpcf7 input[type="submit"]:hover {
	background-color: transparent !important;
}

/***** Footer Main *****/

#footer {
	background-color: #1d1d1b;
}

.footerBox p {
	font-size: 0.95em;
}

#footer .widgetBox h3 {
	color: #b2b2b2;
	font-family: "bemioregular";
	font-size: 0.95em;
	text-transform: uppercase;
}

#footer .main, #footer a {
	color: #616160;
	font-size: 0.95em;
}

#footer .textwidget {
	color: #616160;
	font-size: 0.8em;
}

#footer .footer-logo {
	background-image: url(images/footer-logo.png);
	width: 150px;
	height: 42px;
	margin-bottom: 30px;
}

#footer #contact-details span, #footer #contact-details a {
	margin-bottom: 5px;
	display: inline-block;
}

#footer #contact-details span.name {
	text-transform: uppercase;
	display: inline-block;
	width: 37px;
}

#footer #contact-details span.licence {
	display: block;
	margin-top: 15px;
}

#footer .wpcf7 input[type="text"], #footer .wpcf7 textarea {
	width: 100%;
}

#footer .wpcf7 textarea {
	height: 60px;
}

#footer .wpcf7 input[type="submit"] {
	background-color: transparent !important;
	background: url(images/submit-bg.png) no-repeat;
	border: none;
	padding-right: 95px;
	height: 31px;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
}

/***** Footer Secondary *****/

#footer .secondary a {
	text-transform: uppercase;
}


/*//////////////////////////////////////////////////////////////////// 
//  12 - Media Queries
////////////////////////////////////////////////////////////////////*/

/* iPad Landscape */

@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:landscape) {
	#homeBanner {
		height: 350px;
		background-position: center -50px !important;
	}
	
	#bannerText {
		position: absolute;
		top: 50% !important;
		margin-top: -50px;
	}
	
	.flex-direction-nav {display: none !important;}			
}

/* iPad Portrait */

@media only screen and (max-width: 975px) {	
	.thumbs {
		width: 675px;		
		margin: 0 auto;		
	}
	
	.flex-direction-nav {display: none !important;}		
}

@media only screen and (max-width: 768px) and (orientation:portrait) {	
	
	#homeBanner {
		height: 350px;
		background-position: center -50px !important;
	}
	
	#bannerText {
		position: absolute;
		top: 50% !important;
		margin-top: -50px;
	}	
	
	#comments { width: 100%;}
	
	#sidebar {
		float: none;
		width: 95%;
		margin-left: 2.5%;
		padding: 10px 0 30px 0 !important;		
	}
	
	#content.twoThirds {
		width: 95% !important;
		float: none;
	}
	
	.sidebarBox {	
		float: left;
		margin: 0 3% 30px 0 !important;
		width: 30%;	
	}	
	
	#comments { width: 100%;}	
}

/*layouts smaller than 600px, iPhone and mobiles*/
@media only screen and (max-width: 480px), screen and (max-device-width: 480px), screen and (max-width: 600px)  {

	html {
	    -webkit-text-size-adjust: none; 
	}
	
	h1 { font-size: 1.2em;}
	h2 { font-size: 1.1em;}
	h3 { font-size: 1.0em;}
	h4 { font-size: .9em;}
	h5 { font-size: .8em;}
	
	#header {			
		text-align: center;			
	}
	
	#header #logo {			
		margin: 0;					
	}
	
	#header #logo img {			
		max-width: 100%;
		height: auto;			
	}
	
	#pageHead {
		margin: 0 0px 25px;		
	}
	
	#pageHead h1 { font-size: 1.2em;}
	
	.flex-direction-nav, .flex-control-nav, .flex-caption { display: none !important;}	
	
	#main {
		width: 95%;		
		padding-top: 5px;
	}
	
	#mainNav {
		position: relative;			
		padding-top: 20px;
		top:0;
		right: 0;	
		width: 95%;
		margin: 0 0 0px 2.5%;		
		text-align: center;				
		height: auto;
	}	
	
	#mainNav li{
		margin: 0 0 0 0!important;	
		display: inline-block;		
		padding: 0 5px 0 5px;
		float: none;		
	}
	
	#mainNav .sub-menu li{		
		margin-left: 0 !important;
		padding-left: 0 !important;
	}
	
	#logo {
		float: none;
		margin-bottom: 10px;
	}
	
	#homeBanner {
		background-size: cover;
		background-attachment: inherit!important;		
		background-position: center bottom !important;
	}
	
	#bannerText {
		position: absolute;
		top: 50% !important;	
	}
}


/* iPhone Landscape */
@media screen and (max-width: 480px) and (orientation: landscape) {
	.thumbs {
		width: 300px;		
		margin: 0 auto;					
	}
	
	#homeBanner {		
		height: 180px!important;		
	}
	
	#bannerText {		
		margin-top: -30px;
	}
	
	#homeBanner p {
		font-size: 15px;
	}
}

/* iPhone Portrait */
@media screen and (max-width: 480px) and (orientation: portrait) {
	#homeBanner {		
		height: 180px!important;		
	}
	
	#bannerText {		
		margin-top: -20px;
	}
	
	#homeBanner p {
		font-size: 12px;
	}
}