/* ============================================ * * Header * ============================================ */ @include bp(min-width, $bp-medium + 1) { #nav { max-width: $max-content-width; margin: auto; } } /* ============================================ * * Large Viewports - Dropdown Menu * ============================================ */ @include bp(min-width, $bp-medium + 1) { .nav-primary { a.level0 { padding: 0 10px; } .level0.nav-1.first a.level0 { border-left:0; } } } body .promos > li { float: left; margin-right: 2.38095%; width: 31.746%; } body .promos > li { -moz-user-select: none; border: 1px solid #cccccc; list-style: none outside none; margin: 0 0 10px; position: relative; text-align: center; } /* ============================================ * * Tabs * ============================================ */ .product-tabs { background: none repeat scroll 0 0 #f2f2f2; border-bottom: 1px solid #cccccc; margin-bottom: 15px; } .product-tabs li { border-left: 1px solid #fff; border-right: 1px solid #a4a4a4; float: left; line-height: 1.5em; @include bp(max-width, $bp-medium) { border-left: 0; border-right: 0; border-top: 1px solid #ccc; float: none; } } .product-tabs a { color: #444; display: block; padding: 6px 15px; text-decoration: none; } .product-tabs a:hover { background: #007cc3; color: #fff; text-decoration: none; } /* ============================================ * * Titles Collateral Product View * ============================================ */ .box-collateral h2 { margin-bottom: 0px; overflow: hidden; padding-bottom: 3px; } .product-collateral #upsell, .product-collateral #related, .product-collateral #recent { width:100%; clear: both; } .sectiontitle { border-bottom: 5px solid #E9E9E9; margin-bottom:15px; } .sectiontitle h2 { margin: 0px; font-family: $f-stack-special; } /* ============================================ * * Product Vidéos * ============================================ */ .videoWrapper { position: relative; padding-bottom: 56.25%; /* 16:9 */ padding-top: 25px; height: 0; } .videoWrapper object, .videoWrapper embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; max-width: 100%; } /* ============================================ * * Product Documentation * ============================================ */ .product-docs a { text-decoration: none; padding-left: 1%; } .product-docs a::before { content: "\f1c1";font-family: FontAwesome; color: #993333; font-size: 2rem; position: relative; top: 0px; right: 5px; } #product-download li { display: inline; } /* ============================================ * * Product Garantie * ============================================ */ #product-garantie { text-align: justify; } /* ============================================ * * Product Viewed * ============================================ */ .widget.widget-viewed { background: #eeeeee; margin: 0 0 $trim; overflow: hidden; padding: 15px 0; h2 { color: #444444; } /*li { height: 270px; }*/ ul { border-bottom: 1px solid $c-module-border; } } .widget.widget-viewed .button { position: absolute; display: block; bottom: 15px; } .widget.widget-viewed .price-box p { margin: 0; } /* ============================================ * * Product Mostviewed * ============================================ */ .most_viewed { margin: 0 0 $trim; overflow: hidden; padding: 15px 0; ul { border-bottom: 1px solid $c-module-border; } } .most_viewed .button { position: absolute; display: block; bottom: 15px; } .most_viewed .price-box p { margin: 0; } /* ============================================ * * Owl Carousel * ============================================ */ .owl-carousel .owl-item li { margin: 0 1em; } .owl-theme .owl-controls .owl-buttons div { padding: 5px 9px; } .owl-theme .owl-buttons i{ margin-top: 2px; } .owl-theme .owl-controls .owl-buttons div { position: absolute; } .owl-theme .owl-controls .owl-buttons .owl-prev{ left: -30px; top: 20px; } .owl-theme .owl-controls .owl-buttons .owl-next{ right: -45px; top: 20px; } .owl-theme .owl-controls .owl-buttons div { background: none; border-radius: 0; color: #000000; display: inline-block; font-size: 20px; margin: 5px 15px; opacity: 0.5; } /* ============================================ * * Demande Devis * ============================================ */ #addressCheckbox { display: inline-block; } /* ============================================ * * Footer Bottom Links * ============================================ */ #bottom-links { border-top: 1px solid $c-module-border; clear: both; text-align: center; line-height: 40px; padding-top: 5px; a { font-size: $f-size-xs; color: #444444; } } .block-cards { float: right; margin-right: 20px; } /* ============================================ * * Corner Ribbon * ============================================ */ .ribbon { background-color: #a00; overflow: hidden; white-space: nowrap; /* top left corner */ position: absolute; left: -50px; top: 40px; /* for 45 deg rotation */ -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); /* for creating shadow */ -webkit-box-shadow: 0 0 10px #888; -moz-box-shadow: 0 0 10px #888; box-shadow: 0 0 10px #888; } .ribbon h3 { border: 1px solid #faa; color: #fff; display: block; font: bold 100% 'Helvetica Neue', Helvetica, Arial, sans-serif; margin: 1px 0; padding: 10px 50px; text-align: center; text-decoration: none; /* for creating shadow */ text-shadow: 0 0 5px #444; } /* #block-related .price-label, #block-related .save-price, #block-related .old-price, #block-related .save-price { display: none; } */ /* #upsell-product-table .price-label, #upsell-product-table .save-price, #upsell-product-table .old-price, #upsell-product-table .save-price { display: none; } */ .most_viewed .price-label, .most_viewed .old-price, .most_viewed .save-price { display: none; } #block-related .msrp-price, #block-related .special-price, #block-related .our-price, .most_viewed .msrp-price, .most_viewed .special-price, most_viewed .our-price, #upsell-product-table .msrp-price, #upsell-product-table .special-price, #upsell-product-table .our-price { display: inline; } .nous-appeler { border-bottom: 1px solid #007cc3; border-top: 1px solid #007cc3; float: left; margin: 20px 0; padding: 20px 0; width: 100%; &:before { content: "\f095"; font-family: FontAwesome; font-size: 100px; } } .info-appel { float: right; text-align: center; width: 75%; } .info-appel .commandes { font-size: 1.3em; } .info-appel .numerotel { background-color: #eeeeee; font-size: 1.8em; margin: 10px 0; padding: 15px; } .wf-active .oswald { opacity: 1;} .text-info { color: #999999; font-size: 1em; } .info-appel .commandes2 { font-size: 1.3em; margin-top: 30px; } .info-appel .numerotel { background-color: #eeeeee; font-size: 1.8em; margin: 10px 0; padding: 15px; } .wf-active .oswald {     opacity: 1; } .emailus {cursor: default; float: left; width: 100%; } .info-email { color: #333; float: right; font-size: 1.3em; margin-top: 30px; width: 75%; } .formfields { background-color: #eaeaea; float: right; padding: 40px 2.7777%; width: 69.55%; margin: 25px 0; } .contactusBas { border-top: 1px solid #007cc3; font-size: 1em; overflow: hidden; padding-top: 25px; width: 100%; } .nous-ecrire { border-bottom: 1px solid #007cc3; border-top: 1px solid #007cc3; float: left; margin: 20px 0; padding: 20px 0; width: 100%; &:before { content: "\f003"; font-family: FontAwesome; font-size: 100px; } &:before { content: "\f003"; font-family: FontAwesome; font-size: 100px; } } .adresse-postale { float: right; width: 75%; }