/* Theme Name: Base Theme Description: This is a Custom Theme Version: 1.0.0 License: GNU General Public License v2 or later License URI: LICENSE Text Domain: hellobase */ /* -- Google font -- */ @import url('https://fonts.googleapis.com/css?family=Oswald:300,400,600,700'); /* -- Font Face kit Generat -- */ @font-face {font-family: 'Oswald'; src: url('fonts/Oswald-Regular.eot'); src: url('fonts/Oswald-Regular.eot?#iefix') format('embedded-opentype'), url('fonts/Oswald-Regular.woff2') format('woff2'), url('fonts/Oswald-Regular.woff') format('woff'), url('fonts/Oswald-Regular.ttf') format('truetype'), url('fonts/Oswald-Regular.svg#Oswald-Regular') format('svg'); font-weight: normal; font-style: normal; font-display: fallback; } @font-face {font-family: 'DIN'; src: url('fonts/DIN-Regular.eot'); src: url('fonts/DIN-Regular.eot?#iefix') format('embedded-opentype'), url('fonts/DIN-Regular.woff2') format('woff2'), url('fonts/DIN-Regular.woff') format('woff'), url('fonts/DIN-Regular.ttf') format('truetype'), url('fonts/DIN-Regular.svg#DIN-Regular') format('svg'); font-weight: normal; font-style: normal; font-display: fallback; } @font-face {font-family: 'Oswald'; src: url('fonts/Oswald-MediumItalic.eot'); src: url('fonts/Oswald-MediumItalic.eot?#iefix') format('embedded-opentype'), url('fonts/Oswald-MediumItalic.woff2') format('woff2'), url('fonts/Oswald-MediumItalic.woff') format('woff'), url('fonts/Oswald-MediumItalic.ttf') format('truetype'), url('fonts/Oswald-MediumItalic.svg#Oswald-MediumItalic') format('svg'); font-weight: 500; font-style: italic; font-display: fallback; } @font-face {font-family: 'Isidora Sans'; src: url('fonts/IsidoraSans-Medium.eot'); src: url('fonts/IsidoraSans-Medium.eot?#iefix') format('embedded-opentype'), url('fonts/IsidoraSans-Medium.woff2') format('woff2'), url('fonts/IsidoraSans-Medium.woff') format('woff'), url('fonts/IsidoraSans-Medium.ttf') format('truetype'), url('fonts/IsidoraSans-Medium.svg#IsidoraSans-Medium') format('svg'); font-weight: 500; font-style: normal; font-display: fallback; } /* -------------------------------------------------------------- Normalize -------------------------------------------------------------- */ html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,figure,footer,header,menu,nav,section,time,mark,audio,video,details,summary{margin:0;padding:0;border:0;font-size:100%;font-weight:normal;vertical-align:baseline;background:transparent; font-family: 'Oswald', sans-serif; font-weight: 400; } article,aside,figure,footer,header,nav,section,details,summary{display:block;} img,object,embed{max-width:100%;} blockquote,q{quotes:none;} blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;} a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; color: #e14c51; text-decoration: none; } a:hover { color: #111111; } a:focus { outline: none; } del{text-decoration:line-through;} abbr[title],dfn[title]{border-bottom:1px dotted #000;cursor:help;} table{border-collapse:collapse;border-spacing:0;} th { vertical-align:bottom; } td { font-weight:normal;vertical-align:top; } hr{display:block;height:1px;border:0;margin:1em 0;padding:0;} input,select{vertical-align:middle;} pre{white-space:pre; white-space:pre-wrap; white-space:pre-line; word-wrap:break-word;} input[type="radio"]{vertical-align:text-bottom;} input[type="checkbox"]{vertical-align:bottom;} select,input,textarea{font:100% sans-serif;} table{font-size:inherit;} small{font-size:85%;} b,strong{font-weight: 600;} td,td img{vertical-align:top;} sub,sup{font-size:75%;line-height:0;position:relative;} sup{top:-0.5em;} sub{bottom:-0.25em;} pre,code,kbd,samp{font-family:monospace,sans-serif;} .clickable,label,input[type=button],input[type=submit],input[type=file],button{cursor:pointer;} i span,i,em{ font-style: italic; font-weight: 400; } button,input,select,textarea{margin:0;} /* make buttons play nice in IE */ button,input[type=button]{width:auto;overflow:visible;} button:focus, textarea:focus, input:focus{ outline: none; } /* --- let's clear some floats --- */ .cf:before,.cf:after{content:"\0020";display:block;height:0;overflow:hidden;} .cf:after{clear:both;} .cf{zoom:1;} body{ font-family: 'Oswald', sans-serif; font-weight: 400; background: #ffffff; color: rgba(0,0,0,0.7);} body,html { font-size: 16px; line-height: 1.2; } /* ~~~~~ Typography ~~~~~ */ h1, h2, h3, h4, h5, h6 { font-family: 'Oswald', sans-serif; padding: 0 0 10px 0; margin: 0; color: #363636; line-height: 1.2; font-weight: 400;text-transform: uppercase; } h1 { font-size: 50px; letter-spacing: 1.2px; } h2 { font-size: 40px; letter-spacing: 1px;} h3 { font-size: 30px; letter-spacing: 0.8px;} h4 { font-size: 26px; letter-spacing: 0.6px;} h5 { font-size: 20px; letter-spacing: 0.4px;} h6 { font-size: 16px; letter-spacing: 0.2px;} img {max-width: 100%; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; vertical-align: middle; height: auto; } p { font-family: 'Oswald', sans-serif; font-weight: 400; margin-top: 0; padding: 10px 0; font-size: 16px; line-height: 1.5; color: #3f5364; letter-spacing: 0.5px; } /* ~~~~~ Input type ~~~~~ */ input[type="text"], input[type="email"], input[type="search"], input[type="tel"], input[type="number"], input[type="password"], input[type="url"], input[type="date"], select, textarea {font-family: 'Isidora Sans'; font-weight: 500; font-style: normal; width: 100%; font-size: 16px; padding: 10px 15px; border: 1px solid rgba(0,0,0,0.15); margin: 10px 0 5px 0; background-color: #ffffff; color: #111111; border-radius: 0; box-shadow: none; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; -webkit-appearance: none; -moz-appearance: none; appearance: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } input[type="text"]:focus, input[type="email"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="number"]:focus, input[type="password"]:focus, input[type="url"]:focus, input[type="date"]:focus, select:focus, textarea:focus {-webkit-box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, 0.4); -moz-box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, 0.4); box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, 0.4); -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } form button, input[type="submit"] { font-family: 'Oswald', sans-serif; font-weight: 400; font-size: 24px; line-height: 1; background: #e14c51; color: #ffffff; padding: 12px 50px; border: none; border-radius:0; margin-top: 8px; } select {background-color: transparent; background-image: url(images/select-arrow.png); background-repeat: no-repeat; background-position: 95% center; } form button:hover, form button:focus, input[type="submit"]:focus, input[type="submit"]:hover { background: #f1df6f; color: #ffffff; outline: none; } input::-webkit-input-placeholder { color: #3f5364; opacity: 1 !important; text-transform: uppercase; } input::-moz-placeholder { color: #3f5364; opacity: 1 !important; text-transform: uppercase; } input:-ms-input-placeholder { color: #3f5364; opacity: 1 !important; text-transform: uppercase; } input:-moz-placeholder { color: #3f5364; opacity: 1 !important; text-transform: uppercase; } textarea::-webkit-input-placeholder { color: #3f5364; opacity: 1 !important; text-transform: uppercase; } textarea::-moz-placeholder { color: #3f5364; opacity: 1 !important; text-transform: uppercase; } textarea:-ms-input-placeholder { color: #3f5364; opacity: 1 !important; text-transform: uppercase; } textarea:-moz-placeholder { color: #3f5364; opacity: 1 !important; text-transform: uppercase; } input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {-webkit-appearance: none; margin: 0; } [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {height:auto;} [type="search"] { -webkit-appearance: textfield; outline-offset: -2px; } [type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration {-webkit-appearance:none;} [type="search"]::-webkit-file-upload-button {-webkit-appearance:button; font:inherit;} .btn { position: relative; } .btn.white-btn a {border:2px solid #ffffff; color: #ffffff; background: none; padding: 10px 52px 10px 20px; } .btn a { font-family: 'Oswald', sans-serif; font-weight: 400; border-radius: 0px; position: relative; overflow: hidden; color: white; display: inline-block; font-size: 15px; padding: 10px 52px 10px 20px; text-transform: uppercase; color: #ffffff; letter-spacing: 1px; text-decoration: none; background: #d79a2a; letter-spacing: 3.5px; } .btn a:hover {color: #ffffff; background: #323d53; } .btn.white-btn a:focus, .btn.white-btn a:hover { background: #d79a2a; color: #ffffff; border-color: #d79a2a; } /* Pulse */ @-webkit-keyframes hvr-pulse { 25% {-webkit-transform: scale(1.1); transform: scale(1.1); } 75% {-webkit-transform: scale(0.9); transform: scale(0.9); } } @keyframes hvr-pulse { 25% {-webkit-transform: scale(1.1); transform: scale(1.1); } 75% {-webkit-transform: scale(0.9); transform: scale(0.9); } } .product-cat-footer-link a:after, .product-image a img, .shoroom_info .arrow a img, .shop-brand a:before, .pulse:before {-webkit-animation-name: hvr-pulse; animation-name: hvr-pulse; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } /* ----- Close Pulse button ----- */ textarea {-webkit-appearance: none; -moz-appearance: none; appearance: none; overflow: auto; height: 100px; } .btn a, .btn a:hover, input[type="submit"]:hover, input[type="submit"] {-webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .bold {font-family: 'Montserrat', sans-serif; font-weight: 700; font-style: normal; } .text-center { text-align: center; } /* Go Top CSS */ .go-up { background: #3f5364; bottom: 5px; cursor: pointer; width: 45px; height: 45px; line-height: 40px; position: fixed; right: 20px; bottom: -60px; text-align: center; z-index: 999; transition: all 0.5s ease-in-out; border-radius: 50px 50px 0px 0px; -moz-border-radius: 50px 50px 0px 0px; -webkit-border-radius: 50px 50px 0px 0px; } .go-up img { padding-top: 14px; max-width: 12px; width: 100%; } .go-up:hover {transition: all 0.3s ease-in-out; background-color: #d79a2a; height: 50px; } button { background: gray; border: none; padding: 10px; } button:hover { background: #eee; } a,a:hover {-webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;} .cf:after {visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } .cf { display: inline-block; } * html .cf { height: 1%; } .cf { display: block; } .color-white, .color-white h1, .color-white h2, .color-white h3, .color-white h4, .color-white h5, .color-white h6, .color-white span, .color-white a, .color-white strong, .color-white em , .color-white p,.color-white p strong,.color-white p span, .color-white p i, .color-white p em, .color-white p b, .color-white ul li, .color-white ul li span,.color-white ul li strong,.color-white ul li b, .color-white ul li i { color: rgba(255,255,255,1); } ol li, ul li { padding: 0; padding-bottom: 5px; } ul,ol { padding: 5px 0; margin-left: 20px; } ol { margin-left: 16px; } .boxs{-webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } .inline-block li, .inline-block { display: inline-block; } select::-ms-expand { display: none; } /* close commented backslash hack */ /* Default Css Start Here ===================================================*/ .wrapper{ position: relative; overflow: hidden; margin: 0 auto; width: 100%; padding: 0 30px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } /* ~~~~~ Flex Container ~~~~~ */ .flex-container {width: 100%; margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 0; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } .flex-end {justify-content: flex-end; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; } .flex-start {-webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .flex-center {-webkit-box-align: center; -ms-flex-align: center; align-items: center; } .flex-item { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; padding-left: 15px; padding-right: 15px; } /* ~~~~~ / Flex Container ~~~~~ */ /* ===================================================================== Header ===================================================================== */ .header { padding-bottom: 20px; position: absolute; top: 0; left: 0; right: 0; z-index: 1000; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } .home .header { z-index: 1500; } .header.header-sticky { position: fixed; top: 0; left: 0; right: 0; z-index: 2000; padding-bottom: 0; background-color: #ffffff; width: 100%; height: auto; animation: 0.5s slideDown; -webkit-animation: 0.5s slideDown; -moz-animation: 0.5s slideDown; -o-animation: 0.5s slideDown; -ms-animation: 0.5s slideDown; -webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.08); -moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.08); box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.08); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box } @-webkit-keyframes slideDown { 0% {transform: translateY(-100%); } 100% {transform: translateY(0%); } } @-moz-keyframes slideDown { 0% {transform: translateY(-100%); } 100% {transform: translateY(0%); } } @-o-keyframes slideDown { 0% {transform: translateY(-100%); } 100% {transform: translateY(0%); } } @keyframes slideDown { 0% {transform: translateY(-100%); } 100% {transform: translateY(0%); } } .header.header-sticky .logo {padding-top: 5px; width: 78px; padding-left: 10px; } /* ----------------------------- Menu CSS ----------------------------- */ .mobile-logo { display: none; } .menu-icon { display: none; cursor: pointer; color: #000; text-transform: uppercase; text-align: center; font-weight: bold; line-height: 33px; font-size: 22px; padding: 10px 0; } .menu-icon .menu-box { width: 50px; height: 26px; margin-right: 0px; padding: 5px; position: absolute; right: 0; top: 10px; z-index: 100000; } .menu-icon .menu-box span {width: 100%; height: 3px; margin-bottom: 8px; background: #e14c51; display: block; border-radius: 0px; transition: all 0.5s; -webkit-transition: all 0.5s; } .menu-icon.active span:nth-child(1) {transform: rotate(45deg) translateY(10px) translateX(8px); -webkit-transform: rotate(45deg) translateY(10px) translateX(8px); } .menu-icon.active span:nth-child(2) {opacity: 0; } .menu-icon.active span:nth-child(3) {transform: rotate(-45deg) translateY(-6px) translateX(4px); -webkit-transform: rotate(-45deg) translateY(-6px) translateX(4px); } .menu-icon.active span { background: #ffffff; } .enumenu_ul ul .caret {color: #000; margin-left: 7px; } .enumenu_ul ul {padding: 0px; list-style: none; margin: 0; } .enumenu_ul ul > li { display: block; float: left; padding-bottom: 0; position: relative; margin-left: 0px; } .enumenu_ul ul > li a { color: #b8b8b8 !important; padding: 19px 14px 18px; text-decoration: none; letter-spacing: 1.6px; display: inline-block; font-size: 11px; line-height: 1.2; text-transform: uppercase; font-family: 'Oswald', sans-serif; font-weight: 400; } .enumenu_ul ul li a.active, .enumenu_ul ul li.current_page_item a, .enumenu_ul ul li a:hover { color: #e14c51 !important; border-color: #7b7b7b !important; } .enumenu_ul ul > li > a,.enumenu_ul > li:hover > a, .enumenu_ul > li.active > a { -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .enumenu_ul ul > li ul { display: none } .enumenu_ul ul > li ul li {width: 100%; margin: 0; list-style: none; position: relative; } .enumenu_ul.desk ul > li > ul { top: 100%; z-index: 999; list-style: none; left: 0px; background: #363636; position: absolute; min-width: 150px; } .enumenu_ul .enquire-btn a { border: 1px solid #ffffff; font-family: 'Avenir', sans-serif; font-weight: 900; font-style: normal; margin: 0; font-size: 14px; letter-spacing: 3px; } .enumenu_ul .enquire-btn a:hover { border-color: #7b7b7b; color: #7b7b7b; } .enumenu_ul .enquire-btn a:focus { border-color: inherit; color: inherit; } .enumenu_ul .enquire-btn { margin-left: 79px; } /*Sub menu styles*/ .menu.submenu-ul-level1 li a {background: rgba(31, 26, 107, 0.8); color: #000; padding-left: 90px; } .enumenu_ul.desk ul li:hover > ul {display: block; opacity: 1; } .enumenu_ul.desk ul .sb-menu .sb-menu {left: 100%; top: 0; } .enumenu_ul.desk ul > li ul li a {padding: 10px 10px; display: block; color: #ffffff !important; font-size: 14px; text-align: left; } .enumenu_ul.desk ul > li > ul li:hover > a {background: #e14c51; color: #000; } .enumenu_ul .arrow { position: absolute; right: 10px; top: 0px; width: 40px; height: 40px; text-align: center; line-height: 40px; cursor: pointer; z-index: 999; background:url(images/menu-arrow.svg) center no-repeat !important; background-size: 15px !important; } .enumenu_ul .arrow.up {-webkit-transform: rotate(-180deg); -moz-transform: rotate(-180deg); -ms-transform: rotate(-180deg); -o-transform: rotate(-180deg); transform: rotate(-180deg); } .enumenu_ul .arrow,.enumenu_ul .arrow.up {-webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .navigation{ position: relative; } /* ==================================================== Loading Loader ==================================================== */ .home_page .loading {width: 100%; margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 0; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; top:0; left:0; right:0; position:fixed; z-index: 10000; height: 100vh; -webkit-animation: home-intro 2s ease forwards; animation: home-intro 2s ease forwards; -webkit-animation-delay: 1.45s; animation-delay: 1.45s; } .home_page .loading span {height:100%; width: 25%; position: relative; z-index: 5001; background: #363636; animation: fadeInLeft-home 1s ease forwards; -webkit-animation: fadeInLeft-home 1s ease forwards; } .home_page .loading span:nth-child(1){-webkit-animation-delay: 1.26s; animation-delay: 1.26s; } .home_page .loading span:nth-child(2){-webkit-animation-delay: 1.3s; animation-delay: 1.3s; } .home_page .loading span:nth-child(3){-webkit-animation-delay: 1.4s; animation-delay: 1.4s; } .home_page .loading span:nth-child(4){-webkit-animation-delay: 1.45s; animation-delay: 1.45s; } @keyframes fadeInLeft-home { 0% { height: 100%; } 100% { height: 0; } } @-webkit-keyframes fadeInLeft-home { 0% { height: 100%; } 100% { height: 0; } } @keyframes home-intro { 0% { height: 100%; } 100% { height: 0; } } @-webkit-keyframes home-intro { 0% { height: 100%; } 100% { height: 0; } } /* ===================================================== HEADER ===================================================== */ .right-menu { margin-left: auto; } .enumenu_container,.top-menu, .addtocart { display: inline-block; vertical-align: top; } .search-box {position: absolute; top: 0; right: 0; z-index: 50; display: inline-block; } .addtocart a:hover img { opacity: 0.6; } .search-label { width: 50px; height: 50px; background: #f2d100; } .search-label img { width: 15px; } .mega-menu { padding-right: 66px; display: inline-block; vertical-align: top; } .addtocart { padding-top: 19px; margin-right: 10px; } .addtocart img { width: 14px; display: block; } /* Right Search Box Header */ .search-form .form-group input.form-control::-webkit-input-placeholder{ display:none; color: #b8b8b8; } .search-form .form-group input.form-control::-moz-placeholder{ display:none; color: #b8b8b8; } .navbar-right form{ width:100%; } .form-group {float: right; position:relative; width:0%; min-width: 50px; height: 50px; overflow:hidden; transition: width 1s; backface-visibility:hidden; } .form-group input.form-control {font-size: 14px; position:absolute; top:0; right:0; outline:none; width:100%; height:50px; margin:0; z-index:10; padding-right: 60px; border-width: 1px !important; } .form-group .search-submit.form-control.form-control-submit {width: 50px; height: 50px; padding: 0; } input[type="search"].form-control{-webkit-appearence: none; -webkit-border-radius: 0;border-radius: 0; } .form-control-submit,.search-label{width:50px; height:50px; position:absolute; right:0; top:0; padding:0; margin:0; text-align:center; cursor:pointer; line-height: 50px; } .form-control-submit{background:#fff; opacity: 0; color:transparent; border:none; outline:none; z-index:-1; } .search-label{z-index:90; } .form-group.sb-search-open,.no-js .sb-search-open{width:100%; min-width: 300px; } .form-group, .no-js, .form-group.sb-search-open, .no-js .sb-search-open{ -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .form-group.sb-search-open .search-label,.no-js .sb-search .search-label {background: #d9c64d; color: #fff; z-index: 11; } .form-group.sb-search-open .form-control-submit,.no-js .form-control .form-control-submit {z-index: 90; } /* Home page banner */ .hero-banner { position: relative; } .imgbanner{background-repeat:no-repeat;background-size:cover;background-position:center; height: 80vh; width: 890px;} .home.rightside-container, .rightside-container {margin-left: auto; max-width: 1086px; width: 100%; position: relative; z-index: 1040; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } .image-holder { height: 100%; max-width: 890px; margin-left: auto; height: calc(80vh - 50px); margin-top: 50px; margin-bottom: 10px; margin-right: 20px; -o-object-fit: cover; object-fit: cover; overflow: hidden; } .image-holder img { width: 100%; min-height: 100%; -o-object-fit: cover; object-fit: cover; } .custom-object-fit {position: relative; background-size: cover; background-position: center center; } .image-holder img {object-fit: cover; } .image-holder img { -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .bg-image { background-size: cover; background-repeat: no-repeat; background-position: center center; } .lady-image { height: calc(100vh - 50px); width: 100%; max-width: 708px; float: right; text-align: right; margin-top: 50px; background-position: top center; margin-right: 20px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } .header .logo { padding-top: 65px; padding-left: 33px; max-width: 116px; } /* =========================================================== Home Page Intro Animation ============================================================*/ .home.home_page .header .logo {opacity:0; animation: slideInbottom 1.2s ease forwards; -webkit-animation: slideInbottom 1.2s ease forwards; -webkit-animation-delay: 1.5s; animation-delay: 1.5s; } @keyframes slideInbottom { 0% {opacity: 0; -webkit-transform: translateY(500px); transform: translateY(500px); } 100% {opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @-webkit-keyframes slideInbottom { 0% {opacity: 0; -webkit-transform: translateY(500px); transform: translateY(500px); } 100% {opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } .home.home_page .image-holder { opacity:0; animation: slideInbottom-image 1s ease forwards; -webkit-animation: slideInbottom-image 1s ease forwards; -webkit-animation-delay: 1.6s; animation-delay: 1.6s; } @keyframes slideInbottom-image { 0% { opacity: 0; -webkit-transform: translateY(1000px); transform: translateY(1000px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @-webkit-keyframes slideInbottom-image { 0% { opacity: 0; -webkit-transform: translateY(1000px); transform: translateY(1000px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } /* Left Menu */ @keyframes left-menu { 0% { -webkit-transform: translateX(0px); transform: translateX(0px); } 100% { -webkit-transform: translateX(400px); transform: translateX(400px); } } .header-left-menu.home_page .left-menu .animation-box { animation: left-menu 2s ease forwards; -webkit-animation: left-menu 2s ease forwards; -webkit-animation-delay: 2.2s; animation-delay: 2.2s; position: absolute; right: 0; top: 0; z-index: 10; width: 100%; height: 100%; background: #ffffff; z-index: 50; transform: translateX(0px); } /* -- Left Menu -- */ .home.home_page .top_menu { display: inline-block;; position: relative; } @keyframes top-menu { 0% { opacity: 0; -webkit-transform: translatex(100%); transform: translatex(100%); } 10%{ opacity: 1; } 100% { opacity: 1; -webkit-transform: translatex(0); transform: translatex(0); } } @-webkit-keyframes top-menu { 0% { opacity: 0; -webkit-transform: translatex(100%); transform: translatex(100%); } 10%{ opacity: 1; } 100% { opacity: 1; -webkit-transform: translatex(0); transform: translatex(0); } } .home.home_page .search-box { opacity: 0; animation: searchbox 0.5s ease forwards; -webkit-animation: searchbox 0.5s ease forwards; -webkit-animation-delay: 2.5s; animation-delay: 2.5s; } @keyframes searchbox { 0% { opacity: 0; -webkit-transform: translatex(100px); transform: translatex(100px); } 100% { opacity: 1; -webkit-transform: translatex(0); transform: translatex(0); } } @-webkit-keyframes searchbox { 0% { opacity: 0; -webkit-transform: translatex(100px); transform: translatex(100px); } 100% { opacity: 1; -webkit-transform: translatex(0); transform: translatex(0); } } /* =========================================================== End Home Page Intro Animation ============================================================*/ /* Left Menu */ .left-menu { max-width: 300px; width: 100%; position: fixed; top: 17%; z-index: 500;overflow: hidden; } .home .left-menu {max-width: 320px; width: 100%; position: fixed; top: 17%; z-index: 500; overflow: hidden; } .left-menu li { display: block; width: 100%; max-width: 270px; padding: 0; margin: 0; } .home .left-menu li a { color: #ffffff; font-family: 'Oswald', sans-serif; font-weight: 400; font-size: 16px; padding: 4px 9px; height: 81px; letter-spacing: 3.4px !important; display: flex; display: -ms-flexbox; flex-direction: row; flex-wrap: nowrap; justify-content: flex-end; align-items: flex-end; align-content: flex-end; text-align: right; text-transform: uppercase; letter-spacing: 1px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } .left-menu li a {color: #ffffff; font-family: 'Oswald', sans-serif; font-weight: 400; font-size: 16px; padding: 4px 9px; height: 81px; letter-spacing: 3.4px !important; display: flex; display: -ms-flexbox; flex-direction: row; flex-wrap: nowrap; justify-content: flex-end; align-items: flex-end; align-content: flex-end; text-align: center; text-transform: uppercase; letter-spacing: 1px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } .left-menu li:hover, .left-menu li:hover > a { background: #363636 !important; } .left-menu li ul li a:hover { background: none !important; } .left-menu li:hover {margin-left: 43px; } .left-menu li, .left-menu li:hover{ -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .left-menu li ul {max-height: 0; overflow: hidden; padding: 0 7px; margin: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; display: block; width: 100%; background: #fff; } .left-menu li.menu-item-has-children ul {width: 265px;} .left-menu li.menu-item-has-children:hover ul {display:block; height: auto; max-height: 400px; margin: 0; padding-top: 10px; padding-bottom: 10px; } .home .left-menu li.menu-item-has-children ul { width: 280px; } .left-menu li.menu-item-has-children ul li a:hover { font-weight: 600; } .home .left-menu li ul li { margin-left: 0 !important; } .left-menu li ul li { margin-left: 0 !important; } .home .left-menu li.menu-item-has-children ul li { display: inline-block; min-height: inherit; background: #ffffff; width: auto; background: none !important; } .left-menu li.menu-item-has-children ul li { display: inline-block; min-height: inherit; background: #ffffff; width: auto; background: none !important; } .home .left-menu li ul li a { color: #b7b7b7; height: inherit; padding: 7px 6px 3px 0; background: none !important; font-size: 12px; } .left-menu li ul li a { color: #b7b7b7; height: inherit; padding: 7px 25px 3px 0; background: none !important; font-size: 12px; } .left-menu li ul li.current-menu-item a { color: #e14c51; font-weight: 600; } .left-menu li ul li a:hover { color: #e14c51; } .left-menu li.active ul , .left-menu li ul {-webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .left-menu ul { margin: 0; padding: 0; } .menu-item-has-children ul { padding-top: 15px; } .menu-item-has-children ul li a { letter-spacing: 2.2px; } .menu-item-has-children li a { text-align: right; } .home .menu-item-has-children li a { text-align: right; } .menu-item-has-children ul li a { letter-spacing: 2.2px; } .home .left-menu li:nth-child(1) { max-width: 178px; } .home .left-menu li:nth-child(2) { max-width: 271px; } .home .left-menu li:nth-child(3) { max-width: 198px; } .home .left-menu li:nth-child(4) { max-width: 267px; } .home .left-menu li:nth-child(5) { max-width: 134px; } .home .left-menu li:nth-child(6) { max-width: 220px; } .home .left-menu li:nth-child(8) { max-width: 167px; } .blank-box { display: none; } .left-menu li:nth-child(1) { max-width: 168px; } .left-menu li:nth-child(2) { max-width: 261px; } .left-menu li:nth-child(3) { max-width: 188px; } .left-menu li:nth-child(4) { max-width: 257px; } .left-menu li:nth-child(5) { max-width: 124px; } .left-menu li:nth-child(6) { max-width: 210px; } .left-menu li:nth-child(8) { max-width: 157px; } /* ------- Home Products Section --------- */ .section {padding-top: 68px; padding-bottom: 94px; } .products-section {margin-top: 164px; margin-bottom: 164px; } .product-info { position: relative; width: 100%; margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 0; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; justify-content: flex-end; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; margin-left: auto; overflow: visible; } .product-image { width: 100%; /*max-width: 444px;*/ display: inline-block; position: relative; overflow: visible; } /*.all-products .title { width: auto; position:relative; height: 200px; white-space: normal; display: inline-block; position: absolute; left: -15px;bottom: 0; z-index: 500; }*/ .all-products .title { width: auto; position:relative; height: 200px; white-space: normal; display: inline-block; position: absolute; left: 0px; bottom: 0; z-index: 10; } .all-products .title.small-fade-left.come-in { animation: small-comeleft 1s ease forwards; -webkit-animation: small-comeleft 1s ease forwards; } @keyframes small-comeleft { 0% {opacity: 0;} 50% {opacity: 0;} 100% {opacity: 1;} } @-webkit-keyframes small-comeleft { 0% {opacity: 0;} 50% {opacity: 0;} 100% {opacity: 1;} } .all-products .title a {padding: 5px; font-family: 'DIN', sans-serif; font-weight: normal; font-style: normal; text-align: left; letter-spacing: 0.4px; display:inline-block; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); white-space: inherit; font-size: 14px; position: absolute; right: -80px; bottom: 80px; height: 30px; width: 200px; text-transform:uppercase; color: #111111; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; z-index:1; } .all-products .title a:hover {color: #e14c51; } .product-image a { background-size: cover; background-repeat: no-repeat; display: block; width: 100%; min-height: 300px; background-size: cover; background-position: top center; } .all-products { width: 100%; float: right; margin-top: -90px; } .all-products li { width: 100%; list-style: none; text-align: right; margin-bottom: 30px; } .all-products li:nth-child(1) { max-width: 276px; position: relative; z-index: 100; } .pro_arrow:after, .product-image:hover .pro_arrow:after { -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } /*.all-products li:nth-child(1) .title { right: 290px; left: inherit; } .all-products li:nth-child(2) .title { right: 455px; left: inherit; } .all-products li:nth-child(3) .title { right: 334px; left: inherit; } .all-products li:nth-child(4) .title { right: 304px; left: inherit; } */ .all-products li:nth-child(2) { margin-bottom: -66px; } .all-products li:nth-child(2) .product-info { width: 440px; float: right; } /*.all-products li:nth-child(2) { max-width: 507px; margin-bottom: -66px; } .all-products li:nth-child(3) { max-width: 500px; } .all-products li:nth-child(4) { max-width: 507px; }*/ .all-products li:nth-child(3) .product-image { max-width: 320px; } .all-products li:nth-child(4) .product-image { max-width: 290px; } .all-products li { width: 50%; } .pro-image { overflow: hidden; } .all-products li:nth-child(1) .product-image .pro-image a { min-height: 340px; max-width: 100%;} .all-products li:nth-child(2) .product-image .pro-image a { min-height: 323px; max-width: 100%;} .all-products li:nth-child(3) .product-image .pro-image a { min-height: 260px; max-width: 100%;} .all-products li:nth-child(4) .product-image .pro-image a {min-height: 144px; max-width: 100%; background-position: center top; } .all-products li:nth-child(4) .all-products .title {height: 180px; } .all-products li .title a {min-height: auto !important; } .all-products li { position: relative; } .all-products li .pro-arrow {position: absolute; top: 20px; left: -18px; z-index: 50; opacity: 0; min-height: 22px !important; max-width: 38px !important; } .all-products li .product-image:hover .pro-arrow { opacity: 1; } .products-section h2,.products-section h1 { text-transform: uppercase; color: #ebebeb; font-weight: 600; text-align: right; display: block; font-size: 140px; font-family: 'Oswald', sans-serif; font-weight: 600; letter-spacing: 14px; padding-right: 80px; } .products-section .btn-link { display: block; text-align: right; margin-right: 158px; position: relative; z-index: 60; top: -54px; } .products-section .btn-link a { font-size: 28px; color: #111111; text-transform: uppercase; font-family: 'Oswald', sans-serif; font-weight: 600; letter-spacing: 3.5px; } .products-section .btn-link a:hover {color: #e14c51; } .dark-gray-bg { position: relative; } .dark-gray-bg .flex-container { position: relative; z-index: 50; } .dark-gray-bg:before {content: ''; position: absolute; left: -100px; right: 0; top: 0; z-index: 1; width: 150%; height: 100%; background: #363636; } .products-section.dark-gray-bg h2 {color: #555555; position: relative;z-index: 10; } .products-section.dark-gray-bg a { color: #ffffff; } .products-section.dark-gray-bg { padding-top: 98px; margin-bottom: 220px; } /* Show room Section */ .showroom-image {height: 423px; width: 100%; max-width: 810px; } .showroom-image a { width: 100%; display: block; height: 100%; background-position: bottom center !important; } .shoroom_info {margin-left: auto; max-width: 852px; position: relative;margin-right: 20px; } .welcome{background:#ebebeb;margin-right: 20px; padding: 58px 0;} .welcome h2{text-transform: uppercase; color: #fff; font-weight: 600; text-align: right; display: block; font-size: 140px; font-family: 'Oswald', sans-serif; font-weight: 600; letter-spacing: 13px; padding-right: 0; padding-bottom: 0; margin-bottom: -50px; margin-right: 22%;} .shoroom_info p{margin: 20px 80px 20px 0;} .contact-btn { display: inline-block; width: 10%; width: 4%; position: relative; height: 280px; white-space: normal; display: inline-block; } /*.pro_arrow { position: absolute; height: 50px !important; width: 50px !important; min-height: inherit !important; left: -15px; }*/ .pro_arrow { display: none !important;} .product-image:before {background: url(images/right-arrow.svg) center center no-repeat; position: absolute; top: 10px; left: -15px; height: 20px; width: 40px; content: ' '; z-index: 100; opacity: 0; } .product-image:hover:before { opacity:1; } .product-image:before{ -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .pro_arrow:after {background: url(images/right-arrow.svg) center center no-repeat; position: absolute; top: 10px; right: 15px; height: 20px; width: 40px; content: ' '; z-index: 1; opacity: 0; } .product-image:hover .pro_arrow:after{opacity: 1; } .dark-gray-bg .pro_arrow:after {background: url(images/white-right-arrow.svg) center center no-repeat; } .newsletter{background:#ebebeb;margin-right: 20px; padding: 38px 100px;} .newsletter h3{margin-right: 50px;} .newsletter h2{text-transform: uppercase; color: #fff; font-weight: 600; text-align: right; display: block; font-size: 140px; font-family: 'Oswald', sans-serif; font-weight: 600; letter-spacing: 13px; padding-right: 0; padding-bottom: 0; margin-bottom: -50px; margin-right: 22%; z-index: -1;} .news-form{z-index: 5;} /*.contact-btn a { font-family: 'DIN', sans-serif; font-weight: normal; font-style: normal; display: inline-block; -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); writing-mode: tb-rl; white-space: inherit; font-size: 14px; position: absolute; right: 12px; bottom: 0; text-transform: uppercase; color: #111111; letter-spacing: 0.2px; }*/ .contact-btn a {font-family: 'DIN', sans-serif; font-weight: normal; font-style: normal; display: inline-block; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); white-space: inherit; font-size: 13px; height: 20px; width: 120px; position: absolute; right: -50px; bottom: 50px; text-transform: uppercase; color: #111111; letter-spacing: 0.8px; } .contact-btn a:hover {color: #e14c51; } .shoroom_info .arrow {position: absolute; top: 87px; left: 23px; z-index: 50; } .showroom-image { width: 95%; display: inline-block; position: relative; overflow: hidden; } .showroom-section { padding-bottom: 58px; } .showroom-section h2 {text-transform: uppercase; color: #ebebeb; font-weight: 600; text-align: right; display: block; font-size: 140px; font-family: 'Oswald', sans-serif; font-weight: 600; letter-spacing: 13px; padding-right: 0; padding-bottom: 0; margin-bottom: -50px; margin-right: 22%; } .showroom-section .btn-link a {display: none; font-size: 28px; color: #111111; text-transform: uppercase; font-family: 'Oswald', sans-serif; font-weight: 600; } .showroom-section .btn-link a:hover {color: #e14c51; } .companys-logo li {width: 24%; list-style: none; vertical-align: middle; /* border-top: 1px solid #cbcbcb;*/ border-right: 1px solid #cbcbcb; min-height: 102px; margin-top: 12px; margin-bottom: 12px; text-align: center; position: relative; } /*.companys-logo li:after { content: ' '; height: 100%; background: #cbcbcb; position: absolute; top: 12px; right: 0; width: 1px; }*/ @-webkit-keyframes fadeInLeft-logo { 0% {opacity: 0; -webkit-transform: translateX(-100px); transform: translateX(-100px); } 100% {opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInLeft-logo { 0% {opacity: 0; -webkit-transform: translateX(-100px); -ms-transform: translateX(-100px); transform: translateX(-100px); } 100% {opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .companys-logo.come-in li {opacity: 0; animation: fadeInLeft-logo 1s ease forwards; -webkit-animation: fadeInLeft-logo 1s ease forwards; } .companys-logo.come-in li:nth-child(2) { -webkit-animation-delay: 0.4s; animation-delay: 0.5s; } .companys-logo.come-in li:nth-child(3) { -webkit-animation-delay: 0.6s; animation-delay: 0.8s; } .companys-logo.come-in li:nth-child(4) { -webkit-animation-delay: 0.8s; animation-delay: 1.1s; } .companys-logo.come-in li:nth-child(5) { -webkit-animation-delay: 1.0s; animation-delay: 1.4s; } .companys-logo.come-in li:nth-child(6) { -webkit-animation-delay: 1.2s; animation-delay: 1.7s; } .companys-logo.come-in li:nth-child(7) { -webkit-animation-delay: 1.4s; animation-delay: 2s; } .companys-logo.come-in li:nth-child(8) { -webkit-animation-delay: 1.6s; animation-delay: 2.3s; } .companys-logo.come-in li:nth-child(9) { -webkit-animation-delay: 1.8s; animation-delay: 2.6s; } .companys-logo.come-in li:nth-child(10) { -webkit-animation-delay: 2.0s; animation-delay: 2.9s; } .companys-logo.come-in li:nth-child(11) { -webkit-animation-delay: 2.2s; animation-delay: 3.2s; } .companys-logo.come-in li:nth-child(12) { -webkit-animation-delay: 2.4s; animation-delay: 3.5s; } .companys-logo.come-in li:nth-child(13) { -webkit-animation-delay: 2.6s; animation-delay: 3.8s; } .companys-logo.come-in li:nth-child(14) { -webkit-animation-delay: 2.8s; animation-delay: 4.1s; } .companys-logo.come-in li:nth-child(15) { -webkit-animation-delay: 3.0s; animation-delay: 4.3s; } .companys-logo.come-in li:nth-child(16) { -webkit-animation-delay: 3.2s; animation-delay: 4.6s; } .companys-logo li:nth-child(-n+4) { border-top: none; } .companys-logo li:after {content: ''; height: 1px; background: #cbcbcb; position: absolute; top: -10px; left: -1px; right: 0; z-index: 10; } .companys-logo li:nth-child(-n+4):after {display: none; } .companys-logo li:nth-child(4n+0) {border-right: none; } .companys-logo a {position: absolute; top: 50%; left: 0; right: 0; margin: 0 auto; -webkit-transform: translate(0%, -50%); -moz-transform: translate(0%, -50%); -ms-transform: translate(0%, -50%); -o-transform: translate(0%, -50%); position: absolute; transform: translate(0%, -50%); } .companys-logo a:hover {opacity: 0.6; } .companys-logo {width: 85%; padding-left: 4%; display: flex; flex-direction: row; flex-wrap: wrap; align-content: stretch; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; opacity: 0; } .companys-logo.come-in{ opacity: 1; } .shop-brand { width: 15%; margin-right: auto; } .shop-brand a {font-family: 'DIN', sans-serif; font-weight: normal; font-style: normal; height: 119px; width: 112px; position: relative; display: block; font-size: 13px; background: #000; color: #fff; letter-spacing: 0.5px; text-transform: uppercase; margin-left: auto; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; display: flex; padding: 16px 20px; justify-content: flex-end; align-items: flex-end; align-content: flex-end; } .shop-brand a:hover {background: #e14c51; } .shop-brand a:before {background: url(images/white-right-arrow.svg) center center no-repeat; position: absolute; top: 10px; right: 15px; height: 20px; width: 40px; content: ' '; z-index: 10; } .featured-logo { padding-bottom: 82px; } /* ==================================================== Footer ==================================================== */ .footer {background: #363636; position: relative; text-align: right; padding-top: 5px; padding-bottom: 5px; } .footer p { font-family: 'DIN', sans-serif; font-weight: normal; font-style: normal; color: #fff; text-transform: uppercase; font-size: 14px; line-height: 1.2; letter-spacing: 0.3px; } .footer p a { display: inline-block; vertical-align: bottom; } .footer .flex-container { position: relative; z-index: 50; } .footer a img {margin-bottom: -3px; width: 100%; max-width: 24px; margin-left: 5px; } .footer a:hover img {opacity: 0.5; } .footer a img ,.footer a:hover img { -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .footer:before {content: ''; position: absolute; left: -100px; right: 0; top: 0; z-index: 1; width: 150%; height: 100%; background: #363636; } /* ==================================================== Animation Custom ==================================================== */ /* ----- Left ----- */ @-webkit-keyframes fadeInLeft { 0% {opacity: 0; -webkit-transform: translateX(-300px); transform: translateX(-300px); } 1% {opacity: 1; -webkit-transform: translateX(-300px); transform: translateX(-300px); } 100% {opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInLeft { 0% {opacity: 0; -webkit-transform: translateX(-300px); -ms-transform: translateX(-300px); transform: translateX(-300px); } 1% {opacity: 1; -webkit-transform: translateX(-300px); -ms-transform: translateX(-300px); transform: translateX(-300px); } 100% {opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fade-left { opacity: 0; } .come-in.fade-left {opacity: 0; animation: fadeInLeft 1s ease forwards; -webkit-animation: fadeInLeft 1s ease forwards; } /* ----- Small Left ----- */ .small-fade-left { opacity: 0; } .come-in.small-fade-left {animation: small-come-left 1s ease forwards; -webkit-animation: small-come-left 1s ease forwards; } @keyframes small-come-left { 0% {opacity: 0; -webkit-transform: translateX(-50px); -ms-transform: translateX(-50px); transform: translateX(-50px); } 1% { opacity: 1; -webkit-transform: translateX(-50px); -ms-transform: translateX(-50px); transform: translateX(-50px); } 100% {opacity: 1; -webkit-transform: translateX(0px); -ms-transform: translateX(0px); transform: translateX(0px); } } @-webkit-keyframes small-come-left { 0% {opacity: 0; -webkit-transform: translateX(-50px); -ms-transform: translateX(-50px); transform: translateX(-50px); } 1% { opacity: 1; -webkit-transform: translateX(-50px); -ms-transform: translateX(-50px); transform: translateX(-50px); } 100% {opacity: 1; -webkit-transform: translateX(0px); -ms-transform: translateX(0px); transform: translateX(0px); } } /* ----- Right ----- */ @-webkit-keyframes fadeInRight { 0% {opacity: 0; -webkit-transform: translateX(100px); transform: translateX(100px); } 1% {opacity: 1; -webkit-transform: translateX(100px); transform: translateX(100px); } 100% {opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInRight { 0% {opacity: 0; -webkit-transform: translateX(100px); -ms-transform: translateX(100px); transform: translateX(100px); } 1% {opacity: 1; -webkit-transform: translateX(100px); -ms-transform: translateX(100px); transform: translateX(100px); } 100% {opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fade-right { opacity: 0; } .come-in.fade-right {opacity: 0; animation: fadeInRight 1s ease forwards; -webkit-animation: fadeInRight 1s ease forwards; } /* ----- Top ----- */ @-webkit-keyframes fadeInUp { 0% {opacity: 0; -webkit-transform: translateY(200px); transform: translateY(200px); } 1% {opacity: 1; -webkit-transform: translateY(200px); transform: translateY(200px); } 100% {opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInUp { 0% {opacity: 0; -webkit-transform: translateY(200px); -ms-transform: translateY(200px); transform: translateY(200px); } 1% {opacity: 1; -webkit-transform: translateY(200px); -ms-transform: translateY(200px); transform: translateY(200px); } 100% {opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fade-top { opacity: 0; } .come-in.fade-top {opacity: 0; animation: fadeInUp 1s ease forwards; -webkit-animation: fadeInUp 1s ease forwards; } /* ----- Bottom ----- */ @-webkit-keyframes fadeInDown { 0% {opacity: 0; -webkit-transform: translateY(-200px); transform: translateY(-200px); } 1% {opacity: 1; -webkit-transform: translateY(-200px); transform: translateY(-200px); } 100% {opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInDown { 0% {opacity: 0; -webkit-transform: translateY(-200px); -ms-transform: translateY(-200px); transform: translateY(-200px); } 1% {opacity: 1; -webkit-transform: translateY(-200px); -ms-transform: translateY(-200px); transform: translateY(-200px); } 100% {opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fade-bottom { opacity: 0; } .come-in.fade-bottom {opacity: 0; animation: fadeInDown 1s ease forwards; -webkit-animation: fadeInDown 1s ease forwards; } /* ======================================================================= Internal Pages ======================================================================= */ .internal{margin-top: 80px; width: 100%;} .col1{float: left; width: 40%; margin: 0 1.5% 0 0; } .col2{float: left; width: 57%;margin: 1.5% 0; } .internal h4{color:#e14c50;} .answer p{font-family: 'Isidora Sans';font-weight: 500;font-style: normal;font-size: 14px;color: #7d7d7d;letter-spacing: 0.5px;} .internal p{font-family: 'Isidora Sans';font-weight: 500;font-style: normal;font-size: 14px;color: #7d7d7d;letter-spacing: 0.5px;} .question{margin-top: 50px;} .content-about{margin-bottom: 50px;} .faq{margin-bottom: 50px;} .page-id-18 .col2 p{padding-right: 40px;} .page-id-18 .all-products .title p { padding: 5px; font-family: 'DIN', sans-serif; font-weight: normal; font-style: normal; text-align: left; letter-spacing: 0.4px; display: inline-block; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); white-space: inherit; font-size: 14px; position: absolute; right: -80px; bottom: 80px; height: 30px; width: 200px; text-transform: uppercase; color: #111111; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } .page-id-18 .products-section.dark-gray-bg p { color: #ffffff; } .page-id-18 .products-section p { color: #111111; } /* ======================================================================= brand page ======================================================================= */ .page-id-5769 .woo-product-cat-header h1, .page-id-5769 .woo-product-cat-header .term-description { position: relative; z-index: 50; color: #ebebeb; width: 100%; display: block; font-weight: 400; text-transform: uppercase; letter-spacing: 5.5px; } .page-id-5769 .woo-product-cat-header p { position: relative; z-index: 50; color: #ebebeb; width: 100%; display: block; font-weight: 400; text-transform: uppercase; letter-spacing:1.5px; font-size: 12px;} .page-id-5769 .woo-product-cat-header a { position: relative; z-index: 50; color: #ebebeb; width: 100%; display: block; font-weight: 400; text-transform: uppercase; letter-spacing:1.5px; font-size: 12px;} .page-id-5769 .woo-product-cat-header .term-description p {color: #ebebeb; text-transform: initial; font-family: 'Isidora Sans'; font-weight: 500; font-style: normal; font-size: 12px; line-height: 1.4; max-width: 330px; } .page-id-5769 .span-bg-colour {position: absolute; right: 0; top: 0; width: 100%; height: 100%; z-index: 1; } .page-id-5769 .btn{background-color:#d35757 ; text-align: center; margin: 5px 0; color: #fff; padding: 5px 0;} /* ======================================================================= Search Page ======================================================================= */ .top-spacing { padding-top: 130px; padding-bottom: 100px; } .search-page { min-height: 51.9vh; } .rightside-container .search-page { padding-left: 30px; } .search-page form { max-width: 400px; } .comment-respond { padding-top: 30px; } /* Select size Box */ .select-size label { position: relative; height: 30px; width: 30px; color: #000; display: inline-block; text-align: center; line-height: 30px; } .select-size span { position: relative; display: inline-block; } .select-size input { width: 100%; height: 100%; position: absolute; top: 0; z-index: 500; left: 0; right: 0; cursor: pointer; padding: 0; margin: 0; } .select-size label:before {content: ' '; position: absolute; top: 0; right: 0; width: 100%; height: 100%; z-index: -1; background: #ebebeb; } .search-results h1.page-title { font-size: 40px; color: #363636; } .select-size input:checked ~ label { color: #fff; } .select-size input:checked ~ label:before { background: #111111; } .default-page .rightside-container { position: relative; z-index: 200; } .flex-control-nav li:first-child { margin-left: 0 !important; } .flex-control-nav li:last-child { margin-right: 0 !important; } .flex-control-nav li { max-width: 63px; width: 100%; margin: 10px 5px !important; } .archive-title { width: 100%; display: block; } /* Product Listing Page */ .size-guide{margin: 40px 0 0 0;} .white-popup { position: relative; background: #FFF; padding: 20px; width: auto; max-width: 600px; margin: 20px auto; z-index: 1600; } .entry-summary .value.woo-variation-items-wrapper li.variable-item.button-variable-item { border-radius: 0 !important; background: #ebebeb !important; color: #111111; border: 1px solid #ebebeb !important; height: 34px; width: 34px; box-shadow: none !important; margin-right: 12px; } .entry-summary .value.woo-variation-items-wrapper li.variable-item.button-variable-item.selected{border: #000 4px solid !important;color: #ffffff;} .entry-summary .value.woo-variation-items-wrapper li.variable-item.button-variable-item.disabled {background: none !important; } .entry-summary .value.woo-variation-items-wrapper li.variable-item.button-variable-item.disabled:after {display: none; } .entry-summary .value.woo-variation-items-wrapper li.variable-item.button-variable-item.disabled:before {background: #ebebeb !important } .price span,.entry-summary p.price {color: #e14c51 !important; } .button.add-to-quote,.entry-summary .single_add_to_cart_button {background-color: #e14c51 !important; background-image: url(images/cart-icon.png) !important; background-position: 20px center; background-repeat: no-repeat; background-size: 18px; color: #ffffff !important; border-radius: 0 !important; text-transform: uppercase; letter-spacing: 2px; font-size: 15px !important; font-weight: 600 !important; padding: 15px 25px 15px 50px !important } .button.add-to-quote{background-image: none !important; padding: 12px 20px !important; } .button.add-to-quote,.entry-summary .single_add_to_cart_button:hover {background-color: #f1df6f !important; } .entry-summary .single_add_to_cart_button,.entry-summary .single_add_to_cart_button:hover {-webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;} .entry-summary .variable-item.color-variable-item {box-shadow: none !important; padding: 0 !important; height: 20px; width: 20px; } .entry-summary .variable-item.color-variable-item.selected {border: 2px solid #111111; } .entry-summary .variable-item.color-variable-item.color-variable-item-black.selected{border-color: #e14c51; } .entry-summary input { margin: 0; } .variations tr td {display: block; width: 100%; } .variations tr td.label label { font-weight: 600 !important; text-transform: uppercase; font-size: 13px; letter-spacing: 2px; color: #111111; } .product_title.entry-title, .entry-header h1.entry-title {font-family: 'Oswald', sans-serif; font-weight: 400; font-size: 24px; letter-spacing: 2px; text-transform: uppercase; } .woocommerce-order-details h2.woocommerce-order-details__title, .cart_totals h2 {font-family: 'Oswald', sans-serif; font-weight: 400; font-size: 30px; letter-spacing: 2px; text-transform: uppercase; } .entry-content .checkout_coupon .form-row-last .button { background: #e14c51; color: #ffffff; } .entry-content .checkout_coupon .form-row-last .button:hover { background: #111111; } .product-search-filter-price-slider span.slider-limit-min {display: none;} .product-search-filter-price-slider span.slider-limit-max {display: none;} #product-search-filter-reset-form-0 .product-search-filter-reset-clear{ width: 150px; background: #e14c51 !important; color: #ffffff !important; border-radius: 0 !important; padding: 13px 11px; text-transform: uppercase!important; font-size: 12px!important; letter-spacing: 2px!important;} .product-search-filter-terms .product-search-filter-product_cat .term-thumbnail, .product-search-filter-terms .product-search-filter-product_tag .term-thumbnail, .product-search-filter-terms .product-search-filter-attribute .term-thumbnail { display: inline-block; vertical-align: middle; border-radius: 50px!important; box-shadow: 0 0 1px #333; margin: 4px;} .min-max-fields input[type="text"]{font-size: 11px;font-family: 'Oswald', sans-serif;} input[type="text"].product-search-filter-price-field { width: 41%!important; padding: 10px 10px; display: inline-block;} .widget_woocommerce_product_search_filter_price_widget #sidebar ul aside { display: inline-block; vertical-align: top; width: 300px !important; margin-right: 10px; margin-top: 5px; margin-bottom: 5px; } #woocommerce_product_search_filter_attribute_widget-4{margin-left: 63px;} .widget_woocommerce_product_search_filter_tag_widget{ width: 100% !important; } .selectize-dropdown, .selectize-input, .selectize-input input { color: #303030; font-family: inherit; font-size: 11px!important; line-height: 18px; -webkit-font-smoothing: inherit; } .woocommerce form .form-row .input-checkbox { display: inline; margin: -2px 8px 0 0; text-align: center; vertical-align: middle; } .select2-container--default .select2-selection--single .select2-selection__rendered,.select2-results__option[aria-selected], .select2-results__option[data-selected] { font-family: 'Isidora Sans'; font-weight: 500; font-style: normal; } .summary.entry-summary p {font-family: 'Isidora Sans'; font-weight: 500; font-style: normal; color: #7d7d7d; font-size: 14px; line-height: 1.4; } .product-uniform-list { padding-bottom: 60px; } .product-uniform-list .cf { clear: both; } .product-uniform-list .xoo-qv-button { position: absolute; top: 1px; left: 1px; z-index: 10 !important; text-align: center; background-color: #ebebeb; background-image: url(images/zoom-in.svg); background-position: center; background-repeat: no-repeat; background-size: 15px; border: none; height: 28px; width: 28px; box-sizing: border-box; } .product-uniform-list .xoo-qv-button:hover { background-color: #d3d1d1; } .product-uniform-list .xoo-qv-button span { display: none; } .product-uniform-list .xoo-qv-btn-icon.xooqv-eye.xoo-qv { text-align: center; padding: 0; margin: 0 !important; } .product-uniform-list { padding-top: 50px; padding-right: 20px; } #sidebar ul,.sorting-filter { -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: #ebebeb; width: 100%; margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 0; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } .sorting-filter {padding: 15px 20px; margin-bottom: 0x; } .sorting-filter h4 { width: 63px; font-size: 12px; color: #111111; text-transform: uppercase; font-weight: 400; padding: 0; letter-spacing: 1.5px; margin: 0; } .brand-bar{background-color: #363636; margin-bottom: 50px; padding: 15px 20px;} .brand-bar p{color: #fff; float: left; width: 80%;} .brand-bar a{background-color:#d35757 ; text-align: center; margin: 5px 0; color: #fff; padding: 10px 15px; text-transform: uppercase; font-size: 12px; letter-spacing: 2px; float:right;} #sidebar { width: calc(100% - 63px); position: relative; z-index: 150 !important; } #sidebar ul aside { display: inline-block; vertical-align: top; width: 130px; margin-right: 10px; margin-top: 5px; margin-bottom: 5px; } #sidebar ul aside.yith-woo-ajax-reset-navigation { max-width: 150px; } #sidebar ul aside h3 { display: none; } #sidebar a { margin: 0; font-size: 12px; text-transform: uppercase; background-color: #ffffff; letter-spacing: 1px; color: #a1a1a1; } #sidebar .yit-wcan-select-open { background-image: url(images/filter-select-arrow.png); } .yith-woocommerce-ajax-product-filter { width: 100%; } .products li a img {border: 1px solid #c5c5c5; } #sidebar ul { padding: 0; } #sidebar .yith-wcan-select-wrapper{ padding: 0; margin-top: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } #yith-woo-ajax-navigation-6 h3.widget-title { display: none; } .products li a h2 { position: relative; overflow: visible; } .products li a h2:before {content: ' '; background: url(images/right-arrow.svg) no-repeat right center; background-size: 30px; height: 20px; width: 25px; position: absolute; left: -35px; opacity: 0; top: 7px; } .products li:hover { background: #fbfbdd; } .products li:hover h2 { padding-left: 24px !important; } .products li:hover a h2:before { opacity: 1; left: -8px; } .products li a h2:before, .products li:hover a h2:before{-webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;} .products li a h2,.products li a:hover h2{ -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .products li a:hover h2 { color: #e14c51; } .products li a .price span, .products li a .price { color: #111111 !important; font-weight: 600; } .yith-wcan-color.yith-wcan-group li a { border-radius: 50% !important; border-color: transparent !important; } .yith-wcan-color.yith-wcan-group li.chosen a { border-color: #000000 !important; } .yith-wcan-select.yith-wcan li { width:100%; display:block; } #sidebar .yith-wcan-select li { padding: 0; } #sidebar .yith-wcan-select li.chosen a { background: #2d2d2d; color: #fff; } #sidebar .yith-wcan-select li a { padding: 10px; } .product-uniform-list .colour-count { display: inline-block; width: 50%; font-size: 15px; letter-spacing: 0.2px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; color: #8e8e8e; font-weight: 300; } .related .product-uniform-list .price { display: block !important; width: 48%; float: right; text-align: right; font-weight: 600; color: #111111 !important; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } .product-uniform-list .price span { font-weight: 600; color: #111111 !important; } .product-uniform-list .product .price span { color: #e14c51 !important; } .woocommerce ul.products li.product .price{ display: block;font-weight: 400;margin: .5em 0;font-size: .857em;} .product-uniform-list .woocommerce-loop-product__title { text-transform: uppercase; font-size: 14px !important; padding-right: 10px !important; font-weight: 700; letter-spacing: 0.8px; padding-bottom: 10px !important; } .products li:hover .colour-count { padding-left: 14px; } .products li:hover .price { padding-right: 9px; } .products li:hover .price, .products li:hover .colour-count, .products li .price, .products li .colour-count{ -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .product-uniform-list ul.products li { padding-bottom: 15px !important; } /* ----- Left ----- */ @-webkit-keyframes fadeInLeft-bg { 0% {opacity: 0; -webkit-transform: translateX(-500px); transform: translateX(-500px); } 0% {opacity: 1; -webkit-transform: translateX(-500px); transform: translateX(-500px); } 100% {opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInLeft-bg { 0% {opacity: 0; -webkit-transform: translateX(-500px); -ms-transform: translateX(-500px); transform: translateX(-500px); } 1% {opacity: 1; -webkit-transform: translateX(-500px); -ms-transform: translateX(-500px); transform: translateX(-500px); } 100% {opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .span-bg-colour {opacity: 0; animation: fadeInLeft-bg 1s ease forwards; -webkit-animation: fadeInLeft-bg 1s ease forwards; } /* Image Animation */ @-webkit-keyframes fadeInUp-image { 0% {opacity: 0; -webkit-transform: translateY(500px); transform: translateY(500px); } 1% {opacity: 1; -webkit-transform: translateY(500px); transform: translateY(500px); } 100% {opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInUp-image { 0% {opacity: 0; -webkit-transform: translateY(500px); -ms-transform: translateY(500px); transform: translateY(500px); } 1% {opacity: 1; -webkit-transform: translateY(500px); -ms-transform: translateY(500px); transform: translateY(500px); } 100% {opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .come-in .product-cat-footer-thumb,.product-cat-thumb {opacity: 0; animation: fadeInUp-image 1s ease forwards; -webkit-animation: fadeInUp-image 1s ease forwards; } @keyframes fadeInUp-title { 0% { opacity: 0; } 100% { opacity: 1; } } @-webkit-keyframes fadeInUp-title { 0% { opacity: 0; } 100% { opacity: 1; } } .come-in .product-cat-footer-link, .come-in .term-footer-description h2, .come-in .term-footer-description p, .term-description,.woo-product-cat-header h1, .woo-product-cat-header p, .woo-product-cat-header a {opacity: 0; animation: fadeInUp-title 1s ease forwards; -webkit-animation: fadeInUp-title 1s ease forwards; -webkit-animation-delay: 1.2s; animation-delay: 1.2s; } .come-in .term-footer-description p, .term-description {-webkit-animation-delay: 1.4s; animation-delay: 1.4s; } .come-in .product-cat-footer-link {-webkit-animation-delay: 1.6s; animation-delay: 1.6s; } .variations tr:first-child { display: block; padding-bottom: 45px; } /* -- Product Popup -- */ .xoo-qv-main form.variations_form.cart { display: none; } .xoo-qv-main .xoo-qv-images { width: 100%; float: none; } .xoo-qv-main .xoo-qv-summary { width: 86%; margin: 0 auto; display: block; float: none; margin-top: 40px; } .xoo-qv-container { width: 100%; max-width: 426px; padding: 12px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; margin: 0 auto; } .xoo-qv-summary h1 { font-size: 18px; text-transform: uppercase; letter-spacing: 2.5px; font-weight: 400; } .xoo-qv-main .thumbnails { display: none; } .xoo-qv-main .woocommerce-product-details__short-description p {font-family: 'Isidora Sans'; font-weight: 500; font-style: normal; color: #7d7d7d; font-size: 14px; line-height: 1.4; } .xoo-qv-main .product p.price, .xoo-qv-main .product span.price{ color: #e14c51 !important } .xoo-qv-main .product_meta { display: none; } .xoo-qv-prev.xooqv-chevron-left:hover,.xoo-qv-nxt.xooqv-chevron-right:hover { opacity: 0.5; } .xoo-qv-prev.xooqv-chevron-left,.xoo-qv-nxt.xooqv-chevron-right,.xoo-qv-prev.xooqv-chevron-left:hover,.xoo-qv-nxt.xooqv-chevron-right:hover{-webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } /* -- / Product Popup -- */ /* -- Workwear Page -- */ .product-cat-footer-section, .woocommerce-products-header { overflow: hidden; width: 100%; margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 0; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } .woocommerce-products-header .woo-product-cat-header { width: 37%; overflow: hidden; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; align-items: flex-end; align-content: flex-end; padding: 20px 30px; } .woo-product-cat-header h1 { padding-bottom: 0; } .woocommerce-products-header .product-cat-thumb { width: 63%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; min-height: 416px; background-size: cover; background-position: left center; background-repeat: no-repeat; } .woo-product-cat-header { position: relative; } .woo-product-cat-header h1, .woo-product-cat-header .term-description { position: relative; z-index: 50; color: #fff; width: 100%; display: block; font-weight: 400; text-transform: uppercase; letter-spacing: 5.5px; } .woo-product-cat-header .term-description p {color: #fff; text-transform: initial; font-family: 'Isidora Sans'; font-weight: 500; font-style: normal; font-size: 14px; line-height: 1.4; max-width: 330px; } .span-bg-colour {position: absolute; right: 0; top: 0; width: 100%; height: 100%; z-index: 1; } .product-cat-footer-section { overflow: hidden; } .product-cat-footer-thumb {width: 31.8%; min-height: 485px; } .woo-product-cat-footer {width: 68.2%; position: relative; } .span-foo-bg-colour {position: absolute; right: 0; width: 100%; height: 100%; top: 0; } .product-cat-footer-thumb { background-size: cover; } .product-cat-footer-link, .term-footer-description { position: relative; z-index: 50; color: #fff; } .term-footer-description h2, .term-footer-description p { color: #ebebeb; } .term-footer-description { padding: 20px 20px 60px 20px; max-width: 540px; width: 100%; margin: 0; margin-top: 44px; height: 90%; padding-left: 12.5%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } .term-footer-description h2 {font-size: 60px; text-transform: uppercase; letter-spacing: 6px; font-family: 'Oswald'; font-weight: 500; font-style: italic; } .term-footer-description li,.term-footer-description p {font-size: 18px; text-transform: initial; font-family: 'Isidora Sans'; font-weight: 500; font-style: normal; line-height: 1.4; } .product-cat-footer-link a {position: absolute; bottom: 26px; right: 53px; margin-right: 9px; font-size: 17px; letter-spacing: 2px; color: #111111; padding-right: 44px; font-family: 'DIN'; font-weight: normal; font-style: normal; text-transform: uppercase; } .product-cat-footer-link a:after {content: ' '; position: absolute; top: 0px; right: -5px; height: 20px; width: 40px; background: url(images/right-arrow.svg) center center no-repeat; background-size: 34px; } .product-cat-footer-link a:hover {color: #ffffff; } .span-foo-bg-colour { width: 0; } .come-in .span-foo-bg-colour {animation: promo-bg 1s ease forwards; -webkit-animation: promo-bg 1s ease forwards; } @keyframes promo-bg { 0% { width: 0%; } 100% { width: 100% } } @-webkit-keyframes promo-bg { 0% { width: 0%; } 100% { width: 100% } } .product-cat-footer-section.animation-scroll { opacity: 0; } .product-cat-footer-section.animation-scroll.come-in { opacity: 1; } .yith-wcan a.yith-wcan-reset-navigation.button { background: #e14c51 !important; color: #ffffff !important; border-radius: 0 !important; padding: 13px 11px; } .yith-wcan a.yith-wcan-reset-navigation.button:hover { background: #111111 !important; } .woocommerce .wc-proceed-to-checkout a { background: #e14c51 } .woocommerce .wc-proceed-to-checkout a:hover { background: #363636 } .product-name a { color: #000000; } .product-name a:hover { color: #e14c51; } .shop_table .button, .coupon .button { background: #f1df6f !important; } .shop_table .button:hover, .coupon .button:hover { background: #363636 !important; color: #ffffff !important; } .wc-proceed-to-checkout a { background: #e14c51 !important; letter-spacing: 2px; text-transform: uppercase; font-size: 16px !important; } .wc-proceed-to-checkout a:hover { background: #111111 !important; } .woocommerce-input-wrapper .select2-container .select2-selection--single { padding: 5px; height: inherit; min-height: 40px; border-radius: 0; border: 1px solid rgba(0,0,0,0.15) } .woocommerce-input-wrapper .select2-container--default .select2-selection--single .select2-selection__arrow { min-height: 100%; top: 2px; right: 5px; } .woocommerce #payment #place_order { background: #e14c51; } .woocommerce #payment #place_order:hover { background: #363636; } .woocommerce #payment #place_order,.woocommerce #payment #place_order:hover { -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -ms-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } h2.woocommerce-order-details__title { color: #e14c51; } .woocommerce-table.woocommerce-table--order-details thead th { background: #111111; color: #fff; } .woocommerce-table.woocommerce-table--order-details td { color: #7e7e7e; } .woocommerce-notice.woocommerce-notice--success.woocommerce-thankyou-order-received { color: green; font-size: 24px; padding-bottom: 20px;} .woocommerce-thankyou-order-details li strong { padding-top: 8px; } /*.product-uniform-list .product .woocommerce-product-gallery__image:nth-child(n+2) { padding-top: 15px !important; }*/ @-webkit-keyframes fadeInUp-product-image { 0% {opacity: 0; -webkit-transform: translateY(200px); transform: translateY(200px); } 1% {opacity: 1; -webkit-transform: translateY(200px); transform: translateY(200px); } 100% {opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInUp-product-image { 0% {opacity: 0; -webkit-transform: translateY(200px); -ms-transform: translateY(200px); transform: translateY(200px); } 1% {opacity: 1; -webkit-transform: translateY(200px); -ms-transform: translateY(200px); transform: translateY(200px); } 100% {opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .product-uniform-list .flex-control-nav.flex-control-thumbs, .product-uniform-list .woocommerce-product-gallery.woocommerce-product-gallery--with-images .flex-viewport {opacity: 0; animation: fadeInUp-product-image 1s ease forwards; -webkit-animation: fadeInUp-product-image 1s ease forwards; } /* Products Animation */ @-webkit-keyframes fade-con {0% { opacity: 0; } 100% { opacity: 1; } } @keyframes fade-con {0% { opacity: 0; } 100% { opacity: 1; } } .product-detail-btn, .product-uniform-list .woocommerce-product-details__short-description ul, .product-uniform-list .single_add_to_cart_button.button, .product-uniform-list .branding-wrapper , .product-uniform-list .quantity, .product-uniform-list .variations td.label, .product-uniform-list .variations td.value, .product-uniform-list .woocommerce-product-details__short-description p, .product-uniform-list .woocommerce-product-details__short-description h4, .product-uniform-list .summary.entry-summary h1.product_title.entry-title {opacity: 0; animation: fade-con 0.5s ease forwards; -webkit-animation: fade-con 0.5s ease forwards; -webkit-animation-delay: 0.4s; animation-delay: 0.4s;} .product-uniform-list .woocommerce-product-details__short-description h4 {-webkit-animation-delay: 0.6s; animation-delay: 0.6s; } .product-uniform-list .woocommerce-product-details__short-description ul, .product-uniform-list .woocommerce-product-details__short-description p {-webkit-animation-delay: 0.8s; animation-delay: 0.8s; } .product-uniform-list .variations td.label {-webkit-animation-delay: 1s; animation-delay: 1s; } .product-uniform-list .variations td.value {-webkit-animation-delay: 1.2s; animation-delay: 1.2s; } .product-uniform-list .quantity {-webkit-animation-delay: 1.4s; animation-delay: 1.4s; } .product-uniform-list .branding-wrapper {-webkit-animation-delay: 1.6s; animation-delay: 1.6s; } .product-detail-btn {-webkit-animation-delay: 1.8s; animation-delay: 1.8s; } .product-detail-btn a.button.add-to-quote { background: #e14c51 !important; } .product-detail-btn a.button.add-to-quote:hover { background-color: #111111 !important; } /* Products Animation End */ .product-uniform-list .branding-qty-pro-detail input::-webkit-input-placeholder { color: #111111 !important; } .product-uniform-list .branding-qty-pro-detail input::-moz-placeholder { color: #111111 !important; } .product-uniform-list .branding-qty-pro-detail input:-ms-input-placeholder { color: #111111 !important; } .product-uniform-list .branding-qty-pro-detail input:-moz-placeholder { color: #111111 !important; } .product-uniform-list .branding-qty-pro-detail select::-webkit-input-placeholder { color: #111111; } .product-uniform-list .branding-qty-pro-detail select::-moz-placeholder { color: #111111; } .product-uniform-list .branding-qty-pro-detail select:-ms-input-placeholder { color: #111111; } .product-uniform-list .branding-qty-pro-detail select:-moz-placeholder { color: #111111; } .product-uniform-list .branding-qty-pro-detail select { color: #111111; } .product-uniform-list .woocommerce-variation-price { display: block; text-align: left; } .product-uniform-list .woocommerce-variation-price .price { float: none; text-align: left; display: block; margin-bottom: 20px; } .woocommerce .woocommerce-breadcrumb a:hover { color: #e14c51; } .product-uniform-list ul.products li.product { width: 22% !important; margin-right: 3.8%; } /* Product image Same size */ /*.product-uniform-list ul.products li.product a.woocommerce-LoopProduct-link.woocommerce-loop-product__link:first-child { height: 222px; margin-bottom: 14px; display: block; } .product-uniform-list ul.products li.product.type-product.status-publish .product-uniform-list ul.products li.product a.woocommerce-LoopProduct-link.woocommerce-loop-product__link img.attachment-woocommerce_thumbnail.size-woocommerce_thumbnail.wp-post-image:first-child {object-fit: cover; width: 100%; height: 222px; }*/ .product-uniform-list ul.products li.product.type-product.status-publish a:first-child { height: 300px; margin-bottom: 14px; display: block; } .product-uniform-list ul.products li.product.type-product.status-publish .wp-post-image:first-child {object-fit: cover; width: 100%; height: 300px; } .woocommerce ul.products li.product a img { margin: 0 0 1em; box-shadow: none; object-fit: cover; width: 100%; height: 300px; } /* /////Product image Same size */ .product-uniform-list ul.products li.product:nth-child(4n+0) { margin-right: 0; } .product-uniform-list ul.products li.product span.price span { color: #111111 !important; } .product-uniform-list nav.woocommerce-pagination ul li a:hover, .product-uniform-list nav.woocommerce-pagination ul li span.current { background: #e14c51; color: #fff; } .product-uniform-list nav.woocommerce-pagination ul, .product-uniform-list nav.woocommerce-pagination ul li { border: none !important; } .product-uniform-list nav.woocommerce-pagination ul li { margin: 0 4px; } .product-uniform-list .screen-reader-text { font-size: 14px; letter-spacing: 2px; height: auto; position: relative !important; } .branding-wrapper { width: 40%; display: inline-block; vertical-align: top; } .quantity input { margin-top: 10px; } .branding-wrapper label, .product-uniform-list .quantity label { display: block; width: 100%; color: #111111; font-weight: 600; text-transform: uppercase; } .single_variation_wrap .product-uniform-list .quantity input { margin-top: 10px; margin-bottom: 10px; padding: 10px 6px; text-align: center !important; } .product-uniform-list .quantity { display: inherit; vertical-align: top; width: 32%; font-size: 15px; } .quantity select { margin-top: 22px; } .product-uniform-list .quantity input { font-family: 'Oswald', sans-serif; font-weight: 400; width: 100%; color: #111111 !important; text-align: left !important;} .product-uniform-list .branding-qty-pro-detail select { max-width: 144px; width: 100%; font-family: 'Oswald', sans-serif; font-weight: 400; } .product-uniform-list .branding-qty-pro-detail { display: block; width: 100%; } .product-detail-btn { clear: both; margin-top: 80px; } .product-uniform-list .variations_form.cart .woocommerce div.product form.cart .button { clear: both; } .product-uniform-list .product .cf h4 { letter-spacing: 3px; } .product-uniform-list .product .cf h4,.product-uniform-list .woocommerce-product-details__short-description h4 { font-size: 14px; color: #111111; font-family: 'Oswald', sans-serif; font-weight: 600; margin-top: 20px; letter-spacing: 4px; text-transform: uppercase; padding-bottom: 0; } .cf.animation-scroll p { padding-top: 2px; } .product-uniform-list .summary {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; padding-left: 20px; } .product-uniform-list .woocommerce-product-details__short-description ul { color: #7d7d7d; margin-left: 15px; } .product-uniform-list .woocommerce-product-details__short-description ul li { position: relative; list-style: none; } .product-uniform-list .woocommerce-product-details__short-description ul li:before { background: #7d7d7d; height: 5px; width: 5px; position: absolute; left: -14px; top: 7px; content: ''; border-radius: 50%; } .product-uniform-list .product .cf { max-width: 50%; padding-bottom: 60px; } .product-uniform-list .product .cf p, .product-uniform-list .product .cf ul li, .product-uniform-list .product .cf ol li, .product-uniform-list .woocommerce-product-details__short-description ul li {font-family: 'Isidora Sans'; font-weight: 500; font-style: normal; font-size: 14px; color: #7d7d7d; letter-spacing: 0.5px;} .related.products { background: #ebebeb; padding: 32px 35px 0; } .related.products h2 { color: #ffffff; font-family: 'Oswald'; font-weight: 500; font-style: italic; text-transform: uppercase; font-size: 60px; letter-spacing: 6.5px; padding-bottom: 26px; } .related.products ul li h2.woocommerce-loop-product__title { color: #363636; text-transform: uppercase; font-size: 14px !important; padding-right: 10px !important; font-family: 'Oswald', sans-serif; font-weight: 600; font-style: normal; letter-spacing: normal; } .variations { padding-top: 22px; display: block; } .related.products.animation-scroll,.cf.animation-scroll { opacity: 0;} .related.products.animation-scroll.come-in ,.cf.animation-scroll.come-in { opacity: 0; animation: please-title 1s ease forwards; -webkit-animation: please-title 1s ease forwards;} @-webkit-keyframes please-title { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes please-title { 0% { opacity: 0; } 100% { opacity: 1; } } /* -- Popup CSS -- */ .submit-popup { position:fixed;top:0;bottom:0;left:0;right:0;z-index:9999999;display:-webkit-flex;display:-moz-flex;display:-ms-flex;display:-o-flex;display:flex;-ms-align-items:center;align-items:center;justify-content:center;overflow:hidden;flex-direction:column;display:none;opacity:0; margin: 0 auto; width: 100%;} .submit-popup:before{position:fixed;top:0;left:0;right:0;width:100%;content:' ';height:100%;background:rgba(0,0,0,.7)} .ctm-popup { display: none; opacity: 0; } .show-popup { opacity: 1; display: flex;} .popup-section { position: relative; bottom: -80px; width: 100%; text-align: right; } .popup-section { max-width: 500px; max-height: 92vh; overflow: auto; } .popup-galley-section { width: 100%; height: 100%; background: #eeeeee; text-align: left; padding: 10px 20px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; } .location-zoom-image { min-height: 70vh; width: 100%; max-width: 100%; margin: 0 auto; background-size: cover; background-repeat: no-repeat; background-position: center;} .show-popup .popup-section { bottom: 0; animation: popup-image 0.6s ease-in forwards; -webkit-animation: popup-image 0.6s ease-in forwards; } .popup-section a { width: 20px; display: inline-block; margin-bottom: 10px; } .popup-section a:hover { opacity: 0.5; } @keyframes popup-image { 0% {-webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); } 100% {-webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } } @-webkit-keyframes popup-image { 0% {-webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); } 100% {-webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } } .popup-section button { background: rgba(0,0,0,0.5); position: absolute; right: 0; top: 0; } .popup-section button img { max-width: 20px; } /* -- End Popup CSS -- */ .hiddentext { display: none !important; } /* Product Popup */ .xoo-qv-summary h4 { font-size: 14px; color: #111111; font-family: 'Oswald', sans-serif; font-weight: 600; margin-top: 5px; letter-spacing: 2px; text-transform: uppercase; padding-bottom: 0; } .xoo-qv-summary p, .xoo-qv-summary li {font-family: 'Isidora Sans'; font-weight: 500; font-style: normal; font-size: 14px; color: #7d7d7d; letter-spacing: 0.5px; } .wpcf7-validation-errors { display: none !important; } /* Product Popup */ .single-product .product-uniform-list .woocommerce-breadcrumb { padding-bottom: 60px; } .single-product .product-uniform-list .woocommerce-breadcrumb, .single-product .product-uniform-list .woocommerce-breadcrumb a {font-size: 13px; letter-spacing: 1px; text-transform: uppercase; } .woocommerce-breadcrumb span { position: relative; top: -1.5px; } .single-product .product-uniform-list .woocommerce-product-gallery.woocommerce-product-gallery--without-images.images, .single-product .product-uniform-list .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images { width: 39%; margin-bottom: 5px; position: relative;} .single-product .product-uniform-list .woocommerce-product-gallery.woocommerce-product-gallery--with-images.images:before { content: ' '; position: absolute; right: 0; top: 0; height: 100%; width: 1px; background: #ffffff; z-index: 10; } .single-product .product-uniform-list .summary.entry-summary { width: 60%; padding-left: 66px; } .single-product .entry-header h1.entry-title { letter-spacing: 4px; padding-bottom: 10px; } .single-product .product-uniform-list{ padding-top: 250px; } .full-width-page { width: 100%; } #sidebar #text-2.widget.widget_text { display: none; } .wpcf7-mail-sent-ok { background: #398f14 !important; color: #ffffff !important; } .products li.product .custom-object-fit img { opacity: 0; } .woocommerce-breadcrumb { display: none; } .single-product .woocommerce-breadcrumb { display: block; } .woocommerce table.shop_table th { text-align: left; } .product-cat-footer-section.animation-scroll.come-in { animation: min-pro-bg 1s ease forwards; -webkit-animation: min-pro-bg 1s ease forwards; -webkit-animation-delay: 1s; animation-delay: 1s; } @keyframes min-pro-bg { 0% { background: #ffffff; } 100% { background: #2c969a; } } @-webkit-keyframes min-pro-bg { 0% { background: #ffffff; } 100% { background: #2c969a; } } /*.flex-viewport */ .woocommerce-message a.button.wc-forward { margin-left: 15px; } .addtocart a { position: relative; display: block; } .addtocart a span { position: absolute; top: -8px; right: -8px; font-size: 14px;} #coupon_code { padding: 7px 10px; margin-right: 10px; width: 140px; } .xoo-qv-bottom-panel { padding-top: 30px; } .similar-pro-more a { height: 300px; width: 22%; display: inline-block; background: #000000; position: relative; color: #ffffff; } .similar-pro-more a:hover { background: #e14c51; } .similar-pro-more a span { position: absolute; bottom: 18px; right: 20px; text-transform: uppercase; font-family: 'DIN'; font-weight: normal; font-style: normal; font-size: 14px; } .similar-pro-more a img { border: none !important; position: absolute; right: 15px; top: 10px; } .similar-pro-more:hover { background: none !important; } .xoo-qv-close.xoo-qv.xooqv-cross { top: 75px; right: 30px; z-index: 1000; } .xoo-qv-close.xoo-qv.xooqv-cross:before { color: #cccccc !important; } .xoo-qv-summary .xoo-qv-plink a { text-transform: uppercase; font-family: 'DIN'; font-weight: normal; font-style: normal; background: #e14c51 } .xoo-qv-summary .xoo-qv-plink { background: none; padding: 0; text-align: right; display: block; } .xoo-qv-summary .xoo-qv-plink a {padding: 20px 20px 10px 20px; letter-spacing: 2px; display: inline-block; margin-bottom: 20px; } .xoo-qv-summary .xoo-qv-plink a:hover { background: #111111; } .sorting-filter .categories li span { display: block; padding: 4px 5px; } .product-cat-footer-section{display: none;}