/*
 *  ### BROWSER COMPATABILITY ###
 * IE 7+
 * Opera 9.6+
 * Safari 4+
 * Firefox 3+
 * Chrome 2+
*/
/*** BEGIN: general styles ***/
html, body{
	margin: 0 auto;
	padding: 0;
	font-family: arial, sans-serif;
	font-size: 13px;
    color: #fff;
    background: #290404;
}

ul li{
	list-style-type:none;
	color:#FFF;
	margin-bottom:3px;
	text-indent: -1em;
	font-family:Tahoma, Geneva, sans-serif;
	font-size:13px;
}

.spade_bullet{
	color:#D90000;
}

input[type=text], input[type=password]{ width: 160px; }

.clear{
	clear: both;
	line-height: 0.01em;
	height: 0.01em;
	margin: 0;
	padding: 0;
}

.center-container{
/*
 * used to center content that doesn't fill the whole width of the screen over
 * repeating background textures that fill the width of the screen
*/
	margin: 0 auto;
	width: 980px;
}

.white_right_aligned{
	font-family:Tahoma, Geneva, sans-serif;
	font-size:14px;
	font-weight:bold;
	text-decoration:none;
	text-transform:uppercase;
	color:#FFF;
}
.white_right_aligned a{
	color:#FFF;
	text-decoration:none;
}

h1{
	color:#FFD66A;
	text-transform:uppercase;
	margin-bottom:12px;
}

h2{
	color:#FFD66A;
	text-transform:uppercase;
	margin-top:22px;
	margin-bottom:12px;
    font-size: 20px;
}

h3{
	color:#FFD66A;
	text-transform:uppercase;
	font-size:14px;
	line-height:18px;
	margin-top:11px;
	margin-bottom:9px;
	width:100%;
	padding-bottom:2px;
}
h4{
	color:#FFD66A;
	text-transform:uppercase;
	margin-bottom:16px;
	font-size:16px;
	margin-top:22px;
	font-weight:bold;
}

span.bullet{ /* the cross-shaped bullet between links in the header; leave in general section for possible re-use  */
	height: 10px;
	width: 16px;
	background: url(../images/diamond-bullet.png) no-repeat;
	margin-top: 2px;
    *margin-top: -14px;
	margin-left: 10px;
	display: inline-block;
}

a{
    color: #fff;
    text-decoration: none;
}
a:hover{
    color: #fff;
    text-decoration: none;
}

.centered_heading{
	text-align:center;
	font-size:22px;
	color:#FFF;
	margin-bottom:20px;
}
/*** END: general styles ***/

/*** BEGIN: header styles ***/
#header{
	background: url(../images/header_tile.png) repeat-x;
	height: 104px;
	width: 100%;
	position: relative;
}

#left_navigation_bar{
	font-size:15px;
	float:left;
	width:358px;
	text-align:right;
	margin-right:15px;
}
#left_navigation_bar a:hover{ color:#b69b47; }

#right_navigation_bar{
	font-size:15px;
	position:relative;
	top:0;
	float:right;
	width:358px;
	text-align:left;
	margin-left:15px;
}
#right_navigation_bar a:hover{ color:#b69b47; }

#top_nav{
	height:20px;
	margin-top:2px;
}

#bottom_nav{
	height:20px;
	margin-top:45px;
}
.logo_img{
	margin-top:2px;
}

#logo{
	float:left;
	width:227px;
}
#logo-login{
	margin: 0 auto;
	width:227px;
}
/*** END: header styles ***/

/*** BEGIN: body styles ***/
#body{
	width: 100%;
	background: url(../images/grey_tile.png) 0 0 repeat;
	padding: 60px 0 40px 0;
	min-height: 400px;
    *padding-top: 50px;
}

#body td{ padding: 5px 3px; }

#body .account-info td[align=right]{
    width: 260px;
    padding-right: 6px;
}

#body .cc-info td[align=right]{
    width: 230px;
    padding-right: 6px;
}

#_eventId_next{
	background: url(../images/next.png) top center no-repeat;
	border: 0;
	height: 33px;
	width: 202px;
}

#_eventId_cancel{
	background: url(../images/back.png) top center no-repeat;
	border: 0;
	height: 33px;
	width: 202px;
}

#_eventId_confirm{
	background: url(../images/purchase_now.png) top center no-repeat;
	border: 0;
	height: 33px;
	width: 202px;
}

a#forgotPasswordLink{
    color: #fff;
    text-decoration: none;
}
a#forgotPasswordLink:hover{
    color: #fff;
    text-decoration: underline;
}

div.center-container-login input[type=submit]{
    background: url(../images/btnSignIn.png) top center no-repeat;
    border: 0;
    height: 40px;
    width: 210px;
}

#body #module-headers{
    width: 100%;
    color: #8f8f8f;
    margin-top: 15px;
    height: 30px;
    margin: 0 0 15px 173px;
}

#body #level{
    width: 40px;
    float: left;
}

#body #course-name{
    width: 230px;
    float: left;
}

#body #pro-curriculum{
    width: 135px;
    float: left;
}

#body #date-rate{
    width: 125px;
    float: left;
}

#body div.module{
	height: 61px;
	width: 631px;
	margin: 0 auto 15px auto ;
	padding: 0;
	background: url(../images/module-bg.png) top center no-repeat;
}

#body div.module > div.module-content{
	padding: 6px 5px 5px 5px;
	height: 50px;
	width: 621px;
}

#body div.module > div.module-content > a.play-button{
	display: block;
	height: 50px;
	width: 50px;
	background: url(../images/member-portal-play-sprite.png) -3px -53px no-repeat;
	float: left;
	border: 0
}
#body div.module > div.module-content > a.play-button:hover{
	display: block;
	height: 50px;
	width: 50px;
	background: url(../images/member-portal-play-sprite.png) -3px -2px no-repeat;
	float: left;
}
#body div.module > div.module-content > a.play-button > span{ display: none; }

#body div.module > div.module-content > div.grade{
	width: 60px;
	text-align: center;
	font-family: georgia, serif;
	color: #82d209;
	float: left;
	line-height: 50px;
	vertical-align: middle;
	height: 100%;
}

#body div.module > div.module-content > div.grade > .grade-top-row{
    width: 100%;
    float: left;
    height: 66%;
}

#body div.module > div.module-content > div.grade > .grade-bottom-row{
    width: 100%;
    float: left;
    height: 33%;
}

#body div.module > div.module-content > div.double-row{
	float: left;
	height: 50px;
	width: 460px;
	color: #fff;
}

#body div.module > div.module-content > div.double-row > div.row{
	height: 18px;
	width: 100%;
	float: left;
	padding-top: 4px;
    overflow: hidden;
}

#body div.module > div.module-content > div.double-row > div.row > div.left-col{
	float: left;
	height: 100%;
	width: 227px;
    padding-right: 3px;
}

#body div.module > div.module-content > div.double-row > div.row > div.mid-col{
	float: left;
	height: 100%;
	width: 135px;
}

#body div.module > div.module-content > div.double-row > div.row > div.right-col{
	float: left;
	height: 100%;
	width: 90px;
    text-align: right;
}

#body div.module > div.module-content > div.double-row > div.row > div.right-col > span.stars{
	display: block;
	height: 14px;
	width: 100%;
	margin: 0;
	padding: 0;
	background: url(../images/star-rating-sprite.png) no-repeat;
}
#body div.module > div.module-content > div.double-row > div.row > div.right-col > span.no-star{ background-position: -6px -155px; }
#body div.module > div.module-content > div.double-row > div.row > div.right-col > span.half-star{ background-position: -6px -140px; }
#body div.module > div.module-content > div.double-row > div.row > div.right-col > span.one-star{ background-position: -6px -124px; }
#body div.module > div.module-content > div.double-row > div.row > div.right-col > span.onehalf-star{ background-position: -6px -110px; }
#body div.module > div.module-content > div.double-row > div.row > div.right-col > span.two-star{ background-position: -6px -95px; }
#body div.module > div.module-content > div.double-row > div.row > div.right-col > span.twohalf-star{ background-position: -6px -80px; }
#body div.module > div.module-content > div.double-row > div.row > div.right-col > span.three-star{ background-position: -6px -64px; }
#body div.module > div.module-content > div.double-row > div.row > div.right-col > span.threehalf-star{ background-position: -6px -49px; }
#body div.module > div.module-content > div.double-row > div.row > div.right-col > span.four-star{ background-position: -6px -34px; }
#body div.module > div.module-content > div.double-row > div.row > div.right-col > span.fourhalf-star{ background-position: -6px -19px; }
#body div.module > div.module-content > div.double-row > div.row > div.right-col > span.five-star{ background-position: -6px -4px; }

#body div.module > div.module-content > img.pro-photo{
    float: right;
    cursor: pointer;
}

#body #module-headers{
    width: 100%;
    color: #8f8f8f;
    margin-top: 15px;
    height: 20px;
}

#body #level{
    width: 40px;
    float: left;
}

#body #course-name{
    width: 230px;
    float: left;
}

#body #pro-curriculum{
    width: 135px;
    float: left;
}

#body #date-rate{
    width: 125px;
    float: left;
}

#body .difficulty{
    height: 31px;
    width: 50px;
    background: url(../images/difficulty-stars-sprite.png) top center no-repeat;
    border: 0;
    margin: 0;
    padding: 0;
    float: left;
    margin-top: 7px;
}

#body .level-1{ background-position: 8px -1px; }
#body .level-2{ background-position: 8px -34px; }
#body .level-3{ background-position: 8px -65px; }
#body .level-4{ background-position: 8px -95px; }
#body .level-5{ background-position: 8px -127px; }
/*** END: body styles ***/

/*** BEGIN: footer styles ***/
#footer{
	margin: 0;
	padding: 0;
	width: 100%;
	background: url(../images/red_tile.png) 0 0 repeat;
	height: 280px;
	overflow: visible;
}

.callout_button{
	color:#FFD66A;
	float:right;
	padding:2px;
	width:180px;
	font-size:12px;
	text-transform:uppercase;
	margin-top:20px;
	text-align:right;
}

.callout_button a{
	text-decoration:none;
	color:#FFD66A;
}

.callout_button a:hover{
	color:#AE322A;
	text-decoration:none;
}

.callout_left_image{
	float:left;
	/*width:102px;
	height:80px;*/
	/*border: solid 1px #000;*/
	margin-top:15px;
}

.callout_right_text{
	/*float:right;*/
	width:100%;
	color:#FFF;
}

.callout{
	width:287px;
	height:250px;
	margin-left:7px;
	float:left;
	/*background-image:url(../../images/callout_bg_tile.png);
	background-repeat:repeat;*/
	padding-left:15px;
	padding-right:15px;
}

.footer{ padding-top: 20px; }

.footer a{
	color:#fff;
	text-decoration:none;
	text-transform:capitalize;
}
.footer a:hover{
	color:#FFD66A;
	text-decoration:none;
	text-transform:capitalize;
}
/*** END: footer styles ***/

#bio-tip{
	background: url(../images/black_arrow_big.png) top center no-repeat;
	height: 156px;
	width: 310px;
	overflow: hidden;
	padding: 30px;
	display: none;
	z-index: 1000; /* keep tip on top of accordion where necessary, works because positioning is set by script */
}

#bio-tip.bottom{
	background: url(../images/black_arrow_big_down.png) top center no-repeat;
	padding-top: 50px;
	height: 136;
}
