/* Base Template CSS */

/* reset whitespace */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
 margin:0;
 padding:0;
}

h2,
strong{
	color:#99CCFF;
}

a img {
 border: 0px;
}

/* basic layout */

html {
 height: 100%; 
 overflow:hidden;
 height:100%; /* fix height to 100% for IE */
 padding:0; /*remove padding */
 margin:0; /* remove margins */
 border:0; /* remove borders */
 max-height:100%; /* fix height for other browsers */
 /* hide overflow:hidden from IE5/Mac */
 /* \*/
 overflow:hidden; /*get rid of scroll bars in IE */
 /* */
}

#scroller {
 position:absolute;
 width:100%;
 height:100%;
 overflow:auto;
 z-index:2;
 left: 0px;
 top: 0px;
} 

html, body {
 margin:0; 
 padding:0; 
 width:100%; 
 height:100%; 
 overflow:hidden;
}

#maincontent .left .page p a,
#maincontent .left .page a{
	text-decoration:underline;
}

.background{ 
 position:absolute; 
 z-index:0; 
 width:100%; 
 height:100%;
}

body {
 font-family:Arial, Helvetica, sans-serif;
 font-size: 11px;
 color: #000;
 line-height: 18px;
}

.center {
 width: 950px;
 margin: 0 auto 0 auto;
 z-index: 4;
 position: relative;
}

.left {
 float: left;
}

.right {
 float: right;
}

.clear { 
 clear: both; 
 height: 0; 
 margin: 0;
}

#logo {
 position: absolute;
 z-index: 20;
 top: 90px;
 left: 28px;
 height: 68px;
 width: 100px;
}

#searchdiv {
 margin: 18px 0px 0px 0px;
 float: right;
 width: 280px; 
}


/* start header */

#header {
 height: 63px;
}

#header .center {
 position: relative;
 margin: 0 auto 0 auto;
 z-index: 20;
 height: 63px;
}

/* end header */

/* start homepage */

#maincontent .homeimage {
 float: left;
 width: 180px;
 height:248px;
 margin: 25px 0px 0px 30px; /* standard margin */
}

#maincontent .page .homeimage {
 float: left;
 width: 180px;
 height:248px;
 margin: 25px 0px 0px 0px; /* standard margin */
}

#maincontent .homecontent {
 float: left;
 width: 340px;
 margin: 25px 0px 20px 5px;
}

#maincontent .homecontent p {
 font-size: 12px;
 line-height: 16px;
 width: 340px;
 margin: 5px 0px 10px 0px;
}

#maincontent .left .page .homecontent h1 ,
#maincontent .left .homecontent h1 {
 width: 380px;
 margin: 0px 0px 20px 0px;
}

#maincontent .right .top {
 position: relative;
 float: left;
 width: 180px;
 height: 140px;
 margin: 25px 0px 0px 10px;
 background: transparent url(../images/bg_right_top.png) top center no-repeat;
}

#maincontent .right .top p {
 width: 180px;
 text-align: center;
 font-size: 13px;
 padding: 5px 0px 0px 0px;
 font-weight: bold;
 font-family: Trebuchet MS, Arial;
}

#maincontent .right .top img {
 position: absolute;
 top: 0px;
}

#maincontent .right .middle {
 float: left;
 width: 180px;
 margin: 0px 0px 0px 10px;
}

#maincontent .right .middle img {
 margin-left: 10px;
}

#maincontent .right .bottom {
 float: left;
 width: 180px;
 height: 125px;
 margin: 0px 0px 0px 10px;
 padding-top: 12px;
 background: transparent url(../images/bg_right_bottom.png) top center no-repeat;
}

#maincontent .right .bottom p {
 width: 113px;
 margin: 2px 0px 0px 32px;
 font-size: 11px;
}

/* end homebottom*/

#maincontent .homebottom  {
 float: left;
 width: 550px;
 /*margin: 5px 0px 20px 30px;*/
 margin: 0px 0px 20px 30px;
 position: relative;
}

#maincontent .homebottom .homebottomleft {
 float: left;
 width: 250px;
 /*margin: 5px 15px 0px 0px;*/
 margin: 0px 15px 0px 0px;
 background: transparent;
 border-bottom: 0px;
}

/* Box in the left bottom */

#maincontent .homebottom .homebottomleft .box {
 float: left;
 width: 220px;
 margin: 5px 15px 0px 0px;
 background: transparent;
 border: 1px solid #8F8F8E;
}

#maincontent .box .header {
 height: 25px;
 width: 218px;
 float: left;
 margin: 1px 1px 1px 1px;
 background: transparent url(../images/bg_header_box.jpg) top left repeat-x;
}

#maincontent .homebottom .homebottomleft .box .text {
 float: left;
 width: 218px;
 background: #7E7E7E;
 color:#000000;
 margin: 0px 1px 1px 1px;
 font-size: 11px;
 padding-bottom: 10px;
}

#maincontent .homebottom .homebottomleft .box .text p {
 color: #FFF;
 line-height: 15px;
 padding: 0px 0px 0px 0px;
 margin: 10px 0px 0px 0px;
 float: left;
 width: 140px;
}

#maincontent .box .header p {
 float: left;
 padding: 2px 0px 0px 5px;
 font-weight: bold;
 color:#fff
}


#maincontent .homebottom .homebottomleft .box .text img {
 height: 75px;
 width: 60px;
 float: left;
 margin: 10px 10px 5px 8px;
}


#maincontent .homebottom .homebottomright {
 float: left;
 width: 250px;
 margin: 7px 25px 0px 0px;
 background: transparent;
 position: relative;
}

/* end homepage */

/* start footer */

#footer {
 padding-top: 0px;
 color: #000;
 margin-top: 1px;
}

#footer .center {
 position: relative;
 margin: 0 auto 0 auto;
 padding-top: 5px;
 height: 20px;
}

#footer .center a {
 color: #666;
 text-decoration: none;
}

#footer .center a:hover {
 color: #FF0000;
 text-decoration: none;
}

#footer .center .left ul {
 width: 400px;
 margin-left: 176px;
 float: left;
}

#footer .center .left ul li {
 display: inline;
 float: left;
 width: auto;
 height: 15px;
 background: transparent url(../images/pipe.gif) right 5px no-repeat;
 padding: 0px 5px 0px 5px;
}


#footer .center .right {
 /*margin-right: 235px;*/
 margin-right:40px;
}

/* end header */

#topbar {
 width: 949px;
 border: 1px solid #AE0000;
 height: 4px;
 background: #C51D1C;
}

/*
#bottombar {
 width: 590px;
 border: 1px solid #AE0000;
 height: 4px;
 float: left;
 margin-right: 0px;
 margin-top: 0px;
 background: #C51D1C;
}*/

/* content */

#content div.center {
 position: relative;
 padding: 0px 0px 0px 0px;
}

* html #content {
 position: relative;
 margin-top: 0px;
 z-index: 4;
}

#maincontent {
 width: 800px;
 float: left;
 padding-bottom: 0px;
 color: #FFFFFF;
 font-size: 12px;
 margin-left: 151px;
}

#maincontent .left {
 width: 600px;
 float: left;
 margin: 0px 0px 0px 0px;
 background: transparent url(../images/bg_maincontent.png) top left repeat; 
 border-bottom: 6px solid #AE0000;
 min-height: 400px;
}


#maincontent .middle .box {
 border: 1px solid #CCC;
 height: 99px;
 width: 165px;
 float: left;
 margin: 0px 20px 20px 0px;
}

#maincontent .left .learnmore{
 width: 180px;
 float: left;
 margin: 10px 10px 0px 0px;
}

#maincontent .left .button {
 width: 100px;
 float: left;
 margin: 10px 10px 0px 0px;
}

#maincontent .view {
 width: 60px;
 float: left;
 margin: 10px 10px 0px 0px;
}

#maincontent .left .download {
 width: 110px;
 float: left;
 margin: 10px 10px 0px 0px;
}

#maincontent .right {
 width: 198px;
 float: left;
 margin: 0px 0px 0px 0px;
 background: transparent url(../images/bg_rightcontent.png) top left repeat;
}


/* advertArea */

#maincontent .homebottom .advertright {
 position: relative;
}

#maincontent .homebottomright h6 {
 width: 120px;
 font-size: 11px;
 font-weight: bold;
 position: absolute;
 left: 144px;
 /*top: -17px;*/
 top:10px;
}

.advertarea {
 border: 1px solid #8F8E8E;
 width: 264px;
 /*height: 126px;*/
 position: relative;
 margin: 5px 0px 0px 0px; 
 height:162px;
}

#maincontent .right .advert {
 width: 260px;
 height: 122px;
 margin: 1px 0px 0px 1px;
 background: #7E7E7E;
 border: 1px solid #8F8E8E;
}

#maincontent .advert .advertleft {
 float: left;
 width: 115px;
 height: 150px;
 margin: 5px 0px 0px 0px;
 position: absolute;
 /*top: -35px;*/
 left: 10px;
}

#maincontent .advert .advertright {
 float: right;
 width: 110px;
 height: 80px;
 padding: 0px 0px 0px 0px;
 margin: 5px 10px 0px 0px;
 height: 160px;
}

#maincontent .advert .advertright h3 {
 font-size: 11px;
 font-weight: bold;
 text-transform: uppercase;
 font-family: Trebuchet, Arial;
 float: left;
 margin: 10px 0px 0px 0px;
 text-align: center;
 width: 140px;
}

#maincontent .advert .advertright p {
 font-size: 11px;
 font-weight: normal;
 font-family: Arial;
 float: left;
 line-height: 15px;
 /*margin: 0px 0px 0px 0px;*/
 text-align: left;
 width: 110px;
 /*height:80px;*/
 margin: 20px 0px 0px 0px;
 height:80px;
}

#twitter {
 float:right; 
 height:42px; 
 width: 138px;
 margin: 6px 28px 0px 0px;
}

#facebook {
 float:right; 
 height:42px; 
 width: 138px;
 margin: 6px 28px 0px 0px;
}

/* close advertArea */


#maincontent .left p strong {
 color: #99CCFF;
 font-weight: bold;
}

#maincontent .left p a:hover {
 color: #FF0000;
 text-decoration: underline;
}

#maincontent .left p a {
 color: #FFF;
 /*text-decoration: none;*/
}

/* end of content */

/* flashcontent */

#flashcontent {
 float: left;
 width: 800px;
 height: 342px;
 margin: 0px 0px 0px 151px;
}

/* end flashcontent */

/* menu */

#menudiv {
 filter: alpha(opacity=80);
 -moz-opacity:.80;
 opacity:.80;
 background: #333;
 width: 150px;
 border-right: 1px solid black;
 color: #FFFFFF;
 position: absolute;
 top: 6px;
 padding-bottom: 5px;
 z-index: 600;
 border-bottom: 6px solid #AE0000;
}

/* proper menu */

ul#menu {
 width: 120px;
 list-style-type: none;
 margin: 0px;
 padding: 0px;
 margin: 110px 5px 0px 28px;
 float: left;
 padding-bottom: 36px;
}

ul#menu ul {
 display: block;
 width:5px;
 text-align: left;
 list-style-type: none;
 margin: 0px;
 padding: 0px;
}

ul#menu li.selected a,
ul#menu li.selected li.selected a { 
 color:#ccc;
 font-weight: bold;
 text-decoration:underline;
 
}

ul#menu li.selected ul li a{ 
 color:#FFF;
 font-weight: normal;
}

ul#menu li, 
ul#menu a {
 font-family: Arial, Helvetica, sans-serif;
 font-size: 12px;
 text-align: left;
 color: #FFF;
 font-weight: normal;
}

ul#menu li {
 margin-bottom: 2px;
 width: 120px;
 float: left;
 padding: 0px;
}

ul#menu li.spacer {
 width: 120px;
 height: 40px;
}

ul#menu li ul li {
 width: 130px;
 float: left;
 margin-bottom: 0px;
}


ul#menu li ul li a {
 margin: 0px;
 font-size: 11px;
 border-left: 1px solid #FF0000;
 padding: 0px 3px 4px 6px;
 line-height: 10px;
 font-weight: normal;
}

ul#menu ul li {
 border-bottom: none;
}

ul#menu a {
 text-decoration: none;
 outline: none;
 color:#FFF;
}

ul#menu a:hover {
 /*color:#FF0000;*/
 color:#c0c0c0;
 text-decoration:underline;
}

ul#menu a.active {
 /*color:#FF0000;*/
 color:#c0c0c0;
 text-decoration:underline;
}


/* end menu */

/* links */

a,
a:visited {
 color: #000;
 text-decoration: none;
}

a:hover {
 color: #000;
 text-decoration: underline;
}


#maincontent .left h2 {
 font-weight: 300;
 font-size: 18px;
 width: 550px;
 float: left;
 margin: 0px 0px 20px 0px;
 color:#99CCFF;
}

#maincontent .left h1 {
 font-weight: 300;
 font-size: 18px;
 width: 550px;
 float: left;
 margin: 0px 0px 20px 0px;
}

#maincontent .left h3 {
 font-weight: 300;
 font-size: 14px;
 width: 350px;
 float: left;
 margin: 0px 0px 10px 0px;
}


/* PAGE */

.page {
 float: left;
 margin: 25px 0px 10px 30px;
 width: 550px;
 padding-bottom: 10px;
}

.page p {
 font-size: 12px;
 margin-bottom: 10px;
 width: 550px;
}

.page h1 {
 margin: 0px 0px 20px 0px;
}

.page .pageimage {
 float: left;
 width: 180px;
 margin: 0px 0px 0px 0px; /* standard margin */
}

.page .pagecontent {
 float: left;
 width: 340px;
 margin: 0px 0px 20px 5px;
}

.page strong,
.page h2{
	color:#99CCFF;
}

.page .pagecontent p {
 font-size: 12px;
 line-height: 16px;
 width: 340px;
 margin: 5px 0px 10px 0px;
}

#maincontent .page .pagecontent h1 {
 width: 340px;
}

/* FORM PAGE */

/* contact form */

#contactform {
 float: left;
 width: 520px;
}

#mainform {
 float: left;
 width: 550px;
 margin-top: 0px;
}

/*#mainform form {
 width: 550px;
 margin-top: 0px;
}*/

#mainform textarea {
 border: 1px solid #FFF;
 width: 350px;
 height: 110px;
 float: left;
 margin: 0px 0px 10px 0px;
 font-family:Arial, Helvetica, sans-serif;
 overflow: auto;
 color: #000;
 padding: 2px 2px 2px 2px;
 font-size: 11px;
 background: #969696 url(../images/bg_textarea.jpg) top left repeat-x;
}

#mainform span {
 font-size: 10px;
 color: #FFF;
 margin-left: 10px;
}

#mainform p {
 font-size: 12px;
 margin: 10px 0px 15px 0px;
 width: 550px;
 color: #666;
}


#contactform #mainform p {
 color: #fff;
}

#mainform p.contactarea {
 font-size: 12px;
 margin: 10px 0px 10px 0px;
 width: 550px;
 color: #666;
}

#mainform p label {
 font-size: 12px;
 margin: 0px 0px 5px 0px;
 width: 80px;
 float: left;
 color: #FFF;
}

#mainform p label.wider{
 font-size: 12px;
 margin: 5px 0px 5px 0px;
 width: 300px;
 float: left;
 color: #666;
}

#mainform input {
 border: 1px solid #FFF;
 color: #000;
 height: 18px;
 padding: 2px 2px 2px 2px;
 font-size: 11px;
 width: 250px;
 background: transparent url(../images/bg_searchfield.jpg) top left repeat-x;
}

#mainform input.bt_send {
 margin: 3px 0px 5px 78px;
 width: 65px;
 height: 25px;
 border: 0px;
 background: transparent;
}

#mainform input.button{
 border: 0px;
 color:#fff; 
 cursor:pointer;
 height: 20px;
 padding: 2px 2px 12px 2px;
 width: 250px;
 background: transparent url(../images/bg_searchfield.jpg) top left repeat-x; 
}

input.greybutton {
 border: 0px;
 color:#fff; 
 cursor:pointer;
 height: 20px;
 padding: 2px 2px 12px 2px;
 background: transparent url(../images/bg_searchfield.jpg) top left repeat-x; 
 margin-left:10px;
 margin-right:10px;
 font-size: 11px;
}

/* sitemap */


#maincontent .sitemap {
 font-weight: 300;
 float: left;
 margin: 0px 0px 20px 0px;
}

.sitemap ul {
 width: 500px;
 float: left;
 list-style-type: none;
}

.sitemap ul li {
 width: 500px;
 float: left;
 color: #FFFFFF;
 font-size: 12px;
 padding-left: 15px;
 line-height: 22px;
 background: transparent url(../images/bg_li.gif) 3px 6px no-repeat;
}


#maincontent .page .sitemap ul li a:hover {
 color: #FF0000;
 text-decoration: none;
}

#maincontent .page .sitemap ul li a {
 color: #FFFFFF;
 text-decoration: none;
}

/* BACKISSUES & PRODUCTS*/

#backissues {
 float: left;
 width: 550px;
}

#products{
 float: left;
 width: 400px;
}

.products {
 float:left;
 width: 400px;
 margin: 5px 0px 5px 0px;
}

#products .productRight{	
	margin-left:100px;		
	min-height:105px;
	width:300px;
}

#products .productRight h2{
	width:400px;	
	color:#99CCFF;
}
#products .productRight p{	
	width:400px;	
}

#products .productLeft{
	float:left;
	width:100px;			
	
}

.productHolder{
	float:left;
	margin-bottom:30px;
	margin-top:10px;
}

.productRight table .prices{
	width:300px;
	margin-bottom:10px;
}

.backissue {
 float: left;
 width: 550px;
 margin: 20px 0px 20px 0px;
}

#maincontent .page .backissue .left {
 float: left;
 width: 105px;
 min-height: 110px;
 padding-top: 4px;
 background: transparent;
 border-bottom: 0px;
}

#maincontent .page .backissue .right h2 {
 width: 400px;
 font-size: 13px;
 font-weight: bold;
 margin: 0px 0px 10px 0px;
 color:#99CCFF;
}

#maincontent .page .backissue .right {
 float: left;
 width: 400px;
 min-height: 110px;
 background: transparent;
}

#maincontent .page .backissue .right p {
 float: left;
 width: 400px;
 font-size: 11px;
}

#maincontent .page .backissue .right .button {
 float: left;
 width: 400px;
}

#viewBasket,#orderHistory {
	border:solid 1px #fff;
	margin:10px 0px 10px 0px;	
}

#viewBasket th,#orderHistory th{	
	background:#970b0a;	
	padding:2px;
}

.textRight{
	text-align:right;
}

.textLeft{
	text-align:left;
}

.textCenter{
	text-align:center;
	
}

#viewBasket th.small, #orderHistory th.small{
	width:10px;	
}

.textCenter a{
	cursor:pointer;
	color:#970b0a;	
	background:#fff;
	padding:2px;
}

td.orderTotal{
	text-align:right;
	background:#970b0a;	
}

#mainform p.redHeader,
#products p.redHeader{
	background:#970b0a;	
	color:#fff;
	font-size:12px;
	padding:2px;
	font-weight:bold;
}

#maincontent .products p.redHeader{	
	margin-top:0px
}

#maincontent p.redHeader{	
	background:#970b0a;	
	color:#fff;
	font-size:12px;
	padding:2px;
	font-weight:bold;	
	margin-top:20px
}

#mainform p b{
	font-size:14px;
	color:#fff;
}

a#rightHandButtonText{
	position:absolute;
	z-index:100;
	font-size:15px;
	font-weight:bold;
	color:#fff;
	margin:10px 10px 0px 45px;			
	cursor:pointer;
	text-decoration:none;
	
	
}

.page .latestIssue{
	width:540px;
	clear:both
}

#detailErrorTxt{
	color:red
}