body {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	background-color: rgba(199,0,0,1.00);
	font-family: Georgia, "Times New Roman", Times, serif;
}

/*Generic Start CSS*/


/* *** The following strips out default margins and padding for all specified items defaults *** */
 body, h1, h2, h3, h4, h5, ol, ul, blockquote {
	margin: 0px;
	padding: 0px;
}

/* To make the images flexible, simply add max-width:100% and height:auto. 
Image max-width:100% and height:auto works in IE7, but not in IE8 (yes, another weird IE bug). 
To fix this, you need to add width:auto\9 for IE8.  */
img {
	max-width: 100%;
	height: auto;
	width: auto\9; /* ie8 */
	margin-bottom: -5px; /* *** WBO *** I added this properting because space was showing under the images on reducing the size of the page. It is a guess. I will need to create a Media Query Style that is -6px for smaller screens *** */
}

/* Fixes problem with older browsers defaulting to a blue border around images that are links */
a img {
  border: none;
 	margin: 0px;
	padding: 0px;
}

.clear {
	clear: both;
}
.centerContent {
	text-align: center;
	margin-right: auto;
	margin-left: auto;
}
.allCaps {
	text-transform: uppercase;
}
.spacerOne {
	height: 30px;
	width: 100%;
}

/* *** To make Google Maps flexible Wrap this div around the frame code that Google Maps generates *** */
 .google-maps {
	position: relative;
	padding-bottom: 75%; /* This is the aspect ratio */
	height: 0;
	overflow: hidden;
	/* *** WBO *** I added the following wo lines for a shadow *** WBO ****/
	-webkit-box-shadow: 5px 5px 6px rgba(0,0,0,0.57);
	box-shadow: 5px 5px 6px rgba(0,0,0,0.57);
    }

/* the following is styling for the look of the top of page link */
.top {
	font-size: 75%;
	color: #666;
	text-align: center
}

/* *** TOP SECTION STYLES *** ^^^^^^^^^^^^^^^^^^^^ */


#topWrapper {
	width: 100%;
	text-align: center;
	max-height: 310px;
	background-image: url(../images/top_wrapper_stones.jpg);
}
#header {
	max-height: 310px;
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 0px;
	background-repeat: no-repeat;
}
/* *** TOP NAVIGATION SECTION STYLES *** ^^^^^^^^^^^^^^^^^^^^ */


.horizontalBars {
	width: 100%;
	text-align: center;
	background-color: #000000;
	border-top: 3px solid #000000;
	border-bottom: 3px solid #000000;
} 
.redStripe {
	background-image: url(../images/top_menu_bottom_stripe.jpg);
	background-repeat: repeat-x;
	background-position: bottom;
	height: 10px;
	width: 100%;
}
.underMenuShadow {
	width: 100%;
	height: 10px; /* WBO *** Adjust accordingly */
	background-image: url(../images/under_menu_shadow.jpg);
	background-repeat: repeat-x;
}
.overMenuShadow {
	width: 100%;
	height: 10px; /* WBO *** Adjust accordingly */
	background-image: url(../images/over_menu_shadow.jpg);
	background-repeat: repeat-x;
}


/* *** MID SECTION STYLES *** ^^^^^^^^^^^^^^^^^^^^ */

#midsectionWrapper {
	max-width: 100%;
	background-color: #FFFFFF; /* WBO *** Adjust accordingly */
}
#mainContent {
	/* WBO *** Adjust accordingly */
	max-width: 1280px;
	min-height: 50px;
	padding-top: 30px;
	padding-bottom: 20px;
	background-color: #FFFFFF;
	margin-left: auto;
	margin-right: auto;
}
#mainContent a {
	text-decoration: none;
	color: #79161F;
}
#mainContent a:hover {
	color: #0066CC;
}


/* ++++++++ SIDEBAR RIGHT MAIN CONTENT LEFT ++++++++ */
#sidebarRight {
	width: 20%;
	float: right;
	padding-top: 0%;
	padding-right: 5%;
	padding-left: 0%;
	padding-bottom: 0%;
	text-align: center;
	line-height: 140%;
}
#contentLeft {
	float: left;
	width: 65%;
	padding: 2%;
	line-height: 150%;
	color: #313131;
}

.individualPerformance {
	border-bottom: 1px dotted #881922;
	margin-bottom: 15px;
	}


/* *********** START OF FOOTER SECTION ********** */


#footerWrapper {
	width: 100%;
	padding-top: 20px; /* WBO *** Adjust accordingly */
	padding-bottom: 40px; /* WBO *** Adjust accordingly */
	text-align: center;
	border-top: 6px solid #F6A95A; /* WBO *** Adjust accordingly */
	background-image: -webkit-linear-gradient(270deg,rgba(0,0,0,1.00) 0%,rgba(199,0,0,1.00) 79.79%,rgba(199,0,0,1.00) 100%);
	background-image: -moz-linear-gradient(270deg,rgba(0,0,0,1.00) 0%,rgba(199,0,0,1.00) 79.79%,rgba(199,0,0,1.00) 100%);
	background-image: -o-linear-gradient(270deg,rgba(0,0,0,1.00) 0%,rgba(199,0,0,1.00) 79.79%,rgba(199,0,0,1.00) 100%);
	background-image: linear-gradient(180deg,rgba(0,0,0,1.00) 0%,rgba(199,0,0,1.00) 79.79%,rgba(199,0,0,1.00) 100%);
}
#footerContent {
	font-size: 85%;
	line-height: 140%;
	color: #F3B64E; /* WBO *** Adjust accordingly */
	text-align: center;
	margin-right: auto;
	margin-left: auto;
}
#footerContent a {
	color: #D7B037;
	text-decoration: none;
}
#footerContent a:hover {
	color: #FFFFFF;
}
.line {
	border-top-width: 1px;
	border-top-style: dotted;
	border-top-color: #881922;
	margin-top: 6px;
	margin-bottom: 6px;
}
.imageLeft {
	float: left;
}
.imageRight {
	float: right;
}


/* **** Video Flex Styles - Found at https://avexdesigns.com/responsive-youtube-embed/ **** */

.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px; height: 0; overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
	position: absolute;
	top: -1px;
	left: 0;
	width: 100%;
	height: 100%;
}

@media (max-width: 800px){
#mainContent {
	/* WBO *** Adjust accordingly */
	max-width: 1280px;
	min-height: 50px;
	background-color: #FFFFFF;
	margin-left: auto;
	margin-right: auto;
}
/* ++++++++ SIDEBAR RIGHT MAIN CONTENT LEFT ++++++++ */
#sidebarRight {
	width: 20%;
	float: right;
	padding-top: 0%;
	padding-right: 5%;
	padding-left: 0%;
	padding-bottom: 0%;
	text-align: center;
	line-height: 140%;
}
#contentLeft {
	float: left;
	width: 65%;
	padding: 2%;
}
}

@media (max-width: 700px){
#contentLeft {
	width: 90%;
	margin-left: 5%;
	margin-right: 5%;
	display: block;
}
/* ++++++++ SIDEBAR RIGHT MAIN CONTENT LEFT ++++++++ */
#sidebarRight {
	width: 90%;
	padding-top: 30px;
	padding-right: 5%;
	padding-left: 5%;
	padding-bottom: 0%;
	text-align: center;
	line-height: 140%;
	display: block;
	border-top: 1px solid #000000;
}
}
