﻿/* Site Colors
#D6623B - Orange
#F06B41 - Orange on Banner
#11579C - Blue
#C0D4E5 - Light Blue 
#0C673C - Green
#91C44E - Light Green
#B32732 - Red
#F9E247 - Yellow
*/
body {
	background-color:#91C44E;/*#e4e4e4;*/
	background-image:url('Images/BackgroundOverlay.png');
	font-size:.9em;
}
div.container-fluid {
	background-color:white;	
	max-width:960px;
}
a, a:link, a h3, a h4 {
	color: #11579C;
}
a:visited {
	color: #10589b;
}
.content a, .content a:link {
	color: #10589b;
}
.content a:visited {
	color: #10589b;
}
.soi-footer-links a, .soi-footer-links a:link {
	color:#0C95C9;
}
.soi-footer-links a:visited {
	color:#0C95C9;
}
.soi-motto {
	font-style:italic;
	font-size:16px;	
	color:#CD481F;
}
h1 {
	color:#10589b;
	font-family:Impact, Charcoal, sans-serif;
	font-weight:normal;
	font-size:32px;
}
h2 {
	font-size:21px;
	padding-top:10px;
}
h3 {
	font-size:18px;
	padding-top:10px;
}
h4 {
	font-size:16px;
}
h2, h3, h4 {
	color:#11579C;
}

h2.goldsponsor{
	 color: #e69725;
	}
	
h2.silversponsor {
	color: #858283; 
}

h2.bronzesponsor {
	color: #994b26; 
}

h2.friendsponsor {
	color: #0b9444; 
}

li.list {
	padding-bottom:5px;
}

address { 
    display: block;
    padding-left: 20px;
    border-left: thick double #91C44E;
}

/* sponsors */
div.goldsponsor ul, 
div.silversponsor ul,
div.bronzesponsor ul  { 
	display: table; 
	width: 100%;
}

div.goldsponsor li, 
div.silversponsor li,
div.bronzesponsor li { 
	display: inline-table; 
	width: 22%;
	padding-bottom: 20px;
	text-align:center;
}

div.soi-rteElement-Callout5 {
	width: 90%;
}

/* ===================================================================================
   Banner
   =================================================================================== */
div.soi-utility-wrapper div.soi-utility-inner {
	background-color:#11579C;
	border-bottom:5px white solid;
}
div.soi-banner-wrapper div.soi-banner-inner {
	background:#C0D4E5 url('Images/HeaderBanner.png') no-repeat bottom right;	
	padding-top: 0px;
}
div.soi-banner-wrapper a:link {
	color:white;
}
div.soi-banner-wrapper a:visited {
	color:white;
}

ul.utility-nav {
	margin-top:5px;
	margin-bottom:5px;	
	color: white;
	font-size: .9em;
}
ul.utility-nav li {
	border-left: thin white solid;
	display:inline-block; 
	vertical-align:top;
}
ul.utility-nav li.first-child,  ul.utility-nav li.last-child {
	border-right-width: 0px;
	border-left-width: 0px;
}
ul.utility-nav li a {
	color: white;
	text-decoration: none;
	float: left;
	padding-left: 5px;
	padding-right: 6px;

}
ul.utility-nav li a:focus, ul.utility-nav li a:hover {
	text-decoration: underline;
}

.soi-site-logo {
	margin:auto;
	padding-top:10px;
}

.orange-ribbon {
	height: 160px;
	font-family:Impact, Charcoal, sans-serif;
	background-image:url('Images/orange-ribbon.png');
	background-repeat:no-repeat;
	background-position:center top;
	text-align:center;
	font-size:16pt;
}
.orange-ribbon ul, .soi-fair-counter {
	padding-top:10px;
	color:white; 
}
.right-ribbon li {
	margin-bottom: 10px;
}
.soi-countdown-panel {
	float:left;
	width:222px;
}
.soi-utility-nav {
	float:right;
	width:222px;
}
.soi-logo-wrapper {
	width:312px;
	height:147px;
	margin:auto;
}
.soi-fair-date-phone {	
	font-size:18pt; 
	font-family:Impact, Charcoal, sans-serif;
	color:white; 
	padding-top:10px;
}

.soi-countdown {	
	padding-top: 20px;
	font-size:36pt; 
}
.soi-italic {
	font-style:italic;
}

/* ===================================================================================
   Global navigation
   =================================================================================== */
.menu-horizontal ul.root > li.static > .menu-item {
	display:none;
}

div.soi-topnav-wrapper div.soi-topnav-inner {
	background-color:#B32732;
	border-bottom:5px #F9E247 solid;
}

.navbar {
	margin-bottom:0px;
}

.lt-ie9 .navbar {  
		display: table;   /* Allow the centering to work for IE8 and below*/
		margin: 0 auto;
 } 

.navbar-inner {
  background-color: transparent; /*#0C95C9;*/
  background-image:none;
  border-width: 0px;
  /*filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff2f2f2', GradientType=0);*/
  filter: none;
  -ms-filter:"progid:DXImageTransform.Microsoft.gradient(enabled=false)";
  
  -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
     -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
          box-shadow: 0 1px 4px rgba(0, 0, 0, 0.065);
}
 
.menu-horizontal ul.static {
	min-width: 960px;
	list-style: none;
	padding-top: 20px;
}
.nav li	{
	list-style:inherit; /* bug in Firefox - force it to none; fix border issues*/
}
  

.nav li.static > .menu-item
{
	color: white;/*#232228;*//*#e4e4e4;*/
	font-size:13px;
	font-weight: 500;
	padding: 10px 14px;	
}

.nav li.static li.static:hover > .menu-item,
.nav li.static li.static:focus > .menu-item,
.nav li.static li.static:active > .menu-item {
	background-color:#d5623a;
	color: #fff;

}
.nav li.static > .selected, 
	.nav li.static > a:hover, 
	.nav li.static > a:focus, 
	.nav li.static > a:active
{
	background-color:#d5623a !important;
	color: #fff;

}


/* Sub-menus*/
.nav ul.dynamic {
	background-color: #fff;
	padding: 0;
}

.nav li.dynamic > .menu-item.selected {
	background-color:#fff;
	xcolor:#d5623a;
}

.nav ul.dynamic a {
	padding: 2px 5px;
	text-decoration: none;
	border-bottom: 1px dotted #C0D4E5;
}

.nav ul.dynamic a:hover {
	background-color: #fff;
	xcolor:#d5623a;
	text-decoration: underline;	
}




/* ===================================================================================
   Local navigation
   =================================================================================== */

.s4-ql UL.root
{
	xborder-bottom: 3px #232228 solid !important;
}
.s4-ql UL.root > LI > .menu-item
{
	background-color: #B32732;   /*#F9E247;*/
	color:white !important;
	font-weight:bold;
	padding:4px 10px 4px 10px;
	
}
.s4-ql ul.root ul > li > a, a.soi-bullet
{
	padding:4px 10px 4px 10px;
	margin-top:2px;
	margin-bottom:2px;
	background-color:#e2f2da;
	color:#10589b;
}
.s4-ql ul.root ul > li > a.selected {
	padding-left:20px !important;
	background-color:#C0D4E5/*#B6DEA3;*/	
}
.s4-ql ul.root ul > li > a:hover
{
	color:#000;	
	background-color:#C0D4E5;
}

.s4-ql A.selected
{
	color:#000;	
	background-color:#C0D4E5;
	background-image:none;
}
/* ===================================================================================
   /END Local navigation
   =================================================================================== */
/* ===================================================================================
   Content
   =================================================================================== */

div.soi-welcome-splash #wpzTop {
	xmargin-left:-20px;
}
.soi-sidebar h2 {
	background-color:#232228;
	text-transform:uppercase;
	font-weight:normal;
	color:#fff;
	line-height:20px;
	font-size:1.2em;
	padding:3px 4px 3px 10px;	
}
div.soi-image-area-left {
	float:left;	
	padding-right:10px;
}

/* ===================================================================================
   /END Content
   =================================================================================== */

/* ===================================================================================
   Footer
   =================================================================================== */

div.soi-footer-inner {
	background-color: #11579C;
	color:white;
}

div.soi-footer-inner ul {
	margin-left:0px;
	list-style-type:none;
	list-style-position:outside;
	list-style-image:none;
}

.soi-footer-upper{
	margin-top:10px;
}

.soi-footer-upper h3 {
	color: #fff;
	font-family:Impact, Charcoal, sans-serif;
	font-size:16pt;
	font-weight:normal !Important;
}

.soi-footer-upper a {
	color: #f3a239;
}

.soi-footer-icons {
	padding-top: 20px;
	padding-bottom:20px;
	text-align:center;
}

.soi-social-links {
	margin-top:5px;
	margin-bottom:5px;	
}

.soi-footer-logos {
	margin-top:10px;

}

.soi-fairaddress {
	margin-top: 10px;
	font-size:.9em;
	line-height: 0.5;
}


/* ===================================================================================
   SOI Events
   =================================================================================== */

.soi-event {
	display:block;
	padding:10px 0px;
	border-bottom:1px #e4e4e4 solid;
}
.soi-event .media {
	display:block;
	margin-top:0px;
	padding-bottom:10px;
	padding-top:10px;
	border-bottom:1px #ccc solid;
}
.soi-event-calendar a, .soi-event-calendar a:link, .soi-event-calendar a:visited {
	color: #000;
	text-decoration:none !important;
}
.soi-event-calendar a:hover, .soi-event-calendar a:focus, .soi-event-calendar a:active {
	background-color: #fc6;
	color: #000;
	text-decoration:none !important;
}
.soi-event .soi-calIcon {
	margin-right:10px;
}
.soi-event .soi-calIcon .soi-calDay{
	font-size:30px; 
	width:78px; 
	display:block; 
	line-height:35px; 
	text-align:center; 
	background-color:#e4e4e4;
	xborder:1px black solid;
}
.soi-event .soi-calIcon .soi-calYear{
	text-transform:uppercase; 
	font-size:.8em; 
	text-align:center; 
	background:#0091d0; 
	color:#fff; 
	padding:3px 5px 3px 5px; 
	width:68px; 
	display:block; 	
	xborder:1px black solid;
}
.soi-event .media-heading {
	font-weight:bold;
	font-size:1.2em;
}

div.soi-calIcon .soi-calMonth{
	text-transform:uppercase; 
	font-size:.7em; 
	text-align:center; 
	background-color:#eaeaf3;
	padding:3px 5px 3px 5px; 
	width:68px; 
	display:block; 	
}
div.soi-calIcon .soi-calDay{
	font-size:30px; 
	width:78px; 
	display:block; 
	line-height:35px; 
	text-align:center; 
	background-color:#eaeaf3;
}
div.soi-calIcon .soi-calYear{
	text-transform:uppercase; 
	font-size:.7em; 
	text-align:center; 
	background:#0C673C; 
	color:#fff; 
	padding:3px 5px 3px 5px; 
	width:68px; 
	display:block; 	

}

.soi-dfwp-list  .soi-groupheader {
	padding-bottom: 20px;
}

/* ===================================================================================
   State Fair Events
   =================================================================================== */
.event-withimage {
	padding-top:20px;
	padding-bottom:20px;
	border-bottom:1px #f3a239 solid;
}
.event-title {
	padding-bottom:5px;
	font-family:Impact, Charcoal, sans-serif;
	font-weight:normal;
	font-size:24px;	
}
.event-byline {
	color: #11579C;
	padding-bottom:10px;
	font-family:Impact, Charcoal, sans-serif;
	font-weight:normal;
	font-size:20px;
}
.event-time {
	font-size:.9em;
	padding-top:10px;
	font-weight:bold;
}
.gate-time {
	font-size:.9em;
	font-weight:bold;
}

.event-cost-header {
	background-color:#10589b;
	color:white;
	font-weight:bold;
	padding:4px 10px 4px 10px;
}
.event-links li {
	padding:4px 10px 4px 10px;
	margin-top:2px;
	margin-bottom:2px;
	background-color:#e2f2da;
}

.soi-event-title {
	font-weight: bold;
}

.soi-grandstand-event h2
{
   	vertical-align:top;
    margin-top:0px; /* need this to clear the default margin */
    padding-top: 0px !important;
}

.event-grandstand-image{
	 margin: 0px 20px;
	 float:left;
}
/* ===================================================================================
   Misc
   =================================================================================== */
.carousel {
	margin-left: -20px; 
	margin-right: -20px; 
}

.carousel-inner {
	border-bottom: 5px #F9E247 solid;
}

.s4-search input.ms-sbplain {
	background: #C0D4E5;
	border: thin solid #BAD0E2 !important;
}

.soi-table tbody th {
	text-align:left;
}

/* overrides */
.carousel-control {
	line-height: 0 !important;
}

.ms-vb2, .ms-vh2 {
	font-family:inherit;
	font-size:inherit;
	color:inherit;
}

.cssbox > .cssbox_head {
    color: #333;
    background-color: #edf7e8;
    border-color: #ddd;
}

/* fix Bootstrap 2.3.2 table text alignment issues */
.table .text-right {text-align: right}
.table .text-left {text-align: left}
.table .text-center {text-align: center}


/* responsve image for Bootstrap 2.3.2 */
.responsive-image {max-width: 100%; height: auto;}


/* ===================================================================================
   Custom for media displays
   =================================================================================== */

@media (min-width:980px){
	.navbar {
        display: table;   /* Allow the centering to work */
		margin: 0 auto;
	}
}

@media(max-width:979px) {
	.nav .menu-horizontal li.dynamic > a, 
	.nav .menu-horizontal li.dynamic > .menu-item
	{
		color: #11579C;
	}
	
	.nav .menu-horizontal li.dynamic > a:hover, 
	.nav .menu-horizontal li.dynamic > .menu-item:Hover
	{
		background-color: #F9E247;
		color: #000;
	}
	.soi-banner-inner {
		background: none !important;
		max-height: 300px !important;
		text-align: center;
	}
		
	.soi-site-logo {
	 	padding-top: 0px !important;
	 	max-height: 290px !important;
	 	margin: auto;
	}
	
	.soi-logo-wrapper {
		width:auto;
		height:150px;
		margin:auto;
	}

}

@media(max-width:768px) {
	.soi-searchResults .ms-sbtable-ex input.ms-sbplain {
		width:250px !important;
	}
	
	div.soi-footer-inner {
		text-align: center;
	}
	
	.soi-banner-inner {
		background: none !important;
		max-height: 300px !important;
		text-align: center;
	}

	.soi-site-logo {
	 	padding-top: 0px !important;
	 	max-height: 200px !important;
	 	margin: auto;
	}
	
	.soi-logo-wrapper {
		width:auto;
		height:150px;
		margin:auto;
	}
	
	.event-grandstand-image {
		 margin: none !important;
		 float:left;
	}

}
