@charset "UTF-8";

/*
Theme Name: The Outhouse
Theme URI: http://www.theouthouse.com.au
Description: Wordpress Theme custom built for The Outhouse website.
Author: Berry Web Design
Author URI: http://www.berryweb.com.au
Version: 1.0
Tags: centred, sidebar, wide header, wide footer
*/

/* ----------------------------
simple reset
---------------------------- */

html, body
{
	margin: 0;
	padding: 0;
}

h1, h2, h3, h4, h5, h6, p { margin: 5px; }

fieldset, img { border: 0; }

legend { color: #000; }

sup { vertical-align: text-top; }

sub { vertical-align: text-bottom; }

table
{
	border-collapse: collapse;
	border-spacing: 0;
}

caption, th, td
{
	text-align: left;
	vertical-align: top;
	font-weight: normal;
}

input, textarea, select
{
	font-size: 110%;
	line-height: 1.1;
}

abbr, acronym
{
	border-bottom: .1em dotted;
	cursor: help;
}


/* ----------------------------
layout
---------------------------- */

body {
	font-family: "PT Sans", Helvetica, Arial, sans-serif;
	font-size: 100%;
	color: #808080; /* mid grey */
	background: #400500; /* brown */
	margin: 0;
	background: url(images/the_outhouse_bg.png) repeat;
}

.container { /* centers the layout */
	/*width: 980px;*/
    max-width: 980px;
    padding: 0 10px;
	margin: 0 auto;

}

#header {
	margin-top: 40px;
	border-bottom: 2px solid #fff;

}

#wrapper {
	background: url(images/the_outhouse_green_bg.png) repeat;
	float:left;
/*	width:980px;*/
}

#sidebar {
/*	width: 270px;*/
    width: 27.551020408163%;
	float: left;
}

#mainwrapper {
	float: right;
/*	width: 710px;*/
    width: 72.448979591837%;
	margin: 0;
	padding: 0;
}

#main {
	background-color: #fff;
	padding: 20px 30px;
/*    min-height: 1430px;*/
}

#footer {
	border-top: 2px solid #fff;
}


	

/* ----------------------------
site styles
---------------------------- */

p {
	line-height: 1.2em;
}

h1 { font-family: 'Kameron', serif; color: #400500; font-size:180%; font-weight: normal;}
h2 { font-family: 'Kameron', serif; color: #400500; font-size:160%; font-weight: normal;}
h3 { font-family: 'Kameron', serif; color: #400500; font-size:150%; font-weight: normal;}
h4 { font-family: 'Kameron', serif; color: #400500; font-size:140%; font-weight: normal;}
h5 { font-family: 'Kameron', serif; color: #400500; font-size:130%; font-weight: normal;}
h6 { font-family: 'Kameron', serif; color: #400500; font-size:120%; font-weight: normal;}


a:link, a:visited {
	color: #000; /* black */
	text-decoration: none;
	}

a:hover, a:active {
	color: #000; /* black */
	text-decoration: underline;
}

#cmscontent p>img {
	border: 0;
}

blockquote {
	margin: 20px 0 0 5px;
	padding: 0;	
	color: #b8c698; /*green*/
}

blockquote h2 {
	margin: 0;
	padding: 0;
	color: #b8c698; /*green*/
}

.homepage {
	margin-top: 30px;
}

ul {
	line-height: 1.5em;
	padding-left: 20px;
	list-style-image: url(images/list.png);
	margin-left: 20px;
}

ul ul {
	list-style: square;
}

ol {
	padding-left: 20px;
}

address {
	font-style: normal;
}

.wp-caption {
	border: 0;
	text-align: right;
	background-color: #f2f2f2; /*light grey*/
	padding-top: 4px;
	margin: 10px;
}
.wp-caption img {
	margin: 0;
	padding: 0;
	border: 0 none;
}
.wp-caption p.wp-caption-text {
	font-size: 11px;
	line-height: 17px;
	padding: 0 4px 5px;
	margin: 0;
}

#cmscontent { /*adds space to make main extend length of sidebar */
	padding-bottom: 200px;
/*    min-height: 800px; */
    min-height: 840px;
}
	

/* ----------------------------
header & logo
---------------------------- */
	
#logo {
	width: 368px;
	margin:0;
	padding:0;
	float:left;
}

#phone {
	float: right;
	width: 280px;
	padding: 10px 10px 0 0;
	text-align: right;
	font-size: 120%;
	background: url(images/the_outhouse_green_bg_phone.png) no-repeat bottom;
	height: 68px;
}

#phone p {
	color: #400500; /*brown */
	padding-top: 35px;
	margin: 0;
}

.facebook{
    position: absolute;
    top: -20px;
    right: 0;
    background:url(images/facebook.png) no-repeat;
    width:32px;
    height:32px;
}

#header .container{
    position: relative;
}

/* ----------------------------
Main Navigation - jQuery accordion menu
---------------------------- */

#nav {
	height: 255px;
/*	width: 270px;*/
	background: url(images/the_outhouse_bg.png) repeat;
	padding-top: 15px;
	font-size: 80%;
}


#nav ul.menu, #nav ul.menu ul {
  	list-style-image:none;
	list-style-type:none;
  	padding: 0;
	margin: 0;
}

#nav ul.menu a {
	display: block;
  	text-decoration: none;
	text-transform: uppercase;
}


#nav ul.menu li a, #nav ul.menu ul.menu li a { /*menu item text color & position */
  	color: #fff;	
  	padding: 10px 0 10px 45px;
}

#nav ul.menu li.menu-item-32 a, .shiftnav-nav ul li.menu-item-32 a { /*home*/
	background: url(images/menu_home.png) no-repeat;
}

#nav ul.menu li.menu-item-31 a, .shiftnav-nav ul li.menu-item-31 a { /*gallery*/
	background: url(images/menu_gallery.png) no-repeat;
}

#nav ul.menu li.menu-item-30 a, .shiftnav-nav ul li.menu-item-30 a { /*units*/
	background: url(images/menu_units.png) no-repeat;
}

#nav ul.menu li.menu-item-35 a, .shiftnav-nav ul li.menu-item-35 a { /*units sub 1*/
	background: none;
}

#nav ul.menu li.menu-item-36 a, .shiftnav-nav ul li.menu-item-36 a { /*units sub 2*/
	background: none;
}

#nav ul.menu li.menu-item-29 a, .shiftnav-nav ul li.menu-item-29 a { /*requirements*/
	background: url(images/menu_requirements.png) no-repeat;
}

#nav ul.menu li.menu-item-28 a, .shiftnav-nav ul li.menu-item-28 a { /*contact*/
	background: url(images/menu_contact.png) no-repeat;
}

#nav ul.menu li.menu-item-32 a:hover { /*home hover - not highlighted on homepage*/
	background: url(images/menu_home_hover.png) no-repeat;
}

#nav ul.menu li.menu-item-31 a:hover, #nav ul.menu li.current-menu-item.menu-item-31 a  { /*gallery hover & current*/
	background: url(images/menu_gallery_hover.png) no-repeat;
}

#nav ul.menu li.menu-item-30 a:hover, #nav ul.menu li.current-menu-item.menu-item-30 a { /*units hover & current */
	background: url(images/menu_units_hover.png) no-repeat;
}

#nav ul.menu li.menu-item-35 a:hover, #nav ul.menu li.current-menu-item.menu-item-35 a {
	background: none;
}

#nav ul.menu li.menu-item-36 a:hover, #nav ul.menu li.current-menu-item.menu-item-36 a {
	background: none;
}

#nav ul.menu li.menu-item-29 a:hover, #nav ul.menu li.current-menu-item.menu-item-29 a {
	background: url(images/menu_requirements_hover.png) no-repeat;
}

#nav ul.menu li.menu-item-28 a:hover, #nav ul.menu li.current-menu-item.menu-item-28 a {
	background: url(images/menu_contact_hover.png) no-repeat;
}

#nav ul.menu li ul li a, #nav ul.menu ul.menu li ul li a { /*sub menu text color & position*/
  	color: #fff;
  	padding: 5px 0 0 60px;
	background-image: none;
}

#nav ul.menu li ul li a:hover, #nav ul.menu ul.menu li ul li a:hover { /*sub menu hover*/
  	background: none;
	text-decoration: underline;
}

#nav ul.menu a.active, #nav ul.menu ul.menu li a.active, #nav ul.menu a.active:hover, #nav ul.menu ul.menu li a.active:hover {
    text-decoration: none;
}

#nav div.panel {
    padding: 5px;
    margin-top: 1px;
}

#nav ul.menu div.panel a, #nav ul.menu div.panel li a:hover  {
    display :inline;
    color: #666;
    background: none;
    margin: 0;
    padding: 0;
    border: none;
    font-weight: bold;
}

#nav ul.menu div.panel a:hover {
    color: #000;
    text-decoration: underline;
}


/* ----------------------------
home slideshow
---------------------------- */

#homeslideshow {
	background: #fff;
/*	width: 710px;*/
    width: 100%;
}

#outhousehome, #outhousehome img{
    width:100%!important;
}

#outhousehome, .cs-outhousehome{
    width: 100%!important;
    min-height: 270px!important;
    height: auto!important;
    background-position: center!important;
}

/* ----------------------------
homepage readmore links
---------------------------- */

.homepage a:link, .homepage a:visited, .readmore:link, .readmore:visited {
	color: #fff;
	background-color: #b8c698; /*green*/
	padding: 0 3px;
	text-decoration: none;
}

.homepage a:hover, .homepage a:active, .readmore:hover, .readmore:active {
	text-decoration: underline;
}

/* ----------------------------
gallery slideshow
---------------------------- */

#slideshow-wrapper {
	margin-bottom: 300px;
}

/* ----------------------------
page titles
---------------------------- */

#pagetitle {
	float: right;
	text-align: right;
	font-size: 300%;
	font-family: 'Kameron', serif;
	letter-spacing: 0.1em;
	text-transform: lowercase;
	font-weight:normal;
	color: #400500; /* brown */
	margin-bottom: 40px;
	padding: 0;
}


/* ----------------------------
sidebar
---------------------------- */

#sidebar {
	padding-bottom: 50px;
}

#sidebar h1 {
	color: #400500; /*brown*/
	font-family: "Kameron", serif;
	padding: 15px 10px;
	font-size: 160%;
}

#sidebar h2 {
	color: #fff; /*white*/
	padding: 15px 10px;
	font-size: 140%;
	margin-bottom: 0;
    max-width: 220px;
}


/* ----------------------------
contact form (in Sidebar)
---------------------------- */

#sidebar form {
/*	width: 270px;*/
	margin: 0 auto;
}

#sidebar .frm_set_select .with_frm_style select, .frm_set_select .with_frm_style select.auto_width {
    width: 150px;
}

#sidebar .with_frm_style .frm_form_fields input.auto_width, .with_frm_style .frm_form_fields select.auto_width, .with_frm_style .frm_form_fields textarea.auto_width {
	width: 150px;
}

#sidebar h6 {
	font-size: 10%;
	visibility: hidden;
	margin:0;
}

#sidebar textarea {
	float: left;
	width: 145px;
}

#sidebar .with_frm_style .submit input[type="submit"], .frm_form_submit_style {	float: right;
	margin-right: 20px;}

#sidebar #frm_field_cptch_number_container {
	font-family: 'PT Sans Narrow', sans-serif;
	color: #000;
}

/* ----------------------------
footer
---------------------------- */

#footer {
	color: #808080; /*light grey*/
	font-size: 90%;
}

#footer a:link, #footer a:visited {
	color: #808080;
	text-decoration: none;
}

#footer a:hover, #footer a:active {
	color: #fff;
	text-decoration: underline;
}

#footerlinks {
	max-width: 550px;
	float: left;
	line-height: 0;
	
}

#footerlinks ul {
	list-style-image: none;
	list-style-type: none;
	margin:0;
	padding: 0;
	text-transform: lowercase;
}

#footerlinks li {
	display: inline;
	padding-right: 5px;
}

#footerlinks li:after {
	content:" .";
}


#footerlinks p {
	margin: 0;
	padding: 0;
}

#credits {
	width: 400px;
	float:right;
	text-align: right;
	margin-bottom: 50px;
}



/* ----------------------------
Wordpress image alignment styles
---------------------------- */
img.alignright {float:right; margin:0 0 1em 1em}
img.alignleft {float:left; margin:0 1em 1em 0}
img.aligncenter {display: block; margin-left: auto; margin-right: auto}
a img.alignright {float:right; margin:0 0 1em 1em}
a img.alignleft {float:left; margin:0 1em 1em 0}
a img.aligncenter {display: block; margin-left: auto; margin-right: auto}
#cmscontent .wp-caption p.wp-caption-text {font-size:70%; color: #1a1a1a}
.aligncenter {display: block; margin-left: auto; margin-right: auto}

/* ----------------------------
special classes
---------------------------- */

.clearfloat { /* stops elements below floats riding up */
	clear: both;
}

.show-for-small-only{
    display: none;
}

#ui-datepicker-div { display: none; } /* stops form date picker appearing on page load */

.medium-2{
    width: 48.5%;
    padding-right: 0.75%;
    float: left;
}

.homepage article:last-child{
    clear: both;
    padding-top:30px;
}

.bottom-content{
    margin-top:30px;
}

/* ----------------------------
Mobile Menu 
---------------------------- */

.shiftnav-toggle-main-block, .shiftnav .shiftnav-menu-title{
    display:none;
}

#shiftnav-toggle-main{
    background: none;
}
a.shiftnav-target{
    color: #400500;
    font-family: 'Kameron', serif;
    font-size: 20px;
/*    padding: 16px 0 16px 50px;*/
    background-position: 0 50%;
    padding: 10px 10px 10px 0!important;
}

.current_page_item a.shiftnav-target{
  background: #b8c698;
/*  color: #400500;*/
    
}

nav.shiftnav-nav ul.shiftnav-menu li.current_page_item{
    background: #b8c698;
}

.shiftnav-inner{
    background: #400500;
}

.shiftnav-nav ul li.menu-item-32 a, .shiftnav-nav ul li.menu-item-28 a, .shiftnav-nav ul li.menu-item-29 a, .shiftnav-nav ul li.menu-item-30 a, .shiftnav-nav ul li.menu-item-31 a, .shiftnav-nav ul li.menu-item-35 a, .shiftnav-nav ul li.menu-item-36 a{
    background-position: 0 50%;
    padding-left: 50px!important;
    color: white;
}

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

@media all and (max-width: 940px){
    .with_frm_style .frm_left_container label.frm_primary_label{
        float:none;
        display: block;
        margin-bottom:5px;
    }
    #sidebar .with_frm_style .frm_form_fields input.auto_width, .with_frm_style .frm_form_fields select.auto_width, .with_frm_style .frm_form_fields textarea.auto_width, #sidebar .frm_set_select .with_frm_style select, .frm_set_select .with_frm_style select.auto_width, #sidebar textarea, .with_frm_style .frm_left_container label.frm_primary_label{
        width:100%;
    }
 #sidebar .with_frm_style .submit input[type="submit"], .frm_form_submit_style{
    float:none;
 }
    .facebook{
        right: 8px;
    }
        
     /**** GALLERY PAGE ****/
    .container #wrapper{
        width:100%;
    }
    
    #wrapper #slideshow-wrapper{
        width: 100%;
    }
    #wrapper #slideshow-wrapper #fullsize{
        width: 100%;
        height: auto;
    }
    #wrapper #slideshow-wrapper #image{
        width: 100%;   
    }
    #wrapper #slideshow-wrapper #image img{
        position: relative;
    }
    #wrapper #slideshow-wrapper .imgnav{
        width: 38px;
        height: 48px;
        top: 43%;
    }
    #wrapper #slideshow-wrapper #slideleft, #wrapper #slideshow-wrapper #slideright{
        width: 4.5%;
    }
    #wrapper #slideshow-wrapper #slidearea{
        width: 90%;
        margin-left: 1%;
    }
    
    #wrapper #slideshow-wrapper #imglink{
        height: 100%;
        min-height: 340px;
    }
    /**** END GALLERY PAGE ****/
}

@media all and (max-width: 740px){
    #logo{
        width:100%;
        text-align: center;
    }
    
    #logo img{
        max-width:368px;
        width: 100%;
    }
    
    #header{
        margin-top:20px;
    }
    .menu-toggle{
        width:10%;
        float:left;
    }
    #mainwrapper, #sidebar{
        width: 100%;
    }
    #nav{
        display: none;
    }
    
    .show-for-small-only{
        display:block;
    }
    
    #cmscontent{
        padding-bottom:0;
    }
    #sidebar h2 {
        max-width:inherit;
    }
    .facebook{
        top: -67px;
        right: 8px;
    }
    .medium-2{
        width:100%;
        padding: 0;
    }
}

@media all and (max-width: 600px){
    #main{
        padding: 10px;
    }
    .container{
        padding: 0;
    }
    #header .container, #footer .container{
        padding: 0 10px;
    }
    #header{
        margin-top:15px;
    }
    .facebook{
        top: -62px;
    }
    .bottom-content img.alignright{
        float: none;
        margin: 0;
    }
}
/** HCWD Tweaks - May/June 2017 **/
#sidebar .with_frm_style label.frm_primary_label{
	display: block;
}
 #sidebar .with_frm_style .submit input[type="submit"], .frm_form_submit_style{
    	float:none;
	margin-left: 10px;
 }