@import url(fonts.css);
html{  background:url(../i/bg2.png); }
html, body {height:100%;color:#343432;}

/* Typography
--- */
body {font: 13px/1.4 "Lora",Georgia, Times, serif;}
h1 {font: bold 32px/32px Trump, Arial, sans-serif; text-transform:uppercase;color:#000}
h2 {font: bold 22px/22px Trump, Arial, sans-serif; text-transform:uppercase;color:#000}
h3 {font: bold 18px/1.4 "Lora",Georgia, Times, serif;}

a {text-decoration:none;color:#2999b9;}

a:hover{color:#000;}

h1,
.type h1 {margin:0px 0px 12px; }
.type h2 {margin:24px 0 0; background:url(../i/dots.png) repeat-x 0 100%; padding-bottom:5px; padding-top:10px;}
.type h3 {margin:24px 0 0; font-size:14px; color:#000;}
.type p {margin:12px 0;}
.type ul {margin:20px;}

.type p a{background:url(../i/dots-blue.png) repeat-x 50% 100%;font-weight:bold;}
.type p a:hover{background-color:rgba(0,0,0,.05)}

/* Structure
--- */
.wrap {width: 864px; margin:0 auto; position:relative; }
body > .wrap{min-height:100%;}
#logo {font: normal 60px/56px Trump,sans-serif; /*text-transform:uppercase;*/
    color:#000;position:absolute;bottom:2px;left:0px; font-variant:small-caps;}
#logo:hover{color:#2999b9}
#demo {height:350px; margin-bottom:24px;}
#content {overflow:hidden; padding-bottom:72px;padding-top:10px;}
.home #content{padding-top:0;}

div.primary {width:624px; float:left; padding-bottom:48px; padding-right:24px;background:url(../i/dots-vert.png) repeat-y 100% 0;}
div.secondary {float:right; width:192px; padding-left:25px; background:url(../i/dots-vert.png) repeat-y 0 0;margin-left:-1px; }

/* Secondary Navigation
--- */
.secondary nav ul {padding:0; margin:0;}


/* Main Navigation
--- */
header.main{padding-top:0px;}
.head {overflow:hidden; position:relative;
    /*background:#7cb0b3 url(../i/bg2.png);*/
position:relative;height:88px;border-bottom:2px solid #333;border-top:3px solid #333;}
.head nav.main {position:absolute;right:0;bottom:0;display:block; overflow:hidden;margin-top:20px;}
.head nav.main a {color:#000;font: normal 22px/20px Trump,sans-serif;
    text-transform:uppercase;  float:left;padding:12px 16px 8px;border-right:1px dotted #aaa;}
.head nav.main a:hover{color:#2999b9}
.head nav.main a:first-child {margin:0;border-left:1px dotted #aaa;}
.head nav.main a.active{/*background:#eee url(../i/bg2.png); */color:#000;cursor:default;}
.head a.existing{position:absolute;top:12px;right:0;display:block;font-style:italic;font-size:12px;}
.head .twitter-share-button{position:absolute;top:9px;left:246px;display:block;}
.head a.existing:hover{}
.sep{height:12px;/*background: #eee url(../i/bg2.png);*/margin: 1px 0 12px;}

.head .loggedin{position:absolute;top:12px;right:-8px;font-style:italic;font-size:12px;color:#000;}
.head .loggedin a{border-left:1px dotted #aaa;padding: 0 8px}
.head .loggedin strong{margin-right:6px}


/* Home Page Entry Points
--- */
#entry-points {overflow:hidden; width:900px;background:url(../i/dots.png) repeat-x 0 100%;margin-bottom:24px;padding-top:24px}
#entry-points article {width: 264px;height: 126px; float:left; margin-right:36px; position:relative;color:#555;}
#entry-points article.low{ height:108px}
#entry-points article:last-child {margin:0; padding-right:0; border:0;}
#entry-points h2 {padding-bottom:6px; color:#222;font-size:18px}
#entry-points article .more {margin-top:12px;}

#intro{padding-bottom:24px; background:url(../i/dots.png) repeat-x 0 100%;overflow:hidden}
#intro p{font-size:16px; width: 552px;
    float: left;
    margin-right: 24px;
    padding-right: 24px;}

#intro .buttons{float:right}
#intro .buttons a{width:160px;font-size:15px;line-height:20px;margin-bottom:2px;padding-top:4px;}
#intro .buttons a i{display:block;float:right;background: url(../i/arr-right.png) no-repeat;width:14px;height:12px;margin-top:3px}
#intro .buttons .dl{/*background-image:url(../i/arr-down.png);background-position: 10px 5px;*/}

#usedby{
    margin-bottom:24px; padding-bottom:22px; padding-top:16px; background: url(../i/dots.png) repeat-x 0 100%;position:relative;
}

#usedby p{background:url(../i/logos.png) no-repeat 0;height:30px;font-style:italic;text-align:right;font-size:12px;color:#999;}

#usedby h4{position:absolute;top:-7px;font-size:10px;text-transform:uppercase;letter-spacing:1px;font-weight:normal;display:inline-block;
    background:url(../i/bg-save.png);padding:0 6px 0 0!important;color:#666;}

#feature-list span{display:block;float:left;width:12px;height:14px;background:url(../i/check.png) no-repeat 0 3px;
    text-indent:-10000px;margin-right:6px;}
#feature-list li{font-weight:bold;margin-bottom:4px;}

/* Links with arrows
--- */
a.more{display:inline-block;padding:4px 12px; /*background:#e4e4e4 url(../i/bg2.png);*/color:#333;font-style:italic;
    border-radius:4px;font-size:12px;}
a.more:hover{background-color:#333;color:#fff;}


/* Footer
--- */
footer.main {background:#333 url(../i/bg-bottom.png); height:20px;padding:8px 0;background:url(../i/dots.png) repeat-x top; overflow:hidden;
    margin-top:-37px;margin-left:auto;margin-right:auto;width:864px;}
footer.main .wrap *{display:inline;font:11px "Lora", georgia, serif;}
footer.main .wrap h2{display:none;}
footer.main nav{margin-right:32px;float:left;height:20px;margin-left:-3px;line-height:20px;}
footer.main nav a{float:left;padding: 3px 6px;color:#666;}
footer.main nav a:hover{color:#2999b9;}
footer.main p.made{float:right;margin-top:3px;color:#aaa;}
footer.main p.made a{color:#666;}
footer.main p.made a:hover{color:#7cb0b3;}


/* sidebar */
.secondary{font-size:12px;color:#555;line-height:18px;}
.secondary h2{font: bold 13px/1.1 'Lora', georgia,serif;margin-bottom:12px;text-transform:none;color:#000;}
.secondary p{margin-bottom:12px;font-style:italic}
.secondary .box{border-top:2px solid #333;padding-top:12px;}


/* Download
--- */

.download .btn {padding:10px 0;}
.download .btn span {line-height:33px; margin-left:15px; font-weight:normal;}
.download .secondary {padding-bottom:40px;}
.download #feature-list {list-style:none; padding:0; margin:20px 0;}
.primary {width:625px; float:left;padding-right:24px;background:url(../i/dots-vert.png) repeat-y 100% 0;}
.secondary {float:right; width:192px; padding-left:24px; margin-left:-1px;background:url(../i/dots-vert.png) repeat-y;}


/* Purchase
--- */
body.theme-purchase .buy-form {margin-top:18px}
body.theme-purchase .buy-form .btn {margin-top:10px}

body.theme-purchase .customer{display:none}

form.info{background:url(../i/dots.png) repeat-x -100px 100%;padding-bottom:18px}
form.info h2{background-position: 0 0;;font-size:18px;line-height:1;margin:18px 0 0;padding: 18px 0 4px}
form.info h2:first-child{}
form.info input[type=text],
form.info input[type=email]{font-size:16px;width:400px;padding:3px}
form.info p.help{font-style:italic;color:#777;font-size:11px;margin:4px 0 0;width:400px}
form.info .vat input{font-size:13px;width:200px;margin-left:4px}
form.info .vat{margin-left:19px;font-size:11px}

form.info .emailwrap{position:relative}
form.info .emailwrap .err{position:absolute;left:420px;color:#c22;font-style:italic;font-size:12px;top:7px}

form.info .vat {position:relative;top:-2px}
form.info .vat input[type="text"].ok,
form.info .vat input[type="text"].error{background-position: 97% 4px}

form.info .vat .btn{position:relative;top:2px;padding-bottom:9px}
form.info .vat .btn a{background:#e4e4e4;background:rgba(0,0,0,.1);color:#333;font-style:italic;font-weight:normal;padding-bottom:4px}
form.info .vat .btn a:hover{background-color:#333;color:#fff}

body.theme-purchase p.loading{background:url(../i/loader.gif) no-repeat 0 1px; padding-left:20px;
    font-style:italic;font-size:12px;color:#777;position:absolute;left:104px;margin-top:-30px;line-height:18px}

pre code {background: #eee; margin:20px 0; display:block; padding:5px;}

.total{font-size:18px;color:#000}

ul.errorlist {color: #c22;list-style:none;margin:12px 0}
ul.errorlist li span{margin-right:4px;position:relative;top:-1px}
form.login{background:rgba(0,0,0,.06);padding:12px 0}
form.login input[type=text],
form.login input[type=email],
form.login input[type=password]{width:200px;position:absolute;left:120px}
form.login > div,
form.login > p{position:relative;height:30px;margin:0}
form.login label{line-height:30px;font-style:italic;width:110px;display:block;white-space:nowrap;float:left;text-align:right}
form.login .btn{margin-left:120px;margin-top:4px}

form.login div.error{position:absolute;left:338px;font-size:11px;font-style:italic;margin-top:-4px}

form.password input[type=text],
form.password input[type=email],
form.login input[type=password]{width:200px;}

form.login ul.errorlist{margin:0 0 10px 120px}
form.login div ul.errorlist{margin: 12px 0}

body.password form.login {background:none}


/* Buttons */
.btn a,
button.btn{display:inline-block;padding:4px 12px;color:#fff;font:bold italic 13px/16px 'Lora', georgia, serif;
    border-radius:4px;border:1px solid #fff;cursor:pointer;
    background: url(../i/bg2.png), -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(0,0,0,0)), to(rgba(0,0,0,.1)));
    background: url(../i/bg2.png), -moz-linear-gradient(top,  rgba(0,0,0,0),  rgba(0,0,0,.1));
    background-color:#2999b9;
    }
button.btn{padding-bottom:5px}
.btn a i{font-style:normal;}
.btn a.download,
.buy-form .btn a{padding:12px 16px 8px;font-size:14px;font: bold 22px/22px Trump, Arial, sans-serif; text-transform:uppercase;}
.btn a.download i{background:url(../i/arr-down.png) no-repeat 100% 0;padding-right:20px;}
.btn.big a,
button.btn.big{font-size:16px;line-height:22px}

.btn a:active,
button.btn:active{background-color:#e4e4e4}

.btn a.preview{background-color:#e4e4e4;color:#333;}

form .btn{position:relative;top:1px;}
form .btn a{padding-bottom:5px}

.btn a:hover,
.btn a.preview:hover,
button.btn:hover{background-color:#333;color:#fff;}

.btn.disabled a,
button.btn.disabled{cursor:default;color:#fff;background-color:#e4e4e4}

.theme-list{width:900px;padding-top:24px;}
.theme-list .theme{width:264px;float:left;margin-right:36px;margin-bottom:36px}
.theme-list .theme .image{margin-bottom:-40px}
.theme-list .theme h2{margin-bottom:4px}
.theme-list .theme h2 a{color:#000}
.theme-list .theme h2 a:hover{color:#2999b9;}
.theme-list .theme .desc{font-size:11px;margin-bottom:8px;}

#legacy{background:#eee url(../i/bg2.png);padding:12px;}
#legacy input[type=text]{padding:3px;font-size:16px;margin: 0 6px;}

input[type="text"],
input[type="email"],
input[type="password"],
textarea,
select{background:#fff;border:1px solid #ccc;font-family:'Lora', georgia, serif;color:#666;font-size:16px;width:200px;padding:3px;}
label{font-style:italic}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus{border-color:#888;color:000;outline-color:#eee}

input.ok{border-color:#3fab63!important;background:#fff url(../i/themes/ok.png) no-repeat 97.5% 6px}
input.error{border-color:#f15866!important;background:#fff url(../i/themes/error.png) no-repeat 97.5% 6px}
input.loading{background:#fff url(../i/loader.gif) no-repeat 98% 2px;color:#aaa}

.box ul{list-style:none;}
.box ul li{padding:3px 0;background:url(../i/arr2.png) no-repeat 1px 5px;
    padding-left:10px;font-weight:normal;font-size:12px;line-height:1.2;}

#tagline{z-index:1;position:absolute;top:20px;left:20px;}
#tagline span{font-size:18px;line-height:26px; color:#eed;font-family:'Lora',georgia,serif;text-transform:none;font-weight:normal;display:inline;
    background:#000;background:rgba(0,0,0,.8);padding: 2px 6px;position:relative;clear:both;}
#tagline a{float:left;background:#fff url(../i/bg2.png);font:italic 13px/14px 'Lora',georgia,serif;padding:6px 12px;color:#444;margin-top:8px;opacity:.8;}
#tagline a:hover{opacity:1;color:#000;}

/* webkit scroller */
pre::-webkit-scrollbar { width:5px; height:5px; background:#ddd; margin-right:5px; }
pre::-webkit-scrollbar-thumb { height:10px; background-color:#222; }

#news{width:932px;overflow:hidden;}
#news article{width:408px;float:left;margin-right:24px;padding-right:24px;background:url(../i/dots-vert.png) repeat-y 100% 0;}
#news h2{font-size:16px;}
#news .twitter h2{background:url(../i/twitter.png) no-repeat;padding-left:40px;}
#news .featured h2{background:url(../i/feat.png) no-repeat;padding-left:24px;padding-bottom:12px}
#news .featured h3{font: bold 26px/26px Trump, Arial, sans-serif; text-transform:uppercase;margin-bottom:6px}
#news .featured .btn{margin-top:12px;}
#news .tweets li{margin:6px 0;padding:6px 0;border-bottom:1px solid #ddd;font-size:12px;}
#news .tweets li em{color:#aaa;display:block;font-family:'Lora',georgia,serif}
p.follow{margin-top:12px}

body.admin .loggedinas .controls{background: url(../i/dots.png) repeat-x;padding-top:8px;margin-top:-4px}
body.admin .loggedinas .controls .out{padding-left:8px;margin-left:5px;border-left:1px dotted #888;color:#c22}
body.admin .loggedinas .controls .out:hover{color:#000}

body.admin .menu{padding:0 0 1px;overflow:hidden;margin-bottom:24px;background: url(../i/dots.png) repeat-x 0 100%;}
body.admin .menu a{font:13px/22px 'Lora', georgia,serif;float:left;padding: 4px 16px 5px 16px;background:url(../i/dots-vert.png) repeat-y 100% 0;
    font-style:italic;font-weight:bold;color:#aaa}
body.admin .menu a span{font-size:15px}

body.admin .menu a:hover{color:#2999b9}
body.admin .menu a:first-child {margin-left:-16px}
body.admin .menu a.active{color:#000;cursor:default;}

body.admin #content{padding-top:12px}

body.admin .purchases{list-style:none;margin:0;background:url(../i/dots.png) repeat-x 0 100%;}
body.admin .purchases li{background:url(../i/dots.png) repeat-x;padding:12px 0;position:relative;font-weight:bold}
body.admin .purchases li span{position:absolute;right:0;top:8px}

body.admin .invoices li em{display:block;font-weight:normal;color:#888}
body.admin .invoices li span{top:16px}

form.settings{padding-bottom:18px}
form.settings h2{background-position: 0 0;;font-size:18px;line-height:1;margin:18px 0 0;padding: 18px 0 4px}
form.settings h2 span{color:#ccc;color:rgba(0,0,0,.3)}
form.settings h2:first-child{}
form.settings input[type=text],
form.settings input[type=email]{font-size:16px;width:400px;padding:3px}
form.settings .details{margin-top:6px}
form.settings .details > div{position:relative;height:30px}
form.settings .details input{position:absolute;left:110px}
form.settings .details label{line-height:30px;width:100px;text-align:right;display:block}
form.settings .submit{background:url(../i/dots.png) repeat-x -150px 0;padding-top:12px;margin-top:18px}
form.settings .verify{margin-top:6px}
form.settings .verify label{font-size:11px;color:#888;display:block}

.symbol{font-family:symbols,monospace!important;font-weight:normal!important;font-style:normal!important;text-transform:none!important;margin-right:2px}

.messages{}
.messages ul{list-style:none;margin:0;}
.messages li{background:#e7eda3 url(../i/bg2.png);color:#221;position:relative;}
.messages li.error{background-color:#de5252;color:#fff;font-weight:bold}
.messages li p{padding:12px 12px 12px 40px;margin:0}
.messages li .symbol{position:absolute;left:12px;top:8px;font-size:18px;margin-right:8px;}
.messages li .close{font-size:9px;position:absolute;right:-2px;top:6px;left:auto;display:block;width:10px;height:10px;color:#886}
.messages li.error .close{color:#fff}
.messages li .close:hover{color:#000}

