@CHARSET "UTF-8";

.fclear {
	clear:both;	
}

html, body {
    width: 100%;
    margin: 0;
    padding: 0;
    /*overflow-x: hidden;*/
}

body{
    background: #fff;
    font-size: 16px;
}

body, td, th, div, p, label {
    color: #707173;
    font-family: Helvetica, Verdana, Arial, Tahoma, Georgia, sans-serif;
    font-weight: normal;
    margin: 0;
}
td, th, div, p, label {
    font-size: 16px;
    font-size: 1.0rem;
    line-height: 23px;
    line-height: 1.4375rem;
}
p{
    margin-bottom: 23px;
    margin-bottom: 1.4375rem;
}

a{
    color: #004165;
    text-decoration: none;
    font-weight: bold;
    font-size: 18px;
    font-size: 1.125rem;
    outline: 0 !important;
}
a:hover{ text-decoration: underline; }

img, a img{
    border: 0;
}

h1{
    font-size: 26px;
    font-size: 1.6rem;
    font-weight: bold;
    line-height: 34px;
    line-height: 2.125rem;
    color: #004165;
}
h2 {
    color: #004165;
    font-size: 1.5rem;
    line-height: 2.25rem;
    margin: 1.5rem 0 0.75rem;
}

#background-wrapper{
    width: 100%;
    /*min-width: 1200px;*/
    float: left;
    background-position: bottom left;
    background-repeat: repeat-x;
    background-color: #009eda;
    background-image: url(../img/backgrounds/bg_gradient.gif);
}
#background-wrapper > #window-wrapper{
    max-width: 1200px;
    margin: auto;
}
#background-wrapper > #window-wrapper > #content-wrapper{
    width: 100%;
    float: left;
    padding-bottom: 307px;
    background: url(../img/backgrounds/bg_content.png) bottom center no-repeat;
}

header{
    width: 100%;
    float: left;
    position: relative;
}
header > #logo{
    width: 311px;
    position: absolute;
    top: 38px;
    left: 3.5%;
}
div.social-media {
    position: absolute;
    right: 5.66666666666667%;
    top: 20px;
}
a.social-facebook {
    height: 31px;
    width: 31px;
    background: url("../img/icons/facebook.png") no-repeat;
    display: block;
    float: left;
    margin-right: 12px;
    background-size: 31px 31px;
}
a.social-facebook:hover {
    background: url("../img/icons/facebook_hover.png") no-repeat;
    background-size: 31px 31px;
}
a.social-twitter {
    height: 31px;
    width: 31px;
    background: url("../img/icons/twitter.png") no-repeat;
    display: block;
    float: left;
    background-size: 31px 31px;
}
a.social-twitter:hover {
    background: url("../img/icons/twitter_hover.png") no-repeat;
    background-size: 31px 31px;
}
.csc-default > header{
    width: auto;
    height: auto;
    float: none;
    position: static;
}

nav{
    width: 100%;
    float: left;
}
nav > .navigation-frame{
    width: 90.16666666666667%;
    padding: 150px 5.66666666666667% 0 4.16666666666667%;
    float: left;
}
nav > .navigation-frame > ul#user-info{
    width: 100%;
    list-style: none;
    margin: 0;
    padding: 0;
    float: left;
    position: relative;
}
nav > .navigation-frame > ul#user-info > li{
    float: left;
    background-color: #004165;
    width: 23.75231053604436%;
    height: 90px;
}
nav > .navigation-frame > ul#user-info > li#username{
    width: 76.24768946395564%;
    background-color: #74cae8;
}
nav > .navigation-frame > ul#user-info > li > span{
    font-size: 20px;
    font-size: 1.25rem;
    float: left;
    margin: 30px 0 0 28px;
    color: #fff;
}
nav > .navigation-frame > ul#user-info > li#username > span{
    font-size: 38px;
    font-size: 2.375rem;
    font-weight: bold;
    margin-left: 48px;
}

nav > .navigation-frame div#mobile-navi-headline{
    display: none;
}
nav > .navigation-frame ul#main-navi{
    width: 100%;
    height: 80px;
    background-color: #004165;
    list-style: none;
    margin: 0;
    padding: 0;
    float: left;
    position: relative;
}
nav > .navigation-frame ul#main-navi > li{
    float: left;
    width: 25%;
    height: 80px;
}
nav > .navigation-frame > .nav-collapse .social-media-links.showMobile{
    display: none;
}
nav > .navigation-frame ul#main-navi > li.mobile-link{
    display: none;
}
nav > .navigation-frame ul#main-navi > li > a{
    width: 100%;
    display: block;
    position: relative;
    float: left;
    margin: 0 18px 10px 0;
    color: #fff;
}
nav > .navigation-frame ul#main-navi > li > a:hover,
nav > .navigation-frame ul#main-navi > li.active > a{
    color: #66ccff !important;
}
nav > .navigation-frame ul#main-navi > li > a > span{
    position: absolute;
    left: 28px;
    top: 29px;
    width: 75%;
}

nav > .navigation-frame > ul#marginal-navi{
    position: absolute;
    top: 101px;
    right: 5.83333333333333%;
}
nav > .navigation-frame > ul#marginal-navi.with-space{
    right: 21%;
}
nav > .navigation-frame > ul#language{
    position: absolute;
    top: 101px;
    right: 5.83333333333333%;
}
nav > .navigation-frame > ul#language,
nav > .navigation-frame > ul#marginal-navi{
    list-style: none;
    margin: 0;
    padding: 0;
    float: right;
}
nav > .navigation-frame > ul#language li,
nav > .navigation-frame > ul#marginal-navi li{
    float: left;
    font-size: 18px;
    font-size: 1rem;
    color: #fff;
}
nav > .navigation-frame > ul#language li a,
nav > .navigation-frame > ul#marginal-navi li a{
    font-size: 18px;
    font-size: 1rem;
    font-weight: normal;
    text-decoration: none;
    color: #fff;
}
nav > .navigation-frame > ul#language li a span,
nav > .navigation-frame > ul#marginal-navi li a span{}
nav > .navigation-frame > ul#marginal-navi li span.divider{
    float: none;
}

#content-wrapper .content-frame{
    width: 86.16666666666667%;
    margin: 0 0 0 4.16666666666667%;
    padding: 32px 1.66666666666667% 32px 2.33333333333333%;
    float: left;
    position: relative;
    background-color: #fff;
}

#content-wrapper .content-frame.selfdrawing {
	background-color:transparent !important;
	padding: 0 !important;
	width: 90.16666666666667%; !important;
}

#content-wrapper .content-frame > .content-box-arrow{
    width: 20px;
    height: 52px;
    position: absolute;
    top: 32px;
    right: -20px;
    background: url(../img/backgrounds/bg_content_arrow.png) top left no-repeat;
}
#content-wrapper .content-frame h1{
    margin-bottom: 25px;
}

#content-frame{
    width: 100%;
    float: left;
    margin-top: 10px;
}

/* link styles */
nav a{
    font-size: 20px;
    font-size: 1.25rem;
}

/* footer styles */
footer{
    width: 100%;
    float: left;
}
footer > #footer-wrapper{
    max-width: 1200px;
    margin: auto;
}
footer > #footer-wrapper > .content{
    width: 95.83333333333333%;
    height: 44px;
    padding: 3px 0 0 4.16666666666667%;
    float: left;
}
footer > #footer-wrapper > .content > span{
    font-size: 12px;
    font-size: 0.75rem;
    color: #707173;
    float: left;
}
footer > #footer-wrapper > .content > span a{
    font-size: 12px;
    font-size: 0.75rem;
}
footer > #footer-wrapper > .content > span.fright{
    padding-left: 8px;
}

.form-frame{}
.form-frame .form-item{
    width: 100%;
    float: left;
}
.form-frame .form-item > label,
.form-frame .form-item > span.required-fields{
    width: 26.59574468085106%;
    float: left;
    margin-right: 5.41586073500967%;
    color: #004165;
    font-weight: bold;
}
.form-frame .form-item > span.required-fields{
    font-weight: normal;
    color: #666;
}
.form-frame input[type=text],
.form-frame input[type=password],
.form-frame select{
    width: 41.77949709864603%;
    height: 25px;
    border: 1px solid #009fda;
    padding: 0 8px;
    font-size: 18px;
    font-size: 1.125rem;
    margin-bottom: 12px;
    box-sizing: border-box;
    -moz-box-sizing:border-box; /* Firefox */
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
}
.form-frame select {
    padding: 0 0 0 8px;
}
.form-frame .form-item > .buttons{
    width: 41.86046511627907%;
    float: left;
}
.form-frame .form-item > .buttons .loader,
.form-frame .form-item > .buttons .error {
    float:right;
}
.form-frame .form-item > .buttons > input[type=submit],
.form-frame .form-item > .buttons > input[type=button]{
    width: 35.64814814814815%;
    height: 40px;
    float: right;
    background-color: #009fda;
    border: none;
    padding: 0;
    font-size: 18px;
    font-size: 1.125rem;
    text-align: center;
    color: #fff;
    cursor: pointer;
    margin-left: 2.77777777777778%;
}
.form-frame .form-item > .buttons > input[type=submit]:hover,
.form-frame .form-item > .buttons > input[type=button]:hover{
    background-color: #004165;
}
.form-frame input#submitMobile{
    display: none;
}
.form-frame textarea{
    width: 270px;
    height: 133px;
    border: 1px solid #009fda;
    padding: 4px 0 0 8px;
    font-size: 18px;
    font-size: 1.125rem;
    font-family: Helvetica, Verdana, Arial, Tahoma, Georgia, sans-serif;
    margin-bottom: 4px;
}
.form-frame select{
    height: auto;
    font-size: 18px;
    font-size: 1.125rem;
}
.form-frame label.error{
    display: none !important;
}
.form-frame input.error{
    border: 1px solid #f00;
}
.form-frame > .left{
    width: 30%;
    float: left;
}
.form-frame > .middle{
    width: 30%;
    float: left;
    margin-top: 31px;
}
.form-frame > .right{
    width: 40%;
    float: left;
}

/* table styles */
.content-frame .table{
    width: 100%;
    float: left;
    position: relative;
    padding-top: 20px;
   /* overflow: hidden;
    overflow-y: scroll;*/
}
.content-frame .table .table-arrow{
    width: 53px;
    height: 20px;
    position: absolute;
    left: 107px;
    top: 0;
    background: url(../img/backgrounds/bg_table_arrow.png) top left no-repeat;
}
.content-frame button{
    height: 40px;
    float: right;
    background-color: #009fda;
    border: none;
    padding: 0 10px;
    margin-top: 10px;
    font-size: 18px;
    font-size: 1.125rem;
    text-align: center;
    color: #fff;
    cursor: pointer;
}
.content-frame button:hover{
    background-color: #004165;
}
.content-frame .table .table-filter{
    position: absolute;
    right: 0;
    top: -58px;
}
.content-frame .table .table-filter label{
    float: left;
    color: #004165;
    font-weight: bold;
    margin-right: 10px;
}
.content-frame .table .table-filter select{
    float: left;
}
.content-frame table{
    width: 100%;
}
.content-frame table > thead{
    background: #009fda;
}
.content-frame table > thead > tr > th{
    color: #fff;
    font-weight: bold;
    text-align: left;
}
.content-frame table > tbody{
    background: #fff !important;
}
.content-frame table > tbody > tr:nth-child(2n+1),
.content-frame table > tbody > tr:nth-child(2n+1) > td {
    background: #fff !important;
}
.content-frame table > tbody > tr:nth-child(2n),
.content-frame table > tbody > tr:nth-child(2n) > td {
    background: #e4f4fa !important;
}
.content-frame table > thead > tr > th,
.content-frame table > tbody > tr > td{
    padding: 13px 0 10px 10px;
}
.content-frame table > tbody > tr > td{
    color: #1a171b;
}
.content-frame table > thead > tr > th.fcenter,
.content-frame table > tbody > tr > td.fcenter{
    text-align: center;
}

/* user handling styles */
.content-frame .user-form{
    width: 54.93230174081238%;
    float: left;
    margin: 40px 22.53384912959381%;
    padding-bottom: 16px;
    border-bottom: 1px solid #004165;
}
.content-frame .user-form > .headline{
    width: 100%;
    height: 43px;
    background: url(../img/backgrounds/bg_headline_login.png) 0 0 no-repeat;
    padding-left: 84px;
    font-weight: bold;
    font-size: 18px;
    font-size: 1.125rem;
    line-height: 43px;
    color: #004165;
    margin-bottom: 14px;

    box-sizing: border-box;
    -moz-box-sizing:border-box; /* Firefox */
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
}
.content-frame .user-form input[type=text],
.content-frame .user-form input[type=password]{
    width: 100%;
    border: 1px solid #004165;
    padding: 4px 9px;
    font-size: 18px;
    font-size: 1.125rem;
    color: #707173;
    margin-bottom: 6px;

    box-sizing: border-box;
    -moz-box-sizing:border-box; /* Firefox */
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
}
.content-frame .user-form form > a{
    float: left;
    font-size: 12px;
    font-size: 0.75rem;
    margin-top: 5px;
}
.content-frame .user-form input[type=submit]{
    height: 40px;
    float: right;
    background-color: #009fda;
    border: none;
    padding: 0 20px;
    font-size: 18px;
    font-size: 1.125rem;
    color: #fff;
    cursor: pointer;
}
.content-frame .user-form input[type=submit]:hover{
    background-color: #004165;
}

/* man styles */
.loader {
    height:24px;
    line-height:24px;
    padding:0 0 0 33px;
    background-image:url(../img/icons/loader.gif);
    background-repeat:no-repeat;
    background-position:left center;
}
.pdficon {
    width:47px;
    height:50px;
    background-image:url(../img/icons/createpdf.png);
    background-repeat:no-repeat;
    cursor:pointer;
}
.pdficon.fail {
    background-image:url(../img/icons/pdf_fail.png) !important;
}

.error {
    color: #de0000;
}

@media screen and (max-width: 875px){
    .content-frame table > thead > tr > th,
    .content-frame table > tbody > tr > td{
        padding: 13px 0 10px 5px;
        font-size: 14px;
        font-size: 0.875rem;
    }
}
 
@media screen and (max-width: 820px){

    div.social-media {
        right: 177px;
        top: 0px;
        display: none;
    }

    a.social-facebook, a.social-twitter {
        height: 26px;
        width: 26px;
        background-size: 26px 26px;
    }

    td, th, div, p, label {
        font-size: 0.875rem;
        line-height: 1.0rem;
    }
    a{
        font-size: 0.875rem;
    }

    h1{
        font-size: 1.125rem;
        font-weight: bold;
        line-height: 1.375rem;
        margin-bottom: 0.75rem;
        margin-top: 0.75rem;
    }
    h2 {
        font-size: 1rem;
        line-height: 1.125rem;
        margin: 1.5rem 0 0.75rem;
    }

    #background-wrapper{
        width: 100%;
        min-width: 100%;
    }
    #background-wrapper > #window-wrapper{
        width: 100%;
        margin: auto;
    }
    #background-wrapper > #window-wrapper > #content-wrapper{
        padding-bottom: 123px;
        background: url(../img/mobile/bg_content.png) bottom center no-repeat;
        background-size: 320px 251px;
    }


    header{
        width: 100%;
        height: 140px;
        float: left;
        position: relative;
    }
    header > #logo{
        width: 156px;
        top: 48px;
        left: 6.5625%;
    }
    header > #logo > a > img{
        width: 156px;
        height: 41px;
    }
    header > .marginal-navi{
        display: none;
    }
    header > #search-box{
        display: none;
    }
    header > #social-media{
        right: 42.1875%;
        top: 6px;
    }
    
    nav p{
        margin-bottom: 0 !important;
    }

    nav > .navigation-frame{
        width: 100%;
        padding: 0;
        position: relative;
    }

    nav > .navigation-frame a.nav-toggle{
        display: block;
    }

    nav > .navigation-frame > .nav-collapse{
        margin: 0 7.8125%;
        padding: 0 2.34375% 16px 7.03125%;
        width: 75%;
        background: #fff;
        z-index: 10000;
        box-shadow: 2px 3px 5px #000;
    }
    nav > .navigation-frame > .nav-collapse div#mobile-navi-headline{
        width: 100%;
        display: block;
        background: #004165 url(../img/mobile/bg_mobile_navi_headline.png) 6px 50% no-repeat;
        background-size: 22px 18px;
        color: #fff;
        font-size: 16px;
        font-size: 1rem;
        line-height: 32px;
        padding: 0 34px;

        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }
    nav > .navigation-frame > .nav-collapse ul#main-navi{
        height: auto;
        background-color: none;
    }
    nav > .navigation-frame > .nav-collapse .social-media-links.showMobile{
        display: block;
        float: left;
        padding-top: 10px;
        text-align: center;
        width: 100%;
    }
    nav > .navigation-frame > .nav-collapse .social-media-links a.social-facebook,
    nav > .navigation-frame > .nav-collapse .social-media-links a.social-twitter{
        float: right;
    }
    nav > .navigation-frame > .nav-collapse .social-media-links a.social-facebook span,
    nav > .navigation-frame > .nav-collapse .social-media-links a.social-twitter span{
        display: none;
    }
    nav > .navigation-frame > .nav-collapse ul#main-navi li{
        width: 100%;
        height: auto;
        background-color: #9ddaef;
        float: left;
    }
    nav > .navigation-frame > .nav-collapse ul#main-navi li a{
        width: 90%;
        display: block;
        border-top: 1px solid #fff;
        background: #9ddaef;
        color: #004165;
        font-size: 16px;
        font-size: 1rem;
        line-height: 32px;

        background: #9ddaef url(../img/mobile/bg_mobile_navi.png) 6px 50% no-repeat;
        background-size: 16px 18px;
        padding: 0 0 0 30px;
        margin: 0;
        margin-left: 10%;

        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }
    nav > .navigation-frame > .nav-collapse ul#main-navi li:first-child a{
        border-top: none;
    }
    nav > .navigation-frame > .nav-collapse ul#main-navi li.active a,
    nav > .navigation-frame > .nav-collapse ul#main-navi li a:hover{
        color: #004165 !important;
    }
    nav > .navigation-frame ul#main-navi > li > a > span{
        position: static;
        left: auto;
        top: auto;
        width: auto;
    }
    nav > .navigation-frame ul#main-navi > li.mobile-link{
        display: block;
    }
    nav > .navigation-frame > .nav-collapse ul#main-navi li.mobile-link a{
        width: 100%;
        display: block;
        border-bottom: 1px solid #999;
        background: #fff;
        background-image: none;
        color: #999;
        font-size: 16px;
        font-size: 1rem;
        line-height: 32px;

        padding: 0 0 0 8px;
        margin: 0;
        margin-left: 0;

        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }
    
    /* TODO */
    nav,
    nav > .navigation-frame{
        height: 100%;
    }
    #content-frame{
        margin-top: 0;
    }
    nav > .navigation-frame > ul#user-info{
        margin: 0 7.8125%;
        padding: 0 0 0 7.03125%;
        width: 77.34375%;
        position: absolute;
        bottom: 0;
        left: 0;
        background-color: #74CAE8;
    }
    nav > .navigation-frame > ul#user-info li{
        display: none;
    }
    nav > .navigation-frame > ul#user-info li#username{
        width: 100%;
        height: 37px;
        display: block;
        text-align: center;
    }
    nav > .navigation-frame > ul#user-info li#username > span{
        font-size: 24px;
        line-height: 37px;
        margin: 0;
    }

    nav > .navigation-frame > ul#marginal-navi{
        display: block;
        position: absolute;
        right: 7.8125%;
        top: 35px;
    }
    nav > .navigation-frame > ul#marginal-navi.mobile-hidden{
        display: none;
    }
    nav > .navigation-frame > ul#language{
        top: 12px;
        margin: 0 0 0 24px;
        left: 0;
    }
    nav > .navigation-frame > ul#marginal-navi li{
        display: none;
    }
    nav > .navigation-frame > ul#marginal-navi li:first-child{
        display: block;
    }
    nav > .navigation-frame > ul#marginal-navi li > span.divider{
        display: none;
    }
    nav > .navigation-frame > ul#marginal-navi li:first-child > a{
        height: 26px;
        background: #fff;
        color: #004165;
    }
    nav > .navigation-frame > ul#marginal-navi li:first-child > a > span {
        min-width: 61px;
        background: none repeat scroll 0 0 #FFFFFF;
        color: #004165;
        float: left;
        font-size: 12px;
        font-weight: bold;
        text-align: center;
        height: 26px;
        line-height: 26px;
        padding: 0 10px;
    }

    footer > #footer-wrapper{
        width: 100%;
        float: left;
    }
    footer > #footer-wrapper > .content{
        width: 84.375%;
        height: auto;
        padding: 3px 7.8125%;
        float: left;
    }
    footer > #footer-wrapper > .content span,
    footer > #footer-wrapper > .content a{
        font-size: 0.5rem;
    }
    footer > #footer-wrapper > .content span.fleft,
    footer > #footer-wrapper > .content span.fright{
        width: 100%;
    }
    footer > #footer-wrapper > .content span.fright{
        padding-left: 0;
    }

    #content-wrapper .content-frame{
        width: 75.0%;
        margin: 0 7.8125%;
        padding: 0 2.34375% 20px 7.03125%;
    }
    #content-wrapper .content-frame > h1{
        margin: 15px 0;
        font-size: 1rem;
        line-height: 1.125rem;
    }
    #content-wrapper .content-frame .content-box-arrow,
    #content-wrapper .content-frame .content-box-arrow-small{
        display: none;
    }

    
    .csc-default > table,
    .csc-default > table thead,
    .csc-default > table tbody,
    .csc-default > table tr{
        width: 100%;
        display: inline;
    }
    .csc-default > table tr{
        display: block;
        float: left;
        border-bottom: 1px solid #fff;
    }
    .csc-default > table tr th,
    .csc-default > table tr td{
        box-sizing: border-box;
        -moz-box-sizing:border-box; /* Firefox */
        -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
        float: left;
        display: block;
        width: 50%;
        padding: 0;
        padding: 4px 8px;
    }
    .csc-default > table tr th:nth-child(2),
    .csc-default > table tr td{
        border-right: 1px solid #fff;
    }
    .csc-default > table tr th:first-child,
    .csc-default > table tr td.highlighted{
        width: 100%;
        border-bottom: 1px solid #fff;
    }
    .csc-default > table tr td.highlighted,
    .csc-default > table tr td:last-child{
        border-right: none;
    }
    
    .csc-default > table thead tr th{
        background-color: #b1b3b4;
        color: #000;
        text-align: left;
        font-weight: bold;
    }
    .csc-default > table thead tr th:first-child{
        background-color: #4d4d4d;
        color: #fff;
    }

    .form-frame > .left{
        width: 100%;
        float: left;
    }
    .form-frame > .middle{
        width: 100%;
        float: left;
        margin-top: 0;
    }
    .form-frame > .right{
        width: 100%;
        float: left;
    }
    .form-frame input,
    .form-frame textarea,
    .form-frame select{
        box-sizing: border-box;
        -moz-box-sizing:border-box; /* Firefox */
        -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    }
    .form-frame input[type=text],
    .form-frame input[type=password]{
        width: 100%;
    }
    .form-frame input[type=submit]{
        width: 100%;
    }
    .form-frame textarea{
        width: 100%;
    }

    .form-frame .form-item > .buttons{
        width: 100%;
        float: left;
    }
    .form-frame .form-item > .buttons > input[type="submit"],
    .form-frame .form-item > .buttons > input[type="reset"],
    .form-frame .form-item > .buttons > input[type="button"] {
        background-color: #009FDA;
        border: none;
        color: #FFFFFF;
        cursor: pointer;
        float: right;
        display: inline;
        font-size: 1rem;
        height: auto;
        margin-left: 2.77778%;
        padding: 4px 0;
        text-align: center;
        width: auto;
    }
    .form-frame .form-item > .buttons > input[type="submit"]{
        margin-left: 0;
    }

    .form-frame .form-item > span.required-fields{
        width: 100%;
        float: left;
    }
    
    .content-frame .table {
    	padding:5px 0 0 0;
    }
    
   .content-frame .table .table-filter{
        margin-bottom: 15px;
        position:static;
    }
    
    .content-frame .table .table-filter select {
    	float:none;
    }

    .content-frame .table .table-arrow{
        display: none;
    }

    .content-frame .user-form{
        width: 100%;
        float: left;
        margin: 40px 0;
        padding-bottom: 16px;
        border-bottom: 1px solid #004165;
    }

    .content-frame button{
        height: auto;
        padding: 4px 10px;
        font-size: 16px;
        font-size: 1rem;
    }
}

/*@media only screen and (max-width: 700px) and (-webkit-min-device-pixel-ratio: 2){*/
@media screen and (-webkit-min-device-pixel-ratio: 1.3) and (max-width: 768px), screen and (min--moz-device-pixel-ratio: 1.3) and (max-width: 768px), screen and (-o-min-device-pixel-ratio: 2 / 1) and (max-width: 768px), screen and (min-device-pixel-ratio: 1.3) and (max-width: 768px), screen and (min-resolution: 192dpi) and (max-width: 768px), screen and (min-resolution: 2dppx) and (max-width: 768px) {
    header > #logo > a > img{
        width: 156px;
        height: 41px;
    }
    header > #social-media > a > img{
        width: 16px;
        height: 16px;
    }
    nav > .navigation-frame > .nav-collapse div#mobile-navi-headline{
        background: #004165 url(../img/mobile/bg_mobile_navi_headline.png) 6px 50% no-repeat;
        background-size: 11px 9px;
        padding: 0 20px;
    }
    nav > .navigation-frame > .nav-collapse .social-media-links.showMobile{
        display: block;
        float: left;
        padding-top: 10px;
        text-align: center;
        width: 100%;
    }
    nav > .navigation-frame > .nav-collapse .social-media-links a.social-facebook,
    nav > .navigation-frame > .nav-collapse .social-media-links a.social-twitter{
        float: right;
    }
    nav > .navigation-frame > .nav-collapse .social-media-links a.social-facebook span,
    nav > .navigation-frame > .nav-collapse .social-media-links a.social-twitter span{
        display: none;
    }
    nav > .navigation-frame > .nav-collapse ul#main-navi li a{
        background: #9ddaef url(../img/mobile/bg_mobile_navi.png) 6px 50% no-repeat;
        background-size: 8px 9px;
        padding: 0 20px;
    }
}




/***********************************************************************
** CONTENT
***********************************************************************/
#content-wrapper .content-frame.selfdrawing > .twocolumn {
	position:relative;
}

#content-wrapper .content-frame.selfdrawing > .twocolumn > div .arrow {
	background-image:url(../img/backgrounds/content_arrows.png);
	background-repeat:no-repeat;
	width:19px;
	height:77px;
	position:absolute;
	top:71px;
}

#content-wrapper .content-frame.selfdrawing > .twocolumn > .maincontent > .arrow {
	background-position:-19px 0;
	right:-19px;
	z-index:201;
}

#content-wrapper .content-frame.selfdrawing > .twocolumn > .smallcontent > .arrow {
	background-position:0 0;
	left:0;
	z-index:200;
}

#content-wrapper .content-frame.selfdrawing > .twocolumn > .maincontent,
#content-wrapper .content-frame.selfdrawing > .twocolumn > .smallcontent {
	position:relative;
	background-color:#ffffff;
}

#content-wrapper .content-frame.selfdrawing > .twocolumn > .maincontent {
	width:74.5%;
	float:left;
}

#content-wrapper .content-frame.selfdrawing > .twocolumn > .maincontent > .inner {
	padding:32px 27px 32px 27px;
	min-height:200px;
}

#content-wrapper .content-frame.selfdrawing > .twocolumn > .smallcontent {
	width:23.8%;
	float:right;
}

#content-wrapper .content-frame.selfdrawing > .twocolumn > .smallcontent > .inner {
	padding:20px 28px 23px 27px;
	min-height:480px;
}

#content-wrapper .content-frame.selfdrawing > .twocolumn > .smallcontent > .inner h1 {
	font-size:21px;	
	margin:0;
}


@media screen and (max-width: 820px){
	#content-wrapper .content-frame.selfdrawing > .twocolumn > .smallcontent,
	#content-wrapper .content-frame.selfdrawing > .twocolumn > .maincontent {
		width: 93.666666%;
		float: none;
	}
	
	#content-wrapper .content-frame.selfdrawing > .twocolumn .arrow {
		display:none;
	}
}

/***********************************************************************
** ACTIVITY STREAM
***********************************************************************/
#content-wrapper .content-frame.selfdrawing > .twocolumn > .smallcontent > .inner #activityContainer {
	padding:18px 0 0 0;	
}

#content-wrapper .content-frame.selfdrawing > .twocolumn > .smallcontent > .inner #activityContainer > .activity {
	display:none;
	margin:0 0 14px 0;
}

#content-wrapper .content-frame.selfdrawing > .twocolumn > .smallcontent > .inner #activityContainer > .activity > .headline {
	background-color:#004165;
	overflow:hidden;
	height:26px;
	width:100%;
	margin:0 0 11px 0;
}

#content-wrapper .content-frame.selfdrawing > .twocolumn > .smallcontent > .inner #activityContainer > .activity > .headline > .inner {
	padding:0 8px;
	line-height:26px;
	color:#ffffff;
	font-weight:bold;
}

#content-wrapper .content-frame.selfdrawing > .twocolumn > .smallcontent > .inner #activityContainer > .activity > .image {
	width:36%;
	float:left;
}

#content-wrapper .content-frame.selfdrawing > .twocolumn > .smallcontent > .inner #activityContainer > .activity > .image > img {
	width:100%;
}

#content-wrapper .content-frame.selfdrawing > .twocolumn > .smallcontent > .inner #activityContainer > .activity > .text {
	width:60%;
	overflow:hidden;
	float:right;
}

#content-wrapper .content-frame.selfdrawing > .twocolumn > .smallcontent > .inner #activityContainer > .activity > .text > .date {
	color:#707173;
	font-size:10px;
	line-height:12px;
}

#content-wrapper .content-frame.selfdrawing > .twocolumn > .smallcontent > .inner #activityContainer > .activity > .text > p {
	margin:0;
	font-size:13px;
	line-height:16px;	
}

#content-wrapper .content-frame.selfdrawing > .twocolumn > .smallcontent > .inner #activityContainer > .activity > .text > p.title {
	font-weight:bold;
	color:#004165;
	line-height:20px;
}

#content-wrapper .content-frame.selfdrawing > .twocolumn > .smallcontent > .inner #activityContainer > .activity > .text > a {
	font-size:13px;
	line-height:16px;
	font-weight:normal;
	display:block;
	margin:3px 0 0 0;
	padding:0 0 0 10px;
	background-image:url(../img/icons/linkarrow.png);
	background-repeat:no-repeat;
	background-position:center left;
	font-weight:bold;
}




/***********************************************************************
** STABLE
***********************************************************************/
#content-wrapper .stable {
	width:100%;
}

#content-wrapper .stable > .head {
	width:100%;
	height:46px;
	background-color:#009fda;
	overflow:auto;
}

#content-wrapper .stable > .head > .c {
	cursor:pointer;
	height:22px;
	padding: 12px 0 12px 0;
	float:left;
	overflow:hidden;
}

#content-wrapper .stable > .head > .c > .label {
	color:#ffffff;
	font-weight:bold;
	padding:0 0 0 10px;
	float:left;
	white-space:nowrap;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

#content-wrapper .stable > .head > .c > .orderer {
	width:15px;
	height:11px;
	margin:6px 0 6px 6px;
	background-image:url(../img/icons/tableorder.png);
	background-repeat:no-repeat;
	background-position:0px 0px;
	-moz-opacity: 0.30;
	-khtml-opacity: 0.30;
	opacity: 0.30;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=30);
	filter: progid:DXImageTransform.Microsoft.Alpha(opacity=30);
	filter:alpha(opacity=30);
	float:left;
}

#content-wrapper .stable > .head > .c:hover > .orderer {
	-moz-opacity: 0.70;
	-khtml-opacity: 0.70;
	opacity: 0.70;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=70);
	filter: progid:DXImageTransform.Microsoft.Alpha(opacity=70);
	filter:alpha(opacity=70);
}

#content-wrapper .stable > .head > .c > .orderer.down,
#content-wrapper .stable > .head > .c > .orderer.up{
	-moz-opacity: 1;
	-khtml-opacity: 1;
	opacity: 1;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=100);
	filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100);
	filter:alpha(opacity=100);
}

#content-wrapper .stable > .head > .c > .orderer.up {
	background-position:-15px 0px;
}

#content-wrapper .stable > .body > .row {
	overflow:auto;
}

#content-wrapper .stable > .body > .row.odd {
	background-color:#e4f4fa;
}

#content-wrapper .stable > .body > .row > .c {
	float:left;
	min-height:40px;
}

#content-wrapper .stable > .body > .row > .c > .inner {
	line-height:20px;
	padding: 10px 0 10px 10px;
	color:#1a171b;
	overflow:hidden;
}

#content-wrapper .stable > .body > .row > .c.right > .inner {
	padding: 0 10px 0 0;
}

#content-wrapper .stable > .body > .row > .c > .inner > .expander {
	cursor:pointer;
	height:26px;
	width:26px;
	margin:7px 0;
	background-image:url(../img/icons/expander.png);
	background-repeat:no-repeat;
	background-position:0px 0px;
	float:right;
}

#content-wrapper .stable.certs > .body > .row > .c > .inner > .expander {
	margin:12px 0;
}

#content-wrapper .stable > .body > .row > .c > .inner > .expander.open {
	background-position:-26px 0px;
}

#content-wrapper .stable > .body > .row > .collapsible {
	with:100%;
	display:none;
	border-top:1px solid #004165;
}

#content-wrapper .stable > .body > .row > .collapsible > .inner {
	padding: 15px 10px 10px 10px;
}

#content-wrapper .stable > .body > .row > .c > .inner > .resultstate {
	width:11px;
	height:10px;
	background-image:url(../img/icons/resultstate.png);
	background-repeat:no-repeat;
	background-position:0px 0px;
	float:left;
	margin:5px 7px 5px 0;
}

#content-wrapper .stable > .body > .row > .c > .inner > .resultstate.good {
	background-position:-11px 0px;
}

#content-wrapper .stable > .body > .row > .c > .inner > .resultstate.bad {
	background-position:-22px 0px;
}

#content-wrapper .stable > .body > .row.message .inner {
	padding:10px;	
}

#content-wrapper .stable > .body > .row.message.bad .inner {
	color: #de0000;
}

#content-wrapper .stable .loader {
	margin:20px 0 0 0;
}

/* expander contents */
#content-wrapper .stable > .body > .row > .collapsible > .inner > .split {
	overflow:auto;	
}

#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .bigofthree {
	width:36%;
	padding:0 10% 0 0;
	float:left;
}

#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .smallofthree {
	width:54%;
	float:left;
}

#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .smallofthree.share > div {
	margin:0 0 0 10px;
}

#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .result > .resultlabel {
	float:left;
	width:20%;
}

#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .result > .resultbar {
	width:100%;
	height:26px;
	position:relative;
	background-color:#ffffff;
	border:1px solid #004165;	
	float:right;
	width:66%;
}

#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .result > .resultbar > .percentv {
	background-color:#009fda;	
	height:26px;
}

#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .result > .resultbar > .lbl {
	position:absolute;
	color:#ffffff;
	margin:0 0 0 -13px;
	top:2px;
	line-height: 1.4375rem;
} 

#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .result > .downloadlabel {
	float:left;
	width:78%;
}

#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .result > .pdficon,
#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .result > .loader {
	float:right;
}

#content-wrapper .stable > .body > .row > .c.certificate .loader {
	float: left;
    margin: 3px -6px 0 3px;
}
	
#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .result > .downloadlabel {
	margin:20px 0 0 0;
}

#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .result > .pdficon {
	margin:10px 0 0 0;
}

#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .share > .shares {
	padding:15px 0 0 0;
}

#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .share > .shares > .shareicon {
	width:47px;
	height:47px;
	background-image:url(../img/icons/shareicons.png);
	background-repeat:no-repeat;
	cursor:pointer;
	float:left;
	margin:0 9px 9px 0;
}

#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .share > .shares > .shareicon.fb {
	background-position:0px 0px;
}

#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .share > .shares > .shareicon.tw {
	background-position:-47px 0px;
}

#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .share > .shares > .shareicon.xi {
	background-position:-94px 0px;
}

#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .share > .shares > .shareicon.li {
	background-position:-141px 0px;
    background-image: none;
    width: auto;
    height: auto;
    margin-top: 12px;
}

#content-wrapper .stable > .body > .row > .c.certificate > .inner > p {
	float:left;	
	margin:5px 0 0 15px;
	color: #1a171b;
	cursor:pointer;
}

#content-wrapper .stable > .body > .row > .c.cdate > .inner  {
	margin:5px 0 0 0;
}

#content-wrapper .stable > .body > .row > .c.certificate > .inner > .pdficon {
	float:left;	
	background-size:100% 100%;
	height: 32px;
    width: 30px;
}

#content-wrapper .stable > .body > .row > .collapsible > .inner > .split .oneliner {
	display:none;	
	padding:5px 0 0 0;
	text-align:center;
}

#content-wrapper .stable > .body > .row > .collapsible > .inner > .split .oneliner.first {
	border-top: 1px solid #6d93a8;
	margin:20px 0 0 0;
	padding:15px 0 0 0;	
}

#content-wrapper .stable > .body > .row > .collapsible > .inner > .split .oneliner > .label {
	padding:0 5px 5px 0;
	display:inline-block;
}

#content-wrapper .stable > .body > .row > .collapsible > .inner > .split .oneliner > .value {
	color:#1a171b;
	display:inline-block;
}


/* margins */

/* results */
#content-wrapper .stable .c.result {
	width:14%;
}

#content-wrapper .stable .c.result > .inner {
	font-weight:bold;
}

#content-wrapper .stable .c.module {
	width:17%;	
}

#content-wrapper .stable .c.syllabus {
	width:15%;	
}

#content-wrapper .stable .c.type {
	width:12%;	
}

#content-wrapper .stable .c.software {
	width:24%;	
}

#content-wrapper .stable .c.date {
	width:12%;	
}

/* certificates */
#content-wrapper .stable .c.certificate {
	width:70%;
}

#content-wrapper .stable .c.cdate {
	width:24%;
}

#content-wrapper .stable .c.action {
	width:6%;	
}

@media screen and (max-width: 820px){
	#content-wrapper .stable .loader {
		margin:15px 0 0 0;
	}
	
	#content-wrapper .stable > .body > .row > .collapsible > .inner > .split .oneliner {
		display:block;
	}
	
	#content-wrapper .stable > .head > .c > .label {
		line-height:22px;
	}
	
	/* smaller expandicons */
	#content-wrapper .stable > .body > .row > .c > .inner > .expander {
		width:18px;
		height:18px;
		background-size:36px 18px;
		margin:11px 0;
	}
	
	#content-wrapper .stable > .body > .row > .c > .inner > .expander.open {
		background-position:-18px 0;
	}
	
	#content-wrapper .stable > .body > .row > .c.right > .inner {
   		padding: 0 2px 0 0;
	}
	
	#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .result > .resultlabel {
		display:none;
	}

	#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .result > .resultbar {
		width:100%;
		float:none;
		margin:8px 0 0 0;
	}
	
	#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .result > .downloadlabel {
		width:60%;
		margin:10px 0 0 0;
	}
	
	#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .bigofthree {
		padding: 0 4% 0 0;
		width:39%;
	}
	
	#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .smallofthree {
		width:56%;
		float:right;
	}

	#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .share > .shares,
	#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .share > .shareresultlabel {
		text-align: center;
	}
	
	#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .share > .shares > .shareicon {
		margin:0 5px 5px 0;
		display: inline-block;
		float:none;
		vertical-align: top;
	}

	/* remove columns */
	#content-wrapper .stable .c.result {
		display:none;
	}

	#content-wrapper .stable .c.module {
		width:48%;	
	}
	
	#content-wrapper .stable .c.syllabus {
		display:none;
	}
	
	#content-wrapper .stable .c.type {
		width:42%;	
	}
	
	#content-wrapper .stable .c.software {
		display:none;
	}
	
	#content-wrapper .stable .c.date,
	#content-wrapper .stable .c.cdate {
		display:none;
	}
	
	#content-wrapper .stable .c.certificate {
		width:90%;
	}
	
	#content-wrapper .stable .c.action {
		width:10%;	
	}
}

/* extra small */
@media screen and (max-width: 500px){
	#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .result > .downloadlabel {
		display:none;	
	}
	
	#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .result > .pdficon {
		margin:-2px 23% 0;
	}
	
	#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .share > .shareresultlabel {
		display:none;
	}
	
	#content-wrapper .stable > .body > .row > .collapsible > .inner > .split > .share > .shares {
		padding:0 0 0 0;
	}
	
	#content-wrapper .stable .loader {
		margin:10px 23% 0 0;
		float:none;
	}
	#content-wrapper .stable > .body > .row > .collapsible > .inner > .split .oneliner {
		padding:10px 0 0 0;
	}
}