/* RESET */
*{ margin: 0; padding: 0; }
a img, iframe{ border: 0; }
h1, h2, h3, h4, h5, h6{ font-size: 100%; font-weight: normal; }
ul, ol, dl, li, dt, dd{ list-style: none; }
form, fieldset{ border: 0; }	
input, textarea, select, button { color: #666666; font-size: 12px; }
select{ margin: inherit; }
table{ border-collapse: collapse; border: 0; }
td, th, caption{ font-size: 100%; font-weight: normal; text-align: left; }

/* LAYOUT */
body{ font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #848484; background: #112128 url(bg_body.gif) repeat-x; }
body#Home{ background: #112128 url(bg_body_home.gif) repeat-x; }
.wrap{ width: 880px; margin: 0 auto; }
#Head{ float: left; height: 118px; width: 100%; overflow: hidden;  }
	#Head .left{ width: 350px; }
	#Head .slogan{ float: left; width: 300px; color: #cdcdcd; height: 30px; line-height: 30px; overflow: hidden; }
	#Head h1{ float: left; width: 323px; height: 67px; background: url(logo2.gif) no-repeat; margin: 10px 0 0 0; clear: left; }
	#Head h1 a{ display: block; width: 100%; height: 56px; text-indent: -5000px; }
	#Headnav{ float: right; width: 210px; list-style: none none; margin: 18px 0 0 0; padding: 0; }
		#Headnav li{ display: block; height: 24px; width: 176px; margin: 0 0 2px 0; padding: 3px 0 0 34px; overflow: hidden;  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;  }
		#Headnav li.chat{ background: url(bg_headnav_chat.gif) no-repeat; }
		#Headnav li.phone{ background: url(bg_headnav_phone.gif) no-repeat; }
		#Headnav li.email{ background: url(bg_headnav_mail.gif) no-repeat; }
		#Headnav a{ display: block; width: 100%; color: #ef800d; text-decoration: none; }
		#Headnav a:hover{ text-decoration: underline;  }
		#Headnav li.chat a{ color: #f58b1a; }
#Nav{ float: left; width: 100%; overflow: hidden;  }
	#Nav .wrap{ height: 32px; background: #112128 url(bg_nav.gif); overflow: hidden; }
	#Nav ul{ list-style: none; margin: 0; padding: 0 0 0 80px; font-size: 1.2em; }
	#Nav li{ float: left; padding: 0 7px; margin: 0px; height: 32px; line-height: 32px; background: url(bg_nav_li.gif) no-repeat; }
	#Nav a{ float: left; height: 32px; padding: 0 34px; color: #efeedd; text-decoration: none; }
	#Nav a:hover{ color: white; text-decoration: underline; }
	#Nav li.active{ margin:0 -3px 0 0; background: url(bg_nav_li_active.gif) no-repeat; }
	#Nav li.active a{ background: url(bg_nav_a_active.gif) no-repeat right; }
#Visual{ float: left; width: 100%; }	
	#Visual .wrap{ width:886px; height: 79px; background: #52aad4 url(bg_visual.gif);  }
#Content{ float: left; width: 100%; background:white url(bg_body_home.gif) repeat-x 0 -394px; }	
	#Content .wrap{ width: 884px; background: url(bg_content.gif) no-repeat; min-height:270px;}
#Addition{ float: left; width: 100%; background: #f3f3f3; border-top: 1px solid #dedede; }	
#addition{ float: right; width: 625px; padding: 15px 6px 15px 0; }
#Main{ float: right; width: 625px; padding: 10px 9px 30px 0; }	
.side{ float: left; width: 209px; padding:10px 0 30px 13px; }
#Footer{ float: left; width: 100%; border-top: 3px solid black; padding: 17px 0 80px 0; font-size: 11px; }
	#Footer .box{ float:left; width:100%; padding: 0px 0 14px 0; background: url(bg_footer_box2.gif) no-repeat bottom; }
	#Footer .boxfooter{ float: left; width: 100%; padding: 10px 0 0px 0; background: url(bg_footer_box.gif) no-repeat; }
	#Footer .left{ width: 550px; padding: 0 0 0 15px; }
	#Footer .right{ width: 300px; color: #55a3c7; text-align: right; padding:0 15px 0 0; }
	#Footer ul{ list-style: none none; }
	#Footer li{ display: inline; background: url(bullet_footer.gif) no-repeat 0 3px; padding: 0 7px 0 8px; }
	#Footer a{ color: #d1d1d1; text-decoration: none;  }
	#Footer a:hover{ color: #f0f0f0; text-decoration: underline; }


/* SIDEBAR */
.side h4{ margin: 0 0 7px 0; }
.sidenav, .news{ list-style: none none; background: url(h_dots.gif) repeat-x;  }
	.sidenav li, .news li{ display: block; margin: 0; padding:6px 0; background: url(h_dots.gif) repeat-x bottom; }
	.news li{ padding:9px 0;}
	.sidenav a{ display: block; padding: 0px 0 0px 21px; margin: 0; background: url(bullet_arrow.gif) no-repeat 0 1px; color: #848484; text-decoration: none; }
	* html .sidenav a{ display: inline-block; }
	.sidenav li.active{ background-color: #DDF0FA; }
	.sidenav li.active a, .sidenav a:hover{ color: #f18f2a; }

	.news a{ display: block; width: 100%; text-align: right; font-size:11px; }
	.news .date{ display: block; height: 16px; background: url(bullet_news.gif) no-repeat; padding: 0 0 0 15px; color: #449CC7; font-weight: bold; }
		
.side .box, .side .box_shaded{ float: left; padding: 14px 0 0 0; margin: 0 0 10px 0; width: 222px; background: url(bg_sidebox_head_shaded.gif) no-repeat; }
.side .boxwrap{ float: left; width: 222px; background: url(bg_sidebox.gif); }
.side .boxbody{ float: left; padding:0 10px 20px 12px; width: 200px; background: url(bg_sidebox_footer.gif) no-repeat bottom;  }
.side .box_shaded .boxbody{ padding: 0 10px 14px 12px; background-image: url(bg_sidebox_footer_shaded.gif); }
	
	
/* CONTENT */
#Visual h2{ color: white; font-size: 30px; font-weight: bold; padding: 21px 0 0 27px; letter-spacing: 1px; }
h3{ font-size: 15px; color: #449cc7; font-weight: bold; }
	h3.icon{ display: block; margin: 0px 0 -7px 0; line-height: 34px; }
	h3.icon img{ float: left; margin: 0 5px 0 0; }
	h3.sub{ background: url(ico_subtitle.gif) no-repeat left; padding:0 0 0 20px;}
h4{ font-size: 13px; color: #449cc7; font-weight: bold; margin:0 0 5px 0;}
a{ color: #f18f2a; }
a:hover,
#Content a:hover{ color: #fa5720; text-decoration: underline; }
p{ margin: 0 0 15px 0; line-height: 1.5em; }
	p.spread{ line-height: 2em; }
em{ color: #449cc7; font-style: normal; font-weight: bold; }
.small{ font-size: 11px; }
.dot{ margin: 0 0 13px 0; background: url(h_dots.gif) repeat-x; height: 1px; overflow: hidden; }
.border{ border: 6px solid #c3e5f7; }
.vivid{ color: #F0871B; }

.clear{ font-size: 1px; height: 1px; clear: both; line-height: 1px; }
.left{ float: left; }
.right{ float: right; }
.center{ margin: 0 auto; }
.tl{ text-align: left; }
.tr{ text-align: right; }
.tc{ text-align: center; }
.tj{ text-align: justify; }

ul{ line-height: 1.3em; }
ul.icons{ list-style: none; }
	ul.icons li{ background: url(ico_subtitle.gif) no-repeat 1px 3px; padding: 3px 0 3px 22px; }
ul.bullet{ list-style: none; }
	ul.bullet li{ background: url(bullet_arrow.gif) no-repeat 0 3px; margin: 0; padding: 3px 0 3px 18px; }

/* Boxes */
#Main .box{ float: left; width: 622px; margin: 0 0 10px 0; background: url(bg_box.gif) repeat-y; }
#Main .boxshade{ float: left; background: url(bg_box_shade.gif) no-repeat bottom; }
#Main .boxwrap{ float: left; padding: 20px 12px 8px 12px; width: 598px; background: url(bg_box_head.gif) no-repeat; }
	#Main .box h3{ color: #848484; margin:0 0 10px 0; }
	#Main .box h4{ font-size: 14px; margin: 0 0 7px 0; }
	#Main .box p{ margin: 0 0 9px 0; }
#Main .boxfooter{ float: left; width: 622px; height: 12px; overflow: hidden; background: url(bg_box_footer.gif) no-repeat; }
.boxbuttons{ float: left; width: 598px; height: 39px; padding:7px 12px 0 12px; background: #e0f2fb url(bg_box_buttons.gif) no-repeat; }	
.bluebox{ width: 622px; background: #e0f2fb url(bg_box_blue_footer.gif) no-repeat bottom; }	
	.bluebox .boxbody{ background: url(bg_box_blue_head.gif) no-repeat top; padding: 15px 10px; }
.addbox{ float:left; width: 625px; margin: 0 0 15px 0; background: white url(bg_boxadd_head.gif) no-repeat; }	
	.addbox .boxwrap{ float:left; width: 589px; padding:8px 18px; background: url(bg_boxadd_footer.gif) no-repeat bottom; }
	.addbox h3{ margin: 0 0 18px 0; }


/* Tables, grids */	
.grid{ list-style: none; padding: 0; margin: 0; }
.grid td{ padding: 7px 18px 7px 9px; }
	.grid .odd{ background: #F5F5F5; }
	.grid .color{ background: #E6F4FC; color:#0b5787 }
	.grid li{ display: block; padding: 7px 10px; margin: 0; }
	

/* Buttons */
a.btn{ display: block; height: 33px; background: none no-repeat top left; text-indent: -5000px; }
a.btn:hover{ background-position: 0 -33px; }
a.thinbtn{ display: block; height: 24px; background: none no-repeat top left; text-indent: -5000px; }
a.thinbtn:hover{ background-position: 0 -24px; }
	a.signup{ width:143px; background-image: url(btn_v_signup.gif); }
	a.order{ width: 144px; background-image: url(btn_v_order.gif); }	
	a.tourorder{ width: 142px; margin:11px 0 0 0; background-image: url(btn_tour_order.gif); }	
	a.examples{ width: 142px; background-image: url(btn_thin_examples.gif); }
	a.map{ width: 82px; background-image: url(btn_thin_map.gif); }
	a.back{ width: 92px; background-image: url(btn_goback.gif); }
	a.next{ width: 92px; background-image: url(btn_next.gif); }
	a.cancel{ width: 92px; background-image: url(btn_cancel.gif); }
	a.step3{ width: 92px; background-image: url(btn_step3.gif); }
	a.step4{ width: 92px; background-image: url(btn_step4.gif); }
	a.submit{ width:142px; background-image: url(btn_v_submit.gif); }
	
/* Forms */
form em{ font-size: 11px; }
	form em b, .red{ color: red; }
	form p{ line-height: 21px; }
form .left{ margin-right: 12px; }
.text{ border: 1px solid #C1C1C1; padding: 2px; }
input.text{ height: 16px; }
	.tx1{ width: 34px; background-image:url(bg_input_text1.gif); }
	select.tx1{ width: 54px; background-image: none; }
	.tx2{ width: 94px; background-image:url(bg_input_text2.gif); }
	select.tx2{ width: 100px; background-image: none; }
	.tx3{ width: 190px; background-image:url(bg_input_text3.gif); }
	select.tx3{ width: 204px; background-image: none; }
	.tx4{ width: 294px; background-image:url(bg_input_text4.gif); }
	.tx5{ width: 394px; background-image:url(bg_input_text5.gif); }
textarea.tx1{ display: block; width: 294px; height: 64px; background: url(bg_textarea_small.gif); overflow: auto; }	
textarea.tx5{ display: block; width: 584px; height: 144px; background: url(bg_textarea_large.gif); overflow: auto; }	
input.btn { background: none no-repeat top left; border: none; cursor: pointer; display: block; height: 24px; overflow: hidden; padding: 0; margin: 0 2px 0 0; text-indent: -9999px; width: auto; }	
input.btn{ font-size: 0px; line-height: 24px; }
	input.submit{ width: 82px; background-image: url(btn_submit.gif); }
#Login a{ float: left; font-size: 11px; text-decoration: none; margin:5px 0 0 0; }
#Login .text{ background: url(bg_input_login.gif) no-repeat; width: 190px; margin:0px 0 4px 0;}
input.radio{ position: relative; top: 1px; margin: 0 5px 0 0; }
table.form{ font-size: 11px; }
	.form th{ color: #449cc7; font-weight: bold; padding: 2px 10px 2px 0; }
	.form td{ color: #449cc7; padding: 3px 0px 3px 0; }


/* Visuals for secondary pages */
.visual{ width: 100%; margin: 0 0 15px 0; width: 622px; height: 181px; background: url(visual_affiliates.gif); position: relative; }
	.visual h3{ color: #666666; font-size: 24px; font-weight: bold; margin: 0 0 5px 0; padding: 0; }
	.visual h4{ font-size: 15px; margin: 0 0 4px 0; }
	.visual h3 b{ color: #449cc7; }
	.visual p{ line-height: 1.7em; margin:0 0 7px 0; }
	.visual a.btn{ position: absolute; right: 20px; bottom: 6px; width: 144px; }
	.vaff{ width:300px; height: 170px; padding:11px 43px 0 279px; }
	.v360{ width: 300px; height: 170px; padding: 11px 43px 0 279px; background: url(visual_360.gif); }
	.v360 .screenshot{ position: absolute; top: 14px; left: 18px; width: 244px; height: 151px; overflow: hidden; }
	.vhosting{ padding: 10px 20px 0 20px; width: 582px; height: 232px; background-image: url(visual_hosting.gif); }
		.vhosting .right{ width: 380px; padding: 7px 0 0 0; }
	.vmarketing{ width: 325px; height: 170px; padding: 11px 18px 0 279px; background: url(visual_marketing.jpg); }
		.vmarketing a.btn{ right: 115px; }
	.vservices{ width: 320px; height: 170px; padding: 11px 18px 0 284px; background: url(visual_services.jpg); }
		.vservices a.btn{ right: 115px; }
	.vsignup{ width:402px; height: 260px; padding:11px 10px 0 210px; background:url(visual_signup.jpg); }		
	.vtour{ height: 254px; padding: 15px 0; background: url(visual_tour.jpg); text-align: center; }
		.vtour *{ line-height:254px; }

/* Order page */
#Steps{ list-style: none; margin: 0 0 10px 0; padding: 6px 9px; width: 602px; height: 40px; background: url(bg_box_steps.gif) no-repeat; }
	#Steps li{ float: left; width:33px; height: 23px; padding: 7px 35px 0 0; margin:0 65px 0 0; font-size: 15px; font-weight: bold; background: url(ico_step1.gif) no-repeat right top; overflow:hidden; }
	#Steps li#s1{ background-image: url(ico_step1.gif); }
	#Steps li#s2{ background-image: url(ico_step2.gif); }
	#Steps li#s3{ background-image: url(ico_step3.gif); }
	#Steps li#s4{ background-image: url(ico_step4.gif); }
	#Steps li#s5{ background-image: url(ico_step5.gif); margin-right: 0; }
	#Steps li.active{ background-position: 38px -30px; }
	
a.examples{ float: right; margin: -34px 0 0 0; }	
#Examples .right{ margin: -12px 0 0 0; }
#OrderAddition{ float: right; width: 790px; padding: 20px 50px 30px 50px; background: #f3f3f3; border-top: 1px solid #dedede; }
#OrderMain{ float: right; width: 840px; padding: 10px 30px 30px 30px; }
#Ordering .info{ float: right; background: #E6F4FC; color: #0b5787; border: 1px solid #C8E7F8; padding: 12px 48px 12px 16px; font-weight: bold; }

/* Marketing page */
#Brands{ float:left; width:100%; list-style: none; margin: 0; padding:0 0 15px 0;}
	#Brands li{ float: left; width: 100%; clear: both; }
	#Brands li.div{ text-align: right; background:url(h_dots.gif) repeat-x 0 22px; }
	#Brands p{ margin:5px 0 0 0; }
	#Brands .left{ width: 154px; }
	#Brands .right{ width: 470px; }
	
/* Tour Process page */
#Tour{ list-style: none; }	
	#Tour li{ float: left; width: 302px; height: 147px; margin: 0 15px 17px 0; background: url(bg_box_tour.gif) no-repeat; position: relative; }
	#Tour li.right{ float: left; margin-right: 0; }
	#Tour img.step{ position: absolute; left: -6px; top: -1px; }
	#Tour h3{ margin: 8px 0 30px 34px; }
	#Tour p img{ float: left; margin: 0 5px 0 7px; }
	#Tour p span.right{ width: 200px; padding: 0 15px 0 0; }
