body 
{
    background: #000000 url('images/bg.png') repeat-x;
    padding: 0;
    margin: 0;
    font-family: Arial, Sans-Serif;
    font-size: 10pt;
}
a { color: #1790d5; }
#status 
{
    width: 980px; color: White; background: #000000;
    margin: auto; text-align: right; padding: 5px;
}
#status a { color: White; text-decoration: none; }
#header 
{
    background: url('images/head-bar.png') repeat-x;
    height: 74px;
}
#head-content 
{
    width: 990px; margin: auto;
}
#logo { float: left; width: 500px; }

/*ABRSM*/
#abrsm { float: right; width: 300px; color: White; }
#abrsm img { float: left; }
#abrsm div { padding-top: 10px; }
#abrsm a { color: White; }

#main 
{
    width: 990px; color: Black; margin: auto; padding: 0;
    background: #ffffff url('images/shad.png') repeat-x;   
    position: relative;  min-height: 400px;
	/*z-index: 1;*/
}
#main-content {
  padding-top: 20px;
  clear: both;
  width: 100%;
}
#images  { position: absolute; right: 0; top: 0; z-index: -1; }
.clear { clear: both; }

#benefits-tab { float: left; width: 56px; z-index: 10; margin-top: 10px; }
#benefits-content { float: left; width: 350px; margin-left: 10px; margin-top: 15px; z-index: 10; }
#benefits img { border: none; }
#benefits a
{
    position: relative;
    z-index: 100;
}
#actions { padding-left: 30px; }

#testimonial { clear: left; }
#testimonial-tab { float: left; width: 56px; margin-top: 10px; }
#testimonial-content { float: left; width: 350px; margin-top: 10px; }

/*Footer*/
#footer 
{
    width: 990px; color: Black; background: #ffffff; margin: auto;
    margin-bottom: 20px;
}
#footer a { color: Black; text-decoration: none; }
#footer-content 
{
    background: #abe2fc url('images/grad.png') repeat-x;
    height: 120px; border-top: solid 5px #071f2a;
}
#resources { float: left; width: 140px; padding-left: 10px;}
#resources img { border: none; margin-top: 5px; }
#follow-us { float: left; width: 245px; }
#get-in-touch { float: left; width: 245px;  margin-top: 5px; }

#follow-us .icon { float: left; width: 30px; margin-top: 5px;}
#follow-us .text { float: left; width: 210px; height: 24px; padding-top: 6px; padding-left: 4px; margin-top: 5px;}
#get-in-touch .icon { float: left; width: 40px; }
#get-in-touch .text { float: left; width: 200px; height: 35px; padding-top: 5px; padding-left: 4px;}

#footer-ad { background: white; height: 83px; padding: 10px 0 0 10px; }
#footer-ad img { float: left; border: none; margin: 0; padding: 0; }
#articles { float: left; width: 200px; height: 52px; padding: 10px; background-color: #b3cbcf;}

#foot-logo { width: 200px; float: right; margin: 5px 10px 0 0; }

/*Alternative Style*/
#images2  { position: absolute; left: 200px; top: 0; z-index: -1; }
#extra { position: absolute; right: 0; top: 0; width: 255px; height: 486px; background-color: #abe2fc; }
#extra a { color: Black; text-decoration: none; }
#resources-head2 { background-color: White; padding-left: 10px; }
#follow-us-head2 { background-color: White; padding-left: 10px; }
#get-in-touch-head2 { background-color: White; padding-left: 10px; }
#resources2 { padding-left: 5px; background: #abe2fc url('images/grad.png') repeat-x; height: 80px;}
#resources2 img { border: none; margin-top: 5px; }
#follow-us2 { padding-left: 5px; background: #abe2fc url('images/grad.png') repeat-x; height: 120px;}
#get-in-touch2 { padding: 10px 0 0 5px; background: #abe2fc url('images/grad.png') repeat-x; height: 120px;}

#follow-us2 .icon { float: left; width: 30px; margin-top: 5px;}
#follow-us2 .text { float: left; width: 215px; height: 24px; padding-top: 6px; padding-left: 4px; margin-top: 5px;}
#get-in-touch2 .icon { float: left; width: 40px; }
#get-in-touch2 .text { float: left; width: 205px; height: 35px; padding-top: 5px; padding-left: 4px;}

/*Main Nav Menu*/
ul#topnav {	
	list-style: none;
	padding: 0 20px;
	margin: 0;
	float: left;
	width: 950px;
	margin: auto;
	background: #222;
	font-size: 10pt;
	background: url(images/topnav_bg.gif) repeat-x;
}
ul#topnav li {
	float: left;
	margin: 0; padding: 0 15px 0 0;
	position: relative;
}
ul#topnav li a {
	padding: 10px 5px;
	color: #fff;
	display: block;
	text-decoration: none;
	float: left;
}
ul#topnav a.resources {
	background: url(images/subnav_btn.gif) no-repeat right 2px;
	width: 78px;
}
ul#topnav a:hover.resources {
	background: url(images/subnav_btn.gif) no-repeat right -33px;
}
ul#topnav li .sub {
	position: absolute;	
	top: 35px; left: 0;
	background: #344c00 url(images/sub_bg.png) repeat-x;
	padding: 20px 20px 20px;
	float: left;
	/*--Bottom right rounded corner--*/
	-moz-border-radius-bottomright: 5px;
	-khtml-border-radius-bottomright: 5px;
	-webkit-border-bottom-right-radius: 5px;
	/*--Bottom left rounded corner--*/
	-moz-border-radius-bottomleft: 5px;
	-khtml-border-radius-bottomleft: 5px;
	-webkit-border-bottom-left-radius: 5px;
	display: none;
}
ul#topnav li .row {clear: both; float: left; width: 100%; margin-bottom: 10px;}
ul#topnav li .sub ul{
	list-style: none;
	margin: 0; padding: 0;
	width: 150px;
	float: left;
}
ul#topnav .sub ul li {
	width: 100%;
	color: #fff;
}
ul#topnav .sub ul li h2 {
	padding: 0;  margin: 0;
	font-size: 1.3em;
	font-weight: normal;
	color: #e8e000;
}
ul#topnav .sub ul li h2 a {
	padding: 5px 0;
	background-image: none;
	color: #e8e000;
}
ul#topnav .sub ul li a {
	float: none; 
	text-indent: 0; /*--Reset text indent--*/
	height: auto;
	background: url(images/navlist_arrow.png) no-repeat 5px 12px;
	padding: 7px 5px 7px 15px;
	display: block;
	text-decoration: none;
	color: #fff;
}
ul#topnav .sub ul li a:hover {color: #ddd; background-position: 5px 12px ;}

/*Admin Styles*/
.adminList a img { border-style: none; }
.adminList th {
  text-align: left;
}
.adminFeedbackConfirm, .message_success {
  border: solid 1px #777777;
  background: #ececec url(images/accept.png) no-repeat 5px;
  padding: 5px;
  padding-left: 25px;
  margin: 2px; width: 250px;
}
.adminFeedbackError, .message {
  border: solid 1px #777777;
  background: #ececec url(images/error.png) no-repeat 5px;
  padding: 5px;
  padding-left: 25px;
  margin: 2px; width: 250px;
}
.form-info { 
  background-color: #eef8ff; padding: 5px;
  /*css3 rounded corners*/
  -webkit-border-radius: 5px;  
  -moz-border-radius: 5px;   
}
.form .textbox {
  background: #ffffff url(images/small-grad.png) repeat-x bottom;
  border: solid 1px #dddcdc;
  padding: 5px;
  /*css3 shadow*/
  box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;  
  -moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;  
  -webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px; 
  /*css3 rounded corners*/
  -webkit-border-radius: 5px;  
  -moz-border-radius: 5px;  
}
.form .textbox:focus {
  border: solid 1px #448efe;
  box-shadow: rgba(67,142,255, 0.15) 0px 0px 8px;  
  -moz-box-shadow: rgba(67,142,255, 0.15) 0px 0px 8px;  
  -webkit-box-shadow: rgba(67,142, 255, 0.15) 0px 0px 8px;  
}
.form .submit-button {
}
.testimonial {
  background: #ffffff url(images/quote-l.png) no-repeat;
  padding-left: 20px; padding-top: 20px; 
  color: #4b81aa;
}
.testimonial em { color: black; }
/*payment page*/
.paypal-1 {
  background: #ffffff url(images/pay-1.png) no-repeat;
  height: 160px; margin-left: 50px;
  padding-left: 50px; padding-top: 50px;  padding-right: 50px;
}
.paypal-2 {
  background: #ffffff url(images/pay-2.png) no-repeat;
  height: 160px; margin-left: 50px;
  padding-left: 50px; padding-top: 50px;  padding-right: 50px;
}
.paypal-3 {
  background: #ffffff url(images/pay-3.png) no-repeat;
  height: 160px; margin-left: 50px;
  padding-left: 50px; padding-top: 50px;  padding-right: 50px;
}
.pay-exam {
  background: #ffffff url(images/pay-exam.png) no-repeat;
  height: 200px;
  padding-left: 50px; padding-top: 50px;  padding-right: 50px;
}
/*payment page 2*/
.exam-1 {
  background: #ffffff url(images/exam-1.png) no-repeat;
  height: 160px; margin-left: 50px;
  padding-left: 50px; padding-top: 50px;  padding-right: 50px;
}
.exam-2 {
  background: #ffffff url(images/exam-2.png) no-repeat;
  height: 160px; margin-left: 50px;
  padding-left: 50px; padding-top: 50px;  padding-right: 50px;
}
.exam-3 {
  background: #ffffff url(images/exam-3.png) no-repeat;
  height: 160px; margin-left: 50px;
  padding-left: 50px; padding-top: 50px;  padding-right: 50px;
}
.exam-4 {
  background: #ffffff url(images/exam-4.png) no-repeat;
  height: 160px; margin-left: 50px;
  padding-left: 50px; padding-top: 50px;  padding-right: 50px;
}
.exam-5 {
  background: #ffffff url(images/exam-5.png) no-repeat;
  height: 160px; margin-left: 50px;
  padding-left: 50px; padding-top: 50px;  padding-right: 50px;
}

ul.tabs {
	margin: 0;
	padding: 0;
	float: left;
	list-style: none;
	height: 32px; /*--Set height of tabs--*/
	border-bottom: 1px solid #999;
	border-left: 1px solid #999;
	width: 100%;
}
ul.tabs li {
	float: left;
	margin: 0;
	padding: 0;
	height: 31px; /*--Subtract 1px from the height of the unordered list--*/
	line-height: 31px; /*--Vertically aligns the text within the tab--*/
	border: 1px solid #999;
	border-left: none;
	margin-bottom: -1px; /*--Pull the list item down 1px--*/
	overflow: hidden;
	position: relative;
	background: #e0e0e0;
}
ul.tabs li a {
	text-decoration: none;
	color: #000;
	display: block;
	font-size: 1.2em;
	padding: 0 20px;
	border: 1px solid #fff; /*--Gives the bevel look with a 1px white border inside the list item--*/
	outline: none;
}
ul.tabs li a:hover {
	background: #ccc;
}
html ul.tabs li.active, html ul.tabs li.active a:hover  { /*--Makes sure that the active tab does not listen to the hover properties--*/
	background: #fff;
	border-bottom: 1px solid #fff; /*--Makes the active tab look like it's connected with its content--*/
}
.tab_container {
	border: 1px solid #999;
	border-top: none;
	overflow: hidden;
	clear: both;
	float: left; width: 100%;
	background: #fff;
}
.tab_content {
	padding: 20px;
	font-size: 1.2em;
}