@charset "utf-8";
/* CSS Document */

/* CSS Reset */

*, h1, h2, h3, h4, h5, h6, form {
    margin: 0;
    padding: 0;
    border: 0;
    outline: none;
}

body {
    line-height: 1;
}

ul, ol {
    list-style: none;
}

img {
	border: 0;
}

/* Generic Styles */

body {
	font-size: 12px;
	font-family: Century Gothic;
	color: #333333;
	background-image: url('images/Background.jpg');
	margin: 2px;
}

div {
	line-height: 1.5;
	font-size: 12px;
	font-family: Century Gothic;
	color: #333333;
}

a:link, a:active, a:visited {
	color: #CC0000;
	font-weight: bold;
	text-decoration: none;
}

a:hover {
	color: #333333;
	font-weight: bold;
	text-decoration: none;
}

h1 {
	background-image: url('images/afriXtremeLogo.png');
	background-repeat: no-repeat;
	background-position: center center;
	width: 500px;
	height: 98px;
	text-indent: -9999px;
}

h2 {
	font-weight: bold;
	font-size: 14px;
	padding-left: 10px;
}

h3 {
	font-weight: bold;
	font-size: 14px;
}

input {
    border: 1px solid #999999;
	padding: 4px;
	font-size: 12px;
	font-family: Century Gothic;
	color: #333333;
	margin-bottom: 4px;
}

/* Lists */

li {
    margin-left: 30px;
    list-style-type: disc;
}

ul li ul {
    margin-left: 20px;
}

/* Containers */

#wrapper {
	width: 990px;
	margin-left: auto;
	margin-right: auto;
}

.content {
	width: 700px;
	position: relative;
}

.sideContent {
	width: 230px;
	position: relative;
}

.header {
	width: 988px;
	border: 1px solid #FFFFFF;
	margin-bottom: 10px;
	padding: 2px;
}

.innerDiv {
	background-color: #FFFFFF;
	padding: 10px;
}

/* Other Styles */

.lightBG {
	background-color: #eceded;
}

.searchBG {
	background-image: url('images/searchBG.png');
	background-repeat: no-repeat;
	width: 219px;
	height: 71px;
	text-align: right;
}

.mainHeadBG {
	background-image: url('images/mainHeadingBG.png');
	background-repeat: no-repeat;
	width: 705px;
	line-height: 40px;
	padding-left: 10px;
	margin-top: 2px;
}

.sideHeadBG {
	background-image: url('images/sideHeadingBG.png');
	background-repeat: no-repeat;
	width: 230px;
	line-height: 41px;
	padding-left: 10px;
}

.promoArea {
	width: 233px;
	height: 164px;
	margin-left: 5px;
}

.sideContent {
	width: 215px;	
	margin-left: 5px;
}

.mainContent {
	width: 680px;
	margin-left: 5px;
}

.mainContentOther {
	width: 700px;
	margin-left: 5px;
}

.padding {
	padding: 10px;
}

.paddingSml {
	padding: 6px;
}

.paddingSmls {
	padding: 4px;
}

.floatLeft {
	float: left;
}

.floatRight {
	float: right;
}

.clear {
	clear: both;
}

.marginTop {
	margin-top: 10px;
}

.marginLeft {
	margin-left: 13px;
}

.marginRight {
	padding-right: 15px;
}

.marginTops {
	padding-top: 5px;
}

/* Form Elements */

.txtBox {
    border: 1px solid #999999;
	padding: 4px;
	font-size: 12px;
	font-family: Century Gothic;
	color: #333333;
	margin-bottom: 4px;
	width: 200px;
}

.button {
    border: 1px solid #999999;
	padding: 4px;
	font-size: 12px;
	font-family: Century Gothic;
	color: #333333;
	margin-bottom: 4px;
}

/* Menu */

.menu ul {
    margin: 0;
    padding: 0;
    list-style-image: none;
	float: left;
}

.menu li {
    margin: 0;
    padding: 0;
    list-style-image: none;
    list-style-type: none;
	float: left;
	padding-left: 11px;
	padding-right: 11px;
}

.menu {
	float: left;
	list-style-type: none;
	width: 100%;
	margin-top: 10px;
	text-align: center;
	clear: both;
	margin-left: auto;
	margin-right: auto;
}

.menu a:link, .menu a:active, .menu a:visited {
	color: #CC0001;
	font-weight: bold;
	line-height: 20px;
	float: left;
	text-align: center;
	margin-left: 11px;
	margin-right: 11px;
	padding: 3px;
}

.menu a:hover {
	color: #666666;
	font-weight: bold;
	background-color: #E4E6E7;
	padding: 3px;
	line-height: 20px;
	float: left;
	text-align: center;
	margin-left: 11px;
	margin-right: 11px;
}

.menuSep {
	background-image: url('images/menuSep.gif');
	background-repeat: no-repeat;
	background-position: center center;
	width: 2px;
	line-height: 22px;
	height: 22px;
	float: left;
	padding-top: 1px;
	padding-bottom: 1px;
}

.body_hom .menu_hom a, .body_abo .menu_abo a, .body_news .menu_news a,
.body_pass .menu_pass a, .body_con .menu_con a,
.body_sho .menu_sho a, .body_soc .menu_soc a, .body_faq .menu_faq a,
.body_sea .menu_sea a, .body_gen .menu_gen a {
	color: #666666;
	font-weight: bold;
	background-color: #E4E6E7;
	padding: 3px;
	line-height: 20px;
	float: left;
	text-align: center;
	margin-left: 11px;
	margin-right: 11px;
}

/* Footer */

.footer {
	width: 988px;
	margin: 2px;
	border: 1px solid #CC0001;
	color: #FFFFFF;
	font-size: 10px;
}

.footerInner {
	background-color: #CC0001;
	margin: 2px;
	color: #FFFFFF;
	font-size: 10px;
	text-align: center;
}

.footerInner a:link, .footerInner a:active, .footerInner a:visited {
	color: #FFFFFF;
	font-size: 10px;
	font-weight: normal;
}

.footerInner a:hover {
	color: #333333;
	font-size: 10px;
	font-weight: normal;
}

/* Lightbox */

#lightbox{
	position: absolute;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	}

#lightbox a img{ border: none; }

#outerImageContainer{
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	}

#imageContainer{
	padding: 10px;
	}

#loading{
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
	}
#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
	}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url(../images/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prev.gif) left 50% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/next.gif) right 50% no-repeat; }

/*** START : next / previous text links ***/
#nextLinkText, #prevLinkText{
color: #FF9834;
font-weight:bold;
text-decoration: none;
}
#nextLinkText{
padding-left: 20px;
}
#prevLinkText{
padding-right: 20px;
}
/*** END : next / previous text links ***/
/*** START : added padding when navbar is on top ***/

.ontop #imageData {
    padding-top: 5px;
}

/*** END : added padding when navbar is on top ***/

#imageDataContainer{
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	}

#imageData{
	padding:0 10px;
	}
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;	}
#imageData #helpDisplay {clear: left; float: left; display: block; }

#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	filter:alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
	display: none;
	}
	

.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	}

* html>body .clearfix {
	display: inline-block; 
	width: 100%;
	}

* html .clearfix {
	/* Hides from IE-mac \*/
	height: 1%;
	/* End hide from IE-mac */
	}	
	
#flashcontent {
    width: 455px;
    height: 255px;
}

#flashcontent2 {
    width: 968px;
    height: 255px;
}

/* Side Nav */

.sideNav ul, .side ul, .sideMnu ul {
    margin: 0;
    padding: 0;
    list-style-image: none;
}

.sideNav li {
    margin: 0;
    padding: 0;
    list-style-image: none;
    list-style-type: none;
	padding: 2px 10px;
	border-bottom: 1px solid #c3c3c3;
}

.sideMnu li, .side li {
    margin: 0;
    padding: 0;
    list-style-image: none;
    list-style-type: none;
}

.sideNav, .side, .sideMnu {
	list-style-type: none;
	width: 100%;
}

.accordionHeader {
	color: #FFF;
	font-weight: bold;
	line-height: 30px;
	padding-left: 10px !important;
	background-image: url('images/sideCatHeadingBG.png');
	background-repeat: no-repeat;
	background-position: top center;
}

.sideMnu a:link, .sideMnu a:active, .sideMnu a:visited {
	color: #333333;
	font-weight: bold;
	line-height: 20px;
}

.sideMnu a:hover {
	color: #CC0001;
	font-weight: bold;
	line-height: 20px;
}

.sideNav a:link, .sideNav a:active, .sideNav a:visited {
	color: #333333;
	font-weight: bold;
	line-height: 20px;
}

.sideNav a:hover {
	color: #CC0001;
	font-weight: bold;
	line-height: 20px;
}

.side {
    color: #FFF;
}

.picBorder {
    border: 1px solid #505050;
    padding: 1px;
}

.pager {
    border-top: 1px solid #c3c3c3;
    border-bottom: 1px solid #c3c3c3;
    background-color: #e0e1e3;
    margin-top: 10px;
    font-weight: bold;
}

.headers {
    border-top: 1px solid #c3c3c3;
    border-bottom: 1px solid #c3c3c3;
    background-color: #e0e1e3;
    height: 26px;
    font-weight: bold;
    line-height: 26px;
    padding: 2px 10px;
    color: #cc0001;
    font-size: 14px;
}

.line {
    border-bottom: 1px solid #cc0001;
    background-color: #FFFFFF;
}

.scrollButtons {
    border: 1px solid #c3c3c3;
    padding: 1px 5px;
}

a:hover.scrollButtons {
    background-color: #eceded;
    border: 1px solid #c3c3c3;
    padding: 1px 5px;
}

.scrollButtonsSelected {
    background-color: #eceded;
    border: 1px solid #c3c3c3;
    padding: 1px 5px;
    color: #333333;
}

.pages {
    line-height: 30px;
}

.page {
    height: 30px;
}