/* http://meyerweb.com/eric/tools/css/reset/



   v2.0 | 20110126



   License: none (public domain)



*/



html, body, div, span, applet, object, iframe,

h1, h2, h3, h4, h5, h6, p, 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, ol, ul, li,

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;



    border: 0;



    font-size: 100%;



    vertical-align: baseline;



}



/* HTML5 display-role reset for older browsers */



article, aside, details, figcaption, figure,

footer, header, hgroup, menu, nav, section {



    display: block;



}



body {



    line-height: 1;



}



ol, ul {



    list-style: none;



}



blockquote, q {



    quotes: none;



}



blockquote:before, blockquote:after,

q:before, q:after {



    content: '';



    content: none;



}



table {



    border-collapse: collapse;



    border-spacing: 0;



}



img {



    max-width: 100%;



}



a,

a:active, a:visited,

a:focus,

a:hover {



    text-decoration: none;



    transition: .3s;



}



.account_box > a:hover{

    color: #fff;

}



.single_user_addr_actions > a:hover{

    color: #fff;

}



strong {



    font-weight: 900;



}



body {



    font-weight: 400;



    overflow-x: hidden;



    line-height: 1.375em;



}



body.sub-hidden {



    overflow-y: hidden;



}



.container {



    position: relative;



}



.container-custom {



    max-width: 1000px;



    width: 100%;



    height: 100%;



    padding-right: 15px;



    padding-left: 15px;



    margin-right: auto;



    margin-left: auto;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .container-custom {



        max-width: 720px;



    }



}



@media screen and (max-width: 767px) {



    .container-custom {



        max-width: 540px;



    }



}



.container-custom::after, .container-custom::before {



    content: '';



    display: table;



    clear: both;



}



button {



    border: none;



}



input,

textarea {



    outline: 0;



    border: none;



}



p {



    word-break: break-word;



}



.btn {



    white-space: normal;



    -moz-border-radius: 10px;



    -webkit-border-radius: 10px;



    display: block;



    border-radius: 10px;



    line-height: 2.5em;



    min-width: 240px;



    letter-spacing: .1em;



    border: 1px solid transparent;



}



@media screen and (max-width: 767px) {



    .btn {



        width: 100%;



    }



}



@media screen and (max-width: 767px) {



    .mobile-none {



        display: none;



    }



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .tablet-none {



        display: none;



    }



}



@media screen and (min-width: 992px) and (max-width: 1199px) {



    .tablet-lg-none {



        display: none;



    }



}



@media screen and (min-width: 1200px) {



    .desktop-none {



        display: none;



    }



}



.highlight {



    color: #F3E303;



    font-weight: bold;



}



.breadcrumbs {



    position: relative;



    height: auto;

    padding: 7px 0;

    width: 100%;



    display: flex;



    align-items: center;



    background-color: #eeeeee;



    z-index: 2;



}



.breadcrumbs-content {



    font-size: 0.875em;



}



@media screen and (max-width: 767px) {



    .breadcrumbs-content {



        font-size: 0.75em;



    }



}



.breadcrumbs-content li {



    display: inline-block;



    color: #3c1d49;



}



.breadcrumbs-content li span {



    padding: 0 4px 0 8px;



}



.breadcrumbs-content li a {



    color: #3c1d49;



    display: inline-block;



}



.breadcrumbs-content li a span {



    display: block;



    padding: 0 8px;



}



.breadcrumbs-content li a:hover {



    text-decoration: underline;



}



.swiper-container {



    width: 100%;



    height: 100%;



    margin-left: auto;



    margin-right: auto;



}



.swiper-slide-center {



    text-align: center;



    font-size: 18px;



    background: #fff;



    /* Center slide text vertically */



    display: -webkit-box;



    display: -ms-flexbox;



    display: -webkit-flex;



    display: flex;



    -webkit-box-pack: center;



    -ms-flex-pack: center;



    -webkit-justify-content: center;



    justify-content: center;



    -webkit-box-align: center;



    -ms-flex-align: center;



    -webkit-align-items: center;



    align-items: center;



}



.swiper-slide.swiper-slide-review {



    background: transparent;



    display: -webkit-box;



    display: -ms-flexbox;



    display: -webkit-flex;



    display: flex;



    -webkit-justify-content: center;



    -webkit-box-pack: center;



    -moz-justify-content: center;



    -moz-flex-pack: center;



    -ms-justify-content: center;



    -ms-flex-pack: center;



    -o-justify-content: center;



    justify-content: center;



    -webkit-box-align: center;



    -ms-flex-align: center;



    -webkit-align-items: center;



    align-items: center;



    transition: transform .2s ease;



}



.swiper-slide.swiper-slide-review a {



    display: block;



    position: relative;



    height: 210px;



}



.swiper-slide.swiper-slide-review a::before {



    content: '';



    position: absolute;



    display: block;



    left: 0;



    right: 0;



    top: 0;



    width: 100%;



    height: 100%;



    z-index: 1;



    background: rgba(0, 0, 0, 0.49);



    background: -moz-linear-gradient(left, rgba(0, 0, 0, 0.49) 0%, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);



    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0, 0, 0, 0.49)), color-stop(0%, rgba(0, 0, 0, 0.5)), color-stop(100%, rgba(0, 0, 0, 0.5)));



    background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.49) 0%, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);



    background: -o-linear-gradient(left, rgba(0, 0, 0, 0.49) 0%, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);



    background: -ms-linear-gradient(left, rgba(0, 0, 0, 0.49) 0%, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);



    background: linear-gradient(to right, rgba(0, 0, 0, 0.49) 0%, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);



    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#000000', GradientType=1);



    border-radius: 10px;



}



.swiper-slide.swiper-slide-review a img {



    width: 100%;



    height: 100%;



    object-fit: cover;



    border-radius: 10px;



}



.swiper-slide.swiper-slide-active.review {



    /*transform: scale(1.6);*/



    transition: transform .2s ease;



    -webkit-filter: blur(0);



    filter: blur(0);



    -moz-filter: blur(0);



    -o-filter: blur(0);



    -ms-filter: blur(0);



}



@media screen and (max-width: 767px) {



    .swiper-slide.swiper-slide-active.review {



        transform: none;



    }



}



.swiper-slide.swiper-slide-active.review a:hover {



    opacity: .8;



}



.swiper-slide.swiper-slide-active.review a::after {



    content: '\f144';



    color: #fff;



    font-weight: 900;



    font-size: 3em;



    position: relative;



    text-align: center;



    font-family: "Font Awesome 5 Free";



    display: flex;



    justify-content: center;



    z-index: 2;



    bottom: 60%;



}



.swiper-button-next {



    background-image: none;



}



@media screen and (max-width: 767px) {



    .swiper-button-next {



        width: 12px;



        height: 0;



    }



}



.swiper-button-prev {



    background-image: none;



}



@media screen and (max-width: 767px) {



    .swiper-button-prev {



        width: 0;



        height: 0;



    }



}



@media screen and (min-width: 1600px) {



    .swiper-slide.swiper-slide-review a {



        /*height: 270px;*/



    }



    .swiper-slide.swiper-slide-active.review {



        /*transform: scale(1.5);*/



    }



}

.btn-outline-filter {
    background: #fff;
    border: 1px solid #3c1d49 !important;
    color: #3c1d49 !important;
    padding: 3px 8px !important;
    font-size: 14px !important;
    width: fit-content;
    min-width: auto;
    padding: 0;
    line-height: normal !important;
}

.btn-outline-filter:hover {
    background: #3c1d49 !important;
    color: #fff !important;
}

.menu-btn {



    z-index: 9999;



    display: block;



    color: #343434;



    width: 46px;



    height: 30px;



    border-top: 3px solid;



    margin-right: 20px;



    margin-top: 10px;



    cursor: pointer;



    -webkit-backface-visibility: hidden;



}



@media screen and (min-width: 1200px) {



    .menu-btn {



        display: none;



    }



}



@media screen and (max-width: 767px) {



    .menu-btn {



        margin-right: 15px;



    }



}



.menu-btn::after, .menu-btn::before {



    content: '';



    display: block;



    height: 3px;



    margin-top: 7px;



    background: currentColor;



    position: relative;



    transition: transform .2s ease;



}



.menu-btn.active {



    border-top-color: transparent;



    left: auto;



}



.menu-btn.active::after {



    margin-top: 0px;



    top: 2px;



    transform: rotate(45deg);



}



.menu-btn.active::before {



    margin-top: 0px;



    top: 6px;



    transform: rotate(135deg);



}



@media screen and (min-width: 1200px) {



    .main-menu {



        position: relative;



        top: 0;



        left: 0;



        right: 0;



        z-index: 99;



        display: flex;



        align-items: center;



        justify-content: space-between;



        width: 100%;



        margin-right: auto;



        margin-left: auto;



    }



}



@media screen and (min-width: 1200px) {



    .main-menu li:nth-child(3):hover > .sub-dropdown,

    .main-menu li:nth-child(4):hover > .sub-dropdown {



        display: block;



    }



    .main-menu li:nth-child(3):hover > .sub-dropdown-decore,

    .main-menu li:nth-child(4):hover > .sub-dropdown-decore {



        display: block;



    }



}



.main-menu li:nth-child(2n) {



    background: #F2F2F2;



}



@media screen and (min-width: 1200px) {



    .main-menu li:nth-child(2n) {



        background: #fff;



    }



}



.main-menu > li > a {



    padding: 20px 40px;



    display: block;



    color: #707070;



    font-size: 1em;



}



.main-menu > li > a:hover {



    color: #3C1D49;



}



@media screen and (min-width: 1200px) {



    .main-menu > li > a {



        padding: 10px 0 0;



    }



}



@media screen and (max-width: 767px) {



    .main-menu > li > a {



        padding: 20px 40px 20px 20px;



    }



}



.sub-menu:hover i {



    color: #3C1D49;



}



.sub-menu i {



    color: #fff;



    font-size: 0.75em;



    color: #666473;



    top: 5px;



    position: relative;



    float: right;



}



@media screen and (min-width: 1200px) {



    .sub-menu i {



        margin-left: 5px;



    }



}



.icon-logo {



    display: block;



}



.icon-logo:hover {



    opacity: .7;



}



.icon-logo img {



    display: block;



    width: 130px;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .icon-logo img {



        width: 100px;



    }



}



@media screen and (max-width: 767px) {



    .icon-logo img {



        margin-right: 10px;



        width: 65px;



    }



}



.header-login {



    padding: 0 0 0 40px;



    height: 66px;



    display: flex;



    align-items: center;



}



@media screen and (max-width: 767px) {



    .header-login {



        padding: 0;



    }



}



.header-login li a {



    padding: 10px 0 0 15px;



    position: relative;



    display: block;



}



@media screen and (max-width: 767px) {



    .header-login li a {



        padding: 15px 0 0 5px;



        position: relative;



        display: block;



    }



}



.header-login li a i {



    font-size: 1.125em;



    color: #707070;



}



.header-login li a:hover span {



    background: #000;



}



.header-login li a:hover i {



    color: #3C1D49;



}



.header-login .num-cart {



    position: absolute;



    background: #3C1D49;



    border-radius: 50%;



    padding: 0px 8px;



    top: -5px;



    right: 10px;



    font-size: 12px;



    font-weight: 400;



    color: #fff;



}



.copyright {



    background: #3C1D49 0% 0% no-repeat padding-box;



    text-align: center;



    padding: 15px 0;



}



.copyright span {



    display: block;



    opacity: .9;



    color: #FFFFFF;



    font-size: 0.75em;



}



.topbar {



    width: 100%;



    display: -ms-flexbox;



    display: flex;



    -ms-flex-align: center;



    align-items: center;



    justify-content: space-between;



    padding: 10px 0;



}



@media screen and (min-width: 1200px) {



    .topbar {



        padding: 10px 0;



    }



}



@media screen and (max-width: 767px) {



    .topbar {



        padding: 0;



    }



}



.menu-icon {



    display: -ms-flexbox;



    display: flex;



    -ms-flex-align: center;



    align-items: center;



}



.menu-icon p {



    font-size: 0.75em;



    line-height: 1.25em;



    margin-left: 15px;



    width: 160px;



    font-weight: 500;



}



@media screen and (min-width: 1200px) {



    .menu-icon p {



        margin-right: 25px;



    }



}



@media screen and (max-width: 767px) {



    .menu-icon p {



        font-size: 0.5625em;



        width: 125px;



    }



}



.menu {



    z-index: 10;



    opacity: 0;



    visibility: hidden;



    position: absolute;



    top: 86px;



    left: 0px;



    background-color: #fff;



}



@media screen and (max-width: 767px) {



    .menu {



        top: 66px;



    }



}



.menu.active {



    opacity: 1;



    visibility: visible;



}



@media screen and (min-width: 1200px) {



    .menu {



        width: 49%;



        opacity: 1;



        visibility: visible;



        position: relative;



        top: 0;



    }



}



@media screen and (min-width: 992px) and (max-width: 1199px) {



    .menu {



        width: 45%;



        height: 100vH;



        overflow-y: auto;



    }



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .menu {



        width: 50%;



        height: 100vH;



        overflow-y: auto;



    }



}



@media screen and (max-width: 767px) {



    .menu {



        width: 80%;



        height: 100vH;



        overflow-y: auto;



    }



}



.icon::before {



    display: inline-block;



    font-weight: 900;



    font-size: 1em;



    width: 30px;



    font-family: "Font Awesome 5 Free";



    margin-right: 10px;



}



@media screen and (min-width: 1200px) {



    .icon::before {



        display: none;



    }



}



.icon-home::before {



    content: '\f015';



}



.icon-page::before {



    content: '\f6d1';



}



.icon-decore::before {



    content: "\f6c0";



}



.icon-user::before {



    content: '\f007';



}



.icon-badge::before {



    content: '\f2c1';



}



.icon-users::before {



    content: '\f0c0';



}



.icon-plan::before {



    content: '\f70e';



}



.icon-phone::before {



    content: '\f095';



}



.sub-dropdown {



    text-align: center;



    display: none;



}



.sub-dropdown-decore {



    text-align: center;



    display: none;



}



@media screen and (min-width: 1200px) {



    .sub-dropdown {



        top: 30px;



        left: auto;



        position: absolute;



        z-index: 1000;



        float: left;



        min-width: 10rem;



        padding: .5rem 0;



        margin: .125rem 0 0;



        font-size: 1rem;



        color: #212529;



        text-align: left;



        list-style: none;



        background-color: #fff;



        background-clip: padding-box;



        border-right: 1px solid rgba(0, 0, 0, 0.15);



        border-bottom: 1px solid rgba(0, 0, 0, 0.15);



        border-left: 1px solid rgba(0, 0, 0, 0.15);



        border-radius: .25rem;



    }



    .sub-dropdown-decore {



        top: 30px;



        left: auto;



        position: absolute;



        z-index: 1000;



        float: left;



        min-width: 10rem;



        padding: .5rem 0;



        margin: .125rem 0 0;



        font-size: 1rem;



        color: #212529;



        text-align: left;



        list-style: none;



        background-color: #fff;



        background-clip: padding-box;



        border-right: 1px solid rgba(0, 0, 0, 0.15);



        border-bottom: 1px solid rgba(0, 0, 0, 0.15);



        border-left: 1px solid rgba(0, 0, 0, 0.15);



        border-radius: .25rem;



    }



}



@media screen and (min-width: 992px) and (max-width: 1199px) {



    .sub-dropdown.active {



        display: block;



    }



    .sub-dropdown-decore.active {



        display: block;



    }



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .sub-dropdown.active {



        display: block;



    }



    .sub-dropdown-decore.active {



        display: block;



    }



}



@media screen and (max-width: 767px) {



    .sub-dropdown.active {



        display: block;



    }



    .sub-dropdown-decore.active {



        display: block;



    }



}



.sub-dropdown a {



    padding: 15px 40px;



    color: #515C6F;



    font-size: 0.875em;



    font-weight: 600;



    display: flex;



    justify-content: space-between;



    align-items: center;



}



.sub-dropdown a i {



    color: #3C1D49;



    margin-left: 20px;



}



.sub-dropdown-decore a {



    padding: 15px 40px;



    color: #515C6F;



    font-size: 0.875em;



    font-weight: 600;



    display: flex;



    justify-content: space-between;



    align-items: center;



}



.sub-dropdown-decore a i {



    color: #3C1D49;



    margin-left: 20px;



}



@media screen and (min-width: 1200px) {



    .sub-dropdown-decore a {



        padding: 0.4rem 1.5rem;



    }



}



.top-content {



    display: -ms-flexbox;



    display: flex;



    -ms-flex-align: center;



    align-items: center;



}



@media screen and (max-width: 767px) {



    .top-content {



        display: block;



        width: 100%;



        padding: 0 0 5px 0;



    }



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .top-content {



        justify-content: space-around;



    }



}



.top-content div {



    display: flex;



}



@media screen and (max-width: 767px) {



    .top-content div {



        justify-content: space-around;



    }



}



.top-content a {



    color: #fff;



    border: 1px solid #fff;



    font-size: 0.875em;



    -moz-border-radius: 5px;



    -webkit-border-radius: 5px;



    border-radius: 5px;



    padding: 5px 30px 5px;



    font-weight: bold;



}



.top-content a i {



    margin-right: 7px;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .top-content a {



        font-size: 0.75em;



    }



}



@media screen and (max-width: 767px) {



    .top-content a {



        padding: 2px;



        width: 100%;



        display: block;



        text-align: center;



        font-size: 0.75em;



        margin: 10px 0;



    }



}



.top-content a:hover {



    color: #3C1D49;



    background-color: #fff;



    border: 1px solid #3C1D49;



}



.top-content p {



    color: #fff;



    margin: 0 0 0 40px;



    font-size: 0.875em;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .top-content p {



        font-size: 0.6875em;



    }



}



@media screen and (max-width: 767px) {



    .top-content p {



        font-size: 0.5625em;



        margin: 0;



    }



}



.top-content p i {



    margin-right: 10px;



}



@media screen and (max-width: 420px) {



    .top-content div {



        display: none;



    }



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .top-social {



        display: none;



    }



}



@media screen and (max-width: 767px) {



    .top-social {



        display: none;



    }



}



.top-social a {



    color: #fff;



    margin-left: 15px;



    padding: 5px;



}



.top-social a:hover {



    opacity: .7;



}



.footer-pag {



    padding: 50px 0 60px;



    display: flex;



    justify-content: space-around;



    align-items: center;



}



@media screen and (max-width: 767px) {



    .footer-pag {



        display: block;



        text-align: center;



        padding: 50px 0 25px;



    }



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .footer-art {



        margin-bottom: 40px;



    }



}



@media screen and (max-width: 767px) {



    .footer-art {



        text-align: center;



        margin-bottom: 10px;



    }



}



.footer-art img {



    margin: 0 0 10px;



}



.footer-art p {



    line-height: 1.625em;



    padding: 0 0 12px;



    color: #707070;



    width: 310px;



}



@media screen and (min-width: 992px) and (max-width: 1199px) {



    .footer-art p {



        font-size: 0.875em;



    }



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .footer-art p {



        width: 100%;



    }



}



@media screen and (max-width: 767px) {



    .footer-art p {



        width: 100%;



    }



}



.footer-art span {



    color: #707070;



    display: block;



    margin: 0 0 8px;



    font-size: 0.875em;



}



.footer-art span i {



    margin: 0 10px 0 0;



}



@media screen and (max-width: 767px) {



    .footer-art-content {



        text-align: center;



        margin-bottom: 30px;



    }



}



.footer-art-content h3 {



    color: #707070;



    margin-bottom: 12px;



}



.footer-art-content ul li {



    line-height: 1.8125em;



}



.footer-art-content ul li a {



    color: #707070;



    display: block;



}



@media screen and (max-width: 767px) {



    .footer-art-content ul li a {



        font-size: 0.875em;



    }



}



.footer-art-content ul li a:hover {



    opacity: .7;



}



.footer-social {



    margin: 40px 0 0;



}



.footer-social p {



    color: #707070;



    margin: 0 0 10px;



}



.footer-social div {



    display: flex;



}



@media screen and (max-width: 767px) {



    .footer-social div {



        justify-content: center;



    }



}



.footer-social a {



    background: #3C1D49;



    color: #fff;



    width: 44px;



    height: 30px;



    position: relative;



    display: flex;



    align-items: center;



    margin-right: 15px;



    border-radius: 5px;



    border: 1px solid transparent;



}



.footer-social a:hover {



    border: 1px solid #3C1D49;



    color: #3C1D49;



    background: transparent;



}



.footer-social a i {



    font-size: 20px;



    margin: 0 auto;



}



@media screen and (max-width: 767px) {



    .footer-social a:last-child {



        margin-right: 0;



    }



}



.slide-intro {



    height: 600px;



    width: 100%;



    position: relative;



}



.slide-intro::before {



    content: '';



    position: absolute;



    display: block;



    left: 0;



    right: 0;



    top: 0;



    width: 100%;



    height: 100%;



    z-index: 1;



    background: rgba(0, 0, 0, 0.49);



    background: -moz-linear-gradient(left, rgba(0, 0, 0, 0.49) 0%, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);



    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0, 0, 0, 0.49)), color-stop(0%, rgba(0, 0, 0, 0.5)), color-stop(100%, rgba(0, 0, 0, 0.5)));



    background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.49) 0%, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);



    background: -o-linear-gradient(left, rgba(0, 0, 0, 0.49) 0%, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);



    background: -ms-linear-gradient(left, rgba(0, 0, 0, 0.49) 0%, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);



    background: linear-gradient(to right, rgba(0, 0, 0, 0.49) 0%, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);



    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#000000', GradientType=1);



}



@media screen and (max-width: 767px) {



    .slide-intro {



        height: 360px;



    }



}



.icon-category ul {



    -webkit-display: -webkit-box;



    -webkit-display: -webkit-flex;



    display: -webkit-box;



    display: -webkit-flex;



    display: -moz-box;



    display: -ms-flexbox;



    display: flex;



    -webkit-justify-content: space-around;



    -webkit-box-pack: space-around;



    -moz-justify-content: space-around;



    -moz-flex-pack: space-around;



    -ms-justify-content: space-around;



    -ms-flex-pack: space-around;



    -o-justify-content: space-around;



    justify-content: space-around;



    -webkit-align-items: center;



    -webkit-box-align: center;



    -moz-align-items: center;



    -ms-align-items: center;



    -ms-flex-align: center;



    -o-align-items: center;



    align-items: center;



    border: 1px solid #707070;



    border-radius: 25px;



    margin: 60px 0;



    padding: 15px 40px;



}



@media screen and (max-width: 767px) {



    .icon-category ul {



        flex-wrap: wrap;



        padding: 15px 10px 0;



    }



}



@media screen and (max-width: 767px) {



    .icon-category ul li {



        flex-basis: calc(100% / 2 - 15px);



        margin-bottom: 15px;



    }



}



.icon-category ul li a {



    text-align: center;



    display: block;



}



.icon-category ul li a:hover {



    opacity: .9;



}



.icon-category ul li a:hover p {



    color: #3C1D49;



}



.icon-category ul li a p {



    color: #A7A7A7;



    font-size: 1em;



    line-height: 1.7em;



    font-weight: 700;



}



.title {



    text-align: center;



    color: #3C1D49;



    font-size: 1.5em;



    margin: 20px 0 30px;



}



.title::after, .title::before {



    background: #3C1D49;



    content: "";



    display: inline-block;



    height: 2px;



    position: relative;



    vertical-align: middle;



    width: 40px;



    margin: 0 25px;



}



@media screen and (max-width: 767px) {



    .title {



        font-size: 1.08em;



    }



    .title::after {



        margin: 0 0 0 5px;



    }



    .title::before {



        margin: 0 5px 0 0;



    }



}



.contrast-products {



    position: relative;



    display: flex;



    width: 100%;



}



.contrast-products img {



    width: 100%;



    height: 100%;



    object-fit: cover;



    object-position: center;



    border-radius: 10px;



}



.contrast-products div {



    position: absolute;



    bottom: 40px;



    text-align: center;



    width: 100%;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .contrast-products div {



        bottom: 15px;



    }



}



@media screen and (max-width: 767px) {



    .contrast-products div {



        bottom: 15px;



    }



}



.contrast-products p {



    margin: 0 auto;



    font-size: 0.875em;



    color: #ffffff;



    background-color: #3c1d49;



    width: 165px;



    padding: 10px;



    border-radius: 5px;



}



.contrast-products p:hover {

    background-color: #8839aa;

}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .contrast-products p {



        width: 80%;



        padding: 10px;



        font-size: 0.725em;



    }



}



@media screen and (max-width: 767px) {



    .contrast-products p {



        width: 80%;



        padding: 7px 0 0;



        font-size: 0.725em;

        

        display: none;



    }



}



.contrast-products span {



    margin: 0 auto;



    font-size: 0.875em;



    color: #fff;



    background-color: transparent;



    border: 1px solid #fff;



    text-decoration: underline;



    width: 165px;



    padding: 10px;



    border-radius: 5px;



    display: none;



    position: relative;



    z-index: 2;



}



.title-white {



    color: #fff;



}



.title-white::after, .title-white::before {



    background: #fff;



}



.sale {



    box-shadow: 1px 1px 6px 1px rgba(0, 0, 0, 0.1);



    display: block;



    margin: 0 0 35px;



    border-radius: 15px;



    position: relative;



    width: 100%;



    text-align: center;



}



.sale:hover {



    opacity: .8;



}



.sale:hover .sale-cart {



    display: block;



}



.sale:hover .sale-price {



    display: none;



}



.sale img {



    border-top-left-radius: 15px;



    border-top-right-radius: 15px;



    width: 100%;



    height: 193px;



    object-position: center;



    object-fit: cover;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .sale img {



        height: 150px;



    }



}



@media screen and (max-width: 767px) {



    .sale img {



        height: 110px;



    }



}



.sale-rating {



    position: absolute;



    top: 8px;



    left: 10px;



    color: #fff;



    background-color: #FFAF52;



    border-radius: 30px;



    padding: 3px 5px 0;



    font-size: 0.675em;



}



.sale-rating::before {



    content: '\f005';



    color: #fff;



    font-weight: 900;



    font-family: "Font Awesome 5 Free";



    margin-right: 3px;



}



.sale-rebate {



    position: absolute;



    top: -8px;



    right: -8px;



    background: #FF6969;



    color: #fff;



    border-radius: 50%;



    width: 40px;



    height: 40px;



    align-items: center;



    /*display: flex;*/



    display: none;



    text-align: center;



}



@media screen and (max-width: 767px) {



    .sale-rebate {



        width: 35px;



        height: 35px;



    }



}



.sale-rebate span {



    display: block;



    margin: 0 auto;



    font-size: 0.875em;



    padding: 7px 0 0;



}



@media screen and (max-width: 767px) {



    .sale-rebate span {



        font-size: 0.75em;



    }



}



.sale-content {



    padding: 10px;



}



.sale-content .sale-price {



    color: #3C1D49;



    font-weight: bold;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .sale-content .sale-price {



        font-size: 0.875em;



    }



}



@media screen and (max-width: 767px) {



    .sale-content .sale-price {



        font-size: 0.8125em;



    }



}



.sale-content .sale-price span {



    color: #FF6969;



}



.sale-content .sale-price s {



    margin-right: 5px;



}



.sale-content .sale-cart {



    display: none;



    font-size: 0.9375em;



    color: #3C1D49;



    text-decoration: underline;



    font-weight: bold;



}



@media screen and (max-width: 767px) {



    .sale-content {



        padding: 5px;



    }



}



.sale-content h3 {



    font-size: 1em;



    color: #707070;



    padding-bottom: 5px;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .sale-content h3 {



        font-size: 0.875em;



    }



}



@media screen and (max-width: 767px) {



    .sale-content h3 {



        font-size: 0.75em;



    }



}



.sale-content p {



    color: #707070;



    font-size: 0.75em;



    margin: 5px 0 0;



}



@media screen and (max-width: 767px) {



    .sale-content p {



        font-size: 0.625em;



    }



}



@media screen and (max-width: 767px) {



    .client-like {



        margin-bottom: 30px;



    }



}



.client-like h2 {



    font-size: 3em;



    color: #fff;



    line-height: 1.25em;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .client-like h2 {



        font-size: 1.875em;



    }



}



@media screen and (max-width: 767px) {



    .client-like h2 {



        font-size: 1.875em;



        text-align: center;



    }



}



.client-like p {



    color: #fff;



    font-size: 1.375em;



    margin: 20px 0 60px;



    line-height: 1.5em;



    width: 400px;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .client-like p {



        font-size: 1.125em;



        width: 100%;



    }



}



@media screen and (max-width: 767px) {



    .client-like p {



        width: 100%;



        font-size: 1.125em;



        text-align: center;



        margin-bottom: 20px;



    }



}



.client-like a {



    background: #fff;



    font-size: 1.125em;



    color: #3C1D49;



    letter-spacing: normal;



    text-align: left;



    padding-left: 40px;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .client-like a {



        width: 100%;



    }



}



@media screen and (max-width: 767px) {



    .client-like a {



        font-size: 1em;



    }



}



.client-like a:hover {



    background: transparent;



    color: #fff;



    border: 1px solid #fff;



}



.client-like a i {



    float: right;



    padding: 14px 18px;



    color: #fff;



    background: #3C1D49;



    border-radius: 10px;



}



.contrast div:nth-child(3), .contrast div:nth-child(4) {



    display: flex;



    align-items: flex-end;



}



.pro-heigh-big {



    height: 540px;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .pro-heigh-big {



        height: 360px;



    }



}



@media screen and (max-width: 767px) {



    .pro-heigh-big {



        height: 170px;



        margin-bottom: 25px;



    }



}



.pro-heigh-small {



    height: 100%;



}



@media screen and (max-width: 767px) {



    .pro-heigh-small {



        height: 170px;



        margin-bottom: 20px;



    }



}



.middle-column {



    display: block;



    height: 50%;



}



.middle-column:first-child {



    padding-bottom: 10px;



}



.middle-column:last-child {



    padding-top: 10px;



}



.align-back {



    display: flex;



    align-items: flex-end;



}



@media screen and (max-width: 767px) {



    .align-back {



        display: block;



    }



}



.swiper-part {



    border: 1px solid #707070;



    border-radius: 25px;



    padding: 15px 0;



}



.swiper-part a {



    display: block;



    width: 100%;



}



.swiper-part img {



    display: block;



    margin: 0 auto;



    width: 127px;



    height: 98px;



    object-position: center;



    object-fit: contain;



}



.button-club {



    margin-top: 15px;



}



.button-club i {



    font-size: 1.375em;



    color: #6F6F6F;



    padding: 0 10px;



}



.button-club-next {

    right: 50px;

    margin-top: 40px;

    outline: none;

}



@media screen and (min-width: 768px) and (max-width: 991px) {

    .button-club-next {

        right: 30px;

    }

}



@media screen and (max-width: 767px) {

    .button-club-next {

        right: 30px;

    }

}



.button-club-prev {

    left: 50px;

    margin-top: 40px;

    outline: none;

}



@media screen and (min-width: 768px) and (max-width: 991px) {

    .button-club-prev {

        left: 30px;

    }

}



@media screen and (max-width: 767px) {

    .button-club-prev {

        left: 10px;

    }

}



.art-client {



    height: 330px;



    text-align: center;



    display: flex;



    align-items: center;



    position: relative;



}



.art-client::before {



    content: '';



    position: absolute;



    display: block;



    left: 0;



    right: 0;



    top: 0;



    width: 100%;



    height: 100%;



    z-index: 1;



    background: rgba(0, 0, 0, 0.72);



    background: -moz-linear-gradient(left, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.71) 0%, rgba(0, 0, 0, 0.71) 100%);



    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0, 0, 0, 0.72)), color-stop(0%, rgba(0, 0, 0, 0.71)), color-stop(100%, rgba(0, 0, 0, 0.71)));



    background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.71) 0%, rgba(0, 0, 0, 0.71) 100%);



    background: -o-linear-gradient(left, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.71) 0%, rgba(0, 0, 0, 0.71) 100%);



    background: -ms-linear-gradient(left, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.71) 0%, rgba(0, 0, 0, 0.71) 100%);



    background: linear-gradient(to right, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.71) 0%, rgba(0, 0, 0, 0.71) 100%);



    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#000000', GradientType=1);



}



@media screen and (max-width: 767px) {



    .art-client {



        height: 280px;



    }



}



.art-client h2 {



    font-size: 2.5em;



    color: #fff;



    line-height: 1.125em;



    position: relative;



    z-index: 2;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .art-client h2 {



        font-size: 1.875em;



    }



}



@media screen and (max-width: 767px) {



    .art-client h2 {



        font-size: 1.25em;



    }



}



.art-client a {



    color: #fff;



    border: 1px solid #fff;



    margin: 45px auto 0 auto;



    z-index: 2;



    position: relative;



}



.art-client a:hover {



    background: #fff;



    color: #707070;



    border: 1px solid #707070;



}



.blog-index {



    display: block;



    background: #fff;



    box-shadow: 1px 1px 6px 1px rgba(0, 0, 0, 0.1);



    border-radius: 10px;



    position: relative;



    margin: 15px 0;



}



.blog-index:hover .view-hover {



    display: block;



}



.blog-index:hover::before {



    content: '';



    position: absolute;



    display: block;



    left: 0;



    right: 0;



    top: 0;



    width: 100%;



    height: 100%;



    z-index: 1;



    background: rgba(72, 72, 72, 0.71);



    background: -moz-linear-gradient(left, rgba(72, 72, 72, 0.71) 0%, rgba(72, 72, 72, 0.73) 0%, rgba(72, 72, 72, 0.73) 100%);



    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(72, 72, 72, 0.71)), color-stop(0%, rgba(72, 72, 72, 0.73)), color-stop(100%, rgba(72, 72, 72, 0.73)));



    background: -webkit-linear-gradient(left, rgba(72, 72, 72, 0.71) 0%, rgba(72, 72, 72, 0.73) 0%, rgba(72, 72, 72, 0.73) 100%);



    background: -o-linear-gradient(left, rgba(72, 72, 72, 0.71) 0%, rgba(72, 72, 72, 0.73) 0%, rgba(72, 72, 72, 0.73) 100%);



    background: -ms-linear-gradient(left, rgba(72, 72, 72, 0.71) 0%, rgba(72, 72, 72, 0.73) 0%, rgba(72, 72, 72, 0.73) 100%);



    background: linear-gradient(to right, rgba(72, 72, 72, 0.71) 0%, rgba(72, 72, 72, 0.73) 0%, rgba(72, 72, 72, 0.73) 100%);



    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#484848', endColorstr='#484848', GradientType=1);



}



.blog-index:hover::before {



    border-top-left-radius: 10px;



    border-top-right-radius: 10px;



    height: 250px;



}



@media screen and (max-width: 767px) {



    .blog-index:hover::before {



        height: 190px;



    }



}



.blog-index img {



    width: 100%;



    height: 250px;



    object-position: center;



    object-fit: cover;



    border-top-left-radius: 10px;



    border-top-right-radius: 10px;



    position: relative;



}



@media screen and (max-width: 767px) {



    .blog-index img {



        height: 190px;



    }



}



.blog-index-content {



    padding: 15px 30px;



}



.blog-index-content h3 {



    font-size: 1.125em;



    color: #3C1D49;



    padding-bottom: 10px;



}



.blog-index-content p {



    color: #000000;



    padding-bottom: 15px;



}



@media screen and (max-width: 767px) {



    .blog-index-content p {



        font-size: 0.875em;



    }



}



.blog-index-content span {



    color: #3C1D49;



    text-decoration: underline;



    display: block;



}



.view-hover {



    display: none;



    position: absolute;



    top: 100px;



    width: 100%;



    text-align: center;



    z-index: 2;



}



.view-hover i {



    color: #707070;



    background: #fff;



    padding: 15px;



    border-radius: 50%;



}



.insta-artsiber {



    display: flex;



    flex-wrap: wrap;



    position: relative;



    text-align: center;



    height: 200px;



    background: url(../../images/instagram.jpg) center no-repeat;



    background-size: cover;



}



.insta-artsiber::before {



    content: '';



    position: absolute;



    display: block;



    left: 0;



    right: 0;



    top: 0;



    width: 100%;



    height: 100%;



    z-index: 1;



    background: rgba(0, 0, 0, 0.49);



    background: -moz-linear-gradient(left, rgba(0, 0, 0, 0.49) 0%, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);



    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0, 0, 0, 0.49)), color-stop(0%, rgba(0, 0, 0, 0.5)), color-stop(100%, rgba(0, 0, 0, 0.5)));



    background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.49) 0%, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);



    background: -o-linear-gradient(left, rgba(0, 0, 0, 0.49) 0%, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);



    background: -ms-linear-gradient(left, rgba(0, 0, 0, 0.49) 0%, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);



    background: linear-gradient(to right, rgba(0, 0, 0, 0.49) 0%, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);



    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#000000', GradientType=1);



}



.insta-artsiber a {



    display: flex;



    justify-content: center;



    align-items: center;



    width: 270px;



    height: 120px;



    position: absolute;



    top: 50%;



    left: 50%;



    color: #ffffff;



    margin-top: -60px;



    margin-left: -135px;



    background-color: rgba(60, 29, 73, 0.9);



    -webkit-border-radius: 10px;



    -moz-border-radius: 10px;



    border-radius: 10px;



    z-index: 2;



}



.insta-artsiber a:hover {



    opacity: .9;



}



.insta-artsiber a h2 {



    color: #fff;



    font-size: 1.625em;



    line-height: 1.375em;



}



@media screen and (max-width: 767px) {



    .insta-artsiber a h2 {



        font-size: 1.25em;



    }



}



.insta-artsiber a h2 strong {



    font-size: 1.4375em;



    display: block;



    margin-bottom: 10px;



}



@media screen and (min-width: 1600px) {



    .insta-artsiber {



        height: 370px;



    }



}



.bg-ecommerce {



    background-position: center;



    height: 350px;



    position: relative;



    border-bottom: 2px solid #000000;



    border-top: 2px solid #000000;



    display: flex;



    align-items: center;



    justify-content: center;



    text-align: center;



}



.bg-ecommerce::before {



    content: '';



    position: absolute;



    display: block;



    left: 0;



    right: 0;



    top: 0;



    width: 100%;



    height: 100%;



    z-index: 1;



    background: rgba(0, 0, 0, 0.72);



    background: -moz-linear-gradient(left, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.71) 0%, rgba(0, 0, 0, 0.71) 100%);



    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(0, 0, 0, 0.72)), color-stop(0%, rgba(0, 0, 0, 0.71)), color-stop(100%, rgba(0, 0, 0, 0.71)));



    background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.71) 0%, rgba(0, 0, 0, 0.71) 100%);



    background: -o-linear-gradient(left, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.71) 0%, rgba(0, 0, 0, 0.71) 100%);



    background: -ms-linear-gradient(left, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.71) 0%, rgba(0, 0, 0, 0.71) 100%);



    background: linear-gradient(to right, rgba(0, 0, 0, 0.72) 0%, rgba(0, 0, 0, 0.71) 0%, rgba(0, 0, 0, 0.71) 100%);



    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#000000', endColorstr='#000000', GradientType=1);



}



@media screen and (max-width: 767px) {



    .bg-ecommerce {



        height: 220px;



        background-position: right !important;



    }



}



.bg-ecommerce h2 {



    position: relative;



    z-index: 2;



    font-size: 2.5em;



    line-height: 1.25em;



    color: #fff;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .bg-ecommerce h2 {



        font-size: 1.625em;



    }



}



@media screen and (max-width: 767px) {



    .bg-ecommerce h2 {



        font-size: 1em;



    }



}



.optin {



    color: #fff;



    display: flex;



    align-items: center;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .optin {



        margin-bottom: 30px;



    }



}



@media screen and (max-width: 767px) {



    .optin {



        display: block;



        text-align: center;



    }



}



.optin i {



    font-size: 1.5em;



    margin-right: 15px;



}



@media screen and (max-width: 767px) {



    .optin i {



        display: none;



    }



}



.optin h3 {



    font-size: 1.125em;



}



@media screen and (max-width: 767px) {



    .optin h3 {



        font-size: 1em;



    }



}



.optin p {



    font-size: 0.875em;



}

@media screen and (max-width: 767px){

    .optin p{
        margin-top: 10px;
        padding: 0 30px;
    }

}



.optin-input {



    position: relative;



}



@media screen and (max-width: 767px) {



    .optin-input {



        text-align: center;



        margin-top: 10px;



    }



}



.optin-input > .icon {



    position: absolute;



    top: 4px;



    left: 4px;



    padding: 15px;



    border-radius: 50%;



    background: #3C1D49;



    color: #fff;



    width: 45px;



    height: 45px;



}



@media screen and (max-width: 767px) {



    .optin-input > .icon {



        padding: 14px;



    }



}



.optin-input input {



    width: 100%;



    border-radius: 30px;



    color: #515C6F;



    font-size: 0.875em;



    line-height: 2.75em;



    text-align: left;



    padding-left: 80px;



    height: 53px;



}



@media screen and (min-width: 992px) and (max-width: 1199px) {



    .optin-input input {



        padding-left: 60px;



        font-size: 0.625em;



        line-height: 3.75em;



    }



}



@media screen and (max-width: 767px) {



    .optin-input input {



        padding-left: 60px;



        font-size: 0.875em;



        margin-bottom: 5px;



    }



}



.optin-input button {



    cursor: pointer;



    color: #fff;



    position: relative;



    font-size: 0.8625em;



    position: absolute;



    background: #97C749;



    right: 4px;



    top: 2px;



    padding: 7px 6px 7px 15px;



    border-radius: 30px;



    font-weight: bold;



    border: 1px solid transparent;



    outline: none;



}



.optin-input button:hover {



    border: 1px solid #97C749;



    background: transparent;



    color: #97C749;



}



@media screen and (max-width: 767px) {



    .optin-input button {



        position: relative;



    }



}



.optin-input button i {



    margin-left: 10px;



    padding: 10px 12px;



    border-radius: 50%;



    background: #fff;



    color: #97C749;



}



.about {



    box-shadow: 1px 1px 6px 1px rgba(0, 0, 0, 0.1);



    padding: 15px 30px 15px 15px;



    border-radius: 10px;



}



@media screen and (max-width: 767px) {



    .about {



        text-align: center;



        margin-bottom: 25px;



    }



}



.about li {



    line-height: 2.8125em;



}



.about li a {



    font-size: 1.125em;



    color: #3C1D49;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .about li a {



        font-size: 0.875em;



    }



}



@media screen and (max-width: 767px) {



    .about li a {



        font-size: 1em;



    }



}



.about li a:hover {



    opacity: .7;



}



.about-content h1 {



    font-size: 1.5em;



    margin: 0 0 25px;



    color: #3C1D49;



}



@media screen and (max-width: 767px) {



    .about-content h1 {



        text-align: center;



    }



}



.about-content p {



    color: #707070;



    margin: 0 0 25px;



}



@media screen and (max-width: 767px) {



    .about-content p {



        text-align: justify;



    }



}



.sub-category {



    box-shadow: 1px 1px 6px 1px rgba(0, 0, 0, 0.1);



    padding: 15px 30px 15px 15px;



    border-radius: 10px;



}



@media screen and (max-width: 767px) {



    .sub-category {



        margin-top: 40px;



    }



}



.sub-category h2 {



    color: #3C1D49;



    margin: 0 0 15px 0;



}



@media screen and (max-width: 767px) {



    .sub-category h2 {



        text-align: center;



    }



}



.sub-category ul li {



    line-height: 1.5em;



    margin: 0 0 5px;



}



.sub-category ul li a {



    color: #707070;



    font-size: 0.875em;



    display: flex;



    justify-content: space-between;



    align-items: center;



}



.sub-category ul li a:hover {



    color: #3C1D49;



}



.sub-category ul li a:hover i {



    color: #3C1D49;



}



.sub-category ul li a i {



    padding: 4px 6px;



    border-radius: 50%;



    color: #707070;



    background: rgba(114, 124, 142, 0.2);



    font-size: 9px;



}



.sub-price {



    margin: 40px 0 0;



    text-align: center;



    box-shadow: 1px 1px 6px 1px rgba(0, 0, 0, 0.1);



    padding: 15px 15px 30px 15px;



    border-radius: 10px;



}



.sub-price h2 {



    color: #3C1D49;



    margin: 0 0 15px;



    text-align: left;



}



@media screen and (max-width: 767px) {



    .sub-price h2 {



        text-align: center;



        font-size: 1em;



    }



}



.sub-price label {



    color: #707070;



    font-size: 0.875em;



    margin-bottom: 5px;



}



.product-title {



    margin-bottom: 30px;



}



@media screen and (max-width: 767px) {



    .product-title {



        text-align: center;



    }



}



.product-title h1 {



    color: #3C1D49;



    font-size: 1.375em;



    margin-bottom: 10px;



}



@media screen and (max-width: 767px) {



    .product-title h1 {



        margin-top: 20px;



        font-size: 1.25em;



        text-align: center;



        margin-bottom: 5px;



    }



}



.product-title span {



    font-size: 0.625em;



    color: #707070;



}



.page-back {



    margin-left: 15px;



}



@media screen and (max-width: 767px) {



    .page-back {



        margin-left: 0;



    }



}



.page-item {



    margin-right: 10px;



}



.page-info {



    border: 1px solid #3C1D49;



    border-radius: 5px;



    color: #3C1D49;



    padding: .5rem 0;



    width: 40px;



    text-align: center;



}



.page-info:hover {



    color: #707070 !important;



    border: 1px solid #707070 !important;



    opacity: .5;



}



.page-selected {



    color: #707070 !important;



    border: 1px solid #707070 !important;



    opacity: .5;



}



.view-product {



    display: flex;



}



@media screen and (max-width: 767px) {



    .view-product {



        display: block;



    }



}



.main-image {



    width: 500px;



    margin-bottom: 0.75em;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .main-image {



        width: 350px;



        height: 280px;



    }



}



@media screen and (max-width: 767px) {



    .main-image {



        width: 100%;



        height: 240px;



    }



}



.main-image img {



    object-fit: cover;



    object-position: center;



    height: 100%;



    width: 100%;



    border-radius: 10px;



    max-height: 450px;



}



.thumbnails {



    display: flex;



    justify-content: normal;



    max-width: 500px;



}



.thumbnails li {



    margin-left: 5px;



}



.thumbnails li {



    flex-basis: calc(100% / 5 - 10px);



}



.thumbnails li a img {



    height: 88px;



    object-fit: cover;



    object-position: center;



    border-radius: 10px;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .thumbnails li a img {



        height: 60px;



    }



}



@media screen and (max-width: 767px) {



    .thumbnails li a img {



        height: 60px;



    }



}



.view-content {



    margin: 0 0 0 40px;



}



@media screen and (max-width: 767px) {



    .view-content {



        margin: 0;



    }



}



.product-name {



    margin: 0 0 30px;



}



.product-name h1 {



    color: #3C1D49;



    font-size: 1.375em;



    margin: 0 0 5px;



}



@media screen and (max-width: 767px) {



    .product-name h1 {



        font-size: 1.125em;



    }



}



.product-name a {



    color: #707070;



    font-size: 0.875em;



    display: block;



    margin-bottom: 10px;



}



@media screen and (max-width: 767px) {



    .product-name a {



        font-size: 0.75em;



    }



}



.product-name a i {



    margin-right: 5px;



}



.product-price {



    font-size: 0.875em;



    color: #3C1D49;



    margin-top: -10px;



}



.product-promo {



    display: flex;



    align-items: center;



    margin: 0 0 5px;



}



.product-promo span {



    color: #3C1D49;



    font-size: 1.4em;



    display: block;



    margin: 8px 0 0 5px;



}



.product-promo div p {



    color: #3C1D49;



    font-size: 0.6875em;



    line-height: 1.125em;



}



.product-qtd {



    margin: 20px 0;



    box-shadow: 1px 1px 6px 1px rgba(0, 0, 0, 0.1);



    width: 160px;



    text-align: center;



    padding: 15px;



    border-radius: 5px;



}



.product-qtd input[type="button"] {



    color: #727C8E;



    font-weight: bold;



    width: 25px;



    height: 25px;



    font-size: 20px;



    cursor: pointer;



    -webkit-appearance: none;



    -moz-appearance: none;



    appearance: none;



    -webkit-border-radius: 0px;



    -moz-border-radius: 0px;



    border-radius: 0px;



    background: #ffffff;



}



.product-qtd input[type="text"] {



    text-align: center;



    padding: 0 10px;



    color: #707070;



}



.product-size {



    margin: 0 0 25px;



}



.product-size label {



    color: #707070;



    font-size: 0.875em;



    margin: 0 0 15px;



}



.product-size ul li {



    display: inline-block;



}



.product-size ul li a {



    font-size: 0.875em;



    border: 1px solid #707070;



    color: #707070;



    padding: 7px 0;



    width: 60px;



    display: block;



    text-align: center;



    border-radius: 5px;



}



.product-size ul li a:hover {



    color: #fff;



    background: #3C1D49;



}



.btn-buy i {



    margin: 0 10px 0 0;



}



.feature {



    padding: 40px 0 40px;



}



.feature h2 {



    color: #3C1D49;



    font-size: 1.375em;



    padding: 0 0 30px;



    font-weight: bold;



}



.feature p {



    color: #707070;



}



.comment {



    padding: 20px 30px;



    margin: 0 0 20px;



    border-radius: 10px;



    box-shadow: 1px 1px 6px 1px rgba(0, 0, 0, 0.1);



    display: flex;



    align-items: center;



    justify-content: space-around;



}



@media screen and (max-width: 767px) {



    .comment {



        padding: 20px 10px;



    }



}



.comment .comment-content {



    width: 83%;



}



@media screen and (max-width: 767px) {



    .comment .comment-content {



        width: 75%;



    }



}



.comment img {



    width: 130px;



    height: 130px;



    object-fit: cover;



    object-position: center;



    border-radius: 50%;



    margin: 0 auto;



    border: 2px solid #707070;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .comment img {



        width: 80px;



        height: 80px;



    }



}



@media screen and (max-width: 767px) {



    .comment img {



        width: 60px;



        height: 60px;



    }



}



.comment-content h3 {



    font-size: 1.125em;



    color: #707070;



    margin-bottom: 3px;



}



@media screen and (max-width: 767px) {



    .comment-content h3 {



        font-size: 0.875em;



    }



}



.comment-content p {



    color: #707070;



    margin-bottom: 10px;



}



@media screen and (max-width: 767px) {



    .comment-content p {



        font-size: 0.8125em;



    }



}



.comment-like a {



    color: #fff;



    font-size: 0.75em;



    padding: 7px 15px 0px;



    border-radius: 5px;



    border: 1px solid transparent;



    display: inline-block;



}



@media screen and (max-width: 767px) {



    .comment-like a {



        font-size: 0.625em;



    }



}



.comment-like a i {



    margin-right: 5px;



}



.comment-like a:first-child {



    background: #0077B3;



    margin-right: 10px;



}



.comment-like a:first-child:hover {



    color: #0077B3;



    border: 1px solid #0077B3;



    background: #fff;



}



.comment-like a:first-child:hover i {



    color: #0077B3;



}



.comment-like a:last-child {



    background: #00B594;



}



.comment-like a:last-child:hover {



    color: #00B594;



    border: 1px solid #00B594;



    background: #fff;



}



.comment-like a:last-child:hover i {



    color: #00B594;



}



.comm-title {



    color: #3C1D49;



    font-size: 1.375em;



    margin-bottom: 30px;



}



@media screen and (max-width: 767px) {



    .comm-title {



        text-align: center;



    }



}



.secondary {



    margin-left: 19%;



}



@media screen and (max-width: 767px) {



    .secondary {



        margin-left: 7%;



    }



}



.secondary .comment-content {



    width: 79%;



}



@media screen and (max-width: 767px) {



    .secondary .comment-content {



        width: 74%;



    }



}



.box-comment {



    margin: 40px 0 0;



    box-shadow: 1px 1px 6px 1px rgba(0, 0, 0, 0.1);



    padding: 40px 20px;



    border-radius: 10px;



}



.box-comment > p {



    font-size: 0.875em;



    color: #707070;



    margin: 0 0 20px;



}



@media screen and (max-width: 767px) {



    .box-comment > p {



        font-size: 0.75em;



        text-align: center;



    }



}



.box-comment textarea {



    width: 100%;



    height: 200px;



    border: 1px solid #707070;



    border-radius: 15px;



    box-shadow: 1px 1px 6px 1px rgba(0, 0, 0, 0.1);



    margin: 0 0 20px;



}



.box-comment-content {



    display: flex;



    align-items: center;



    justify-content: space-between;



}



@media screen and (max-width: 767px) {



    .box-comment-content {



        flex-wrap: wrap;



    }



}



.box-comment-content label {



    width: 240px;



}



@media screen and (max-width: 767px) {



    .box-comment-content label {



        width: 100%;



    }



}



.box-comment-content label select {



    color: #707070;



    width: 100%;



    border: 1px solid #707070;



    border-radius: 10px;



    padding: 10px 20px;



}



@media screen and (max-width: 767px) {



    .box-comment-content label select {



        padding: 10px;



    }



}



.box-label label {



    position: relative;



}



.box-label label:after {



    content: "\f078";



    position: absolute;



    display: inline-block;



    font-weight: 900;



    font-family: "Font Awesome 5 Free";



    pointer-events: none;



    font-size: 0.875em;



    color: #707070;



    top: 12px;



    right: 23px;



}



@media screen and (max-width: 767px) {



    .box-label label:after {



        top: 10px;



        right: 12px;



    }



}



.box-label select {



    display: inline-block;



    -webkit-appearance: none;



    -moz-appearance: none;



    appearance: none;



    cursor: pointer;



}



.btn-custom {



    font-size: 0.875em;



    width: 280px;



    line-height: 2.75em;



    margin: 30px 0 0;



}



.modal-product-qtd {



    display: flex;



    align-items: center;



}



.modal-product-qtd p {



    margin: 0 30px 0 0;



}



.modal-request {



    display: flex;



    align-items: center;



    justify-content: space-between;



    margin: 20px 0 0;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .modal-request {



        display: block;



        text-align: center;



    }



}



@media screen and (max-width: 767px) {



    .modal-request {



        display: block;



        text-align: center;



    }



}



.modal-request span {



    width: 410px;



    font-size: 0.875em;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .modal-request span {



        font-size: 0.75em;



        display: block;



        margin-bottom: 25px;



        width: 100%;



    }



}



@media screen and (max-width: 767px) {



    .modal-request span {



        font-size: 0.75em;



        display: block;



        margin-bottom: 20px;



        width: 100%;



    }



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .modal-request button {



        margin: 0 auto;



    }



}



.modal-custom {



    padding: 30px 25px;



}



.modal-custom h2 {



    color: #3C1D49;



    font-size: 1.125em;



    margin: 0 0 20px;



}



.modal-legend {



    display: block;



    font-size: 0.875em;



    color: #666666;



    margin-bottom: 5px;



}



.modal-form {



    position: relative;



}



.modal-form input {



    width: 100%;



    line-height: 3.25em;



    border: 1px solid #707070;



    margin: 0 0 15px;



    padding: 0 30px 0 55px;



    border-radius: 5px;



    box-shadow: 1px 1px 6px 1px rgba(0, 0, 0, 0.1);



}



.modal-form i {



    position: absolute;



    top: 18px;



    left: 25px;



}



.box {



    box-shadow: 1px 1px 6px 1px rgba(0, 0, 0, 0.1);



    padding: 40px;



    border-radius: 10px;



}



@media screen and (max-width: 767px) {



    .box {



        padding: 10px 15px;



        text-align: center;



    }



}



.box-login-content {



    padding: 50px 0;



}



@media screen and (max-width: 767px) {



    .box-login-content {



        padding: 20px 0;



    }



}



.box-login-content h1 {



    color: #3C1D49;



    font-size: 1.5em;



    margin-bottom: 15px;



}



.box-login-content p {



    color: #707070;



    margin-bottom: 45px;



}



@media screen and (max-width: 767px) {



    .box-login-content p {



        font-size: 0.875em;



    }



}



.box-form-login {



    margin-bottom: 10px;



}



.box-form-button {



    margin-top: 30px;



    display: flex;



    justify-content: space-between;



    align-items: center;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .box-form-button {



        display: block;



        text-align: center;



    }



}



@media screen and (max-width: 767px) {



    .box-form-button {



        display: block;



        text-align: center;



    }



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .box-form-button button {



        width: 100%;



    }



}



.box-form-button a {



    color: #868686;



    display: block;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .box-form-button a {



        font-size: 0.875em;



        margin-top: 20px;



    }



}



@media screen and (max-width: 767px) {



    .box-form-button a {



        font-size: 0.875em;



        margin-top: 15px;



    }



}



.box-form-button a:hover {



    color: #3C1D49;



}



.box-login-full {



    background: #3C1D49;



    height: 100%;



    border-radius: 10px;



    text-align: center;



    display: flex;



    align-items: center;



    justify-content: center;



}



@media screen and (max-width: 767px) {



    .box-login-full {



        padding: 20px;



        margin-top: 40px;



    }



}



.box-login-full div {



    width: 220px;



}



@media screen and (max-width: 767px) {



    .box-login-full div {



        width: 100%;



    }



}



.box-login-full h2 {



    color: #fff;



    font-size: 1.5em;



    margin-bottom: 10px;



    line-height: 1.375em;



}



@media screen and (max-width: 767px) {



    .box-login-full h2 {



        font-size: 1.25em;



    }



}



.box-login-full p {



    color: #fff;



    margin-bottom: 40px;



}



.box-login-full a {



    background: #FFFFFF;



    color: #3C1D49;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .box-login-full a {



        width: 100%;



    }



}



.box-login-full a:hover {



    border: 1px solid #fff;



    color: #fff;



    background: transparent;



}



.box-login-full a:hover i {



    color: #fff;



}



.box-login-full a i {



    color: #3C1D49;



    margin-right: 10px;



}



.consult h1 {



    color: #3C1D49;



    font-size: 1.5em;



    font-weight: bold;



    text-align: center;



    line-height: 1.625em;



    margin: 0 0 30px;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .consult h1 {



        font-size: 1.375em;



    }



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .consult h1 {



        font-size: 1.125em;



    }



}



.consult p {



    color: #707070;



    text-align: center;



    margin: 40px auto;



    max-width: 700px;



}



.consult > a {



    text-align: center;



    margin: 60px auto 0;



}



.consult > a i {



    margin-right: 10px;



}



.consult-img {



    display: flex;



    flex-wrap: wrap;



    justify-content: space-between;



}



.consult-img li {



    flex-basis: calc(100% / 7 - 15px);



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .consult-img li {



        flex-basis: calc(100% / 5 - 15px);



    }



}



@media screen and (max-width: 767px) {



    .consult-img li {



        flex-basis: calc(100% / 2 - 10px);



    }



}



.consult-img li a {



    display: block;



    width: 100%;



}



.consult-img li a img {



    width: 100%;



    height: 150px;



    margin: 15px 0 0;



    border-radius: 15px;



}



.consult-img li a img:hover {



    opacity: .7;



}



.modal-pro-custom {



    border-radius: 15px;



}



.accordion {



    text-align: left;



    font-size: 1.125em;



    color: #3C1D49;



    background-color: #FFFFFF;



    padding: 25px 10px 25px 40px;



    width: 100%;



    margin-bottom: 20px;



    -moz-border-radius: 15px;



    -webkit-border-radius: 15px;



    border-radius: 15px;



    cursor: pointer;



    border: none;



    box-shadow: 1px 1px 6px 1px rgba(0, 0, 0, 0.1);



}



@media screen and (max-width: 767px) {



    .accordion {



        font-size: 0.875em;



    }



}



.accordion:hover {



    background: rgba(60, 29, 73, 0.1);



}



.accordion::before {



    content: '\f13a';



    color: #343434;



    font-weight: bold;



    float: right;



    margin: 0 20px;



    font-size: 1.5em;



    font-family: "Font Awesome 5 Free";



}



.accordion_content {



    background-color: #FFFFFF;



    max-height: 0;



    overflow: hidden;



    transition: max-height 0.2s ease-out;



    top: -15px;



    position: relative;



    border-bottom-right-radius: 6px;



    border-bottom-left-radius: 6px;



    box-shadow: 1px 5px 6px 1px rgba(0, 0, 0, 0.1);



}



.accordion_content p {



    color: #707070;



    padding: 30px;



}



@media screen and (max-width: 767px) {



    .accordion_content p {



        font-size: 0.875em;



    }



}



.title-blog {



    color: #3C1D49;



    font-size: 1.5em;



    font-weight: bold;



    text-align: center;



    margin: 0 0 30px;



}



.com-social {



    display: flex;



    align-items: center;



    justify-content: space-between;



    margin: 0 0 20px;



    border-radius: 20px;



    padding: 30px 40px;



}



@media screen and (max-width: 767px) {



    .com-social {



        padding: 20px 30px;



    }



}



.com-social:hover {



    opacity: .8;



}



.com-social::after {



    color: #fff;



    font-weight: 900;



    font-size: 2.25em;



    font-family: "Font Awesome 5 Free";



    content: '\f138';



}



@media screen and (max-width: 767px) {



    .com-social::after {



        font-size: 1.875em;



        margin-left: 10px;



    }



}



.com-social > div {



    display: flex;



    align-items: center;



}



.com-social > div i {



    margin-right: 40px;



    font-size: 3.75em;



    color: #fff;



}



@media screen and (max-width: 767px) {



    .com-social > div i {



        font-size: 1.5625em;



        margin-right: 30px;



    }



}



.com-social h2 {



    font-size: 1.625em;



    color: #fff;



    margin: 0 0 5px;



}



@media screen and (max-width: 767px) {



    .com-social h2 {



        font-size: 1.25em;



    }



}



.com-social p {



    color: #fff;



}



@media screen and (max-width: 767px) {



    .com-social p {



        font-size: 0.875em;



    }



}



.com-facebook {



    background: #4267B2;



}



.com-whatsapp {



    background: #3EBE2A;



}



.com-instagram {



    background: #C4286C;



}



.com-pinterest {



    background: #E60023;



}



.text-blog {



    text-align: center;



    margin: 0 0 60px;



    color: #707070;



    margin: 60px auto;



    max-width: 700px;



}



.contact-title {



    color: #3C1D49;



    font-size: 1.5em;



    margin: 0 0 40px;



}



@media screen and (max-width: 767px) {



    .contact-title {



        font-size: 1.25em;



        margin: 20px 0 40px;



    }



}



.contact-form textarea {



    width: 100%;



    height: 140px;



    border: 1px solid #707070;



    margin: 0 0 15px;



    padding: 15px 30px 0 60px;



    border-radius: 10px;



    box-shadow: 1px 1px 6px 1px rgba(0, 0, 0, 0.1);



}



.contact-address {



    padding: 60px;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .contact-address {



        padding: 55px 0px;



    }



}



@media screen and (max-width: 767px) {



    .contact-address {



        padding: 60px 15px 20px;



    }



}



.contact-address p {



    color: #707070;



    margin: 0 0 10px;



}



.contact-address p i {



    margin-right: 10px;



}



.contact-address div {



    margin: 40px 0 0;



    display: flex;



}



@media screen and (max-width: 767px) {



    .contact-address div {



        justify-content: center;



    }



}



.contact-address div a {



    background: #3C1D49;



    color: #fff;



    width: 44px;



    height: 30px;



    position: relative;



    display: flex;



    align-items: center;



    margin-right: 15px;



    border-radius: 5px;



    border: 1px solid transparent;



}



.contact-address div a:hover {



    border: 1px solid #3C1D49;



    color: #3C1D49;



    background: transparent;



}



.contact-address div a i {



    font-size: 20px;



    margin: 0 auto;



}



.client-photo {



    columns: 4;



    column-gap: 1rem;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .client-photo {



        columns: 3;



    }



}



@media screen and (max-width: 767px) {



    .client-photo {



        columns: 2;



    }



}



.client-photo li {



    margin: 0 0 15px;



}



.client-photo li img {



    object-fit: cover;



    width: 100%;



    height: 100%;



    border-radius: 15px;



}



@media screen and (max-width: 767px) {



    .client-photo li {



        flex-basis: 100%;



        text-align: center;



    }



}



.client-photo li:nth-child(12n+1) {



    height: 427px;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .client-photo li:nth-child(12n+1) {



        height: 230px;



    }



}



@media screen and (max-width: 767px) {



    .client-photo li:nth-child(12n+1) {



        height: 230px;



    }



}



.client-photo li:nth-child(12n+2) {



    height: 152px;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .client-photo li:nth-child(12n+2) {



        height: 152px;



    }



}



@media screen and (max-width: 767px) {



    .client-photo li:nth-child(12n+2) {



        height: 152px;



    }



}



.client-photo li:nth-child(12n+3) {



    height: 438px;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .client-photo li:nth-child(12n+3) {



        height: 240px;



    }



}



@media screen and (max-width: 767px) {



    .client-photo li:nth-child(12n+3) {



        height: 240px;



    }



}



.client-photo li:nth-child(12n+4) {



    height: 427px;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .client-photo li:nth-child(12n+4) {



        height: 269px;



    }



}



@media screen and (max-width: 767px) {



    .client-photo li:nth-child(12n+4) {



        height: 250px;



    }



}



.client-photo li:nth-child(12n+5) {



    height: 312px;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .client-photo li:nth-child(12n+5) {



        height: 271px;



    }



}



@media screen and (max-width: 767px) {



    .client-photo li:nth-child(12n+5) {



        height: 271px;



    }



}



.client-photo li:nth-child(12n+6) {



    height: 278px;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .client-photo li:nth-child(12n+6) {



        height: 187px;



    }



}



@media screen and (max-width: 767px) {



    .client-photo li:nth-child(12n+6) {



        height: 187px;



    }



}



.client-photo li:nth-child(12n+7) {



    height: 181px;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .client-photo li:nth-child(12n+7) {



        height: 187px;



    }



}



@media screen and (max-width: 767px) {



    .client-photo li:nth-child(12n+7) {



        height: 187px;



    }



}



.client-photo li:nth-child(12n+8) {



    height: 436px;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .client-photo li:nth-child(12n+8) {



        height: 250px;



    }



}



@media screen and (max-width: 767px) {



    .client-photo li:nth-child(12n+8) {



        height: 250px;



    }



}



.client-photo li:nth-child(12n+9) {



    height: 401px;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .client-photo li:nth-child(12n+9) {



        height: 143px;



    }



}



@media screen and (max-width: 767px) {



    .client-photo li:nth-child(12n+9) {



        height: 143px;



    }



}



.client-photo li:nth-child(12n+10) {



    height: 368px;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .client-photo li:nth-child(12n+10) {



        height: 252px;



    }



}



@media screen and (max-width: 767px) {



    .client-photo li:nth-child(12n+10) {



        height: 252px;



    }



}



.client-photo li:nth-child(12n+11) {



    height: 281px;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .client-photo li:nth-child(12n+11) {



        height: 246px;



    }



}



@media screen and (max-width: 767px) {



    .client-photo li:nth-child(12n+11) {



        height: 246px;



    }



}



.client-photo li:nth-child(12n+12) {



    height: 368px;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .client-photo li:nth-child(12n+12) {



        height: 252px;



    }



}



@media screen and (max-width: 767px) {



    .client-photo li:nth-child(12n+12) {



        height: 252px;



    }



}



.sub-blog {



    box-shadow: 1px 1px 6px 1px rgba(0, 0, 0, 0.1);



    padding: 15px 30px 15px 15px;



    border-radius: 10px;



    margin: 40px 0 0;



}



@media screen and (max-width: 767px) {



    .sub-blog {



        text-align: center;



    }



}



.sub-blog h2 {



    color: #3C1D49;



    margin: 0 0 20px;



    font-weight: bold;



}



.sub-blog div {



    color: #707070;



    margin: 0 0 15px;



}



.sub-blog div p {



    font-size: 0.875em;



    font-weight: 500;



    line-height: 1.125em;



}



.sub-blog div span {



    font-size: 0.75em;



}



.sub-blog-social {



    box-shadow: 1px 1px 6px 1px rgba(0, 0, 0, 0.1);



    padding: 15px 30px 15px 15px;



    border-radius: 10px;



    margin: 40px 0 0;



}



@media screen and (max-width: 767px) {



    .sub-blog-social {



        padding: 15px 20px;



    }



}



.sub-blog-social h3 {



    color: #707070;



    font-size: 0.875em;



    margin: 0 0 15px;



    font-weight: bold;



}



@media screen and (max-width: 767px) {



    .sub-blog-social h3 {



        text-align: center;



    }



}



.sub-blog-social-content {



    display: flex;



    justify-content: space-between;



}



@media screen and (min-width: 992px) and (max-width: 1199px) {



    .sub-blog-social-content {



        display: block;



        text-align: center;



    }



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .sub-blog-social-content {



        display: block;



        text-align: center;



    }



}



@media screen and (max-width: 767px) {



    .sub-blog-social-content {



        display: block;



        text-align: center;



    }



}



.sub-blog-social-content a {



    font-size: 0.6875em;



    color: #fff;



    border-radius: 10px;



    padding: 0 7px;



    display: block;



}



@media screen and (min-width: 992px) and (max-width: 1199px) {



    .sub-blog-social-content a {



        font-size: 0.75em;



        padding: 10px 0;



        border-radius: 20px;



        margin-bottom: 10px;



    }



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .sub-blog-social-content a {



        font-size: 0.75em;



        border-radius: 20px;



        padding: 10px 0;



        margin-bottom: 10px;



    }



}



@media screen and (max-width: 767px) {



    .sub-blog-social-content a {



        display: block;



        font-size: 0.875em;



        border-radius: 15px;



        padding: 10px 0;



        margin-bottom: 10px;



    }



}



.sub-blog-social-content a:hover {



    opacity: .7;



}



.color-face {



    background: #4469B0;



}



.color-twitter {



    background: #59ADEC;



}



.color-whats {



    background: #57C24C;



}



.social-news {
    display: flex;
    margin-top: 30px;
}



.social-news p {



    margin: 0 40px 0 0;



    font-size: 0.875em;



    color: #707070;



}



.social-news div {



    width: 220px;



}



.blog-news {



    box-shadow: 1px 1px 6px 1px rgba(0, 0, 0, 0.1);



    border-radius: 10px;



}



.blog-news > img {



    border-top-left-radius: 10px;



    border-top-right-radius: 10px;



    width: 100%;



    height: 380px;



    object-fit: cover;



    object-position: center;



}



@media screen and (max-width: 767px) {



    .blog-news > img {



        height: 240px;



    }



}



.blog-news-content {



    padding: 35px;



}



.blog-news-content p {



    margin-bottom: 10px;



}



@media screen and (max-width: 767px) {



    .blog-news-content {



        padding: 15px 4px;



    }



}



.news-text {



    color: #707070;



    padding: 20px 0 0;



    line-height: 1.5em;



}



@media screen and (max-width: 767px) {



    .news-text p {



        text-align: justify;



    }



}



@media screen and (min-width: 992px) and (max-width: 1199px) {



    .news-text {



        padding: 0;



    }



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .news-text {



        padding: 0;



    }



}



@media screen and (max-width: 767px) {



    .news-text {



        padding: 0 10px;



    }



}



.news-photo {



    margin: 20px 0 0;



    display: flex;



    flex-wrap: wrap;



    justify-content: space-between;



}



.news-photo img:nth-child(1) {



    width: 100%;



    height: 260px;



    object-fit: cover;



    object-position: center;



    margin: 0 0 15px;



}



.news-photo img:nth-child(2) {



    height: 230px;



    object-fit: cover;



    object-position: center;



    width: 33%;



}



.news-photo img:nth-child(3) {



    object-fit: cover;



    object-position: center;



    height: 230px;



    width: 65%;



    justify-content: flex-end;



}



.plugin-facebook {



    margin: 40px 0 0;



}



.plugin-facebook h2 {



    font-size: 1.5em;



    color: #1D1D1B;



    margin: 0 0 20px;



}



.pay-title p {



    padding: 10px 0 0;



    border-top: 2px dotted #E9E9E9;



    font-size: 0.875em;



    color: #707070;



}



.title-pay {



    color: #3C1D49;



    font-size: 1.0625em;



    margin: 0 0 20px;



}



.pay-label {



    margin: 0 0 10px;



}



.pay-label > label {



    color: #707070;



    font-size: 0.9375em;



    margin: 0 0 10px;



}



.pay-button {



    display: flex;



    justify-content: space-between;



    margin: 0 0 40px;



}



.pay-button a {



    width: 47%;



    border: 1px solid #707070;



    color: #707070;



}



@media screen and (max-width: 767px) {



    .pay-button a {



        font-size: 0.5em;



    }



}



.pay-button a:hover {



    opacity: .9;



}



.pay-button a.active {



    color: #fff;



    background: #3C1D49;



    border: 1px solid #3C1D49;



}



.pay-form input {



    line-height: 3em;



}



.pay-mm {



    margin-top: 32px;



}



.pay-mm div:nth-child(1) input {



    text-align: center;



}



.pay-mm div:nth-child(2) input {



    text-align: center;



}



.pay-form-card {



    position: relative;



}



.pay-form-card input {



    width: 100%;



    line-height: 3em;



    border: 1px solid #707070;



    margin: 0 0 15px;



    padding: 0 20px 0 20px;



    border-radius: 5px;



    box-shadow: 1px 1px 6px 1px rgba(0, 0, 0, 0.1);



}



.pay-figure {



    background: #707070;



    width: 40px;



    height: 25px;



    display: block;



    position: absolute;



    top: 45px;



    right: 20px;



}



.preview-card {



    margin-bottom: 20px;



}



.preview-card p {



    color: #707070;



    font-size: 0.9375em;



    margin: 0 0 10px;



}



.preview-card > div {



    border-radius: 10px;



    width: 100%;



    height: 240px;



    background: #D9D9D9;



    display: flex;



    align-items: center;



    justify-content: center;



}



.preview-card-content {



    width: 270px;



    height: 170px;



    background: #ECECEC;



    display: flex;



    align-items: center;



    padding: 0 0 0 20px;



    border-radius: 10px;



}



.preview-figure {



    display: block;



    width: 42px;



    height: 23px;



    background: #D9D9D9;



    margin-bottom: 20px;



    border-radius: 2px;



}



.preview-number {



    color: #1D1D1B;



    display: block;



    margin-bottom: 7px;



}



.preview-name {



    color: #1D1D1B;



    display: block;



    font-size: 0.875em;



}



.pay-end {



    display: flex;



    justify-content: space-between;



    align-items: flex-end;



}



@media screen and (max-width: 767px) {



    .pay-end {



        display: block;



    }



    .pay-end div:first-child {



        margin-bottom: 30px;



    }



}



.pay-select select {



    display: block;



    width: 240px;



    font-size: 0.875em;



    color: #707070;



    padding: 10px 20px;



    border: 1px solid #707070;



    border-radius: 5px;



    box-shadow: 1px 1px 6px 1px rgba(0, 0, 0, 0.1);



}



.pay-end-button button {



    margin-bottom: 10px;



    padding: 10px 0;



    width: 220px;



    color: #fff;



    background: #57C24C;



    border-radius: 5px;



    cursor: pointer;



    border: 1px solid #57C24C;



}



@media screen and (max-width: 767px) {



    .pay-end-button button {



        width: 100%;



    }



}



.pay-end-button button:hover {



    color: #57C24C;



    background: #fff;



}



.box-order {



    box-shadow: 1px 1px 6px 1px rgba(0, 0, 0, 0.1);



    padding: 30px 0;



    border-radius: 10px;



}



.payorder {



    padding: 0 0 15px 20px;



}



.payorder h3 {



    color: #3C1D49;



    font-size: 1.125em;



    margin-bottom: 15px;



}



.payorder p {



    color: #707070;



    font-size: 0.875em;



}



.payorder-content {



    border-top: 1px solid #D9D9D9;



    padding: 15px 20px 0 0;



    text-align: end;



    color: #707070;



    line-height: 1.875em;



}



.payorder-content p {



    font-size: 0.875em;



}



.payorder-content h4 {



    font-size: 1em;



    color: #3C1D49;



}



.pay-billet {



    display: none;



    margin: 15px 0 0;



}



.pay-billet p {



    color: #707070;



    margin: 0 0 20px;



}



.order-completed h1 {



    font-size: 1.75em;



    color: #3C1D49;



    line-height: 1.875em;



    border-bottom: 1px dashed #E9E9E9;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .order-completed h1 {



        font-size: 1.625em;



    }



}



@media screen and (max-width: 767px) {



    .order-completed h1 {



        font-size: 1.25em;



    }



}



.order-completed p {



    color: #707070;



    margin: 20px 0;



    width: 560px;



}



.order-completed a {



    display: block;



}



.register-local div::after {



    content: "\f078";



    position: absolute;



    display: inline-block;



    font-weight: 900;



    font-family: "Font Awesome 5 Free";



    pointer-events: none;



    font-size: 0.875em;



    color: #5C5C5C;



    top: 48px;



    right: 40px;



    z-index: 2;



}



.register-local div::before {



    content: "\f3c5";



    position: absolute;



    font-weight: 900;



    font-family: "Font Awesome 5 Free";



    pointer-events: none;



    font-size: 0.875em;



    color: #5C5C5C;



    top: 48px;



    left: 40px;



    z-index: 2;



}



.register-local select {



    position: relative;



    width: 100%;



    line-height: 3em;



    border: 1px solid #707070;



    margin: 0 0 15px;



    padding: 0 30px 0 55px;



    border-radius: 10px;



    box-shadow: 1px 1px 6px 1px rgba(0, 0, 0, 0.1);



    display: inline-block;



    -webkit-appearance: none;



    -moz-appearance: none;



    appearance: none;



    cursor: pointer;



    z-index: 1;



    color: #707070;



}



.upload-art {



    margin: 15px 0 0;



}



.upload-art > p {



    color: #707070;



    font-size: 0.9375em;



    margin: 0 0 5px;



}



.upload-art > a {



    color: #fff;



    background: #3F5CCB;



    margin: 0 0 30px;



    padding: 14px 20px;



    display: block;



    width: 200px;



    text-align: center;



    border-radius: 5px;



    border: 1px solid transparent;



}



@media screen and (max-width: 767px) {



    .upload-art > a {



        width: 100%;



    }



}



.upload-art > a:hover {



    color: #3F5CCB;



    background: #fff;



    border: 1px solid #3F5CCB;



}



.upload-art button {



    color: #fff;



    background: #57C24C;



    width: 240px;



    padding: 14px 20px;



    border-radius: 10px;



    cursor: pointer;



    border: 1px solid transparent;



}



@media screen and (max-width: 767px) {



    .upload-art button {



        width: 100%;



    }



}



.upload-art button:hover {



    color: #57C24C;



    background: #fff;



    border: 1px solid #57C24C;



}



.upload-photo {



    display: flex;



    flex-wrap: wrap;



    justify-content: space-between;



    margin: 0 0 15px;



}



.upload-photo figure {



    flex-basis: calc(100% / 9 - 15px);



    height: 80px;



    margin: 0 0 15px;



    display: block;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .upload-photo figure {



        height: 60px;



    }



}



@media screen and (max-width: 767px) {



    .upload-photo figure {



        flex-basis: calc(100% / 4 - 10px);



        height: 60px;



    }



}



.upload-photo figure img {



    width: 100%;



    height: 100%;



    border-radius: 5px;



}



.title-up {



    color: #3C1D49;



    font-size: 1.0625em;



    margin: 0 0 20px;



}



.icon-top-prev {



    color: #fff;



    font-size: 3.5em;



    left: 30px;



}



@media screen and (max-width: 767px) {



    .icon-top-prev {



        font-size: 2.5em;



        left: 5px;



    }



}



.icon-top-next {



    color: #fff;



    font-size: 3.5em;



    right: 30px;



}



@media screen and (max-width: 767px) {



    .icon-top-next {



        font-size: 2.5em;



        right: 5px;



    }



}



.swiper-part-content {



    width: 82%;



    margin: 0 auto;



}



.like-photo {



    width: 420px;



    margin: 0 auto;



    display: flex;



}



@media screen and (max-width: 767px) {



    .like-photo {



        justify-content: space-around;



        width: 100%;



    }



}



.like-photo img {



    margin-bottom: 10px;



    border-radius: 15px;



    object-fit: cover;



    object-position: center;



    display: block;



}



.photo-one {



    width: 120px;



    margin: 18px 10px 0 0;



}



@media screen and (max-width: 767px) {



    .photo-one {



        width: auto;



        margin: 18px 0 0 0;



    }



}



.photo-one img:nth-child(1) {



    width: 80px;



    height: 80px;



    margin: 0 0 10px auto;



}



@media screen and (max-width: 767px) {



    .photo-one img:nth-child(1) {



        width: 40px;



        height: 40px;



    }



}



.photo-one img:nth-child(2) {



    width: 120px;



    height: 120px;



    margin: 0 0 10px auto;



}



@media screen and (max-width: 767px) {



    .photo-one img:nth-child(2) {



        width: 80px;



        height: 80px;



    }



}



.photo-one img:nth-child(3) {



    width: 100px;



    height: 100px;



    margin: 0 0 10px auto;



}



@media screen and (max-width: 767px) {



    .photo-one img:nth-child(3) {



        width: 60px;



        height: 60px;



    }



}



.photo-two {



    width: 145px;



}



@media screen and (max-width: 767px) {



    .photo-two {



        width: auto;



    }



}



.photo-two img:nth-child(1) {



    width: 116px;



    height: 116px;



}



@media screen and (max-width: 767px) {



    .photo-two img:nth-child(1) {



        width: 76px;



        height: 76px;



    }



}



.photo-two img:nth-child(2) {



    width: 145px;



    height: 145px;



}



@media screen and (max-width: 767px) {



    .photo-two img:nth-child(2) {



        width: 105px;



        height: 105px;



    }



}



.photo-two img:nth-child(3) {



    width: 114px;



    height: 114px;



    margin: 0 0 0 auto;



    display: block;



}



@media screen and (max-width: 767px) {



    .photo-two img:nth-child(3) {



        width: 74px;



        height: 74px;



    }



}



.photo-three {



    width: 125px;



    margin: 0 0 0 10px;



}



@media screen and (max-width: 767px) {



    .photo-three {



        width: auto;



        margin: 0;



    }



}



.photo-three img:nth-child(1) {



    width: 65px;



    height: 65px;



    margin-left: -30px;



}



@media screen and (max-width: 767px) {



    .photo-three img:nth-child(1) {



        width: 50px;



        height: 50px;



    }



}



.photo-three img:nth-child(2) {



    width: 96px;



    height: 96px;



}



@media screen and (max-width: 767px) {



    .photo-three img:nth-child(2) {



        width: 56px;



        height: 56px;



    }



}



.photo-three img:nth-child(3) {



    width: 125px;



    height: 125px;



}



@media screen and (max-width: 767px) {



    .photo-three img:nth-child(3) {



        width: 85px;



        height: 85px;



    }



}



.client-like-flex {



    align-items: center;



    display: flex;



}



@media screen and (min-width: 992px) and (max-width: 1199px) {



    .swiper-slide-content {



        margin-left: 100px;



    }



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .swiper-slide-content {



        text-align: left;



    }



}



.swiper-slide-content {



    padding-top: 30px;



    padding-bottom: 30px;



}



.swiper-slide-content h1 {



    position: relative;

    

    width: 100%;



    font-size: 4em;



    line-height: 1.125em;



    color: #fff;



    font-weight: bold;



    padding: 60px 0 10px;



    z-index: 2;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .swiper-slide-content h1 {

        padding: 0 0 10px;
        font-size: 3.125em;
        text-align: center;

    }



}



@media screen and (max-width: 767px) {



    .swiper-slide-content {

        text-align: center;

    

        display: flex;

        

        padding-right: 20px;

        

        padding-left: 20px;



        flex-direction: column;



        justify-content: space-between;



        height: 100%;



    }



    .swiper-slide-content h1 {



        padding: 0 0 10px;



        font-size: 1.875em;



    }



}



.swiper-slide-content p {



    font-size: 1.375em;



    line-height: 1.5em;



    color: #fff;



    width: 500px;



    max-width: 100%;



    position: relative;



    z-index: 2;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .swiper-slide-content p {


        text-align: center;

        width: 100%;

        padding: 0 75px;


    }



}



@media screen and (max-width: 767px) {



    .swiper-slide-content p {



        font-size: 1em;

        text-align: center;



    }



}



.swiper-slide-content a {



    color: #fff;



    font-size: 1em;



    border: 2px solid #fff;



    margin: 30px 0 0;



    position: relative;



    z-index: 2;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .swiper-slide-content a {



        margin: 30px auto 0;



    }



}



@media screen and (max-width: 767px) {



    .swiper-slide-content a {



        padding: 0;



    }



}



.swiper-slide-content a:hover {



    background: #3C1D49;



    border: 2px solid #3C1D49;



}



/*@media screen and (min-width: 768px) and (max-width: 991px) {



    .slide-flex {



        display: flex;



        align-items: center;



        justify-content: center;



    }



}







@media screen and (max-width: 767px) {



    .slide-flex {



        display: flex;



        align-items: center;



        justify-content: center;



    }



}*/



@media screen and (max-width: 767px) {



    .mobile-pag {



        width: 100%;



        margin-top: 10px;



    }



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .blog-tablet img {



        height: 150px;



    }



    .blog-tablet .blog-index-content {



        padding: 15px 20px;



    }



    .blog-tablet .blog-index-content h3 {



        font-size: 0.9375em;



    }



    .blog-tablet .blog-index-content p {



        font-size: 0.8125em;



    }



}



.btn-more {



    margin: 60px auto 0;



    display: block;



}



.btn-more i {



    margin-right: 10px;



}



@inclue d(tablet) {



    .payorder-2 {



        order: 1;



    }



}



@inclue d(mobile) {



    .payorder-2 {



        order: 1;



    }



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .payorder-1 {



        order: 2;



        margin-top: 30px;



    }



}



@media screen and (max-width: 767px) {



    .payorder-1 {



        order: 2;



        margin-top: 30px;



    }



}



@media screen and (min-width: 1200px) {



    .pay-menu {



        display: none;



    }



}



.site-safe {



    display: flex;



    align-items: center;



    font-size: 0.875em;



}



@media screen and (max-width: 767px) {



    .site-safe {



        font-size: 0.625em;



    }



}



.site-safe span {



    display: block;



    color: #707070;



    line-height: 1.125em;



    margin-top: 12px;



}



.site-safe i {



    margin-right: 10px;



    color: #000;



}



.product-slide-review {



    padding: 60px 0 130px;



    height: 400px;



    position: relative;



    background-color: #3C1D49;



}



@media screen and (max-width: 767px) {



    .product-slide-review {



        margin-top: 140px;



        /*height: 350px;*/



    }



}



.product-slide-review h2 {



    margin: 0 0 30px 0;



}



.container-slide {



    max-width: 1900px;



    width: 100%;



    height: 100%;



    margin-right: auto;



    margin-left: auto;



}



.container-slide::after, .container-slide::before {



    content: '';



    display: table;



    clear: both;



}



@media (max-width: 420px) {



    .container-slide {



        padding: 0 15px;



    }



}



.in-button-slide {



    right: 45px;



}



@media screen and (max-width: 767px) {



    .in-button-slide {



        right: 30px;



    }



}



.padd {



    padding: 80px 0;



}



@media screen and (max-width: 767px) {



    .padd {



        padding: 40px 0;



    }



}



.event {



    margin: 0 0 60px;



    display: block;



}



@media screen and (max-width: 767px) {



    .event {



        margin: 0 0 40px;



    }



}



.event img {



    width: 100%;



    height: 255px;



    object-fit: cover;



    object-position: center;



    border-radius: 15px;



}



@media screen and (min-width: 992px) and (max-width: 1199px) {



    .event img {



        height: 190px;



    }



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .event img {



        height: 160px;



    }



}



@media screen and (max-width: 767px) {



    .event img {



        height: 200px;



    }



}



.event h2 {



    color: #3C1D49;



    font-size: 1.125em;



    padding: 15px 10px 10px;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .event h2 {



        font-size: 1.0625em;



    }



}



@media screen and (max-width: 767px) {



    .event h2 {



        font-size: 1.0625em;



    }



}



.event p {



    font-size: 0.9375em;



    color: #707070;



    padding: 0 10px;



}



@media screen and (min-width: 768px) and (max-width: 991px) {



    .event p {



        font-size: 0.875em;



    }



}



@media screen and (max-width: 767px) {



    .event p {



        font-size: 0.875em;



    }



}



.btn-event {



    margin: 60px auto 0;



}



.btn-event i {



    margin-right: 10px;



}



.event-title {



    margin-bottom: 50px;



}



@media screen and (max-width: 767px) {



    .event-title {



        margin-bottom: 25px;



    }



}



.event-img img {



    width: 100%;



    object-fit: cover;



    object-position: center;



    border-radius: 15px;



    height: 515px;



}



@media screen and (max-width: 767px) {



    .event-img img {



        height: 250px;



    }



}



.event-content {



    padding-left: 30px;



}



@media screen and (max-width: 767px) {



    .event-content {



        padding-left: 15px;



    }



}



.event-content h1 {



    font-size: 1.5em;



    color: #3C1D49;



    margin-top: 15px;



    font-weight: bold;



    line-height: 1.375em;



}



@media screen and (max-width: 767px) {



    .event-content h1 {



        margin-top: 30px;



        text-align: center;



        font-size: 1.375em;



    }



}



.event-content h2 {



    font-size: 1.125em;



    color: #3C1D49;



    margin: 30px 0 20px;



}



.event-content p {



    color: #707070;



}



.event-content a {



    margin: 30px 0 0;



}



/*products => paginator*/



.paginator {



    -webkit-display: -webkit-box;



    -webkit-display: -webkit-flex;



    display: -webkit-box;



    display: -webkit-flex;



    display: -moz-box;



    display: -ms-flexbox;



    display: flex;



    flex-basis: auto;



    -webkit-justify-content: center;



    -webkit-box-pack: center;



    -moz-justify-content: center;



    -moz-flex-pack: center;



    -ms-justify-content: center;



    -ms-flex-pack: center;



    -o-justify-content: center;



    justify-content: center;



    -webkit-align-items: center;



    -webkit-box-align: center;



    -moz-align-items: center;



    -ms-align-items: center;



    -ms-flex-align: center;



    -o-align-items: center;



    align-items: center;



    position: relative;



    width: 100%;



}



.paginator a,

.paginator span {



    font-size: 16px;



    color: #fff;



    font-weight: bold;



    text-shadow: none;



    background-color: #3C1D49;



    -webkit-display: -webkit-box;



    -webkit-display: -webkit-flex;



    display: -webkit-box;



    display: -webkit-flex;



    display: -moz-box;



    display: -ms-flexbox;



    display: flex;



    -webkit-justify-content: center;



    -webkit-box-pack: center;



    -moz-justify-content: center;



    -moz-flex-pack: center;



    -ms-justify-content: center;



    -ms-flex-pack: center;



    -o-justify-content: center;



    justify-content: center;



    -webkit-align-items: center;



    -webkit-box-align: center;



    -moz-align-items: center;



    -ms-align-items: center;



    -ms-flex-align: center;



    -o-align-items: center;



    align-items: center;



    width: 45px;



    height: 45px;



    flex-wrap: wrap;



    padding: 0;



    margin: 5px;



    -webkit-border-radius: 50%;



    -moz-border-radius: 50%;



    border-radius: 50%;



}



.paginator a:hover,

.paginator span.active {



    cursor: pointer;



    background-color: #6a24ba;



    color: #ffffff;



}



/*



TRIGGER



Personaliza mensagens do sistema



*/



.trigger {



    display: block;



    width: 100%;



    padding: 15px;



    background: #333;



    font-size: 0.9em;



    color: #fff;



    margin-bottom: 20px;



}



.trigger p {



    margin-top: 8px;



}



.trigger_success {



    background-color: #00B494;



}



.trigger_info {



    background-color: #0E96E5;



}



.trigger_alert {



    background-color: #FAAD50;



}



.trigger_error {



    background-color: #F45563;



}



.trigger_none {



    margin-bottom: 0;



}



/***********************************



######### CUSTON BUTTONS ###########



***********************************/



.btn {



    display: inline-block;



    cursor: pointer;



    padding: 10px 12px;



    margin-top: 2px;



    font-size: 16px;



    color: #fff;



    text-decoration: none !important;



    text-align: center;



    border: none;



    border-radius: 3px;



    -moz-border-radius: 3px;



    -webkit-border-radius: 3px;



    letter-spacing: 0 !important;



}



.btn_medium {



    padding: 10px 20px;



    font-size: 1.1em;



    text-transform: uppercase;



    font-weight: bold;



}



.btn:hover {



    background: #555;



    text-decoration: none !important;



}



.btn_blue {



    background-color: #0E96E5;



    text-shadow: 1px 1px #096397;



}



.btn_blue:hover {



    background-color: #096397;



}



.btn_green {



    background-color: #57C24C;



}



.btn_green:hover {



    background-color: #338a2a;



}



.btn_yellow {



    background-color: #FAAD50;



    text-shadow: 1px 1px #CC8D41;



}



.btn_yellow:hover {



    background-color: #CC8D41;



}



.btn_red {



    background-color: #F45563;



    text-shadow: 1px 1px #C54550;



}



.btn_red:hover {



    background-color: #C54550;



}



.btn_cta_blue {



    padding: 15px 30px;



    font-size: 1.2em;



    font-weight: bold;



    text-transform: uppercase;



    background: #0E96E5;



    border-bottom: 5px solid #096397;



}



.btn_cta_blue:hover {



    background-color: #096397;



    border-color: #0A537D;



}



.btn_cta_green {



    padding: 15px 30px;



    font-size: 1.2em;



    font-weight: bold;



    text-transform: uppercase;



    background: #00B494;



    border-bottom: 5px solid #008068;



}



.btn_cta_green:hover {



    background-color: #008068;



    border-color: #0B5747;



}



.btn_cta_yellow {



    padding: 15px 30px;



    font-size: 1.2em;



    font-weight: bold;



    text-transform: uppercase;



    background: #FAAD50;



    border-bottom: 5px solid #CC8D41;



}



.btn_cta_yellow:hover {



    background-color: #CC8D41;



    border-color: #A67436;



}



.btn_cta_red {



    padding: 15px 30px;



    font-size: 1.2em;



    font-weight: bold;



    text-transform: uppercase;



    background: #F45563;



    border-bottom: 5px solid #C54550;



}



.btn_cta_red:hover {



    background-color: #C54550;



    border-color: #93343C;



}



.btn_green_noaction:hover {



    background: #00B494 !important;



    cursor: default !important;



}



.btn_blue_noaction:hover {



    background: #0E96E5 !important;



    cursor: default !important;



}



.btn_yellow_noaction:hover {



    background: #FAAD50 !important;



    cursor: default !important;



}



.btn_red_noaction:hover {



    background: #F45563 !important;



    cursor: default !important;



}



.btn-all {



    background: #3C1D49;



    color: #fff;



}



.btn-all:hover {



    background: #fff;



    color: #3C1D49;



    border: 1px solid #3C1D49;



}



.not_found {



    text-align: center;



}



.not_found span {



    font-size: 60px;



    margin-bottom: 40px;



    display: block;



}



.not_found h1 {



    font-size: 35px;



    margin-bottom: 20px;



    color: #3C1D49;



}



.not_found a {



    color: #6a24ba;



}



.dropzone, .dropzone * {



    box-sizing: border-box;



}



.dropzone {



    background: white;



    border-radius: 5px;



    border: 2px dashed #3C1D49;



    border-image: none;



    margin-left: auto;



    margin-right: auto;



    margin-bottom: 30px;



}



.dropzone .dz-preview {



    position: relative;



    display: inline-block;



    width: 100px;



    margin: 0.5em;



}



.dropzone .dz-preview .dz-image {



    width: 100%;



    height: 100px;



}



.dropzone .dz-preview .dz-progress {



    display: block;



    height: 15px;



    border: 1px solid #aaa;



}



.dropzone .dz-preview .dz-progress .dz-upload {



    display: block;



    height: 100%;



    width: 0;



    background: green;



}



.dropzone .dz-preview .dz-error-message {



    color: red;



    display: none;



}



.dropzone .dz-preview.dz-error .dz-error-message, .dropzone .dz-preview.dz-error .dz-error-mark {



    display: block;



}



.dropzone .dz-preview.dz-success .dz-success-mark {



    display: block;



}



.dropzone .dz-preview .dz-error-mark, .dropzone .dz-preview .dz-success-mark {



    position: absolute;



    display: none;



    left: 30px;



    top: 30px;



    width: 54px;



    height: 58px;



    left: 50%;



    margin-left: -27px;



}



.jwc_artesao_form_sended {



    text-align: center;



    padding: 80px 0;



    display: none;



}



.jwc_artesao_form_sended h3 {



    font-size: 22px;



    font-weight: bold;



    color: #00A887;



    margin-bottom: 20px;



}



.jwc_artesao_form_sended p {



    color: #c1c1c1;



}



/* realtime search */



.search_area {



    padding: 10px;



    background-color: #eaeaea;



}



.search_area form {



    position: relative;



}



.search_area form input {



    width: 100%;



    padding: 20px 0;



    background: transparent;



    color: #000;



    font-weight: 500;



}



.search_area form button {



    position: absolute;



    right: 0;



    top: 20px;



    background: transparent;



    font-size: 22px;



}



.realtime_search {



    display: none;



    width: 100%;



    position: absolute;



    margin-top: 10px;



    padding: 10px 5px 10px 10px;



    background-color: #ffffff;



    -webkit-border-radius: 5px;



    -moz-border-radius: 5px;



    -ms-border-radius: 5px;



    -o-border-radius: 5px;



    border-radius: 5px;



    -webkit-box-shadow: 0 2px 4px 0 rgba(216, 216, 216, 0.5);



    -moz-box-shadow: 0 2px 4px 0 rgba(216, 216, 216, 0.5);



    -ms-box-shadow: 0 2px 4px 0 rgba(216, 216, 216, 0.5);



    -o-box-shadow: 0 2px 4px 0 rgba(216, 216, 216, 0.5);



    box-shadow: 0 2px 4px 0 rgba(216, 216, 216, 0.5);



    z-index: 99;



}



.realtime_search ul {



    max-height: 300px;



    overflow-y: auto;



}



.realtime_search ul::-webkit-scrollbar {



    width: 7px;



    background-color: #ffffff;



}



.realtime_search ul::-webkit-scrollbar-thumb {



    background-color: transparent;



    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);



    -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);



    -ms-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);



    -o-box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);



    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);



    -webkit-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3);



    -moz-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3);



    -ms-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3);



    -o-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3);



    box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.3);



    -webkit-border-radius: 5px;



    -moz-border-radius: 5px;



    -ms-border-radius: 5px;



    -o-border-radius: 5px;



    border-radius: 5px;



}



.realtime_search li a {



    -webkit-display: -webkit-box;



    -webkit-display: -webkit-flex;



    display: -webkit-box;



    display: -webkit-flex;



    display: -moz-box;



    display: -ms-flexbox;



    display: flex;



    align-items: flex-start;



    text-decoration: none;



    padding: 10px;



    -webkit-transition: background-color 0.2s ease-in-out;



    -moz-transition: background-color 0.2s ease-in-out;



    -ms-transition: background-color 0.2s ease-in-out;



    -o-transition: background-color 0.2s ease-in-out;



    transition: background-color 0.2s ease-in-out;



}



.realtime_search li a:hover {



    background-color: #f6f6f6;



}



.realtime_search li a img {



    width: 50px;



    margin-right: 20px;



}



.realtime_search li a p {



    font-size: 0.9em;



    color: #000000;



    font-weight: 600;



}



.realtime_search li a p .old_price {



    font-size: 0.75em;



    text-decoration: line-through;



}



.realtime_search li a p .new_price {



    color: #FF6969;



    font-weight: bold;



}



.slide-thumbs {



    margin-left: auto;



    margin-right: auto;



    position: relative;



    overflow: hidden;



    list-style: none;



    padding: 0;



    z-index: 1;



}



.swiper-slide.thumb-slide {



    text-align: center;



    font-size: 18px;



    background: #fff;



    /* Center slide text vertically */



    display: -webkit-box;



    display: -ms-flexbox;



    display: -webkit-flex;



    display: flex;



    -webkit-box-pack: center;



    -ms-flex-pack: center;



    -webkit-justify-content: center;



    justify-content: center;



    -webkit-box-align: center;



    -ms-flex-align: center;



    -webkit-align-items: center;



    align-items: center;



    padding-bottom: 20px;



}



.main-image {



    position: relative;



}



.main-image span {



    display: none;



    width: 100%;



    height: 100%;



    position: absolute;



    top: 0;



    left: 0;



    background-color: rgba(255, 255, 255, 0.3);



}



.main-image.loading span {



    -webkit-display: -webkit-box;



    -webkit-display: -webkit-flex;



    display: -webkit-box;



    display: -webkit-flex;



    display: -moz-box;



    display: -ms-flexbox;



    display: flex;



    -webkit-justify-content: center;



    -webkit-box-pack: center;



    -moz-justify-content: center;



    -moz-flex-pack: center;



    -ms-justify-content: center;



    -ms-flex-pack: center;



    -o-justify-content: center;



    justify-content: center;



    -webkit-align-items: center;



    -webkit-box-align: center;



    -moz-align-items: center;



    -ms-align-items: center;



    -ms-flex-align: center;



    -o-align-items: center;



    align-items: center;



}



.main-image span i {



    font-size: 1.5em;



    color: #eeeeee;



}



.thumb-navs {



    width: 100%;



    position: relative;



    display: flex;



    flex-wrap: wrap;



    justify-content: space-between;



    margin-bottom: 30px;



}



.button-thumbs {



    background: #fafafa;



    color: #000;



    width: 50px;



    height: 50px;



    display: flex;



    align-items: center;



    justify-content: center;



    top: 0;



    position: relative;



    margin: 0;



}



.button-thumbs-prev {



    left: 0;



}



.button-thumbs-next {



    right: 0;



}



.copyright-agency {



    color: #fff;



}



.copyright-agency:hover {



    color: #fff;



    opacity: 0.7;



}



/*



VIDEOPLAY



*/



.videoplay {



    display: none;



    width: 100%;



    height: 100%;



    position: fixed;



    top: 0;



    left: 0;



    background-color: rgba(0, 0, 0, 0.8);



    animation-timing-function: ease-out;



    animation-duration: .3s;



    animation-name: modal-video;



    -webkit-transition: opacity .3s ease-out;



    -moz-transition: opacity .3s ease-out;



    -o-transition: opacity .3s ease-out;



    transition: opacity .3s ease-out;



    opacity: 1;



    cursor: pointer;



    z-index: 1000000;



}



.videoplay__body {



    width: 100%;



    height: 100%;



    max-width: 700px;



    margin: 0 auto;



    display: table;



}



.videoplay__inner {



    display: table-cell;



    width: 100%;



    height: 100%;



    vertical-align: middle;



}



.videoplay__wrap {



    padding-bottom: 56.25%;



}



.videoplay__close {



    display: inline-block;



    width: 35px;



    height: 35px;



    position: absolute;



    top: -35px;



    right: 0;



    background: transparent;



    border: none;



    overflow: hidden;



    cursor: pointer;



    z-index: 2;



}



.videoplay__close:before,

.videoplay__close:after {



    content: '';



    width: 100%;



    height: 2px;



    position: absolute;



    top: 50%;



    left: 0;



    margin-top: -6px;



    background-color: #ffffff;



    border-radius: 5px;



}



.videoplay__close:before {



    transform: rotate(45deg);



}



.videoplay__close:after {



    transform: rotate(-45deg);



}



.videoplay__footer {



    position: absolute;



    bottom: -70px;



    left: 0;



    text-align: center;



    width: 100%;



}



.videoplay__purchase {



    display: inline-block;



    min-width: 240px;



    font-size: 16px;



    color: #ffffff;



    text-decoration: none;



    text-align: center;



    line-height: 2em;



    padding: 10px 12px;



    margin-top: 2px;



    background-color: #57C24C;



    border: none;



    border-radius: 3px;



    -moz-border-radius: 3px;



    -webkit-border-radius: 3px;



    -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out;



    -moz-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out;



    -o-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out;



    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out;



    cursor: pointer;



}



.videoplay__purchase:hover {



    color: #ffffff;



    background-color: #338a2a;



}