
/*
	CSS - http://www.cjrc.net/cjrcStyle.css
	DEVELOPMENT STYLE SHEET FOR CJRC
	contact: Bruce Thede | bruce@skiuwd.com
*/

/* GLOBAL ELEMENTS */
body {background:#50b26c;margin:0;padding:0;color:#000000;font:11px/16px trebuchet ms,helvetica,arial,sans-serif;text-align:left;}
body#tent {
	background: #efeee2;
}

table {font:11px trebuchet ms,helvetica,arial,sans-serif;border:0;text-align:left;}
th, td {padding: 3px 10px 3px 0;}

img {border-width:0;border-style:none;}

h1, h2, h3, h4, h5, h6 { margin:0;padding:0;font-family:trebuchet ms,helvetica,arial,sans-serif;color:#0080B6 }
h1 {font-size:15px;font-weight:bold;line-height:20px;margin:8px 0 0 0;word-spacing:-0.125em;color: #000000}
h2 {font-size:13px;margin:0 0 1em 0;font-weight:bold;border-top:1px solid #B4B4AA;border-bottom:1px solid #B4B4AA;padding:4px 0;word-spacing:-0.125em;}
h3 {
	font-size:13px;
	font-weight:bold;
	line-height:20px;
	margin:8px 0 0 0;
	word-spacing:-0.125em;
	color: #000000;
}
h3.uline {padding-bottom:2px;border-bottom:1px dotted #96968C;width:auto;margin:24px 0 8px 0;}
h4 {font-family:trebuchet ms,helvetica,arial,sans-serif;font-weight:bold;font-size:11px;letter-spacing:0;margin:14px 0 1px 0;}
h5, h6 {font-family:trebuchet ms,helvetica,arial,sans-serif;font-weight:bold;}
h5 {font-size:11px;color:#999;text-transform:uppercase;padding:4px 0;}
h6 {padding:4px 0 10px 0;font-size:11px;line-height:14px;}

p, span {margin:0 0 1em 0;font-size:12px;line-height: 17px;}

dt {margin:0 0 1em 0;font-size:12px;line-height: 17px;}





form {margin:0;padding:0;font-size:10px;display:block;}
input, textarea, option, select {font-size:10px;background-color:#fff;}
iframe {margin:0;padding:0;position:relative;display:block;}

ul {margin:0;padding:0;}
ol li {margin:0 0 12px 0;}

ul.alumguide { margin: 0px; padding-left:14px; margin-bottom:8px; }
ul.alumguide li {margin-bottom:1px; margin-left:14px; list-style-type: square;}

.patTodd {
	width: 152px;
	float: left;
	}
	
.patToddCopy {
	width: 270px;
	float: right;
	}

#alumniphoto {
	width:424px;
	float: right:
}

#alumniphoto img {
	border:3px solid #0080B6;
	width:105px;
	float:right;
}

#alumniphoto .caption {
	background:#0080B6;
	width:100%;
	font-size:9px;
	line-height:11px;
	display:block;
	width:102px;
}
#alumniphoto .caption span {
	padding:4px;
	display:block;
	font-weight: bold;
	color:#ffffff;
	text-align: center;
}
#alumniphoto.right {
	float:right;
	margin:0 0 8px 8px;
}

#alumniphoto.left {
	float:left;
	margin:0 8px 8px 0;
}








/*ul.alumni {margin:8px 0 1em 0;padding:0;}
ul.alumni li {list-style:none;background:none;margin-bottom:2px;padding:4px 4px 4px 10px;}
ul.alumni li.odd {background:none;}
ul.alumni a:link, ul.alumni a:visited, ul.alumni a:hover, ul.alumni a:active {font-weight:normal;text-decoration:none;}
ul.alumni a:hover {text-decoration:underline;} */

ul.stories {margin:8px 0 1em 0;padding:0;}
ul.stories li {list-style:none;background:none;margin-bottom:2px;padding:4px 4px 4px 10px;}
ul.stories li.odd {background:none;}
ul.stories a:link, ul.stories a:visited, ul.stories a:hover, ul.stories a:active {font-weight:normal;text-decoration:none;}
ul.stories a:hover {text-decoration:underline;}

ul.news {margin: 0 0 1em 1px;padding-left:14px;}
ul.news li {margin-bottom:2px; padding:4px 0;}

/* using guide instead of alumni */
ul.guide { margin: 0px; padding-left:14px;}
ul.guide li {margin-bottom:1px; margin-left:14px; list-style-type: square;}

ul.playerdata { margin:4px 0;padding:0;list-style:none; }
ul.playerdata li {line-height:1.4;padding:0;margin:0 0 4px 0;background:none;}

/* LINKS */
a:link, a:visited, a:hover, a:active {text-decoration:none;color:#0080B6}
a:hover {text-decoration:underline;}
h1 a:link, h1 a:visited, h1 a:hover, h1 a:active {text-decoration:none;}
h2 a:link, h2 a:visited, h2 a:hover, h2 a:active {text-decoration:none;}
h3 a:link, h3 a:visited, h3 a:hover, h3 a:active {font-weight:bold;text-decoration:none;}
h4 a:link, h4 a:visited, h4 a:hover, h4 a:active {font-weight:bold;text-decoration:none;}
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover {text-decoration:underline;}
li a:link, li a:visited, li a:hover, li a:active {text-decoration:none;}
li a:hover {text-decoration:underline;}

/* for section headers */
.headitem {display:block;width:100%;padding-bottom:3px;_padding-bottom:0;margin:18px 0 1px 0;border-bottom:1px solid #B4B4AA;clear:both;position:relative;}

/* frames everything + right edge shadow */
#whopper {width:706px;margin-top:50px;background:#fff;	margin-left: auto;margin-right: auto;border:1px solid #0080B6;}
#login {width: 135px;background:#efeee2;	margin-left: auto;margin-right: auto;}
/* inner wrap for aligning content */
#contentwrap {width:706px;text-align:left;}
#totalImage {width:650px;background-color:#d8e7ef;margin-left: auto;margin-right: auto;}
/* back to pga */
#backto {background:#2D2D26;height:20px;display:block;position:relative;background:none) repeat-x;}
#backto .bttn {position:absolute;top:0;left:12px;}
/* top area for logo, branding */
#top {
	background-color:#0081B7;
	position:relative;
	_margin-bottom:-5px; /* IE Win Hack for whitespace gap */
	text-align: center;
}
#top .badge {position:absolute;bottom:0;left:0;}
#top .event {position:absolute;top:-7px;right:8px;}

/* inside page effect */
#wedge { height:40px; background:none; }
#wedge_lb { height:40px; background:none; }
#colwrap { float:left; position:relative; width:706px;background-color: #d8e7ef}
#colwrapChan { float:left; position:relative; width:706px; background:none; }
#colwrapWide { float:left; position:relative; width:706px; background:none; }
#lcol {width:446px;padding:0 0 10px 0;float:left;position:relative;background-color: #efeee2;min-height:400px;}
#lcol .inside {margin-left:10px;width:426px;}

#lcolInv {width:466px;padding:0 0 10px 0;float:left;position:relative;background-color: #efeee2;min-height:400px;}
#lcolInv .inside {margin-left:10px;width:446px;}

#schools {font:11px trebuchet ms,helvetica,arial,sans-serif;border:0;text-align:left;margin-left:auto;margin-right:auto;}
#schools .list {vertical-align:top;padding:7px;}

#lcol .item {clear:both;float:left;width:100%;margin-bottom:4px;display:block;}
#lcol .item p {margin-bottom:0;}
#lcol .t1wrap {position:relative;width:100%;display:block;margin:8px 0 12px 0;}
#lcol .t1wrap h2 {border-top:none;border-bottom:none;padding:0;margin:0 0 4px 0;}
#lcol .t1photo {width:185px;text-align:left;padding:2px 0 0 0;}
* html #lcol .t1photo {margin:0 6px 0 0;}
#lcol .t1photo img {border:1px solid #3D3D33;}
#lcol .t1text {float:right;width:254px;margin:0 0 4px 0;}
#lcol .t1text li {margin:0 0 2px 0;font-size:10px;}

#timeline {margin-bottom:-8px;background:#4D4D47;}

#home_vid {
	overflow:auto;
	font-size:10px;
	line-height:12px;
}
#home_vid ul {
	margin:4px 0 0 0;
	padding:0;
}
#home_vid li {
	list-style:none;
	background:none;
	float:left;
	display:block;
	padding:0 2px 0 0;
	margin:0 6px 0 0;
	width:142px;
	border-right:1px dotted #B4B4AA;
}
#home_vid li.last {
	margin-right:0;
	border-right:none;
}
#home_vid a {display:block;}
#home_vid img {border:1px solid #5B5B57;float:left;margin:0 4px 0 0;}

/* channel index pages */
#chanLeft {width:156px;margin:0;padding:0;float:left;}
#chanLeft .inside {width:140px;padding-top:10px;}
#chanRight {width:200px;float:right;}
#chanRight .inside {width:288px;margin:0 10px 10px 10px;padding-top:10px;}
/* scorecard */
#lcolWide {width:568px;margin:0;padding:0 0 10px 0;float:left;position:relative;}
#lcolWide .inside {margin:0 10px 10px 10px;}
#rcolThin {color:#CECEC8;font-size:10px;width:160px;float:right;padding-bottom:10px;overflow:hidden;}
#rcolThin .inside {margin:0 4px 0 0;padding:4px 0 0 0;}

#rcol {color:#000000;font-size:10px;line-height:14px;width:260px;float:right;padding:0 0 10px 0;}
#rcol.home {background:none;padding:10px 0;_padding-top:26px;}
#rcol .inside {margin:0 10px 0 10px;width:240px;}

#rcolInv {color:#000000;font-size:10px;line-height:14px;width:240px;float:right;padding:0 0 10px 0;}
#rcolInv .inside {margin:0 10px 0 10px;width:220px;}

#rcol .group, #rcolThin .group {margin-bottom:24px;clear:both;}

#rcol .headitem, #rcolThin .headitem {border-color:#424240;}
#rcolThin .mxl {margin-left:0px;}

#footer {position:relative;font-weight:bold;font-size:10px;margin:0;padding:0 0 0 10px;clear:both;height:64px;line-height:32px;color:#ffffff;background-color: #50b26c}
#footer a {color:#ffffff;}
#footer728 {text-align:center;margin:0 auto;background:#2D2D26;padding:4px 0 1em 0;}
#footerPage {width: 706px;font-weight:bold;font-size:10px;margin:0;clear:both;height:64px;line-height:32px;color:#ffffff;background-color: #0080B6}
#footerPage a {color:#ffffff;}
#footerPage .footerAddress {padding-left:10px;}
#credit {color:#ffffff; font-size:10px; line-height:1.3;padding:12px 10px 6px 10px; position:relative; }

#credit ul {list-style:none;display:block;position:absolute;right:0;}
#credit li {display: block;float:left;margin:0 8px 0 0;background:none;}
#sponsor {position:absolute;top:-16px;left:286px;z-index:10;}
#coursetour {background:#3D3D33;height:234px;display:block;}

.alert {color:#ff0000;font:11px trebuchet ms,helvetica,arial,sans-serif;line-height: 25px;}

.date {color:#0080B6;font:12px trebuchet ms,helvetica,arial,sans-serif;font-weight:bold;}
.dateb {color:#E9E9DF;}
.photocred {color:#66665C;font-size:9px;margin:8px 0 6px 0;line-height:12px;display:block;}

.secthead {
	margin: 12px 0 8px 0;
	padding-bottom:10px;
	_padding-bottom:10px;
	border-bottom:1px solid #B4B4AA;
	width:100%;
}

.secthead2 {
	margin: 12px 0 0 0;
	_margin-top: -12px;
	border-bottom:1px solid #0080B6;
	width:100%;
}

.secthead3 {
	padding-top:10px;
	_padding-top:10px;
	border-top:1px solid #0080B6;
	width:100%;
	font-weight: bold;
	font-size:15px;
	font-weight:bold;
	line-height:20px;
	margin:10px 0 0 0;
	word-spacing:-0.125em;
	color:#000000;
}

/* Main Nav
-------------------------------------- */
#navwrap {background:#333;width:100%;height:32px;line-height:32px;padding:0;position:relative;z-index:100;}
#navwrap .badge {position:absolute;left:0;top:0;}
#navblock {float:right;margin:12px 4px 0 0;}
#nav, #nav ul {line-height:1.4em;padding:0;margin:-4px 0 0 0;list-style:none;display:block;}
#nav a {display:block;border-bottom:none;}
#nav a:hover {border-bottom:none;}
#nav li {position:relative;float:left;margin:0 5px 0 0;padding:0;width:auto;height:24px;background:none;}
#nav li img {margin:4px 0 0 9px;}
#nav li:hover ul, #nav li.sfhover ul {left:auto;}
/* second-level lists */
#nav li ul {border-top:1px solid #000; position:absolute;left:-999em;top:24px;width:146px;height:auto;margin:0 0 0 2px;padding:0;background:none;_background:#3D3D33;display:block;list-style:none;}
#nav li li {height:auto;margin:0;padding:0;width:100%;font-size:10px;background:none;}
#nav li li span {margin:0;padding:3px 4px 3px 7px;display:block;position:relative;}
#nav li li a, #nav li li a:visited, #nav li li a:hover {text-decoration:none;display:block;}
#backtopga {position:absolute;left:10px;top:8px;}
*>html #navblock ul {f\loat: right;margin-top:8px;} /*IE 5 Mac hack  */
*>html #nav a {f\loat: left;} /*IE 5 Mac hack */

/* Section Nav
-------------------------------------- */
ul.sectnav {margin:3px 0 0 0;padding:0;list-style:none;}
ul.sectnav li {margin:0 0 8px 0;}

/* STORIES
-------------------------------------- */

#storyphoto {
	width:177px;
}
#storyphoto img {
	border:1px solid #0080B6;
}
#storyphoto .caption {
	background:#0080B6;
	width:100%;
	font-size:9px;
	line-height:11px;
	display:block;
	width:102px;
}
#storyphoto .caption span {
	padding:4px;
	display:block;
	font-weight: bold;
	color:#ffffff;
	text-align: center;
}
#storyphoto.right {
	float:right;
	margin:0 0 8px 8px;
}
#storyphoto.left {
	float:left;
	margin:0 8px 8px 0;
}


/* MISC
------------------------------------------*/
strong.vid {padding-left:14px;background: none;}
.pict {background:#fff;float:left;border:1px solid #CFCFC2;padding:2px;text-align:center;font-size:10px;}

ul li.pdf {padding:0 0 0 18px;background:none;}
.indFloatR {float:right;padding:0 0 0 20px;font-size:12px;}


/* ALIGNMENTS */
.cal {text-align:center;}
.left {text-align:left;padding-left:4px;}
.ral {text-align:right;padding-right:10px;}
.tvert {vertical-align:top;}
.mvert {vertical-align:middle;}

/* text */
.ten {font-size:10px;}
.nine {font-size:9px;}

/* IMG FLOATS */
.imgFloatL {float:left;margin:1px 8px 0 0;}
.imgFloatR {float:right;margin:1px 0 8px 8px;}
.newsimgL {float:left;margin:3px 6px 0 0;border:1px solid #3D3D33;}
.rcolFloatL {float:left;margin:1px 4px 0 0;border:1px solid #7A7A72;padding:1px;}

.mxl {margin-left:10px;}

.arr {background:none;) 0 60% no-repeat;padding:0 0 0 25px;display:inline;font-size:12px;font-weight:bold; }

a.arr {background:url("http://www.cjrc.net/images/oar_bullet.gif") 0 60% no-repeat;padding:0 0 0 22px;display:inline;font-size:12px;font-weight:bold; }

/* Regatta tables */
table#regatta {
	background-color: #fff;
	border: 1px solid #0080b6;
	empty-cells: show;
	font-size: 90%;
	margin-left: auto;
	margin-right: auto;
	padding: 4px;
	text-align: left;
	width: 300px;
}

table#registration, table#alumniform {
	background-color: #fff;
	border: 1px solid #0080b6;
	empty-cells: show;
	font-size: 12px;
	margin-left: auto;
	margin-right: auto;
	padding: 4px;
	text-align: left;
	width: 426px;
}

table.indoorregistration {
	background-color: #fff;
	border: 1px solid #0080b6;
	empty-cells: show;
	font-size: 12px;
	margin-left: auto;
	margin-right: auto;
	padding: 4px;
	text-align: left;
	/* width: 526px; */
	width: 426px;
}

table.indoorregistration td {
	padding: 6px 0;
	vertical-align: top;
}
	
#registration .padLeft {padding:4px;}

td.regeventnum {width:5%;padding-left:4px;}
td.regeventname {width:27%;padding-left:4px;}
td.regeventboat {width:20%;padding-left:4px;}
td.regeventamt {width:15%;padding-left:4px;}
td.regeventtotal {width:33%;padding-left:4px;}

tr.odd {
	background-color: #d8e7ef;
}

tr.even {
	background-color: #efeee2;
}

tr.regbottom {
	background-color: #ffffff;
}

hr {
	color: #d8e7ef;
	background-color: #d8e7ef	;
	height: 2px;
	width: 90%;
	border: 0;
	margin-top: 12px;
	text-align: center;
}

img.medalists {
	margin-top: 10px;
}

.legal {
	font-family:trebuchet ms,helvetica,arial,sans-serif;
	font-size:11px;
	color:#000000;
	font-style:italic
}

.legal_alert {
	font-family:trebuchet ms,helvetica,arial,sans-serif;
	font-size:11px;
	color:#ff0000;
	font-style:italic
}

table#photo_list {
    padding: 0;
    width: 420px;
}

td#photo_list {
    padding: 5px;
    vertical-align: top;
    width: 210px;
}

.clear {
	clear: both;
	}
	
.clearfix:after {
	content: "";
	display: block;
	height: 0;
	clear: both;
	visibiliity: hidden;
	}

.clearfix { 
	display: inline-table;
	}
/* Hides from ID-mac \*/
* html .clearfix {
	height: 1%;
	}
.clearfix {
	display: block;
	}
/* End hid from IE-mac */	



.floatleft {
	border: 1px solid red;
	float: left;
	width: 190px;
	}
	
.floatright {
	border: 1px solid green;
	float: right;
	width: 190px;
	}

#restaurants {
	padding: 0 5px;
	}	

#restaurants ul {
	margin: 10px;
	}

.learnToRowLeft {
	float: left;
	width: 200px;
	}	
	
/* rowing center styles */
.photoArrow {
	 display: none;	
	 width: 5em;	
	 padding: 0.1em;	
	 text-align: center;	
	 color: white;	
	 background-color: #0080B6;	
	 border: 1px solid #0080B6;	
	 border-color: #d8e7ef #0080B6 #0080B6 #d8e7ef;	
	 cursor: pointer;
	}
	
.photoPrevActive {
 display: block;
 float: left;
}
.photoNextActive {
 display: block;
 float: right;
}

/*
 The list is shrunk down, with only the active item displayed.
 A cool alternative to this is to display the list with "overflow: auto" to
 the side of your photos, as the script allows you to click items to jump to them!
 You could have a list of thumbnails, linking to the full-size images, and use
 photoItemActive to put a border/background around the active image...
*/

.photoListActive {	
	 margin: 0 0 1em 0;	
	 padding: 0em 6em;	
	 text-align: center;	
	 list-style: none;
	}

.photoListActive li {
	 margin: 0;
	 padding: 0;
	 color: #000000;
	 font-weight: bold;
	 display: none;
	}

.photoListActive li.photoItemActive {
 	display: block;
	}

.photoListActive a {
 	color: #0080B6;
	}

/* It's a good idea to wrap your photos in an area the size of the largest photo */

.photoContainer {
	height: 300px;
	width: 425px;
}

/* OK, the photo area itself. Nothing too special here, a border and some padding. */

.photoArea {
	 position: relative;
	 visibility: hidden;
	 margin: 0 auto 0 auto;
	}

.photoAreaActive {
	visibility: visible;
	border: 1px solid #d8e7ef;
	padding: 4px;
	}





/*

 The AutoPlay setup is complicated; the two styled spans are alternately hidden and

 shown depending on the script state. I also have a small loading message that is

 shown to the right.

*/


.photoAutoDisabled {
 	display: none;
	visibility: hidden;
	}

.photoAutoPlay, .photoAutoPause {
	display: block;
	width: 5em;
	padding: 0.1em;
	text-align: center;
	color: white;
	background-color: #0080B6;
	border: 1px solid #0080B6;
	border-color: #d8e7ef #0080B6 #0080B6 #d8e7ef;
	cursor: pointer;
	visibility: hidden;
	}

.photoAutoPlay span, .photoAutoPause span {
	display: none;
	width: 5em; /* IE/Mac fix */
	visibility: hidden;
	}

.photoAutoPlay .photoAutoPlayLabel {
	display: block;
	visibility: hidden;
	}

.photoAutoPause .photoAutoPauseLabel {
	display: block;
	visibility: hidden;
	}

.photoLoadMessage {
	float: right;
	visibility: hidden;
	font-style: italic;
	text-align: center;
	}	
	
div.donorScroll {
	height:180px;
	width:97%;
	overflow:auto;
	background-color:#d8e7ef;
	border: 1px solid #0080B6;
	border-color: #0080B6;
	padding-left: 5px;
	padding-right: 5px;
	}	
