/**
 * Meshhopper CSS Style sheet
 */

body { background-color: #000; text-align: center; color: #fff; 
	font-family: Arial, sans-serif; font-size: 75%; }

body div { text-align: left;}
	
h1 { font-weight: normal; color: #ff7713; margin-top:27px; } 
h2 { font-weight: normal; color: #99cc00; margin-top:25px; }
h3 { font-weight: normal; color: #ff7713; } 

a img { border-style: none; }

.siteLogo { position: relative; top:5px; float: left;}

.header { background: #000 url(../images/menu-bg.gif) repeat-x top left;
	border-bottom: 8px solid #a4a4a4; text-align: right; }

.header-inner { width: 980px; margin: 0 auto; }

.header ul { list-style-type: none; float: right; margin: 0; padding: 0; 
	background: transparent url(../images/menu-separator.gif) no-repeat top left;  }

.header ul li { float: left; padding: 1em 2em 1em 2em;
 	background: transparent url(../images/menu-separator.gif) no-repeat top right; }

.header ul li.selected, .header ul li:hover { background: #a4a4a4 url(../images/menu-bg-selected.gif) repeat-x top left; }

.header ul li a { color: #fff; font-size: 110%; text-decoration: none; }
.header ul li.selected a, .header ul li:hover a { color: #424242; }

.main { display:block; width: 980px; margin: 0 auto 20px auto; text-align: left; padding-bottom: 40px; clear:both; }
.home { background: transparent url(../images/homepage-bg.gif) no-repeat top left; padding-top:380px; }

.main h1 { font-weight: normal; color: #ff7713; } 
.main h2 { font-weight: normal; color: #99cc00; } 

.main .left-panel { float: left; width: 432px; }
.main .right-panel { float: right;  width: 460px; margin-right: 30px; }

.main a { color: #99cc00; text-decoration: none; }

.home .left-panel { padding-left: 30px; }
.home .right-panel { }

.footer { width: 980px; margin: 0 auto; text-align: right;
	margin-top: 20px; margin-bottom: 20px; padding-right: 40px; clear:both; }

.footer .privacy, .footer .terms { margin-left: 1em; }
.footer .privacy a, .footer .terms a { color: #99cc00; text-decoration: none; }



.clear-both { clear: both; }

.order { text-align: left; border: none; }
.order tr { padding-top: 10px; }
.order td { border-width: 1px; border-width: 1px; border-color: #a4a4a4; padding-right: 10px; }
.order img { float: left; width: 100px; height: 100px; clear:none; padding: 0 5px 5px 0; }
.order h3 { margin: 10px 0 5px 0; }
.order p { display:inline; }
.order .lineTotal { padding-right: 60px; font-size: 1.4em; text-align: right; width: 150px; }

#register div, #login div, #contact div { display:block; margin:5px 0 0; padding:1px 3px; }
     
#contact { float:right; display: block; width: 500px; margin-bottom: 20px; }
#contact h2 { font-weight: normal; color: #ff7713; } 
#contact input[type=submit] { }
     
#register div.userDetails, #login div.userDetails { clear:both; float:left; display:block; }

#register label, #login div label, #contact div label { clear:left; display: block; float: left; width: 110px; padding: 3px 10px 3px 0; margin: 0 0 5px 0; text-align: right; }

.optional label, label.optional { font-weight: normal; }
.required label, label.required { font-weight: bold; }
.required span { float: left; margin-top: 5px; margin-left: 120px; font-weight: bold; clear: both;  }

#register label.labelCheckbox, #register div label.labelRadio, 
#login div label.labelCheckbox, #login div label.labelRadio {
  float: none;
  display: block;
  width: 200px;
  padding: 0;
  margin: 0 0 5px 142px;
  text-align: left;
}

#information { float:left; display:block; width: 360px; }

.padded { padding: 5px; }



.orderHead {background:#000000 url(../images/menu-bg.gif) repeat-x scroll left top; border-bottom:8px solid #A4A4A4; font-size: 1.2em; text-align: center; font-weight: bold; }
.orderHead td {background:transparent url(../images/menu-separator.gif) no-repeat scroll right top; padding:1em 2em;}




.linePrice { display: inline; white-space: nowrap; }

.nowrap { white-space: nowrap; width: 150px; }

#orderTotals { margin-left: 510px; }
#orderTotals div { clear:both; text-align: right; font-size: 1.4em; margin:5px 0; padding:2px 60px; }
#orderTotals div h4 { display:inline; font-weight: normal; color: #ff7713; padding: 0; margin: 0 40px 0 0;}
#orderTotals div span { }
#orderTotals div.grandTotal { font-weight: bold; border-style: solid none; border-width: 1px; border-color: #a4a4a4; }
#orderTotals p { text-align: right; }

.errorMsg { color: #FF0000; clear:both; font-weight: bold; }

#register, #login, #contact { padding: 0 20px 20px 20px; border: solid 2px #a4a4a4; margin-top: 20px; margin-bottom: 20px; }
#register { float:left; width: 490px; }
#login { float: right; width: 380px; }
.membersArea #login { float:left; }
.membersArea #register { float:right; border: none; }

#membersArea { float:right; display:block; width: 500px; }

.addresses { clear:both; }
.address { float:left; display:block; margin-right: 60px; } 
.address span { float:left; display:block; clear:both;}

#userDetails { float: left; margin-bottom: 40px; width: 100%; }
#userDetails div { width:40%; font-size: 1.4em; }
.emphasised { font-weight: bold; }

input[type=text], input[type=password] { width: 240px; }
select { width: 245px; }
select.number { width: auto; }
select.title { width: 60px; }
textarea { width: 300px; height: 200px; }
input[type=submit] { clear:both; float:right; padding: 5px; }

.node { height: 40px; padding-right: 50px; margin: 1px 0 0 0; }

.nodeHealthy { background-color: #33ff66; color: #000000; }
.nodeOverdue { background-color: #F4A460; color: #000000; }
.nodeRequiresAttention { background-color: #ff3333; color: #FFFFFF; }

.additionalInfo { text-align: right; font-size: 0.8em; }
.image { float:right; text-align: right; }
.image img { width: 443px; height: 415px; }

.questions, .membersArea #menu { float:left; display:block; width: 300px; }
.questions h2, .membersArea #menu h2 { color: #ff7713; }
a.question { display:block; padding: 3px 7px; margin: 1px; border: solid 1px #000000; }
a.question:hover { border: solid 1px #a4a4a4; }

.answers { float:right; display:block; width: 650px; }
.answer { display:block; color: #FFFFFF; padding-bottom: 20px; border-bottom: solid 1px #a4a4a4; }
.answers h2, .answer h3 { color: #ff7713; }

/*.buyNow { left:-150px; position:relative; top:50px;}*/

#nodes { border:2px solid #A4A4A4; float:left; height:300px; margin-top: 50px; padding:5px; width:190px; } 
#membersAreaMain { float:left; margin-left:20px; width:660px;}

/* ImageFader */
 
#gallery { position:relative; height:360px; padding-left:20px; }
#gallery a { float:left; position:absolute; border: solid 2px #ff7713; }
#gallery a img { border:none; }
#gallery a.show { z-index:500; }
#gallery .caption { z-index:600; background-color:#000; color:#ffffff; height:80px; 
    width:100%; position:absolute; bottom:0; margin-bottom:6px; margin-left:2px; }
#gallery .caption h2 { margin: 10px 0; }
#gallery .caption .content { margin:5px; }

.tech img { width: 315px; height: 372px; float:right; padding: 0 0 20px 20px; }
	
.introAnim img { display:none; float:right; padding: 20px 139px 20px 20px;}
.introAnim h2 { font-size: 2em; color: #ffffff; }
.introAnim h1 { font-size: 4.5em; color: #ffffff; }
#showFirst { padding-top: 1in; position:absolute; font-size: 3em; }
#showSecond .secondLine { clear:left; display:block; padding-left: 60px; }

#showSecond, #showThird, #showFourth, #showFifth, #moreInfoButton, #buyNowButton { position: absolute; display:none;}

#showSecond { top: 170px; }
#showThird { top: 320px; color: #FF7713; }
#showFourth {top: 380px; color: #99CC00; }
#showFifth { top: 430px; }
#showFifth .priceText {display:block; clear:left; font-size:0.7em; }
#showFifth .priceText strong {font-size: 3em; color: #ff7713; }
#moreInfoButton { top: 470px; padding-left: 320px; }
#buyNowButton { top: 515px; padding-left: 320px; }

#go { position: absolute; }
#showAll { position: absolute; padding-left: 300px; }


.customerHome { background: transparent url(../images/homepage-bg-cust.gif) no-repeat top left; padding-top:50px; height: 494px; }

	
/* New Consumer and Business pages */
#choice #topPanel { float: left; display: block; clear:both; width: 100%; background: url('/images/choice_bg.jpg') top right no-repeat; }

#topPanel .leftPanel { float:left; margin-bottom:10px; width: 600px; }
#topPanel .rightPanel { float:right; }

#topPanel ul { font-size: 2em; color: #99CC00; margin-top:5px; margin-bottom:5px; }

#business #topPanel .leftPanel h1 { font-size: 4em; margin-bottom: 10px; }
#consumers #topPanel .leftPanel h1 { font-size: 6em; margin-bottom: 10px; }

#consumers #buyNowButton, #business #buyNowButton { display: block; position: relative; padding-left: 0px; top: 0px;}
#consumers .orderLink, #business .orderLink { margin-top:38px; margin-left:20px; }

#topPanel h2 { font-size: 2em; margin-top: 0; }
#topPanel h2 strong { color: #ffffff; }
#topPanel h3 { font-size: 1.5em; }
#topPanel h4 { font-size: 1.5em; margin-top: 0; float:left; }
#topPanel h4 strong { font-size: 4em; color: #FF7713; padding: 0 10px; }

#choice #topPanel { width: 100%; }
#choice #topPanel .leftPanel { width:100%; }
#choice h1 { font-size:6em; margin-bottom: 10px;float:left; width:430px; }
#choice h2 { clear:both; font-size:2em; margin:5px 0 0;}
#choice p { clear:both; font-size: 1.5em; }

#choice h4 { float:left; margin-bottom:0; margin-top:0.2em; }

#choicePanel { display:block; float:left; margin: 0 40px 20px; }
#choicePanel div {display:block; float:left; width: 400px; border: solid 5px #99CC00; }
#choicePanel div.customers { margin-right: 80px; }
#choicePanel div a {display:block; float:left; padding: 20px; font-size: 1.4em; border: solid 1px #000000; } 
#choicePanel div a span {float:right; font-size:0.8em; margin-top:30px;} 
#choicePanel div a:hover { background-color: #99CC00; color: #000000; } 
#choicePanel div a strong { font-size: 1.2em; font-weight: bold; color: #FF7713; }
#choicePanel div a:hover strong { color: #000000; } 



#vtabs1 { float:left; display:block; }
#vtabs1 .leftPanel { float:left; display:block; width: 200px; }
#vtabs1 .rightPanel {display:block; float:left; border-left: solid 2px #FF7713; padding-left: 20px; /*margin-top:-28px;*/ width:755px; }
#vtabs1 .rightPanel div { padding-bottom: 20px; }

#vtabs1 .leftPanel ul { list-style-type: none; padding-left: 0; font-size: 1.4em; margin-left: 0; }

.vtabs .vtabs-tab-column ul li.open, .vtabs .vtabs-tab-column ul li.closed {
margin:0 0 1px;
padding:5px;
border-width: 2px;
border-color: #FF7713 #000000 #FF7713 #FF7713;
border-style: solid none solid solid;
}	

.vtabs .vtabs-tab-column ul li.closed {
border-color: #000000;
}
 
.orderLink { float:right; }

#choice .vopium {clear:none; float:right; margin:50px 265px 0 0; }


#partners .backgroundPanel {background: url('/images/partners_bg.jpg') top left no-repeat; display:block; float:left; }
#partners .leftPanel {float:left; display:block; width: 380px; }
#partners .leftPanel img { margin-left: 35px; margin-top: 350px; }
#partners .rightPanel { display:block; float:left; width:600px;}

#partners .infoPanel { float:right; border: solid 3px #ff7713; padding: 10px; width: 230px; margin: 10px 0 10px 10px; }
#partners .infoPanel h2 { margin: 0; }
#partners .infoPanel p { margin-bottom: 0; }

.specialOffer { font-size: 1.5em; float:left; width:320px; text-align:right; margin-bottom: 20px; }
.specialOffer h3 { font-size:2.5em !important; margin:5px 0; text-align: left;}
.specialOffer h4.only { float:none; text-align:right; padding-top: 16px; margin-bottom:0; line-height:1.3em; }
.specialOffer h4.price { font-size: 5em !important; float:right; color: #FF7713; margin-bottom:0; padding-left:20px; float:right !important; }
.specialOffer h5 { clear:both; color:#99CC00; font-size:0.8em; text-align:right; margin-top:0; }

.delivery { display:block; float:left; margin-left:40px; margin-top:25px; width:200px; }
.delivery h4 { margin-bottom:10px; margin-top:50px !important; }
.delivery a.orderLink {clear:both; float:left; margin:0 !important; padding-top:0; }

div.newResellerOrder { }
div.newResellerOrder p { }
div.newResellerOrder p label { display:block; float:left; width:140px; clear: left; }
div.newResellerOrder p input[type=text], div.newResellerOrder p select { }
div.newResellerOrder p input[type=button] { float:left; margin:5px 138px; }

div.newResellerOrder div.newCustomer { margin-left: 40px; }

div.membersArea div.menu { }
div.membersArea div.menu li a { border-style: solid none solid solid; border-width: 2px; border-color: #CFCFCF; padding: 5px; background-color: #CFCFCF; }
div.membersArea div.menu li a.hover { background-color: #FFFFFF; } 

div.editDetails p { }
div.editDetails p label { display:block; width: 150px; }
p.required { font-weight: bold; }

div.callout { background-color: #FF7713; width: 180px; padding: 10px 20px; float:left; margin: 0 20px 20px 0; }
div.callout h3 { color: #000000; font-size: 0.8em; }
div.callout h3 strong { font-size: 6em; display:block; clear:both; text-align: center; }

div.vtabs-content-panel h2 { font-size: 3em ; color: #FF7713; }

table.packages {}
table.packages tr { }
table.packages th { padding:5px; }
table.packages td { padding:5px; }

p.smallPrint { font-size:0.8em; }
