/*************************************************************
General Colors
*************************************************************/
.green {color: #6EBB21}
.orange {color: #FF850C}
.blue {color: #1C5598}
.dark_blue {color: #052F57}
.light_blue {color: #4FB0D1}
.purple {color: #773688}
.teal {color: #31A498}
.red {color: #F90100}
.white {color: #FFFFFF}
.gray {color: #616264} 
 

/*************************************************************
Main Styles
*************************************************************/

body
	{
	margin: 0;
	border: 0;
	padding: 0;
	background: #052F57;
	font: 11px Arial, Helvetica, sans-serif;
	line-height: 1.5em;
	}
	
p
	{
	margin: 0;
	padding: 5px 0 5px 0;
	font: 11px Arial, Helvetica, sans-serif;
	color: #616264; 
	}

h1
	{
	margin: 0;
	padding: 0 0 5px 0;
	border: 0;
	font: bold 16px Arial, Helvetica, sans-serif;
	}
	
h2
	{
	margin: 0;
	padding: 5px 0 0 0;
	border: 0;
	font: 13px Arial, Helvetica, sans-serif;
	}

h3
	{
	margin: 0;
	padding: 0;
	border: 0;
	font: bold 11px Arial, Helvetica, sans-serif;
	}

h4
	{
	margin: 0;
	padding: 0;
	border: 0;
	font: bold 12px Arial, Helvetica, sans-serif;
	}

h5
	{
	margin: 0;
	padding: 0;
	border: 0;
	font: bold 20px Arial, Helvetica, sans-serif;
	}


ul
	{
	float: left;
	margin: 0;
	padding: 0;
	border: 0;
	list-style: none;
	line-height: 1.25em;
	}
	
li
	{
	margin: 2px 0 5px 0;
	padding: 0 0 0 12px;
	border: 0;
	background-image: url(../images/bullet_gray.gif);
	background-repeat: no-repeat;
	background-position: .1em .5em !important;/*(first # controls horz, second # controls vert)*/
	background-position: .1em .45em;/*(first # controls horz, second # controls vert)*/
	}
	
img
	{
	margin: 0;
	border: 0;
	padding: 0;
	}

a
	{
	color: #000000;
	text-decoration: none;
	}

a:hover
	{
	color: #616264;
	text-decoration: none;
	}

.clear
	{ 
  	clear:both; 
	/*** these next attributes are designed to keep the div 
	height to 0 pixels high, critical for Safari and Netscape 7 ***/ 
	  height:1px; 
	  overflow:hidden; 
	  line-height:1%; 
	  font-size:0px; 
	  margin-bottom:-1px; 
	}

/*************************************************************
Buttons
*************************************************************/

a.blue_btn
	{
	float: right;
	margin: 5px 0 0 0;
	padding: 0 0 0 19px;
	border:0 ;
	height: 15px;
	color: #ffffff;
	background-image: url(../images/btn_squ_blue.gif);
	background-repeat: no-repeat;
	background-position: 1em .3em !important;/*(first # controls horz, second # controls vert)*/
	background-position: 1em .4em /*(first # controls horz, second # controls vert)*/

	}

a:hover.blue_btn
	{
	color: #135794;
	}

a.light_blue_btn
	{
	float: right;
	margin: 5px 0 0 0;
	padding: 0 0 0 19px;
	border:0 ;
	height: 15px;
	color: #ffffff;
	background-image: url(../images/btn_squ_lt_blue.gif);
	background-repeat: no-repeat;
	background-position: 1em .3em !important;/*(first # controls horz, second # controls vert)*/
	background-position: 1em .4em /*(first # controls horz, second # controls vert)*/

	}

a:hover.light_blue_btn
	{
	color: #4FB0D1;
	}

a.dark_blue_btn
	{
	float: right;
	margin: 5px 0 0 0;
	padding: 0 0 0 19px;
	border:0 ;
	height: 15px;
	color: #ffffff;
	background-image: url(../images/btn_squ_dk_blue.gif);
	background-repeat: no-repeat;
	background-position: 1em .3em !important;/*(first # controls horz, second # controls vert)*/
	background-position: 1em .4em /*(first # controls horz, second # controls vert)*/

	}

a:hover.dark_blue_btn
	{
	color: #052F57;
	}

a.orange_btn
	{
	float: right;
	margin: 5px 0 0 0;
	padding: 0 0 0 19px;
	border:0 ;
	height: 15px;
	color: #616264;
	background-image: url(../images/btn_squ_orange.gif);
	background-repeat: no-repeat;
	background-position: 1em .3em !important;/*(first # controls horz, second # controls vert)*/
	background-position: 1em .4em /*(first # controls horz, second # controls vert)*/

	}

a:hover.orange_btn
	{
	color: #FF850C;
	}

a.purple_btn
	{
	float: right;
	margin: 5px 0 0 0;
	padding: 0 0 0 19px;
	border:0 ;
	height: 15px;
	color: #616264;
	background-image: url(../images/btn_squ_purple.gif);
	background-repeat: no-repeat;
	background-position: 1em .3em !important;/*(first # controls horz, second # controls vert)*/
	background-position: 1em .4em /*(first # controls horz, second # controls vert)*/

	}

a:hover.purple_btn
	{
	color: #773688;
	}

a.green_btn
	{
	float: right;
	margin: 5px 0 0 0;
	padding: 0 0 0 19px;
	border:0 ;
	height: 15px;
	color: #616264;
	background-image: url(../images/btn_squ_green.gif);
	background-repeat: no-repeat;
	background-position: 1em .3em !important;/*(first # controls horz, second # controls vert)*/
	background-position: 1em .4em /*(first # controls horz, second # controls vert)*/

	}

a:hover.green_btn
	{
	color: #6EBB21;
	}

a.red_btn
	{
	float: right;
	margin: 5px 0 0 0;
	padding: 0 0 0 19px;
	border:0 ;
	height: 15px;
	color: #616264;
	background-image: url(../images/btn_squ_red.gif);
	background-repeat: no-repeat;
	background-position: 1em .3em !important;/*(first # controls horz, second # controls vert)*/
	background-position: 1em .4em /*(first # controls horz, second # controls vert)*/

	}

a:hover.red_btn
	{
	color: #F90100;
	}

a.teal_btn
	{
	float: right;
	margin: 5px 0 0 0;
	padding: 0 0 0 19px;
	border:0 ;
	height: 15px;
	color: #616264;
	background-image: url(../images/btn_squ_teal.gif);
	background-repeat: no-repeat;
	background-position: 1em .3em !important;/*(first # controls horz, second # controls vert)*/
	background-position: 1em .4em /*(first # controls horz, second # controls vert)*/

	}

a:hover.teal_btn
	{
	color: #31A498;
	}


/*************************************************************
Table Syles
*************************************************************/


table
	{
	width: 95%;
	border-collapse: collapse;
	margin: 0;
	}

td, th
	{
	text-align: left;
	margin: 0;
	padding: 5px 0 5px 0;
	border: none;
	font: 12px Arial, Helvetica, sans-serif;
	}

table input, td input
	{
	margin: 0;
	padding: 1px 2px 1px 2px;
	border: 0px solid #dcdcdc;
	background: url(../images/input_bkg_light.gif) top left repeat-x;
	font: 11px Arial, Helvetica, sans-serif;
	}
/*************************************************************
General Form Syles
*************************************************************/

form
	{
	margin: 0;
	padding: 0;
	}

input
	{
	margin: 2px 0 0 0;
	padding: 1px 2px 1px 2px;
	border: 1px solid #dcdcdc;
	background: url(../images/input_bkg_light.gif) top left repeat-x;
	font: 11px Arial, Helvetica, sans-serif;
	}

textarea
	{
	margin: 2px 0 0 0;
	padding: 1px 2px 1px 2px;
	border: 1px solid #dcdcdc;
	background: url(../images/input_bkg_light.gif) top left repeat-x;
	font: 11px Arial, Helvetica, sans-serif;
	overflow: auto;
	}

select
	{
	margin: 2px 0 0 0;
	padding: 1px 2px 1px 2px;
	border: 1px solid #dcdcdc;
	font: 11px Arial, Helvetica, sans-serif;
	}

.button
	{
	margin: 0;
	padding: 2px 2px 2px 2px;
	border: 1px solid #dcdcdc;
	font: 11px Arial, Helvetica, sans-serif;
	}

/*************************************************************
Contain
*************************************************************/

#contain
	{
	margin: 0 auto;
	padding: 0;
	border: 0;
	width: 968px;
	background: #F2F2F2;
	}

/*************************************************************
Header
*************************************************************/

#header
	{
	margin: 0;
	padding: 0;
	border-top: 4px solid #6EBB21;
	width: 968px;
	height: 18px;
	background: url(../images/header_dash.gif) top left repeat-x;
	}


/*************************************************************
Left Column - holds logo, nav, and student login
*************************************************************/

#left
	{
	float: left;
	margin: 0 0 0 16px !important;
	margin: 0 0 0 8px;
	padding: 0;
	border: 0;
	width: 180px;
	}

#left .student_login
	{
	margin: 18px 0 0 0;
	padding: 0;
	border: 0px solid #ffffff;
	background: #888888;
	width: 145px;
	}

#left form
	{
	margin: 0 0 0 9px;
	padding: 0;
	}

#left input
	{
	margin: 2px 0 0 0;
	padding: 1px 2px 1px 2px;
	border: none;
	background: url(../images/input_bkg.gif) top left repeat-x;
	font: 11px Arial, Helvetica, sans-serif;
	}

#left h1
	{
	margin: 7px 9px 0 9px;
	padding: 0;
	border: 0;
	font: 11px Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	color: #ffffff;
	text-align: center;
	background: url(../images/login_dash.gif) left bottom repeat-x;
	height: 19px;
	}

#left p
	{
	margin: 0;
	padding: 8px 0 0 0;
	border: 0;
	color: #ffffff;
	}

#left a.blue_btn_ko
	{
	float: right;
	margin: 5px 9px 4px 0;
	padding: 0 0 0 19px;
	border:0 ;
	height: 18px;
	color: #ffffff;
	background-image: url(../images/btn_squ_blue.gif);
	background-repeat: no-repeat;
	background-position: 1em .3em !important;/*(first # controls horz, second # controls vert)*/
	background-position: 1em .4em /*(first # controls horz, second # controls vert)*/

	}

#left a:hover.blue_btn_ko
	{
	color: #135794;
	}
	

/*************************************************************
Navigation (Main)
*************************************************************/

#left .nav
	{
	margin: 6px 0 0 0;
	padding: 8px 0 0 0;
	border: 0;
	width: 161px;
	background: #ffffff;
	}

#left .nav a.nav_on 
	{
	float: left;
	margin: 0;
	padding: 8px 0 0 0;
	border: 0;
	background: #6EBB21;
	border-left: 8px solid #ffffff;
	border-right: 8px solid #ffffff;
	width: 145px;
	text-transform: uppercase;  
	}

#left .nav a:hover.nav_on 
	{
	text-decoration: none;
	background: #6EBB21;
	}

#left .nav a.nav_on p
	{
	margin: 0 8px 7px 8px;
	padding: 0 0 7px 0;
	border-bottom: 1px dashed #ffffff;
	text-align: center;
	}

#left .nav .nav_on_bottom 
	{
	margin: 0;
	padding: 0;
	border: 0;
	background: #ffffff;
	height: 8px;
	}
	
#left .nav a.sub_nav 
	{
	clear: both;
	display: block;	
	margin: 0;
	padding: 0 0 3px 20px;
	border: 0;
	background: #6EBB21;
	border-left: 8px solid #ffffff;
	border-right: 8px solid #ffffff;
	font: 10px Arial, Helvetica, sans-serif;
	text-transform: none;
	color: #ffffff;
	text-align: left;
	background-image: url(../images/bullet_white.gif);
	background-repeat: no-repeat;
	background-position: 1em .5em !important;/*(first # controls horz, second # controls vert)*/
	background-position: 1.75em .5em;/*(first # controls horz, second # controls vert)*/
	}

#left .nav a:hover.sub_nav 
	{
	text-transform: none;
	color: #052F57;
	text-decoration: none;
	background-image: url(../images/bullet_dk_blue.gif);
	background-repeat: no-repeat;
	background-position: 1em .5em !important;/*(first # controls horz, second # controls vert)*/
	background-position: 1.75em .5em;/*(first # controls horz, second # controls vert)*/	
	}

#left .nav a.sub_nav_on 
	{
	clear: both;
	display: block;	
	margin: 0;
	padding: 0 0 3px 20px;
	border: 0;
	background: #6EBB21;
	border-left: 8px solid #ffffff;
	border-right: 8px solid #ffffff;
	font: 10px Arial, Helvetica, sans-serif;
	text-transform: none;
	color: #052F57;
	text-align: left;
	background-image: url(../images/bullet_dk_blue.gif);
	background-repeat: no-repeat;
	background-position: 1em .5em !important;/*(first # controls horz, second # controls vert)*/
	background-position: 1.75em .5em;/*(first # controls horz, second # controls vert)*/
	}

#left .nav a:hover.sub_nav_on 
	{
	color: #052F57;
	background-image: url(../images/bullet_dk_blue.gif);
	background-repeat: no-repeat;
	background-position: 1em .5em !important;/*(first # controls horz, second # controls vert)*/
	background-position: 1.75em .5em;/*(first # controls horz, second # controls vert)*/
	}
	
#left .nav a.nav_green 
	{ 
  	float: left;
 	margin: 0;
 	padding: 0;
	border-bottom: 8px solid #ffffff;
	border-left: 8px solid #ffffff;
	border-right: 8px solid #ffffff;
	width: 145px;  
	background-color: #6EBB21;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	font: 12px Arial, sans-serif;
	color: #ffffff;
	}

#left .nav a:hover.nav_green 
	{   
	background: #6EBB21 url(../images/grad_green.gif) bottom left repeat-x;
	}

#left .nav a.nav_green p
	{ 
	margin: 0;
	padding: 9px 0 9px 0;  
	}


/*************************************************************
Aux Navigation
*************************************************************/

#aux_nav
	{
	float: right;
	margin: 0 20px 9px 0 !important;
	margin: 0 10px 9px 0;
	padding: 0;
	border: 0;
	width: 650px;
	font-size: 10px;
	color: #616264; 
	text-align: right;
	}

#aux_nav a
	{
	margin: 0;
	padding: 0 3px 0 3px;
	text-transform: uppercase;
	color: #616264; 
	text-decoration: none;
	}

#aux_nav a:hover
	{
	text-decoration: none;
	color: #052F57; 
	}

/*************************************************************
Content
*************************************************************/

#content
	{
	float: left;
	margin: 0;
	padding: 0;
	border: 0;
	width: 578px;
	}

.content_header
	{
	margin: 0;
	padding: 0;
	border: 3px solid #ffffff;
	width: 572px;
	background: #ffffff;
	}
	
.content_header .color_box
	{
	float: left;
	margin: 3px 0 0 0;
	padding: 8px 8px 8px 10px;
	border: 3px solid #062F57;
	width: 548px;
	background: #4FB0D1;
	color: #ffffff;
	}

.content_header .color_box img
	{
	float: left;
	margin: 0;
	padding: 0;
	border: 0;
	}

.content_header p
	{
	margin: 0;
	padding: 0;
	border: 0;
	}

.content_header a
	{
	text-decoration: none;
	color: #052F57;
	}

.content_header a:hover
	{
	text-decoration: none;
	color: #ffffff;
	} 
	
.content_header ul
	{
	float: left;
	margin: 0;
	padding: 0;
	border: 0;
	list-style: none;
	width: 276px;
	}
	
.content_header li
	{
	margin: 2px 0 2px 0;
	padding: 0 0 0 12px;
	border: 0;
	background-image: url(../images/bullet_lt_blue.gif);
	background-repeat: no-repeat;
	background-position: .1em .5em !important;/*(first # controls horz, second # controls vert)*/
	background-position: .1em .45em;/*(first # controls horz, second # controls vert)*/
	}

.content_left
	{
	float: left;
	margin: 8px 0 0 0;
	padding: 8px 8px 0 8px;
	border:0;
	width: 308px;
	background: #ffffff;
	}
	
.callout_empty
	{
	margin: 0 0 8px 0;
	padding: 8px;
	border: 0;
	background: #ffffff;
	}

.callout_map_bkg
	{
	margin: 0 0 8px 0;
	padding: 0;
	border: 0;
	background: #ffffff url(../images/maps/saudiArabia.gif) right bottom no-repeat; /*change image here to use a different country*/
	}

.callout_icon_bkg
	{
	margin: 0 0 8px 0;
	padding: 8px;
	border: 0;
	background: #ffffff url(../images/phone_icon.gif) right center no-repeat; /*change image here to use a different icon*/
	}

.callout_frame
	{
	margin: 0 0 8px 0;
	padding: 0px;
	border: 0px dashed #888888;
	width: 94%;
	}

.callout_frame_gradient
	{
	margin: 0 0 8px 0;
	padding: 8px;
	border: 0px dashed #888888;
	width: 94%;
	background: url(../images/callout_gradient.gif) left bottom repeat-x;
	}
	
.callout_color_tint
	{
	margin: 0;
	padding: 0 0 0 4px;
	border: 0;
	background-color: #FFF5EC;
	}

.content_right
	{
	float: right;
	margin: 8px 0 0 0;
	padding: 8px 8px 0 8px;
	border:0;
	width: 229px;
	background: #ffffff;
	}

.content_right .paper_headline
	{
	margin: 0;
	padding: 0 10px 0 0;
	border: 0;
	filter: alpha(opacity=50); -moz-opacity:.50; opacity:.50;
	color: #ffffff;
	font: 37px Arial, Helvetica, sans-serif;
	line-height: 37px;
	}

.content_right .dashed_line
	{
	margin: 10px 10px 0 10px;
	padding: 0;
	border: 0;
	height: 3px;
	width: 210px;
	background: url(../images/white_dash_horz.gif) left top repeat-x;
	}
	
.content_right p
	{
	margin: 0;
	padding: 15px 10px 0 10px;
	border: 0;
	color: #ffffff;
	}

.content_right h6
	{
	margin: 0;
	padding: 15px 10px 0 10px;
	border: 0;
	font: 15px Arial, Helvetica, sans-serif;
	color: #ffffff;
	}

.content_right .paper_callout
	{
	margin: 0 0 8px 0;
	padding: 0 0 8px 0 !important;
	padding: 0 0 0 0;
	border:0;
	width: 230px;
	height: 230px;
	background: #31A498 url(../images/paper_callouts/paper_callout_teal.gif) top left no-repeat; /*(change the image and color here to change the callout's background)*/
	color: #ffffff;
	}
	
	
/*************************************************************
Callouts Column
*************************************************************/

#callouts
	{
	float: right;
	margin: 0 16px 0 0 !important;
	margin: 0 8px 0 0;
	padding: 0;
	border: 0;
	width: 168px;
	}

#callouts ul
	{
	width: 140px !important;
	width: 130px;
	}

#callouts .callout_frame
	{
	margin: 0;
	padding: 8px;
	border: 0px dashed #888888;
	width: 88%;
	}

#callouts .callout_frame_gradient
	{
	margin: 0;
	padding: 8px;
	border: 0px dashed #888888;
	width: 88%;
	background: url(../images/callout_gradient.gif) left bottom repeat-x;
	}
	
#callouts .callout_color_tint
	{
	margin: 0;
	padding: 0 0 0 4px;
	border: 0;
	background-color: #FFF5EC; 
	}

#callouts .callout_map_bkg
	{
	margin: 0 0 8px 0;
	padding: 8px;
	border: 0;
	background: #ffffff url(../images/maps/SaudiArabia.gif) right bottom no-repeat; /*change image here to use a different country*/
	}

/*************************************************************
Callouts w/ Paper at the top
*************************************************************/

#callouts .callout_frame_paper
	{
	z-index: 2;
	position: relative;
	margin: 0;
	padding: 8px;
	border: 0px dashed #888888;
	width: 88%;
	}
	
#callouts .callout_frame_paper h1
	{
	z-index: 1;
	position: relative;
	margin: -14px -15px 0 0;
	padding: 13px 0 0 0;
	border: 0;
	height: 45px;
	background: url(../images/callout_headers/header_orange.gif) top right no-repeat; /*(change the image here to change the paper's color)*/ 
	}


/*************************************************************
Content Footer - dashed line running below content/callouts
*************************************************************/

#content_footer
	{
	clear: both;
	float: left;
	margin: 15px 0 0 197px !important;
	margin: 15px 0 0 99px;
	padding: 0;
	border: 0;
	width: 755px;
	height: 10px;
	background: url(../images/gray_dash_horz.gif) left top repeat-x;
	}

/*************************************************************
Footer
*************************************************************/

#footer
	{
	clear: both;
	float: left;
	margin: 0 0 7px 0;
	padding: 0;
	border: 0;
	width: 968px;
	font-size: 10px;
	text-transform: uppercase;
	color: #616264;
	}

#footer .footer_nav
	{
	float: right;
	margin: 0 20px 0 0 !important;
	margin: -5px 10px 0 0;
	padding: 0;
	border: 0;
	width: 450px;
	text-align: right;
	}

#footer .copyright
	{
	float: left;
	margin: 0 0 0 197px !important;
	margin: -5px 0 0 99px;	
	padding: 0;
	border: 0;
	width: 150px;
	}

#footer a
	{
	margin: 0;
	padding: 0 3px 0 3px;
	color: #616264; 
	text-decoration: none;
	}

#footer a:hover
	{
	text-decoration: none;
	color: #052F57; 
	}