/* mix.css */
.tab-item { background: none repeat scroll 0 0 #fff; display: none; padding: 1.25rem 0; } .tab-item.tab-active { display: block; } .tab-content > .tab-label { display: none; } .tab-nav > .tab-label { float:left; } a.tab-label, a.tab-label:link, a.tab-label:visited, a.tab-label:hover { color: #676767 !important; margin-right: 1px; padding: 0.625rem 1.25rem; transition: background 0.20s linear 0s; -o-transition: background 0.20s linear 0s; -ms-transition: background 0.20s linear 0s; -moz-transition: background 0.20s linear 0s; -webkit-transition: background 0.20s linear 0s; } a.tab-label:hover,a.tab-label.active-btn { background: none repeat scroll 0 0 #f6f6f6; } .tab-label.active-btn { cursor: default; } .tab-content { text-align: left; } @media screen and (max-width:1000px) { .tab-nav > .tab-label { margin: 0.5px 0; width: 100%; } } /* Custom forms */ button { display:inline-block; } form.customform input, form.customform select, form.customform textarea, form.customform button { font-size:0.9rem; font-family:inherit; margin-bottom:1.25rem; } .customform input[type="text"],.customform input[type="email"], .customform input[type="password"], .customform input[type="number"], .customform textarea { padding:10px; background:#fff; width:100% !important; border:solid 1px #e1e1e1; } form.customform select { border:1px solid #ccc; padding:10px; width:100%; } form.customform input[type="number"] { border:1px solid #ccc; padding:8px; width:50%; } form.customform input[type="number"].cart-quantity { border:1px solid #ccc; background:none; padding:6px 10px; width:100px !important; } form.customform input[type="submit"].update-quantity { border:0; margin-left:5px; background:#e4a600; display:inline-block; padding:5px 10px; width:100px !important; } form.customform input[type="number"]:hover { border:1px solid #d8d7d0; } form.customform input[type="checkbox"] { margin:0; } form.customform input[type="file"] { border: 1px solid #e1e1e1; height: auto; padding: 8px; background:#fff; width: 100%; } form.customform input[type="submit"] { display:block; width:100%; text-align:center; background:#f7d10a; background:linear-gradient(to bottom, #fff6c5 0%, #f7d10a 100%); border:solid 1px #debe16; color:#111; border-radius:22px; padding:10px; } form.customform input[type="submit"]:hover { border:solid 1px #cf1e26; cursor:pointer; } form.customform input[type="button"] { background:linear-gradient(to bottom, #fff6c5 0%, #f7d10a 100%); border:solid 1px #e4c210; color:#000 !important; border-radius:22px; display:block; width:100%; padding:10px; } form.customform input[type="button"]:hover { border:solid 1px #cd181d; cursor:pointer; } form.customform input[type="radio"] { margin-right: 0.625rem; width:auto; padding:0; height:auto; } form.customform input[type="radio"].checkbox { display:inline-block !important; margin:0; width:auto; padding:0; height:auto; } form.customform input[type="radio"] { display:none; } form.customform option {padding: 0.625rem;} form.customform select {-webkit-appearance: none; padding:4px;} form.customform select[multiple="multiple"] {height:auto;} form.customform button { width:100%; background: none repeat scroll 0 0 #152732; border:0 none; color:#fff; height:2.7rem; padding:0.625rem; cursor:pointer; width:100%; transition: background 0.20s linear 0s; -o-transition: background 0.20s linear 0s; -ms-transition: background 0.20s linear 0s; -moz-transition: background 0.20s linear 0s; -webkit-transition: background 0.20s linear 0s; } .customform span.required { color:red; border:0 !important; } /* Tooltip */ a.tooltip-container,.tooltip-container { border-bottom:1px dotted; border-bottom-color: color; cursor:help; font-weight:600; } a .tooltip-content,.tooltip-content { background:#152732 none repeat scroll 0 0; color: #fff!important; border-radius: 3px; display:none; font-size: 0.8rem; font-weight: normal; line-height: 1.3rem; margin-top: -1.25rem; max-width:300px; padding:0.625rem; position:absolute; z-index: 10; } .tooltip-content::after { border-left:9px solid transparent; border-right:9px solid transparent; border-top:7px solid #152732; bottom:-5px; clear:both; content:""; height:0; left:50%; margin-left:-5px; position:absolute; width:0; } a.tooltip-content.tooltip-bottom,.tooltip-content.tooltip-bottom { margin-top:1.25rem; } .tooltip-content.tooltip-bottom::after { border-left:9px solid transparent; border-right: 9px solid transparent; border-top:0; border-bottom:7px solid #152732; top:-5px; } /* -------------------------------- cd-main-content -------------------------------- */ .cd-img-replace { /* replace text with a background-image */ display: inline-block; overflow:hidden; text-indent:100%; white-space:nowrap; } .overflow-hidden { overflow:hidden; }
form.customform input[type="radio"] + label span {
display: inline-block;
margin: 0px 4px 8px 0;
padding: 4px 8px;
vertical-align: middle;
cursor: pointer;
color: #333 !important;
border: 1px solid #bfbfbf;
background-color: white;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fff), color-stop(100%, #dcdcdc));
background: -webkit-linear-gradient(top, #fff 0%, #dcdcdc 100%);
background: -moz-linear-gradient(top, #fff 0%, #dcdcdc 100%);
background: -ms-linear-gradient(top, #fff 0%, #dcdcdc 100%);
background: -o-linear-gradient(top, #fff 0%, #dcdcdc 100%);
background: linear-gradient(to bottom, #fff 0%, #dcdcdc 100%);
padding: 1px 5px;
border-radius: 4px;
}
form.customform input[type="radio"]:checked + label span { border:solid 1px #d11e24; background:#d11e24; color:#fff !important; }
form.customform.cartpage input[type="radio"]:checked + label span { border:solid 1px #fff; background:#fff; color:#222 !important; }
#mc_embed_signup div.mce_inline_error { padding:0; padding-top:5px; color:red; background:none; font-weight:normal; }
.jconfirm-closeIcon { font-size:35px; text-align:right; color:#d01f25; } .jconfirm-closeIcon:hover { cursor:pointer; color:#505050; }
.btn-hide { display:none !important; } .displaynone { display:none; }
#userstable_filter input { background:#f9f1cb; border:solid 1px #e4dcb7; border-radius:4px; box-shadow:inset 0 2px 4px 0 rgba(206, 209, 224, 0.20); }
/* --------------------------------
Main components
-------------------------------- */
.cd-main-content { /* set a min-height and a z-index to be sure that the main element completely covers the lateral menu */ min-height: 100%; position: relative; background-color: #f5f4e9; z-index: 2; padding-top: 0px; /* Force Hardware Acceleration in WebKit */ -webkit-transform: translateZ(0); -webkit-backface-visibility: hidden; -webkit-transition-property: -webkit-transform; -moz-transition-property: -moz-transform; transition-property: transform; -webkit-transition-duration: 0.4s; -moz-transition-duration: 0.4s; transition-duration: 0.4s; } .cd-main-content.lateral-menu-is-open { /* translate to show the lateral menu - all content needs to be put in the .cd-main-content to translate*/ -webkit-transform: translateX(-260px); -moz-transform: translateX(-260px); -ms-transform: translateX(-260px); -o-transform: translateX(-260px); transform: translateX(-260px); } @media only screen and (min-width: 768px) { .cd-main-content { padding-top: 70px; } } header { position: absolute; top: 0; left: 0; height: 50px; width: 100%; background: #fff; z-index: 3; /* Force Hardware Acceleration in WebKit */ -webkit-transform: translateZ(0); -webkit-backface-visibility: hidden; -webkit-transition-property: -webkit-transform; -moz-transition-property: -moz-transform; transition-property: transform; -webkit-transition-duration: 0.4s; -moz-transition-duration: 0.4s; transition-duration: 0.4s; } @media only screen and (max-width: 768px) { header { background:#505050 !important; } } header.lateral-menu-is-open { /* translate to show the lateral menu */ -webkit-transform: translateX(-260px); -moz-transform: translateX(-260px); -ms-transform: translateX(-260px); -o-transform: translateX(-260px); transform: translateX(-260px); } header.is-fixed { position: fixed; } @media only screen and (min-width: 768px) { header { position: fixed; height: 70px; } } #cd-logo { display: block; float: left; margin: 0px; } #cd-logo img { display: block; } @media only screen and (min-width: 768px) { #cd-logo { margin: 17px 0 0 47px; } } #cd-top-nav { position: absolute; top: 0; right: 90px; height: 100%; display: none; } #cd-top-nav .cart { background:#fad00a; padding:5px 9px; color:#fff; font-weight:bold; border-radius:50px; } #cd-top-nav .cart:hover { cursor:pointer; } #cd-top-nav ul { height: 100%; vertical-align: middle; } #cd-top-nav ul.paddingtop { padding-top:15px; } #cd-top-nav li { display: inline-block; margin-right: 1em; vertical-align: middle; } #cd-top-nav li img.user-photo { width:52px; height:53px; } #cd-top-nav a { display: inline-block; padding: .5em; color: #444; } #cd-top-nav a.current { background-color: #e41b20; } #cd-top-nav a:hover { color: #e41b20 !important; text-decoration:none; } @media only screen and (min-width: 768px) { #cd-top-nav { display: block; } } #cart-menu { position: absolute; right: 50px; top: 0; height: 100%; color:#333; background-color: #fff; padding:15px 10px 0px 10px; } #cart-menu span { background:#fad00a; color:#fff; font-weight:bold; border-radius:50px; padding:2px 8px; } #cd-menu-trigger { position: absolute; right: 0; top: 0; height: 100%; width: 50px; background-color: #c71d22; } #cd-menu-trigger:focus { outline:0; } #cd-menu-trigger:hover { background-color: #c21116; } #cd-menu-trigger .cd-menu-text { height: 100%; color: #FFF; display: none; } #cd-menu-trigger .cd-menu-icon { /* this span is the central line in the menu menu */ display: inline-block; position: absolute; left: 50%; top: 50%; bottom: auto; right: auto; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); width: 18px; height: 2px; background-color: #fff; /* these are the upper and lower lines in the menu */ } #cd-menu-trigger .cd-menu-icon::before, #cd-menu-trigger .cd-menu-icon:after { content: ''; width: 100%; height: 100%; position: absolute; background-color: inherit; left: 0; } #cd-menu-trigger .cd-menu-icon::before { bottom: 5px; } #cd-menu-trigger .cd-menu-icon::after { top: 5px; } #cd-menu-trigger.is-clicked .cd-menu-icon { background-color: rgba(255, 255, 255, 0); } #cd-menu-trigger.is-clicked .cd-menu-icon::before, #cd-menu-trigger.is-clicked .cd-menu-icon::after { background-color: white; } #cd-menu-trigger.is-clicked .cd-menu-icon::before { bottom: 0; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } #cd-menu-trigger.is-clicked .cd-menu-icon::after { top: 0; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } @media only screen and (min-width: 768px) { #cd-menu-trigger .cd-menu-text { display: inline-block; line-height: 73px; padding-right:25px; } #cd-menu-trigger .cd-menu-icon { left: auto; right: 1.25em; -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); } } #cd-lateral-nav { position: fixed; height: 100%; right: 0; top: 0; padding:0; visibility: hidden; padding-bottom:80px; /* the secondary navigation is covered by the main element */ z-index: 1; width: 260px; background-color: #c71d22; overflow-y: auto; /* Force Hardware Acceleration in WebKit */ -webkit-transform: translateZ(0); -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform .4s 0s, visibility 0s .4s; -moz-transition: -moz-transform .4s 0s, visibility 0s .4s; transition: transform .4s 0s, visibility 0s .4s; /* this creates the subtle slide in animation of the navigation */ -webkit-transform: translateX(80px); -moz-transform: translateX(80px); -ms-transform: translateX(80px); -o-transform: translateX(80px); transform: translateX(80px); } #cd-lateral-nav .cd-navigation { margin: 10px 0 16px; list-style:none; margin-left:0px; padding-left:0px; } #cd-lateral-nav .cd-navigation li { margin-left:0px; padding-left:0px; } #cd-lateral-nav .sub-menu { padding: 0 10px 20px 15px; display: none; list-style:none; margin-left:0px; padding-left:0px; } #cd-lateral-nav a { display: block; padding: 8px 0px 8px 20px; color: #fff; border-bottom: solid 1px #b51f24; } #cd-lateral-nav a:hover { text-decoration:none; } #cd-lateral-nav a.current { text-decoration:underline; } @media only screen and (min-width: 768px) { #cd-lateral-nav .cd-navigation { margin: 20px 0; } } #cd-lateral-nav.lateral-menu-is-open { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); visibility: visible; -webkit-transition: -webkit-transform .4s 0s, visibility 0s 0s; -moz-transition: -moz-transform .4s 0s, visibility 0s 0s; transition: transform .4s 0s, visibility 0s 0s; /* smooth the scrolling on touch devices - webkit browsers */ -webkit-overflow-scrolling: touch; } /* style menu items which have a submenu */ #cd-lateral-nav .item-has-children > a { position: relative; text-transform: uppercase; font-weight: 600; /* this is the right arrow to show that the item has a submenu */ } #cd-lateral-nav .item-has-children > a::after { content: ''; display: block; height: 11px; width: 8px; position: absolute; top: 50%; bottom: auto; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); right: 1em; background: url("../img/cd-arrow.svg") no-repeat center center; background-size: 8px 11px; -webkit-transition-property: -webkit-transform; -moz-transition-property: -moz-transform; transition-property: transform; -webkit-transition-duration: 0.2s; -moz-transition-duration: 0.2s; transition-duration: 0.2s; } #cd-lateral-nav .item-has-children > a.submenu-open::after { -webkit-transform: translateY(-50%) rotate(90deg); -moz-transform: translateY(-50%) rotate(90deg); -ms-transform: translateY(-50%) rotate(90deg); -o-transform: translateY(-50%) rotate(90deg); transform: translateY(-50%) rotate(90deg); } #cd-lateral-nav .socials { padding: 0 32px; } #cd-lateral-nav .socials:after { content: ""; display: table; clear: both; } #cd-lateral-nav .socials a { height: 32px; width: 32px; float: left; padding: 0; background-image: url("../img/cd-socials.svg"); background-repeat: no-repeat; background-size: 128px 64px; background-color: #FFF; margin-right: .5em; border-radius: 0.25em; } #cd-lateral-nav .socials a.cd-twitter { background-position: 0 0; } #cd-lateral-nav .socials a.cd-github { background-position: -32px 0; } #cd-lateral-nav .socials a.cd-facebook { background-position: -64px 0; } #cd-lateral-nav .socials a.cd-google { background-position: -96px 0; } .no-touch #cd-lateral-nav .socials a:hover { background-color: #4e6361; } .no-touch #cd-lateral-nav .socials a:hover.cd-twitter { background-position: 0 -32px; } .no-touch #cd-lateral-nav .socials a:hover.cd-github { background-position: -32px -32px; } .no-touch #cd-lateral-nav .socials a:hover.cd-facebook { background-position: -64px -32px; } .no-touch #cd-lateral-nav .socials a:hover.cd-google { background-position: -96px -32px; }
/*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */
/**
* 1. Change the default font family in all browsers (opinionated).
* 2. Correct the line height in all browsers.
* 3. Prevent adjustments of font size after orientation changes in
* IE on Windows Phone and in iOS.
*/
/* Document
========================================================================== */
html { font-family: sans-serif; /* 1 */ line-height: 1.15; /* 2 */ -ms-text-size-adjust: 100%; /* 3 */ -webkit-text-size-adjust: 100%; /* 3 */ } /* Sections ========================================================================== */ /** * Remove the margin in all browsers (opinionated). */ body { margin: 0; } /** * Add the correct display in IE 9-. */ article, aside, footer, header, nav, section { display: block; } /** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Firefox, and Safari. */ h1 { font-size: 2em; margin: 0.67em 0; } /* Grouping content ========================================================================== */ /** * Add the correct display in IE 9-. * 1. Add the correct display in IE. */ figcaption, figure, main { /* 1 */ display: block; } /** * Add the correct margin in IE 8. */ figure { margin: 1em 40px; } /** * 1. Add the correct box sizing in Firefox. * 2. Show the overflow in Edge and IE. */ hr { box-sizing: content-box; /* 1 */ height: 0; /* 1 */ overflow: visible; /* 2 */ } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ pre { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /* Text-level semantics ========================================================================== */ /** * 1. Remove the gray background on active links in IE 10. * 2. Remove gaps in links underline in iOS 8+ and Safari 8+. */ a { background-color: transparent; /* 1 */ -webkit-text-decoration-skip: objects; /* 2 */ } /** * Remove the outline on focused links when they are also active or hovered * in all browsers (opinionated). */ a:active, a:hover { outline-width: 0; } /** * 1. Remove the bottom border in Firefox 39-. * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. */ abbr[title] { border-bottom: none; /* 1 */ text-decoration: underline; /* 2 */ text-decoration: underline dotted; /* 2 */ } /** * Prevent the duplicate application of `bolder` by the next rule in Safari 6. */ b, strong { font-weight: inherit; } /** * Add the correct font weight in Chrome, Edge, and Safari. */ b, strong { font-weight: bolder; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ code, kbd, samp { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /** * Add the correct font style in Android 4.3-. */ dfn { font-style: italic; } /** * Add the correct background and color in IE 9-. */ mark { background-color: #ff0; color: #000; } /** * Add the correct font size in all browsers. */ small { font-size: 80%; } /** * Prevent `sub` and `sup` elements from affecting the line height in * all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } /* Embedded content ========================================================================== */ /** * Add the correct display in IE 9-. */ audio, video { display: inline-block; } /** * Add the correct display in iOS 4-7. */ audio:not([controls]) { display: none; height: 0; } /** * Remove the border on images inside links in IE 10-. */ img { border-style: none; } /** * Hide the overflow in IE. */ svg:not(:root) { overflow: hidden; } /* Forms ========================================================================== */ /** * 1. Change the font styles in all browsers (opinionated). * 2. Remove the margin in Firefox and Safari. */ button, input, optgroup, select, textarea { font-family: sans-serif; /* 1 */ font-size: 100%; /* 1 */ line-height: 1.15; /* 1 */ margin: 0; /* 2 */ } /** * Show the overflow in IE. * 1. Show the overflow in Edge. */ button, input { /* 1 */ overflow: visible; } /** * Remove the inheritance of text transform in Edge, Firefox, and IE. * 1. Remove the inheritance of text transform in Firefox. */ button, select { /* 1 */ text-transform: none; } /** * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video` * controls in Android 4. * 2. Correct the inability to style clickable types in iOS and Safari. */ button, html [type="button"], /* 1 */ [type="reset"], [type="submit"] { -webkit-appearance: button; /* 2 */ } /** * Remove the inner border and padding in Firefox. */ button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; } /** * Restore the focus styles unset by the previous rule. */ button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; } /** * Change the border, margin, and padding in all browsers (opinionated). */ fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } /** * 1. Correct the text wrapping in Edge and IE. * 2. Correct the color inheritance from `fieldset` elements in IE. * 3. Remove the padding so developers are not caught out when they zero out * `fieldset` elements in all browsers. */ legend { box-sizing: border-box; /* 1 */ color: inherit; /* 2 */ display: table; /* 1 */ max-width: 100%; /* 1 */ padding: 0; /* 3 */ white-space: normal; /* 1 */ } /** * 1. Add the correct display in IE 9-. * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera. */ progress { display: inline-block; /* 1 */ vertical-align: baseline; /* 2 */ } /** * Remove the default vertical scrollbar in IE. */ textarea { overflow: auto; } /** * 1. Add the correct box sizing in IE 10-. * 2. Remove the padding in IE 10-. */ [type="checkbox"], [type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } /** * Correct the cursor style of increment and decrement buttons in Chrome. */ [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } /** * 1. Correct the odd appearance in Chrome and Safari. * 2. Correct the outline style in Safari. */ [type="search"] { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /** * Remove the inner padding and cancel buttons in Chrome and Safari on macOS. */ [type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } /** * 1. Correct the inability to style clickable types in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /* Interactive ========================================================================== */ /* * Add the correct display in IE 9-. * 1. Add the correct display in Edge, IE, and Firefox. */ details, /* 1 */ menu { display: block; } /* * Add the correct display in all browsers. */ summary { display: list-item; } /* Scripting ========================================================================== */ /** * Add the correct display in IE 9-. */ canvas { display: inline-block; } /** * Add the correct display in IE. */ template { display: none; } /* Hidden ========================================================================== */ /** * Add the correct display in IE 10-. */ [hidden] { display: none; }
/* * ImageHover.css - http://www.imagehover.io
* Version 1.0 * Author: Ciarán Walsh *
Made available under a MIT License: * http://www.opensource.org/licenses/mit-license.php
*/
[class^='imghvr-'], [class*=' imghvr-'] { position: relative; display: inline-block; margin: 0px; max-width: 100%; color: #fff; overflow: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; -webkit-transform: translateZ(0); transform: translateZ(0); } [class^='imghvr-'] > img, [class*=' imghvr-'] > img { vertical-align: top; max-width: 100%; } [class^='imghvr-'] figcaption, [class*=' imghvr-'] figcaption { background:url(../img/trans.png); padding: 7px 10px; position: absolute; top: 110px; bottom: 0; left: 0; right: 0; color: #ffffff; } [class^='imghvr-'] figcaption.rp-is, [class*=' imghvr-'] figcaption.rp-is { top: 80px; } [class^='imghvr-'] figcaption h1, [class*=' imghvr-'] figcaption h1, [class^='imghvr-'] figcaption h2, [class*=' imghvr-'] figcaption h2, [class^='imghvr-'] figcaption h3, [class*=' imghvr-'] figcaption h3, [class^='imghvr-'] figcaption h4, [class*=' imghvr-'] figcaption h4, [class^='imghvr-'] figcaption h5, [class*=' imghvr-'] figcaption h5, [class^='imghvr-'] figcaption h6, [class*=' imghvr-'] figcaption h6 { color: #ffffff; } [class^='imghvr-'] a, [class*=' imghvr-'] a { position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 1; } [class^='imghvr-'] a:hover, [class*=' imghvr-'] a:hover { cursor:pointer; } [class^='imghvr-'] a.btn, [class*=' imghvr-'] a.btn { background:#fcd307; padding:10px; } [class^='imghvr-'], [class*=' imghvr-'], [class^='imghvr-']:before, [class^='imghvr-']:after, [class*=' imghvr-']:before, [class*=' imghvr-']:after, [class^='imghvr-'] *, [class*=' imghvr-'] *, [class^='imghvr-'] *:before, [class^='imghvr-'] *:after, [class*=' imghvr-'] *:before, [class*=' imghvr-'] *:after { -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 0.35s ease; transition: all 0.35s ease; width: 100%; } /* imghvr-fade-* ----------------------------- */ [class^='imghvr-fade'] figcaption, [class*=' imghvr-fade'] figcaption { opacity: 0; } [class^='imghvr-fade']:hover > img, [class*=' imghvr-fade']:hover > img { opacity: 0; } [class^='imghvr-fade']:hover figcaption, [class*=' imghvr-fade']:hover figcaption { opacity: 1; } [class^='imghvr-fade']:hover > img, [class*=' imghvr-fade']:hover > img, [class^='imghvr-fade']:hover figcaption, [class*=' imghvr-fade']:hover figcaption { -webkit-transform: translate(0px, 0px); transform: translate(0px, 0px); } /* imghvr-fade ----------------------------- */ /* imghvr-fade-in-up ----------------------------- */ .imghvr-fade-in-up figcaption { -webkit-transform: translate(0px, 15%); transform: translate(0px, 15%); } /* imghvr-fade-in-down ----------------------------- */ .imghvr-fade-in-down figcaption { -webkit-transform: translate(0, -15%); transform: translate(0, -15%); } /* imghvr-fade-in-left ----------------------------- */ .imghvr-fade-in-left figcaption { -webkit-transform: translate(-15%, 0); transform: translate(-15%, 0); } /* imghvr-fade-in-right ----------------------------- */ .imghvr-fade-in-right figcaption { -webkit-transform: translate(15%, 0px); transform: translate(15%, 0px); } /* imghvr-push-* ----------------------------- */ [class^='imghvr-push-']:hover figcaption, [class*=' imghvr-push-']:hover figcaption { -webkit-transform: translate(0, 0); transform: translate(0, 0); } /* imghvr-push-up ----------------------------- */ .imghvr-push-up figcaption { -webkit-transform: translateY(100%); transform: translateY(100%); } .imghvr-push-up:hover > img { -webkit-transform: translateY(-100%); transform: translateY(-100%); } /* imghvr-push-down ----------------------------- */ .imghvr-push-down figcaption { -webkit-transform: translateY(-100%); transform: translateY(-100%); } .imghvr-push-down:hover > img { -webkit-transform: translateY(100%); transform: translateY(100%); } /* imghvr-push-left ----------------------------- */ .imghvr-push-left figcaption { -webkit-transform: translateX(100%); transform: translateX(100%); } .imghvr-push-left:hover > img { -webkit-transform: translateX(-100%); transform: translateX(-100%); } /* imghvr-push--right ----------------------------- */ .imghvr-push-right figcaption { -webkit-transform: translateX(-100%); transform: translateX(-100%); } .imghvr-push-right:hover > img { -webkit-transform: translateX(100%); transform: translateX(100%); } /* imghvr-slide-* ----------------------------- */ [class^='imghvr-slide-']:hover figcaption, [class*=' imghvr-slide-']:hover figcaption { -webkit-transform: translate(0, 0); transform: translate(0, 0); } /* imghvr-slide-up ----------------------------- */ .imghvr-slide-up figcaption { -webkit-transform: translateY(100%); transform: translateY(100%); }
/*
Colorbox Core Style:
The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden; -webkit-transform: translate3d(0,0,0);} #cboxWrapper {max-width:none; background:#fff;} #cboxOverlay{position:fixed; width:100%; height:100%;} #cboxMiddleLeft, #cboxBottomLeft{clear:left;} #cboxContent{position:relative;} #cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;} #cboxTitle{margin:0;} #cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;} #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;} .cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;} .cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;} #colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;} /* User Style: Change the following styles to modify the appearance of Colorbox. They are ordered & tabbed in a way that represents the nesting of the generated HTML. */ #cboxOverlay{background:#505050 ; opacity: 0.9; filter: alpha(opacity = 90);} #colorbox{outline:0;} #cboxTopLeft{width:14px; height:14px;} #cboxTopCenter{height:14px;} #cboxTopRight{width:14px; height:14px;} #cboxBottomLeft{width:14px; height:43px;} #cboxBottomCenter{height:43px;} #cboxBottomRight{width:14px; height:43px;} #cboxMiddleLeft{width:14px;} #cboxMiddleRight{width:14px;} #cboxContent{overflow:visible;} .cboxIframe{background:#fff;} #cboxError{padding:50px; border:1px solid #ccc;} #cboxLoadedContent{margin-bottom:5px;} #cboxLoadingOverlay{background:url(../images/loading_background.png) no-repeat center center;} #cboxLoadingGraphic{background:url(../images/loading.gif) no-repeat center center;} #cboxTitle{position:absolute; bottom:-30px; left:0; text-align:center; width:100%; font-weight:bold; color:#505050;} #cboxCurrent{position:absolute; bottom:16px; left:58px; font-weight:bold; color:#ccc;} /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */ #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; position:absolute; bottom:-29px; background:url(../images/controls.png) no-repeat 0px 0px; width:23px; height:23px; text-indent:-9999px;} /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */ #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;} #cboxPrevious{left:0px; background-position: -51px -25px;} #cboxPrevious:hover{background-position:-51px 0px;} #cboxNext{right:0; background-position:-75px -25px;} #cboxNext:hover{background-position:-75px 0px;} #cboxClose{right:0; top:0; background-position:-100px -25px;} #cboxClose:hover{background-position:-100px 0px;} .cboxSlideshow_on #cboxSlideshow{background-position:-125px 0px; right:27px;} .cboxSlideshow_on #cboxSlideshow:hover{background-position:-150px 0px;} .cboxSlideshow_off #cboxSlideshow{background-position:-150px -25px; right:27px;} .cboxSlideshow_off #cboxSlideshow:hover{background-position:-125px 0px;}
/********************************************************************************
* This script is brought to you by Vasplus Programming Blog.
* Website: www.vasplus.info
* Email: info@vasplus.info
*********************************************************************************/
.vasplus_pb_Search form, .vasplus_pb_Search div, .vasplus_pb_Search input, .vasplus_pb_Search ul, .vasplus_pb_Search li, .vasplus_pb_Search img, .vasplus_pb_Search span { margin:0px; padding:0px; float:left; border:none; text-decoration:none; } .vpb_search_results{display:none;} .vasplus_pb_Search #vpv_search_box { background:#fff; width:100%; padding:14px; border: solid 1px #ddd; border-bottom: solid 2px #ddd; border-radius: 4px; } .vasplus_pb_Search #vpv_search_button { padding:none; width:10%; height:44px; float:right; text-align:center; background:#fff; border-left:solid 1px #e9e7e5; padding-left:3px; padding-top:13px; color:#505050; cursor:pointer; } .vasplus_pb_Search input:focus { border:none; outline:none; } .vasplus_pb_Search { margin:0px; clear:both; margin:0 auto; margin-bottom:100px; width:80%; } .vasplus_pb_Search form { float:left; width:100%; height:46px; } .vasplus_pb_Search .vpb_search_results { position:absolute; background:#F30; float:left; background:#ffffff; width:75%; border:1px solid #eee; margin-top:48px; text-align:left; z-index:99999; } @media screen and (max-width:480px) { .vasplus_pb_Search .vpb_search_results { width:93% !important; } } .vasplus_pb_Search .vpb_search_results ul.searches, .vasplus_pb_Search .vpb_search_results ul.searches li { padding:0px; list-style:none; float:left; margin:0px; width:100%; background:#fff; } .vasplus_pb_Search .vpb_search_results ul.searches li { padding:4px 5px; border-bottom:1px solid #efefef; width:100%; margin-right:0 !important; } .vpb_search_results ul.searches li a.view-all { font-size:11px; float:right; display:inline-block; } .vpb_search_results ul.searches li:last-child { border-bottom:0; } .vasplus_pb_Search .vpb_search_results ul.searches li.vpb_titles { background:#fff; border-bottom:0; padding-right:20px; padding-top:10px; border-bottom:solid 1px #eee; } .vpb_search_results ul.searches li.vpb_titles:hover { background:#fff !important; } .vasplus_pb_Search .vpb_search_results ul.searches li.vpb_titles strong { float:right; padding:4px; color:#505050; } .vasplus_pb_Search .vpb_search_results ul.searches li:hover { background:#f9f9f9; } .vasplus_pb_Search .vpb_search_results ul.searches li.no-records:hover { background:#fff !important; } .vasplus_pb_Search .vpb_search_results ul.searches li img { margin-right:8px; width:40px; height:40px; float:left; } .vasplus_pb_Search .vpb_search_results .text { line-height:18px; } .vasplus_pb_Search .vpb_search_results a .text { background:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding-top:4px; } .vasplus_pb_Search .vpb_search_results a.mainlink { display:block; float:left; width:100%; padding-top:4px; padding-bottom:4px; } .vasplus_pb_Search .vpb_search_results a.mainlink:hover { text-decoration:none; } .vasplus_pb_Search .vpb_search_results .subtext { font-size:11px; color:#999; } .vasplus_pb_Search .vpb_search_results .more, .vasplus_pb_Search .vpb_search_results .more:hover { text-align:center; padding-top:10px; padding-bottom:10px; border-top: 1px solid #e2e2e2; border-bottom:1px solid #3b5998; } .vasplus_pb_Search .vpb_search_results .more span { width:340px; } .vasplus_pb_Search .vpb_search_results .more img { float:none; }
.vasplus_pb_Additems form, .vasplus_pb_Additems div, .vasplus_pb_Additems input, .vasplus_pb_Additems ul, .vasplus_pb_Additems li, .vasplus_pb_Additems img, .vasplus_pb_Additems span { margin:0px; padding:0px; border:none; text-decoration:none; } .vpb_search_results{display:none;} .vasplus_pb_Additems #vpv_add_items { background:#f9f1cb; width:100%; padding:14px; border: solid 1px #e4dcb7; border-radius: 4px; box-shadow: inset 0 2px 4px 0 rgba(206, 209, 224, 0.20); } .vasplus_pb_Additems #vpv_search_button { padding:none; width:10%; height:44px; float:right; text-align:center; background:#fff; border-left:solid 1px #e9e7e5; padding-left:3px; padding-top:13px; color:#505050; cursor:pointer; } .vasplus_pb_Additems input:focus { border:none; outline:none; } .vasplus_pb_Additems { margin:0px; clear:both; margin:0 auto; margin-bottom:100px; width:65%; } .vasplus_pb_Additems form { float:left; width:100%; } .vasplus_pb_Additems .vpb_search_results { float:left; background:#fff; width:100%; margin-top:1px; text-align:left; z-index:99999; } @media screen and (max-width:480px) { .vasplus_pb_Additems .vpb_search_results { width:93% !important; } } .vasplus_pb_Additems .vpb_search_results ul.searches, .vasplus_pb_Additems .vpb_search_results ul.searches li { padding:0px; list-style:none; float:left; margin:0px; width:100%; background:#f9f1cb; } .vasplus_pb_Additems .vpb_search_results ul.searches li { padding:4px 5px; border-bottom:7px solid #fff; width:100%; margin-right:0 !important; } .vpb_search_results ul.searches li a.view-all { font-size:11px; float:right; display:inline-block; } .vpb_search_results ul.searches li:last-child { border-bottom:0; } .vasplus_pb_Additems .vpb_search_results ul.searches li.vpb_titles { background:#fff; border-bottom:0; padding-right:20px; padding-top:10px; border-bottom:solid 1px #eee; } .vpb_search_results ul.searches li.vpb_titles:hover { background:#fff !important; } .vasplus_pb_Additems .vpb_search_results ul.searches li.vpb_titles strong { float:right; padding:4px; color:#505050; } .vasplus_pb_Additems .vpb_search_results ul.searches li:hover { background:#f3f3f3; cursor:pointer; } .vasplus_pb_Additems .vpb_search_results ul.searches li.no-records:hover { background:#fff !important; } .vasplus_pb_Additems .vpb_search_results ul.searches li img { margin-right:8px; width:100px; height:75px; float:left; border:solid 1px #ddd; } .vasplus_pb_Additems .vpb_search_results .text { line-height:18px; } .vasplus_pb_Additems .vpb_search_results a .text { background:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding-top:4px; font-size: 20px; line-height: 32px; padding-left:10px; } .vasplus_pb_Additems .vpb_search_results a.mainlink { display:block; float:left; width:100%; padding:4px; color: #2f2f2f; } .vasplus_pb_Additems .vpb_search_results a.mainlink:hover { text-decoration:none; } .vasplus_pb_Additems .vpb_search_results .subtext { color:#d01f25; font-size: 16px; } .vasplus_pb_Additems .vpb_search_results .more, .vasplus_pb_Additems .vpb_search_results .more:hover { text-align:center; padding-top:10px; padding-bottom:10px; border-top: 1px solid #e2e2e2; border-bottom:1px solid #3b5998; } .vasplus_pb_Additems .vpb_search_results .more span { width:340px; } .vasplus_pb_Additems .vpb_search_results .more img { float:none; }
.vasplus_pb_Additems input[type="text"]::-webkit-input-placeholder { /* Chrome */
color: #b9af85 !important;
}
.vasplus_pb_Additems form :-ms-input-placeholder { /* IE 10+ */
color: #b9af85 !important;
}
.vasplus_pb_Additems form ::-moz-placeholder { /* Firefox 19+ */
color: #b9af85 !important;
opacity: 1;
}
.vasplus_pb_Additems form :-moz-placeholder { /* Firefox 4 - 18 */
color: #b9af85 !important;
opacity: 1;
}
/* --------------------------------
Striped Navigation
-------------------------------- */
.cd-morph-dropdown { position: relative; height: 60px; background:#505050; } .cd-morph-dropdown::before { /* never visible - used in JS to check mq */ content: 'mobile'; display: none; } .cd-morph-dropdown .nav-trigger { /* menu icon - visible on small screens only */ position: absolute; top: 0; right: 0; height: 60px; width: 60px; /* replace text with icon */ overflow: hidden; text-indent: 100%; white-space: nowrap; color: transparent; } .cd-morph-dropdown .nav-trigger span, .cd-morph-dropdown .nav-trigger span::after, .cd-morph-dropdown .nav-trigger span::before { /* these are the 3 lines of the menu icon */ position: absolute; background-color: #505050; height: 3px; width: 26px; } .cd-morph-dropdown .nav-trigger span { left: 50%; top: 50%; bottom: auto; right: auto; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); -webkit-transition: background-color .3s; transition: background-color .3s; } .cd-morph-dropdown .nav-trigger span::after, .cd-morph-dropdown .nav-trigger span::before { content: ''; left: 0; -webkit-transition: -webkit-transform .3s; transition: -webkit-transform .3s; transition: transform .3s; transition: transform .3s, -webkit-transform .3s; } .cd-morph-dropdown .nav-trigger span::before { -webkit-transform: translateY(-9px); -ms-transform: translateY(-9px); transform: translateY(-9px); } .cd-morph-dropdown .nav-trigger span::after { -webkit-transform: translateY(9px); -ms-transform: translateY(9px); transform: translateY(9px); } .cd-morph-dropdown.nav-open .nav-trigger span { background-color: transparent; } .cd-morph-dropdown.nav-open .nav-trigger span::before { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .cd-morph-dropdown.nav-open .nav-trigger span::after { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .cd-morph-dropdown .main-nav { display: none; } .cd-morph-dropdown .morph-dropdown-wrapper { display: none; position: absolute; top: 60px; left: 0; width: 100%; padding: 1.2em 5%; box-shadow: inset 0 1px 0 #e6e6e6; background-color: #FFFFFF; } .cd-morph-dropdown.nav-open .morph-dropdown-wrapper { display: block; } .cd-morph-dropdown .dropdown-list > ul > li { margin-bottom: 3.3em; } .cd-morph-dropdown .label { display: block; font-size: 15px; background:#505050; color: #efedec; padding:10px; margin-bottom: .8em; } .cd-morph-dropdown .content li::after { clear: both; content: ""; display: block; } .cd-morph-dropdown .gallery .content li { margin-bottom: 1.4em; } .cd-morph-dropdown .gallery .content a { display: block; } .cd-morph-dropdown .gallery .content a::before { /* icon on the left */ content: ''; display: inline-block; float: left; height: 54px; width: 54px; margin-right: .6em; background: red; border-radius: 50%; -webkit-transition: background .2s; transition: background .2s; } .cd-morph-dropdown .gallery .content a span, .cd-morph-dropdown .gallery .content a em { display: block; line-height: 1.2; } .cd-morph-dropdown .gallery .content a em { font-size: 15px; padding: .4em 0 .2em; color: #505050; } .cd-morph-dropdown .gallery .content a span { font-size: 13px; color: #ccc; } .cd-morph-dropdown .gallery .content a:hover::before { background-color: #505050; } .cd-morph-dropdown .gallery li:nth-of-type(1) a::before { background: #f4e58a url(../img/cd-gallery-icons.svg) no-repeat 0 0; } .cd-morph-dropdown .gallery li:nth-of-type(2) a::before { background: #F4AF6D url(../img/cd-gallery-icons.svg) no-repeat -54px 0; } .cd-morph-dropdown .gallery li:nth-of-type(3) a::before { background: #DB6356 url(../img/cd-gallery-icons.svg) no-repeat -108px 0; } .cd-morph-dropdown .gallery li:nth-of-type(4) a::before { background: #8D4645 url(../img/cd-gallery-icons.svg) no-repeat -162px 0; } .cd-morph-dropdown .links .content > ul > li { margin-top: 1em; } .cd-morph-dropdown ul { list-style:none; padding:0; } .cd-morph-dropdown .links-list a, .cd-morph-dropdown .btn { display: block; margin-left: 14px; font-size: 15px; line-height: 1.6; color:#111; padding-left: 13px; } .cd-morph-dropdown .links-list a:hover, .cd-morph-dropdown .btn:hover { color: #505050; } .cd-morph-dropdown .content h2 { color: #d01f25; text-transform: uppercase; font-weight: bold; font-size: 16px; margin: 20px 0 10px 14px; } @media only screen and (min-width: 1000px) { .cd-morph-dropdown { position: absolute; height: 85px; left: 0; top: 0; width: 100%; padding: 0; text-align: center; background-color: #505050; } .cd-morph-dropdown::before { content: 'desktop'; } .cd-morph-dropdown .nav-trigger { display: none; } .cd-morph-dropdown .main-nav { display: inline-block; } .cd-morph-dropdown .main-nav > ul > li { display: inline-block; float: left; } .cd-morph-dropdown .main-nav > ul > li > a { display: block; padding: 0 12px; padding-bottom:12px; line-height: 19px; margin-top:20px; font-size: 15px; color:#fff; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-transition: opacity .2s; transition: opacity .2s; } .cd-morph-dropdown .main-nav > ul > li > a.tmargin { margin-top:20px; } .cd-morph-dropdown .main-nav > ul > li > a > i { color:#969696; } .cd-morph-dropdown.is-dropdown-visible .main-nav > ul > li > a { /* main navigation hover effect - on hover, reduce opacity of elements not hovered over */ opacity: .3; } .cd-morph-dropdown.is-dropdown-visible .main-nav > ul > li.active > a { opacity: 1; } .cd-morph-dropdown .morph-dropdown-wrapper { /* dropdown wrapper - used to create the slide up/slide down effect when dropdown is revealed/hidden */ display: block; top: 58px; /* overwrite mobile style */ width: auto; padding: 0; box-shadow: none; background-color: transparent; /* Force Hardware acceleration */ -webkit-transform: translateZ(0); transform: translateZ(0); will-change: transform; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); -webkit-transition: -webkit-transform .3s; transition: -webkit-transform .3s; transition: transform .3s; transition: transform .3s, -webkit-transform .3s; } .cd-morph-dropdown.is-dropdown-visible .morph-dropdown-wrapper { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } .cd-morph-dropdown .dropdown-list { position: absolute; top: 27px; left: 0; visibility: hidden; -webkit-transform: translateZ(0); transform: translateZ(0); will-change: transform, width, height; -webkit-transition: visibility .3s; transition: visibility .3s; } .no-csstransitions .cd-morph-dropdown .dropdown-list { display: none; } .cd-morph-dropdown .dropdown-list::before { /* dropdown top triangle */ content:''; position: absolute; bottom: 100%; left: 50%; right: auto; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); height: 0px; width: 0; border: 8px solid transparent; border-bottom-color: #f8d10a; opacity: 0; -webkit-transition: opacity .3s; transition: opacity .3s; } .cd-morph-dropdown .dropdown-list > ul { position: relative; z-index: 1; height: 100%; width: 100%; overflow: hidden; } .cd-morph-dropdown.is-dropdown-visible .dropdown-list { visibility: visible; -webkit-transition: width .3s, height .3s, -webkit-transform .3s; transition: width .3s, height .3s, -webkit-transform .3s; transition: transform .3s, width .3s, height .3s; transition: transform .3s, width .3s, height .3s, -webkit-transform .3s; } .cd-morph-dropdown.is-dropdown-visible .dropdown-list::before { opacity: 1; } .cd-morph-dropdown .dropdown { position: absolute; left: 0; top: 0; opacity: 0; visibility: hidden; width: 100%; -webkit-transition: opacity .3s, visibility .3s; transition: opacity .3s, visibility .3s; } .cd-morph-dropdown .dropdown.active { opacity: 1; visibility: visible; } .cd-morph-dropdown .dropdown.move-left .content { -webkit-transform: translateX(-100px); -ms-transform: translateX(-100px); transform: translateX(-100px); } .cd-morph-dropdown .dropdown.move-right .content { -webkit-transform: translateX(100px); -ms-transform: translateX(100px); transform: translateX(100px); } .cd-morph-dropdown .label { /* hide the label on bigger devices */ display: none; } .cd-morph-dropdown .content { padding: 1.7em 1.8em; -webkit-transition: -webkit-transform .3s; transition: -webkit-transform .3s; transition: transform .3s; transition: transform .3s, -webkit-transform .3s; text-align: left; } .cd-morph-dropdown .content > ul::after { clear: both; content: ""; display: block; } .cd-morph-dropdown .content > ul > li { float: left; margin-right: 4%; margin-top: 0; } .cd-morph-dropdown .content > ul > li:nth-of-type(2n) { margin-right: 0; } .cd-morph-dropdown .gallery .content { /* you need to set a width for the .content elements because they have a position absolute */ width: 510px; padding-bottom: .8em; } .cd-morph-dropdown .gallery .content li { margin-bottom: 1.8em; } .cd-morph-dropdown .links .content > ul > li { margin-top: 0; } .cd-morph-dropdown .links .content, .cd-morph-dropdown .button .content { width: 645px; border:solid 1px #eee; border-top:0; background:#eee; } .cd-morph-dropdown .links .aluminium-content { width:580px; } .cd-morph-dropdown .links .wood-content { width:530px; } .cd-morph-dropdown .links .glass-content { width:380px; } .cd-morph-dropdown .links .kitchen-content { width:450px; } .cd-morph-dropdown .links .tools-content { width: 290px; } .cd-morph-dropdown .links .user-content { width: 300px; } .cd-morph-dropdown .links .accessories-content { width: 550px; } .cd-morph-dropdown .links .user-content { width: 300px; } .cd-morph-dropdown .links .user-content ul li { width: 100%; } .cd-morph-dropdown .links .cart-content { width: 250px; padding:15px; } .cd-morph-dropdown .links .cart-content ul li { width: 100%; } .cd-morph-dropdown .links-list a { font-size: 15px; margin-left: 0; } .cd-morph-dropdown .btn { display: block; width: 100%; height: 60px; margin: 1.5em 0 0; font-size: 1.8rem; text-align: center; color: #FFFFFF; line-height: 60px; background: #DB6356; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .cd-morph-dropdown .btn:hover { background: #505050; color: #FFFFFF; } .cd-morph-dropdown .content h2 { font-size: 18px; text-transform: none; font-weight: normal; color: #d01f25; margin: 0 0 .6em; } /* cart */ ul.shopping-cart-items { padding: 0px; list-style:none; } ul.shopping-cart-items li { margin-bottom: 8px; padding-bottom:8px; border-bottom:1px solid #505050; } ul.shopping-cart-items li:last-child { margin-bottom: 0; padding-bottom:0; border-bottom:0; } ul.shopping-cart-items li img { float: left; width:50px; margin-right:5px; padding:0px; background:#f1f1f1 ; border:solid 1px #f1f1f1; } ul.shopping-cart-items .item-name { display: block; padding-top:0; line-height:1.2em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size:12px; } ul.shopping-cart-items .item-price { color: #848484 ; margin-right: 3px; font-size:11px; } ul.shopping-cart-items .item-quantity { color: #848484 ; font-size:11px; } .cd-morph-dropdown .bg-layer { /* morph dropdown background */ position:absolute; top:0; left:0; height:1px; width:1px; background:#FFFFFF; opacity:0; -webkit-transition:opacity .3s; transition: opacity .3s; -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-transform: translateZ(0); transform: translateZ(0); will-change: transform; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .cd-morph-dropdown.is-dropdown-visible .bg-layer { opacity: 1; -webkit-transition: opacity .3s, -webkit-transform .3s; transition: opacity .3s, -webkit-transform .3s; transition: transform .3s, opacity .3s; transition: transform .3s, opacity .3s, -webkit-transform .3s; } } .cd-morph-dropdown ul.links-list li { position:relative; } .cd-morph-dropdown ul.links-list li a:before { content: '\f101'; font-family: FontAwesome; color: #db1f25; position: absolute; left: 0; } /* --------------------------------
Main site content -------------------------------- */
.cd-main-content { min-height:100vh; background-color:#fff; } @media only screen and (min-width: 1000px) { .cd-main-content { padding-top: 83px; } }
/*!
* jquery-confirm v3.3.0 (http://craftpip.github.io/jquery-confirm/)
* Author: boniface pereira
* Website: www.craftpip.com
* Contact: hey@craftpip.com
*
* Copyright 2013-2017 jquery-confirm
* Licensed under MIT (https://github.com/craftpip/jquery-confirm/blob/master/LICENSE)
*/
@-webkit-keyframes jconfirm-spin { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes jconfirm-spin { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } body[class*=jconfirm-no-scroll-] { overflow: hidden !important; } .jconfirm { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 99999999; font-family: inherit; overflow: hidden; } .jconfirm .jconfirm-bg { position: fixed; top: 0; left: 0; right: 0; bottom: 0; -webkit-transition: opacity .4s; transition: opacity .4s; } .jconfirm .jconfirm-bg.jconfirm-bg-h { opacity: 0 !important; } .jconfirm .jconfirm-scrollpane { -webkit-perspective: 500px; perspective: 500px; -webkit-perspective-origin: center; perspective-origin: center; display: table; width: 100%; height: 100%; } .jconfirm .jconfirm-row { display: table-row; width: 100%; } .jconfirm .jconfirm-cell { display: table-cell; vertical-align: middle; } .jconfirm .jconfirm-holder { max-height: 100%; padding: 50px 0; } .jconfirm .jconfirm-box-container { -webkit-transition: -webkit-transform; transition: -webkit-transform; transition: transform; transition: transform, -webkit-transform; } .jconfirm .jconfirm-box-container.jconfirm-no-transition { -webkit-transition: none !important; transition: none !important; } .jconfirm .jconfirm-box { background: white; border-radius: 4px; position: relative; outline: none; padding: 15px 15px 0; overflow: hidden; margin-left: auto; margin-right: auto; width:50%; } @media screen and (max-width:480px) { .jconfirm .jconfirm-box { width:90%; } } @-webkit-keyframes type-blue { 1%, 100% { border-color: #3498db; } 50% { border-color: #5faee3; } } @keyframes type-blue { 1%, 100% { border-color: #3498db; } 50% { border-color: #5faee3; } } .jconfirm .jconfirm-box.jconfirm-type-animated { -webkit-animation-duration: 2s; animation-duration: 2s; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } .jconfirm .jconfirm-box.jconfirm-type-blue { border-top: solid 7px #3498db; -webkit-animation-name: type-blue; animation-name: type-blue; } .jconfirm .jconfirm-box.loading { height: 120px; } .jconfirm .jconfirm-box.loading:before { content: ''; position: absolute; left: 0; background: white; right: 0; top: 0; bottom: 0; border-radius: 10px; z-index: 1; } .jconfirm .jconfirm-box.loading:after { opacity: 0.6; content: ''; height: 30px; width: 30px; border: solid 3px transparent; position: absolute; left: 50%; margin-left: -15px; border-radius: 50%; -webkit-animation: jconfirm-spin 1s infinite linear; animation: jconfirm-spin 1s infinite linear; border-bottom-color: dodgerblue; top: 50%; margin-top: -15px; z-index: 2; } .jconfirm .jconfirm-box div.jconfirm-title-c { display: block; font-size: 22px; line-height: 27px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; cursor: default; padding-bottom: 15px; color:#505050; } .jconfirm .jconfirm-box div.jconfirm-title-c.jconfirm-hand { cursor: move; } .jconfirm .jconfirm-box div.jconfirm-title-c .jconfirm-icon-c { font-size: inherit; display: inline-block; vertical-align: middle; } .jconfirm .jconfirm-box div.jconfirm-title-c .jconfirm-icon-c i { vertical-align: middle; } .jconfirm .jconfirm-box div.jconfirm-title-c .jconfirm-icon-c:empty { display: none; } .jconfirm .jconfirm-box div.jconfirm-title-c .jconfirm-title { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; font-size: inherit; font-family: inherit; display: inline-block; vertical-align: middle; } .jconfirm .jconfirm-box div.jconfirm-title-c .jconfirm-title:empty { display: none; } .jconfirm .jconfirm-box div.jconfirm-content-pane { margin-bottom: 15px; height: auto; -webkit-transition: height 0.4s ease-in; transition: height 0.4s ease-in; display: inline-block; width: 100%; position: relative; overflow-x: hidden; overflow-y: auto; } .jconfirm .jconfirm-box div.jconfirm-content-pane.no-scroll { overflow-y: hidden; } .jconfirm .jconfirm-box div.jconfirm-content-pane::-webkit-scrollbar { width: 3px; } .jconfirm .jconfirm-box div.jconfirm-content-pane::-webkit-scrollbar-track { background: rgba(0, 0, 0, 0.1); } .jconfirm .jconfirm-box div.jconfirm-content-pane::-webkit-scrollbar-thumb { background: #666; border-radius: 3px; } .jconfirm .jconfirm-box div.jconfirm-content-pane .jconfirm-content { overflow: auto; } .jconfirm .jconfirm-box div.jconfirm-content-pane .jconfirm-content img { max-width: 100%; height: auto; } .jconfirm .jconfirm-box div.jconfirm-content-pane .jconfirm-content:empty { display: none; } .jconfirm .jconfirm-box .jconfirm-buttons { padding-bottom: 11px; } .jconfirm .jconfirm-box .jconfirm-buttons > button { margin-bottom: 4px; margin-left: 2px; margin-right: 2px; } .jconfirm .jconfirm-box .jconfirm-buttons button { display: inline-block; padding: 6px 12px; font-size: 14px; font-weight: 400; line-height: 1.42857143; text-align: center; white-space: nowrap; vertical-align: middle; -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; min-height: 1em; -webkit-transition: opacity 0.1s ease, background-color 0.1s ease, color 0.1s ease, background 0.1s ease, -webkit-box-shadow 0.1s ease; transition: opacity 0.1s ease, background-color 0.1s ease, color 0.1s ease, background 0.1s ease, -webkit-box-shadow 0.1s ease; transition: opacity 0.1s ease, background-color 0.1s ease, color 0.1s ease, box-shadow 0.1s ease, background 0.1s ease; transition: opacity 0.1s ease, background-color 0.1s ease, color 0.1s ease, box-shadow 0.1s ease, background 0.1s ease, -webkit-box-shadow 0.1s ease; -webkit-tap-highlight-color: transparent; border: none; background-image: none; } .jconfirm .jconfirm-box .jconfirm-buttons button.btn-blue { background-color: #d01f25; color: #FFF; text-shadow: none; -webkit-transition: background .2s; transition: background .2s; } .jconfirm .jconfirm-box .jconfirm-buttons button.btn-blue:hover { background-color: #a11e22; color: #FFF; } .jconfirm .jconfirm-box .jconfirm-buttons button.btn-green { background-color: #2ecc71; color: #FFF; text-shadow: none; -webkit-transition: background .2s; transition: background .2s; } .jconfirm .jconfirm-box .jconfirm-buttons button.btn-green:hover { background-color: #27ae60; color: #FFF; } .jconfirm .jconfirm-box .jconfirm-buttons button.btn-default { background-color: #ecf0f1; color: #000; text-shadow: none; -webkit-transition: background .2s; transition: background .2s; } .jconfirm .jconfirm-box .jconfirm-buttons button.btn-default:hover { background-color: #bdc3c7; color: #000; } .jconfirm .jconfirm-box .jconfirm-buttons button.btn-purple { background-color: #9b59b6; color: #FFF; text-shadow: none; -webkit-transition: background .2s; transition: background .2s; } .jconfirm .jconfirm-box .jconfirm-buttons button.btn-purple:hover { background-color: #8e44ad; color: #FFF; } .jconfirm .jconfirm-box .jconfirm-buttons button.btn-dark { background-color: #34495e; color: #FFF; text-shadow: none; -webkit-transition: background .2s; transition: background .2s; } .jconfirm .jconfirm-box .jconfirm-buttons button.btn-dark:hover { background-color: #2c3e50; color: #FFF; } .jconfirm .jconfirm-box.jconfirm-type-red .jconfirm-title-c .jconfirm-icon-c { color: #e74c3c !important; } .jconfirm .jconfirm-box.jconfirm-type-blue .jconfirm-title-c .jconfirm-icon-c { color: #3498db !important; } .jconfirm .jconfirm-box.jconfirm-type-green .jconfirm-title-c .jconfirm-icon-c { color: #2ecc71 !important; } .jconfirm .jconfirm-box.jconfirm-type-purple .jconfirm-title-c .jconfirm-icon-c { color: #9b59b6 !important; } .jconfirm .jconfirm-box.jconfirm-type-orange .jconfirm-title-c .jconfirm-icon-c { color: #f1c40f !important; } .jconfirm .jconfirm-box.jconfirm-type-dark .jconfirm-title-c .jconfirm-icon-c { color: #34495e !important; } .jconfirm .jconfirm-clear { clear: both; } .jconfirm.jconfirm-rtl { direction: rtl; } .jconfirm.jconfirm-rtl div.jconfirm-closeIcon { left: 5px; right: auto; } .jconfirm.jconfirm-white .jconfirm-bg, .jconfirm.jconfirm-light .jconfirm-bg { background-color: #505050; opacity: .7; } .jconfirm.jconfirm-white .jconfirm-box, .jconfirm.jconfirm-light .jconfirm-box { -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2); box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2); border-radius: 5px; } .jconfirm.jconfirm-white .jconfirm-box .jconfirm-title-c .jconfirm-icon-c, .jconfirm.jconfirm-light .jconfirm-box .jconfirm-title-c .jconfirm-icon-c { margin-right: 8px; margin-left: 0px; } .jconfirm.jconfirm-white .jconfirm-box .jconfirm-buttons, .jconfirm.jconfirm-light .jconfirm-box .jconfirm-buttons { float: right; } .jconfirm.jconfirm-white .jconfirm-box .jconfirm-buttons button, .jconfirm.jconfirm-light .jconfirm-box .jconfirm-buttons button { text-transform: uppercase; font-size: 14px; font-weight: bold; text-shadow: none; } .jconfirm.jconfirm-white .jconfirm-box .jconfirm-buttons button.btn-default, .jconfirm.jconfirm-light .jconfirm-box .jconfirm-buttons button.btn-default { -webkit-box-shadow: none; box-shadow: none; color: #333; } .jconfirm.jconfirm-white .jconfirm-box .jconfirm-buttons button.btn-default:hover, .jconfirm.jconfirm-light .jconfirm-box .jconfirm-buttons button.btn-default:hover { background: #ddd; } .jconfirm.jconfirm-white.jconfirm-rtl .jconfirm-title-c .jconfirm-icon-c, .jconfirm.jconfirm-light.jconfirm-rtl .jconfirm-title-c .jconfirm-icon-c { margin-left: 8px; margin-right: 0px; } .jconfirm.jconfirm-black .jconfirm-bg, .jconfirm.jconfirm-dark .jconfirm-bg { background-color: darkslategray; opacity: .4; } .jconfirm.jconfirm-black .jconfirm-box, .jconfirm.jconfirm-dark .jconfirm-box { -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2); box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2); background: #444; border-radius: 5px; color: white; } .jconfirm.jconfirm-black .jconfirm-box .jconfirm-title-c .jconfirm-icon-c, .jconfirm.jconfirm-dark .jconfirm-box .jconfirm-title-c .jconfirm-icon-c { margin-right: 8px; margin-left: 0px; } .jconfirm.jconfirm-black .jconfirm-box .jconfirm-buttons, .jconfirm.jconfirm-dark .jconfirm-box .jconfirm-buttons { float: right; } .jconfirm.jconfirm-black .jconfirm-box .jconfirm-buttons button, .jconfirm.jconfirm-dark .jconfirm-box .jconfirm-buttons button { border: none; background-image: none; text-transform: uppercase; font-size: 14px; font-weight: bold; text-shadow: none; -webkit-transition: background .1s; transition: background .1s; color: white; } .jconfirm.jconfirm-black .jconfirm-box .jconfirm-buttons button.btn-default, .jconfirm.jconfirm-dark .jconfirm-box .jconfirm-buttons button.btn-default { -webkit-box-shadow: none; box-shadow: none; color: #fff; background: none; } .jconfirm.jconfirm-black .jconfirm-box .jconfirm-buttons button.btn-default:hover, .jconfirm.jconfirm-dark .jconfirm-box .jconfirm-buttons button.btn-default:hover { background: #666; } .jconfirm.jconfirm-black.jconfirm-rtl .jconfirm-title-c .jconfirm-icon-c, .jconfirm.jconfirm-dark.jconfirm-rtl .jconfirm-title-c .jconfirm-icon-c { margin-left: 8px; margin-right: 0px; } .jconfirm .jconfirm-box.hilight.jconfirm-hilight-shake { -webkit-animation: shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both; animation: shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .jconfirm .jconfirm-box.hilight.jconfirm-hilight-glow { -webkit-animation: glow 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both; animation: glow 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } @-webkit-keyframes shake { 10%, 90% { -webkit-transform: translate3d(-2px, 0, 0); transform: translate3d(-2px, 0, 0); } 20%, 80% { -webkit-transform: translate3d(4px, 0, 0); transform: translate3d(4px, 0, 0); } 30%, 50%, 70% { -webkit-transform: translate3d(-8px, 0, 0); transform: translate3d(-8px, 0, 0); } 40%, 60% { -webkit-transform: translate3d(8px, 0, 0); transform: translate3d(8px, 0, 0); } } @keyframes shake { 10%, 90% { -webkit-transform: translate3d(-2px, 0, 0); transform: translate3d(-2px, 0, 0); } 20%, 80% { -webkit-transform: translate3d(4px, 0, 0); transform: translate3d(4px, 0, 0); } 30%, 50%, 70% { -webkit-transform: translate3d(-8px, 0, 0); transform: translate3d(-8px, 0, 0); } 40%, 60% { -webkit-transform: translate3d(8px, 0, 0); transform: translate3d(8px, 0, 0); } } @-webkit-keyframes glow { 0%, 100% { -webkit-box-shadow: 0 0 0px red; box-shadow: 0 0 0px red; } 50% { -webkit-box-shadow: 0 0 30px red; box-shadow: 0 0 30px red; } } @keyframes glow { 0%, 100% { -webkit-box-shadow: 0 0 0px red; box-shadow: 0 0 0px red; } 50% { -webkit-box-shadow: 0 0 30px red; box-shadow: 0 0 30px red; } } /*Transition rules*/ .jconfirm { -webkit-perspective: 400px; perspective: 400px; } .jconfirm .jconfirm-box { opacity: 1; -webkit-transition-property: all; transition-property: all; } .jconfirm .jconfirm-box.jconfirm-animation-top, .jconfirm .jconfirm-box.jconfirm-animation-left, .jconfirm .jconfirm-box.jconfirm-animation-right, .jconfirm .jconfirm-box.jconfirm-animation-bottom, .jconfirm .jconfirm-box.jconfirm-animation-opacity, .jconfirm .jconfirm-box.jconfirm-animation-zoom, .jconfirm .jconfirm-box.jconfirm-animation-scale, .jconfirm .jconfirm-box.jconfirm-animation-none, .jconfirm .jconfirm-box.jconfirm-animation-rotate, .jconfirm .jconfirm-box.jconfirm-animation-rotatex, .jconfirm .jconfirm-box.jconfirm-animation-rotatey, .jconfirm .jconfirm-box.jconfirm-animation-scaley, .jconfirm .jconfirm-box.jconfirm-animation-scalex { opacity: 0; } .jconfirm .jconfirm-box.jconfirm-animation-rotate { -webkit-transform: rotate(90deg); transform: rotate(90deg); } .jconfirm .jconfirm-box.jconfirm-animation-rotatex { -webkit-transform: rotateX(90deg); transform: rotateX(90deg); -webkit-transform-origin: center; transform-origin: center; } .jconfirm .jconfirm-box.jconfirm-animation-rotatexr { -webkit-transform: rotateX(-90deg); transform: rotateX(-90deg); -webkit-transform-origin: center; transform-origin: center; } .jconfirm .jconfirm-box.jconfirm-animation-rotatey { -webkit-transform: rotatey(90deg); transform: rotatey(90deg); -webkit-transform-origin: center; transform-origin: center; } .jconfirm .jconfirm-box.jconfirm-animation-rotateyr { -webkit-transform: rotatey(-90deg); transform: rotatey(-90deg); -webkit-transform-origin: center; transform-origin: center; } .jconfirm .jconfirm-box.jconfirm-animation-scaley { -webkit-transform: scaley(1.5); transform: scaley(1.5); -webkit-transform-origin: center; transform-origin: center; } .jconfirm .jconfirm-box.jconfirm-animation-scalex { -webkit-transform: scalex(1.5); transform: scalex(1.5); -webkit-transform-origin: center; transform-origin: center; } .jconfirm .jconfirm-box.jconfirm-animation-top { -webkit-transform: translate(0px, -100px); transform: translate(0px, -100px); } .jconfirm .jconfirm-box.jconfirm-animation-left { -webkit-transform: translate(-100px, 0px); transform: translate(-100px, 0px); } .jconfirm .jconfirm-box.jconfirm-animation-right { -webkit-transform: translate(100px, 0px); transform: translate(100px, 0px); } .jconfirm .jconfirm-box.jconfirm-animation-bottom { -webkit-transform: translate(0px, 100px); transform: translate(0px, 100px); } .jconfirm .jconfirm-box.jconfirm-animation-zoom { -webkit-transform: scale(1.2); transform: scale(1.2); } .jconfirm .jconfirm-box.jconfirm-animation-scale { -webkit-transform: scale(0.5); transform: scale(0.5); } .jconfirm .jconfirm-box.jconfirm-animation-none { visibility: hidden; } .jconfirm.jconfirm-supervan .jconfirm-bg { background-color: rgba(54, 70, 93, 0.95); } .jconfirm.jconfirm-supervan .jconfirm-box { background-color: transparent; } .jconfirm.jconfirm-supervan .jconfirm-box.jconfirm-type-blue { border: none; } .jconfirm.jconfirm-supervan .jconfirm-box.jconfirm-type-green { border: none; } .jconfirm.jconfirm-supervan .jconfirm-box.jconfirm-type-red { border: none; } .jconfirm.jconfirm-supervan .jconfirm-box.jconfirm-type-orange { border: none; } .jconfirm.jconfirm-supervan .jconfirm-box.jconfirm-type-purple { border: none; } .jconfirm.jconfirm-supervan .jconfirm-box.jconfirm-type-dark { border: none; } .jconfirm.jconfirm-supervan .jconfirm-box div.jconfirm-closeIcon { color: white; } .jconfirm.jconfirm-supervan .jconfirm-box div.jconfirm-title-c { text-align: center; color: white; font-size: 28px; font-weight: normal; } .jconfirm.jconfirm-supervan .jconfirm-box div.jconfirm-title-c > * { padding-bottom: 25px; } .jconfirm.jconfirm-supervan .jconfirm-box div.jconfirm-title-c .jconfirm-icon-c { margin-right: 8px; margin-left: 0px; } .jconfirm.jconfirm-supervan .jconfirm-box div.jconfirm-content-pane { margin-bottom: 25px; } .jconfirm.jconfirm-supervan .jconfirm-box div.jconfirm-content { text-align: center; color: white; } .jconfirm.jconfirm-supervan .jconfirm-box .jconfirm-buttons { text-align: center; } .jconfirm.jconfirm-supervan .jconfirm-box .jconfirm-buttons button { font-size: 16px; border-radius: 2px; background: #303f53; text-shadow: none; border: none; color: white; padding: 10px; min-width: 100px; } .jconfirm.jconfirm-supervan.jconfirm-rtl .jconfirm-box div.jconfirm-title-c .jconfirm-icon-c { margin-left: 8px; margin-right: 0px; } .jconfirm.jconfirm-material .jconfirm-bg { background-color: rgba(0, 0, 0, 0.67); } .jconfirm.jconfirm-material .jconfirm-box { background-color: white; -webkit-box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 13px 19px 2px rgba(0, 0, 0, 0.14), 0 5px 24px 4px rgba(0, 0, 0, 0.12); box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 13px 19px 2px rgba(0, 0, 0, 0.14), 0 5px 24px 4px rgba(0, 0, 0, 0.12); padding: 30px 25px 10px 25px; } .jconfirm.jconfirm-material .jconfirm-box .jconfirm-title-c .jconfirm-icon-c { margin-right: 8px; margin-left: 0px; } .jconfirm.jconfirm-material .jconfirm-box div.jconfirm-closeIcon { color: rgba(0, 0, 0, 0.87); } .jconfirm.jconfirm-material .jconfirm-box div.jconfirm-title-c { color: rgba(0, 0, 0, 0.87); font-size: 22px; font-weight: bold; } .jconfirm.jconfirm-material .jconfirm-box div.jconfirm-content { color: rgba(0, 0, 0, 0.87); } .jconfirm.jconfirm-material .jconfirm-box .jconfirm-buttons { text-align: right; } .jconfirm.jconfirm-material .jconfirm-box .jconfirm-buttons button { text-transform: uppercase; font-weight: 500; } .jconfirm.jconfirm-material.jconfirm-rtl .jconfirm-title-c .jconfirm-icon-c { margin-left: 8px; margin-right: 0px; } .jconfirm.jconfirm-bootstrap .jconfirm-bg { background-color: rgba(0, 0, 0, 0.21); } .jconfirm.jconfirm-bootstrap .jconfirm-box { background-color: white; -webkit-box-shadow: 0 3px 8px 0px rgba(0, 0, 0, 0.2); box-shadow: 0 3px 8px 0px rgba(0, 0, 0, 0.2); border: solid 1px rgba(0, 0, 0, 0.4); padding: 15px 0 0; } .jconfirm.jconfirm-bootstrap .jconfirm-box .jconfirm-title-c .jconfirm-icon-c { margin-right: 8px; margin-left: 0px; } .jconfirm.jconfirm-bootstrap .jconfirm-box div.jconfirm-closeIcon { color: rgba(0, 0, 0, 0.87); } .jconfirm.jconfirm-bootstrap .jconfirm-box div.jconfirm-title-c { color: rgba(0, 0, 0, 0.87); font-size: 22px; font-weight: bold; padding-left: 15px; padding-right: 15px; } .jconfirm.jconfirm-bootstrap .jconfirm-box div.jconfirm-content { color: rgba(0, 0, 0, 0.87); padding: 0px 15px; } .jconfirm.jconfirm-bootstrap .jconfirm-box .jconfirm-buttons { text-align: right; padding: 10px; margin: -5px 0 0px; border-top: solid 1px #ddd; overflow: hidden; border-radius: 0 0 4px 4px; } .jconfirm.jconfirm-bootstrap .jconfirm-box .jconfirm-buttons button { font-weight: 500; } .jconfirm.jconfirm-bootstrap.jconfirm-rtl .jconfirm-title-c .jconfirm-icon-c { margin-left: 8px; margin-right: 0px; } .jconfirm.jconfirm-modern .jconfirm-bg { background-color: slategray; opacity: .6; } .jconfirm.jconfirm-modern .jconfirm-box { background-color: white; -webkit-box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 13px 19px 2px rgba(0, 0, 0, 0.14), 0 5px 24px 4px rgba(0, 0, 0, 0.12); box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 13px 19px 2px rgba(0, 0, 0, 0.14), 0 5px 24px 4px rgba(0, 0, 0, 0.12); padding: 30px 30px 15px; } .jconfirm.jconfirm-modern .jconfirm-box div.jconfirm-closeIcon { color: rgba(0, 0, 0, 0.87); top: 15px; right: 15px; } .jconfirm.jconfirm-modern .jconfirm-box div.jconfirm-title-c { color: rgba(0, 0, 0, 0.87); font-size: 24px; font-weight: bold; text-align: center; margin-bottom: 10px; } .jconfirm.jconfirm-modern .jconfirm-box div.jconfirm-title-c .jconfirm-icon-c { -webkit-transition: -webkit-transform .5s; transition: -webkit-transform .5s; transition: transform .5s; transition: transform .5s, -webkit-transform .5s; -webkit-transform: scale(0); transform: scale(0); display: block; margin-right: 0px; margin-left: 0px; margin-bottom: 10px; font-size: 69px; color: #aaa; } .jconfirm.jconfirm-modern .jconfirm-box div.jconfirm-content { text-align: center; font-size: 15px; color: #777; margin-bottom: 25px; } .jconfirm.jconfirm-modern .jconfirm-box .jconfirm-buttons { text-align: center; } .jconfirm.jconfirm-modern .jconfirm-box .jconfirm-buttons button { font-weight: bold; text-transform: uppercase; -webkit-transition: background .1s; transition: background .1s; padding: 10px 20px; } .jconfirm.jconfirm-modern .jconfirm-box .jconfirm-buttons button + button { margin-left: 4px; } .jconfirm.jconfirm-modern.jconfirm-open .jconfirm-box .jconfirm-title-c .jconfirm-icon-c { -webkit-transform: scale(1); transform: scale(1); }
/* template-style.css */
@font-face {
font-family: 'roboto';
src: url('../font/roboto/Roboto-Regular.ttf'), url('../font/roboto/Roboto-Regular.woff2'), url('../font/roboto/Roboto-Regular.woff');
}
@font-face {
font-family: 'Roboto-Bold';
src: url('../font/roboto/Roboto-Bold.ttf');
}
@font-face {
font-family: 'Extra-Bold';
src: url('../font/merriweather/Merriweather-Black.ttf');
}
@font-face {
font-family: 'MerriweatherBold';
src: url('../font/merriweather/Merriweather-Bold.ttf');
}
@font-face {
font-family: 'Bitter';
src: url('../font/alpha/AlfaSlabOne-Regular.ttf');
}
* {
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
margin:0;
}
html {
-webkit-tap-highlight-color: rgba(0,0,0,0);
}
body {
background:none repeat scroll 0 0 #fff;
font-size:14px; line-height:20px;
font-family: 'roboto';
color:#505050;
}
/* Paste this css to your style sheet file or under head tag */
/* This only works with JavaScript,
if it's not present, don't show loader */
.no-js #loader { display: none; }
.js #loader { display: block; position: absolute; left: 100px; top: 0; }
.se-pre-con {
position: fixed;
left: 0;
top: 0;
bottom:9;
width: 100%;
height: 100%;
z-index: 9999;
background: url(../img/gif/animated.gif?v=1.2) center no-repeat #fff;
}
a, a:link, a:visited, a:hover {
text-decoration:none;
color:#db1f25;
transition:color 0.20s linear 0s;
-o-transition:color 0.20s linear 0s;
-ms-transition:color 0.20s linear 0s;
-moz-transition:color 0.20s linear 0s;
-webkit-transition:color 0.20s linear 0s;
}
a:active { color:#f3a0a3; }
a:hover {text-decoration:underline;}
a.wider { display:block; padding:0; margin:0; border-bottom:solid 1px #fff; }
a.wider span.counter { background:#db1f25; padding:0px 2px; color:#fff; float:right; }
a.bundles-link { display:block; border-bottom:solid 1px #f5f5f5; padding-left:10px; }
a.bundles-link .counter { float:right; color:#ccc; padding-right:10px; }
a.bundles-link .by { font-size:10px; }
a.bundles-link:hover { text-decoration:none; background:#fafafa; }
a.add-to-rp, a.add-to-rp-alum, a.add-to-rp-wood { color: #03A9F4; padding-left: 10px; padding-top: 14px; display: block; }
a.add-to-rp:hover, a.add-to-rp-alum:hover, a.add-to-rp-wood:hover { cursor:pointer; color:#7fd1f7; }
a.letschat { color:#8BC34A; background:#eee; padding:1px 7px 2px 7px; border-radius:5px; }
span.addedinrp { display:block; padding-left:10px; padding-top:14px; color:#8BC34A; }
#offerbox { padding:0; }
#offerbox p { margin-bottom:5px; }
#offerbox p { margin-bottom:5px; }
#offerbox span.offeris { display:inline-block; text-align:center; background:#fdefab; padding:10px 14px; border-radius:4px; }
#offerbox a.foundoffer { display:inline-block; }
#offerbox a.foundoffer:hover { text-decoration:none; cursor:pointer; }
#offerbox a.offerimg { display:block; padding-top:5px; color:#777; }
#offerbox a.offerimg:hover { cursor:pointer; }
#offerbox span.percentoff { display:block; color:#999; padding-bottom:5px; }
.sortby-dropdown { padding-bottom:12px; padding-top:4px; padding-left:6px; }
/* animated links */
.link-white > a, .link-primary > a, .link-secondary > a {
position: relative;
text-decoration: none;
}
.link-white > a:before {
background-color: #fff;
}
.link-primary > a:before {
background-color: #fad00a;
}
.link-secondary > a:before {
background-color: #db1f25;
}
.link-white > a:before, .link-primary > a:before, .link-secondary > a:before {
content: "";
position: absolute;
width: 100%;
height: 1px;
bottom: -1px;
left: 0;
visibility: hidden;
-webkit-transform: scaleX(0);
transform: scaleX(0);
-webkit-transition: all 0.3s ease-in-out 0s;
transition: all 0.3s ease-in-out 0s;
}
.link-white > a:hover:before, .link-primary > a:hover:before, .link-secondary > a:hover:before {
visibility: visible;
-webkit-transform: scaleX(1);
transform: scaleX(1);
}
b,strong {font-weight:normal; font-family: 'Roboto-Bold';}
strong {color:#d01f25;}
b {color:#111;}
p.colorred, .colorred, b .colorred {color:#FF0000;}
b.b-divider { display:block; width:100%; padding-top:6px; margin-bottom:6px; }
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
color: #111;
margin-bottom: 15px;
margin-top: 0;
}
h1, .h1 {
font-family: 'Extra-Bold';
font-size: 23px;
line-height:30px;
font-weight:normal;
letter-spacing:1px;
}
h1 span, .h1 span {
font-size: 18px;
font-family:'MerriweatherBold';
letter-spacing:0;
}
h1.homepage {
font-family: 'Bitter';
font-size:2.4em;
color:#d01f25;
line-height:0.9em;
text-transform:uppercase;
margin-bottom:9px;
}
h1.homepage span {
font-size: 20px;
font-family: 'Extra-Bold';
color:#505050;
}
h1.size-30 { font-size:30px; line-height:38px; }
h2.homepage {
font-family: 'Bitter';
font-size:2em;
color:#d01f25;
line-height:0.9em;
font-weight:normal;
margin-bottom: 8px;
}
h2.homepage span {
font-size: 20px;
font-family: 'Extra-Bold';
color:#505050;
}
span.homepage-span {
font-size: 19px;
font-family: 'Extra-Bold';
color:#333;
text-align:center;
display: block;
padding-bottom: 18px;
}
h1.searchpage {
font-family: 'Bitter';
font-size:2.6em;
color:#d01f25;
line-height:50px;
}
h1.searchpage span {
font-size: 20px;
font-family: 'Extra-Bold';
color:#505050;
}
h2, .h2 {
font-size: 1.2em;
font-family:'MerriweatherBold';
line-height: 25px;
}
h2 a {
color:#505050 !important;
}
h2 a:hover {
color:#db1f25 !important;
}
h2 span.related {
color:#db1f25 !important;
}
h2 span.alternated {
color:#44b035 !important;
}
h3, .h3 {
font-size: 1.2em;
font-family: 'Roboto-Bold';
}
h3.heading-category {
margin-top:30px;
float:left;
display:block;
}
h3.shady {
background: -moz-linear-gradient(top, rgba(232,232,232,1) 0%, rgba(255,255,255,0) 100%);
background: -webkit-linear-gradient(top, rgba(232,232,232,1) 0%,rgba(255,255,255,0) 100%);
background: linear-gradient(to bottom, rgb(248, 250, 244) 0%,rgba(255,255,255,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e8e8e8', endColorstr='#00ffffff',GradientType=0 );
padding: 10px;
}
h3.shop-by-brans {
color: #ffffff;
margin-bottom: 10px;
display: inline-block;
background: #d01f25;
padding: 10px 15px;
}
h3.heading-cat {
color:#111; margin:0; background:#ffffff; padding:0 0 0 7px; font-size:22px;
}
h4, .h4 {
font-size: 1.2em;
font-family:'MerriweatherBold';
}
h5, .h5 {
font-size: 1.2em;
font-family:'MerriweatherBold';
}
h6, .h6 {
font-size: 1.2em;
font-family:'MerriweatherBold';
}
ul {
padding-left: 18px;
}
img.special-offers {
border:solid 1px #fff;
}
img.special-offers:hover {
border:solid 1px #ddd;
}
p.price-p { background:#dbf3dc; border: solid 2px #505050; line-height: 40px; padding: 10px; }
p.price-p span.stockbranch { background:#4CAF50; color:#fff; padding:2px 5px; }
p.price-p span.stockqty { background:#ffffff; color:#000; padding:2px 5px; margin-right:10px; }
p.price-p span.stockqty.laststock { margin-right:0; }
p.price-p span.mainspan { display:block; line-height:20px; }
p.price-p span.pricespan { font-size:17px; font-family:'Roboto-Bold'; }
p.price-p span.stockspan { background: #e1efd1; padding: 4px 7px; color:#659829; }
.fine-txt {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.left-side, .fixme .left-side {
padding:15px;
margin-right:17px;
margin-bottom:20px;
background:#f9f9f9;
border:solid 1px #ddd;
}
.left-side-image {
margin-right:17px;
border-bottom:solid 12px #fff;
}
/* custom UL */
ul.custom-ul {
margin:0;
padding:0;
list-style:none;
position:relative;
}
ul.custom-ul li:before {
content:'\f101';
font-family:FontAwesome;
color:#db1f25;
position:absolute;
margin-top:6px;
left:0;
}
ul.custom-ul li {
margin-left:12px;
}
ul.custom-ul li a {
display:inline-block;
padding-top:8px;
color:#222;
}
#typed-text { width:100%; height:36px; text-align:center; }
#typed { color:#222; font-size:15px; height:44px; margin-bottom:20px; background:#f3efde; border-bottom: solid 1px #f7d009; padding: 4px 7px; }
.home-top { padding-top:35px; }
.home-top a.chat {
position: absolute;
background: #edffd7;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #edffd7), color-stop(100%, #acd084));
background: -webkit-linear-gradient(top, #edffd7 0%, #acd084 100%);
background: -moz-linear-gradient(top, #edffd7 0%, #acd084 100%);
background: -ms-linear-gradient(top, #edffd7 0%, #acd084 100%);
background: -o-linear-gradient(top, #edffd7 0%, #acd084 100%);
background: linear-gradient(to bottom, #edffd7 0%, #acd084 100%);
right: 181px;
top:8px;
color: #111;
padding: 3px 7px;
border: solid 1px #add085;
border-radius: 4px;
}
.home-top a.chat:hover {
text-decoration:none;
background:#edffd7;
cursor:pointer;
}
.home-top a.chat:active {
border-bottom:solid 2px #add085;
}
.home-top a.quote {
position: absolute;
right: 55px;
top:8px;
color: #111;
background: #f3f3f3;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fff6c5 ), color-stop(100%, #f7d10a ));
background: -webkit-linear-gradient(top, #fff6c5 0%, #f7d10a 100%);
background: -moz-linear-gradient(top, #fff6c5 0%, #f7d10a 100%);
background: -ms-linear-gradient(top, #fff6c5 0%, #f7d10a 100%);
background: -o-linear-gradient(top, #fff6c5 0%, #f7d10a 100%);
background: linear-gradient(to bottom, #fff6c5 0%, #f7d10a 100%);
border: solid 1px #ecc914;
padding: 3px 7px;
border-radius: 4px;
}
.home-top a.quote:hover {
text-decoration:none;
background:#fff6c5;
cursor:pointer;
}
.home-top a.quote:active {
border-bottom:solid 2px #ecc914;
}
/* btns for inner pages */
.inner-top a.chatbtn {
background: #ecf9dd;
color: #333;
padding: 6px 10px;
border: solid 1px #8BC34A;
border-bottom: solid 2px #8BC34A;
float:right;
margin-top:10px;
}
.inner-top a.chatbtn:hover {
text-decoration:none;
background:#e4f3d3;
}
.inner-top a.chatbtn:active {
border:0px;
border-bottom:solid 3px #8BC34A;
}
.inner-top a.chatbtn i {
color:#8BC34A;
}
.inner-top a.quotebtn {
color: #333;
background: #f3f3f3;
border: solid 1px #ccc;
border-bottom: solid 2px #ccc;
padding: 6px 10px;
float:right;
margin-top:10px;
margin-left:8px;
margin-right:12px;
}
.inner-top a.quotebtn:hover {
text-decoration:none;
background:#eee;
}
.inner-top a.quotebtn:active {
border:0px;
border-bottom:solid 3px #ccc;
}
.inner-top a.quotebtn i {
color: #777;
}
.about-us { padding-right:20px; }
.about-box-home .images {
text-align:center;
}
.about-box-home img {
width:192px; margin-right:10px; display:inline; -webkit-box-shadow: 0px 0px 5px 0px rgba(153,153,153,1); -moz-box-shadow: 0px 0px 5px 0px rgba(153,153,153,1); box-shadow: 0px 0px 5px 0px rgba(153,153,153,1);
}
.text-center {text-align:center !important;}
.text-align { text-align:left; }
.align-responsive { text-align:center; }
.text-right {text-align:right !important;}
.text-justify {text-align:justify !important;}
.position-relative { position:relative; }
p.success { color:#fff; background:#8cb180; padding:10px; text-align:left; margin-bottom:2em; }
p.error-alert { color:#fff; background:#d64e4e; padding:10px; text-align:left; margin-bottom:2em; }
.newboxes { display:none; }
.product-unit { background:#e4a600; padding:0 6px; color:#fff; }
#load { display:none; position:fixed; top:40%; left:45%; z-index:9999; }
#load img { border:solid 5px #fcd307; padding:20px; background:#fff; }
figcaption a.rp-added { display:none; }
/* HOME PAGE */
/* banner one */
.gallery-img {
position:relative;
}
.gallery-img .content {
position:absolute;
width:100%;
height:100%;
top:0;
left:0;
text-align:center;
justify-content: center;
flex-direction: column;
align-items: center;
display: flex;
background:rgba(0,0,0,0.2);
}
.gallery-img .content.pright {
border-right: 10px solid #fff;
}
.gallery-img .content:hover {
background:rgba(151,151,151,0);
}
.gallery-img .content.view-all {
background: #d01f25;
}
.gallery-img .content.view-all:hover {
background:#e22027;
}
.gallery-img .content.view-all a {
display:block;
padding:25px;
color:#fff;
font-family:'Roboto-Bold';
}
.gallery-img .content.view-all a:hover { text-decoration:none; }
.gallery-img img {
border-right:solid 1px #fff;
border-bottom:solid 1px #fff;
}
.home-section {
padding-top:60px;
}
/* banner one */
.banner-one-box {
padding-top:6px;
padding-right:6px;
padding-left:6px;
}
.banner-one {
position:relative;
}
.banner-one .content {
position:absolute;
width:100%;
height:100%;
top:0;
left:0;
text-align:center;
justify-content: center;
flex-direction: column;
align-items: center;
display: flex;
background:rgba(40,40,40,0.8);
}
/* banner slideshow */
.banner-slideshow-box {
padding-top:6px;
padding-right:8px;
padding-left:6px;
}
.banner-slideshow {
position:relative;
}
.banner-slideshow .content h3 {
background:rgba(0,0,0,0.2);
border:solid 1px #fff;
padding:7px 10px;
}
.banner-slideshow .content {
position:absolute;
bottom:20px;
left:0;
width:100%;
text-align:center;
justify-content: center;
flex-direction: column;
align-items: center;
display: flex;
padding-bottom:12px;
padding-top:5px;
}
.home-banners {
padding-top:6px;
padding-right:6px;
padding-left:6px;
}
.home-banners .home-banner {
background:#e0e0e0;
}
.banner-one .content:hover {
background:rgba(40,40,40,0.4);
background:rgba(40,40,40,0.4);
}
/* banner two */
.banner-two-box {
padding-top:6px;
}
.banner-two {
position:relative;
}
.banner-two .content {
position:absolute;
width:100%;
height:100%;
top:0;
left:0;
text-align:center;
justify-content: center;
flex-direction: column;
align-items: center;
display: flex;
background:rgba(189,152,81,0.8);
}
.banner-two .content:hover {
background:rgba(189,152,81,0.4);
}
/* banner alum acc */
.banner-alum-acc-box {
padding-top:6px;
}
.banner-alum-acc {
position:relative;
}
.banner-alum-acc .content {
position:absolute;
width:100%;
height:100%;
top:0;
left:0;
text-align:center;
justify-content: center;
flex-direction: column;
align-items: center;
display: flex;
background:rgba(167,134,72,0.8);
}
.banner-alum-acc .content:hover {
background:rgba(167,134,72,0.4);
}
/* banner solid wood */
.banner-solid-wood {
padding-top: 6px;
padding-right: 6px;
padding-left: 6px;
}
.banner-solid-wood {
position:relative;
}
.banner-solid-wood .content {
position:absolute;
width:100%;
height:100%;
top:0;
left:0;
text-align:center;
justify-content: center;
flex-direction: column;
align-items: center;
display: flex;
background:rgba(189,152,81,0.8);
}
.banner-solid-wood .content:hover {
background:rgba(189,152,81,0.4);
}
/* banner three */
.banner-three-box {
padding-top:12px;
}
.banner-three {
position:relative;
}
.banner-three .content {
position:absolute;
width:100%;
height:100%;
top:0;
left:0;
text-align:center;
justify-content: center;
flex-direction: column;
align-items: center;
display: flex;
background:rgba(118,133,146,0.8);
}
.banner-three .content:hover {
background:rgba(118,133,146,0.4);
}
/* banner four */
.banner-four-box {
padding:6px;
}
.banner-four {
position:relative;
}
.banner-four .content {
position:absolute;
width:100%;
height:100%;
top:0;
left:0;
text-align:center;
justify-content: center;
flex-direction: column;
align-items: center;
display: flex;
background:rgba(183,183,183,0.8);
}
.banner-four .content:hover {
background:rgba(183,183,183,0.4);
}
/* banner four again */
.banner-fouragain-box {
padding:6px;
}
.banner-fouragain {
position:relative;
}
.banner-fouragain .content {
position:absolute;
width:100%;
height:100%;
top:0;
left:0;
text-align:center;
justify-content: center;
flex-direction: column;
align-items: center;
display: flex;
background:rgba(134,121,115,0.8);
}
.banner-fouragain .content:hover {
background:rgba(134,121,115,0.4);
}
/* banner five */
.banner-five-box {
padding-top:6px;
padding-right:6px;
padding-left:6px;
}
.banner-five {
position:relative;
}
.banner-five:hover {
background:#e9e7e5;
}
.banner-five .content {
position:absolute;
width:100%;
height:100%;
top:0;
left:0;
text-align:center;
justify-content: center;
flex-direction: column;
align-items: center;
display: flex;
}
/* banner six */
.banner-six-box {
padding-top:6px;
padding-right:6px;
padding-left:6px;
}
.banner-six {
position:relative;
}
.banner-six .content {
position:absolute;
width:100%;
height:100%;
top:0;
left:0;
text-align:center;
justify-content: center;
flex-direction: column;
align-items: center;
display: flex;
background:rgba(40,40,40,0.7);
}
.banner-six .content:hover {
background:rgba(40,40,40,0.5);
}
/* banner seven */
.banner-seven-box {
padding-top:6px;
padding-right:6px;
padding-left:6px;
}
.banner-seven {
position:relative;
}
.banner-seven .content {
position:absolute;
width:100%;
height:100%;
top:0;
left:0;
text-align:center;
justify-content: center;
flex-direction: column;
align-items: center;
display: flex;
background:rgba(212,195,130,0.7);
}
.banner-seven .content:hover {
background:rgba(212,195,130,0.5);
}
/* banner eight */
.banner-eight-box {
padding:12px 6px 7px 6px;
}
.banner-eight {
position:relative;
}
.banner-eight .content {
position:absolute;
width:100%;
height:100%;
top:0;
left:0;
text-align:center;
justify-content: center;
flex-direction: column;
align-items: center;
display: flex;
background:rgba(0,0,0,0.7);
}
.banner-eight .content:hover {
background:rgba(0,0,0,0.4);
}
/* banner acc */
.banner-acc-box {
padding-top:6px;
padding-right:6px;
padding-left:6px;
margin-top:6px;
}
.banner-acc-box.no-border {
border-right:0px;
}
.banner-acc {
position:relative;
}
.banner-acc .content {
text-align:center;
float:left;
width:100%;
background:#efedec;
}
.banner-acc img {
border:solid 1px #eee;
}
.banner-acc .content:hover {
background:#e9e7e5;
}
/* News Ticker */
.mih-news {
margin: 13px 6px 6px 6px;
padding-top: 25px;
padding-left: 22px;
border: solid 1px #505050;
background:#fff;
}
.mih-news strong {
color:#d21f25;
}
.mih-news strong span {
color:#222;
}
#typed-text-news { width:100%; padding-top:8px; height:51px; text-align:left; font-size: 15px; }
#typed-news { color:#222; height:100px; }
.content h3 {
color:#fff;
font-size:30px;
line-height:40px;
text-shadow: 2px 4px 3px rgba(0,0,0,0.3);
margin-bottom:0px;
margin-top:0px;
}
.content p {
color:#fff;
margin-bottom:20px;
padding-left: 20px;
padding-right: 20px;
text-shadow: 2px 4px 3px rgba(0,0,0,0.3);
margin-bottom:0px;
margin-top:0px;
}
.content h3.no-shadow {
text-shadow: 0px 0px 0px rgba(0,0,0,0.3);
color:#222;
}
.content h3.small-size {
font-size:16px;
}
.content a.link {
color:#222;
display:block;
padding:10px;
}
.content p.no-shadow {
color:#222;
text-shadow: 0px 0px 0px rgba(0,0,0,0.3);
}
.content a.buttonis {
background:#d21f25;
color:#fff;
padding:12px 18px;
margin-top:10px;
}
.content a.buttonis:hover {
background:#c31217;
text-decoration:none;
}
.content a.buttonis.yellow {
background:#eed608;
}
.content a.buttonis.yellow:hover {
background:#dac516;
}
.boxshadow {
webkit-box-shadow: inset 0 0px 40px #eaeaea;
-moz-box-shadow: inset 0 0px 40px #eaeaea;
box-shadow: inset 0 0px 40px #eaeaea;
}
#code {
padding:10px;
background:#666;
width:100%;
float:left;
border-top:solid 1px #fff;
}
#code strong {
color:#f8d108;
}
#code #dash {
display:inline-block;
color:#fff;
}
#code #colorcode {
display:inline-block;
color:#fff;
}
#code #sizecode {
display:inline-block;
color:#fff;
}
#code #refcode {
display:inline-block;
color:#fff;
}
#code #brandcode {
display:inline-block;
color:#fff;
}
#code #weightcode {
display:inline-block;
color:#fff;
}
#code #productcode {
display:inline-block;
color:#fff;
}
#code #thicknesscode {
display:inline-block;
color:#fff;
}
#code #sidecode {
display:inline-block;
color:#fff;
}
#code #impressioncode {
display:inline-block;
color:#fff;
}
#code #selectedcodeis {
display:inline-block;
color:#fff;
}
#error_para .error, p.error {
color:#e7242a;
display:block;
}
.line #inner-section {
padding:2.5em 2em; width:100%;
}
img {
border:0;
display:block;
height:auto;
max-width:100%;
width:100%;
}
img.stock-img { width:124px; }
/* Tables */
table {
background:none repeat scroll 0 0 #fff;
border:0;
border-spacing:0px;
width:100%;
}
table tr td, table tr th {
padding:10px;
}
table tfoot, table thead {
background:none repeat scroll 0 0 #f1f1f1;
border-top:1px solid #f1f1f1;
border-bottom:1px solid #f1f1f1;
}
table tr:nth-of-type(2n) {
background:none repeat scroll 0 0 #f1f1f1;
border-top:1px solid #f1f1f1;
border-bottom:1px solid #f1f1f1;
}
th {
border-right:1px solid #eec70d;
font-weight:normal;
text-align:left;
background:#fcd00d;
}
td {
border-right:1px solid #ddd;
}
/* Photo Gallery */
.gallery-photo {
padding-right:10px;
}
/* Home Search */
form.mih_search {
}
form.mih_search input[type="text"] {
width:300px;
padding:10px;
float:left;
border:solid 1px #f1f1f1;
background:#fff;
}
form.mih_search input[type="text"]:focus {
outline:none;
}
form.mih_search input[type="submit"] {
border:solid 1px #505050;
background:#505050;
color:#fff;
padding:10px;
float:right;
}
.ui-menu .ui-menu-item {
border-bottom:solid 1px #eee;
}
.ui-menu .ui-menu-item a {
padding:10px 8px !important;
}
.ui-autocomplete {
max-height: 350px;
overflow-y: auto;
/* prevent horizontal scrollbar */
overflow-x: hidden;
border-color:#fff;
}
.ui-widget-content {
border-color:#fff;
}
form.mih_search ::-webkit-input-placeholder { /* Chrome */
color: #ccc;
}
form.mih_search :-ms-input-placeholder { /* IE 10+ */
color: #ccc;
}
form.mih_search ::-moz-placeholder { /* Firefox 19+ */
color: #ccc;
opacity: 1;
}
form.mih_search :-moz-placeholder { /* Firefox 4 - 18 */
color: #ccc;
opacity: 1;
}
.disabledbtn {
color:#ccc !important;
border: solid 1px #eee !important;
border-bottom: solid 2px #eee !important;
background:#fff !important;
}
.disabledbtn:hover {
cursor:default !important;
}
/* Admin CSS */
.delete {
position:absolute;
right:10px; bottom:30px;
}
.new-order {
border: solid 3px #fff;
border-bottom: solid 4px #fff;
padding:15px;
background:#f3f3f3;
text-align:left;
}
.new-order span {
display:block;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
table.order-table {
font-size:13px;
}
/* Backgrounds */
.background-yellow {
background: #E4A600 none repeat scroll 0 0;
}
.background-primary {
background: #C81010 none repeat scroll 0 0;
}
.background-white {
background: #fff none repeat scroll 0 0;
}
.background-dark {
background: #505050 none repeat scroll 0 0;
}
.background-light {
background: #f3f3f3 none repeat scroll 0 0;
}
.background-shades { -webkit-box-shadow: inset 0 0px 40px #eef1e1; -moz-box-shadow: inset 0 0px 40px #eef1e1; box-shadow: inset 0 0px 40px #eef1e1; border:solid 1px #eef1e1; }
.background-box { background:#f3f3f3; border:solid 1px #d4d4d4; border-bottom: solid 5px #d4d4d4; }
.background-none {
background: none !important;
}
.gbackground {
background-color: #db1f25;
display:block;
width:100%;
text-align:center;
color:#fff !important;
padding:8px 5px;
line-height:1.4em;
font-size:14px;
}
.gbackground:hover { background:#c21116; }
.gbackground span { color:#fad00a; }
.grbackground {
color:#40c22f !important;
}
.grbackground span { color:#fad00a; }
/* Breaks */
hr.break {
border: 0;
border-top: 1px solid #e5e5e5;
display: block;
margin: 10px 0;
margin-bottom:20px;
}
hr.break:after {
clear:both;
content:".";
display:block;
height:0;
line-height:0;
visibility:hidden;
}
/* Small Breaks Inner */
hr.break-small-inner {
background: #db1f25;
border: 0;
display: block;
height: 6px;
margin: 10px 0 10px 0;
width: 60px;
}
/* Small Breaks */
hr.break-small {
background: #db1f25;
border: 0;
display: block;
height: 6px;
margin: 10px 0 0px 0;
width: 60px;
}
hr.break-small.break-center {
margin: 20px auto 35px;
}
hr.break-home {
background: #fad00a;
border: 0;
display: block;
height: 1px;
margin: 0px auto;
margin-bottom:16px;
width: 160px;
}
hr.break-home-left {
background: #fad00a;
border: 0;
display: block;
height: 1px;
margin-bottom:16px;
width: 160px;
}
/* Animated carousel content */
.animated-carousel-element {
position: relative;
top: 200px;
opacity: 0;
animation-duration: 1s;
}
.active .animated-carousel-element {
top: 0;
opacity: 1;
animation-name: bounceIn-carousel;
}
@keyframes bounceIn-carousel {
0% {
top: 200px;
opacity: 0;
}
60% {
top: -20px;
}
100% {
top: 0;
opacity: 1;
}
}
/* Animated content */
.animated {
position: relative;
top: 200px;
opacity: 0;
animation-duration: 1s;
}
.slow {
animation-duration: 2s;
}
.animation {
top: 0;
opacity: 1;
animation-name: bounceIn;
}
@keyframes bounceIn {
0% {
top: 200px;
opacity: 0;
}
60% {
top: -10px;
}
100% {
top: 0;
opacity: 1;
}
}
video {
display: block;
}
/* Top Nav */
.top-nav li a, .background-white .top-nav li a {
color: #002633;
font-size: 0.85rem;
padding: 0.7em 1.25em;
}
nav {
padding: 1.7rem 0;
position: relative;
z-index: 2;
}
.top-nav ul ul {
background: #002633 none repeat scroll 0 0;
}
.top-nav li ul li {
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.top-nav li ul li:last-child {
border-bottom: 0;
}
.top-nav li ul li a, .background-white .top-nav li ul li a, .top-nav .active-item li a {
background: #002633 none repeat scroll 0 0;
color: rgba(255,255,255, 0.75);
}
ul.chevron .submenu > a::after, ul.chevron .sub-submenu > a::after, ul.chevron .aside-submenu > a::after, ul.chevron .aside-sub-submenu > a::after {
margin: 0 0 0 0.625rem;
}
.top-nav ul ul a {
color: #eee;
}
.sticky {
transition: all 0.20s linear 0s;
-o-transition: all 0.20s linear 0s;
-ms-transition: all 0.20s linear 0s;
-moz-transition: all 0.20s linear 0s;
-webkit-transition: all 0.20s linear 0s;
}
.fixed {
left: 0;
position: fixed;
right: 0;
top: 0;
width: 100%;
z-index: 10;
}
nav.fixed, .fixed nav {
padding: 1rem 0;
}
.logo img {
margin: 0 auto;
max-width: 300px;
width: 100%;
}
/* Text Colors */
.text-white {
color: #fff !important;
}
.text-primary {
color: #db1f25 !important;
}
.text-red {
color: #d01f25 !important;
}
/* Hover Overlay */
.image-hover-overlay {
bottom: 0;
color: rgba(255,255,255, 0.75)!important;
left: 0;
opacity: 0;
padding: 1.25rem;
position: absolute;
right: 0;
top: 0;
z-index: 1;
transition: all 0.20s linear 0s;
-o-transition: all 0.20s linear 0s;
-ms-transition: all 0.20s linear 0s;
-moz-transition: all 0.20s linear 0s;
-webkit-transition: all 0.20s linear 0s;
transform-style: preserve-3d;
-o-transform-style: preserve-3d;
-ms-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
-webkit-transform-style: preserve-3d;
}
.image-border-radius .image-hover-overlay {
border-radius: 3px;
}
.image-hover-overlay:hover {
opacity: 1;
}
.image-hover-overlay-content {
position: absolute;
left: 0;
right: 0;
top: 60%;
transition: all 0.20s linear 0s;
-o-transition: all 0.20s linear 0s;
-ms-transition: all 0.20s linear 0s;
-moz-transition: all 0.20s linear 0s;
-webkit-transition: all 0.20s linear 0s;
transform: translateY(-50%);
-o-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
}
.image-hover-overlay:hover > .image-hover-overlay-content {
top: 50%;
}
/* Image blocks */
.image-with-hover-overlay {
display: block;
position: relative;
}
.image-border-radius img {
border-radius: 3px;
}
.image-hover-zoom {
display: block;
overflow: hidden;
}
.image-hover-zoom img {
transition: all 0.20s linear 0s;
-o-transition: all 0.20s linear 0s;
-ms-transition: all 0.20s linear 0s;
-moz-transition: all 0.20s linear 0s;
-webkit-transition: all 0.20s linear 0s;
}
.image-with-hover-overlay img {
width: 100%;
}
.image-hover-zoom:hover img {
transform: scale(1.1);
}
/* Buttons */
.button, a.button, a.button:link, a.button:visited {
background-color: #f7d10a;
background: linear-gradient(to bottom, #fff6c5 0%, #f7d10a 100%);
border: solid 1px #e0c01c !important;
display:inline-block;
text-decoration:none;
text-align:center;
color:#111 !important;
padding:12px 40px;
border-radius:30px;
line-height:1.4em;
transition: all 0.20s linear 0s !important;
-o-transition: all 0.20s linear 0s !important;
-ms-transition: all 0.20s linear 0s !important;
-moz-transition: all 0.20s linear 0s !important;
-webkit-transition: all 0.20s linear 0s !important;
}
a.button.smallbutton {
padding:7px 17px;
}
.button:hover, a.button:hover, a.button:link:hover, a.button:visited:hover {
border:solid 1px #ce1f26 !important;
cursor:pointer !important;
}
.button-grey, a.button-grey, a.button-grey:link, a.button-grey:visited {
background-color: #505050;
background: linear-gradient(to bottom, #909090 0%, #505050 100%);
border: solid 1px #565656 !important;
display:inline-block;
text-decoration:none;
text-align:center;
color:#fff !important;
padding:12px 40px;
border-radius:30px;
line-height:1.4em;
transition: all 0.20s linear 0s !important;
-o-transition: all 0.20s linear 0s !important;
-ms-transition: all 0.20s linear 0s !important;
-moz-transition: all 0.20s linear 0s !important;
-webkit-transition: all 0.20s linear 0s !important;
}
.button-grey:hover, a.button-grey:hover, a.button-grey:link:hover, a.button-grey:visited:hover {
border:solid 1px #000 !important;
cursor:pointer !important;
}
/* remove */
a.remove-item {
font-size: 11px;
color:#505050 !important;
text-decoration:none;
display: inline-block;
margin-right:4px;
}
a.remove-item:before {
content: "\f00d";
font-family: 'FontAwesome';
font-size: 0.8rem;
color:#2196F3;
margin-right: 0.220rem;
transition: all 0.20s linear 0s;
-o-transition: all 0.20s linear 0s;
-ms-transition: all 0.20s linear 0s;
-moz-transition: all 0.20s linear 0s;
-webkit-transition: all 0.20s linear 0s;
}
a.remove-item:hover:before {
margin-right: 0.400rem;
}
a.remove-item:hover {
cursor:pointer;
}
/* change quantity */
a.change {
font-size: 11px;
color:#505050;
text-decoration:none;
display: inline-block;
}
a.change:before {
content: "\f044";
font-family: 'FontAwesome';
font-size: 0.8rem;
color:#2196F3;
margin-right: 0.220rem;
transition: all 0.20s linear 0s;
-o-transition: all 0.20s linear 0s;
-ms-transition: all 0.20s linear 0s;
-moz-transition: all 0.20s linear 0s;
-webkit-transition: all 0.20s linear 0s;
}
a.change:hover:before {
margin-right: 0.400rem;
cursor:pointer;
}
a.change:hover{
cursor:pointer;
}
/* Stroke Buttons */
.button.button-white-stroke, a.button.button-white-stroke, a.button.button-white-stroke:link, a.button.button-white-stroke:visited,
.primary-color-white .button.button-primary-stroke, .primary-color-white a.button.button-primary-stroke, .primary-color-white a.button.button-primary-stroke:link, .primary-color-white a.button.button-primary-stroke:visited {
background: none;
border: 1px solid #fff;
box-shadow: none;
}
.button.button-white-stroke:hover, a.button.button-white-stroke:hover,
.primary-color-white .button.button-primary-stroke:hover, .primary-color-white a.button.button-primary-stroke:hover {
background: #fff none repeat scroll 0 0;
color: #002633;
}
.button.button-yellow-stroke, a.button.button-yellow-stroke, a.button.button-yellow-stroke:link, a.button.button-yellow-stroke:visited,
.primary-color-yellow .button.button-primary-stroke, .primary-color-yellow a.button.button-primary-stroke, .primary-color-yellow a.button.button-primary-stroke:link, .primary-color-yellow a.button.button-primary-stroke:visited {
background: none;
border: 1px solid #F1D529;
box-shadow: none;
color: #F1D529;
}
.button.button-yellow-stroke:hover, a.button.button-yellow-stroke:hover,
.primary-color-yellow .button.button-primary-stroke:hover, .primary-color-yellow a.button.button-primary-stroke:hover {
background: #F1D529 none repeat scroll 0 0;
color: #002633;
}
.button.button-orange-stroke, a.button.button-orange-stroke, a.button.button-orange-stroke:link, a.button.button-orange-stroke:visited,
.primary-color-orange .button.button-primary-stroke, .primary-color-orange a.button.button-primary-stroke, .primary-color-orange a.button.button-primary-stroke:link, .primary-color-orange a.button.button-primary-stroke:visited {
background: none;
border: 1px solid #E4A600;
box-shadow: none;
color: #E4A600;
}
.button.button-orange-stroke:hover, a.button.button-orange-stroke:hover,
.primary-color-orange .button.button-primary-stroke:hover, .primary-color-orange a.button.button-primary-stroke:hover {
background: #E4A600 none repeat scroll 0 0;
color: #fff;
}
.button.button-red-stroke, a.button.button-red-stroke, a.button.button-red-stroke:link, a.button.button-red-stroke:visited,
.primary-color-red .button.button-primary-stroke, .primary-color-red a.button.button-primary-stroke, .primary-color-red a.button.button-primary-stroke:link, .primary-color-red a.button.button-primary-stroke:visited {
background: none;
border: 1px solid #C81010;
box-shadow: none;
color: #C81010;
}
.button.button-red-stroke:hover, a.button.button-red-stroke:hover,
.primary-color-red .button.button-primary-stroke:hover, .primary-color-red a.button.button-primary-stroke:hover {
background: #C81010 none repeat scroll 0 0;
color: #fff;
}
.button.button-pink-stroke, a.button.button-pink-stroke, a.button.button-pink-stroke:link, a.button.button-pink-stroke:visited,
.primary-color-pink .button.button-primary-stroke, .primary-color-pink a.button.button-primary-stroke, .primary-color-pink a.button.button-primary-stroke:link, .primary-color-pink a.button.button-primary-stroke:visited {
background: none;
border: 1px solid #DE1E5E;
box-shadow: none;
color: #DE1E5E;
}
.button.button-pink-stroke:hover, a.button.button-pink-stroke:hover,
.primary-color-pink .button.button-primary-stroke:hover, .primary-color-pink a.button.button-primary-stroke:hover {
background: #DE1E5E none repeat scroll 0 0;
color: #fff;
}
.button.button-blue-stroke, a.button.button-blue-stroke, a.button.button-blue-stroke:link, a.button.button-blue-stroke:visited,
.primary-color-blue .button.button-primary-stroke, .primary-color-blue a.button.button-primary-stroke, .primary-color-blue a.button.button-primary-stroke:link, .primary-color-blue a.button.button-primary-stroke:visited {
background: none;
border: 1px solid #005881;
box-shadow: none;
color: #005881;
}
.button.button-blue-stroke:hover, a.button.button-blue-stroke:hover,
.primary-color-blue .button.button-primary-stroke:hover, .primary-color-blue a.button.button-primary-stroke:hover {
background: #005881 none repeat scroll 0 0;
color: #fff;
}
.button.button-aqua-stroke, a.button.button-aqua-stroke, a.button.button-aqua-stroke:link, a.button.button-aqua-stroke:visited,
.primary-color-aqua .button.button-primary-stroke, .primary-color-aqua a.button.button-primary-stroke, .primary-color-aqua a.button.button-primary-stroke:link, .primary-color-aqua a.button.button-primary-stroke:visited {
background: none;
border: 1px solid #00B5A6;
box-shadow: none;
color: #00B5A6;
}
.button.button-aqua-stroke:hover, a.button.button-aqua-stroke:hover,
.primary-color-aqua .button.button-primary-stroke:hover, .primary-color-aqua a.button.button-primary-stroke:hover {
background: #00B5A6 none repeat scroll 0 0;
color: #fff;
}
.button.button-green-stroke, a.button.button-green-stroke, a.button.button-green-stroke:link, a.button.button-green-stroke:visited,
.primary-color-green .button.button-primary-stroke, .primary-color-green a.button.button-primary-stroke, .primary-color-green a.button.button-primary-stroke:link, .primary-color-green a.button.button-primary-stroke:visited {
background: none;
border: 1px solid #49BF4C;
box-shadow: none;
color: #49BF4C;
}
.button.button-green-stroke:hover, a.button.button-green-stroke:hover,
.primary-color-green .button.button-primary-stroke:hover, .primary-color-green a.button.button-primary-stroke:hover {
background: #49BF4C none repeat scroll 0 0;
color: #fff;
}
.button.button-dark-stroke, a.button.button-dark-stroke, a.button.button-dark-stroke:link, a.button.button-dark-stroke:visited,
.primary-color-dark .button.button-primary-stroke, .primary-color-dark a.button.button-primary-stroke, .primary-color-dark a.button.button-primary-stroke:link, .primary-color-dark a.button.button-primary-stroke:visited {
background: none;
border: 1px solid #002633;
box-shadow: none;
color: #002633;
}
.button.button-dark-stroke:hover, a.button.button-dark-stroke:hover,
.primary-color-dark .button.button-primary-stroke:hover, .primary-color-dark a.button.button-primary-stroke:hover {
background: #002633 none repeat scroll 0 0;
color: #fff;
}
/* Containers */
.float-left {
float: left;
}
.block-bordered {
border: 1px solid rgba(0, 0, 0, 0.1);
}
.alert-messages {
background:#fff;
border-bottom:solid 1px #e5e4e4;
}
.success-messages-admin {
background:#63b954;
}
.error-messages-admin {
background:#cc8080;
}
.success-messages-admin p, .error-messages-admin p {
color:#fff;
}
.alert-messages .error {
color:#d01f25;
}
.text-size-12 {
font-size:14px !important;
}
.padding {
padding: 1.25rem!important;
}
.padding-box {
padding:6px !important;
}
.fixme { z-index:9999; }
.cart-options {
position:absolute; right:10px; bottom:20px;
}
.cart-product {
padding: 3px;
}
.padding-left {
padding-left: 25px !important;
}
.padding-left-7 {
padding-left: 7px !important;
}
.padding-right {
padding-right: 25px !important;
}
.gallery-left {
padding-left: 10px !important;
}
.gallery-right {
padding-right: 25px !important;
}
.padding-bottom-0 {
padding-bottom:0;
}
.padding-2x {
padding: 20px !important;
}
.padding-no {
padding: 0px !important;
}
.full-width:after {
clear:both;
content:".";
display:block;
height:0;
line-height:0;
visibility:hidden;
}
.full-width > .line {
padding: 0 1.875rem;
}
.position-fixed {
position: fixed;
top: 0;
width: 100%;
}
.center {
display: block!important;
}
.border-radius {
border-radius: 3px;
}
.content-center-vertical {
position: absolute;
left: 0;
right: 0;
top: 50%;
transform: translateY(-50%);
-o-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-webkit-transform:translateY(-50%);
}
.content-bottom {
bottom: 0;
position: absolute;
}
.grayscale {
filter: url('data:image/svg+xml;utf8,#g');
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
filter: progid:DXImageTransform.Microsoft.BasicImage(grayScale=1);
}
.image-grayscale {
filter: url('data:image/svg+xml;utf8,#g');
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
filter: progid:DXImageTransform.Microsoft.BasicImage(grayScale=1);
position: relative;
}
*:hover > .image-grayscale {
filter: none;
-webkit-filter: grayscale(0%);
filter: grayscale(0%);
filter: progid:DXImageTransform.Microsoft.BasicImage(grayScale=0);
}
/* Margins */
.margin-top {
margin-top: 1.25rem !important;
}
.margin-left {
margin-left: 1.25rem !important;
}
.margin-right {
margin-right: 1.25rem !important;
}
.margin-top-bottom {
margin-top: 1.25rem !important;
margin-bottom: 1.25rem !important;
}
.margin-left-right {
margin-left: 1.25rem !important;
margin-right: 1.25rem !important;
}
.margin-top-0 {
margin-top: 0 !important;
display: block;
}
.margin-top-10 {
margin-top: 10px !important;
display: block;
}
.margin-top-15 {
margin-top: 15px !important;
display: block;
}
.margin-top-20 {
margin-top: 20px !important;
display: block;
}
.margin-top-30 {
margin-top: 30px !important;
display: block;
}
.margin-top-40 {
margin-top: 40px !important;
display: block;
}
.margin-top-50 {
margin-top: 50px !important;
display: block;
}
.margin-top-60 {
margin-top: 60px !important;
display: block;
}
.margin-top-70 {
margin-top: 70px !important;
display: block;
}
.margin-top-80 {
margin-top: 80px !important;
display: block;
}
.margin-bottom-0 {
margin-bottom: 0 !important;
display: block;
}
.margin-bottom-10 {
margin-bottom: 10px !important;
display: block;
}
.m-bottom-cart-detail {
margin-bottom: 0px;
display: block;
}
.margin-bottom-15 {
margin-bottom: 15px !important;
display: block;
}
.margin-bottom-20 {
margin-bottom: 20px !important;
display: block;
}
.margin-bottom-30 {
margin-bottom: 30px !important;
display: block;
}
.margin-bottom-40 {
margin-bottom: 40px !important;
display: block;
}
.margin-bottom-50 {
margin-bottom: 50px !important;
display: block;
}
.margin-bottom-60 {
margin-bottom: 60px !important;
display: block;
}
.margin-bottom-70 {
margin-bottom: 70px !important;
display: block;
}
.margin-bottom-80 {
margin-bottom: 80px !important;
display: block;
}
.margin-top-bottom-0 {
margin-top: 0 !important;
margin-bottom: 0 !important;
display: block;
}
.margin-top-bottom-10 {
margin-top: 10px !important;
margin-bottom: 10px !important;
display: block;
}
.margin-top-bottom-15 {
margin-top: 15px !important;
margin-bottom: 15px !important;
display: block;
}
.margin-top-bottom-20 {
margin-top: 20px !important;
margin-bottom: 20px !important;
display: block;
}
.margin-top-bottom-30 {
margin-top: 30px !important;
margin-bottom: 30px !important;
display: block;
}
.margin-top-bottom-40 {
margin-top: 40px !important;
margin-bottom: 40px !important;
display: block;
}
.margin-top-bottom-50 {
margin-top: 50px !important;
margin-bottom: 50px !important;
display: block;
}
.margin-top-bottom-60 {
margin-top: 60px !important;
margin-bottom: 60px !important;
display: block;
}
.margin-top-bottom-70 {
margin-top: 70px !important;
margin-bottom: 70px !important;
display: block;
}
.margin-top-bottom-80 {
margin-top: 80px !important;
margin-bottom: 80px !important;
display: block;
}
.padding-top-0 {
padding-top:0px !important;
}
.padding-top {
padding-top:20px !important;
}
.padding-bottom-0 {
padding-bottom:0px !important;
}
.padding-top-0 {
padding-top:0 !important;
}
.margin-left-0 {
margin-left: 0 !important;
}
.margin-left-10 {
margin-left: 10px !important;
}
.margin-left-15 {
margin-left: 15px !important;
}
.margin-left-20 {
margin-left: 20px !important;
}
.margin-left-30 {
margin-left: 30px !important;
}
.margin-left-40 {
margin-left: 40px !important;
}
.margin-left-50 {
margin-left: 50px !important;
}
.margin-left-60 {
margin-left: 60px !important;
}
.margin-left-70 {
margin-left: 70px !important;
}
.margin-left-80 {
margin-left: 80px !important;
}
.margin-right-0 {
margin-right: 0 !important;
}
.margin-right-10 {
margin-right: 10px !important;
}
.margin-right-15 {
margin-right: 15px !important;
}
.margin-right-20 {
margin-right: 20px !important;
}
.margin-right-30 {
margin-right: 30px !important;
}
.margin-right-40 {
margin-right: 40px !important;
}
.margin-right-50 {
margin-right: 50px !important;
}
.margin-right-60 {
margin-right: 60px !important;
}
.margin-right-70 {
margin-right: 70px !important;
}
.margin-right-80 {
margin-right: 80px !important;
}
.margin-left-right-0 {
margin-left: 0 !important;
margin-right: 0 !important;
}
.margin-left-right-10 {
margin-left: 10px !important;
margin-right: 10px !important;
}
.margin-left-right-15 {
margin-left: 15px !important;
margin-right: 15px !important;
}
.margin-left-right-20 {
margin-left: 20px !important;
margin-right: 20px !important;
}
.margin-left-right-30 {
margin-left: 30px !important;
margin-right: 30px !important;
}
.margin-left-right-40 {
margin-left: 40px !important;
margin-right: 40px !important;
}
.margin-left-right-50 {
margin-left: 50px !important;
margin-right: 50px !important;
}
.margin-left-right-60 {
margin-left: 60px !important;
margin-right: 60px !important;
}
.margin-left-right-70 {
margin-left: 70px !important;
margin-right: 70px !important;
}
.margin-left-right-80 {
margin-left: 80px !important;
margin-right: 80px !important;
}
/* More info button */
a.text-more-info {
display: block;
font-size: 0.85rem;
margin-top: 0.625rem;
}
a.text-more-info:after {
content: "\f006";
font-family: mfg;
font-size: 0.8rem;
margin-left: 0.625rem;
transition: all 0.20s linear 0s;
-o-transition: all 0.20s linear 0s;
-ms-transition: all 0.20s linear 0s;
-moz-transition: all 0.20s linear 0s;
-webkit-transition: all 0.20s linear 0s;
}
a.text-more-info:hover:after {
margin-left: 0.825rem;
}
/* Top bar */
.top-bar-contact p {
height: 35px;
line-height: 35px;
}
.top-bar-social li {
border-left: 1px solid rgba(0,0,0, 0.05);
float: left;
height: 35px;
line-height: 35px;
list-style: outside none none;
text-align: center;
width: 35px;
}
.top-bar-social li:last-child {
border-right: 1px solid rgba(0,0,0, 0.05);
}
.top-bar-social i {
color: rgba(170, 170, 170, 0.20);
font-size: 18px;
}
/* Icon blocks */
i.icon-square {
color:#d01f25;
font-size:2.6em;
display: block;
height: 100px;
line-height: 100px;
margin-bottom: 0.625rem;
text-align: center;
width: 100%;
webkit-box-shadow: inset 0 0px 40px #eaeaea;
-moz-box-shadow: inset 0 0px 40px #eaeaea;
box-shadow: inset 0 0px 40px #eaeaea;
}
i.icon-circle {
background:#d01f25;
color:#fff;
font-size:25px;
border-radius: 100px;
display: block;
height: 100px;
line-height: 100px;
margin-bottom: 0.625rem;
text-align: center;
width: 100px;
}
i.icon-circle-small {
border-radius: 60px;
display: block;
font-size: 1.1rem;
height: 60px;
line-height: 60px;
margin-bottom: 0.625rem;
text-align: center;
width: 60px;
}
/* Skill Bars */
.skillbar {
background: #f4f4f4 none repeat scroll 0 0;
border-radius: 3px;
box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.04) inset;
display: block;
height: 36px;
margin-bottom: 1em;
position: relative;
width: 100%;
-webkit-transition:0.4s linear;
-moz-transition:0.4s linear;
-ms-transition:0.4s linear;
-o-transition:0.4s linear;
transition:0.4s linear;
-webkit-transition-property:width, background-green;
-moz-transition-property:width, background-green;
-ms-transition-property:width, background-green;
-o-transition-property:width, background-green;
transition-property:width, background-green;
}
.skillbar i {
margin-right: 10px
}
.skillbar-title {
border-bottom-left-radius: 3px;
border-top-left-radius: 3px;
color: #fff;
font-size: 0.85rem;
left: 15px;
line-height: 36px;
position: absolute;
top: 0;
}
.skillbar-bar {
border-radius: 3px;
height: 36px;
width: 0;
}
/* Pricing Tables */
.pricing-table {
background: rgba(0, 0, 0, 0.1) none repeat scroll 0 0;
border-radius: 0 0 4px 4px;
}
h3.pricing-title {
background: rgba(0, 0, 0, 0.1) none repeat scroll 0 0;
border-radius: 4px 4px 0 0;
font-size: 1.1em;
margin: 0;
padding: 1.25rem 0;
}
.pricing-price {
font-size: 1.7rem;
font-weight: 300;
padding: 0.625rem;
}
.pricing-table li {
list-style: outside none none;
padding: 1.25rem;
}
.pricing-table li span {
font-size: 0.85rem;
}
.pricing-table i {
margin-right: 0.3125rem;
}
/* Products Group by Tabs */
#product-tab-order {
}
#product-tab-order .tile {
-webkit-transform: scale(0);
transform: scale(0);
-webkit-transition: all 350ms ease;
transition: all 350ms ease;
}
#product-tab-order .tile:hover {
}
#product-tab-order .scale-anm {
transform: scale(1);
}
#product-tabs {
padding-left:6px;
padding-bottom:10px;
}
.tabbtn {
cursor: pointer;
display: inline-block;
line-height: normal;
padding: .5rem 1rem;
margin: 0 0 3px 0;
height: auto;
border: 1px solid #ccc;
vertical-align: middle;
-webkit-appearance: none;
color: #555;
background-color: rgba(0, 0, 0, 0);
}
.tabbtn:hover {
background:#f1f1f1;
}
.tabbtn:hover {
text-decoration: none;
}
.tabbtn:focus {
outline:0;
cursor: pointer;
display: inline-block;
line-height: normal;
padding: .5rem 1rem;
margin: 0;
height: auto;
border: 1px solid;
vertical-align: middle;
-webkit-appearance: none;
color: #555;
background-color: #f1f1f1;
}
::-moz-focus-inner {
border: 0;
padding: 0;
}
/* Owl Slider */
.owl-carousel-default-top.owl-theme .owl-nav {
margin-top:-240px;
position:relative;
}
.owl-carousel-default-top.owl-theme .owl-nav .owl-next {
float:right;
border-radius:0;
background:#fff;
padding: 10px 15px;
}
.owl-carousel-default-top.owl-theme .owl-nav .owl-prev {
float:left;
border-radius:0;
background:#fff;
padding: 10px 15px;
}
.owl-carousel-default-top.owl-carousel .owl-item img {
border-right:0;
}
.owl-carousel-banners {
background:url(../img/banners/background.jpg) no-repeat;
background-size:100%;
padding:5px 5px 0 5px;
}
.owl-carousel-banners.single {
padding-bottom:30px;
margin-top: 6px;
}
#sync2 {
padding:12px 0;
}
#sync2 .item img {
height:82px;
border-right:0;
}
#sync2 .item {
border:solid 1px #fff;
height:84px;
}
#sync2 .item:before {
content:T;
margin-top:10px;
}
#sync2 .item:hover, #sync2 .current .item:hover {
cursor:pointer;
border:solid 1px #db1f25;
}
#sync2 .current .item {
border:solid 1px #fff;
}
#sync1 .item img {
webkit-box-shadow: 0 26px 19px -25px rgb(224, 224, 224);
-moz-box-shadow: 0 26px 19px -25px rgba(224, 224, 224);
box-shadow: 0 26px 19px -25px rgb(224, 224, 224);
}
#sync1 .item {
padding-bottom:10px;
}
/* Social */
.text-social, a:link.text-social {
display: block;
font-size: 0.85rem;
font-weight: 700;
padding: 10px 7px;
position: relative;
text-align: center;
top: 0;
transition: all 0.20s linear 0s;
-o-transition: all 0.20s linear 0s;
-ms-transition: all 0.20s linear 0s;
-moz-transition: all 0.20s linear 0s;
-webkit-transition: all 0.20s linear 0s;
}
a:link.text-social:hover {
top: -3px;
}
/* Typed */
.typed-cursor{
display:none;
opacity: 1;
-webkit-animation: blink 0.7s infinite;
-moz-animation: blink 0.7s infinite;
animation: blink 0.7s infinite;
}
@keyframes blink{
0% { opacity:1; }
50% { opacity:0; }
100% { opacity:1; }
}
@-webkit-keyframes blink{
0% { opacity:1; }
50% { opacity:0; }
100% { opacity:1; }
}
@-moz-keyframes blink{
0% { opacity:1; }
50% { opacity:0; }
100% { opacity:1; }
}
/* Portfolio Tabs */
.tab-nav.line {
padding:0 !important;
}
.tab-item {
padding: 0;
}
a.tab-label, a.tab-label:link, a.tab-label:visited,
.background-white a.tab-label, .background-white a.tab-label:link, .background-white a.tab-label:visited, .background-white a.tab-label:hover {
color: rgba(255,255,255, 0.75);
}
a.tab-label, a.tab-label:link, a.tab-label:visited, a.tab-label:hover,
.background-white a.tab-label, .background-white a.tab-label:link, .background-white a.tab-label:visited, .background-white a.tab-label:hover {
color: #fff;
}
.background-white-hightlight a.tab-label.active-btn, .background-white-hightlight a.tab-label:hover,
.primary-color-white .background-primary-hightlight a.tab-label.active-btn, .primary-color-white .background-primary-hightlight a.tab-label:hover {
background: #fff none repeat scroll 0 0;
color: #676767;
}
.background-yellow-hightlight a.tab-label.active-btn, .background-yellow-hightlight a.tab-label:hover,
.primary-color-yellow .background-primary-hightlight a.tab-label.active-btn, .primary-color-yellow .background-primary-hightlight a.tab-label:hover {
background: #F1D529 none repeat scroll 0 0;
color: #676767;
}
.background-orange-hightlight a.tab-label.active-btn, .background-orange-hightlight a.tab-label:hover,
.primary-color-orange .background-primary-hightlight a.tab-label.active-btn, .primary-color-orange .background-primary-hightlight a.tab-label:hover {
background: #E4A600 none repeat scroll 0 0;
color: #fff;
}
.background-red-hightlight a.tab-label.active-btn, .background-red-hightlight a.tab-label:hover,
.primary-color-red .background-primary-hightlight a.tab-label.active-btn, .primary-color-red .background-primary-hightlight a.tab-label:hover {
background: #C81010 none repeat scroll 0 0;
color: #fff;
}
.background-pink-hightlight a.tab-label.active-btn, .background-pink-hightlight a.tab-label:hover,
.primary-color-pink .background-primary-hightlight a.tab-label.active-btn, .primary-color-pink .background-primary-hightlight a.tab-label:hover {
background: #DE1E5E none repeat scroll 0 0;
color: #fff;
}
.background-blue-hightlight a.tab-label.active-btn, .background-blue-hightlight a.tab-label:hover,
.primary-color-blue .background-primary-hightlight a.tab-label.active-btn, .primary-color-blue .background-primary-hightlight a.tab-label:hover {
background: #005881 none repeat scroll 0 0;
color: #fff;
}
.background-aqua-hightlight a.tab-label.active-btn, .background-aqua-hightlight a.tab-label:hover,
.primary-color-aqua .background-primary-hightlight a.tab-label.active-btn, .primary-color-aqua .background-primary-hightlight a.tab-label:hover {
background: #00B5A6 none repeat scroll 0 0;
color: #fff;
}
.background-green-hightlight a.tab-label.active-btn, .background-green-hightlight a.tab-label:hover,
.primary-color-green .background-primary-hightlight a.tab-label.active-btn, .primary-color-green .background-primary-hightlight a.tab-label:hover {
background: #49BF4C none repeat scroll 0 0;
color: #fff;
}
.background-dark-hightlight a.tab-label.active-btn, .background-dark-hightlight a.tab-label:hover,
.primary-color-dark .background-primary-hightlight a.tab-label.active-btn, .primary-color-dark .background-primary-hightlight a.tab-label:hover {
background: #002633 none repeat scroll 0 0;
color: #fff;
}
p.form-success {
background-color: #9bdd42;
color: #fff;
display: none;
font-size: 0.85rem;
padding: 10px;
text-align: center;
}
.required {
border-left: 1px solid #dd442c !important;
}
/* -1120px version */
@media screen and (max-width:1120px) {
.size-1140 .line.content-center-vertical {
padding: 0 2rem;
}
}
/* -1000px version */
@media screen and (max-width:1000px) {
.vasplus_pb_Additems { width:92%; }
.margin-bottom-10 {
margin-bottom: 0 !important;
}
a.searchlink {
float: right;
margin-right: 80px;
margin-top: 16px;
color: #fff;
border-radius:7px;
background: #666;
padding: 4px 8px 4px 8px;
}
a.searchlink:hover {
text-decoration:none;
}
a.searchlink i {
padding-right:0px;
}
.action-list {
min-height: 20px !important;
}
.top-nav .right {
float: none;
}
.logo {
max-width: 250px;
margin: 0 auto;
}
.nav-text {
color: #fff;
display: block;
font-size: 1.2rem;
line-height: 3rem;
margin-right: 0.625rem;
max-width: 100%;
text-align: center;
vertical-align: middle;
}
.nav-text::after {
color: #002633;
display: inline-block;
font-size: 3rem;
margin-left: 0;
margin-top: 30px;
}
.top-nav li a, .background-white .top-nav li a {
background: #002633 none repeat scroll 0 0;
color: #fff;
font-size: 1.1em;
padding: 1em;
text-align: center;
}
aside {
border: none;
padding: 0;
}
aside.aside-left {
border-right: 0;
padding-right: 0;
}
.carousel-main .owl-item img, .carousel-main .owl-item video {
max-width: 250%;
width:auto;
}
.margin-m-top {
margin-top: 1.25rem !important;
display: block;
}
.margin-m-bottom {
margin-bottom: 1.25rem !important;
display: block;
}
.margin-m-left {
margin-left: 1.25rem !important;
}
.margin-m-right {
margin-right: 1.25rem !important;
}
.margin-m-top-bottom {
margin-top: 1.25rem !important;
margin-bottom: 1.25rem !important;
display: block;
}
.margin-m-left-right {
margin-left: 1.25rem !important;
margin-right: 1.25rem !important;
}
.margin-m-top-0 {
margin-top: 0 !important;
display: block;
}
.margin-m-top-10 {
margin-top: 10px !important;
display: block;
}
.margin-m-top-15 {
margin-top: 15px !important;
display: block;
}
.margin-m-top-20 {
margin-top: 20px !important;
display: block;
}
.margin-m-top-30 {
margin-top: 30px !important;
display: block;
}
.margin-m-top-40 {
margin-top: 40px !important;
display: block;
}
.margin-m-top-50 {
margin-top: 50px !important;
display: block;
}
.margin-m-top-60 {
margin-top: 60px !important;
display: block;
}
.margin-m-top-70 {
margin-top: 70px !important;
display: block;
}
.margin-m-top-80 {
margin-top: 80px !important;
display: block;
}
.margin-m-bottom-0 {
margin-bottom: 0 !important;
display: block;
}
.margin-m-bottom-10 {
margin-bottom: 10px !important;
display: block;
}
.margin-m-bottom-15 {
margin-bottom: 15px !important;
display: block;
}
.margin-m-bottom-20 {
margin-bottom: 20px !important;
display: block;
}
.margin-m-bottom-30 {
margin-bottom: 30px !important;
display: block;
}
.margin-m-bottom-40 {
margin-bottom: 40px !important;
display: block;
}
.margin-m-bottom-50 {
margin-bottom: 50px !important;
display: block;
}
.margin-m-bottom-60 {
margin-bottom: 60px !important;
display: block;
}
.margin-m-bottom-70 {
margin-bottom: 70px !important;
display: block;
}
.margin-m-bottom-80 {
margin-bottom: 80px !important;
display: block;
}
.margin-m-top-bottom-0 {
margin-top: 0 !important;
margin-bottom: 0 !important;
display: block;
}
.margin-m-top-bottom-10 {
margin-top: 10px !important;
margin-bottom: 10px !important;
display: block;
}
.margin-m-top-bottom-15 {
margin-top: 15px !important;
margin-bottom: 15px !important;
display: block;
}
.margin-m-top-bottom-20 {
margin-top: 20px !important;
margin-bottom: 20px !important;
display: block;
}
.margin-m-top-bottom-30 {
margin-top: 30px !important;
margin-bottom: 30px !important;
display: block;
}
.margin-m-top-bottom-40 {
margin-top: 40px !important;
margin-bottom: 40px !important;
display: block;
}
.margin-m-top-bottom-50 {
margin-top: 50px !important;
margin-bottom: 50px !important;
display: block;
}
.margin-m-top-bottom-60 {
margin-top: 60px !important;
margin-bottom: 60px !important;
display: block;
}
.margin-m-top-bottom-70 {
margin-top: 70px !important;
margin-bottom: 70px !important;
display: block;
}
.margin-m-top-bottom-80 {
margin-top: 80px !important;
margin-bottom: 80px !important;
display: block;
}
.margin-m-left-0 {
margin-left: 0 !important;
}
.margin-m-left-10 {
margin-left: 10px !important;
}
.margin-m-left-15 {
margin-left: 15px !important;
}
.margin-m-left-20 {
margin-left: 20px !important;
}
.margin-m-left-30 {
margin-left: 30px !important;
}
.margin-m-left-40 {
margin-left: 40px !important;
}
.margin-m-left-50 {
margin-left: 50px !important;
}
.margin-m-left-60 {
margin-left: 60px !important;
}
.margin-m-left-70 {
margin-left: 70px !important;
}
.margin-m-left-80 {
margin-left: 80px !important;
}
.margin-m-right-0 {
margin-right: 0 !important;
}
.margin-m-right-10 {
margin-right: 10px !important;
}
.margin-m-right-15 {
margin-right: 15px !important;
}
.margin-m-right-20 {
margin-right: 20px !important;
}
.margin-m-right-30 {
margin-right: 30px !important;
}
.margin-m-right-40 {
margin-right: 40px !important;
}
.margin-m-right-50 {
margin-right: 50px !important;
}
.margin-m-right-60 {
margin-right: 60px !important;
}
.margin-m-right-70 {
margin-right: 70px !important;
}
.margin-m-right-80 {
margin-right: 80px !important;
}
.margin-m-left-right-0 {
margin-left: 0 !important;
margin-right: 0 !important;
}
.margin-m-left-right-10 {
margin-left: 10px !important;
margin-right: 10px !important;
}
.margin-m-left-right-15 {
margin-left: 15px !important;
margin-right: 15px !important;
}
.margin-m-left-right-20 {
margin-left: 20px !important;
margin-right: 20px !important;
}
.margin-m-left-right-30 {
margin-left: 30px !important;
margin-right: 30px !important;
}
.margin-m-left-right-40 {
margin-left: 40px !important;
margin-right: 40px !important;
}
.margin-m-left-right-50 {
margin-left: 50px !important;
margin-right: 50px !important;
}
.margin-m-left-right-60 {
margin-left: 60px !important;
margin-right: 60px !important;
}
.margin-m-left-right-70 {
margin-left: 70px !important;
margin-right: 70px !important;
}
.margin-m-left-right-80 {
margin-left: 80px !important;
margin-right: 80px !important;
}
.text-m-size-12 {
font-size: 12px !important;
line-height: 1.4;
}
.text-m-size-16 {
font-size: 16px !important;
line-height: 1.4;
}
.text-m-size-20 {
font-size: 20px !important;
line-height: 1.4;
}
.text-m-size-25 {
font-size: 25px !important;
line-height: 1.4;
}
.text-m-size-30 {
font-size: 30px !important;
line-height: 1.4;
}
.text-m-size-40 {
font-size: 40px !important;
line-height: 1.4;
}
.text-m-size-50 {
font-size: 50px !important;
line-height: 1.4;
}
.text-m-size-60 {
font-size: 60px !important;
line-height: 1.4;
}
.text-m-size-70 {
font-size: 70px !important;
line-height: 1.4;
}
}
.contact-right {
padding:18px;
background:#f5f5f5;
}
.reach-us-heading {
margin-bottom:10px; text-align:center; color:#ccc;
}
.our-network-heading {
color:#ccc; margin-bottom:10px;
}
.contact-top-box {
text-align:center; padding:0px 10px 40px 10px;
}
.contact-top-box a.reach-way {
background:#fbf1c3; padding:21px; font-family:'Roboto-Bold'; font-size:24px; border:solid 1px #efe1a0; color:#333; display:block;
}
.contact-top-box a.reach-way:hover, .contact-top-box a.reach-way:focus, .contact-top-box a.reach-way:active {
text-decoration:none; background:#fffae0;
}
.contact-top-box a.reach-way i {
color:#cf1f22; font-size:27px;
}
.contact-top-box a.reach-way span {
font-size:17px; color:#d0c17e; padding-top:5px; display:block;
}
/* -480px version */
@media screen and (max-width:480px) {
.reach-us-heading {
margin-bottom:4px;
}
.our-network-heading {
text-align:center;
margin-top:20px;
}
.contact-top-box {
padding:5px;
}
.contact-top-box a.reach-way {
padding:6px; font-size:12px;
}
.contact-top-box a.reach-way i {
font-size:14px;
}
.contact-top-box a.reach-way span {
font-size:12px; padding-top:0px;
}
.top-bar .right {
float: none;
}
.top-bar-contact p {
height: auto;
line-height: 1.3rem;
padding: 10px 0;
text-align: center;
}
.top-bar-social.right {
display: table;
float: none;
margin: 0 auto;
padding: 0;
text-align: center;
}
.margin-s-top {
margin-top: 1.25rem !important;
display: block;
}
.margin-s-bottom {
margin-bottom: 1.25rem !important;
display: block;
}
.margin-s-left {
margin-left: 1.25rem !important;
}
.margin-s-right {
margin-right: 1.25rem !important;
}
.margin-s-top-bottom {
margin-top: 1.25rem !important;
margin-bottom: 1.25rem !important;
display: block;
}
.margin-s-left-right {
margin-left: 1.25rem !important;
margin-right: 1.25rem !important;
}
.margin-s-top-0 {
margin-top: 0 !important;
display: block;
}
.margin-s-top-10 {
margin-top: 10px !important;
display: block;
}
.margin-s-top-15 {
margin-top: 15px !important;
display: block;
}
.margin-s-top-20 {
margin-top: 20px !important;
display: block;
}
.margin-s-top-30 {
margin-top: 30px !important;
display: block;
}
.margin-s-top-40 {
margin-top: 40px !important;
display: block;
}
.margin-s-top-50 {
margin-top: 50px !important;
display: block;
}
.margin-s-top-60 {
margin-top: 60px !important;
display: block;
}
.margin-s-top-70 {
margin-top: 70px !important;
display: block;
}
.margin-s-top-80 {
margin-top: 80px !important;
display: block;
}
.margin-s-bottom-0 {
margin-bottom: 0 !important;
display: block;
}
.margin-s-bottom-10 {
margin-bottom: 10px !important;
display: block;
}
.margin-s-bottom-15 {
margin-bottom: 15px !important;
display: block;
}
.margin-s-bottom-20 {
margin-bottom: 20px !important;
display: block;
}
.margin-s-bottom-30 {
margin-bottom: 30px !important;
display: block;
}
.margin-s-bottom-40 {
margin-bottom: 40px !important;
display: block;
}
.margin-s-bottom-50 {
margin-bottom: 50px !important;
display: block;
}
.margin-s-bottom-60 {
margin-bottom: 60px !important;
display: block;
}
.margin-s-bottom-70 {
margin-bottom: 70px !important;
display: block;
}
.margin-s-bottom-80 {
margin-bottom: 80px !important;
display: block;
}
.margin-s-top-bottom-0 {
margin-top: 0 !important;
margin-bottom: 0 !important;
display: block;
}
.margin-s-top-bottom-10 {
margin-top: 10px !important;
margin-bottom: 10px !important;
display: block;
}
.margin-s-top-bottom-15 {
margin-top: 15px !important;
margin-bottom: 15px !important;
display: block;
}
.margin-s-top-bottom-20 {
margin-top: 20px !important;
margin-bottom: 20px !important;
display: block;
}
.margin-s-top-bottom-30 {
margin-top: 30px !important;
margin-bottom: 30px !important;
display: block;
}
.margin-s-top-bottom-40 {
margin-top: 40px !important;
margin-bottom: 40px !important;
display: block;
}
.margin-s-top-bottom-50 {
margin-top: 50px !important;
margin-bottom: 50px !important;
display: block;
}
.margin-s-top-bottom-60 {
margin-top: 60px !important;
margin-bottom: 60px !important;
display: block;
}
.margin-s-top-bottom-70 {
margin-top: 70px !important;
margin-bottom: 70px !important;
display: block;
}
.margin-s-top-bottom-80 {
margin-top: 80px !important;
margin-bottom: 80px !important;
display: block;
}
.margin-s-left-0 {
margin-left: 0 !important;
}
.margin-s-left-10 {
margin-left: 10px !important;
}
.margin-s-left-15 {
margin-left: 15px !important;
}
.margin-s-left-20 {
margin-left: 20px !important;
}
.margin-s-left-30 {
margin-left: 30px !important;
}
.margin-s-left-40 {
margin-left: 40px !important;
}
.margin-s-left-50 {
margin-left: 50px !important;
}
.margin-s-left-60 {
margin-left: 60px !important;
}
.margin-s-left-70 {
margin-left: 70px !important;
}
.margin-s--80 {
margin-left: 80px !important;
}
.margin-s-right-0 {
margin-right: 0 !important;
}
.margin-s-right-10 {
margin-right: 10px !important;
}
.margin-s-right-15 {
margin-right: 15px !important;
}
.margin-s-right-20 {
margin-right: 20px !important;
}
.margin-s-right-30 {
margin-right: 30px !important;
}
.margin-s-right-40 {
margin-right: 40px !important;
}
.margin-s-right-50 {
margin-right: 50px !important;
}
.margin-s-right-60 {
margin-right: 60px !important;
}
.margin-s-right-70 {
margin-right: 70px !important;
}
.margin-s-right-80 {
margin-right: 80px !important;
}
.margin-s-left-right-0 {
margin-left: 0 !important;
margin-right: 0 !important;
}
.margin-s-left-right-10 {
margin-left: 10px !important;
margin-right: 10px !important;
}
.margin-s-left-right-15 {
margin-left: 15px !important;
margin-right: 15px !important;
}
.margin-s-left-right-20 {
margin-left: 20px !important;
margin-right: 20px !important;
}
.margin-s-left-right-30 {
margin-left: 30px !important;
margin-right: 30px !important;
}
.margin-s-left-right-40 {
margin-left: 40px !important;
margin-right: 40px !important;
}
.margin-s-left-right-50 {
margin-left: 50px !important;
margin-right: 50px !important;
}
.margin-s-left-right-60 {
margin-left: 60px !important;
margin-right: 60px !important;
}
.margin-s-left-right-70 {
margin-left: 70px !important;
margin-right: 70px !important;
}
.margin-s-left-right-80 {
margin-left: 80px !important;
margin-right: 80px !important;
}
.text-s-size-12 {
font-size: 12px !important;
line-height: 1.4;
}
.text-s-size-16 {
font-size: 16px !important;
line-height: 1.4;
}
.text-s-size-20 {
font-size: 20px !important;
line-height: 1.4;
}
.text-s-size-25 {
font-size: 25px !important;
line-height: 1.4;
}
.text-s-size-30 {
font-size: 30px !important;
line-height: 1.4;
}
.text-s-size-40 {
font-size: 40px !important;
line-height: 1.4;
}
.text-s-size-50 {
font-size: 50px !important;
line-height: 1.4;
}
.text-s-size-60 {
font-size: 60px !important;
line-height: 1.4;
}
.text-s-size-70 {
font-size: 70px !important;
line-height: 1.4;
}
}
/* Typography */
.text-uppercase {
text-transform: uppercase;
line-height: 1;
}
.text-line-height-1 {
line-height: 1;
}
/* Containers */
.text-padding {
display: inline-block !important;
padding: 15px 20px;
}
.text-padding-small {
display: inline-block !important;
padding: 7px 10px;
}
/*----- Accordion -----*/
.accordion, .accordion * {
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
box-sizing:border-box;
}
.accordion {
background:#fff;
}
.accordion a {
color:#e36a42;
}
.accordion a:hover {
text-decoration:underline;
}
.accordion-section-title {
color:#111 !important;
padding:2px 5px;
border-radius: 4px;
border:solid 1px #505050;
}
.accordion-section-title.active, .accordion-section-title:hover {
background:#eee;
text-decoration:none !important;
}
.accordion-section-content {
padding-top:15px;
display:none;
}
.accordion-section-content.no-padding {
padding-top:0;
}
.accordion-section-content p.price {
font-size:11px; line-height:14px; padding:7px 5px 5px 5px; border-bottom:solid 1px #ccc;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.accordion-section-content p.price:hover {
background:#eee;
}
/* Custom Template Styles */
/* Fade Out Overlay */
@keyframes fadeInOut {
0% {
opacity: 1;
visibility: visible;
}
100% {
opacity: 0;
visibility: hidden;
}
}
blockquote {
background: #f5f5f5 none repeat scroll 0 0;
padding: 40px;
}
blockquote:before {
display:none;
}
.top-bar {
padding: 0 2rem;
}
.top-bar-social li {
border-left: 0 solid;
}
nav {
padding: 0 2rem;
position: relative;
z-index: 2;
}
.logo-dark {
display:none;
}
nav.fixed, .fixed nav {
background: #fff;
border-bottom: 1px solid rgba(0, 0, 0, 0.09);
padding: 0 2em;
}
nav.fixed .top-nav li a, .fixed nav .top-nav li a {
color: #444;
}
nav.fixed .logo-white, .fixed nav .logo-white {
display:none;
}
nav.fixed .logo-dark, .fixed nav .logo-dark {
display:block;
}
.background-transparent {
background: none;
}
.logo img {
margin: 0;
max-width: 200px;
position: relative;
top: 12px;
width: 100%;
}
.top-nav li a {
color: #fff;
padding: 1.5rem;
opacity: 0.7;
transition: all 0.20s linear 0s;
-o-transition: all 0.20s linear 0s;
-ms-transition: all 0.20s linear 0s;
-moz-transition: all 0.20s linear 0s;
-webkit-transition: all 0.20s linear 0s;
}
.top-nav ul ul {
background: #fff none repeat scroll 0 0;
}
.top-nav li ul li {
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.top-nav li ul li:last-child {
border-bottom: 0;
}
.top-nav li ul li a, .background-white .top-nav li ul li a, .top-nav .active-item li a {
background: #fff none repeat scroll 0 0;
color: rgba(0,0,0, 0.75);
}
/* Aside Navigation */
.aside-nav > ul > li > a:hover, .aside-nav > ul > li.active-item > a:link, .aside-nav > ul > li.active-item > a:visited {
border-width: 0 0 0 1px;
left: -1px;
padding-left: 20px;
position: relative;
}
/* Carousel Navigation*/
.owl-carousel-default.owl-theme .owl-dots {
margin-top: 7px !important;
}
.owl-theme .owl-dots .owl-dot span {
border-radius: 4px !important;
}
.owl-theme .owl-controls .owl-page span {
height: 10px;
margin: 0 1px;
width: 10px;
-ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.owl-theme .owl-controls .owl-buttons div {
border: 0 none;
color: #d72126 !important;
font-family: FontAwesome;
font-size: 30px;
height: auto;
line-height: 0;
width: auto;
}
.carousel-nav-white.owl-theme .owl-controls .owl-buttons div {
border: 0;
}
/* Pricing Tables */
.pricing-table {
background: none;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1);
border-image: none;
border-radius: 0;
border-style: none solid solid;
border-width: 0 1px 1px;
}
h3.pricing-title {
background: none;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1);
border-image: none;
border-radius: 0;
border-style: solid solid none;
border-width: 1px 1px 0;
font-size: 2rem;
margin: 0;
padding: 1rem 0;
}
.pricing-price {
font-size: 2rem;
font-weight: normal;
padding: 0.3125rem;
}
/* Buttons */
.button, a.button, a.button:link, a.button:visited {
border: 0;
}
a.greybtn {
color: #333 !important;
border: 1px solid #979797;
background-color: white;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fff), color-stop(100%, #dcdcdc));
background: -webkit-linear-gradient(top, #fff 0%, #dcdcdc 100%);
background: -moz-linear-gradient(top, #fff 0%, #dcdcdc 100%);
background: -ms-linear-gradient(top, #fff 0%, #dcdcdc 100%);
background: -o-linear-gradient(top, #fff 0%, #dcdcdc 100%);
background: linear-gradient(to bottom, #fff 0%, #dcdcdc 100%);
padding: 6px 10px;
border-radius: 4px;
}
a.greybtn:hover {
background:#fff;
text-decoration:none;
cursor:pointer;
}
/* Image blocks */
.image-hover-zoom img {
transition: all 0.50s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
-o-transition: all 0.50s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
-ms-transition: all 0.50s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
-moz-transition: all 0.50s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
-webkit-transition: all 0.50s cubic-bezier(0.645, 0.045, 0.355, 1) 0s;
}
.owl-item .image-testimonial-small {
margin: 0 auto 20px;
width: auto;
}
video {
width: 100%;
}
/* Skill Bars */
.skillbar {
background: rgba(129, 129, 129, 0.1) none repeat scroll 0 0;
border-radius: 0;
box-shadow: none;
display: block;
height: 10px;
margin-bottom: 1rem;
position: relative;
width: 100%;
}
.skillbar i {
margin-right: 10px
}
.skillbar-title {
border-bottom-left-radius: 0px;
border-top-left-radius: 0px;
color: #fff;
font-size: 0.85rem;
left: 15px;
line-height: 10px;
position: absolute;
top: 0;
}
.skillbar-bar {
border-radius: 0px;
height: 10px;
width: 0;
}
/* Animated content */
.animated {
position: relative;
top: 100px;
opacity: 0;
animation-duration: 1s;
}
.slow {
animation-duration: 2s;
}
.animation {
top: 0;
opacity: 1;
animation-name: bounceIn;
}
@keyframes bounceIn {
0% {
top: 100px;
opacity: 0;
}
60% {
top: -10px;
}
100% {
top: 0;
opacity: 1;
}
}
header .header-inner {
color: #b1b1b1;
text-align: right;
padding: 7px 85px 0px 0px;
display:inline-block;
float:right;
}
header .header-inner span {
padding-right: 13px;
}
header .header-inner span a {
color: #b1b1b1;
}
header .header-inner span a:hover {
color: #fff;
}
@media screen and (max-width:1000px) {
h3.heading-cat {
font-size:17px;
}
a img:active, img.actimage:active {
opacity:0.7 !important;
}
a.actlink:active {
color:#999 !important;
}
ul.custom-ul li a:active {
color:#999 !important;
}
#cd-lateral-nav a:active {
background:#d22c30 !important;
}
.noselect {
-webkit-touch-callout: none; /* iOS Safari */
-webkit-user-select: none; /* Safari */
-khtml-user-select: none; /* Konqueror HTML */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* Internet Explorer/Edge */
user-select: none; /* Non-prefixed version, currently
supported by Chrome and Opera */
}
header.position-absolute {
background: #fff none repeat scroll 0 0;
position: relative;
}
.logo img {
margin: 0 auto;
max-width: 300px;
}
.logo img.logo-white {
display:none;
}
.logo img.logo-dark {
display:block;
}
.nav-text::after {
color: #002633;
}
.fixed {
position: relative;
z-index: 10;
}
.fixed .nav-text::after {
color: #002633;
}
.top-nav li a,.top-nav li ul li a {
border-top: 1px solid #f5f5f5;
color: #777;
opacity: 1;
}
.top-nav li a, .background-white .top-nav li a {
background: #fff none repeat scroll 0 0;
font-size: 1.5em;
padding: 1.2em 1em;
}
.top-nav li ul li a {
background: #f5f5f5!important;
font-size: 1.5em;
padding: 1.2em 1em;
}
nav.fixed .top-nav li a, .fixed nav .top-nav li a {
color: #777;
}
.carousel-3-blocks {
padding: 0;
}
}
.pbox {
width:100%;
border:solid 5px #f1f1f1 ;
background: #fff url(../img/shade.png) repeat-x center bottom;
}
.pbox:hover {
background:#fafafa;
}
.pbox .home {
padding:10px 10px 10px 10px;
height:200px;
}
.pbox .home p {
margin-bottom:20px;
}
.pbox a.title-home {
font-family: 'MerriweatherBold' !important;
font-size: 1.2em;
display:inline-block;
margin-bottom:8px;
}
.pbox a.title {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
span.ordering {
background: #db1f25;
color: #fff;
padding: 2px 6px;
margin-right: 4px;
}
.pbox-hover a.bundle {
display:block;
width:100%;
text-align:center;
color:#505050 !important;
padding:8px 5px;
line-height:1.4em;
font-size:14px;
}
.pbox-hover a.bundle hr {
border:0;
height:1px;
background:#eee;
margin:2px 0;
}
.pbox-hover a.bundle span.bg1 {
float:left;
width:100%;
padding:5px;
border-bottom:solid 1px #eee;
}
.pbox-hover a.bundle span.bg2 {
float:left;
width:100%;
padding:5px;
border-bottom:solid 1px #eee;
}
.pbox-hover a.bundle span.bg2:last-child {
border-bottom:0;
}
.pbox-hover a.bundle span.span1 {
float:left;
color:#db1f25;
font-size:12px;
}
.pbox-hover a.bundle span.span2 {
float:right;
color:#dcba18;
font-size:12px;
}
.pbox-hover a.bundle span.name {
color:#505050;
padding-bottom:8px;
font-family:'MerriweatherBold';
display:block;
}
.pbox-hover a.bundle span.bno {
color:#ababab;
}
.pbox-hover {
width:100%;
line-height:20px;
border:solid 1px #eee;
height:225px;
overflow:hidden;
}
.pbox-hover:hover {
background:#f9f9f9;
}
.pbox-hover.bundleis {
position:relative;
height:auto;
-webkit-box-shadow: 0px 0px 6px -1px rgba(191, 191, 191, 0.75);
-moz-box-shadow: 0px 0px 6px -1px rgba(191, 191, 191, 0.75);
box-shadow: 0px 0px 6px -1px rgba(191, 191, 191, 0.75);
border: solid 1px #dcdcdc;
}
.pbox-hover .pro-image {
width:100%; height:140px; object-fit: contain;
}
.pbox-hover .bordered {
border:solid 1px #eee;
padding:0 8px;
background:#fff;
}
.pbox-hover p {
line-height:1.6;
}
.pbox-hover a.title {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.pbox-hover a.new-title {
display: block;
text-align: center;
width:90%;
padding-top:10px;
}
/* product box for mobile view */
.pbox-mobile {
width:100%;
overflow:hidden;
margin-bottom:0px;
background:#fff url(../images/icon-bg.png) no-repeat;
webkit-box-shadow: inset 0 0px 40px #eef1e1;
-moz-box-shadow: inset 0 0px 40px #eef1e1;
box-shadow: inset 0 0px 40px #eef1e1;
border:solid 1px #eef1e1;
border-top:0;
}
.pbox-mobile.first { }
.pbox-mobile.last { margin-bottom:45px; }
.pbox-mobile a {
display:block;
width:100%;
text-align:left;
padding:13px;
padding-right:10px;
padding-left:60px;
color:#505050;
}
.pbox-mobile a:hover {
text-decoration:none !important;
}
.pbox-mobile a:focus {
-webkit-transition-duration:0s !important; transition-duration:0s !important; background-color:#f9f9f9 !important;
}
.pbox-mobile i {
float:right;
margin-top:5px;
color:#505050;
font-size:12px;
}
.pbox-mobile a.aluminium {
background:url(../img/icons/1.png) no-repeat 5px;
}
.pbox-mobile a.aluminium-sheets {
background:url(../img/icons/2.png) no-repeat 3px;
}
.pbox-mobile a.solid-wood {
background:url(../img/icons/3.png) no-repeat 3px;
}
.pbox-mobile a.melamine {
background:url(../img/icons/4.png) no-repeat 3px;
}
.pbox-mobile a.laminated {
background:url(../img/icons/5.png) no-repeat 3px;
}
.pbox-mobile a.plain-mdf {
background:url(../img/icons/6.png) no-repeat 3px;
}
.pbox-mobile a.paper-overlay-mdf {
background:url(../img/icons/7.png) no-repeat 3px;
}
.pbox-mobile a.veneered-mdf {
background:url(../img/icons/8.png) no-repeat 3px;
}
.pbox-mobile a.edging {
background:url(../img/icons/9.png) no-repeat 3px;
}
.pbox-mobile a.doors {
background:url(../img/icons/10.png) no-repeat 3px;
}
.pbox-mobile a.gypsum {
background:url(../img/icons/11.png) no-repeat 3px;
}
.pbox-mobile a.flooring {
background:url(../img/icons/12.png) no-repeat 3px;
}
.pbox-mobile a.door-core {
background:url(../img/icons/13.png) no-repeat 3px;
}
.pbox-mobile a.belgium-glass {
background:url(../img/icons/14.png) no-repeat 3px;
}
.pbox-mobile a.china-reflected {
background:url(../img/icons/15.png) no-repeat 3px;
}
.pbox-mobile a.mirror-glass {
background:url(../img/icons/16.png) no-repeat 3px;
}
.pbox-mobile a.hd-glass {
background:url(../img/icons/17.png) no-repeat 3px;
}
.pbox-mobile a.georgian-glass {
background:url(../img/icons/18.png) no-repeat 3px;
}
.pbox-mobile a.clear-glass {
background:url(../img/icons/19.png) no-repeat 3px;
}
.pbox-mobile a.ramly-glass {
background:url(../img/icons/20.png) no-repeat 3px;
}
.pbox-mobile a.tinted-glass {
background:url(../img/icons/21.png) no-repeat 3px;
}
.pbox-mobile a.crystal-glass {
background:url(../img/icons/22.png) no-repeat 3px;
}
.pbox-mobile a.designed-glass {
background:url(../img/icons/23.png) no-repeat 3px;
}
.pbox-mobile a.aluminium-accessories {
background:url(../img/icons/24.png) no-repeat 3px;
}
.pbox-mobile a.wood-accessories {
background:url(../img/icons/25.png) no-repeat 3px;
}
.pbox-mobile a.glass-accessories {
background:url(../img/icons/26.png) no-repeat 3px;
}
.pbox-mobile a.nails {
background:url(../img/icons/27.png) no-repeat 3px;
}
.pbox-mobile a.locks {
background:url(../img/icons/28.png) no-repeat 3px;
}
.pbox-mobile a.brushes {
background:url(../img/icons/29.png) no-repeat 3px;
}
.pbox-mobile a.hpl-sheets {
background:url(../img/icons/30.png) no-repeat 3px;
}
.pbox-mobile a.drawers {
background:url(../img/icons/31.png) no-repeat 3px;
}
.pbox-mobile a.baskets {
background:url(../img/icons/32.png) no-repeat 3px;
}
.pbox-mobile a.teka-appliances {
background:url(../img/icons/33.png) no-repeat 3px;
}
.pbox-mobile a.sinks {
background:url(../img/icons/34.png) no-repeat 3px;
}
.pbox-mobile a.conners {
background:url(../img/icons/35.png) no-repeat 3px;
}
.pbox-mobile a.kraft {
background:url(../img/icons/36.png) no-repeat 3px;
}
.pbox-mobile a.makita {
background:url(../img/icons/37.png) no-repeat 3px;
}
.pbox-mobile a.hand-tools {
background:url(../img/icons/38.png) no-repeat 3px;
}
.pbox-mobile a.super-matt {
background:url(../img/icons/39.png) no-repeat 5px;
}
.pbox-mobile a.wallpanels {
background:url(../img/icons/40.png) no-repeat 3px;
}
.pbox-mobile a.wpc-decking {
background:url(../img/icons/41.png) no-repeat 3px;
}
.pbox-mobile a.shower-cabins {
background:url(../img/icons/42.png) no-repeat 3px;
}
/* product box for new design */
.pbox-cat-home {
width:100%;
overflow:hidden;
background: #fff;
position:relative;
}
.pbox-cat-home span.text { color:#222; padding:8px 12px; font-size:16px; display:block; text-align:center; width:95%; height:60px; }
.pbox-cat-home span.text a { color:#222; line-height: 25px; background:#fff; font-size:17px; padding:0px 14px 5px 14px; border-top-left-radius:4px; border-top-right-radius:4px; }
.pbox-cat-home span.text a:hover { text-decoration:underline; }
.pbox-cat-home:hover { background:#fff; }
.pbox-cat-home .pro-image { width:95%; object-fit: contain; }
.pbox-cat-home .pro-image-main-cat { width:250px; object-fit: contain; }
.pbox-cat-home a.new-title { display: block; text-align:center; width:100%; font-size:14px; line-height:17px; padding:8px 6px 6px 6px; color:#222; }
.pbox-products {
width:100%;
height:210px;
overflow:hidden;
background: #fff;
-webkit-box-shadow: inset 0 0px 40px #eef1e1;
-moz-box-shadow: inset 0 0px 40px #eef1e1;
box-shadow: inset 0 0px 40px #eef1e1;
border:solid 1px #eef1e1;
}
.pbox-offers {
width:100%;
overflow:hidden;
background: #fff;
border:solid 1px #fff;
transition: all 0.20s linear 0s;
-o-transition: all 0.20s linear 0s;
-ms-transition: all 0.20s linear 0s;
-moz-transition: all 0.20s linear 0s;
-webkit-transition: all 0.20s linear 0s;
margin-bottom:0;
-webkit-box-shadow: 0px 0px 6px -1px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 6px -1px rgba(0,0,0,0.75);
box-shadow: 0px 0px 6px -1px rgba(191, 191, 191, 0.75);
padding-bottom: 7px;
border: solid 1px #dcdcdc;
}
.pbox-offers:hover {
border:solid 1px #d01f25;
}
.pbox-products.wood-bundle {
width:100%;
height:210px;
-webkit-box-shadow: inset 0 0 0 #eef1e1;
-moz-box-shadow: inset 0 0 0 #eef1e1;
box-shadow: inset 0 0 0 #eef1e1;
border:solid 1px #eef1e1;
}
.pbox-products.wood-bundle:hover {
border:solid 1px #ccc;
}
.pbox-products span.pricetag, .pbox-hover.bundleis span.pricetag, span.pricetag {
position: absolute;
top: 8px;
right: 8px;
background: #686868;
border-bottom-left-radius:15px;
padding: 0px 10px;
font-size:11px;
color:#fff;
}
.pbox-products span.offertag, span.offertag {
position: absolute;
top: 8px;
left: 8px;
background: #db1f25;
border-bottom-right-radius:15px;
padding: 0px 10px;
font-size:11px;
}
.speech-bubble {
position: relative;
background: #c0c0c0;
border-radius: .4em;
}
.speech-bubble:after {
content: '';
position: absolute;
bottom: 0;
left: 50%;
width: 0;
height: 0;
border: 20px solid transparent;
border-top-color: #c0c0c0;
border-bottom: 0;
border-right: 0;
margin-left: -10px;
margin-bottom: -20px;
}
.pbox-products span.pricetag strong.yellow, span.pricetag strong.yellow,
.pbox-hover.bundleis span.pricetag strong.yellow, .pbox-offers span.newprice strong.yellow {
color:#000000;
}
.pbox-products span.pricetag strong.white, span.pricetag strong.white,
.pbox-products span.offertag strong.white, span.offertag strong.white,
.pbox-hover.bundleis span.pricetag strong.white {
color:#fff;
}
.pbox-related-products {
width:100%;
height:180px;
overflow:hidden;
}
.pbox-related-products-new {
width:100%;
height:85px;
overflow:hidden;
background: #fff;
padding-top: 10px;
border-top: solid 1px #e0e0e0;
padding-left: 1px;
}
.product-grid {
border:solid 1px #f3f3f3;
font-size:14px;
margin-bottom:5px;
background: #fff url(../img/shade.png) repeat-x center bottom;
}
.product-grid:last-child {
border-bottom:solid 1px #f3f3f3;
}
.product-grid:hover {
background:#fff;
}
.product-grid a.name {
color:#777;
display:block;
padding-left:10px;
padding-top:10px;
}
.product-grid img {
height:60px;
border-right:solid 1px #ddd;
}
.product-grid span.detail {
color:#ccc;
}
.bundles-paddings {
padding: 10px;
padding-left: 0;
padding-top: 0;
}
.pbox-products:hover, .pbox-related-products:hover {
box-shadow: inset 0 4px 60px #fff;
}
.pbox-related-products .pro-image {
width:100%; height:110px; border:solid 1px #eee; object-fit: contain;
}
.pbox-products .pro-image {
width:100%; height:140px; padding:8px; object-fit: contain;
}
.pbox-offers .pro-image {
width:100%; height:auto; padding: 5px 5px 0 5px; object-fit: contain;
}
.pbox-products .bordered {
border:solid 1px #eee;
padding:0 8px;
background:#fff;
}
.pbox-products p {
line-height:1.6;
}
.pbox-products a.new-title, .pbox-related-products a.new-title {
display: block;
text-align: center;
width:100%;
font-size:11.5px;
line-height:17px;
padding:5px 10px;
color:#222;
font-family:'MerriweatherBold';
font-weight:normal;
}
.pbox-offers a.new-title {
display: block;
text-align: left;
width:100%;
padding:0 10px 10px 10px;
color:#000;
display: table;
height:50px;
overflow: hidden;
text-overflow: ellipsis;
}
.pbox-offers a.new-title span {
display: table-cell;
vertical-align: middle;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.pbox-offers span.oldprice {
color:#000;
text-decoration: line-through;
padding-right:0;
padding-left:10px;
}
.pbox-offers span.newprice {
color:#d12026;
padding-left:10px;
}
.pbox-related-products-new a.new-title {
text-align: left;
font-size: 13px;
font-family: roboto-bold;
color:#505050;
padding: 0 0px 0 10px;
}
.pbox-related-products-new img.rimg {
height: 45px;
border: solid 1px #eee;
}
.pbox-related-products-new span.price {
padding-left: 10px;
color: #888;
font-size: 13px;
display:block;
}
.pbox-products a.new-title span.counter {
color:#ccc;
}
/* Products View */
.products-view {
float:left; border-left:solid 1px #db1f25; margin-bottom:40px; padding-left:10px; padding-right:0px; width:100%;
}
/* solid wood bundle box */
.pbox-bundle {
width:100%;
border:solid 1px #eee;
background: url(../img/shade.png) repeat-x center bottom;
float:left;
padding:10px;
}
.pbox-bundle:hover {
border:solid 1px #ccc;
}
.pbox-bundle .pro-image {
width:100%; height:140px; object-fit: contain;
}
.pbox-bundle .bordered {
padding:0 8px;
background:#fff;
}
.social {
width:100%;
float:left;
}
.social a {
display:inline-block;
width:32px;
height:32px;
margin:0px;
transition: filter .5s ease-in-out;
-webkit-filter: grayscale(0%); /* Ch 23+, Saf 6.0+, BB 10.0+ */
filter: grayscale(0%); /* FF 35+ */
}
.social a:hover {
text-decoration:none;
-webkit-filter: grayscale(100%); /* Ch 23+, Saf 6.0+, BB 10.0+ */
filter: grayscale(100%); /* FF 35+ */
}
.social .facebook { background:url(../img/icons/facebook.gif) no-repeat; }
.social .gplus { background:url(../img/icons/gplus.gif) no-repeat; }
.social .linkedin { background:url(../img/icons/linkedin.gif) no-repeat; }
.social .youtube { background:url(../img/icons/youtube.gif) no-repeat; }
.social .quora { background:url(../img/icons/quora.gif) no-repeat; }
.hv-image {
-webkit-filter: brightness(-65%);
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;
}
.hv-image:hover { -webkit-filter: brightness(0%); }
footer .footer-box-one {
webkit-box-shadow: inset 0 0px 40px #eef1e1;
-moz-box-shadow: inset 0 0px 40px #eef1e1;
box-shadow: inset 0 0px 40px #eef1e1;
padding-top: 37px;
}
footer .address {
float: left;
padding: 12px;
margin-bottom: 21px;
background: #f7f9f2;
border: solid 1px #eee;
width:88%;
}
footer .address i {
width:18px;
color:#505050;
}
footer p.app-text {
line-height:24px; color:#999; margin-top:14px;
}
footer p.app-text span {
background: #fff8b6; padding:2px 4px;
}
footer input.signupfield {
margin-top:7px; padding: 10px; width: 100%; background: #f7f9f2; border: solid 1px #eee;
}
footer .ourlinks {
float: left;
width:100%;
}
footer img.footer-logo {
width:169px;
margin-left: 40px;
margin-top: 35px;
}
footer .lastlinks { margin-left:-20px; }
footer { line-height:2em; background:#fff; padding:0; }
footer ul { list-style:none; margin:0; padding:0; position:relative; }
footer ul li { }
footer ul li:before {
content:'\f101';
font-family:FontAwesome;
color:#db1f25;
position:absolute;
margin-top:0px;
left:0;
}
footer ul li a { margin-left:14px; color:#222 !important; }
footer ul li a:hover { color:#db1f25 !important; }
footer .bottom-links { padding-top:20px !important; padding-bottom:0px !important; }
footer .bottom-links a { color:#676767; border-bottom:solid 1px #d01f25; }
footer .call-on { background:#f1f1f1; border:solid 1px #f1f1f1; padding:10px 12px; }
footer .call-us { border:solid 1px #f1f1f1; padding:10px 12px; }
/* .value-box { background:#f3f3f3; } */
.value-box h5 { margin-bottom:5px; padding-left:8px; padding-top:6px; }
.value-box p { line-height:21px; text-align:left; padding-left:8px; padding-right:8px; }
.value-box i {
color:#d01f25;
border-right:solid 1px #ffffff;
font-size:4em;
display: block;
height: 100px;
line-height: 100px;
text-align: center;
width: 100%;
}
footer address { font-style:normal; }
footer strong { font-family:'Extra-Bold'; }
footer .footer-boxes {
width:100%;
border-bottom: solid 1px #eee;
border-top: solid 1px #eee;
margin-top:15px !important;
margin-bottom:30px !important;
padding-top:30px !important;
float:left;
}
footer .copyright {
line-height: 20px;
}
#mob-bottom { z-index:999; background:#505050; position:fixed; width:100%; bottom:0; left:0; }
#mob-bottom a { padding: 8px 0; background:#505050; text-align:center; float:left; color:#fff; display:inline-block; width:33.3333%; }
#mob-bottom a i { color:#fff; }
#mob-bottom .borderis { border-left:solid 1px #7e7e7e; border-right:solid 1px #7e7e7e; }
[class^='imghvr-'],
[class*=' imghvr-'] {
background:none !important;
}
/* responsee.css */
.size-960 .line,.size-1140 .line,.size-1280 .line {
margin:0 auto;
padding:0 0.625rem;
}
.size-960 .line {max-width:60rem;}
.size-1140 .line {max-width:71.25rem;}
.size-1280 .line {max-width:80rem;}
.size-960.align-content-left .line,.size-1140.align-content-left .line,.size-1280.align-content-left .line {margin-left:0;}
.line:after, .center:after, .box:after, .margin:after, .margin2x:after {
clear:both;
content:".";
display:block;
height:0;
line-height:0;
visibility:hidden;
}
.top-nav ul {padding:0;}
.top-nav ul ul { position:absolute; background:#152732; }
.top-nav li { float:left; list-style:none outside none; cursor:pointer; }
.top-nav li a { color:#fff; display:block; font-size:1rem; padding:1.25rem; }
.top-nav li ul li a { background:none repeat scroll 0 0 #152732; min-width:100%; padding:0.625rem; }
.top-nav li a:hover, .aside-nav li a:hover {background:rgba(153, 153, 153, 0.25);}
.top-nav li ul {display:none;}
.top-nav li ul li,.top-nav li ul li ul li { float:none;list-style:none outside none; min-width:100%; padding:0; }
.count-number {
background: rgba(153, 153, 153, 0.25) none repeat scroll 0 0;
border-radius: 10rem;
color: #fff;
display: inline-block;
font-size: 0.7rem;
height: 1.3rem;
line-height: 1.3rem;
margin: 0 0 -0.3125rem 0.3125rem;
text-align: center;
width: 1.3rem;
}
ul.chevron .count-number {display:none;}
ul.chevron .submenu > a:after, ul.chevron .sub-submenu > a:after,ul.chevron .aside-submenu > a:after, ul.chevron .aside-sub-submenu > a:after {
content:"\f004";
display:inline-block;
font-family:mfg;
font-size:0.7rem;
margin:0 0.625rem;
}
.top-nav .active-item a {background:none repeat scroll 0 0 rgba(153, 153, 153, 0.25);}
.aside-nav > ul > li.active-item > a:link,.aside-nav > ul > li.active-item > a:visited {
background:none repeat scroll 0 0 rgba(153, 153, 153, 0.25);
color:#fff;
}
.pbox, .pbox-hover { padding:10px !important; }
.pboxx { padding:0.5em !important; }
form.customform input[type="radio"] + label span.colorbox {
width:114px;
height:76px;
}
.s-1, .s-2, .s-five,.s-3, .s-4, .s-5, .s-6, .s-7, .s-8, .s-9, .s-10, .s-11, .s-12, .m-1, .m-2, .m-five, .m-3, .m-4, .m-5, .m-6, .m-7, .m-8, .m-9, .m-10, .m-11, .m-12, .l-1, .l-2, .l-five, .l-3, .l-4, .l-5, .l-6, .l-7, .l-8, .l-9, .l-10, .l-11, .l-12 {
float:left;
position:static;
}
/* Media Min Width 1000px ----------------------------------------------------------------------------- */
@media screen and (min-width:1000px) {
.pl0 { padding-left:0 !important; }
.m-iqbal { padding-left:19px; }
footer .footermainbox { margin-left:-30px; }
.fixme .forfixme { float:left; width:94%; }
.heightforfixme { height: 3226px; }
.p-left-0 { padding-left:0 !important; }
.p-right-0 { padding-right:0 !important; }
.mih-main-section { padding: 75px 40px 75px 40px; }
.mih-main-section.sml { padding: 45px 40px 75px 40px !important; }
.mih-main-section.solid-wood { background: url(../img/solid-wood-bg.jpg) no-repeat fixed; background-size: 100%; }
.margin-l-right-50 { margin-right:50px !important; }
.section { padding: 3rem 1.25rem; }
.section .box-padding { padding:1.5em; }
.section .box-left-padding, .box-left-padding { padding-left:2em; padding-top:1em; }
.aside-nav .count-number { margin-left:-1.25rem; float:right; }
.top-nav li:hover > ul { display:block; z-index:10; }
.top-nav li:hover > ul ul { left:100%; margin:-2.5rem 0; width:100%; }
.nav-text,.aside-nav-text {display:none;}
.aside-nav a,.aside-nav a:link,.aside-nav a:visited,.aside-nav li > ul,.top-nav a,.top-nav a:link,.top-nav a:visited {
transition:background 0.20s linear 0s;
-o-transition:background 0.20s linear 0s;
-ms-transition:background 0.20s linear 0s;
-moz-transition:background 0.20s linear 0s;
-webkit-transition:background 0.20s linear 0s;
}
.aside-nav ul { background:#e8e8e8; padding:0; }
.aside-nav li { list-style:none outside none; cursor:pointer; }
.aside-nav li a,.aside-nav li a:link,.aside-nav li a:visited {
color:#444;
display:block;
font-size:1rem;
padding:1.25rem;
border-bottom:1px solid #d2d2d2;
}
.aside-nav > ul > li:last-child a {border-bottom:0 none;}
.aside-nav li > ul {
height:0;
display:block;
position:relative;
background:#f4f4f4;
border-left:solid 1px #f2f2f2;
border-right:solid 1px #f2f2f2;
overflow:hidden;
}
.aside-nav li ul ul {
border:0;
background:#fff;
}
.aside-nav ul ul a {padding:0.625rem 1.25rem;}
.aside-nav li a:link, .aside-nav li a:visited {color:#333;}
.aside-nav li li a:hover, .aside-nav li li.active-item > a, .aside-nav li li.aside-sub-submenu li a:hover {
color:#999;
background:none;
}
.aside-nav > ul > li > a:hover {color:#fff;}
.aside-nav li li a:hover:before, .aside-nav li li.active-item a:before {
content:"\f006";
display:inline-block;
font-family:"mfg";
font-size:0.6rem;
margin:0 0.625rem 0 -1.25rem;
width:0.625rem;
}
.aside-nav li li a:link, .aside-nav li li a:visited {background:none;}
.aside-nav .show-aside-ul, .aside-nav .active-aside-item {height:auto;}
.padding {
display:list-item;
list-style:none outside none;
padding:10px;
}
.margin,.margin2x {display: block;}
.margin {margin:0 -0.625rem;}
.margin2x {margin:0 -1.25rem;}
.line {clear:left;}
.line .line {padding:0;}
.hide-l {display:none;}
.box {
background:none repeat scroll 0 0 #fff;
display:block;
padding:1.25rem;
width:100%;
}
.margin-bottom {margin-bottom:1.25rem;}
.margin-bottom2x {margin-bottom:2.5rem;}
.l-offset-1 {margin-left:8.3333%;}
.l-offset-2 {margin-left:16.6666%;}
.l-offset-five {margin-left:16.6666%;}
.l-offset-3 {margin-left:25%;}
.l-offset-4 {margin-left:33.3333%;}
.l-offset-5 {margin-left:41.6666%;}
.l-offset-6 {margin-left:50%;}
.l-offset-7 {margin-left:58.3333%;}
.l-offset-8 {margin-left:66.6666%;}
.l-offset-9 {margin-left:75%;}
.l-offset-10 {margin-left:83.3333%;}
.l-offset-11 {margin-left:91.6666%;}
.l-offset-12 {margin-left:100%;}
.s-1 {width:8.3333%;}
.s-2 {width:16.6666%;}
.s-five {width:16.6666%;}
.s-3 {width:25%;}
.s-4 {width:33.3333%;}
.s-5 {width:41.6666%;}
.s-6 {width:50%;}
.s-7 {width:58.3333%;}
.s-8 {width:66.6666%;}
.s-9 {width:75%;}
.s-10 {width:83.3333%;}
.s-11 {width:91.6666%;}
.s-12 {width:100%;}
.margin > .s-1,.margin > .s-2,.margin > .s-five,.margin > .s-3,.margin > .s-4,.margin > .s-5,.margin > .s-6,.margin > .s-7,.margin > .s-8,.margin > .s-9,.margin > .s-10,.margin > .s-11,.margin > .s-12,
.margin > .m-1,.margin > .m-2,.margin > .m-five,.margin > .m-3,.margin > .m-4,.margin > .m-5,.margin > .m-6,.margin > .m-7,.margin > .m-8,.margin > .m-9,.margin > .m-10,.margin > .m-11,.margin > .m-12,
.margin > .l-1,.margin > .l-2,.margin > .l-five,.margin > .l-3,.margin > .l-4,.margin > .l-5,.margin > .l-6,.margin > .l-7,.margin > .l-8,.margin > .l-9,.margin > .l-10,.margin > .l-11,.margin > .l-12 {padding:0 0.625rem;}
.margin2x > .s-1,.margin2x > .s-2,.margin2x > .s-five,.margin2x > .s-3,.margin2x > .s-4,.margin2x > .s-5,.margin2x > .s-6,.margin2x > .s-7,.margin2x > .s-8,.margin2x > .s-9,.margin2x > .s-10,.margin2x > .s-11,.margin2x > .s-12,
.margin2x > .m-1,.margin2x > .m-2,.margin2x > .m-five,.margin2x > .m-3,.margin2x > .m-4,.margin2x > .m-5,.margin2x > .m-6,.margin2x > .m-7,.margin2x > .m-8,.margin2x > .m-9,.margin2x > .m-10,.margin2x > .m-11,.margin2x > .m-12,
.margin2x > .l-1,.margin2x > .l-2,.margin2x > .l-five,.margin2x > .l-3,.margin2x > .l-4,.margin2x > .l-5,.margin2x > .l-6,.margin2x > .l-7,.margin2x > .l-8,.margin2x > .l-9,.margin2x > .l-10,.margin2x > .l-11,.margin2x > .l-12 {padding:0 1.25rem;}
.m-1 {width:8.3333%;}
.m-2 {width:16.6666%;}
.m-five {width:20%;}
.m-3 {width:25%;}
.m-4 {width:33.3333%;}
.m-5 {width:41.6666%;}
.m-6 {width:50%;}
.m-7 {width:58.3333%;}
.m-8 {width:66.6666%;}
.m-9 {width:75%;}
.m-10 {width:83.3333%;}
.m-11 {width:91.6666%;}
.m-12 {width:100%;}
.l-1 {width:8.3333%;}
.l-2 {width:16.6666%;}
.l-five {width:20%;}
.l-3 {width:25%;}
.l-4 {width:33.3333%;}
.l-5 {width:41.6666%;}
.l-6 {width:50%;}
.l-7 {width:58.3333%;}
.l-8 {width:66.6666%;}
.l-9 {width:75%;}
.l-10 {width:83.3333%;}
.l-11 {width:91.6666%;}
.l-12 {width:100%;}
.right {float:right;}
.left {float:left;}
h1.new-h1 {
font-size:25px; line-height:30px; font-family: 'Bitter'; color: #d01f25; margin-bottom:5px;
}
p.new-tagline { text-align:center; font-size:19px; margin-bottom:45px; font-family:'Roboto-Bold'; }
}
/* Media Max Width 1000px ----------------------------------------------------------------------------- */
@media screen and (max-width:1000px) {
form.customform input[type="radio"] + label span.colorbox {
width:105px;
height:75px;
}
h1.h1mob { color:#d01f25; }
h1.h1mob span { color:#505050; }
h3.appheading {
margin-bottom: 0;
padding: 8px 0px;
color: #c71d22;
border-bottom:solid 1px #eef1e1;
background:#fff;
font-family: 'roboto';
font-weight:normal;
}
.padding-top-0-m {
padding-top: 0px;
}
.height200 { height:200px; }
.height410 { height: 411px; }
.height150 { height:150px; }
.se-pre-con { bottom:55px !important; }
.margin-bottom-m { margin-bottom:16px !important; }
.margin-bottom-m-big { margin-bottom:30px !important; }
.margin-bottom-0-m { margin-bottom:0 !important; }
.banner-eight-box { padding-top:5px; }
.vasplus_pb_Search {
width: 96% !important;
}
.vasplus_pb_Search form {
background:#eee !important;
height:auto !important;
}
.vasplus_pb_Search #vpv_search_box {
width:100% !important;
}
.vasplus_pb_Search #vpv_search_button {
width:22% !important;
}
footer .copyright {
line-height: 20px !important;
}
footer .right {
float: none;
}
.mih-main-section {
padding:50px 5px 60px 5px;
}
.products-view {
margin-top:0px; margin-bottom:30; padding-left:8px; padding-right:0px;
}
.text-align { text-align:left; }
.pbox-hover .pro-image {
width:100%; height:110px; object-fit: contain;
}
.pbox-products {
height:200px;
}
.pbox-products .pro-image {
width:100%; height:117px; padding:5px; object-fit: contain;
}
.pbox-products span.pricetag, .pbox-hover.bundleis span.pricetag {
top: 5px;
right: 5px;
}
.pbox-products span.offertag {
top: 5px;
left: 5px;
}
.owl-carousel-banners.single {
padding-bottom: 0px;
}
.pbox-related-products-new img.rimg {
height:55px;
}
#rproducts {
margin-top:35px;
}
h1, .h1 {
font-size:1.5em;
}
h1 span, .h1 span {
font-size:14px;
}
.pbox {
border:0;
}
.pbox:hover {
border:0;
}
.pbox .home {
height:auto;
padding:0;
}
.pbox a.title-home {
font-size:14px;
display:block;
text-align:center;
background:#db1f25;
color:#fff;
}
.section {
padding: 6rem 1.25rem;
}
.section .box-padding {
padding:1.5em;
}
.align-responsive { text-align:left; }
.padding-left {
padding-left:0 !important;
}
.padding-m-top-50 { padding-top:50px !important; }
.padding-m-bottom-50 { padding-bottom:50px !important; }
.section .box-left-padding, .box-left-padding {
padding-left:2em; padding-top:1em;
}
.pbox, .pbox-hover { padding:0.2em !important; }
.pbox-hover { height:186px; }
.size-960,.size-1140,.size-1280 {max-width:1000px;}
.hide-l,.hide-s {display:inline-block;}
.hide-m { display:none; }
.top-nav li a {background:none repeat scroll 0 0 #4a4a4a;}
.top-nav > ul {
height:0;
max-width:100%;
overflow:hidden;
position:relative;
z-index:999;
}
.top-nav > ul.show-menu,.aside-nav.minimize-on-small > ul.show-menu {height:auto;}
.top-nav ul ul {
left:0;
margin-top:0;
position:relative;
right:0;
}
.top-nav li ul li a {min-width:100%;}
.top-nav li {
float:none;
list-style:none outside none;
padding:0;
}
.top-nav li a {
border-top:1px solid #333;
color:#fff;
display:block;
padding:1.25rem 0.625rem;
text-align:center;
text-decoration:none;
}
.top-nav li ul li a {border-top:1px solid #878787;}
.top-nav li ul li ul li a {border-top:1px solid #989898;}
.top-nav li a:hover {
background:none repeat scroll 0 0 #8b8b8b;
color:#fff;
}
.top-nav li ul,.top-nav li ul li ul {
display:block;
overflow:hidden;
height:0;
}
.top-nav > ul ul.show-ul {
display:block;
height:auto;
}
.top-nav li ul li a {
background:none repeat scroll 0 0 #9d9d9d;
padding:0.625rem;
}
.top-nav li ul li ul li a {
background:none repeat scroll 0 0 #d7d7d7;
color:#222;
}
.nav-text {
color:#fff;
display:block;
font-size:1.2rem;
line-height:3;
margin-right:0.625rem;
max-width:100%;
text-align:center;
vertical-align:middle;
}
.nav-text:after {
content:"\f008";
font-family:"mfg";
font-size:1.1rem;
margin-left:0.5rem;
text-align:right;
}
footer h3,footer ul li,footer p, footer .social { text-align:center; }
footer .bottom-links { padding-bottom:50px !important; text-align:center; }
.l-offset-1,.l-offset-2,.l-offset-five,.l-offset-3,.l-offset-4,.l-offset-5,.l-offset-6,.l-offset-7,.l-offset-8,.l-offset-9,.l-offset-10,.l-offset-11,.l-offset-12{margin-left:0;}
.m-offset-1 {margin-left:8.3333%;}
.m-offset-2 {margin-left:16.6666%;}
.m-offset-five {margin-left:16.6666%;}
.m-offset-3 {margin-left:25%;}
.m-offset-4 {margin-left:33.3333%;}
.m-offset-5 {margin-left:41.6666%;}
.m-offset-6 {margin-left:50%;}
.m-offset-7 {margin-left:58.3333%;}
.m-offset-8 {margin-left:66.6666%;}
.m-offset-9 {margin-left:75%;}
.m-offset-10 {margin-left:83.3333%;}
.m-offset-11 {margin-left:91.6666%;}
.m-offset-12 {margin-left:100%;}
.l-1 {width:8.3333%;}
.l-2 {width:16.6666%;}
.l-five {width:20%;}
.l-3 {width:25%;}
.l-4 {width:33.3333%;}
.l-5 {width:41.6666%;}
.l-6 {width:50%;}
.l-7 {width:58.3333%;}
.l-8 {width:66.6666%;}
.l-9 {width:75%;}
.l-10 {width:83.3333%;}
.l-11 {width:91.6666%;}
.l-12 {width:100%;}
.s-1 {width:8.3333%;}
.s-2 {width:16.6666%;}
.s-five {width:20%;}
.s-3 {width:25%;}
.s-4 {width:33.3333%;}
.s-5 {width:41.6666%;}
.s-6 {width:50%;}
.s-7 {width:58.3333%;}
.s-8 {width:66.6666%;}
.s-9 {width:75%;}
.s-10 {width:83.3333%;}
.s-11 {width:91.6666%;}
.s-12 {width:100%}
.m-1 {width:8.3333%;}
.m-2 {width:16.6666%;}
.m-five {width:20%;}
.m-3 {width:25%;}
.m-4 {width:33.3333%;}
.m-5 {width:41.6666%;}
.m-6 {width:50%;}
.m-7 {width:58.3333%;}
.m-8 {width:66.6666%;}
.m-9 {width:75%;}
.m-10 {width:83.3333%;}
.m-11 {width:91.6666%;}
.m-12 {width:100%}
}
/* Media Max Width 786px ----------------------------------------------------------------------------- */
@media screen and (max-width:786px) {
h3.heading-cat { font-size:15px; }
.hide-m { display:none; }
.pbox-cat-home .pro-image { width:100%; padding:6px; object-fit: contain; }
.pbox-cat-home .pro-image-main-cat { width:100%; padding:6px; }
h1.new-h1 {
font-size:20px; line-height:24px; margin-bottom:5px; margin-top:10px;
}
p.new-tagline { font-size:16px; margin-bottom:35px; padding-left:20px; padding-right:20px; }
}
/* Media Max Width 480px ----------------------------------------------------------------------------- */
@media screen and (max-width:480px) {
#new-mob .mob-material-box {
height:110px;
}
.sortby-dropdown { padding-bottom:8px; padding-top:17px; padding-left:6px; }
.pbox-products:hover, .pbox-related-products:hover {
-webkit-box-shadow: inset 0 0px 40px #eef1e1;
-moz-box-shadow: inset 0 0px 40px #eef1e1;
box-shadow: inset 0 0px 40px #eef1e1;
}
.padding-top-s { padding-top:20px !important; }
footer .footer-box-one {
padding-top: 24px;
}
.padding { padding:6px !important; }
.alert-messages {
padding-top:55px !important;
}
.m-bottom-cart-detail {
margin-bottom:0;
font-size:12px;
}
.cart-product {
padding:1px !important;
}
h1.homepage {
font-family: 'Bitter';
font-size:1.7em;
line-height: 1.2em;
}
h1.homepage span {
font-size: 13px;
}
span.homepage-span {
font-size: 13px;
}
h1.searchpage {
font-size:18px;
line-height:27px;
}
h1.searchpage span {
font-size: 12px;
font-family: 'roboto';
}
.gallery-right {
padding-right: 0px !important;
}
.gallery-left {
padding-left: 0px !important;
}
.gallery-img .content.pright {
border-right:0;
}
h3, .h3 { font-size:1.1em; }
.value-box i {
line-height: 52px;
font-size:2.3em;
}
.s-no-padding { padding:0px !important; }
.content h3.s-text {
font-size:15px;
line-height:18px;
}
.content a.buttonis {
padding:8px 14px;
margin-top:0px;
}
.home-top { padding-top:0; }
#typed-text { margin-bottom:0; }
.about-us { padding-right:0; }
.m-iqbal { padding-top:20px; }
#typed-text { height:48px; }
#typed { border-bottom:0; }
.left-side, .fixme .left-side { margin-right:0; }
.section {
padding: 4rem 0.80rem;
}
.section .box-padding {
padding:1.2em 0.8em;
}
.section .box-left-padding, .box-left-padding {
padding-left:0; padding-top:1.5em;
}
.size-960,.size-1140,.size-1280 {max-width:480px;}
.aside-nav li a {text-align: center;}
.minimize-on-small .aside-nav-text {
background:#152732 none repeat scroll 0 0;
color:#fff;
cursor:pointer;
display:block;
font-size:1.2rem;
line-height:3;
max-width:100%;
padding-right:0.625rem;
text-align:center;
vertical-align:middle;
}
.aside-nav-text:after {
content:"\f008";
font-family:"mfg";
font-size:1.1rem;
margin-left:0.5rem;
text-align:right;
}
.aside-nav.minimize-on-small > ul {
height:0;
overflow:hidden;
}
.hide-l,.hide-m {display:block;}
.display-inline { display:inline-block !important; }
.hide-s {display:none;}
.count-number {margin-right:-1.25rem;}
.l-offset-1,.l-offset-2,.l-offset-five,.l-offset-3,.l-offset-4,.l-offset-5,.l-offset-6,.l-offset-7,.l-offset-8,.l-offset-9,.l-offset-10,.l-offset-11,.l-offset-12,
.m-offset-1,.m-offset-2,.m-offset-five,.m-offset-3,.m-offset-4,.m-offset-5,.m-offset-6,.m-offset-7,.m-offset-8,.m-offset-9,.m-offset-10,.m-offset-11,.m-offset-12 {margin-left:0;}
.s-offset-1 {margin-left:8.3333%;}
.s-offset-2 {margin-left:16.6666%;}
.s-offset-five {margin-left:16.6666%;}
.s-offset-3 {margin-left:25%;}
.s-offset-4 {margin-left:33.3333%;}
.s-offset-5 {margin-left:41.6666%;}
.s-offset-6 {margin-left:50%;}
.s-offset-7 {margin-left:58.3333%;}
.s-offset-8 {margin-left:66.6666%;}
.s-offset-9 {margin-left:75%;}
.s-offset-10 {margin-left:83.3333%;}
.s-offset-11 {margin-left:91.6666%;}
.s-offset-12 {margin-left:100%;}
.l-1 {width:8.3333%;}
.l-2 {width:16.6666%;}
.l-five {width:20%;}
.l-3 {width:25%;}
.l-4 {width:33.3333%;}
.l-5 {width:41.6666%;}
.l-6 {width:50%;}
.l-7 {width:58.3333%;}
.l-8 {width:66.6666%;}
.l-9 {width:75%;}
.l-10 {width:83.3333%;}
.l-11 {width:91.6666%;}
.l-12 {width:100%;}
.m-1 {width:8.3333%;}
.m-2 {width:16.6666%;}
.m-five {width:20%;}
.m-3 {width:25%;}
.m-4 {width:33.3333%;}
.m-5 {width:41.6666%;}
.m-6 {width:50%;}
.m-7 {width:58.3333%;}
.m-8 {width:66.6666%;}
.m-9 {width:75%;}
.m-10 {width:83.3333%;}
.m-11 {width:91.6666%;}
.m-12 {width:100%}
.s-1 {width:8.3333%;}
.s-2 {width:16.6666%;}
.s-five {width:20%;}
.s-3 {width:25%;}
.s-4 {width:33.3333%;}
.s-5 {width:41.6666%;}
.s-6 {width:50%;}
.s-7 {width:58.3333%;}
.s-8 {width:66.6666%;}
.s-9 {width:75%;}
.s-10 {width:83.3333%;}
.s-11 {width:91.6666%;}
.s-12 {width:100%}
#mob-bottom { z-index:999; background:#505050; position:fixed; width:100%; bottom:0; left:0; }
#mob-bottom a { padding: 8px 0; background:#505050; text-align:center; float:left; color:#fff; display:inline-block; width:33.3333%; }
#mob-bottom a:hover { text-decoration:none; }
#mob-bottom a i { color:#fff; }
#mob-bottom .borderis { border-left:solid 1px #7e7e7e; border-right:solid 1px #7e7e7e; }
#mob-bottom a .counter { color:#999; }
footer { border-top:0; padding-top:0; }
footer .small-margin-bottom { margin-bottom:5px !important; }
}
/* Media Max Width 1200px and Min Width 1000px ------------------------------------------------------- */
@media screen and (max-width:1200px) and (min-width:1000px) {
.hide1000 { display:none !important; }
}
/* Media Max Width 1200px ----------------------------------------------------------------------------- */
@media screen and (max-width:1200px) {
#cd-menu-trigger { width:55px; }
#cd-menu-trigger .cd-menu-text { display:none; }
}
/* Media Max Width 700px and Min Width 480 ----------------------------------------------------------- */
@media screen and (max-width:786px) and (min-width:480px) {
.pbox-products .pro-image { width:100%; height:100px; object-fit: contain; }
.hide-m { display:none; }
#new-mob .mob-top-cat .mob-top-cat-box { height:157px !important; }
#new-mob .mob-top-cat .mob-top-cat-box img { height:115px !important; }
#new-mob .mob-material-box {
height:140px;
}
}
.center { float:none; margin:0 auto; display:block; }
.hr-text {
line-height: 1em;
position: relative;
outline: 0;
border: 0;
color: black;
text-align: center;
height: 1.5em;
margin-bottom:3px;
color:#ccc;
font-size:16px;
}
.hr-text:before {
content: '';
background: linear-gradient(to right, transparent, #222, transparent);
position: absolute;
left: 0;
top: 50%;
width: 100%;
height: 1px;
}
.hr-text:after {
content: attr(data-content);
position: relative;
display: inline-block;
color: black;
padding: 0 .5em;
line-height: 1.5em;
color:#222;
background-color: #fff;
font-family: 'Roboto-Bold';
}
/*!
* Hover.css (http://ianlunn.github.io/Hover/)
* Version: 2.2.1
* Author: Ian Lunn @IanLunn */
/* Float */
.hvr-float {
display: inline-block;
vertical-align: middle;
-webkit-transform: perspective(1px) translateZ(0);
transform: perspective(1px) translateZ(0);
box-shadow: 0 0 1px transparent;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
-webkit-transition-property: transform;
transition-property: transform;
-webkit-transition-timing-function: ease-out;
transition-timing-function: ease-out;
}
.hvr-float:hover, .hvr-float:focus, .hvr-float:active {
-webkit-transform: translateY(-8px);
transform: translateY(-8px);
}
/* Hover.css End */
.cart-list { padding-left:10px; padding-right:10px; display: table; min-height: 79px; }
.action-list { display: table; min-height: 79px; }
.cart-list .cart-list-item, .action-list .cart-list-item { display: table-cell; vertical-align: middle; }
/* New Mobile CSS */
#new-mob {
width:100%;
}
#new-mob .mob-slide {
padding:20px 5px 0px 5px;
}
#new-mob .mob-slide a img {
border-top-right-radius: 10px; border-top-left-radius: 10px;
}
#new-mob .mob-steps {
padding-top:12px;
}
#new-mob .mob-steps .mob-steps-h {
text-align:center; color:#ccc; font-size:14px; line-height:17px; padding-bottom:5px;
}
#new-mob .mob-steps .mob-step {
background:#f9f6da; padding:6px;
}
#new-mob .mob-steps .mob-step i {
padding-top:7px; padding-left:5px; color:#d01f25;
}
#new-mob .mob-steps .mob-step p.step-detail {
font-size:11px; line-height:13px;
}
#new-mob .mob-top-cat {
padding-left:5px; padding-right:5px; padding-bottom:0px; padding-top:20px;
}
#new-mob .mob-top-cat .mob-top-cat-box {
background:#fff; padding:4px; height:115px;
}
#new-mob .mob-top-cat .mob-top-cat-box img {
border-radius:50%; height:75px;
}
#new-mob .mob-top-cat .mob-top-cat-box a.top-cat-name {
display:block; font-size:11px; text-align:center; line-height:13px; padding-top:5px; color:#222; font-weight:bold;
}
#new-mob .mob-top-cat .mob-top-cat-more {
padding-top:0px; padding-bottom:0; text-align:center;
}
#new-mob .mob-top-cat .mob-top-cat-more a {
background:#f9cf07; color:#222; padding:2px 6px; font-size:11px; border-radius:6px;
}
#new-mob .mob-aluminium-materials {
padding-left:5px; padding-right:5px; padding-bottom:22px; padding-top:20px;
}
#new-mob .mob-material-box {
background:#fff; padding:4px; border-radius:6px;
}
#new-mob .mob-material-box a.mob-material-name {
display:block; font-size:11px; text-align:center; line-height:13px; padding-top:5px; color:#222;
}
#new-mob .mob-offers {
padding-left:5px; padding-right:5px; padding-bottom:20px;
}
#new-mob .mob-offers .pbox-offers span.price-and-offer {
display:block; padding-top:10px;
}
#new-mob .mob-offers .pbox-offers span.price-and-offer span.ofr-price {
font-family:'Roboto-Bold'; margin-left:5px; margin-right:5px; font-size:11px; background:#f7d009; color:#222; padding:3px 5px 2px 5px; border-radius:4px;
}
#new-mob .mob-offers .pbox-offers span.price-and-offer span.ofr-disc-price {
color:#d01f25; font-size:11px;
}
#new-mob .mob-offers .pbox-offers span.ofr-link {
display:block; padding-left:5px; padding-right:3px;
}
#new-mob .mob-offers .pbox-offers span.ofr-link a {
display:block; font-size:11px; line-height:13px; padding-top:5px; color:#222;
}
#new-mob .mob-more-offers p {
margin-top:27px; font-size:17px; color:#b5b5b5; line-height:30px; text-align:center;
}