@import url(reset.css);
@import url(generic.css);

/* Page Layout */

body  { background: url("../images/body-bg.png") repeat-x 50% top }

div#wrapper {
	margin: 0 auto;
	width: 980px;
}

div#container  { position: absolute; width: 980px }

div#top  { background: url("../images/top.jpg") no-repeat; width: 980px; height: 97px; float: left }

div#main {
	background: url(../images/main-bg.png) repeat-y;
	float: left;
	width: 980px;
}

div#main-start {
	width: 980px;
	height: 15px;
	background: url(../images/start-bg.png) no-repeat;
}

div#main-content     { margin: 10px 0 0 23px; width: 935px }

div#main-end   { background: url("../images/main-ft2.png") no-repeat 50% bottom; margin-top: 5px; width: 980px; height: 15px; clear: both }



/* Links */

a#logo-link {
	display: block;
	height: 80px;
	width: 305px;
	position: absolute;
	top: 5px;
	left: 0;
	z-index: 10;
}


/* Main Tabs */

ul#tabs {
	list-style: none;
	padding: 0;
	margin: 0;
	position: absolute;
	left: 423px;
	top: 62px;
}

ul#tabs li {
	float: left;
}

ul#tabs li a {
	display: block;
	width: 125px;
	height: 38px;
	margin: 0 2px 0 0;
	text-indent: -9999px;
	overflow: hidden;
	opacity: 0.4;
	filter: alpha(opacity=40);
}

ul#tabs li a:hover {
	opacity: 0.7;
	filter: alpha(opacity=70);
}

body#home-page ul#tabs li#home a,
body#features-page ul#tabs li#features a,
body#signup-page ul#tabs li#signup a,
body#about-page ul#tabs li#about a {
	opacity: 1.0;
	filter: alpha(opacity=100);
}

ul#tabs li#home a {
	background: url(../images/tab-home.png) no-repeat;
}

ul#tabs li#about a {
	background: url(../images/tab-about.png) no-repeat;
}

ul#tabs li#signup a {
	background: url(../images/tab-signup.png) no-repeat;
}

ul#tabs li#features a {
	background: url(../images/tab-features.png) no-repeat;
}

/*box-large-home*/
div#box-large-home     { background: url("../images/box-large-bg.png") no-repeat; width: 933px; height: 207px }

#box-large-home h1    { color: #1687dd; font-size: 20pt; font-family: Verdana; margin-top: 0; padding-top: 25px; padding-left: 170px }

#box-large-home ul li:before {content: " "}
#box-large-home ul        { padding-top: 10px; padding-left: 180px }
#box-large-home li     { font-size: 11pt; font-family: Verdana; line-height: 11pt; list-style: none url("../images/10x10bleu.gif"); margin-top: 5px; padding-left: 15px }

#box-large-home h2   { font-size: 12pt; font-family: Verdana; margin-top: 0; padding-top: 5px; padding-left: 170px }

#register-box            { position: absolute; top: 245px; left: 682px; width: 249px; height: 60px }
a.register-button    { background-image: url("../images/button-register.jpg"); text-indent: -9999px; display: block; width: 249px; height: 55px; overflow: hidden }

/*HOME PAGE CSS*/
.box-double-home   { margin-top: 18px; width: 935px; height: 210px }
.box-one-home  { width: 458px; height: 208px; float: left; }

div#home-ads  { padding-top: 29px; padding-bottom: 29px; padding-left: 200px }

div#bg-free-vpn    { background-image: url("../images/bg-free-vpn.jpg") }
div#bg-unlimited-vpn   { background-image: url("../images/bg-unlimited-vpn.jpg"); margin-left: 17px }
div#bg-L-vpn  { background-image: url("../images/bg-L-vpn.jpg") }
div#bg-XL-vpn  { background-image: url("../images/bg-XL-vpn.jpg"); margin-left: 17px }

.box-one-home h2   { color: #d0fa00; font-size: 18pt; font-family: "Trebuchet MS"; padding-top: 13px; padding-left: 170px }
.box-one-home ul li:before {content: " "}
.box-one-home ul         { padding-top: 3px; padding-left: 157px }
.box-one-home li     { font-size: 11pt; font-family: Verdana; line-height: 11pt; list-style: none url("../images/10x10vert.gif"); margin-top: 5px; padding-left: 15px }

.learnmore-box             { background-image: url("../images/button-learnmore.jpg"); margin-top: -11px; margin-left: 172px; width: 127px; height: 32px }
a.learnmore-button     { text-indent: -9999px; display: block; width: 127px; height: 27px; overflow: hidden }

div#footer-links    { color: #666; font-size: 8pt; font-family: Verdana; line-height: 22pt; text-align: center; display: block; width: 980px; height: 35px }

div#footer-links a
{
  color: #666;
  margin: 0 5px;
  
}

div#footer-links a:hover
{
  color: #1883d9;
  background: transparent url(../images/underline.png) 0 bottom repeat-x;
}


div#footer-logos    { text-align: center; display: none; position: relative; top: 25px; width: 980px; height: 68px }
div#footer-logos img   { padding-right: 15px; padding-left: 15px }
/*END HOMEPAGE*/

/*FEATURES PAGE */

div#features-head {}
#features-head h1 { color: #1687dd; font-size: 20pt; font-family: Verdana }
#features-head h2 { color: #68776c; font-size: 12pt; font-family: Verdana }

.features-ads  { padding-top: 5px; padding-bottom: 5px; position: relative; left: -5px }

div.features-box   { margin-bottom: 12px; height: 140px; border-top: 1px solid #3a93d4 }
.features-box h2  { font-size: 11pt; font-family: Verdana; background-repeat: no-repeat }
.features-box img  { margin: 10px; }

a.signup  { font-weight: bold; background: url("../images/arrow.gif") no-repeat right center; padding-right: 12px; padding-bottom: 3px; zoom: 1 }

/*ABOUT US PAGE*/

div.about-box    { margin-bottom: 12px; height: 574px; border-top: 1px solid #3a93d4 }
.about-box h2  { font-size: 11pt; font-family: Verdana; background-repeat: no-repeat }
.about-box img  { margin: 10px; }

/*sign up*/
div#box-large-signup      { background: url("../images/box-signup-bg.jpg") no-repeat; width: 933px; height: 152px }

#box-large-signup h1    { color: #1687dd; font-size: 20pt; font-family: Verdana; margin-top: 0; padding-top: 25px; padding-left: 25px }

#box-large-signup ul li:before {content: " "}
#box-large-signup ul         { padding-top: 15px; padding-left: 25px }
#box-large-signup li       { color: #666; font-size: 10pt; font-family: Verdana; line-height: 10pt; list-style-type: square; list-style-position: outside; margin-bottom: 5px; padding-left: 15px }

.right  { }
.left  { margin-right: 70px; float: left }

div#signup-ads    { padding-top: 25px }

div#box-account-type   { padding-left: 25px; width: 380px; float: left }
#box-account-type h2 {color: #1687dd}
#box-account-type .n  { color: #1672dd; padding-right: 5px }
#box-account-type input {margin-right: 5px}
#box-account-type ul li:before {content: " "}
#box-account-type li { color: #666; font-size: 10pt; font-family: Verdana; line-height: 10pt; list-style-type: square; list-style-position: outside; margin-bottom: 5px; padding-left: 10px }

div#box-form { width: 500px; float: right; }
#box-form h2 {color: #1687dd}
#box-form .n  { color: #1672dd }

div.link
 { cursor: pointer; padding-left: 10px; width: 250px; border: solid 1px #fff }

div.selected { background-color: #e9f3fa;border: solid 1px #3a93d4 }

#box-form label  {margin-top: 8px; float: left; display: inline; color: #333; font-size: 12pt; font-family: Verdana; width: 200px; }
#box-form input    { cursor: text; margin-top: 10px; border: solid 1px #3a93d4 }
#box-form input[type='submit']   { color: #fff; background-color: #39f; cursor: pointer; border: solid 1px #3a93d4 }
#box-form .submit  { color: #fff; background-color: #39f; cursor: pointer }
#box-form .inputerror  { border: solid 1px #f30 }
#box-form-erreur h2
  { color: #f30; font-size: 10pt; font-family: Verdana }
  
/* invoice*/  
div#box-invoice {}
#box-invoice h2 {color: #1687dd}
#box-invoice .n  { color: #1672dd }
#box-invoice h3  { color: #333 }

div.link_confirm
  { background-color: #e9f3fa; margin-top: 5px; margin-bottom: 20px; padding-left: 10px; width: 250px; border: solid 1px #3a93d4 }

div.period
  { background-color: #e9f3fa; padding-left: 10px; width: 250px; border: solid 1px #3a93d4 }
.period li  { margin-bottom: 0; padding-bottom: 0 }

div.link_confirm_ref
  { background-color: #e9f3fa; margin-top: 5px; width: 350px; margin-bottom: 20px; padding-left: 10px; border: solid 1px #3a93d4 }

div#box-form-reference { width: 500px; float: right; }
#box-form-reference h3  { color: #333 }
#box-form-reference ul li:before {content: " "}
#box-form-reference li  { color: #666; font-size: 10pt; font-family: Verdana; line-height: 10pt; list-style-type: square; list-style-position: outside; margin-top: 5px; padding-left: 10px }
input[type='image']  { cursor: auto }

div.privatepolicy   {}
.privatepolicy  h2  { font-size: 11pt; font-family: Verdana; background-repeat: no-repeat }
.privatepolicy  b   { font-weight: bold }
.privatepolicy  img  { margin: 10px; }

div#features-head {}
#contactus-head h1 { color: #1687dd; font-size: 20pt; font-family: Verdana }
#contactus-head h2  { color: #68776c; font-size: 12pt; font-family: Verdana; line-height: 14pt }

div.contactus   { margin-bottom: 12px; height: 85px; border-top: 1px solid #3a93d4 }
.contactus h2 { font-size: 11pt; font-family: Verdana; }
.contactus h3  { font-size: 8pt; font-family: Verdana }


#login  { background: #333e00; position: absolute; right: 0; width: 470px; height: 40px; -moz-border-radius-bottomleft: 10px; -moz-border-radius-bottomright: 10px; filter: alpha(opacity=30); opacity: 0.3 }

form#login-form {
	position: absolute;
	right: 20px;
	top: 10px;
	font-size: 11px;
	font-weight: bold;
	color: #fff;
}

form#login-form a  { color: #d2fd00; text-decoration: none; margin-right: 5px; padding-right: 10px; border-right: 1px solid #d2fd00 }

form#login-form a:hover {
	text-decoration: underline;
}

form#login-form input.text  { color: #000; padding: 2px; width: 100px; border: solid 2px #d2fd00 }

form#login-form input  { font-size: 10px; font-family: Verdana; font-weight: normal; line-height: 10px; }
form#login-form input.submit  { cursor: default }