/* Burlington Flats Fish & Game Club Website Stylesheet.   
Controlling stylesheet for all pages within the "Burlington Flats Fish & Game Club" website at http://www.bffgc.com.
Design by Frank Allen
Date originally created November 2014 */

/* "body" style - controls the appearance of all basic text */
body { background-color: #00272f; min-width:927px; font-family:Arial, sans-serif; /*font-size:0.8em;*/ color:#000; width: 100%;}
body a:link, body a:visited { color:#09C; font-weight:normal; text-decoration:none; } /*color:#069; */
body a:hover { color:#F00; text-decoration:underline; }

/* "wrapper" div - controls the dimensions and positioning of the index page*/
#wrapper { max-width:1200px; min-width:927px; margin:auto; padding:0 }

/****************************** HEADER COMPONENTS ******************************/
/* "header" divs- controls the main header/banner at the top of the page */ 
#header { height:168px; left:0px; top:0px; padding:0px; overflow:hidden; min-width:931px; background-image:url(../images/pageheader.jpg); background-position:right; }


/****************************** MAIN NAVIGATION MENU BAR COMPONENTS ******************************/
/* "navbar" div - controls the dimensions, position and background color of the main navigation bar just below the header*/
#navbar { margin:0; height:25px; text-align:center; padding:0; white-space: nowrap;}


/****************************** CONTENT COMPONENTS ******************************/
/* "center-content" div - controls the appearance of the text in the main data portion of every website page */
#center-content { background:url(../images/pagecenter.jpg); overflow:hidden; min-width:931px; background-color:#fff; background-position:bottom; border-left:#fff solid 2px; border-right:#fff solid 2px; margin-top:-6px;}
#center-content ul { margin-left:1em; padding-left:1px; list-style-type:disc;}
#center-content li li{ margin-left:0.5em; padding-left:1px; list-style-type:disc; }

/* "index-colL", "index-colC" and "index-colR" classes - used to position text in three columns on the main index page.*/
.index-colL { margin:0px; padding:0px 8px; border-right:#999 1px solid; }
.index-colC { padding:0px 4px; }
.index-colR { padding:0px 8px; border-left:#999 1px solid; }

/* "colL" and "colR" classes - used to position text in two columns where needed.*/
.colL { margin:0px; padding:0px 8px; }
.colR { padding:0px 8px; border-left:#999 1px solid; }

/* "slideshow" div - controls the rotating image feature.*/
#slideshow { margin: auto; position: relative; width: 400px; height: 250px; padding: 5px; }
#slideshow > div { position: absolute; top: 10px; left: 5px; right: 10px; bottom: 10px; }

/* "footer" div - controls the dimensions, position and background of the bottom of each page*/
#footer{ height:40px; /*font-size:0.9em;*/ color:#fff; background-color:#327D94; background-image:url(../images/pagefooter.jpg); min-width:931px; background-position: top right; margin-top:-12px; }
#footer a:link, #index-footer a:visited { color:#fff; text-decoration:none; font-weight:normal; }
#footer a:hover { color: #ffff00; text-decoration: underline; }
#footer p { text-align:center; color: #fff; padding-top:12px; }

/****************************** ASSORTED STYLES & COMPONENTS *******************************/

/* "h1" style - controls the appearance of the page title text in the intro div on every page */
.h1 {/*font-size:1.5em;*/ font-weight:bold; color:#fff;}

/* "h2" style - controls the appearance of the paragraph titles in the content div on every page */
.h2 { /*font-size:1.3em;*/ font-weight:bold; color:#133A75; margin-top:1.0em; }/*#0099ff*/

/* "h3" style - controls the appearance of list items when used within the content div */
.h3 { /*font-size:1.15em;*/	font-weight:bold; font-style:italic; color:#327d94; }

/* "h4" style - controls the appearance of small list items when used within the content div */
.h4 {font-size:1em; font-weight:bold; color:#222;}

/* "caption" style - controls the appearance of all image and photo captions */
.caption {font-size:0.90em; font-style:italic; color:#133A75; }

/* "sectitle" class - controls the appearance and position of the main index page title*/
.sectitle {	font-size:1.15em;	font-weight:bold;	font-style:italic;	color:#327d94;	width:100%;	background-color: #C4D9E6;}

/* "toggle" class - controls the appearance and position of the news articles*/
.toggle { padding-bottom:10px;} 

/* Toggle Link text */
.toggle a.toggle-trigger { display:block; position:relative;	text-decoration: none; font-size:1.15em; font-weight:bold;  color:#327d94;}

/* Toggle Link hover state */
.toggle a.toggle-trigger:hover { opacity: .8; color:#ff0000;}

/* Toggle link when clicked */
.toggle a.active { text-decoration: none; font-style:italic;}

/* Lets add a "+" before the link */
.toggle a.toggle-trigger:before { content: "+";	font-size:1.15em; margin-right: 10px;	}

/* When the toggle is active, change the "+" to a "-" */
.toggle a.active.toggle-trigger:before { content: "-"; }

/* The content of the toggle */
.toggle .toggle-content { padding-left: 15px; margin-top:-10px; color:#000; }

/* "wesupport" class - controls the appearance and position of the main index page support icons*/
.wesupport { vertical-align:bottom; width: 100%;    height: 100%;} 

/* "calendarcontainer" class - controls the appearance and position of the main index page Google Calendar*/
.calendarcontainer { position: relative; padding-top: 100%; padding-bottom: 30px;  height: 0;    overflow: hidden;}
.calendarcontainer iframe,.calendarcontainer object,.calendarcontainer embed {    position: absolute;    top: 0;    left: 0;    width: 100%;    height: 100%;} 

/* "weathercontainer" class - controls the appearance and position of the main index page Google Calendar*/
.weathercontainer { position: relative;    padding-bottom: 30px;    padding-top: 56.25%; /* 16/9 ratio */   height: 0;    overflow: hidden;}
.weathercontainer iframe,.weathercontainer object,.weathercontainer embed { position: absolute;    top: 0;    left: 0;    width: 100%;    height: 100%;}