/*
// ----------------------------------------------
// Usage example:
// For IE set $mq-support to false.
// Set the fixed value.
// Then use mixins to test whether styles should be applied.
// ----------------------------------------------

$mq-support: false;
$mq-fixed-value: 1024;

// Renders at fixed value
@include bp (min-width, 300px) {  div { color:#000; }
}

// Doesn't render without MQ support
@include bp (min-width, 1200px) {  div { color:#FFF; }
}

// Doesn't render without MQ support
@include bp (max-width, 300px) {  div { color:#444; }
}

// Renders at fixed value
@include bp (max-width, 1200px) {  div { color:#888; }
}

// ----------------------------------------------
*/
/* Itemslider - based on Owl Carousel  IMPORTANT: Flexslider was replaced by Owl Carousel. Deprecated styles for Flexslider are not needed any more and can be found inside this file: itemslider-old.css */
/* Owl Carousel %%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%% */
/* Necessary styles (Core Owl Carousel CSS File v1.24)
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/
.owl-carousel .owl-item { text-align: center; padding-bottom: 20px !important; }
.owl-carousel .owl-item .item { margin-right: 5%; }
@media only screen and (max-width: 770px) { .owl-carousel .owl-item .item { margin-right: 0; } }
.owl-carousel .owl-item .product-name { height: 40px; }

/* mouse grab icon */
.grabbing { cursor: url(../images/grabbing.png) 8 8, move; }

/* Additional styles for Owl Carousel
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/
/* Preloading images */
.owl-item.loading { min-height: 60px; background: url("../images/opc-ajax-loader.gif") no-repeat center 10px; }
.owl-item.loading .product-image { min-height: 70px; }

/* Pagination */
.owl-pagination { text-align: center; z-index: 1; /* z-index to show above other items */ }

/* Controls */
.owl-theme .owl-controls .owl-buttons { position: absolute; right: 0; top: -40px; }
.owl-theme .owl-controls .owl-buttons div { display: inline-block; float: left; font-family: FontAwesome; font-size: 20px; height: 30px; line-height: 30px; margin: 0 1px; overflow: hidden; padding: 0; text-align: center; text-decoration: none; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; -webkit-transition: opacity 300ms ease-in-out 0s, background-color 300ms ease-in-out 0s, background-position 300ms ease-in-out 0s; -moz-transition: opacity 300ms ease-in-out 0s, background-color 300ms ease-in-out 0s, background-position 300ms ease-in-out 0s; transition: opacity 300ms ease-in-out 0s, background-color 300ms ease-in-out 0s, background-position 300ms ease-in-out 0s; width: 30px; }
.owl-theme .owl-controls .owl-buttons .owl-prev { margin-right: 1px; }
.owl-theme .owl-controls .owl-buttons .owl-prev:before { content: "\f104"; }
.owl-theme .owl-controls .owl-buttons .owl-next:before { content: "\f105"; }

.the-slider .section-title { padding: 0 70px 0 0; }

/** Ultra Slideshow */
/* Slideshow wrapper
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/
.the-slideshow-wrapper:after { display: block; content: "."; clear: both; font-size: 0; line-height: 0; height: 0; overflow: hidden; }

/* Slideshow
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/
.the-slideshow { margin: 0 auto; }
.the-slideshow .slides { display: none; }
.the-slideshow .owl-carousel .owl-item .item { margin: 0; position: relative; }
.the-slideshow .owl-pagination { bottom: 3.5%; display: inline-block; left: 0; position: absolute; right: 0; }
.the-slideshow .owl-theme .owl-controls .owl-buttons { position: static; right: 0; top: 0; }
.the-slideshow .owl-theme .owl-controls .owl-buttons div { background: #fff; color: #333; font-size: 20px; height: 50px; line-height: 50px; opacity: 0; position: absolute; width: 50px; }
.the-slideshow .owl-theme .owl-controls .owl-buttons div:hover { background: #000; color: #fff; }
.the-slideshow .owl-theme .owl-controls .owl-buttons .owl-prev { left: 0; top: calc(50% - 50px); }
.the-slideshow .owl-theme .owl-controls .owl-buttons .owl-next { right: 0; top: calc(50% - 50px); }

.the-slideshow:hover .owl-theme .owl-controls .owl-buttons div { opacity: 1; }

/* Additional effects
%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
*/
.the-slideshow .fade-on-slideshow-hover, .the-slideshow-wrapper .fade-on-slideshow-wrapper-hover { -webkit-transition: opacity 300ms ease-in-out; -moz-transition: opacity 300ms ease-in-out; transition: opacity 300ms ease-in-out; }

.the-slideshow:hover .fade-on-slideshow-hover, .the-slideshow-wrapper:hover .fade-on-slideshow-wrapper-hover { opacity: 0.75; filter: alpha(opacity=75); }

/* puces */
.the-slider .owl-controls .owl-page, .the-slider .owl-pagination .owl-page, .the-slideshow-wrapper .owl-controls .owl-page, .the-slideshow-wrapper .owl-pagination .owl-page { border: 2px solid #bfbfbf; display: inline-block; height: 16px; line-height: 16px; margin-left: 2px; margin-right: 3px; /*padding: 2px;*/ /*vertical-align: middle;*/ position: relative; width: 16px; -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; }
.the-slider .owl-controls .owl-page.active, .the-slider .owl-pagination .owl-page.active, .the-slideshow-wrapper .owl-controls .owl-page.active, .the-slideshow-wrapper .owl-pagination .owl-page.active { cursor: default; }

.the-slider .owl-controls .owl-page, .the-slider .owl-pagination .owl-page, .the-slideshow-wrapper:not(.conseils-slideshow) .owl-controls .owl-page, .the-slideshow-wrapper:not(.conseils-slideshow) .owl-pagination .owl-page {       /*border: 2px solid #bfbfbf; display: inline-block; height: 16px; line-height: 16px; margin-left: 2px; margin-right: 3px; position: relative; width: 16px; @include border-radius(20px);
 &.active { cursor: default; }*/ }
.the-slider .owl-controls .owl-page:hover span, .the-slider .owl-controls .owl-page.active span, .the-slider .owl-pagination .owl-page:hover span, .the-slider .owl-pagination .owl-page.active span, .the-slideshow-wrapper:not(.conseils-slideshow) .owl-controls .owl-page:hover span, .the-slideshow-wrapper:not(.conseils-slideshow) .owl-controls .owl-page.active span, .the-slideshow-wrapper:not(.conseils-slideshow) .owl-pagination .owl-page:hover span, .the-slideshow-wrapper:not(.conseils-slideshow) .owl-pagination .owl-page.active span { background-color: #0061ae; }
.the-slider .owl-controls .owl-page span, .the-slider .owl-pagination .owl-page span, .the-slideshow-wrapper:not(.conseils-slideshow) .owl-controls .owl-page span, .the-slideshow-wrapper:not(.conseils-slideshow) .owl-pagination .owl-page span { background-color: #fff; border: 2px solid #fff; bottom: 0; display: block; height: 12px; left: 0; line-height: 12px; margin: 0; position: absolute; right: 0; top: 0; transition: background-color 300ms ease-in-out 0s; width: 12px; }

.xiwidget { margin-top: 10px; margin-bottom: 10px; overflow: hidden; }

.xiwidgets-grid-table { width: 100%; border: 0; }

.xiwidgets-category-grid:after, .category_above_empty_collection:after, .category_above_collection:after, .category_below_collection:after { content: ""; display: table; clear: both; }

/* Design du widget category grid */
.xiwidgets-category-grid { width: 100%; }
.xiwidgets-category-grid li.item { padding-bottom: 20px; }
.xiwidgets-category-grid .category { position: relative; text-align: center; }
.xiwidgets-category-grid .category a { display: block; }
.xiwidgets-category-grid .image { display: block; }
.xiwidgets-category-grid .label { display: block; font-size: 1.5em; line-height: 1.5em; }

/* Design des widgets templates slider */
.catalogwidget-product-slider, .catalogwidget-categ-product-slider { position: relative; }
.catalogwidget-product-slider .title, .catalogwidget-categ-product-slider .title { border-bottom: 1px solid #555; color: #555; display: block; font-size: 16px; font-weight: bold; margin: 0 0 20px; text-transform: uppercase; }
.catalogwidget-product-slider .slider-previous, .catalogwidget-categ-product-slider .slider-previous { background: url("../images/xi/widgets/arrow_slider.png") no-repeat 0 0; left: 5px; position: absolute; text-indent: -9999px; top: 50%; width: 14px; height: 28px; }
.catalogwidget-product-slider .slider-next, .catalogwidget-categ-product-slider .slider-next { background: url("../images/xi/widgets/arrow_slider.png") no-repeat -16px 0; right: 5px; position: absolute; text-indent: -9999px; top: 50%; width: 14px; height: 28px; }
.catalogwidget-product-slider .slider-wrapper, .catalogwidget-categ-product-slider .slider-wrapper { margin: auto; overflow: hidden; width: 668px; }
.catalogwidget-product-slider ul, .catalogwidget-categ-product-slider ul { width: 9999px; }
.catalogwidget-product-slider ul li, .catalogwidget-categ-product-slider ul li { float: left; padding: 10px; width: 146px; }
