/* Screens ab 768px - Tablet UND Desktop */
@media screen and (min-width: 768px) {

    #wrapper {
        padding: 1.2% 1.2% 1px 1.2%;
    }

    #mobileheader-box {
        display: none;
    }

    #logo-box {
        width: 36.63%;
        max-width: 548px;
        margin: 0;
        float: left;
    }

    #headerbild-box {
        width: 63.37%;
        max-width: 948px;
        margin: 0;
        display: block;
        float: left;
    }

    #logo, #headerbild {
        max-width: 100%;
        max-height: 100%;
        margin-bottom: 0;
    }


    /* Footer */

    #footermain {
        line-height: 1.25; 
    }

    #footer-1-left,
    #footer-2-left {
        width: 210px;
    }


    /* Haupt-Navigation */

    #Navi-Top {
        display: block;
    }

    #Navi-Top .inside {
        max-width: 100%;
        padding: 12px 10px 6px 10px;
        vertical-align: middle;
        background-color: #ebebeb;
    }

    #navimain {
        margin: 0;
        display: inline-block;
    }

    #navimain ul {
        margin: 0;
        padding: 0;
    }

    #navimain li {
        float: left;
        list-style: none;
        margin: 0;
        padding: 0;
        border-right: 1px solid #000;
    }

    #navimain li.last {
        border-right: none;
    }

    #navimain a:hover {
        color: #f5f5f5;
        background-color: #8d0002;
        padding: 0 4px;
    }

    #navimain strong.active,
    #navimain .trail a {
        color: #f5f5f5;
        background-color: #8d0002;
        padding: 0 4px;
        font-weight: normal;
    }

}


/* NUR Tablet */
@media screen and (min-width: 768px) and (max-width:1149px) {

    /* Erweiterung Contao responsive.css um Tablet Größe*/

    #wrapper {
        margin:0;
        width:auto;
    }
    #container {
        padding-left:0;
        padding-right:0;
    }
    #main,#left,#right {
        float:none;
        width:auto;
    }
    #left {
        right:0;
        margin-left:0;
    }
    #right {
        margin-right:0;
    }

    /* Ausgeblendete Bereiche */

    #Navi-Top .mod_form, #navisub, #Klostermann-Sidebar {
        display: none;
    }

    /* Layout */
    
    #main .inside {
        margin-left: 3%;
        margin-right: 5%;
    }

    /* Footer */

    #footer-1-left,
    #footer-1-right{
        height: 9rem;
    }

    #footer-1-2 {
        float: left;
    }

    #footer-3{
        float: right;
        width: 36%;
        margin-top: 2.5em;
        text-align: center;
    }

    #footermain-clear {
        clear: both;
    }

    /* Haupt-Navigation */

    #navimain {
        width: 100%;
    }

    /* Suchfeld Tablet*/

    #logo-box {
        position: relative;
    }
    
    #logo-box .mod_form {
      position: absolute;
      margin: 0;
      bottom: 0;
      right: 6px;
    }

    #logo-box form {
        margin-bottom: 7px;
    }


    /* Sub-Navigation Tablet*/

    #NaviSub-Tablet {
        display: block;
        margin: 0;
    }

    #NaviSub-Tablet .inside {
        max-width: 100%;
    }

    #navisubtablet {
        margin: 0;
        display: block;
    }

    #navisubtablet ul {
        margin: 7px 0 0 10px;
        padding: 0;
    }

    #navisubtablet a,
    #navisubtablet strong {
        display: block;
        font-size: 1.25rem;
        line-height: 1.5;
        padding: 9px 16px;
        border: 1px solid #8d0002;
        background-color: #ebebeb;

    }

    #navisubtablet strong.active,
    #navisubtablet .trail a,
    #navisubtablet a:hover {
        color: #f5f5f5;
        background-color: #8d0002;
        font-weight: normal;
    }


}

/* Suchfeld Größenanpassung */

@media screen and (min-width: 768px) and (max-width:1009px) {

    #searchbox input[type=text] {
      width: 78px;
      height: 18px;
      padding: 2px 26px 5px 6px;
      border: 1px solid #8d0002;
     
    }
     
    #searchbox input[type=text]:focus {
      border: 1px solid #8d0002;
    }
     
    #searchbox input.lupe {
      width: auto;
      position: absolute;
      background: none;
      right: 0;
      top: 0;
      padding: 7px;
      z-index: 700;
    }
}

@media screen and (min-width: 1010px) and (max-width:1149px) {
         
    #searchbox input[type=text] {
      width: 100px;
      height: 24px;
      padding: 5px 30px 4px 5px;
      border: 1px solid #8d0002;
     
    }
     
    #searchbox input[type=text]:focus {
      border: 1px solid #8d0002;
    }
     
    #searchbox input.lupe {
      width: auto;
      position: absolute;
      background: none;
      right: 0;
      top: 0;
      padding: 9px;
      z-index: 700;
    }
}


/* Anpassung Tablet SubNavi 2- oder 3-spaltig */

@media screen and (min-width: 768px) and (max-width:849px) {

    #navimain a,
    #navimain strong {
        display: block;
        font-size: 1rem;
        font-weight: normal;
        line-height: 1.5;
        margin: 0 0.2em;
        padding: 0 4px;
    }

    #navisubtablet li {
        float: left;
        list-style: none;
        width: 47%;
        margin: 8px 16px 0 0;
    }
}

@media screen and (min-width: 850px) and (max-width:1009px) {

    #navimain a,
    #navimain strong {
        display: block;
        font-size: 1.25rem;
        font-weight: normal;
        line-height: 1.5;
        margin: 0 0.2em;
        padding: 0 4px;
    }

    #navisubtablet li {
        float: left;
        list-style: none;
        width: 47%;
        margin: 8px 16px 0 0;
    }
}

@media screen and (min-width: 1010px) and (max-width:1149px) {

    #navimain a,
    #navimain strong {
        display: block;
        font-size: 1.375rem;
        font-weight: normal;
        line-height: 1.5;
        margin: 0 0.5em;
        padding: 0 4px;
    }
    
    #navisubtablet li {
        float: left;
        list-style: none;
        width: 31%;
        margin: 8px 16px 0 0;
    }
}

/* Anpassung Klostermann im Footer */

@media screen and (min-width: 768px) and (max-width:899px) {
    #footer-3 {
        width: 25%;
    }
}

@media screen and (min-width: 900px) and (max-width:1149px) {
    #footer-3 {
        width: 36%;
    }
}