/*
Theme Name: Zebra Wrecking
Theme URI: http://www.almostanything.com.au
Description: Zebra Wrecking 2009 Theme
Version: 1.0
Author: Jason Foss, Almost Anything Web and Graphic Design
Author URI: http://www.almostanything.com.au
*/

/*
 * COLOURS
 * red					:	ff0000
 * green				:	00ff00
 * blue					:	0000ff
 * 
 * based on 960 12 col grid
 * columns 60px
 * column gaps 20px
 *
 * CONTENTS
 * 1.Header and Body
 * 2.Main Content
 * 3.Forms
 * 3.Footer
 * 4.Navigation
 * 5.News
 * 6.Sidebar
 * 7.Homepage
 */

/*
 * 1.Header and Body
 */
body {
    margin: 0;
    padding: 0;
    font-family:Calibri, "Myriad Pro", Futura, "HelveticaNeue LT 45 Light", Arial, sans-serif;
    /* ditch the background image when you have your alignment sorted */
    color: #000;
	background:#fff url(images/BgRepeat.png) 0 -4px repeat-x fixed;
}
.outer {
    width: 960px; /* What were you expecting? We are using a 960 grid here you know */
    margin: 0 auto 0 auto;
    background:transparent url(images/headerBackground.png) top left repeat;
    border:1px solid #5b4f01;
    border-width:0 1px;
    -webkit-box-shadow:0 0 10px rgba(0,0,0,0.2);
    -moz-box-shadow:0 0 10px rgba(0,0,0,0.2);
}

div#contentcontainer {
    background:#fff url(images/contentBg.png) top left repeat-y;
    clear:both;
    position:relative;
    top:-4px;
}

#header {
    background: transparent url(images/phone.png) 95% 55% no-repeat;
    width: 100%;
    height: 200px;
    position: relative; /* this is here for search box positioning */
}
#header h1 {
    margin:0;
    padding: 30px 0 0 30px;
    font: normal bold 30px/100px sans-serif;
    width:297px;
    height:136px;
    text-indent:-9999px;
}

#header h1 a{
    color: #fff;
    text-decoration: none;
    width:297px;
    height:136px;
    display:block;
    background:transparent url(images/logo.png) top left no-repeat;
}

/*
 * 2.Main Content
 */
#content{
	padding:0 20px 20px 20px;
	margin: 0 228px;
	width: 464px; /* 6 cols */
	overflow:hidden;
	font:normal normal 1.2em/1.5em Calibri, "Myriad Pro", Futura, "HelveticaNeue LT 45 Light", Arial, sans-serif;
	color:#222;
}

#page6 #contentcontainer {
	background:#fff;
}

#page6 #content {
	margin:0;
	width:100%;
}

body.archive div.post {
	font-size:.8em;
	background:#f5f5f5;
	border-top:2px dotted #ccc;
	border-bottom:2px dotted #ccc;
	padding:.5em 1em;
	line-height:1.4em;
	margin:0;
	clear:both;
	overflow:hidden;
}

body.archive div.post h1 {
	font-size:1.3em;
	margin:.5em 0 0 0;
}

body.archive div.postimage {
	float:left;
	margin:0 1em 1em 0;
	border:1px solid #5b4f01;
	-webkit-box-shadow:5px 5px 0 rgba(91,79,1,0.23);
}

body.archive div.postimage a {
	display:block;
	line-height:0 !important;
}

body.archive div.even {
	background:transparent;
	border:none;
}

body.archive div.post p.postmetadata {
	clear:both;
}

.postexcerpt {
	overflow:hidden;
	width:350px;
	padding-top:1em;
	float:left;
	padding-right:10px;
}

.postexcerpt p {
	margin:0;
}

.readmore {
	float:left;
	margin:130px 0 0 0;
}

.single .yapb-image, .single img {
	border:2px solid #000;
	-webkit-box-shadow:2px 2px 4px #999;
	-moz-box-shadow:2px 2px 4px #999;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
}

#sendenquiry {
	margin:2em auto;
	width:202px;
	height:107px;
}

#sendenquiry a {
	width:202px;
	height:107px;
	background:transparent url(images/enquireButton.png) top left no-repeat;
	text-indent:-9999px;
	display:block;
}

h1, h2, h3, h4, h5 {
    color: #000;
	margin:.75em 0;
}

h1 {
	margin:.3em 0 .3em 0;
}

h1 a{
	text-decoration: none; /* cause posts start with h1 and they are always links */
}

.homepage #backtotop {
	display:none;
}

#contentcontainer p#backtotop {
	margin:0 auto 0 auto;
	position:relative;
	bottom:-4px;
	width:150px;
	clear:both;
	text-align:center;
}

#contentcontainer p#backtotop a {
	color:#fff;
	text-decoration:none;
	display:block;
	padding:.5em 1em;
	background:#5b4f01 url(images/menuLinkBg.png) top left repeat-x;
	-webkit-transition:all 200ms linear;
}

#contentcontainer p#backtotop a:hover {
	background:#746501 url(images/menuLinkBg.png) bottom left repeat-x;
	border-bottom:none;
	color:#fff;
}

a { /* please don't turn text-decoration off unless you have a really good reason! */
    color: #222;
}
a:hover {
    background-color: #f5f5f5;
    text-decoration: none;
}

.navigation {
	overflow:hidden;
	margin:1em 0;
	background:#f5f5f5;
	border:1px solid #ccc;
	padding:.5em 1em;
	clear:both;
}

.navigation .alignleft, .navigation .alignright {
	margin:0 !important;
}

a img {
	border:none;
}

body.homepage #speedypartsenquiry {
	margin:0 auto;
	padding:20px 0 0 0;
	width:505px;
	clear:both;
}

/* the next 3 rules are for the way WP sets its image floats */
#content img.alignleft, #content div.alignleft {
	float:left;
	margin:0 0.5em 0.5em 0;
}
#content img.alignright, #content div.alignright {
	float:right;
	margin:0 0 0.5em 0.5em;
}
#content img.aligncentered, #content div.aligncentered {
	text-align:center;
	margin:0 auto;
}
/* end WP image float thingies */

/*
 * 3.Forms
 * Override any of the default cforms styles here by prefixing with #content
 * to increase specifity
 */
#content .cform legend {
    font-family: sans-serif;
}
#content .cform fieldset {
    background: #cccccc;
}
.linklove { /*hides link to author but still gives them the backlink*/
    display: none;
}

/*
 * 3.Footer
 * Text should be a little smaller and more subtle in contrast.
 */
#footer {
	clear: both;
    background: #4d4301 url(images/footerBg.png) 0 -65px repeat-x;
    width: 100%;
	text-align:center;
	padding:.5em 0;
	overflow:hidden;
	border-top:4px solid #5a4e01;
}

#footercontent {
	width:960px;
	margin:0 auto;
}

#footer p {
    font-size: 0.85em;
    line-height: 2em;
	float:left;
	width:33%;
    color: #fff;
	margin:0;
}

#footer p#copyright {
	width:25%;
}

#footer p#address {
	width:50%;
}

#footer p#news {
	width:25%;
}

#footer a {
    color: #fff;
    text-decoration: underline;
	padding:.2em .5em;
}
#footer a:hover {
	background:#333;
	background:rgba(0,0,0,0.1);
	text-decoration:none;
}

#primary_sidebar li ul{ /* a nested list, so this should actually be displayed as a list */
	background:#efefef;
	padding:1em 0 1em 0;
	margin:0 -10px;
	border:1px solid #ddd;
	border-width:1px 0;
	list-style:none;
}

#primary_sidebar li li {
	margin:4px 0;
	overflow:hidden;
	line-height:30px;
}

#primary_sidebar li li a, #primary_sidebar li li strong {
	display:block;
	padding:0 1em 0 1em;
	margin:0 0 0 .5em;
	float:right;
	text-decoration:none;
	font-size:1.1em;
	color:#333;
	width:130px;
	letter-spacing:-1px;
	-webkit-transition:all linear 150ms;
	background:#e9e9e9;
}

#primary_sidebar li li a:hover, #primary_sidebar li li strong {
	color:#000;
	background:#fff;
	border-color:#fff;
	border-left:15px solid #ccc;
	-webkit-border-top-left-radius:14px;
	-webkit-border-bottom-left-radius:14px;
	-moz-border-radius-topleft:14px;
	-moz-border-radius-bottomleft:14px;
}

#primary_sidebar li li strong {
	border-left:15px solid #999;
}

#primary_sidebar h2, #secondary_sidebar h2 {
	line-height:1.6em;
}

/*
 * 4.Navigation
 * Ahhh, the fun part. If you get stuck, ask Jeff Vader. I'm his brother.
 * http://www.youtube.com/watch?v=7tUNNM-Hyu8
 */

/*** ESSENTIAL STYLES ***/
/* don't change these guys too much - unless you've got a really good reason! */
.nav, .nav * {margin:0;padding:0;list-style:none;}
.nav ul {position:absolute;top:-999em;}
.nav ul li {width: 100%;}
.nav li {float:left;position:relative;z-index:99;}
.nav a, .nav strong {display:block;}
.nav li:hover li ul, .nav li.sfHover li ul {top:-999em;}
.superfish li:hover ul, .superfish li li:hover ul {top: -999em;}

/*** NAVIGATION SKIN ***/
/* customise this as much as you like... */
#menu {
    width: 960px;
    background:transparent url(images/headerBackground.png) top left repeat;
	border-bottom:1px solid #eed94e;
    height: 35px;
	padding:0;
    line-height:40px;
    font-size: 1em;
	font-weight:bold;
	border-top:4px solid #5b4f01;
}

.nav {
	margin:0 auto;
	width:940px;
}

.nav li {
	text-align: center;
	margin:0 .3em;
}
.nav a, .nav strong {
	color: #000;
	text-decoration:none;
	padding:0 .7em;
	-webkit-border-bottom-left-radius:5px;
	-webkit-border-bottom-right-radius:5px;
	-moz-border-radius-bottomleft:5px;
	-moz-border-radius-bottomright:5px;
}

.nav strong {
	background:#5b4f01 url(images/menuLinkBg.png) top left repeat-x;
	color: #fff;
}

.nav a:focus, .nav a:hover, .nav a:active {
	background:#746501 url(images/menuLinkBg.png) bottom left repeat-x;
	color: #fff;
}
.nav ul{
	width:130px; /* dropdown width */
}
.nav li:hover ul, ul.nav li.sfHover ul { /* relative pozzie of dropdown */
	left:0px;
	top:31px;
}
.nav li li:hover ul, ul.nav li li.sfHover ul { /* pozzie of 2nd level dropdown */
	left:125px;
	top:-1px;
}
.nav li li {
	background:#ccc;
}
.nav li li li {
	background:#ccc;
}

/*
 * 5.News
 */
 .postmetadata{
	font-size:0.8em;
	font-style:italic;
}

/*
 * 6.Sidebar
 */
 
#page6 #primary_sidebar, #page6 #secondary_sidebar {
	display:none;
}

ul#primary_sidebar{
	width: 208px; /* 220 without the 1 px border & padding - 3 columns */
	float: left;
	margin:0;
	padding: 0 10px 10px 10px;
	list-style: none;
	background: #f5f5f5;
}

ul#secondary_sidebar{
	width: 208px; /* 220 without the 1 px border & padding - 3 columns */
	float: right;
	margin:0;
	padding: 0 10px 10px 10px;
	list-style: none;
	background: #f5f5f5;
}
#secondary_sidebar ul, #secondary_sidebar li{
	padding: 0;
	margin: 0;
	list-style: none;
}
#secondary_sidebar li ul{ /* a nested list, so this should actually be displayed as a list */
	background:#efefef;
	padding:1em 0 1em 0;
	margin:0 -10px;
	border:1px solid #ddd;
	border-width:1px 0;
	list-style:none;
}

#secondary_sidebar li li {
	margin:10px 0;
	overflow:hidden;
	line-height:40px;
}

#secondary_sidebar li li a {
	display:block;
	padding:0 .5em 0 1em;
	margin:0 .5em 0 0;
	float:left;
	text-decoration:none;
	font-size:1.3em;
	color:#666;
	letter-spacing:-1px;
	-webkit-transition:all linear 150ms;
	background:#e9e9e9;
	-webkit-border-top-right-radius:8px;
	-webkit-border-bottom-right-radius:8px;
	-moz-border-radius-topright:8px;
	-moz-border-radius-bottomright:8px;
	border:1px solid #ddd;
	border-left:none;
}

#secondary_sidebar li li a:hover, #secondary_sidebar li li.current-cat a {
	color:#000;
	background:#fff;
	-webkit-border-top-right-radius:13px;
	-webkit-border-bottom-right-radius:13px;
	-moz-border-radius-topright:13px;
	-moz-border-radius-bottomright:13px;
	border-color:#fff;
}

/*
 * 7.Homepage
 */
 body.homepage #content{
	width: 920px;
	margin: 0;
	padding-top:1em;
}

body.homepage div#contentcontainer {
	background-image:none;
}


.cta{
	width: 305px;
	float: left;
	height: 185px;
	margin:0 0 10px 0;
	text-align: center;
	background: #f3f3f3;
	border:1px solid #ddd;
	border-width:0 0 1px 1px;
	font-size:.8em;
}

.cta h2 {
	padding:0 0 .1em 10px;
	text-align:left;
	width:296px;
	color:#000;
	margin:0 0 0 -1px;
	background:#fff;
	border-bottom:3px dotted #666;
}

#cta2 h2 {
	color:#f00;
}

.cta ul, .cta li {
	list-style:none;
	margin:0;
	padding:0;
}

.cta .widget_text {
	overflow:hidden;
	margin:1em 12px 1em 0;
}

.cta .postimage, .cta p {
	float:left;
}

.cta br {
	display:none;
}

.cta .post-title {
	font-size:1.2em;
	font-weight:bold;
	text-decoration:none;
	display:block;
	width:230px;
	margin:.3em auto;
	padding:.2em .5em;
}

.cta .post-content-link {
	text-decoration:none;
	cursor:pointer;
	display:block;
}

.cta p {
	width:99px;
	padding:0 10px;
	line-height:1.4em;
	margin:0;
	text-align:left;
}

.cta .postimage {
	margin-left:10px;
}

.cta .postimage img {
	width:160px;
	height:120px;
	border:1px solid #333;
}

/*
 * CFORMS STYLES
 */

form.cform {
 	background:#eee !important;
	border:1px solid #ccc;
	width:350px;
	margin:1em auto;
	-webkit-box-shadow:0 0 20px #ccc;
	-moz-box-shadow:0 0 20px #ccc;
	box-shadow:0 0 20px #ccc;
 }
 
 #page9 form.cform, #page19 form.cform {
 	margin-top:-3.5em;
 }
 
form.cform ol.cf-ol li, form.cform ol.cf-ol li.cf-li-error {
	background:#eee !important;
	padding:.5em 1em !important;
	border:1px solid #fff !important;
	border-width:0 0 1px 0 !important;
}

form.cform label {
	display:block;
}

form.cform span {
	width:300px !important;
	text-align:left;
	font-weight:bold;
	font-family:Helvetica, sans-serif;
}

form.cform .emailreqtxt, form.cform .reqtxt {
	font-weight:normal;
	margin:0;
	clear:both;
	display:block;
}
 
form.cform ol.cf-ol li#li--2, form.cform ol.cf-ol li#li--4, form.cform ol.cf-ol li#li--6 {
	background:transparent !important;
}

form.cform textarea, form.cform input {
	margin:.5em 0;
	font-size:.9em;
	background:#ddd;
	border-color:#ccc;
	clear:both;
	padding:5px 10px !important;
	width:290px !important;
	color:#333;
	-webkit-border-radius:5px;
	-webkit-transition:all 200ms linear;
}

form.cform textarea {
	height:50px;
}

form.cform textarea:hover, form.cform input:hover {
	background:#f2f2f2;
	border-color:#999;
	-webkit-border-radius:0;
}

form.cform textarea:focus, form.cform input:focus, form.cform textarea:active, form.cform input:active {
	background:#fff;
	border-color:#999;
	color:#333 !important;
}

form.cform #sendbutton, form.cform #sendbutton2 {
	background:#fff;
	color:#333;
	margin:1em !important;
	width:100px !important;
	border:1px solid #999;
	border-color:#eee #ccc #ccc #eee !important;
}

form.cform #sendbutton:focus, form.cform #sendbutton2:focus, form.cform #sendbutton:active, form.cform #sendbutton2:active {
	border-color:#999 #eee #eee #999 !important;
	position:relative;
	top:1px;
	left:1px;
}

form.cform #cf2_field_5 {
	background:transparent;
	border:none;
	color:#000;
	font-size:.6em;
}