/* 
    Document   : style
    Created on : Jul 2, 2009, 9:12:49 AM
    Author     : Fred Jiles
    Description:
        Purpose of the stylesheet follows.
*/



*{
    margin:0;
    padding:0;
}

body{
    font-size:14px;
    font-family:Helvetica, Arial, sans-serif;
    background:#999999;
}


img{
    border:none;
}

p{
    margin:7px 0;
    line-height:130%;
}
  

ol{
    margin-left:15px;
}
.left{
    float:left;
}

.right{
    float:right;
}

.clear{
    clear:both;
}

/* ------ Layout ----- */
#page_wrapper{
    width:910px;
    margin:0 auto;
    background:url(../images/wrapper_bg.jpg) repeat;
    
}
#page{
    width:901px;
    background:#ffffff;
    
}
#header{
    background:url(../images/logo.jpg) no-repeat #ffffff;
    height:140px;
    border-bottom:2px solid #03325d;
}

#content{
   
    border-bottom:1px solid #9f9f9f;
}
#footer{
   
    text-align:center;
    padding:10px;
    color:#9f9f9f;
}
#footer p ,#footer a{
    
    color:#9f9f9f;
}
#footer ul#footer_nav {
	margin:0 auto;
}
#footer ul#footer_nav li {
    margin-left:5px;
	display:inline;
	list-style:none;
	border-right:1px solid #9f9f9f;
	padding-right:5px;
	
}
#footer ul#footer_nav li:last-child {
	border-right: none;
}
#top_nav{
    float:right;
    margin:10px 15px 0 0;
}
#top_nav, #top_nav a{
    color:#00529c;
    font-size:12px;
}
#toolbar{
    clear:both;
    float:right;
    height:20px;
    
    margin:50px 15px 15px 0 ;
}
#toolbar a   {
   
   display:block;
   float:left;
   margin-left:10px;
   margin-right:5px;
   padding-left:5px;
}

#main_nav {
    clear:both;
}


#nav, #nav ul { /* all lists */
		list-style:none;
		padding:0;
		margin-left:5px;
        float:right;
		
	}

#nav a {
    background:url(../images/nav_bg.jpg);
    font-size:12px;
    display:block;
    height:30px;
    
    line-height:30px;
    color:#ffffff;
    font-weight:bold;
    padding:0 10px;
    border-right:1px solid #5a0631;
    border-left:1px solid #820344;
	text-decoration:none;
}

#nav a:hover, #nav a.current {
	background:url(../images/current_nav_bg.jpg);
	}
#nav li { /* all list items */
		line-height:12px;
		float:left;
		position:relative;
		z-index:100;
		/*padding:3px;*/
}
#nav li ul { /* second-level lists */
		position: absolute;
		left:0;
		top:30px;
		margin:0 0 0 0;
		padding:2px 0;
		display:none;
		float:none;
		background:url(../images/drop_down_bg.jpg) repeat #dedcdc;
		border:2px solid #03325d;
		z-index:1000;
		width:192px;
		
                
               
}
#nav li ul li {
		float:none;
		margin:0;
		padding:0;
                
               
}

#nav li ul li a {
		margin:0;
		
		font-size:12px;
		width:175px;
		display:block;
		color:#00529c;
        background:url(../images/drop_down_divider.jpg) bottom left no-repeat;
        border:none;
}

#nav li ul li a:hover {
       
	color:#FFF;
       
}

#nav li:hover ul, #nav li.sfhover ul { /* lists nested under hovered list items */
		display:block;
}


#bottom{
    margin:0 auto 10px auto;
    width:910px;
    height:7px;
    background:url(../images/shadows.jpg) no-repeat;
}

/*--------------------------- Content --------------------*/
#subNav{
	float:left;
	width:150px;
	
	height:100%;
}
ul.subNav{
	list-style:none;
	
}
#subNav ul li{
	margin:5px;
	list-style:none;
}
ul.subNav a{
	text-decoration:none;
	color:#000;
}
#content{
    padding:10px;
	overflow:hidden;
}
#content.home{
    padding:0 0 10px 0;
}
h2.title{
    color:#03325d;
    margin:5px;
	font-size:30px;
	letter-spacing: 1.2px;
	
}
#contentMain{
	float:left;
	padding-left:15px;
	width:711px;
	border-left:1px solid #9F9F9F;
	min-height:200px;

}
#contentMain img.occImage {
	margin:10px;
}
#contentMain ul {
	margin-left:15px;
}
#contentMain li{
	margin-left:10px;
	margin-bottom:5px;
}


div.breadcrumbs{
	
	
	font-size:10px;
}
a.letter, a.next, a.back{
	border:1px solid #A3054F;
	padding:5px;
	font-size:14px;
	float:left;
	display:block;
	margin:10px 2px;
	color:#000;
	text-decoration: none;
}
a.next{
	float:right;
	
}
a.next:hover, a.back:hover{
	text-decoration: underline;
}
a.letter:hover{
	text-decoration:underline;
	background:#A3054F;
	color:#fff;
}
a.selected {
	background:#A3054F;
	color:#fff;
}
h2.letter{
	clear:left;
	font-size:30px;
	color:#00539C;
	border-bottom:1px solid #9F9F9F;
	
}

h3.groupHead{
	font-size:14px;
	padding:2px;
	background:#00539C;
	margin:5px 0;
	color:#fff;
	
}
h3.groupHead a{
	color:#fff;
	text-decoration:none;
}
h3.groupHead a:hover{
	
	text-decoration:underline;

}
/**************** Career rating ********************/

span.ed,span.salary{
	width:25px;
	height:26px;
	background:url(../images/ed_rate.jpg) #fff repeat-x;
	display:block;
	float:left;
	margin-right:5px;
}
span.salary{
	
	background:url(../images/dollar.jpg) #fff repeat-x;
}
span.rate2{
	width:50px;
}
span.rate3{
	width:75px;
}
span.rate4{
	width:100px;
}
span.rate5{
	width:125px;
}
span.rate6{
	width: 150px;
}
ul.careerList li{
	list-style:none;
	margin:2px 15px;

	
}
ul.careerList li a{
	color:#000;


}
table.careerStats{
	width:100%;
	border:1px solid #00539C;
	border-collapse: collapse;
	margin:0 auto;
}
table.careerStats td{
	line-height:26px;
	border-top:1px solid #00539C;
}
table.careerStats td.stat{
	padding-left:10px;
}
table.careerStats td.heading{
	font-size:14px;
	padding:4px;
	background:#00539C;
	font-weight:bold;
	color:#fff;
	
	text-align:right;
	width:150px;
	height:26px;
}
table.careerStats tr.first td{
	border-top:none;
}
#indexCareerData td.heading{
	font-size:12px;
	padding:4px;
	background:#00539C;
	font-weight:bold;
	color:#fff;

	text-align:right;
	width:100px;
	height:26px;
}
#indexCareerData td{
	line-height:100%;
	font-size:10px;
	border-top:1px solid #00539C;
}
h5.resourceName{
	font-size:14px;
	margin-top:10px;
}
ul.resources{
	margin:5px;
	
}
ul.resources li{
	margin-left:10px;
}
ul.resources li a{
	font-size:12px;
}
div.detailGroup{
	margin:15px;
}
/**************** Occupations page **********/
div#occupation_info{
	float:left;
	width:420px;
	
	padding-right:15px;
}
div#careers{
	float:left;
	width:220px;
	background:#00539C;
	color:#fff;
	padding:15px;
}

div#careers a{
	color:#fff;
	font-size:12px;
}
div#careers h4{
	font-size:16px;
}
p#emailSignup{
	
	padding:5px;
	font-style: italic;
	font-size:12px;
}
/*********** Career Centers ******************/
dl.career_center dt {
	clear:both;
	float:left;
	font-size:14px;
	font-weight:bold;
	margin:10px;
}
dl.career_center dd {
	float:left;
	margin:10px;
}
/* --------------------------------- Messages ---------------------------------- */
div.form_errors {
	background: #ffcccc;
	padding: 10px 40px;
	color:#ff0000;
	min-height:50px;
        width:50%;
        min-width:300px;
        border:1px solid #ff0000;
}

div.form_errors h5{
    margin:0;
    margin-bottom:5px;
    padding:0;
    font-size:14px;
    color:#000000;
    

}
div.form_errors ul{
    margin:0 20px;




}
/* --------------------------- Add / Change Forms ------------------------------ */
form.change {  /* set width in form, not fieldset (still takes up more room w/ fieldset width */
  font: 14px arial,sans-serif;
  margin: 0;
  padding: 0;
  line-height: 16px;
}
form.change img{  /* set width in form, not fieldset (still takes up more room w/ fieldset width */
	border: 0;
	}
form.change :focus, form.dbsearch :focus {
		outline:1px #fbc200 solid;
		}

form.change fieldset {
  border-top:#CCCCCC 1px solid;
  border-bottom:#CCCCCC 1px solid;
  border-left:#CCCCCC 1px solid;
  border-right:#CCCCCC 1px solid;
  padding:10px;        /* padding in fieldset support spotty in IE */
  margin:10px;
}
form.change label {
	display: block;  /* block float the labels to left column, set a width */
	float: left;
	width: 125px;
 
	padding: 0;
	margin: 5px 15px 0 0; /* set top margin same as form input - textarea etc. elements */
	text-align: right;
	color:#333333; 
        font-size: 14px;
	line-height:14px;
}
form.change label.long{
	width:300px;
}
form.change fieldset legend {
	font-size: 12px; word-spacing: 1px; letter-spacing: 1px;
	font-weight: bold;
	color: #666666;
}

form.change br {
	clear:left;
}
form.change small {
	color: #FF0000; font-size: 10px;
	font-weight: normal;
}
form.change input, form.change  textarea, form.change select {
	border:  #999999 1px solid;
	margin-top:5px;
	background: #FFFFFF ;
        padding:2px;
	}
        

form.change input[type='checkbox']{
    width:20px;
    border:none;
    margin-left:15px;
}
form.change textarea{
	width:500px;
	height:150px;
}
form.change input[type='submit'] {
    width:auto;
    background:url(../images/current_nav_bg.jpg);
}
form.change input.submit{
    width:auto;
  background:url(../images/current_nav_bg.jpg);
   color:#ffffff;
    padding:3px;
    border:none;
    font-weight:bold;
    letter-spacing:1px;
    margin-left:125px;
    margin-top:15px;
    
}
form.change span.form_note {
	font-size:.8em;
	font-style:italic;
}

span.required{
    color:red;
}

form.change img.thumb{
    margin:5px;
}
form.change object{
    margin:5px;
}

/* wysiwyg editor */
form.change span.cke_skin_kama{
    float:left;
    margin:5px;
    
}
/****** Resources Form *****************/
span.element_description{
	display:block;
	margin-left: 125px;
	font-weight:bold;
	font-size:16px;
}
form.change input.resources{
	margin-left:125px;
}
form.change:first input.resources{
	margin:0;
}

/****************** Admin ******************/

a.adminBtn {
    background:url(../images/nav_bg.jpg);
    font-size:12px;
    display:block;
    height:30px;
    float:right;
    line-height:30px;
    color:#ffffff;
    font-weight:bold;
    padding:0 10px;
    border:1px solid #5a0631;
    border-width:1px 2px 1px 2px;
}
/***************** Admin Console ***************/
div.adminConsole{
	width:300px;
	float:left;
	margin:10px;
	
}
div.adminConsole h4 {
	background:#00529C;
	color:#fff;
	padding:2px;
}
div.adminConsole ul{
	margin:10px;
}
div.adminConsole ul li{
	margin-left:10px;
	margin-top:2px;
}
div.adminConsole a{
	color:#000;
}
/************************************* Admin List *********************************/

table.adminList{
    border:1px solid #000;
    padding:0;
    margin:10px auto;
    width:100%;

}
table.adminList th, table.adminList td {
    padding:2px;
    margin:0;
    border-collapse:collapse;
    text-align:left;
    border:1px solid #000;
}
table.adminList th{
    background:#000;
    color:#fff;
}
table.adminList tr.odd{
    background:#ddd;
}
table.adminList tr {
   margin:0;
   padding:0;
}
table.adminList a.edit, table.adminList a.delete, table.adminList a.up, table.adminList a.down{background:url(../images/add_del_up_down.png) no-repeat; padding-left:16px;}
table.adminList a.delete{background-position:0px -30px; margin-left:10px;}
table.adminList a.up {background-position:0px -60px; margin-left:10px;}
table.adminList a.down{background-position:0px -90px; margin-left:10px;}
td.stripe {background:#dcdcdc;}
td.hover {background:#fffacd;}
/********************************************** Flash Message ***************************/

#flashMessage { width:75%; padding:10px; border:solid 2px; margin:5px 0;}
 div.notice {background:#FFF6BF; color:#514721; border-color:#FFD324;}
div.success {background:#B0C4DE; color:#000000; border-color:#4682B4;}
div.default {background:#dcdcdc; color:#000000; border-color:#808080;}
div.error {background:#CD5C5C; color:#ffffff; border-color:#DC143C;}



/********************** Slider CSS ***************************/
#slider{
    border-bottom:4px solid #03325d;
    position:relative;
    width:100%;
    height:210px;
    background:#00529c;
    overflow:hidden;
}
#slider .wrapper                { width: 100%; overflow: auto; height: 210px; margin: 0;  position: absolute; top: 0; left: 0; }
#slider .wrapper ul             { width: 9999px; list-style: none; position: absolute; top: 0; left: 0; margin: 0;}
#slider ul li                   { display: block; float: left; padding: 0; height: 317px; width: 901px; margin: 0; }
#slider .arrow                  { display: none; height: 200px; width: 67px; background: url(../images/arrows.png) no-repeat 0 0; text-indent: -9999px; position: absolute; top: 65px; cursor: pointer; }
#slider .forward                { background-position: 0 0; right: -20px; }
#slider .back                   { background-position: -67px 0; left: -20px; }
#slider .forward:hover          { background-position: 0 -200px; }
#slider .back:hover             { background-position: -67px -200px; }

#thumbNav                               { position: relative; top: 210px; text-align:right; }
#thumbNav a                             { color: black; font: 11px/18px Georgia, Serif; display: inline-block; padding: 2px 8px; height: 18px; margin: 0 5px 0 0; background: #c58b04 url(../images/cellshade.png) repeat-x; text-align: center; -moz-border-radius-bottomleft: 5px; -moz-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; }
#thumbNav a:hover                       { background-image: none; }
#thumbNav a.cur                         { background: #e0a213; }


#start-stop                             { background: green; background-image: url(../images/cellshade.png); background-repeat: repeat-x; color: white; padding: 2px 5px; width: 40px; text-align: center; position: absolute; right: 45px; top: 323px; -moz-border-radius-bottomleft: 5px; -moz-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; }
#start-stop.playing                     { background-color: red; }
#start-stop:hover                       { background-image: none; }


.wrapper div p {float:left; width:500px; font-size:26px; color:#ffffff; font-weight:bold; margin:70px 0 0 20px;letter-spacing:1px;}
.wrapper div p span {font-size:36px;}
.wrapper div img {float:right; margin:3px 20px 0 0; border:2px solid #ccc;}




/*
  Prevents
*/
#slider .wrapper ul ul          { position: static; margin: 0; background: none; overflow: visible; width: auto; border: 0; }
#slider .wrapper ul ul li       { float: none; height: auto; width: auto; background: none; }

/************** Paginate ************************************************/
#paginate{
    padding:10px 0;
    float:left;
    
}
.paginate {

	font-size:1em;
        margin-top:15px;
}

a.paginate {
	border:1px solid #00539B;
	padding:2px 6px 2px 6px;
	text-decoration: none;
}


a.paginate:hover {
	background-color: #00539B;
	color:#FFF;
	text-decoration: underline;
}

a.current {
	border: 1px solid #00539B;
	font-weight: bold;
	padding:2px 6px 2px 6px;
	cursor: default;
	background:#00539B;
	color:#FFFFCC;
	text-decoration: none;
}

span.inactive {
	border:1px solid #999;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 1em;
	padding:2px 6px 2px 6px;
	color: #999;
	cursor: default;
}
/****************************************************** Uplodify ************************************/
.uploadifyQueueItem {
	font: 11px Verdana, Geneva, sans-serif;
	border: 2px solid #E5E5E5;
	background-color: #F5F5F5;
	margin-top: 5px;
	padding: 10px;
	width: 350px;
}
.uploadifyError {
	border: 2px solid #FBCBBC !important;
	background-color: #FDE5DD !important;
}
.uploadifyQueueItem .cancel {
	float: right;
}
.uploadifyProgress {
	background-color: #FFFFFF;
	border-top: 1px solid #808080;
	border-left: 1px solid #808080;
	border-right: 1px solid #C5C5C5;
	border-bottom: 1px solid #C5C5C5;
	margin-top: 10px;
	width: 100%;
}
.uploadifyProgressBar {
	background-color: #0099FF;
	width: 1px;
	height: 3px;
}

div.indexBlock{ width:30%; padding: 5px; float:left;margin:7px;}

div.indexBlock p.center{border-bottom:2px solid #A30059; font-weight:bold; font-size:12px; padding:5px;}

ul.careerData li { list-style:none; margin:5px;}

div.indexBlock a {font-size:12px; text-decoration:underline;}

div.indexBlock h4 {font-size:16px;}

ol#assessment-quiz p    {font-weight:bold;}

ul#current_links li span.delete {font-size:10px;text-decoration:underline;cursor:pointer;
                                margin-left:10px;}

/********************** Students ****************************/
table.matches{
	
	border:1px solid #9f9f9f;

}
table.matches th {
	background:#A3035B;
	color:#fff;
	padding:5px;
	text-align:left;
}
table.matches td{
	border-bottom:1px solid #9f9f9f;
	padding:5px;
}
table.careerCompare{
	width:100%;
	margin-top:10px;
	border: 1px solid #00539C;
	border-collapse: collapse;
}
table.careerCompare th{
	background:#00539C;
	font-weight:bold;
	color:#fff;
	text-align:left;
	padding:5px;
	font-size:16px;
}
table.careerCompare td{
	padding:5px;
	border-bottom: 1px solid #00539C;
}
/**************************** Quiz Styles *******************/
div.quizList{
	border-bottom: 1px solid #777;
}
div#featuredQuiz {
	border: 1px solid #00539C;
	margin:10px 0;
}
div#featuredQuiz h4{
	background: #00539C;
	color:#fff;
	font-size:16px;
	padding:2px 5px;
}
div.quizList div.quizDesc{
	margin:10px;
}
div.quizList h5{
	margin:5px;
}
div.quizList h5 a{
	font-size:16px;
	margin:5px;
}
div#featuredQuiz h5 a{
	font-size:16px;
	margin-top:10px;
	text-align: center;
}
div.correct,div.wrong{
	width:75%;
	margin:0 0 10px 0;
	padding:10px;
	border:2px solid;
}
div.correct {background:#B0C4DE; color:#000000; border-color:#4682B4;}

div.wrong {background:#990000; color:#ffffff; border-color:#DC143C;}

div.correct h3,div.wrong h3{
	font-size:20px;
}
div.correct h3 span,div.wrong h3 span{
	font-size:16px;
}
div.correct div{
	margin:10px;
}
a.answer{
	
	color:#000;
	
}
ol.quiz{
	margin-top:15px;
}
ol.quiz li{
	list-style: upper-alpha;
}

/******************************** Teachers ************************/
ul.lessons {
	margin:10px;
}
ul.lessons li {
	margin:10px;
	list-style:none;
	
}

div.lesson li{
	margin-left:30px;
	margin-bottom:5px;
}

form.quiz{
	border:1px solid #777;
	padding:10px;
	margin-top:15px;
	
}
form.quiz h3 {
	margin:10px 0 10px 0;
}