@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: #fff url("../images/main-bg.png") repeat-y; width: 980px; float: left; border: solid 2px #d2fd00 }

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

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




/* 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; margin: 0; padding: 0; position: absolute; top: 70px; left: 300px }

ul#tabs li   { color: #000; font-weight: bold; float: left }

ul#tabs li a    { font-size: 10pt; font-family: Verdana; background-color: #fff; text-align: center; display: block; margin-right: 5px; margin-bottom: 0; margin-left: 0; width: 100px; height: 27px; overflow: hidden; border-top: 2px solid #d2fd00; border-right: 2px solid #d2fd00; border-left: 2px solid #d2fd00; filter: alpha(opacity=60); opacity: 0.6   }

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

body#home-page ul#tabs li#home a,
body#orders-page ul#tabs li#orders a,
body#link-page ul#tabs li#link a,
body#howto-page ul#tabs li#howto a,
body#openvpn-page ul#tabs li#openvpn a, 
body#contactus-page ul#tabs li#contactus a {
	opacity: 1.0;
	filter: alpha(opacity=100);
}

ul#tabs li#home a  { color: #000; font-size: 9pt; font-family: Verdana }
ul#tabs li#orders a  { color: #000; font-size: 9pt; font-family: Verdana }
ul#tabs li#link a  { color: #000; font-size: 9pt; font-family: Verdana }
ul#tabs li#howto a  { color: #000; font-size: 9pt; font-family: Verdana }
ul#tabs li#openvpn a  { color: #000; font-size: 8pt; font-family: Verdana }
ul#tabs li#contactus a  { color: #000; font-size: 9pt; font-family: Verdana }

div#footer-links   { color: #666; font-size: 8pt; font-family: Verdana; line-height: 22pt; text-align: center; 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    { display: none; text-align: center; position: relative; top: 25px; width: 980px; height: 68px }
div#footer-logos img   { padding-right: 15px; padding-left: 15px }
/*END HOMEPAGE*/


/*contact us */

#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 }

/*my account */

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

/*login */
#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 }

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

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

div#login-form a  { color: #fff; font-size: 11px }

div#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 }

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

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

#box-form-changepassword label  {margin-top: 8px; float: left; display: inline; color: #333; font-size: 12pt; font-family: Verdana; width: 200px; }
#box-form-changepassword input    { cursor: text; margin-top: 10px; border: solid 1px #3a93d4 }
#box-form-changepassword input[type='submit']   { color: #fff; background-color: #39f; cursor: pointer; border: solid 1px #3a93d4 }
#box-form-changepassword .submit   { color: #fff; background-color: #39f; cursor: pointer; margin-right: 100px; margin-left: 50px }
#box-form-changepassword .inputerror  { border: solid 1px #f30 }
#box-form-erreur h2
  { color: #f30; font-size: 10pt; font-family: Verdana }
  
  
#box-form-login label  {margin-top: 8px; float: left; display: inline; color: #333; font-size: 12pt; font-family: Verdana; width: 200px; }
#box-form-login input    { cursor: text; margin-top: 10px; border: solid 1px #3a93d4 }
#box-form-login input[type='submit']   { color: #fff; background-color: #39f; cursor: pointer; border: solid 1px #3a93d4 }
#box-form-login .submit   { color: #fff; background-color: #39f; cursor: pointer; margin-right: 100px; margin-left: 50px }
#box-form-login .inputerror  { border: solid 1px #f30 }
#box-form-login h2
  { color: #f30; font-size: 10pt; font-family: Verdana }

#box-form-good h2
   { color: #0c0; font-size: 10pt; font-family: Verdana }

table#orders-table   { margin-top: 15px; width: 760px }
  
#orders-table .top  { color: #fff; font-family: Verdana; background-color: #1687dd }
#orders-table .line  { font-family: Verdana; }
#orders-table .line:hover  { color: #fff; font-family: Verdana; background-color: #1687dd }

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.link
 { cursor: pointer; padding-left: 10px; width: 250px; border: solid 1px #fff }

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

#box-form-changelink input    { cursor: text; margin-top: 10px; border: solid 1px #3a93d4 }
#box-form-changelink input[type='submit']   { color: #fff; background-color: #39f; cursor: pointer; border: solid 1px #3a93d4 }
#box-form-changelink .submit   { color: #fff; background-color: #39f; cursor: pointer; margin-right: 100px; margin-left: 50px }



div.link_confirm
  { background-color: #e9f3fa; margin-top: 5px; margin-bottom: 20px; padding-left: 10px; width: 250px; 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 }

form#orders-form  { margin-bottom: 0 }