/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/*
    Created on : 11.02.2015, 18:12:40
    Author     : andreask
*/

@media only screen and (max-width: 1179px) {
    #action-box {
        max-width: 15%;
    }
    #language {
        position: absolute;
        width: 45px;
        height: auto;
        top: 138px;
        left: 100px!important;
    }
    #language ul li a{
        display: block;
        text-align: center!important;
        padding-top: 8px;
        padding-left: 12px;
    }
    .headnavi .main-navigation > ul {
        margin: 0.8em 0 0 0;
    }
}
@media only screen and (max-width: 1024px) {
    .logo a img {
        height: 85px!important;
    }
    .headnavi .main-navigation > ul {
        margin: 0.8em 0.9em 0 0;
    }
    #tablet #headnav #c-chooser {
        left: 50%;
        margin-left: 12em;
    }
    #tablet #headnav.sticky #c-chooser {
        display: none!important;
    }
    #tablet #language {
        position: absolute;
        width: 45px;
        height: auto;
        top: 136px;
        left: 100px!important;
    }
    .themes > div > img {
        width: 95%;
    }
    .panel-body img ,
    .tab-pane  img {
        width: 100%;
        height: auto;
    }
    .c-tpl-50 > div:first-child > .content-segment {
        max-height: 272px!important;
    }
    .service > div .content-segment {
        min-height: 370px;
        margin-bottom: 20px;
    }
    .bg-gradient {
        height: auto;
    }
    /* RevBanner */

    .tp-banner-container .tp-banner .tp-caption.lfr img {
        margin-top: 55px!important;
        margin-left: -10%!important;
        height: 340px!important;
        width: auto!important;
    }

}

@media only screen and (max-width: 768px) {
    #short-layer{
        position: absolute;
        z-index:9000;
        width: 100%;
        top: 106px;
        background-color: #fff;
    }
    #short-layer ul li {

    }
    .logo a {
        display: block;
        text-align: center;
    }
    .logo a img {
        height: auto!important;
    }
    .headnavi .main-navigation > ul {
        margin: 0.8em 0.9em 0 0;
    }
    .headnavi .main-navigation.right {
        float: left;
    }
    .headnavi #menu-toggle {
        display: inline-block;
        margin-top: 20px;
        padding: 3px 7px;
        width: 49%;
        height: 25px;
        float: left;
        background: url(../../img/custom/btn/btn_gruen_komplett_klein.png) left center no-repeat;
        background-size: 30px 25px;
        color: #fff;
    }
    .headnavi #short-toggle {
        display: inline-block;
        margin-top: 20px;
        padding: 3px 13px 3px 7px;
        width: 49%;
        height: 25px;
        float: right;
        background: url(../../img/custom/btn/btn_gruen_komplett_klein.png) right center no-repeat;
        background-size: 30px 25px;
        color: #fff;
        text-align: right;

    }
    .themes > div > img {
        width: 100%;
    }
    .content-segment iframe {
        padding: 0!important;
        margin-left: -1em!important;
        width: 100%!important;
    }

    .c-tpl-04 .col-sm-6 {
        min-height: 275px;
    }
    .c-tpl-50 div:nth-child(1) {
        height: auto!important;
        margin-bottom: 10px
    }
    .c-tpl-50 div img,
    .c-tpl-51 div img,
    .c-tpl-52 div img {
        width: 100%;
    }
    .c-tpl-50 div:nth-child(1) {
        height: auto!important;
        margin-bottom: 10px
    }
    .c-tpl-50 .content-segment,
    .c-tpl-51 .content-segment,
    .c-tpl-52 .content-segment {
        margin-bottom: 0;
        height: auto!important;
    }
    .service {
        height: auto;
        background: none!important;
    }
    .service > div{
        height: auto!important;
    }
    .service > div .content-segment {
        height: auto;
        min-height: 1px;
        margin-bottom: 20px;
    }
    .fivecols div {
        margin-top: 0.8em;
    }

    /* RevBanner */
    .tp-banner-container {
        overflow: visible;
    }
    .tp-banner-container .tp-banner{
        min-height: 630px;
    }
    .tp-banner-container .tp-banner .tp-caption.layer-1{
        top:63%!important;
        width: 100%;
        font-size: 1em!important;
        text-align: center;
    }
    .tp-banner-container .tp-banner .tp-caption.layer-5{
        top:73%!important;
        width: 100%;
        font-size: 1em!important;
        text-align: center;
    }
    .tp-banner-container .tp-banner .tp-caption.lfr img {

        margin-top: 0!important;
        margin-left: -45%!important;
        font-size: 0.65em!important;
    }
    .tp-banner-container .tp-bullets {
        display: none;
    }
}

@media only screen and (max-width: 640px) {
    a.logoklein {
        display: block;
        width: 100%;
        text-align: center;
        padding-top: 0.8em!important;
    }

    .top > .col-xs-12 > a {
        display: inline-block;
        font-size: 1.3em;
        color: #fff;
        padding: 0.5em 0 0 1em;
    }
    .ltww {
        display: none;
    }
    .dd-menu ul li {
        width: 100%;
    }
    .headnavi li > ul {
        position: relative!important;
        padding: 0 1em;
        width: 108%;
        margin-top: 0;
        top:0 !important;
        box-shadow: none!important;
    }
    #short-layer {
        background: rgba(255,255,255,0.8);
        padding: 1em!important;
    }
    #short-layer hr {
        margin-bottom: 10px;
        margin-top: 10px;
    }
    #short-layer ul li{
        margin-bottom: 5px;
    }
    #short-layer ul li a {
        display: inline-block;
        padding: 0;
        color: #3AA048;
        font-size: 1em;
        text-transform: uppercase
    }
    #short-layer ul li a i {
        font-size: 1.4em;
        margin-right: 10px;
    }
    #short-layer #searchlayer {
        top: 123px;
        left: 2.3em;
        width: 83%;
    }
    #short-layer #lang-choose span {
        display: inline-block;
        float: left;
        margin-right: 13px;
        text-transform: uppercase;
        color: red;
        font-weight: 400;
    }
    #short-layer #lang-choose li a {
        font-weight: 400;
    }
    #short-layer #ul-c-chooser {
        margin: 0.5em 0;
    }
    #short-layer #ul-c-chooser li {
        width: 32%;
        margin-right: 1%;
        float: left;
    }
    #short-layer #ul-c-chooser li a {
        display: block;
        padding: 2px 4px;
        font-size: 0.89em;
    }

    /* RevBanner */
    .tp-banner-container {
        overflow: visible;
    }
    .tp-banner-container .tp-banner{

        min-height: 400px!important;
    }
    .tp-banner-container .tp-banner .tp-caption.layer-1{
        top:55%!important;
        width: 100%;
        font-size: 0.65em!important;
        text-align: center;
    }
    .tp-banner-container .tp-banner .tp-caption.layer-5{
        top:65%!important;
        width: 100%;
        font-size: 0.65em!important;
        text-align: center;
    }
    .tp-banner-container .tp-banner .tp-caption.lfr img {
        margin-left: -60%!important;
        font-size: 0.65em!important;
        max-width: 150%;
        height: auto!important;;
    }
    .tp-banner-container .tp-bullets {
        display: none;
    }

    .service {
        height: auto;
        background: none!important;
    }
    .service > div{
        height: auto!important;
    }
    .service > div .content-segment {
        min-height: 1px;
        height: auto;
        margin-bottom: 20px;
    }

    #prd_item_list_row .shop-content-item-container {
        padding: 20px!important;
    }
    #prd_item_list_row .shop-content-item-container .attr-table {
        width: 100%!important;
    }

    footer .fbottom {
        padding: 0!important;
    }
    footer .fbottom ul.copyright li {
        padding: 0.1em 0;
        float: none;
        line-height: 0.5em;
        display: block;
    }
    footer .fbottom ul.copyright li a {
        display: block;
    }
    footer .fbottom .socials{
        margin-top: 20px;
        border-top: 1px solid rgba(255,255,255,0.3);
        padding: 20px;
    }
    footer .fbottom .socials a {
        font-size: 1.4em!important;

    }
    #back-to-top {
        right: 5px!important;
        bottom: 0!important;
    }
}

@media only screen and (max-width: 360px) {
    body {
        overflow-x: hidden;
    }
    a.logoklein {
        display: block;
        width: 100%;
        text-align: center;
        padding-top: 0.8em!important;
    }
    .mainnavi {
        display: none;
    }
    .ltww {
        display: none;
    }
    .themes {
        padding: 20px 0 0 0;
    }
    .themes > div > img {
        display: none;
    }
    .content-segment iframe {
        padding: 0!important;
        margin-left: -1em!important;
        width: 100%!important;
    }
    .nav-tabs li {
        float: none;
        margin: 0;
    }
    .nav-tabs a {
        display: block;
    }
    .tab-pane .row div,
    .panel-body .row div {
        float: none;
        min-width: 100%;
    }
    .tab-pane  img {
        width: 100%;
        height: auto;
    }
    .c-tpl-50 div:nth-child(1) {
        height: auto!important;
        margin-bottom: 10px
    }
    .c-tpl-50 div img,
    .c-tpl-51 div img,
    .c-tpl-52 div img {
        width: 100%;
    }
    .c-tpl-50 div:nth-child(1) {
        height: auto!important;
        margin-bottom: 10px
    }
    .c-tpl-50 .content-segment,
    .c-tpl-51 .content-segment,
    .c-tpl-52 .content-segment {
        margin-bottom: 20px;
        height: auto!important;
    }
    .service {
        height: auto;
        background: none;
    }
    .service > div .content-segment {
        min-height: 1px;
        height: auto;
        margin-bottom: 20px;
    }
    .panel-body img {
        width: 100%!important;
    }
}