﻿body { background: #707070 url(/local/images/bg.gif) repeat-y center 0; padding: 0; margin: 0; color: #444; font: 13px Georgia, Times New Roman; line-height: 1.4em; }

html, body { height: 100%; }
hr { border-color: #DDDDDD; border-right: 2px none #DDDDDD; border-style: dotted none none; border-width: 2px; width: 100%; }
a { color: #1073b9; text-decoration: none; cursor: pointer; }
    a:hover { color: #444; text-decoration: underline !important; }
    a:visited { color: #1073b9; text-decoration: none; }
h1, h2, h3 { color: #1073b9; font-weight: normal; }
h1 { font-size: 25px; }
h2 { font-size: 19px; }
h3 { font-size: 15px; color: #444; }
img { border: 0; }

/* Clearafter */
.clearafter:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearafter { display: inline-block; }
* html .clearafter { height: 1%; }
.clearafter { display: block; }

/* Regions */
#main { height: auto; width: 960px; margin: 0 auto; min-height: 100%; }
#header { background: url(/local/images/topbg.gif) repeat-x 0 0; height: 115px; padding: 0; margin: 0; text-align: center; }
#logo { background: url(/local/images/logo.png) no-repeat 0 60%; margin: 0 auto; width: 1055px; height: 120px; }
.logo { float: left; }
.add-top-block { float: right; margin-top: 5px; }
.add-block-right { margin: 3px 0; }

#menuwrapper { background: url(/local/images/menubg.png) repeat-x 0 0; margin: 0 auto; text-align: center; height: 60px; }
#menu { margin: 0 auto; height: 60px; /*min-width: 960px;*/ width: 950px; text-align: center; }
    #menu ul { margin: 0; margin-left: 60px; float: left; text-align: center; list-style: none; }
    #menu li { float: left; display: inline-block; width: 105px; }
    #menu a, #menu a:hover, #menu a:visited { text-decoration: none; color: #FFF !important; }
    #menu a, #menu .currpage { background: url(/local/images/btnbg.gif) no-repeat 0 0; color: #FFF; display: block; text-transform: uppercase; font-size: 130%; list-style: none; line-height: 40px; height: 38px; width: 105px; }
        #menu a:hover, #menu .currpage { background-position: 0 -38px; }

#body { border: #ccc solid 0px; float: left; margin: 0 16px 0 16px; max-width: 688px; width: 688px; text-align: justify; height: 100%; }

#loader { position: fixed; top: 0; left: 0; background: #F7F7F2; padding: 5px 10px 5px 2px; color: #666666; font-weight: bold; z-index: 100001; }

#screenlock { width: 100%; height: 100%; position: fixed; top: 0; left: 0; background: #9f9f9f; z-index: 10000; }

#alert-box { position: fixed; width: 316px; top: 10%; left: 37%; margin: 0 0 0 -85px; overflow: visible; padding-bottom: 14px; }
#alert-head { background: url(/local/images/alert.png) no-repeat 0 0; position: relative; height: 49px; }
#alert-close { cursor: pointer; position: absolute; top: -7px; right: -6px; width: 22px; height: 23px; background: url(/local/images/close.png) no-repeat 0 0; text-indent: -500px; overflow: hidden; display: block; }
#alert-title { position: absolute; top: 16px; left: 43px; color: #FFF; font-weight: bold; font-size: 14px; }
#alert-content { background: #FFF; padding: 10px 20px 10px 12px; color: #000; min-height: 80px; text-align: center; }
#alert-footer { height: 14px; width: 100%; background: url(/local/images/alert.png) no-repeat 0 -50px; position: absolute; bottom: 0; left: 0; }

#sidebar { border: #000 solid 0px; float: right; width: 204px; padding-right: 16px; height: 100%; }
    #sidebar a { margin-left: 2px; }
    #sidebar button { border: none 0; position: relative; }

#categories { margin-top: 16px; margin-left: 15px; }
    #categories ul { margin-left: 0px; padding: 0; list-style-image: url(/local/images/bullet.gif); }

#favs { float: right; margin: 16px 8px 0 0; text-align: right; }

#searchbox { float: right; width: 182px; height: 37px; margin: auto; margin-right: 20px; }
    #searchbox button { border: 0; background: url(/local/images/search.png) no-repeat 0 0; width: 26px; height: 26px; margin-top: 4px; margin-left: 10px; cursor: pointer; }

#login { width: 182px; min-height: 32px; max-height: 320px; margin: 0 auto; padding: 0 0 15px 0; text-align: left; }
    #login input:focus, #searchbox input:focus { background-color: #EEE; }
    #login button, #login input.button { background: White url(/local/images/login.png) no-repeat left top; width: 34px; height: 34px; margin-top: 4px; margin-left: 6px; cursor: pointer; border: none; font-size: 0; color: White; }
    #login p { margin-top: 3px; margin-left: .33em; margin-bottom: 3px; }
    #login form { margin: 0; }

#footer { color: #FFF; background: #404040; text-align: center; padding: 10px 0 10px 0; width: 960px; min-width: 961px; margin: 0 auto; }
    #footer a, #footer a:visited, #footer a:hover { color: #FFF; text-decoration: underline; }
.footertext { font-size: 11px; font-family: Arial; }

/* DB Credits */
.db-credits { font-family: Georgia; font-size: 12px; font-weight: normal; text-transform: none; color: #A9A9A9; position: relative; padding: 0 0 0 26px; margin: 10px auto 0 auto; width: 200px; text-align: left; display: inline-block; }
    .db-credits:hover { color: #FFF; }
#footer .db-credits a { color: #A9A9A9; line-height: 21px; font-family: Georgia; font-size: 12px; /* becasuse someone used important above */ text-decoration: none !important; font-weight: normal; }
#footer .db-credits:hover a { text-decoration: none; color: #D53C27; }
.db-logo { display: block; position: absolute; left: 0; top: 1px; width: 26px; height: 20px; overflow: hidden; background: #ccc; background: url(/local/images/db-grey-red.png) 0 0 no-repeat; }
.db-credits:hover .db-logo { background-position: 0 -20px; }
.db-logo img { margin: 0 0 0 50px; }

#underfooter { font-size: 2px; margin: 0; padding: 0; height: 5px; overflow: hidden; }

#helpblock p, #helpblock li, #toolsblock p { margin-left: 24px; margin-bottom: 16px; }
#helpblock h3 { margin-bottom: 0; margin-top: 32px; }

/* Classes */

.smalltext { font-size: 75%; font-family: Arial; }
.fontbox { width: 680px; margin: 12px 0px 25px 12px; padding-bottom: 10px; border-bottom: 2px dotted #DDDDDD; }
    .fontbox img { margin: 0 2px; }
.fontpreview { overflow: hidden; min-height: 33px; width: 650px; margin: 8px 0 8px 16px; top: 5px; }
.fonticons, .freeicon { float: left; line-height: 20px; margin-top: 8px; padding-left: 32px; }
.fonticons { width: 500px; }

.fonticons { padding-left: 0; }
    .fonticons a, .freeicon a, .freeicon a:hover { background: transparent no-repeat 12px 0; padding-left: 36px; display: inline-block; }
.freeicon { background: url(/local/images/commercial.png) no-repeat 8px 0; text-decoration: none !important; color: #1073B9 !important; margin-left: 14px !important; }
.fonticons a:hover { background-position: 12px -20px; }
.fonticons img { vertical-align: middle; }
.fontname { float: left; width: 300px; margin: 0; }
    .fontname a, .fontname a:visited { color: #cc0101; text-decoration: none; }
.fontcategory { line-height: 20px; padding-left: 23px; }
.extrabox { float: right; text-align: center; height: 24px; width: 100px; }
    .extrabox ul { list-style: none; }
    .extrabox li { display: inline-block; float: left; width: 18px; height: 18px; }

.inputfield, .submitinputfield, .formtable input { background-color: #FFF; border: solid 1px #AAA; margin-top: 5px; margin-left: 4px; position: relative; width: 135px; }
.pagenumbers { font-family: Arial, Tahoma; margin: 0 auto; }
    .pagenumbers a, .pagenumbers .currpage, .pagenumbers .inactive, .submitbtn, .framered, .framegray { margin: 2px; padding: 3px 5px 3px 5px; line-height: 10px; display: inline-block; background-color: #d7d8de; border: solid 1px #9292a1; text-decoration: none; color: #444; }
.framered, .framegray { width: 675px; margin: 0 auto; padding: 8px; text-align: center; }
.framegray { background-color: #EEE; }
.pagenumbers a:hover { background-color: #dcd7d7; }
.pagenumbers .currpage { cursor: default; background-color: #9292a1 !important; }
.pagenumbers .inactive { cursor: default; color: #9faaaa; background-color: #d7d8de !important; border-color: #9f8181; }
.submitinputfield, .formtable input { width: 300px; }
.submitbtn { width: 75px !important; height: 25px; margin-left: 4px; padding: 2px; border: none; background-color: #d7d8de; }
.featuredfontbox { height: 100px; width: 688px; margin: 16px 5px; }
    .featuredfontbox .fontpreview { overflow: hidden; width: 500px; float: left; margin: 0; }
    .featuredfontbox .img { height: 100px; }
    .featuredfontbox .arrow { float: right; margin: 0 16px; }
.highlighted { background-color: Yellow; }
.formtable { margin: 0 auto; }

.magnifier { position: absolute; top: 0; left: 0; width: 200px; height: 200px; }
.magnifier-eye { position: absolute; bottom: 0; left: 0; width: 50px; height: 50px; border: 1px solid #444; }
.magnifier-img { position: absolute; top: 0; right: 0; width: 150px; height: 150px; border: 5px solid #DDD; overflow: hidden; background: #E3E8EC; }
.magnifier-image { position: absolute; top: 0; left: 0; }

.alphabet { font-size: 150%; margin-top: -6px; text-align: center; }
    .alphabet a { display: inline-block; height: 16px; width: 16px; background: url(/local/images/alphabet.png) no-repeat 0 0; margin: 0; padding: 0; }
        .alphabet a:hover { background-color: #d7d8de; }
.commentbox { background: #ededf5 url(/local/images/quote1.png) no-repeat 16px 38px; border: solid 1px #c49999; margin: 0; margin-bottom: 16px; padding: 0; }
    .commentbox .header { height: 30px; line-height: 30px; background: url(/local/images/commentheader.gif) repeat-x 0 0; padding: 0 8px; color: #000; }
    .commentbox p { margin: 0; }
    .commentbox .commentend { background: transparent url(/local/images/quote2.png) no-repeat right bottom; height: 100%; min-height: 35px; margin-left: 64px; padding: 16px 5px 5px 0; }
    .commentbox .adminpanel { margin: 0 auto; text-align: center; max-width: 275px; min-width: 175px; height: 24px; float: right; line-height: 18px; text-align: right; }
        .commentbox .adminpanel div { float: left; margin: 5px 2px; }
.cleardiv { clear: both; height: 24px; }
.clear { clear: both; }

/* Contact form: */
.cf label { float: left; width: 100px; padding: 5px 0 0 0; clear: both; }
.text { width: 200px; padding: 2px; vertical-align: top; }
.cf .button { margin: 5px 0 5px 120px; }
textarea { padding: 2px; vertical-align: text-top; width: 400px; }

/* Autocomplete: */
.autocomplete { font-size: 12px; width: 340px; border: 1px solid #999; background: #FFF; cursor: default; text-align: left; max-height: 350px; overflow: auto; margin: -12px 6px 6px -6px; /* IE specific: */ _height: 350px; _margin: 0px 6px 6px 0; _overflow-x: hidden; }
.autocomplete-w1 { position: absolute; top: 15px; left: 6px; /* IE6 fix: */ _background: none; _top: 1px; }
.autocomplete .selected { background: #F0F0F0; }
.autocomplete div { padding: 2px 5px; white-space: nowrap; }
.autocomplete strong { font-weight: normal; color: #3399FF; }

/* Rating */
ul.xrating { width: 80px; height: 16px; margin: 0 0 16px 0; padding: 0; list-style: none; clear: both; position: absolute; top: 0; right: 0; background: url(/local/images/starsset.png) no-repeat 0 0; }
ul.star0 { background-position: 0 -81px; }
ul.star1 { background-position: 0 -65px; }
ul.star2 { background-position: 0 -49px; }
ul.star3 { background-position: 0 -33px; }
ul.star4 { background-position: 0 -17px; }
ul.star5 { background-position: 0 -1px; }
ul.xrating li { cursor: pointer; float: left; text-indent: -999em; }
    ul.xrating li a { position: absolute; left: 0; top: 0; width: 16px; height: 16px; text-decoration: none; z-index: 200; background: none; }
    ul.xrating li.s1 a { left: 0px; }
    ul.xrating li.s2 a { left: 16px; }
    ul.xrating li.s3 a { left: 32px; }
    ul.xrating li.s4 a { left: 48px; }
    ul.xrating li.s5 a { left: 64px; }
    ul.xrating li a:hover { z-index: 199; width: 80px; height: 16px; margin: 0 0 16px 0; overflow: hidden; left: 0; background: url(/local/images/starsset.png) no-repeat 0 0; }
    ul.xrating li.s1 a:hover { background-position: 0 -65px; }
    ul.xrating li.s2 a:hover { background-position: 0 -49px; }
    ul.xrating li.s3 a:hover { background-position: 0 -33px; }
    ul.xrating li.s4 a:hover { background-position: 0 -17px; }
    ul.xrating li.s5 a:hover { background-position: 0 -1px; }
.norating ul.xrating li a:hover { background: none; cursor: auto; }
.divRateBox { position: relative; float: left; width: 93px; height: 17px; margin: 0 0px 0 0; }

.divGroupColor { padding: 10px 2px 10px 2px; }
.divGroup { padding: 2px 2px 0px 0px; }
.divGroupItem { padding: 0px 0px 10px 0px; width: 500px; overflow: hidden; vertical-align: top; color: #2C498F; }

.editLink { text-decoration: underline; overflow: hidden; border: none; margin: 3px; padding: 3px; min-height: 26px; min-width: 110px; cursor: pointer; width: auto; vertical-align: baseline; }
.editDiv { padding: 0px; margin: 0px; }

.facebook-tab { padding: 10px 0 0 0; font-size: 12px; }
    .facebook-tab strong { margin: 0; padding: 0; }
    .facebook-tab p { line-height: 1.3em; margin-top: 5px; color: #737373; font-size: 11px; font-family: Arial; }

/* Font.com signup */
.sign-up-black-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: black; z-index: 1001; -moz-opacity: 0.8; -ms-opacity: .80; opacity: .80; filter: alpha(opacity=80); }
.sign-up-content { display: none; position: fixed; top: 50%; left: 50%; width: 550px; height: 360px; margin-left: -265px; margin-top: -180px; z-index: 1002; overflow: auto; padding: 0px; }
