@charset "utf-8";

* {margin: 0; padding: 0;}
a {color: #36C;}
a:hover {color: #39F;}
a:active, a:focus {outline: none;}
img {border: none;}

body {background-color: #EEF0F3; font-family: Arial, Helvetica, sans-serif; font-size: 12px;}

div.container {display: block; width: 980px; margin: 0 auto;}

div#bg-wrap {display: block; margin: 0 auto; width: 980px; padding-top: 60px;}
div#content {display: block; margin: 0 auto; width: 970px; border: 3px solid #E8EAED; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px;}

div#bg-wrap.main {width: 980px; padding-top: 30px;}
div#content.main {width: 960px; margin-bottom: 0px;}
div.main {width: 960px;}

div#content div.container {background-color: #fff; border: 1px solid #CACCD2; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; z-index: 1; position: relative;}

div#content div.container div.wrapper {display: block; margin: 20px; overflow: visible;}

div#header {display: block; overflow: auto; margin: 0px 0 20px 0; padding: 10px 0 25px 0; border-bottom: 1px solid #ccc;}
div#header a.logo {display: block; float: left;}

h1.heading {display: block; width: 550px; font-size: 30px; color: #333; font-weight: bold; line-height: 38px; margin: 40px 0 30px 0; letter-spacing: -1px;}
h2.heading {display: block; width: 550px; font-size: 15px; color: #333; font-weight: normal; line-height: 26px; margin-bottom: 30px;}

img.intro {display: block; float: right; margin-top: 20px;}


div#content form label {display: block; border: 3px solid #eee; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; margin-bottom: 15px; float: left; position: relative;}
div#content form input.txt, div#content form textarea.txt {display: block; width: 682px; border: 1px solid #ccc; padding: 10px; font-size: 16px; color: #444; font-weight: bold; background-color: #fff; font-family: Arial, Helvetica, sans-serif;}
div#content form input.txt:focus, div#content form textarea.txt:focus {background-color: #fff; border-color: #39F;}
input#button {display: block; width: 310px; text-align: center; font-size: 20px; font-family: Arial, Helvetica, sans-serif; font-style: normal; color: #fff; font-weight: bold; margin: 5px 0 0 0; background: url(images/button-bg.png) 0 0 repeat-x; border: 1px solid #4F8711; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; padding: 12px 20px 13px 20px; cursor: pointer; float: left; text-decoration: none;} 
input#button:hover {background: url(images/button-bg.png) 0 -50px repeat-x;}
div#content form textarea.txt {height: 100px;}
input#button {padding: 9px 20px;}

a.button-more {display: block; float: left; width: 195px; height: 53px; background: url(images/button-more.png) 0 0 no-repeat; margin-right: 25px;}
a.button-more:hover {background: url(images/button-more.png) 0 -53px no-repeat;}

a.button {display: block; float: left; width: 230px; height: 53px; background: url(images/button.png) 0 0 no-repeat;}
a.button:hover {background: url(images/button.png) 0 -53px no-repeat;}

small.anote {display: block; margin: 0; color: #666; font-size: 11px; clear: both; width: 350px; text-align: center;}

a.logout {display: block; float: right; width: 50px; text-align: right; padding: 0 20px 0 0; background: url(images/logout.gif) right center no-repeat; margin: 13px 1px 0 0;}

ul#listings {display: block; width: 710px; clear: both; float: left; margin: 30px 0 0 0; list-style: none; font-size: 14px;}
ul#listings li {display: block; border-top: 1px dashed #ccc; padding: 17px 0;}
ul#listings li:hover {background: #f6f6f6;}
ul#listings li span.date, ul#listings li span.tools {float: right; color: #999; margin-left: 5px; margin-right: 1px;}
ul#listings li span.tools a {display: block; width: 16px; height: 16px; margin-left: 5px; float: left;}
ul#listings li span.tools a.edit {background: url(images/edit.gif) 0 0 no-repeat;}
ul#listings li span.tools a.delete {background: url(images/delete.gif) 0 0 no-repeat;}

small.note {display: block; font-size: 12px; margin: 0 0 20px 0;}

form label.small-field {float: left; margin-right: 10px;}
form label small {position: absolute; left: 0; bottom: -17px; width: 60px; text-align: center; font-size: 11px; color: #333;}

#file_browse_wrapper a {display: block; width: 75px; height: 75px; background: url(images/addpic.gif) 0 0 no-repeat;}
#file_browse_wrapper a:hover {background: url(images/addpic.gif) 0 -75px no-repeat;}
#file_browse_wrapper a:hover img {display: none;}
#file_browse_wrapper a img {border: none; margin: 5px 0 0 5px; height: 65px; width: 65px;}
#file_browse_wrapper a img.hidden {display: none;}

a.cancel {display: block; width: 30px; float: right; margin: 10px 20px 0 0;}

div#left {display: block; width: 410px; float: left;}
div#right {display: block; width: 260px; float: right; margin-right: 30px;}

div#left p {display: block; font-size: 14px; line-height: 20px; margin: 20px 0 30px 0;}

div#left div.layout-wrap {display: block; position: relative; width: 300px; height: 70px; margin: 10px 0 20px 0; background: url(images/layout.gif) 80px 0 no-repeat;}
div#left div.layout-wrap input.full {position: absolute; top: 1px; left: 60px;}
div#left div.layout-wrap input.compact {position: absolute; top: 1px; left: 137px;}

div#left label {font-weight: bold;}

div#left input.txt, textarea.txt {width: 30px; text-align: center; border: 1px solid #ccc; padding: 5px; font-size: 14px; color: #444; font-weight: bold; background-color: #fff; font-family: Arial, Helvetica, sans-serif; margin: 0 10px 5px 20px;}
div#left input.txt:focus, textarea.txt.focus {background-color: #fff; border-color: #39F;}

ul#features {display: block; list-style: none; overflow: auto; width: 920px; margin: 45px 0 20px 0; float: left;}
ul#features li {display: block; float: left; width: 290px; margin: 0 25px 25px 0; font-size: 12px; color: #444; line-height: 18px;}
ul#features li h3 {display: block; font-size: 14px; color: #333; margin-bottom: 10px; padding: 0 0 0 23px; line-height: 20px;}
ul#features li h3.one {background: url(images/h3-one.gif) 0 1px no-repeat}
ul#features li h3.two {background: url(images/h3-two.gif) 0 1px no-repeat}
ul#features li h3.three {background: url(images/h3-three.gif) 0 1px no-repeat}

ul#nav {float: right; list-style: none; padding: 1px 0; margin: 0px 1px 1px 0; overflow: hidden;}
ul#nav li {float: left;}
ul#nav li a {display: block; margin: 0 12px; text-decoration: none; font-size: 14px; color: #333; font-weight: bold; padding: 8px 0;}
ul#nav li a:hover {color: #36C;}
ul#nav li a.active {color: #F90;}

div#preview {display: block; background: #f6f6f6; border: 1px solid #ccc; border-width: 1px 0; clear: both; width: 920px; margin: 0 0 35px -20px; padding: 25px 20px 20px 20px; text-align: center;}
div#preview a {margin: 0 25px;}

div#about h3 {font-size: 26px; color: #333; margin-bottom: 15px; line-height: 28px;}
div#about, div#faq {font-size: 12px; color: #555; line-height: 22px; overflow: auto;}

div#faq strong {display: block; font-size: 14px; color: #333; margin-bottom: 10px;}

div#about a.bt {display: block; float: right; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; background: #479ADF; font-size: 12px; font-weight: bold; text-transform: uppercase; padding: 5px 10px; color: #fff; text-decoration: none; margin: 40px 0 0 0;}

div#footer {display: block; font-size: 11px; color: #555; margin: 10px;}
div#footer a {float: right; color: #555; margin-left: 7px; border-left: 1px solid #ccc; padding-left: 7px;}