/**********************************************************************************/
/* @file:        layout/vollbild/css/main.css
*  @description: Stylesheet der Webseite "Drahtseil Hartmann UVV"
*  @author:      Wolfgang Blessen Software (http://www.blessen.de)
/**********************************************************************************/
/***************************************
*  Generelle Formatierungen
***************************************/
* {
    margin  : 0;
    padding : 0;
}

/* cyrillic-ext */
@font-face {
    font-family   : 'Montserrat';
    font-style    : normal;
    font-weight   : 100;
    src           : local('Montserrat Thin'), local('Montserrat-Thin'), url(https://fonts.gstatic.com/s/montserrat/v12/CdKWaRAal2Bxq9mORLKRRa-j2U0lmluP9RWlSytm3ho.woff2) format('woff2');
    unicode-range : U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

/* cyrillic */
@font-face {
    font-family   : 'Montserrat';
    font-style    : normal;
    font-weight   : 100;
    src           : local('Montserrat Thin'), local('Montserrat-Thin'), url(https://fonts.gstatic.com/s/montserrat/v12/CdKWaRAal2Bxq9mORLKRRZX5f-9o1vgP2EXwfjgl7AY.woff2) format('woff2');
    unicode-range : U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* vietnamese */
@font-face {
    font-family   : 'Montserrat';
    font-style    : normal;
    font-weight   : 100;
    src           : local('Montserrat Thin'), local('Montserrat-Thin'), url(https://fonts.gstatic.com/s/montserrat/v12/CdKWaRAal2Bxq9mORLKRRf8zf_FOSsgRmwsS7Aa9k2w.woff2) format('woff2');
    unicode-range : U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}

/* latin-ext */
@font-face {
    font-family   : 'Montserrat';
    font-style    : normal;
    font-weight   : 100;
    src           : local('Montserrat Thin'), local('Montserrat-Thin'), url(https://fonts.gstatic.com/s/montserrat/v12/CdKWaRAal2Bxq9mORLKRRT0LW-43aMEzIO6XUTLjad8.woff2) format('woff2');
    unicode-range : U+0100-024F, U+0259, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
    font-family   : 'Montserrat';
    font-style    : normal;
    font-weight   : 100;
    src           : local('Montserrat Thin'), local('Montserrat-Thin'), url(https://fonts.gstatic.com/s/montserrat/v12/CdKWaRAal2Bxq9mORLKRRegdm0LZdjqr5-oayXSOefg.woff2) format('woff2');
    unicode-range : U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2212, U+2215;
}

/* cyrillic-ext */
@font-face {
    font-family   : 'Montserrat';
    font-style    : normal;
    font-weight   : 200;
    src           : local('Montserrat ExtraLight'), local('Montserrat-ExtraLight'), url(https://fonts.gstatic.com/s/montserrat/v12/eWRmKHdPNWGn_iFyeEYja-O4KvVqQQis7kr52w7WKck.woff2) format('woff2');
    unicode-range : U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

/* cyrillic */
@font-face {
    font-family   : 'Montserrat';
    font-style    : normal;
    font-weight   : 200;
    src           : local('Montserrat ExtraLight'), local('Montserrat-ExtraLight'), url(https://fonts.gstatic.com/s/montserrat/v12/eWRmKHdPNWGn_iFyeEYjawQ7VzVu3FlzMvz_kt6rKTc.woff2) format('woff2');
    unicode-range : U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* vietnamese */
@font-face {
    font-family   : 'Montserrat';
    font-style    : normal;
    font-weight   : 200;
    src           : local('Montserrat ExtraLight'), local('Montserrat-ExtraLight'), url(https://fonts.gstatic.com/s/montserrat/v12/eWRmKHdPNWGn_iFyeEYjaxJVFIDcAmz_xdaO4iposbc.woff2) format('woff2');
    unicode-range : U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}

/* latin-ext */
@font-face {
    font-family   : 'Montserrat';
    font-style    : normal;
    font-weight   : 200;
    src           : local('Montserrat ExtraLight'), local('Montserrat-ExtraLight'), url(https://fonts.gstatic.com/s/montserrat/v12/eWRmKHdPNWGn_iFyeEYjawmpp9opcZztmOKdRoeEHCU.woff2) format('woff2');
    unicode-range : U+0100-024F, U+0259, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
    font-family   : 'Montserrat';
    font-style    : normal;
    font-weight   : 200;
    src           : local('Montserrat ExtraLight'), local('Montserrat-ExtraLight'), url(https://fonts.gstatic.com/s/montserrat/v12/eWRmKHdPNWGn_iFyeEYja6EWXqnGSfwnQD3YDlprsb0.woff2) format('woff2');
    unicode-range : U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2212, U+2215;
}

/* cyrillic-ext */
@font-face {
    font-family   : 'Montserrat';
    font-style    : normal;
    font-weight   : 300;
    src           : local('Montserrat Light'), local('Montserrat-Light'), url(https://fonts.gstatic.com/s/montserrat/v12/IVeH6A3MiFyaSEiudUMXExNcqx07xvyppV96iFRdwiM.woff2) format('woff2');
    unicode-range : U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

/* cyrillic */
@font-face {
    font-family   : 'Montserrat';
    font-style    : normal;
    font-weight   : 300;
    src           : local('Montserrat Light'), local('Montserrat-Light'), url(https://fonts.gstatic.com/s/montserrat/v12/IVeH6A3MiFyaSEiudUMXE-fhZE2STYI3KzBGzrJG_ik.woff2) format('woff2');
    unicode-range : U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* vietnamese */
@font-face {
    font-family   : 'Montserrat';
    font-style    : normal;
    font-weight   : 300;
    src           : local('Montserrat Light'), local('Montserrat-Light'), url(https://fonts.gstatic.com/s/montserrat/v12/IVeH6A3MiFyaSEiudUMXE_oTkEokFSrSpvYSpZOeZRs.woff2) format('woff2');
    unicode-range : U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}

/* latin-ext */
@font-face {
    font-family   : 'Montserrat';
    font-style    : normal;
    font-weight   : 300;
    src           : local('Montserrat Light'), local('Montserrat-Light'), url(https://fonts.gstatic.com/s/montserrat/v12/IVeH6A3MiFyaSEiudUMXE0_0lycXMw8PhobHtu2Qgco.woff2) format('woff2');
    unicode-range : U+0100-024F, U+0259, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
    font-family   : 'Montserrat';
    font-style    : normal;
    font-weight   : 300;
    src           : local('Montserrat Light'), local('Montserrat-Light'), url(https://fonts.gstatic.com/s/montserrat/v12/IVeH6A3MiFyaSEiudUMXE8u2Q0OS-KeTAWjgkS85mDg.woff2) format('woff2');
    unicode-range : U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2212, U+2215;
}

/* cyrillic-ext */
@font-face {
    font-family   : 'Montserrat';
    font-style    : normal;
    font-weight   : 400;
    src           : local('Montserrat Regular'), local('Montserrat-Regular'), url(https://fonts.gstatic.com/s/montserrat/v12/rBHvpRWBkgyW99dXT88n7yEAvth_LlrfE80CYdSH47w.woff2) format('woff2');
    unicode-range : U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

/* cyrillic */
@font-face {
    font-family   : 'Montserrat';
    font-style    : normal;
    font-weight   : 400;
    src           : local('Montserrat Regular'), local('Montserrat-Regular'), url(https://fonts.gstatic.com/s/montserrat/v12/NX1NravqaXESu9fFv7KuqiEAvth_LlrfE80CYdSH47w.woff2) format('woff2');
    unicode-range : U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* vietnamese */
@font-face {
    font-family   : 'Montserrat';
    font-style    : normal;
    font-weight   : 400;
    src           : local('Montserrat Regular'), local('Montserrat-Regular'), url(https://fonts.gstatic.com/s/montserrat/v12/SKK6Nusyv8QPNMtI4j9J2yEAvth_LlrfE80CYdSH47w.woff2) format('woff2');
    unicode-range : U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}

/* latin-ext */
@font-face {
    font-family   : 'Montserrat';
    font-style    : normal;
    font-weight   : 400;
    src           : local('Montserrat Regular'), local('Montserrat-Regular'), url(https://fonts.gstatic.com/s/montserrat/v12/gFXtEMCp1m_YzxsBpKl68iEAvth_LlrfE80CYdSH47w.woff2) format('woff2');
    unicode-range : U+0100-024F, U+0259, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
    font-family   : 'Montserrat';
    font-style    : normal;
    font-weight   : 400;
    src           : local('Montserrat Regular'), local('Montserrat-Regular'), url(https://fonts.gstatic.com/s/montserrat/v12/zhcz-_WihjSQC0oHJ9TCYPk_vArhqVIZ0nv9q090hN8.woff2) format('woff2');
    unicode-range : U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2212, U+2215;
}

/* cyrillic-ext */
@font-face {
    font-family   : 'Montserrat';
    font-style    : normal;
    font-weight   : 700;
    src           : local('Montserrat Bold'), local('Montserrat-Bold'), url(https://fonts.gstatic.com/s/montserrat/v12/IQHow_FEYlDC4Gzy_m8fcude9INZm0R8ZMJUtfOsxrw.woff2) format('woff2');
    unicode-range : U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}

/* cyrillic */
@font-face {
    font-family   : 'Montserrat';
    font-style    : normal;
    font-weight   : 700;
    src           : local('Montserrat Bold'), local('Montserrat-Bold'), url(https://fonts.gstatic.com/s/montserrat/v12/IQHow_FEYlDC4Gzy_m8fcrpHcMS0zZe4mIYvDKG2oeM.woff2) format('woff2');
    unicode-range : U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

/* vietnamese */
@font-face {
    font-family   : 'Montserrat';
    font-style    : normal;
    font-weight   : 700;
    src           : local('Montserrat Bold'), local('Montserrat-Bold'), url(https://fonts.gstatic.com/s/montserrat/v12/IQHow_FEYlDC4Gzy_m8fcjh33M2A-6X0bdu871ruAGs.woff2) format('woff2');
    unicode-range : U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}

/* latin-ext */
@font-face {
    font-family   : 'Montserrat';
    font-style    : normal;
    font-weight   : 700;
    src           : local('Montserrat Bold'), local('Montserrat-Bold'), url(https://fonts.gstatic.com/s/montserrat/v12/IQHow_FEYlDC4Gzy_m8fchHJTnCUrjaAm2S9z52xC3Y.woff2) format('woff2');
    unicode-range : U+0100-024F, U+0259, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}

/* latin */
@font-face {
    font-family   : 'Montserrat';
    font-style    : normal;
    font-weight   : 700;
    src           : local('Montserrat Bold'), local('Montserrat-Bold'), url(https://fonts.gstatic.com/s/montserrat/v12/IQHow_FEYlDC4Gzy_m8fcoWiMMZ7xLd792ULpGE4W_Y.woff2) format('woff2');
    unicode-range : U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2212, U+2215;
}

body, p, td, li {
    /*font-family : "Bitstream Vera Sans", Geneva, Verdana, arial, sans-serif;*/
    font-family : "Montserrat", Helvetica, Arial, sans-serif;
    /*font-family: "Trebuchet MS", sans-serif;*/
    font-size   : 14px;
    color       : #000033;
}

p {
    display       : block;
    margin-bottom : 5px;
}

img {
    border : none;
}

.clear {
    clear   : both;
    margin  : 0;
    padding : 0;
    width   : 0;
    height  : 0;
    border  : 0;
}

.pull-right {
    float : right;
}

.pull-left {
    float : left;
}

a {
    color           : #00f;
    text-decoration : underline;
}

a:hover {
    color           : #009;
    text-decoration : underline;
}

ul {
    list-style-type : none;
}

/***************************************
 *  W E B S I T E C O L O R S
 ***************************************/
.font_color {
    color : #222222;
}

.line_grey {
    color : #cbcdcf;
}

.background_light {
    color : #f5f5f5;
}

.background_grey {
    color : #e9ebee;
}

.background_dark {
    background-color : #353535;
}

.background_lightblue {
    background-color : #6899f9;
}

.background_blue {
    background-color : #154396;
}

/***************************************
 *  F O R M U L A R E
 ***************************************/
select, input, textarea {

    max-width        : 100%;
    /*padding          : 1px;*/
    padding          : 10px;

    font-weight      : 400;
    border           : 1px solid #d9d9d9;
    border-radius    : 4px;

    /*background-color : #ececec;*/
    background-color : #fff;
    color            : #600;
}

select:active, input:active, textarea:active {
    border : 1px solid #600;
}

select:focus, input:focus, textarea:focus {
    border : 1px solid #600;
}

option {
    padding    : 2px 2px 2px 18px;
    background : url(../images/pfeil_rechts_16.png) left no-repeat;
}

td {
    padding        : 2px;
    vertical-align : top;
}

a.content:link, a.content:visited, a.content:active {
    color           : #cc0000;
    text-decoration : none;
}

a.content:hover {
    color           : #cc0000;
    text-decoration : underline;
}

#hilfe {
    padding       : 10px 10px 10px 50px;
    min-height    : 20px;
    border        : 1px solid brown;
    border-radius : 4px;
    box-shadow    : 5px 5px 10px #666;
    color         : #000000;
    font-style    : oblique;
    background    : #ffffcc url(../images/information.png) no-repeat left center;
}

a.piwik {
    background    : none repeat scroll 0 0 #fff;
    border        : 1px solid black;
    border-radius : 2px 2px 2px 2px;
    color         : black;
    padding       : 1px;
}

/***************************************
*  div-Container für den Seitenaufbau  *
****************************************/
body#wbs-seite {
    background-color : #d3d3d3;
    width            : 100%;
    height           : 100%;
}

#startleiste {
    position      : absolute;
    width         : 960px;
    left          : 50%;
    margin-left   : -480px;
    height        : 80px;
    font-size     : 16px;
    background    : #fff url(../images/hartmann_logo_lang.jpg) no-repeat left center;
    margin-top    : 0;
    margin-bottom : 0;
}

#version {
    display      : none;
    /*	position:absolute;
        top:10px;
        left:730px; */
    float        : right;
    margin-right : 87px;
    margin-top   : 8px;
    text-align   : right;
    z-index      : 9;
    background   : transparent;
    height       : 20px;
    color        : #973030;
    font-weight  : 700;
}

#container {

    box-sizing        : border-box;

    position          : absolute;
    width             : 100%;
    height            : 100%;

    display           : -webkit-flex;
    display           : flex;
    -webkit-flex-flow : column nowrap;
    flex-flow         : column nowrap;

    top               : 0; /*top:80px;*/
    left              : 0;

    margin            : 0;
    border            : 0;
    /*border            : solid 2px #527096;*/
    /*border-radius     : 2px;*/

    /*background: darkorange;*/

}

#head {

    width            : 100%;
    height           : 24px;
    padding          : 0;
    margin           : 0;
    flex             : 0 0 24px;

    background-color : #f0f0f0;
}

#kunden_leiste {
    width         : 955px;
    height        : 24px;
    line-height   : 24px;
    background    : url(../images/verlauf_grau_40.png) left center repeat-x #cfcfcf;
    border-bottom : 2px solid #ccc;
    text-align    : right;
    margin        : 0;
    padding       : 0 5px 0 0;
}

#kunden_leiste select {
    background-color : #ffc;
    border           : 0;
    border-radius    : 0;
    color            : #660000;
    padding          : 0;
    margin           : 0;
    height           : 18px;
}

#navigation {
    z-index          : 2;
    position         : relative;
    top              : 0;
    left             : 0;
    width            : 960px;
    height           : 24px;
    background-color : #f0f0f0;
}

#user {
    height      : 24px;
    line-height : 24px;
    float       : right;
    padding     : 0 10px 0 0;
    margin      : 0;
    /*background-color : #f0f000;*/

}

#headline {

    box-sizing   : border-box;
    width        : 100%;

    flex         : 0 0 40px;

    padding-left : 15px;

    line-height  : 40px;

    text-align   : left;
    font-weight  : 700;
    font-size    : 16px;
    color        : #fff;
    text-shadow  : 1px 1px 1px black;
    background   : #343434;
    /*background   : url(../images/headline_bg_bluegrey.png) center left repeat-x;*/
}

#content {

    position         : relative;
    box-sizing       : border-box;
    width            : 100%;
    min-height       : 200px;

    flex             : auto;

    padding          : 10px 15px 10px 15px;

    background-color : #f5f5f5;
    /*background: url("../images/uvv_pruefungen.jpg");*/
    /*background : url("../images/hartmann_logo_grey_transparent.png") bottom right no-repeat #f5f5f5;*/

    overflow         : auto;

}

body.login #content {

    background      : url("../images/sunset.jpg");
    background-size : cover;

}

#footer {
    box-sizing   : border-box;
    width        : 100%;
    height       : 32px;

    flex         : 0 0 32px;

    padding-left : 10px;

    z-index      : 999;

    text-align   : center;

    line-height  : 32px;
    font-weight  : 400;
    font-size    : 14px;
    color        : #fff;

    /*background   : url(../images/headline_bg_bluegrey.png) center left repeat-x;*/
    /*background   : #154396;*/
    background   : #262626;
}

#footer a {
    color       : #fff;
    padding     : 2px;
    height      : 20px;
    line-height : 20px;
    margin      : 5px;
    text-align  : center;
}

/*********************
* Login Page
**********************/
#login_box {
    box-sizing    : border-box;
    width         : 350px;
    margin        : 120px auto 0;
    padding       : 20px;

    /*background : url("../images/hartmann_logo_grey_transparent.png") top center no-repeat #fff;*/
    background    : url("../images/logo_drahtseil_hartmann.png") 30px 10px no-repeat #fff;
    border        : 1px solid #ccc;
    border-radius : 10px;
    box-shadow    : 1px 1px 3px #f90;
}

/*********************
* Navigation         *
**********************/
a.nav_link {
    display         : block;
    float           : left;
    position        : absolute;
    width           : 90px;
    height          : 24px;
    padding         : 0;
    text-align      : center;
    line-height     : 24px;
    /*font-family     : Arial, Helvetica, sans-serif;*/
    font-size       : 14px;
    color           : #000;
    text-decoration : none;
}

a.nav_link:link, a.nav_link:visited {
    color           : #000;
    text-decoration : none;
}

a.nav_link:hover {
    color            : #fff;
    background-color : #316ac5;
    text-decoration  : none;
}

#root_nav1 {
    top     : 0;
    left    : 15px;
    z-index : 6;
}

#root_nav2 {
    top     : 0;
    left    : 115px;
    z-index : 5;
}

#root_nav3 {
    top     : 0;
    left    : 215px;
    z-index : 7;
}

#root_nav4 {
    top     : 0;
    left    : 315px;
    z-index : 8;
}

#root_nav5 {
    top     : 0;
    left    : 415px;
    z-index : 9;
}

#root_nav6 {
    top     : 0;
    left    : 515px;
    z-index : 10;
}

#nav1_sub {
    z-index    : 10;
    visibility : hidden;
    position   : absolute;
    top        : 64px;
    left       : 5px;
}

#nav2_sub {
    z-index    : 10;
    visibility : hidden;
    position   : absolute;
    top        : 64px;
    left       : 105px;
}

#nav3_sub {
    z-index    : 10;
    visibility : hidden;
    position   : absolute;
    top        : 64px;
    left       : 205px;
}

#nav4_sub {
    z-index    : 10;
    visibility : hidden;
    position   : absolute;
    top        : 64px;
    left       : 305px;
}

#nav5_sub {
    z-index    : 10;
    visibility : hidden;
    position   : absolute;
    top        : 64px;
    left       : 405px;
}

#nav6_sub {
    z-index    : 10;
    visibility : hidden;
    position   : absolute;
    top        : 64px;
    left       : 505px;
}

.sub_link {
    display         : block;
    width           : 125px;
    height          : 24px;
    text-align      : left;
    padding-left    : 5px;
    /*font-family     : Arial, Helvetica, sans-serif;*/
    font-size       : 15px;
    font-weight     : 400;
    line-height     : 24px;
    background      : yellow;
    text-decoration : none;
    border          : 1px solid #000;
}

.sub_link:link, .sub_link:visited {
    color            : #000;
    background-color : #fff;
    text-decoration  : none;
}

.sub_link:hover, .sub_link:active {
    color            : #fff;
    background-color : #316ac5;
    text-decoration  : none;
}

/*********************
*  Horizontale Tabs
**********************/
div.backend_horizontal_menu {
    border-bottom : 1px solid #3333ff;
    margin-bottom : 10px;
}

div.backend_horizontal_menu ul {
    display        : flex;
    flex-direction : row;
}

div.backend_horizontal_menu ul li {
    flex            : auto;
    list-style-type : none;
    overflow        : hidden;

    height          : 25px;
    line-height     : 25px;

    margin          : 0 3px;

    border-left     : 1px solid #d0d0d0;
    border-top      : 1px solid #d0d0d0;
    border-right    : 1px solid #d0d0d0;

    border-radius   : 5px 5px 0 0;

    text-align      : center;
    color           : #d0d0d0;
}

div.backend_horizontal_menu ul li a {
    color : #d0d0d0;

}

div.backend_horizontal_menu ul li.active,
div.backend_horizontal_menu ul li.active a {
    background-color : rgba(248, 76, 37, 0.52);
    color            : white;
}

div.backend_horizontal_menu ul li:hover,
div.backend_horizontal_menu ul li:hover a {
    background-color : rgba(248, 76, 37, 0.52);
    color            : white;
}

div.backend_horizontal_menu ul li a {
    display         : block;
    width           : 100%;
    text-align      : center;
    text-decoration : none;
}

div.backend_horizontal_menu ul li a:hover {
    /*background : darkorange;*/
}

/*********************
*  POPUP
**********************/
#wbs_popup {
    border           : solid 1px #527096;
    border-radius    : 2px;
    padding          : 0;
    margin           : 0;
    background-color : #ffffff;
    z-index          : 300;
}

.wbs_popup_headline {
    width       : 100%;
    height      : 18px;
    position    : relative;
    line-height : 18px;
    left        : 0;
    text-align  : left;
    font-weight : 400;
    font-size   : 13px;
    color       : #fff;
    overflow    : hidden;
    text-shadow : 1px 1px 1px black;
    background  : url(../images/headline_bg_bluegrey.png) top left repeat-x;
}

.wbs_popup_title {
    float        : left;
    padding-left : 15px;
}

.wbs_popup_headline_button {
    float  : right;
    height : 13px;
}

.wbs_popup_headline_button a {
    color           : white;
    display         : block;
    float           : right;
    height          : 13px;
    width           : 13px;
    text-decoration : none;
    font-style      : oblique;
    text-align      : center;
    border          : solid #fff 1px;
    line-height     : 13px;
    font-size       : 10px;
    margin          : 1px;
    padding         : 1px;
}

.wbs_popup_headline_button a:hover {
    background : navy;
}

.wbs_popup_content {
    padding : 5px;
}

/*********************
*  Modale Container  *
**********************/
.wbs_editor {
    display          : block;
    position         : fixed;
    width            : 600px;
    min-height       : 286px; /* 250 + 32Headline + (2+2) Border */
    top              : -1600px;
    left             : -1750px;
    border           : solid 2px #527096;
    border-radius    : 2px;
    padding          : 0;
    margin           : 0;
    background-color : #ffffff;
    z-index          : -1;
}

.wbs_editor_headline {
    width       : 100%;
    height      : 24px;
    position    : relative;
    line-height : 24px;
    left        : 0;
    text-align  : left;
    font-weight : 400;
    font-size   : 14px;
    color       : #fff;
    overflow    : hidden;
    text-shadow : 1px 1px 1px black;
    background  : url(../images/headline_bg_bluegrey.png) top left repeat-x;
}

.wbs_editor_title {
    float        : left;
    padding-left : 15px;
}

.wbs_editor_headline_button {
    float  : right;
    height : 24px;
}

.wbs_editor_headline_button a {
    color           : white;
    display         : block;
    float           : right;
    height          : 18px;
    width           : 18px;
    text-decoration : none;
    font-style      : oblique;
    text-align      : center;
    border          : solid #fff 1px;
    line-height     : 18px;
    font-size       : 12px;
    margin          : 1px;
    padding         : 1px;
}

.wbs_editor_headline_button a:hover {
    background : navy;
}

.wbs_editor_content {
    padding : 10px;
}

#semitransparent {
    display          : block;
    position         : fixed;
    top              : -5000px;
    left             : -5000px;
    width            : 100%;
    height           : 100%;
    background-color : #000;
    /*noinspection Annotator*/
    filter           : alpha(opacity:80);
    KHTMLOpacity     : 0.80;
    MozOpacity       : 0.80;
    opacity          : 0.80;
    z-index          : -2;
}

/*********************
* Content Editor     *
**********************/
#content_name {
    height        : 18px;
    line-height   : 18px;
    margin-top    : 10px;
    margin-bottom : 10px;
}

.editor_table {
    width : 100%;
}

/***********
*  Texte   *
************/
h2 {
    font-size        : 16px;
    line-height      : 24px;
    background-color : #154396;
    color            : #fff;
    text-shadow      : 1px 1px 2px #222;

    padding          : 2px 2px 2px 5px;
    border           : 1px solid #b8b8b5;
    margin-top       : 2px;
    margin-bottom    : 8px;
}

h4 {
    font-size     : 14px;
    font-weight   : 700;
    color         : #2e384f;
    margin-top    : 1px;
    margin-bottom : 7px;
}

/*******************
*  Links im Men�  **
********************/
.linklist ul {
    margin-left : 20px;
}

.linklist li {
    list-style   : none;
    /* background: url(../images/mainlink.gif) no-repeat left center;*/
    padding-left : 1.2em;
}

/***************************
*  Links auf der Startseite
***************************/
a.login {
    color           : #666;
    text-decoration : none;
}

a.login:hover {
    color           : #333;
    text-decoration : underline;
}

/***************************************
* Admin
***************************************/
td.table_selected {
    border : 1px solid red;
}

/***************************************
* SuperTable
***************************************/
table.supertable {
    border : 1px solid #3333ff;
    margin : 15px;
}

table.supertable td {
    padding       : 2px;
    border-right  : 1px solid #cccccc;
    border-bottom : 1px solid #cccccc;
}

table.supertable tr.header th {
    vertical-align   : top;
    height           : 16px;
    padding          : 2px;
    background-color : #aed7ff;
    border-right     : 1px solid #cccccc;
    border-bottom    : 2px solid #cccccc;
}

table.supertable tr.gerade {
    background-color : #e8f3ff;
}

/***************************************
* Formulare
***************************************/
#objekt_table input, #objekt_table textarea {
    padding       : 2px;
    font-family   : Courier, monospace;
    border-radius : 2px;
}

.objekt_td_all {
    padding    : 5px;
    color      : black;
    text-align : left;
}

.objekt_td_left {
    float      : left;
    width      : 170px;
    padding    : 2px 5px;
    color      : black;
    /* font-weight:700;*/
    text-align : left;
}

.objekt_td_right {
    float   : left;
    width   : 410px;
    padding : 2px 5px;
    color   : black;
}

.numeric {
    text-align : right;
}

.num_input {
    text-align : right;
}

input[type=submit] {
    /* padding:2px; */
}

a.integer_plus {
    display          : inline;
    background-color : #7d9bd9;
    color            : white;
    font-weight      : 700;
    width            : 16px;
    padding-left     : 5px;
    padding-right    : 5px;
    text-align       : center;
    line-height      : 12px;
    font-size        : 12px;
    border           : 1px solid white;
    text-decoration  : none;
}

a.integer_plus:hover {
    color            : yellow;
    background-color : #7d9bd9;
}

/*
	Button -Like f�r Action 
*/
a.action {
    padding-left          : 5px;
    padding-right         : 5px;
    height                : 28px;
    line-height           : 28px;
    color                 : white;
    text-decoration       : none;
    font-size             : 14px;
    text-align            : center;
    /* BACKGROUND GRADIENTS */
    background            : #2e384f;
    background            : -moz-linear-gradient(top, #ccc, #acacac 50%, #aaa 51%, #999);
    background            : -webkit-gradient(linear, left top, left bottom, color-stop(0, #ccc),
    color-stop(.5, #acacac), color-stop(.5, #aaa), to(#999));
    -moz-border-radius    : 4px;
    -webkit-border-radius : 4px;
    border-radius         : 4px;
    border                : 1px solid #7d9bd9;
    text-shadow           : 1px 1px 1px black;
    /* BOX SHADOW */
    box-shadow            : 0 1px 3px black;

}

a.action:link, a.action:visited, a.action:active {
    color           : white;
    text-decoration : none;
}

a.action:hover {
    color           : white;
    text-decoration : none;
    background      : -moz-linear-gradient(top, #666, #888 50%, #999 51%, #ccc);
    background      : -webkit-gradient(linear, left top, left bottom, color-stop(0, #666),
    color-stop(.5, #888), color-stop(.5, #999), to(#ccc));
}

/***************************************
* T A B S
***************************************/
h2.tab_header {
    background         : #1e2952;
    color              : white;
    padding            : 5px;
    text-decoration    : none;
    text-transform     : uppercase;
    -moz-border-radius : 4px;
    border-radius      : 4px;
    border             : 0;
}

.tabform {
    width              : 650px;
    padding-top        : 15px;
    /*background         : #ececec;*/
    background         : rgb(255, 255, 255); /* Old browsers */
    background         : -moz-linear-gradient(-45deg, rgba(255, 255, 255, 1) 0%, rgba(229, 229, 229, 1) 100%); /* FF3.6-15 */
    background         : -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 1) 0%, rgba(229, 229, 229, 1) 100%); /* Chrome10-25,Safari5.1-6 */
    background         : linear-gradient(135deg, rgba(255, 255, 255, 1) 0%, rgba(229, 229, 229, 1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter             : progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e5e5e5', GradientType=1); /* IE6-9 fallback on horizontal gradient */

    color              : black;
    -moz-border-radius : 0 4px 4px 4px;
    border-radius      : 0 4px 4px 4px;
}

.tab1, .tab2, .tab3, .tab4, .tab5, .tab6, .tab7, .tab8 {
    width       : 100%;
    /*background  : #efeffc;*/
    background  : transparent;
    padding     : 2px 0;
    border-left : 1px solid silver;
}

ul.tabs {
    display : block;
}

ul.tabs li {
    background         : url(../images/verlauf_grau_40.png) left top repeat-x #cfcfcf;
    float              : left;
    list-style-type    : none;
    /*font-family        : Helvetica, Arial, sans-serif;*/
    text-transform     : uppercase;
    font-weight        : 400;
    line-height        : 22px;
    font-size          : 14px;
    text-align         : center;
    padding            : 3px;
    margin             : 2px 2px 0 0;
    height             : 22px;
    border-top         : 1px solid silver;
    border-left        : 1px solid silver;
    border-right       : 1px solid silver;
    -moz-border-radius : 4px 4px 0 0;
    border-radius      : 4px 4px 0 0;
}

ul.tabs li a {
    text-decoration : none;
}

ul.tabs li.selected {
    background : url(../images/verlauf_grau_40.png) left center repeat-x #cfcfcf;
}

ul.tabs li:hover {
    background : url(../images/verlauf_grau_40.png) left center repeat-x #cfcfcf;
}

/***************************************
* Fieldset Konfiguration
***************************************/
.konfiguration {
    width       : 530px;
    margin-left : 155px;
}

.fs_form fieldset {
    width            : 530px;
    background-color : #dfdfdf;
    border           : #002e85 1px solid;
    padding          : 10px 0 16px 16px;
}

.fs_form fieldset legend {
    font-weight    : bold;
    padding        : 0;
    font-size      : 1.1em;
    color          : #002e85;
    letter-spacing : 1px;
}

.fs_form fieldset label {
    display        : block;
    height         : 24px;
    line-height    : 24px;
    font-size      : 1em;
    color          : #002e85;
    letter-spacing : 1px;
}

/***************************************
* Suchergebniss
***************************************/
.suchergebnis {
    background-color : #ffff00;
    margin           : 0;
    padding          : 0;
    box-shadow       : 1px 1px 1px #666;
}

/***************************************
* CSS Editor
***************************************/
.csseditor {
    width       : 530px;
    margin-left : 155px;
}

/***************************************
* Fieldset Konfiguration
***************************************/
.konfiguration {
    width       : 530px;
    margin-left : 200px;
}

div#areas {
    /*float:right;*/
    position : fixed;
    left     : 0;
    width    : 180px;
    top      : 100px;
    z-index  : 1;
    /*background-color : #dfdfdf;*/
    /*border           : #002E85 1px solid;*/
    margin   : 0 auto;
    padding  : 10px;
}

div#areas a {
    /*display: inline-block;*/
    display          : block;
    padding          : 2px;
    margin           : 3px;
    background-color : #eee;
    border-radius    : 3px;

    text-decoration  : none;
    color            : #000080;
}

.fs_form fieldset {
    width            : 530px;
    background-color : #dfdfdf;
    border           : #002e85 1px solid;
    padding          : 10px 0 16px 16px;
}

.fs_form fieldset legend {
    font-weight    : bold;
    padding        : 0;
    font-size      : 1.1em;
    color          : #002e85;
    letter-spacing : 1px;
}

.fs_form fieldset label {
    display        : block;
    height         : 24px;
    line-height    : 24px;
    font-size      : 1em;
    color          : #002e85;
    letter-spacing : 1px;
}

/***************************************
* CSS Editor
***************************************/
.csseditor {
    width       : 530px;
    margin-left : 155px;
}

/***************************************
* Infofelder
***************************************/
p.info, p.warning, div.info {
    padding            : 10px 10px 10px 50px;
    min-height         : 20px;
    border             : 1px solid brown;
    border-radius      : 4px;
    /* Und hier sind die Deklarationen fr die Schatten.
   Der erste PX-Wert steht f�r die Y-Achse,
   der zweite Wert f�r die X-Achse und der
   dritte Wert f�r die Weichzeichnung des Schattens.
   Und der letzte Wert ist die Schattenfarbe. */
    -webkit-box-shadow : 5px 5px 10px #666;
    -moz-box-shadow    : 5px 5px 10px #666;
    box-shadow         : 5px 5px 10px #666;
    color              : #000000;
    font-style         : oblique;
}

p.info {
    background : #ffffcc url(../images/information.png) no-repeat left center;
}

p.warning {
    background : #ffcccc url(../images/warning.png) no-repeat left center;
}

/***************************************
* Tabellen im Backend
***************************************/
.table_konf table td {
    border : solid thin #d4d0c8;
}

.table_konf textarea {
    width  : 450px;
    height : 75px;
    color  : brown;
}

.table_konf input {
    width : 450px;
    color : brown;
}

.content_frame {
    width : 100%;
}

td.content_left {
    width        : 275px;
    padding-top  : 5px;
    margin-right : 5px;
    border-right : dotted grey;
}

td.content_right {
    padding-top  : 5px;
    padding-left : 20px;
}

/***************************************
* Button
***************************************/
.small_inline_button {

    display          : inline;

    height           : 24px;

    padding          : 1px 4px;
    margin           : 2px;

    background-color : transparent;
    color            : #154396;

    border           : 1px solid #154396;

    line-height      : 24px;
    text-decoration  : none;

    font-size        : 15px;
    /*font-family      : helvetica, arial, sans-serif;*/
    font-weight      : bold;
    text-align       : center;
}

/* WHILE HOVERED */
.small_inline_button:hover {
    background : #fff;
    border     : 1px solid #154396;
}

/* WHILE BEING CLICKED */
.small_inline_button:active {
    -moz-box-shadow    : 0 2px 6px black;
    -webkit-box-shadow : 0 2px 6px black;
}

.mybutton {
    display          : inline-block; /* !important;*/
    box-sizing       : border-box;

    height           : 30px;

    padding          : 3px 5px 1px;
    margin           : 2px;

    background-color : transparent;
    color            : #154396;

    border           : 1px solid #154396;
    /*border-radius      : 2px;*/
    line-height      : 24px;
    text-decoration  : none;
    font-size        : 16px;

    /*font-family      : helvetica, arial, sans-serif;*/
    font-weight      : bold;
    text-align       : center;
    position         : relative;
    cursor           : pointer;
}

button.mybutton {
    /*height : 24px;*/
    /*padding : 2px 5px;*/
    /*line-height: 20px;*/
}

input.mybutton {
    /*height : 24px;*/
    /*padding : 2px 5px;*/
    /*line-height: 20px;*/
}

a.mybutton {

    height      : 30px;

    padding     : 3px 5px 1px;
    margin      : 2px;

    line-height : 24px;
    font-size   : 16px;
}

a.mybutton.red {
    background-color : #c93f27;
    font-size        : 14px;
    border          : 2px solid rgba(255, 255, 255, 0.25);
    color           : #ffffff;
    padding         : 5px 10px;
    text-shadow     : 0 0 3px #ff8d5c;
    display         : inline-block;
    text-decoration : none;
}
a.mybutton.red :hover {
    color           : #ffffff;
    text-decoration : underline;
}

/* WHILE HOVERED */
.mybutton:hover {
    /*background : #e9ebee;*/
    background : #fff;
    border     : 1px solid #154396;
}

a.mybutton:hover {
    text-decoration : none;
}

/* WHILE BEING CLICKED */
.mybutton:active {
    -moz-box-shadow    : 0 2px 6px black;
    -webkit-box-shadow : 0 2px 6px black;
}

a.mybutton:active {
    text-decoration : none;
}

input#give_badge {
    background-color : #aaf84f;
    color            : #333;
}

input#give_badge:hover {
    background-color : #aaf84f;
    color            : #666;
    box-shadow       : 1px 1px 1px black;
}

input#dont_give_badge {
    background-color : #e36666;
    color            : #333;
}

input#dont_give_badge:hover {
    background-color : #e36666;
    color            : #666;
    box-shadow       : 1px 1px 1px black;
}

/* Formular Prüfteil */
div#div_form {
    width : 100%;
}

form#uvv_pruefteileform {
    width : 100%;
}