/*   
Theme Name: Arcola National Truck and Tractor Pull Theme
Theme URI: http://www.arcolapull.com
Description: Custom Wordpress theme developed for the Arcola National Truck and Tractor Pull.
Author: SAAL Advertising (Wes DeKoninck)
Author URI: http://www.saal.net
Version: 1
*/

/*
	HTML5 Reset Wordpress Theme :: style.css
	----------------------------------------------------------
	We have learned much from/been inspired by/taken code where offered from:
	
	Eric Meyer					:: http://ericmeyer.com
	HTML5 Doctor				:: http://html5doctor.com
	and the HTML5 Boilerplate	:: http://html5boilerplate.com
	
	Special thanks: The Wordpress theme owes its start to an empty theme authored 
		by Chris Coyier & Jeff Starr: http://digwp.com
	
-------------------------------------------------------------------------------*/

/* Let's default this puppy out
-------------------------------------------------------------------------------*/

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, like, say for Google Maps custom placemarkers. 
   There has been a report of problems with standard Google maps as well, but we haven't been able to duplicate or diagnose the issue. */
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;}

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;}

input, select {vertical-align: middle; font-size:0.75em;}

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;}

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));}


/* Ok, this is where the fun starts.
-------------------------------------------------------------------------------*/

/* we like off-black for text */
body, select, input, textarea {color: #333;}

/* Custom text-selection colors (remove any text shadows: twitter.com/miketaylr/status/12228805301) */
::-moz-selection{background: #181818; color: #fff; text-shadow: none;}
::selection {background: #181818; color: #fff; text-shadow: none;} 

/* And here begins the Wordpress fun.
-------------------------------------------------------------------------------*/
.post {}

.entry-content {}
.entry-content a {}
.entry-content a:hover {}

#meta {}
.postmetadata {}

#sidebar {}

.navgation {}
.next-posts {}
.prev-posts {}

#searchform {}
#s {}
#searchsubmt {}
	
ol.commentlist {list-style: none;}
ol.commentlist li {}
ol.commentlist li.alt {}
ol.commentlist li.bypostauthor {}
ol.commentlist li.byuser {}
ol.commentlist li.comment-author-admin {}
ol.commentlist li.comment {border-bottom: 1px dotted #666; padding: 10px;}
ol.commentlist li.comment div.comment-author {}
ol.commentlist li.comment div.vcard {}
ol.commentlist li.comment div.vcard cite.fn {font-style: normal;}
ol.commentlist li.comment div.vcard cite.fn a.url {}
ol.commentlist li.comment div.vcard img.avatar {float:right; margin: 0 0 10px 10px;}
ol.commentlist li.comment div.vcard img.avatar-32 {}
ol.commentlist li.comment div.vcard img.photo {}
ol.commentlist li.comment div.vcard span.says {}
ol.commentlist li.comment div.commentmetadata {}
ol.commentlist li.comment div.comment-meta {font-size: 10px;}
ol.commentlist li.comment div.comment-meta a {color: #ccc;}
ol.commentlist li.comment p {}
ol.commentlist li.comment ul {}
ol.commentlist li.comment div.reply {font-size: 11px;}
ol.commentlist li.comment div.reply a {font-weight: bold;}
ol.commentlist li.comment ul.children {list-style: none; margin: 10px 0 0;}
ol.commentlist li.comment ul.children li {}
ol.commentlist li.comment ul.children li.alt {}
ol.commentlist li.comment ul.children li.bypostauthor {}
ol.commentlist li.comment ul.children li.byuser {}
ol.commentlist li.comment ul.children li.comment {}
ol.commentlist li.comment ul.children li.comment-author-admin {}
ol.commentlist li.comment ul.children li.depth-2 {border-left: 5px solid #555; margin: 0 0 10px 10px;}
ol.commentlist li.comment ul.children li.depth-3 {border-left: 5px solid #999; margin: 0 0 10px 10px;}
ol.commentlist li.comment ul.children li.depth-4 {border-left: 5px solid #bbb; margin: 0 0 10px 10px;}
ol.commentlist li.comment ul.children li.depth-5 {}
ol.commentlist li.comment ul.children li.odd {}
ol.commentlist li.even {background: #fff;}
ol.commentlist li.odd {background: #f6f6f6;}
ol.commentlist li.parent {border-left: 5px solid #111;}
ol.commentlist li.thread-alt {}
ol.commentlist li.thread-even {}
ol.commentlist li.thread-odd {}


/* Print styles!
-------------------------------------------------------------------------------*/
@media print {



}


/* Media queries!
-------------------------------------------------------------------------------*/

/* Consider this: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/ */
@media screen and (max-device-width: 480px) {
	
		
}

@media all and (orientation: portrait) {
	
}

@media all and (orientation: landscape) {
	
}


/* Start custom theme styles
-------------------------------------------------------------------------------*/

/** Global **/
body { background: #181818 url(images/body-bg.jpg) no-repeat top center; font-size:1em; }

#page-wrap { background: #fff url(images/content-top-bg.png) repeat-x top left; width:960px; margin:0 auto; position:relative; }

.fl { float:left; }
.fr { float:right; }
.tl { text-align:left; }
.tr { text-align:right; }

.cf:before,
.cf:after {
    content:"";
    display:table;
}
.cf:after {
    clear:both;
}
.cf {
    zoom:1; /* For IE 6/7 (trigger hasLayout) */
}

/** Typography **/
body { font-family:Arial, Helvetica, sans-serif; }
p { font-size:.75em; margin-bottom:15px; line-height: 1.833em;} /* 22/16 */ 
h1, h2, h3, h4, h5, h6 { font-weight:bold; color:#b11216; margin-bottom: 15px; text-transform:uppercase; }
h1 { font-size:1.5em; } /* 24/16 */ 
h2 { font-size:1.375em; } /* 22/16 */ 
h3 { font-size:1.125em; } /* 18/16 */ 
h4 { font-size:0.875em; } /* 14/16 */ 
h5 { font-size:0.75em; } /* 12/16 */ 
h6 { font-size:0.625em; } /* 10/16 */ 
a { color:#b11216; font-style:italic; }
hr { border: 0; height: 0; border-top: 1px solid #d5d5d5; margin-bottom:15px; }
ul li { font-size: 0.75em; margin-bottom:0.3125em; /* 5/16 */}
table { margin-bottom: 20px; }
table tr td { font-size: 0.75em; /* 12/16 */ }

/** Header **/
#header { padding:0.875em 0.875em 0 0.875em; /* 14/16 */ }
#header p { color:#717171;  }
#header ul li { display:inline-block; }
#header li { color:#717171; font-size:0.75em;}
#header h2.header-logo { display:block; position:absolute; top:0; left:380px; height:185px; width:204px; background: transparent url(images/header-logo.png) no-repeat top center;  text-indent:-9999px; z-index:100;}

#header-nav { background: transparent url(images/header-nav-bg.png) no-repeat top center; width:988px; height:81px; display:block; position:relative; left:-1.8125em; top: 0; padding:0; margin:0;}
#header-nav ul { margin-top: 1.5em; /* 24/16 */ }
#header-nav li { margin: 0 0.9375em; /* 15/16 */ display:inline; }
#header-nav li a { color:#fff; text-transform:uppercase; text-decoration:none; font-style:normal; font-weight:bold; }
#header-nav li a:hover { text-decoration:underline; }
.header-nav-menu { width:38%; margin: 0 15px;  }
ul#menu-header-nav-right li, ul#menu-header-nav-left li { display:inline; }
#header li.header-social-list-intro { padding:10px 65px 0 0; background: transparent url(images/social-arrow.png) no-repeat right center; }
#header a.social-fb-icon, #header a.social-yt-icon { height:32px; width:32px; display:block; text-indent:-9999px; background: transparent no-repeat top center; }
#header div.news-social { margin-bottom:0.5em; }
#header ul.social-links { margin-top:-5px; }
#header ul.social-links li { vertical-align:middle; margin-left:10px; float:left; }
#header a.social-fb-icon { background-image: url(images/fb-icon.png); }
#header a.social-yt-icon { background-image: url(images/yt-icon.png); }

/** Featured **/
#featured-slider { position:relative; top:-0.6875em; overflow:hidden; height:330px; width:960px; border-bottom: 10px solid #d5d5d5;}
#featured-slider img {width:100%; height:auto;}

/** Left Column **/
#left-col { width: 560px; padding: 0 0.9375em; /* 15/16 */ }
h1.date-banner { display:block; margin-left:-1.2083em; /* 29/24 */ height:52px; width:536px; padding:0.625em 0.625em 0 2.9167em; background: transparent url(images/content-date-banner.png) no-repeat top left; color:#fff; } 
h1.page-header { display:block; margin-left:-1.2083em; /* 29/24 */ height:52px; width:558px; padding:0.625em 1em 0 1em; background: transparent url(images/page-header-banner.png) no-repeat top left; color:#fff; } 

#left-col form input[type="text"], #left-col form textarea { padding: 0.625em; border: 1px solid #d5d5d5; background-color:#f2f2f2; width:60%; }
form input[type="submit"] { display:block; height:32px; width:82px; background:transparent url(images/submit-btn.png) no-repeat 0 0; overflow:hidden; cursor:pointer; text-indent:-9999px; border:none; position:relative; }
form input[type="submit"]:hover { background-position: -82px 0;}

#left-col table#links tr td { width:50%; padding:0 1em 1em 0;  }
#left-col table#links tr td a { font-style:normal;}

/** Right Column **/
#right-col { width: 330px; padding: 0 0.9375em; /* 15/16 */ background: transparent url(images/sidebar-border.png) repeat-y top left;}
.sidebar-box { margin-bottom: 20px; }
.sidebar-box h2 { color:#fff; height:46px; width:335px; display:block; padding: 0.5455em 0.5455em 0 0.5455em; margin-right:-1.318em; /* 29/22 */ background: transparent url(images/sidebar-banner.png) no-repeat top right; }
.sidebar-box h2 span.all-sponsors { font-size: 0.545em; padding-left: 1em;}
.sidebar-box h2 span a { color:#fff; text-decoration:none;  }
.sidebar-box h2 span a:hover { text-decoration:underline; }
.sidebar-box form#newsletter-signup-sidebar { display:block; background: transparent url(images/sidebar-newsletter-signup-bg.png) no-repeat top right; height:170px; width:335px;
 margin-right: -1.318em; padding: 0.75em; /* 12/16 */ }
.sidebar-box form { color:#fff; }
.sidebar-box form h3 { color:#fff; margin-bottom:0; }
.sidebar-box form p { margin-bottom: 5px!important; }
.sidebar-box input[type="text"] { color:#5b5b5b; background-color:#d5d5d5; border:1px solid #181818; padding:0.625em; /* 10/16 */ width:95%; margin-bottom: 0.625em; /* 10/16 */ }
div.sponsors img { display:inline-block; width:125px; height:auto; padding: 5px; background-color:#f2f2f2; border:1px solid #d5d5d5; margin: 0 20px 20px 0; }
div.sponsors a { text-decoration:none;}


/** Google Map **/
div#google-map { margin-bottom:20px; }

/** Lodging **/
div.lodging-block { width: 50%; margin-bottom:20px; }


/** Footer **/
#footer { background: #181818; color:#fff; text-align:center; padding: 0.9375em; }
#footer p { margin-bottom:0; }


/** shortcodes */

p.info-box { background-color:#f2f2f2; background-repeat:no-repeat; background-image:url(images/ic_info_grey.png);  background-position: 1em 1em; border: 1px solid #d5d5d5; padding: 1em 1em 1em 4em; /* 40/12 */ }
p.info-box a { color:#333;  font-weight:bold; }
p.red { background-color: #ecc3c3; border-color: #d99494; color: #985d5d; background-image: url(images/ic_info_red.png); }
p.red a { color:#985d5d; font-weight:bold;}
p.yellow { background-color: #fbf4c8; border-color: #f0e599; color: #837a39; background-image: url(images/ic_info_yellow.png); }
p.yellow a { color:#837a39; font-weight:bold; }


/* Nivo Slider Styles */
.nivoSlider {
	position:relative;
}
.nivoSlider img {
	position:absolute;
	top:0px;
	left:0px;
}
/* If an image is wrapped in a link */
.nivoSlider a.nivo-imageLink {
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
	border:0;
	padding:0;
	margin:0;
	z-index:6;
	display:none;
}
/* The slices and boxes in the Slider */
.nivo-slice {
	display:block;
	position:absolute;
	z-index:5;
	height:100%;
}
.nivo-box {
	display:block;
	position:absolute;
	z-index:5;
}
/* Caption styles */
.nivo-caption {
	position:absolute;
	left:0px;
	top:30px;
	background:#000;
	color:#fff;
	opacity:0.8; /* Overridden by captionOpacity setting */
	width:35%;
	height:240px;
	padding:15px;
	z-index:8;
	font-size:1em;
}
.nivo-caption h2 { color:#fff; }
.nivo-caption p {
	margin:0 0 15px 0;
	font-size:1em;
}
.nivo-caption a {
	display:inline !important;
	color:#fff;
}
.nivo-html-caption {
    display:none;
}
/* Direction nav styles (e.g. Next & Prev) */
.nivo-directionNav a {
	position:absolute;
	top:45%;
	z-index:9;
	cursor:pointer;
}
.nivo-prevNav {
	left:0px;
}
.nivo-nextNav {
	right:0px;
}
/* Control nav styles (e.g. 1,2,3...) */
.nivo-controlNav a {
	position:relative;
	z-index:9;
	cursor:pointer;
}
.nivo-controlNav a.active {
	font-weight:bold;
}


/** Contact-form-7 Styles **/
div.wpcf7-response-output {
	padding: 15px !important;
}

div.wpcf7-mail-sent-ok {
	background: #cdf8d6;
	border: 1px solid #aee4ba !important;
	color:#73b280;
	font-size:12px;
}

div.wpcf7-mail-sent-ng {
	background: #ecc3c3;
	border: 1px solid #d99494 !important;
	color:#985d5d;
	font-size:12px;
}

div.wpcf7-spam-blocked {
	background: #ecc3c3;
	border: 1px solid #d99494 !important;
	color:#985d5d;
	font-size:12px;
}

div.wpcf7-validation-errors {
	background: #fbf4c8;
	border: 1px solid #f0e599 !important;
	color:#aca154;
	font-size:12px;
}

span.wpcf7-not-valid-tip {
	position: absolute;
	top: -0.5em !important;
	left: 102% !important;
	
	z-index: 100;
	background: #ecc3c3 !important;
	border: 1px solid #d99494 !important;
	font-size: 10pt;
	width: 200px !important;
	padding: 2px;
	color:#985d5d !important;
}

input.wpcf7-quiz { width:5% !important;}

.find { border: 1px solid #3F0; }