@media screen and (max-width: 320px) {

}

@media screen and (max-width: 480px) {
	.top-header {
		background-image: none;
	    background-color: #eee;
	}
    .col-xs-12 + .col-xs-12 {
        margin-top: 20px;
    }
    .top-header .btn-large {
        font-size: 21px;
    }
    .info-text img {
        max-width: 100%;
    }
    .link-box ul {
    	display: block;
		text-align: center;
    }
    .link-box ul + ul {
		margin-top: 25px;
		margin-left: 0;
    }
}

@media screen and (min-width: 480px) and (max-width: 768px) {
    .feedback-row .col-sm-3 {
        width: 20%;
    }
    .feedback-row .col-sm-9 {
        width: 80%;
    }
}

@media screen and (max-width: 600px) {
    .header-site {
        height: auto;
    }
    a.logo {
        max-width: 70%;
        min-width: 250px;
    }
    .header-contact {
        margin-top: 0 !important;
    }

    table.responsive,
    table.responsive thead,
    table.responsive tbody,
    table.responsive th,
    table.responsive td,
    table.responsive tr {
        display: block;
        overflow: hidden;
    }
    table.responsive thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }
    table.suspensions td,
    table.prices-single td {
        border: 0 !important;
        display: flex;
        padding: 0.25em 0.5em !important;
        text-align: left;
        width: auto !important;
    }
    table.suspensions td:first-child,
    table.prices-single td:first-child {
        background-color: #bababa;
        color: #fff;
    }
    table.suspensions td:before,
    table.prices-single td:before {
        content: attr(data-label)": ";
        font-weight: bold;
        width: 5em;
    }
    table.suspensions td:first-child:before {
        content: none;
        display: inline-block;
        font-weight: bold;
        width: auto;
    }

    table.prices td {
        border: 0 !important;
    }
    table.prices td:before {
        content: attr(data-label)": ";
        font-weight: bold;
        margin-right: 5px;
    }
    table.prices td:first-child,
    table.prices td:first-child + td {
        display: inline-block;
    }
    table.prices td:first-child + td {
        padding-left: 0;
    }
    table.prices td:first-child + td:before {
        display: none;
    }

    table.prices-single tr {
        margin-bottom: 15px;
    }
    table.prices-single td:before {
        width: auto;
        margin-right: 10px;
    }

    .delivery-calendar {
        margin-bottom: 5px;
    }
    .delivery-calendar,
    .delivery-calendar thead,
    .delivery-calendar tbody,
    .delivery-calendar th,
    .delivery-calendar td,
    .delivery-calendar tr {
        display: block;
    }
        .delivery-calendar tr {
            border-bottom: 10px solid #fff;
            display: inline-block;
            width: 30%;
            vertical-align: top;
        }
        .delivery-calendar tr:first-child {
            width: 48%;
            float: right;
        }
        .delivery-calendar tr:first-child + tr {
            width: 22%;
            float: left;
        }
        .delivery-calendar tr:first-child + tr + tr {
            width: 30%;
            float: left;
        }
            .delivery-calendar td {
                border-top: 0 !important;
                border-right: 0;
                border-left: 0;
                border-bottom: 1px solid #ddd;
                padding: 10px;
                position: relative;
                text-align: left;
                width: auto;
            }
            .delivery-calendar tr:first-child td {
                height: 39px;
            }
            .delivery-calendar tr:first-child div {
                padding: 0;
                height: 38px;
            }
            .delivery-calendar tr:first-child td:first-child {
                padding: 0;
            }
            .delivery-calendar tr:first-child + tr td,
            .delivery-calendar tr:first-child + tr + tr td {
                font-size: 14px;
                height: 39px;
            }
            .delivery-calendar tr:first-child div small,
            .delivery-calendar tr:first-child td:first-child small,
            .delivery-calendar tr:first-child td:first-child br,
            .delivery-calendar tr:first-child div:after,
            .delivery-calendar tr:first-child + tr + tr br {
                display: none;
            }
            .delivery-calendar tr:first-child div strong,
            .delivery-calendar tr:first-child td:first-child strong {
                position: absolute;
                width: 100%;
                height: 100%;
                margin: 0;
                padding: 8px 10px;
            }
            .delivery-calendar tr:first-child td:first-child strong {
                background-color: #7b7b7b;
            }
            .delivery-calendar tr:first-child .overnight div strong {
                background-color: #4e8028;
            }
            .delivery-calendar tr:first-child .express div strong {
                background-color: #82b338;
            }
            .delivery-calendar tr:first-child .standard div strong {
                background-color: #c3bf45;
            }
            .delivery-calendar tr:first-child + tr + tr td strong {
                font-size: 14px;
                line-height: 1em;
                display: inline-block;
                margin-right: 2px;
            }
}

@media screen and (max-width: 768px) {
	.arrow-top {
        right: 10px;
        bottom: 60px;
        width: 40px;
        height: 40px;
	}
        .arrow-top span {
            font-size: 22px;
            line-height: 41px;
        }
	.header-contact {
		display: none;
	}
	.row.v-middle {
		display: block;
	}
	.row.v-bottom {
		display: block;
	}
	.row.v-top {
		display: block;
	}
	
	.header-site {
		padding: 10px 20px;
	}
	.header-site .meta-nav,
    .header-contact {
        margin: 0;
    }
    .header-contact {
        background-color: transparent;
        border: medium none;
        padding: 0;
        position: absolute;
        right: 70px;
        margin-top: 0 !important; 
    }
    .header-contact p,
    .header-site .meta-nav .text {
        display: none;
    }
    .header-site .meta-nav .icon,
    .header-contact .icon,
    .mobile-menu .icon {
        font-size: 24px;
    }
    .header-site .meta-nav {
        position: absolute;
        right: 100px;
    }
    .header-site .meta-nav li {
        margin: 0;
        padding: 0 8px;
    }
    .header-site .meta-nav,
    .header-contact {
        top: 21px;
    }
    .header-site .mobile-menu {
        display: flex;
        align-items: center;
    }
    
    #page .site-navi:not(.mega-menu) {
        display: none;
    }
    #page .site-navi:not(.mega-menu) ul {
        width: 100%;
        display: block !important;
    }
    #page .site-navi:not(.mega-menu) li {
        float: none;
        display: block;
        width: 100%;
    }
        .site-navi:not(.mega-menu) .sub-menu {
            background-color: #82b338;
            border-radius: 0;
            margin-top: 0;
            padding: 5px;
            max-width: none;
        }
        .site-navi:not(.mega-menu) .sub-menu:after {
            border: 0;
            display: none;
        }
        .site-navi:not(.mega-menu) > .wrap > ul {
			padding-right: 0;
			padding-top: 10px;
			padding-bottom: 10px;
        }
        .site-navi:not(.mega-menu) .sub-menu li,
        .site-navi:not(.mega-menu) li:hover .sub-menu-wrap,
        .site-navi:not(.mega-menu) li:hover .sub-menu {
            display: block;
            text-align: left;
        }
        .site-navi:not(.mega-menu) .sub-menu li {
            margin-top: 0;
        }
            .site-navi:not(.mega-menu) .sub-menu li a {
                font-size: 14px;
            }
        .site-navi:not(.mega-menu) .sub-menu-wrap {
            display: block;
            position: static;
            top: 0;
        }
        .site-navi:not(.mega-menu) li:hover .sub-menu-wrap {
            top: 0;
            animation: none;
        }
            .site-navi:not(.mega-menu) .sub-menu a:hover {
                background-color: #82b338;
                border-radius: 0;
            }
        .site-navi:not(.mega-menu) .menu-header-search {
			position: static !important;
        }
        	#page .site-navi:not(.mega-menu) .search-form {
				text-align: center;
				position: static;
        	}
        	.site-navi:not(.mega-menu) .search-field {
				height: 30px;
        	}
    
    .product-header img {
        max-width: 75%;
    }
    .product-header .ratingbox {
        display: none;
    }
    .product-header .col {
        text-align: center;
    }

    .product-boxes .wrap {
        border: 1px solid #ddd !important;
        margin-top: 0;
    }
    
    .top-header .js-slider-preview img,
    .top-header .js-slider-preview img + p {
		left: 0 !important;
    }

    .tabify-wrapper .navi {
        display: block !important;
    }
        .tabify-wrapper .navi li {
            border-left: 1px solid #ddd;
            border-right: 1px solid #ddd;
            margin-top: 0;
        }
        .tabify-wrapper .navi li:first-child {
            border-top: 1px solid #ddd;
        }
        .tabify-wrapper.ghost .navi li:first-child {
            border-top: 0;
        }
        .tabify-wrapper .navi li.active {
            background-color: #7b7b7b;
            border: 0;
            color: #fff;
        }

    .showroom {
        overflow: hidden;
    }
        .showroom > img {
            position: absolute;
            z-index: -1;
            height: 100%;
            width: auto;
            max-width: none;
        }
        .showroom .overlay {
            position: static;
            width: 100%;
            height: 100%;
            top: 0;
            left: 0;
            text-align: center;
        }
            .showroom .overlay h2 {
                text-align: center;
            }
            .showroom .wrap {
                margin-left: auto;
                margin-right: auto;
            }

    .row-same-height,
    .row.v-middle {
        display: block;
    }
    .row-same-height .col-xs-12 {
        width: 100%;
    }
    .row-same-height .col + .col {
        margin-top: 20px;
    }

    .product-header h1 {
        text-align: center !important;
    }

    .three-steps ul li {
        margin-left: 10px;
        margin-right: 10px;
    }
    .three-steps ul li:first-child + li,
    .three-steps ul li:first-child + li + li + li {
        display: none;
    }

    .row.comparison .col {
        text-align: center !important;
    }
    .row.comparison .col + .col {
        margin-top: 50px;
    }
    
    .cc_banner-wrapper .cc_container .cc_message, .cc_banner-wrapper .cc_container a {
        font-size: 14px;
        line-height: 1.5em;
    }
    .cc_banner-wrapper .cc_container .col:first-child {
        width: 100%;
    }
    .cc_banner-wrapper .cc_container .col:first-child + .col {
        width: 100%;
        margin-left: 0;
        text-align: center;
    }
        .cc_banner-wrapper .cc_container .col:first-child + .col a {
            border: 1px solid #ccc;
            padding: 5px 20px;
            margin-top: 10px;
            display: inline-block;
        }
        
    ul.accordion li {
		padding-right: 30px;
	}
	.info-text-v2 .wrap {
		column-count: 1;
	}
}

@media screen and (min-width: 768px) {
	.site-navi:not(.mega-menu) {
		display: block !important;
	}
}

@media screen and (max-width: 960px) {
    .mobile-hide {
        display: none !important;
    }
    .wrap-full-grid {
        width: 100%;
    }
    
    .site-navi:not(.mega-menu) .menu-header-search {
		right: 20px;
    }

    .site-content,
    #footer .wrap-full-grid {
        padding-left: 20px;
        padding-right: 20px;
    }
    #footer .row:first-child .col-xs-12 p:first-child {
        border-top: 1px solid #7b7b7b;
        padding-top: 30px;
        margin-top: 30px;
    }

    .top-header {
        background-size: auto 100%;
        min-height: none;
        padding: 0 20px;
    }
        .top-header .col {
            text-align: center;
        }
        .top-header .col + .col {
            padding-left: 15px;
            margin-top: 0;
        }
        .top-header .wrap {
            width: 100%;
            padding-top: 30px;
        }
            .top-header .wrap h1 {
                margin-top: 0;
                text-align: center;
            }
            .top-header .subheadline,
            .top-header .subheadline + p {
                text-align: center;
            }
            .top-header img {
                max-width: none;
                width: 100%;
                margin: 0;
            }
            .top-header .btn {
                margin-top: 20px;
            }

    .header-contact {
        border: 0;
        padding: 0;
        margin-right: 0;
        margin-top: 10px;
    }
    .row.home-top-3 {
        text-align: center;
    }
        .home-top-3 .col div {
            min-height: none;
        }

    .template-slider .wrap {
		margin-bottom: 110px;
    }
    .template-slider .js-prev,
    .motif-slider .js-prev,
    .template-slider .js-next,
    .motif-slider .js-next {
        /*display: none !important;*/
        bottom: -80px;
		top: auto;
		padding: 10px 35px;
		height: 60px;
		width: auto;
		background: #f2f2f2;
		border-radius: 60px;
    }
    .motif-slider-v2 > .wrap.active {
    	margin-bottom: 50px;
	}
    .motif-slider-v2 .js-prev,
    .motif-slider-v2 .js-next {
        bottom: -20px;
    }
    .js-template-slider [data-template] img {
        max-width: 95% !important;
    }
    
    .top-header .ratingbox {
		display: none;
    }
}


@supports (-webkit-touch-callout: none) {
	padding-bottom: 50px;
}