/* | ---------------------------------------------- | General & helper | ---------------------------------------------- */ body { font-family: 'Open Sans', 'HelveticaNeue', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-weight: normal; font-size: 13px; color: #797979; line-height: 1.7; background-color: #fff; } #template-wrapper { overflow: hidden; } body.boxed{background:#333;} #template-wrapper.boxed{ width: 1200px; background: #FFF; margin: 40px auto; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.32); } * { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; outline: 0; } img { max-width: 100%; width: auto\9; height: auto; vertical-align: middle; border: 0; -ms-interpolation-mode: bicubic; } .space10 { height: 10px; } .space20 { height: 20px; } .space30 { height: 30px; } .space40 { height: 40px; } .space50 { height: 50px; } .space60 { height: 60px; } .yellow { background:#ed1651 !important;} .blue { background:#006696 !important;} .green { background:#009672 !important;} .black { background:#333 !important;} .red { background:#B90000 !important;} .white { background:#fff !important;} ::selection { background-color: #ed1651; color: #fff; } ::-moz-selection { background-color: #ed1651; color: #fff; } .unstyled { margin: 0; padding: 0; list-style: none; } .float-right { float: right; } .float-left { float: left; } .relative { position: relative; } .relative .btn{ background: #3F3E3E; color: #FFF; border: 3px solid #3F3E3E; border-radius: 0;} .max-width { width: 100% !important; } /* | ---------------------------------------------- | Typography | ---------------------------------------------- */ h1,h2,h3,h4,h5,h6 { font-family: 'Open Sans', 'HelveticaNeue', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-style: normal; margin: 0 0 20px 0; } h1 { font-size: 32px; } h2 { font-size: 24px; } h3 { font-size: 18px; } h4 { font-size: 14px; } h5 { font-size: 12px; } .text-light { font-weight: 300; } .text-regular { font-weight: 400; } .text-medium { font-weight: 600; } .text-bold { font-weight: 700; } .text-bold i{ margin-right:15px; } .accent-color { color: #ed1651; } /* | ---------------------------------------------- | Links | ---------------------------------------------- */ a, a:hover { text-decoration: none; } a { color: #797979; -webkit-transition: all 0.15s linear; -moz-transition: all 0.15s linear; -o-transition: all 0.15s linear; transition: all 0.15s linear; cursor: pointer; } a:hover { color: #ed1651; } navigation* {-webkit-backface-visibility: hidden;} /* | ---------------------------------------------- | Buttons | ---------------------------------------------- */ .btn { background: #3F3E3E; color: #FFFFFF; border: 1px solid #FFF; font-size: 13px; font-weight: 300; line-height: 30px; padding: 10px 25px; } .btn:hover { color: inherit; box-shadow: 0 1px 3px rgba(0,0,0,0.1); -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.1); } .btn:active { position: relative; top: 1px; box-shadow: inset 0 -1px 10px rgba(0,0,0,0.05); -webkit-box-shadow: inset 0 -1px 10px rgba(0,0,0,0.05); } .btn:focus { color: inherit; } /* start iconed button */ .btn.btn-iconed > i { padding: 8px; font-size: 23px; background: #ed1651; color: #FFF !important; margin-right: 15px; } .btn.btn-iconed > i, .btn.btn-iconed > span { display: inline-block; vertical-align: middle; } /* end iconed button */ .btn.btn-primary { background: #ed1651; filter: none; color: #fff; border: 0; padding: 15px 20px; font-weight: bold; min-width: 100px; } .btn.btn-primary:hover { background:#474747 } .btn.btn-primary:focus, .btn.btn-primary:active { box-shadow: inset 0 2px 5px rgba(0,0,0,0.2); -webkit-box-shadow: inset 0 2px 5px rgba(0,0,0,0.2); } .btn.btn-primary.btn-iconed > i { color: #fff; } .btn.btn-small { padding: 7px 12px; } /* | ---------------------------------------------- | Form | ---------------------------------------------- */ input, select, textarea, .form-control { font-family: 'Open Sans', 'HelveticaNeue', 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 12px; color: #4E4E4E; height: auto; border-color: #eaeaea; box-shadow: 0 0 0; -webkit-box-shadow: 0 0 0; padding: 5px 10px; } input { br {margin:0;} } select.form-control { padding: 4px 10px; } input:hover, select:hover, textarea:hover, input:focus, select:focus, textarea:focus, .form-control:focus { box-shadow: 0 0 3px rgba(0,0,0,0.1); -webkit-box-shadow: 0 0 3px rgba(0,0,0,0.1); border-color: #ccc; } input { padding: 5px; } label { font-size: 12px; font-weight: normal; } #cboxWrapper , #colorbox{min-height:653px !important; min-width: 646px !important ;} .form-horizontal .control-label { text-align: left; padding-top: 6px; } label.required:after { content: '*'; color: #ed1651; margin-left: 2px; } button { font-family: 'Open Sans', 'HelveticaNeue', 'Helvetica Neue', Helvetica, Arial, sans-serif; border: 1px solid #eaeaea; -webkit-transition: all 0.15s linear; -moz-transition: all 0.15s linear; -o-transition: all 0.15s linear; transition: all 0.15s linear; } input[type="text"].error,input[type="email"].error,input[type="password"].error,textarea.error,select.error { border-color: #ed1651; color: #ed1651; } .alert .alert-icon { position: relative; width: 40px; text-align: center; display: table-cell; vertical-align: middle; font-size: 1.5em; } .alert .alert-inner { display: table-cell; vertical-align: top; } .alert .alert-inner p { margin: 0; } /* ---------------------------------------------------------------------------------------------- Component elements - Pretty list - Icon list - Accordion - Pretty checkable - Breadcrumb - Pagination ---------------------------------------------------------------------------------------------- */ /* | ---------------------------------------------- | Pretty unordered list | ---------------------------------------------- */ .pretty-list { list-style: none; margin: 0; padding: 0; } .pretty-list > li { margin-top: 7px; } .pretty-list > li:first-child { margin-top: 0; } .pretty-list > li > a { position: relative; } .pretty-list.arrow-list > li > a:before { margin-right: 9px; } /* box category */ .pretty-list{ margin-top: -5px; } .pretty-list{ list-style: none; margin: 0; padding: 0; } .pretty-list> li { margin-left: -10px; } .pretty-list> li + li { } .pretty-list> li > a { text-decoration: none; text-transform: capitalize; } .pretty-list> li ul { display: none; } .pretty-list> li a.active { color: #ed1651; } .pretty-list> li a.active + ul { display: block; margin-left: -23px; } .pretty-list> li ul > li { padding: 5px 5px 0px 0px; list-style: none; } .pretty-list> li ul > li > a { text-decoration: none; display: block; text-transform: capitalize; } .pretty-list> li ul > li > a.active { font-weight: bold; } /* | ---------------------------------------------- | Icon List | ---------------------------------------------- */ .iconlist .media { margin-top: 20px; } .iconlist .media:first-child { margin-top: 0; } .iconlist .pull-left { margin-right: 15px; } .iconlist .pull-left > i { font-size: 27px; position: relative; top: 2px; -webkit-transition: all 0.15s linear; -moz-transition: all 0.15s linear; -o-transition: all 0.15s linear; transition: all 0.15s linear; } .iconlist .media-body p:last-child { margin-bottom: 0; } .iconlist .media-body a { color: #ed1651; } .iconlist .media-body a:hover { text-decoration: underline; } .iconlist .media:hover .pull-left > i { color: #ed1651; } /* | ---------------------------------------------- | Accordion | ---------------------------------------------- */ .accordion .accordion-group { border: 3px solid #E5E5E5; margin-bottom: 10px; border-radius: 0 ; } .accordion .accordion-toggle { background: #FAFAFA; font-weight: 600; font-size: 13px; text-transform: uppercase; padding: 11px 20px; background: #EEE; font-weight: 600; font-size: 15px; text-transform: uppercase; padding: 15px 20px; } .accordion .accordion-inner { border-color: #eee; padding: 30px 20px; border-top: 3px solid #E5E5E5; } /* Effect : Category list plugins borders slight translate */ .cl-effect-21 a { padding: 5px 0; color: #237546; font-weight: 700; text-shadow: none; -webkit-transition: color 0.3s; -moz-transition: color 0.3s; transition: color 0.3s; } .cl-effect-21 a::before, .cl-effect-21 a::after { position: absolute; left: 0; width: 100%; height: 2px; background: #fff; content: ''; opacity: 0; -webkit-transition: opacity 0.3s, -webkit-transform 0.3s; -moz-transition: opacity 0.3s, -moz-transform 0.3s; transition: opacity 0.3s, transform 0.3s; -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); transform: translateY(-10px); } .cl-effect-21 a::before { top: 0; -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); transform: translateY(-10px); } .cl-effect-21 a::after { bottom: 0; -webkit-transform: translateY(10px); -moz-transform: translateY(10px); transform: translateY(10px); } .cl-effect-21 a:hover, .cl-effect-21 a:focus { color: #fff; } .cl-effect-21 a:hover::before, .cl-effect-21 a:focus::before, .cl-effect-21 a:hover::after, .cl-effect-21 a:focus::after { opacity: 1; -webkit-transform: translateY(0px); -moz-transform: translateY(0px); transform: translateY(0px); } /* Effect 1: Brackets */ .cl-effect-1 a::before, .cl-effect-1 a::after { display: inline-block; opacity: 0; -webkit-transition: -webkit-transform 0.3s, opacity 0.2s; -moz-transition: -moz-transform 0.3s, opacity 0.2s; transition: transform 0.3s, opacity 0.2s; } .cl-effect-1 a::before { margin-right: 10px; content: '['; -webkit-transform: translateX(20px); -moz-transform: translateX(20px); transform: translateX(20px); } .cl-effect-1 a::after { margin-left: 10px; content: ']'; -webkit-transform: translateX(-20px); -moz-transform: translateX(-20px); transform: translateX(-20px); } .cl-effect-1 a:hover::before, .cl-effect-1 a:hover::after, .cl-effect-1 a:focus::before, .cl-effect-1 a:focus::after { opacity: 1; -webkit-transform: translateX(0px); -moz-transform: translateX(0px); transform: translateX(0px); } /* | ---------------------------------------------- | Pretty Checkable | ---------------------------------------------- */ .prettycheckbox, .prettyradio { padding: 0; margin: 0; zoom: 1; } .prettycheckbox a, .prettyradio a { width: 17px; height: 17px; background: url('../img/form.png') top right no-repeat; display: block; float: left; cursor: pointer; margin: 0 12px 0 0; -webkit-transition: none; -moz-transition: none; -o-transition: none; transition: none; } .prettyradio a.checked { background-position: top left; } .checkbox.has-pretty-child, .radio.has-pretty-child { padding: 0; } /* | ---------------------------------------------- | Breadcrumbs | ---------------------------------------------- */ .breadcrumbs ul > li { float: left; margin-left: 8px; } .breadcrumbs ul > li:first-child, .display-mode ul > li:first-child { margin-left: 0; } .breadcrumbs ul > li:before { content: '/'; margin-right: 8px; } .breadcrumbs ul > li:first-child:before { content: none; } .breadcrumbs ul > .active { cursor: default; } .breadcrumbs ul > li > a { color: #E9E9E9; } .breadcrumbs ul > li > a:hover { color: #ed1651; } /* | ---------------------------------------------- | Pagination | ---------------------------------------------- */ .pagination-container { border-bottom: 1px solid #eaeaea; margin-bottom: 40px; } .pagination-direction {margin-top:15px !important;} .pagination { margin: 0 0 10px 0; border-radius: 0; } .pagination > li { margin-left: 8px; } .pagination > li:first-child { margin-left: 0; } .pagination > li > a { width: 35px; height: 35px; padding: 3px; line-height: 27px; text-align: center; font-size: 12px; font-weight: 300; } .pagination > li:first-child > a, .pagination > li:last-child > a { border-radius: 0; } .pagination > .active > a { color: #7e7e7e; cursor: default; } .pagination > .active > a, .pagination > li > a:hover { border-bottom-color: #ed1651; } .pagination > li > a:hover { background: transparent; } /* | ---------------------------------------------- | a. HEADER SECTION | ---------------------------------------------- | 1. Top header bar | 1-1. Top header links | 1-2. Top header social icons | 2. Main header | 2-1. Logo | 2-2. Basket button | 2-2-1. Cart items drop down list | 3. Nav bar | 3-1. Main menu | 3-2. Search box | 3-3. Mobile menu | ---------------------------------------------- */ #header-container { position: relative; z-index: 10; } /* | ---------------------------------------------- | Top header bar | ---------------------------------------------- */ #header-container-inner .container{ background-color: #3F3E3E; min-height: 4px; padding: 2px 20px; } #header-container .menu,.top-links .link-menu, .header-social-icons ul { padding: 0; margin: 0; list-style: none; } /* | ---------------------------------------------- | Top header links | ---------------------------------------------- */ .top-links { float: left; } #header-container .top-links > ul { float: left; margin: 9px 0; } .top-links .link-menu li { float: left; margin-left: 6px; } .top-links .link-menu li.dropdown a.dropdown-toggle i:before{margin-left: 9px; } .top-links .link-menu li.dropdown ul.dropdown-menu {top: 40px;} .top-links .link-menu li.dropdown ul.dropdown-menu li{float:none; width:100%;} .top-links .link-menu li.dropdown ul.dropdown-menu li a{color: #333;} .top-links .link-menu li.dropdown ul.dropdown-menu li:before{content: '' ;margin-right: 6px;} .top-links .link-menu li.dropdown ul.dropdown-menu li:first-child{margin-left: 6px;} .top-links .link-menu li.dropdown:before { content: '|' ; font-size: 12px; } .top-links .link-menu li:before { content: '|'; margin-right: 6px; font-size: 12px; } .top-links .link-menu li:first-child { margin-left: 0; } .top-links .link-menu li:first-child:before { content: ''; margin-right: 0; } .top-links .link-menu li > a { font-size: 11px; font-weight: 300; color: #E9E9E9; position: relative; display: inline-block; } .top-links .link-menu li > a:hover { color: #ed1651; } /* | ---------------------------------------------- | Top header social icons | ---------------------------------------------- */ .header-social-icons ul { float: right; margin: 9px 0; } .header-social-icons ul > li { float: left; margin-left: 5px; } .header-social-icons li > a { width: 25px; height: 26px; display: block; background: url('../img/social-icons.png') no-repeat 0 -26px; } .header-social-icons li > .twitter { background-position: 0 -26px; } .header-social-icons li > .twitter:hover { background-position: 0 -52px; } .header-social-icons.multicolor li > .twitter:hover { background-position: 0 0; } .header-social-icons li > .facebook { background-position: -25px -26px; } .header-social-icons li > .facebook:hover { background-position: -25px -52px; } .header-social-icons.multicolor li > .facebook:hover { background-position: -25px 0; } .header-social-icons li > .skype { background-position: -50px -26px; } .header-social-icons li > .skype:hover { background-position: -50px -52px; } .header-social-icons.multicolor li > .skype:hover { background-position: -50px 0; } .header-social-icons li > .linkedin { background-position: -75px -26px; } .header-social-icons li > .linkedin:hover { background-position: -75px -52px; } .header-social-icons.multicolor li > .linkedin:hover { background-position: -75px 0; } .header-social-icons li > .rss { background-position: -100px -26px; } .header-social-icons li > .rss:hover { background-position: -100px -52px; } .header-social-icons.multicolor li > .rss:hover { background-position: -100px 0; } .header-social-icons li > .deviantart { background-position: -125px -26px; } .header-social-icons li > .deviantart:hover { background-position: -125px -52px; } .header-social-icons.multicolor li > .deviantart:hover { background-position: -125px 0; } .header-social-icons li > .googleplus { background-position: -150px -26px; } .header-social-icons li > .googleplus:hover { background-position: -150px -52px; } .header-social-icons.multicolor li > .googleplus:hover { background-position: -150px 0; } /* | ---------------------------------------------- | Main header | ---------------------------------------------- */ #header-center { margin: 0px 0; } #header-center > .container > .row { position: relative; height: 95px; } #header-center > .container > .row > [class*=col-] { height: 100%; } /* | ---------------------------------------------- | Logo | ---------------------------------------------- */ #header-center .logo { float: left; display: table; height: 100%; } #header-center .logo > a { display: table-cell; vertical-align: middle; } /* | ---------------------------------------------- | Basket button | ---------------------------------------------- */ .header-cart { display: table; float: right; height: 100%;z-index: 9999; } .header-cart > .inner { display: table-cell; vertical-align: middle; position: relative; } /* | ---------------------------------------------- | Cart items | ---------------------------------------------- */ .cart-items { z-index: 999; position: absolute; top: 100%; right: 0; margin-top: -1px; color: #fff; width: 250px; padding: 34px 20px; border: 1px solid #313131; background: #3F3E3E; display: none; } .cart-items .header { text-align: center; color: #FFFFFF; font-size: 13px; padding-bottom: 3px; border-bottom: 3px solid #333333; text-transform: uppercase; margin: 10px; } .cart-items .items { padding: 0; margin: 0 -20px; list-style: none; } .mini-cart-total tr td + td {padding-left: 40px;} .cart-items .items > li { -webkit-transition: all 0.15s linear; -moz-transition: all 0.15s linear; -o-transition: all 0.15s linear; transition: all 0.15s linear; padding: 6px 20px; } .cart-items .items > li:hover .item-thumbnail { box-shadow: 0 0 10px rgba(0,0,0,0.1); -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.1); } .cart-items .items .item-thumbnail { float: left; width: 50px; height: 60px; border: 1px solid #eaeaea; border-radius: 2px; background: #fff; padding: 2px; margin-right: 20px; } .cart-items .items .item-thumbnail > a { display: block; height: 100%; background: #e1e1e1; overflow: hidden; } .cart-items .items .item-name { position: relative; top: 3px; color: #fff; display: block; } .cart-items .items .item-price { color: #ed1651; font-weight: bold; margin-top: 10px; display: block; } .cart-items .footer { float: right; font-size: 11px; margin-top: 15px; text-decoration: underline; } .cart-items .footer a{ padding: 6px 20px 7px 15px; font-size: 12px; float: right; background: #ed1651; color: #fff !important; margin-left:15px; } .header-cart .empty{ text-align: center;} /* | ---------------------------------------------- | Nav bar | ---------------------------------------------- */ #menu-container { position: relative; top: 3px; padding: 0; margin: 0; z-index: -1; } #menu-container .inner { display: table; margin: 0 auto 3px; width: 100%; border-top: 3px solid #3F3E3E; border-bottom: 3px solid #3F3E3E; } .main-menu, .mobile-menu { display: table-cell; background: #3F3E3E; vertical-align: middle; } .search-cont{ display: table-cell; background: #3F3E3E; vertical-align: middle; } /* | ---------------------------------------------- | Main menu | ---------------------------------------------- */ .main-menu li { position: relative; } .main-menu > li { float: left; } .yellow .main-menu > li > a {color: #fff !important;} .main-menu > li > a { padding: 0 15px; line-height: 48px; display: block; text-transform: uppercase; font-weight: 600; font-size: 13px; color: #7e7e7e; } .main-menu > li > a > i { font-size: 18px; } .main-menu > li:first-child { } .main-menu a:before { position: absolute; bottom: -3px; left: -1px; width: 100%; height: 3px; padding: 0 1px; background-color: transparent; content: ' '; -webkit-transition: all 0.15s linear; -moz-transition: all 0.15s linear; -o-transition: all 0.15s linear; transition: all 0.15s linear; } .main-menu a:after { position: absolute; bottom: 48px; left: -1px; width: 100%; height: 3px; padding: 0 1px; background-color: transparent; content: ' '; -webkit-transition: all 0.15s linear; -moz-transition: all 0.15s linear; -o-transition: all 0.15s linear; transition: all 0.15s linear; } .main-menu > li.active > a:before, .main-menu > li > a:hover:before, .main-menu > li.active > a:after, .main-menu > li > a:hover:after { background-color: #ed1651; } .main-menu ul { list-style: none; padding: 0; margin: 0; } .main-menu li > ul, .main-menu .mega-menu { display: none; position: absolute; top: 100%; z-index: 99999; margin-top: 8px; border: 3px solid #3F3E3E; } .main-menu li > ul ul { top: 0px; left: 102%; width: 200px; margin-top: -3px; border: 3px solid #3F3E3E; } .main-menu li > ul > li > a { background: #fdfdfd; padding: 9px 12px; border-top: 1px solid #eaeaea; display: block; min-width: 170px; position: relative; } .main-menu li > ul > li > a:hover { background: #f1f1f1; } .main-menu ul .has-child > a:after { font-family: 'icomoon'; speak: none; -webkit-font-smoothing: antialiased; content: "\e01b"; float: right; margin-top: 2px; } .dl-menuwrapper li.dl-back:after, .dl-menuwrapper li > a:not(:only-child):after { position: absolute; top: 0; line-height: 50px; font-family: 'icomoon'; speak: none; -webkit-font-smoothing: antialiased; content: "\e01b"; } /* | ---------------------------------------------- | Mega menu | ---------------------------------------------- */ .mega-menu { width: 100%; left: 0; visibility: hidden; background: #fff; padding: 30px; } .mega-menu .menu-title { text-transform: uppercase; font-size: 13px; font-weight: 600; } .mega-menu .mm-col .mm-row { position: relative; overflow: hidden; } .mega-menu .mm-col:last-child .mm-row:after { content: ''; width: 0; height: 0; background: none; } .mega-menu ul > li { margin-top: 7px; } .mega-menu ul > li:first-child { margin-top: 0; } .mega-menu ul > li > a { position: relative; text-transform: capitalize; } .mega-menu ul > li > a:hover { } /* | ---------------------------------------------- | Search box | ---------------------------------------------- */ .search-cont { padding: 5px 15px; position: relative; max-width: 180px; } .search-cont form { position: relative; display: table; float: right; } .search-cont .query { background-color: #FFF; border: 1px solid #FFFFFF; color: #727272; padding-right: 32px; text-transform: uppercase; font-size: 13px; float: right; } .search-cont .btn-search { position: absolute; border: 0; background: transparent; top: 0px; right: 3px; } .search-cont .btn-search > i { height: 28px; line-height: 34px; display: block; color: #d3d3d3; font-size: 14px; } /* | ---------------------------------------------- | Mobile menu | ---------------------------------------------- */ .dl-menuwrapper { width: 100%; float: left; position: relative; -webkit-perspective: 1000px; -moz-perspective: 1000px; perspective: 1000px; -webkit-perspective-origin: 50% 200%; -moz-perspective-origin: 50% 200%; perspective-origin: 50% 200%; } .dl-menuwrapper button { background: #585858; border: none; width: 40px; height: 40px; font-size: 30px; color: #FFFFFF; overflow: hidden; position: relative; cursor: pointer; outline: none; -webkit-transition: all 0.15s linear; -moz-transition: all 0.15s linear; -o-transition: all 0.15s linear; transition: all 0.15s linear; margin: 11px 0 0 20px; border: 1px solid transparent; } .dl-menuwrapper button > i { position: relative; top: -5px; left: -2px; } .dl-menuwrapper button:hover, .dl-menuwrapper button.dl-active { background-color: #ddd; border-color: #ccc; color: #979797; } .dl-menuwrapper button.dl-active > i:before { content: "\f00d"; } .dl-menuwrapper ul { padding: 0; list-style: none; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; z-index: 9999; } .dl-menuwrapper li { position: relative; } .dl-menuwrapper a { display: block; position: relative; padding: 15px; font-size: 13px; font-weight: 600; text-transform: uppercase; outline: none; min-width: 250px; background: rgba(255, 255, 255, 1); } .no-touch .dl-menuwrapper li a:hover { background: #e7e7e7; } .dl-menuwrapper li.dl-back > a { padding-left: 30px; border-bottom: 1px solid #ccc; background: #dedede; } .dl-menuwrapper li.dl-back > a:hover { background: #ddd; } .dl-menuwrapper li.dl-back:after, .dl-menuwrapper li > a:not(:only-child):after { position: absolute; top: 0; line-height: 50px; font-family: 'icomoon'; speak: none; -webkit-font-smoothing: antialiased; content: "\e01b"; } .dl-menuwrapper li.dl-back:after { left: 10px; -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); transform: rotate(180deg); } .dl-menuwrapper li > a:after { right: 10px; color: rgba(0,0,0,0.15); } .dl-menuwrapper .dl-menu { margin: 11px 0 0 0; position: absolute; width: 100%; opacity: 0; pointer-events: none; -webkit-transform: translateY(10px); -moz-transform: translateY(10px); transform: translateY(10px); -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; backface-visibility: hidden; } .dl-menuwrapper .dl-menu.dl-menu-toggle { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; transition: all 0.3s ease; } .dl-menuwrapper .dl-menu.dl-menuopen { opacity: 1; border: 3px solid #DDD; pointer-events: auto; -moz-transform: translateY(0px); transform: translateY(0px); } /* Hide the inner submenus */ .dl-menuwrapper li .dl-submenu { display: none; } /* When a submenu is openend, we will hide all li siblings. For that we give a class to the parent menu called "dl-subview". We also hide the submenu link. The opened submenu will get the class "dl-subviewopen". All this is done for any sub-level being entered. */ .dl-menu.dl-subview li, .dl-menu.dl-subview li.dl-subviewopen > a, .dl-menu.dl-subview li.dl-subview > a { display: none; } .dl-menu.dl-subview li.dl-subview, .dl-menu.dl-subview li.dl-subview .dl-submenu, .dl-menu.dl-subview li.dl-subviewopen, .dl-menu.dl-subview li.dl-subviewopen > .dl-submenu, .dl-menu.dl-subview li.dl-subviewopen > .dl-submenu > li { display: block; } /* Dynamically added submenu outside of the menu context */ .dl-menuwrapper > .dl-submenu { position: absolute; width: 100%; top: 50px; left: 0; margin: 0; } /* Animation classes for moving out and in */ .dl-menu.dl-animate-out-1 { -webkit-animation: MenuAnimOut1 0.4s; -moz-animation: MenuAnimOut1 0.4s; animation: MenuAnimOut1 0.4s; } .dl-menu.dl-animate-out-2 { -webkit-animation: MenuAnimOut2 0.3s ease-in-out; -moz-animation: MenuAnimOut2 0.3s ease-in-out; animation: MenuAnimOut2 0.3s ease-in-out; } .dl-menu.dl-animate-out-3 { -webkit-animation: MenuAnimOut3 0.4s ease; -moz-animation: MenuAnimOut3 0.4s ease; animation: MenuAnimOut3 0.4s ease; } .dl-menu.dl-animate-out-4 { -webkit-animation: MenuAnimOut4 0.4s ease; -moz-animation: MenuAnimOut4 0.4s ease; animation: MenuAnimOut4 0.4s ease; } .dl-menu.dl-animate-out-5 { -webkit-animation: MenuAnimOut5 0.4s ease; -moz-animation: MenuAnimOut5 0.4s ease; animation: MenuAnimOut5 0.4s ease; } @-webkit-keyframes MenuAnimOut1 { 50% { -webkit-transform: translateZ(-250px) rotateY(30deg); } 75% { -webkit-transform: translateZ(-372.5px) rotateY(15deg); opacity: .5; } 100% { -webkit-transform: translateZ(-500px) rotateY(0deg); opacity: 0; } } @-webkit-keyframes MenuAnimOut2 { 100% { -webkit-transform: translateX(-100%); opacity: 0; } } @-webkit-keyframes MenuAnimOut3 { 100% { -webkit-transform: translateZ(300px); opacity: 0; } } @-webkit-keyframes MenuAnimOut4 { 100% { -webkit-transform: translateZ(-300px); opacity: 0; } } @-webkit-keyframes MenuAnimOut5 { 100% { -webkit-transform: translateY(40%); opacity: 0; } } @-moz-keyframes MenuAnimOut1 { 50% { -moz-transform: translateZ(-250px) rotateY(30deg); } 75% { -moz-transform: translateZ(-372.5px) rotateY(15deg); opacity: .5; } 100% { -moz-transform: translateZ(-500px) rotateY(0deg); opacity: 0; } } @-moz-keyframes MenuAnimOut2 { 100% { -moz-transform: translateX(-100%); opacity: 0; } } @-moz-keyframes MenuAnimOut3 { 100% { -moz-transform: translateZ(300px); opacity: 0; } } @-moz-keyframes MenuAnimOut4 { 100% { -moz-transform: translateZ(-300px); opacity: 0; } } @-moz-keyframes MenuAnimOut5 { 100% { -moz-transform: translateY(40%); opacity: 0; } } @keyframes MenuAnimOut1 { 50% { transform: translateZ(-250px) rotateY(30deg); } 75% { transform: translateZ(-372.5px) rotateY(15deg); opacity: .5; } 100% { transform: translateZ(-500px) rotateY(0deg); opacity: 0; } } @keyframes MenuAnimOut2 { 100% { transform: translateX(-100%); opacity: 0; } } @keyframes MenuAnimOut3 { 100% { transform: translateZ(300px); opacity: 0; } } @keyframes MenuAnimOut4 { 100% { transform: translateZ(-300px); opacity: 0; } } @keyframes MenuAnimOut5 { 100% { transform: translateY(40%); opacity: 0; } } .dl-menu.dl-animate-in-1 { -webkit-animation: MenuAnimIn1 0.3s; -moz-animation: MenuAnimIn1 0.3s; animation: MenuAnimIn1 0.3s; } .dl-menu.dl-animate-in-2 { -webkit-animation: MenuAnimIn2 0.3s ease-in-out; -moz-animation: MenuAnimIn2 0.3s ease-in-out; animation: MenuAnimIn2 0.3s ease-in-out; } .dl-menu.dl-animate-in-3 { -webkit-animation: MenuAnimIn3 0.4s ease; -moz-animation: MenuAnimIn3 0.4s ease; animation: MenuAnimIn3 0.4s ease; } .dl-menu.dl-animate-in-4 { -webkit-animation: MenuAnimIn4 0.4s ease; -moz-animation: MenuAnimIn4 0.4s ease; animation: MenuAnimIn4 0.4s ease; } .dl-menu.dl-animate-in-5 { -webkit-animation: MenuAnimIn5 0.4s ease; -moz-animation: MenuAnimIn5 0.4s ease; animation: MenuAnimIn5 0.4s ease; } @-webkit-keyframes MenuAnimIn1 { 0% { -webkit-transform: translateZ(-500px) rotateY(0deg); opacity: 0; } 20% { -webkit-transform: translateZ(-250px) rotateY(30deg); opacity: 0.5; } 100% { -webkit-transform: translateZ(0px) rotateY(0deg); opacity: 1; } } @-webkit-keyframes MenuAnimIn2 { 0% { -webkit-transform: translateX(-100%); opacity: 0; } 100% { -webkit-transform: translateX(0px); opacity: 1; } } @-webkit-keyframes MenuAnimIn3 { 0% { -webkit-transform: translateZ(300px); opacity: 0; } 100% { -webkit-transform: translateZ(0px); opacity: 1; } } @-webkit-keyframes MenuAnimIn4 { 0% { -webkit-transform: translateZ(-300px); opacity: 0; } 100% { -webkit-transform: translateZ(0px); opacity: 1; } } @-webkit-keyframes MenuAnimIn5 { 0% { -webkit-transform: translateY(40%); opacity: 0; } 100% { -webkit-transform: translateY(0); opacity: 1; } } @-moz-keyframes MenuAnimIn1 { 0% { -moz-transform: translateZ(-500px) rotateY(0deg); opacity: 0; } 20% { -moz-transform: translateZ(-250px) rotateY(30deg); opacity: 0.5; } 100% { -moz-transform: translateZ(0px) rotateY(0deg); opacity: 1; } } @-moz-keyframes MenuAnimIn2 { 0% { -moz-transform: translateX(-100%); opacity: 0; } 100% { -moz-transform: translateX(0px); opacity: 1; } } @-moz-keyframes MenuAnimIn3 { 0% { -moz-transform: translateZ(300px); opacity: 0; } 100% { -moz-transform: translateZ(0px); opacity: 1; } } @-moz-keyframes MenuAnimIn4 { 0% { -moz-transform: translateZ(-300px); opacity: 0; } 100% { -moz-transform: translateZ(0px); opacity: 1; } } @-moz-keyframes MenuAnimIn5 { 0% { -moz-transform: translateY(40%); opacity: 0; } 100% { -moz-transform: translateY(0); opacity: 1; } } @keyframes MenuAnimIn1 { 0% { transform: translateZ(-500px) rotateY(0deg); opacity: 0; } 20% { transform: translateZ(-250px) rotateY(30deg); opacity: 0.5; } 100% { transform: translateZ(0px) rotateY(0deg); opacity: 1; } } @keyframes MenuAnimIn2 { 0% { transform: translateX(-100%); opacity: 0; } 100% { transform: translateX(0px); opacity: 1; } } @keyframes MenuAnimIn3 { 0% { transform: translateZ(300px); opacity: 0; } 100% { transform: translateZ(0px); opacity: 1; } } @keyframes MenuAnimIn4 { 0% { transform: translateZ(-300px); opacity: 0; } 100% { transform: translateZ(0px); opacity: 1; } } @keyframes MenuAnimIn5 { 0% { transform: translateY(40%); opacity: 0; } 100% { transform: translateY(0); opacity: 1; } } .dl-menuwrapper > .dl-submenu.dl-animate-in-1 { -webkit-animation: SubMenuAnimIn1 0.4s ease; -moz-animation: SubMenuAnimIn1 0.4s ease; animation: SubMenuAnimIn1 0.4s ease; } .dl-menuwrapper > .dl-submenu.dl-animate-in-2 { -webkit-animation: SubMenuAnimIn2 0.3s ease-in-out; -moz-animation: SubMenuAnimIn2 0.3s ease-in-out; animation: SubMenuAnimIn2 0.3s ease-in-out; } .dl-menuwrapper > .dl-submenu.dl-animate-in-3 { -webkit-animation: SubMenuAnimIn3 0.4s ease; -moz-animation: SubMenuAnimIn3 0.4s ease; animation: SubMenuAnimIn3 0.4s ease; } .dl-menuwrapper > .dl-submenu.dl-animate-in-4 { -webkit-animation: SubMenuAnimIn4 0.4s ease; -moz-animation: SubMenuAnimIn4 0.4s ease; animation: SubMenuAnimIn4 0.4s ease; } .dl-menuwrapper > .dl-submenu.dl-animate-in-5 { -webkit-animation: SubMenuAnimIn5 0.4s ease; -moz-animation: SubMenuAnimIn5 0.4s ease; animation: SubMenuAnimIn5 0.4s ease; } @-webkit-keyframes SubMenuAnimIn1 { 0% { -webkit-transform: translateX(50%); opacity: 0; } 100% { -webkit-transform: translateX(0px); opacity: 1; } } @-webkit-keyframes SubMenuAnimIn2 { 0% { -webkit-transform: translateX(100%); opacity: 0; } 100% { -webkit-transform: translateX(0px); opacity: 1; } } @-webkit-keyframes SubMenuAnimIn3 { 0% { -webkit-transform: translateZ(-300px); opacity: 0; } 100% { -webkit-transform: translateZ(0px); opacity: 1; } } @-webkit-keyframes SubMenuAnimIn4 { 0% { -webkit-transform: translateZ(300px); opacity: 0; } 100% { -webkit-transform: translateZ(0px); opacity: 1; } } @-webkit-keyframes SubMenuAnimIn5 { 0% { -webkit-transform: translateZ(-200px); opacity: 0; } 100% { -webkit-transform: translateZ(0); opacity: 1; } } @-moz-keyframes SubMenuAnimIn1 { 0% { -moz-transform: translateX(50%); opacity: 0; } 100% { -moz-transform: translateX(0px); opacity: 1; } } @-moz-keyframes SubMenuAnimIn2 { 0% { -moz-transform: translateX(100%); opacity: 0; } 100% { -moz-transform: translateX(0px); opacity: 1; } } @-moz-keyframes SubMenuAnimIn3 { 0% { -moz-transform: translateZ(-300px); opacity: 0; } 100% { -moz-transform: translateZ(0px); opacity: 1; } } @-moz-keyframes SubMenuAnimIn4 { 0% { -moz-transform: translateZ(300px); opacity: 0; } 100% { -moz-transform: translateZ(0px); opacity: 1; } } @-moz-keyframes SubMenuAnimIn5 { 0% { -moz-transform: translateZ(-200px); opacity: 0; } 100% { -moz-transform: translateZ(0); opacity: 1; } } @keyframes SubMenuAnimIn1 { 0% { transform: translateX(50%); opacity: 0; } 100% { transform: translateX(0px); opacity: 1; } } @keyframes SubMenuAnimIn2 { 0% { transform: translateX(100%); opacity: 0; } 100% { transform: translateX(0px); opacity: 1; } } @keyframes SubMenuAnimIn3 { 0% { transform: translateZ(-300px); opacity: 0; } 100% { transform: translateZ(0px); opacity: 1; } } @keyframes SubMenuAnimIn4 { 0% { transform: translateZ(300px); opacity: 0; } 100% { transform: translateZ(0px); opacity: 1; } } @keyframes SubMenuAnimIn5 { 0% { transform: translateZ(-200px); opacity: 0; } 100% { transform: translateZ(0); opacity: 1; } } .dl-menuwrapper > .dl-submenu.dl-animate-out-1 { -webkit-animation: SubMenuAnimOut1 0.4s ease; -moz-animation: SubMenuAnimOut1 0.4s ease; animation: SubMenuAnimOut1 0.4s ease; } .dl-menuwrapper > .dl-submenu.dl-animate-out-2 { -webkit-animation: SubMenuAnimOut2 0.3s ease-in-out; -moz-animation: SubMenuAnimOut2 0.3s ease-in-out; animation: SubMenuAnimOut2 0.3s ease-in-out; } .dl-menuwrapper > .dl-submenu.dl-animate-out-3 { -webkit-animation: SubMenuAnimOut3 0.4s ease; -moz-animation: SubMenuAnimOut3 0.4s ease; animation: SubMenuAnimOut3 0.4s ease; } .dl-menuwrapper > .dl-submenu.dl-animate-out-4 { -webkit-animation: SubMenuAnimOut4 0.4s ease; -moz-animation: SubMenuAnimOut4 0.4s ease; animation: SubMenuAnimOut4 0.4s ease; } .dl-menuwrapper > .dl-submenu.dl-animate-out-5 { -webkit-animation: SubMenuAnimOut5 0.4s ease; -moz-animation: SubMenuAnimOut5 0.4s ease; animation: SubMenuAnimOut5 0.4s ease; } @-webkit-keyframes SubMenuAnimOut1 { 0% { -webkit-transform: translateX(0%); opacity: 1; } 100% { -webkit-transform: translateX(50%); opacity: 0; } } @-webkit-keyframes SubMenuAnimOut2 { 0% { -webkit-transform: translateX(0%); opacity: 1; } 100% { -webkit-transform: translateX(100%); opacity: 0; } } @-webkit-keyframes SubMenuAnimOut3 { 0% { -webkit-transform: translateZ(0px); opacity: 1; } 100% { -webkit-transform: translateZ(-300px); opacity: 0; } } @-webkit-keyframes SubMenuAnimOut4 { 0% { -webkit-transform: translateZ(0px); opacity: 1; } 100% { -webkit-transform: translateZ(300px); opacity: 0; } } @-webkit-keyframes SubMenuAnimOut5 { 0% { -webkit-transform: translateZ(0); opacity: 1; } 100% { -webkit-transform: translateZ(-200px); opacity: 0; } } @-moz-keyframes SubMenuAnimOut1 { 0% { -moz-transform: translateX(0%); opacity: 1; } 100% { -moz-transform: translateX(50%); opacity: 0; } } @-moz-keyframes SubMenuAnimOut2 { 0% { -moz-transform: translateX(0%); opacity: 1; } 100% { -moz-transform: translateX(100%); opacity: 0; } } @-moz-keyframes SubMenuAnimOut3 { 0% { -moz-transform: translateZ(0px); opacity: 1; } 100% { -moz-transform: translateZ(-300px); opacity: 0; } } @-moz-keyframes SubMenuAnimOut4 { 0% { -moz-transform: translateZ(0px); opacity: 1; } 100% { -moz-transform: translateZ(300px); opacity: 0; } } @-moz-keyframes SubMenuAnimOut5 { 0% { -moz-transform: translateZ(0); opacity: 1; } 100% { -moz-transform: translateZ(-200px); opacity: 0; } } @keyframes SubMenuAnimOut1 { 0% { transform: translateX(0%); opacity: 1; } 100% { transform: translateX(50%); opacity: 0; } } @keyframes SubMenuAnimOut2 { 0% { transform: translateX(0%); opacity: 1; } 100% { transform: translateX(100%); opacity: 0; } } @keyframes SubMenuAnimOut3 { 0% { transform: translateZ(0px); opacity: 1; } 100% { transform: translateZ(-300px); opacity: 0; } } @keyframes SubMenuAnimOut4 { 0% { transform: translateZ(0px); opacity: 1; } 100% { transform: translateZ(300px); opacity: 0; } } @keyframes SubMenuAnimOut5 { 0% { transform: translateZ(0); opacity: 1; } 100% { transform: translateZ(-200px); opacity: 0; } } /* No JS Fallback */ .no-js .dl-menuwrapper .dl-menu { position: relative; opacity: 1; -webkit-transform: none; -moz-transform: none; transform: none; } .no-js .dl-menuwrapper li .dl-submenu { display: block; } .no-js .dl-menuwrapper li.dl-back { display: none; } .no-js .dl-menuwrapper li > a:not(:only-child) { background: rgba(0,0,0,0.1); } .no-js .dl-menuwrapper li > a:not(:only-child):after { content: ''; } /* | ---------------------------------------------- | b. CONTENT SECTION | ---------------------------------------------- | 1. Top Slider | 2. Carousel | 3. Product list | 3-1. Product thumbnail | 3-2. Product info | 3-3. Product ribbon | 4. Our clients | ---------------------------------------------- */ #wrap-container { background-color: #fff; } .category-page .description{ margin: 25px 0; border: 3px solid #DDD; background: #FAFAFA; padding: 15px; } .category-page .description:before { padding: 0; content: ' '; width: 3px; height: 60px; background-color: #ed1651; position: absolute; bottom: 22px; left: 12px; } .category-page .description:after { padding: 0; content: ' '; height: 3px; width: 60px; background-color: #ed1651; position: absolute; bottom: 22px; left: 13px; } .category-page .desc-out:before { padding: 0; content: ' '; width: 3px; height: 60px; background-color: #ed1651; position: absolute; top: 22px; right: 12px; } .category-page .desc-out:after { padding: 0; content: ' '; height: 3px; width: 60px; background-color: #ed1651; position: absolute; top: 22px; right: 13px; } .footer-inner.alt:before { padding: 0; content: ' '; width: 60px; height: 3px; background-color: #ed1651; position: absolute; display: inherit; top: 4px; right: 48.6%; } .footer-inner.alt:after { padding: 0; content: ' '; height: 3px; width: 60px; background-color: #ed1651; position: absolute; display: inherit; top: -3px; right: 48.6%; } .footer-inner.main:before { padding: 0; content: ' '; width: 60px; height: 3px; background-color: #ed1651; position: absolute; display: inherit; bottom: 392px; right: 48.6%; } .footer-inner.main:after { padding: 0; content: ' '; height: 3px; width: 60px; background-color: #ed1651; position: absolute; display: inherit; bottom: 385px; right: 48.6%; } .section { margin-top: 25px; } .section:last-child { margin-bottom: 20px; } .section.carousel-iframe { margin-top: 40px; } .section.module-list-items { border: 3px solid #DDD; padding:15px 15px 25px; background-color:#fff; } /* | ---------------------------------------------- | Homepage 2 styles | ---------------------------------------------- */ .homepage2 .section.module-list-items:first-child { margin-top:20px !important; } .homepage2 .section.module-list-items .section-title:after{ background-color: #E0AB00; } .homepage2 .section.module-list-items { background: #333; color: #FFF; } .homepage2 .section.module-list-items .pretty-list> li > a{ color: #FFF; } @media screen and (max-width: 768px){ .home-container .tab-content .product {float:none !important} } .section h4.section-title {font-size:18px; color:#FF0000;} .section .section-title { text-transform: uppercase; font-weight: bold; padding-bottom: 12px; margin-bottom: 10px; border-bottom: 4px solid #EAEAEA; position: relative; } .widget-footer-body ul {margin-bottom: 0px;} .widget-footer-body ul li {float:right; list-style:none; margin-right: 15px;} .section .section-title:after { padding: 0; content: ' '; height: 4px; width: 140px; background-color: #3F3E3E; position: absolute; bottom: -4px; left: 0px; } .footer-inner .widget-header { text-transform: uppercase; font-weight: bold; padding-bottom: 12px; margin-bottom: 25px; border-bottom: 2px solid #EAEAEA; position: relative; } .footer-inner.alt .widget-header:after , .footer-inner.main .widget-header:after { padding: 0; content: ' '; height: 2px; width: 40px; background-color: #3F3E3E; position: absolute; bottom: -2px; left: 0px; } /* | ---------------------------------------------- | Top slider | ---------------------------------------------- */ #top-slider { min-height: 300px; margin: 20px auto; max-height: 500px; } #top-slider .slider-caption { width: 100%; max-height: 500px; padding: 10px 0; position: absolute; top: 0; color: #fff; bottom: auto; background-color: transparent; opacity: 0; -moz-opacity: 0; filter: alpha(opacity=100); left: 80px; } #top-slider .slider-caption .caption-body p { position: relative; padding: 0; font-size: 14px; text-shadow: 0 5px 5px rgba(0,0,0,0.3); } #top-slider .slider-caption .caption-body .title { font-weight: bold; text-shadow: 0 5px 5px rgba(0,0,0,0.3); margin-bottom: 20px; text-transform: uppercase; line-height: 1.5; } #top-slider .slider-caption .caption-body .subtitle { margin-bottom: 35px; line-height: 2; } #top-slider .slider-caption .caption-body .btn { display: inline-block !important; border: 0; border-radius: 2px; padding: 6px 15px; } #top-slider .slider-caption .caption-body .btn > span { font-size: 13px; font-weight: bold; padding-left: 12px; } #top-slider .slider-caption .caption-body .btn > i { padding-top: 3px; padding-bottom: 7px; border-right: 1px solid #fff; } #top-slider .slider-caption .big-number { font-size: 70px; } /* | ---------------------------------------------- | Caption carousel box | ---------------------------------------------- */ #top-slider .carousel-box .product { margin-bottom: 0; } #top-slider .slider-caption .carousel-box { width: 100%; max-width: 440px; float: right; background: #fff; border: 1px solid #eaeaea; border-radius: 1px; color: #7e7e7e; position: relative; top: 40px; } #top-slider .carousel-box .box-header { border-bottom: 1px solid #eaeaea; position: relative; background-color: #fafafa; } #top-slider .carousel-box .box-header .heading { text-transform: uppercase; font-weight: bold; padding: 1.4em; margin: 0; } #top-slider .carousel-box .box-header .carousel-direction-arrows { top: 13px; right: 19px; } #top-slider .carousel-box .box-content { padding: 19px; } #top-slider .carousel-box .carousel-list > li { padding: 0 15px; } #top-slider .carousel-box .carousel-list .title { font-size: 12px; text-transform: none; } #top-slider .carousel-box .carousel-list .details { font-size: 11px; } #top-slider .carousel-box .product-thumbnail { min-height: 100px; max-height: 200px; } /* | ---------------------------------------------- | Slider product's Hover effect | ---------------------------------------------- */ #top-slider .carousel-box .product-info.hover { display: none; } .noIE #top-slider .carousel-box .product-info.hover .add-to-cart { left: 10px; bottom: 10px; } .noIE #top-slider .carousel-box .product-info.hover { display: block; position: absolute; left: 0; bottom: 0; opacity: 0; -webkit-transform: translateY(100%); -moz-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; backface-visibility: hidden; -webkit-transition: -webkit-transform 0.4s, opacity 0.1s 0.3s; -moz-transition: -moz-transform 0.4s, opacity 0.1s 0.3s; transition: transform 0.4s, opacity 0.1s 0.3s; background: #fff; width: 100%; margin: 0; padding: 10px; } .noIE #top-slider .carousel-box .product:hover .product-info { opacity: 1; -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px); -webkit-transition: -webkit-transform 0.4s, opacity 0.1s; -moz-transition: -moz-transform 0.4s, opacity 0.1s; transition: transform 0.4s, opacity 0.1s; } /* | ---------------------------------------------- | Carousel | ---------------------------------------------- */ .carousel-iframe { position: relative; } .carousel-iframe li { margin: inherit; } .carousel-iframe .carousel-list { padding: 0; margin: 0; list-style: none; -webkit-transform: translate3d(0,0,0); -moz-transform: translate3d(0,0,0); -ms-transform: translate3d(0,0,0); -o-transform: translate3d(0,0,0); transform: translate3d(0,0,0); } .carousel-iframe .carousel-list > li { padding: 10px 15px; float: left; background-size: cover; -webkit-transition: all 0.3s ease-in; -moz-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .carousel-iframe .carousel-direction-arrows { position: absolute; top: -12px; right: 15px; } .direction-nav > li { float: left; } .direction-nav { padding: 0; margin: 0; list-style: none; } .direction-nav .btn { width: 52px; height: 34px; padding: 0; margin: 0 0px 0 6px; float: left; background: none !important; border: 3px solid; border-radius: 0; color: #3F3E3E; } .direction-nav .btn > span { font-size: 20px; color: #3F3E3E; line-height: 26px; } .carousel-direction-arrows .crsl-next, .direction-nav .btn-next { background: none !important; border: 3px solid; border-radius: 0; color: #3F3E3E; } .direction-nav .disabled { pointer-events: none; cursor: default; opacity: .65; filter: alpha(opacity=65); -webkit-box-shadow: none; box-shadow: none; background: none !important; border: 3px solid; border-radius: 0; color: #3F3E3E; } /* | ---------------------------------------------- | Product list | ---------------------------------------------- , */ .products-container .product { border: 3px solid #EAEAEA; position: relative; } .products-container .product:hover:after, .products-container .product:hover:before , .products-container .product:hover .ribbon:before { -webkit-transition: all 0.15s linear; -moz-transition: all 0.15s linear; -o-transition: all 0.15s linear; transition: all 0.15s linear; background-color: #333;} .products-container .product:hover:after {width: 88px;} .products-container .product:hover:before {height: 88px;} .products-container .product:after { padding: 0; content: ' '; height: 3px; width: 30px; background-color: #ed1651; position: absolute; bottom: -3px; left: -3px; } .products-container .product:before { padding: 0; content: ' '; height: 30px; width: 3px; background-color: #ed1651; position: absolute; bottom: 0px; left: -3px; } .products-container .product:hover .ribbon { border-color:#333; -webkit-transition: all 0.15s linear; -moz-transition: all 0.15s linear; -o-transition: all 0.15s linear; transition: all 0.15s linear; } /* | ---------------------------------------------- | Product thumbnail | ---------------------------------------------- */ .products-container .product .product-link { display: block; text-align: center; } .products-container .product .product-link .product-thumbnail img { transition: all 0.25s ease-in-out; -o-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; -webkit-transition: all 0.25s ease-in-out; } .products-container .product .product-link:hover .product-thumbnail img { -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -o-transform: scale(1.05); transform: scale(1.05); } .products-container .product .product-thumbnail { position: relative; background-color: #fafafa; overflow: hidden; } .products-container .product .product-thumbnail.loading { background: #fafafa url('../img/loading.html') no-repeat center center; } .products-container.portrait .product .product-thumbnail { } .products-container.landscape .product .product-thumbnail { min-height: 100px; max-height: 205px; } .product-thumbnail > .caption { position: absolute; bottom: 0; left: 0; padding: 0.75em 1.25em; font-weight: 600; color: #fff; background-color: #ed1651; opacity: 0.8; filter: alpha(opacity=80); -webkit-transition: all 0.15s ease-in; -moz-transition: all 0.15s ease-in; -o-transition: all 0.15s ease-in; transition: all 0.15s ease-in; } .products-container .product:hover .product-thumbnail > .caption { opacity: 1; filter: alpha(opacity=100); } .product-thumbnail > .caption.bottom-left { bottom: 0; left: 0; top: auto; right: auto; } .product-thumbnail > .caption.top-right { bottom: auto; left: auto; top: 0; right: 0; } /* | ---------------------------------------------- | Product info | ---------------------------------------------- */ .products-container .product .product-info .product-price .price-old{font-size: 14px; font-weight: 400; text-decoration: line-through;} .products-container .product .product-info .product-price .price-new{font-size: 14px; font-weight: 800; padding-left: 10px;} .products-container .product .product-info .product-price .price-org{font-size: 14px; font-weight: 800; } .products-container .product .product-info { padding:5px; text-align:center; background:#fff; position: relative; } .featured .product .product-info { margin: 15px 0 0 0; } .products-container .product h4.title { margin: 10px 0; } .offer .product-info .title { font-size: 14px; text-transform: capitalize; font-weight: 600; margin: 10px 0; line-height: 20px; margin-bottom: 5px; } .offer .product-info .details { font-size: 11px; font-weight: 300; } .offer .product-info .by , .home-container .product-info .by { right: 5px; position: absolute; bottom: 83px; } #product-list-container .mix .product-info .by{ bottom: 92px ; } .product-list .mix .product-info .by{ bottom: 52px !important; } .offer .product-info .by > a { color: #ed1651; } .offer .product-info .by > a:hover { text-decoration: underline; } .offer .product-info > .add-to-cart { color: #ed1651; font-size: 24px; position: absolute; bottom: 0; left: 0; top: 20px; } .offer .product-info > .add-to-cart:hover { -webkit-animation-name: swing; -moz-animation-name: swing; -o-animation-name: swing; animation-name: swing; -webkit-animation-duration: 1s; -moz-animation-duration: 1s; -o-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; } .offer .product-thumbnail > .caption { font-size: 12px; } /* | ---------------------------------------------- | Homepage tab module | ---------------------------------------------- */ .home-container { text-align:center;} .home-container .tab-content { border: 0; padding: 15px; overflow:hidden; } .products-container .button-add .button-add-inner .wishlist-hover{top:0px; opacity: 0;} .products-container .button-add .button-add-inner .compare-hover{ opacity: 0; top: 80px} .products-container .button-add .button-add-inner .cart-hover {bottom:-80px; opacity: 0;} .products-container .product:hover .button-add .button-add-inner .wishlist-hover{top:80px; opacity: 1;} .products-container .product:hover .button-add .button-add-inner .cart-hover{bottom:-110px; opacity: 1;} .products-container .product:hover .button-add .button-add-inner .compare-hover{ opacity: 1;} ,.products-container .button-add .button-add-inner .compare-hover { display: block !important;} .products-container .button-add .button-add-inner .wishlist-hover { display: block !important; -webkit-animation-name: fadeInDown; -moz-animation-name: fadeInDown; -o-animation-name: fadeInDown; animation-name: fadeInDown; -webkit-animation-duration: 1s; -moz-animation-duration: 1s; -o-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; } .products-container .button-add .button-add-inner .cart-hover { display: block !important; -webkit-animation-name: fadeInUp; -moz-animation-name: fadeInUp; -o-animation-name: fadeInUp; animation-name: fadeInUp; -webkit-animation-duration: 1s; -moz-animation-duration: 1s; -o-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; } .home-container .tab-content .products-container .product:hover .button-add, .carousel-iframe .products-container .product:hover .button-add , #product-list-container.product-grid .mix_all .product:hover .button-add { display: block !important; } .home-container .tab-content .products-container .product .button-add, .carousel-iframe .products-container .button-add , #product-list-container.product-grid .mix_all .product .button-add { top: 0; display: none; width: 100%; height: 80%; position: absolute; pointer-events: none; left: 50px; } #product-list-container.product-grid.two-column .mix_all .product .button-add { ; } #product-list-container.product-grid.four-column .mix_all .product .button-add { top: -40px; left: 40px; } .home-container .tab-content .products-container .product .button-add-inner, .carousel-iframe .products-container .button-add-inner , #product-list-container.product-grid .mix_all .product .button-add-inner{ width: 100%; position: absolute; display: block !important; } .home-container .tab-content .products-container .product .button-add-inner, .carousel-iframe .products-container .button-add-inner , #product-list-container.product-grid .mix_all .product .product-info .button-add-inner { width: 100%; position: absolute; } #product-list-container.product-list .mix_all .product .product-info .button-add {} .home-container .tab-content .products-container .product .button-add a , .carousel-iframe .products-container .button-add a , #product-list-container.product-grid .mix_all .product .button-add a{ color: #FFF; pointer-events: all; position: relative; border: 3px solid #FFF; text-transform: uppercase; text-align: center; padding: 10px 15px; margin: 3px 0; width: 61%; border-radius: 2px; position: relative; display: inline-block; } .home-container .tab-content .products-container .product .button-add a:hover , .carousel-iframe .products-container .button-add a:hover , #product-list-container.product-grid .mix_all .product .button-add a:hover{background-color:#333 !important;} .home-container .tab-content .product h4{ font-size: 13px; font-weight: 600; margin-bottom: 5px; } .pro-compare{margin-top:7px;} .compare-total{ text-transform: capitalize; background: #F5F5F5; border: 3px solid #EBEBEB; padding: 6px 10px; margin-right: 1px; color: #797979; -webkit-animation-name: fadeInUp; -moz-animation-name: fadeInUp; -o-animation-name: fadeInUp; animation-name: fadeInUp; -webkit-animation-duration: 1s; -moz-animation-duration: 1s; -o-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; } .compare-total:hover{ text-transform: capitalize; background: #ed1651; border: 3px solid #333; color: #fff; -webkit-animation-name: fadeInUp; -moz-animation-name: fadeInUp; -o-animation-name: fadeInUp; animation-name: fadeInUp; -webkit-animation-duration: 1s; -moz-animation-duration: 1s; -o-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; } .ln2{line-height:2;} .home-container .tab-content .product{ position: relative; text-align:left !important; } #product-list-container.product-list .mix_all .product .button-add{display: none !important;} .btn-group>.btn, .btn-group-vertical>.btn { position: relative; float: left; text-transform: uppercase; font-weight: bold; padding-bottom: 8px; margin: 25px 0; border-bottom: 1px solid #EAEAEA; position: relative; } /* | ---------------------------------------------- | Product ribbon | ---------------------------------------------- */ .products-container .product .ribbon { position: absolute; top: -5px; right: -6px; text-transform: uppercase; font-weight: bold; border: 3px solid #ed1651; border-bottom: 0; border-left: oldlace; color: #575757; padding: 7PX 15PX; z-index: 1; } .products-container .product .ribbon.new { background-position: 0 0; } .products-container .product .ribbon.hot { background-position: -78px 0; } .products-container .product .ribbon.special { background-position: -156px 0; } /* | ---------------------------------------------- | c. FOOTER SECTION | ---------------------------------------------- */ #footer-container {background-color:#fff; position: relative; margin-top:20px;} .footer-inner.alt{background-color:#fff; position: relative;} .footer-inner .container{ padding: 20px 0; } .footer-inner.main .container{ color: #333; border-top: 4px solid #3F3E3E; min-height: 340px; } .footer-inner.alt .container { color: #333; border-top: 4px solid #3F3E3E; } .footer-powered .container{ background-color: #474747; color: #CECECE; padding:10px ; } .footer-powered .container ul li a{ color: #fff;} .footer-inner .widget { position: relative; } /* text widget */ .widget-text p { font-size: 12px; font-weight: 400; } /* facebook widget */ .fb-like-box { min-height: 200px; } /* subscription */ .frm-subs { margin: 15px 0; } .frm-subs .button-sbsr{ padding: 2px; } .frm-subs .subscribe-input{ max-width: 160px; float: left; } .frm-subs .subscribe-title{ background: #333; color: #FFF; padding: 10px; min-width: 260px; margin-bottom: 1px; text-align: center; } .card-icons { padding: 0; margin: 30px 0; list-style: none; } .card-icons > li { display: inline-block; } /* footer links list */ .wdgt-linklist ul { padding: 0; margin: 0; list-style: none; } .wdgt-linklist ul > li { margin-bottom: 5px; margin-left: -15px; } .wdgt-linklist ul > li > a { position: relative; } /* twitter feed */ .twitterfeed ul { padding: 0; margin: 0 0 0 42px; list-style: none; } .twitterfeed .tweet_list > li { margin-top: 20px; position: relative; } .twitterfeed .tweet_list > li:first-child { margin-top: 0; } .twitterfeed .tweet_list > li:before { font-size: 27px; position: absolute; left: -42px; top: 2px; -webkit-transition: all 0.15s linear; -moz-transition: all 0.15s linear; -o-transition: all 0.15s linear; transition: all 0.15s linear; font-family: 'icomoon'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; content: "\e772"; } .twitterfeed .tweet_list > li:hover:before, .twitterfeed .tweet_text a { color: #ed1651; } .twitterfeed .tweet_text a:hover { text-decoration: underline; } .twitterfeed .tweet_list .tweet_time { display: block; margin-top: 10px; font-style: italic; } /* | ---------------------------------------------- | d. INNER PAGES | ---------------------------------------------- | - Display mode | - Range slider | - Product grid & Product List | - Product single page | - Checkout | - Shopping Cart | - Contact us | ---------------------------------------------- */ .breadcrumbs-wrapper .container{ background: #3F3E3E; padding: 30px ; box-shadow: inset 0 -1px 3px rgba(0,0,0,0.1); -webkit-box-shadow: inset 0 -1px 3px rgba(0,0,0,0.1); min-height:60px; position:relative; display:block; margin: 10px auto 0; color: #FFF; } .breadcrumbs-wrapper .container:after { padding: 0; content: ' '; height: 3px; width: 60px; background-color: #ed1651; position: absolute; bottom: -3px; left: -3px; } .breadcrumbs-wrapper .container:before { padding: 0; content: ' '; width: 3px; height: 60px; background-color: #ed1651; position: absolute; bottom: -3px; left: -3px; } .lte8 .breadcrumbs-wrapper { border-bottom: 1px solid #e9e9e9; } /* | ---------------------------------------------- | Display mode | ---------------------------------------------- */ .display-mode ul > li { float: left; margin-left: 16px; margin-top: 5px; } .display-mode ul > li > a { color: #757575; pointer-events: all; position: relative; } .display-mode ul > li > a:hover { color: #ed1651; } .display-mode ul > li span { margin-right: 5px; } .display-mode ul > .active span { color: #ed1651; } /* | ---------------------------------------------- | Range slider | ---------------------------------------------- */ .range-slider, .range-slider > a { cursor: pointer; } .range-slider-container { width: 100%; margin: 0 auto; } .range-slider-value { position: relative; height: 40px; margin-top: 10px; } .range-slider-value > span { float: left; position: absolute; top: 10px; left: 0; margin-left: -15px; color: #fff; padding: 5px 10px; background: #ed1651; border-radius: 0 0 2px 2px; font-size: 11px; visibility: hidden; } .range-slider-value > span:before { content: ' '; width: 0px; height: 0px; border-style: solid; border-width: 0 4px 4px 4px; border-color: transparent transparent #ed1651 transparent; position: absolute; top: -4px; left: 50%; margin-left: -4px; } #refinebyprice { } #refinebyprice input{ background: transparent; border: none; padding: 5px 0px; font-weight: bold; }#slider-range { margin-top:10px; } .help-txt-heading { font-size: 10px; }.help-txt { font-size: 10px; font-weight: bold; } .buttonclear { margin:0 10px 10px 35px; } #amount { font-size:18px; opacity:0; border: 0; font-weight: bold; } /* | ---------------------------------------------- | Product grid & Product List | ---------------------------------------------- */ .filter-box{ background: #F5F5F5; padding: 15px 0; margin: 15px 0; border: 3px solid #EBEBEB; } .filtersgroup ,.display-mode { padding: 0 15px;} .filtersgroup .limit {float: left;margin-right: 10px; } .filtersgroup .sort {float: left;margin-right: 10px; } span.icon-shopcart {cursor: pointer;} #product-list-container .mix .product{margin-bottom: 20px;} #product-list-container .mix { float: none; opacity: 0; filter: alpha(opacity=0); /* display: none; */ margin-right: -3px; } .text-empty { background: #ed1651; padding: 15px; color: #FFF; font-size: 16px; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; } .product-list .mix { width: 100%; } .products-container.product-grid .product-info .listdescription { display: none; } .products-container.product-list .product-info .details, .products-container.product-list .product-info > .add-to-cart { display: none; } .products-container.product-list .product-info .add-to-cart{float:left; margin-right: 10px;} .products-container.product-list .product-info ul.links {float:left; margin-right: 10px; padding:0px;} .products-container.product-list .product-info ul.links li {list-style: none; border: 3px solid #DDD; float: left;color: #4E4E4E; padding: 20px 15px;} .products-container.product-list .product-info ul.links li + li{/* border-top: 0px solid #FFF; */margin-left: 10px;} .products-container.product-list .product-info ul.links li a {color: #868686;font-weight: bold;} .products-container.product-list .product-info ul.links li i{font-size: 23px;vertical-align: middle;} .product-list .product-info h4.title { font-size: 17px; text-transform: uppercase; font-weight: 800; margin: 0 0 15px; } .product-list .product-info .product-price{margin: 10px 0 ;} .product-list .product-info .listdescription .text{margin-bottom: 10px ;} .productpage-info .description .prices { font-size: 20px; font-weight: 600; margin: 25px 0; background: #ed1651; width: 35%; padding: 15px; color: #fff; line-height: 1; } .productpage-info .description .prices:after { position: absolute; top: 82px; left: -67px; z-index: 9999; width: 80px; height: 3px; padding: 0 1px; background-color: #ed1651; content: ' '; } .productpage-info .description .prices:before { position: absolute; top: 78px; left: -70px; z-index: 9999; width: 10px; height: 12px; border-radius:33px; padding: 0 1px; background-color: #ed1651; content: ' '; } .productpage-info .description .discount { border-bottom: 1px solid #EEE; border-top: 1px solid #EEE; padding: 15px 0; margin-bottom: 15px; } .productpage-info .description .prices > .off-price { color: #fff; } .productpage-info .description .prices > .orginal-price { color: #F00; display: block; margin-top: 15px; padding-top: 15px; border-top: 3px solid #FFF; } .productpage-info .description .text span{color: #ed1651; margin-right:10px;line-height:22px;} .productpage-info .description .text { margin-bottom: 25px; text-transform: capitalize; } .productpage-info .description .links { padding: 0; margin: 0; list-style: none; float: left; clear: none; } .productpage-info .ratings-list{ width: 100%; display: inline-flex; float: left; text-align: left; } .productpage-info .description .review .share{margin: 20px 0;} .productpage-info .description .review { display: inline-block; margin: 20px 0; border-top: 1px solid #EEE; padding: 20px 0; } .productpage-info .description .links > li:first-child {margin-right:5px;} .productpage-info .description .links > li { float: left; background: #3F3E3E; padding: 5px 11px 5px 15px; color: #fff; line-height: 50px; margin-top:5px; } .productpage-info .description .links > li a{color:#fff;} .productpage-info .description .add-to-cart { float: left; } .productpage-info .description .minimum {margin-bottom: 20px;} .productpage-info .description .add-to-cart > .btn { padding: 20px 92px; text-transform: uppercase; font-size: 13px; border: 0; border-radius: 0; } .productpage-info .description .add-to-cart > .btn > i { line-height: 26px; padding-right: 12px; margin-right: 12px; border-right: 1px solid #fff; } .productpage-info .description .add-to-cart > .btn > span { font-size: 11px; font-weight: bold; } /* | ---------------------------------------------- | Product details single page | ---------------------------------------------- */ .product-single { } /* | ---------------------------------------------- | Product details single page | ---------------------------------------------- */ .product-single { margin-bottom: 30px; border: 3px solid #EAEAEA; position: relative; padding: 10px; } .product-single .product-album > a { display: block; min-height: 350px; background: #fafafa; } .product-single .product-album > ul { text-align: center; margin: 7px 0; padding: 0; } .product-single .product-album > ul > li { float: left; } .product-single .product-album > ul > li:first-child { } .product-single .product-album > ul > li > a { } .productpage-info h3.title {margin-top:15px;text-transform: uppercase;font-weight: 800;} .product-single .product-image-additional > a { display: block; min-height: 250px; background: #fafafa; } .product-single .product-image-additional > ul { text-align: center; margin: 7px 0; } .product-single .product-image-additional > ul > li { display: inline-block; margin-right: 2px; } .product-single .product-image-additional > ul > li:first-child { margin-left: 2px; } .product-single .product-image-additional > ul > li > a { width: 80px; height: 80px; display: block; overflow: hidden; border-right: 1px solid #dfdfdf; border-bottom: 1px solid #dfdfdf; background: #fafafa; overflow: hidden; } .product-single .image { } .product-single .image-additional { } .product-single .image-additional img { } .product-single .image-additional a { } .product-gallery { list-style-type: none; margin: 10px 0 0px; text-align: left; padding: 0px 13px 2px 13px; } .product-gallery li { float:left; } .product-gallery img { } .product-album ul {margin-right:-5px !important;} .product-album .unstyled li a { background: #fff; display: block; padding: 3px 5px 0 0; width: 133.5px; } .product-single .product-info .title { text-transform: uppercase; border-bottom: 3px solid #ddd; padding-bottom: 10px; font-weight: 600; margin: 15px 0 25px; } .product-single .product-info .description .prices { font-size: 26px; margin: 15px 0; } .product-single .product-info .qty input { font-size: 11px; font-weight: 300; color: #6b6b6b; border: 1px solid #eaeaea; width: 30px; text-align: center; margin-left: 10px; border-radius: 1px; } /* | ---------------------------------------------- | Checkout | ---------------------------------------------- */ .accordion-inner .title { font-size: 13px; font-weight: 600; text-transform: uppercase; margin: 0 0 25px 0; color: inherit; border: 0; } .checkout .form-login, .checkout .form-account{ margin: 30px 0; } .checkout .btn { min-width: 100px; } .paymethod label { font-weight: 600; } /* | ---------------------------------------------- | Cart | ---------------------------------------------- */ .my-cart { width: 100%; border: 3px solid #eaeaea; border-radius: 0; } .my-cart thead { background: #f8f8f8; } .my-cart thead th { text-transform: uppercase; text-align: center; padding: 13px 10px; font-weight: 600; } .my-cart tbody { border-top: 3px solid #eaeaea; } .my-cart tbody td { padding: 20px 10px; text-align: center; } /** Table headings */ .my-cart .product-thumbnail { width: 15%; } .my-cart .product-name { width: 35%; } .my-cart .product-qty { width: 25%; } .my-cart .product-price { width: 15%; } .my-cart .product-action { width: 10%; } /** Product thumbnail */ .my-cart .img-placeholder { padding: 2px; border: 1px solid #eaeaea; border-radius: 2px; width: 70px; min-height: 70px; margin: 0 auto; } .my-cart .img-placeholder > a { background: #e1e1e1; display: block; height: 100%; } /** Product quantity */ .my-cart .qty-btngroup { margin: 0 auto; display: table; } .qty-btngroup button, .qty-btngroup input[type="text"] { width: 40px; height: 35px; float: left; color: #FFFFFF; } .qty-btngroup button { border: 0; background: #3F3E3E; } .qty-btngroup button:hover { color: #fff; background: #ed1651; } .qty-btngroup input[type="text"] { border: 1px solid #3F3E3E; color: #333; border-left: 0; border-right: 0; border-radius: 0; text-align: center; font-size: 11px; } .qty-btngroup .plus { border-radius: 0 2px 2px 0; } .qty-btngroup .minus { border-radius: 2px 0 0 2px; } /** Product price */ .my-cart td > .price { color: #ed1651; font-weight: 600; font-size: 13px; } /** Remove product icon */ .my-cart .remove-item { visibility: hidden; opacity: 0; font-size: 1.5em; } .my-cart tbody tr:hover .remove-item { opacity: 1; visibility: visible; } /** Shop cart summary */ .shop-summary td, .shop-summary th { padding-bottom: 10px; font-size: 13px; font-weight: 600; } .shop-summary th { text-align: right; text-transform: uppercase; } .shop-summary td { padding-left: 60px; } .shop-summary .total td, .shop-summary .total th { font-size: 20px; padding-top: 20px; padding-bottom: 15px; } .shop-summary .total td { color: #ed1651; } #header-annonce, #footer-annonce{ margin:15px 0 ;-webkit-transition: all 0.15s linear; -moz-transition: all 0.5s linear; -o-transition: all 0.5s linear; transition: all 0.5s linear;transition-property: width; transition-duration: 1s; transition-timing-function: linear; transition-delay: 2s; } #footer-annonce .annonce:nth-child(2) {background: #727272 ;} #footer-annonce .annonce:nth-child(3) {background: #7C7C7C ;} #footer-annonce .annonce:nth-child(4) {background: #8F8F8F ;} .annonce {background: #3F3E3E; padding:15px; text-align:center;} .annonce:hover {background: #ed1651 !important;-webkit-transition: all 0.15s linear; -moz-transition: all 0.5s linear; -o-transition: all 0.5s linear; transition: all 0.5s linear;} .annonce div.iconic, #header-annonce i{font-size: 27px;color:#fff;} .annonce h3 , .annonce p {color:#fff;} .annonce h3 {margin:15px 0 ;} /* | ---------------------------------------------- | Contact us | ---------------------------------------------- */ #contact-map { height: 345px; background: #efefef; } .contact textarea { height: 170px; } .contact-inner { padding-right:30px; } .contact .btn { font-size: 12px; border-radius: 1px; margin-top: 20px; } .required { color: #FF0000; font-weight: bold; } .error { display: block; color: #FF0000; } .help { color: #999; font-size: 10px; font-weight: normal; font-family: Verdana, Geneva, sans-serif; display: block; } table.form { width: 100%; border-collapse: collapse; margin-bottom: 20px; } table.form tr td:first-child { width: 150px; } table.form > * > * > td { color: #7E7E7E; } table.form td { padding: 4px; } input.large-field, select.large-field { width: 300px; } table.list { border-collapse: collapse; width: 100%; border-top: 1px solid #EAEAEA; border-left: 1px solid #EAEAEA; margin-bottom: 20px; } table.list td { border-right: 1px solid #EAEAEA; border-bottom: 1px solid #EAEAEA; } table.list thead td { background-color: #EFEFEF; padding: 0px 5px; } table.list thead td a, .list thead td { text-decoration: none; color: #222222; font-weight: bold; } table.list tbody td { padding: 0px 5px; } table.list .left { text-align: left; padding: 7px; } table.list .right { text-align: right; padding: 7px; } table.list .center { text-align: center; padding: 7px; } table.radio { width: 100%; border-collapse: collapse; } table.radio td { padding: 5px; } table.radio td label { display: block; } table.radio tr td:first-child { width: 1px; } table.radio tr td:first-child input { margin-top: 1px; } table.radio tr.highlight:hover td { background: #F1FFDD; cursor: pointer; } .pagination { border-top: 1px solid #EEEEEE; padding-top: 10px; display: inline-block; width: 100%; margin-bottom: 10px; } .pagination .links { float: left; } .pagination .links a { background: #FDFDFD; border: 3px solid; padding: 10px ; line-height: 24px; text-align: center; font-size: 13px; font-weight: 300; } .pagination .links b { background: #000; padding: 10px ; line-height: 24px; text-align: center; font-size: 13px; font-weight: 300; color: #fff !important; border: 3px solid #000; border-bottom-color: #ff5757; } .pagination .results { float: right; padding-top: 3px; } /*============== refine_search =====================*/ .refine-container{ margin-left: -25px;} /* ul */ div.refine_search ul { float: none; } div.refine_search ul li { border: 2px solid #ddd; padding: 5px 10px; list-style:none; float:left; margin-right: 3px; margin-bottom: 3px; } div.refine_search ul li div { padding:5px; display: block; background:#FAFAFA; box-shadow: inset 0 -1px 3px rgba(0, 0, 0, 0.1); -webkit-box-shadow: inset 0 -1px 3px rgba(0, 0, 0, 0.1); } div.refine_search ul li div:hover { background: #F3F3F3; border-color: #ccc; } div.refine_search ul li img { display: block; width: 143px; height: 143px; } div.refine_search ul li h6 { margin: 8px 0; padding: 0; font-size: 12px; white-space: pre-line; line-height: 15px; } /* button */ input[type="text"], input[type="password"] { display: block; height: 34px; padding: 6px 12px; font-size: 14px; line-height: 1.428571429; color: #555; vertical-align: middle; background-color: #FFF; border: 1px solid #CCC; border-radius: 0; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; padding: 5px 10px; } a.button, input.button { filter: none; color: #FFF; border: 0; padding: 11px 12px; font-weight: bold; min-width: 100px; padding: 8px 15px 9px 15px; display: inline-block; } a.button:hover, input.button:hover { } .buttons { background: #FFFFFF; border: 1px solid #EEEEEE; overflow: auto; padding: 6px; margin-bottom: 20px; } .buttons .left { float: left; text-align: left; } .buttons .right { float: right; text-align: right; } .buttons .center { text-align: center; margin-left: auto; margin-right: auto; } ..nav-tabs{ height: 29px; line-height: 19px; border-bottom: 3px solid #EAEAEA; } .nav-tabs>li>a { padding: 11px 20px; border-top: 3px solid #EAEAEA; border-left: 3px solid #EAEAEA; border-right: 3px solid #EAEAEA; background: #FAFAFA; font-size: 13px; text-transform: uppercase; text-align: center; text-decoration: none; color: #7E7E7E; margin-right: 2px; border-radius:0; } .nav-tabs>li.active>a, .nav-tabs>li.active>a:hover, .nav-tabs>li.active>a:focus { border-radius:0; padding: 11px 20px; border-top: 3px solid #EAEAEA; border-left: 3px solid #EAEAEA; border-right: 3px solid #EAEAEA; border-bottom: 0 !important; background-color: #ed1651; font-size: 13px; text-transform: uppercase; text-align: center; text-decoration: none; color: #fff; margin-right: 2px; } .nav-tabs { border-bottom: 3px solid #EEE; } .nav-tabs>li { float: left; margin-bottom: 0px; } .htabs a.selected { padding-bottom: 7px; color: #FFF; } .tab-content { border-left: 3px solid #EAEAEA; border-right: 3px solid #EAEAEA; border-bottom: 3px solid #EAEAEA; background: #FFF; padding: 13px; margin-bottom: 20px; z-index: 2; overflow: auto; } h4#review-title{margin: 15px 0;} .ui-menu { z-index: 9999 !important; } /* box */ .box { margin-bottom: 20px; } .box .box-heading { -webkit-border-radius: 7px 7px 0px 0px; -moz-border-radius: 7px 7px 0px 0px; -khtml-border-radius: 7px 7px 0px 0px; border-radius: 7px 7px 0px 0px; border: 1px solid #DBDEE1; background: url('../image/background.html') repeat-x; padding: 8px 10px 7px 10px; font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; line-height: 14px; color: #7E7E7E; } .box .box-content { background: #FFFFFF; -webkit-border-radius: 0px 0px 7px 7px; -moz-border-radius: 0px 0px 7px 7px; -khtml-border-radius: 0px 0px 7px 7px; border-radius: 0px 0px 7px 7px; border-left: 1px solid #DBDEE1; border-right: 1px solid #DBDEE1; border-bottom: 1px solid #DBDEE1; padding: 10px; } /* box category */ ul.box-category, ul.box-category ul { list-style: none; margin: 0; padding: 0; } ul.box-category > li:first-child { padding: 0px 8px 8px 0px; } ul.box-category > li { padding: 8px 8px 8px 0px; } ul.box-category > li + li { border-top: 1px solid #EEEEEE; } ul.box-category > li > a { text-decoration: none; color: #7E7E7E; } ul.box-category > li ul { display: none; } ul.box-category > li a.active { font-weight: bold; } ul.box-category > li a.active + ul { display: block; } ul.box-category > li ul > li { padding: 5px 5px 0px 10px; } ul.box-category > li ul > li > a { text-decoration: none; display: block; } ul.box-category > li ul > li > a.active { font-weight: bold; } /* box filter */ ul.box-filter, ul.box-filter ul { list-style: none; margin: 0; padding: 0; } ul.box-filter span { font-weight: bold; display: block; padding-bottom: 5px; margin-bottom: 8px; } ul.box-filter > li ul { padding-bottom: 10px; } /*accordion menu*/ .accordionmenu{ border: 3px solid #DDD; padding: 15px 15px 25px; background-color: #FFF; } .accordionmenu a.menuitem{ display: block; margin: 6px 0; position: relative; /*To help in the anchoring of the ".statusicon" icon image*/ } .accordionmenu a.menuitem .statusicon{ /*CSS for icon image that gets dynamically added to headers*/ position: absolute; top: 5px; right: 5px; border: none; } .accordionmenu div.submenu ul{ /*UL of each sub menu*/ list-style-type: none; margin: 0; padding: 0; } .accordionmenu div.submenu ul li{ margin: 3px; }.accordionmenu div.submenu ul li a{ display: block; } /* content */ #content .content { padding: 10px; overflow: auto; margin-bottom: 20px; border: 1px solid #EEEEEE; } #content .content .left { float: left; width: 49%; } #content .content .right { float: right; width: 49%; } /* category */ .category-info { overflow: auto; margin-bottom: 20px; } .category-info .image { float: left; padding: 5px; margin-right: 30px; border: 1px solid #E7E7E7; } /* manufacturer */ .manufacturer-list { border: 1px solid #DBDEE1; padding: 5px; overflow: auto; margin-bottom: 20px; } .manufacturer-heading { background: #F8F8F8; font-size: 15px; font-weight: bold; padding: 5px 8px; margin-bottom: 6px; } .manufacturer-content { padding: 8px; } .manufacturer-list ul { float: left; width: 25%; margin: 0; padding: 0; list-style: none; margin-bottom: 10px; } /* checkout */ .checkout-heading { border: 1px solid #DDD; background: #EEE; font-weight: 600; font-size: 15px; text-transform: uppercase; padding: 15px 20px; margin-top: 10px; } .checkout-heading i{ padding-right: 15px; font-size: 16px; } .checkout-heading a { float: right; margin-top: 1px; font-weight: normal; text-decoration: none; } .checkout-content { padding:20px ; border: 1px solid #E5E5E5; display: none; overflow: auto; margin-bottom: 10px; border-top: 0; } .checkout-content .left { float: left; width: 48%; } .checkout-content .right { float: right; width: 48%; } .checkout-content .buttons { clear: both; } .checkout-product table { width: 100%; border-collapse: collapse; border-top: 1px solid #EAEAEA; border-left: 1px solid #EAEAEA; border-right: 1px solid #EAEAEA; margin-bottom: 20px; } .checkout-product td { padding: 7px; } .checkout-product thead td { color: #4D4D4D; font-weight: bold; background-color: #F7F7F7; border-bottom: 1px solid #EAEAEA; } .checkout-product thead .name, .checkout-product thead .model { text-align: left; } .checkout-product thead .quantity, .checkout-product thead .price, .checkout-product thead .total { text-align: right; } .checkout-product tbody td { vertical-align: top; border-bottom: 1px solid #EAEAEA; } .checkout-product tbody .name, .checkout-product tbody .model { text-align: left; } .checkout-product tbody .quantity, .checkout-product tbody .price, .checkout-product tbody .total { text-align: right; } .checkout-product tfoot td { text-align: right; border-bottom: 1px solid #EAEAEA; } .login-content { margin-bottom: 20px; overflow: auto; } .login-content .left { float: left; width: 48%; } .bodytext{font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#3a3a3a; line-height:18px; text-align:justify; font-weight:700; text-decoration:none;} .bodytext-red{font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#bc0235; line-height:18px; text-align:justify; font-weight:700; text-decoration:none;} .bodytext1{font-family:Arial, Helvetica, sans-serif; font-size:17px; color:#dd023e; line-height:18px; text-align:justify; font-weight:700; text-decoration:none;} .table-bg{font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#3a3a3a; background-color:#d5d3d3; line-height:18px; text-align:justify; font-weight:700; text-decoration:none;} .table-bg1{font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#3a3a3a; background-color:#e5e5e5; line-height:22px; text-align:justify; font-weight:500; text-decoration:none;} .table-bg2{font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#3a3a3a; background-color:#eaeaea; line-height:22px; text-align:justify; font-weight:500; text-decoration:none;} .table-bg3{font-family:Arial, Helvetica, sans-serif; font-size:13px; color:#3a3a3a; background-color:#ebe7e7; line-height:22px; text-align:justify; font-weight:500; text-decoration:none;} .cform{ height:27px; width:250px; border:1px solid #cacaca;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px; box-shadow: 0px 0px 0px #337e3f; vertical-align: middle; padding: 0px 0px 0px 10px; border-top: 2px solid #e1e1e1; border-left: 2px solid #e1e1e1; border-right: 1px solid #e1e1e1; border-bottom: 1px solid #e1e1e1; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; background-color: #f9f9f9; } .ctextarea{ height:150px; width:420px; background-color:#FFFFFF; margin-right:0px; margin-left:0px; padding-top:0px; border:1px solid #cacaca;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px; box-shadow: 0px 0px 0px #337e3f; margin-bottom: 7px; border-top: 2px solid #e1e1e1; border-left: 2px solid #e1e1e1; border-right: 1px solid #e1e1e1; border-bottom: 1px solid #e1e1e1; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; background-color: #f9f9f9;} .csubmit{ border:0px solid #337e3f; border-radius:1px; background-color:#096eb2; padding:5px 30px 5px 30px; font-family:Arial, Helvetica, sans-serif; font-size:15px; color:#FFFFFF; font-weight:700; } .csubmit:hover{background-color:#3d3d3d; } .leftp { margin-left: 50px;; float: none; } .bheading{font-family:Arial, Helvetica, sans-serif; font-size:18px; color:#FF0000; line-height:18px; text-align:justify; font-weight:700; text-decoration:none;} .login-content .right { float: right; width: 48% } .login-content .left .content, .login-content .right .content { min-height: 190px; } p{text-align:justify;}