/*
 * Project:		Tonnect
 * Date:		2009/07/23
/* ---------------------------------------- */

* { margin: 0; padding: 0; }

html { min-height: 100%; margin: 0 0 1px; font-size: 100.01%; }
body { background: #1f1009; font-size: 62.5%; }

@media only screen and (max-device-width: 480px) { html { -webkit-text-size-adjust: none; } }

body, textarea, input, select, option, button { color: #000; font-family: Verdana,Geneva,sans-serif; line-height: 1.5; }
li, dt, dd, p, th, td, caption, pre { font-size: 1.1em; }
ul, ol, dl, p, table, pre, h1, h2, h3, h4, h5, h6 { margin-bottom: 15px; }

a { color: #f78b3a; text-decoration: none; }
a:hover, a:focus, a:active { text-decoration: underline; }

ul, ol, dd, blockquote { padding-left: 40px; }
ul ul, ol ol, ul ol, ol ul { margin-bottom: 0; }
li *, li p, li li, dt *, dd *, p *, th *, td * { font-size: 1em; }

img { border: none; -ms-interpolation-mode: bicubic; }
pre { font-family: "Courier New",monospace; white-space: pre-wrap; }
table { border-collapse: collapse; border-spacing: 0; }
button { overflow: visible; padding: 0 10px; cursor: pointer; } button::-moz-focus-inner { padding: 0; border: none; }

hr { overflow: hidden; height: 1px; margin: 15px 0 !important; margin: -5px 0 8px; padding: 0; border: none; background-color: #ccc; color: #ccc; }
*:first-child+html hr { margin: -7px 0 8px !important; }

.offset { position: absolute !important; left: -10001px !important; overflow: hidden !important; }

/* LAYOUT
------------------------------------------- */

#root { width: 980px; margin: 0 auto; }
 #top { }
  #top p.intro { margin: 0; padding: 10px 0; color: #492d29; text-align: center; }
  #top div.top-inner { position: relative; overflow: hidden; width: 100%; height: 376px; background: #5d4235 url(/static/images/background-top.png) no-repeat; }
   #logo { position: absolute; width: 363px; height: 380px; left: 22px; top: 15px; background: url(/static/images/logo-a.png) no-repeat; }
    #logo a { position: absolute; left: 45px; top: 120px; overflow: hidden; width: 270px; height: 140px; text-indent: -10001px; }
   #skip-links { position: absolute; top: 0; left: -10001px; list-style: none; margin: 0; padding: 0; }
    #skip-links li a:focus, #skip-links li a:active { display: block; position: absolute; left: 10091px; top: 30px; z-index: 10001; width: 200px; margin: 15px 0 0 15px; padding: 2px 0; background: #333; color: #fff; text-align: center; text-decoration: none; }
   #nav { position: absolute; right: 30px; bottom: 0; list-style: none; margin: 0; padding: 0; }
    #nav li { float: left; }
     #nav li a { float: left; overflow: hidden; height: 35px; background: url(/static/images/nav-a.png) 0 -10px no-repeat; text-indent: -10001px; }
     * html #nav li a { height: 34px; }
     #nav li.tonnect a { width: 172px; background-position: 0 -10px; } #nav li.tonnect a:hover, #nav li.tonnect a:focus, #nav li.tonnect a:active, #nav li.tonnect a.active { background-position: 0 -55px; }
     #nav li.beta a { width: 172px; background-position: -172px -10px; } #nav li.beta a:hover, #nav li.beta a:focus, #nav li.beta a:active, #nav li.beta a.active { background-position: -172px -55px; }
     #nav li.forums a { width: 117px; background-position: -344px -10px; } #nav li.forums a:hover, #nav li.forums a:focus, #nav li.forums a:active, #nav li.forums a.active { background-position: -344px -55px; }
     #nav li.faq a { width: 96px; background-position: -461px -10px; } #nav li.faq a:hover, #nav li.faq a:focus, #nav li.faq a:active, #nav li.faq a.active { background-position: -461px -55px; }
     #nav li.contact a { width: 116px; background-position: -557px -10px; } #nav li.contact a:hover, #nav li.contact a:focus, #nav li.contact a:active, #nav li.contact a.active { background-position: -557px -55px; }
     #nav li.register a { width: 128px; background-position: -673px -10px; } #nav li.register a:hover, #nav li.register a:focus, #nav li.register a:active, #nav li.register a.active { background-position: -673px -55px; }
     #nav li em { position: absolute; left: -10001px; top: -10001px; }
   #top p.follow { position: absolute; right: 29px; bottom: 27px; z-index: 15; width: 290px; height: 120px; margin: 0; background: url(/static/images/twitter-a-bird.png) no-repeat; }
    #top p.follow a { display: block; overflow: hidden; width: 290px; height: 110px; text-indent: -10001px; }
   #twitter { position: absolute; right: 30px; top: 25px; z-index: 10; overflow: hidden; width: 486px; height: 200px; padding: 34px 34px 54px; background: url(/static/images/twitter-a.png) no-repeat; color: #fff; }
 #content { margin: 0 0 10px; background: #ebe9e9 url(/static/images/background-content.png) no-repeat; }
  #content div.content-inner { overflow: hidden; width: 900px; padding: 25px 40px 10px; background: url(/static/images/background-bottom.png) 0 100% no-repeat; }
 #footer { padding: 0 0 5px; color: #93837b; text-align: center; }
  #footer p.seo { margin-bottom: 30px; color: #492d29; text-align: center; }
  #footer ul { list-style: none; margin: 0 0 15px; padding: 0; text-align: center; }
   #footer ul li { display: inline; padding: 0 10px 0 15px; background: url(/static/images/sep-a.gif) 0 50% no-repeat; font-size: 1.3em; }
   #footer ul li:first-child,
   #footer ul li.first { padding-left: 10px; background: none; }
    #footer ul li a { color: #ff8025; text-decoration: none; }
   
/* GENERAL
------------------------------------------- */

/* headers */

h1, h2, h3, h4, h5, h6 { line-height: 1.1; }
h1 { font-size: 2.2em; font-weight: normal; }
h2 { font-size: 1.8em; font-weight: normal; }
h3 { font-size: 1.6em; }
h4 { font-size: 1.4em; }
h5 { font-size: 1.2em; }
h6 { font-size: 1.0em; }

/* containers */

div.four-a { overflow: hidden; width: 100%; margin: 0 0 35px; padding: 0 0 25px; background: url(/static/images/sep-b.gif) 50% 100% no-repeat; }
 div.four-a div.item { float: left; width: 200px; margin: 0 0 0 33px; text-align: justify; }
 div.four-a div.item:first-child,
 div.four-a div.first { margin-left: 0; }
  div.four-a div.item h2 { overflow: hidden; width: 200px; height: 92px; margin: 0 0 5px; background: url(/static/images/four-a.png) no-repeat; text-indent: -10001px; }
  div.four-a div.item h2.maintenance { background-position: 0 0; }
  div.four-a div.item h2.social { background-position: -200px 0; }
  div.four-a div.item h2.easy { background-position: -400px 0; }
  div.four-a div.item h2.scale { background-position: -600px 0; }

/* tables */

table { }
 table th, table td { padding: 5px 10px; border: 1px solid #ccc; }
 
/* paragraphs */

p.featured-a { color: #f57f2a; font-size: 1.5em; font-weight: bold; line-height: 1.3; text-align: center; }
 
/* other */

.right { display: inline; float: right; margin: 0 0 10px 15px; }
.left { display: inline; float: left; margin: 0 15px 10px 0; }
 .left img, .right img { float: left; }


/* ELEMENTS
------------------------------------------- */