/**
 * [HrT] Hostage Rescue Troopers - Web-Layout
 *
 * layout.css / $Id: layout.css 46 2010-01-08 18:43:13Z axel.wehner $
 * Beinhaltet saemtliche CSS-Deklarationen des Gesamtlayout.
 *
 * @author        Axel Wehner <aw@68media.de>,
 *                $LastChangedBy: axel.wehner $ @ $Date: 2010-01-08 19:43:13 +0100 (Fr, 08 Jan 2010) $
 * @copyright     Copyright (c) 2009, 68media web/design - Axel Wehner
 * @license       proprietary
 * @link          http://hrt.68media.de HrT Projektverwaltung
 * @package       hrt.layout.css
 * @subpackage    layout
 * @since         1.0
 * @version       $Revision: 46 $
 * @filesource    $URL: http://svn.68media.de/repos/hrtclan/trunk/code/layout/css/layout.css $
 */

/**
 * CSS Reset
 * Alle Standardwerte des Browsers zuruecksetzen
 * 
 * @see http://meyerweb.com/eric/tools/css/reset/
 *****************************************************************************************************************/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

body {
    line-height: 1;
}

ol, ul {
    list-style: none;
}

blockquote, q {
    quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}

:focus {
    outline: 0;
}

ins {
    text-decoration: none;
}

del {
    text-decoration: line-through;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

/* Abkuerzungen hervorheben */
abbr[title] {
    cursor: help;
    border-bottom: 1px dotted #999999;
}

.hide {
    position: absolute;
    top: -999em;
    left: -999em;
}


/**
 * Clearing der Floats
 * 
 * @see http://www.positioniseverything.net/easyclearing.html
 *****************************************************************************************************************/
.clrfx:after {
    content: " ";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

.clrfx { /* IE Mac Fix */
    display: inline-block;
}

.clr {
    clear: both;
    font-size: 1px;
    height: 1px;
    line-height: 1px;
}


/**
 * Layout Deklarationen
 *****************************************************************************************************************/

/**
 * Body
 *********************************/
body {
	text-align: center;
    font: 62.5% Calibri, Trebuchet MS, Verdana, Arial, sans-serif;
	background: #fff url(../img/body.gif) 0 0 repeat;
    color: #222;
}

/**
 * Seiten Container
 *********************************/
div#page {
	background: transparent url(../img/page.gif) 0 0 repeat-y;
	width: 940px;
	margin: 125px auto 0 auto;
	position: relative;
	font-size: 1.5em;
	line-height: 125%;
	letter-spacing: 0.02em;
    text-align: left;
}
    /**
     * Login
     *********************************/

div#login {
    width: 170px;
    height: 31px;
        position: absolute;
        top: -125px; left: 772px;
        z-index:1600;
}
    div#login ul {
        list-style-type: none;
        display: block;
        margin: 0;
        padding: 0;
    }
        div#login ul li {
            display: inline;
        }


    /**
     * Logo
     *********************************/
    h1#logo {
        position: absolute;
        top: -104px; left: 0;
        width: 940px;
        height: 104px;
        background: transparent url(../img/content_top.png) bottom left no-repeat;
        z-index: 100;
    }

        h1#logo img {
            vertical-align: bottom;
        }


    /**
     * Inhaltsbereich
     *********************************/
    div#content {
        padding: 20px 20px 10px 20px;
    }


        /**
         * Infobereich
         *********************************/
        div#info {
            height: 240px;
            padding: 0;
            margin: -5px 0 -20px 0;
            /* background: #fff url(../img/info.jpg) 0 0 no-repeat;*/
        }
       div#title {
            height: 60px;     
            font-size: 1.8em;
            color: #fff;
            letter-spacing: 0;
            text-shadow: 1px 1px #444;     
            background: url(../img/title.png) no-repeat;
            }
                div#title p {			
                    height: 20px;
                    margin: 0 0 20px 0;
                    font-size: 1.0em;
                    padding: 20px 20px;
                    color: #fff;
                    letter-spacing: 0;
                    text-shadow: 1px 1px #444;
                }



        /**
         * Sektionstitel
         *********************************/
        h2#section {
            line-height: 60px;
            height: 60px;
            padding: 0 20px;
            margin: -5px 0 0 0;
            color: #fff;
            letter-spacing: 0;
            font-size: 2em;
            background: #474747 url(../img/title.png) 0 0 no-repeat;
        }


        /**
         * Hauptinhalt (Linke Spalte)
         *********************************/
        div#main {
            float: left;
        	width: 600px;
        }


            h3#subline {
                background: #fff url(../img/subline.png) 0 0 no-repeat;
                height: 22px;
                margin: 0 0 20px 0;
                font-size: 1.8em;
                font-weight: bold;
                padding: 15px 20px;
                color: #fff;
                letter-spacing: 0;
                text-shadow: 1px 1px #444;
            }


        /**
         * Seitenleiste (Rechte Spalte)
         *********************************/
        div#sidebar {
            margin: 20px 0 0 620px;
            height: 1%;
        }


/**
 * Footer
 *********************************/
div#footer {
    background: transparent url(../img/footer.png) 0 0 no-repeat;
    height: 60px;
    width: 940px;
    margin: 0 auto 20px auto;
	position: relative;
	font-size: 1.4em;
	color: #fff;
}


    /* copyright */
	div#footer p {
	    position: absolute;
	    right: 15px;
	    bottom: 3px;
	    top: 30px;
	}


    /* meta navigation */
    div#footer ul{
    	position: absolute;
        right: 15px;
    	top: 12px;
    }

        div#footer ul li{
            list-style: none;
            float: right;
            margin: 0 0 0 8px;
        }
        
            div#footer ul li a {
                color: #fff;
            }
            
            div#footer ul li a:hover {
                color: #fff;
                text-decoration: none;
            }

/* Contentbox klein */

div.content_box {
    padding: 10px 5px 2px 5px;
    margin: 0 0 20px 0;
    background: #fff url(../img/server/content_box.png) 0 100% no-repeat;
}

/* Contentbox groß */

div.content_box_big {
    padding: 10px 5px 10px 5px;
    margin: 0 0 20px 0;
    background: #fff url(../img/content_box_big.png) 0 100% no-repeat;
}

/* H3 für alle Seiten... Namen überdenken und ändern */

h3.server {
    line-height: 30px;
    height: 30px;
    padding: 0 20px;
    margin: -10px 0 0 auto;
    color: #3463AA;
    letter-spacing: 0;
    border-bottom: 1px solid #ccc;
    width: 550px;
}

h3.sc_server {
    line-height: 30px;
    height: 30px;
    padding: 0 10px;
    margin: -10px 0 0 auto;
    color: #3463AA;
    letter-spacing: 0;
    border-bottom: 1px solid #ccc;
    width: 240px;
    font-size: 0.8em;
}

/* Refreshbutton Server Seite */

div.refresh {
    position: relative;
    width: 590px;
    right: 0;
    bottom: auto;
    z-index:1600;
}

/* Kommentare */

div.comments_head {
    width:581px;
    height: 34px;
    background:url(../img/comments/comment_head.png) no-repeat;
    padding: 5px 10px 0 10px;
    margin: 0;
}
div.comments_content {
    width: 569px;
    min-height:50px;

    background-color: #F1F0F2;
    border-right: 1px solid #ccc;
    border-left: 1px solid #ccc;
    padding: 0 10px 0 20px;
    margin-top: -5px;
}
div.comments_foot {
    width:561px;
    height: 31px;
    background:url(../img/comments/comment_foot.png) no-repeat;
    padding: 10px 0 0 40px;
    margin: 0 0 10px 0;
}

/* Gästebuch */

div.guestbook_head {
    width:881px;
    height: 28px;
    background:url(../img/guestbook/top.png) no-repeat;
    padding: 5px 10px 0 10px;
    margin: 0;
}
div.guestbook_content {
    width: 868px;
    min-height:50px;
    background-color: #F1F0F2;
    border-right: 1px solid #ccc;
    border-left: 1px solid #ccc;
    padding: 0 10px 0 20px;
    margin-top: -5px;
}

div.guestbook_foot {
    width:861px;
    height: 28px;
    background:url(../img/guestbook/bottom.png) no-repeat;
    padding: 15px 0 0 40px;
    margin: 0 0 10px 0;
}

div.sc_guestbook_head {
    width:260px;
    height: 34px;
    background:url(../img/guestbook/sc_top.png) no-repeat;
    padding: 8px 0 5px 10px;
    margin: 0;
    font-size: 0.8em;
    font-weight: bold;
    color: #666;
}
div.sc_guestbook_content {
    width: 228px;
    min-height:50px;
    background-color: #FFF;
    border-right: 1px solid #ccc;
    border-left: 1px solid #ccc;
    padding: 0 10px 0 20px;
    margin-top: -13px;

}

div.sc_guestbook_foot {
    width:260px;
    height: 26px;
    background:url(../img/guestbook/sc_bottom.png) no-repeat;
    padding: 10px 0 0 40px;
    margin: 0 0 10px 0;
    font-size: 0.8em;
    font-weight: bold;
}

div.shoutbox_head {
    width:260px;
    height: 7px;
    background:url(../img/shoutbox/shout_top.png) no-repeat;
    margin: 0;
    font-size: 0.8em;
    font-weight: bold;
}
div.shoutbox_content {
    width: 228px;
    min-height: 5px;
    background-color: #FFF;
    border-right: 1px solid #ccc;
    border-left: 1px solid #ccc;
    padding: 0 10px 0 20px;
}

div.shoutbox_foot {
    width:260px;
    height: 26px;
    background:url(../img/shoutbox/shout_bottom.png) no-repeat;
    padding: 10px 0 0 40px;
    margin: 0 0 5px 0;
    font-size: 0.8em;
    color: #666;
}


/* Profil Userpic in Sidebox */
div#userpic {
    padding: 5px 5px 10px 5px;
    text-align: center;
}
    div#userpic img {
        width: 260px;
    }
    
    
/* Profil Content Navbar */
div#profile_navbar {
    width: 600px;
    line-height:32px;
    border-bottom: 1px solid #ccc;
}

ul#profile_nav {
    width: 600px;
    height: 32px;
    margin: 10px 0 0 0;
    z-index: 200;

}

    ul#profile_nav li {
        list-style-type: none;
    }

        ul#profile_nav li img {
            display: block;
            float: left;
            padding-right: 1px;
            border: 0;
            
        }

/* Userrang für Profil */
div#userrang {
    position: absolute;
    width: 510px;
    right: 0;
    top: 95px;
}

/* Content Title für Tabellen */
tr.table_tr {
    border-bottom: 1px solid #ccc;
    color:#2E5DA4;
}

/* Subline Button Links */
div#subline_button {
    width: 300px;
    height: 31px;
    position: absolute;
    top: 80px; left: 620px;
    z-index:100;

}
    div#subline_button ul {
        list-style-type: none;
        display: block;
        margin: 0;
        padding: 0;
    }
    
        div#subline_button ul li {
            display: inline;
            padding-left: 2px;
            float:right;
        }
        
        /* Subline Button Guestbook */
            div#subline_button ul li a.eintrag {
                display:block;
                width:120px;
                height:32px;
                background: url(../img/guestbook/eintrag.png) no-repeat;
            }

             div#subline_button ul li a.eintrag:hover {
                background: url(../img/guestbook/eintrag_aktiv.png) no-repeat;
            }

        /* Subline Button Calendar Clanwar */
            div#subline_button ul li a.cwbutton {
                display:block;
                width:152px;
                height:32px;
                background: url(../img/calendar/clanwar_eintrag.png) no-repeat;
            }

             div#subline_button ul li a.cwbutton:hover {
                background: url(../img/calendar/clanwar_eintrag_aktiv.png) no-repeat;
            }

        /* Subline Button Calendar Event */
            div#subline_button ul li a.eventbutton {
                display:block;
                width:131px;
                height:32px;
                background: url(../img/calendar/event_eintrag.png) no-repeat;
            }

            div#subline_button ul li a.eventbutton:hover {
                background: url(../img/calendar/event_eintrag_aktiv.png) no-repeat;
            }
            
            /* Messenger Posteingang */
            div#subline_button ul li a.eingang {
                display:block;
                width:119px;
                height:32px;
                background: url(../img/messenger/posteingang.png) no-repeat;
            }

             div#subline_button ul li a.eingang:hover {
                background: url(../img/messenger/posteingang_aktiv.png) no-repeat;
            }

            /* Messenger Postausgang */
            div#subline_button ul li a.ausgang {
                display:block;
                width:123px;
                height:32px;
                background: url(../img/messenger/postausgang.png) no-repeat;
            }

             div#subline_button ul li a.ausgang:hover {
                background: url(../img/messenger/postausgang_aktiv.png) no-repeat;
            }

            /* Messenger Neue Nachricht */
            div#subline_button ul li a.newmsg {
                display:block;
                width:141px;
                height:32px;
                background: url(../img/messenger/new_message.png) no-repeat;
            }

             div#subline_button ul li a.newmsg:hover {
                background: url(../img/messenger/new_message_aktiv.png) no-repeat;
            }
            
            
h4.content_headline_big {
    height: 20px;
    font-size: 1.0em;
    color: #fff;
    padding: 5px 10px;
    margin:0;
    letter-spacing: 0;
    text-shadow: 1px 1px #444;
    background: url(../img/content_box_head_big.png) no-repeat;
}

.sidebox td {
    padding: 5px 10px;
    font-size: 13px;
}

/* TO SERVER START */

div#players ul li {
    list-style-type: none;
}

div#mappic {
    text-align:center;
}

.swat {
    color:#5F81B7;
}

.terror {
    color:#CE3E0E;
}
/* TO SERVER ENDE */

.slider-wrapper { 
	width: 100%; 
	z-index: 1200;
}
/* -------------------- Indicators -------------------- */


.indicator {
	width: 220px;
	height: 12px;
	background: url(../img/indicator-bg.gif) no-repeat top left;
	}

.indicator div {
	height: 12px;
	background: url(../img/indicator-green-to-red.gif) no-repeat top left;
	}

.indicator div.reverse {
	background: url(../img/indicator-red-to-green.gif) no-repeat top left;
	}