html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
margin: 0;
padding: 0;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
display: block;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
a img {
border: none;
}
a {
outline: none;
text-decoration: none;
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
-o-transition: all .4s ease;
-ms-transition: all .4s ease;
transition: all .4s ease;
color: #14579C;
}
textarea {
height: auto;
min-height: 50px;
-webkit-resize: none;
-moz-resize: none;
resize: none;
}
.clearfloat:before, .clearfloat:after {
content: "";
display: table;
}
.clearfloat:after {
clear: both;
}
/* For IE 6/7 (triggers hasLayout) */
.clearfloat {
*zoom: 1;
}
img {
max-width: 100%;
height: auto;
-ms-interpolation-mode: bicubic;
display: inline-block;
vertical-align: middle;
}
select {
width: 100%;
}
/*FONTS--------------------------------------------------------------------*/
@font-face {
font-family: 'Font Awesome 5 Brands';
font-style: normal;
font-weight: normal;
font-display: swap;
src: url("fonts/fa-brands-400.eot");
src: url("fonts/fa-brands-400.eot?#iefix") format("embedded-opentype"),
url("fonts/fa-brands-400.woff2") format("woff2"),
url("fonts/fa-brands-400.woff") format("woff"),
url("fonts/fa-brands-400.ttf") format("truetype");
}
.fab {
font-family: 'Font Awesome 5 Brands';
font-display: swap;
}
@font-face {
font-family: 'Font Awesome 5 Pro';
font-style: normal;
font-weight: 300;
font-display: swap;
src: url("fonts/fa-light-300.eot");
src: url("fonts/fa-light-300.eot?#iefix") format("embedded-opentype"),
url("fonts/fa-light-300.woff2") format("woff2"),
url("fonts/fa-light-300.woff") format("woff"),
url("fonts/fa-light-300.ttf") format("truetype");
}
.fal {
font-family: 'Font Awesome 5 Pro';
font-weight: 300;
font-display: swap;
}
@font-face {
font-family: 'Font Awesome 5 Pro';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url("fonts/fa-regular-400.eot");
src: url("fonts/fa-regular-400.eot?#iefix") format("embedded-opentype"),
url("fonts/fa-regular-400.woff2") format("woff2"),
url("fonts/fa-regular-400.woff") format("woff"),
url("fonts/fa-regular-400.ttf") format("truetype");
}
.far {
font-family: 'Font Awesome 5 Pro';
font-weight: 400;
font-display: swap;
}
@font-face {
font-family: 'Font Awesome 5 Pro';
font-style: normal;
font-weight: 900;
font-display: swap;
src: url("fonts/fa-solid-900.eot");
src: url("fonts/fa-solid-900.eot?#iefix") format("embedded-opentype"),
url("fonts/fa-solid-900.woff2") format("woff2"),
url("fonts/fa-solid-900.woff") format("woff"),
url("fonts/fa-solid-900.ttf") format("truetype");
}
.fa,
.fas {
font-family: 'Font Awesome 5 Pro';
font-weight: 900;
font-display: swap;
}
@font-face {
font-family: 'Lora';
src: url('fonts/Lora-MediumItalic.eot');
src: url('fonts/Lora-MediumItalic.eot?#iefix') format('embedded-opentype'),
url('fonts/Lora-MediumItalic.woff2') format('woff2'),
url('fonts/Lora-MediumItalic.woff') format('woff'),
url('fonts/Lora-MediumItalic.ttf') format('truetype');
font-weight: 500;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: 'Lora';
src: url('fonts/Lora-SemiBold.eot');
src: url('fonts/Lora-SemiBold.eot?#iefix') format('embedded-opentype'),
url('fonts/Lora-SemiBold.woff2') format('woff2'),
url('fonts/Lora-SemiBold.woff') format('woff'),
url('fonts/Lora-SemiBold.ttf') format('truetype');
font-weight: 600;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Lora';
src: url('fonts/Lora-Bold.eot');
src: url('fonts/Lora-Bold.eot?#iefix') format('embedded-opentype'),
url('fonts/Lora-Bold.woff2') format('woff2'),
url('fonts/Lora-Bold.woff') format('woff'),
url('fonts/Lora-Bold.ttf') format('truetype');
font-weight: bold;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Lora';
src: url('fonts/Lora-Regular.eot');
src: url('fonts/Lora-Regular.eot?#iefix') format('embedded-opentype'),
url('fonts/Lora-Regular.woff2') format('woff2'),
url('fonts/Lora-Regular.woff') format('woff'),
url('fonts/Lora-Regular.ttf') format('truetype');
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Lora';
src: url('fonts/Lora-Medium.eot');
src: url('fonts/Lora-Medium.eot?#iefix') format('embedded-opentype'),
url('fonts/Lora-Medium.woff2') format('woff2'),
url('fonts/Lora-Medium.woff') format('woff'),
url('fonts/Lora-Medium.ttf') format('truetype');
font-weight: 500;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Lora';
src: url('fonts/Lora-BoldItalic.eot');
src: url('fonts/Lora-BoldItalic.eot?#iefix') format('embedded-opentype'),
url('fonts/Lora-BoldItalic.woff2') format('woff2'),
url('fonts/Lora-BoldItalic.woff') format('woff'),
url('fonts/Lora-BoldItalic.ttf') format('truetype');
font-weight: bold;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: 'Lora';
src: url('fonts/Lora-SemiBoldItalic.eot');
src: url('fonts/Lora-SemiBoldItalic.eot?#iefix') format('embedded-opentype'),
url('fonts/Lora-SemiBoldItalic.woff2') format('woff2'),
url('fonts/Lora-SemiBoldItalic.woff') format('woff'),
url('fonts/Lora-SemiBoldItalic.ttf') format('truetype');
font-weight: 600;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: 'Lora';
src: url('fonts/Lora-Italic.eot');
src: url('fonts/Lora-Italic.eot?#iefix') format('embedded-opentype'),
url('fonts/Lora-Italic.woff2') format('woff2'),
url('fonts/Lora-Italic.woff') format('woff'),
url('fonts/Lora-Italic.ttf') format('truetype');
font-weight: normal;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: 'Palatino Linotype';
src: url('fonts/PalatinoLinotype-BoldItalic.eot');
src: url('fonts/PalatinoLinotype-BoldItalic.eot?#iefix') format('embedded-opentype'),
url('fonts/PalatinoLinotype-BoldItalic.woff2') format('woff2'),
url('fonts/PalatinoLinotype-BoldItalic.woff') format('woff'),
url('fonts/PalatinoLinotype-BoldItalic.ttf') format('truetype');
font-weight: bold;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: 'Palatino Linotype';
src: url('fonts/PalatinoLinotype-Roman.eot');
src: url('fonts/PalatinoLinotype-Roman.eot?#iefix') format('embedded-opentype'),
url('fonts/PalatinoLinotype-Roman.woff2') format('woff2'),
url('fonts/PalatinoLinotype-Roman.woff') format('woff'),
url('fonts/PalatinoLinotype-Roman.ttf') format('truetype');
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Palatino Linotype';
src: url('fonts/PalatinoLinotype-Bold.eot');
src: url('fonts/PalatinoLinotype-Bold.eot?#iefix') format('embedded-opentype'),
url('fonts/PalatinoLinotype-Bold.woff2') format('woff2'),
url('fonts/PalatinoLinotype-Bold.woff') format('woff'),
url('fonts/PalatinoLinotype-Bold.ttf') format('truetype');
font-weight: bold;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Palatino Linotype';
src: url('fonts/PalatinoLinotype-Italic.eot');
src: url('fonts/PalatinoLinotype-Italic.eot?#iefix') format('embedded-opentype'),
url('fonts/PalatinoLinotype-Italic.woff2') format('woff2'),
url('fonts/PalatinoLinotype-Italic.woff') format('woff'),
url('fonts/PalatinoLinotype-Italic.ttf') format('truetype');
font-weight: normal;
font-style: italic;
font-display: swap;
}
@font-face {
font-family: 'Attractive';
src: url('fonts/Attractive-Regular.eot');
src: url('fonts/Attractive-Regular.eot?#iefix') format('embedded-opentype'),
url('fonts/Attractive-Regular.woff2') format('woff2'),
url('fonts/Attractive-Regular.woff') format('woff'),
url('fonts/Attractive-Regular.ttf') format('truetype');
font-weight: normal;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: 'Attractive';
src: url('fonts/Attractive-Italic.eot');
src: url('fonts/Attractive-Italic.eot?#iefix') format('embedded-opentype'),
url('fonts/Attractive-Italic.woff2') format('woff2'),
url('fonts/Attractive-Italic.woff') format('woff'),
url('fonts/Attractive-Italic.ttf') format('truetype');
font-weight: normal;
font-style: italic;
font-display: swap;
}
.text, p{
line-height: 24px
}
.text h1, .text h2, .text h3, .text h4, .text h5, .text h6{
color: #474747;
}
h1, h2, h3, h4, h5, h6{
font-family: 'Attractive', 'Lora', Arial, Helvetica, sans-serif;
color: #4362ad;
}
h1 {
font-size: 27px;
}
h2 {
font-size: 25px;
}
h3 {
font-size: 21px;
}
h4 {
font-size: 19px;
}
h5 {
font-size: 17px;
}
h6 {
font-size: 15px;
}
/*
################################################
# #
# author: webrix-studio #
# url: http://webrix-studio.com #
# #
################################################
*/
/*BODY-------------------------------------------------------------------*/
body {
background: #fff;
font-family: 'Attractive', 'Lora', 'Palatino Linotype', Arial, Helvetica, sans-serif;
font-size: 17px;
color: #5e6875;
position: relative;
font-weight: 500;
}
.wrapper{
max-width: 1570px;
margin: 0 auto;
padding: 0 20px;
}
header{
position: fixed;
top: 0px;
left: 0px;
right: 0px;
z-index: 9999;
background: #fff;
box-sizing: border-box;
}
.progress {
height: 6px;
background: rgba(250,112,18,1);
background: -moz-linear-gradient(left, rgba(250,112,18,1) 0%, rgba(59,97,174,1) 73%, rgba(59,97,174,1) 100%);
background: -webkit-gradient(left top, right top, color-stop(0%, rgba(250,112,18,1)), color-stop(73%, rgba(59,97,174,1)), color-stop(100%, rgba(59,97,174,1)));
background: -webkit-linear-gradient(left, rgba(250,112,18,1) 0%, rgba(59,97,174,1) 73%, rgba(59,97,174,1) 100%);
background: -o-linear-gradient(left, rgba(250,112,18,1) 0%, rgba(59,97,174,1) 73%, rgba(59,97,174,1) 100%);
background: -ms-linear-gradient(left, rgba(250,112,18,1) 0%, rgba(59,97,174,1) 73%, rgba(59,97,174,1) 100%);
background: linear-gradient(to right, rgba(250,112,18,1) 0%, rgba(59,97,174,1) 73%, rgba(59,97,174,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fa7012', endColorstr='#3b61ae', GradientType=1 );
}
.header-main{
height: 80px;
background: #3b62ae;
}
.header-right{
float: right;
position: relative;
margin-top: 12px;
z-index: 1000;
}
/*------------------------------ logo ---------------------------*/
.logo{
padding-top: 14px;
float: left;
}
.sticky .logo{
margin-top:0px;
}
/*---------------------------- search ------------------------------*/
.search-form{
position: absolute;
top: 25px;
left: 50%;
margin-left: -310px;
z-index: 3000;
}
.search-wrap{
width: 620px;
background: #fff;
box-sizing: border-box;
}
.search-input{
float: left;
background: none;
width: calc(100% - 105px);
border: 0px;
color: #000;
font-size: 14px;
height: 40px;
outline: none;
letter-spacing: 0.75px;
padding: 0 10px 0 18px;
box-sizing: border-box;
}
.search-submit{
display: block;
float: right;
line-height: 40px;
font-size: 15px;
text-transform: uppercase;
font-weight: bold;
color: #4362ad;
background: #f3f3f3;
width: 105px;
text-align: center;
letter-spacing: 0.75px;
box-sizing: border-box;
}
.search-submit i{
font-size: 16px;
margin-right: 2px;
color: #fa7012;
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
-o-transition: all .4s ease;
-ms-transition: all .4s ease;
transition: all .4s ease;
}
.search-submit:hover{
color: #fff;
background: #fa7012;
}
.search-submit:hover i{
color: #fff;
}
.search-input::-webkit-input-placeholder { /* WebKit, Blink, Edge */
color: #c0c0c0;
}
.search-input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #c0c0c0;
opacity: 1;
}
.search-input::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #c0c0c0;
opacity: 1;
}
.search-input:-ms-input-placeholder { /* Internet Explorer 10-11 */
color: #c0c0c0;
}
.search-input:placeholder-shown { /* Standard (https://drafts.csswg.org/selectors-4/#placeholder) */
color: #c0c0c0;
}
::-webkit-input-placeholder { /* WebKit, Blink, Edge */
color: #999;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #999;
opacity: 1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #999;
opacity: 1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
color: #999;
}
:placeholder-shown { /* Standard (https://drafts.csswg.org/selectors-4/#placeholder) */
color: #999;
}
/*--------- live search ----------*/
.fluid-menu {
top: 120%;
right: 0;
opacity: 0;
width: 100%;
visibility: hidden;
position: absolute;
text-align: left;
z-index: 9999;
background: #fff;
padding: 10px 0;
-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.10);
-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.10);
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.10);
-webkit-box-sizing: border-box;
}
.search-wrap:hover .fluid-menu {
visibility: visible;
top: 100%;
opacity: 1;
-webkit-transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out;
-o-transition: all .3s ease-in-out;
-ms-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
}
.fluid-menu h4 {
font-size: 13px;
padding-top: 13px;
padding-bottom:13px;
}
.fluid-menu .cart-pr-image{
width: 55px;
margin-right: 10px;
}
.fluid-menu .cart-pr-item{
padding: 12px 0px;
}
.fluid-menu .cart-pr-item:last-child{
border-bottom: none;
}
.fluid-menu .more{
margin-top: 0px;
text-decoration: underline;
text-transform: none;
font-size: 13px;
}
.fluid-menu .more:hover{
text-decoration: none;
}
.fluid-menu .list-btm{
padding: 8px 0px 13px;
}
/*--------- responsive search ----------*/
.search-link{
display: none;
float: right;
line-height: 34px;
height: 36px;
width: 40px;
text-align: center;
border: 1px solid #e5e5e5;
text-indent: -9999em;
font-size: 0;
position: relative;
box-sizing: border-box;
}
.s-search:before{
content: "\f002";
font-family: 'Font Awesome 5 Pro';
font-size: 16px;
position: absolute;
top: 0px;
left: 50%;
color: #000;
line-height: 34px;
font-weight: normal;
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.s-close:before {
content: "\f00d";
font-family: 'Font Awesome 5 Pro';
font-size: 16px;
position: absolute;
top: 0px;
left: 50%;
color: #000;
line-height: 34px;
font-weight: normal;
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
/*-------------------- favourite --------------------*/
.favourite{
float: left;
position: relative;
margin-right: 15px;
}
.favourite > a{
display: block;
position: relative;
color: #fff;
box-sizing: border-box;
}
.favourite > a i{
display: inline-block;
vertical-align: middle;
font-size: 18px;
color: #fff;
line-height: 46px;
width: 48px;
height: 48px;
text-align: center;
border: 1px solid rgba(255,255,255,0.5);
border-radius: 50%;
box-sizing: border-box;
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
-o-transition: all .4s ease;
-ms-transition: all .4s ease;
transition: all .4s ease;
}
.favourite > a:hover i{
background: #fa7012;
border: 1px solid #fa7012;
}
.favourite > a > span{
position: absolute;
bottom: 0px;
right: -13px;
display: block;
width: 20px;
height: 20px;
border-radius: 50%;
text-align: center;
color: #fff;
background: #fa7012;
font-size: 12px;
line-height: 20px;
}
/*-------------------- shopping cart --------------------*/
.cart{
float: left;
position: relative;
padding-bottom: 20px;
}
.cart > a{
display: block;
position: relative;
padding-left: 57px;
font-size: 15px;
color: #fff;
line-height: 48px;
}
.cart > a:before{
content: '\f07a';
font-family: 'Font Awesome 5 Pro';
position: absolute;
top: 0px;
left: 0px;
color: #fff;
font-size: 18px;
width: 48px;
height: 48px;
text-align: center;
line-height: 48px;
font-weight: 300;
background: #fa7012;
border-radius: 50%;
-webkit-transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out;
-o-transition: all .3s ease-in-out;
-ms-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
}
.cart:hover > a::before, .cart.active > a::before{
}
.cart > a > span {
position: absolute;
bottom: 0px;
left: 26px;
display: block;
width: 20px;
height: 20px;
border-radius: 50%;
text-align: center;
color: #fff;
background: #ba0510;
font-size: 12px;
line-height: 20px;
}
.cart:hover .cart-list, .cart.active .cart-list {
visibility: visible;
top: 100%;
opacity: 1;
-webkit-transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out;
-o-transition: all .3s ease-in-out;
-ms-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
}
/*---- shopping cart menu ----*/
.cart-list{
top: 120%;
right: 0;
opacity: 0;
width: 335px;
visibility: hidden;
position: absolute;
text-align: left;
z-index: 9999;
background: #fff;
padding: 0px 18px;
-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.10);
-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.10);
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.10);
-webkit-box-sizing: border-box;
}
.list-title{
color: #fa7012;
font-size: 13px;
border-bottom: 1px solid #e5e5e5;
text-align: center;
padding: 13px 0px;
font-weight: bold;
text-transform: uppercase;
}
.cart-list .list-title{
text-transform: none;
}
.cart-pr-item{
border-bottom: 1px dashed #e5e7e9;
padding: 12px 15px 12px 0px;
position: relative;
}
.cart-pr-image{
float: left;
text-align: center;
position: relative;
width: 60px;
margin-right: 15px;
}
.cart-pr-info{
overflow: hidden;
box-sizing: border-box;
}
.pr-name{
display: block;
color: #222;
font-size: 13px;
max-height: 54px;
overflow: hidden;
}
.pr-name span{
display: block;
text-transform: uppercase;
}
.cart-pr-price{
font-size: 14px;
margin-top: 4px;
color: #3b62ae;
}
.cart-pr-price strong{
margin-right: 5px;
}
.cart-pr-price strike{
color: #909090;
font-size: 11px;
}
.pr-sale .cart-pr-price strong{
color: #fa7012;
}
.cart-qty{
font-size: 11px;
color: #909090;
margin-top: 5px;
}
.cart-qty span{
color: #000;
}
.remove-from-cart{
display: block;
color: #909090;
font-size: 13px;
position: absolute;
top: 10px;
right: 0px;
z-index: 1;
}
.remove-from-cart:hover{
color: #f10505;
}
.cart-subtotal{
padding: 12px 15px;
color: #000;
line-height: 20px;
}
.cart-subtotal span{
display: block;
float: left;
font-size: 12px;
text-transform: uppercase;
}
.cart-subtotal strong{
display: block;
float: right;
font-size: 16px;
}
.list-btm{
border-top: 1px solid #ccc;
text-align: center;
padding: 13px 0px;
}
.list-btm .btn {
font-size: 12px;
margin-top: 0px;
padding: 6px 12px;
font-weight: 600;
letter-spacing: normal;
}
.cart-list .btn{
float: right;
min-width: inherit;
}
.cart-list .btn-orange{
float: left;
}
/*--------------------------- login and registration ----------------------------*/
.login{
float: left;
margin-right: 15px;
position: relative;
}
.login-choice{
display: inline-block;
font-size: 14px;
line-height: 44px;
color: #fff;
cursor: pointer;
-webkit-transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out;
-o-transition: all .3s ease-in-out;
-ms-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
box-sizing: border-box;
}
.login-choice i{
display: inline-block;
width: 48px;
height: 48px;
text-align: center;
font-size: 18px;
vertical-align: middle;
border: 1px solid rgba(255,255,255,0.5);
border-radius: 50%;
line-height: 44px;
box-sizing: border-box;
-webkit-transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out;
-o-transition: all .3s ease-in-out;
-ms-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
}
.login-choice:hover i{
background: #fa7012;
border: 1px solid #fa7012;
}
.login-list {
position: absolute;
top: 68px;
right: 0px;
display: none;
z-index: 10;
background: #fff;
width: 365px;
padding: 0px 18px;
-webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.14);
-moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.14);
box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.14);
box-sizing: border-box;
}
.login-wrap{
position: relative;
padding: 12px 6px;
}
.close-list{
position: absolute;
top: 0px;
right: 18px;
font-size: 22px;
line-height: 45px;
color: #000;
cursor: pointer;
z-index: 1;
-webkit-transition: all .4s ease-out;
-moz-transition: all .4s ease-out;
-o-transition: all .4s ease-out;
-ms-transition: all .4s ease-out;
transition: all .4s ease-out;
}
.close-list:hover{
color: #9ca0a2;
}
/*-------- login form ---------*/
.input-form {
position: relative;
border: 1px solid #e5e7e9;
color: #000;
padding-left: 34px;
background: #fff;
text-align: left;
margin-bottom: 8px;
box-sizing: border-box;
}
.input-form:after{
content: '';
position: absolute;
top: 6px;
left: 34px;
width: 1px;
height: 23px;
background: #d2d2d2;
}
.pole{
width: 100%;
height: 34px;
padding: 9px 0px 9px 13px;
font-size: 13px;
color: #000;
border: none;
outline: none;
font-family: Arial, Helvetica, sans-serif;
box-sizing: border-box;
}
.icon-01:before, .icon-02:before, .icon-03:before{
position: absolute;
font-family: 'Font Awesome 5 Pro';
top: 10px;
left: 12px;
color: #000;
font-size: 13px;
font-weight: lighter;
}
.icon-01:before{
content: '\f007';
}
.icon-02:before{
content: '\f023';
}
.login-wrap .checkbox-custom label{
font-size: 11px;
color: #818181;
letter-spacing: normal;
}
.login-wrap .checkbox-custom input[type=checkbox]+label:before{
width: 16px;
height: 16px;
margin-right: 6px;
font-size: 12px;
top: -1px;
}
.login-wrap .btn{
display: block;
font-size: 12px;
margin-top: 0px;
padding: 6px 15px;
letter-spacing: 1px;
}
.just-text{
color: #818181;
font-size: 11px;
margin-top: 5px;
font-weight: 600;
}
.login-list .just-text{
text-align: center;
}
.link{
color: #818181;
}
.link:hover{
color: #000;
text-decoration: underline;
}
/*----------------------- connect with buttons ----------------------*/
.connect-with{
margin-top: 12px;
}
.connect-with a{
display: block;
color: #fff;
padding: 5px 12px 7px;
background: #000;
font-size: 12px;
margin-bottom: 5px;
text-align: center;
}
.connect-with a i{
position: relative;
margin-right: 10px;
font-size: 15px;
top: 1px;
}
.connect-with a.btn-fb{
background: #014B96;
}
.connect-with a.btn-go{
background: #DF4A32;
}
.connect-with a.btn-tw{
background: #1DA1F2;
}
/*------------ login menu ------------*/
.login-menu{
margin: 0px;
padding: 0px;
list-style-type: none;
-webkit-columns: 2;
-moz-columns: 2;
columns: 2;
-webkit-column-gap: 24px;
-moz-column-gap: 24px;
column-gap: 24px;
}
.login-menu li{
margin-bottom: 8px;
}
.login-menu li a{
color: #595959;
font-size: 12px;
text-transform: uppercase;
border-bottom: 1px solid transparent;
}
.login-menu li a:hover{
color: #000;
border-bottom: 1px solid #000;
}
/*-------- login user name and picture ----------*/
.log-name{
text-transform: uppercase;
color: #595959;
}
.log-name img{
display: inline-block;
max-height: 40px;
margin-left: 10px;
vertical-align: middle;
}
.list-title{
font-size: 14px;
font-weight: bold;
border-bottom: 1px solid #ccc;
text-align: center;
text-transform: uppercase;
padding: 13px 0px;
}
.login-wrap .checkbox-custom label {
font-size: 11px;
color: #818181;
letter-spacing: normal;
}
.list-btm .btn {
font-size: 13px;
margin-top: 0px;
padding: 6px 12px 7px;
}
.list-btm {
border-top: 1px solid #ccc;
text-align: center;
padding: 13px 0px;
}
/*---------------------------- header contacts -------------------------*/
.header-contacts{
position: absolute;
top: 0px;
right: 20px;
background: #fff;
z-index: 2;
}
.header-contacts a{
display: inline-block;
line-height: 52px;
font-size: 12px;
text-transform: uppercase;
color: #4362ad;
font-weight: 600;
letter-spacing: 0.5px;
}
.header-contacts a img{
display: inline-block;
margin-right: 5px;
}
.header-contacts a strong{
display: inline-block;
color: #fa7012;
font-size: 28px;
line-height: 28px;
position: relative;
top: 5px;
margin-left: 5px;
}
/*---------------------------- buttons in site -------------------------*/
.btn {
display: inline-block;
min-width: 140px;
background: #3b62ae;
font-weight: bold;
font-size: 15px;
text-align: center;
line-height: normal;
text-transform: uppercase;
color: #fff;
padding: 11px 20px 12px;
border: none;
letter-spacing: 0.5px;
margin-top: 30px;
box-sizing: border-box;
position: relative;
z-index: 0;
}
.btn::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #4a79d5;
z-index: -1;
opacity: 0;
-webkit-transform: scale3d(0.7, 1, 1);
transform: scale3d(0.7, 1, 1);
transition: opacity 0.42s, -webkit-transform 0.42s;
transition: transform 0.42s, opacity 0.42s;
transition: transform 0.42s, opacity 0.42s, -webkit-transform 0.42s;
border-radius: inherit;
}
.btn:hover::before {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0) scale3d(1, 1, 1);
transform: translate3d(0, 0, 0) scale3d(1, 1, 1);
}
.btn-white {
background: #fff;
border: 1px solid #e5e5e5;
color: #3b62ae;
}
.btn-white:hover{
color: #fff;
}
.btn-white::before{
background: #3b62ae;
}
.btn-orange{
background: #fa7012;
}
.btn-orange::before{
background: #fa8d43;
}
.btn i{
margin-right: 8px;
}
.btn-place{
text-align: center;
}
.btn-view-all{
text-align: right;
margin-top: -20px;
margin-bottom: 30px;
}
.btn-view-all a{
font-size: 13px;
margin-top: 0px;
}
.btn-orange.btn-transp,
.btn-orange.btn-transp:hover{
background-color: transparent;
color: #fa8d43;
border: 1px solid #fa8d43;
}
.btn-orange.btn-transp:before{
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: transparent;
z-index: -1;
opacity: 0;
-webkit-transform: scale3d(0.7, 1, 1);
transform: scale3d(0.7, 1, 1);
transition: opacity 0.42s, -webkit-transform 0.42s;
transition: transform 0.42s, opacity 0.42s;
transition: transform 0.42s, opacity 0.42s, -webkit-transform 0.42s;
border-radius: inherit;
}
.choose-color .radio-custom input[type=radio].jq-CantOrder+label,
.choose-size .radio-custom input[type=radio].jq-CantOrder+label{
opacity: .5;
background: #eee;
background: linear-gradient(-45deg,#fafafa 0%,#fafafa 49%,#555 50%,#fafafa 51%,#fafafa 100%);
border: 1px dashed #aaa;
}
.choose-color .radio-custom input[type=radio].jq-NotAvailable+label,
.choose-size .radio-custom input[type=radio].jq-NotAvailable+label{
opacity: .5;
background: #eee;
background: linear-gradient(-45deg,#fafafa 0%,#fafafa 49%,#555 50%,#fafafa 51%,#fafafa 100%);
border: 1px dashed #999;
}
.btn.btn-hidden{
display:none;
}
.btn.active,
.button-buy.button-buy.active{
display:block;
}
/*---------~------------------------- menu ------------------------------------*/
.menu-wrap .wrapper{
position: relative;
}
#menu{
border-bottom: 2px solid #3b62ae;
}
#menu > i {
color:#3b62ae;
font-size:19px;
margin-right:10px;
}
#menu ul {
margin: 0px;
padding: 0px;
list-style: none;
position: relative;
}
#menu > ul > li {
display: block;
position: relative;
float: left;
}
#menu ul li a {
display: block;
position: relative;
white-space: nowrap;
color: #4362ad;
text-transform: uppercase;
font-size: 17px;
height: 52px;
box-sizing: border-box;
padding: 16px 18px 14px;
font-weight: bold;
vertical-align: middle;
-webkit-transform: translateZ(0);
transform: translateZ(0);
box-shadow: 0 0 1px rgba(0, 0, 0, 0);
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
-moz-osx-font-smoothing: grayscale;
overflow: hidden;
}
#menu > ul > li:hover > a, #menu > ul > li.menu-current > a, #menu > ul > li:focus > a{
color: #fff;
}
#menu > ul > li > a:before {
content: "";
position: absolute;
z-index: -1;
top: 0;
right: 0;
background: #fa7012;
width: 0;
height: 100%;
transition: all .3s cubic-bezier(.645,.045,.355,1);
}
#menu > ul > li:hover > a:before, #menu > ul > li:focus > a:before, #menu > ul > li:active > a:before {
width: 100%;
left: 0;
right: auto;
}
#menu > ul > li > a:after {
content: "";
position: absolute;
z-index: -1;
top: 25%;
right: 0;
background: #e5e4f5;
width: 1px;
height: 50%;
}
#menu > ul > li:hover > a:after, #menu > ul > li:focus > a:after, #menu > ul > li:active > a:after {
display: none;
}
#menu ul li.menuSpec > a{
padding-left: 36px;
}
.cbp-spmenu .cd-accordion-menu a.ml-5 {
padding-left: 36px;
color: #4362ad;
}
#menu ul li.menuSpec > a:after, .cbp-spmenu .cd-accordion-menu a.ml-5:after {
content: '';
position: absolute;
top: 16px;
left: 15px;
background: url(../images/door_icon1.png) no-repeat;
width: 15px;
height: 20px;
}
.cbp-spmenu .cd-accordion-menu a.ml-5:after{
top: 12px;
}
#menu ul li.menuSpec:hover > a:after{
background: url(../images/door_icon1_white.png) no-repeat;
display: inline-block;
}
/* submenu */
#menu ul li .submenu-wrap {
opacity: 0;
visibility: hidden;
position: absolute;
left: 0;
top: 100%;
background: #fff;
z-index: 4;
padding: 10px 0px;
text-align: left;
transform: translateY(-10px);
transition: transform 0.2s linear;
box-sizing: border-box;
-webkit-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.15);
-moz-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.15);
box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.15);
}
#menu ul li:hover .submenu-wrap {
transform: translateY(0);
-webkit-transition: all 350ms;
-moz-transition: all 350ms;
-o-transition: all 350ms;
transition: all 350ms;
}
#menu > ul > li:hover > .submenu-wrap {
visibility: visible;
opacity: 1;
top: 100%;
left: 0;
}
#menu ul li .submenu-wrap ul {
display: block;
width: 100%;
-webkit-column-break-inside: avoid;
page-break-inside: avoid;
break-inside: avoid;
}
#menu ul li .submenu-wrap ul li{
padding: 0 20px;
position: relative;
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
-o-transition: all .4s ease;
-ms-transition: all .4s ease;
transition: all .4s ease;
}
#menu ul li .submenu-wrap ul li:hover{
background: #f6f7f9;
}
#menu ul li .submenu-wrap ul li a{
display: block;
overflow: initial;
min-width: 180px;
padding: 8px 0px 11px 0px;
border-bottom: 1px solid #e5e5e5;
font-size: 16px;
line-height: normal;
text-transform: none;
color: #222;
font-weight: 500;
height: auto;
}
#menu ul li .submenu-wrap ul li:last-child a{
border-bottom: 1px solid transparent;
}
#menu ul li .submenu-wrap ul li:hover > a{
color: #fa7012;
}
/* sub submenu */
#menu ul li ul li .submenu-wrap {
top: -10px;
left: 100%;
}
#menu ul li ul li:hover .submenu-wrap {
left: 100%;
opacity: 1;
visibility: visible;
}
/* mega menu */
#menu ul li.mega-menu{
position: static;
}
#menu ul li.mega-menu .submenu-wrap {
right: 0;
height: 183px;
width: 600px;
padding: 20px;
-webkit-columns: 2;
-moz-columns: 2;
columns: 2;
box-sizing: border-box;
}
#menu ul li.menu-col-3 .submenu-wrap {
-webkit-columns: 3;
-moz-columns: 3;
columns: 3;
}
#menu ul li.menu-col-4 .submenu-wrap {
-webkit-columns: 4;
-moz-columns: 4;
columns: 4;
}
#menu ul li.menu-col-5 .submenu-wrap {
-webkit-columns: 5;
-moz-columns: 5;
columns: 5;
}
#menu ul li.menu-col-6 .submenu-wrap {
-webkit-columns: 6;
-moz-columns: 6;
columns: 6;
}
#menu ul li.menu-col-7 .submenu-wrap {
-webkit-columns: 7;
-moz-columns: 7;
columns: 7;
}
#menu ul li.mega-menu .submenu-wrap ul{
margin-bottom: 20px;
}
#menu ul li.mega-menu .submenu-wrap ul li{
padding: 0px;
}
#menu ul li .submenu-wrap ul li.main-cat{
/*pointer-events: none;*/
}
#menu ul li .submenu-wrap ul li.main-cat a{
position: relative;
vertical-align: top;
font-weight: bold;
color: #000;
text-transform: uppercase;
margin-bottom: 5px;
white-space: normal;
}
#menu ul li.mega-menu .submenu-wrap ul li a{
white-space: normal;
}
/*------ menu icons -------*/
#menu ul li .submenu-wrap ul li.menu123 a {
background-position:-12px -1809px;
}
#menu ul li .submenu-wrap ul li.menu124 a {
background-position:-12px -1662px;
}
#menu ul li .submenu-wrap ul li.menu125 a {
background-position:-12px -1956px;
}
#menu ul li .submenu-wrap ul li.menu126 a {
background-position:-12px -1926px;
}
#menu ul li .submenu-wrap ul li.menu127 a {
background-position:-12px -1721px;
}
#menu ul li .submenu-wrap ul li.menu128 a {
background-position:-12px -1692px;
}
#menu ul li .submenu-wrap ul li.menu129 a {
background-position:-12px -1632px;
}
#menu ul li .submenu-wrap ul li.menu130 a {
background-position:-12px -1544px;
}
#menu ul li .submenu-wrap ul li.menu131 a {
background-position:-12px -1573px;
}
#menu ul li .submenu-wrap ul li.menu132 a {
background-position:-12px -1899px;
}
#menu ul li .submenu-wrap ul li.menu133 a {
background-position:-12px -1453px;
}
#menu ul li .submenu-wrap ul li.menu134 a {
background-position:-12px -2013px;
}
#menu ul li .submenu-wrap ul li.menu123:hover a {
background-position:-12px -2369px;
}
#menu ul li .submenu-wrap ul li.menu124:hover a {
background-position:-12px -2222px;
}
#menu ul li .submenu-wrap ul li.menu125:hover a {
background-position:-12px -2516px;
}
#menu ul li .submenu-wrap ul li.menu126:hover a {
background-position:-12px -2488px;
}
#menu ul li .submenu-wrap ul li.menu127:hover a {
background-position:-12px -2281px;
}
#menu ul li .submenu-wrap ul li.menu128:hover a {
background-position:-12px -2252px;
}
#menu ul li .submenu-wrap ul li.menu129:hover a {
background-position:-12px -2192px;
}
#menu ul li .submenu-wrap ul li.menu130:hover a {
background-position:-12px -2104px;
}
#menu ul li .submenu-wrap ul li.menu131:hover a {
background-position:-12px -2133px;
}
#menu ul li .submenu-wrap ul li.menu132:hover a {
background-position:-12px -2459px;
}
#menu ul li .submenu-wrap ul li.menu133:hover a {
background-position:-12px -1308px;
}
#menu ul li .submenu-wrap ul li.menu134:hover a {
background-position:-12px -2573px;
}
/*------------------------ banner --------------------------*/
.b-wrap{
position: relative;
overflow: hidden;
z-index: 1;
background: #f6f7f9 url('../images/bgr1.jpg') no-repeat center top;
padding: 20px 0px;
}
.sidebar-menu-title{
background: #e5e4f5;
font-size: 19px;
text-transform: uppercase;
font-weight: 600;
color: #4362ad;
height: 55px;
line-height: 55px;
}
/* about menu trigger */
.trigger-wrap{
float: left;
background: #4362ad;
width: 55px;
height: 55px;
margin-right: 15px;
padding-left: 13px;
box-sizing: border-box;
}
.menu-trigger {
width: 14px;
height: 2px;
background-color: #fff;
display: inline-block;
position: relative;
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
-o-transition: all .4s ease;
-ms-transition: all .4s ease;
transition: all .4s ease;
top: -5px;
}
.trigger-wrap>span>i {
color: #fff;
font-size: 22px;
left: 5px;
position: relative;
}
.menu-trigger:before {
content: '';
width: 30px;
height: 2px;
background-color: #fff;
display: inline-block;
position: absolute;
top: -7px;
left: 0;
}
.menu-trigger:after {
content: '';
width: 22px;
height: 2px;
background-color: #fff;
display: inline-block;
position: absolute;
top: 7px;
left: 0;
}
.index-sidebar-menu{
position: relative;
z-index: 100;
background: #fff;
float: left;
width: 270px;
margin-bottom: 0px;
padding: 0px;
}
.index-sidebar-menu.internal{
float: none;
margin-bottom: 30px;
width: auto;
}
.index-sidebar-menu ul a {
border-bottom: 1px solid #e5e4f5;
}
.index-sidebar-menu ul {
margin: 0px;
padding: 8px 0px;
list-style-type: none;
max-height: 3500px;
overflow-y: auto;
}
.index-sidebar-menu ul a {
position: relative;
display: block;
font-size: 17px;
color: #222222;
font-weight: 500;
line-height: 33px;
padding: 0 20px;
white-space: nowrap;
cursor: pointer;
-webkit-transition: all 400ms;
-moz-transition: all 400ms;
-o-transition: all 400ms;
transition: all 400ms;
}
.index-sidebar-menu ul li:hover > a, .sidebar-menu ul li.current > a, .index-sidebar-menu ul li.current-li > a
{
color: #fa7012;
}
.index-sidebar-menu ul li a.dropdown-toggle:after{
content: '\f0da';
font-family: 'Font Awesome 5 Pro';
font-size: 14px;
font-weight: bold;
position: absolute;
top: 50%;
right: 10px;
color: #959490;
line-height: 14px;
margin-top: -7px;
opacity: 0;
-webkit-transition: all 400ms;
-moz-transition: all 400ms;
-o-transition: all 400ms;
transition: all 400ms;
}
.index-sidebar-menu ul li:hover a.dropdown-toggle:after{
opacity: 1;
}
.index-sidebar-menu ul li .right-submenu{
opacity: 0;
visibility: hidden;
position: absolute;
left: 100%;
top: 0px;
bottom: 0px;
padding: 25px 10px 25px 30px;
background: #fff;
z-index: 4;
min-width: 255px;
transform: translateX(-10px);
transition: transform 0.2s linear;
box-sizing: border-box;
-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.15);
-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.15);
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.15)
}
.index-sidebar-menu ul li:hover .right-submenu {
transform: translateY(0);
-webkit-transition: all 350ms;
-moz-transition: all 350ms;
-o-transition: all 350ms;
transition: all 350ms;
}
.index-sidebar-menu ul li:hover > .right-submenu {
visibility: visible;
opacity: 1;
left: 100%;
}
.index-sidebar-menu ul li .right-submenu h4{
white-space: nowrap;
margin-bottom: 20px;
color: #fa7012;
font-size: 21px;
}
.index-sidebar-menu ul li .right-submenu .break-menu-wrap{
height: 88%;
-webkit-columns: 1;
-moz-columns: 1;
columns: 1;
}
.index-sidebar-menu ul li .right-submenu ul{
display: block;
width: 100%;
padding: 0px;
-webkit-column-break-inside: avoid;
page-break-inside: avoid;
break-inside: avoid;
}
.index-sidebar-menu ul li .right-submenu ul li a{
padding: 5px 40px 5px 20px;
line-height: normal;
}
.index-sidebar-menu ul li .right-submenu ul li a::before{
content: '•';
position: absolute;
top: 4px;
left: 0px;
}
.fade{
float: right;
width: calc(100% - 300px);
z-index: 10;
height: 100%;
position: relative;
}
.fade .slick-list, .fade .slick-track{
height: 100%;
}
.fade .slick-dots{
position: absolute;
bottom: 0px;
left: 0px;
margin-bottom: 25px;
text-align: right;
padding-right: 40px;
box-sizing: border-box;
}
.fade .slick-dots li button{
width: 11px;
height: 11px;
background: #fff;
}
.fade .slick-dots li.slick-active button{
background: #4362ad;
}
.ban-parallax {
width: 100%;
height: 100%;
box-sizing: border-box;
}
/*---------------------------------- index right part instead banner ---------------------------------*/
.index-right-part{
float: right;
width: calc(100% - 300px);
z-index: 10;
height: 100%;
position: relative;
}
/*---------------------------------- section delivery ---------------------------------*/
.delivery{
padding: 8px 0px;
margin-bottom: 20px;
overflow: hidden;
background: #fff;
}
.delivery-one{
float: left;
width: 25%;
padding: 0 10px;
color: #959494;
font-size: 14px;
box-sizing: border-box;
}
.delivery-one figure{
float: left;
line-height: 36px;
margin:0 10px 0px 0;
}
.delivery-one figure img{
max-height: 36px;
}
.delivery-one h4{
color: #4362ad;
font-size: 14px;
text-transform: uppercase;
font-weight: 600;
}
/*---------------------------------- section accents ---------------------------------*/
.accents{
position: relative;
overflow: hidden;
}
.acc-wrap{
margin: 0 -10px;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.acc-one{
width: 20%;
padding: 10px;
text-align: center;
box-sizing: border-box;
}
.acc-one img{
webkit-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-transition: all 400ms;
-moz-transition: all 400ms;
-o-transition: all 400ms;
transition: all 400ms;
}
.acc-one:hover img{
-webkit-transform: scale3d(1.05,1.05,1);
transform: scale3d(1.05,1.05,1);
}
/*---------------------------------- book on the month ---------------------------------*/
.book-month{
position: relative;
float: left;
width: 25%;
background: #fff;
padding: 13px 13px 0px;
box-sizing: border-box;
}
.book-month .title{
position: relative;
z-index: 2;
padding-left: 37px;
}
.book-month .title:before{
content: '';
position: absolute;
top: -13px;
left: -13px;
bottom: -13px;
right: -13px;
background: #14579C;
opacity: 0;
z-index: -1;
}
.book-month .title img{
position: absolute;
top: -2px;
left: 0px;
}
.book-month .title h2, .book-month .title h2 a{
color: #fa7012;
}
.book-month .products-wrap{
position: relative;
z-index: 2;
}
.book-month .product-box{
width: 100%;
display: block;
margin-right: 0px;
margin-bottom: 0px;
}
.book-month .product-box > div{
border: 2px solid #fa7012;
-webkit-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2);
box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2);
}
.book-month .product-box:hover > div:first-child{
-webkit-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0);
-moz-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0);
box-shadow: 0px 0px 15px 0px rgba(0,0,0,0);
}
/*---------------------------------- section most wanted products ---------------------------------*/
.flex-ban{
display: flex;
flex-wrap: wrap;
align-items: stretch;
}
.most-wanted{
float: right;
width: 75%;
background: #fff;
position: relative;
padding: 13px 13px 0px;
box-sizing: border-box;
}
.most-wanted .title{
position: relative;
margin-right: 95px;
padding-left: 34px;
}
.most-wanted .title img{
position: absolute;
top: -2px;
left: 0px;
}
.most-wanted .btn-view-all{
margin-bottom: 0px;
}
.wanted-pr-slider{
margin: 0 -15px;
}
.wanted-pr-slider .slick-next, .wanted-pr-slider .slick-prev{
width: 37px !important;
height: 37px !important;
margin-top: -19px !important;
border: 1px solid #f1f1f1 !important;
}
.wanted-pr-slider .slick-prev:before, .wanted-pr-slider .slick-next:before {
font-size: 22px !important;
line-height: 37px !important;
}
.wanted-pr-slider .slick-prev{
top: -35px !important;
left: auto !important;
right: 53px !important;
}
.wanted-pr-slider .slick-next{
top: -35px !important;
right: 8px !important;
}
.wanted-pr-slider.slick-slider .product-box{
margin-bottom: 45px;
}
/*---------------------------------- section new products ---------------------------------*/
.new-products{
overflow: hidden;
padding: 45px 0px 0px;
}
.new-products .wrapper{
border-bottom: 4px solid #f0f0f0;
}
/*---------------------------------- section choosen products ---------------------------------*/
.choosen-products{
background: #f6f7f9;
overflow: hidden;
padding: 30px 0px 10px;
}
.title{
text-transform: uppercase;
margin-bottom: 25px;
}
.orange-title{
color: #fa7012;
}
.choosen-products .title h1{
font-size: 24px;
}
.fl-left h1, .fl-left h2, .fl-left h3{
float: left;
margin-top: 3px;
}
.slick-slider .product-box {
display: block;
width: auto;
margin-right: 0px;
margin-bottom: 55px;
min-width: 230px;
}
.products-wrap{
margin: 0px -15px;
}
.product-box {
display: inline-table;
vertical-align: top;
width: 25%;
padding: 0px 15px;
margin-right: -4px;
margin-bottom: 25px;
position: relative;
box-sizing: border-box;
}
.product-box:hover{
position: relative;
z-index: 5;
}
.product-box > div{
position: relative;
padding: 15px 10px;
border: 2px solid #dbdbdb;
background: #fff;
}
.pr-image{
position: relative;
overflow: hidden;
text-align: center;
line-height: 210px;
height: 210px;
margin-bottom: 10px;
z-index: 2;
}
.pr-image > a{
display: block;
}
.pr-image img {
display: inline-block !important;
max-height: 210px;
}
.pr-image figcaption{
position: absolute;
bottom: 5px;
right: 0px;
overflow: hidden;
line-height: normal;
}
.heart-icon, .view-icon, .compare-icon {
display: block;
color: #3b62ae;
background: #dde7fa;
font-size: 16px;
height: 40px;
width: 40px;
margin-top: 5px;
text-align: center;
border-radius: 50%;
box-sizing: border-box;
opacity: 0;
visibility: hidden;
-webkit-transform: translateX(60px);
-moz-transform: translateX(60px);
-ms-transform: translateX(60px);
-o-transform: translateX(60px);
transform: translateX(60px);
}
.price-inner .heart-icon {
visibility: visible;
opacity: 1;
position: absolute;
top: 52px;
right: 58px;
}
.view-icon{
-webkit-transition: all 0.3s ease .1s;
-moz-transition: all 0.3s ease .1s;
-o-transition: all 0.3s ease .1s;
transition: all 0.3s ease .1s;
}
.compare-icon{
-webkit-transition: all 0.3s ease .2s;
-moz-transition: all 0.3s ease .2s;
-o-transition: all 0.3s ease .2s;
transition: all 0.3s ease .2s;
}
.heart-icon{
-webkit-transition: all 0.3s ease .3s;
-moz-transition: all 0.3s ease .3s;
-o-transition: all 0.3s ease .3s;
transition: all 0.3s ease .3s;
}
.product-box:hover .heart-icon, .product-box:hover .view-icon, .product-box:hover .compare-icon{
opacity: 1;
visibility: visible;
-webkit-transform: translateX(0);
-moz-transform: translateX(0);
-ms-transform: translateX(0);
-o-transform: translateX(0);
transform: translateX(0);
}
.heart-icon i, .view-icon i, .compare-icon i{
display: block;
line-height: 40px;
}
.heart-full i.far, .heart-full i.fal{
font-weight: bold !important;
color: #3b62ae;
}
.heart-icon:hover, .view-icon:hover, .compare-icon:hover{
background: #3b62ae;
color: #fff;
}
.heart-icon.heart-full:hover i.far, .heart-icon.heart-full:hover i.fal{
color: #fff;
-webkit-transition: all .4s ease-out;
-moz-transition: all .4s ease-out;
-o-transition: all .4s ease-out;
-ms-transition: all .4s ease-out;
transition: all .4s ease-out;
}
.pr-info{
text-align: center;
position: relative;
z-index: 2;
}
.pr-title {
display: block;
font-size: 16px;
color: #5b5a6b;
font-weight: bold;
line-height: 20px;
margin-bottom: 8px;
min-height: 80px;
}
.product-box:hover .pr-title{
color: #1d1b59;
}
.signature{
position: absolute !important;
bottom: 0px;
left: 0px;
cursor: pointer;
}
.new-price {
display: inline-block;
font-size: 20px;
color: #3b62ae;
font-weight: bold;
}
.old-price {
display: inline-block;
color: #666666;
font-size: 16px;
text-decoration: line-through;
margin-left: 5px;
}
.pr-sale .new-price{
color: #fa7012;
}
.pr-bottom {
display: block;
position: absolute !important;
top: 0px;
left: 15px;
right: 15px;
height: calc(100% + 38px);
text-align: center;
opacity: 0;
visibility: hidden;
z-index: 0;
box-sizing: border-box;
background: transparent;
-moz-transition: all .2s ease-out;
-o-transition: all .2s ease-out;
-ms-transition: all .2s ease-out;
transition: all .2s ease-out;
}
.product-box:hover .pr-bottom {
opacity: 1;
visibility: visible;
background: #fff;
-webkit-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2);
box-shadow: 0px 0px 15px 0px rgba(0,0,0,0.2);
}
.pr-bottom > div {
position: absolute;
bottom: 10px;
left: 10px;
right: 10px;
box-sizing: border-box;
}
.pr-btn {
display: block;
font-size: 13px;
text-align: center;
line-height: normal;
text-transform: uppercase;
background: #1d1b59;
font-weight: bold;
letter-spacing: 1px;
color: #fff;
padding: 9px 15px;
box-sizing: border-box;
transform: scale(0);
-moz-transform: scale(0);
-webkit-transform: scale(0);
-o-transform: scale(0);
transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
}
.product-box:hover .pr-btn {
transform: scale(1);
-moz-transform: scale(1);
-webkit-transform: scale(1);
-o-transform: scale(1);
}
.pr-btn i{
color: #fa7012;
margin-right: 10px;
font-size: 15px;
transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-webkit-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
}
.pr-btn:hover{
background: #fa7012;
}
.pr-btn:hover i{
color: #fff;
}
/*---------------- fast view popup ---------------*/
.popup{
display: none;
max-width: 800px;
max-height: calc(100vh - 150px);
overflow: auto;
}
.fast-view-pr-image{
float: left;
width: 36%;
padding-right: 25px;
text-align: center;
box-sizing: border-box;
}
.fast-view-pr-info{
overflow: hidden;
}
.fast-view-pr-info .heading{
font-size: 20px;
margin-top: 10px;
}
.fast-view-pr-info .price-inner{
margin-bottom: 0px;
}
.fast-view-pr-info .choose-size-select .input-place{
width: auto;
margin-bottom: 0px;
}
.fast-view-pr-info .buy-wrap .btn{
float: none;
width: auto;
margin-right: 0px;
display: block;
margin-top: 0px;
}
.fast-view-pr-info .just-text{
margin-top: 10px;
font-size: 13px;
text-decoration: underline;
text-align: center;
}
/*---------------- ribbons ---------------*/
.ribbons{
position: absolute;
top: 10px;
left: 10px;
z-index: 3;
text-align: left;
line-height: normal;
box-sizing: border-box;
}
.ribbons > span{
display: inline-block;
position: relative;
background: #fa7012;
font-size: 11px;
font-weight: bold;
text-transform: uppercase;
color: #fff;
text-align: center;
padding: 0px 6px 0px 10px;
height: 22px;
line-height: 22px;
margin-bottom: 2px;
box-sizing: border-box;
}
.ribbons > span::after{
content: '';
width: 0;
height: 0;
border-bottom: 11px solid #fa7012;
border-top: 11px solid #fa7012;
border-right: 8px solid transparent;
position: absolute;
top: 0px;
right: -8px;
}
.ribbons > span.pr-sale{
background: #ee0000;
}
.ribbons > span.pr-sale::after{
border-bottom: 11px solid #ee0000;
border-top: 11px solid #ee0000;
}
.ribbons > span.pr-top{
background: #3b62ae;
}
.ribbons > span.pr-top::after{
border-bottom: 11px solid #3b62ae;
border-top: 11px solid #3b62ae;
}
/*----------------- star rating ----------------*/
.star {
display: inline-block;
background: url(../images/stars-sprite.png) no-repeat 0 -19px;
height: 17px;
width: 105px;
}
.star-sprite {
background: url(../images/stars-sprite.png) no-repeat 0 0;
height: 17px;
width: 0px;
}
.product-box .rating-wrap{
line-height: 16px;
}
.product-box .star{
background: url(../images/stars-sprite1.png) no-repeat 0 -11px;
width: 60px;
height: 10px;
}
.product-box .star-sprite{
background: url(../images/stars-sprite1.png) no-repeat 0 0px;
width: 0px;
height: 10px;
}
/** * Tooltip Styles */
[data-tooltip]{
position: relative;
cursor: pointer;
}
[data-tooltip]:before {
z-index: 1001;
border: 4px solid transparent;
margin-left: -4px;
margin-bottom: 0px;
border-top-color: #000;
border-top-color: hsla(0, 0%, 20%, 0.9);
background: transparent;
content: "";
position: absolute;
bottom: 100%;
left: 50%;
visibility: hidden;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
opacity: 0;
-webkit-transition: all 400ms;
-moz-transition: all 400ms;
-o-transition: all 400ms;
transition: all 400ms;
pointer-events: none;
}
[data-tooltip]:after{
z-index: 1000;
width: 76px;
margin-left: -38px;
margin-bottom: 8px;
padding: 5px;
text-align: center;
background-color: #000;
background-color: hsla(0, 0%, 20%, 0.9);
border-radius: 3px;
color: #fff;
content: attr(data-tooltip);
font-size: 10px;
font-family: 'Lora', 'Palatino Linotype', Arial, Helvetica, sans-serif;
line-height: normal;
position: absolute;
bottom: 100%;
left: 50%;
visibility: hidden;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
opacity: 0;
-webkit-transition: all 400ms;
-moz-transition: all 400ms;
-o-transition: all 400ms;
transition: all 400ms;
pointer-events: none;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}
[data-tooltip]:hover:before,
[data-tooltip]:hover:after,
[data-tooltip]:focus:before,
[data-tooltip]:focus:after{
visibility: visible;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
opacity: 1;
}
/*---------------------------------- section promo products ---------------------------------*/
.promo-products{
overflow: hidden;
padding: 45px 0px 10px;
}
.promo-products .title h2, .promo-products .title h2 a{
color: #fa7012;
}
/*---------------------------------- section video reviews ---------------------------------*/
.video-reviews{
padding: 60px 0px;
overflow: hidden;
background: #f6f7f9 url('../images/bgr2.jpg') no-repeat center top;
}
.video-reviews .btn-view-all{
text-align: left;
margin-top: 30px;
margin-bottom: 0px;
}
.video-wrap{
margin: 0 -15px;
}
.video-item{
display: inline-table;
vertical-align: top;
margin-right: -4px;
width: 25%;
box-sizing: border-box;
}
.video-item > div{
padding: 15px;
box-sizing: border-box;
position: relative;
}
.video-item figure{
overflow: hidden;
position: relative;
margin-bottom: 15px;
}
.video-item figure img{
max-width: none;
width: 100%;
}
.video-item figure::before {
position: absolute;
top: 50%;
left: 50%;
z-index: 2;
display: block;
content: '';
width: 0;
height: 0;
background: rgba(29, 27, 90, 0.1);
background: rgba(255, 103, 0, 0.1);
background: rgba(255,255,255,.1);
border-radius: 100%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
opacity: 0;
}
.video-item:hover figure:before {
-webkit-animation: newcircle .75s;
animation: newcircle .75s;
}
.video-play-icon{
display: block;
position: absolute;
top: 50%;
left: 50%;
width: 40px;
height: 40px;
line-height: 40px;
margin-top: -20px;
margin-left: -20px;
text-align: center;
color: #fff;
border: 1px solid #fff;
border-radius: 50%;
background: rgba(0,0,0,0.4);
font-size: 15px;
text-indent: 1px;
box-sizing: border-box;
}
.video-item-info{
box-sizing: border-box;
overflow: hidden;
}
.video-item-title{
color: #1d1b59;
display: block;
font-size: 19px;
overflow: hidden;
margin-bottom: 12px;
}
.reviews-wrap{
margin: 0px -15px;
padding: 0px;
list-style-type: none;
}
.reviews-wrap li{
float: left;
width: 25%;
padding: 0 15px;
box-sizing: border-box;
}
.reviews-wrap li .video-item{
width: auto;
display: block;
margin-right: 0px;
}
.reviews-wrap li .video-item > div{
padding: 0px;
}
.review-text{
line-height: 24px;
}
.reviews-wrap li:nth-child(1){
width: 50%;
height: 225px;
}
.reviews-wrap li:nth-child(2){
float: right;
width: 50%;
}
.reviews-wrap li:nth-child(2) .video-item-title{
font-size: 27px;
}
/*---------------------------------- section index news ---------------------------------*/
.index-news{
padding: 50px 0px;
overflow: hidden;
}
.index-news .btn-view-all{
margin-top: 20px;
margin-bottom: 0px;
}
.news-wrap{
margin: 0 -15px;
}
.blog-item{
display: inline-table;
vertical-align: middle;
margin-right: -4px;
width: 25%;
padding: 0px 15px;
margin-bottom: 15px;
position: relative;
box-sizing: border-box;
}
.news-wrap .blog-item {
vertical-align: top;}
.b-img{
position: relative;
overflow: hidden;
margin-bottom: 15px;
}
.b-img img{
max-width: none;
width: 100%;
-webkit-transition: all 400ms;
-moz-transition: all 400ms;
-o-transition: all 400ms;
transition: all 400ms;
}
.b-img::before {
position: absolute;
top: 50%;
left: 50%;
z-index: 2;
display: block;
content: '';
width: 0;
height: 0;
background: rgba(29, 27, 90, 0.1);
background: rgba(255, 103, 0, 0.1);
background: rgba(255,255,255,.1);
border-radius: 100%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
opacity: 0;
}
.blog-item:hover .b-img:before {
-webkit-animation: newcircle .75s;
animation: newcircle .75s;
}
@keyframes newcircle {
0% {
opacity: 1;
}
40% {
opacity: 1;
}
100% {
width: 50%;
height: 73%;
opacity: 0;
}
}
.blog-title{
display: block;
color: #1d1b59;
font-size: 19px;
margin-bottom: 12px;
-webkit-transition: all .4s ease;
-moz-transition: all .4s ease;
-o-transition: all .4s ease;
-ms-transition: all .4s ease;
transition: all .4s ease;
}
.blog-item:hover .blog-title{
color: #14579c;
}
/*------------------ date and share -------------------*/
.date, .time, .people-share{
display: inline-block;
font-size: 14px;
color: #777777;
margin-right:10px;
}
.top-new{
margin-bottom: 0px;
padding-bottom: 0px;
border-bottom: none;
}
.top-new .blog-title{
font-size: 30px;
}
.featured-right .blog-title{
font-size: 18px;
font-weight: 600;
}
.date-and-share .date {
float: right;
}
.date-and-share .share-btns {
display: inline-block;
}
/*----------------------------------- simple banner -------------------------------*/
.simple-ban{
margin-bottom: 25px;
}
/*------------------------------------------------ footer ---------------------------------------------*/
footer{
border-top: 5px solid #3b62ae;
overflow: hidden;
background: #375ca3 url('../images/footer_bgr.jpg') repeat-x left bottom;
position: relative;
z-index: 2;
}
.footer-top{
background: #fff;
padding: 24px 0px;
margin-bottom: 40px;
position: relative;
z-index: 3;
}
.auth {
position: absolute;
z-index: 1;
left: 0;
top: 5px;
}
.footer-logo {
float: left;
display: block;
}
/*--------- footer socials -----------*/
.footer-socials{
float: left;
line-height: 57px;
margin-left: 230px;
font-size: 15px;
}
.footer-socials a{
display: inline-block;
vertical-align: middle;
color: #3b62ae;
font-size: 32px;
margin-left: 10px;
}
.footer-socials a:hover{
color: #1d1b59;
}
/*--------- design by -----------*/
.design-by{
float: right;
line-height: 57px;
font-size: 15px;
}
.design-by a{
display: inline-block;
margin-left: 10px;
}
/*--------- footer contacts -----------*/
.footerContats {
float:left;
width: 27%;
margin-bottom: 20px;
}
.footBox {
margin-bottom: 25px;
}
.footBox i {
float: left;
margin-right:10px;
font-size:38px;
color: #c1cce0;
}
.footBoxCont {
overflow: hidden;
color: #c1cce0;
font-size: 15px;
}
.footBox a {
font-size: 25px;
color: #fff;
display: block;
text-decoration: none;
}
/*----------------------- subscribe ---------------------*/
.subscribe{
padding: 30px 80px 30px 0px;
}
.subs-title{
margin-bottom: 20px;
font-size: 22px;
color: #fff;
letter-spacing: 0.5px;
}
.subscribe .text{
color: #c1cce0;
font-size: 15px;
font-weight: 300;
margin-bottom: 25px;
}
.subs-input {
background: none;
width: 100%;
border: 0px;
background: #fff;
color: #fff;
font-size: 14px;
height: 50px;
padding: 0 15px;
font-family: 'OpenSans', 'Open Sans', Arial, Helvetica, sans-serif;
outline: none;
box-sizing: border-box;
}
.subs-input::-webkit-input-placeholder { /* WebKit, Blink, Edge */
color: #a6a6a6;
}
.subs-input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #a6a6a6;
opacity: 1;
}
.subs-input::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #a6a6a6;
opacity: 1;
}
.subs-input:-ms-input-placeholder { /* Internet Explorer 10-11 */
color: #a6a6a6;
}
.subs-input:placeholder-shown { /* Standard (https://drafts.csswg.org/selectors-4/#placeholder) */
color: #a6a6a6;
}
.subscribe .btn{
margin-top: 10px;
}
.footer-flex {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-justify-content: space-between;
-ms-flex-pack: space-between;
justify-content: space-between;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
box-sizing: border-box;
float:right;
width: 73%;
}
.flex-item {
-webkit-box-flex: none;
-webkit-flex: none;
-ms-flex: none;
flex: none;
box-sizing: border-box;
margin-bottom: 30px;
}
.footer-title{
margin-bottom: 20px;
font-size: 23px;
color: #fff;
letter-spacing: 0.5px;
}
/*---------------- footer menu ----------------*/
.footer-menu{
float: left;
margin-right: 40px;
}
.footer-menu ul {
margin: 0px;
padding: 0px;
list-style-type: none;
}
.footer-menu ul li {
margin-bottom: 9px;
}
.footer-menu ul li a {
font-size: 16px;
color: #c1cce0;
}
.footer-menu ul li a:hover{
color: #fff;
}
/*--------------- footer accordion transformation in mobile -----------------*/
.foot-btn{
background: rgba(236,236,236,0.20);
cursor: pointer;
padding: 10px;
margin-bottom: 5px;
line-height: normal;
}
.foot-content {
height:auto;
width:100%;
margin:0 auto;
overflow:hidden;
background: transparent;
position: relative;
}
.foot-open {
height: auto;
}
/*------------------- footer bottom ---------------------*/
.footer-btm {
padding: 22px 0;
border-top: 1px solid rgba(255,255,255,0.2);
}
.rights{
color: rgba(255,255,255,0.3);
font-size: 13px;
}
/*--------------- page top button -----------------*/
.page-top{
visibility: hidden;
opacity: 0;
position: fixed;
bottom: 20px;
right: 20px;
display: block;
width: 40px;
height: 40px;
background: #fff;
border: 1px solid #b3b3b3;
color: #000;
text-align: center;
font-size: 16px;
line-height: 39px;
z-index: 100;
}
.page-top:hover,
.page-top:focus{
background: #3b62ae;
border: 1px solid #3b62ae;
color: #fff;
}
.page-top.page-top-show{
visibility: visible;
opacity: 1;
}
/*------------------------------------------- content ---------------------------------------*/
.content{
padding-top: 141px;
padding-bottom: 20px;
overflow: hidden;
}
.main-part{
float: left;
width: calc(100% - 340px);
}
.sidebar-left{
float: left;
width: 300px;
margin-right: 40px;
}
.sidebar-title{
text-transform: uppercase;
margin-bottom: 15px;
}
.right-part{
float: right;
width: 300px;
}
.text-module{
margin-bottom: 30px;
}
.view {
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
font-size: 0px;
opacity: 0;
z-index: 5;
}
/*--------------- breadcrumb -----------------*/
.breadcrumb{
color: #1d1b59;
font-size: 14px;
line-height: 18px;
margin-bottom: 20px;
margin-top: 10px;
}
.breadcrumb a{
color: #1d1b59;
}
.breadcrumb a:hover{
color: #1d1b59;
text-decoration: underline;
}
/*-------------------------------------- products page -------------------------------------*/
.red-text{
color: #ff3366;
}
/*--------------- sort by -----------------*/
.sort-wrap{
margin-bottom: 30px;
position: relative;
background: #f6f7f9;
padding: 10px;
}
.how-many{
float: right;
font-size: 13px;
color: #a3a3a3;
line-height: 40px;
}
.sort-float{
float: left;
margin-right: 40px;
}
.sort-float label{
float: left;
display: block;
font-size: 14px;
line-height: 40px;
margin-right: 12px;
color: #aaa;
}
.field-right{
float: left;
}
.styled-select {
width: 100%;
height: 40px;
position: relative;
overflow: hidden;
background: #fff;
border: 1px solid #D5D5D5;
box-sizing: border-box;
}
.styled-select select {
background: transparent;
width: 110%;
padding: 0px 10px;
height: 38px;
border: 0;
border-radius: 0;
-webkit-appearance: none;
color: #808080;
font-size: 15px;
font-family: 'Attractive', 'Lora', 'Palatino Linotype', Arial, Helvetica, sans-serif;
outline: none;
position: relative;
z-index: 1;
}
.styled-select:after {
content: '\f107';
font-family: 'Font Awesome 5 Pro';
color: #1E1E1E;
font-size: 16px;
position: absolute;
top: 50%;
right: 10px;
font-weight: normal;
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
z-index: 0;
}
.sw-1{
width: 90px;
}
.sw-2{
width: 190px;
}
/*-------------------- sidebar menu ----------------------*/
.sidebar-menu{
margin-bottom: 35px;
border: 3px solid #7691c6;
}
.sidebar-menu .cd-accordion-menu {
background-color:#FFFFFF;
margin: 0px;
padding: 0px;
list-style-type: none;
}
.sidebar-menu .cd-accordion-menu ul {
display: none;
margin: 0px;
padding: 0px;
list-style-type: none;
}
.sidebar-menu .cd-accordion-menu li {
position: relative;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.sidebar-menu .cd-accordion-menu a {
position: relative;
display: block;
font-size: 17px;
color: #1d1b59;
padding: 22px 0px 22px 50px;
line-height: 18px;
font-weight: bold;
cursor: pointer;
box-shadow: inset 0 -1px #EBEBEB;
-webkit-transition: all 400ms;
-moz-transition: all 400ms;
-o-transition: all 400ms;
transition: all 400ms;
}
.sidebar-menu .cd-accordion-menu li:hover > a,
.sidebar-menu .cd-accordion-menu li:focus > a{
color: #00A7E3;
}
.sidebar-menu .cd-accordion-menu li.sidebar-current a, .sidebar-menu .cd-accordion-menu li.sidebar-current a i{
color: #00A7E3;
}
.sidebar-menu .cd-accordion-menu a i {
position: absolute;
left: 20px;
color: #1d1b59;
font-size: 19px;
}
.sidebar-menu .cd-accordion-menu input[type=checkbox] {
/* hide native checkbox */
position: absolute;
opacity: 0;
top: 0px;
right: 0px;
}
.sidebar-menu .cd-accordion-menu label {
position: absolute;
top: 0px;
right: 0px;
display: block;
font-size: 0px;
color: #000;
text-transform: uppercase;
height: 62px;
/*width: 30px;*/
width: 100%;
cursor: pointer;
z-index: 1;
-webkit-transition: all 400ms;
-moz-transition: all 400ms;
-o-transition: all 400ms;
transition: all 400ms;
}
.sidebar-menu .cd-accordion-menu label:before {
/* icons */
content: '\f105';
font-family: 'Font Awesome 5 Pro';
color: #aaa;
font-size: 22px;
font-weight: lighter;
display: inline-block;
position: absolute;
top: 50%;
right: 10px;
width: 20px;
height: 20px;
text-align: center;
line-height: 20px;
z-index: 2;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
}
.sidebar-menu .cd-accordion-menu input[type=checkbox]:checked + label::before {
/* rotate arrow */
-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);
}
.sidebar-menu .cd-accordion-menu label:after {
content: '';
display: block;
position: absolute;
top: 50%;
width: 20px;
height: 20px;
background: #fff;
right: 10px;
z-index: 1;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
}
.sidebar-menu .cd-accordion-menu input[type=checkbox]:checked + label + ul,
.sidebar-menu .cd-accordion-menu input[type=checkbox]:checked + label:nth-of-type(n) + ul {
/* use label:nth-of-type(n) to fix a bug on safari (<= 8.0.8) with multiple adjacent-sibling selectors*/
/* show children when item is checked */
display: block;
}
.sidebar-menu .cd-accordion-menu ul a {
box-shadow: inset 0 -1px #e5e5e5;
padding: 15px 0px 15px 50px;
font-weight: normal;
color: #333;
text-transform: none;
}
.sidebar-menu .cd-accordion-menu ul label{
height: 39px;
}
.sidebar-menu .cd-accordion-menu ul ul a {
padding-left: 40px;
}
.sidebar-menu .cd-accordion-menu ul ul ul a {
padding-left: 50px;
}
.sidebar-menu .cd-accordion-menu.animated label:before {
/* this class is used if you're using jquery to animate the accordion */
-webkit-transition: -webkit-transform 0.3s;
-moz-transition: -moz-transform 0.3s;
transition: transform 0.3s;
}
/*---------------------------------- sidebar-menu-shop -------------------------------------*/
.sidebar-menu.sidebar-menu-shop{
border: none;
}
.sidebar-menu.sidebar-menu-shop .cd-accordion-menu a{
font-weight: normal;
font-size: 16px;
box-shadow: none;
padding: 6px 0 6px 28px;
color: #111;
}
.sidebar-menu.sidebar-menu-shop .cd-accordion-menu li:hover > a, .sidebar-menu.sidebar-menu-shop .cd-accordion-menu li:focus > a{
color: #fa7012;
}
.sidebar-menu.sidebar-menu-shop .cd-accordion-menu a:before {
content: '\f111';
font-family: 'Font Awesome 5 Pro';
color: #e5e7e9;
font-size: 20px;
font-weight: 100;
display: inline-block;
position: absolute;
top: 50%;
left: -2px;
text-align: center;
line-height: 20px;
z-index: 2;
-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);
}
.sidebar-menu.after-search{
border: none;
}
/*---------------------------------- filters -------------------------------------*/
.filter-wrap{
margin-bottom: 30px;
}
.filter-wrap .title h3{
color: #000;
}
.filter-wrap-one{
margin-bottom: 35px;
}
.filter-container h5{
float: left;
font-size: 20px;
text-transform: uppercase;
}
.filter-margin{
margin-top: 20px;
}
.filter-margin > div.demo-output {
overflow: visible;
padding-bottom: 30px;
}
.demo-output {
padding-top: 20px !important;
}
.cancel{
margin-top: 5px;
}
.cancel a{
display: inline-block;
font-size: 12px;
color: #dc2b19;
border-bottom: 1px solid #dc2b19;
}
.cancel a:hover{
color: #000;
border-bottom: 1px solid #000;
}
.broi{
display: inline-block;
font-size: 11px;
color: #a7a9ac;
margin-left: 5px;
font-weight: normal;
font-style: italic;
}
.filter-10 {
display: none;
}
.filter-10.specFil {
display: block;
}
#menu ul li a.ml-65{
/*background-color: #fa7012;
color: #fff;*/
padding-left: 26px;
}
/*#menu ul li a.ml-49:after {
content: "\f295";
font-family: 'Font Awesome 5 Pro';
font-size: 13px;
position: absolute;
top: 22px;
left: 10px;
color: #fff;
}*/
#menu ul li a.ml-65:after {
content: "\f06b";
font-family: 'Font Awesome 5 Pro';
font-size: 15px;
position: absolute;
top: 19px;
left: 7px;
/*color: #fff;*/
}
/*----------------------- Checkbox and Radio style ----------------------*/
.checkbox-custom, .radio-custom {
position: relative;
display: block;
margin-bottom: 10px;
line-height: 17px;
}
.checkbox-custom label,.radio-custom label{
position:relative;
display:inline-block;
vertical-align:middle;
margin:0;
padding:0;
cursor:pointer;
font-size: 16px;
color: #111;
font-weight: normal;
padding-left: 28px;
}
.checkbox-custom input[type=checkbox]{
opacity:0;
position:absolute;
margin: 0px;
}
.checkbox-custom input[type=checkbox]+label:before{
content:'';
background:#fff;
border: 1px solid #e5e7e9;
display:inline-block;
vertical-align:top;
width: 18px;
height: 18px;
text-align:center;
font-size: 13px;
color: #000;
line-height: 16px;
font-family: 'Font Awesome 5 Pro';
position: absolute;
left: 0px;
top: 0px;
-webkit-transition:box-shadow .1s ease-in-out;
-o-transition:box-shadow .1s ease-in-out;
transition:box-shadow .1s ease-in-out;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}
.checkbox-custom input[type=checkbox]:checked+label:before{
background: rgba(255,255,255,0.3);
content: '\f00c';
border: 1px solid #bbb;
}
.radio-custom input[type=radio].disabled+label, .radio-custom input[type=radio]:disabled+label, .radio-custom input[type=radio].disabled+label:before, .radio-custom input[type=radio]:disabled+label:before, fieldset[disabled] .radio-custom input[type=radio]+label:before{
cursor:default;
opacity:.4;
}
.radio-custom.radio-inline{
padding-left:0;
}
.radio-custom input[type=radio]{
opacity:0;
position:absolute;
margin: 0px;
}
.radio-custom input[type=radio]+label:before{
border-radius:50%;
content:'';
background:#fff;
border: 1px solid #e5e7e9;
display:inline-block;
vertical-align:top;
position: absolute;
top: 0px;
left: 0px;
width: 18px;
height: 18px;
padding:2px;
margin-right:10px;
text-align:center;
box-shadow:inset 0 0 0 8px #fff;
-webkit-transition:box-shadow .1s ease-in-out;
-o-transition:box-shadow .1s ease-in-out;
transition:box-shadow .1s ease-in-out;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
}
.radio-custom input[type=radio]:checked+label:before{
background: #000;
box-shadow:inset 0 0 0 3px #fff;
}
/*
.radio-custom input[type=radio]:focus+label:before{
box-shadow:inset 0 0 0 3px #fff;
}*/
.radio-custom input[type=radio].disabled+label:before,.radio-custom input[type=radio]:disabled+label:before,fieldset[disabled] .radio-custom input[type=radio]+label:before{
cursor:default;
opacity:.4;
}
.checkbox-custom img {
width: 20px;
float: right;
}
#content-1, #content-2{
max-height: 395px;
}
/*--------------------- responsive filter ----------------------*/
.responsive-filters {
display: none;
float: right;
position: relative;
background: #fff;
height: 48px;
color: #375ca3;
border: 1px solid #ccc;
text-transform: uppercase;
font-weight: 600;
font-size: 13px;
padding: 6px 15px 6px 45px;
cursor: pointer;
box-sizing: border-box;
}
.responsive-filters::before{
content: '\f0b0';
font-family: 'Font Awesome 5 Pro';
font-size: 24px;
position: absolute;
top: 0px;
left: 13px;
line-height: 46px;
}
.responsive-filters .how-many{
display: block;
float: none;
text-transform: none;
font-weight: normal;
line-height: normal;
}
.close-filter{
display: none;
background: #000;
color: #fff;
text-transform: uppercase;
font-weight: bold;
font-size: 12px;
text-align: center;
width: 100%;
position: fixed;
left: 0px;
bottom: 0px;
z-index: 3000;
padding: 15px 0px;
cursor: pointer;
box-sizing: border-box;
}
.close-filter::before{
content: '\f00d';
font-family: 'Font Awesome 5 Pro';
font-size: 20px;
position: absolute;
top: 0px;
left: 30px;
line-height: 47px;
font-weight: lighter;
}
/*--------------------- responsive sort ----------------------*/
.responsive-sort {
display: none;
float: left;
position: relative;
background: #fff;
height: 48px;
color: #375ca3;
border: 1px solid #ccc;
text-transform: uppercase;
font-weight: 600;
font-size: 13px;
padding: 6px 30px 6px 45px;
cursor: pointer;
box-sizing: border-box;
}
.responsive-sort::before{
content: '\f0ec';
font-family: 'Font Awesome 5 Pro';
font-size: 24px;
position: absolute;
top: 0px;
left: 13px;
line-height: 46px;
font-weight: normal;
-ms-transform: rotate(90deg);
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}
.sort-choice{
display: block;
text-transform: none;
font-weight: normal;
line-height: normal;
font-size: 12px;
color: #a3a3a3;
}
/*pagination-----------------------------------------------------------------*/
.pagination {
margin: 20px 0px 50px;
}
.pagination ul {
font-weight: bold;
text-align: left;
padding: 0px;
margin: 0px;
list-style-type: none;
}
.pagination li {
display: inline-block;
}
.pagination a,
.pagination a:visited {
width: 48px;
height: 48px;
font-size: 20px;
line-height: 48px;
display: inline-block;
background: #e1e1e1;
text-align: center;
color: #1d1b59;
border-radius: 0;
margin: 0 2px 0 0;
}
.pagination a:hover,
.pagination a:visited:hover {
background: #3b62ae;
color: #fff;
text-decoration: none;
}
.pagination a.currentpage {
background: #3b62ae;
color: #fff;
text-decoration: none;
}
/* ------------------------------------- products details page ----------------------------------*/
.description-wrap{
float: left;
width: 40%;
margin-bottom: 40px;
margin-top: 0px;
padding-left: 45px;
box-sizing: border-box;
}
.heading{
color: #1d1b59;
font-size: 35px;
margin-bottom: 20px;
}
.description-wrap .rating-wrap{
margin-bottom: 15px;
cursor: pointer;
}
/*----------------------- Image gallery in details---------------------------- */
.image-gallery{
position: relative;
width: 32%;
margin: 0px 0px 40px 0px;
float: left;
text-align: center;
box-sizing: border-box;
}
.slider-for {
overflow: hidden;
text-align: center;
box-sizing: border-box;
}
.slider-for .slick-prev, .slider-for .slick-next{
top: 50%;
}
.slider-for .slick-slide img{
display: inline-block;
max-width: none;
width: 100%;
}
.slider-for .slick-prev{
left: 0px;
}
.slider-for .slick-next{
right: 0px;
}
.slider-nav {
margin: 5px -5px 0px;
}
.slider-nav figure{
margin: 5px;
cursor: pointer;
border: 1px solid #ededed;
overflow: hidden;
position: relative;
box-sizing: border-box;
}
.slider-nav .slick-current figure{
border: 2px solid #7691c6;
}
.slider-nav .slick-slide img{
display: inline-block;
}
/*--------------- price in product details -----------------*/
.price-inner{
margin-bottom: 30px;
position: relative;
}
.price-inner .new-price{
font-size: 35px;
font-weight: bold;
}
.price-inner .old-price{
font-size: 18px;
margin-left: 15px;
}
.price-inner p{
margin: 0px;
font-size: 13px;
color: #a7a9ac;
font-style: italic;
}
.price-inner .btn{
position: absolute;
top: 0px;
right: 0px;
margin-top: 0px;
padding: 14px 25px 15px;
font-size: 17px;
letter-spacing: 1px;
font-weight: 600;
}
hr{
background: #ddd;
width: 100%;
height: 1px;
border: none;
padding: 0px;
margin: 20px 0px;
}
/*----------------------------- offer valid ----------------------------*/
.offer-valid{
background: #f1f1f1;
padding: 10px 20px;
margin: 20px 0px 20px;
}
.offer-valid h6{
float: left;
font-size: 15px;
font-weight: 500;
line-height: 38px;
}
.offer-valid .v-time{
float: right;
background: #3b62ae;
color: #fff;
padding: 8px 25px 8px 17px;
font-size: 18px;
border-radius: 5px;
letter-spacing: 1px;
}
.offer-valid .v-time i{
background: #3b62ae;
color: #fff;
margin-right: 8px;
font-size: 18px;
height: auto;
line-height: normal;
position: relative;
}
/*--------------- Наличност -----------------*/
.no-prod{
margin-bottom: 30px;
font-size: 15px;
color: #797979;
}
.no-prod span{
display: inline-block;
margin-right: 50px;
}
.no-prod i{
color: #000;
text-transform: uppercase;
font-style: normal;
}
/*---------------- choose color -----------------*/
.choose-color{
position: relative;
}
.choose-color ul{
margin: 0px;
padding: 0px;
list-style-type: none;
}
.choose-color ul li{
display: inline-block;
padding-right: 8px;
margin-right: -4px;
box-sizing: border-box;
}
.choose-color .radio-custom{
display: block;
position: inherit;
}
.choose-color .radio-custom label{
display: block;
color: #000;
text-decoration: none;
font-size: 14px;
position: inherit;
border: 1px solid #e2eee0;
border-radius: 50%;
padding: 2px;
text-align: center;
width: 30px;
height:30px;
box-sizing: border-box;
}
.choose-color .radio-custom input[type=radio]:checked+label{
border: 1px solid #000;
}
.choose-color .radio-custom input[type=radio]+label:before{
opacity: 0;
visibility: hidden;
position: absolute;
top: 0;
left: 0;
}
.color-radio {
display: block;
}
.color-radio img{
border-radius: 50%;
}
.choose-name{
margin-bottom: 10px;
color: #797979;
}
.choose-name em{
display: inline-block;
background: #fff;
color: #000;
font-style: normal;
margin-left: 10px;
}
.color-name{
position: absolute;
top: -5px;
left: 43px;
line-height: normal;
background: #fff;
color: #000;
font-size: 14px;
width: 150px;
padding: 5px;
opacity: 0;
z-index: 1;
text-align: left;
box-sizing: border-box;
-webkit-transition: all 400ms;
-moz-transition: all 400ms;
-o-transition: all 400ms;
transition: all 400ms;
}
.choose-color .radio-custom:hover .color-name{
opacity: 1;
z-index: 3;
}
.choose-color .radio-custom input[type=radio]:checked+label .color-name{
opacity: 1;
}
/*---------------- choose size -----------------*/
.choose-size{
padding-top: 20px;
position: relative;
}
.choose-size ul{
margin: 0px;
padding: 0px;
list-style-type: none;
}
.choose-size ul li{
display: inline-block;
padding-right: 10px;
margin-right: -4px;
box-sizing: border-box;
}
.choose-size .radio-custom{
display: block;
position: inherit;
}
.choose-size .radio-custom label{
display: block;
color: #000;
text-decoration: none;
font-size: 14px;
position: inherit;
border: 1px solid #e5e7e9;
padding: 5px 10px;
text-align: center;
line-height: 24px;
text-transform: uppercase;
min-width: 38px;
box-sizing: border-box;
}
.choose-size .radio-custom input[type=radio]:checked+label{
border: 1px solid #000;
}
.choose-size .radio-custom input[type=radio]+label:before{
opacity: 0;
visibility: hidden;
position: absolute;
top: 0;
left: 0;
}
/*---------------- choose size with select -----------------*/
.choose-size-select{
padding-top: 20px;
position: relative;
}
.choose-size-select .input-place{
width: 50%;
}
.choose-size-select .size-guide{
top: 30px;
}
/*--------------- size guide -----------------*/
.size-guide{
position: absolute;
top: 20px;
right: 0px;
display: inline-block;
font-size: 13px;
color: #000;
}
.size-guide span{
border-bottom: 1px solid #000;
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
-ms-transition: all .3s ease-out;
transition: all .3s ease-out;
}
.size-guide:hover span{
border-bottom: 1px solid transparent;
}
.size-guide i{
margin-right: 7px;
font-size: 12px;
}
table.size-table{
display: block;
white-space: normal;
}
table.size-table th{
text-transform: none;
font-size: 13px;
padding: 10px;
}
table.size-table td{
font-size: 13px;
padding: 10px;
}
table.size-table td:nth-child(even){
border-right: none;
}
table.size-table td:nth-child(odd){
border-left: 0px;
}
/*--------------- buy btns -----------------*/
.buy-wrap{
padding: 0px;
position: relative;
}
.buy-wrap .btn{
margin-top: 0px;
display: block;
float: left;
margin-right: 20px;
padding: 14px 25px;
font-size: 16px;
letter-spacing: 1px;
font-weight: 600;
}
.buy-wrap .btn i{
font-size: 18px;
margin-right: 8px;
}
.buy-wrap .heart-icon {
position: absolute;
bottom: auto;
left: auto;
right: 0px;
display: block;
color: #bb1111;
font-size: 36px;
}
/*--------------- resume content -----------------*/
.resume-content{
padding: 40px 0 35px;
font-size: 15px;
line-height: 24px;
}
.resume-content h6{
margin-bottom: 10px;
font-weight: 500;
}
/*------------------- attribute list ---------------------*/
.attribute-list{
margin: 0px;
padding: 10px 0px;
line-height: normal;
list-style-type: none;
}
.attribute-list li{
display: block;
margin-bottom: 10px;
font-size: 16px;
}
.attribute-list li strong{
display: block;
float: left;
width: 170px;
font-weight: 600;
color: #222;
}
.attribute-list li span{
display: block;
overflow: hidden;
}
.attribute-list li i{
color: #fa7012;
font-style: normal;
}
/*----------------------- delivery in details---------------------------- */
.delivery-in-details{
float: left;
width: 28%;
padding-left: 60px;
margin-bottom: 40px;
box-sizing: border-box;
}
.delivery-in-details .delivery-one{
float: none;
width: auto;
padding: 25px;
background: #f6f7f9;
margin-bottom: 10px;
}
.delivery-info{
font-size: 16px;
line-height: 24px;
margin-top: 30px;
border: 1px solid #e6e8e9;
padding: 25px;
}
.delivery-info .attribute-list{
padding: 0px;
}
.orange-text{
color: #fa7012;
}
.delivery-in-details.del-bottom{
display: none;
float: none;
width: auto;
padding-left: 0px;
margin-bottom: 0px;
margin-top: 40px;
}
/*----------------------------- pop up anf iframe ----------------------------*/
.popup{
display: none;
max-width: 860px;
max-height: calc(100vh - 150px);
overflow: auto;
}
.iframe-pop{
padding: 24px;
max-width: 90% !important;
box-sizing: border-box;
}
.popup .title, .iframe-pop .title{
text-align: center;
}
.popup .title h2, .iframe-pop .title h2{
margin-top: 10px;
}
.second-title{
margin-bottom: 20px;
}
.popup .contact-form, .iframe-pop .contact-form{
float: none;
width: auto;
margin-bottom: 0px;
}
.popup .cart-pr-item, .iframe-pop .cart-pr-item{
padding: 12px 0px;
margin-bottom: 20px;
}
.popup .cart-pr-image, .iframe-pop .cart-pr-image{
width: 75px;
}
.popup .pr-name, .iframe-pop .pr-name{
font-size: 16px;
max-height: none;
}
.popup .cart-pr-price, .iframe-pop .cart-pr-price{
font-size: 17px;
margin-top: 7px;
}
.popup .cart-pr-price strike, .iframe-pop .cart-pr-price strike{
font-size: 14px;
}
.iframe-pop .btn-place{
text-align: center;
}
.fancybox-slide--iframe .fancybox-content{
width: 100% !important;
max-width: 860px !important;
}
.fancybox-slide > div.pop-right-bgr{
padding: 40px 230px 40px 40px;
position: relative;
}
.fancybox-slide > div.pop-right-bgr::before{
content: '';
position: absolute;
top: 0px;
right: 0px;
width: 185px;
height: 100%;
background: url('../images/leaves.jpg') repeat-y;
}
.fancybox-slide > div.pop-top-bgr{
padding: 160px 40px 40px 40px;
position: relative;
}
.fancybox-slide > div.pop-top-bgr::before{
content: '';
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 120px;
background: url('../images/leaves.jpg') no-repeat center center;
background-size: cover;
}
.popup-similar-pr{
margin-top: 30px;
padding: 30px 20px;
background: #f6f7f9;
}
.popup-similar-pr .title h3 {
color: #fa7012;
}
.popup-similar-slider .slick-dots{
margin-top: -20px;
}
.fancybox-enabled body header{
right: 17px;
}
/*
Styles for animated modal
=========================
*/
/* Start state */
.fancybox-slide{
-webkit-perspective: 1300px;
-moz-perspective: 1300px;
perspective: 1300px;
}
.animated-modal {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transform: rotateY(-70deg);
-moz-transform: rotateY(-70deg);
-ms-transform: rotateY(-70deg);
transform: rotateY(-70deg);
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
transition-delay: 0.3s;
opacity: 0;
}
/* Final state */
.fancybox-slide--current .animated-modal{
-webkit-transform: rotateY(0deg);
-moz-transform: rotateY(0deg);
-ms-transform: rotateY(0deg);
transform: rotateY(0deg);
opacity: 1;
}
/*----------------------------- fast order ----------------------------*/
.fast-order{
background: #f6f7f9;
padding: 20px 20px;
margin-bottom: 35px;
}
.fast-order h6{
font-size: 18px;
margin-bottom: 15px;
}
.fast-order .input-place{
float: left;
width: calc(100% - 160px);
}
.fast-order .btn{
float: right;
font-size: 13px;
margin: 0px;
width: 150px;
padding: 14px 10px;
}
.fast-order .some-text{
font-weight: 300;
}
.fast-order .input-f{
background: #fff;
}
/*--------------------------------------- more description ----------------------------------*/
.more-description{
position: relative;
}
/* ---- tab menu -----*/
.tabs-container{
width: 100%;
}
.tabs-menu{
margin: 0px;
padding: 0px;
list-style-type: none;
position: relative;
}
.tabs-menu li{
float: left;
display: block;
color: #555;
border-right: 2px solid #fff;
-webkit-transition: all 400ms;
-moz-transition: all 400ms;
-o-transition: all 400ms;
transition: all 400ms;
}
.tabs-menu li a{
color: #555;
display: block;
white-space: nowrap;
padding: 0px 40px;
line-height: 46px;
text-align: center;
font-size: 18px;
font-weight: bold;
border-bottom: 3px solid transparent;
background: #f6f6f6;
}
.tabs-menu li:hover a{
color: #fa7012;
}
.tabs-menu li.current-tab a{
border-bottom: 3px solid #fa7012;
color: #000;
background: #fff;
}
.tabs-menu .current-tab a {
cursor: default;
}
.tab {
width: 100%;
background: #fff;
overflow: hidden;
}
.tab-content {
display: none;
padding: 40px 30px;
border: 2px solid #dbdbdb;
}
.tab-content h3{
text-transform: uppercase;
color: #222;
}
.tab-content .write-comment{
margin-bottom: 0px;
}
#tab-1 {
display: block;
}
/*---- end tab menu -----*/
.tab-content .video{
margin: 0;
float: left;
width: 50%;
box-sizing: border-box;
padding-right: 30px;
padding-bottom: 30px;
}
/*----------------------- User reviews Comments ---------------------------- */
.number-of-reviews{
color: #928d8d;
font-size: 14px;
}
.comments-review{
margin-bottom: 20px;
padding: 20px;
}
.comments-review h4{
margin-bottom: 15px;
}
.comments-review ul{
margin: 0px;
padding: 0px;
list-style-type: none;
}
.comments-review ul li{
display: block;
padding: 20px;
background: #fff;
border-bottom: 1px solid #eee;
}
.comments-review ul li:after{
content: '';
display: block;
clear: both;
}
.comment-box{
float: left;
width: 200px;
margin-bottom: 5px;
}
.comment-box figure{
width: 35px;
margin-bottom: 10px;
position: relative;
z-index: 1;
border-radius: 50%;
overflow: hidden;
display: none;
}
.comment-box h5{
font-size: 17px;
color: #14579c;
text-transform: none;
margin-bottom: 6px;
}
.comment-box h5 a{
color: #14579c;
text-decoration:none !important;
}
.comment-box h5 a:hover{
color: #fa7012;
}
.comment-box .date{
margin-bottom: 0px;
font-size: 13px;
}
.comment-box .verifyed{
margin-bottom: 0px;
font-size: 14px;
font-weight: bold;
color: #fa7012;
}
.comment-text{
float: left;
width: calc(100% - 200px);
}
.vote{
font-size: 16px;
padding-top: 5px;
color: #000;
}
.like{
color: #000;
margin-right: 5px;
font-size: 18px;
text-decoration:none !important;
}
.like:hover{
color: #43a047;
}
.dislike{
color: #000;
margin-right: 5px;
font-size: 18px;
text-decoration:none !important;
}
.dislike:hover{
color: #cf0202;
}
.star-rating {
padding: 20px;
}
.add-comment-review {
width: 50%;
}
.add-comment-review input,
.add-comment-review textarea {
width: 100%;
}
/*----------------------- Comments ---------------------------- */
.comments{
margin-bottom: 30px;
}
.number-of-comments{
color: #000;
font-size: 18px;
text-align: center;
padding: 15px;
font-weight: bold;
border-top: 1px solid #ddd;
border-bottom: 1px solid #ddd;
}
.number-of-comments i{
margin-right: 5px;
}
.comments ul{
margin: 0px;
padding: 0px;
list-style-type: none;
}
.comments ul li{
display: block;
padding: 20px;
border-bottom: 1px solid #e5e5e5;
}
.comments ul li::after{
content: '';
display: block;
clear: both;
}
.comments ul li:last-child{
border-bottom: none;
}
.comments ul li figure{
float: left;
margin-right: 25px;
width: 85px;
height: 85px;
border-radius: 50%;
overflow: hidden;
}
.comment-box-text{
overflow: hidden;
}
.comment-box-text h5{
margin-bottom: 8px;
margin-top: 5px;
color: #14579c;
}
.comment-box-text h5 a{
color: #14579c;
text-decoration:none !important;
}
.comment-box-text h5 a:hover,
.comment-box-text h5 a:focus{
color: #fa7012;
}
.comment-box-text .date{
margin-bottom: 5px;
font-size: 13px;
}
/*-------------------- write comment -------------------- */
.write-comment{
background: #F5F5F5;
padding: 30px;
margin-bottom: 50px;
border-radius: 5px;
}
.write-comment h3{
margin-bottom: 20px;
}
.write-comment .input{
width: 100%;
}
.float-field{
float: left;
width: 50%;
padding: 0 7px;
box-sizing: border-box;
}
.row{
margin-left: -7px;
margin-right: -7px;
}
.write-comment .checkbox-custom{
padding-top: 20px;
}
.input{
border: 1px solid #d4d4d4;
padding: 0 15px;
margin-bottom: 10px;
width: 80%;
height: 45px;
color: #000;
font-family: 'Attractive', 'Lora', 'Palatino Linotype', Arial, Helvetica, sans-serif;
font-size: 15px;
outline: none;
box-sizing: border-box;
}
.jq-form .input{
width: 100%;
}
input:focus,
textarea:focus {
outline: none;
}
textarea.input {
width: 100%;
height: 130px;
resize: none;
padding: 15px;
}
/*Emoticons */
.econ {
display: inline-block;
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
width:27px;
height:27px;
background-image:url(../images/emoticons2.png);
background-repeat:no-repeat;
}
.econ.smile {
background-position:-170px -37px;
}
.econ.namig {
background-position:-3px -4px;
}
.econ.pain {
background-position:-70px -37px;
}
.econ.rire {
background-position:-70px -3px;
}
.econ.curi {
background-position:-103px -36px;
}
.econ.vict {
background-position:-103px -3px;
}
.econ.redf {
background-position:-170px -3px;
}
.econ.gift {
background-position:-3px -72px;
}
.econ.cool {
background-position:-38px -4px;
}
.econ.blin {
background-position:-136px -36px;
}
.econ.love {
background-position:-136px -4px;
}
.econ.plez {
background-position:-36px -36px;
}
.econ.griz {
background-position:-4px -36px;
}
.econ.kiss {
background-position:-39px -70px;
}
/*--------------- star evaluate rating -----------------*/
.star-evaluate{
float: left;
margin-top: 15px;
}
.star-evaluate i{
font-size: 15px;
color: #bbb;
}
.star-evaluate i.em{
float: right;
font-size: 30px;
margin-right: 5px;
color: #bbb;
}
.star-evaluate > .em:hover, .star-evaluate > .em:hover~.em{
color: #ffb000;
}
.star-evaluate > .em.active-star, .star-evaluate > .em.active-star~.em{
color: #ffb000;
}
.star-average{
float: none;
margin-top: 0px;
position: relative;
z-index: 5;
}
.star-average i{
font-size: 12px;
}
.star-rating .btn{
margin-top: 15px;
}
.add-comment-review{
margin-top: 25px;
}
.add-comment-review textarea{
margin-top: 10px;
max-width: 860px;
}
/*------------------ similar products in details ----------------- */
.similar-products{
background: #f6f7f9;
padding: 50px 0px 10px;
overflow: hidden;
}
/*------------------ last seen products in details ----------------- */
.last-seen-products{
padding: 50px 0px 10px;
overflow: hidden;
}
/*------------------------------------- Shopping Cart ---------------------------------------*/
.cart-wrapper {
margin-bottom: 30px;
}
.cart-items{
margin: 0px;
padding: 0px;
list-style-type: none;
}
.cart-left-container{
float: left;
width: calc(100% - 400px);
box-sizing: border-box;
}
.shopOrder{
overflow: hidden;
margin-bottom: 65px;
}
.shopOrder-head{
text-align: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
align-items: stretch;
border-bottom: 1px solid #ccc;
}
.shopOrder-head > div{
padding: 15px 0px;
font-weight: 600;
color: #fa7012;
font-size: 13px;
letter-spacing: 1px;
text-transform: uppercase;
box-sizing: border-box;
}
.shop-price:before, .shop-qty:before, .shop-sum:before {
content: attr(data-th);
display: none;
color: #888;
font-size: 12px;
line-height: 16px;
}
.shopOrder-row {
text-align: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
align-items: stretch;
border-bottom: 1px solid #f1f1f1;
}
.shopOrder-row > div{
padding: 13px 0px;
color: #000;
line-height: 28px;
box-sizing: border-box;
}
.shopOrder-row > div:last-child{
border-right: none;
}
.c1{
-webkit-box-flex: 1;
-webkit-flex: auto;
-ms-flex: auto;
flex: auto;
text-align: left;
}
.c2 {
-webkit-flex: 0 0 118px;
-ms-flex: 0 0 118px;
flex: 0 0 118px;
}
.c3 {
-webkit-flex: 0 0 125px;
-ms-flex: 0 0 125px;
flex: 0 0 125px;
}
.c4 {
-webkit-flex: 0 0 35px;
-ms-flex: 0 0 35px;
flex: 0 0 35px;
}
.c5 {
-webkit-flex: 0 0 200px;
-ms-flex: 0 0 200px;
flex: 0 0 200px;
text-align: left;
}
.shop-price .old-price{
margin-left:0px;
font-size: 13px;
}
/*--------- number qty ----------*/
.number-qty span{
cursor: pointer;
}
.minus, .plus{
width:28px;
height:28px;
background:#fff;
border:1px solid #ddd;
border-radius: 50%;
display: inline-block;
vertical-align: middle;
text-align: center;
font-size: 18px;
line-height: 26px;
box-sizing: border-box;
}
.number-qty input{
height: 28px;
width: 40px;
font-size: 14px;
border: 1px solid #ddd;
display: inline-block;
vertical-align: middle;
padding: 0 7px;
margin:0px;
text-align: center;
line-height:28px;
box-sizing: border-box;
}
/*--------- shop prod ----------*/
.shop-prod{
line-height: normal;
}
.shop-prod figure{
display: inline-block;
width: 80px;
margin-right: 10px;
}
.shop-prod a{
display: block;
}
.shop-prod-info {
display: inline-block;
vertical-align: middle;
width: calc(100% - 100px);
}
.shop-prod-info > a{
font-size: 16px;
color: #000;
}
.shop-prod-info > a:hover{
text-decoration: underline;
}
.choose-opt{
margin: 0px;
color: #8d8d8d;
font-size: 12px;
padding: 8px 0px;
display: inline-block;
list-style-type: none;
}
.choose-opt li{
display: block;
margin-right:5px;
}
.clear-prod{
color: #e92222;
}
.clear-prod:hover{
color: #e92222;
}
/*----------------------------- cart summary ---------------------------*/
.cart-summary{
float: right;
width: 350px;
background: #f6f7f9;
padding: 40px;
box-sizing: border-box;
}
.cart-summary h3{
font-size: 20px;
margin-bottom: 20px;
font-weight: bold;
}
.cart-summary ul{
margin: 0px;
padding: 0px;
list-style-type: none;
}
.cart-summary ul li{
line-height: 28px;
}
.cart-summary ul li span{
display: block;
float: right;
color: #000;
}
.cart-summary .btn{
display: block;
padding: 10px;
}
.cart-summary .just-text{
margin-top: 15px;
}
.cart-summary .just-text a{
text-decoration: underline;
}
.cart-summary .just-text a:hover{
text-decoration: none;
}
.total{
color: #000;
font-size: 17px;
border-top: 1px solid #ccc;
padding-top: 8px;
margin-top: 30px;
}
.total span{
display: block;
float: left;
}
.total strong{
display: block;
float: right;
}
/*--------- promo code ----------*/
.promo-code{
margin-bottom: 30px;
padding-bottom: 5px;
border-bottom: 1px solid #ccc;
}
.promo-code h6 {
font-size: 15px;
font-weight: normal;
margin-bottom: 10px;
color: #1d1b59;
}
.promo-code .input-place {
float: left;
width: calc(100% - 80px);
height: 39px;
line-height: 37px;
}
.promo-code .input-f{
background: #fff;
height: 37px;
}
.promo-code .btn {
float: right;
font-size: 13px;
margin: 0px;
padding: 11px 10px;
min-width: inherit;
letter-spacing: normal;
width: 80px;
border-radius: 0px;
}
.otstupki{
padding: 10px 0px;
font-size: 14px;
}
.otstupki h6{
margin-bottom: 0px;
}
/*----------------------------- Брой продукти и лист с продукти в дясната колона на Стъпка 2 ------------------------------*/
.cart-pr-broi{
position: relative;
font-style: italic;
margin-bottom: 20px;
cursor: pointer;
}
.cart-pr-broi span{
display: block;
position: relative;
font-style: normal;
color: #000;
font-size: 13px;
text-decoration: underline;
}
.cart-pr-broi span i{
margin-left: 7px;
}
.cart-pr-broi:hover span{
text-decoration: none;
}
.cart-summary .cart-pr-wrap{
padding-bottom: 30px;
display: none;
}
.cart-summary .cart-pr-item{
padding: 12px 15px 12px 0px;
}
/*----------------------------- checkout top ------------------------------*/
.checkout-top-login{
margin-bottom: 40px;
border: 1px solid #ccc;
padding: 20px;
}
.checkout-top-login p{
font-size: 17px;
float: left;
margin: 0px;
padding: 6px 0px;
max-width: calc(100% - 170px);
line-height: 26px;
}
.checkout-top-login .btn{
margin-top: 0px;
float: right;
}
.top-login{
display: none;
}
.top-login .btn{
float: none;
}
.top-login .connect-with{
margin-top: 0px;
margin-left: 20px;
display: inline-block;
}
/*----------------------------------- Form ----------------------------------*/
.some-form{
box-sizing: border-box;
}
.some-form hr{
margin: 25px 0px;
}
.some-form-title{
margin-bottom: 15px;
position: relative;
}
.some-text {
margin-top: 7px;
font-size: 14px;
color: #a7a9ac;
font-style: italic;
}
.form-flex{
position: relative;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-justify-content: space-between;
-ms-flex-pack: space-between;
justify-content: space-between;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
box-sizing: border-box;
}
.float-flex {
-webkit-box-flex: none;
-webkit-flex: 0 0 100%;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
box-sizing: border-box;
}
.col-2 .float-flex{
-webkit-flex: 0 0 49%;
-ms-flex: 0 0 49%;
flex: 0 0 49%;
}
.col-3 .float-flex{
-webkit-flex: 0 0 32%;
-ms-flex: 0 0 32%;
flex: 0 0 32%;
}
.col-4 .float-flex{
-webkit-flex: 0 0 23%;
-ms-flex: 0 0 23%;
flex: 0 0 23%;
}
.col-5 .float-flex{
-webkit-flex: 0 0 18%;
-ms-flex: 0 0 18%;
flex: 0 0 18%;
}
.personal-width{
-webkit-flex: 0 0 60% !important;
-ms-flex: 0 0 60% !important;
flex: 0 0 60% !important;
}
.float-flex .btn{
margin-top: 0px;
height: 40px;
}
.float-flex .input{
width: 100%;
}
.sectitle {
text-transform: uppercase;
margin-bottom: 25px;
}
.input-label{
display: block;
font-size: 16px;
font-weight: bold;
color: #1d1b59;
margin-bottom: 7px;
}
.red {
color: #D0021B;
}
.input-place{
border: 1px solid #ddd;
height: 45px;
margin-bottom: 12px;
font-size: 13px;
line-height: 43px;
position: relative;
box-sizing: border-box;
}
.input-f{
border: none;
padding: 0 10px;
background: rgba(228, 237, 246, 0.18);
width: 100%;
height: 43px;
color: #000;
font-family: 'Attractive', 'Lora', 'Palatino Linotype', Arial, Helvetica, sans-serif;
font-size: 15px;
outline: none;
box-sizing: border-box;
}
textarea.input-f {
width: 100%;
height: 150px;
resize: none;
padding: 7px 10px;
border: 1px solid #ddd;
margin-bottom: 13px;
line-height: normal;
box-sizing: border-box;
}
.input-place .styled-select{
border: none;
height: 38px;
}
.input-place .styled-select select{
color: #000;
}
.input-icon-btn{
position: absolute;
top: 0px;
right: 0px;
width: 40px;
height: 43px;
line-height: 44px;
color: #000;
font-size: 16px;
text-align: center;
background: #e5e7e9;
z-index: 1;
cursor: pointer;
-webkit-transition: all 400ms;
-moz-transition: all 400ms;
-o-transition: all 400ms;
transition: all 400ms;
}
/*------------ List in form --------------*/
.list-in-form{
margin: 0px;
padding: 0px;
list-style-type: none;
}
.list-in-form li{
display: block;
float: left;
width: 33.333%;
padding-right: 30px;
box-sizing: border-box;
}
.some-form .checkbox-custom label, .some-form .radio-custom label{
color: #606060;
font-size: 15px;
}
.checkbox-custom label .text, .radio-custom label .text{
line-height: 24px;
}
.checkbox-custom label h4, .radio-custom label h4{
font-size: 15px;
display: inline-block;
font-weight: 600;
text-transform: none;
}
/*------------------------ Disabled ----------------------*/
.disabled, input[type=text]:disabled, select:disabled {
cursor: default;
opacity: .5;
}
.pay-method{
display: inline-block;
width: 60px;
height: 22px;
margin-right: 5px;
border: 1px solid #e5e7e9;
background: #fff;
text-align: center;
line-height: 18px;
box-sizing: border-box;
}
.pay-method img{
max-height: 18px;
max-width: 45px;
}
.some-form .btn-place{
text-align: right;
}
.back-link {
display: block;
float: left;
text-transform: uppercase;
font-size: 11px;
color: #000;
letter-spacing: 1px;
line-height: 40px;
margin-top: 30px;
}
.back-link i{
font-size: 20px;
position: relative;
top: 3px;
margin-right: 5px;
}
/*------------ File upload --------------*/
.fileUpload {
position: relative;
overflow: hidden;
background: #fff;
color: #000;
font-size: 14px;
display: block;
border: 1px solid #000;
padding: 7px 13px 7px;
text-align: center;
width: 170px;
height: 170px;
line-height: 230px;
cursor: pointer;
box-sizing: border-box;
-webkit-transition:all .3s ease-in;
-moz-transition:all .3s ease-in;
-ms-transition:all .3s ease-in;
transition:all .3s ease-in;
}
.fileUpload span{
display: inline-block;
position: relative;
}
.fileUpload span:before{
content: '\f030';
font-family: 'Font Awesome 5 Pro';
position: absolute;
top: 0px;
left: 50%;
color: #000;
font-size: 50px;
font-weight: lighter;
line-height: 140px;
width: 50px;
margin-left: -25px;
}
.fileUpload input.upload {
position: absolute;
top: 0;
right: 0;
left: 0;
bottom: 0;
margin: 0;
padding: 0;
cursor: pointer;
opacity: 0;
filter: alpha(opacity=0);
}
.fileUpload:hover{
background: #f1f1f1;
}
.example{
display: inline-block;
}
.example img{
max-height: 170px;
border: 1px solid #e5e7e9;
}
.example figcaption{
text-align: center;
padding-top: 5px;
font-style: italic;
font-size: 13px;
}
.upload-image-wrap{
width: 100%;
margin: 0px;
margin-top: 20px;
padding: 0px;
list-style-type: none;
}
.upload-image-wrap li {
display: inline-table;
vertical-align: top;
width: 25%;
padding-bottom: 25px;
padding-right: 25px;
margin-right: -4px;
box-sizing: border-box;
}
.upload-image-wrap li figure{
position: relative;
border: 1px solid #e5e7e9;
-webkit-transition:all .3s ease;
-moz-transition:all .3s ease;
-ms-transition:all .3s ease;
transition:all .3s ease;
}
.upload-image-wrap li figure:hover{
border: 1px solid #000;
-webkit-box-shadow: 0px 0px 0px 4px rgba(243,243,243,1);
-moz-box-shadow: 0px 0px 0px 4px rgba(243,243,243,1);
box-shadow: 0px 0px 0px 4px rgba(243,243,243,1);
}
.upload-image-wrap li figure figcaption{
position: absolute;
top: -10px;
right: -15px;
z-index: 1;
opacity: 0;
visibility: hidden;
transform: scale(0);
-webkit-transform: scale(0);
-webkit-transition:all .3s ease;
-moz-transition:all .3s ease;
-ms-transition:all .3s ease;
transition:all .3s ease;
}
.upload-image-wrap li figure:hover figcaption{
opacity: 1;
visibility: visible;
transform: scale(1);
-webkit-transform: scale(1);
}
.upload-image-wrap li figure figcaption a{
display: block;
font-size: 14px;
width: 28px;
height: 28px;
border: 1px solid #888;
border-radius: 50%;
background: #fff;
text-align: center;
line-height: 26px;
box-sizing: border-box;
}
/*---------------------------------------- Registration page ----------------------------------------*/
.register-wrap {
position: relative;
max-width: 740px;
margin: 0px auto;
padding: 0 50px;
box-sizing: border-box;
}
.register-wrap::before {
content: '';
background: #FBFBFB;
border-top: 1px solid #F3F3F3;
position: absolute;
top: 44px;
left: -1000px;
right: -1000px;
height: 100%;
z-index: -1;
}
.register-wrap .some-form{
padding: 50px 0px;
}
.register-wrap .btn{
display: block;
}
.float-flex .jq-captcha{
margin-top: 20px;
}
.forgot-pass-link{
text-align: right;
font-size: 13px;
}
.forgot-pass-link a{
text-decoration: underline;
}
.forgot-pass-link a:hover{
text-decoration: none;
}
/*----------------------- connect with buttons ----------------------*/
.some-form .connect-with a{
display: inline-block;
font-size: 14px;
padding: 9px 20px 11px;
margin-right: 5px;
}
.some-form .connect-with a i{
font-size: 16px;
}
/*------------------------------------- Author list page ---------------------------------------*/
.letters-choice{
background: #f6f7f9;
text-align: center;
margin-bottom: 40px;
}
.letters-choice > a{
display: inline-block;
color: #222;
font-weight: 600;
font-size: 24px;
margin: 5px 6px;
}
.letters-choice > a:hover{
color: #fa7012;
}
.letters-choice > a.disabled-letter{
color: rgba(34,34,34,0.4);
cursor: default;
}
.author-list-wrap{
position: relative;
margin-bottom: 30px;
}
.author-list-wrap::after{
content: '';
position: absolute;
top: 32px;
left: 80px;
right: 0px;
height: 1px;
background: #e0e2e4;
}
.letter{
position: relative;
text-transform: uppercase;
font-size: 40px;
background: #fff;
border: 1px solid #e0e2e4;
text-align: center;
width: 64px;
height: 64px;
line-height: 62px;
font-weight: bold;
color: #fa7012;
box-sizing: border-box;
}
.author-list{
margin: 20px 0px;
}
.author-list ul{
margin: 0px;
padding: 0px;
list-style-type: none;
-webkit-columns: 4;
-moz-columns: 4;
columns: 4;
}
.author-list ul li a {
display: block;
padding-right: 30px;
line-height: 28px;
color: #222;
}
.author-list ul li a:hover{
color: #fa7012;
}
.author-list ul li.nodesc a{
color: #a1a1a1;
cursor: default;
}
/*------------------------------------- Author details ---------------------------------------*/
.author-image{
float: left;
width: 500px;
margin-right: 35px;
margin-bottom: 15px;
}
.about-author{
line-height: 26px;
overflow: hidden;
}
.author-books{
padding: 45px 0px;
border-top: 4px solid #f0f0f0;
}
.author-books .product-box{
width: 20%;
}
/*------------- Simple gallery in details ------------ */
.simple-gallery{
float: left;
margin: 0px 0px 30px -5px;
width: 100%;
/*margin: 10px -5px 30px;*/
padding: 0px;
list-style-type: none;
box-sizing: border-box;
}
.simple-gallery li{
display: block;
float: left;
width: 20%;
padding: 5px;
box-sizing: border-box;
overflow: hidden;
}
.simple-gallery li.first-image{
float: none;
width: 100%;
height: auto;
}
.simple-gallery li a{
display: block;
}
.simple-gallery li img{
max-width: none;
width: 100%;
}
/*---------------------------- donation action ---------------------------- */
.donation-action {
display: block;
position: relative;
font-size: 17px;
line-height: 44px;
color: #53749d;
padding: 0 0 0 20px;
border: 1px solid #53749d;
margin: 0px 0 20px 0;
overflow: hidden;
}
.btn-right {
display: block;
background: #53749d;
float: right;
font-size:17px;
padding: 0 50px 0 30px;
color: #fff;
text-decoration: none;
position:relative;
}
.btn-right:after {
content: "\f061";
font-family: 'Font Awesome 5 Pro';
position:absolute;
font-size:18px;
top:-1px;
right:12px;
}
/*----------------------- blockquote ---------------------------- */
blockquote {
background:#ececec;
padding: 40px 30px 40px 100px;
font-size: 19px;
line-height: 27px;
font-style: italic;
color: #474747;
margin: 20px 0;
display: block;
position: relative;
overflow: hidden;
}
blockquote:before{
content: '\f10e';
font-weight: bold;
font-style: normal;
font-family: 'Font Awesome 5 Pro';
position: absolute;
top: 40px;
left: 28px;
font-size: 45px;
color: #1d1b59;
}
/*--------------- simple list in whole site -----------------*/
.text ul{
margin: 0px;
padding: 0px;
list-style-type: none;
}
.text ul li{
position: relative;
margin-bottom: 2px;
}
.text ul li:before{
content: '\f111';
font-family: 'Font Awesome 5 Pro';
font-size: 7px;
position: relative;
color: #3b62ae;
top: -3px;
margin-right: 10px;
font-weight: bold;
}
/*------------------------ Tables for whole site ------------------------*/
table {
width: 100%;
max-width: 100% !important;
border-collapse: collapse;
border: none;
margin-bottom: 20px;
overflow-x: auto;
}
.text table {
width: 100% !important;
border: none !important;
overflow-x: auto !important;
}
table th{
display: table-cell;
padding: 12px 15px;
color: #fff;
font-weight: normal;
background: #3b62ae;
border: none;
overflow: hidden;
text-align: left;
}
table td{
background: #fff;
display: table-cell;
padding: 9px 15px;
border: 1px solid #f1f1f1;
}
/*table----------------------------------------------------------------------*/
.nl_osn {
width: 100%;
margin: 20px 0;
overflow: hidden;
font-weight: normal;
color: #909090;
box-sizing: border-box;
}
.nl_osn a {
text-decoration: none;
}
.tr {
width: 100%;
display: table;
padding: 5px 10px;
background: #fff;
border-bottom: 1px solid #f1f1f1;
-webkit-transition: all .3s ease;
-moz-transition: all .3s ease;
-o-transition: all .3s ease;
-ms-transition: all .3s ease;
transition: all .3s ease;
cursor: default;
box-sizing: border-box;
}
.tr:hover,
.tr:focus {
background: #f3f2f0;
color: #000;
}
.tr span,
.th {
display: table-cell;
color: #3b3e4a;
box-sizing: border-box;
}
.download1 {
width: 72%;
vertical-align: middle;
}
.size1,
.type1 {
width: 8%;
padding: 0 3px;
text-align: right;
vertical-align: middle;
}
a.pdf,
a.pdf:visited {
display: block;
float: right;
font-size: 13px;
font-weight: bold;
margin-bottom: 5px;
margin-left: 5px;
text-align: center;
letter-spacing: 1px;
text-decoration: none;
text-transform: uppercase;
padding: 9px 12px;
display: table-cell;
top: 3px;
position: relative;
color: #fff;
background: #3b62ae;
}
a.pdf:hover,
a.pdf:focus{
color: #fff;
background: #1a1a1a;
}
/*--------------- video -----------------*/
.video{
width: 100%;
max-width: 800px;
margin: 0px;
}
.videowrapper {
float: none;
clear: both;
width: 100%;
position: relative;
padding-bottom: 56.2%;
height: 0;
/*border: 2px solid #819dd2;*/
/*margin-top: 20px;*/
}
.videowrapper iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: 0;
}
.main-video {
margin-bottom: 20px;
}
/*-------------------------- Tags ---------------------------- */
.post-tags{
margin: 30px 0px 0px;
color: #474747;
}
.post-tags a{
display: inline-block;
font-size: 14px;
color: #474747;
line-height: 28px;
padding: 0px 10px;
background: #dcdcdc;
margin-left: 4px;
margin-bottom: 6px;
font-weight: 500;
}
.post-tags a:hover,
.post-tags a:focus{
background: #1d1b59;
color: #fff;
}
/*----------------- similar news in details ------------------*/
.similar-news{
border-top: 4px solid #f0f0f0;
padding-top: 40px;
}
.similar-news .blog-horizontal .blog-item:last-child{
border-bottom: none;
}
/*contact form------------------------------------------------------------------*/
.map{
height: 450px;
margin-bottom: 40px;
overflow: hidden;
}
.map iframe{
pointer-events: none;
}
.address{
margin-bottom: 40px;
box-sizing: border-box;
}
.address strong{
color: #1d1b59;
}
.contact-form {
float: left;
width: 50%;
}
.contact-form .heading, .address .heading{
font-size: 22px;
}
.contact-form .btn{
margin-top: 15px;
padding: 14px 20px;
}
.label {
display: block;
font-size: 14px;
color: #909090;
margin-bottom: 7px;
}
.captcha input {
width: 250px;
}
.captcha img {
border: 2px solid transparent;
}
.captcha img:hover{
border: 2px solid #999;
opacity: 0.9;
}
/* star-rating */
.star-evaluate.star-evaluate-1 .star-1,
.star-evaluate.star-evaluate-2 .star-1,
.star-evaluate.star-evaluate-2 .star-2,
.star-evaluate.star-evaluate-3 .star-1,
.star-evaluate.star-evaluate-3 .star-2,
.star-evaluate.star-evaluate-3 .star-3,
.star-evaluate.star-evaluate-4 .star-1,
.star-evaluate.star-evaluate-4 .star-2,
.star-evaluate.star-evaluate-4 .star-3,
.star-evaluate.star-evaluate-4 .star-4,
.star-evaluate.star-evaluate-5 .star-1,
.star-evaluate.star-evaluate-5 .star-2,
.star-evaluate.star-evaluate-5 .star-3,
.star-evaluate.star-evaluate-5 .star-4,
.star-evaluate.star-evaluate-5 .star-5{
color: #ffb000;
}
/*--------------------- loading spinner ---------------------*/
.spinner{
display:none;
position: fixed;
top:0px;
left:0px;
width:100%;
height:100%;
background: rgba(255,255,255,0.8);
z-index: 900000;
}
body.loading .spinner{
display: block;
}
.mesh-loader {
overflow: hidden;
height: 100%;
width: 100%;
}
.mesh-loader .circle {
width: 18px;
height: 18px;
position: absolute;
background: rgba(0,0,0,0.8);
border-radius: 50%;
margin: -9px;
-webkit-animation: mesh 3s ease-in-out infinite;
animation: mesh 3s ease-in-out infinite -1.5s;
}
.mesh-loader > div .circle:last-child {
-webkit-animation-delay: 0s;
animation-delay: 0s;
}
.mesh-loader > div {
position: absolute;
top: 50%;
left: 50%;
}
.mesh-loader > div:last-child {
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}
.input-place.jq-validate-error,
.checkbox-custom.jq-validate-error input[type="checkbox"] + label::before
{
border:1px solid red;
}
.buyNow {
margin-top: 30px;
}
.buyNow .title {
padding-left: 12px;
}
@-webkit-keyframes mesh {
0% {
-webkit-transform-origin: 50% -100%;
transform-origin: 50% -100%;
-webkit-transform: rotate(0);
transform: rotate(0);
}
50% {
-webkit-transform-origin: 50% -100%;
transform-origin: 50% -100%;
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
50.00001% {
-webkit-transform-origin: 50% 200%;
transform-origin: 50% 200%;
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform-origin: 50% 200%;
transform-origin: 50% 200%;
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes mesh {
0% {
-webkit-transform-origin: 50% -100%;
transform-origin: 50% -100%;
-webkit-transform: rotate(0);
transform: rotate(0);
}
50% {
-webkit-transform-origin: 50% -100%;
transform-origin: 50% -100%;
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
50.00001% {
-webkit-transform-origin: 50% 200%;
transform-origin: 50% 200%;
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform-origin: 50% 200%;
transform-origin: 50% 200%;
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.cart-pr-wrap {
padding: 0 25px;
max-height: 340px;
overflow-y: auto;
}
.search-wrap h4 {
padding: 0 24px;
font-size: 15px;
}
/*-------------- my order list ---------------*/
.order-list-one{
background: #fff;
padding: 15px 20px;
position: relative;
margin-bottom: 15px;
border: 1px solid #ddd;
-webkit-transition: all .3s ease;
-moz-transition: all .3s ease;
-o-transition: all .3s ease;
-ms-transition: all .3s ease;
transition: all .3s ease;
}
.order-head{
border-bottom: 1px solid #f1f1f1;
padding-bottom: 10px;
margin-bottom: 10px;
position: relative;
}
.order-head h3{
text-transform: none;
font-size: 16px;
font-weight: 600;
}
.order-head h3 a{
color: #fa7012;
}
.order-list-one .text{
font-size: 12px;
line-height: 20px;
}
.shipping-status{
color: #e92222;
font-size: 16px;
}
.order-head .btn-transp{
position: absolute;
top: 0px;
right: 0;
margin: 0px;
font-size: 11px;
padding: 7px 13px;
}
/*-------------- my order details ---------------*/
.in-order-details{
width: 300px;
padding: 30px;
}
.order-details{
margin: 0 -20px;
}
.order-details-box{
display: inline-table;
vertical-align: top;
width: 33.333%;
margin-right: -4px;
padding: 20px;
font-size: 15px;
line-height: 22px;
box-sizing: border-box;
}
.order-details-box h6{
font-size: 17px;
margin-bottom: 10px;
text-transform: none;
}
.order-details-box p{
margin: 5px 0px;
}
.topAlert {
width:100%;
box-sizing: border-box;
margin:15px auto;
padding: 0px;
border: 1px solid #ff6800;
line-height: 24px;
color: #292761;
font-size: 15px;
max-width: 100%;
overflow: hidden;
height: 30px;
background-color: #fff;
line-height: 30px;
}
.topAlert a {
color: #292761;
}
.topAlert a atrong,
.topAlert strong {
display:inline-block;
padding: 0 10px;
background-color: #ff6800;
color:#fff;
text-transform: uppercase;
margin-right: 10px;
}
.topAlert a:hover {
color:#ff6800;
}
.topAlert a:hover strong {
color:#fff;
}
.number-qty {
position: absolute;
top: 10px;
right: 168px;
}
.shop-qty .number-qty {
position: relative;
top: auto;
right: auto;
}
/*------------------- profile image (avatar) ---------------------*/
.profile-top{
margin-top: 20px;
background: #e8effc;
padding: 15px 25px 15px 20px;
margin-bottom: 35px;
}
.profile-top .breadcrumb{
float: right;
line-height: 120px;
margin-bottom: 0px;
margin-top: 0px;
}
.profile-top h1{
float: left;
color: #1d1b59;
font-size: 32px;
line-height: 120px;
}
/*------- profile image -------*/
.profile-pic {
float: left;
width: 120px;
height: 120px;
background: #3b62ae;
color: #fff;
border-radius: 50%;
position: relative;
margin-right: 20px;
overflow: hidden
}
.ini{
font-size: 34px;
line-height: 30px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.profile-pic img {
left: 0;
right: 0;
top: 0;
bottom: 0;
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 50%;
overflow: hidden;
}
.add-profile-pic {
width: 26px;
height: 26px;
display: inline-block;
vertical-align: top;
background: #fff;
border-radius: 30px !important;
position: absolute;
left: calc(50% + 26px);
bottom: 10px;
padding: 0;
box-shadow: 1px 1px 5px 1px rgba(0,0,0,0.2);
}
.add-profile-pic input {
opacity: 0;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: 2;
cursor: pointer;
display: block;
width: 100%;
}
.add-profile-pic i.fa-pencil{
width: 26px;
height: 26px;
margin: 0px;
cursor: pointer;
font-size: 13px;
line-height: 27px;
color: #3b62ae;
text-align: center;
}
/*--------------- personal details ------------- */
.personal-details .connect-with{
margin-top:0px;
text-align:left;
}
.personal-details .connect-with a{
display: inline-block;
font-size: 14px;
padding: 9px 20px 11px;
margin-right: 5px;
}
.personal-details .connect-with a i{
font-size: 16px;
}
.personal-details .btn {
padding: 14px 20px;
min-width: 180px;
margin-top: 15px;
}
.payment-group{
float:left;
width: 33%;
}
.delivery-group{
float:right;
width: 66%;
}
.courier-group{
width: 50%;
float:left;
padding-right: 10px;
box-sizing: border-box;
}
.courier-group .radio-custom{
display: block;
}
.courier-group label{
display: block;
margin-bottom: 10px;
}
/*----------------------- blockquote ---------------------------- */
blockquote {
background:#ececec;
padding: 40px 30px 40px 100px;
font-size: 19px;
line-height: 27px;
font-style: italic;
color: #474747;
margin: 20px 0;
display: block;
position: relative;
overflow: hidden;
}
blockquote:before{
content: '\f10e';
font-weight: bold;
font-style: normal;
font-family: 'Font Awesome 5 Pro';
position: absolute;
top: 40px;
left: 28px;
font-size: 45px;
color: #1d1b59;
}
.tagsContainer {
margin:20px 0;
}
.tag-cube {
width:100%;
list-style-type: none;
margin:0px;
padding:0px;
}
.tag-cube li {
display:inline-block;
margin:0;
padding:0;}
.tag-filter {
position: relative;
background: #f5f5f5;
display: block;
max-width: 100%;
word-wrap: break-word;
color: #26282b;
padding: 4px 8px;
border-radius: 2px;
border: 1px solid #d0d0d0;
margin: 0 5px 5px 0;
font-size:15px;
}
.tag-filter:hover {
background-color:#3181c8;
color:#fff;
border-color:#3181c8;
}
.tagsContainer .tag-filter {
display:inline-block;
}
.mlli-73, .mlli-75, .mlli-76, .mlli-77 {
display: none;
}
/*/*media queries----------------------------------------------------------*/
@media only screen and (max-width: 1700px) {
.slick-next, .slick-prev{width: 37px !important; height: 37px !important; margin-top: -19px !important; border: 1px solid #f1f1f1 !important;}
.slick-next{right: 0px !important;}
.slick-prev{left: 0px !important;}
.slick-prev:before, .slick-next:before{font-size: 22px !important; line-height: 37px !important;}
.choosen-slider .slick-next, .new-pr-slider .slick-next, .promo-slider .slick-next, .similar-slider .slick-next, .last-seen-slider .slick-next, .recommend-slider .slick-next{top: -40px;}
.choosen-slider .slick-prev, .new-pr-slider .slick-prev, .promo-slider .slick-prev, .similar-slider .slick-prev, .last-seen-slider .slick-prev, .recommend-slider .slick-prev{top: -40px; left: auto !important; right: 45px;}
}
@media only screen and (max-width: 1580px) {
#menu ul li a{font-size: 16px; padding: 17px 11px 14px;}
#menu ul li.menuSpec > a:after{left: 10px;}
#menu ul li.menuSpec > a{padding-left: 31px;}
.book-month .title h2, .most-wanted .title h2{font-size: 23px;}
}
@media only screen and (max-width: 1440px) {
.header-contacts a strong{font-size: 22px; line-height: 22px; top: 3px; margin-left: 0px;}
.search-wrap{width: 500px;}
.search-form{margin-left: -250px;}
.sidebar-left{width: 250px;}
.main-part{width: calc(100% - 290px);}
.index-sidebar-menu.internal .sidebar-menu-title{font-size: 17px;}
.sidebar-menu .cd-accordion-menu a{font-size: 16px; padding: 10px 30px 10px 20px;}
.sidebar-menu .cd-accordion-menu label{height: 38px;}
.product-box{padding: 0 10px;}
.products-wrap{margin: 0 -10px;}
.wanted-pr-slider{margin: 0 -10px;}
}
@media only screen and (max-width: 1390px) {
.header-contacts a{font-size: 0px; letter-spacing: normal;}
.header-contacts a strong{line-height: normal; top: 7px;}
#menu ul li a{font-size: 15px;}
.description-wrap{width: 39%; padding-left: 35px;}
.delivery-in-details{width: 29%; padding-left: 45px;}
.footer-socials{margin-left: 150px;}
.heading{font-size: 30px;}
.most-wanted .title h2{max-width: 470px;}
.book-month .title h2{max-width: 160px;}
.delivery-one h4{font-size: 13px;}
.delivery-one{font-size: 13px;}
}
@media only screen and (max-width: 1300px) {
.offer-valid h6{float: none;}
.offer-valid .v-time{float: left;}
.delivery-info .attribute-list li strong{display: block; float: none; width: auto;}
.delivery-one{width: 50%; margin: 5px 0px; min-height: 36px;}
.delivery{padding: 5px 0px;}
.delivery-one figure img{max-height: 32px;}
.delivery-one figure{line-height: 32px; width: 37px; text-align: center; margin-right: 5px;}
}
@media only screen and (max-width: 1260px) {
.search-wrap{width: 420px;}
.search-form{margin-left: -210px;}
#menu ul li a{padding: 17px 5px 14px;}
#menu ul li.menuSpec > a:after{left: 8px;}
#menu ul li.menuSpec > a{padding-left: 28px;}
.header-contacts a strong{font-size: 20px;}
.header-contacts a img{max-width: 20px;}
.reviews-wrap li{width: 22%;}
.reviews-wrap li:nth-child(1){width: 44%;}
.reviews-wrap li:nth-child(2){width: 56%;}
.footerContats{float: none; width: auto;}
.footer-flex{float: none; width: auto;}
.footBox{float: left; width: 50%;}
.subscribe{float: left; width: 100%; padding: 30px; background: #345394; box-sizing: border-box; margin-bottom: 20px;}
.product-box{width: 33.333%;}
.author-books .product-box{width: 25%;}
.footer-socials{margin-left: 50px;}
.image-gallery{width: 45%;}
.description-wrap{width: 55%;}
.delivery-in-details{width: 100%; padding-left: 0px; display: none;}
.delivery-in-details.del-bottom{display: block;}
.offer-valid h6{float: left;}
.offer-valid .v-time{float: right;}
.delivery-in-details .delivery-one{display: inline-table; vertical-align: top; width: 48%; margin-right: 1%;}
.top-login .connect-with{display: block; margin-left: 0px;}
.cart-summary{width: 300px; padding: 30px 25px;}
.cart-left-container{width: calc(100% - 335px);}
}
@media only screen and (max-width: 1240px) {
.book-month{width: 33.333%;}
.most-wanted{width: 66.666%}
}
@media only screen and (max-width: 1200px) {
.login, .favourite{margin-right: 8px;}
.favourite > a > span{right: -7px;}
.search-input{padding: 0 10px;}
.search-wrap{width: 380px;}
.index-news{padding: 50px 0 20px;}
.index-sidebar-menu{width: 235px;}
.index-sidebar-menu ul a{padding: 0 10px;}
.index-right-part, .fade{width: calc(100% - 255px);}
.sidebar-menu-title{font-size: 16px;}
.trigger-wrap{width: 50px; margin-right: 10px; padding-left: 11px;}
}
@media only screen and (max-width: 1150px) {
.blog-item{padding: 0 10px;}
.news-wrap{margin: 0 -10px;}
.author-image{width: 360px;}
.footer-socials{font-size: 13px;}
.design-by{font-size: 13px;}
}
@media only screen and (max-width: 1100px) {
.cart > a{font-size: 0px;}
.acc-one{width: 33.333%;}
}
@media only screen and (max-width: 1020px) {
header .responsive-menu-btn{display: block;}
#menu{display: none;}
.header-contacts{background: transparent; display: none;}
.header-contacts a{line-height: 41px; color: #fa7012;}
.header-contacts a strong{color: #fff; position: relative;}
.header-contacts a strong::before{content: '\f095'; position: absolute; top:2px; left: -25px; font-family: "Font Awesome 5 Pro"; color: #fff; font-size: 18px; font-weight: lighter; -webkit-transform: scaleX(-1); transform: scaleX(-1);}
.header-contacts a img{display: none;}
.menu-wrap{background: #fa7012;}
.footer-logo{float: none; text-align: center; margin-bottom: 30px;}
.footer-socials{margin-left: 0px; line-height: 34px;}
.design-by{line-height: 34px;}
.footer-title{font-size: 20px;}
.content{padding-top: 127px;}
.index-sidebar-menu{display: none;}
.index-sidebar-menu.internal{display: block;}
.fade{float: none; width: auto; height: 380px !important;}
.reviews-wrap li:nth-child(1), .reviews-wrap li:nth-child(2){float: none; width: auto; height: auto;}
.reviews-wrap li{width: 50%; margin-bottom: 40px;}
.btn-view-all{text-align: center;}
.video-reviews .btn-view-all{text-align: center; margin-top: 0px;}
.video-reviews{padding: 50px 0 30px;}
.blog-item{width: 50%; padding: 0 15px; margin-bottom: 40px;}
.news-wrap{margin: 0 -15px;}
.index-news .btn-view-all{margin-top: 0px;}
.author-list ul{-webkit-columns: 3;-moz-columns: 3;columns: 3;}
.index-right-part, .fade{float: none; width: auto; height: auto !important;}
.shop-prod figure{width: 80px;}
.shop-prod-info{width: calc(100% - 95px);}
.form-flex{padding: 0px;}
}
@media only screen and (max-width: 980px) {
.main-part{float: none; width: auto;}
.sidebar-left{display: none; float: none; padding: 20px 30px; margin: 0px; width: 100%;position: fixed;left: 0px;bottom: 0px;z-index: 99000;background: #fff;max-height: 100%;overflow-y: scroll;box-sizing: border-box;}
.responsive-filters{display: block;}
.close-filter{display: block;}
.how-many{display: none;}
.sort-float{margin-top: 5px; margin-right: 30px;}
.sort-wrap-inner{float: left;}
.sort-wrap{margin-bottom: 30px;}
.description-wrap{padding-left: 25px;}
.author-image{width: 320px; margin-right: 25px;}
.filter-10 {display: block;}
.cart-left-container{float: none; width: auto;}
.shop-prod-info{width: calc(100% - 120px);}
.shop-prod figure{width: 100px;}
.cart-summary{float: none; width: auto; margin-top: 40px; padding: 40px;}
.sidebar-profile{float: none; width: auto; margin-bottom: 25px; position: relative;}
.profile-avatar{ padding-bottom: 10px; border-bottom: 1px solid #ccc; margin-bottom: 0px;}
.profile-pic{width: 80px; height: 80px;}
.ini{font-size: 30px;}
.profile-menu{display: none;}
.in-order-details{margin-top: 0px; margin-bottom: 20px;}
}
@media only screen and (max-width: 900px) {
.offer-valid h6{float: none;}
.offer-valid .v-time{float: left;}
.heading{font-size: 28px;}
.price-inner .btn{position: relative; top: auto; right: auto; margin-top: 30px;}
.author-books .product-box{width: 33.333%;}
.price-inner .heart-icon{top: 0px;}
.subscribe{margin-bottom: 10px;}
.footer-menu{float: none; margin-right: 0px;}
.foot-content{height: 0px;}
.foot-content-inner{padding: 10px;}
.flex-item {-webkit-flex: 0 0 100%;-ms-flex: 0 0 100%;flex: 0 0 100%; margin-bottom: 5px; margin-top: 0px;}
.search-input{font-size: 14px;}
.search-form{margin-left: -190px;}
.footer-socials{float: none; text-align: center;}
.design-by{float: none; text-align: center;}
.flex-item {-webkit-flex: 0 0 100%;-ms-flex: 0 0 100%;flex: 0 0 100%; margin-bottom: 5px; margin-top: 0px;}
.order-details-box{width: 50%;}
}
@media screen and (max-width: 800px) {
.fade{height: 300px !important;}
.sw-2{width: 145px;}
.sw-1{width: 80px;}
.sort-float label{margin-right: 10px;}
.sort-float{margin-right: 20px;}
.image-gallery{float: none; width: auto;}
.description-wrap{float: none; width: auto; padding: 0px;}
.offer-valid h6{float: left;}
.offer-valid .v-time{float: right;}
.price-inner .btn{position: absolute; top: 0px; right: 0px; margin-top: 0px;}
.comments-review ul li{padding: 20px 0px;}
.tab-content{padding: 25px 20px;}
.tab-content .video{float: none; padding-right: 0px; width: auto;}
.tabs-menu li a{padding: 0 25px; font-size: 17px;}
.author-image{float: none; width: auto; margin-right: 0px;}
.author-list ul{-webkit-columns: 2;-moz-columns: 2;columns: 2;}
.price-inner .heart-icon{top: 52px;}
.fluid-menu .cart-pr-wrap{padding: 0 10px;}
.cart-pr-wrap {max-height: 380px;}
.search-wrap{width: 300px;}
.search-form{margin-left: -150px;}
.search-submit{font-size: 0px; width: 40px; letter-spacing: normal;}
.search-submit i{margin-right: 0px; top: 5px; position: relative;}
.search-input{width: calc(100% - 40px);}
.profile-top h1{font-size: 31px;}
.personal-details ul li span{width: 130px;}
.personal-details ul li strong{width: calc(100% - 130px);}
.wanted-pr-slider .slick-next, .wanted-pr-slider .slick-prev{top: -28px !important;}
}
@media only screen and (max-width: 740px) {
.shop-prod figure{width: 80px;}
.shop-prod-info{width: calc(100% - 95px);}
.c4{-webkit-flex: 0 0 25px; -ms-flex: 0 0 25px; flex: 0 0 25px;}
.book-month,.most-wanted{width: 100%; float: none; padding: 13px;}
.book-month{margin-bottom: 20px;}
.book-month .title h2{max-width: none;}
.book-month .pr-title{min-height: inherit;}
}
@media only screen and (max-width: 700px) {
.reviews-wrap li, .blog-item{padding: 0 10px;}
.reviews-wrap, .news-wrap{margin: 0 -10px;}
.delivery-in-details .delivery-one{padding: 20px;}
.delivery-info{padding: 20px; margin-top: 15px;}
.sort-float{margin-right: 15px;}
.sort-float:nth-child(2){margin-right: 0px;}
.payment-group, .delivery-group{float: none; width: auto;}
.payment-group{margin-bottom: 25px;}
.search-wrap{width: 230px;}
.search-form{margin-left: -115px;}
.comments ul li figure{margin-right: 15px;}
.comments ul li{padding: 20px 0px;}
.col-3 .float-flex{-webkit-flex: 0 0 49%;-ms-flex: 0 0 49%;flex: 0 0 49%;}
.col-2 .float-flex{-webkit-flex: 0 0 100%;-ms-flex: 0 0 100%;flex: 0 0 100%;}
.input-place{margin-bottom: 12px;}
.profile-top .breadcrumb{float: none; width: auto; line-height: normal; text-align: center;}
.profile-pic{float: none; margin: 0 auto;}
.profile-top h1{float: none; text-align: center; line-height: normal;}
}
@media only screen and (max-width: 680px) {
.acc-one{width: 50%;}
.col-3 .float-flex{-webkit-flex: 0 0 48%; -ms-flex: 0 0 48%; flex: 0 0 48%;}
.col-4 .float-flex{-webkit-flex: 0 0 48%; -ms-flex: 0 0 48%; flex: 0 0 48%;}
.personal-details{padding: 25px 30px;}
}
@media only screen and (max-width: 640px) {
.fade{height: 240px !important;}
.b-wrap{padding: 10px 0px;}
.reviews-wrap li:nth-child(2) .video-item-title{font-size: 25px;}
.video-item-title{font-size: 17px;}
.video-item figure{margin-bottom: 10px;}
.b-img{margin-bottom: 10px;}
.blog-title{font-size: 17px;}
.tabs-menu li{float: none;}
.delivery-in-details .delivery-one{display: block; width: auto; margin-right: 0px;}
.author-books .product-box{width: 50%;}
.iframe-pop .btn-place .btn{margin-bottom: 5px;}
header .responsive-menu-btn{padding: 9px 10px 11px;}
.fluid-menu{width: 290px;}
.checkout-top-login{padding: 10px; margin-bottom: 15px;}
.checkout-top-login p{padding: 0; font-size: 15px; line-height: 21px; max-width: calc(100% - 150px);}
.add-comment-review { width: 100%;}
.search-wrap{width: 190px;}
.search-form{margin-left: -95px;}
.wrapper{padding: 0 10px;}
.product-box{width: 50%;}
.upload-image-wrap li{width: 33.333%; padding-bottom: 10px; padding-right: 10px;}
.shopOrder{margin-bottom: 25px;}
.shopOrder-row{flex-wrap: wrap; justify-content: space-between; text-align: left;}
.shopOrder-row > div{padding: 7px 0px;}
.c1{-webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%;}
.shop-price:before, .shop-qty:before, .shop-sum:before {display: block;}
.shopOrder-head{display: none;}
.in-order-details{margin-top: 20px;}
/* responsive sorting */
.responsive-sort{display: block;}
.sort-wrap-inner{float: none; display: none; position: absolute; top: calc(100% + 5px); left: 0px; right: 0px; background: #fff; z-index: 20; border: 1px solid #ccc; padding: 15px; box-sizing: border-box;}
.sort-float{margin: 5px 0px; float: none;}
.sort-float label{width: 90px;}
.sort-float .field-right{width: calc(100% - 100px);}
.sw-2, .sw-1{width: 100%;}
.sort-float .styled-select:after{right: 10px;}
.sort-wrap{margin-bottom: 20px;}
}
@media only screen and (max-width: 550px) {
.cart{padding-bottom: 0px;}
.login-choice i{width: 34px; height: 34px; line-height: 32px; font-size: 14px;}
.login-choice{line-height: 30px;}
.favourite > a i{width: 34px; height: 34px; line-height: 34px; font-size: 14px;}
.cart > a{line-height: 34px; padding-left: 34px;}
.cart > a:before{width: 34px; height: 34px; line-height: 34px; background: #fff; color: #fa7012; font-size: 14px; font-weight: normal;}
.login, .favourite{margin-right: 5px;}
.login-list{top: 37px;}
.delivery{margin-bottom: 10px; display: none;}
.b-wrap{padding: 0px;}
.b-wrap .wrapper{padding: 0px;}
.author-list ul{-webkit-columns: 1;-moz-columns: 1;columns: 1;}
.letters-choice > a{font-size: 18px;}
.topAlert { text-align: center; height: auto; line-height: 20px;}
.topAlert strong { margin-right: 0px; display: block;}
header .responsive-menu-btn{float: left;}
.header-right{position: absolute; top: 80px; right: 10px; float: none; margin-top: 0px;}
.content{padding-top: 120px;}
.footBox{float: none; width: auto;}
.date-and-share{margin-bottom: 5px;}
.search-form{position: relative; top: 0px; left: 0px; margin-left: 0px; float: right; margin-top: 15px; width: 230px;}
.search-wrap{width: 100%;}
.header-main{height: 70px;}
.logo{padding-top: 11px;}
.input{width: 100%;}
.order-details-box{display: block; width: auto; margin-right: 0px; padding: 13px 0px;}
.order-details{margin: 0px;}
.back-link{float: none;}
.some-form .btn-place{text-align: left;}
.some-form .btn-place .btn{margin-top: 10px;}
.iframe-pop .btn-place .btn{display: block;}
.header-contacts{right: 135px;}
.header-contacts a strong{font-size: 16px;}
.header-contacts a strong::before{font-size: 16px; left: -22px;}
.text-move strong{display: none;}
}
@media only screen and (max-width: 500px) {
.fade{height: 190px !important;}
.choosen-products, .new-products, .promo-products{padding: 35px 0 0;}
.blog-item{display: block; margin-right: 0px; padding: 0px; width: auto; margin-bottom: 30px;}
.news-wrap{margin: 0px;}
.blog-title{margin-bottom: 5px;}
.index-news{padding: 35px 0 10px;}
.subscribe{padding: 20px;}
.heading{font-size: 25px;}
.offer-valid h6{float: none;}
.offer-valid .v-time{float: left;}
.image-gallery{margin-bottom: 20px;}
.comment-box{float: none; width: auto;}
.comment-text{float: none; width: auto;}
.checkout-top-login p{float: none; max-width: none; padding: 0px;}
.checkout-top-login .btn{float: none; margin-top: 10px; font-size: 13px; padding: 7px 20px;}
.cart-pr-wrap {max-height: 300px;}
.col-2 .float-flex{-webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%;}
.col-3 .float-flex{-webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%;}
.col-4 .float-flex{-webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%;}
.responsive-sort, .responsive-filters{padding-right: 10px; width: 49%;}
.personal-details ul li span{float: none; line-height: 26px; width: auto; padding-right: 0px;}
.personal-details ul li strong{float: none; width: auto;}
.personal-details{padding: 15px 20px;}
.personal-details ul li:last-child span{display: none;}
.order-head .btn-transp{top: calc(100% + 15px);}
.login-list{width: 300px;}
h1{font-size: 24px;}
h2{font-size: 22px;}
.float-field{float: none; width: auto; padding: 0px;}
.row{margin: 0px;}
.write-comment{padding: 20px;}
.input{width: 100%;}
.captcha input{width: 155px;}
.col-3 .float-flex{-webkit-flex: 0 0 100%;-ms-flex: 0 0 100%;flex: 0 0 100%;}
.profile-top h1{font-size: 26px;}
.most-wanted .title{margin-right: 0px; margin-bottom: 50px;}
}
@media only screen and (max-width: 450px){
.reviews-wrap li:nth-child(2) .video-item-title{font-size: 20px;}
.fl-left h1, .fl-left h2, .fl-left h3{float: none; padding-right: 100px;}
.price-inner .btn{position: relative;top: auto;right: auto;margin-top: 50px; display: block;}
.description-wrap{margin-bottom: 25px;}
.number-qty {top: 80px; right: auto; left: 0px;}
.price-inner .heart-icon{top: 68px;}
.date, .time, .people-share{font-size: 13px;}
.search-form{width: 200px;}
.upload-image-wrap li{width: 50%;}
.acc-one{width: 100%; padding: 0 10px;}
}
@media only screen and (max-width: 430px){
.reviews-wrap li{float: none; width: auto; margin-bottom: 25px;}
.author-books .product-box{width: auto;}
.how-many{font-size: 11px; padding-top: 3px;}
header .responsive-menu-btn em{display: none;}
.courier-group{float: none; width: auto;}
.checkout-top-login .btn{display: block;}
.checkout-top-login p{font-size: 15px; line-height: 22px;}
.book-month h3{padding-right: 20px; font-size: 26px;}
.content{padding-top: 116px;}
.login-list{right: -77px;}
.product-box{display: block; width: auto; margin-right: 0px;}
.pr-title{min-height: inherit;}
.search-form{width: 175px;}
.comments ul li figure{width: 65px; height: 65px;}
.responsive-sort, .responsive-filters{padding: 6px 5px 6px 33px; font-size: 12px;}
.responsive-sort::before, .responsive-filters::before{left: 6px; font-size: 22px;}
.choose-size-select .input-place{width: auto;}
.size-guide{position: relative; top: auto; right: auto; margin-top: 12px;}
.fast-order .input-place{float: none; width: auto;}
.fast-order .btn{float: none; min-width: inherit; display: block; margin-bottom: 10px;}
.fast-order{padding: 20px;}
.col-2 .float-flex, .col-3 .float-flex, .col-4 .float-flex{webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%;}
.form-flex{padding: 0px;}
.float-flex .jq-captcha{margin-top: 0px; margin-bottom: 20px;}
.some-form .connect-with a{display: block;}
.forgot-pass-link{text-align: left;}
.cart-summary{padding: 30px 25px; margin-top: 30px;}
.c3{-webkit-flex: 0 0 85px; -ms-flex: 0 0 85px; flex: 0 0 85px;}
.order-head .btn-transp{min-width: inherit; width: 110px; letter-spacing: normal; top: calc(100% + 11px);}
.order-list-one{padding: 15px;}
}
@media only screen and (max-width: 360px){
.logo{width: 125px; padding-top: 16px;}
.content{padding-top: 116px;}
.cart-list{width: 280px;}
.cart-list .btn{float: none; display: block; margin-bottom: 3px;}
.fade{height: 140px !important;}
.heading{font-size: 24px;}
.iframe-pop{padding: 20px 10px !important;}
.popup-similar-pr{margin-top: 15px; padding: 25px 10px;}
.how-many{font-size: 10px;}
.responsive-sort, .responsive-filters{padding: 6px 0px 6px 32px;}
.header-contacts a{line-height: 39px;}
.header-contacts a strong, .header-contacts a strong::before{font-size: 15px;}
.header-right{top: 79px;}
.content{padding-top: 114px;}
.delivery-one{padding: 0px; float: none; width: auto; text-align: center; margin-bottom: 25px;}
.delivery-one figure{float: none; width: auto; text-align: center; margin-right: 0px; line-height: normal; margin-bottom: 8px;}
.search-submit{width: 32px;}
.search-input{width: calc(100% - 32px); font-size: 13px;}
.search-form{width: 165px;}
body{font-size: 15px;}
.text, p{line-height: 22px;}
}
@media only screen and (max-width: 320px){
}