/*-------------------------------------------*/ /* 1. GENERAL */ /*-------------------------------------------*/ @font-face { font-family: 'FontAwesome'; src: url('//theme.hstatic.net/200000975066/1001334086/14/fontawesome.eot?v=1083'); src: url('//theme.hstatic.net/200000975066/1001334086/14/fontawesome.eot?v=1083') format('embedded-opentype'), url('//theme.hstatic.net/200000975066/1001334086/14/fontawesome.woff?v=1083') format('woff'), url('//theme.hstatic.net/200000975066/1001334086/14/fontawesome.ttf?v=1083') format('truetype'), url('//theme.hstatic.net/200000975066/1001334086/14/fontawesome.svg?v=1083') format('svg'); font-weight: normal;" font-style: normal; } @font-face { font-family:'Glyphicons Halflings'; src:url('//theme.hstatic.net/200000975066/1001334086/14/glyphicons-halflings-regular.eot?v=1083'); src:url('//theme.hstatic.net/200000975066/1001334086/14/glyphicons-halflings-regular.eot?#iefix?v=1083') format('embedded-opentype'),url('//theme.hstatic.net/200000975066/1001334086/14/glyphicons-halflings-regular.woff?v=1083') format('woff'),url(//theme.hstatic.net/200000975066/1001334086/14/glyphicons-halflings-regular.ttf?v=1083) format('truetype'),url(//theme.hstatic.net/200000975066/1001334086/14/glyphicons-halflings-regular.svg#glyphicons_halflingsregular?v=1083) format('svg') } *{font-family:'Quicksand', sans-serif;margin: 0;padding: 0;} .glyphicon{font-family: 'Glyphicons Halflings'!important;} .fa{font-family: 'FontAwesome'!important;} /* 1.1 - */ html,body{border: 0;background-color: #fff;} html{font-size: 62.5%;-webkit-overflow-scrolling: touch;-webkit-text-size-adjust:none;-ms-text-size-adjust:100%;} img{max-width:100%;} body{line-height:1.4;font-size: 14px;color:#272727;overflow-x: hidden;background : #fff;position: initial !important;} /* 1.2 - HTML5 Elements */ article, aside, details, figcaption, figure, dialog, footer, header, hgroup, menu, nav, section { display:block; } /* 1.3 - Typography */ h1,h2,h3,h4,h5,h6 { color:#272727; margin:0 0 13px 0; font-weight:500;line-height:1.2} h1 { font-size: 36px; } h2 { font-size: 28px;} h3 { font-size: 24px;} h4 { font-size: 13px; line-height: 18px; } h5 { font-size: 12px; line-height: 18px; } h6 { font-size: 10px; line-height: 18px; text-transform:uppercase; } p{ margin: 0 0 10px 0; line-height: 21px } /* 1.4 - Links and Buttons */ a {color:#272727;text-decoration: none; outline: none; -moz-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out;-webkit-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;} a:hover,a:focus{color:#000000;text-decoration: none; outline: none;} a:active { outline: none; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {font-family:'Quicksand', sans-serif;color:#272727;line-height: 1.1; } h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover{color:#000000;} /* 1.5 - Tables */ table { width: 100%; border-spacing: 0; } table tr td { border-top: 1px solid #dddddd; } table tr td, table tr th { padding: 10px; text-align: left; } table tr td:first-child, table tr th:first-child { padding-left: 0px; } table tr td:last-child, table tr th:last-child { padding-right: 0px; } strong { font-weight: 700; } em { font-style: italic; } /* 1.6 - Lists */ ul{padding:0;list-style-type:none;} a{transition: opacity 150ms linear, color 150ms linear, background 150ms linear;} input:focus {outline: none;} /* 1.7 - Breadcrumb */ .breadcrumb-shop {background:#fafafa;margin-bottom: 20px;} .breadcrumb-shop .breadcrumb-arrows{padding: 15px 0;background: transparent;border-radius: 0; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;margin-bottom:0;} .breadcrumb-shop .breadcrumb>li+li:before{padding:0 3px;} .breadcrumb-shop .breadcrumb-arrows li{font-size:13px;} /* 1.8 - Pagination */ #pagination .page-node,#pagination .next, #pagination .prev{display:inline-block;margin: 30px 8px;font-size: 15px;font-weight: 600;opacity: 0.4;} #pagination .next{margin-left:30px} #pagination .prev{margin-right:30px;-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg)} #pagination .page-node.current,#pagination .page-node:hover,#pagination .next:hover, #pagination .prev:hover{ opacity: 1;} /* 1.9 - Button */ .button { position: relative; display: inline-block; padding: 10px 28px; line-height: normal; color: #fff; border: 1px solid #000000; border-radius: 0; text-transform: uppercase; font-size: 12px; text-align: center; letter-spacing: 1px; background-color: transparent; -webkit-transition: color 0.45s cubic-bezier(0.785, 0.135, 0.15, 0.86),border 0.45s cubic-bezier(0.785, 0.135, 0.15, 0.86); transition: color 0.45s cubic-bezier(0.785, 0.135, 0.15, 0.86),border 0.45s cubic-bezier(0.785, 0.135, 0.15, 0.86); z-index: 1; overflow: hidden; } .button:before { position: absolute; content: ''; display: block; left: -2px; top: 0; right: -2px; bottom: 0; -webkit-transform: scale(1, 1); transform: scale(1, 1); -webkit-transform-origin: left center; transform-origin: left center; z-index: -1; background-color: #000000; -webkit-transition: -webkit-transform 0.45s cubic-bezier(0.785, 0.135, 0.15, 0.86); transition: -webkit-transform 0.45s cubic-bezier(0.785, 0.135, 0.15, 0.86); transition: transform 0.45s cubic-bezier(0.785, 0.135, 0.15, 0.86); transition: transform 0.45s cubic-bezier(0.785, 0.135, 0.15, 0.86),-webkit-transform 0.45s cubic-bezier(0.785, 0.135, 0.15, 0.86); } .button:hover {color:#252a2b;} .button:hover:before { -webkit-transform-origin: right center; transform-origin: right center; -webkit-transform: scale(0, 1); transform: scale(0, 1); } .row-flex { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; } @media (min-width: 1200px) { .container {width: 1200px;} } @media (min-width: 1375px) { .container {width: 1300px;} } /* 1.10 - LazyLoad */ .fade-box .lazyload, .fade-box .lazyloading {opacity: 0;transition: opacity 400ms;} .fade-box img.lazyloaded {opacity: 1;} img.owl-lazy:not([src]){visibility: hidden;} /*-------------------------------------------*/ /* 2. HEADER */ /*-------------------------------------------*/ /* 2.1 - TopBar */ .promo-bar { background: #4267b2; font-size: 12px; overflow: hidden; text-align: center; cursor: pointer; } .promo-bar a {display: block;padding: 10px 15px;color:#ffffff;} /* 2.2 - Menu */ .desk-menu {position: relative;} .desk-menu >ul>li {position: relative;display: inline-block;height: 100%;padding: 0px 10px;} .desk-menu >ul>li:last-child {margin-right: 0;} .desk-menu > ul>li>a { position: relative; display: block; padding: 15px 0; margin: 0 12px; text-transform: uppercase; letter-spacing: 2px; font-weight: 600; font-size: 13px; transition: initial; letter-spacing: 1.3px; font-weight: bold; } .navigation-header.hSticky-down .desk-menu > ul>li>a {padding: 20px 0;} .desk-menu > ul>li>a:before { position: absolute; content: ''; bottom: -1px; left: 0; width: 100%; opacity: 0; -webkit-transform: scale(0, 1); transform: scale(0, 1); -webkit-transform-origin: left center; transform-origin: left center; // border-bottom: 2px solid #000000; -webkit-transition: opacity 0.3s, -webkit-transform 0.3s; transition: opacity 0.3s, -webkit-transform 0.3s; transition: transform 0.3s, opacity 0.3s; transition: transform 0.3s, opacity 0.3s, -webkit-transform 0.3s; } .desk-menu > ul>li>a:hover:before, .desk-menu > ul>li.active>a:before { opacity:1; -webkit-transform: scale(1, 1); transform: scale(1, 1); } .desk-menu >ul>li.active>a{color: #000000;} .desk-menu ul li a {color:#272727;} .desk-menu ul li a:hover {color:red;} .desk-menu ul { padding-left: 0;margin:0;} .desk-menu ul>li a i {display: inline-block;vertical-align: middle;font-size: 9px;margin-left: 4px;margin-bottom: 2px;} .desk-menu .sub_menu { background: #fff; position: absolute; z-index:999; min-width: 142px; -webkit-box-shadow: 0 1px 20px rgba(0,0,0,.09); -moz-box-shadow: 0 1px 20px rgba(0,0,0,.09); -o-box-shadow: 0 1px 20px rgba(0,0,0,.09); -ms-box-shadow: 0 1px 20px rgba(0,0,0,.09); box-shadow: 0 1px 20px rgba(0,0,0,.09); -webkit-transform: rotate3d(1,0,0,-90deg); -moz-transform: rotate3d(1,0,0,-90deg); -o-transform: rotate3d(1,0,0,-90deg); -ms-transform: rotate3d(1,0,0,-90deg); transform: rotate3d(1,0,0,-90deg); -webkit-transform-origin: 0 0 0; -moz-transform-origin: 0 0 0; -o-transform-origin: 0 0 0; -ms-transform-origin: 0 0 0; transform-origin: 0 0 0; -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease; } .desk-menu ul>li>ul { top: 97%; // border-top:2px solid #000000; } .desk-menu li:hover>.sub_menu { -webkit-transform: rotate3d(0,0,0,0deg); -moz-transform: rotate3d(0,0,0,0deg); -o-transform: rotate3d(0,0,0,0deg); -ms-transform: rotate3d(0,0,0,0deg); transform: rotate3d(0,0,0,0deg); } .desk-menu .sub_menu a {padding: 9px 18px;white-space: nowrap;text-align: left;display: block;font-size: 14px; font-weight: bold } .desk-menu .sub_menu .sub_menu { left: 100%; top: -2px; margin-left: 1px; margin-top: 0; -webkit-transform: rotate3d(0,1,0,90deg); -moz-transform: rotate3d(0,1,0,90deg); -o-transform: rotate3d(0,1,0,90deg); -ms-transform: rotate3d(0,1,0,90deg); transform: rotate3d(0,1,0,90deg) } .desk-menu .sub_menu li:not(:first-child) { border-top: 1px solid #ecf0f1} .desk-menu ul>li i { -webkit-transition: .2s; -moz-transition: .2s; -o-transition: .2s; transition: .2s } .desk-menu ul>li:hover>a i { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); margin-bottom:0; } .desk-menu ul li .sub_menu li{position: relative} @keyframes scroll-in{0%{top:2px}49%{top:-14px}50%{top:19px}100%{top:2px}} @keyframes scroll-out{0%{top:2px}49%{top:19px}50%{top:-14px}100%{top:2px}} /* 2.4 - Icon menu */ .hamburger-menu {width: 22px;height: 20px;cursor: pointer;display: inline-block;vertical-align: middle;position: relative;} .hamburger-menu .bar { position: relative; top: 12px; background: #000; display: block; -ms-transform:translateY(-2px); -webkit-transform:translateY(-2px); transform: translateY(-2px); -ms-transition:transform 0ms 100ms, width 150ms linear; -webkit-transition:transform 0ms 100ms, width 150ms linear; transition: transform 0ms 100ms, width 150ms linear; } .hamburger-menu .bar, .hamburger-menu .bar:after, .hamburger-menu .bar:before {width: 22px;height: 2px;} .hamburger-menu .bar:before { content: ""; position: absolute; right: 0; bottom: 6px; background:#000; -ms-transition:bottom 300ms 100ms cubic-bezier(0.23, 1, 0.32, 1), transform 300ms cubic-bezier(0.23, 1, 0.32, 1), width 150ms linear, background 150ms linear; -webkit-transition:bottom 300ms 100ms cubic-bezier(0.23, 1, 0.32, 1), transform 300ms cubic-bezier(0.23, 1, 0.32, 1), width 150ms linear, background 150ms linear; transition: bottom 300ms 100ms cubic-bezier(0.23, 1, 0.32, 1), transform 300ms cubic-bezier(0.23, 1, 0.32, 1), width 150ms linear, background 150ms linear; } .hamburger-menu .bar:after { content: ""; position: absolute; right: 0; top: 6px; background: #000; -ms-transition:bottom 300ms 100ms cubic-bezier(0.23, 1, 0.32, 1), transform 300ms cubic-bezier(0.23, 1, 0.32, 1), width 150ms linear, background 150ms linear; -webkit-transition:bottom 300ms 100ms cubic-bezier(0.23, 1, 0.32, 1), transform 300ms cubic-bezier(0.23, 1, 0.32, 1), width 150ms linear, background 150ms linear; transition: bottom 300ms 100ms cubic-bezier(0.23, 1, 0.32, 1), transform 300ms cubic-bezier(0.23, 1, 0.32, 1), width 150ms linear, background 150ms linear; } /* 2.5 - style main header*/ .flexContainer-header{ margin: 0 -15px;display: -ms-flexbox;display: -webkit-flex;display: flex; -webkit-align-items: center;-ms-align-items: center;align-items: center; -webkit-justify-content: space-between;justify-content: space-between; -webkit-flex-flow: row nowrap;-ms-flex-flow: row nowrap;flex-flow: row nowrap; } .flexContainer-header>div[class*='wrapper-upper-']{padding: 0 15px;} .navigation-header{ position: relative; background: #fff; z-index: 99; border-bottom: 1px solid #ededed; width: 100%; } .navigation-header.hSticky{opacity: 0;visibility: hidden;} .navigation-header.hSticky-down{ position: fixed;top: 0;left: 0;right: 0;z-index: 999; background: #fff;border-bottom: 0;-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); -webkit-transform: translateY(-100%);transform: translateY(-100%); -webkit-transition: all 400ms ease;-moz-transition: all 400ms ease;transition: all 400ms ease; } .navigation-header.hSticky-down.hSticky-up{ opacity: 1; visibility: visible; -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition: all 400ms ease; -moz-transition: all 400ms ease; transition: all 400ms ease; } .navigation-header.hSticky-down .promo-bar{display: none;} .header--logo .wrap-logo h1,.header--logo .wrap-logo a{ margin-bottom:0;font-size: 32px;font-weight: bold;color:#4267b2; } .header--logo .wrap-logo img{max-height: 70px;} .navigation-header.hSticky-down .header--logo .wrap-logo h1,.navigation-header.hSticky-down .header--logo .wrap-logo a{font-size: 28px;} .header-wrap-icon{display: -webkit-flex;display: flex;-webkit-justify-content: flex-end;justify-content: flex-end;} .header-wrap-icon .header-action{margin-left: 8px;} .header-wrap-icon .header-action .header-action-toggle{display: block;position: relative;font-size: 13px;color: #000;} .header-wrap-icon .header-action .box-action-icon{display: inline-block;vertical-align: middle;position: relative;width: 30px;height: 35px;text-align: center;} .header-wrap-icon .header-action .box-action-icon svg{width: 20px;height: 35px;fill: #000;} .header-wrap-icon .header-action .box-action-icon svg.svg-icon-cart{width: 22px;} .header-wrap-icon .header-action .box-action-icon .box-icon--close{ position: absolute;top: 0;left: 0;bottom: 0;right: 0; opacity: 1;visibility: hidden; transition: opacity 0.35s ease-in-out, -webkit-transform 0.35s ease-in-out; transition: opacity 0.35s ease-in-out, transform 0.35s ease-in-out; transition: opacity 0.35s ease-in-out, transform 0.35s ease-in-out, -webkit-transform 0.35s ease-in-out; } .header-wrap-icon .header-action_cart .count-holder{ position: absolute; top: -2px; right: -6px; background: #000000; border-radius: 50%; width: 20px; line-height: 20px; height: 20px; color: #fff; } .header-search-mobile{position: relative;padding: 5px 6px;} /* search bar mobile*/ .search-bar-mobile form.searchform{position: relative;margin: 0;} .search-bar-mobile form.searchform input.input-search{ width: 100%; height: 30px; padding: 5px 40px 5px 8px; margin: 0; border-radius: 0; border: 1px solid #eaeaea; background: #f5f5f5; color: #252a2b; -webkit-appearance: none; -moz-appearance: none; -o-appearance: none; appearance: none; } .search-bar-mobile form.searchform input.input-search:focus{border-color:#000000;background: #fff;} .search-bar-mobile form.searchform .btn-search{ position: absolute; width: 35px; height: 30px; line-height: 30px; border: 0; outline: none; padding: 0; top: 0px; right: 0px; background: transparent; } .search-bar-mobile form.searchform .btn-search svg{ width: 15px;height: 30px;line-height: 30px;opacity: 0.6;fill: #000; } .search-bar-mobile form.searchform .btn-search .svg-search-close{display: none;} .search-bar-mobile form.searchform.expanded .btn-search .svg-search{display: none;} .search-bar-mobile form.searchform.expanded .btn-search .svg-search-close{display: block;fill: #000;width: 22px;opacity: initial;margin: auto;} .search-bar-mobile .smart-search-wrapper{ position: absolute; top: 100%; right: 0px; left: 0px; z-index: 100; width: initial; float: initial; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.08); } /* ----------- style header 01---------------*/ .topbar_temp01{background: #4267b2;} .topbar_temp01 a{color: #ffffff;} .mainHeader_temp_1 .navigation-header:not(.hSticky-down) .header--logo .wrap-logo h1, .mainHeader_temp_1 .navigation-header:not(.hSticky-down) .header--logo .wrap-logo a{color: #000000;} .mainHeader_temp_1 .navigation-header:not(.hSticky-down) .desk-menu > ul>li>a{padding: 26px 0;color: #000000;} .mainHeader_temp_1 .navigation-header:not(.hSticky-down) .desk-menu > ul>li>a:hover{color: #2e2e2e;} .mainHeader_temp_1 .navigation-header:not(.hSticky-down) .header-wrapper-middle{background: #ffffff;} .mainHeader_temp_1 .navigation-header:not(.hSticky-down) .header-wrap-icon .header-action .box-action-icon svg{fill: #000000;color: #000000;} .mainHeader_temp_1 .navigation-header:not(.hSticky-down) .hamburger-menu .bar, .mainHeader_temp_1 .navigation-header:not(.hSticky-down) .hamburger-menu .bar:before, .mainHeader_temp_1 .navigation-header:not(.hSticky-down) .hamburger-menu .bar:after{background: #000000;} /* ----------- style header 02---------------*/ .topbar_temp02{background: #000000;} .topbar_temp02 a{color: #ffffff;} .mainHeader_temp_2 .navigation-header:not(.hSticky-down) .header--logo .wrap-logo h1, .mainHeader_temp_2 .navigation-header:not(.hSticky-down) .header--logo .wrap-logo a{color: #000000;} .mainHeader_temp_2 .navigation-header:not(.hSticky-down) .header-wrapper-middle{background: #ffffff;} .mainHeader_temp_2 .navigation-header:not(.hSticky-down) .header-wrap-icon .header-action .box-action-icon svg{fill: #000000;color: #000000;} .mainHeader_temp_2 .navigation-header:not(.hSticky-down) .hamburger-menu .bar, .mainHeader_temp_2 .navigation-header:not(.hSticky-down) .hamburger-menu .bar:before, .mainHeader_temp_2 .navigation-header:not(.hSticky-down) .hamburger-menu .bar:after{background: #000000;} .header-navbar-menu .wrap-logo-sticky{display: none;} /* ----------- style header 03---------------*/ .topbar_temp03{background: #4267b2;} .topbar_temp03 a{color: #ffffff;} .mainHeader_temp_3 .navigation-header:not(.hSticky-down) .header--logo .wrap-logo h1, .mainHeader_temp_3 .navigation-header:not(.hSticky-down) .header--logo .wrap-logo a{color: #000000;} .mainHeader_temp_3 .navigation-header:not(.hSticky-down) .header-wrapper-middle{background: #ffffff;} .mainHeader_temp_3 .navigation-header:not(.hSticky-down) .header-wrap-icon .header-action .box-action-icon svg{fill: #000000;color: #000000;} .mainHeader_temp_3 .navigation-header:not(.hSticky-down) .hamburger-menu .bar, .mainHeader_temp_3 .navigation-header:not(.hSticky-down) .hamburger-menu .bar:before, .mainHeader_temp_3 .navigation-header:not(.hSticky-down) .hamburger-menu .bar:after{background: #000000;} .header-wrap-icon .header-action .icon-box-text {display: none;} @media(min-width: 992px){ .navigation-header:not(.hSticky-down) .header--logo{height: fit-content; width: fit-content} .navigation-header.hSticky-down .header--logo{max-width: 18%;min-width: 180px;} .navigation-header:not(.hSticky-down) .header--logo .wrap-logo{width: 100%; height: 100%} .search-bar-mobile{display: none;} .wrapper-upper-icon{position: relative;} .navigation-header.hSticky-down .header_dropdown_content{top: calc(100% + 10px);} /* ----------- style header 02---------------*/ .mainHeader_temp_2 .navigation-header:not(.hSticky-down) .header-wrapper-middle{padding: 6px 0;} .mainHeader_temp_2 .navigation-header.hSticky-down .header-navbar-menu{ display: -webkit-flex;display: flex; align-items: center;-webkit-align-items: center; } .mainHeader_temp_2 .navigation-header.hSticky-down .header-wrapper-middle{ visibility: hidden; z-index: 5; position: absolute; right: 0; left: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .mainHeader_temp_2 .navigation-header.hSticky-down .flexContainer-header{-webkit-justify-content: flex-end;justify-content: flex-end;} .mainHeader_temp_2 .navigation-header.hSticky-down .wrapper-upper-logo, .mainHeader_temp_2 .navigation-header.hSticky-down .wrapper-upper-navbar{display: none;} .mainHeader_temp_2 .navigation-header.hSticky-down .wrapper-upper-icon{visibility: visible;width: initial;} .mainHeader_temp_2 .navigation-header.hSticky-down .header-navbar-menu .wrap-logo-sticky{display: inline-block;} .mainHeader_temp_2 .navigation-header.hSticky-down .main-header--menu{ -webkit-flex: 1 1 auto;flex: 1 1 auto;padding-left: 15px;padding-right: 115px; } .mainHeader_temp_2 .header--logo .wrap-logo img{margin: auto;} /* ----------- style header 03---------------*/ .mainHeader_temp_3 .navigation-header:not(.hSticky-down) .header-wrapper-middle{padding: 15px 0;} .mainHeader_temp_3 .navigation-header:not(.hSticky-down) .desk-menu ul{text-align: initial;} .mainHeader_temp_3 .navigation-header:not(.hSticky-down) .desk-menu>ul>li>a{margin: 0 30px 0 0;} .mainHeader_temp_3 .navigation-header.hSticky-down .header-navbar-menu{ display: -webkit-flex;display: flex; align-items: center;-webkit-align-items: center; } .mainHeader_temp_3 .navigation-header.hSticky-down .header-wrapper-middle{ visibility: hidden; z-index: 5; position: absolute; right: 0; left: 0; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .mainHeader_temp_3 .navigation-header.hSticky-down .flexContainer-header{-webkit-justify-content: flex-end;justify-content: flex-end;} .mainHeader_temp_3 .navigation-header.hSticky-down .wrapper-upper-logo, .mainHeader_temp_3 .navigation-header.hSticky-down .wrapper-upper-navbar{display: none;} .mainHeader_temp_3 .navigation-header.hSticky-down .wrapper-upper-icon{visibility: visible;width: initial;} .mainHeader_temp_3 .navigation-header.hSticky-down .header-navbar-menu .wrap-logo-sticky{display: inline-block;} .mainHeader_temp_3 .navigation-header.hSticky-down .main-header--menu{ -webkit-flex: 1 1 auto;flex: 1 1 auto;padding-left: 15px;padding-right: 115px; } .mainHeader_temp_3 .navigation-header:not(.hSticky-down) .header-wrap-icon .header-action_search{display: none;} .mainHeader_temp_3 .navigation-header:not(.hSticky-down) .header-wrap-icon .header-action_account{position: relative;} .mainHeader_temp_3 .navigation-header:not(.hSticky-down) .header-wrap-icon .header-action_cart{position: relative;display: flex;align-items: center;} .mainHeader_temp_3 .navigation-header:not(.hSticky-down) .header-wrap-icon .header-action{margin-left: 40px;} .mainHeader_temp_3 .navigation-header:not(.hSticky-down) .header-wrap-icon .header-action .icon-box-text{ display: inline-block; vertical-align: middle; color: #000000; text-align: left; padding-left: 8px; } .mainHeader_temp_3 .navigation-header:not(.hSticky-down) .header-wrap-icon .header-action .icon-box-text .txtAcount{ display: block; font-size: 14px; font-weight: 500; } .mainHeader_temp_3 .navigation-header:not(.hSticky-down) .header-wrap-icon .header-action .icon-box-text .txtAcount .txtText + i{ position: relative; top: 3px; padding-left: 5px; } .mainHeader_temp_3 .navigation-header:not(.hSticky-down) .header-wrap-icon .header-action .icon-box-text .txtAcount .txtText{ text-overflow: ellipsis; white-space: nowrap; max-width: 120px; display: inline-block; vertical-align: middle; overflow: hidden; } .mainHeader_temp_3 .wrapper-upper-search{-webkit-flex: 1 1 auto;flex: 1 1 auto;margin-left: 40px;} .mainHeader_temp_3 .wrapper-upper-search .wpo-wrapper-search{position: relative;} .mainHeader_temp_3 .wrapper-upper-search .searchform-categoris{margin: 0;} .mainHeader_temp_3 .wrapper-upper-search form.searchform input.searchinput{ height: 40px;padding: 5px 55px 5px 15px;border-radius: 4px; } .mainHeader_temp_3 .wrapper-upper-search form.searchform .btn-search{height: 40px;line-height: 40px;border-radius: 0 4px 4px 0;} .mainHeader_temp_3 .wrapper-upper-search form.searchform .btn-search svg{height: 40px;} .mainHeader_temp_3 .wrapper-upper-search .smart-search-wrapper { position: absolute;top: calc(100% + 5px);left: 0;right: 0; box-shadow: 0px 0px 10px rgba(0,0,0,0.08); } } @media(max-width: 991px){ .flexContainer-header>div.wrapper-upper-logo{padding: 0 5px; margin-left: 10%} .flexContainer-header>div.wrapper-upper-icon{padding-left: 0;position: initial;} .wrapper-upper-navbar{position: initial;} .header--logo .wrap-logo{text-align: center;} .navigation-header .header-wrapper-middle{position: relative;padding: 10px 0;} .header-wrap-icon .header-action_search{display: none;} .navigation-header:not(.hSticky-down) .header-search-mobile{border-top: 1px solid #ededed;} .navigation-header.hSticky-down .wrapper-upper-logo{display: none;} .wrapper-upper-navbar.show-action .hamburger-menu .bar{background: transparent;} .wrapper-upper-navbar.show-action .hamburger-menu .bar:before{top:0;-webkit-transform: rotate(45deg);-ms-transform: rotate(45deg);transform: rotate(45deg);} .wrapper-upper-navbar.show-action .hamburger-menu .bar:after{top:0;-webkit-transform: rotate(-45deg);-ms-transform: rotate(-45deg);transform: rotate(-45deg);} .navigation-header:not(.hSticky-down) .wrapper-upper-navbar.show-action .hamburger-menu .bar{background: transparent;} .header-wrap-icon .header-action.show-action .box-action-icon .box-icon--close{ opacity: 1; visibility: visible; -webkit-transform: scale(1); transform: scale(1); } .header-wrap-icon .header-action.show-action svg.icon-svg{opacity: 0;visibility: visible;-webkit-transform: scale(1);transform: scale(1);} .header-wrap-icon .header-action.show-action .count-holder{display: none;} /* search bar mobile on header sticky*/ .navigation-header.hSticky-down .hamburger-menu .bar{top: 10px;} .navigation-header.hSticky-down .search-bar-mobile{ position: absolute; right: 0; left: 0; top: 50%; border-top: none; padding: 0px 98px 0px 55px; -webkit-transform: translateY(-50%); transform: translateY(-50%); visibility: hidden; } .navigation-header.hSticky-down .search-bar-mobile .search-box{visibility: visible;} .navigation-header.hSticky-down .search-bar-mobile .smart-search-wrapper{top: calc(100% + 5px);} .mainHeader_tempPr .navigation-header:not(.hSticky-down) .backto-page-history{display: none;} .mainHeader_tempPr .navigation-header.hSticky-down .header-search-mobile{display: none;} .mainHeader_tempPr .navigation-header.hSticky-down .backto-page-history{ margin-right: 15px;font-size: 28px;line-height: 25px; } .mainHeader_tempPr .navigation-header.hSticky-down .site-handle{display: inline-block;vertical-align: middle;height: 28px;line-height: 28px;} .mainHeader_tempPr .navigation-header.hSticky-down .header-wrap-icon .header-action_search{display: block;} } /*------------------site nav -------------------*/ .header_dropdown_content{ position: absolute; left: 0; right: 0; top: 100%; z-index: 999; min-width: 300px; border-radius: 3px; text-align: initial; background: #fff; border: solid 1px #dfe3e8; box-shadow: 0 1px 5px 2px rgba(0, 0, 0, 0.1); opacity: 0; visibility: hidden; -webkit-transform: scale(0.9); transform: scale(0.9); transition: opacity 0.25s ease-in-out, visibility 0.25s ease-in-out, max-height 0s linear 0.25s, -webkit-transform 0.25s ease-in-out; transition: opacity 0.25s ease-in-out, transform 0.25s ease-in-out, visibility 0.25s ease-in-out, max-height 0s linear 0.25s; transition: opacity 0.25s ease-in-out, transform 0.25s ease-in-out, visibility 0.25s ease-in-out, max-height 0s linear 0.25s, -webkit-transform 0.25s ease-in-out; will-change: transform; } .header_dropdown_content .box-triangle { position: absolute; right: 14px; bottom: calc(100% - 2px); margin: 0; width: 27px; height: 14px; } .header_dropdown_content .box-triangle svg { -webkit-filter: drop-shadow(0 -2px 2px rgba(0, 0, 0, 0.12)); filter: drop-shadow(0 -2px 2px rgba(0, 0, 0, 0.12)); } .header_dropdown_content .site-nav-container { position: relative; width: 100%; height: 100%; font-size: 14px; overflow: hidden; min-height: 100%; padding: 25px 15px 15px; } .header_dropdown_content .site-nav-container .titlebox { font-size: 14px; text-transform: uppercase; margin: 0; font-weight: 600; padding-bottom: 10px; border-bottom: 1px solid #e3e5ec; } .header_dropdown_content .site-nav-container .cart-view tr.list-item {border-bottom: 1px dotted #bcbcbc;} .header_dropdown_content .site-nav-container .cart-view tr.list-item td {border: none;} .header_dropdown_content .site-nav-container .cart-view tr.list-item td.img {width: 90px;} .header_dropdown_content .site-nav-container .cart-view tr.list-item td.img img {border: 1px solid #ededed;margin-right: 10px;max-width: none; } .header_dropdown_content .site-nav-container .cart-view tr.list-item td.item { padding: 10px 0;position: relative;padding-right: 25px;width: calc(100% - 90px); } .header_dropdown_content .site-nav-container .cart-view tr.list-item td.item a.pro-title-view { float: left;width: 100%;font-size: 11px;font-weight: 600;text-transform: uppercase; } .header_dropdown_content .site-nav-container .cart-view tr.list-item td.item .variant { font-size: 12px; float: left; width: 100%; margin: 5px 0 12px; opacity: 0.66; text-transform: uppercase; } .header_dropdown_content .site-nav-container .cart-view tr.list-item td.item .pro-quantity-view { float: left; width: auto; background: #ededed; text-align: center; padding: 6px 12px; font-size: 12px; line-height: 1; margin-right: 12px; } .header_dropdown_content .site-nav-container .cart-view tr.list-item td.item .pro-price-view { color: #333; display: block; text-align: center; float: left; line-height: 26px; font-weight: 600; } .header_dropdown_content .site-nav-container .cart-view tr.list-item td.item .remove_link.remove-cart { position: absolute; right: 0; width: 20px; height: 20px; line-height: 20px; text-align: center; background: #ededed; } .header_dropdown_content .site-nav-container .cart-view tr.list-item td.item .remove_link.remove-cart a {color: #333;} .header_dropdown_content .site-nav-container .cart-view tr.list-item:last-child {border-bottom: 0;} .header_dropdown_content .site-nav-container .cart-view .mini_cart_header {text-align: center;border: none;padding: 10px 0;} .header_dropdown_content .site-nav-container .cart-view .mini_cart_header svg { position: relative;width: 50px;height: 50px;right: auto;left: auto; } .header_dropdown_content .site-nav-container .cart-view .cart-scroll { margin-top: 10px;margin-bottom: 10px;padding-right: 10px; } .header_dropdown_content .site-nav-container .cart-view .cart-scroll::-webkit-scrollbar{width: 2px;height: 2px;} .header_dropdown_content .site-nav-container .cart-view .cart-scroll::-webkit-scrollbar-track {-webkit-border-radius: 10px;border-radius: 10px;} .header_dropdown_content .site-nav-container .cart-view .cart-scroll::-webkit-scrollbar-thumb { -webkit-border-radius: 10px;border-radius: 10px; background: rgba(105, 105, 105, 0.8); -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5); } .header_dropdown_content .site-nav-container .cart-view .cart-scroll::-webkit-scrollbar-thumb:window-inactive {background: rgba(105, 105, 105, 0.4); } .header_dropdown_content .site-nav-container .cart-view .line { float: left;width: 100%;border-top: 1px solid #e3e5ec;margin: 0; } .header_dropdown_content .site-nav-container .cart-view .table-total tr td {border: 0;} .header_dropdown_content .site-nav-container .cart-view .table-total tr.btn-link td {padding-top: 0;padding-bottom: 0;} .header_dropdown_content .site-nav-container .cart-view .table-total a.linktocart, .header_dropdown_content .site-nav-container .cart-view .table-total a.linktocheckout { position: relative;padding: 14px 15px;width: 100%;white-space: nowrap; } .header_dropdown_content .site-nav-container .cart-view .table-total #total-view-cart { font-weight: 600;font-size: 16px;color: #7c7c7c; } /*------------------ mini account -------------------*/ .site_account .box-triangle{right: 55px;} .site_account .site_account_header .site_account_title{ margin-bottom: 4px; font-size: 17px; font-weight: 500; font-style: normal; text-transform: uppercase; } .site_account.site-account--info .site_account_header{border-bottom: 1px solid #e3e5ec;margin-bottom: 15px;text-align: center;} .site_account.site-account--info .site_account_header .site_account_title { margin-bottom: 10px; font-size: 15px; font-weight: 500; text-transform: uppercase; } .site_account .site_account_panel_list{position: relative;overflow: hidden;} .site_account .site_account_panel{ width: 100%; visibility: hidden; transition: visibility 500ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 500ms cubic-bezier(0.23, 1, 0.32, 1); transition: transform 500ms cubic-bezier(0.23, 1, 0.32, 1), visibility 500ms cubic-bezier(0.23, 1, 0.32, 1); transition: transform 500ms cubic-bezier(0.23, 1, 0.32, 1), visibility 500ms cubic-bezier(0.23, 1, 0.32, 1), -webkit-transform 500ms cubic-bezier(0.23, 1, 0.32, 1); } .site_account .site_account_panel.site_account_default{ -webkit-transform: translateX(-100%); -moz-transform: translateX(-100%); transform: translateX(-100%); } .site_account .site_account_panel.site_account_default.is-selected{ -webkit-transform: translateX(0); -moz-transform: translateX(0); transform: translateX(0); } .site_account .site_account_sliding{ position: absolute; top: 0; left: 0; -webkit-transform: translateX(100%); -moz-transform: translateX(100%); transform: translateX(100%); } .site_account .site_account_sliding.is-selected{ -webkit-transform: translateX(0); -moz-transform: translateX(0); transform: translateX(0); } .site_account .site-account-list .form__input-wrapper{position: relative;width: 100%;margin-bottom: 12px;} .site_account .site-account-list .form__input-wrapper .sitebox-recaptcha{margin-top: 12px;} .site_account .site-account-list .form__input-wrapper .form__field{ display: block; padding: 14px 10px 3px; border-radius: 2px; border: 1px solid #d4d6d8; width: 100%; line-height: normal; height: 42px; color: #1e2d7d; -webkit-appearance: none; resize: none; font-size: 12px; outline: none; box-shadow: 0 1px rgba(212, 214, 216, 0.25) inset; transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, color 0.2s ease-in-out; } .site_account .site-account-list .form__input-wrapper .form__field:focus{border-color: #000000;} .site_account .site-account-list .form__input-wrapper .form__field:focus + .form__floating-label, .site_account .site-account-list .form__input-wrapper .form__field.is-filled + .form__floating-label{ -webkit-transform: translateY(-6px) scale(0.8); transform: translateY(-6px) scale(0.8); } .site_account .site-account-list .form__input-wrapper .form__floating-label{ position: absolute; left: 10px; top: 0; line-height: 42px; font-size: 12px; margin-bottom: 0; color: #677279; -webkit-transform: scale(1); transform: scale(1); -webkit-transform-origin: left top; transform-origin: left top; transition: -webkit-transform 0.2s ease-in-out; transition: transform 0.2s ease-in-out; transition: transform 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out; pointer-events: none; } .site_account .site-account-list .form__submit{ width: 100%; outline: none; padding: 0px 28px; height: 42px; line-height: 42px; } .site_account .site-account-list .site_account_secondary-action{margin-top: 12px;font-size: 13px;} .site_account .site-account-list .site_account_secondary-action p{margin-bottom: 4px;} .site_account .site-account-list .site_account_secondary-action > p .link{ color: #285cec; transition: color 0.2s ease-in-out; background: transparent; border: none; border-radius: 0; padding: 0; outline: none; } .site_account.site-account--info .site-nav-container{padding: 15px;text-align: left;} .site_account.site-account--info .site-nav-container.site_account_header { text-align: center;border-bottom: 1px solid #ededed; padding: 0 0 5px;margin-bottom: 12px; } .site_account.site-account--info .site-nav-container ul li{padding:0 5px; margin-bottom:8px;} .site_account.site-account--info .site-nav-container ul li span{font-weight: 500;color: #000;} .site_account.site-account--info .site-nav-container ul li span a{color: #677279;} /*------------------menu mobile -------------------*/ .site_menu_mobile{top: 100%;width: 100vw;height: 100vh;} .site_menu_mobile .box-triangle{left: 10px;} .menu-mobile-content{ height: 100vh; overflow-y: auto; scroll-behavior: smooth; -webkit-overflow-scrolling: touch; } #mb-menu{ position: absolute; top: 0px; left: 0px; z-index: 9; width: 100%; height: 100%; overflow: hidden; text-align: left; } #mb-menu .navbar-level{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #fff; box-shadow: none; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; } #mb-menu .menuList-sub{ position: absolute; left: 0; right: 0; margin: 0; padding: 0; list-style: none; height: calc(100% - 160px); background: #fff; overflow: scroll; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; -webkit-transition: -webkit-transform .4s ease; transition: -webkit-transform .4s ease; transition: transform .4s ease; transition: transform .4s ease,-webkit-transform .4s ease; -webkit-transform: translate(100%, 0); -ms-transform: translate(100%, 0); transform: translate(100%, 0); -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } #mb-menu .menuList-sub.vertical-menu-list.sub-child{ -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); overflow-y: hidden; } #mb-menu .menuList-sub.vertical-menu-list.sub-child li a{ display: block; padding: 15px 15px 15px 0; margin-left: 15px; text-transform: uppercase; outline: none; border-bottom: 1px solid #eeeeee; font-size: 14px; font-weight: 700; color: #333; } #mb-menu .menuList-sub li a i.svg-right{ position: absolute; right: 10px; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } #mb-menu .menuList-sub li a i svg{width: 8px;height: 12px;} #mb-menu .menuList-sub.vertical-menu-list.sub-child.mm-subopened{ -webkit-transform: translate(-30%, 0); -ms-transform: translate(-30%, 0); transform: translate(-30%, 0); -webkit-transform: translate3d(-30%, 0, 0); transform: translate3d(-30%, 0, 0); } #mb-menu .menuList-sub li{position: relative;} #mb-menu .menuList-sub.sub-child-1.mm-opened, #mb-menu .menuList-sub.sub-child-2.mm-sub, #mb-menu .menuList-sub.sub-child-3.mm-sub-3{ -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } #mb-menu .menuList-sub.sub-child-1 li a, #mb-menu .menuList-sub.sub-child-2 li a, #mb-menu .menuList-sub.sub-child-3 li a{ display: block; padding: 15px 15px 15px 0; margin-left: 15px; outline: none; border-bottom: 1px solid #e1e3e4; font-size: 14px; font-weight: 300; color: #333; } #mb-menu .menuList-sub.sub-child-1 li a i, #mb-menu .menuList-sub.sub-child-2 li a i, #mb-menu .menuList-sub.sub-child-3 li a i{ padding-right: 10px; font-weight: 700; font-size: 15px; } #mb-menu .main_help .mobile_menu_section{padding: 15px;} #mb-menu .main_help .mobile_menu_section p{font-size: 15px;line-height: 1.85;text-transform: uppercase;font-weight: 500;font-style: normal;color: #333;} #mb-menu .main_help .mobile_menu_section .mobile_menu_help{color: #677279;display: flex; align-items: center;} #mb-menu .main_help .mobile_menu_section .mobile_menu_help svg{margin-right: 16px;width: 24px;height: 24px;} #mb-menu .main_help .mobile_menu_section .mobile_menu_help a{border-bottom: 0!important;text-transform: none!important;} .header_dropdown_content.site_search .box-triangle{right: 92px;} @media screen and (min-width: 992px) { .header_dropdown_content { top: calc(100% + 17px); right: 0; left: auto; border-radius: 3px; -webkit-box-shadow: 0 1px 5px 2px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 1px 5px 2px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 5px 2px rgba(0, 0, 0, 0.1); } .header_dropdown_content.site_cart {max-height: none;width: 470px;height: auto;} .header_dropdown_content .site-nav-container .cart-view .cart-scroll{max-height: 360px;overflow-y: auto;} .header_dropdown_content.site_account{width: 350px;} .header_dropdown_content.site_account.site-account--info{width: 250px;min-width: 225px;} .header_dropdown_content.site_search{width: 400px;} } @media (max-width: 991px) { .header_dropdown_content .site-nav-container { width: 100vw; height: 100vh; overflow-y: auto; padding-bottom: 250px; } .header_dropdown_content.site_cart .box-triangle {right: 16px;} .locked-scroll{overflow: hidden;} .mainHeader_tempPr .navigation-header.hSticky-down .site_menu_mobile .box-triangle{left: 41px;} .locked-scroll .navigation-header, .locked-scroll .navigation-header.hSticky.hSticky-down { position: fixed;top: 0;visibility: visible; opacity: 1;-webkit-transform: translateY(0);transform: translateY(0); } } .header-action.show-action .header_dropdown_content { visibility: visible; opacity: 1; -webkit-transform: scale(1); transform: scale(1); transition: opacity 0.4s cubic-bezier(0, 1, 0.4, 1), visibility 0.4s linear, -webkit-transform 0.4s cubic-bezier(0.18, 1.25, 0.4, 1); transition: opacity 0.4s cubic-bezier(0, 1, 0.4, 1), transform 0.4s cubic-bezier(0.18, 1.25, 0.4, 1), visibility 0.4s linear; transition: opacity 0.4s cubic-bezier(0, 1, 0.4, 1), transform 0.4s cubic-bezier(0.18, 1.25, 0.4, 1), visibility 0.4s linear, -webkit-transform 0.4s cubic-bezier(0.18, 1.25, 0.4, 1); } .header-action.show-action .header_dropdown_content.site_account .site_account_panel.is-selected {visibility: visible;} .site-overlay { background: rgba(225, 225, 225, 0.05); position: fixed; left: 0; top: 0; z-index: 77; width: 100vw; height: 100vh; opacity: 0; visibility: hidden; transition: all 200ms linear; } .locked-scroll .site-overlay {opacity: 1;visibility: visible;} /*-------------------------------------------*/ /* 3. INDEX */ /*-------------------------------------------*/ .main-index {margin-bottom: 40px;} /* 3.1 - Slider */ #home-slider {position: relative;} #home-slider .owl-nav {position: absolute;bottom:0;right:0;display:block;} #home-slider .owl-nav:before { content: ''; display: block; position: absolute; top: 50%; width: 1px; height: 60%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); background-color: #e0e0e0; left: 0; right: 0; margin: auto; } #home-slider .owl-nav div { display: inline-block; cursor: pointer; background-color: #f6f4f3; color:#000000; width: 80px; height: 80px; line-height: 80px; text-align: center; font-size: 0; -webkit-transition: all ease 0.5s; -o-transition: all ease 0.5s; transition: all ease 0.5s; } #home-slider .owl-nav div:hover {background: rgb(255,255,255,0.5);} #home-slider .owl-nav div:before {content:"";font-family: 'FontAwesome';font-size: 34px;} #home-slider .owl-nav div.owl-prev:before {content:"\f104";} #home-slider .owl-nav div.owl-next:before {content:"\f105";} @media(max-width: 767px){ #home-slider .owl-nav div { display: inline-block; cursor: pointer; background-color: #f6f4f3; color:#000000; width: 40px; height: 40px; line-height: 40px; } #home-slider .owl-nav div:before {font-size: 20px;} } /* 3.2 - Collection Home */ .wrapper-heading-home{padding:40px 0;text-align: center;} .wrapper-heading-home h2 { font-size:28px; line-height: 1.6; margin:0 0 15px;; font-weight:500; position: relative; padding: 0 0 10px; display: inline-block; } .wrapper-heading-home h2:before { position: absolute; content: ""; display: block; // width: 55px; height: 1px; bottom: -1px; left: 0; right: 0; margin: 0 auto; z-index: 2; background: #000000; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -o-transition: all 0.3s linear; -ms-transition: all 0.3s linear; transition: all 0.3s linear; } .wrapper-heading-home .view-all a {display: inline-block;font-size:13px;} /* 3.3 - Product Loop */ .pro-loop { display: block; position: relative; overflow: hidden; height: 100%; background:#fff; margin-bottom: 30px; } .pro-loop a {display:block;} .pro-loop .product-detail {padding: 20px 0;text-align:center;} .pro-loop .product-img{text-align: center;position:relative;overflow: hidden;} .pro-loop .product-img .product-sale,.pro-loop .product-img .sold-out{ position: absolute; font-size: 12px; line-height: 1; padding: 5px 10px; font-weight: bold; z-index: 9; color: #272727; background: #fff; } .pro-loop .product-img .product-sale {top: 10px;left: 10px;color:#f94c43;} .pro-loop .product-img .sold-out {right: 10px;bottom:10px} .pro-loop .product-img .sold-out span{opacity: .66;} .product-detail .box-pro-detail{z-index: 9;width: 100%;} .pro-loop .product-detail h3 {margin: 0 0 5px;font-size:14px;position: relative;font-weight: 700} .pro-loop .product-detail h3 a { color: #272727; line-height: 16px; overflow: hidden; -webkit-line-clamp: 1; -webkit-box-orient: vertical; display: -webkit-box; } .pro-loop .product-detail h3 a:hover {color: #000000;} .pro-price-mb {display:none;} p.pro-price {font-size: 14px;margin: 0;font-weight: 700;color: #7c7c7c} p.pro-price.highlight{color:#7c7c7c;} p.pro-price span.pro-price-del {color:#939393;font-size: 13px;margin-left: 5px;font-weight:normal;} .pro-loop .product-img .button-add { width:100%; opacity: 0; visibility: hidden; width: 100%; position: absolute; display: flex; left: 0; bottom: -10%; -webkit-transition: all ease 0.5s; -o-transition: all ease 0.5s; transition: all ease 0.5s; } .pro-loop .product-img button, .box-pro-prices + button { border-radius: 0; text-transform: uppercase; font-weight: 500; font-size: 11px; border: 0; background: #191919; color: #fff; width: 100%; padding: 8px 5px; margin-right: 5px; outline: none; } .box-pro-prices + button{ margin-top: 10px; padding: 10px 15px; } .pro-loop .product-img button:last-child {margin-right:0;} .pro-loop .product-img button i{margin-left: 8px;font-size: 14px;} .pro-loop .product-img picture{ -webkit-transition: all 0.5s ease 0s; transition: all 0.5s ease 0s; display: flex; align-items: center; justify-content: center; height: 100%; } .pro-loop .product-img picture:nth-of-type(2){ position: absolute; top:0; left:0; right:0; bottom:0; opacity: 0; visibility: hidden; } @media(min-width:1024px){ /* .wrapper-collection-1 .pro-loop, .search-list-results .pro-loop, #collection .pro-loop.col-5, .wrapper-collection-3 .pro-loop {width:20%;} */ .pro-loop:hover .product-img .button-add {opacity: 1;visibility: visible;bottom: 0;} .pro-loop:hover .product-img picture:nth-of-type(2) {opacity: 1;visibility: visible;} .pro-loop:hover .product-img picture:nth-of-type(1) {opacity: 0;visibility: hidden;} } @media(max-width:767px){ .pro-loop .product-img picture:nth-of-type(2) {display: none;} .pro-loop .product-detail {padding:5px 0;} } .product-loop-special { display: -webkit-flex; display: flex; -webkit-align-items: flex-start; align-items: flex-start; margin-bottom: 30px; } .product-loop-special.more-image { -webkit-align-items: center; align-items: center; } .product-loop-special .product-width {max-width: 270px;margin: auto;} .product-loop-special .product-detail {padding:20px 0; text-align: center;} .product-loop-special .product-img{text-align: center;position:relative;} .product-loop-special .product-detail h3 {margin: 0 0 5px;font-size: 16px;position: relative;} .product-loop-special .product-detail h3 a{ color: #252a2b; line-height: 16px; overflow: hidden; -webkit-line-clamp: 1; -webkit-box-orient: vertical; display: -webkit-box; } .product-loop-special .action .button {width:100%;padding: 10px 5px;} @media(min-width:768px) { .collection-special-one .product-loop-special .product-col-left {flex-grow:2;} .collection-special-one .product-loop-special .product-col-right {flex-grow:1;padding: 0 80px;} } @media(min-width:1024px) { .collection-special-one .product-loop-special {padding: 0 100px;} } .collection-special-two .product-loop-special .product-col-left {width:60%;} .collection-special-two .product-loop-special .product-width {max-width:190px;} .collection-special-two .product-loop-special .product-col-right {padding:0 0 0 35px;} .collection-special-two .product-loop-special .product-detail {padding:10px 0;} #collection-slide .owl-controls .owl-nav div { position: absolute; top: 30%; font-size: 0; border: none; border-radius: 50%; background: #fff; color: #5c5c5c; cursor: pointer; text-align: center; z-index: 1; -webkit-box-shadow: 0 2px 10px rgba(54,54,54,0.15); box-shadow: 0 2px 10px rgba(54,54,54,0.15); line-height: 0; } #collection-slide .owl-nav .owl-prev {left: 0;} #collection-slide .owl-nav .owl-next {right: 0;} #collection-slide .owl-controls .owl-nav div:before { position: relative; content:""; font-family: "FontAwesome"; font-size: 20px; width: 45px; height: 46px; line-height: 46px; display: inline-block; } #collection-slide .owl-controls .owl-nav .owl-prev:before {content:"\f104";} #collection-slide .owl-controls .owl-nav .owl-next:before {content:"\f105";} @media(max-width:1200) and (min-width:1024px) { .collection-special-two .product-loop-special { -webkit-justify-content: space-around; -moz-justify-content: space-around; justify-content: space-around; } .collection-special-two .product-loop-special { -webkit-align-items: flex-start; align-items: flex-start; } .collection-special-two .product-loop-special .product-width {max-width:170px } .collection-special-two .product-loop-special .product-col-right {padding: 0 0 0 25px;} .collection-special-two .product-loop-special .product-col-left {width:70%;} } @media(max-width: 767px) { .product-loop-special .action .button {font-size:12px} .collection-special-two .product-loop-special .product-width {max-width:130px;} .collection-special-one .product-loop-special .product-col-right {padding-left: 20px;} .collection-special-one .product-loop-special .product-width {max-width:260px;} .product-loop-special .product-detail {padding: 5px 0;} } .wrapper-home-banner .home-banner-pd {padding:2px 0;} .block-banner-category {position: relative;overflow: hidden;} .block-banner-category .caption_banner p{color:#000;font-size:16px;margin-bottom: 20px;font-weight:500} .block-banner-category .caption_banner h2{ font-size:20px; margin-bottom: 0; position: relative; text-transform: uppercase; font-weight: 700; } .block-banner-category .caption_banner h2:after{ display: block; content: ""; margin: auto; width: 40px; height: 4px; margin-top: 30px; background:#000; -ms-transition: all 150ms linear; -webkit-transition:all 150ms linear; transition: all 150ms linear; } .block-banner-category img{-ms-transition:transform 300ms cubic-bezier(0.39, 0.575, 0.565, 1),background 200ms linear,opacity 400ms linear;-webkit-transition:transform 300ms cubic-bezier(0.39, 0.575, 0.565, 1),background 200ms linear,opacity 400ms linear;transition:transform 300ms cubic-bezier(0.39, 0.575, 0.565, 1),background 200ms linear,opacity 400ms linear} .block-banner-category .caption_banner{position: absolute;text-align: center;padding:0 20px; z-index: 2;} .block-banner-category a.link-banner{ -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; -webkit-flex-direction: column; flex-direction: column; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; } .block-banner-category a.link-banner:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; background:#fff; -ms-transition: opacity 200ms linear, background 200ms linear; -webkit-transition: opacity 200ms linear, background 200ms linear; transition: opacity 200ms linear, background 200ms linear; } .block-banner-category:hover img{ -ms-transform: scale(1.025); -webkit-transform: scale(1.025); transform: scale(1.025);} .block-banner-category:hover a.link-banner:after{ opacity: .5;} .block-banner-category:hover .caption_banner h2:after{width: 70px;} @media (min-width: 768px) { .wrapper-home-banner .home-banner-pd {padding:0 2px;} } /* 3.4 - Blog list home */ .posts-list .post_item {margin-bottom: 30px;text-align: center;} .posts-list .post_featured { overflow:hidden; position: relative; margin-bottom: 15px; } .posts-list .post_item .post_info {text-transform: uppercase;margin-bottom: 10px;} .posts-list .post_item h3 { font-size: 18px; line-height: 22px; position: relative; padding-bottom: 12px; } .posts-list .post_item h3:after { position: absolute; content:""; bottom:0; left:0; right:0; margin: auto; width: 50px; height: 2px; background: #000000; } .posts-list .post_item h3 a { overflow: hidden; -webkit-line-clamp: 1; -webkit-box-orient: vertical; display: -webkit-box; } .wrapper-home-newsletter { background-image: none; background-repeat: no-repeat; background-position: center; background-size: cover; padding: 60px 0; text-align: center; } .wrapper-home-newsletter.lazyloaded {background-image: url(//theme.hstatic.net/200000975066/1001334086/14/bg-newsletter.jpg?v=1083);} .content-newsletter { color: #fff; max-width: 525px; margin: auto; } .content-newsletter h2{ font-size: 40px; line-height: 60px; font-weight: 900; color: #fff; text-transform: uppercase; } .content-newsletter p {font-size: 16px;line-height: 28px;color: #fff;margin: 0 auto 20px;} .content-newsletter form .form-group {position: relative;} .content-newsletter input { width: 100%; height: 65px; line-height: 25px; color: #999999; padding: 20px 120px 20px 20px; border-radius: 0; border: none; box-shadow: none; outline: none!important; transition: initial; } .content-newsletter button { background: #000000; color: #fff!important; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2); font-weight: 500; text-align: center; text-transform: uppercase; position: absolute; z-index: 0; top:0; right: 0; border-radius: 0; border: 1px solid transparent; height: 65px; width: 100px; padding: 15px; } @media (min-width:1200px) { .wrapper-home-newsletter { background-attachment: fixed; } } /* 3.5 - Gallery */ .list-gallery ul {margin:0;float: left;} .list-gallery ul li { float: left; width: calc(100%/6); padding: 2px; } .list-gallery ul li .gallery_item {position: relative;overflow: hidden;display: block;} .list-gallery ul li .gallery_item:before { position: absolute; top: 0; left: -100%; z-index: 2; display: block; content: ''; width: 50%; height: 100%; background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.3) 100%); background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.3) 100%); -webkit-transform: skewX(-25deg); transform: skewX(-25deg); } .list-gallery ul li:hover .gallery_item:before { -webkit-animation: shine 1.1s; animation: shine 1.1s; } @-webkit-keyframes shine {100% {left: 125%}} @keyframes shine {100% {left: 125%}} @media (max-width: 768px) { .list-gallery ul li {width: calc(100%/3);padding: 5px!important;} } /*-------------------------------------------*/ /* 4. FOOTER */ /*-------------------------------------------*/ .main-footer .main-footer--border {padding: 24px 0;border-top: 1px dashed #e0d9d6;border-bottom: 1px dashed #e0d9d6;} /* 4.1 - Footer top */ .form-newsletter .error-box,.form-newsletter .success.feedback{padding: 5px 0 0;margin:0;} .form-newsletter .error-box{color: red;} .main-footer .contact-form {position:relative;} .main-footer .contact-form .input-group {display: flex;margin:0;width:100%;} .main-footer .contact-form .input-group input {height:46px;width:100%;padding: 0 15px;} .main-footer .contact-form .input-group button {white-space: nowrap;width: 40%;} .social-list {margin: 15px 0;} .social-list a { display: inline-block; width: 35px; height: 35px; -webkit-border-radius: 50%; border-radius: 50%; background: #000000; color: #fff; text-align: center; line-height: 35px; font-size: 15px; margin: 0 10px 0 0; -webkit-transition: all 0.4s ease 0s; -o-transition: all 0.4s ease 0s; transition: all 0.4s ease 0s; position: relative; text-decoration: none !important; } .social-list a:hover {background: #fff;color: #000000;} .social-list a:after { width: 100%; height: 100%; -webkit-border-radius: 50%; border-radius: 50%; content: ''; position: absolute; left: 0; top: 0; border: 4px solid #000000; -webkit-transition: all 0.4s ease 0s; -o-transition: all 0.4s ease 0s; transition: all 0.4s ease 0s; -webkit-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); opacity: 0; filter: alpha(opacity=0); } .social-list a:hover:after { opacity: 0.31; filter: alpha(opacity=100); -webkit-transform: scale(1.3); -ms-transform: scale(1.3); -o-transform: scale(1.3); transform: scale(1.3); } /* 4.2 - Footer Bottom */ .main-footer--bottom {margin: 24px 0 0;} .main-footer h4 { font-size: 15px; letter-spacing: 0.02em; margin: 0 0 20px; position: relative; line-height: 22px; text-transform: uppercase; } .main-footer .footer-col {margin-bottom: 24px;} .main-footer .footer-content ul {margin-bottom: 15px;} .main-footer .footer-content ul li{display: block;line-height: 28px;position:relative;padding-left:20px;} .main-footer .footer-content ul li a, .main-footer .footer-content ul li span {position:relative;overflow: hidden;} .main-footer .footer-content.toggle-footer ul li span {font-weight: 500;} .main-footer .list-social {margin-bottom:10px;} .main-footer .list-social li{display: inline-block;text-align: center;padding:0;margin-right: 12px;} .main-footer .list-social li a{ font-size: 12px; display: block; line-height: 22px; overflow: hidden; text-align: center; position: relative; } .main-footer .list-social li span {font-weight: 600;margin-left:5px;} .footer-static-content iframe {width:100%!important;position:relative!important;} .footer-static-content .fb_iframe_widget > span {width:100%!important;} .logo-footer {margin-bottom:20px;} .logo-footer img {width:150px;} .main-footer--copyright .main-footer--border {border-bottom: none;} .main-footer--copyright p {text-align: center;margin-bottom:0;} .main-footer .line {padding: 24px 0 0;border-top: 1px dashed #e0d9d6;} /* 4.3 - Scroll to top */ .back-to-top {position: fixed;right: 10px;bottom: 15px;opacity: 0;visibility: hidden;z-index: 99;} .back-to-top.show { opacity: 1; visibility: visible; -webkit-transition: opacity .3s ease; -moz-transition: opacity .3s ease; transition: opacity .3s ease; } .back-to-top .btt-label-back { display: inline-block; vertical-align: middle; line-height: 40px; -webkit-transform: rotate(-90deg) translateX(50%) translateY(50%); -moz-transform: rotate(-90deg) translateX(50%) translateY(50%); transform: rotate(-90deg) translateX(50%) translateY(50%); } .back-to-top .btt-icon-back { position: absolute; bottom: 250%; left: 80%; -webkit-transform: translateX(-50%) translateY(0); -moz-transform: translateX(-50%) translateY(0); transform: translateX(-50%) translateY(0); -webkit-transition: -webkit-transform .45s cubic-bezier(0,.95,.77,1); transition: transform .45s cubic-bezier(0,.95,.77,1); will-change: transform; } /* 4.4 - Harafunnel mobile */ .harafunnel-mb { position: fixed; right: 10px; bottom: 10%; z-index: 99; width: 70px; height: 70px; padding: 10px; background: #fff; border-radius: 50%; box-shadow: 0 3px 12px rgba(0, 0, 0, .15); transition: box-shadow 150ms linear; } .harafunnel-mb:hover {box-shadow: 0 5px 24px rgba(0, 0, 0, .3);} .harafunnel-mb a {dislay: block;} @media (max-width:767px) { .main-footer--top .row-flex {flex-wrap: wrap;} .form-newsletter {margin-bottom: 24px;} .social-list, .logo-footer {text-align: center;} .main-footer--bottom {margin: 24px 0;} } /*-------------------------------------------*/ /* 5. COLLECTION */ /*-------------------------------------------*/ .wrap-collection-title .heading-collection {margin: 30px 0;} .wrap-collection-title .heading-collection h1{font-size:24px; font-weight: 700;margin:0;} .alert-no p,.alert-no-filter p{margin:10px 0 20px;} /* 5.1 - Menu left */ .tree-menu li a { padding: 5px 5px 5px 0; line-height: 26px; font-size: 12px; display: block; position: relative; } .tree-menu > li > a { color: #272727; font-weight: 500; font-size: 14px; line-height: 28px; border-bottom: 1px dashed #e5e5e5; } .tree-menu > li:last-child > a {border-bottom: none;} .tree-menu li.has-child ul {display: none;} .tree-menu li.has-child > ul {padding-left: 20px;} .tree-menu li a .icon-control { font-size: 8px; position: absolute; top: 50%; right: 0; transform: translateY(-50%); opacity: 1; } .tree-menu li a .icon-control.open i:before {content: "\f068";} /* 5.2 - Filter */ .content-filter .option{margin-top:30px;} .option .lb-filter{ display: block; font-size: 15px; opacity: .92; margin-bottom: 0px;} .custom-dropdown { display: inline-block; position: relative; vertical-align: middle; max-width: 100%; overflow: hidden; border-radius:0px; } .custom-dropdown::after { content: "\f078"; font-family: FontAwesome; font-size: 13px; color: #272727; opacity: .42; display: block; position: absolute; top: 10px; right: 17px; } .option .custom-dropdown .custom-dropdown__select { font-size: 14px; width: 100%; display: block; height: 30px; padding: 0 20px 0 0; border-color: transparent; border-bottom: 1px solid #000; background-color: #fff; outline: 0; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; -moz-appearance: none; -webkit-appearance: none; cursor: pointer; text-indent: 1px; } .option .custom-dropdown{ width: 100%;} .option .custom-dropdown::after{ content: "\f103"; font-family: FontAwesome; font-size: 14px; color: #000; display: block; position: absolute; top: 9px; right: 2px; } .option .option-children:not(:first-child) {margin-bottom: 30px;} .option select option { background: #fff;} .option.browse-tags .lb-filter{display: inline-block;} .option.browse-tags .custom-dropdown {width: auto;float:right;} .left-module {margin-bottom: 20px;overflow: hidden;} .block .title_block { display: block; font-size: 14px; margin: 0 0 5px; font-weight: 700; text-transform: uppercase; background: #f2f5fa; padding: 8px 15px; } .layered .layered_subtitle{ text-transform: uppercase; font-size: 14px; line-height: 22px; padding: 10px 0 10px; cursor: pointer; position: relative; } .layered .layered_subtitle span {font-weight: 600;font-size: 13px;} .layered span.icon-control { position: relative; top:-2px; left: 5px; font-size: 8px; } .group-filter[aria-expanded=false] .dropdown-filter .icon-control i:before {content: "\f067";} .group-filter[aria-expanded=false] .layered-content {display: none;height:0;} .group-filter[aria-expanded=true] .layered-content {height: auto;} .group-filter .layered-content { -webkit-transition: all 0.2s; transition: all 0.2s; } .check-box-list {margin: 0 0 10px;} .check-box-list li{line-height: 20px;font-size: 12px;} .check-box-list label{ display: inline-block; cursor: pointer; line-height: 18px; font-weight: normal; margin-bottom:0; color:#272727; } .check-box-list li:hover label {color:#000000;} .check-box-list input[type="checkbox"]{display: none;} .filter-price li {font-size: 14px;margin-bottom:5px;} .filter-price li:last-child {margin-bottom:0;} .filter-price li span {font-size: 12px;} .filter-color ul{padding: 0;margin: 0;overflow: hidden;} .filter-color li{display: inline;margin: 0 10px 10px 0;line-height: normal;float: left;} .filter-color li label{ border: 1px solid #eaeaea; width: 25px; height: 25px; border-radius: 0; float: left; position: relative; background-size: contain; } .filter-color li input[type="checkbox"]:checked + label:before{ position: absolute; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); content: ''; border-width: 0 0 2px 2px !important; height: 5px; width: 9px; z-index: 99; border: solid #fff; margin: 7px 0 0 7px; } .filter-size li {text-align: center;margin-right: -1px;margin-bottom: -1px;float: left;} .filter-size li label {width: 42px;height: 42px;line-height: 42px;position: relative;border: 1px solid #e5e5e5;} .filter-size li input[type="checkbox"]:checked + label,.size-filter li:hover label { background-color: #111; color: #fff; border: 1px solid #111; } .block .block_content {overflow-y: auto;overflow-x: hidden;} .bl-filter [type="checkbox"]:not(:checked), .bl-filter [type="checkbox"]:checked { position: absolute; left: -9999px; } .bl-filter [type="checkbox"]:not(:checked) + label, .bl-filter [type="checkbox"]:checked + label { position: relative; padding-left: 22px; cursor: pointer; } .bl-filter [type="checkbox"]:not(:checked) + label:before, .bl-filter [type="checkbox"]:checked + label:before { content: ''; position: absolute; left: 0; top: 2px; width: 14px; height: 14px; border: 1px solid #e5e5e5; background: #fff; border-radius: 2px; } .bl-filter [type="checkbox"]:checked + label:before {border: 1px solid #000; } .bl-filter [type="checkbox"]:not(:checked) + label:after, .bl-filter [type="checkbox"]:checked + label:after { position: absolute; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); content: ''; border-width: 0 0 2px 2px !important; height: 4px; width: 7px; border: solid #111; margin: 9px 0 0 4px; left: 0; top: -3px; transition: all .2s; } .bl-filter [type="checkbox"]:not(:checked) + label:after {opacity: 0; } .bl-filter [type="checkbox"]:checked + label:after {opacity: 1; } .bl-filter label:hover:before {border: 1px solid #000 !important;} /*-------------------------------------------*/ /* 6. PRODUCT DETAIL */ /*-------------------------------------------*/ //.product-detail-wrapper {padding: 30px 0;} .product-detail-main {margin-bottom: 0px;} .product-title { padding: 0 0 10px;border-bottom: 1px dotted #dfe0e1;} .product-title h1 {font-size: 20px;font-weight: 700;margin: 0 0 5px;line-height: initial;} #pro_sku {font-size: 12px;color: #a3a5a7;} .hook-reviews {border-bottom: 1px dotted #dfe0e1;padding-bottom: 15px;} .hook-reviews .rating {line-height: 1;position: relative;white-space: nowrap;display: inline-block;width} .hook-reviews .rating .rating { display: block; position: absolute; top: 0; left: 0; bottom: 0; z-index: 1; overflow: hidden; line-height: 1; } .hook-reviews .rating .icon {display: inline-block;} .hook-reviews .rating .icon::before { color: #d5d5d5; content: "\f005"; font-family: "FontAwesome",sans-serif; font-size: 13px; font-style: normal; } .hook-reviews .rating .icon.star-full::before {color: #ffae00;} .number-rating {padding-left: 5px;font-size: 13px;} .product-price {padding: 10px 0;border-bottom: 1px dotted #dfe0e1;} .product-price span.pro-price {font-size: 18px;opacity: .92;font-weight: bold;} .product-price span.pro-sale{ display: inline-block; padding:5px 15px; margin-right: 10px; background: #f2f5fa; text-transform: uppercase; font-weight: 600; font-size: 12px; color: #f94c43; } .product-price del{font-size: 14px;color:#777a7b;padding-left: 10px;font-weight: 500;} .selector-actions { width: 100%;margin-top: 15px;} .quantity-area {margin-bottom:15px;} .quantity-area input#quantity { background: #fff; font-weight: 600; height: 32px; padding: 0; text-align: center; width: 70px; border: 1px solid #f3f4f4; border-left: none; border-right: none; border-radius: 1px; float: left; -webkit-appearance: none; } .quantity-area input.qty-btn { float: left; background: #f3f4f4; border: solid 1px #f3f4f4; cursor: pointer; font-weight: 600; font-size: 16px; outline: none; height: 32px; width: 32px; text-align: center; border-radius: 0; } a.btn-check, button.buy-now, button.btn-addtocart{ font-size: 12px; font-weight: bold; text-transform: uppercase; box-shadow: none; padding: 14px 15px; line-height: 22px; width:100%; margin-bottom: 15px; } button.buy-now {margin-left: 15px;border: 1px solid #ff0000;} button.buy-now:before {background-color: #ff0000;} a.btn-check {margin-bottom:0;border: 1px solid #4267b2; padding: 11px 15px;} a.btn-check:before {background-color: #4267b2;} button.btn-addtocart {border: 1px solid #000000;} button.btn-addtocart:before {background-color: #000000;} button.btn-addtocart[disabled] {opacity: 0.8;} .product-description {margin: 20px 0;} .product-description .title-bl h2, .product-description h2, .product-description h3{ font-size:14px; font-weight:700; display: inline-block; text-decoration: underline; } .product-description #detail_more {display: none;} .product-description ul {list-style: initial;padding-left: 20px;} .product-gallery__thumbs-container {width: 9%;margin-right: 10px;} .product-gallery__thumbs { box-sizing: border-box; width: 100%; position: -webkit-sticky; position: sticky; top: 80px; padding-bottom:1px; } .product-gallery__thumb a {background-color: #f3f3f3;display: block;} .product-gallery__thumb {line-height: 0;margin-bottom: 10px;border: 1px solid #f7f7f8; width: 100%} .product-gallery__thumb:last-child {margin-bottom: 0} .product-gallery__thumb:hover {border-color: #a3a5a7} .product-gallery__thumb img {cursor: pointer;background-color: #f7f7f8;width: 100%} .product-gallery__thumb.active, .product-gallery__thumb.active:hover {border-color: #000000;} .product-gallery__thumb.active img {opacity: .9;width: 100%} .product-gallery { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex } .product-image-detail {width: 91%;padding-left: 10px;position:relative;} .product-gallery-item {text-align:center;margin-bottom: 10px} .product-full-img {text-align: center;} .product-full-img .no_image {width: 50%;} /* Style variant */ .product-image-detail ul {margin:0;} .selector-wrapper,.select {display: none;} .swatch { padding:10px 0;width: 100%; float: left;border-bottom: 1px dotted #dfe0e1;} .swatch .header{margin:0 0 8px;font-size:13px;text-align:left;line-height: initial;} .swatch input { display:none;} .swatch > label.tt-label { margin-right: 10px; font-size: 14px; font-weight: 500; vertical-align: middle; text-transform: uppercase; width: 85px; text-align: right; } .swatch .select-swap {display: inline-block; vertical-align: middle;} .swatch input {display: none;} .swatch .swatch-element {display: inline-block; margin-right: 8px;position: relative;vertical-align: bottom;} .swatch .swatch-element label{ display: block; margin: 0; background: #fff; width: 40px; height: 40px; line-height: 40px; position: relative; border: 1px solid #e5e5e5; font-size: 12px; font-weight: 500; text-align: center; cursor: pointer; } .swatch .swatch-element.color.soldout label span {overflow: hidden;position: relative;} .swatch .swatch-element.color.soldout label span:before { content:""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 50%; height:50%; background: url(//theme.hstatic.net/200000975066/1001334086/14/sold_out.png?v=1083) no-repeat; background-size: contain; } .swatch .swatch-element.color label{width:30px;height:30px;padding:3px;border-radius: 50%;border: none;} .swatch .swatch-element.color span { display: block; width: 100%; height: 100%; margin-top: 0; font-size: 0; border-radius: 50%; border: 1px solid #f5f5f5; } .swatch .swatch-element.color label.sd {background: transparent;border:1px solid #808284} .swatch .swatch-element label.sd{border: 1px solid #000;background: #000;color: #fff;} .swatch .swatch-element.soldout:not(.color) label {overflow: hidden;} .swatch .swatch-element.soldout:not(.color) label:before { content:""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; width: 50%; height:50%; background: url(//theme.hstatic.net/200000975066/1001334086/14/sold_out.png?v=1083) no-repeat; background-size: contain; } label[for="product-select-option-0"] { display: none; } label[for="product-select-option-1"] { display: none; } label[for="product-select-option-2"] { display: none; } #product-select-option-0 { display: none; } #product-select-option-1 { display: none; } #product-select-option-2 { display: none; } #product-select-option-0 + .custom-style-select-box { display: none !important; } #product-select-option-1 + .custom-style-select-box { display: none !important; } #product-select-option-2 + .custom-style-select-box { display: none !important; } @media (max-width:767px) { .swatch .swatch-element.color {margin:5px 8px 5px 0;} } /* Setting varian màu sắc */ .color.swatch-element label.cam span { background: #fb4727 !important; } .color.swatch-element label.kem span { background: #fdfaef !important; } .color.swatch-element label.tim span { background: #3e3473 !important; } .color.swatch-element label.trang span { background: #ffffff !important; } .color.swatch-element label.xanh-ngoc span { background: #75e2fb !important; } .color.swatch-element label.xam span { background: #cecec8 !important; } .color.swatch-element label.xanh span { background: #6daef4 !important; } .color.swatch-element label.den span { background: #000000 !important; } .color.swatch-element label.do span { background: #e2262a !important; } .color.swatch-element label.hong span { background: #ee8aa1 !important; } .color.swatch-element label.reu span { background: #4a5250 !important; } .color.swatch-element label. span { background: #6ab04c !important; } .color.swatch-element label. span { background: #0c2461 !important; } .color.swatch-element label. span { background: #fa8231 !important; } .color.swatch-element label. span { background: #d35400 !important; } .color.swatch-element label. span { background: #ffffff !important; } .color.swatch-element label. span { background: #ffffff !important; } .color.swatch-element label. span { background: #aa6e6d !important; } .color.swatch-element label. span { background: #fac5a7 !important; } .color.swatch-element label. span { background: #f7e7d8 !important; } .color.swatch-element label. span { background: #ebb088 !important; } .color.swatch-element label. span { background: #c47a4a !important; } .color.swatch-element label. span { background: #ffffff !important; } .color.swatch-element label. span { background: #ffffff !important; } .color.swatch-element label. span { background: #ffffff !important; } .color.swatch-element label. span { background: #ffffff !important; } .color.swatch-element label. span { background: #ffffff !important; } .color.swatch-element label. span { background: #ffffff !important; } .color.swatch-element label. span { background: #ffffff !important; } .color.swatch-element label. span { background: #ffffff !important; } .size-guide { margin-top: 15px; } .tag-wrapper label{ display: inline-block;margin-right:10px;font-size:14px;font-weight:700;} .tag-wrapper ul.tags {display: inline-block;} .tag-wrapper ul.tags li {display: inline-block;list-style-type: none;margin-right:3px;} .tag-wrapper ul.tags li:after {content: ",";} .product-image__button {position: -webkit-sticky;position: sticky;bottom: 0;z-index:10;} .product-sharing,.product-zoom,.gallery-index{position: absolute;z-index: 6;} .product-sharing{ display: none; height: auto; width: 26px; left: 10%; bottom: 50px; cursor: pointer; padding-bottom: 30px; -ms-transition: transform 500ms cubic-bezier(0.25, 0.46, 0.45, 0.94); -webkit-transition:transform 500ms cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: transform 500ms cubic-bezier(0.25, 0.46, 0.45, 0.94); } .product-sharing .icon {display: block;width: 20px;height: 20px;position: absolute;bottom: 5px;} .product-sharing a { width: 26px; position: absolute; text-align: center; padding: 30px 0; margin-bottom: 0; opacity: 0; visibility: hidden; display: block; -ms-transform:transform: translateY(50%); -webkit-transform:transform: translateY(50%); transform: translateY(50%); } .product-sharing a:nth-child(2){bottom:30px;-ms-transition:all 150ms linear;-webkit-transition:all 150ms linear;transition:all 150ms linear} .product-sharing a:nth-child(3){bottom:80px;-ms-transition:all 150ms linear 100ms;-webkit-transition:all 150ms linear 100ms;transition:all 150ms linear 100ms} .product-sharing a:nth-child(4){bottom:130px;-ms-transition:all 150ms linear 200ms;-webkit-transition:all 150ms linear 200ms;transition:all 150ms linear 200ms} .product-sharing a:nth-child(5){bottom:130px;-ms-transition:all 150ms linear 200ms;-webkit-transition:all 150ms linear 200ms;transition:all 150ms linear 200ms}.product-sharing a:nth-child(5){bottom:180px;-ms-transition:all 150ms linear 300ms;-webkit-transition:all 150ms linear 300ms;transition:all 150ms linear 300ms} .product-sharing:hover a{-ms-transform:translateY(0);-webkit-transform:translateY(0);transform:translateY(0);opacity:1;visibility:visible} .product-sharing a svg{fill:#000;width:24px;height:24px;} .product-sharing a:hover svg{fill:#000000;} .product-zoom { width: 30px; height: 30px; overflow: visible; cursor: pointer; top: auto; bottom: 48px; right: 0; left: 0; margin:auto; -ms-transition: transform 500ms cubic-bezier(0.25, 0.46, 0.45, 0.94),right 300ms cubic-bezier(0.39, 0.575, 0.565, 1); -webkit-transition: transform 500ms cubic-bezier(0.25, 0.46, 0.45, 0.94),right 300ms cubic-bezier(0.39, 0.575, 0.565, 1); transition: transform 500ms cubic-bezier(0.25, 0.46, 0.45, 0.94),right 300ms cubic-bezier(0.39, 0.575, 0.565, 1); } .product-zoom polyline,.product-sharing .icon svg{fill:#000;} .product-zoom polyline{-ms-transform:scale(0.9);-webkit-transform:scale(0.9);transform:scale(0.9);transform-origin:center;-ms-transition:transform 150ms linear;-webkit-transition:transform 150ms linear;transition:transform 150ms linear} .product-zoom:hover polyline:nth-child(1){-ms-transform: scale(0.9) translate3d(-2px, -2px, 0); -webkit-transform: scale(0.9) translate3d(-2px, -2px, 0);transform: scale(0.9) translate3d(-2px, -2px, 0);} .product-zoom:hover polyline:nth-child(2){-ms-transform:scale(0.9) translate3d(2px, -2px, 0);-webkit-transform:scale(0.9) translate3d(2px, -2px, 0);transform: scale(0.9) translate3d(2px, -2px, 0);} .product-zoom:hover polyline:nth-child(3){-ms-transform:scale(0.9) translate3d(2px, 2px, 0);-webkit-transform:scale(0.9) translate3d(2px, 2px, 0);transform: scale(0.9) translate3d(2px, 2px, 0);} .product-zoom:hover polyline:nth-child(4){-ms-transform:scale(0.9) translate3d(-2px, 2px, 0);-webkit-transform:scale(0.9) translate3d(-2px, 2px, 0);transform:scale(0.9) translate3d(-2px, 2px, 0)} .gallery-index { display: none; bottom: 55px; width: 47px; font-size:13px; text-align: center; font-weight: bold; cursor: default; right: 10%; -ms-transition: transform 500ms cubic-bezier(0.25, 0.46, 0.45, 0.94); -webkit-transition: transform 500ms cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: transform 500ms cubic-bezier(0.25, 0.46, 0.45, 0.94); } .icon-pr-fix{-ms-transition:transition: all 300ms linear;-webkit-transition:transition: all 300ms linear;transition:all 300ms linear} /* Zoom product */ #divzoom { position: fixed; display: none; z-index: 1000; top: 0; left: 0; height: 100vh; overflow: hidden; width: 100vw; background: #fff; } #divzoom #closedivZoom { position: absolute; z-index: 1000; border: 2px solid #333; top: 15px; right: 20px; width: 40px; height: 40px; border-radius: 50%; background: transparent; } #divzoom #closedivZoom i:before { content: ""; position: absolute; width: 20px; height: 2px; background: #333; left: 20%; top: calc(50% - 3px); z-index: 1001; display: block; -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); -o-transform:rotate(45deg); transform: rotate(45deg); } #divzoom #closedivZoom i:after { content: ""; position: absolute; width: 20px; height: 2px; background: #333; right: 30%; top: calc(50% - 3px); z-index: 1001; display: block; -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -o-transform:rotate(-45deg); transform: rotate(-45deg); } #divzoom #closedivZoom i {position: relative;width: 40px;height: 40px;display: block;} .divzoom_main{ height: calc(100vh - 40px);} .divzoom_main .product-thumb, .divzoom_main .product-gallery-item{height:100%;width:100%;list-style: none;} .divzoom_main .product-thumb img, .divzoom_main .product-gallery-item img{max-height:100%; width: auto;} body.open_layer {overflow: hidden;} .list-productRelated h2 { font-size:28px; line-height: 1.6; margin:0 0 60px; font-weight:500; position: relative; padding: 0 0 15px; display: inline-block; } .list-productRelated h2:before { position: absolute; content: ""; display: block; width: 55px; height: 1px; bottom: -1px; left: 0; right: 0; margin: 0 auto; background: #000000; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -o-transition: all 0.3s linear; -ms-transition: all 0.3s linear; transition: all 0.3s linear; } .list-productRelated .pro-loop .product-img button {width: 70%;} .description-productdetail table {min-width: initial!important;} /* style product page */ .pr_style_02 .product-image-detail {width: 100%;padding-left: 0px;position:relative;} .pr_style_02 .product-gallery-item {margin-bottom: 10px} .pr_style_02 .product-gallery-item.shadow {box-shadow: 0px 0px 10px rgba(0,0,0,0.08);} .pr_style_01 .product-gallery-item img,.pr_style_02 .product-gallery-item img {border: 1px solid #f7f7f8;} @media(min-width:992px){ .product-content-desc{position: -webkit-sticky;position: sticky;top: 80px;} .pr_style_02 .product-gallery-item {width: 100%;padding-right:5px;float:left;} .pr_style_02 .product-gallery-item:nth-of-type(2n) {padding-left:5px;padding-right:0;} .pr_style_02 .product-gallery-item:nth-of-type(2n+1){clear: both;} .pr_style_03 .product-gallery__thumbs {position: initial;top: 0;} } /*-------------------------------------------*/ /* 7. BLOG - ARTICLE */ /*-------------------------------------------*/ .list-article-content .news-content{width: 100%;display: block;position: relative;overflow: hidden;} .blog-posts .blog-loop {margin-bottom: 25px} .blog-posts .blog-loop:nth-of-type(3n+1){clear: both;} .blog-posts .blog-post .blog-post-thumbnail {display: block;overflow: hidden} .blog-posts .blog-post .blog-post-thumbnail img { -webkit-transition: all 1s ease-in-out 0s; -khtml-transition: all 1s ease-in-out 0s; -moz-transition: all 1s ease-in-out 0s; -ms-transition: all 1s ease-in-out 0s; -o-transition: all 1s ease-in-out 0s; transition: all 1s ease-in-out 0s; -webkit-transform: scale(1); -khtml-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1) } .blog-posts .blog-post .blog-post-thumbnail:hover img { -webkit-transform: scale(1.2); -khtml-transform: scale(1.2); -moz-transform: scale(1.2); -ms-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2) } .blog-posts .blog-post .blog-post-title {margin-bottom: 10px;font-size: 16px;text-transform: none;letter-spacing: 0} .blog-posts .blog-post .blog-post-title a {color:#272727;} .blog-posts .blog-post .blog-post-title a:hover {color:#000000;} .blog-posts .blog-post .blog-post-meta {margin-bottom: 15px;color: #999} .blog-posts .blog-post .blog-post-meta>span:after {content: '/';padding-left: 4px} .blog-posts .blog-post .blog-post-meta>span:last-child:after {content: ''} .blog-posts .blog-post .blog-post-meta a {color: #999} .blog-posts .blog-post .blog-post-meta a:hover {color: #000000} /* article */ .box-article-heading h1{margin:20px 0;font-size: 24px;} .box-article-heading .header-page {z-index:9;} .box-article-heading .header-page:after {background:#000;} ul.article-info-more li{opacity: 0.85;display: inline-block;margin-right: 10px; font-size: 13px;font-weight: 600;} ul.article-info-more li i{margin-right:5px;} .meta-tags .tags-title{font-weight: 500;} .meta-tags a.tag{opacity: 0.8;font-style: italic;font-size: 14px;} .meta-tags a.tag:after {content: ","; margin: 1px;} .post-navigation {width: 100%;float: left;font-size: 16px;font-weight:600;} .post-navigation .right{float: right;} .post-navigation .left{float:left;} .article-pages,.meta-tags,.article-comment .comment_form,.post-navigation { margin-bottom: 40px;} .article-pages * {max-width: 100%!important;} .article-pages ul{list-style: initial; padding-left: 20px;} .article-pages ol{list-style-type: decimal;padding-left: 20px;} .article-pages ul ul{ list-style-type: circle;} .article-pages ul ul ul{ list-style-type: square;} .article-comment .title-bl h2 { font-size: 20px;text-transform: uppercase; font-weight: 600; margin-bottom:30px;} .article-comment .title-bl h2:after { content: ""; display: block; margin-top: 25px; width: 30px; height: 3px; background:#252a2b; } .article-comment .comment_form .form-group input,.article-comment .comment_form .form-group textarea{ box-shadow: none; background: #ededed; color: #272727; border: 0;border-radius: 0; } .article-comment .comment_form .form-group input{ padding: 0 20px; height: 55px;} .article-comment .comment_form .form-group textarea{padding:20px;resize: none;} .article-comment .comment_form button.btn-rb{ background:#000000; border: 0; height: 55px; display: inline-block; padding: 0 30px; color: #fff; text-transform: uppercase; font-weight: 700; font-size: 13px; } .article-comment .comment_form button.btn-rb:hover{background: #000000;} #article h3.author {font-size: 14px;font-style: normal; text-transform: capitalize;} #binhluan .date {float: right;color: rgb(51, 51, 51);font-size: 12px;} #binhluan .comment-user{padding: 25px 0;border-bottom: 1px solid #ededed;} /*Sidebar Blog*/ .news-latest, .menu-blog {margin: 0 0 30px;position: relative;padding: 20px;border: 1px solid #e3e5ec;background:#fff;} .sidebarblog-title h2 { font-size: 18px; text-transform:uppercase; margin-bottom: 20px; padding-bottom: 10px; border-bottom: 2px solid #000000; text-align: center; } .sidebarblog-title h2 span {display: none;} .list-news-latest .item-article {border-bottom: 1px #efefef dotted;padding: 15px 0;margin: 0;} .list-news-latest .item-article:last-child{border-bottom:none;} .list-news-latest .item-article .post-image {width: 30%;float: left;position: relative;} .list-news-latest .item-article .post-content {width: 70%;float: left;padding-left: 10px;} .list-news-latest .item-article .post-content h3 {margin: 0 0 5px;font-size: 14px;} .list-news-latest .item-article .post-content span.author {font-size: 12px;} .menuList-links{margin:0;} .menuList-links li{position: relative;} .menuList-links li a {position: relative;font-size: 13px;display: block;} .menuList-links > li{border-bottom: 1px dashed #e7e7e7;} .menuList-links > li:last-child{border-bottom: none;} .menuList-links > li > a {color: #272727;padding:12px 0;font-weight: 500;font-size: 14px;} .menuList-links > li.has-submenu >a{padding-right:30px} .menuList-links > li.has-submenu span.icon-plus-submenu { width: 25px;height:25px;cursor: pointer; position: absolute;right: 0;top: 0;bottom: 0;margin: auto; border: 1px solid transparent; } .icon-plus-submenu:after, .icon-plus-submenu:before { background: rgba(9,9,9,0.6); content: '';display: block; position: absolute; margin-right:7px; top: 50%;right: 0; -moz-transition: all .25s linear;-o-transition: all .25s linear;-webkit-transition: all .25s linear;transition: all .25s linear; } .icon-plus-submenu:before{ width: 9px;height: 1px; -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); } .icon-plus-submenu:after { width: 1px; height:9px; right:4px; transform-origin: center; -moz-transform: translateY(-50%) scale(1, 1); -ms-transform: translateY(-50%) scale(1, 1); -webkit-transform: translateY(-50%) scale(1, 1); transform: translateY(-50%) scale(1, 1); } li.has-submenu.opened > a .icon-plus-submenu:after { -moz-transform: translateY(-50%) scale(1, 0); -ms-transform: translateY(-50%) scale(1, 0); -webkit-transform: translateY(-50%) scale(1, 0); transform: translateY(-50%) scale(1, 0); } .menuList-links > li.has-submenu .icon-plus-submenu:hover{border:1px solid #e7e7e7;} ul.menuList-links li ul.submenu-links{display: none;} ul.submenu-links li a{ padding: 8px 0 8px 0px;} li.has-submenu.level0 > ul.submenu-links{border-top: 1px dashed #e7e7e7} li.has-submenu.level0 > ul.submenu-links li a{padding-left:12px;} li.has-submenu.level1 > ul.submenu-links li a{padding-left:25px;} /*-------------------------------------------*/ /* 8. ABOUT - CONTACT */ /*-------------------------------------------*/ .page-wrapper ul, .page-wrapper ol {margin-bottom:15px;padding-left: 40px;} .page-wrapper ul {list-style-type: initial;} .header-page-contact h1{font-size:30px;font-weight:700;margin:0px 0} .header-page-contact:after { content: ""; display: block; width: 50px; height: 4px; margin-top: 20px; background:#272727; margin-bottom: 30px; } .box-info-contact li {margin-bottom: 30px;} .box-info-contact li p {margin-bottom: 0;color:#666;font-weight: 500;} .box-info-contact li p strong{font-weight:600;color:#272727;} .box-send-contact h2 {font-weight:700;font-size: 25px;margin:40px 0 35px;} .box-send-contact h2:after {content: "";display: block;margin-top: 25px;width: 30px;height: 3px;background:#272727;} .contact-form .input-group {width: 100%;margin-bottom: 20px;} .contact-form .input-group.textcontact{margin-bottom: 16px;} .contact-form .input-group input, .contact-form .input-group textarea{ border: 1px solid #e7e7e7; box-shadow: none; height: 45px; font-weight: 500; padding: 0 20px; background: #fff; color:#272727; width:100%; -webkit-appearance: none; appearance: none; } .contact-form .input-group textarea {width: 100%;height:130px;padding:20px 20px;resize: none;} .contact-form .input-group textarea:focus {outline: none;} .wrapbox-content-page-contact{padding:50px 15px 50px 50px;} .wrapbox-content-page {padding-bottom: 30px;} .sidebar-page .group-menu {margin: 0 0 30px;position: relative;padding: 20px;border: 1px solid #e3e5ec;} .sidebar-page .page_menu_title h2 { font-size: 18px; text-transform:uppercase; margin-bottom: 20px; padding-bottom: 10px; border-bottom: 2px solid #272727; text-align: center; } .sidebar-page .box_image {margin-bottom: 30px;} .box_image .banner {position: relative;overflow: hidden;} .box_image .banner img { width:100%; -webkit-transition: all 1s ease-in-out 0s; -khtml-transition: all 1s ease-in-out 0s; -moz-transition: all 1s ease-in-out 0s; -ms-transition: all 1s ease-in-out 0s; -o-transition: all 1s ease-in-out 0s; transition: all 1s ease-in-out 0s; -webkit-transform: scale(1); -khtml-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } .box_image .banner:hover img { -webkit-transform: scale(1.2); -khtml-transform: scale(1.2); -moz-transform: scale(1.2); -ms-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); } /*-------------------------------------------*/ /* 9. CART PAGE */ /*-------------------------------------------*/ #layout-cart .heading-cart {font-size:30px;text-transform: uppercase;margin: 0 0 25px;text-align: center;} #layout-cart .heading-cart.has-notify{ margin-bottom: 5px; } #layout-cart .list-pageform-cart .cart-row {background: #fafafa;padding: 15px; } #layout-cart .list-pageform-cart .cart-row:after {content: "";display: table;clear: both;} #layout-cart .list-pageform-cart .form-control {box-shadow: none;border-color:#dfe0e1;border-radius:0;resize: none;} #layout-cart .list-pageform-cart .title-number-cart {font-size: 13px;margin-top: 0;margin-bottom: 10px; } #layout-cart .list-pageform-cart .title-number-cart span{font-weight: 600;} #layout-cart .list-pageform-cart {margin-bottom: 25px;} #cartformpage:after {content: "";display: table;clear: both; } #cartformpage .table-cart { background: #fff; } #cartformpage .table-cart .item { padding-top: 10px; padding-bottom: 10px; display: flex; border-bottom: 1px solid #f1f1f1; } #cartformpage .table-cart .item:last-child { border-bottom: none; } #cartformpage .table-cart .item .left {display: inline-flex;width: 13%; padding: 0 20px;} #cartformpage .table-cart .item .left .item-img {margin: 0 auto; } #cartformpage .table-cart .item .right {display: inline-flex;width: 85%; } #cartformpage .table-cart .item .right .item-info {display: inline-flex;width: 40%;align-items: center; } #cartformpage .table-cart .item .right .item-info a {text-decoration: none;color: #000; display: inline-block;} #cartformpage .table-cart .item .right .item-info a .item-desc {font-size: 12px;color: #777;margin-top: 3px; } #cartformpage .table-cart .item .right .item-info a h3 {font-size: 14px;margin-bottom: 5px;} #cartformpage .table-cart .item .right .item-quan { display: inline-flex; width: 20%; align-items: center; justify-content: center; flex-direction: column; } #cartformpage .table-cart .item .right .item-quan .qty-click input.item-quantity { font-weight: 500; font-size: 15px;height: 25px; padding: 0;text-align: center; width: 35px;background: #ededed;border: 1px solid #dadbdd; border-radius: 0; float: left;-webkit-appearance: none; } #cartformpage .table-cart .item .right .item-quan .qty-click {float: left;} #cartformpage .table-cart .item .right .item-quan .qty-click button.qty-btn { background: #fff; font-weight: 500; font-size: 14px; color: #abafb2; height: 25px; padding: 0; text-align: center; width: 25px; border: 1px solid #dadbdd; border-radius: 0; float: left; -webkit-appearance: none; } #cartformpage .table-cart .item .right .item-quan .qty-click button.qtyplus.qty-btn{border-left: none;} #cartformpage .table-cart .item .right .item-quan .qty-click button.qtyminus.qty-btn{border-right: none;} #cartformpage .table-cart .item .right .item-quan .qty-click button.qty-btn:focus {outline: none;} #cartformpage .table-cart .item .right .item-price { display: inline-flex; width: 15%; flex-direction: column; justify-content: center; align-items: center; } #cartformpage .table-cart .item .right .item-price .price_item {font-size: 15px;font-weight: bold; } #cartformpage .table-cart .item .right .item-price del {font-size: 13px;color: #555; } #cartformpage .table-cart .item .right .item-price .label-percent {font-size: 13px;color: #777; } #cartformpage .table-cart .item .right .item-price .label-percent span {color: #E50000;font-size: 15px;font-weight: bold; } #cartformpage .table-cart .item .right .item-total-price { display: inline-flex; text-align: center; width: 25%; flex-direction: column; justify-content: center; font-size: 15px; font-weight: bold; color: #a73340; } #cartformpage .table-cart .item .right .item-total-price div span { display: block; font-weight: normal; font-size: 13px; color: #777; } #cartformpage .table-cart .item .right .item-total-price span.line-item-total { font-weight: bold; color: #7c7c7c; } #cartformpage .table-cart .item .right .item-total-price .remove a {display: block;margin-top:5px;} #cartformpage .table-cart .item .right .item-total-price .remove img {width: 16px;} #layout-cart .continue { display: block; // margin-top: 40px; text-align: right; margin-bottom: 5px; } #layout-cart .update-btn { display: inline-block; padding: 7px 20px; color: #fff; text-decoration: none; background: #000; float: right; border-radius: 0; } #layout-cart .order-summary-block { border: 1px solid #dfe0e1; padding: 0px 15px 24px 15px; // margin-bottom: 15px; } #layout-cart .order-summary-block .order-summary-title { font-size: 17px; font-weight: bold; margin-top: 10px; margin-bottom: 15px; } #layout-cart .order-summary-block .summary-subtotal span { font-weight: bold; float: right; } #layout-cart .order-summary-block .summary-subtotal span.warning { font-weight: normal; font-size: 13px; max-width: 55%; text-align: right; } #layout-cart .order-summary-block .summary-total { padding-bottom: 10px; border-top: 1px dotted #dfe0e1; padding-top: 15px; font-weight: bold; } #layout-cart .order-summary-block .summary-total:after { content: ""; display: table; clear: both; } #layout-cart .order-summary-block .summary-total p { margin-bottom: 5px; } #layout-cart .order-summary-block .summary-total span { font-weight: bold; float: right; } #layout-cart .order-summary-block .summary-total .shipping-note { font-size: 12px; color: #777; font-weight: 400; } #layout-cart .order-summary-block .summary-action { border-top: 1px dotted #dfe0e1; padding-top: 10px; text-align: center; } #layout-cart .order-summary-block .summary-action p { font-size: 13px; color: #777; font-weight: 400; text-align: left; } #layout-cart .order-summary-block .summary-action .checkout-btn { display: block; background: #000; color: #fff; text-decoration: none; text-transform: uppercase; padding: 10px 5px; text-align: center; font-size: 15px; font-weight: bold; border-radius: 0; width: 20% } #layout-cart .order-summary-block .summary-action .checkout-btn:hover { background: #000; } #layout-cart .order-summary-block .summary-action .checkout-btn.disable { pointer-events: none; background: #c7c7c7; } #layout-cart .get-code a.btn-check {padding: 6px 15px;} #layout-cart .empty-page-cart {margin-top: 15px; } #layout-cart .list-pageform-cart .policy_return h4 {margin-bottom: 5px;font-weight: 700;font-size: 14px;} #layout-cart .list-pageform-cart .policy_return li {display: block;line-height: 25px;position: relative;padding-left: 20px;overflow: hidden;} #layout-cart .list-pageform-cart .policy_return li:before { font-family: FontAwesome; font-style: normal; font-weight: normal; text-decoration: inherit; content: "\f178"; font-size: 10px; left: 0; opacity: 1; position: absolute; transition: all 0.4s ease-in-out 0s; -webkit-transition: all 0.4s ease-in-out 0s; -moz-transition: all 0.4s ease-in-out 0s; } .expanded-message .link-continue {margin: 15px 0;} @media (min-width: 992px){ .sidebar-cart-fix { position: -webkit-sticky; position: sticky; top: 40px; } } @media (max-width:991px) { #layout-cart .continue {margin: 10px 0;} #layout-cart .list-pageform-cart .policy_return h4 {margin:15px 0;} #layout-cart .content-product-list .pro-loop:nth-of-type(2n+1) {clear: both;} } @media (max-width:767px) { #layout-cart .list-pageform-cart .cart-row { margin-left: -15px; margin-right: -15px; } #cartformpage .table-cart .item .left { display: inline-block; width: 25%; } #cartformpage .table-cart .item .right { display: inline-block; width: 75%; position: relative; } #cartformpage .table-cart .item .right .item-info {display: block;width: 80%; } #cartformpage .table-cart .item .right .item-quan {display: block;width: 100%;margin-top: 10px;margin-bottom: 10px;float: left;} #cartformpage .table-cart .item .right .item-price { display: inline-block; width: 50%; float: left; } #cartformpage .table-cart .item .right .item-price .price_item {display: block; } #cartformpage .table-cart .item .right .item-price del {display: block; } #cartformpage .table-cart .item .right .item-price .label-percent {display: none!important;} #cartformpage .table-cart .item .right .item-total-price { display: inline-block; width: 50%; float: left; } #cartformpage .table-cart .item .right .item-total-price > div { position: absolute; bottom: 0; right: 10px; } #cartformpage .table-cart .item .right .item-total-price .remove { position: absolute; z-index:10; top: 0px; right: 10px; } #layout-cart .update-btn {margin-top: 10px; } } /*-------------------------------------------*/ /* 10. PAGINATION - 404 - SEARCH PAGE */ /*-------------------------------------------*/ .heading-page h1{font-size: 30px;font-weight: 700;margin-bottom: 30px;} .content-pagenot {margin: 50px 0;} .content-pagenot h1{font-weight: 700; font-size: 40px;} .content-pagenot p.subtext{font-weight: 500; opacity: 0.66;} .content-pagenot a{font-weight: 500;font-size: 16px;margin: 15px 0 0;display: inline-block;} .searchPage .heading-page{position: relative;text-align:center;padding: 30px 0 30px 0;} .searchPage .heading-page:after {content: "";background:#252a2b;display: block;width: 60px;height: 4px;margin: 25px auto 0;} .searchPage .heading-page h1{font-size: 30px;margin: 0 0 10px;} .wrapbox-content-search {padding-bottom: 30px;} .searchPage .subtxt {opacity: .66; margin-top: 15px;} .search-field {max-width: 600px;display: block;margin:auto;} input#go { width: 55px; height: 55px; float: right; background: url(//theme.hstatic.net/200000975066/1001334086/14/iconsearch.png?v=1083) #252a2b center no-repeat; margin: 0px; position: relative; top: 0; border-radius: 0; font-size: 0; border: 0; } #search .search_box{width: calc(100% - 55px);outline: none;height: 55px;padding: 0 20px;background: #ededed;border: 0;box-shadow: none;} .expanded-message .message-txt{width: 100%;padding-top: 25px;text-align:center;} .expanded-message .message-txt p{margin: 0; font-size: 14px;font-weight: 400;} .expanded-message h2{font-weight: 600; font-size: 22px;} .expanded-message .subtext {margin-bottom: 40px;display: block;} .search-item{ margin-bottom: 20px;position: relative;width: 100%;float: left;} .search-item .thumb-image { display: block; width: 80px; position: relative; overflow: hidden; float:left;} .search-item .thumb-image img{vertical-align:middle;-webkit-transition:transform 250ms linear;-moz-transition:transform 250ms linear;-o-transition:transform 250ms linear;transition:transform 250ms linear} .search-item .thumb-image:after{display:block;position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.1);transition:opacity 250ms linear;opacity:0;content:""} .search-item .content { float:left;padding-left:35px;width: calc(100% - 80px);} .search-item .content .title {font-size: 15px;font-weight: bold;text-transform: uppercase;display: block;} .search-item .content .caption {opacity: .66;display: block; margin-top: 5px;font-size: 14px;} .search-item .content .caption del{font-size: 13px; margin-left: 15px; opacity: 0.5;} .subtext-result{margin-bottom:30px;} .search-item:hover .thumb-image:after { opacity: 1;} /*-------------------------------------------*/ /* 11. ACCOUNT */ /*-------------------------------------------*/ .wrapbox-heading-account .header-page{position: relative;} .wrapbox-heading-account .header-page:after {content: "";background:#000;display: block;width: 60px;height: 4px;margin-top: 30px;} .wrapbox-heading-account .header-page h1{font-size: 40px;font-weight: 700;margin: 0px 0;line-height: initial;} .wrapbox-heading-account .header-page p{font-size: 14px;opacity: .66; margin: 20px 0 0 0;position: relative;} .wrapbox-heading-account .header-page p span{font-weight: 600;} .userbox h2 {font-size:20px;margin: 0 0 20px; font-weight: 600;} .large_form {margin-bottom:30px;} .icon-field {display:none;} .userbox input[type=email],.userbox input[type=password],.userbox input[type=text] { width: 100%; height: 55px; border: 1px solid transparent; background: #ededed; color: #272727; padding: 0 20px; font-weight: 500; -webkit-appearance: none; } .userbox input[type=email]:focus, .userbox input[type=password]:focus, .userbox input[type=text]:focus{background: #fff;border-color: #ededed;} .action_account_custommer .action_bottom,.action_account_custommer .req_pass{ display: inline-block;vertical-align: middle;} .action_account_custommer .req_pass{margin-left:20px;} .userbox .action_bottom {padding: 0;} .userbox .action_bottom .btn { display: inline-block; border-radius: 0; padding: 0 30px; height: 45px; line-height: 45px; text-transform: uppercase; font-weight: 600; background: transparent; } .req_pass{ color:#959898; font-weight: 500;} .come-back{margin-top:35px; display: block;font-weight: 500;} .come-back i{margin-right:20px} .userbox .errors a {color: red;} @-moz-keyframes ripple { 5%, 100% {opacity: 0;} 5% {opacity: 1;} } @-webkit-keyframes ripple { 5%, 100% {opacity: 0;} 5% {opacity: 1;} } @keyframes ripple { 5%, 100% {opacity: 0;} 5% {opacity: 1;} } #gender input[type="radio"] {display: none;} #gender input[type="radio"] + label {position: relative;cursor: pointer;padding-left: 28px;margin: 0 20px 0 0;} #gender input[type="radio"] + label:before, input[type="radio"] + label:after { content: ""; position: absolute; border-radius: 50%; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } #gender input[type="radio"] + label:before { top: 0; left: 0; width: 18px; height: 18px; background: #000000; -moz-box-shadow: inset 0 0 0 18px #efefef; -webkit-box-shadow: inset 0 0 0 18px #efefef; box-shadow: inset 0 0 0 18px #efefef; } #gender input[type="radio"] + label:after { top: 49%; left: 9px; width: 54px; height: 54px; opacity: 0; background: rgba(255, 255, 255, 0.3); -moz-transform: translate(-50%, -50%) scale(0); -ms-transform: translate(-50%, -50%) scale(0); -webkit-transform: translate(-50%, -50%) scale(0); transform: translate(-50%, -50%) scale(0); } #gender input[type="radio"]:checked + label:before { -moz-box-shadow: inset 0 0 0 4px #efefef; -webkit-box-shadow: inset 0 0 0 4px #efefef; box-shadow: inset 0 0 0 4px #efefef; } #gender input[type="radio"]:checked + label:after { -moz-transform: translate(-50%, -50%) scale(1); -ms-transform: translate(-50%, -50%) scale(1); -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); -moz-animation: ripple 1s none; -webkit-animation: ripple 1s none; animation: ripple 1s none; } /* order ---- account -- address */ .layout-info-account {padding-bottom:50px;} .title-infor-account{padding: 20px 15px;margin: 30px 0;} .title-infor-account h1{font-size: 37px;font-weight: 700;margin: 0;text-align: center;} .title-infor-account h1:after { content: ""; display: block; width: 60px; height: 4px; margin: 25px auto 0; background:#252a2b; } .title-detail{ text-transform: uppercase; font-size: 15px; font-weight: 700; letter-spacing: 1px; position: relative; border-bottom: 1px solid #ededed; padding-bottom:8px; } .sb-title:after{ content: ""; display: block; margin-top: 25px; width: 30px; height: 3px; background: #252a2b; } .name_account {font-weight: 500;font-size: 16px;line-height: 21px;margin:10px 0 5px} #customer_sidebar p{ margin-bottom: 0;font-size: 14px;} .customer-table-wrap {background: #f2f5fa; padding: 10px;} .customer-table-bg {background: #fff; padding: 10px;} .customer-table-bg p {margin:0;} #customer_orders table thead th, #order_details tr th { font-weight:600; font-size: 14px;} #customer_orders table tr a { font-weight: 500; float: left; width: 85%; margin-left: 3px; line-height: 20px; opacity: 0.66; } #customer_orders table, #order_details {width: 100%;background: #fff;} #customer_orders table tr, #order_details tr { height: 25px;line-height: 30px;} #customer_orders table tr.odd, #order_details tr {background: #fff;} #customer_orders table tr td, #order_details tr td {vertical-align: middle; border-top: none; font-size: 14px;} #customer_orders table tr td{padding-right: 8px;} #order_details tr td{ line-height:21px;} #order_details tr td a,#order_details b{font-weight:500;} #order_details tr th,#order_details tr td{padding: 8px;} #order_details tr td.order-image{width: 80px;} #order_details tr td.order-image a{display: block;width: 80px;border: 1px solid #ededed;} #order_details tr.order_summary.first{border-top: 1px solid #ededed;} #order_details tr td.total.money b{font-weight: 600;} a#view_address {font-weight: 500; opacity: 0.8;} #customer_orders,#order_payment, #order_shipping{ margin-bottom: 30px; margin-top: 30px;} .customer-table-bg .table>tbody>tr>th {border-top: none;} .detail-table-order { margin-top: 30px;} .name-order {margin-bottom: 5px;font-size: 16px;line-height: 20px;font-weight: 500;text-transform: uppercase;} .order_section_title { font-size: 15px; font-weight: 600; line-height: 20px; margin: 0 0 10px; padding: 10px 0px; position: relative; text-transform: uppercase; } .order_date {font-weight: normal;font-size: 14px;text-transform: none;} .text_status {font-weight: 500;} .address p {margin-bottom: 5px;} .account-order .address {margin: 0px 0px 30px;padding: 10px;background-color: #fbfbfb;} span.variant_acc { font-size: 13px; opacity: 0.8;} .alert-info {border-radius: 0; margin-bottom: 0;} .address_title { margin-bottom: 0; font-size: 16px; padding: 10px 70px 10px 10px; background-color: #d9edf7; border-color: #bce8f1; position: relative; } .address_table {margin-bottom: 10px;border-top: 0px solid #ddd;background: #f2f5fa;padding:15px;} .address_title h3 { margin: 0;font-size: 14px;} .account-address .note { border: none; padding: 0;} p.address_actions.text-right {margin:7px 5px 0px 0;position: absolute;z-index: 9;top:0;right:0;} .action_link a {text-transform: uppercase; font-size: 15px;} span.action_link {padding: 5px;} .view_address p > b {font-weight: 500; font-size: 14px;} .view_address p { margin: 5px 0; line-height: 15px;font-size: 14px;} .add-new-address { padding-bottom: 10px; display: inline-block; padding: 10px; background:#000000; color:#fff!important; text-transform: uppercase; } .add-new-address:focus { color:#fff;} .account-address .input-group-addon{display:none} .input-group .input-group-addon { padding: 6px 10px; border-radius: 0; color: #DAD9D9; background-color: #ebebeb; border-color: #ebebeb; } .input-group .form-control { -webkit-border-radius: 0; border-radius: 0; -webkit-box-shadow: none; box-shadow: none; border-color: #ebebeb; } .icon-user:after {content: url(//hstatic.net/0/0/global/design/theme-default/userico.png);} .icon-envelope:after {content: url(//hstatic.net/0/0/global/design/theme-default/email.png);} .icon-shield:after {content: url(//hstatic.net/0/0/global/design/theme-default/pass.png);} .layout-info-account .action_bottom .btn { height: 35px; line-height: 35px; outline: 0; margin-right: 5px; font-size: 14px; text-transform: uppercase; padding: 0 30px; border: 0; background:#000000; color: #fff; display: inline-block; border-radius: 0; } .AccountTitle{ text-transform: uppercase; margin-bottom: 30px; font-size: 15px; font-weight: 700; letter-spacing: 1px; position: relative; } .AccountList ul > li > a {display: block; position: relative; padding: 5px 0px;} .AccountList ul > li > a:before { content: "\f192"; font-family: "FontAwesome"; font-size: 8px; display: inline-block; margin-right: 8px; vertical-align: 2px; } #order_cancelled {margin-bottom:15px;} #order_cancelled h5 {margin:0;} .address_table .customer_address .input-group, #add_address .input-group{margin: 15px 0;} /*-------------------------------------------*/ /* 12. MAIN SIDEBAR */ /*-------------------------------------------*/ /* search sidebar */ form.searchform{position: relative;margin-top: 18px;margin-bottom: 15px;} form.searchform input.searchinput { background: #fff; border: 1px solid #ebebeb; width: 100%; height: 45px; font-size: 14px; font-weight: 500; padding: 0 55px 0 15px; margin: 0; display: inline-block; border-radius: 0; -webkit-appearance: none; appearance: none; } form.searchform .btn-search{ width: 55px; height: 45px; line-height: 45px; position: absolute; padding: 0; top: 0px; right: 0px; background: #000000; border: 0; border-radius: 0; overflow: hidden; } form.searchform .btn-search svg{width:18px;height:45px;fill: #fff;} form.searchform input.searchinput:focus {border-color: #000000;outline: none;} /* Search auto */ .smart-search-wrapper{width:100%;background: #fff; z-index: 100;float: left;} .smart-search-wrapper .item-ult{padding: 10px; border-bottom: 1px dotted #dfe0e1;clear: both;width: 100%;float: left;} .smart-search-wrapper .item-ult .thumbs{width: 40px;display: inline-block;text-align: right;} .smart-search-wrapper .item-ult .title {width: calc(100% - 40px);padding-right:5px;float: left;line-height: 20px;position: relative;margin-top:0px!important;} .smart-search-wrapper .item-ult .title a{ font-size: 12px;text-overflow: ellipsis;overflow: hidden; white-space: pre; float: left;width: 100%;margin-bottom: 4px;} .smart-search-wrapper .item-ult .title p{line-height: 15px;font-size: 12px;font-weight:500;float:left;margin:0;} .smart-search-wrapper .item-ult .title p del{ font-size: 11px;margin-left:5px;color: #797979;font-weight:400;} .resultsMore {width: 100%;float: left;} .resultsMore a{text-align: center; display: block; font-size: 14px;padding: 10px 0;font-weight: 500;} .dataEmpty{text-align: center; padding: 10px 0;} /* cart view */ /* menu */ @media (max-width:767px) { html,body,.scroller {-webkit-overflow-scrolling: touch;} html.open-menu,body.open-menu,.scroller {height: 100%;} html.open-menu, body.open-menu{position: relative;overflow: hidden;} .main-body {position: relative;height: 100%;} } /*---------------------------------------*/ /* 13. RESPONSIVE */ /* --------------------------------------*/ @media(min-width:768px){ table.table-cart tr td.remove {position:absolute;right: 15px;} } @media(min-width:992px) and (max-width:1199px){ /*header*/ .desk-menu > ul>li>a{margin: 0 8px;font-size: 10px;} /*index */ .box-banner-inf{width: 80%; z-index:4;} /*account*/ .wrapbox-content-account{padding: 100px 15px 100px 50px;} } @media(min-width:992px){ .wrapbox-heading-account {display:flex;display:-webkit-flex;-webkit-align-items:center;align-items:center;height: 100vh;border-right: 1px solid #ededed;} .wrapbox-heading-account .header-page{padding-bottom: 70px; } .box-heading-contact{ position: -webkit-sticky; position: sticky; top: 0; border-right: 1px solid #ededed; height: 100vh; padding:0; } .box-map iframe{height:100vh!important} /**** COLLECTION ****/ .sidebar-fix { position: -webkit-sticky; position: sticky; top: 70px; margin-top: 30px; } /**** BLOG ****/ .list-article-content .news-content{height: 50vh;} } @media(min-width:1200px){ .wrapbox-content-account{ padding: 100px 15px 100px 50px; display: flex; display: -webkit-flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; height: 100vh; } .wrapbox-content-account > div {width:100%;} .block-banner-category img{ -webkit-transition: -webkit-transform 8s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: -webkit-transform 8s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: transform 8s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: transform 8s cubic-bezier(0.25, 0.46, 0.45, 0.94),-webkit-transform 8s cubic-bezier(0.25, 0.46, 0.45, 0.94); } .block-banner-category:hover img{ -ms-transform: scale(1.2); -webkit-transform: scale(1.2); transform: scale(1.2); } .box-banner-inf{z-index:4;} .wrapbox-content-search {padding: 0 100px 30px;} } @media(max-width:991px) and (min-width:768px){ .main-header .container{width: initial;} .wrapbox-heading-account .header-page{text-align: center;padding-top:50px; } .wrapbox-heading-account .header-page:after {margin: 30px auto 0;} .wrapbox-content-account{padding: 50px 15px 50px;} .box-heading-contact{height: 50vh;border-bottom: 1px solid #ededed;} .box-map iframe{height:50vh!important} /* INDEX */ .caption_banner h2{ font-size: 24px;} /* COLLECTION */ .no-product{text-align:center} /* PRODUCT DETAIL*/ .gallery-index.icon-pr-fix {display: none;} .divzoom_main .product-thumb{display: -webkit-flex;display: flex;-webkit-align-items: center;align-items: center;} .box__product-gallery{height:100vh;overflow: visible;min-height: 720px;} .slide_product{ width: 100%;height: 100%;} .slide_product li.gallery-item{height:100%;width:100%;display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center} .box__product-gallery.scroll .site-box-content:after {content: 'flickity';display: none;} /* BLOGS */ .list-article-content .news-content{height: 50vh;} /* Footer */ footer.main-footer .col-lg:nth-of-type(2n+1) {clear: both;} } @media(max-width:991px) { .wrapper-upper-logo .wrap-logo img{max-height: 60px;} .promo-bar {font-size: 10px;} .block .title_block {position: relative;display: inline-block;margin:0 0 5px;} .block .title_block span {display: block;top:8px;right:10px;position: absolute;} .block .block_content {display: none;} .filter-default {padding: 0 15px;} .product-image-detail {width:100%;padding:0;} .flickity-page-dots {bottom:-55px; z-index:2;} .product-title h1 {font-size:20px; margin-top:65px;} #collection-slide .owl-nav .owl-prev {left: 0;} #collection-slide .owl-nav .owl-next {right: 0;} /* COLLECTION */ .wrap-collection-title .heading-collection {margin: 0;} .wrap-collection-title .heading-collection h1 {font-size: 20px; text-align:center;margin: 20px 0;} .no-product{text-align:center} .wrapper-collection-1 .pro-loop{padding-right:7.5px;padding-left:7.5px;} .wrapper-collection-1 .pro-loop:nth-child(7), .wrapper-collection-1 .pro-loop:nth-child(8), .wrapper-collection-1 .pro-loop:nth-child(9), .wrapper-collection-1 .pro-loop:nth-child(10){display: none;} #collection-body .pro-loop:nth-child(odd), .list-productRelated .pro-loop:nth-child(odd){ padding-right:7.5px; padding-left:7.5px; } #collection-body .pro-loop:nth-child(even), .list-productRelated .pro-loop:nth-child(even){ padding-left:7.5px; padding-right:7.5px; } .wrapper-collection-2 .pro-loop {float: left;width: 50%;padding: 0 7.5px;} .wrapper-collection-2 .pro-loop:nth-child(5), .wrapper-collection-2 .pro-loop:nth-child(6), .wrapper-collection-2 .pro-loop:nth-child(7), .wrapper-collection-2 .pro-loop:nth-child(8), .wrapper-collection-2 .pro-loop:nth-child(9), .wrapper-collection-2 .pro-loop:nth-child(10){display: none;} .wrapper-collection-1 .pro-loop:nth-of-type(2n+1), .wrapper-collection-2 .pro-loop:nth-of-type(2n+1){clear: both;} /* BLOG - ARTICLE */ .blog-loop:nth-of-type(2n+1) {clear: both;} .sidebar-blog .layered, .sidebar-page .layered {display: none;} .wrapbox-content-account .action_account_custommer, .wrapbox-content-account .req_pass {text-align:center;} /* PRODUCT */ .product-description .description-content.short { height: 200px; padding-bottom: 50px; overflow: hidden; position: relative; transition: height 0.5s ease-in; } .product-description #detail_more { display: block; position: absolute; bottom: -15px; left: 0; width: 100%; text-align: center; text-transform: uppercase; line-height: 50px; display: block; padding: 20px 0; background: -moz-linear-gradient(268deg, rgba(255, 255, 255, 0.55) 0%, white 82%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0.55)), color-stop(82%, white)); background: -webkit-linear-gradient(268deg, rgba(255, 255, 255, 0.55) 0%, white 82%); background: -o-linear-gradient(268deg, rgba(255, 255, 255, 0.55) 0%, white 82%); background: -ms-linear-gradient(268deg, rgba(255, 255, 255, 0.55) 0%, white 82%); background: linear-gradient(182deg, rgba(255, 255, 255, 0.55) 0%, white 82%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#FFFFFF',GradientType=0 ); } .product-description #detail_more span {display: inline-block;border: 1px solid #222;line-height: 30px;padding: 0px 20px;background: #fff;} .product-description .description-content.open #detail_more {background: transparent;} .product-gallery-item img {width:100%;} .icon-pr-fix{position: absolute; bottom:25px;} .product-sharing.icon-pr-fix {left: 15px;} .product-zoom.icon-pr-fix { right: 0;left: 0;margin: auto;} .gallery-index.icon-pr-fix {display: none;} } @media(max-width:767px){ .wrapbox-heading-account {padding: 30px 15px;border-bottom: 1px solid #ededed;} .wrapbox-heading-account .header-page{text-align: center;} .wrapbox-heading-account .header-page h1 {font-size: 20px;} .wrapbox-heading-account .header-page:after {margin: 20px auto 0;} .wrapbox-content-account{padding:15px;} .heading-page{position: relative;text-align:center;padding: 0 0 30px 0;} .heading-page:after {content: "";background:#252a2b;display: block;width: 60px;height: 4px;margin: 25px auto 0;} .heading-page h1{font-size: 20px;margin: 0px 0;} .wrapbox-content-page-contact{padding:40px 15px;} /* HEADER*/ .wrapper-upper-logo .wrap-logo img{max-width: 160px;} /* INDEX */ .wrapper-heading-home .heading {justify-content: center;} .list-slider-banner .slick-arrow.slick-prev {left:15px;} .list-slider-banner .slick-arrow.slick-next {right:15px;} .wrapper-heading-home h2{font-size: 20px;} .caption_banner h2{font-size:20px;} .wrap-collection-title h2,.wrap-collection-title .link-more{font-size:20px;} .wrap-collection-title.image-resize{padding-top: 0px;} .box-banner-inf{width: 100%;padding: 0 15px;z-index:4;text-align: center;} .box-banner-inf h2{font-size:32px;} .homepage-images .box-image { -webkit-flex-basis: 100%!important; -ms-flex-preferred-size: 100%!important; flex-basis: 100%!important; max-width: 100%!important; padding: 5px; } .homepage-images .box-image .box-image-title {font-size:14px;} .wrap-pd-infor {flex-wrap: wrap;} .wrap-pd-infor .inf-content {padding-right:0;} /* PRODUCT DETAIL */ .product-image-detail{border-bottom: 1px solid #ededed;} .divzoom_main .product-thumb{display: -webkit-flex;display: flex;-webkit-align-items: center;align-items: center;} .box__product-gallery{overflow: visible; min-height: 450px;} .slide_product{ width: 100%;height: 100%;} .slide_product li.gallery-item { height: 100%; width: 100%; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; } .box__product-gallery.scroll .site-box-content:after {content: 'flickity';display: none;} .slide_product li.gallery-item img{width: 100%;object-fit: cover;} .slide_product .flickity-page-dots{bottom: -45px;z-index: 9;} .product-action-bottom { position: fixed; left: 0; bottom: 0; right: 0; top: auto!important; z-index: 700; background: #fff; box-shadow: 0 0 4px rgba(0, 0, 0, 0.2); padding: 8px 10px; display:block } .input-bottom{width: 54px;float:left;margin-right: 15px;} .input-bottom input{ width: 54px; height: 45px; border: 1px solid #d1d1d1; text-align: center; outline: none; box-shadow: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; } .add-cart-bottom{font-weight: 600;height: 45px;width: calc(100% - 70px);border-radius: 4px;float:left} .list-productRelated .pro-loop-title .product-resize, .list-productRelated .pro-loop-title .wrap-collection-title.image-resize{height: initial!important} .list-productRelated .wrap-collection-title.image-resize{padding-bottom:45px;} .list-productRelated .wrap-collection-title .block-pding:after{ content: ""; display: block; width: 50px; height: 4px; margin: 30px auto auto; background:#252a2b; } .main-footer.main-product-footer {padding-bottom: 60px;} /* BLOG - ARTICLE */ .list-article-content .news-content{ min-height: 250px;height: 50vh;} .article-body h2.title-article {font-size: 24px;} .sidebarblog-title h2 {text-align: center;margin-bottom: 10px;} .sidebarblog-title h2 span {display: inline-block;} .blog-posts .blog-post .blog-post-thumbnail {margin-bottom: 20px;} /* ABOUT-CONTACT */ .box-heading-contact{padding:0;} .header-page-contact h1{font-size:35px;} .box-send-contact h2{font-size:20px} .box-map iframe{height:50vh!important} /* CART PAGE */ table.table-cart thead tr{display:none;} table.table-cart tr td{ border:0;padding:0 5px;} table.table-cart tbody>tr { background:#ffffff; padding:20px 0; display: block; border-radius: 2px; -webkit-border-radius: 2px; border-bottom: 1px solid #e8e8e8; position: relative; margin-bottom: 10px; } table.table-cart tr td.image{width:80px;float:left;} table.table-cart tr td.image img { max-width:70px;background:#fff} table.table-cart tr td.item { width:calc(100% - 80px); float: left; padding-left:5px;} table.table-cart tr td.item h3 {margin: 0 0 5px;display: block;padding-right: 20px;} table.table-cart tr td.qty {padding: 0px;float: right; margin-right: 8px;text-align: right;position: absolute;right: 0px;bottom: 35%;} table.table-cart tr td.item .price {width: 100%;float: left;text-align: left;margin: 15px 0;} table.table-cart tr td.item .price del{margin-top:2px;} table.table-cart tr td.item .price span.text{display:inline-block;font-size:12px;} table.table-cart tr td.remove a {position: absolute; top: 22px; right: 0;} table.table-cart tbody>tr:last-child, table.table-cart tr:last-child td {border: none;} .checkout-note textarea {margin-bottom:40px;} .cart-buttons .btn-checkout, .cart-buttons a, .cart-buttons .btn-update { font-size: 10px; margin:0; padding: 15px 8px; } /* ACCOUNT */ .title-infor-account h1 {font-size: 30px;} .title-infor-account h1:after{margin-top:32px;} .AccountSidebar {margin-bottom: 40px;} .table-responsive {padding: 0 8px;} #order_details tr td.title{max-width: initial!important;} /* FOOTER */ .footer .collapse {display: none;visibility: hidden;} .footer .collapse.in {display: block;visibility: visible;} .main-footer .footer-content {display: none;margin-top: 10px;} .main-footer .footer-col {margin-bottom:0;} .main-footer .footer-title {line-height: 20px;position: relative;font-size: 14px;text-transform: uppercase;margin: 0px;padding: 10px 0;} .main-footer h4.footer-title:before { content: "\f107"; font-family: "FontAwesome"; font-size: 14px; position: absolute; top: 0px; right: 5px; text-align: center; line-height: 36px; } .main-footer h4.footer-title.active:before {content: "\f106";} .main-footer .col-lg:last-child .footer-col {border-bottom: none;} .breadcrumb-shop .breadcrumb-arrows li {font-size:10px;} } /* ============ ADDTHIS ** addthis ============== */ .fb_dialog_advanced.fb_customer_chat_bubble_animated_no_badge{ right: 12px!important;;} .addThis_listSharing { position: fixed;bottom:85px;z-index: 999; right:-15px;opacity: 0; visibility: hidden; transition: all .3s ease; -webkit-transition: all .3s ease;-moz-transition: all .3s ease;-o-transition: all .3s ease; } .addThis_listSharing.is-show{right: 0;opacity: 1; visibility: visible;} .addThis_listing .addThis_item{margin-bottom:5px;margin-right:24px;} .addThis_listing .addThis_item .addThis_item--icon { position: relative;display: inline-block;text-align: center; width: 44px;height: 44px;line-height: 44px;color: #fff; border-radius: 50%;cursor: pointer;box-shadow: 0 2px 5px 0 rgba(0,0,0,.11); background-size: auto;background-repeat: no-repeat;background-position: center; } .addThis_listing .addThis_item .addThis_item--icon .tooltip-text { position: absolute;top: 4px;right: 55px;z-index: 9; height: 32px;line-height: 26px;padding:3px 10px; width: auto;border-radius: 5px;font-size: 11px;color: #fff;text-align: center; white-space: nowrap;cursor: pointer;background-color: rgba(0, 0, 0, 1); visibility: hidden;opacity: 0; -ms-transition: all 200ms linear ;-webkit-transition: all 200ms linear ;transition: all 200ms linear ; } .addThis_listing .addThis_item .addThis_item--icon .tooltip-text:after{ content: "";width: 0;height: 0; border-width:5px;border-style: solid; border-color: transparent transparent transparent rgba(0, 0, 0, 1); position: absolute;left: 100%;top: 0;bottom: 0;margin: auto; -ms-transition: all 200ms linear ;-webkit-transition: all 200ms linear ;transition: all 200ms linear ; } .addThis_listing .addThis_item .addThis_item--icon:hover {text-decoration: none; opacity: .9;box-shadow: 0 5px 10px rgba(0,0,0,.15), 0 4px 15px rgba(0,0,0,.13);} .addThis_listing .addThis_item .addThis_item--icon:hover .tooltip-text{visibility: visible;opacity: 1;} .actionToolbar_mobile { position: fixed;bottom: 0;left: 0; right: 0;margin: 0 auto;z-index: 999; height:45px;width: 100%;border-top: 1px solid #e7e7e7;background: #fff; padding:5px 10px; } .actionToolbar_mobile ul.actionToolbar_listing{ margin:0; display: -webkit-flex;display: -moz-flex;display: flex; -webkit-justify-content: space-between;justify-content: space-between; -webkit-align-items: center;align-items: center; } .actionToolbar_mobile ul.actionToolbar_listing li{width: 20%;float: left;} .actionToolbar_mobile ul.actionToolbar_listing li a {display: block;color: #696969;font-size: 12px;text-align: center;position: relative;} .actionToolbar_mobile ul.actionToolbar_listing li a svg {fill: #696969;width: 35px;height: 35px; display: inline-block;vertical-align: middle;} .actionToolbar_mobile ul.actionToolbar_listing li.actionToolbar_chatbot a .messenger_absolute {margin-top: -25px;display: inline-block;vertical-align: top;} .actionToolbar_mobile ul.actionToolbar_listing li.actionToolbar_chatbot a svg{width:44px;height:44px;} /* modal- center */ .modal-addThis{text-align: center;font-size: 0;background: rgba(3, 17, 27, 0.7);-webkit-transition: opacity .35s linear;-o-transition: opacity .35s linear;transition: opacity .35s linear;} .modal-addThis:before{content: '';display: inline-block;height: 100%;vertical-align: middle;margin-right: -4px;} .modal-addThis.fade .modal-dialog{-webkit-transform: translate(0,0);-ms-transform: translate(0,0);-o-transform: translate(0,0);transform: translate(0,0);} .modal-addThis .modal-dialog-centered .modal-content {width: 100%; } .modal-addThis .modal-dialog-centered{margin: 30px auto 50px;display: inline-block;text-align: left;vertical-align: middle;font-size: 14px;} .modal-addThis.fade .modal-dialog-centered { opacity: 0; -webkit-transform: scale(0.8);-moz-transform: scale(0.8);-ms-transform: scale(0.8);transform: scale(0.8); -webkit-transition: all .2s;-moz-transition: all .2s;-ms-transition: all .2s;transition: all .2s; } .modal-addThis.fade.in .modal-dialog-centered { opacity: 1;-webkit-transform: scale(1);-moz-transform: scale(1); -ms-transform: scale(1);transform: scale(1);} @media (max-width: 767px) { .modal-addThis .modal-dialog-centered{margin: 35px 10px 50px 14px;} } .modal-backdrop.in {display: none;opacity: 0!important;} /* modal-succes */ .modal-succes .modal-body .modal-title{font-size: 18px;font-weight: 600;margin:0;} .modal-succes .modal-body p:not(.modal-title){font-size: 15px;margin:10px 0 5px} .modal-succes .modal-body .txtloading{color: #aaa;font-size: 13.5px;} @keyframes rotatePlaceholder{0%{-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg)}5%{-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg)}12%{-webkit-transform:rotate(-405deg);-moz-transform:rotate(-405deg);-o-transform:rotate(-405deg);transform:rotate(-405deg)}100%{-webkit-transform:rotate(-405deg);-moz-transform:rotate(-405deg);-o-transform:rotate(-405deg);transform:rotate(-405deg)}} @keyframes animateSuccessTip{0%{width:0;left:1px;top:19px}54%{width:0;left:1px;top:19px}70%{width:50px;left:-8px;top:37px}84%{width:17px;left:21px;top:48px}100%{width:25px;left:14px;top:45px}} @keyframes animateSuccessLong{0%{width:0;right:46px;top:54px}65%{width:0;right:46px;top:54px}84%{width:55px;right:0px;top:35px}100%{width:47px;right:8px;top:38px}} .modal-icon.sweet-alert {padding-top: 15px;} .animateSuccessTip {animation: animateSuccessTip 0.75s;} .animateSuccessLong {animation: animateSuccessLong 0.75s;} .sa-icon.sa-success.animate::after {animation: rotatePlaceholder 4.25s ease-in;} .sweet-alert .sa-icon.sa-success{width:80px;height:80px;border:4px solid #4cae4c;border-radius:50%;margin:20px auto 0;position:relative;box-sizing:content-box} .sweet-alert .sa-icon.sa-success::before,.sweet-alert .sa-icon.sa-success::after{content:'';border-radius:50%;position:absolute;width:60px;height:120px;background:#fff;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg)} .sweet-alert .sa-icon.sa-success::before{border-radius:120px 0 0 120px;top:-7px;left:-33px;-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transform-origin:60px 60px;-moz-transform-origin:60px 60px;-o-transform-origin:60px 60px;transform-origin:60px 60px} .sweet-alert .sa-icon.sa-success::after{border-radius:0 120px 120px 0;top:-11px;left:30px;-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transform-origin:0px 60px;-moz-transform-origin:0px 60px;-o-transform-origin:0px 60px;transform-origin:0px 60px} .sweet-alert .sa-icon.sa-success .sa-placeholder{width:80px;height:80px;border:4px solid rgba(92, 184, 92, 0.2);border-radius:50%;box-sizing:content-box;position:absolute;left:-4px;top:-4px;z-index:2} .sweet-alert .sa-icon.sa-success .sa-fix{width:5px;height:90px;background-color:#fff;position:absolute;left:28px;top:8px;z-index:1;-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg)} .sweet-alert .sa-icon.sa-success .sa-line{height:5px;background-color:#5cb85c;display:block;border-radius:2px;position:absolute;z-index:2} .sweet-alert .sa-icon.sa-success .sa-line.sa-tip{width:25px;left:14px;top:46px;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg)} .sweet-alert .sa-icon.sa-success .sa-line.sa-long{width:47px;right:8px;top:38px;-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform:rotate(-45deg)} /* modal-contactform */ .modal-contactform .modal-header h4.modal-title {text-align: center;font-size: 18px;font-weight: 500;} .modal-contactform .modal-header .close { margin-top: -10px;opacity: 0.5;font-size: 26px;width: 30px; margin-right: -8px;} .modal-contactform .content_popupform .input-group{ width: 100%;margin:0 0 15px;} .modal-contactform .content_popupform .input-group input, .modal-contactform .content_popupform .input-group textarea{border: 1px solid #e7e7e7;box-shadow: none;height: 40px;font-weight: 500;padding:5px 20px;background: #fbfbfb;color: #252a2b;width: 100%;-webkit-appearance: none;} .modal-contactform .content_popupform .input-group textarea{resize: none;height:80px;} /* - Harafunnel mobile */ .harafunnel-mb { position: fixed;right: 10px;bottom:60px; z-index: 9999;width: 65px;height: 65px;padding:8px; background: #fff; border-radius: 50%; box-shadow: 0 3px 12px rgba(0, 0, 0, .15); transition: box-shadow 150ms linear; } .harafunnel-mb:hover {box-shadow: 0 5px 24px rgba(0, 0, 0, .3);} .harafunnel-mb a {display: block;} .harafunnel-mb a svg{width:100%;height:100%;} @media(min-width:992px){ .modal-addThis.modal-contactform .modal-dialog{width: 600px;} .modal-addThis.modal-succes .modal-dialog{width:450px;} } @media(max-width:767px){ .mainfooter-toolbar{margin-bottom: 50px;} .mainfooter-product {margin-bottom: 60px;} .actionToolbar_product{ opacity: 0; visibility: hidden; -webkit-transform: translateY(100%);transform: translateY(100%); -webkit-transition: all .3s ease;transition: all .3s ease; } .product-action-bottom { position: fixed;left: 0;bottom:0;right: 0; z-index: 9;background: #fff;display:block; box-shadow: 0 0 4px rgba(0, 0, 0, 0.2); padding: 8px 10px; -webkit-transition: padding .3s ease;transition: padding .3s ease; } .layoutProduct_scroll.scroll-down .actionToolbar_product{ opacity: 1; visibility: visible; -webkit-transform: translateY(0px);transform: translateY(0px); } .layoutProduct_scroll.scroll-down .product-action-bottom{padding-bottom:60px;} } /*===== APP COMBO - BUY X TANG Y ============================================*/ .modal-productApp{text-align: center;font-size: 0px;background: rgba(3, 17, 27, 0.7);-webkit-transition: opacity .35s linear;-o-transition: opacity .35s linear;transition: opacity .35s linear;} .modal-productApp:before {content: '';display: inline-block;height: 100%;vertical-align: middle;margin-right: -4px;} .modal-productApp.fade .modal-dialog{-webkit-transform: translate(0,0);-ms-transform: translate(0,0);-o-transform: translate(0,0);transform: translate(0,0);} .modal-productApp .modal-dialog-centered .modal-content {width: 100%; } .modal-productApp .modal-dialog-centered{margin: 35px auto 50px;display: inline-block;text-align: left;vertical-align: middle;font-size: 14px;} .modal-productApp.fade .modal-dialog-centered { opacity: 0; -webkit-transform: scale(0.8);-moz-transform: scale(0.8);-ms-transform: scale(0.8);transform: scale(0.8); -webkit-transition: all .2s;-moz-transition: all .2s;-ms-transition: all .2s;transition: all .2s; } .modal-productApp.fade.in .modal-dialog-centered { opacity: 1;-webkit-transform: scale(1);-moz-transform: scale(1); -ms-transform: scale(1);transform: scale(1);} .modal-productApp .modal-footer {padding: 15px;text-align: center;} .modal-productApp .modal-footer .button{margin:0 5px;} .modal-productApp .modal-header{padding:15px 20px ;} .modal-productApp .modal-header .name-combo, .modal-productApp .modal-header .modal-title {margin: 0;font-weight: bold;font-size:22px;padding: 0px 30px 0px 0px;} .modal-productApp .modal-header .combo-title {margin:10px 0 0;font-size: 14px; font-weight: bold;} .modal-productApp .modal-header .close-modal-app {display: inline-block;position: absolute;background-color: #ffffff;width: 30px;height: 30px; border-radius: 50%; border: 1px solid #333; right: 13px;top: 9px;z-index: 9; opacity: 1;margin: 0;} .modal-productApp .modal-header .close-modal-app svg {display: inline-block;fill: currentColor;position: relative;width: 12px;line-height: 30px;margin-top:-2px;} #combo-program {max-height:400px; overflow: auto;} #combo-program .combo-title b {color: #ff0707;} #combo-program .combo-w {border: 0;margin-bottom:0px;padding:0px 10px 0px 40px;position: relative;} #combo-program .combo-w:after {content: '\2714\fe0e';font-size: 16px;position: absolute;top: calc(50% - 11px);left: 11px;color:#93c3c4;opacity: 0;} #combo-program .combo-w:before {content: '';width: 20px;height: 20px;border: 1px solid #e1e1e1;border-radius: 3px;position: absolute;top: calc(50% - 10px);left: 7px;} #combo-program .combo-w.checked:after {opacity: 1;} #combo-program .combo-w.checked:before {border: 1px solid #000000;} #combo-program table tr {margin-bottom: 3px;} #combo-program table tr:first-child td { border-top:0; } #combo-program table label {font-weight: normal;font-size: 13px;display: block;border: none;padding: 2px 5px;cursor: pointer;} #combo-program table label:after {content: "";display: table;clear: both;} #combo-program table label img {display: inline-block;width:85px; float: left;} #combo-program table label p {display: inline-block;width: calc(100% - 85px);float: left;margin-bottom: 0px;padding-left: 15px;} #combo-program table label .discount-promotion-price b {color: #fa0303;} #combo-program table label .discount-promotion-price del {margin-left: 5px;} #combo-program table input {display: none;} #combo-program table input:checked + label {color: #000;background: #fff8f8;} #buyxgety-program {margin:20px 0;border: 2px dotted #000000;padding:10px;position: relative;min-height: 100px;z-index: 0;} #buyxgety-program .buyxgety-heading{padding:5px 10px;position: relative;padding-right:60px;} #buyxgety-program .buyxgety-heading h3{font-size: 18px;font-weight: 600;margin: 0 0 4px;} #buyxgety-program .buyxgety-heading:after { content: ""; position: absolute;width:35px;height:35px;right: 10px; top:6px; background-image: url(//theme.hstatic.net/200000975066/1001334086/14/appbuyxgety-icon.png?v=1083); background-repeat: no-repeat;background-size: contain; } #buyxgety-program .modal-body{padding:15px 30px;} .buyxgety_item {display: -webkit-flex;display: flex;padding: 5px 10px 10px;} .buyxgety_item .buyxgety_checkbox {width:35px;float: left;padding-top:7px;} .buyxgety_item .buyxgety_image {width: 60px;float: right;} .buyxgety_item .buyxgety_item_title{width:calc(100% - 95px);float: right;padding-left:15px;} .buyxgety_item .buyxgety_list_variant select{font-size: 94%; font-style: italic;min-width:110px; outline: none; padding: 1px 15px 2px; margin:2px 0 5px;} .buyxgety_item .buyxgety_checkbox input[type=radio]{cursor: pointer;width:15px;height:15px;} /* edit +++ .pro-loop .product-img .sold-out == bottom:10 .qty-click input.item-quantity table.table-cart tr td.item h3 .selector-actions */ .pro-loop .product-img .product_gift_label {width: 25px;position: absolute;top: 10px;right: 10px;z-index:1;} .product-loop-special .product-col-left{position: relative;} .product-loop-special .product-col-left .product_gift_label{position: absolute;width: 50px;top: 15px; z-index: 2;left: 20px;} button.btn-product-gift{width: 100%;padding: 14px 35px; font-size: 16px;} table.table-cart tr td.item .ico-gift{display: inline-block;width: 16px;vertical-align: text-bottom;margin-left: 10px;} @media(max-width:767px){ .modal-productApp .modal-dialog-centered{margin: 35px 10px 35px 14px;} .modal-productApp .modal-header{padding-left:15px;} .modal-productApp .modal-header .name-combo, .modal-productApp .modal-header .modal-title{ font-size: 18px;} .modal-productApp .modal-footer .button{width:100%;margin: 0;} .modal-productApp .modal-footer .button + .button.discount-promotion-btn{margin-top:15px;} } /*====== POPUP CONTACT ====================================================================*/ .modal-popupContact{text-align: center;font-size: 0;color:#333; background: rgba(3, 17, 27, 0.7);-webkit-transition: opacity .35s linear;-o-transition: opacity .35s linear;transition: opacity .35s linear;} .modal-popupContact:before {content: '';display: inline-block;height: 100%;vertical-align: middle;margin-right: -4px;} .modal-popupContact.fade .modal-dialog{-webkit-transform: translate(0,0);-ms-transform: translate(0,0);-o-transform: translate(0,0);transform: translate(0,0);} .modal-popupContact .modal-dialog-centered .modal-content {width: 100%; } .modal-popupContact .modal-dialog-centered{margin: 35px auto 50px;display: inline-block;text-align: left;vertical-align: middle;font-size: 14px;} .modal-popupContact.fade .modal-dialog-centered { opacity: 0; -webkit-transform: scale(0.8);-moz-transform: scale(0.8);-ms-transform: scale(0.8);transform: scale(0.8); -webkit-transition: all .2s;-moz-transition: all .2s;-ms-transition: all .2s;transition: all .2s; } .modal-popupContact.fade.in .modal-dialog-centered { opacity: 1;-webkit-transform: scale(1);-moz-transform: scale(1); -ms-transform: scale(1);transform: scale(1);} @media (max-width: 767px) { .modal-popupContact .modal-dialog-centered{margin: 35px 10px 35px 14px;} } .modal-popupContact .close-popup-contact{ background-color: rgba(0, 0, 0, .3); height:30px;width:30px;line-height: 30px; position: absolute;right: 10px;top: 10px;z-index: 2; border-radius: 50%;opacity: 1;text-align: center;outline: none; } .modal-popupContact .close-popup-contact svg{display: block;margin: auto;height: 30px;width: 14px;text-align: center;fill:#f3f3f3} .modal-popupContact .close-popup-contact:hover{background-color: rgba(0,0,0,.6);} .modal-popupContact.popupBanner .modal-content{background-color: transparent;width: auto;margin-left:auto;margin-right:auto;} .modal-popupContact.popupForm .modal-content { position: relative;overflow: hidden;padding: 0; background-image: url(//theme.hstatic.net/200000975066/1001334086/14/popup_contact_bkg.jpg?v=1083); background-size: cover;background-repeat: no-repeat;background-color: #e6e6e6; } .modal-popupContact.popupForm .modal-content:before{ content:""; position: absolute;top: 0;bottom: 0;right: 0; background:#f3f3f3;opacity: 0.75; } .modal-popupContact.popupForm .modal-content:before, .modal-popupContact.popupForm .modal-content .modal-wrapper-contact{width:58%} .modal-popupContact.popupForm .modal-content .modal-wrapper-contact{position: relative;padding: 50px 25px;float:right;} .title-popup-contact {font-size: 24px; margin: 0px 0px 10px;font-weight: 500;} .message-popup-contact {margin-bottom: 25px;} .title-adv-popup-contact {font-size: 14px;margin-bottom: 5px;} .list-adv-popup-contact li {list-style-type: disc;margin-left: 25px;font-size: 14px;} .popup-form-customer .input-group {width: 100%;display: block;margin-bottom: 0;} .popup-form-customer .input-group input{-moz-appearance: none;-webkit-appearance: none;appearance: none;} .popup-form-customer .input-group input, .popup-form-customer .input-group .input-group-addon{ width:100%;margin-bottom:15px; height: 45px;padding:10px 20px;line-height: 25px; background: #fff;border:1px solid #e7e7e7; } .popup-form-customer .input-group .input-group-addon { font-weight: 700;color: #fff;cursor: pointer;border-color:#000000; } .popup-form-customer .input-group .input-group-addon:hover, .popup-form-customer .input-group .input-group-addon:focus{ background-color:#fff;border-color:#93c3c4;color:#93c3c4; } .popup-form-customer .succes-popup{font-size:13px;min-height: 25px; visibility: hidden;margin: 0;text-align: center;} .popup-form-customer .succes-popup.error{visibility: visible;color: red;} .popup-form-customer .succes-popup.success{visibility: visible;color: #27a208;} @media (min-width: 768px) { .modal-popupContact .modal-dialog-centered{width:650px;} } @media (max-width: 767px) { .modal-popupContact.popupForm .modal-content:before, .modal-popupContact.popupForm .modal-content .modal-wrapper-contact{width:100%;} } /*** End popup-contact.css ***/ .sitebox-recaptcha{padding: 0;color: #9e9e9e;text-align: left;font-size: 13px;} .sitebox-recaptcha a{color: #2962ff;} .footer-col > div > ul > li > a { color: white; } .swiper-button-prev, .swiper-button-next { background-image: none !important; } @media (max-width: 767px) { .swiper-button-prev, .swiper-button-next { padding: 0px 3% !important; } .swiper-button-next{ padding: 0px 6% 0px 0px !important; } } .title-home { font-weight: bolder; text-transform: uppercase; } blockquote > a { color: white; }