
* {
    border:0;
    margin:0;
    padding:0;
    color:#e5e5e5;
    font-family:'Trebuchet MS', Arial, Verdana;
    font-size:11px;
    font-weight:bold;
}

html {
    background:#000 url(../images/bg.jpg) no-repeat 0 110px;
}

body {
    background:url(../images/body.jpg) no-repeat center 0;
}

a {
    color:#95d13d;
    text-decoration:underline;
}
a:hover {
    color:#b0b0b0;
}

h1 { font-size:20px; }
h2 { font-size:18px; }
h3 { font-size:18px; }
h4 { font-size:12px; }

#head {
    width:956px;
    margin:0 auto;
    height:94px;
}

#bmenu {
    position:absolute;
    z-index:700;
    margin:41px 0 0 350px;
}

.hr {
    height:12px;
    background:url(../images/hr.gif) repeat-x;
}
.hr hr { display:none; }

#logo {
    margin:20px 0 0 0;
    position:absolute;
    display:block;
    width:298px;
    overflow:hidden;
    height:55px;
    text-indent:-9999px;
}

#description {
    margin:50px 0 0 42px;
    position:absolute;
    display:none;
    width:223px;
    height:31px;
    background:url(../images/description.png) no-repeat;
    text-indent:-9999px;
}

#content {
    width:956px;
    margin:0 auto;
}

#content h2 {
    margin:10px 0 10px 10px; 
    color:#ccc;
    _color:#999;
}
#content h2 span { font-size:18px; }

#content .box {
    margin-top:10px;
    width:956px;
}
#content .box .content {
    padding:0 15px 0 15px;
    background:#000;
}
#content .box .top,
#content .box .bottom {
    width:956px;
    overflow:hidden;
    height:10px;
    background:url(../images/big-box-bg.gif) no-repeat;
}
#content .box .bottom {
    background-position:0 bottom;
}

#content #left .box {
    width:588px;
}
#content #left .box * {
    font-size:11px;
    color:#999;
}
#content #left .box .content {
    padding:0 15px 0 15px;
}
#content #left .box .top,
#content #left .box .bottom {
    width:588px;
    background:url(../images/box-bg.gif) no-repeat;
}
#content #left .box .bottom {
    background-position:0 bottom;
}
#content #left .box p {
    padding-top:5px;
}
#content #left .box ul li {
    margin-left:14px;
}

#container {
    float:left;
    clear:both;
}
#left {
    width:700px;
    float:left;
}
#right {
    float:right;
    padding-left:20px;
    width:220px;
}

div#box {
    overflow:hidden;
    width:956px;
    height:290px;
    background-position:7px 6px;
    background-repeat:no-repeat;
    background-image:url(../images/box.jpg);
}
div#box .inside {
    position:relative;
    width:956px;
    height:290px;
    background:url(../images/border.png) no-repeat;
    _background:none;
}
div#box strong,
div#box ul {
    position:relative;
    font-size:14px;
    color:#fff;
    left:450px;
}
div#box strong {
    top:50px;
    position:absolute;
}
div#box ul {
    top:80px;
    width:240px;
    list-style:none;
}
div#box .left {
    float:left;
    margin-right:5px;
}
div#box .right {
    float:left;
}
div#box ul.left li,
div#box ul.right li {
    color:#fff;
    padding-left:25px;
    line-height:21px;
    background:url(../images/box-pointer.png) no-repeat 0 -1px;
    _background-image:url(../images/box-pointer.gif);
    font-size:11px;
}
div#box .buttons {
    top:240px;
    position:absolute;
}
div#box .buttons li {
    display:inline;
}
div#box .button {
    background:url(../images/box-buttons.png) no-repeat 0 -56px;
    line-height:27px;
    padding:5px 0 6px 9px;
    text-decoration:none;
}
div#box .button span {
    color:#000;
    line-height:27px;
    padding:5px 8px 6px 0;
    background:url(../images/box-buttons.png) no-repeat right 0;
}
*+html div#box .button {
    background-position:0 -51px;
}
div#box .button:hover {
    background-position:0 -84px;
}
*+html div#box .button:hover {
    background-position:0 -79px;
}
div#box .button:hover span {
    background-position:right -28px;
}

a.item, a.item .image {
    text-decoration:none;
    position:relative;
    display:block;
    width:102px;
    height:102px;
}
a.item .overlay {
    display:block;
    position:absolute;
    text-indent:-9999px;
    overflow:hidden;
    z-index:3;
    width:102px;
    height:102px;
    background:url(../images/item.png) no-repeat;
    _background:url(../images/pixel.gif);
    cursor:pointer;
}
a.item img {
    width:100px;
    border:1px solid #2a2a2a;
}
a.item:hover img {
    border-color:#5a5a5a;
}

#copyright {
    color:#777;
    clear:left;
    padding:40px 0 20px 27px;
}

#content h2.new-menus {
    background:url(../images/new-menus.png) no-repeat -5px 0;
    text-indent:-9999px;
    width:154px;
    height:37px;
    margin:10px 0 0 0;
    color:#999;
    /** for IE6 */
    _margin-top:20px;
    _background:none;
    _text-indent:25px;
}
#content #new-menus .content {
    padding:0 0 0 5px;
}
#new-menus ul {
    padding:0;
    list-style:none;
}
#new-menus li {
    float:left;
    margin:0 0 3px 3px;
}

#content h2.related-menus {
    background:url(../images/related-menus.png) no-repeat -6px 0;
    text-indent:-9999px;
    width:173px;
    height:41px;
    margin:10px 0 0 2px;
    color:#999;
    /** for IE6 */
    _margin-top:20px;
    _background:none;
    _text-indent:9px;
}
#content #related-menus .content {
    padding:0 0 0 5px;
    height:102px;
}
#related-menus ul {
    padding:0;
    list-style:none;
}
#content #left #related-menus li {
    float:left;
    margin:0 0 3px 3px;
}

h2.links {
    clear:left;
    background:url(../images/links.png) no-repeat;
    text-indent:-9999px;
    width:85px;
    height:28px;
    position:relative;
    top:20px;
    margin:0 0 0 18px;
    cursor:pointer;
    color:#999;
    /** for IE6 */
    _margin-top:20px;
    _background:url(../images/links.gif) no-repeat 65px 3px;
    _text-indent:18px;
}
#links-list .box {
    margin-top:40px;
}
#old-links ul {
    position:relative;
    top:5px;
    float:left;
    width:150px;
    margin-left:40px;
    _margin-left:30px;
    list-style:none;
    background:url(../images/ul-delimiter.gif) no-repeat right 40px;
}
#content #old-links .content {
    padding:0 0 0 5px;
    height:162px;
}
#old-links ul.right {
    background:none;
}
#old-links ul.clear {
    clear:left;
}
#old-links li,
#old-links li b,
#old-links a {
    color:#555;
    font-size:10px;
}
#old-links a:hover {
    color:#ccc;
}
#old-links li.delimiter {
    display:block;
    height:10px;
}
#old-links li.title b,
#old-links li.title {
    color:#fff;
}
#old-links li.title {
    margin-top:20px;
}

h3.colors {
    clear:left;
    background:url(../images/colors.png) no-repeat;
    text-indent:-9999px;
    width:203px;
    height:45px;
    margin:0 0 0 5px;
    color:#999;
    /** for IE6 */
    _font-size:20px;
    _margin-top:20px;
    _background:none;
    _text-indent:10px;
}
#palette {
    list-style:none;
    margin:5px 0 0 15px;
}
#palette li {
    float:left;
    margin-right:3px;
    padding:2px;
    border-style:solid;
}
#palette li.current,
#palette li.hover {
    padding:1px;
    border-width:1px;
}
#palette li:hover {
    padding:1px;
    border-width:1px;
}
#palette li a {
    text-indent:-999em;
    float:left;
    background:url(../images/color-bg.png) no-repeat;
    _background-image:url(../images/color-bg.gif);
    display:block;
    width:20px;
    overflow:hidden;
    height:20px;
}

#downloads {
    clear: top;
    margin:45px 0 0 15px;
    list-style:none;
}
#downloads .tooltip {
    margin-top:15px;
}

#monitor {
    display:block;
    position:absolute;
    width:20px;
    height:20px;
    margin:-30px 0 0 900px;
    background:url(../images/pie.gif) no-repeat;
    cursor:pointer;
}

a.free-download,
a.open-sources,
a.buy-all,
a.buy {
    display:block;
    width:192px;
    height:77px;
    line-height:77px;
    text-align:center;
    font-size:18px;
    color:#bbb;
    overflow:hidden;
    background:#333 url(../images/button.png) no-repeat;
    text-decoration:none;
}
a.open-sources {
    color:#000;
    background-image:url(../images/button-blue.png);
}
a.buy-all {
    color:#000;
    background-image:url(../images/button-orange.png);
}
a.buy-all sup {
    color:#000;
    vertical-align:middle;
}
a.buy {
    color:#000;
    background-image:url(../images/button-green.png);
}
a.buy sup {
    color:#000;
    vertical-align:middle;
}
a.free-download span,
a.open-sources span,
a.buy-all span,
a.buy span {
    display:none;
}

.tooltip {
    /*
    position:absolute;
    z-index:777;
    display:none;
    */
    width:175px;
    overflow:hidden;
    margin-left:8px;
    padding-top:17px;
    background:url(../images/tooltip.png) no-repeat 0 -8px;
    _background-image:url(../images/tooltip.gif);
    _background-color:#4c4c4c;
}
.tooltip ul {
    list-style:none;
    width:175px;
    padding:0 15px 27px 15px;
    background:url(../images/tooltip.png) no-repeat -175px bottom;
    _background-image:url(../images/tooltip.gif);
}
.tooltip li { font-size:10px; }
.tooltip li a { font-size:10px; color:#ff0; }
.tooltip li a:hover { color:#fff; }
.tooltip.green { _background-color:#507828; }
.tooltip.green, .tooltip.green ul {
    background-image:url(../images/tooltip-green.png);
    _background-image:url(../images/tooltip-green.gif);
}
.tooltip.blue {
    _background-color:#007390;
    display:block;
    position:relative;
}
.tooltip.blue, .tooltip.blue ul {
    background-image:url(../images/tooltip-blue.png);
    _background-image:url(../images/tooltip-blue.gif);
}
.tooltip.orange { _background-color:#a52b00; }
.tooltip.orange, .tooltip.orange ul {
    background-image:url(../images/tooltip-orange.png);
    _background-image:url(../images/tooltip-orange.gif);
}

#footer-inc {
    padding:0 0 5px 27px;
    margin-top:-15px;
}
#footer-inc ul {
    list-style:none;
}
#footer-inc ul li { display:inline; }
#footer-inc a,
#footer-inc {
    color:#333;
    font-size:10px;
    text-decoration:none;
}

#content.blog {
    background: #fff;
    margin: -10px 0 0 0;
    width: 100%;
}
#content.blog #container {
    width: 100%;
}
#content.blog * {
    color: #555;
    font-size: 18px;
}
#content.blog .items {
    margin-top: 20px;
    list-style: none;
}
#content.blog .items li {
    margin-bottom: 10px;
}
#content.blog #copyright {
    padding-top: 20px;
}
#content.blog #copyright,
#content.blog #copyright * {
    font-size: 120%;
}
#content.blog #left {
    box-sizing: border-box;
    padding: 20px 27px;
    width: 65%;
}
#content.blog #left h1 {
    font-size: 200%;
    margin: 10px 0 30px;
}
#content.blog #left h1 a { font-size: 100%; }
#content.blog .article h2,
#content.blog .article h3 {
    font-size: 180%;
    margin: 20px 0 20px;
    line-height: 100%;
}
#content.blog .article h3 {
    font-size: 150%;
}
#content.blog .article p { padding-bottom: 8px; }
#content.blog .article ul {
    margin: 8px 0;
    list-style: disc;
    margin-left: 14px;
}
#content.blog .article p + ul { margin-top: 0; }
#content.blog .article .img {
    text-align: center;
    margin: 20px 0;
}
#content.blog .article .img img { max-width: 100%; }
#content.blog .article .img-desc {
    display: block;
    font-size: 90%;
    font-weight: normal;
    line-height: 120%;
    margin: -10px auto 30px auto;
    max-width: 600px;
    text-align: center;
    font-style: italic;
}
#content.blog .article .youtube {
    margin: 20px 0;
}
#content.blog .article pre {
    padding: 20px 20px;
    background: #eee;
    margin: 8px 0;
}
#content.blog .article code {
    font-family: 'Courier New', monospace;
}

#content.blog #right {
    box-sizing: border-box;
    padding: 39px 27px;
    width: 35%;
}
#content.blog a {
    color: #95d13d;
}
#content.blog a:hover {
    color: #777;
}
#content.blog .pages {
    margin-top: 40px;
}
#content.blog .pages ul {
    list-style: none;
    display: inline;
}
#content.blog .pages li {
    display: inline;
    padding-left: 10px;
}
#content.blog #right .sections {
    padding: 20px 18px;
}
#content.blog #right .sections li {
    margin-bottom: 3px;
}
#content.blog .search-form {
    width: 100%;
}
#content.blog .search-form form {
    box-sizing: border-box;
    display: table;
    width: 100%;
}
#content.blog .search-form input {
    -webkit-border-top-left-radius: 3px;
       -moz-border-top-left-radius: 3px;
        -ms-border-top-left-radius: 3px;
            border-top-left-radius: 3px;
    -webkit-border-bottom-left-radius: 3px;
       -moz-border-bottom-left-radius: 3px;
        -ms-border-bottom-left-radius: 3px;
            border-bottom-left-radius: 3px;
    background: #f0f0f0;
    border: 1px solid #dfdfdf;
    box-sizing: border-box;
    display: table-cell;
    padding: 12px 15px;
    vertical-align: top;
    width: 100%;
}
#content.blog .search-form .submit {
    -webkit-border-top-right-radius: 3px;
       -moz-border-top-right-radius: 3px;
        -ms-border-top-right-radius: 3px;
            border-top-right-radius: 3px;
    -webkit-border-bottom-right-radius: 3px;
       -moz-border-bottom-right-radius: 3px;
        -ms-border-bottom-right-radius: 3px;
            border-bottom-right-radius: 3px;
    background: #dfdfdf;
    display: table-cell;
    line-height: 49px;
    margin-top: 0;
    vertical-align: top;
    width: 54px;
}
#content.blog .search-form .submit:hover { background: #d5d5d5; }
#content.blog .search-form .submit button {
    background: none;
    border: 0;
    cursor: pointer;
    padding: 12px 8px 11px 12px;
}
#content.blog .search-form .info {
    font-size: 85%;
    color: #999;
    line-height: 200%;
}
#content.blog .search-form .info:before {
    content: attr(data-info);
}