/* RESET
-------------------------------------------------------------- */
html, body, div, span, object, iframe, 
h1, h2, h3, h4, h5, h6, p, blockquote, pre, 
a, abbr, acronym, address, big, cite, code, del, dfn, em, 
img, ins, kbd, q, samp, small, strike, strong, sub, sup, 
tt, var, dl, dt, dd, ol, ul, li, 
fieldset, form, label, legend, 
table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; background: transparent; }
table { border-spacing: 0; border-collapse: collapse; }
caption, th, td { text-align: left; font-weight: normal; }
blockquote, q { quotes: none; }
:focus { outline: none; }


/* BASIC
-------------------------------------------------------------- */
body { font-family: "Helvetica Neue", Helvetica, Arial, Geneva, sans-serif; font-size: 13px; 
       background: #FFFFFF url(images/page_grad.png) repeat-x;
       line-height: 1.4em; color: rgb(40, 40, 40); }
img { -ms-interpolation-mode: bicubic; }


/* TYPE
-------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 { letter-spacing: -0.04em; margin:1.0em 0 0.6em 0; line-height:100%; }
h1 { font-size: 2.1em; }
h2 { font-size: 1.7em; color: rgb(50,50,50); }
h3 { font-size: 1.7em; color: rgb(50, 50, 50); font-weight:normal;}

a { color: rgb(25, 114, 175); text-decoration: none; }
a:hover { text-decoration: underline; }

p { margin: 0.5em 0 1em; font-size: 1.2em; line-height: 1.4em; }
ul, ol { margin: 0.5em 0 1em; padding: 0 18px; }
li { font-size: 1.1em; }
blockquote { margin: 0.5em 0 1em; padding-left: 10px; border-left: 1px solid rgb(230, 230, 230); }
strong { font-weight: bold; }
em { font-style: italic; }

dl { margin: 0.5em 0 1em; }
dt { font-weight: bold; }
dd { margin: 0.5em 0; }

table { margin: 0.5em 0 1em; width: 100%; font-size: 1em; }
th { padding: 5px 0; font-weight: bold; color: rgb(150, 150, 150); }
td { padding: 5px 0; vertical-align:top; }
tr.submit { border: none; }

hr { border: none; border-bottom: 1px solid rgb(230, 230, 230); }


/* FORMS
-------------------------------------------------------------- */
label { vertical-align: top; }
input, textarea, button { margin-top: -5px; padding: 5px; border: 1px solid rgb(180, 180, 180); font-size: 1.1em; line-height: 1.3em; }
input, textarea { background: rgb(255, 255, 255) url(/media/images/field_bg.gif) repeat-x; color: rgb(80, 80, 80); }
input[type=file] { background: none; padding: 0; border: none; }
input[type=hidden] { display: none; }
button:hover, .button:hover { background-position: 0 -640px; }
button:active, .button:active { background-position: 0 -550px; -webkit-box-shadow: rgba(0, 0, 0, .4) 0px 0px 2px; }
button::-moz-focus-inner { border: 0; }
fieldset { margin:0 0 15px 0; padding:25px; border: 1px solid rgb(230, 230, 230); 
           -webkit-border-radius: 3px; -moz-border-radius: 3px; background-color:#FFFFFF; }
form p { color: rgb(150, 150, 150); margin-bottom:10px; display:block; }
form p:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
form label { display: block; float: left; width: 13%; font-weight: normal; color: rgb(40, 40, 40); }
form p label { width: 220px; }
form p textarea { height:100px; width:300px; }
form p input { width: 300px; float:left; }
form button { float:right; }
fieldset {display:inline;}

.errors { color: #ff0000; display: block; clear:left; font-size:0.8em;}
.help_text { font-style: italic; clear:left; display: block; font-size:0.7em; color: rgb(100, 100, 100); }

.howto_serial { width:100%; text-align:right; margin:-15px 0 5px 0; font-size:0.9em; }

.add_device_fieldset { display:block }
.add_device_fieldset label { width:140px; }
.add_device_fieldset input[type=text] { width:200px; }
.add_device_fieldset .add_computer { clear:both; margin:20px 0 0 0; }
.add_device_fieldset button { margin:10px 0 0 0; float:right; }
.computer_inline { margin:0 }
.computer_inline:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.computer_inline .errors { margin:0 0 0 140px; }
.computer_inline .help_text { margin:0 0 0 140px; }


/* MAIN ELEMENTS
-------------------------------------------------------------- */
#header { padding:8px 0; background-color:#000000; border-bottom:1px solid rgb(180,180,180); margin:0; }
#header img { float:left; margin:4px 0;}
#header .inner { width:800px; margin:0 auto; padding:0; }
#header .inner:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
#header ul { background-color:#333333; list-style: none; float:right; padding:5px; margin:25px 0 0 0; -webkit-border-radius: 4px; -moz-border-radius: 4px;}
#header ul li { float:left; margin:0 8px; }
#header ul li a {color:#EEEEEE; }

#main { width:800px; margin:15px auto 0; } 
#main:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }

#footer { color:rgb(100,100,100); font-size:0.8em; width: 800px; clear:both; margin:8px auto; border-top:1px solid rgb(180,180,180) }
#footer span {  float:right; }

#leftcol { width:580px; float:left; }
#rightcol { width:200px; float:right; margin-top:-15px; }
#rightcol ul { background-color:#EEEEEE; list-style: none; padding:5px; margin:25px 0 0 0; -webkit-border-radius: 4px; -moz-border-radius: 4px;}


/* OTHER ELEMENTS
-------------------------------------------------------------- */
.divide { border-bottom:1px solid rgb(210,210,210); padding-bottom:15px; margin-bottom:15px; }

.banner { width:100%; padding:8px; text-align:center; background-color:#f4ef9d; font-size:1.2em; color:#39395f ;}

.feature { position:relative; padding:35px 0 20px 260px; height:220px; } 
.feature img { position:absolute; left:-75px; top:5px; } 
.feature h2 { margin-bottom:20px; }

.download { float:right; margin-top:-10px;}

.info { width:390px; height:130px; margin-bottom: 15px; }
.info h3 { color:rgb(60,60,60); margin-bottom:8px; }
.info img { float:right; margin-left:10px; }
.info.right { float:right; }
.info.left { float:left; }

.devices { color:rgb(40,40,40); }
.devices th { padding:5px 8px; background-color:rgb(90,90,90); color:rgb(240,240,240); }
.devices td { padding:5px 8px; }

.order { width:100%; font-size:1.2em;}
.order th { padding:5px 8px; background-color:rgb(90,90,90); color:rgb(240,240,240); }
.order td { padding:8px; vertical-align:middle; border-bottom:1px solid rgb(220,220,220); }
.order_total { font-size:1.9em; float:right; width:200px; font-weight:bold; padding:0; border-bottom:1px solid rgb(220,220,220); }
.pay_button { clear:right; margin:0 0 40px 0; width:200px; }

.voucher_form { float:left; width:250px; padding:0; margin:20px 0 0 0; }
.voucher_form p { padding:0; margin:0;}
.voucher_form input { width:165px; margin:0; }
.voucher_form fieldset { padding:20px; }
.voucher_form button { float:left; clear:left; margin:0; padding:5px 15px 5px 0; }

.updates_title { float:left; margin-top:20px; }
.right_link { float:right; background-color:rgb(40,40,40); color:rgb(240,240,240); padding:3px 7px; margin:20px 0 0 8px;
              -webkit-border-radius: 4px; -moz-border-radius: 4px;}
.thumb { border:1px solid rgb(100,100,100); }

.map { clear:both; width:100%; height:400px; margin-bottom:10px; background-color:#EFEFEF; border:1px solid rgb(100,100,100); }
.map p { text-align:center; }
.packet { font-size:1.2em; border-bottom: 1px solid rgb(190,190,190); padding:4px 0; }
.packet:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.packet_img { border:2px solid rgb(100,100,100); }


.button { 
    border:0; 
    cursor:pointer; 
    padding:7px 25px 7px 0;
    text-align:center;
    background:url(/media/images/button_right.png) right no-repeat; 
    font-size:1.3em; 
}
.button span { 
    position:relative; 
    display:block; 
    white-space:nowrap; 
    padding:0 0 0 20px;
    height:35px; 
    line-height:35px;
    background:url(/media/images/button_left.png) left no-repeat;
    color:rgb(40,40,40); 
}
.button:hover { text-decoration: none; background:url(/media/images/button_right_hover.png) right no-repeat; }
.button:hover span { background:url(/media/images/button_left_hover.png) left no-repeat; }

.blogtitle {margin-top:0.5em;}
.date { color:rgb(180,180,180); text-transform:italic; font-size:1.0em; }
