/* Title:	CSSC Sports & Leisure - General Styles for Website */

body {
	background-color: #FFFFFF;
	margin: 0;
	padding: 0;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	line-height: normal;
	min-width: 760px;
}

/* MISC. */
hr, .hide {
	display: none;
}
a img {
	border: none;
}
.divclear {
	clear:both; 
	height:0px; 
	font-size:0px; 
	margin: 0;
	padding: 0;
	margin-top:-1px;
}
hr.cleaner {
      clear:both;
      height:1px;
      margin: -1px 0 0 0; 
	  padding:0;
      border:none;
      visibility: hidden;
}
.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

div#wrap {
	min-width:763px;
	/*max-width:1024px;*/
	/*position:relative;*/
	overflow:visible;
}
#wrap {
	color: #000000;
	font-size: 95%;
	width: 100%;
	margin: 0 auto;
	text-align: left;
	min-width: 780px;
	_width: expression(((document.body.clientWidth)) < 800? "795px": "auto" );
	
	background: #FFFFFF url(/web/templates/cssc_home_files/right-bkgrnd.gif) repeat-y right top;
}
#content-page #wrap {
	background: #FFFFFF;
}

#container-header {
	background-color: #1B3663;
	width: 100%;
	font-size: 0.9em;
	color: #FFFFFF;
}
#container-menu {
	border-top: 1px solid #FFFFFF;
	/*border-bottom: 1px solid #FFFFFF;*/
}
#container-content {
	width: 100%;
	font-size: 0.9em;
	padding-bottom: 1.0em;
	background: url(/web/templates/cssc_home_files/ae-menu-bkgrnd.gif) repeat-y top left;
	/*min-height: 300px;
	height: auto;
	_height: 300px;*/
	border-top: 1px solid #FFFFFF;
}
#container-footer {
	width: 100%;
	font-size: 0.9em;
	background-color: #CCCCCC;
	color: #666666;
	border-top: 1px solid #FFFFFF;
}

/* GENERAL TEXT STYLES */
.smalltextbutton {
	font-size:0.8em;
}
.mediumtextbutton {
	font-size:1em;
}
.largetextbutton {
	font-size:1.2em;
}
a, 
a:link, 
a:visited {
	color: #000000;
	text-decoration: none;
}
a:focus, 
a:hover, 
a:active {
	color: #000000;
	text-decoration: underline;
}
#container-content .content-column a {
	text-decoration: underline;
}
p {
	line-height: normal;
	margin-top: 0.9em;
	margin-bottom: 0;
}
ul {
	list-style: square;
}
ol {
	list-style: decimal;
}
h1, h2, h3, h4, h5, h6 {
	color: #1B3663;
}
h1#page-title {
	padding-right: 30px;
	border-bottom: 1px solid #19A9EC;
	color: #1B3663;
	padding-bottom: 0.5em;
}
h1 {
	font-size: 1.5em;
	font-weight: normal;
	padding-top: 15px;
	margin: 0px;
}
h2 {
	font-size: 1.3em;
	font-weight: bold;
}
h3, h4 {
	font-size: 1.1em;
}
h5, h6 {
	font-size: 1.0em;
}

h3 a , 
h3 a:link, 
h3 a:visited {
	color:#ffffff;
	font-size: 0.9em;
}

/* TWO COLUMN LAYOUT - LEFT */
#container-content .content-wrapper {
	float: left;
	width: 100%;
}
#container-content .content-column {
	/*margin: 0 95px 0 190px;*/
	margin: 0 0px 0 199px; /* Margins for content column. Should be "0 RightColumnWidth 0 LeftColumnWidth */
}
#container-content .left-column {
	float: left;
	/*width: 190px;*/
	width: 199px; /* Width of left column */
	margin-left: -100%;
}

#container-content .right-column {
	float: left;
	width: 0px; /* Width of right column */
	margin-left: -0px; /* Set left margin to -(RightColumnWidth) */
}
#container-content .innertube {
	margin: 1.0em; /* Margins for inner DIV inside each column (to provide padding) */
	margin-top: 0;
}
/* TWO COLUMN LAYOUT - RIGHT */
#container-content #container-content-inner .content-wrapper {
	float: left;
	width: 100%;
}
#container-content #container-content-inner .content-column {
	/*margin: 0 95px 0 190px;*/
	margin: 0 199px 0 0px; /* Margins for content column. Should be "0 RightColumnWidth 0 LeftColumnWidth */
}
#container-content #container-content-inner .left-column {
	float: left;
	/*width: 190px;*/
	width: 0px; /* Width of left column */
	margin-left: -100%;
}
#container-content #container-content-inner .right-column {
	float: left;
	width: 199px; /* Width of right column */
	margin-left: -199px; /* Set left margin to -(RightColumnWidth) */
}
#container-content #container-content-inner .innertube {
	margin: 1.0em; /* Margins for inner DIV inside each column (to provide padding) */
	margin-top: 0;
}
/* PAGE ONE COLUMN LAYOUT - RIGHT */
#content-page #container-content #container-content-inner .content-wrapper {
	float: left;
	width: 100%;
}
#content-page #container-content #container-content-inner .content-column {
	/*margin: 0 95px 0 190px;*/
	margin: 0 0px 0 0px; /* Margins for content column. Should be "0 RightColumnWidth 0 LeftColumnWidth */
}
#content-page #container-content #container-content-inner .left-column {
	float: left;
	/*width: 190px;*/
	width: 0px; /* Width of left column */
	margin-left: -100%;
}
#content-page #container-content #container-content-inner .right-column {
	float: left;
	width: 0px; /* Width of right column */
	margin-left: -0px; /* Set left margin to -(RightColumnWidth) */
}
#content-page #container-content #container-content-inner .innertube {
	margin: 1.0em; /* Margins for inner DIV inside each column (to provide padding) */
	margin-top: 0;
}

/* CONTENT THREE COLUMN LAYOUT */
#page #container-content .content-wrapper {
	float: left;
	width: 100%;
	/* SB : min height of page */
}
#page #container-content .content-column {
	/*margin: 0 160px 0 190px;*/
	/* margin: 0 160px 0 220px; Margins for content column. Should be "0 RightColumnWidth 0 LeftColumnWidth */
	margin: 0 190px 0 220px; /* Margins for content column. Should be "0 RightColumnWidth 0 LeftColumnWidth */
}
#page #container-content .left-column {
	float: left;
	/*width: 190px;*/
	width: 220px; /* Width of left column */
	margin-left: -100%;
}
#left-column-inner {}
#page #container-content .right-column {
	float: left;
	/* width: 160px; Width of right column */
	/* margin-left: -160px; Set left margin to -(RightColumnWidth) */
	width: 190px; /* Width of right column */
	margin-left: -190px; /* Set left margin to -(RightColumnWidth) */
}
#right-column-inner {}
#page #container-content .innertube {
	margin: 1.0em; /* Margins for inner DIV inside each column (to provide padding) */
	margin-top: 0;
}

/* HEADER THREE COLUMN LAYOUT */
#container-header    .content-wrapper {
	float: left;
	width: 100%;
	/* SB : min height of page */
}
#container-header .content-column {
	margin: 0 85px 0 265px; /* Margins for content column. Should be "0 RightColumnWidth 0 LeftColumnWidth */
}
#container-header .left-column {
	float: left;
	width: 265px; /* Width of left column */
	margin-left: -100%;
}
#container-header .right-column {
	float: left;
	width: 85px; /* Width of right column */
	margin-left: -85px; /* Set left margin to -(RightColumnWidth) */
}
#container-header .innertube {
	margin: 1.0em; /* Margins for inner DIV inside each column (to provide padding) */
	margin-top: 0;
}

/* HEADER TWO COLUMN LAYOUT */
#content-page #container-header .content-wrapper,
#hub-page #container-header .content-wrapper {
	float: left;
	width: 100%;
	/* SB : min height of page */
}
#content-page #container-header .content-column ,
#hub-page #container-header .content-column{
	margin: 0 0px 0 265px; /* Margins for content column. Should be "0 RightColumnWidth 0 LeftColumnWidth */
}
#content-page #container-header .left-column,
#hub-page #container-header .left-column {
	float: left;
	width: 265px; /* Width of left column */
	margin-left: -100%;
}
#content-page #container-header .right-column,
#hub-page #container-header .right-column {
	float: left;
	width: 0px; /* Width of right column */
	margin-left: -0px; /* Set left margin to -(RightColumnWidth) */
}
#content-page #container-header .innertube,
#hub-page #container-header .innertube {
	margin: 1.0em; /* Margins for inner DIV inside each column (to provide padding) */
	margin-top: 0;
}

/* HEADER */
#header-links .headernoborder {
	border: 0px !important;
}
#header-brand {}
#header-links {}
#header-links ul {
	list-style: none;			/* removes list marker */
	padding: 0px;				/* removes left indent */
	margin: 0px;
	text-align: right;
	padding: 1.0em;
}
#header-links ul li {
	display: inline;			/* sets list items to display in a row */
	padding: 0px;
	margin: 0px;
	border-left: 1px solid #8DA5CD;
}
#header-links span {
	color: #000000;	
	text-decoration: none;
	/*border-left: 1px solid #8DA5CD;*/
	padding: 0em 0.5em;
	background: none;
}
#header-links a, 
#header-links a:link, 
#header-links a:visited {
	color: #FFFFFF;	
	text-decoration: none;
	/*border-left: 1px solid #8DA5CD;*/
	padding: 0em 0.5em;
	background: none;
}
#header-links a:focus, 
#header-links a:hover, 
#header-links a:active {
	color: #FFFFFF;
	text-decoration: underline;
	/*border-left: 1px solid #8DA5CD;*/
	padding: 0em 0.5em;
}
#hub-page #join-now  {display:none;}

/* MAIN MENU */
#container-menu ul {
	list-style: none;			/* removes list marker */
	padding: 0px;				/* removes left indent */
	margin: 0px;
	width: 100%;
	background: #1B3663 url(/web/templates/cssc_home_files/menu-bkgrnd-brand.gif) no-repeat right top;
	float: left;
}

#container-menu ul li {
	display: inline;			/* sets list items to display in a row */
	padding: 0px;
	margin: 0px;
	float: left;
}
#container-menu span {
	color:#FFFFFF;	
	text-decoration: none;
	padding: 0.5em 0.5em !important;
	background: none;
	background: #1B3663 url(/web/templates/cssc_home_files/menu-bkgrnd-on.gif) repeat-x left top;
}
#container-menu .first {
	padding-left: 0.5em;
	background: #1B3663 url(/web/templates/cssc_home_files/menu-bkgrnd.gif) repeat-x left top;
}
#container-menu a, 
#container-menu a:link, 
#container-menu a:visited {
	color:#FFFFFF;	
	text-decoration: none;
	padding: 0.5em 0.5em;
	background: #1B3663 url(/web/templates/cssc_home_files/menu-bkgrnd.gif) repeat-x left top;
	font-weight: bold;
	display: block;
	float: left;
}
#container-menu a:focus, 
#container-menu a:hover, 
#container-menu a:active {
	color: #FFFFFF;
	text-decoration: none;
	padding: 0.5em 0.5em;
	background: #127BE1 url(/web/templates/cssc_home_files/menu-bkgrnd-on.gif) repeat-x left top;
}

/* SEARCH */
.searchtext {
	font-size: 0.9em;
}
#container-search {
	padding: 0.5em;
}
#search {
	margin: 0px;
	/*padding: 0px 0px 0px 20px;*/
	text-align: right;
}
#searchForm {
	margin: 0px;
	padding: 0px;
}
#searchForm form {
	margin: 0px;
	padding: 0px;
	width: auto;
}
#searchForm input {vertical-align: top;}
#searchForm input#searchbox {
	font-size: 0.9em;
	width: 10em;
	height: auto;
}

/* BREADCRUMB */
#container-breadcrumb {
	clear: both;
	color: #666666;
	font-weight: normal;
	padding-bottom: 1.0em;
	padding-top: 0.5em;
}
#container-breadcrumb a, 
#container-breadcrumb a:link, 
#container-breadcrumb a:visited {
	color: #666666;
	text-decoration: none;
}
#container-breadcrumb a:focus, 
#container-breadcrumb a:hover, 
#container-breadcrumb a:active {
	color: #666666 !important;
	text-decoration: none;
}

#page-content {
	clear: both;
}
#page-content h3 {
	background: #50555F url(/web/templates/cssc_home_files/side-bkgrnd.gif) repeat-x left top;
	color: #FFFFFF;
	font-weight: bold;
	padding: 0.5em 1.0em;
	margin: 0;
	border-left: 1px solid #FFFFFF;
}
#page-content .right-column div {
	padding: 1.0em;
}
#copy {
	padding: 1.0em;
}
#content-page #copy img {
	float: right;
	padding-left: 0.5em;
	padding-bottom: 0.5em;
	padding-top: 0.5em;
}
.latest-news {
	padding-bottom: 1.0em;
}
.latest-news a, 
.latest-news a:link, 
.latest-news a:visited {
	color: #000066;
	text-decoration: none !important;
}
.latest-news a:focus, 
.latest-news a:hover, 
.latest-news a:active {
	color: #000066 !important;
	text-decoration: underline !important;
}
.latest-news img {
	border: 1px solid #66CCFF;
	float: left !important;
	margin-right: 1.0em;
	clear: both;
}

/*.latest-news-details {
	float: right;
	width: 69%;
	margin: 0px;
	padding: 0.5em;
	line-height: normal;
}*/
/*.latest-news-img {
	float: left;
	text-align: left;
	margin: 0px;
	line-height: normal;
	display: inline-block;
	color: #FFFFFF;
	width: 25%;
	
	overflow: hidden;
}*/
.latest-news h4 {
	color: #000066;
	margin: 0;
	padding: 0;
	font-size: 1.0em;
}

.latest-news h3 {
	color: #000066;
	margin: 0;
	padding: 0;
	font-size: 1.0em;
	background: none !important;
}

.latest-news h2 {
	color: #000066;
	margin: 0;
	padding: 0;
	font-size: 1.0em;
	background: none !important;
}

/* BANNERS */
#container-banner-inner h1, #container-banner-inner h2, #container-banner-inner h3,  #container-banner-inner p {
	color:#ffffff;
	margin-top: 0.0em;
	padding-top: 0.9em;
	margin-bottom:0;
}
#container-banner {
	background: #1B3663 !important;
	border-bottom: 1px solid #FFFFFF;
	width: 100%;
	color: #FFFFFF;
}
#content-page #container-banner {
	background: #19A9EC !important;
}
#container-banner .content-column img {
	border-left: 1px solid #FFFFFF;
}
#banner-text {
	margin: 0;
	padding: 0;
	line-height: 1.4em;
}
#banner-text-inner {
	margin: 0;
	padding: 0;
}
#banner-text h3 {
	color: #FFFFFF;
	font-weight: normal;
	padding: 0.5em 1em 0.5em 0.5em;
	margin: 0;
	font-size: 1.6em;
	line-height: 1.4em;
}
#banner-text-inner div {
	padding: 1.0em;
}
#banner-text a, 
#banner-text a:link, 
#banner-text a:visited {
	color: #66CCFF;
	text-decoration: none;
}
#banner-text a:focus, 
#banner-text a:hover, 
#banner-text a:active {
	color: #66CCFF;
	text-decoration: underline;
}

/* NEW AE_MENU */
/* Add margin to left of menu to accommodate the arrow image pointer */
#ae-menu {
	margin-left: 0px;
	/*line-height: 1.6em;*/
	/*border-right: 1px solid #FFFFFF;*/
	padding-top: 74px;
}
/* Disable bullets on all menu items */
#ae-menu li {
	list-style-type: none;
}
/* Move arrow image pointer so that it appears consistently at left hand side of menu */
#ae-menu li img {
	position: absolute; 
	left: 20px;
}
#ae-menu ul li ul li  img {
	position: absolute; 
	left: 0px;
}
/* LEVEL 1 */
#ae-menu ul {
	margin: 0;
	padding-left: 0;
	/*background: #000000;*/
}
/* LEVEL 1 CUSTOM STYLES */
.MenuNonSelectedArea1 a, 
.MenuItemNonSelectedOdd1 a, 
.MenuItemNonSelectedEven1 a {
	text-decoration: none;
	display: block;
	/*_width: 140px;*/
	_width: 178px;
	/*padding: 0.2em 20px 0.2em 10px;*/
	padding: 0.5em 10px;
	font-weight: bold;
	border-bottom: 1px solid #29A3FF;
	border-top: 1px solid #A1EAFF;
	background: #47BDFF url(/web/templates/cssc_home_files/ae-menu-1-bkgrnd.gif) repeat-x left top;
}
.MenuSelectedArea1, 
.MenuItemSelectedOdd1, 
.MenuItemSelectedEven1 {
	text-decoration: none;
	display: block;
	/*_width: 140px;*/
	_width: 178px;
	/*padding: 0.2em 20px 0.2em 10px;*/
	padding: 0.5em 10px;
	border-bottom: 1px solid #29A3FF;
	border-top: 1px solid #A1EAFF;
	background: #91DAFF url(/web/templates/cssc_home_files/ae0menu-1-bkgrnd-on.gif) repeat-x left top;
	color: #FFFFFF;
	font-weight: bold;
}
.MenuSelectedArea1 a, 
.MenuItemSelectedOdd1 a, 
.MenuItemSelectedEven1 a {
	/*text-decoration: none;
	display: block;
	_width: 140px;
	padding: 0.2em 20px 0.2em 10px;
	font-weight: bold;
	border-top: 2px solid #FFFFFF;
	background: #000000 url(/web/templates/sp_3col_banner_files/ae-menu-expanded.gif) no-repeat right top;*/
	color: #FFFFFF !important;
}
.MenuSelectedArea1 a:hover, 
.MenuItemSelectedOdd1 a:hover, 
.MenuItemSelectedEven1 a:hover {
	/*text-decoration: none !important;
	background: #000000 url(/web/templates/sp_3col_banner_files/ae-menu-expanded.gif) no-repeat right top;*/
	background: #0A7CE4 url(/web/templates/cssc_home_files/ae0menu-1-bkgrnd-on.gif) repeat-x left top;
	color: #FFFFFF;
}
.MenuNonSelectedArea1 a:hover, 
.MenuItemNonSelectedOdd1 a:hover, 
.MenuItemNonSelectedEven1 a:hover{
	text-decoration: none !important;
	background: #0A7CE4 url(/web/templates/cssc_home_files/ae0menu-1-bkgrnd-on.gif) repeat-x left top;
	color: #FFFFFF;
}
.MenuSelectedArea1 img, 
.MenuItemSelectedOdd1 img, 
.MenuItemSelectedEven1 img {
	display: none;
}
.MenuSelectedArea2 img, 
.MenuSelectedArea3 img, 
.MenuSelectedArea4 img {
	display: inline;
}
/* LEVEL 2  */
#ae-menu ul li ul {
	padding-top: 0.5em;
}
#ae-menu ul li ul li {
	margin: 0px;
	/*color: #C6D23A;*/
	font-weight: bold;
	padding: 0.3em 0px 0.3em 10px;
	/*background: #000000;*/
	color: #000000;
}
#ae-menu ul li ul li a {
	text-decoration: none;
	display: block;
	padding: 0px;
	border-top: 0px;
	font-weight: normal;
	background: none;
	color: #000000 !important;
}
#ae-menu ul li ul li a:hover {
	text-decoration: underline !important;
	color: #000000;
}

/* LEVEL 3 */
#ae-menu ul li ul li ul li a {
	text-decoration: none;
	display: block;
	padding: 0.3em 0px 0.3em 10px;
	font-weight: normal;
}
#ae-menu ul li ul li ul li a:hover {
	text-decoration: none;
}

/* LEVEL 4 */
#ae-menu ul li ul li ul li a {
	text-decoration: none;
	display: block;
	padding: 0.3em 0px 0.3em 10px;
	font-weight: normal;
}
#ae-menu ul li ul li ul li a:hover {
	text-decoration: none;
}

/* MY CSSC */
#my-cssc {
	border-bottom: 1px solid #A1EAFF;
	border-top: 1px solid #A1EAFF;
	margin: 0;
	padding: 0;
}
#my-cssc-inner {
	border-bottom: 1px solid #29A3FF;
	margin: 0;
	padding: 0;
}
#my-cssc h3 {
	background: #06245D url(/web/templates/cssc_home_files/my-cssc-bkgrnd.gif) repeat-x left top;
	color: #FFFFFF;
	font-weight: bold;
	padding: 0.5em 1.0em;
	margin: 0;
}
#my-cssc-inner div {
	padding: 1.0em;
}
#my-cssc-inner div form {
	width: 170px;
}
#my-cs-login label {
	float: left;
	width: 80px;
	font-weight: bold;
	margin-right: 10px;
}
#my-cs-login input {
	float: left;
	width: 80px;
	margin-right: 10px;
}
.login-btn {
	float: right;
clear:both;
}

/* FOOTER */
#container-footer ul {
	list-style: none;			/* removes list marker */
	padding: 0px;				/* removes left indent */
	margin: 0px;
	padding: 1.0em;
}
#container-footer .footernoborder {
	border: 0px !important;
}
#container-footer ul li {
	display: inline;			/* sets list items to display in a row */
	padding: 0.2em 0.5em;
	margin: 0px;
	border-left: 1px solid #666666;
	
}
#container-footer a, 
#container-footer a:link, 
#container-footer a:visited {
	color: #666666;
	text-decoration: none;
	
}
#container-footer a:focus, 
#container-footer a:hover, 
#container-footer a:active {
	color: #666666 !important;
	text-decoration: underline;
}
#copyright {
	color: #666666;
}

.odd {
	background: #E7E7E7;
}