@media (max-width: 960px) {
    .wrap-full-grid {
        width: 100%;
    }
    .site-content {
        padding-left: 10px;
        padding-right: 10px;
    }
}

@media (max-width: 750px) {
    .col-xs-12 + .col-xs-12,
    .row + .row {
        margin-top: 30px;
    }
}




/*------------------------------------*\
    # - HEADER
\*------------------------------------*/

@media (max-width: 970px) {
    .header-site .meta-nav,
    .header-contact {
        margin: 0;
    }
    .header-contact {
        background-color: transparent;
        border: medium none;
        padding: 0;
        position: absolute;
        right: 230px;
    }
    .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: block;
    }
    
    #page .site-navi {
        display: none;
    }
    #page .site-navi ul {
        width: 100%;
        display: block !important;
    }
    #page .site-navi li {
        float: none;
        display: block;
        width: 100%;
    }
        .site-navi .sub-menu {
            background-color: #82b338;
            border-radius: 0;
            margin-top: 0;
            padding: 5px;
            max-width: none;
        }
        .site-navi .sub-menu:after {
            border: 0;
            display: none;
        }
        .site-navi .sub-menu li,
        .site-navi li:hover .sub-menu-wrap,
        .site-navi li:hover .sub-menu {
            display: block;
            text-align: left;
        }
        .site-navi .sub-menu li {
            margin-top: 0;
        }
            .site-navi .sub-menu li a {
                font-size: 14px;
            }
        .site-navi .sub-menu-wrap {
            display: block;
            position: static;
            top: 0;
        }
        .site-navi li:hover .sub-menu-wrap {
            top: 0;
            animation: none;
        }
            .site-navi .sub-menu a:hover {
                background-color: #82b338;
                border-radius: 0;
            }
    
    .trustbar img {
        max-width: 100%;
    }
    
    .home-header {
        background-position: 43% 0;
    }
        .home-header .wrap {
            width: 100%;
        }
        .home-header .ratingbox {
            left: 40px;
            top: 280px;
        }
        .home-header .f-left .bubble {
            left: 40px;
            top: 30px;
        }
        .home-header .f-right {
            background-color: rgba(255, 255, 255, 0.9);
            margin-top: 40px;
            padding: 20px;
        }
}

@media (max-width: 768px) {
    .product-header .ratingbox {
        left: 0;
        position: absolute;
        top: 0;
        z-index: 1;
    }
    .product-header .col-xs-12 {
        text-align: center;
    }
    .product-header ul.checks {
        display: inline-block;
        margin: 0 auto;
        text-align: left;
        width: auto;
    }
    .product-header .btn {
        margin: 20px auto 8px;
    }
    .product-header .upload-combi {
        display: none;
    }
    
    .home-header {
        height: 480px;
    }
    .home-header .f-right {
        position: relative;
        z-index: 1;
    }
    
    .pic-switcher.v2,
    .pic-switcher.v2 h2 {
		text-align: center;
    }
    .pic-switcher.v2 .image img {
		position: static;
		top: 0;
		left: 0;
		display: none;
    }
    .pic-switcher.v2 .image img.active {
		display: block;
    }
    .pic-switcher.v2 ul {
		justify-content: center;
    }
}

@media (max-width: 560px) {
    .header-site {
        padding: 5px 15px;
    }
        .header-site .logo img {
            transform: scale(0.8);
            transform-origin: 0;
        }
    .header-site .meta-nav,
    .header-contact,
    .home-header .ratingbox,
    .home-header .bubble,
    .top-header .ratingbox,
    .product-header .ratingbox {
        display: none;
    }
    .product-header .ratingbox {
        transform: scale(0.8);
        transform-origin: 0 0;
    }
    .product-header .col img {
        max-width: 100%;
    }
    .product-header ul.checks li {
        font-size: 5vw;
    }
    .product-header {
		text-align: center;
    }
    
    .home-header .f-right {
        padding-left: 40px;
        position: relative;
        z-index: 2;
    }
    .format-calculator > .row {
		margin-left: 0;
    }
    .info-text img {
		float: none;
		display: block;
		margin: 5px auto;
    }
}





/*------------------------------------*\
    # - CONTENT
\*------------------------------------*/

@media (max-width: 960px) {
    .mobile-hide {
        display: none;
    }
    .hint {
        display: none;
    }
    .breadcrumb {
		display: none;
    }
    .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;
            }
    .three-steps ul li:first-child + li,
    .three-steps ul li:first-child + li + li + li {
        display: none;
    }
    .three-steps ul li:first-child + li + li {
        margin-left: 50px;
        margin-right: 50px;
    }
    
    .arrow-top {
        bottom: 20px;
        display: block;
        padding: 10px;
        right: 20px;
    }
        .arrow-top .icon {
            font-size: 28px;
            line-height: 55px;
        }
        
    .top-footer img {
        position: relative;
        top: 0 !important;
        left: 0 !important;
    }
    #footer .wrap-full-grid {
        padding: 0 10px;
    }
    
    .frame-viewer .left .image img,
    .frame-viewer .right .image img {
        max-width: 100%;
        left: 0;
        position: static;
        margin-top: 120px;
    }
    .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;
    }
    .js-template-slider [data-template] img {
        max-width: 95% !important;
    }
}

@media (max-width: 768px) {
    .row.v-middle {
        display: block;
    }
    .top-header {
        background-size: cover;
        padding-bottom: 40px;
    }
        .top-header h1 {
            margin-top: 40px;
        }
    .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;
        }
    .three-steps ul li {
        display: block;
        margin-top: 40px;
        margin-left: 0;
        margin-right: 0;
    }
    .home-product-boxes .col .wrap p {
        width: 55%;
    }
    .fb-upload .upload-drop,
    .fb-upload .upload-btn + span {
        display: none;
    }
    .upload-step-2 .headline,
    .upload-step-3 .headline {
        font-size: 20px;
    }
    .upload-step-2 form label {
        display: block;
    }
    .upload-step-2 form input {
        width: 100%;
    }
    .upload-step-2 .col-xs-12,
    .upload-step-3 .col-xs-12 {
        margin-top: 0;
    }
    .upload-step-2 .col:first-child,
    .upload-step-3 .col-xs-12 {
        text-align: center;
    }
    
    .tabify-wrapper .navi li {
        font-size: 12px;
        width: auto;
    }
    
    .special-ideas .product-header .text-wrap {
        margin-top: 0;
    }
    .special-ideas .product-header ul.checks {
        margin-bottom: 20px;
    }
    .special-ideas .product-header .btn {
        margin-top: 0;
    }
    .special-ideas .col img {
        display: block;
        max-width: 100%;
        margin: 0 auto !important;
    }
    
    .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;
        }
        
	.delivery-tracking{}
		.delivery-tracking td:first-child:before {
			/*content: attr(data-label);*/
		}
		.delivery-tracking td,
		.delivery-tracking tr.finished td {
			display: block;
			padding: 5px;
		}
		.delivery-tracking tr {
			display: block;
			border-bottom: 1px solid #ddd;
			padding: 10px 0;
		}
		.delivery-tracking td:first-child {
			padding-bottom: 0;
		}
		.delivery-tracking td:first-child + td {
			padding-top: 0;
		}
	.slider-wrap label {
		display: none;
	}
}

@media (max-width: 600px) {
    .home-product-boxes .col .wrap {
        margin-bottom: 0;
    }
    .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;
            }
    
    .price-table table.active,
    .price-table thead, 
    .price-table tbody, 
    .price-table th, 
    .price-table td, 
    .price-table tr,
    .delivery-table table,
    .delivery-table thead, 
    .delivery-table tbody, 
    .delivery-table th, 
    .delivery-table td, 
    .delivery-table tr {
        display: block;
        overflow: hidden;
    }
    .price-table thead tr,
    .delivery-table thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }
    .price-table table[data-id="overview"] tr:nth-child(odd),
    .delivery-table tr:nth-child(odd) {
        background-color: #e9e9e9;
    }
    .price-table tr:nth-child(4n+1) {
        background-color: #e9e9e9;
    }
    .price-table td,
    .delivery-table td {
        border: 0 !important;
        padding: 0.25em 0.5em !important;
        text-align: left;
        width: auto !important;
    }
    .price-table td:before,
    .delivery-table td:before {
        content: attr(data-label)": ";
        display: inline-block;
        font-weight: bold;
        width: 5em;
    }
    .delivery-table td:before {
        width: 11em;
    }
    .price-table td:first-child:before,
    .delivery-table td:first-child:before,
    .price-table td:first-child + td + td + td + td:before {
        content: none;
        display: inline-block;
        font-weight: bold;
        width: auto;
    }
    .price-table td:first-child,
    .delivery-table td:first-child {
        padding-top: 0.8em !important;
        text-align: left;
    }
    .price-table td:first-child + td + td + td + td,
    .delivery-table td:first-child + td + td + td + td {
        padding-bottom: 0.8em !important;
    }
    .price-table td:last-child {
        display: none;
    }
    .price-table tr:hover td,
    .delivery-table tr:hover td {
        background-color: transparent;
    }
    
    .info-text .wrap {
        -webkit-column-count: 1;
        -moz-column-count: 1;
        column-count: 1;
    }
    
    .info-text-v2 .wrap {
    	-webkit-column-count: 1;
        -moz-column-count: 1;
		column-count: 1;
    }
}

@media (max-width: 500px) {
    .top-header .btn-large {
        font-size: 21px;
    }
    .pic-switcher ul {
        display: block;
    }
    .link-box ul {
        display: block;
        text-align: center;
    }
    .link-box ul + ul {
        margin-left: 0;
    }
}