/* -------------------------------------------------- */
/*    GLOBAL STUFF                                    */
/* -------------------------------------------------- */

/* blue: #399AC9 */
/* green: #00CC33 */
/* red: #DC5B54 */
/* orange: #FF9933 */
/* grey: #999999 */

/* rpid11: ausbildung / blue */
/* rpid12: weiterbildung / green*/
/* rpid13: forschung / red */
/* rpid14: dienstleistung / orange */
/* rpid15: informationen / grey*/

@media (max-width: 970px) {
  
     #page {
        /*width: 400px;*/
        width: 100vw;
        /*font-size: 20px;*/
    }

    #maincol{
        width: calc(100vw - 236px - 234px);
    }

    #extranettoggle {
        margin-left: auto;
        margin-right: 20px;
    }
    
    #mainnav,
    #logo,
    #metaleft,
    #quicklinks{
      margin-left: 4px; 
    }
    #subnav{
        margin-left: 0;
    }


    body.rpid182 #mobnav,
    body.rpid10 #mobnav{
        display: none;
    }

    #metatop{
        margin-right: 20px;
    }

    #content .csc-textpic-imagewrap img{
        width: 100%;
        height: auto;
    }

    #sub figcaption.csc-textpic-caption {
        margin-top: 0;
        font-size: 1.4em;
        text-shadow: none;
        color: #000;
        width: auto;
        height: auto;
        margin-left: 0 !important;
    }
}

@media (max-width: 850px) {

    #maincol{
        width: calc(100vw - 234px);
    }

    #rightcol{
        /* float: none; */
        padding-left: 0;
        width: 98%;
    }
}

@media (max-width: 736px) {
    
    #body {
        padding: 0 20px;
    }

    #page #slide , #page #slidenav{
      display: none;
    }

    #main {
        display: block;
        width: 100%;
       /* overflow: hidden;*/
       /*border: 1px red solid;*/
    }
    
    #page {
        /*width: 400px;*/
        width: 100%;
        /* font-size: 20px; */
    }
    
    #head {
        margin-top: 80px;
        margin-left: 10px;
        margin-right: 10px;
        padding-top: 1.5em;
    }
        
    #mainnav {
        height: auto;
        /*font-size: 20px;*/
        margin-left: 3px;
        margin-top: -3px;
    }
    
    #mainnav a {
        font-size: 2.6em;
    }
    
    #mobnav{
        display: block;
        height: 3.3em;
        cursor: pointer;
        background: url('../img/navicon.svg') -8px -8px/43px no-repeat #FFF;
    }

    #mobnav.opennav{
        background: url('../img/close.svg') left top/48px no-repeat #FFF;
        background-size: 25px 25px;
    }

    #mobnavv:before{
        font-family: FontAwesome;
        display: block;
        font-size: 2.8em;
        content: "\f0c9";
    }

    #mobnavv.opennav:before{
        font-family: FontAwesome;
        display: block;
        font-size: 2.8em;
        content: "\f00d";
    }


    #subnav{
        display: none;
    }

    #subnav.opennav{
        display: block;
    }

    #subnav a {
        font-size: 1.8em;
    }
    
    #pid11 #subnav {
        margin-bottom: 1.5em;
    }
    
    #pid12 #subnav {
        margin-bottom: 1.5em;
    }
    
    #pid13 #subnav {
        margin-bottom: 1.5em;
    }
    
    #pid14 #subnav {
        margin-bottom: 1.5em;
    }
    
    #pid15 #subnav {
        margin-bottom: 1.5em;
    }
    
    #mainnav li {
        display: block;
    }
    
    #logo {
        margin-top: -80px;
        margin-left: 3px;
        margin-right: 10px;
       /*position: static; */
        height: 40px;
    }
    
    #logo img {
        /*width: 60%;*/
        width: 100%;
    }
    
    #metatop  {
        margin-right: 0;
      /*font-size: 1.8em ;*/
    }
    
    #metatop a {
      font-size: 1.8em ;
    }
    
    li.first {
        margin-top: 10px;
    }
    
    ul.nav {
        margin-right: 10px;
    }
    

    #extranettoggle img{
        margin-top: 150px;
        width: 30px;
    }
    
    #content {
        margin-left: 10px;
        margin-right: 10px;
        font-size: 130%;
    }

    #cont input.tx-indexedsearch-searchbox-sword, 
    #mc_embed_signup input.email{
        width: 90%;
    }
    
    #cont td.tx-indexedsearch-title {
        font-size: 1.6em;
    }

    #cont .news-list-date, #cont .news-single-date{
       font-size: 32px;
    }
    
    
    #cont .news-list-item h2, #cont div.news-single-item h2{
       font-size: 32px;
       padding-bottom: 8px;
    }
    
    
    #cont div.news-single-item{
        font-size: 24px;  
        line-height: 30px;
    }
    
    #cont div.tt_news_imagewrap{
        font-size: 24px;   
    }
    
    div.table-cont .td-2 {
            padding: 1px 5px;
            border: 1px solid grey;
            width: 100px;
    }

    .html-cont iframe{
        width: 100%;
        height: 60vw;
    }

    body.rpid10 #slide {
      /* width: 740px; */
       /* margin-right: 450px; */
    }
    
    #slidenavright{
     /*   cursor: e-resize; */
        cursor: pointer;
        float: right;
        /*margin-right: 450px;*/
    }
    
    body.rpid10 #maincol {
        background-image: none;
    }
    
    #extranet {
        /* overflow: visible; */
        /* margin-left: 3px; */
        /* margin-right: 10px; */
        /* margin-top: 10px; */
    }
    
    #extranethead {
        /*font-size: 150%;*/
        /* overflow: visible; */
    }

    #extranetnav {
        float: none;
    }
    
    #extranetnav li{
        padding-left: 4px;
        padding-right: 16px;
    }

    #metaextranetleft, #metaextranetright {
      padding-left: 0;
      font-size: 75%;
    }
    
    #login {
        font-size: 120%;
    }
    
    #login div.loginname {
      width: 40%;
    }
    
    #login #user {
        /*width: 70%;*/
        font-size: 75%;
    }
    
    #login #pass {
        /*width: 25%;*/
        font-size: 75%;
    }
    
    #login div.loginsubmit {
      margin-left: auto;
    }
    
    #content dd.csc-textpic-caption {
        font-size: 200%;
    }
    
    #line {
        display: block;
        margin-top: 10px;
    }
    
    #pid10 #line {
        /* display: none; */
    }
    
    #maincol {
        float: none;
        width: 100%;
    }
    
    #leftcol {
      padding-right:16px;
      margin-left: 10px;
      float: none;
      width: 100%;
    }
    
    #main #quicklinks {
        display: none;
    }
    
    #metaleft {
        display: none;
    }
    
    #metaleft-bottom {
        display: none;
    }
    
    #rightcol {
        padding-left: 0;
        width: 98%;
    }
    
    #rightcol .news-latest-item{
        font-size: inherit;
    }

    #rightcol .news-latest-item-more {
      float: left;
      font-size: 120%;
      width: 60%;
      line-height: 1.8;
    }
    
    #rightcol .news-latest-img img {
      padding-left: 10px;
    }
    
    #rightcol .news-latest-img + .news-latest-item-more {
        width: 50%;
    }
    
    body.rpid10 #rightcol .news-latest-date{
        /* font-size: 26px; */
        margin-bottom: 6px;
    }
    
    
    #c74 {
        background-color:transparent;
        background-image:url(img/dashed_grey.png);
        background-position:0 0;
        background-repeat:repeat no-repeat;
        padding-top: 1.5em;
        /*padding-top: 12px;*/
    }
    
    #c6 {
        background-color:transparent;
        background-image:url(img/dashed_grey.png);
        background-position:0 0;
        background-repeat:repeat no-repeat;
        padding-top: 1.5em;
        /*padding-top: 12px;*/
    }
    
    #bottom {
        margin-left: 10px;
        margin-right: 10px;
    }
    
    #footer {
        margin-left: -5px;
        width: 50%;
        min-width: 250px;
    }

    #footer  li{
        display: block;
        float: left;
        padding-bottom: 1em;
    }

    #footer  li.first{
        margin-top: 0;
    }
    
    #footer ul.nav {
        font-size: 100%;
    }
    
    #social {
        margin-right: -3px;
        width: 12%;
        min-width: 104px;
    }
    
    /* -------------------------------------------------- */
    /*    Font Colors                                      */
    /* -------------------------------------------------- */
    
    
    #subnav li, #subnav li li li, #subnav li li, #subnav li.act,  #subnav li li.act,  #subnav li li li.act  {
        padding-left: 21px;
    }
    
    #subnav li li li{
      margin-left: -21px;
    }
    
    #subnav li{
        margin: 3px 0;
    }
    
    /* first level auch schwarz */
    /*  #subnav li.act a.act */
    
    #subnav li.act a.act,  #subnav li li.act a, body.rpid11 #subnav li.actsubcur a.act,  #subnav li li li.act a,  #subnav li li.actsubcur a.act,  #subnav li li li.act a.act{
        color: #000;
    }
    
    
    #subnav li li.act{
        background: url('img/nav_active_level3.png') no-repeat left 6px transparent;
    }
    
    
    
    /* green ausbildung */ 
    
    body.rpid11 h1, 
    body.rpid11 h2, 
    div.branch-rpid11 a,
    #cont div.branch-rpid11 strong{
        color: #00CC33;
    }
    
    body.rpid11 #mainnav a.act, 
    body.rpid11 #rightcol, 
    body.rpid11 #rightcol a{
        color: #00CC33;
    }
    
    body.rpid11 #subnav a, 
    body.rpid11 #subnav li li li a{
        color: #00CC33;
    }
    
    body.rpid11 #subnav li {
            background: url("mob/nav_close_level2_green.png") no-repeat scroll left 6px transparent;
    }
    
    body.rpid11 #subnav li.act {
            background: url("img/nav_close_level2.png") no-repeat scroll left 6px transparent;
    }
    
    body.rpid11 #subnav li.actsub{
        background: url('img/nav_open_level2_green.png') no-repeat left 6px transparent;
    }
    
    body.rpid11 #subnav li.actsubcur{
        background: url('img/nav_open_level2.png') no-repeat left 6px transparent;
    }
    
    body.rpid11 #subnav li li {
        background: url('img/nav_close_level3_green.png') no-repeat left 6px transparent;
    }
    
    body.rpid11 #subnav li li.actsubcur{
        background: url('img/nav_open_level3.png') no-repeat left 6px transparent;
    }
    
    
    body.rpid11 #subnav li li.act,
    body.rpid11 #subnav li li.actsub {
        background: url('img/nav_open_level3_green.png') no-repeat left 6px transparent;
    }
    
    body.rpid11 #subnav li li li {
        background: url('mob/nav_level4_green.png') no-repeat left 6px transparent;
    }
    
    body.rpid11 #subnav li li li.act {
        background: url('img/nav_level4.png') no-repeat left 6px transparent;
    }
}

@media (max-width: 440px) {

    #social {
        margin-right: -3px;
        width: 22px;
        min-width: 22px;
    }
}

@media (max-width: 360px) {

   #logo {
        margin-top: -70px;
        height: 40px;
    }



    #head{
        margin-top: 40px;
    }
    
}