/*
Theme Name: CG's Main Theme
Theme URI: http://www.cgsgym.com/
Description: CG's theme (red and blue) with looping images.
Author: Matt Foil
Author URI: http://www.aurexoul.com/
Version: 1.0
*/

* {
	margin: 0;
	padding: 0;
}

html, body {
	font: 10pt Helvetica, sans-serif;
	color: Black;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	background: #13235B; /*13235B 1A2A65 url(images/glow_bg.png) center repeat-y;*/

}

a, span, div, ul, li, img {
	color: Black;
	border: 0;
	list-style: none;
}

input {
    color: black !important;
}

#contain {
	position: relative;
	width: 900px;
	margin: 0 auto;
	height: auto !important;
	height: 100%;
	min-height: 100%;
    z-index: 1;
    background: #22316C;
}

/*
    navigation base properties (including position fix)
*/

#navigation {
	width: 100%;
	height: 40px;
	background: url(images/nav_bg.png);
	line-height: 40px;
	position: relative;
	z-index: 10;
}

#navigation:after {
	content: ".";
	visibility: hidden;
	clear: both;
}

/*
    first level styles
*/

#navigation > ul {
	margin-left: 15px; /* move from side */
}

#navigation > ul > li {
	float: left;
	position: relative; /* important! allows for positioning of lowel level link */
	/*padding-bottom: 8px; /* allows for gap in menus */
}

/*
    home link is an image
*/

#navigation > ul > li:first-child a {
    float: left; 
    margin: -6px 15px 0 0; 
    width: 40px; 
    height: 50px;
    display: block;
    background: url(images/home_icon.png) 0 0 no-repeat;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-shadow: 0 0 7px rgba(255,255,255, .9);
    -moz-box-shadow: 0 0 7px rgba(255,255,255, .9);
    box-shadow: 0 0 7px rgba(255,255,255, .9);
}

#navigation > ul > li:first-child a:hover {
    background: url(images/home_icon.png) -40px 0 no-repeat;
}

/*
    set basic look of links (includes buttonized background)
*/

#navigation a.navItem {
	height: 30px;
	line-height: 30px;
	display: inline-block;
	text-decoration: none;
	color: #ECECEC;
	text-shadow: 1px 1px 0px #4A4A4A;
	font-weight: 900;
	font-family: Helvetica, Arial, sans-serif;
	margin: 0 3px;
    text-align: center;
    padding: 0 8px;
}

/*
    hover effect over top links
    this part keeps main level link highlighted when going to second level
*/

#navigation > ul > li:hover a.navItem, #navigation a.currentItem {
	background: #3753BA url(images/gradient_blk.png) 0px -90px !important;
	color: #FFF;
	text-shadow: 1px 1px 0px #444;
	-moz-border-radius: 20px;
	border-radius: 20px;
	border-top: solid 1px #3753BA;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0, .2);
    -moz-box-shadow: 0 1px 1px rgba(0,0,0, .2);
    box-shadow: 0 1px 1px rgba(0,0,0, .2);
}

/*
    second level links basics
*/

#navigation > ul > li > a + ul {
	display: none; /* hides menu initially */
	position: absolute; /* positions it from main level link */
	top: 38px; /* position relative to main level link, change to a max of 40 (height + padding) */
	left: 20px;
	background: #CCC url(images/gradient_blk.png) 0 -100px repeat-x;
	text-align: left;
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0, .4);
    -moz-box-shadow: 0 1px 3px rgba(0,0,0, .4);
    line-height: 10px; /* same as 2nd level li height */
	min-width: 200px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}

/*
    show second level when hovering either parent link or self
*/

#navigation > ul > li:hover > a + ul, #navigation > ul > li:hover > a + ul:hover {
	display: block;
}

/*
    allow for borders on highlight
*/

#navigation ul ul li.subNav {
    border-top: solid 1px transparent /*rgba(255, 255, 255, 0)*/;
	border-bottom: solid 1px transparent /*rgba(255, 255, 255, 0)*/;
}

/*
    second level link basics
*/

#navigation ul ul li a {
	display: block;
	height: 10px;
	padding: 10px;
	text-decoration: none;
	color: #444;
	font-weight: bold;
	text-shadow: 1px 1px 0 #FFF;
}

/*
    round corners of 2nd level
*/

#navigation ul ul li:first-child {
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-topright: 5px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}

#navigation ul ul li:last-child {
	-moz-border-radius-bottomleft: 5px;
	-moz-border-radius-bottomright: 5px;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
}

/*
    2nd level hover effect
*/

#navigation ul ul li.subNav:hover {
	background: url(images/sub_nav_bg.png);
	color: #FFF;
	border-top: solid 1px #8d907e;
	border-bottom: solid 1px #8d907e;
	color: white;
    text-shadow: 1px 1px 0 #444;
}

/*
    2nd level hover link style
*/

#navigation ul ul li:hover a {
    color: white;
    text-shadow: 1px 1px 0 #444;
}

/*
    login bar
*/

#loginBar {
	position: absolute;
	top: -190px; /* 'hides' initially */
	right: 20px;
	width: 180px;
	border: 3px solid #999;
	border-top: none;
	background: #777 url(images/gradient_blk.png) 0px -80px repeat-x;
	-moz-box-shadow: 0 0 1.5em #555;
	-webkit-box-shadow: 0 0 1.5em #555;
	box-shadow: 0 0 1.5em #555;
	z-index: 0;
	padding: 5px;
	-moz-border-radius: 0 0 5px 5px;
    border-radius: 0 0 5px 5px;
    line-height: 1em;
    z-index: 2;
}

/*
    input styles
*/

#loginBar input[type=text], #loginBar input[type=password] {
	display: block;
	width: 90%;
	padding: 5px;
	margin: 5px 0;
}

#loginBar label {
	font-size: .9em;
	font-variant: small-caps;
	font-weight: bold;
	color: white !important;
}

#loginBar form > p > label {
	font-size: .7em;
	font-variant: normal;
}

/*
    header (navigation div sibling)
*/

#header {
	width: 100%;
	height: 315px;
	position: relative;
	z-index: 1; /* set for login bar */
}

#banner {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;
	background: url(images/banner2.png);
	height: 315px;
	width: 900px;
}

#logo {
	position: absolute;
	width: 337px;
	height: 139px;
	top: 88px;
	left: 75px;
	background: url(images/logo.png) no-repeat;
	z-index: 3;
}

#navigation > ul, #navigation > ul > li {
	display: inline-block;
}

/*
    Looping images (only change width / height)
*/

#slider {
	width: 460px; /* important to be same as image width */
	height: 315px; /* important to be same as image height */
	position: relative; /* important */
	overflow: hidden; /* important */
	margin-left: 440px; /* equal to 900 - width of images) */
}

#sliderContent {
	width: 460px; /* important to be same as image width or wider */
	position: absolute; /* important */
	top: 0; /* important */
	margin-left: 0; /* important */
	background: #237;
}

.sliderImage {
	float: left; /* important */
	position: relative; /* important */
	/* display: none;  important */
	height: 315px;
	width: 460px;
}

.sliderImage span {
	position: absolute; /* important */
	left: 0;
	font: 10px/15px Arial, Helvetica, sans-serif;
	padding: 10px 13px;
	width: 434px;
	background-color: #000;
	filter: alpha(opacity=70); /* here you can set the opacity of box with text */
	-moz-opacity: 0.7; /* here you can set the opacity of box with text */
	-khtml-opacity: 0.7; /* here you can set the opacity of box with text */
	opacity: 0.7; /* here you can set the opacity of box with text */
	color: #FFF;
	/*display: none; /* important */
	text-align: right;
	bottom: 0;
}

.clear {
	clear: both;
	visibility: hidden;
} 

#contents {
    color: #FFF;
    width: 96%;
    padding: 0 2% 20px;
    min-height: 200px;
    background: #22316C url(images/gradient_blk.png) 0 -80px repeat-x;
    z-index: 10;
}

#contents * {
    color: white;
}

#sidebar {
    float: left;
    width: 29%;
}

.sidebar_box {
	padding: 4%;
    background: #424f7b url(images/gradient.png) 0 -120px repeat-x;
    border-radius: 5px;
    -moz-border-radius: 5px;
    margin-top: 20px;
    -webkit-box-shadow: 0 0 10px rgba(0,0,0, .4);
    -moz-box-shadow: 0 0 10px rgba(0,0,0, .4);
    box-shadow: 0 0 10px rgba(0,0,0, .4);
}

/* Scroller Box */
#scroller_container {
    width: 96%;
    height: 30px;
    overflow: hidden;
    padding: 0 2%;
    background: #b2b4a9 url(images/sub_nav_bg.png) -450px 0px repeat-x;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-shadow: 0 0 7px rgba(0,0,0, .7);
    -moz-box-shadow: 0 0 7px rgba(0,0,0, .7);
    box-shadow: 0 0 7px rgba(0,0,0, .7);
    margin: 10px auto 30px;
}

/* CSS Hack Safari */
#dummy {;# }

#scroller_container {
    overflow: hidden;
}

#scroller_container .scroller {
   font-size: 1em; 
   line-height: 30px; 
   white-space: nowrap; 
}

.sidebarCategory {
    font-size: 1.2em;
    font-weight: bold;
    border: 1px solid #212d7c;
    border-right: none;
    border-left: none;
    padding: 5px;
    background: #3753BA url(images/gradient_blk.png) 0px -90px !important;
    -moz-border-radius: 5px;
    border-radius: 5px;
    margin-bottom: 5px;
    cursor: pointer;
    -webkit-box-shadow: 0 0 4px rgba(0,0,0, .4);
    -moz-box-shadow: 0 0 4px rgba(0,0,0, .4);
    box-shadow: 0 0 4px rgba(0,0,0, .4);
    border-top: solid 1px #3753BA;
}

.sidebarCategory > div.categoryName {
    float: left;
}

.sidebarCategory > div.arrow {
    float: right;
    background: url(images/arrow_up.png) no-repeat;
    width: 10px;
    height: 10px;
    margin-top: 4px;
}

.sidebarCategory:after {
    content: ".";
    display: inline;
    clear: both;
    visibility: hidden;
}

.sidebarTitles li {
    list-style-type: disc;
    margin-left: 10px;
}

.sidebarTitles a {
    text-decoration: none;
}

.sidebarTitles {
    display: none;
    margin-left: 10px;
    padding: 5px 3px;
}

#sidebar:after {
    float: left;
    width: 4%;
    content: ".";
    visibility: hidden;
}

#mainContent {
    margin-top: 30px;
    float: right;
    width: 67%;
	font-size: 1.2em;
}

#contents #mainContent ul, #contents #mainContent li {
    margin: 5px 20px;
    list-style-type: disc;
}

#comments li {
    list-style-type: none !important;
}

#comments input, #comments textarea {
    color: black;
    padding: 5px;
}

#comments textarea {
    resize: vertical;
}

#comments input[type=text] {
    width: 325px;
}

#comments label {
    display: block;
    font-size: 1.2em;
    font-weight: bold;
    margin: 10px auto 3px !important;
}

#comments .comment-body {
    padding: 5px;
}

#contents:after {
    clear: both;
    content: ".";
    visibility: hidden;
    display: block;
}

#footer {
    clear: both;
	width: 100%;
	height: auto !important;
	height: 200px;
	min-height: 200px;
	background: #ECECEC url(images/gradient_blk_small.png) 0 -15px repeat-x;
	position: relative;
	border-top: solid 1px transparent;
}

#footerInner {
	width: 900px;
	padding: 10px 0;
	margin: 0 auto;
}

#footerInner div, #footerInner span {
	text-align: center;
	font-size: 9px;
	line-height: 100px;
	color: black;
}

.bold {
	font-weight: bold;
	color: inherit;
}

.black {
	color: #666;
}

.heading {
    line-height: 40px;
    background: url(images/sub_nav_bg.png) repeat-y;
    width: 96%;
    color: white !important;
    font-size: 24px;
    font-weight: bold;
    padding: 0 2%;
    word-wrap: break-word;
    margin-bottom: 10px;
    display: block;
    -webkit-box-shadow: 0 0 5px rgba(0,0,0, .5);
    -moz-box-shadow: 0 0 5px rgba(0,0,0, .5);
    box-shadow: 0 0 5px rgba(0,0,0, .5);
    border-radius: 5px;
    -moz-border-radius: 5px;
}

.important {
    background: #CD2626;
    width: 96%;
    font-color: white !important;
    font-size: 16px;
    font-weight: bold;
    padding: 2%;
    word-wrap: break-word;
    margin: 10px 0;
    display: block;
    border: 1px solid #800000;
    text-align: center;
    -webkit-box-shadow: 0 0 4px rgba(0,0,0, .4);
    -moz-box-shadow: 0 0 4px rgba(0,0,0, .4);
    box-shadow: 0 0 4px rgba(0,0,0, .4);
}

hr.divider {
    background: white;
    height: 2px;
    width: 96%;
    border: none;
    -webkit-box-shadow: 0 0 4px rgba(255,255,255, .8);
    -moz-box-shadow: 0 0 4px rgba(255,255,255, .8);
    box-shadow: 0 0 4px rgba(255,255,255, .8);
    margin: 15px auto;
    display: block;
}

.postHeading {
    line-height: 30px;
    background: url(images/nav_bg.png) repeat-y;
    width: 96%;
    color: white !important;
    font-size: 20px;
    font-weight: bold;
    padding: 0 2%;
    word-wrap: break-word;
    margin-bottom: 10px;
    display: block;
    height: 30px;
    -webkit-box-shadow: 0 0 5px rgba(0,0,0, .5);
    -moz-box-shadow: 0 0 5px rgba(0,0,0, .5);
    box-shadow: 0 0 5px rgba(0,0,0, .5);
    border-radius: 5px;
    -moz-border-radius: 5px;
}

.postTitle {
    float: left;
}

.postDate {
    float: right;
    font-size: .7em;
}

.postHeading:after {
    clear: both;
    display: block;
    content: ".";
    visibility: hidden;
    height: 1px;
}



/*

    CALENDAR CSS

*/



.calnk a:hover {
     background-position: 0 0;
     text-decoration: none;  
     color: #000000;
     border-bottom: 1px dotted #000000;
     }
.calnk a {
    text-decoration:none; 
    color:#000000; 
    border-bottom:1px dotted #000000;
    }
.calnk a span { 
    display:none; 
    }
.calnk a:hover span {
    color: #333333; 
    background: #8B0000; 
    display: block;
    position:absolute; 
    margin-top: 1px; 
    padding: 5px; 
    width: 175px;
    z-index:100;
    line-height:1.0em;
    }

 .calendar-table {
    border:none;
    width:100%;
 }

.calendar-table > tbody > tr > td {
 border-right: 1px solid white;
 border-bottom: 1px solid white;
}

.calendar-table > tbody > tr > td.day-without-date:first-child, .calendar-table > tbody > tr > td.day-with-date:first-child, .calendar-table > tbody > tr > td.weekend-heading:first-child {
border-left: 1px solid white;
}

 .calendar-heading {
    background: #13235B;
    height: 25px;
    text-align: center;
    border: 1px solid white;
padding: 5px 0;

 }
 .calendar-next {
    width:25%;
    text-align:center;
 }
 .calendar-prev {
    width:25%;
    text-align:center;
 }
 .calendar-month {
    width:50%;
    text-align:center;
    font-weight:bold;
    color: black;
    font-size: 1.4em;
 }

 .normal-day-heading {
    text-align:center;
    width:25px;
    height:25px;
    font-size:0.8em;
    background-color: #13235B;
 }
 .weekend-heading {
    text-align:center;
    width:25px;
    height:25px;
    font-size:0.8em;
    background-color: #13235B;
 }
 .day-with-date {
    vertical-align: text-top;
    text-align: left;
    width:60px;
    height:80px;
    background: #13235B;
 }
 .no-events {

 }
 .day-without-date {
    width:60px;
    height:80px;
    background: #13235B;
 }

 span.weekend {
    color:#FF0000;
 }

 .current-day {
    vertical-align:text-top;
    text-align:left;
    width:60px;
    height:60px;
    background-color: rgb(60, 62, 63);
 }
 span.event {
    font-size:0.75em;
 }
 .kjo-link {
    font-size:0.75em;
    text-align:center;
 }
 .calendar-date-switcher {
    height:25px;
    text-align:center;
    border:1px solid #D6DED5;
    background-color:#E4EBE3;
 }
 .calendar-date-switcher form {
    margin:0;
    padding:0;
 }
 .calendar-date-switcher input {
    border:1px #D6DED5 solid;
 }
 .calendar-date-switcher select {
    border:1px #D6DED5 solid;
 }
 .cat-key {
    width:100%;
    margin-top:10px;
    padding:5px;
    border:1px solid #D6DED5;
 }
 .calnk a:hover span span.event-title {
    padding:0;
    text-align:center;
    font-weight:bold;
    font-size:1em;
    }
 .calnk a:hover span span.event-title-break {
    width:96%;
    text-align:center;
    height:1px;
    margin-top:5px;
    margin-right:2%;
    padding:0;
    background-color:#000000;
 }
 .calnk a:hover span span.event-content-break {
    width:96%;
    text-align:center;
    height:1px;
    margin-top:5px;
    margin-right:2%;
    padding:0;
    background-color:#000000;
 }
 .page-upcoming-events {
    font-size:80%;
 }
 .page-todays-events {
    font-size:80%;
 }