/*
 * (C)opyright Solocal Group 2014-2015
 *
 * This is Solocal Group proprietary source code.
 * Any reproduction modification or use without prior written
 * approval from Solocal Group is strictly forbidden.
 *
 */

/* components design */



/*********************************/
/*common*/
/*********************************/
.pdf{background: url("../img/pdf.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);display: block;line-height: 16px;margin-bottom: 5px;min-height: 16px;padding-left: 20px}

/*********************************/
/*logo*/
/*********************************/
.logo {height:125px;display:table-cell;vertical-align:middle;padding: 10px 40px 10px 0;}
.logo .logo_image_container{display:inline-block}
.logo .logo_image{max-width:inherit}

/*********************************/
/*site title*/
/*********************************/
.site_title{font-size: 26px;font-weight: normal;height:125px;display:table-cell;vertical-align:middle;line-height: 32px;}
.site_title .title{font-size: 26px;font-weight: normal;padding-bottom:0;margin-bottom:0;display:block}

/*********************************/
/*nav area*/
/*********************************/
.nav-area {display: table-cell; position:relative; padding: 0 0 25px 10px; white-space: nowrap;text-align: right;width:1px}
/*.nav-area :first-child{margin-left: 10px;}*/
.nav-area .component.cart.basket_button_view,
.nav-area .menu-toggle { display: inline-block; }

/* reserved space for the languages + avoid the title sticking to the borders */
.site_title {padding: 25px 0;}



/*********************************/
/*language menu*/
/*********************************/
.languages{height: 20px;line-height: 20px;position: absolute;right: 0;bottom: 10px}
.languages .item-container{list-style-type:none;padding:0;margin:0;white-space: nowrap;}
.languages .item-container .item{display:inline-block;width:20px;/*color:#153e4b; Not sure about that*/text-transform:uppercase}
.languages .item-container .item a{/*color:#153e4b; Not sure about that*/padding: 0 3px;font-weight:bold;font-size:13px;width:20px;text-decoration:none}
.languages .item-container .item.active a, .languages .item-container .item a:hover{font-weight:normal}
.languages .item-container .item.active a:hover{text-decoration:none}

/*********************************/
/*cart menu*/
/*********************************/
.component.cart.basket_button_view {background-color: #f6f6f6;color: #666666;cursor: pointer;display: inline-block;font-size: 14px;padding: 8px}
.component.cart.basket_button_view {vertical-align: top;}
.component.cart.basket_button_view .show-basket{color: #797979;text-decoration: none;white-space: nowrap;}
.component.cart.basket_button_view .show-basket:before{display:inline-block;font-family: 'icomoon-ecommerce';content: "\e60d";color: #797979;font-size: 20px;font-style: normal;font-variant: normal;font-weight: normal;line-height: 1;vertical-align: top; padding-right: 8px;text-transform: none}

/*********************************/
/*menu*/
/*********************************/
/*.menu-toggle{display:none;width:42px;height:42px;cursor:pointer;position:absolute;top:6px;right:20px;z-index:200;
    background:linear-gradient(#BDC0B7, #BDC0B7) no-repeat border-box, linear-gradient(#BDC0B7, #BDC0B7) no-repeat border-box, linear-gradient(#BDC0B7, #BDC0B7) no-repeat border-box, #d8d8d8;
    background-size:68% 6px, 68% 6px, 68% 6px, 100%;
    background-position:center 26%, center center, center 75%, 0 0;
}*/

.menu-toggle{display:none;}

.mobile-menu.mobile-off{display:none !important;}

/* Start with sub menus collapsed */
.component.main-menu.desktop-menu .item-container .item .item-container {
    margin: 0;
    overflow: hidden;
    /*
     * There's a trick here to implement the slide up / slide down animation in CSS
     * We would like to animate the height. However, we can't because a 'auto' height
     * is not a valid value for animation. It's also hard to set the height via Javascript
     * because of the responsive constraints. So we animate the max-height instead with an
     * arbitrary large height: it should be higher than the maximum expected height of the
     * sub-menu. But note that it has an impact on the timing: the timing is relative to the
     * max-height set, not the real height of the content.
     */
    transition: max-height 1.5s linear;
    max-height: 0;
}

.component.main-menu.desktop-menu .item-container .item.opened .item-container,
.component.main-menu.desktop-menu.vertical-menu .item-container .item.active .item-container{
    max-height: 1000px;
}


.component.main-menu .item-container a{display: block;font-size: 16px;line-height: 25px;padding: 5px 0;text-decoration: none;font-weight: normal; word-wrap:break-word;}
.main-menu .item-container{list-style-type:none;padding:0;}

.sub-menu .item-container{display: block;background-color: #ececec;border: 0 4px solid #ececec;border-radius: 4px;margin-left: 0;margin-bottom: 30px;padding: 4px 0;list-style: none outside none}
.sub-menu  .item{background-color: #ececec;padding: 8px 17px;font-size:18px}
.sub-menu  .item a{color:black}
.component.sub-menu .item-container .item:hover a, .component.sub-menu .item-container .item.active a{color:#BDC0B7}
.sub-menu  .item a:hover {text-decoration:none}


/*********************************/
/*photos*/
/*********************************/
.component.photos.gallery_view .gallery-nav-before{display:block}
.component.photos.gallery_view .gallery-nav-after{display:none}
.component.photos.gallery_short_view .gallery-photos .photo .image {
    background-color: #EBEBEB;
}

@media screen and (max-width:480px){
    .component.photos.gallery_view .gallery-nav-after{display:block}
    .component.photos.gallery_view .gallery-nav-before{display:none}
}

@media  screen and (max-width:768px) {
    .component.photos.slideshow_view .slideshow-photos {
        font-size: 0.8em;
    }
    .component.main-menu .item-container a {padding: 5px 0 5px 10px}
}


/*********************************/
/*slider*/
/*********************************/
.component.slider.slider_b>.item-container>.item .content,
.component.slider.slider_c>.item-container>.item .content {
    background-color: #153e4b;
    border-color: #153e4b;
}

/* line-height: 28px except for T003 */
.component.slider > .item-container > .item .content .title {font-size: 22px;font-weight: normal; line-height: 28px;}
.component.slider > .item-container > .item .content .text {font-size:13px}

@media screen and (max-width:768px){
    .component.slider > .item-container > .item .content .title{font-size:18px}
}


/*********************************/
/*catalog icons*/
/*********************************/
.icon_on_nav .nav-element.nav-previous:before, .icon_on_nav .nav-element.nav-next:after {
    font-family: 'icomoon-ecommerce';
    clear: left;
    speak: none;
    font-size: 18px;
    font-style: normal;
    font-weight:normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /* margin-top: 2px; Seems to break vertical alignment */
    text-decoration:none;
    vertical-align:middle;
    color: #BDC0B7
}
.icon_on_nav .nav-element:hover{text-decoration: none}
.icon_on_nav .nav-element:focus{outline:0}
.icon_on_nav .nav-element.nav-previous:before {content: "\e613";padding-right: 10px}
.icon_on_nav .nav-element.nav-next:after {content: "\e607";padding-left: 10px}

/*********************************/
/*catalog products*/
/*********************************/
.component.catalog.back_view,
.component.catalog_product.back_view {position:absolute;top:-30px;font-size: 16px}

/* Override template default color for arrows, with a gray */
.component.catalog.back_view .nav-previous,
.component.catalog_product.back_view .nav-previous,
.component.catalog.back_view .nav-previous:before,
.component.catalog_product.back_view .nav-previous:before {color:#666}


.catalog-controls {border-bottom: 1px solid #ececec;display: block;padding-bottom: 5px;display:table;width:100%;margin-bottom:40px}
.catalog-controls .control-item {display:table-cell}
.catalog-controls .control-item .title{color: black;display:inline-block;font-size: 12px;font-weight: bold;margin: 0;padding: 11px 9px 11px 0;width: auto;text-transform:none}
.catalog-controls .control-item.component.catalog.sort_view{padding-right: 30px}
.catalog-controls .control-item.component.catalog.filter_view{padding-right: 25px}
.catalog-controls .control-item.component.catalog.display_mode_view{padding-right:0;}
.catalog-controls .control-item .custom-select {float: inherit; vertical-align: middle}


.catalog-controls .control-item .sorting-form,
.catalog-controls .control-item .filter-form {display: inline-block;}

.component.catalog.display_mode_view .buttons-grp{display: inline-block;white-space: nowrap; vertical-align: middle}

.component.catalog.display_mode_view a.display-grid,
.component.catalog.display_mode_view a.display-list {display: inline-block;width: 38px;height: 38px;padding: 0;margin: 0;border: 1px solid #ececec;outline: 0;background-color: #FFF;vertical-align:middle}
.component.catalog.display_mode_view a.display-grid.active,
.component.catalog.display_mode_view a.display-list.active {background-color: #d0d0d0}
.component.catalog.display_mode_view a.display-list {background-image: url(../img/icon-list.png)}
.component.catalog.display_mode_view a.display-grid {background-image: url(../img/icon-thumbnail.png)}

.component.catalog > .description {padding:0px 0 20px}
.component.catalog > .description p {margin: 0}

.component.catalog .products_list  {padding:0;margin:0;list-style-type:none;}
.component.catalog .products_list.grid-view {margin-right:-17px}
.component.catalog .products_list.grid-view .product_item{display:inline-block;margin:0 16px 8px 0;width: 220px;height: 330px;max-height: 330px;overflow: hidden;vertical-align:top}

.component.catalog .products_list.list-view .product_item{display:block;margin:0 0 8px 0;width: 100%;height: 120px;}


.component.catalog_product.title_view{display:table-cell;width:100%}
.component.catalog_product.title_view .title{margin:0}
.component.catalog_product.reference_view{clear:both;padding-top:10px}


/*product item view*/
.component.catalog_product.pagination_view {display:table-cell;white-space:nowrap}
.component.catalog_product.pagination_view .nav-name {padding: 0 20px;font-size:16px;color: #CdCdCd}


/* BEWARE: this view is not for a Socrea component but an internal component */
.internal_component.catalog_product.short_view {border: 1px solid #ececec;cursor: pointer; width:100%;height:100%;background-color: white;text-align: left;position:relative;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box; padding-bottom: 37px; }
.list-view .internal_component.catalog_product.short_view {padding-bottom: 0;}  /* no need to reserve space for the prices anymore */
.internal_component.catalog_product.short_view .product_visual_link {display: inline;}
.internal_component.catalog_product.short_view .product_visual {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;padding: 10px; margin: 0;width: 100%}
.list-view .internal_component.catalog_product.short_view .product_visual {margin: 0;padding: 10px;width: auto;height: 100%;max-height: 100%;float: left}

/* The product label should take as much space as possible, with a minimum of 2
 * lines when the space is constrained (i.e. in the catalog_highlights) */
.internal_component.catalog_product.short_view .product-label {margin: 5px 10px 0;font-size: 16px;line-height: 1.4;padding: 0;overflow:hidden;}
.list-view .internal_component.catalog_product.short_view .product-label {margin: 20px 10px 5px 120px;position: relative; height:calc(100% - 55px);}
.internal_component.catalog_product.short_view .product-label {min-height: 2.8em;}
@media  screen and (min-width:768px){
    .component.catalog_highlights .internal_component.catalog_product.short_view .product-label {max-height: 2.8em;}
}

/* The prices should take at most 1 line and be placed at the bottom of the item.
 * A space is reserved somewhere at the bottom via a bottom padding, either in the
 * parent or in the product-label depending on the display (grid vs list)
 */
.internal_component.catalog_product.short_view .prices {
    position: absolute;
    bottom: 0;
    display: block;
    margin: 10px;
    width: calc(100% - 20px);  /* minus margins */
    height: 1em;  /* 1-line height */
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}


/* TODO: adapt */
/*
.component.catalog_highlights.default_view .product-label{max-height:40px}
@media  screen and (max-width:768px){
    .component.catalog_highlights.default_view .product-label{max-height: 97px;}
}
*/

/*
.component.catalog_highlights.default_view .product-label {line-height: 1.2;overflow: hidden;}

@media  screen and (max-width:768px){
    .component.catalog_highlights.default_view.short-slider .product-slider .item {min-height: 350px;}
    .component.catalog_highlights.default_view.short-slider .catalog_product.short_view {min-height: 350px;}
}
*/


.internal_component.catalog_product.short_view .flag {position: absolute;top:2px;right:2px;height:90px;width:90px;overflow:hidden;}
.internal_component.catalog_product.short_view .flag .flag-label {position: absolute; bottom:0; width:100%; padding:0; color: white; font-weight: bold; font-size: 12px; text-transform: uppercase; margin:0;}
.internal_component.catalog_product.short_view .flag .promo,
.internal_component.catalog_product.short_view .percent {background: #f53547;height: 90px;width: 90px;left: 45px;top: -45px;position: absolute;text-align: center;-ms-transform: rotate(45deg);-moz-transform: rotate(45deg);-webkit-transform: rotate(45deg);-o-transform: rotate(45deg);}
.internal_component.catalog_product.short_view .flag .sale {background: #a02b9d; height:90px; width:90px; left: 45px; top: -45px; position: absolute; text-align: center; -ms-transform: rotate(45deg); -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); -o-transform: rotate(45deg);}
.internal_component.catalog_product.short_view .flag .new {background: #691567;height:90px;width:90px; left: 45px;top: -45px;position: absolute;text-align: center;-ms-transform: rotate(45deg);-moz-transform: rotate(45deg);-webkit-transform: rotate(45deg);-o-transform: rotate(45deg);}
.internal_component.catalog_product.short_view .flag .promo-campaign {background: #8AB860;height:90px;width:90px; left: 45px;top: -45px;position: absolute;text-align: center;-ms-transform: rotate(45deg);-moz-transform: rotate(45deg);-webkit-transform: rotate(45deg);-o-transform: rotate(45deg);}

.component.product-detail .flag {position: absolute;top:2px;right:2px;height:90px;width:90px;overflow:hidden;}
.component.product-detail .flag .flag-label {position: absolute; bottom:0; width:100%; padding:0; color: white; font-weight: bold; font-size: 12px; text-transform: uppercase; margin:0;}
.component.product-detail .flag .promo,
.component.product-detail .percent {background: #f53547;height: 90px;width: 90px;left: 45px;top: -45px;position: absolute;text-align: center;-ms-transform: rotate(45deg);-moz-transform: rotate(45deg);-webkit-transform: rotate(45deg);-o-transform: rotate(45deg);}
.component.product-detail .flag .sale {background: #a02b9d; height:90px; width:90px; left: 45px; top: -45px; position: absolute; text-align: center; -ms-transform: rotate(45deg); -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); -o-transform: rotate(45deg);}
.component.product-detail .flag .new {background: #691567;height:90px;width:90px; left: 45px;top: -45px;position: absolute;text-align: center;-ms-transform: rotate(45deg);-moz-transform: rotate(45deg);-webkit-transform: rotate(45deg);-o-transform: rotate(45deg);}
.component.product-detail .flag .promo-campaign {background: #8AB860;height:90px;width:90px; left: 45px;top: -45px;position: absolute;text-align: center;-ms-transform: rotate(45deg);-moz-transform: rotate(45deg);-webkit-transform: rotate(45deg);-o-transform: rotate(45deg);}


/*product detail view*/
.component.product-detail{border-top: 1px solid #ececec;margin-top:20px;padding-top:20px}
/* FIXME: Not really responsive */
/*.horizontal_layout.product-detail {display: table; width:100%;}*/
.horizontal_layout.product-detail > .item-container > .item {padding-right: 35px}
.horizontal_layout.product-detail > .item-container > .item-last {padding-right: 0;padding-left:8%}

@media screen and (max-width: 768px) {
    .horizontal_layout.product-detail > .item-container > .item {padding-right: 0px}
}

.horizontal_layout.product-detail .title {font-weight:bold; margin-bottom: 10px;}


.component.catalog_product .product-detail-thumb {max-width: 100%;}
.component.catalog_product .product-detail-thumb .main-image {display:inline-block;max-width: 100%; border: 1px solid #ececec;padding: 0;margin-bottom: 3%;position:relative;}
.component.catalog_product .product-detail-thumb .product-image {max-width: 100%;}
.component.catalog_product .product-detail-thumb .thumb-box {max-width: calc(100% + 5px);/*display:inline-block;*/margin-left:-5px; overflow:hidden;}

.component.catalog_product .product-detail-thumb .thumb {width: 25%;float:left;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;padding-left: 5px; margin-bottom: 25px}
.thumb-zoom {background-color: #FFF;border-radius: 10px;box-shadow: 0 3px 5px rgba(0, 0, 0, 0.5);padding: 10px;width: 560px;height: 560px;position: absolute;margin-bottom: 5px;max-width: none;max-height: none;z-index: 9999;}
/*
.component.catalog_product .product-detail-thumb .thumb {width: 22%;margin-right: 3%;margin-bottom: 25px}
.component.catalog_product .product-detail-thumb .thumb:nth-of-type(4n) {margin-right: 0}
*/

.component.catalog_product.brochure_view .terms .pdf {color: #000;}
.component.catalog_product.brochure_view .terms{margin-bottom:20px}
.component.catalog_product.brochure_view .terms.uploaded_pdf_box {border-top: 1px solid #ececec;border-bottom: 1px solid #ececec;padding-top: 20px}
.component.catalog_product.brochure_view .terms.uploaded_pdf_box .pdf {font-size:14px;font-weight: normal}


.component.catalog_product.description_view .description {margin-bottom: 20px}
.component.catalog_product.description_view .description p {margin: 0 0 20px 0}
.component.catalog_product.description_view .description ul {margin-bottom: 20px}

.component.catalog_product.options_view .listing_options {padding-bottom: 5px;display: block}
.component.catalog_product.options_view .listing_options .label {padding-right: 9px;margin: 12px 0 0 0;width: auto;display: inline-block;min-width: 120px}
.component.catalog_product.options_view .field {padding-bottom: 15px;}
.component.catalog_product.options_view .field:after {clear:both; display:block; content:"";}
.component.catalog_product.options_view .field.error .label {color: #ff0000;}

.horizontal_layout.product-share-links-desktop {list-style-type:none;padding:0;font-size:0}
.horizontal_layout.product-share-links-desktop .item-container > .item {width:auto;margin: 2px 5px 0px 0px;}
.horizontal_layout.product-share-links-desktop li a {display: inline-block;height: 16px;width: 16px; text-indent: -9999px;position:relative;text-decoration: none;}
.horizontal_layout.product-share-links-desktop .fb {background:url("../img/symboles.png") no-repeat scroll -65px 0}
.horizontal_layout.product-share-links-desktop .tweet {background:url("../img/symboles.png") no-repeat scroll -85px 0}
.horizontal_layout.product-share-links-desktop .share-by-email {background:url("../img/symboles.png") no-repeat scroll -105px 0}
.horizontal_layout.product-share-links-desktop .print:before {color: #666666;content: "";font-family: "icomoon_catalog";font-size: 16px;line-height: 1;margin: 0;position:absolute;left:0;top:0;text-indent:0;}

.component.catalog_product.promotion_view .promotion {margin: 15px 0px; color: #BDC0B7;font-weight: bold;font-size: 14px; font-family: "muli"}
.component.catalog_product.price_view .prices .regular-price {color: #999;text-decoration: line-through; background-color: white;font-weight: normal;}
.component.catalog_product.price_view .prices {border-top: 1px solid #ececec;border-bottom: 1px solid #ececec;padding: 13px 0;width: 100%; margin-bottom: 20px}
.component.catalog_product.price_view .prices .price {position: relative;float:right;line-height: 15px;font-size: 24px}
.component.catalog_product.price_view .prices .price-item {margin-bottom: 10px}
.component.catalog_product.price_view .price {font-weight: bold;float:right;}

/* A REVOIR */
.component .short.prices {font-size: 17px; line-height: 1em;}
.component .short.prices .regular-price {color: #999;text-decoration: line-through; background-color: white;font-weight: normal;}
.component .short.prices .price-item {display: inline;}
.component .short.prices .price {font-weight: bold;}
.component.catalog .prices.short .price.regular-price {margin-right:10px;}
.list-view .internal_component.catalog_product.short_view .prices.short {left: 108px;}

.component.catalog_product.ecommerce_view .add-to-basket {display: inline-block;padding: 10px;font-size: 22px;line-height: 22px;border: 0;color: #000000;text-align: center;width:100%}

/* pagination */
.component.catalog.pagination_view {border-top: 1px solid #ececec;margin-top: 30px;text-align: center;}
.component.catalog.pagination_view .pagination-elements {position: relative;margin-top: 30px;text-align: center;display: inline-block;padding: 0 1.2em}
.component.catalog.pagination_view .pagination-elements .pagination-items {display: inline-block;margin: 0 auto;padding:0 25px}
.component.catalog.pagination_view .pagination-elements .pagination-items .pagination-item{list-style: none;padding: 0;display: inline-block;vertical-align: middle;margin: 0 .5em;}
.component.catalog.pagination_view .pagination-elements .pagination-btn.prev {position: absolute;top: 3px;left: 0;}
.component.catalog.pagination_view .pagination-elements .pagination-btn.next {position: absolute;top: 3px;right: 0;}
.component.catalog.pagination_view .pagination-elements .pagination-item .number {font-weight: bold;font-size: 12px;}
.component.catalog.pagination_view .pagination-elements .pagination-item .number{color: #000;}
.component.catalog.pagination_view .pagination-elements .pagination-item .number.active {font-size: 16px;color: #cccccc;}

/* terms of sales block */
.component.catalog_terms_of_sale.title_view .title {word-wrap: break-word;}
.component.catalog_terms_of_sale .brochure.pdf {color: #000;font-weight: bold;line-height: 1.2;}
.component.catalog_terms_of_sale.description_view .description{padding: 10px 0;}

/*********************************/
/*dropdown*/
/*********************************/
.custom-select,
.custom-select ul {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;width: 165px;background: #fff;border: 1px solid #ececec}
.custom-select {position: relative;display: inline-block;padding: 11px 25px 11px 8px;cursor: pointer;outline: none;float:right}
.custom-select ul {position: absolute;top: 100%;left: -1px;list-style: none;border-top: 0;margin: 0;padding: 0 8px 11px 8px;z-index: 999;overflow: auto;}
.custom-select .sorting-title {font-size: 12px;font-weight: normal;margin: 0;padding: 0;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;display: block;max-width: 100%;}
.custom-select .sorting-title:after {font-family: 'icomoon-ecommerce';font-size: 26px;line-height: 1;speak: none;font-style: normal;font-weight: normal;font-variant: normal;text-transform: none;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;content: "\e60a";color: #cccccc;position: absolute;right: 8px;top: 6px}
.custom-select .option-list {display: none;}
.custom-select .option-list .grouptitle {border-top: 1px solid #CCCCCC; color: #000000; font-weight: bold; margin-top: 5px; padding-top: 5px;}
.custom-select.unfolded .option-list{display: block;z-index: 1;}
.field.error .custom-select, .custom-select.error {border-color: #ff0000;}
.field.error .custom-select .nagare-error-field {display: none} /* needs to hide the custom error form field on catalog product page*/
/*********************************/
/*blocks*/
/*********************************/
.blocks{margin-bottom:40px;overflow:hidden}
.blocks .title{font-size: 18px;font-weight:normal;margin: 0 0 15px;padding: 0;line-height: 25px;color: #153e4b}
.blocks .subtitle{/*font-family: inherit !important;*/font-size: 14px;font-weight: bold;line-height: 17px;margin: 0 0 13px; padding: 0; position: relative}
.blocks .more-info{display: block;position: absolute;bottom:0;z-index: 10}
.blocks .break_at_tablet .more-info{position: inherit;}
.horizontal_layout.blocks > .item-container{display:table; width:100%;table-layout:fixed}
.horizontal_layout.blocks > .item-container > .item{min-height:310px;display:table-cell;border-left: 1px solid #2A7B96;padding: 0 20px;position:relative;float:none;word-wrap:break-word}
/*.horizontal_layout.blocks > .item-container.slots-3 > .item-last{width:34%;}*/

/* blocks heights (scrollable contents) remove glitch effect*/
.blocks .component.presentation .short-text,
.blocks .component.practical_info .practical_info_contents,
.blocks .component.news .news-content,
.blocks .component.activity .short-text,
.blocks .component.mba .mba-offers,
.blocks .component.mba .mba-offers .offer { height: 192px; overflow: auto}
/* 360, videos, photos, mba ? */

.blocks .custom-scrollbar {margin-bottom: 20px;}

/*********************************/
/* richtext */
/*********************************/
.richtext table, .richtext table th, .richtext table td {
    border-color: #2A7B96;
}
.richtext table[border="1"] td, .richtext table[border="1"] th,
.richtext table[border="2"] td, .richtext table[border="2"] th,
.richtext table[border="3"] td, .richtext table[border="3"] th,
.richtext table[border="4"] td, .richtext table[border="4"] th,
.richtext table[border="5"] td, .richtext table[border="5"] th,
.richtext table[border="6"] td, .richtext table[border="6"] th { padding: 3px;}
.richtext table[border="1"], .richtext table[border="2"],
.richtext table[border="3"], .richtext table[border="4"],
.richtext table[border="5"], .richtext table[border="6"] {border-collapse: collapse;}

.richtext table[border="1"] li:before,
.richtext table[border="2"] li:before,
.richtext table[border="3"] li:before,
.richtext table[border="4"] li:before,
.richtext table[border="5"] li:before,
.richtext table[border="6"] li:before{margin-left: 0px;}


/*********************************/
/*brochure*/
/*********************************/
.brochures .title{font-size: 18px;font-weight:normal;line-height: 18px;margin: 0 0 15px;padding: 0}
/*.brochures .pdf{background: url("../img/pdf.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);display: block;line-height: 16px;margin-bottom: 5px;min-height: 16px;padding-left: 20px}*/

/*********************************/
/*links*/
/*********************************/
.links .title{font-size: 18px;font-weight:normal;line-height: 18px;margin: 0 0 15px;padding: 0}

/*********************************/
/*box*/
/*********************************/
.box .title{font-size: 18px;font-weight:normal;line-height: 18px;margin: 0 0 15px;padding: 0}

/*********************************/
/*point of sale*/
/*********************************/
/*.point_of_sale .title{font-size: 18px;font-weight:normal;margin: 0 0 15px}*/
.contact-page #main-content>section .point_of_sale .component.schedule .opening_hours,
.contact-page #main-content>section .point_of_sale .component.schedule .closing_periods{padding-left:0; margin-bottom:15px;}
.contact-page #main-content>section .point_of_sale .component.schedule .opening_hours:before{display:none}
aside .component.schedule .title, .home-page .component.schedule .title{display:none}
.contact-page #main-content>section .point_of_sale .component.schedule .richtext{padding-left:0}
.contact-page .component.contact.list_view .email{word-wrap: break-word}

/*********************************/
/* selector */
/*********************************/
.point_of_sale_selector .selector{margin: 0 0 20px 0;border: 1px solid #d8d8d8;}


/*********************************/
/*captcha*/
/*********************************/
.captcha .captcha-text{font-weight:bold;margin:25px 0 10px 0}
.captcha .captcha-image {height: 40px;width: 145px}


/* Forms */
.nagare-error-field,
.nagare-error-input {display: inline-block}
.nagare-error-message {display: none}
form .field.error label {color: red}
.nagare-error-field .nagare-error-input input,
.nagare-error-field .nagare-error-input select,
.nagare-error-field .nagare-error-input textarea,
form .field.error input,
form .field.error select,
form .field.error textarea {border-color: red}


/*********************************/
/*contact form*/
/*********************************/
.contact-page section .component.title_view .title{font-size:26px}
.contact-page .print{background: url("../img/no-repeat-nocolor.png") no-repeat scroll -335px -152px rgba(0, 0, 0, 0);display: block;position:absolute;top:0;right:10px;height:35px;width:35px}
.contact-page .contact_layout{margin-bottom:15px}
.contact-page .contact_layout>.slots-2>.item-1{width:35%;padding-right:20px}
.contact-page .contact_layout>.slots-2>.item-2{width:65%}
.contact-page .contact_infos{font-size:13px}
.contact-page .contact_infos .component.address .name{font-weight:bold;padding-bottom:20px}
.contact-page .contact_infos .component.contact .item {margin-bottom:15px}
.contact-page .contact_infos .component.contact .item-1 .contact-element .label {display: none}
.contact-page .contact_infos .component.contact .item-2 {border-top:1px solid #ccc;padding-top:15px}

/* TODO : Create remove icon view*/
.contact-page .contact_infos .component.address:before,
.contact-page .contact_infos .component.booking:before{display:none}
.contact-page .contact_infos .component.address,
.contact-page .contact_infos .component.booking{padding-left:0;margin-bottom:0}

/***********************************/

.contact-page .contact_infos .component.booking {padding-top:20px}
.contact-page .contact_infos .component.booking .booking-button{padding:0 10px; font-size:14px;}

.contact_form.default_view form{position:relative}
.component.contact_form_view .title{font:bold 13px arial;color:inherit;margin-bottom:10px}

.contact_form.default_view input[type="text"],
.contact_form.default_view select,
.contact_form.default_view textarea{background-color: #ffffff;color: #666666;border: 1px solid #d8d8d8;line-height: 15px;padding: 5px}
.contact_form.default_view input[type="text"],
.contact_form.default_view select {height: 27px}
.contact_form.default_view textarea {height: 70px; overflow: auto; resize:none}
.contact_form.default_view input[type="text"],
.contact_form.default_view select,
.contact_form.default_view textarea,
.contact_form.default_view .nagare-error-field,
.contact_form.default_view .nagare-error-input {display: inline-block; width: 100%}
.contact_form.default_view .nagare-error-input input[type="text"] {border-color: red;}

/* Form formatting service */
.contact_form_error,
.contact_form_success {margin-bottom:10px}

.contact_form.default_view .field {overflow:hidden;}
.contact_form.default_view .field .field_label,
.contact_form.default_view .field .field_value {margin: 0 0 10px 0;}
.contact_form.default_view .field .field_label,
.contact_form.default_view .captcha.field .captcha-label{display:inline-block;float:left;width: 32%}
.contact_form.default_view .field .field_label{word-wrap: break-word}
.contact_form.default_view .field .field_label + .field_value,
.contact_form.default_view .captcha.field .captcha-input {display:inline-block;float:right;width:65%}
.contact_form.default_view .captcha.field .captcha-label {width: 145px; margin-top:0px}
.contact_form.default_view .captcha.field .captcha-input {width: calc(100% - 170px)}

.contact_form.default_view .captcha.field .nagare-error-field {width: calc(100% - 170px)}
.contact_form.default_view .captcha.field .nagare-error-field input {width: 100%;}

.contact_form.default_view .validation{padding-top:25px;clear:both}
.contact_form.default_view .send-copy.field {margin-left:35%;clear:both}
.contact_form.default_view .send-copy.field .field_label{margin-left:10px;float:none; width: auto}

.contact_form.default_view .mandatory-message{margin-bottom:10px;}
.contact_form.default_view .actions{padding:13px 0 0}
.contact_form.default_view .actions .button {cursor:pointer;background-color: #BDC0B7;color: #ffffff;border: 0;display: inline-block;text-align: center;border-radius: 2px;font-size: 16px;font-weight: bold;height: 30px;line-height: 30px;padding: 0 20px;text-decoration: none}
.contact_form.default_view .actions .button:hover{background-color:#153e4b}

/*********************************/
/*practical information*/
/*********************************/
.component.practical_info .component.address.default_view,
.component.practical_info .component.address.short_view,
.component.practical_info .component.address.long_view,
.component.practical_info .component.booking.default_view,
.component.practical_info .component.contact.label_view .label,
.component.practical_info .component.contact.phone_view .phone,
.component.practical_info .component.contact.fax_view .fax,
.component.practical_info .component.contact.mobile_view .mobile,
.component.practical_info .component.contact.email_view .email,
.component.practical_info .component.contact.email_label_view .email,
.component.practical_info .component.contact.url_view .url,
.component.practical_info .component.schedule .opening_hours,
.component.practical_info .component.schedule .closing_periods,
.component.practical_info .component.schedule .richtext {
    padding-left: 25px;
}
.component .practical_info.default_view .multiple-mode { font-size: 15px; }
.component .practical_info.default_view .multiple-mode .street_address_lines_short { font-size: 13px; }
.component .practical_info.default_view .multiple-mode .component.contact.phone_view .phone { font-size: 15px; }
.home-page .component .practical_info.default_view .multiple-line { background: none; padding-right:0}  /* Don't display arrows on home */
.component.practical_info.default_view .component.schedule .opening_hours {margin-bottom:10px} /* TODO change component CSS */

/* don't show the arrows of multiple mode in the home page */
.home-page .component.practical_info.default_view .multiple-mode .practical-info-point-of-sale-link {display: none;}


/*********************************/
/*phone*/
/*********************************/
.component.contact.phone_view{margin-bottom:10px}
.component.contact.phone_view .phone{font-size:18px;font-weight:bold;margin-bottom:0}
.component.contact.phone_view .phone:before{font-size:19px;font-weight:normal}

/*********************************/
/*mobile*/
/*********************************/
.component.contact.mobile_view{margin-bottom:10px}
.component.contact.mobile_view .mobile{font-size:18px;font-weight:bold;margin-bottom:0}
.component.contact.mobile_view .mobile:before{font-size:19px;font-weight:normal}

/*********************************/
/*address*/
/*********************************/
.component.address.long_view,
.component.address.short_view,
.component.address.default_view{margin-bottom:10px}
.component.address.long_view .postal-address,
.component.address.default_view .postal-address {font-size:13px;line-height:18px;margin-bottom:0}
.component.address.long_view:before,
.component.address.default_view:before,
.component.address.short_view:before{font-size:19px;font-weight:normal}

/*********************************/
/*email*/
/*********************************/
.component.contact.email_view,
.component.contact.email_label_view{margin-bottom:10px}
.component.contact.email_view .email,
.component.contact.email_label_view .email{margin-bottom:0}
.component.contact.email_view .email:before,
.component.contact.email_label_view .email:before{font-size:19px;font-weight:normal}

/*********************************/
/*booking*/
/*********************************/
.component.booking.default_view{margin-bottom:10px}

.component.booking .booking-button{background: url("../img/glossy3-2.png") repeat-x #BDC0B7;border-radius: 2px;clear: both;cursor: pointer;height: 30px;line-height: 30px;padding: 0 20px;width: auto}
.component.booking .booking-button:hover{background-image: url("../img/noir30.png");background-color:#BDC0B7}

/*********************************/
/*access*/
/*********************************/
.component.accesses .accesses-with-icons .access:before{background-color:#BDC0B7}
.component.accesses .accesses-with-icons.accesses-inverse .access:before{background-color:#BDC0B7}
.component.accesses .item{display:inline-block;width:32%;vertical-align:top}

/*********************************/
/*intervention area*/
/*********************************/
.component.intervention_area{margin-bottom:35px}

/*********************************/
/*map*/
/*********************************/
.component.map{margin-bottom:35px}
.component.map .button {cursor:pointer;background-color: #BDC0B7;color: #ffffff;border: 0;display: inline-block;text-align: center;border-radius: 2px;font-size: 16px;font-weight: bold;height: 30px;line-height: 30px;padding: 0 20px;text-decoration: none}
.component.map .button:hover{background-color:#153e4b}
.component.map .map-content div.way input[type="text"]{border-radius: 3px;border: 1px solid #376379;font: 15px arial;padding: 16px 19px;}


/*********************************/
/*pdf*/
/*********************************/
/*.horizontal_layout > .item-container > .item .pdf{background: url("../img/pdf.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);display: block;line-height: 16px;margin-bottom: 5px;min-height: 16px;padding-left: 20px}*/


/*********************************/
/*lists*/
/*********************************/
.activity .referential-module ul, .means_of_payment ul, .richtext ul{padding-left:0;}
.activity .referential-module li:not(.no-bullet), .means_of_payment li, .richtext li {list-style-type:none;display:table;padding-left: 20px;}
.activity .referential-module li:not(.no-bullet):before, .means_of_payment li:before, .richtext li:before{content: "•";float: left;display: inline-block;margin-left: -20px;font-style: normal;font-variant: normal;font-weight: normal;text-transform: none}


.component.activity .referential-module {
    margin-top:45px;
}

.component.activity .referential-module.with-image .referential-module-title {
    margin-top:0px;
    float:left;
    width:65%;
}
@media screen and (max-width: 40em) {
  .component.activity .referential-module.with-image .referential-module-title {
    float:inherit;
    width:100%;
  }
}

.component.activity .referential-module.with-image .referential-module-image {
    float: right;
    margin-left: 2%;
    max-width: 33%;
}
@media screen and (max-width: 40em) {
  .component.activity .referential-module.with-image .referential-module-image {
    max-width: 100%;
    margin-left: 0px;
    float:inherit;
    margin-top:20px;
  }
}

.component.activity .referential-module.with-image .referential-module-items {
    float:left;
    clear:left;
    max-width:65%;

}
@media screen and (max-width: 40em) {
    .component.activity .referential-module.with-image .referential-module-items {
        float:inherit;
        clear:inherit;
        max-width:100%;
    }
}

/*********************************/
/*activity section*/
/*********************************/
.component.activity.default_view .activity-section{margin-bottom: 20px}
.referential-module{margin-bottom: 50px}

/*********************************/
/*spoken language*/
/*********************************/
.spoken_languages {margin: 0 0 20px 0;}
.spoken_languages ul{list-style: none;}

/*********************************/
/*social*/
/*********************************/
.social-links{margin-bottom:25px}
.social-links>ul{padding:0;}
.social-links>ul>li {display:inline-block;margin:2px 5px 0 0}

/*********************************/
/*social sharing*/
/*********************************/
.component.social_sharing .fb {background: url("../img/symboles.png") no-repeat scroll -65px 0 rgba(0, 0, 0, 0);}
.component.social_sharing .tweet {background: url("../img/symboles.png") no-repeat scroll -85px 0 rgba(0, 0, 0, 0);}
.component.social_sharing .share-by-email {background: url("../img/symboles.png") no-repeat scroll -105px 0 rgba(0, 0, 0, 0);}

/*********************************/
/*last updated*/
/*********************************/
.last_updated .last-updated-items{padding-left:0}


/*********************************/
/*footer layout*/
/*********************************/
footer .revert > .item-container > .item-first{float:right}
footer .inner-content {position: relative;}
footer li{list-style-type:none;word-wrap: break-word;}
footer .horizontal_layout .title{display: table;margin-bottom: 10px;font-size:13px;font-weight:bold}
footer .horizontal_layout .titre{display: table;margin-bottom: 10px;font-size:13px;font-weight:bold}
footer .horizontal_layout .box{border-left: 1px solid #153e4b;min-height: 105px;padding: 0 20px 0 19px;}
footer .horizontal_layout .contact.box > .item-container > .item {width:100%}
footer .horizontal_layout .contact.box .access-form-items,
footer .horizontal_layout .contact.box .phone-items {padding:0px;margin-bottom:10px}
footer .horizontal_layout.mini-social > .item-container > .item{width:auto;margin-right:5px}


/******************/
/*  legal_notice  */
/******************/

.component.legal_notice.default_view .field-list {list-style: none; padding-left: 0;}
.component.legal_notice.default_view .field {position: relative; padding-left: 0.8em;}
.component.legal_notice.default_view .field:before {content: "-"; display: block; position: absolute; top: 0; left: 0}
.component.legal_notice.default_view .field-label {font-weight: bold;}
.legal-notice-block {margin-bottom: 20px;}
footer .component.legal_notice.link_view {position: absolute;right: 0;padding: 5px 10px;}


/************************
        CAROUSEL
************************/

.component.catalog_carousel.default_view .product-slider .item-container-wrapper{margin-right: 13px;}
.main-visual .component.catalog_carousel.default_view .product-slider .item-container .item .internal_component.catalog_product.short_view {margin: 0 13px 0 0; height:350px;  /* width: 30%; NO: depends on the number of items*/}
.component.catalog_carousel.default_view .product-slider .item-container .item .internal_component.catalog_product.short_view {margin: 0 5px 0 0; height:350px;  /* width: 30%; NO: depends on the number of items*/}
.component.catalog_highlights.default_view .product-slider .arrow,
.component.catalog_carousel.default_view .product-slider .arrow{margin-top: -10px; position: absolute; top: 50%; z-index: 5;}
.component.catalog_highlights.default_view .product-slider .arrow.prev,
.component.catalog_carousel.default_view .product-slider .arrow.prev{left: 0px;}
.component.catalog_highlights.default_view .product-slider .arrow.next ,
.component.catalog_carousel.default_view .product-slider .arrow.next{right: 0px;}
.component.catalog_highlights.default_view .product-slider .arrow.hidden,
.component.catalog_carousel.default_view .product-slider .arrow.hidden {display: none;}

.component.catalog_carousel.default_view .product-slider {margin: 0 auto;}
.component.catalog_carousel.default_view .product-slider .item-container .item .internal_component.catalog_product.short_view {width: 220px;}

.component.catalog_carousel.main-slider {padding: 0 12px}
.main-visual .component.catalog_carousel.main-slider {padding: 48px 20px}
.main-visual .component.catalog_carousel.main-slider .product-slider .arrow.prev{left: 5px;}
.main-visual .component.catalog_carousel.main-slider .product-slider .arrow.next{right: 5px;}
.main-visual .component.catalog_carousel.main-slider {background-color: #F6F6F6;}

/************************
        MAP ROUTE
************************/
.component.map .map-content div.way .way_start{width:72%}
.component.map .map-content div.way .way_end{width:72%}
.component.map .map-content div.way input[type="text"]{width:65%}

@media  screen and (min-width:768px){
    .component.catalog_highlights.default_view .product-slider .item-container .item {min-height:278px}
}

@media  screen and (max-width:768px){
    .site_title .title{font-size:20px;line-height:24px}

    .menu-toggle{display:inline-block;width:42px;height:42px;cursor:pointer;z-index:200;background:#BDC0B7 url(../img/menu-toggle.png) no-repeat 100% 100%}
    .desktop-menu{display:none}
    .main-menu{position:absolute;z-index:1200;left:0;width:100%;background-color:#2A7B96;display:none}
    .main-menu .item-container .item{border-top:1px solid #FFFFFF}
    .main-menu .item-container a{color:#FFFFFF;padding-left:23px}
    .main-menu .item-container .item-container {margin:0}
    .main-menu .item-container .item-container a {padding: 8px 0 8px 46px}

    #main-content>aside{display:none !important;}  /* Hide the whole column */

    #mobile-aside>.box{border-top:1px solid #535353;padding-top:18px}

    .component.cart.basket_button_view{width:42px;height:42px;/*padding:8px 8px 8px 6px;*/}
    .component.cart.basket_button_view .show-basket {display:inline-block;height:26px;width:33px;overflow:hidden}
    .component.cart.basket_button_view .show-basket:before{font-size:2.7rem;}

    .language-menu{bottom:-2px;right:20px}

    .site_title{height:79px;}
    .site_title h1{font-size:20px}

    .logo {height:79px;padding-right:10px}
    .logo .logo_image{max-height:79px}

    .nav-area {padding-top: 10px}

    .blocks{height:auto;overflow:visible}
    .horizontal_layout.blocks > .item-container > .item{height:auto;padding-bottom:40px}

    /* blocks scrollbars */
    .blocks .component.presentation .short-text,
    .blocks .component.practical_info .practical_info_contents,
    .blocks .component.news .news-content,
    .blocks .component.activity .short-text,
    .blocks .component.mba .mba-offers,
    .blocks .component.mba .mba-offers .offer { height: auto; overflow: visible; }  /* back to normal */

    .component.address.practical_info_view address,
    .component.address.default_view address{font-size: 16px;line-height: 22px;}
    .component.contact_infos .component.address.default_view address,
    .component.contact_infos .component.address.practical_info_view address{font-size: 13px;line-height: 18px;}
    .component.contact.contact_form_view{font-size: 13px;line-height: 16px;}
    .component.contact.contact_form_view label{font-size: 13px;line-height: 18px;}

    .contact-page .print{top:30px}

    .component.map .map-content div.way .way_start{width:100%}
    .component.map .map-content div.way .way_end{width:100%}
    .component.map .map-content div.way input[type="text"]{width:100%}
    .component.map .map-content div.way .way-buttons{position:static;padding-top:10px}
    .component.map .map-content div.line .button{float:none;width:100%;margin-top:10px}

    footer .links-items{margin-bottom:5px}
    footer .brochures   a{margin-bottom:10px;display:inline-block}
    footer .social-and-publisher {margin-top:57px}
    footer .social-and-publisher .social-links{display:inline-block;width:50%;min-width:50%}
    footer .social-and-publisher .last_updated{display:inline-block;max-width:49%;vertical-align:top}

    footer .horizontal_layout.mini-social > .item-container > .item{margin-right:15px}
    footer .component.social_sharing .gplus, footer .component.social_sharing .tweet, footer .component.social_sharing .fb, footer .component.social_sharing .fb-link, footer .component.social_sharing .share-by-email{width:25px;height:25px;margin}

    footer .component.social_sharing .fb{background:url(../img/no-repeat-nocolor.png) -174px -174px}
    footer .component.social_sharing .tweet{background:url(../img/no-repeat-nocolor.png) -202px -174px}
    footer .component.social_sharing .share-by-email{background:url(../img/no-repeat-nocolor.png) -305px -155px}

    .horizontal_layout.product-detail > .item-container > .item-last {padding-left:0}

    .component.catalog_product .product-detail-thumb .main-image{max-width:300px}
    .component.catalog_product .product-detail-thumb .thumb-box{max-width:305px}
    .component.catalog_product .product-detail-thumb .product-image{width:100%;max-width: inherit}
    .thumb-zoom{width:100%;height:auto;left:0!important}

}
@media  screen and (max-width:480px){
    /* in mobile:
     * - if there's a logo, the title should go below the logo & nav area "line"
     *   => we switch to block layout with an absolutely positioned .nav-area
     * - if there's no logo, the title should be on the same "line" as the nav
     *   area => we keep the table layout
     */
    .logo,
    .logo ~ .site_title,
    .logo ~ .nav-area {display:block;height:auto}
    .logo ~ .nav-area {
        position: absolute;
        top: 0;
        right: 10px;  /* account for the right padding */
        width:inherit;
    }

    /*.logo .logo_image{max-height:79px; padding: 6px 0 0 10px;}*/
    .site_title {line-height:19px}
    .site_title .title{font-size:16px;line-height:19px;text-align:left}

    .contact-page .contact_layout .slots-2 .item-1{width:100%;margin-bottom:20px;padding-right:0}
    .contact-page .contact_layout .slots-2 .item-2{width:100%}
    .contact.contact_form_view label{width:100%;margin:0;height:auto}
    .contact_form.default_view .field label{width:100%;margin:0;height:auto}
    .contact.contact_form_view input[type="text"] {width:100%;margin-top:1px;margin-bottom:10px}
    .contact.contact_form_view textarea{width:100%}
    .contact.contact_form_view select{width:100%}
    .contact.contact_form_view #captcha{width:100%}
    .contact.contact_form_view #captcha_img{width:100%}
    .contact.contact_form_view .button{width:100%}
    .contact.contact_form_view .send-copy{margin-left:0}
    .contact.contact_form_view .captcha-image {margin-bottom:10px}
    .contact.contact_form_view .captcha .captcha-input{width:100%!important}
    .contact_form.default_view .captcha.field .nagare-error-field{width:100%}
    .contact.contact_form_view button {margin-bottom: 15px;width: 100%}
    .contact.contact_form_view .actions{padding-bottom:15px}

    .contact_form.default_view .field label + * {width:100%}
    .contact_form.default_view .send-copy.field{margin-left:0px}

    .component.accesses .item{width:100%}

    .horizontal_layout.blocks > .item-container{display:block}
    .horizontal_layout.blocks > .item-container > .item{display:block;border-left:0;border-top:1px solid #808080;padding:15px 0px;}
    .horizontal_layout.blocks > .item-container > .item .more-info{position:static}
    .horizontal_layout.blocks > .item-container > .item-last{width:100%}

    .horizontal_layout .mini-social> .item-container.slots-4 > .item.item-3 {clear: none}

    footer .horizontal_layout .box{border-top: 1px solid #153e4b;border-left:0;padding:29px 0}
    footer .horizontal_layout .item-first .item-first>.box{border:0}
    footer .social-and-publisher {margin-top:0px}
    footer .social-and-publisher .social-links{display:block;width:100%}
    footer .social-and-publisher .last_updated{display:block;width:100%}

    .component.catalog_product.pagination_view{display:block}
    .component.catalog_product.title_view{display:block;padding-bottom:20px}
    .component.catalog_product.product-detail{border:0;padding:0}
    .component.catalog_product .product-info{display:block;padding:0;width:100%}
    .component.catalog_product .product-info:first-of-type{padding:0 0 20px 0}

    .component.catalog_highlights.default_view .product-slider .arrow.prev,
    .component.catalog_carousel.default_view .product-slider .arrow.prev{left: 11px;}
    .component.catalog_highlights.default_view .product-slider .arrow.next ,
    .component.catalog_carousel.default_view .product-slider .arrow.next{right: 11px;}

    .catalog-controls {display: table;}
    .catalog-controls .control-item{display:table-row}
    .catalog-controls .control-item .title{display:table-cell;float:inherit;vertical-align:middle;}
    .catalog-controls .control-item.component.catalog.display_mode_view{float:inherit;vertical-align:middle;text-align:inherit;}
    .catalog-controls .control-item .custom-select{max-width: 150px; float:right}
    .component.catalog.display_mode_view .buttons-grp{float: right;}

    .internal_component.catalog_product.short_view .title{font-size:14px;line-height:19px}

    /*********************************/
    /* featured products             */
    /*********************************/
    .component.catalog_highlights.default_view.short-slider .catalog_product.short_view {max-width: 220px; height: 350px;}
    .component.catalog_highlights.default_view .product-slider {width: 220px;height: 350px;margin: 28px auto;}
    .component.catalog_highlights.default_view .product-slider .item-container-wrapper{overflow: hidden; height: 100%;}
    .component.catalog_highlights.default_view .product-slider .arrow.prev{left: 0}
    .component.catalog_highlights.default_view .product-slider .arrow.next{right: 0}

    /*rich text table
    .richtext table{width:100%!important}
    .richtext table td{display:block;width:100%!important}
    .richtext table td img{display:block;width:100%!important} */

    .component.map .map_mode{float:none;text-align:center;margin-bottom:10px}
}
