@import url("css/menu.css");
@import url("css/variations/stylesheetwidget.css");

/* ControlPanel style */
.ControlPanel{background:transparent url(images/cpanel_center.png) repeat-x bottom left; border:none;padding-bottom:10px;}
.cpanel_left {background: url(images/cpanel_left.png) no-repeat bottom left;padding-left:21px;}
.cpanel_right {background: url(images/cpanel_right.png) no-repeat bottom right;padding-right:33px;}

/*-------- Default Style --------*/
body {font-family: Arial, Helvetica, sans-serif !important; }
body { font-size:12px; }
h1, h2, h3, h4, h5, h6{color:#5d87a1 !important; font-family: Georgia, "Times New Roman", Times, serif; padding-bottom: 0px; }
h1, h3, h5, h1 input{font-weight:bold;}
h2, h4, h6{font-weight:normal}
h1, h2, h1 input{font-size:14px;margin:6px 0;}
h3, h4{font-size:12px;margin:4px 0;}
h5, h6{font-size:10px;margin:3px 0;}



.Head, .SubHead, .SubSubHead
{font-family: Georgia, "Times New Roman", Times, serif;}
.Head{color:#2E3D47;font-weight:bold;}
.SubHead {color:#4C6171;}
.SubSubHead{color:#6E8AA0;}
.NormalRed {color:#F00;}


/*Datagrids */
.DataGrid_Container {margin-top:15px;}
.DataGrid_Header{font-weight:bold;}
.DataGrid_Header td, .NormalBold td{font-weight:bold;}


/* ------- FileManager -------*/
div.FileManager{height:auto;border:none;}
table.FileManager{width:99%}


a.CommandButton:link, a.CommandButton:visited{color:#CB2027; font-weight:bold; text-decoration:none;}
a.CommandButton:hover{color:#3E81B5; text-decoration:underline;}

/*-------ControlPanel changes ---------------*/
.ControlPanel a.CommandButton:link, .ControlPanel a.CommandButton:visited{color:#3E81B5;}
.ControlPanel a.CommandButton:hover{color:#CB2027; text-decoration:underline;}
.ControlPanel a.CommandButton:link, .ControlPanel a.CommandButton:visited, .ControlPanel .SubHead{font-size:11px;}

/*--------- pane style ----------*/
.ContentPane, .TopPane, .BottomPane{ padding:0; margin:0; }
.LeftPane{ padding:0 20px 0 0; width:20%; margin:0; }
.RightPane{ padding:0 0 0 20px; width:20%; margin:0; }


/*-------------- Link Style --------------*/
.linkscontainer{padding-top:20px;text-align:center;}
.links,a.links:link,a.links:active,a.links:visited{ font-weight:bold; color:#3E81B5; text-transform:uppercase;}
a.links:hover{color:#5D87A1;}

/*-------------- User Style --------------*/
.user,a.user:link,a.user:active,a.user:visited { color:#3E81B5;}
a.user:hover{color:#C00;}

#member_footer, #details_footer{ width: 920px; float:left;  padding-top: 5px; color: #afa182; font-size: 8pt; }
.clear_float { clear: both; }

.wrapper { width: 920px; margin: 0px auto; text-align: left; position: relative; overflow: hidden; }
.content, #header, #footer { width: 920px; }


.more { font-family: Georgia, "Times New Roman", Times, serif !important; color: #d2d0b3; padding-top: 6px; padding-bottom: 6px; display: block; outline: none; }

a:hover { color: #5D87A1 !important; text-decoration: none; }
a img { border: none; } 
p { padding: 0px; margin: 0px; }




/**** DIDI ****/



* {
	margin:0;
	padding:0;
}

body, h1, h2, h3, h4, h5, h6, p, ol, ul, li, fieldset, input, form, a, img, object, embed, dl, dt, dd, map, area {margin:0; padding:0;}


/*////////////////////////////////////////////////
//// LAYOUT ////////////////////////////////////////
////////////////////////////////////////////////////
*/

body {	
	min-width:800px;
	text-align:center;
}

div#wrapper {
	width:800px;
	margin: 0 auto;
	text-align: left;
}

div#top {
	height: 20px;
	width: 100%;
	padding: 0px;
	margin: 10px 0px 0px 0px;
}

div.region_name#infochannel {
	float:right;
	margin: 40px 0 0 0;
}

div.region_name#infochannel h2 a {
	width:299px;
	height:30px;	
}

div#branding {
	width: 798px;
	float: left;
	margin: 0px 0 5px 0;
	padding: 8px 0px 0px 0px;
}

div#logo {
	margin: 15px 0 0 0;
	padding: 0px 0px 0px 10px;
	float: left;
}


div#logo h1 a.brand {
	width: 260px;
	height: 72px;
	float: left;
}
div.navigation {
	width: 798px;
	margin: 0px 0px 5px 0px;
	padding: 0px;
	float: left;
	font-family:Arial, Helvetica, sans-serif;
	font-size:15px;
}

div.navigation ul {
	margin: 0px;
	padding: 0px;
	float: left;
	width: 798px;
}

div.navigation ul li {
	float: left;
}

div.navigation ul li a {
	padding: 8px 22px; /* CHANGE the default 15px PADDING HERE TO SERPERATE THE BUTTONS FARTHER FROM EACH OTHER */
}


div#contentbox {
	padding:10px;
	margin:0px;
	
}

/* BREADCRUMBS related CSS */
div#breadcrumbs {
	margin: 0px 0px 4px 0px;
	padding: 0px;
	float: left;
	width: 778px;
}
div#breadcrumbs ul {
	float:left;
	width:778px;
	margin:0px;
	padding:0px;

}

div#breadcrumbs ul li {
	float:left;
	padding: 4px 0px 4px 0px;
}

div#breadcrumbs ul li a {
	padding:0px 20px 0px 0px;
	margin:0px 15px 0px 0px;	
}


div#banner img, div#banner img a {
	margin: 0px;
	padding: 0px;
	
	}

#div#banner { width: 778px; height: 256px; }


div#moduleholder {
	margin: 10px 0px 0px 0px;
	color: #333333;
	clear: both;
	width: 778px; /* needs to have width here. */
}


div#moduleholder div#feature1 {
	float: left;
	margin: 0 3px 0 0;
	width: 190px;
	padding: 0px;
	height: 150px;
}

/* for body class = inside page 1, feature 1 extends 100% */

	body.inside_page1 div#moduleholder div#feature1{
	margin: 0px;
	width: 776px;
	padding: 0px;
	height: auto;
	}

div#moduleholder div#feature2 {
	float: left;
	margin: 0 3px 0 0;
	width: 190px;
	padding: 0px;
	height: 150px;
}

div#moduleholder div#feature3 {
	float: left;
	margin:0px;
	width: 190px;
	padding: 0px;
	height: 150px;
}

div#moduleholder div#feature4 {
	float: left;
	margin:0 0 0px 5px;
	width: 182px;
	padding: 40px 0 0 8px;
	height: 118px;
	border-color:#FFF;
	background-image:url(images/didYoukknow.jpg);
	background-position:top right;
	background-repeat:no-repeat;
	font-family:Verdana, Geneva, sans-serif;
	font-size:10px;
	line-height:14px;
	color:#6f6f6f;

}


/* for body class = homepage2, 4 feature boxes instead of default 3 */
body.homepage2 div#moduleholder div#feature1, 
body.homepage2 div#moduleholder div#feature2, 
body.homepage2 div#moduleholder div#feature3,
body.homepage2 div#moduleholder div#feature4
 {
	width:191px;
	margin:0px 2px 0px 0px;
	border: 1px solid #CCCCCC;
	background-color: #FFFFFF;
	background-image: url(images/homepage2_feature_backgnd.jpg);
	background-repeat: repeat-x;
	background-position: bottom left;
	float:left;
	height:150px;
}
body.homepage2 div#moduleholder p { padding: 0px; }

body.homepage2 div#moduleholder div#feature4 {
	margin:0px; /* we don't need margin for the last feature */
}


/* for body class = homepage3, 1 feature box instead of default 3 

Add your own markup inside this div to create variations

*/
body.homepage3 div#moduleholder div#feature1 {
	width:776px;
	margin:0px;
	padding:0px;
}



div#moduleholder #feature1 img, 
div#moduleholder #feature2 img, 
div#moduleholder #feature3 img,
div#moduleholder #feature4 img 
{
	margin: 0px;
	padding: 0px;
	}

.clear {
	clear: both;
}
.floatright {
	float: right;
}
.floatleft {
	float:left;
}

.inside_padding {
	padding: 20px;
	}
	
.inside_padding p{
	margin-top:15px;
}

.inside_padding a{
	color:#1e83b6;
	
}


div#secondary_content {
	
}


div#bottom {
	height: 20px;
	width: 100%;	
	clear: both;

}

/*////////////////////////////////
// END LAYOUT REALTED CSS ///////
//////////////////////////////*/

/* TYPOGRAPHY */
/* This section should contain CSS directly related to type. Anything to do with font, alignment, spacing, list-style */

body {
	
	font-size:small;
	font-family:Arial, Helvetica, sans-serif;

	
}

h1 span {
	display:none;
}

div.region_name#infochannel h2 a {
	display:block;
	text-indent:-2000px;	
}


div.navigation ul {
	font-size: 120%;
	list-style-type: none;
}
div.navigation ul li a {
	text-decoration: none;
	text-transform: uppercase;
	display:block;
}


/* BREADCRUMBS related CSS */

div#breadcrumbs ul {
	list-style:none;
	}


div#breadcrumbs ul li a {
	display: block;
	
}

a {
	text-decoration:none;
}
a:hover {
	text-decoration:underline;
	}

div.footer { width: 810px; text-align:center; font-family:Verdana, Geneva, sans-serif; font-size:11px; line-height:18px; margin-top:10px;}

/* hiding all the h2, p and a leaving only the image. We need this to make the section readable by search engines + images turned off 

	NOTE: You can overide this feature in your external CSS */
	
	
div#moduleholder #feature1 h2,
div#moduleholder #feature2 h2, 
div#moduleholder #feature3 h2,
div#moduleholder #feature4 h2

	{
	text-indent:-2000px;
	height: 0px !important; /* you need !important to force some broswers to hide the contents */
	overflow:hidden;
	}
	
div#moduleholder #feature1 p, 
div#moduleholder #feature2 p, 
div#moduleholder #feature3 p,
div#moduleholder #feature4 p
	{
	text-indent:-2000px;
	height: 0px !important;/* you need !important to force some broswers to hide the contents */
	overflow:hidden;
	}
div#moduleholder #feature1 p a, 
div#moduleholder #feature2 p a, 
div#moduleholder #feature3 p a, 
div#moduleholder #feature4 p a 
	{
	text-indent:-2000px; 
	height: 0px !important;/* you need !important to force some broswers to hide the contents */
	overflow:hidden;
	}


/* FOR BODY CLASS = INSIDE_PAGE1, we will show all the hidden h2, a and p */

	body.inside_page1 div#moduleholder div#feature1 h2,
	body.inside_page1 div#moduleholder div#feature1 p,
	body.inside_page1 div#moduleholder div#feature1 a 
	{
	text-indent:0px;
	height: auto !important;/* you need !important to force some broswers to show the otherwise hidden the contents */
	}


/* FOR BODY CLASS = homepage2, we will show all the hidden h2, a and p */

	body.homepage2 div#moduleholder div#feature1 h2,
	body.homepage2 div#moduleholder div#feature1 p,
	body.homepage2 div#moduleholder div#feature1 a 
	{
	text-indent:0px;
	height: auto !important;/* you need !important to force some broswers to show the otherwise hidden the contents */
	}
	
	body.homepage2 div#moduleholder div#feature2 h2,
	body.homepage2 div#moduleholder div#feature2 p,
	body.homepage2 div#moduleholder div#feature2 a 
	{
	text-indent:0px;
	height: auto !important;/* you need !important to force some broswers to show the otherwise hidden the contents */
	}
	body.homepage2 div#moduleholder div#feature3 h2,
	body.homepage2 div#moduleholder div#feature3 p,
	body.homepage2 div#moduleholder div#feature3 a 
	{
	text-indent:0px;
	height: auto !important;/* you need !important to force some broswers to show the otherwise hidden the contents */
	}
	body.homepage2 div#moduleholder div#feature4 h2,
	body.homepage2 div#moduleholder div#feature4 p,
	body.homepage2 div#moduleholder div#feature4 a 
	{
	text-indent:0px;
	height: auto !important;/* you need !important to force some broswers to show the otherwise hidden the contents */
	}


/*////////////////////////////////////////////////////
// COLOR CSS BEGINS HERE /////////////////////////////
////////////////////////////////////////////////////*/

/* this part of css should only contain : color, background, border */

body {
	background-image:url(images/blue_bg.jpg);
	background-repeat:repeat-x;
	background-color:#375a87;
	background-position:top left;
	color:#FFFFFF;
		
}

div#top {
	background-image: url(images/top_corners.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px;
}
div.region_name#infochannel h2 a {
	background:url(images/_title_Chautauqua.gif) no-repeat 0% 50%;
}

div#branding {
	border: 1px solid #304c70;
	background-color: #FFFFFF;
	border-top: none;
}
	
div.navigation {
	background-color: #FFFFFF;
	border: 1px solid #304c70;
	
}


#logo h1 a.brand {
	background-image: url(images/mainlogo.gif);
	background-repeat: no-repeat;
}


div.navigation ul li a {
	color:#2f4c73;

}

div.navigation ul li a:hover, #houseMenuCurrentItem a, .active {
	background-color:#355783;
	color:#FFFFFF !important;
	background-image: url(images/_rollover.jpg);
	background-repeat: repeat-x;
	background-position: top left;
	text-decoration: none;
}


div.navigation ul li a#toolkit:hover, div.navigation ul li a#register:hover {
	background-color:#355783;
	color:#FFFFFF;
	background-image: url(images/_rollover.jpg);
	background-repeat: repeat-x;
	background-position: top left;
}

div.navigation ul li a#videos:hover {

	background-color:#355783;
	color:#FFFFFF;
	background-image: url(images/_rollover.jpg);
	background-repeat: repeat-x;
	background-position: top left;

	
}
div.navigation a#home:hover, div.navigation ul li a#about:hover, div.navigation ul li a#events:hover {

	background-color:#355783;
	color:#FFFFFF;
	background-image: url(images/_rollover.jpg);
	background-repeat: repeat-x;
	background-position: top left;

	
}

div.navigation ul li a#regions:hover {
	background-color:#993300;
	color:#FFFFFF;
	background-image: url(images/_brown_rollover.jpg);
	background-repeat: repeat-x;
	background-position: top left;
	
}



div#contentbox {
	border: 1px solid #304c70;
	background: #FFFFFF;
	border-bottom: none;
}


/* BREADCRUMBS related CSS */
/* DEFAULT ARROW COLOR IS ORANGE. Override it with giving classes to breadcrumbs div */

div#breadcrumbs {
	border-bottom: 1px solid #375a87;
	color: #666666;
}
div#breadcrumbs ul {
	list-style:none;

}

div#breadcrumbs ul li {
	
}

div#breadcrumbs ul li a {
	color:#333333;
	display: block;
	background-image:url(images/_orange_arrow.gif);
	background-repeat: no-repeat;
	background-position: 100% 50%;
	
}

div.videos#breadcrumbs ul li a{

	background-image:url(images/_video_arrow_forward.gif);
	background-repeat: no-repeat;
	background-position: 100% 50%;

}

div.toolkit#breadcrumbs ul li a{

	background-image:url(images/_green_arrow.gif);
	background-repeat: no-repeat;
	background-position: 100% 50%;

}



div#banner img, div#banner img a {

	border:none;
	}

div#moduleholder {
	border:none;
	}

div#moduleholder div#feature1 {
	color: #333333;
	border: 1px solid #cccccc;
	background-image:url(images/calloutBackground.jpg);
	background-repeat:repeat-x;
	background-position:bottom;
}

/* for body class = inside_page1, we will reset the color values */

body.inside_page1 div#moduleholder #feature1 {
	color: #333333;
	background-color: #FFFFFF;
	border: 1px solid #cccccc;
}
/* End body class = inside_page1 specific CSS */

div#moduleholder div#feature2 {
	border: 1px solid #cccccc;
	color: #000000;
	background-image:url(images/calloutBackground.jpg);
	background-repeat:repeat-x;
	background-position:bottom;
	
}

div#moduleholder div#feature3 {
	border: 1px solid #000000;
	color: #000000;
	border: 1px solid #cccccc;
	color: #000000;
	background-image:url(images/calloutBackground.jpg);
	background-repeat:repeat-x;
	background-position:bottom;
	
}

div#moduleholder #feature1 img, div#moduleholder #feature2 img, div#moduleholder div#feature3 img {
	border: none;
}

/* for homepage class = homepage2 with 4 features */
body.homepage2 div#moduleholder div#feature1, 
body.homepage2 div#moduleholder div#feature2, 
body.homepage2 div#moduleholder div#feature3,
body.homepage2 div#moduleholder div#feature4
 {	
	border: 1px solid #CCCCCC;
	background-color: #FFFFFF;
	background-image: url(images/homepage2_feature_backgnd.jpg);
	background-repeat: repeat-x;
	background-position: bottom left;
}
/* for homepage class = homepage3 with 1 feature 
	add your markup inside this div to custom design
*/

body.homepage3 div#moduleholder div#feature1 {
	border: 1px solid #CCCCCC;
	background-color: #FFFFFF;
	background-image: url(images/homepage2_feature_backgnd.jpg);
	background-repeat: repeat-x;
	background-position: bottom left;
}
div#secondary_content {
	background-color:#FFFFFF;
	border-left:1px solid #000000;
	border-right:1px solid #000000;
	color:#333333;

}

div#bottom {
	background-image: url(images/bottom_corners.gif);
	background-repeat: no-repeat;
	background-position: 0% 100%;
}


div.footer a {
	color: #FFFFFF;
	text-decoration:underline;
}


div.footer img{
	border:none;
}


/* END COLOR INFO*/

.navigation ul li { list-style: none !important; }
.navigation ul li a:hover { color: #fff !important; }

#moduleholder .c_content{ padding: 10px 10px 0px 10px !important; margin-bottom: 0px !important; }

#moduleholder .c_content p { font-size: 10pt; }

.footer .Normal{ text-align: center !important; font-size: 10pt; }
.footer .Normal a { color: #fff !important; text-decoration: underline; }

h1, h1 span.TitleHead { color: #000 !important; }