/**
 * Styles for API
 * by imagin8 webstudio <info@imagin8.com>
 */

/**
 * Basic layout stuff
 */

body {
	margin: 0;
	padding: 0;
	font-family: tahoma, sans-serif;
	background: white;

}

img {
	border: 0;
}

form {
	display: inline;
}

:focus {
	outline: 0;
}

a {
	text-decoration: none;
	color: #00a3b4;
}
a:hover {
	color: #fdb827;
}

textarea {
	font-family: tahoma, sans-serif;
	font-size: 100%;
}

/**
 * from the top
 */
#body_background {
	background: #1C5669 url(../images/bg.jpg) 50% 0px no-repeat;
}

#encompassing {
	width: 970px;
	background: url(../images/bg_three_col.gif) 212px 0 repeat-y;
	margin: auto;
}

body#level3 #encompassing {
	background: url(../images/bg_level3.gif) 212px 0 repeat-y;
}

h1#logo {
	width: 243px;
	height: 41px;
	background: url(../images/logo.gif) 10px 20px no-repeat; 
	text-indent: -2000px;
	padding: 20px 0 20px 10px;
	margin: 0;
	/* logo is positioned absolute to float over the flash feature */
	position: absolute;
	z-index: 100;
}
h1#logo a {
	display: block;
}

/**
 * Menu styles
#menu {
	height:39px;
	border-bottom: 1px solid #337084;
	background: #175062;
}
#menu ul {
	list-style: none;
	padding: 0 0 0 0;
	width: 960px;
	margin: auto;
}
#menu ul li {
	float: left;
	padding: 0;
	margin:  0 40px 0 45px;
}
#menu ul li a {
	padding-top: 15px;
	display: block;
}
 */

/**
 * Feature area
 */
#feature {
	/* we position absolute so we can extend outside of the ecompassing div
	 * without upsetting anything. */
	position: absolute;
	margin-left: 190px;
}

/**
 * Left Nav items
 */
#left_nav {
	float: left;
	width: 190px;
	margin-top: 73px;
	font-size: 70%;
}
#left_nav ul {
	margin: 8px 0 0 0;
	padding: 0;
	list-style: none;
}
#left_nav li {
	margin: 0;
	padding: 0 0 0 14px;
	background: url(../images/bullet_on_green.gif) 3px 5px no-repeat;
	line-height: 160%;
}
#left_nav li a {
	color: white;
}
#left_nav li a:hover {
	text-decoration: underline;
}

/**
 * member area
 */
#member_area {
	background: url(../images/shop_header.gif) no-repeat;
	height: 195px;
	background: url(../images/sections/member_area_bg.gif) no-repeat;
	padding: 20px 0 0 20px;
}
#member_area h2 {
	background: url(../images/sections/member_area.gif) no-repeat;
	width: 166px;
	height: 28px;
	padding: 0;
	margin: 0;
	text-indent: -2000px;
}
#member_area form {
	display: block;
	padding: 10px 0 0 5px;
	margin: 0;
}
input#box_username {
	border: 1px solid #155165;
	background: #FFFFFF url(../images/login/username.gif) 3px 4px no-repeat;
	width: 125px;
	color: #616161;
	font-family: tahoma, sans-serif;
	font-size: 11px;
	padding: 2px;
	margin-bottom: 3px;
}
input#box_username.active {
	background: #FFFFFF;
}
input#box_password {
	border: 1px solid #155165;
	background: #FFFFFF url(../images/login/password.gif) 3px 5px no-repeat;
	width: 125px;
	color: #616161;
	font-family: tahoma, sans-serif;
	font-size: 11px;
	padding: 2px;
}
input#box_password.active {
	background: #FFFFFF;
}
.login-help {
	padding: 4px;
	color: #FFFFFF;
}

/**
 * services 
 */
#services {
	padding: 10px 0 0 20px;
}
#services h2 {
	background: url(../images/sections/services.gif) no-repeat;
	text-indent: -2000px;
	padding: 0;
	margin: 0;
	height: 28px;
}

/**
 * search 
 */
#search {
	padding: 10px 0 0 20px;
}
#search h2 {
	background: url(../images/sections/search.gif) no-repeat;
	text-indent: -2000px;
	padding: 0;
	margin: 0;
	height: 28px;
}

/**
 * benefits 
 */
#benefits {
	padding: 10px 0 0 20px;
}
#benefits h2 {
	background: url(../images/sections/benefits.gif) no-repeat;
	text-indent: -2000px;
	padding: 0;
	margin: 0;
	height: 28px;
}

/**
 * Content 
 */
#content {
	float: right;
	margin-top: 321px;
	width: 758px;
	line-height: 150%;
	font-size: 70%;
}
#content .text {
}
#content #innercontent {
	padding-top: 5px;
	width: 700px;
}
/* this is for the answer fields in the forms */
#content #innercontent .a {
	padding: 4px 0 10px 7px;
}
#content #innercontent textarea {
	height: 150px;
	width: 400px;
}

/* level 2 is basically the same as the homepage, but with a small content area in the header */
body#level2 #feature .text {
	background: url(../images/heros/level2.jpg) no-repeat;
   	width: 829px;
   	height: 230px;
	padding-top: 120px;
	padding-left: 50px;
	font-size: 70%;
	overflow: hidden;
}
body#level2 #feature .text h2 {
	margin: 0;
	padding: 0;
	color: #20586A;
	font-size: 160%;
	font-weight: normal;
	font-family: Arial, sans-serif;
}
body#level2 #feature .text .right h2 {
	color: #5C5546;
}
body#level2 #feature ul#breadcrumb {
	margin: 0;
	list-style: none;
	padding: 0 0 0 1px;
}
body#level2 #feature ul#breadcrumb li {
	float: left;
	padding: 0 0 0 20px;
	background: url(../images/bullet_green.gif) 9px 3px no-repeat;
	color: #A2926E;
	font-size: 90%;
}
body#level2 #feature ul#breadcrumb li.first {
	padding: 0;
	background: none;
}
body#level2 #feature ul#breadcrumb a {
	color: #7B6E51;
}
body#level2 #feature .text .right {
	float: right;
   	width: 330px;
   	color: #5C5546;
}


/* level 3 has a nice white background, so we have to modify it as such */
body#level3 #content {
	margin-top: 217px;
	background: url(../images/level3_hero_footer.png) 0 0 no-repeat;
	width: 759px;
	padding-left: 20px;
}

body#level3 #heading {
	padding: 20px;
	margin-right: 10px;
	height: 30px;
	border-bottom: 1px dashed #B2C5CC;
}
body#level3 #heading h2 {
	color: #21596B;
	font-size: 160%;
	font-family: Arial, sans-serif;
	font-weight: normal;
	padding: 0 0 2px 0;
	margin: 0;
	line-height: 100%;
}
body#level3 #heading ul#util {
	float: right;
	width: 91px;
	height: 33px;
	padding: 0;
	margin:0;
	background: url(../images/util_bg.gif) no-repeat;
	list-style: none;
}
body#level3 #heading ul#util a {
	text-indent: -2000px;
	display: block;
	height: 33px;
}
body#level3 #heading ul#util li {
	width: 30px;
	height: 33px;
	display: block;
	float: left;
}

body#level3 #heading ul#breadcrumb {
	margin: 0;
	list-style: none;
	padding: 0 0 0 1px;
}
body#level3 #heading ul#breadcrumb li {
	float: left;
	padding: 0 0 0 20px;
	background: url(../images/bullet_on_white.gif) 9px 5px no-repeat;
	color: #9EC3D0;
	font-size: 90%;
}
body#level3 #heading ul#breadcrumb li.first {
	padding: 0;
	background: none;
}
body#level3 #heading ul#breadcrumb a {
	color: #649EA7;
}

body#level3 #content .blurb {
	background: #DEF2F4;
	border-bottom: 1px dashed #B2C5CC;
	margin-left: 2px;
	margin-right: 10px;
	padding: 15px 20px;
	font-size: 130%;
	color: #21596B;
}

body#level3 #content .text {
	color: #21596B;
	padding: 20px 22px;
}
body#level3 #content .text a {
	color: #00A3B4;
	text-decoration: none;
	border-bottom: 1px dashed #00A3B4;
}

/* headings */
body#level3 .text h1,
body#level3 .text h2,
body#level3 .text h3,
body#level3 .text h4,
body#level3 .text h5,
body#level3 .text h6
{
	margin: 0;
	padding: 15px 0 5px 0;
	font-weight: normal;
	line-height: 100%;
}
body#level3 .text h1 {
	font-size: 175%;
}
body#level3 .text h2 {
	font-size: 150%;
}
body#level3 .text h3 {
	font-size: 135%;
}
body#level3 .text h4 {
	font-size: 115%;
	font-weight: bold;
}
body#level3 .text h5 {
	font-size: 105%;
	font-weight: bold;
}
body#level3 .text h6 {
	font-size: 100%;
	font-weight: bold;
}

/* Lists */
body#level3 #content .text ul {
	margin-left: 0px;
	padding-left: 15px;
}
body#level3 #content .text ol {
	margin-left: 0px;
	padding-left: 25px;
}
body#level3 #content .text ul li {
	list-style: none;
	padding-left: 10px;
	margin-left: 0;
	background: url(../images/bullet_on_white.gif) 0px 5px no-repeat;
}
body#level3 #content .text ul li ol li {
	background: none;
	list-style: decimal;
	padding-left: 0px;
	margin-left: 0;
}
body#level3 #content .text ol li ul li {
	list-style: none;
	padding-left: 10px;
	margin-left: 0;
	background: url(../images/bullet_on_white.gif) 0px 5px no-repeat;
}


/**
 * child pages
 */
.child {
	width: 205px;
	padding-left: 24px;
	padding-right: 21px;
	float: left;
	border-bottom: 1px solid #337084;
	margin-bottom: -1px;
	padding-bottom: 15px;
	color: white;
}

.child strong {
	color: #FDB827;
}
.child a {
	display: block;
	height: 200px;
}

.child a.learn_more {
	display: block;
	width: 79px;
	height: 19px;
	margin: 15px 0;
	background: url(../images/btn_learn_more.gif) no-repeat;
	text-indent: -2000px;
}

.child a.btn25240, .child a.btn25215 {
	background: url(../images/btn_pay_here.gif) no-repeat;
}

.child_heading {
	margin: 21px 0 15px 0;
	border-bottom: 1px dashed #337084;
	padding: 0 0 15px 0;
	font-size: 160%;
	font-weight: normal;
	font-family: Arial, sans-serif;
}

.child .text {
	padding: 0px 0 2px 3px;
}

/* sitemap */
body#level3 #content .text #sitemap a {
	text-decoration: none;
	border: 0;
}
#sitemap a.category {
	background: url(/images/icon_category.gif) 0px 50% no-repeat;
	padding: 5px 0px 5px 22px;
	font-weight: bold;
}
#sitemap a.item {
	background: url(/images/icon_item.gif) 0 50% no-repeat;
	padding: 3px 0px 5px 22px;
}
#sitemap a.document {
	background: url(/images/icon_document.gif) 0px 50% no-repeat;
	padding: 3px 0px 5px 22px;
}

/**
 * Footer 
 */
#footer_bg {
	border-top: 1px solid #337084;
	background: #175062;
}
#footer {
	font-size: 70%;
	color: #84b8c0;
	padding: 14px 0px 14px 0px;
	width: 970px;
	margin: auto;
}
#footer_copyright {
	padding: 0px 0px 0px 16px;
}
#footer_links {
	color: #337084;
	padding: 0px 6px 0px 0px;
}
#footer a {
	text-decoration: none;
	color: #84b8c0;
	padding: 0px 10px 0px 10px;
}
#footer a:hover {
	color: #fdb827;
}




#feature ul {
	margin: 8px 0 0 0;
	padding: 0;
	list-style: none;
}
#feature li {
	margin: 0;
	padding: 0 0 0 14px;
	background: url(../images/bullet_on_white.gif) 3px 50% no-repeat;
	line-height: 160%;
}

body#level3 .text h2.ambassador {
	padding-top: 30px;
	background: transparent url('/images/ambassador_card.gif') right 0px no-repeat;
}

body#level3 #content a.gallery_img {
	border: 0px;
	margin: 16px 0px 0px 28px;
	padding: 5px;
	border: 1px solid #cccccc;
	display: block;
	float: left;
}
#innercontent {
	clear: both;
}