@charset "UTF-8";
/*
Author: Heiko Bee
Author URI: http://maxout.de/

##### TABLE OF CONTENTS #####
Main-Wrapper:
Topbar: Main-Menu, Login-Form, Support-Menu
Main-Head:
Teasers: Site-Teaser, Tool-Teasers
Additional-Content:Steps, Testimonials, News, RSS
Footer:Sitemap, Awards, Copyright

##### COLOR PALETTE #####

#ffffff Background
#f3f3f3 Light-Background
#eaeaea Darker-Background
#333333 Darker-Font-Color
#999999 Lighter-Font-Color

#858e9b Light-Blue-Font-Color
#e69832 Orange-Link-Color

*/

/*######## Begin Layout ##########*/

* { margin:0; padding:0; }

body { 
    background: url(../img/bg_body.jpg) repeat-x #f4f4f4; 
    font-family: "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
    font-size: 12px;
    color:#333;
    text-align:center;
}

/*Main-Wrapper*/
#wrap { 
    width:1010px; 
    margin:0 auto;
    padding: 0 5px;
    background:url(../img/bg_wrap.png) repeat-y;
    text-align:left;
}


/*Topbar*/

#topbar {
    width:1000px;
    height:41px;
    background: url(../img/bg_body2.jpg) repeat-x #fff; 
}

#topbar ul#mainmenu,#topbar ul#supportmenu {
    height: 41px;
    float: left;
    list-style: none;
    overflow:hidden;
}

#topbar ul#mainmenu li,#topbar ul#supportmenu li {
    position:relative;
    display:inline;
    float:left;
    cursor:pointer;
}

#topbar ul#mainmenu li a {
    display:block;
    width:105px;
    height:29px;
    text-align:center;
    color:#333;
    font-size:13px;
    text-decoration: none;
    padding: 12px 0;
    background: url(../img/bg_mainmenu.jpg) right top no-repeat;
}

#topbar ul#mainmenu li a:hover,#topbar ul#mainmenu li.active a {
    background: url(../img/bg_mainmenu.jpg) left top no-repeat;
}

#topbar ul#mainmenu li.join a {
    background: url(../img/bg_mainmenu-join.jpg) left top no-repeat;
}


#loginform {
    float:left;
    margin:3px 10px 10px 10px;
    width:220px;
    position:relative;
}

#loginform p  {
    float:left;
    width:85px;
    height:25px;
    background: url(../img/bg_input-login.jpg) no-repeat;
}

#loginform p.btn {
    background: none;
    width:auto;
}

#loginform p input {
    width:75px;
    padding:4px 2px 0 5px;
    font-size: 11px;
    color:#858e9b;
    border:none;
    overflow:hidden;
    background-color: transparent;
}

#loginform p input.btn {
    width:48px;
    height:25px;
    padding-bottom: 6px;
    background: url(../img/bg_login-btn.jpg) no-repeat;
    color:#fff;
    cursor: pointer;
}

#loginform p.link {
    background: none;
    text-align:right;
    width:220px;
    height:auto;
    margin:-12px 0;
}
#loginform p.link a {
    color:#858e9b;
    text-decoration: underline;
    
}
#loginform p.link a:hover {
    text-decoration: underline;
    
}

#topbar ul#supportmenu li {
    width:64px;
    height:41px;
}
#topbar ul#supportmenu li a {
    display:block;
    height:41px;
    text-indent: -999em;
}
#topbar ul#supportmenu li.support a {
    background: url(../img/bg_btn-support.jpg) top left no-repeat;
}
#topbar ul#supportmenu li.support a:hover{
    background: url(../img/bg_btn-support.jpg) top right no-repeat;
}
#topbar ul#supportmenu li.help a {
    background: url(../img/bg_btn-help.jpg) top left no-repeat;
}
#topbar ul#supportmenu li.help a:hover{
    background: url(../img/bg_btn-help.jpg) top right no-repeat;
}

/*Main-Head*/
#mainhead {
    height:345px;
    width:100%;
    background: url(../img/bg_mainhead.jpg) no-repeat;
}

#mainhead a {
    width:100%;
    height:100%;
    display:block;
    text-indent: -999em;
}

/*Teasers*/
#teasers {
    padding-top: 10px;
    height:358px;
}

* html #teasers {
    height:368px;
}

#teasers div {
    float:left;
}

#teasers div p {
    text-align: justify;
}

#teasers div a,#toolteasers div a {
    position:absolute;
    bottom: 0;
    right:0;
}

#toolteasers {
    float:left;
    width:740px;
    padding:0;
    margin-left:10px;
}
#toolteasers div {
    float:left;
    position: relative;
    width:320px;
    height:168px;
    overflow:hidden;
    padding:10px 0 0 0px;
    margin-left:10px; 
}

#toolteasers div p{
    height:150px;
}
#toolteasers div p,#toolteasers div h1 {
    margin-left:65px;
    width:260px;
}

/*Additionalcontent*/
#additionalcontent {
    clear:left;
    padding: 10px;
    height:400px;
    overflow: hidden;
    background: url(../img/bg_content-top.jpg) top center no-repeat #f2f2f2;
}

* html #additionalcontent {
    height:545px;
}

#additionalcontent h1 {
    font-size: 24px;

}
#additionalcontent div.left {
    float:left;
    width:570px;
}

#steps {
    height:165px;
    width:730px;
    margin-left:-5px;
    background: url(../img/bg_steps.jpg) no-repeat;
    float:left;
}

#steps div {
    float:left;
    width:233px;
    height:165px;
    position:relative;
    display: block;
}
#steps div h2 {
    font-weight:normal;
    font-size: 14px;
    padding:8px 10px 0 10px;
    color:#aeaeae;
}

#steps div p {
    width:230px;
    padding:0 10px;
}
#steps div a {
    display: block;
    position:absolute;
    right:40px;
    bottom:22px;
    color:#333;
}

#testimonials,#faq-accord {
    width:610px;
    margin-top:10px;
    float:left;
}

#testimonials {
    width:569px;
}


#testimonials h2,#faq-accord h2 {
    padding: 10px 0 0 65px;
    height:65px;
    margin:0;
    background: url(../img/icon_testimonials.jpg) no-repeat;
}
#testimonials div p {
    height: 137px;
}

#testimonials a.accordion-head {
    font-size: 14px;
    font-weight: bold;
    cursor: pointer;
    display:block;
    padding:1px 30px;
    height:24px;
    background: url(../img/icon_arr.jpg) no-repeat;
}
.testimonial_box{
    border-bottom: 1px dotted #333;
}
.faq_box{
    font-size: 14px;
    font-weight: bold;
    display:block;
    padding:1px 30px; 
    background: url(../img/icon_arr2.jpg) no-repeat;
    height:auto;
    padding-top:5px;
/*    padding-bottom:5px; */
}
#faq-accord a {
    cursor: pointer;
}


#testimonials p {
    padding:5px 10px 5px 30px;
    height:75px;
    overflow:hidden;

}
#faq-accord p {
    padding:10px 0px;
    font-size: 12px;
    height:auto;
    overflow:hidden;
    font-weight:normal;
}
.faq_box{
    border-bottom: 1px dotted #333;
}

#news {
    float:left;
    width:285px;
    margin-left: 42px;
    margin-top: 25px;
    padding-left: 50px;
    background: url(../img/icon_news.jpg) no-repeat;
}

#news div {
    margin-bottom: 10px;
    height: 100px;
    border-bottom: 1px dotted #333;
    position: relative;
}
#news div a {
    position: absolute;
    bottom: 0;
    right: 0;
}

#rss {
    background: url(../img/icon_rss.jpg) no-repeat;
    padding-left: 50px;
    margin-left: -50px;
    border-bottom: none;

}

/*Footer*/
#footer {
	width:1000px;
    clear: left;
    margin-top:0px;
    padding:30px 5px 10px 10px;
    color:#999;
    font-size: 11px;
    background: url(../img/bg_footer-top.jpg) top left no-repeat;
}

* html #footer {
    padding-top: 25px;
}
#sitemap{
    float:left;
    width:400px;
}

#sitemap div {
    float:left;
    width: 100px;
}
#sitemap div ul {
    list-style: none;
}

#awards {
    float:left;
    width:590px;
    height: 180px;
}

#copyright{
    clear:left;
    padding-top:20px;
}

/* Login Error-Bubble */
.bubbleInfo {
            position: absolute;
            top: 150px;
            right: 100px;
            width: 500px;
        }
        .trigger {
            position: absolute;
        }
     
        /* Bubble pop-up */

        .popup {
                position: absolute;
                display: none;
                z-index: 50;
                border-collapse: collapse;
        }

        .popup td.corner {
                height: 15px;
                width: 19px;
        }

        .popup td#topleft { background-image: url(../img/bubble-1.png);behavior: url(/static/site-media/js/iepngfix.htc); }
        .popup td.top { background-image: url(../img/bubble-2.png); text-align: right;behavior: url(/static/site-media/js/iepngfix.htc); }
        .popup td#topright { background-image: url(../img/bubble-3.png);behavior: url(/static/site-media/js/iepngfix.htc); }
        .popup td.left { background-image: url(../img/bubble-4.png);behavior: url(/static/site-media/js/iepngfix.htc); }
        .popup td.right { background-image: url(../img/bubble-5.png);behavior: url(/static/site-media/js/iepngfix.htc); }
        .popup td#bottomleft { background-image: url(../img/bubble-6.png);behavior: url(/static/site-media/js/iepngfix.htc); }
        .popup td.bottom { background-image: url(../img/bubble-7.png); text-align: center;behavior: url(/static/site-media/js/iepngfix.htc);}
        .popup td.bottom img,.popup td.top img { display: block; margin: 0 auto;behavior: url(/static/site-media/js/iepngfix.htc); }
        .popup td#bottomright { background-image: url(../img/bubble-8.png);behavior: url(/static/site-media/js/iepngfix.htc); }

        .popup table.popup-contents {
                font-size: 11px;
                line-height: 1.2em;
                background-color: #fff;
                color: #666;
                font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", sans-serif;
                }

        table.popup-contents th {
                text-align: right;
                }

        table.popup-contents td {
                text-align: left;
                }

        tr#release-notes th {
                text-align: left;
                text-indent: -9999px;
                background: url(../img/starburst.gif) no-repeat top right;
                height: 17px;
                }

        tr#release-notes td a {
                color: #333;
        }


/* ######### Begin Various Tags & Classes ######### */

h1 {
    font-size:16px;
    margin-bottom:10px;
}

h2 {
    font-size: 16px;
    margin-bottom: 10px;
}

h3 {
    font-size:11px;
}

p {
    margin-bottom: 10px;
}

a:link, a:visited {
    color:#e69832;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

#sitemap a {
    color:#999;
}


a:active, a:focus {
    outline: none
}

.btn-more {
    width: 65px;
    height:25px;
    display: block;
    padding: 3px 0 0 10px;
    color:#333;
    background: url(../img/btn_more.png) no-repeat;
    behavior: url(/static/site-media/js/iepngfix.htc);
}

a.btn-more { color:#333; }

div.headliner {
    position: relative;
    width:auto;
}
h1.category {
    padding-left: 75px;
    height:65px;
    font-size:28px;
}

p.subline {
    font-size: 16px;
    position:absolute;
    top:40px;
    left:75px;
}

div.listing h3 {
    padding-left:16px;
    background: url(../img/bullet.gif) no-repeat;
}
.ul {
    padding:10px;
}
.ul li {
    margin:10px; 
    font-weight: bold;
    list-style-image: url(../img/bullet.gif)
}

.textcol{
    width:200px;
    float:left;
    margin-right: 20px;
}
