/*
	Theme Name: White Oak Farm
	Theme URI: http://www.brilliantstudio.com
	Description: White Oak Farm
	Version: 1
	Author: Brilliant Studio
	
	License: MIT
	License URI: http://opensource.org/licenses/mit-license.php
*/

/*------------------------------------*\
    RESET
\*------------------------------------*/


html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}									

article, aside, figure, footer, header, hgroup, nav, section {display: block;}

/* Responsive images and other embedded objects
   Note: keeping IMG here will cause problems if you're using foreground images as sprites.
   If this default setting for images is causing issues, you might want to replace it with a .responsive class instead. */
img,
object,
embed {max-width: 100%;}

/* force a vertical scrollbar to prevent a jumpy page */
html {overflow-y: scroll;}

/* we use a lot of ULs that aren't bulleted. 
	don't forget to restore the bullets within content. */
ul {list-style: none;}

blockquote, q {quotes: none;}

blockquote:before, 
blockquote:after, 
q:before, 
q:after {content: ''; content: none;}

a {margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent;}

del {text-decoration: line-through;}

abbr[title], dfn[title] {border-bottom: 1px dotted #000; cursor: help;}

/* tables still need cellspacing="0" in the markup */
table {border-collapse: collapse; border-spacing: 0;}
th {font-weight: bold; vertical-align: bottom;}
td {font-weight: normal; vertical-align: top;}

hr {display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0;}

input, select {vertical-align: middle;}

pre {
	white-space: pre; /* CSS2 */
	white-space: pre-wrap; /* CSS 2.1 */
	white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
	word-wrap: break-word; /* IE */
}

input[type="radio"] {vertical-align: text-bottom;}
input[type="checkbox"] {vertical-align: bottom; *vertical-align: baseline;}
.ie6 input {vertical-align: text-bottom;}

select, input, textarea {font: 99% sans-serif;}

table {font-size: inherit; font: 100%;}
 
/* Accessible focus treatment
	people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active {outline: none;}

small {font-size: 85%;}

strong, th {font-weight: bold;}

td, td img {vertical-align: top;} 

/* Make sure sup and sub don't screw with your line-heights
	gist.github.com/413930 */
sub, sup {font-size: 75%; line-height: 0; position: relative;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}

/* standardize any monospaced elements */
pre, code, kbd, samp {font-family: monospace, sans-serif;}

/* hand cursor on clickable elements */
.clickable,
label, 
input[type=button], 
input[type=submit], 
button {cursor: pointer;}

/* Webkit browsers add a 2px margin outside the chrome of form elements */
button, input, select, textarea {margin: 0;}

/* make buttons play nice in IE */
button {width: auto; overflow: visible;}
 
/* scale images in IE7 more attractively */
.ie7 img {-ms-interpolation-mode: bicubic;}

/* prevent BG image flicker upon hover */
.ie6 html {filter: expression(document.execCommand("BackgroundImageCache", false, true));}

/* let's clear some floats */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }  
.clearfix:after { clear: both; }  
.clearfix { zoom: 1; }  

/*------------------------------------*\
    GLOBAL
\*------------------------------------*/

body{
background-image:url(img/bg.jpg);
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center center;
background-clip: border-box;
background-origin: padding-box;
background-size: cover;	
-moz-background-size:cover;
-webkit-background-size:cover;
-o-background-size:cover;
font-family: "garamond-premier-pro-display",serif;
font-weight:300;
color:#757575;
}

.header{
padding:8% 0 4% 0;	
}

/* Containers */

.outer-wrapper{
max-width:1000px;
width: 960px\9; /* IE8 and below */ 
margin:0 auto;
padding:0 8% 8% 8%;	
padding:0 0 30px 0\9; /* IE8 and below */ 	
}

.main-content-wrapper{
background-color:#FFF;
padding:2%;	
padding:12px\9; /* IE8 and below */ 	
}

.main-content{
border:4px solid #eaeaea;
padding:2%;
padding:12px\9; /* IE8 and below */ 	
}

/* Nav */

ul.nav{
background-color:#c4df9b;
height:42px;
padding-top:12px;
width:100%;	
}

ul.nav li{
float:left;	
width:20%;
*width:19%; /* IE7 and below */
text-align:center;
letter-spacing:1.25px;
}

ul.nav li a{
color:#FFF;
text-decoration:none;
font-size:24px;	
}

/* Typography */

h1{
max-width:1000px;	
}

h1 a{
display:block;
background-image:url(img/logo.png);
background-repeat:no-repeat;
background-size:cover;
width:685px;
height:143px;
text-indent:-9999px;
margin:0 auto;
}

h2{
font-size:48px;
letter-spacing:3.25px;
font-weight:300;
text-align:center;
margin:7% 0;	
}

h3{
font-weight:100;
font-size:24px;
letter-spacing:1.75px;
width:100%;
text-align:center;
}

h3.blog-footer-title{
border-bottom:1px solid #eaeaea;	
margin:0 0 2% 0;
}

h4{
width:100%;
font-size:36px;
font-weight:300;
margin:4.5% 0 3% 0;
line-height:1;
letter-spacing:1.75px;
}

h4.li-head{
width:100%;
font-size:24px;
font-weight:300;
margin:0 0 1.5% 0;
line-height:1;
letter-spacing:1.75px;
}

p{
line-height:1.5;
margin-bottom:12px;	
letter-spacing:1.2px;
}

a{
color:#757575;	
}

a:hover{
color:#999;	
}

i{
font-size:18px;
letter-spacing:1.25px;	
}

/*------------------------------------*\
    PAGES
\*------------------------------------*/

/* Home */

ul.taglines{
width:100%;	
padding-bottom:4%;
border-bottom:1px solid #eaeaea;
}

ul.tagline-images{
border-bottom:none;	
padding-bottom:2%;
}

ul.taglines li{
float:left;
width:33%;	
text-align:center;
vertical-align:baseline;
}

ul.taglines li img{
margin:0 auto;	
}

.home-content {
padding:0 2% 2% 2%	
}

.home-content img{
float:right;	
max-width:50%;
margin:0 0 2% 2%;
border:2px solid #eaeaea;
}

/* Gallery */


/* Products */

.list li {
  display: table;
  border-collapse: collapse;
  width: 100%;
  margin-bottom:5%;
}
.inner {
  display: table-row;
  overflow: hidden;
}
.li-img {
  display: table-cell;
  vertical-align: middle;
  width: 40%;
  padding-right: 5%;
  *float:left;/* IE7 and below */
  *width: 35%;/* IE7 and below */
}
.li-img img {
  display: block;
  width: 100%;
  width: 90%\9; /* IE8 and below */ 	
  height: auto;
}
.li-text {
  display: table-cell;
  vertical-align: middle;
  width: 57.5%;
  *width: 60%;/* IE7 and below */
}
.li-head {
  margin:0;
}

/* Blog */

.posts-container{
margin:8% 0 0 0;	
}

article{
border-bottom:1px solid #eaeaea;	
padding:0 6% 3% 6%;
margin-bottom:3%;
}

article:last-of-type{
border-bottom:none;	
}

.featured-thumb{
float:left;
margin:0 4% 1% 0;	
}

article h4{
margin:0;
width:auto;	
}

article h4 a{
text-decoration:none;	
}

.post-meta{
font-style:italic;
font-size:14px;
margin-bottom:2%;
letter-spacing:1px;	
}

.blog-image{
margin-bottom:2%;	
text-align:center;
}

.subscription-form{
float:left;
width:47.5%;	
}

.archive-container{
float:right;
width:47.5%;	
}

.archive-container li{
list-style-type:none;
float:left;
background-color:#eaeaea;	
padding:1%;
margin:2%;
border:1px solid #757575;
}

.archive-container li a{
text-decoration:none;	
}

.subscription-form{
color:#757575;
font-weight:300;	
font-family: "garamond-premier-pro-display",serif;
}

input#s2email{
width:100%;	
}

a.s2popup{
display:inline-block;
margin-top:10px;
text-align:center;
background-color:#eaeaea;	
padding:2%;
margin:15px 25%;
width:50%;
text-decoration:none;
border:1px solid #757575;
}

/* Contact */

.map{
background: white;
width: 65%;
float:right;
min-height: 200px;
padding-top: 33.33%;
position: relative;
margin:0 0 4% 4%;
border:1px solid #eaeaea;
}	

iframe {
width: 100%;
height: 100%; /* had to specify height/width */
position: absolute;
top: 0; right: 0;
left: 0; bottom: 0;     
}

.contact-info{
text-align:right;	
}

address{
font-size:18px;
font-style:normal;
letter-spacing:1px;
margin-bottom:3%;
line-height:1.25;	
}

dl{
letter-spacing:1px;	
}

dt{
font-weight:500;
font-size:18px;	
margin:1.5% 0 0.25% 0;
}

dd{
font-size:15px;	
}

a.mobile-only{
display:none;	
}

/*------------------------------------*\
    RESPONSIVE
\*------------------------------------*/

@media screen and (max-width: 1280px) {
	
.outer-wrapper{
padding:0 6% 6% 6%;	
}

.header{
padding:6% 0 4% 0;	
}

}

@media screen and (max-width: 1024px) {

.outer-wrapper{
padding:0 4% 4% 4%;	
}


}

@media screen and (max-width: 960px) {

h1 a{
width:540px;
height:113px;
}

h4{
font-size:32px;
}

ul.taglines li img{
margin:0 auto;	
width:60%;
}

ul.taglines li:nth-of-type(1) img{
margin:0 auto;	
width:45%;
}

ul.taglines li:nth-of-type(3) img{
margin:0 auto;	
width:40%;
}

}

@media screen and (max-width: 768px) {
	
h1 a{
width:480px;
height:100px;
}

h2{
font-size:40px;
letter-spacing:2.5px;	
}

h4{
font-size:28px;
}

/* Products */

.list li {
  display: block;
}
.inner {
  display:block;
  overflow: hidden;
}

.li-img {
  display:block;
  width: 94%;
  padding: 0% 3%;
}
.li-img img {
  max-width:400px;
  margin:0 auto;
}

h4.li-head{
width:100%;
font-size:24px;
font-weight:300;
text-align:center;
line-height:1;
letter-spacing:1.75px;
}

.li-text {
display: block;
vertical-align: middle;
width: 96%;
padding:2%;
text-align:center;
}

.li-head {
 margin:0;
}

/* Blog */

.featured-thumb{
width:150px;
}


.subscription-form, .archive-container{
float:none;
width:100%;
margin-bottom:20px;	
}

/* Contact */

.map{
background: white;
width: 100%;
float:none;
min-height: 240px;
padding-top: 33.33%;
position: relative;
margin:0 0 10% 0%;
border-bottom:1px solid #eaeaea;
}	

iframe {
width: 100%;
height: 100%; /* had to specify height/width */
position: absolute;
top: 0; right: 0;
left: 0; bottom: 0;     
}

.contact-info{
text-align:center;	
}

dt{
margin:3.5% 0 0.5% 0;	
}

dd span{
display:none;	
}

dd a.mobile-only{
display:inline-block;	
}

dd a{
display:inline-block;	
text-decoration:none;
padding:7px 8px 5px 8px;
background-color:#97bc5d;
font-weight:500;	
color:#FFF;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-shadow:    1px 1px 3px 0px #ccc;
-webkit-box-shadow: 1px 1px 3px 0px #ccc;
box-shadow:         1px 1px 3px 0px #ccc;
}
	
}


@media screen and (max-width: 640px) {
	
h1 a{
width:400px;
height:84px;
}

h2{
font-size:32px;
letter-spacing:2px;	
}

h3{
font-size:18px;
letter-spacing:1.25px;
}

h4{
font-size:24px;
text-align:center;
margin:5% 0;
}

/* Home */

.home-content img{
float:none;
max-width:100%;
margin:2% 0;
border:2px solid #eaeaea;
}

/* Blog */

article h4{
text-align:left;	
}

/* Blog */

.featured-thumb{
margin:0 6% 2% 0;
}
	
}

@media screen and (max-width: 540px) {

h2{
font-size:24px;
letter-spacing:1.75px;	
}

h3{
font-size:16px;
letter-spacing:1px;
}

h4{
font-size:24px;
margin:7% 0;
}

/* Blog */

.featured-thumb{
width:125px;
}

article{
padding:0 3% 5% 3%;
margin-bottom:5%;
}
	
}

@media screen and (max-width: 480px) {

.outer-wrapper{
padding:0 2% 2% 2%;	
}
	
h1 a{
width:360px;
height:75px;
}

ul.nav{
height:36px;
padding-top:10px;
}

ul.nav li a{
font-size:21px;	
}


/* Blog */

.featured-thumb{
float:none;
width:200px;
display:block;
margin:0 auto 3% auto;
}

article h4, .post-meta{
text-align:center;	
}
	
}


@media screen and (max-width: 420px) {
	
h1 a{
width:320px;
height:67px;
}

h2{
font-size:22px;
margin:9% 0;
}

h3{
font-size:15px;
}

h4{
margin:9% 0;
}

p{
font-size:14px;	
}

ul.nav{
background-color:#c4df9b;
height:30px;
padding-top:8px;
width:100%;	
}

ul.nav li a{
font-size:18px;	
}

/* Contact */

address{
font-size:16px;
margin:25% 0 5% 0;	
}

	
}

@media screen and (max-width: 360px) {
	
h1 a{
width:280px;
height:59px;
}

ul.nav li a{
font-size:16px;	
}

h2{
font-size:18px;
margin:9% 0;	
}

	
}

/*------------------------------------*\
    MISC
\*------------------------------------*/

::selection {
	background:#04A4CC;
	color:#FFF;
	text-shadow:none;
}
::-webkit-selection {
	background:#04A4CC;
	color:#FFF;
	text-shadow:none;
}
::-moz-selection {
	background:#04A4CC;
	color:#FFF;
	text-shadow:none;
}
   
/*------------------------------------*\
    WORDPRESS CORE
\*------------------------------------*/
   
.alignnone {
	margin:5px 20px 20px 0;
}
.aligncenter,
div.aligncenter {
	display:block;
	margin:5px auto 5px auto;
}
.alignright {
	float:right;
	margin:5px 0 20px 20px;
}
.alignleft {
	float:left;
	margin:5px 20px 20px 0;
}
.aligncenter {
	display:block;
	margin:5px auto 5px auto;
}
a img.alignright {
	float:right;
	margin:5px 0 20px 20px;
}
a img.alignnone {
	margin:5px 20px 20px 0;
}
a img.alignleft {
	float:left;
	margin:5px 20px 20px 0;
}
a img.aligncenter {
	display:block;
	margin-left:auto;
	margin-right:auto;
}
.wp-caption {
	background:#FFF;
	border:1px solid #F0F0F0;
	max-width:96%;
	padding:5px 3px 10px;
	text-align:center;
}
.wp-caption.alignnone {
	margin:5px 20px 20px 0;
}
.wp-caption.alignleft {
	margin:5px 20px 20px 0;
}
.wp-caption.alignright {
	margin:5px 0 20px 20px;
}
.wp-caption img {
	border:0 none;
	height:auto;
	margin:0;
	max-width:98.5%;
	padding:0;
	width:auto;
}
.wp-caption .wp-caption-text,
.gallery-caption {
	font-size:11px;
	line-height:17px;
	margin:0;
	padding:0 4px 5px;
}
.sticky {
	
}
.bypostauthor {
	
}

/*------------------------------------*\
    PRINT
\*------------------------------------*/

@media print {
	* {
		background:transparent !important;
		color:#000 !important;
		box-shadow:none !important;
		text-shadow:none !important;
	}
	a,
	a:visited {
		text-decoration:underline;
	}
	a[href]:after {
		content:" (" attr(href) ")";
	}
	abbr[title]:after {
		content:" (" attr(title) ")";
	}
	.ir a:after,
	a[href^="javascript:"]:after,
	a[href^="#"]:after {
		content:"";
	}
	pre,blockquote {
		border:1px solid #999;
		page-break-inside:avoid;
	}
	thead {
		display:table-header-group;
	}
	tr,img {
		page-break-inside:avoid;
	}
	img {
		max-width:100% !important;
	}
	@page {
		margin:0.5cm;
	}
	p,
	h2,
	h3 {
		orphans:3;
		widows:3;
	}
	h2,
	h3 {
		page-break-after:avoid;
	}
}