﻿
body {
    color: #333333;
    text-transform: none;
    font-weight: 400;
    font-family: 'Raleway', serif;
    background: url(skn/bg1.jpg) 50% 50% no-repeat;
    background-size: cover;
}
p, td, li, label {
    font-size: initial;
    line-height: 1.5;
    font-weight: 400;
    font-family: 'Raleway', serif !important;
}
    body.rest {
        background: url(skn/marmaro.jpg) 50% 50% repeat;
       
    }
    
    @media(max-width:990px) {
        body .rest {
        background: url(skn/marmaro.jpg) 50% 50% no-repeat;
        background-size: cover;
        background-attachment:fixed;
    }
}
html, body {
    height: 100%;
    min-height: 100%;
}
    body.rest .main-content {
        padding-top: 45px;
        padding-bottom: 115px;
    }
    body.rest.edit-mode .main-content {
        padding-top: 95px;
        padding-bottom: 115px;
    }
  



.layer-action-ProductQuickView, body#tinymce {
    background: #fff !important;
}

h1, h2, h3, h4, h5 {
    font-family: 'Montserrat', serif;
    font-weight: 500;
}
h1{font-size:3.5em;}
h2 {
    font-size: 2.5em;
}
h3 {
    font-size: 2em;
}
a {
   
    color: #049bd6;
}

    a:hover, a:focus {
        color: #049bd6;
    }

img, img.responsive {
    display: inline-block !important;
}

.edit-actions {
    position: fixed;
    z-index: 10000;
    bottom: 20px;
    left: 20px;
}
span.input-group-addon {
    background:#ffffff;
    border-color:#000;
    border-radius:0px;
}
.home-wrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}

.btn, .btn:hover, .btn:focus {
    border-radius: 0px !important;
    font-family: 'Raleway', serif;
    font-weight: 700;
    font-size: 22px;
}
    .btn.btn-builder, .btn.btn-builder:hover, .btn.btn-builder:focus{
        font-size: 16px !important;
    }
.btn-primary {
    color: #ffffff;
    background-color: #049bd6;
    border-color: #049bd6;
}
    .btn-primary:hover, .btn-primary:focus {
        color: #ffffff;
        background-color: #333;
        border-color: #333;
    }
.btn-block {
    padding: 6px 12px;
}

.btn.btn-primary.btn-alt {
    color: #ffffff;
    border-color: #ffffff;
    border-radius: 0px;
    border-width: 1px;
    background: none;
    font-size: 22px;
}
.bg1 {
    background: url('skn/bg1.jpg') 50% 50% no-repeat; background-size:cover;

}
.no-mt {
    margin-top: -15px;
    position:relative;
}
 .btn.btn-primary.btn-alt:hover, .btn.btn-primary.btn-alt:focus {
    color: #ffffff;
    border-radius: 0px;
    border-width: 1px;
    border-color: #ffffff;
    font-size: 22px;
    background: linear-gradient(to right, #FDFBFB, #EBEDEE 70%);
}

        .btn.btn-primary.btn-alt:hover span, .btn.btn-primary.btn-alt:focus span {
            background: linear-gradient(to right, #30CFD0 0%, #330867 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            font-weight: 700;
            font-family: 'Raleway', serif;
        }



.rest .btn.btn-primary.btn-alt {
    color: #333;
    border-color: #333;
    border-radius: 0px;
    border-width: 1px;
    font-size: 22px;
    background: none;
  
}

    .rest .btn.btn-primary.btn-alt:hover, .rest .btn.btn-primary.btn-alt:focus, .rest .btn.btn-primary.btn-alt.active {
        color: #333;
        border-radius: 0px;
        border-width: 1px;
        border-color: #333;
        font-size: 22px;
        background: linear-gradient(to right, #FDFBFB, #EBEDEE 70%);
        background: #333;
    }

        .rest .btn.btn-primary.btn-alt em, .rest .btn.btn-primary.btn-alt:hover em, .rest .btn.btn-primary.btn-alt:focus em {
            color: #049bd6;
            line-height: 22px;
            position: relative;
            bottom: -4px;
            font-size: 32px;
            background: none;
            
        }
        .rest .btn.btn-primary.btn-alt.active em, .rest .btn.btn-primary.btn-alt:hover em, .rest .btn.btn-primary.btn-alt:focus em {
            background: linear-gradient(to right, #30CFD0 0%, #049bd6 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }

        .rest .btn.btn-primary.btn-alt.active span, .rest .btn.btn-primary.btn-alt:hover span, .rest .btn.btn-primary.btn-alt:focus span {
            background: linear-gradient(to right, #30CFD0 0%, #049bd6 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            font-weight: 700;
        }
.form-control, .form-control:hover, .form-control:focus {
    border-color:#333;
    border-radius:0px;
}

.langs {
    padding-left: 10%;
    padding-right: 10%;
}

.bottom-menu {
    position: fixed;
    bottom: 0px;
    left: 0px;
    width: 100%;
    z-index: 200;
    background: #ffffff;
    -webkit-box-shadow: 0px 0px 5px 0px rgba(99,98,99,1);
    -moz-box-shadow: 0px 0px 5px 0px rgba(99,98,99,1);
    box-shadow: 0px 0px 5px 0px rgba(99,98,99,1);
}

    .bottom-menu ul {
        margin: 0px;
        padding: 0px;
    }

        .bottom-menu ul li {
            margin: 0px;
            padding: 0px;
            list-style: none;
            float: left;
            text-align: center;
            padding: 5px;
        }

            .bottom-menu ul li a, .bottom-menu ul li a:hover, .bottom-menu ul li a:focus {
                text-align: center;
                display: block;
                padding-top: 5px;
                text-decoration: none;
                color: #333;
                white-space: normal;
            }

                .bottom-menu ul li a span, .bottom-menu ul li a:hover span, .bottom-menu ul li a:focus span {
                    text-align: center;
                    text-decoration: none;
                   
                    font-size: 14px;
                    color: #333;
                    font-weight: 700;
                    font-family: 'Raleway', serif;
                    white-space: normal;
                    position: relative;
                }

                .bottom-menu ul li a img, .bottom-menu ul li a:hover img, .bottom-menu ul li a:focus img {
                    max-height: 50px;
                }
@media(max-width:768px) {
    .bottom-menu ul li a span, .bottom-menu ul li a:hover span, .bottom-menu ul li a:focus span {
        font-size: 12px;
        font-family: 'Raleway', serif;
        white-space: normal;
    }
    h1{font-size:2.4em;}
    h2 {
        font-size: 2em;
    }

    h3 {
        font-size: 1.7em;
    }
}

@media(max-width:600px) {
    .bottom-menu ul li a span, .bottom-menu ul li a:hover span, .bottom-menu ul li a:focus span {
        font-size: 10px;
        font-family: 'Raleway', serif;
        white-space: normal;
    }
        .bottom-menu ul li a span.visible-xs-block, .bottom-menu ul li a:hover span.visible-xs-block, .bottom-menu ul li a:focus span.visible-xs-block {
            display: block !important;
        }
    h1 {
        font-size: 2em;
    }
    h2 {
        font-size: 1.8em;
    }

    h3 {
        font-size: 1.5em;
    }
}

@media(max-width:480px) {
    .bottom-menu ul li a span, .bottom-menu ul li a:hover span, .bottom-menu ul li a:focus span {
        font-size: 9px;
        font-family: 'Raleway', serif;
        white-space: normal;
        text-align: center;
        text-decoration: none;
        
        width:100%;
    }
    h1 {
        font-size: 1.8em;
    }
    h2 {
        font-size: 1.6em;
    }

    h3 {
        font-size: 1.3em;
    }
}

.top-area {
    position: fixed;
    z-index: 200;
    top: 0px;
    left: 0px;
    width: 100%;
    background: #049bd6;
    text-align: center;
    padding-top: 10px;
    padding-bottom: 10px;
    -webkit-box-shadow: 0px 0px 5px 0px rgba(99,98,99,1);
    -moz-box-shadow: 0px 0px 5px 0px rgba(99,98,99,1);
    box-shadow: 0px 0px 5px 0px rgba(99,98,99,1);
}

    .top-area img {
        max-height: 60px;
    }

.img-burger {
    background: #333;
    border-radius: 50%;
}
.top-area-edit-actions{
    position:absolute;
    top:5px;
    right:20px;
}
    .top-area-edit-actions a, .top-area-edit-actions a:hover, .top-area-edit-actions a:focus{
        font-size:2em;
        color:#ffffff;
    }
/* The side navigation menu */
.verMenu {
    height: 100%; /* 100% Full-height */
    width: 0; /* 0 width - change this with JavaScript */
    position: fixed; /* Stay in place */
    z-index: 199; /* Stay on top */
    top: 0;
    left: 0;
    background-color: #e6e6e6; /* Black*/
    overflow-x: hidden; /* Disable horizontal scroll */
    padding-top: 80px; /* Place content 60px from the top */
    padding-bottom: 85px; /* Place content 60px from the top */
    -moz-transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
    -webkit-transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
    transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
    opacity: 0;
}
    /* The side navigation menu */
    .verMenu.opened {
        width: 100%;
        -moz-transition: 1s; /* 0.5 second transition effect to slide in the sidenav */
        -webkit-transition: 1s; /* 0.5 second transition effect to slide in the sidenav */
        transition: 1s; /* 0.5 second transition effect to slide in the sidenav */
        opacity: 1;
    }

.verMenuInner {
    overflow-y: auto;
    min-height: 100%;
    height: 100%;
    position: relative;
}

.verLinks a {
    display: block;
    text-align: center;
    color: #333;
    font-size: 24px;
    font-weight: 700;
    padding-top: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid #555;
    font-family: 'Raleway', serif;
    text-decoration: none;
}

    .verLinks a:hover, .verLinks a:focus {
        color: #049bd6;
    }

.verMenuInner a.togglemenu, .verMenuInner a.togglemenu:hover, .verMenuInner a.togglemenu:focus {
    position: absolute;
    right: 15px;
    top: 7px;
    color: #333;
    font-size: 28px;
    text-decoration: none;
    cursor: pointer;
}

.full-height {
    min-height: 100%;
    height: 100%;
}

.verLangs a, .verLangs a:hover, .verLangs a:focus {
    font-size: 32px;
    display: inline-block;
    padding-top: 7px;
    padding-bottom: 7px;
}

.verUser a, .verUser a:hover, .verUser a:focus {
    font-size: 14px;
    display: inline-block;
    padding-top: 22px;
    padding-bottom: 7px;
    color: #333;
    font-weight: 700;
    text-decoration: none;
    font-family: 'Raleway', serif;
}

    .verUser a:hover, .verUser a:focus {
        color: #049bd6;
    }

        .verUser a i, .verUser a:hover i, .verUser a:focus i {
            font-size: 32px;
        }

.bg-white {
    background: #ffffff;
}

.gallery-item-title {
    padding: 10px;
    font-size: 18px;
    color: #000;
    text-decoration: none !important;
    font-weight: 300;
}

.img-thumbnail {
    text-decoration: none !important;
    border-radius: 6px;
}

a.img-thumbnail,div.img-thumbnail {
    cursor: pointer;

}
.gallery-image-wrapper {
    overflow: hidden;
    position:relative;
    border-radius:4px;
}
.gallery-item-title.gallery-item-title-hover {
    padding: 10px;
    font-size: 18px;
    color: #fff;
    text-decoration: none !important;
    font-weight: 300;
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    background: rgba(0,0,0,0.7);
}
.product-tile .product-tile-title {
    padding: 10px;
    font-size: 18px;
    color: #fff;
    text-decoration: none !important;
    font-weight: 300;
    position: absolute;
    bottom: 0px;
    width: 100%;
    left: 0px;
    background: rgba(0,0,0,0.7);
}
    .product-tile .product-tile-title .product-tile-description {
        padding-top: 10px;
        font-size: 14px;
        color: #30CFD0;
        
    }
@media(max-width:1170px){
    .gallery-item-title.gallery-item-title-hover {
        padding: 7px;
        font-size: 16px;
    }
    .product-tile .product-tile-title {
        padding: 7px;
        font-size: 16px;
    }
}
.hover-header {
    font-family: 'Raleway', serif;
    position:relative;
    padding:0px;
    margin:0px;
  
    padding-bottom:20px;
    font-size:20px;
}
@media(max-width:768px){
    .hover-header {
        font-size: 18px; 
    }
}
.modal .modal-content .modal-header {
    font-family: 'Raleway', serif;
    font-weight: 500;
    background-color: #049bd6;
    background-image: url(skn/logo-modal.png);
    background-size: 57px 57px;
    background-position: 0px 0px;
    padding-left: 70px;
    background-repeat: no-repeat;
}

.full-modal .modal-dialog {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}

.full-modal {
    border-radius: 0px;
}

    .full-modal .modal-content, .full-modal .modal-body {
        height: auto;
        min-height: 100%;
        border-radius: 0;
    }
  
    .full-modal .fa-2x {
        margin-top: -0.35em;
    }


.button-send {
    text-align: center;
}

#Form_6610496D .TextAboveForm .btn {
    min-width: 200px;
}

.slider-for button {
    width: 64px;
    height: 64px;
    border: none;
    border-radius: 0;
    -webkit-opacity: 1;
    -moz-opacity: 1;
    opacity: 1;
    -webkit-transition: all 0.4s ease-out;
    -moz-transition: all 0.4s ease-out;
    -ms-transition: all 0.4s ease-out;
    -o-transition: all 0.4s ease-out;
    background: none;
    line-height: 50px;
    color: #9ed2cf;
    visibility: visible;
    font-size: 0px;
    position: absolute;
    top: 45%;
    color: #049bd6;
    /*background: rgba(255,255,255,0.2);
    border-radius: 5px;*/
}

    .slider-for button:hover {
        border-color: transparent;
        color: #000;
    }

    .slider-for button:before {
        line-height: 58px;
        color: #049bd6;
        font-size: 14px;
    }

    .slider-for button:hover:before {
        line-height: 58px;
        color: #000;
        font-size: 14px;
    }

    .slider-for button.slick-prev {
        left: 0px;
        right: initial;
    }

        .slider-for button.slick-prev:before {
            content: "\f104";
            font-family: FontAwesome;
            font-size: 50px;
        }

    .slider-for button.slick-next {
        right: -1px;
        left: initial;
    }

        .slider-for button.slick-next:before {
            content: "\f105";
            font-family: FontAwesome;
            font-size: 50px;
        }


.slick-dots {
    position: absolute;
    bottom: -30px;
    left: 0px;
    width: 100%;
    margin: 0px;
    padding: 0px;
    text-align: center;
}

    .slick-dots li {
        position: relative;
        display: inline-block;
        margin: 10px;
        padding: 0;
        cursor: pointer;
    }

        .slick-dots li button {
            font-size: 0;
            line-height: 0;
            display: inline-block;
            background: none;
            border-radius: 50%;
            border: 1px solid #000;
            background: #000;
            width: 12px;
            height: 12px;
            padding: 0px;
            cursor: pointer;
            color: transparent;
        }

        .slick-dots li.slick-active button {
            border: 1px solid #049bd6;
            background: #049bd6;
        }

.letters-block {
    background: #ffffff;
    padding: 15px;
    -webkit-box-shadow: 0px 0px 5px 0px rgba(99,98,99,1);
    -moz-box-shadow: 0px 0px 5px 0px rgba(99,98,99,1);
    box-shadow: 0px 0px 5px 0px rgba(99,98,99,1);
    text-align:center;
}
span.letter{
    display:inline-block;
    font-size:22px;
    color:#ccc;
    font-weight:500;
    padding:10px;
    cursor:not-allowed;
}
    span.letter.active {
        color: #333;
        cursor: pointer;
    }
    span.letter.active.selected {
        color: #049bd6;
    }
.material {
    border-bottom: 1px solid #ebebeb;
    padding-top: 5px;
    padding-bottom: 5px;
    display: none;
  
    cursor: pointer;
    font-weight: 600;
}
    .material.active {
        color: #049bd6;
        cursor: pointer;
        font-weight:600;
    }
.material-products{
    display:none;
}
.material-header{
    background:#333;
    color:#ffffff;
    padding:5px;
    margin-bottom:15px;
}
    .material-header h4 {
        padding: 0px;
        margin: 0px;
        color: #ffffff;
        line-height:initial;
    }
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary {
    color: #ffffff;
    background-color: #333;
    border-color: #333;
}
@media(max-width:768px){
    

    span.letter {
        
        font-size: 18px;
        font-weight:600;
        padding: 6px;
        padding-left:10px;
        padding-right:10px;
    }

       
}

.img-thumbnail.active{
    border-color:#049bd6;
}
.img-verbrauchsrechner{border-width:3px;}
.zoom{
    color:#049bd6;
    position:absolute;
    bottom:60px;
    right:30px;
    height:40px;
    width:40px;
    
}
#cookie-bar{display:none !important;}

.modal .modal-content .modal-header .close {
    font-size: 3em;
    line-height: 20px;
}

.modal .modal-content .modal-header {
    background-image: url(skn/logo-modal.png);
    background-size: 57px 57px;
    background-position: 0px 40px;
    padding-top: 50px; 
}

.flag-icon {
   
   
    width: 25px !important;
 
}