
/*-------- Menu --------*/

.menu {
    background-color: #000034 !important;
    padding: 10px 5px;
    font-family: Hind Madurai, Arial, sans-serif !important;
    position: sticky;
    top: 0;
    transition: all 1s;
    z-index: 99;
}

.menu .col {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    position: relative;
}

.menu img {
    width: 100%;
    height: 30px;
    object-fit: contain;
}

.menu .col:nth-of-type(2) {
    justify-content: space-between;
}

.menu .col:nth-of-type(2) svg {
    width: 30px;
    height: 30px;
}

.menu .col:nth-of-type(2) .cart-count {
    position: absolute;
    top: -3px;
    right: -3px;
    width: 20px;
    height: 20px;
    padding: 2px;
    font-size: .8em;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
}

.menu .col:nth-of-type(3) {
    display: block;
}

.menu input {
    background-color: white !important;
    color: #666 !important;
    padding-left: 1em !important;
    width: calc(100% - 1em) !important;
    border-radius: 10px !important;
    height: 39px !important;
    font-size: 1.25em !important;
    border: none !important;
}

.menu input::placeholder {
    color: #666;
}

.menu label {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    position: relative;
}

.menu label .fa-search {
    position: absolute;
    top: 0;
    right: 0;
    width: 45px !important;
    height: 39px;
    padding: 5px 1em;
    background-color: white;
    border-radius: 0 10px 10px 0;
}

.menu a p {
    display: block;
    font-size: 1em;
    display: flex;
    align-items: center;
    margin: 0;
}

.menu p svg {
    margin-left: 5px;
    width: 10px !important;
    height: 4px;
}

.menu .col:nth-of-type(2) a:last-child svg {
    margin-left: 10px;
}

.menu .col:nth-of-type(2) a:first-child svg {
    margin-right: 10px;
}

.menu a {
    display: flex;
    align-items: center;
}

.menu .destaque {
    transition: all 1s;
}

.destaque ul {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
    width: 100%;
    overflow: auto;
}

.destaque ul::-webkit-scrollbar {
    display: none;
}

.destaque .trigger {
    display: none;
}

.destaque a {
    color: #fff;
    padding: 5px .5em;
    font-size: .9em;
}

.whatsapp {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 999;
}

.whatsapp .btn-floating {
    width: 50px;
    height: 50px;
    background-color: #34af23 !important;
    padding: 0;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5em;
}

@media(min-width: 601px) {
    .menu .flex {
        display: flex;
        align-items: center;
        padding: 10px;
    }
}

@media(min-width: 993px) {
    .menu {
        padding: 10px 30px;
    }
    .menu .trigger {
        display: none;
    }
    .menu img {
        object-position: left;
    }
    .menu img,
    .menu input,
    .menu label svg {
        height: 50px !important;
    }
    .destaque .trigger {
        display: block;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: rgba(255, 255, 255, .2);
        border-radius: 10px;
        height: 2.4em;
        text-align: center;
        padding: 0 2em;
    }
    .destaque .trigger svg {
        width: 10px !important;
        height: 4px;
        margin-left: 5px;
        margin-right: 0 !important;
    }
}


/*-------- Menu Dropdown --------*/

.sections {
    display: none;
    top: 0;
    left: 0;
    z-index: 1;
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .5);
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.sections .estrutura {
    position: absolute;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    height: 0;
    overflow: hidden;
    width: calc(280px + 500px + 300px);
    transition: all 1s;
}

.sections .hover {
    display: flex;
    align-items: flex-start;
    flex-wrap: nowrap;
    transition: all .5s;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    display: none;
}

.sections .hover.active {
    -webkit-animation-name: hover;
    -webkit-animation-duration: .5s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-delay: 0.5s;
    -webkit-animation-fill-mode: forwards;
    animation-name: hover;
    animation-duration: .5s;
    animation-iteration-count: 1;
    animation-delay: 0.5s;
    animation-fill-mode: forwards;
    display: block;
}

@keyframes hover {
    0% {
        left: 0;
        opacity: 0;
    }
    100% {
        opacity: 1;
        left: 280px;
    }
}

.sections .categorias {
    position: relative;
    z-index: 1;
    float: left;
    background-color: white !important;
    padding: 5px 0;
    height: 420px;
    width: 280px;
}

.sections ul {
    margin: 0 !important;
}

.sections .categorias li {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    justify-content: space-between;
    padding: .572em 1.8em .572em 1.3em;
}

.sections .categorias a {
    width: 100% !important;
    font-size: .9em;
    color: #333;
}

.sections .categorias li:last-child a {
    color: #000034;
}

.sections .categorias svg {
    color: #666;
}

.subcategorias {
    position: absolute;
    top: 0;
    left: 0;
    background-color: white;
    width: 500px;
    height: 420px;
}

.subcategorias h2 {
    font-size: 1.5em;
    margin: 15px 0;
    font-family: Hind Madurai Bold, Arial, sans-serif !important;
}

.subcategorias h2 a {
    color: #000034 !important;
    text-decoration: underline;
}

.subcategorias li {
    padding: 3px 0;
    width: 100% !important;
    font-size: .9em;
}

.subcategorias li a {
    color: #666;
}

.subcategorias li:last-child a {
    color: #000034;
    display: flex;
    align-items: center;
}

.subcategorias li:last-child a svg {
    margin-left: 5px;
}

.estrutura .banner {
    position: absolute;
    top: 0;
    left: 500px;
    width: 300px;
    height: 420px;
    background-color: white;
}

.estrutura .banner img {
    width: 300px;
    height: 420px;
    object-fit: contain;
}


/*-------- Menu Mobile --------*/

.asidenav-action {
    float: left;
    width: auto !important;
}

.asidenav-action svg {
    width: 40px !important;
    height: 39px;
    background-color: rgba(0, 0, 0, 0.3);
    padding: 6px;
    border-radius: 5px;
    position: relative !important;
    top: -2px;
}

.menu-mobile {
    display: none;
    position: fixed;
    z-index: 9999;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.menu-mobile.active {
    display: block;
}

.menu-mobile .sidebar {
    width: 300px;
    height: 100vh;
    background-color: white;
    padding: 20px;
    padding-top: 30px;
    overflow-y: scroll;
    position: relative;
    transition: all .5s;
    transform: translateX(-100%);
}

.menu-mobile .sidebar.active {
    transform: translateX(0);
}

.menu-mobile .close {
    transition: all .5s;
    position: absolute;
    top: -100%;
    left: 280px;
    z-index: 1;
}

.menu-mobile .close.active {
    top: 0;
}

.menu-mobile .close svg {
    width: 40px !important;
    height: 40px;
    background-color: #000034;
    border: 5px solid white;
    border-radius: 50%;
    color: white;
    padding: 7px;
}

.menu-mobile .client {
    display: flex;
    justify-content: space-between;
}

.menu-mobile .client a {
    display: flex;
    align-items: center;
}

.menu-mobile .client svg {
    width: 40px !important;
    height: 40px;
    margin-right: 10px;
    color: #000034;
}

.menu-mobile .client div {
    position: relative;
}

.menu-mobile .client .cart-count {
    position: absolute;
    top: -3px;
    right: 2px;
    width: 20px;
    height: 20px;
    padding: 2px;
    font-size: .8em;
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    color: white;
}

.menu-mobile .client p {
    color: #8b8b8b;
    margin: 0;
    line-height: 1.1em;
}

.menu-mobile .client a:nth-of-type(2) {
    width: 100%;
    justify-content: flex-end;
}

.menu-mobile .client a:nth-of-type(2) p:nth-of-type(2) {
    font-size: 1.1em;
    font-weight: bold;
}

.menu-mobile hr {
    width: 85%;
    height: 1px;
    border: none;
    background-color: #d8d9da;
    margin: 1em auto;
}

.menu-mobile .order p {
    text-align: center;
    font-size: 1.15em;
    color: #777;
}

.menu-mobile .order input {
    background-color: white !important;
    color: #666 !important;
    padding-left: 1em !important;
    width: calc(100% - 1em) !important;
    border-radius: 10px !important;
    height: 39px !important;
    font-size: 1.25em !important;
    border: none !important;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .3) !important;
    -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .3) !important;
    -moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .3) !important;
    margin-bottom: 1em !important;
}

.menu-mobile .order input::placeholder {
    color: #9e9e9e;
}

.menu-mobile .order label {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    position: relative;
}

.menu-mobile .order label .fa-search {
    position: absolute;
    top: 0;
    right: 0;
    width: 45px !important;
    height: 39px;
    padding: 12px 1em;
    background-color: white;
    border-radius: 0 10px 10px 0;
    color: #000034;
}

.menu-mobile .links .collapsible {
    border: none;
    box-shadow: none;
}

.menu-mobile .links .collapsible-header {
    border: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    line-height: 1;
    padding: 0;
    outline: none !important;
}

.menu-mobile .links h2 {
    font-size: 1em;
    margin: 0;
    padding: .3em;
    font-weight: bold;
    color: #000034;
    font-size: 1.25em;
}

.menu-mobile .links .collapsible-body {
    border-bottom: none !important;
    padding: 0 !important;
    padding-left: 1em !important;
}

.menu-mobile .links li {
    padding: 2px 0;
}

.menu-mobile .links a {
    color: #777;
    font-size: 1.1em;
}

@media(min-width: 993px) {
    .asidenav-action {
        display: none !important;
    }
}


/*-------- Menu Scroll --------*/

.menu.scroll {
    width: 100% !important;
    z-index: 99;
}

.menu.scroll .flex {
    position: relative;
    z-index: 1;
    background-color: #000034;
}

.menu.scroll .destaque {
    margin-top: -50px;
}

.menu.scroll .destaque.active {
    margin-top: 0px;
}


/*-------- Modal Cookie --------*/

.cookie {
    font-family: Hind Madurai, Arial, sans-serif !important;
    position: fixed;
    left: 5%;
    right: auto;
    bottom: 10px;
    width: 90%;
    background-color: white;
    border-radius: 10px;
    padding: 15px;
    box-shadow: 0 0 5px 0px rgba(0, 0, 0, 0.3);
    z-index: 9999;
    transform: translateY(200%);
    opacity: 0;
    transition: all .5s;
}

.cookie.active {
    transform: translateY(0%);
    opacity: 1;
}

.cookie p {
    font-size: 1.25em;
    margin: 0;
    color: #666;
}

.cookie a {
    color: #000034;
}

.cookie .btn {
    width: 100%;
    background-color: transparent !important;
    border: 1px solid #000034;
    border-radius: 10px;
    box-shadow: none !important;
    height: 3em;
    line-height: 3em;
    text-transform: none;
    font-size: 1.25em;
    margin-top: 10px;
}

@media(min-width: 785px) {
    .cookie {
        display: flex;
        align-items: center;
        padding: 20px;
    }
    .cookie p {
        font-size: 1em;
        padding-right: 20px;
    }
    .cookie .btn {
        width: 300px;
        padding: 0 1em;
        font-size: 1em;
        margin-top: 0;
    }
}


/*-------- Modal Search --------*/

.searchBox {
    display: none;
    position: fixed;
    z-index: 99;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.3);
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.searchBox .search {
    position: fixed;
    z-index: 100;
    width: 100%;
    float: left;
}

.searchBox input {
    background-color: white !important;
    color: #666 !important;
    padding-left: 1em !important;
    width: calc(100% - 1em) !important;
    border-radius: 10px !important;
    height: 39px !important;
    font-size: 1.25em !important;
    border: none !important;
}

.searchBox input::placeholder {
    color: #666;
}

.searchBox label {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    position: relative;
}

.searchBox label .fa-search {
    position: absolute;
    top: 0;
    right: 0;
    width: 45px !important;
    height: 39px;
    padding: 5px 1em;
    background-color: white;
    border-radius: 0 10px 10px 0;
}

.searchBox .box {
    display: none;
    position: absolute;
    background-color: white;
    padding: 20px 5px;
}

.searchBox .l8 {
    border-left: 1px solid #e8e8e8;
    display: none;
}

.searchBox ul {
    margin-bottom: 0 !important;
}

.searchBox ul li {
    padding: .25em 0;
}

.searchBox ul li a {
    color: #a1a1a1;
}

.searchBox ul li a strong {
    color: #666;
}

.searchBox h2 {
    font-family: Hind Madurai Bold, Arial, sans-serif !important;
    font-size: 1.1em;
    margin: 0;
    font-weight: bold;
}

.searchBox img {
    width: 100%;
    height: 90px;
    object-fit: contain;
    margin-top: 40px;
}

.searchBox h3 {
    font-size: .8em;
    min-height: 40px;
}

.searchBox h4 {
    font-family: Hind Madurai Bold, Arial, sans-serif !important;
    font-size: 1.25em;
    margin: 0;
    font-weight: bold;
}

.searchBox p {
    margin: 0;
    color: #888;
}

@media(min-width: 993px) {
    .searchBox .m8 {
        display: block;
    }
    .searchBox input,
    .searchBox label svg {
        height: 50px !important;
    }
}


/*-------- Dropdown Conta --------*/

.dropConta {
    display: none;
    position: fixed;
    z-index: 99;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.3);
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.dropConta .box {
    opacity: 0;
    width: 100%;
    transition: all 1s;
    position: absolute;
    background-color: white;
    padding: 10px 15px;
    max-width: 200px;
    text-align: center;
}

.dropConta .btn {
    width: 100%;
    text-transform: none;
    box-shadow: none !important;
    height: 3em;
    line-height: 3em;
    border-radius: 5px;
}

.dropConta .btn:nth-of-type(1) {
    background-color: #000034 !important;
    font-size: .9em;
}

.dropConta .btn:nth-of-type(2) {
    background: #4267b2 !important;
    padding: 8px;
}

.dropConta .btn svg {
    width: 25px;
    height: 25px;
    fill: #fff;
    margin: 0;
    float: left;
}

.dropConta .btn span {
    font-size: .8em;
    margin-left: 10px;
    margin-top: -7px;
    float: left;
}

.dropConta .flex {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
}

.dropConta hr {
    width: 100%;
    height: 1px;
    background-color: #e8e8e8;
    border: none;
}

.dropConta .flex p {
    position: absolute;
    background-color: white;
    padding: 0 15px;
    color: #666;
}

.dropConta a:not(.btn) {
    margin: 10px 0;
    width: 100%;
    float: left;
    font-size: .9em;
    color: #666;
    font-size: .8em;
}

.dropConta a:not(.btn):hover {
    color: #000034;
}

.dropConta .col {
    border-top: 1px solid #e8e8e8;
}

.dropConta .col {
    padding: 0 !important;
}

.dropConta .col:nth-of-type(1) a {
    border-right: 1px solid #e8e8e8;
    width: 100%;
}

.dropConta .ponta {
    position: absolute;
    top: -15px;
    right: calc(200px / 2 - 15px);
    margin: 0 auto;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 15px 15px 15px;
    border-color: transparent transparent #fff transparent;
}


/*-------- Modal Endereço --------*/

.modalAddress {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    font-family: Hind Madurai, Arial, sans-serif !important;
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    background-color: rgba(0, 0, 0, .5);
    height: 0;
    overflow: hidden;
    opacity: 0;
    transition: all 1s;
}

.modalAddress.active {
    opacity: 1;
    height: 100%;
    overflow: auto;
    padding: 20px;
}

.modalAddress .close {
    position: absolute;
    top: 20px;
    right: 20px;
    color: #888;
    font-size: 1.25em;
}

.modalAddress article {
    position: relative;
    max-width: 450px;
    max-height: 80vh;
    overflow: auto;
    padding: 60px 40px;
    background-color: white;
    text-align: center;
    border-radius: 10px;
}

.modalAddress h2 {
    font-size: 1.5em;
    text-align: center;
    color: #000034;
    font-weight: bold;
    margin: 0;
}

.modalAddress p {
    font-size: 1em;
    line-height: 1.25em;
    text-align: center;
}

.modalAddress .btn {
    background-color: #000034 !important;
    box-shadow: none !important;
    font-weight: bold;
    margin-bottom: 10px;
    width: 100%;
    font-size: 1.1em;
    height: 50px;
    line-height: 50px;
}

.modalAddress .collapsible {
    box-shadow: none !important;
    border: none !important;
}

.modalAddress .collapsible-header {
    line-height: 1.5;
    padding: 0;
    background-color: transparent;
    border-bottom: none;
    outline: none !important;
}

.modalAddress .collapsible-body {
    border-bottom: none;
    padding: 0;
    margin-top: -20px;
}

.modalAddress h3 {
    font-size: 1.1em;
    margin: 0;
    width: 100%;
    font-weight: bold;
    color: #000034;
}

.modalAddress h3 svg {
    width: 100% !important;
    float: left;
    transition: all .5s;
}

.modalAddress .active h3 svg {
    transform: rotate(180deg);
}

.modalAddress label {
    display: flex;
    align-items: center;
    text-align: left;
    width: 100%;
    position: relative;
    margin-top: 40px;
}

.modalAddress label span span:nth-child(1) {
    width: 100%;
    max-width: 220px;
    float: left;
    font-size: 1.25em;
    font-weight: bold;
    color: #888;
    margin: 0;
    line-height: 1.25em;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.modalAddress label span span:nth-child(2) {
    width: 100%;
    max-width: 220px;
    float: left;
    margin: 0;
    line-height: 1.25em;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

.modalAddress label a {
    width: 50px;
    color: #000034;
    font-weight: bold;
    text-decoration: underline;
    font-size: 1.1em;
}

.modalAddress [type="radio"]:not(:checked)+span,
.modalAddress [type="radio"]:checked+span {
    margin-right: 20px;
}

.modalAddress [type="radio"]:not(:checked)+span:before,
.modalAddress [type="radio"]:not(:checked)+span:after {
    border: 1px solid #9e9e9e !important;
}

.modalAddress [type="radio"]:checked+span:after,
.modalAddress [type="radio"].with-gap:checked+span:before,
.modalAddress [type="radio"].with-gap:checked+span:after {
    border: 2px solid #000034;
}

.modalAddress [type="radio"]:checked+span:after,
.modalAddress [type="radio"].with-gap:checked+span:after {
    background-color: #000034;
}

.modalAddress [type="radio"]+span:before,
.modalAddress [type="radio"]+span:after {
    width: 20px;
    height: 20px;
    top: -3px;
}

@media(min-width: 601px) {
    .modalAddress label span span {
        max-width: 280px !important;
    }
    .modalAddress article::-webkit-scrollbar-track {
        background-color: #F4F4F4;
    }
    .modalAddress article::-webkit-scrollbar {
        width: 6px;
        background: #F4F4F4;
    }
    .modalAddress article::-webkit-scrollbar-thumb {
        background: #dad7d7;
    }
}


/*-------- Modal de Transporte --------*/

.modalSend {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    font-family: Hind Madurai, Arial, sans-serif !important;
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    background-color: rgba(0, 0, 0, .5);
    height: 0;
    overflow: hidden;
    opacity: 0;
    transition: all 1s;
}

.modalSend.active {
    opacity: 1;
    height: 100%;
    overflow: auto;
    padding: 20px;
}

.modalSend .close {
    position: absolute;
    top: 20px;
    right: 20px;
    color: #888;
    font-size: 1.25em;
}

.modalSend article {
    position: relative;
    width: 100%;
    max-width: 500px;
    max-height: 80vh;
    overflow: auto;
    padding: 40px;
    padding-bottom: 20px;
    background-color: white;
    text-align: center;
    border-radius: 10px;
}

.modalSend h2 {
    font-size: 1.25em;
    text-align: center;
    color: #000034;
    font-weight: bold;
    margin: 0;
}

.modalSend h2 svg {
    width: 100% !important;
    float: left;
    margin-bottom: 10px;
    font-size: 1.25em;
}

.modalSend h3 {
    text-transform: uppercase;
    font-size: 1.25em;
    margin: 0;
    margin-top: 5px;
    font-weight: bold;
    text-decoration: underline;
}

.modalSend hr {
    width: 90%;
    height: 1px;
    background-color: #ccc;
    border: none;
    margin: 20px auto;
}

.modalSend h2:nth-of-type(2) {
    text-align: left;
}

.modalSend h2:nth-of-type(2) svg {
    font-size: 2em;
    margin-bottom: 30px;
}

.modalSend p {
    font-size: 1em;
    line-height: 1.25em;
    text-align: left;
    margin: 0;
    color: #666;
}

.modalSend .collapsible {
    box-shadow: none !important;
    border: none !important;
}

.modalSend .collapsible-header {
    margin-top: 30px;
    line-height: 1.5;
    padding: 0;
    background-color: transparent;
    border-bottom: none;
    outline: none !important;
}

.modalSend .collapsible-body {
    border-bottom: none;
    text-align: left;
    padding: 0 !important;
    margin-bottom: 10px !important;
}

.modalSend h4 {
    font-size: 1.1em;
    margin: 0;
    width: 100%;
    font-weight: bold;
    color: #000034;
}

.modalSend h4 svg {
    width: 100% !important;
    float: left;
    transition: all .5s;
}

.modalSend .active h4 svg {
    transform: rotate(180deg);
}

.modalSend h5 {
    font-size: 1.30em;
    font-weight: bold;
    color: #666;
    padding: 10px 0;
}

.modalSend .collapsible-body ul li {
    padding: 20px 0;
    padding-top: 0;
    padding-left: 30px;
    position: relative;
    width: 100%;
    float: left;
}

.modalSend .collapsible-body ul li::before {
    content: '';
    width: 2px;
    height: 100%;
    background-color: #5bc0de;
    position: absolute;
    left: 4px;
    top: 0;
}

.modalSend .collapsible-body .success::before {
    background-color: #40cd28;
}

.modalSend .collapsible-body .error::before {
    background-color: #f1c400;
}

.modalSend h6 {
    font-size: 1em;
    font-weight: bold;
    margin-top: 0;
    position: relative;
}

.modalSend .success h6 {
    color: #40cd28;
}

.modalSend .error h6 {
    color: #FF9800;
}

.modalSend h6::before {
    content: '';
    width: 20px;
    height: 20px;
    background-color: #5bc0de;
    border-radius: 50%;
    position: absolute;
    top: -3px;
    left: -35px;
}

.modalSend h6::after {
    content: '';
    width: 10px;
    height: 10px;
    background-color: #fff;
    border-radius: 50%;
    position: absolute;
    top: 2px;
    left: calc(-35px + 5px);
}

.modalSend .success h6::before {
    background-color: #40cd28;
    transform: scale(1.5);
}

.modalSend .success h6::after {
    transform: scale(1.3);
}

.modalSend .error h6::before {
    background-color: #f1c400;
}

.modalSend .collapsible-body li p:first-of-type {
    width: 80px;
    float: left;
    margin: 0;
    margin-right: 20px;
    color: #999;
    font-size: .9em;
}

.modalSend .collapsible-body li p:last-of-type {
    width: calc(100% - 100px);
    float: left;
    font-weight: bold;
    color: #999;
    font-size: .9em;
}

.modalSend .collapsible-body li:first-of-type p {
    color: #666;
}

@media(min-width: 601px) {
    .modalSend article::-webkit-scrollbar-track {
        background-color: #F4F4F4;
    }
    .modalSend article::-webkit-scrollbar {
        width: 6px;
        background: #F4F4F4;
    }
    .modalSend article::-webkit-scrollbar-thumb {
        background: #dad7d7;
    }
}


/*-------- Modal Carrinho no Pagamento --------*/

.modalCart {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    font-family: Hind Madurai, Arial, sans-serif !important;
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    background-color: rgba(0, 0, 0, .5);
    height: 0;
    overflow: hidden;
    opacity: 0;
    transition: all 1s;
}

.modalCart.active {
    opacity: 1;
    height: 100%;
    overflow: auto;
    padding: 20px;
}

.modalCart .close {
    position: absolute;
    top: 20px;
    right: 20px;
    color: #888;
    font-size: 1.25em;
}

.modalCart article {
    position: relative;
    width: 100%;
    max-width: 900px;
    max-height: 80vh;
    overflow: auto;
    padding: 40px;
    background-color: white;
    text-align: center;
    border-radius: 10px;
}

.modalCart h2 {
    font-size: 1.5em;
    text-align: left;
    color: #343434;
    font-weight: bold;
    margin: 0;
}

.modalCart table {
    padding: 20px;
    margin-top: 20px;
}

.modalCart .responsive-table tbody {
    white-space: normal !important;
    display: flex;
}

.modalCart tbody td:first-child {
    display: flex;
    align-items: center;
}

.modalCart tbody tr {
    min-width: 100% !important;
    margin-right: 30px;
}

.modalCart img {
    width: 90px;
    height: 90px;
    object-fit: contain;
    margin-right: 10px;
}

.modalCart table h2,
.modalCart table h3,
.modalCart table h4 {
    font-size: 1em;
    color: #666;
    margin: 5px 0;
}

.modalCart tbody td:nth-of-type(2),
.modalCart tbody td:nth-of-type(3) {
    width: calc(100% / 2);
    float: left;
    text-align: center;
}

.modalCart td {
    padding: 0;
}

.modalCart tbody td:nth-of-type(2) {
    font-size: 1em;
    height: 40px;
    line-height: 40px;
}

.modalCart tbody td:nth-of-type(3) {
    font-size: 1.25em;
    font-weight: bold;
    height: 40px;
    line-height: 40px;
}

@media(min-width: 601px) {
    .modalCart tbody tr {
        min-width: calc(50% - 15px) !important;
    }
}

@media(min-width: 993px) {
    .modalCart img {
        margin-right: 50px;
        margin-left: 20px;
    }
    .modalCart .responsive-table tbody {
        display: table-row-group;
    }
    .modalCart tbody td:nth-of-type(2),
    .modalCart tbody td:nth-of-type(3) {
        width: inherit;
        float: none;
        text-align: center;
    }
}


/*-------- Modal de Troca de Senha --------*/

.modalPass {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    font-family: Hind Madurai, Arial, sans-serif !important;
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    background-color: rgba(0, 0, 0, .5);
    height: 0;
    overflow: hidden;
    opacity: 0;
    transition: all 1s;
}

.modalPass.active {
    opacity: 1;
    height: 100%;
    overflow: auto;
    padding: 20px;
}

.modalPass .close {
    position: absolute;
    top: 20px;
    right: 20px;
    color: #888;
    font-size: 1.25em;
}

.modalPass fieldset {
    position: relative;
    max-width: 500px;
    overflow: auto;
    padding: 60px 40px !important;
    background-color: white;
    border-radius: 10px;
}

.modalPass h2 {
    font-size: 1.5em;
    text-align: center;
    color: #000034;
    font-weight: bold;
    margin: 0;
    text-align: center;
}

.modalPass p {
    margin-top: 5px;
    padding: 0 40px;
    font-size: 1em;
    line-height: 1.25em;
    text-align: center;
    text-align: center;
}

.modalPass label {
    margin-top: 10px;
    float: left;
    width: 100%;
    position: relative;
    color: #666;
    font-size: .9em;
}

.modalPass input {
    background-color: #fff !important;
    padding-left: 1em !important;
    width: calc(100% - 1em) !important;
    color: #232323 !important;
    font-family: Hind Madurai, Arial, sans-serif !important;
    font-size: 1em !important;
    border-radius: 10px !important;
    border: 1px solid #9e9e9e !important;
    margin: 0 !important;
    height: 40px !important;
}

.modalPass input:focus {
    box-shadow: none !important;
}

.modalPass input::placeholder {
    font-family: Hind Madurai, Arial, sans-serif !important;
    color: #9e9e9e;
}

.modalPass .eyes {
    position: absolute;
    bottom: 5px;
    right: 0px;
    background-color: transparent;
    border: 0;
}

.modalPass .eyes svg {
    width: 30px !important;
    height: 30px;
    padding: 2px;
    color: #666;
}

.modalPass .btn {
    background-color: #000034 !important;
    box-shadow: none !important;
    font-weight: bold;
    margin-top: 20px;
    width: 100%;
    font-size: 1.1em;
    height: 50px;
    line-height: 50px;
    font-family: Hind Madurai, Arial, sans-serif !important;
}


/*-------- Modal Contato --------*/

.modalContact {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    font-family: Hind Madurai, Arial, sans-serif !important;
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    background-color: rgba(0, 0, 0, .5);
    height: 0;
    overflow: hidden;
    opacity: 0;
    transition: all 1s;
}

.modalContact.active {
    opacity: 1;
    height: 100%;
    overflow: auto;
    padding: 20px;
}

.modalContact a:not(.btn).close {
    position: absolute;
    top: -35px;
    right: 20px;
    color: #fff;
    font-size: 1.25em;
}

.modalContact fieldset {
    position: relative;
    max-width: 900px;
    max-height: 80vh;
    overflow: auto;
    background-color: white;
    border-radius: 10px;
    border-top: 50px solid #000034 !important;
}

.modalContact .col {
    padding: 40px !important;
}

.modalContact article.col {
    padding-bottom: 0 !important;
}

.modalContact h2 {
    font-size: 1.55em;
    color: #000034;
    font-weight: bold;
    margin: 0;
    position: relative;
    max-width: 170px;
    margin-bottom: 20px;
}

.modalContact h2::before {
    content: '';
    position: absolute;
    width: 150px;
    height: 2px;
    background-color: #000034;
    bottom: -5px;
    left: 0;
}

.modalContact h3 {
    font-size: 1.25em;
    color: #000034;
    font-weight: bold;
    margin: 0;
    margin-bottom: 10px;
}

.modalContact p {
    font-size: 1em;
    line-height: 1.25em;
    margin: 0;
}

.modalContact li a {
    color: #666;
}

.modalContact input {
    background-color: white !important;
    color: #000034 !important;
    padding-left: 1em !important;
    width: calc(100% - 1em) !important;
    border-radius: 0px !important;
    height: 39px !important;
    font-size: 1.25em !important;
    border-bottom: 1px solid #000034 !important;
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.modalContact input:focus {
    box-shadow: none !important;
}

.modalContact input::placeholder {
    color: #000034;
    font-weight: bold;
}

.modalContact textarea {
    background-color: white !important;
    color: #000034 !important;
    padding: 1em !important;
    width: 100% !important;
    border-radius: 0px !important;
    height: 6em !important;
    resize: none;
    font-size: 1.25em !important;
    border: none !important;
    border-bottom: 1px solid #000034 !important;
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.modalContact textarea:focus {
    box-shadow: none !important;
}

.modalContact textarea::placeholder {
    color: #000034;
    font-weight: bold;
}

.modalContact .center a.btn {
    background-color: #fff !important;
    border: 1px solid #000034;
    border-radius: 5px !important;
    color: #000034;
    font-weight: bold;
    box-shadow: none;
    margin-top: 10px;
    width: 120px;
}

.modalContact .center button.btn {
    background-color: #000034 !important;
    border-radius: 5px !important;
    color: #fff;
    font-weight: bold;
    box-shadow: none;
    margin-top: 10px;
    font-family: Hind Madurai, Arial, sans-serif !important;
    width: 120px;
}

.modalContact .center {
    display: flex;
    justify-content: space-between;
}


/*-------- Banner --------*/

.banner-destaque {
    padding: 20px 5%;
}

.banner-destaque img {
    width: 100%;
    height: auto;
}

.mini-banners {
    padding: 20px 5%;
    margin-top: 2em;
}

.mini-banners img {
    width: 100%;
    height: auto;
    margin-top: 1em;
}


/*-------- Info --------*/

.info {
    font-family: Hind Madurai, Arial, sans-serif !important;
    padding: 0 10px;
    display: flex;
    align-items: center;
}

.info strong {
    font-family: Hind Madurai Bold, Arial, sans-serif !important;
    color: black;
}

.info svg {
    color: #000034;
    font-size: 2em;
    float: left;
    width: 100% !important;
}

.info p {
    color: #666;
    font-size: .9em;
    width: 100% !important;
    float: left;
    line-height: 1.25em;
}

.info article {
    width: 100%;
}

@media(min-width: 601px) {
    .info svg {
        width: 30px !important;
        margin-right: 10px;
    }
    .info article {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .info p {
        margin: 0;
        width: fit-content !important;
    }
}

@media(min-width: 993px) {
    .info {
        justify-content: center;
    }
    .info article {
        width: fit-content !important;
        margin-right: 50px;
    }
    .info p {
        font-size: 1.25em;
    }
    .info svg {
        width: 20px;
        height: 20px;
    }
}


/*-------- Product --------*/

.product {
    font-family: Hind Madurai, Arial, sans-serif !important;
    padding: 20px;
}

.product h2 {
    font-size: 1.25em;
    line-height: 1.5em;
    color: #777;
    margin-bottom: 0;
}

.product hr {
    width: 150px;
    height: 2px;
    border: none;
    background-color: #000034;
    margin-bottom: 2em;
    float: left;
}

.product strong {
    font-family: Hind Madurai Bold, Arial, sans-serif !important;
    color: black;
    float: left;
    width: 100%;
    font-size: 1.5em;
}

.product .owl-carousel {
    z-index: 0 !important;
}

.product .owl-item {
    padding: 10px;
    max-width: 70% !important;
}

.product .item {
    width: 100%;
    float: left;
    color: #333 !important;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .3) !important;
    -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .3) !important;
    -moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .3) !important;
    padding: 20px 15px;
}

.product img {
    width: 100%;
    height: 190px;
    object-fit: contain;
}

.product h3 {
    font-size: 1.15em;
    min-height: 70px;
}

.product h4 {
    font-family: Hind Madurai Bold, Arial, sans-serif !important;
    font-size: 2em;
    margin: 0;
    font-weight: bold;
}

.product h5 {
    font-size: 1em;
    margin: 0;
    text-decoration: line-through;
}

.product p {
    margin: 0;
    color: #888;
}

.product .owl-nav button {
    position: absolute;
    top: calc(50% - 25px);
    width: 50px;
    height: 50px;
    border: 4px solid white;
    background-color: #000034;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .3) !important;
    -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .3) !important;
    -moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .3) !important;
    border-radius: 50%;
    color: white;
    transition: all .5s;
    font-size: 2em;
}

.product .owl-next {
    right: -15px;
    padding-left: 10px;
}

.product .owl-prev {
    left: -15px;
    padding-right: 10px;
}

.product .owl-prev.disabled {
    transform: scale(0);
}

.product .owl-next.disabled {
    transform: scale(0);
}

.product .owl-dots {
    display: none;
}

@media(min-width: 601px) {
    .product {
        padding: 3%;
    }
    .product h2 {
        text-align: center;
    }
    .product h3 {
        font-size: 1em;
    }
    .product hr {
        float: none;
    }
}


/*-------- Head Produtos por Categoria --------*/

.headCategoria {
    font-family: Hind Madurai, Arial, sans-serif !important;
    background-color: #F6F6F6;
}

.headCategoria header {
    padding: 20px;
    padding-bottom: 40px;
    background-color: white;
}

.headCategoria h1 {
    font-size: 1.5em;
    text-transform: uppercase;
    font-family: Hind Madurai Bold, Arial, sans-serif !important;
    line-height: 1.5em;
    color: #777;
    margin: 0;
    background-color: white;
}

.headCategoria hr {
    width: 120px;
    height: 2px;
    border: none;
    background-color: #000034;
    margin-bottom: 2em;
    float: left;
    margin: 0;
}

.headCategoria .controllers {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
}

.headCategoria .controllers h2 {
    font-size: 1em;
    color: #999;
    margin: 0;
}

.headCategoria .controllers .buttons a {
    font-size: 1.25em;
    padding: 8px 10px;
    background-color: #D8D8D8;
    color: #666;
    text-align: center;
    line-height: 1em;
    transition: all .5s;
}

.headCategoria .controllers .buttons a:first-child {
    border-radius: 10px 0 0 10px;
}

.headCategoria .controllers .buttons a:nth-of-type(3) {
    border-radius: 0 10px 10px 0;
}

.headCategoria .controllers .buttons a:last-child {
    background-color: transparent;
}

.headCategoria .controllers .buttons a.active {
    background-color: #000034;
    color: white;
}

@media(min-width: 993px) {
    .headCategoria {
        display: none;
    }
}


/*-------- Produtos por Categoria --------*/

.productCategoria {
    font-family: Hind Madurai, Arial, sans-serif !important;
    background-color: #F6F6F6;
    padding: 10px;
    padding-top: 0;
}

.productCategoria header {
    display: none;
}

.productCategoria .item {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    margin-top: 5px;
    padding: 10px !important;
    background-color: white;
    position: relative;
}

.productCategoria.bloco .item {
    display: block;
    margin-top: 5px !important;
    background-color: transparent;
}

.productCategoria.full .item {
    display: block;
    margin-top: 5px !important;
}

.productCategoria.bloco .col {
    padding: 5px !important;
}

.productCategoria img {
    width: 200px;
    height: 200px;
    object-fit: contain;
    background-color: white;
    margin-bottom: -7px;
}

.productCategoria.bloco img {
    width: 100%;
}

.productCategoria.full img {
    width: 100%;
    height: 400px;
}

.productCategoria .box {
    width: 100%;
    padding: 10px;
    background-color: white;
}

.productCategoria.bloco .box {
    min-height: 150px;
}

.productCategoria h3 {
    font-size: 1.1em;
    margin: 0;
    color: #333;
    padding-bottom: 5px;
}

.productCategoria.bloco h3 {
    min-height: 50px;
}

.productCategoria .estrelas {
    padding-bottom: 5px;
}

.productCategoria .estrelas svg {
    color: #FF9800;
}

.productCategoria h4 {
    font-size: 2em;
    margin: 0;
    color: #000;
    font-weight: bold;
}

.productCategoria h4.promo {
    font-size: 1em;
    margin: 0;
    text-decoration: line-through;
    color: #999;
    font-weight: normal;
}

.productCategoria h5 {
    font-size: 1.5em;
    margin: 0;
    text-transform: uppercase;
    padding-bottom: 5px;
    color: #04D483;
}

.productCategoria p {
    margin: 0;
    font-size: .9em;
    color: #666;
}

.productCategoria .favorite {
    position: absolute;
    top: 15px;
    right: 15px;
    padding: 0 !important;
}

.productCategoria button.favorite {
    border: none;
    padding: 0;
    background-color: transparent;
}

.productCategoria .favorite svg {
    width: 25px !important;
    height: 25px;
    background-color: #000034;
    color: white;
    padding: 7px;
    border-radius: 50%;
    opacity: .7;
}

.productCategoria button.favorite svg path {
    fill: #fff;
}

.productCategoria .controllers {
    display: none;
}

.productCategoria .paginator {
    width: 100% !important;
    float: left;
    display: flex;
    justify-content: center;
    text-align: center;
    font-family: 'Open Sans', Tahoma, Geneva, Verdana, sans-serif;
}

.productCategoria .paginator_item {
    width: 30px;
    height: 30px;
    border: 1px solid #000034;
    color: #000034;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 5px;
}

.productCategoria .paginator_item.paginator_active {
    width: 30px !important;
    height: 30px !important;
    border: 1px solid #000034;
    color: #fff !important;
    background-color: #000034;
    border-radius: 50% !important;
}

.productCategoria .paginator_item:first-of-type,
.productCategoria .paginator_item:last-of-type {
    width: initial;
    height: initial;
    color: #000034;
    border: none;
    border-radius: 0;
    border-bottom: 1px solid #000034;
}

@media(min-width: 993px) {
    .productCategoria .item {
        display: block;
        margin-top: 5px !important;
        background-color: transparent;
    }
    .productCategoria .col {
        padding: 5px !important;
    }
    .productCategoria img {
        width: 100%;
        height: 250px;
    }
    .productCategoria .box {
        min-height: 160px !important;
    }
    .productCategoria header {
        display: block;
        padding: 10px;
    }
    .productCategoria h2 {
        font-size: 2em;
        text-transform: uppercase;
        font-family: Hind Madurai Bold, Arial, sans-serif !important;
        line-height: 1.5em;
        color: #777;
        margin: 0;
    }
    .productCategoria hr {
        width: 120px;
        height: 2px;
        border: none;
        background-color: #000034;
        margin-bottom: 2em;
        float: left;
        margin: 0;
    }
    .productCategoria #continuarLendo {
        color: #000034;
        text-decoration: underline;
    }
    .productCategoria header p {
        font-size: 1em;
        margin-top: 1em;
    }
    .productCategoria .controllers {
        display: block;
        width: 100%;
        padding: 0 10px;
    }
    .productCategoria .controllers label {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        width: 100%;
        color: #000;
    }
    .productCategoria .controllers select {
        width: 150px !important;
        margin-left: 10px;
        border: 1px solid #999;
        padding: 5px !important;
        height: 40px;
        border-radius: 5px;
    }
}


/*-------- Filtros da Categoria --------*/

.filters {
    position: fixed !important;
    top: 0 !important;
    left: 100% !important;
    margin: 0 !important;
    width: 100%;
    min-height: 100vh !important;
    overflow: auto;
    z-index: 9999;
    background-color: white;
    padding: 90px 40px !important;
    font-family: Hind Madurai, Arial, sans-serif !important;
    transition: all .5s;
}

.filters.active {
    left: 0 !important;
    height: 100vh !important;
}

.filters h2 {
    background-color: #000;
    margin: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 70px;
    text-align: center;
    color: white;
    font-size: 2em;
    line-height: 70px;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
}

.filters h2 a {
    position: absolute;
    left: 20px;
    font-size: .9em;
    color: #666;
}

.filters h3 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 1.1em;
    color: #666;
}

.filters h3 a {
    color: #000;
    text-decoration: underline;
}

.filters .deleteFilter {
    width: 100%;
    float: left;
    padding: 5px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #000034;
    font-size: 1.25em;
}

.filters .collapsible {
    box-shadow: none;
    border: none;
    margin-top: 30px;
    transition: all 1s;
}

.filters .collapsible li {
    margin-top: 10px;
}

.filters .collapsible-header h3 {
    color: #333;
}

.filters .collapsible-header strong {
    margin-left: 5px;
    color: #000034;
}

.filters .active .collapsible-header {
    background-color: #000034;
    outline: none !important;
}

.filters .collapsible-header {
    display: flex;
    align-items: center;
    padding: 15px 20px;
    border: none;
    outline: none !important;
    background-color: #F3F3F3;
}

.filters .active .collapsible-header {
    background-color: #000034;
    color: white;
}

.filters .active .collapsible-header h3,
.filters .active .collapsible-header strong {
    color: currentColor;
}

.filters .collapsible-header {
    width: 100%;
    margin: 0;
    font-size: 1em;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.filters .collapsible-header h3 svg {
    margin-left: 5px;
}

.filters .collapsible-body {
    padding: 20px;
    border: none;
    height: 200px;
    overflow: auto;
}

.filters fieldset label {
    border: 1px solid #ccc !important;
    border-radius: 5px;
}

.filters input {
    background-color: white !important;
    color: #666 !important;
    padding-left: 1em !important;
    width: calc(100% - 1em) !important;
    border-radius: 10px !important;
    height: 39px !important;
    font-size: 1.25em !important;
    border: none !important;
    margin: 0 !important;
}

.filters input:focus {
    box-shadow: none !important;
}

.filters input::placeholder {
    color: #666;
}

.filters label {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    position: relative;
}

.filters label .fa-search {
    position: absolute;
    top: 0;
    right: 0;
    width: 45px !important;
    height: 39px;
    padding: 12px 1em;
    background-color: white;
    border-radius: 0 10px 10px 0;
}

.filters [type="checkbox"].filled-in:checked+span:not(.lever):after {
    background-color: #000034 !important;
    border-color: #000034 !important;
}

.filters [type="checkbox"].filled-in:not(:checked)+span:not(.lever):after {
    border: 1px solid #ccc !important;
}

.filters label span {
    text-transform: capitalize;
}

.filters.active .applyFilters {
    position: fixed !important;
    bottom: 0;
    left: 100%;
    width: 100%;
    height: 70px;
    padding: 10px 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: white;
    transition: all .5s;
}

.filters.active .applyFilters {
    left: 0;
}

.filters .applyFilters .btn {
    box-shadow: none;
    font-size: 1.1em;
    width: 100%;
    height: 50px;
    line-height: 50px;
    background-color: #000034 !important;
    border-radius: 5px;
    font-weight: bold;
}

.filters .applyFilters .btn.disabled {
    background-color: #ccc !important;
    color: #fff;
}

@media(min-width: 993px) {
    .productCategoria .filters {
        position: relative !important;
        z-index: 0;
        padding: 20px 40px !important;
        left: 0 !important;
    }
    .filters .collapsible-body::-webkit-scrollbar-track {
        background-color: #F4F4F4;
    }
    .filters .collapsible-body::-webkit-scrollbar {
        width: 6px;
        background: #F4F4F4;
    }
    .filters .collapsible-body::-webkit-scrollbar-thumb {
        background: #dad7d7;
    }
    .filters h3,
    .filters .deleteFilter {
        font-size: .9em;
    }
    .filters h2,
    .filters .orderBy {
        display: none;
    }
}


/*-------- Breadcrumbs --------*/

.breadcrumbs {
    padding: 10px 0;
    font-family: Hind Madurai, Arial, sans-serif !important;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.breadcrumbs ul a {
    color: #999 !important;
    padding: 0 !important;
    text-transform: uppercase;
    font-weight: bold;
    font-size: .9em;
    background-color: #fff !important;
}

.breadcrumbs ul li:first-child a:before {
    content: "";
    padding: 0;
}

.breadcrumbs a:before {
    content: "\f101";
    font-weight: 400;
    font-family: 'Font Awesome 5 Pro';
    padding: 0px 5px;
    font-size: .8em;
}


/*-------- Detalhes --------*/

.details {
    padding: 5%;
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.details img {
    width: 100%;
    height: 500px;
    object-fit: contain;
}

.details .m6:first-child {
    position: relative;
}

.details .featured img {
    cursor: zoom-in;
}

.details .owl-carousel {
    display: flex;
    justify-content: center;
    max-width: calc(70px * 4);
    margin: 0 auto;
}

.details .owl-carousel .item {
    width: calc(100% / 4) !important;
    max-width: 70px;
    margin: 0 5px !important;
    border: 1px solid #ccc;
    cursor: pointer;
}

.details .owl-carousel img {
    width: 100% !important;
    padding: 5px;
    height: 60px;
    object-fit: contain;
}

.details .owl-carousel .owl-item .item {
    width: auto !important;
    margin: 0 !important;
}

.details .owl-dots {
    display: none;
}

.details .owl-nav button {
    position: absolute;
    width: 62px;
    height: 62px;
    font-size: 2.5em;
    color: #000034;
    border: none;
    background-color: white !important;
}

.details .owl-next {
    top: 0;
    right: -70px;
}

.details .owl-prev {
    top: 0;
    left: -70px;
}

.details h1 {
    font-size: 2em;
    font-weight: bold;
    margin: 0;
}

.details h2 {
    font-size: 2em;
    font-weight: bold;
    color: #000034;
    margin: 0;
}

.details h3 {
    font-size: 1.5em;
    color: #343434;
    margin: 5px 0;
}

.details h4 {
    font-size: 1em;
    color: #343434;
    margin: 0;
}

.details h5 {
    color: rgb(185, 184, 184);
    font-size: 1.25em;
    text-decoration: line-through;
    margin: 0;
    margin-top: 20px;
}

.details h6 {
    background-color: #468847;
    color: white;
    width: fit-content;
    font-size: .9em;
    padding: 2px 10px;
    border-radius: 10px;
}

.details p {
    color: #777;
    text-transform: uppercase;
    font-size: .8em;
    margin: 0;
    margin-top: 10px;
    margin-bottom: 5px;
}

.details ul {
    display: flex;
    margin: 0 !important;
}

.details [type="radio"]+span:before,
.details [type="radio"]+span:after {
    display: none;
}

.details .color figure {
    border: 1px solid #ccc;
    padding: 2px;
    margin-right: 5px !important;
    border-radius: 5px;
    cursor: pointer;
    transition: all .5s;
}

.details .color li:first-child figure {
    border: 1px solid #000034;
}

.details .color:hover li figure {
    border: 1px solid #ccc;
}

.details .color li:hover figure {
    border: 1px solid #000034;
}

.details .color img {
    width: 70px;
    height: 50px;
    object-fit: contain;
}

.details .color figcaption {
    display: block !important;
    text-align: center;
    font-size: .8em;
    color: #000;
}

.details .size div {
    border: 1px solid #ccc;
    color: #333;
    text-align: center;
    border-radius: 5px;
    font-weight: bold;
    margin-right: 5px;
    cursor: pointer;
    transition: all .5s;
    padding: 5px;
}

.details .size .checked div {
    border: 1px solid #000034;
    color: #000034;
}

.details .size:hover div {
    border: 1px solid #ccc;
    color: #333;
}

.details .size div:hover {
    border: 1px solid #000034;
    color: #000034;
}

.details a[href="#GuiadeMedidas"] {
    background-color: #fff !important;
    border: 1px solid #000034;
    border-radius: 5px !important;
    color: #000034;
    font-weight: bold;
    box-shadow: none;
    margin-top: 15px;
}

.details label[for="amount"] {
    display: flex;
    width: 0px;
    opacity: 0;
    height: 50px;
    position: relative;
    border: 1px inset #777;
    border-radius: 5px;
    transition: all 0.5s;
}

.details label[for="amount"].active {
    width: 90px;
    margin-right: 10px;
    opacity: 1;
}

.details label[for="amount"] input {
    height: 50px !important;
    text-align: center;
    margin: 0 !important;
    padding: 0 !important;
    width: calc(100% - 30px) !important;
    border: none !important;
    padding: 0 5px !important;
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.details label[for="amount"] input:focus {
    border: none !important;
    box-shadow: none !important;
}

.details label[for="amount"] button {
    width: 25px;
    padding: 0;
    height: 24px;
    position: absolute;
    border: none;
    background-color: #777;
    color: white;
    margin: 0;
}

.details label[for="amount"] .plus {
    top: -1px;
    right: -1px;
    border-radius: 0 5px 0 0;
}

.details label[for="amount"] .minus {
    bottom: -1px;
    right: -1px;
    border-radius: 0 0 5px 0;
}

.details .flex {
    display: flex;
    margin-top: 10px;
}

.details .flex .btn {
    width: 100% !important;
    height: 50px !important;
    background-color: #40cd28 !important;
    box-shadow: none !important;
    border-radius: 40px;
    font-weight: bold;
    font-size: 1.1em;
    color: white !important;
    line-height: 50px !important;
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.details .flex .btn.disabled {
    opacity: .5;
}

.details .favorite {
    padding: 0 !important;
}

.details .favorite svg {
    width: 50px;
    background-color: #e0e0e0;
    height: 50px;
    padding: 15px;
    text-align: center;
    border-radius: 50%;
    margin-left: 10px;
    color: #333;
}

.details small {
    width: 100%;
    float: left;
    text-align: center;
    font-size: .8em;
    margin-top: 3px;
}


/*-------- Frete --------*/

.frete {
    padding: 20px !important;
}

.frete form {
    display: flex;
    align-items: center;
    max-width: 250px;
    margin: 0 auto;
}

.frete label {
    width: 100%;
    font-size: 1em;
    color: #666;
    margin-right: 10px;
}

.frete input {
    margin: 0 !important;
    height: 40px !important;
    padding-left: 10px !important;
    width: calc(90% - 10px) !important;
    border: 1px solid #ccc !important;
    color: #999;
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.frete input:focus {
    box-shadow: none !important;
}

.frete input::placeholder {
    color: #999;
}

.frete .btn {
    width: 120px;
    padding: 0;
    height: 42px;
    box-shadow: none !important;
    border-radius: 0;
    background-color: #000;
    font-family: Hind Madurai, Arial, sans-serif !important;
    font-weight: bold;
}

.frete table {
    margin: 0 auto;
    margin-top: 2em;
    max-width: 450px;
}

.frete tbody {
    border: 1px solid #ccc;
}

.frete tbody td {
    padding: 10px !important;
    font-size: 1em;
}

.frete tbody tr td:nth-child(1) {
    color: #666;
}

.frete tbody tr td:nth-child(2) {
    font-weight: bold;
}

.frete tfoot tr {
    border: none !important;
}

.frete tfoot td {
    padding: 5px 0px;
    font-size: .7em;
}


/*-------- Descrição do Produto --------*/

.content {
    padding: 5%;
    padding-bottom: 0;
    width: 100%;
    float: left;
}

.content h2 {
    font-size: 1.5em;
    text-transform: uppercase;
    margin-bottom: 1em;
}

.content h3 {
    font-size: 1.25em;
    font-weight: bold;
    margin: 20px 0;
}

.content h4,
.content h5,
.content h6 {
    font-size: 1.1em;
    text-transform: uppercase;
    margin: 20px 0;
}

.content p {
    font-size: 1em;
    line-height: 1.5em;
    text-transform: none;
    color: #777;
}

.content ul {
    display: block;
    color: #777;
}

.content iframe{
    width: 100%;
    height: 500px;
}


/*-------- Compartilhar --------*/

.buttonShare {
    background-color: #000034;
    color: white;
    font-family: Hind Madurai, Arial, sans-serif !important;
    font-weight: bold;
    position: absolute;
    top: 10px;
    left: 20px;
    width: 50px;
    height: 50px;
    text-align: center;
    line-height: 54px;
    font-size: 1.25em;
    border-radius: 50%;
}

.share {
    font-family: Hind Madurai, Arial, sans-serif !important;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
    background-color: rgba(0, 0, 0, .3);
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    transform: scale(0);
    opacity: 0;
    transition: all .5s;
}

.share.active {
    opacity: 1;
    transform: scale(1);
}

.share .box {
    background-color: white;
    padding: 20px;
    width: 100%;
    max-width: 450px;
    position: relative;
}

.share h2 {
    font-size: 1.5em;
    margin: 0;
    font-weight: bold;
    color: #000034;
}

.share .close {
    position: absolute;
    top: 20px;
    right: 20px;
    color: #888;
    font-size: 1.25em;
}

.share a[target="_blank"] {
    width: calc(100% / 4);
    float: left;
    text-align: center;
    color: #333;
    margin-top: 20px;
}

.share a[target="_blank"] svg {
    width: 75px !important;
    height: 75px;
    padding: 20px;
    border-radius: 50%;
    color: white;
}

.share strong {
    width: 100%;
    float: left;
}

.share .fa-facebook-f {
    background-color: #3b5998;
}

.share .fa-twitter {
    background-color: #00aced;
}

.share .fa-linkedin-in {
    background-color: #007bb6;
}

.share .fa-whatsapp {
    background-color: #34af23;
}

.share .link {
    display: flex;
    align-items: center;
    width: 100%;
    float: left;
    background-color: rgba(0, 0, 0, .2);
    padding: 10px 20px;
    margin-top: 20px;
    justify-content: space-between;
    border: 1px solid #999;
}

.share input {
    margin: 0 !important;
    font-size: .9em !important;
    height: 20px !important;
    border: none !important;
    box-shadow: none !important;
    margin-top: -4px !important;
}

.share .link a {
    padding-left: 10px;
    text-transform: uppercase;
    font-weight: bold;
    color: #000;
}


/*-------- Avaliações --------*/

.evaluation {
    padding-top: 0;
    padding: 5%;
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.evaluation h2 {
    font-size: 1.5em;
    text-transform: uppercase;
    margin-bottom: 1em;
    font-weight: bold;
    color: #000034;
    margin: 0;
    padding-left: 5%;
}

.evaluation aside {
    padding: 40px calc(5% - .75rem);
    padding-top: 0;
    width: 100%;
    float: left;
}

.evaluation aside .col {
    display: flex;
    align-items: center;
    margin-top: 1em;
}

.evaluation aside h3 {
    color: #999;
    font-family: Hind Madurai Bold, Arial, sans-serif !important;
    margin: 0;
    font-size: 2em;
    margin-right: 10px;
}

.evaluation aside svg {
    font-size: 2em;
    color: #FF9800;
}

.evaluation aside span {
    color: #999;
    font-size: 1.25em;
    margin-left: 5px;
    margin-top: -10px;
}

.evaluation aside h4 {
    border: 6px solid #FF9800;
    width: 70px;
    height: 70px;
    line-height: 70px;
    border-radius: 50%;
    font-size: 1.25em;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    color: #777;
    margin: 0;
    margin-right: 10px;
}

.evaluation aside p {
    color: #777;
    font-size: 1em;
}

.evaluation aside .btn {
    border-radius: 5px;
    background-color: #000034 !important;
    box-shadow: none;
    font-weight: bold;
    font-size: .9em;
    font-family: Hind Madurai, Arial, sans-serif !important;
    width: 110px;
    height: 40px;
    line-height: 40px;
}

.evaluation aside label {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width: 100%;
    color: #000;
}

.evaluation aside select {
    width: 170px !important;
    border: 1px solid #999;
    padding: 5px !important;
    height: 40px;
    border-radius: 5px;
}

@media(min-width: 601px) {
    .evaluation aside {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
    }
}

@media(min-width: 993px) {
    .evaluation aside label {
        width: auto;
    }
    .evaluation aside .col:nth-of-type(3) {
        justify-content: flex-end;
    }
    .evaluation aside .btn {
        width: auto;
        padding: 0 1em;
        margin-right: 20px;
    }
}

.evaluation article {
    border-top: 1px solid #ccc;
    width: 100%;
    float: left;
    padding: 40px 20px;
}

.evaluation article h3 {
    font-size: 1.25em;
    margin: 0;
    margin-bottom: 1.5em;
    font-family: Hind Madurai Bold, Arial, sans-serif !important;
}

.evaluation article .flex:nth-of-type(1) {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.evaluation article time {
    color: #999;
}

.evaluation article .stars svg {
    color: #FF9800;
}

.evaluation article p {
    font-size: 1em;
    color: #666;
    line-height: 1.25em;
}

.evaluation article .flex:nth-of-type(2) {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.evaluation article h4 {
    font-size: 1.1em;
    color: #666;
    margin: 0;
    margin-right: 10px;
}

.evaluation article cite {
    color: #666;
    font-size: .8em;
}

.evaluation article cite svg {
    color: rgb(64, 205, 40);
}


/*-------- modal de Avaliação --------*/

.rate {
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 9999;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, .5);
    font-family: Hind Madurai, Arial, sans-serif !important;
    transform: translateX(100%);
    opacity: 0;
    transition: all 1s;
}

.rate.active {
    opacity: 1;
    transform: translateX(0);
}

.rate .box {
    background-color: white;
    width: 100%;
    padding: 40px;
    padding-top: 80px;
    max-height: 100vh;
    overflow: auto;
}

.rate .close {
    z-index: 1;
    background-color: #000;
    margin: 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 70px;
    text-align: center;
    color: white;
    font-size: 1.5em;
    line-height: 70px;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
}

.rate .close svg {
    margin-right: 10px;
    color: #ccc;
    font-size: 1em;
    position: absolute;
    left: 20px;
}

.rate img {
    width: 100%;
    height: 150px;
    object-fit: contain;
}

.rate figcaption {
    display: block !important;
    font-size: 1.25em;
    font-family: Hind Madurai Bold, Arial, sans-serif !important;
    color: #000034;
    text-align: center;
}

.rate h2 {
    font-size: 1.5em;
    text-transform: uppercase;
    margin-bottom: 1em;
    font-weight: bold;
    color: #666;
}

.rate h3,
.rate label {
    font-size: 1em;
    color: #666 !important;
    margin: 0;
    margin-bottom: 5px !important;
}

.rate ul {
    margin: 0 !important;
    margin-bottom: 10px !important;
}

.rate span {
    display: flex !important;
    align-items: center;
}

.rate [type="radio"]+span {
    height: 35px !important;
}

.rate [type="radio"]+span:before,
.rate [type="radio"]+span:after {
    width: 25px !important;
    height: 25px !important;
}

.rate [type="radio"]+span:before {
    border: 1px solid #ccc !important;
}

.rate [type="radio"]:checked+span:after,
.rate [type="radio"].with-gap:checked+span:before,
.rate [type="radio"].with-gap:checked+span:after {
    border: 1px solid #000034 !important;
}

.rate [type="radio"]:checked+span:after,
.rate [type="radio"].with-gap:checked+span:after {
    background-color: #000034 !important;
}

.rate input {
    width: calc(100% - 1em) !important;
    padding-left: 1em !important;
    border: 1px solid #ccc !important;
    font-size: 1em !important;
    font-family: Hind Madurai, Arial, sans-serif !important;
    margin-top: 5px !important;
}

.rate input:focus {
    border: 1px solid #666 !important;
    box-shadow: none !important;
}

.rate textarea {
    padding: 1em !important;
    border: 1px solid #ccc !important;
    font-size: 1em !important;
    font-family: Hind Madurai, Arial, sans-serif !important;
    margin-top: 5px !important;
    height: 100px;
    resize: none;
}

.rate textarea:focus {
    border: 1px solid #666 !important;
    outline: none !important;
}

.rate .flex {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.rate p {
    font-size: .9em;
    margin: 0;
    color: #999;
    display: flex;
}

.rate p span {
    background-color: rgb(228, 227, 227);
    color: #333;
    font-weight: bold;
    padding: 0 5px;
    margin-right: 5px;
}

.rate .btn {
    font-family: Hind Madurai Bold, Arial, sans-serif !important;
    width: 100%;
    height: 3em;
    line-height: 3em;
    background-color: #000034 !important;
    border-radius: 5px;
    box-shadow: none !important;
}

.rate small {
    width: 100%;
    float: left;
    margin-top: 5px;
    color: #666;
    font-size: .7em;
    line-height: 1em;
    text-align: center;
}

@media(min-width: 601px) {
    .rate {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .rate .box {
        position: relative;
        max-width: 600px;
        height: 600px;
        overflow-x: hidden;
    }
    .rate .box::-webkit-scrollbar-track {
        background-color: #F4F4F4;
    }
    .rate .box::-webkit-scrollbar {
        width: 6px;
        background: #F4F4F4;
    }
    .rate .box::-webkit-scrollbar-thumb {
        background: #dad7d7;
    }
    .rate figure {
        display: flex;
        align-items: center;
    }
    .rate img {
        width: 150px;
        height: 150px;
        margin-right: 20px;
    }
    .rate figcaption {
        text-align: left;
        line-height: 1.25em;
    }
    .rate fieldset ul:nth-of-type(1) {
        display: flex;
        justify-content: space-between;
    }
    .rate .btn {
        width: auto;
        padding: 0 5em;
    }
    .rate small {
        text-align: left;
        margin-top: 10px;
    }
}


/*-------- Chamada para compra de Produtos --------*/

.modalProduct {
    font-family: Hind Madurai, Arial, sans-serif !important;
    position: fixed;
    bottom: 0;
    left: 0;
    background-color: white;
    width: 100%;
    float: left;
    z-index: 2;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .3);
    padding: 10px 40px;
    transform: translateY(100%);
    opacity: 0;
    transition: all 1s;
}

.modalProduct.active {
    transform: translateY(0);
    opacity: 1;
}

.modalProduct img {
    display: none;
}

.modalProduct h2 {
    font-size: 1.5em;
    font-weight: bold;
    color: #000034;
    margin: 0;
}

.modalProduct h3 {
    font-size: 1em;
    color: #343434;
    margin: 2px 0;
}

.modalProduct label[for="amount"] {
    display: flex;
    width: 0px;
    opacity: 0;
    height: 40px;
    position: relative;
    border-radius: 5px;
    transition: all 0.5s;
}

.modalProduct label[for="amount"].active {
    width: 90px;
    margin-right: 10px;
    border: 1px inset #777;
    opacity: 1;
}

.modalProduct label[for="amount"] input {
    height: 40px !important;
    text-align: center;
    margin: 0 !important;
    padding: 0 !important;
    width: calc(100% - 30px) !important;
    border: none !important;
    padding: 0 5px !important;
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.modalProduct label[for="amount"] input:focus {
    border: none !important;
    box-shadow: none !important;
}

.modalProduct label[for="amount"] button {
    width: 20px;
    padding: 0;
    height: 19px;
    position: absolute;
    border: none;
    background-color: #777;
    color: white;
    margin: 0;
}

.modalProduct label[for="amount"] .plus {
    top: -1px;
    right: -1px;
    border-radius: 0 5px 0 0;
}

.modalProduct label[for="amount"] .minus {
    bottom: -1px;
    right: -1px;
    border-radius: 0 0 5px 0;
}

.modalProduct .flex {
    display: flex;
    margin-top: 5px;
}

.modalProduct .btn {
    width: 100% !important;
    height: 40px !important;
    background-color: #000034 !important;
    box-shadow: none !important;
    border-radius: 5px;
    font-weight: bold;
    font-size: 1.1em;
    color: white !important;
    line-height: 40px !important;
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.modalProduct .btn.disabled {
    opacity: .5;
    background-color: #000034 !important;
    color: white !important;
}

.modalProduct small {
    width: 100%;
    float: left;
    text-align: center;
    font-size: .8em;
    margin-top: 0px;
}

.modalProduct .favorite {
    padding: 0 !important;
}

.modalProduct .favorite svg {
    width: 40px;
    background-color: #e0e0e0;
    height: 40px;
    padding: 10px;
    text-align: center;
    border-radius: 50%;
    margin-left: 10px;
    color: #333;
}

.modalProduct .close {
    display: none;
}

@media(min-width: 993px) {
    .modalProduct {
        max-width: 300px;
        padding: 20px 20px;
        right: 0;
        left: auto;
        bottom: 5%;
        transform: translateX(100%);
        opacity: 0;
    }
    .modalProduct.active {
        transform: translateX(0);
        opacity: 1;
    }
    .modalProduct img {
        display: block;
        width: 100%;
        height: 150px;
        object-fit: contain;
    }
    .modalProduct .close {
        display: block;
        position: absolute;
        top: 5px;
        left: 10px;
        font-size: 1.5em;
        color: #666;
    }
}


/*-------- Carrinho de Compras --------*/

.carrinho {
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.carrinho .head {
    padding: 10px 10%;
}

.carrinho header {
    padding: 20px;
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.carrinho header h1 {
    margin: 0;
    font-family: Hind Madurai Bold, Arial, sans-serif !important;
    color: #333;
    font-size: 2.5em;
}

.carrinho header h2:nth-of-type(1) {
    font-size: 1.5em;
    margin: 0;
    color: #666;
}

.carrinho header h2:nth-of-type(2) {
    font-size: 1em;
    text-transform: uppercase;
    margin: 10px 0;
    color: #fff;
    background-color: #000034;
    padding: 15px 10px;
    text-align: center;
}

.empty-cart {
    padding: 60px 5%;
    text-align: center;
}

.empty-cart svg {
    color: #000034;
    font-size: 6em;
}

.empty-cart h2 {
    font-size: 2em;
    color: #000034;
    font-weight: bold;
    margin-bottom: 0;
}

.empty-cart p {
    margin: 0;
    color: #666;
}

.empty-cart .btn {
    margin-top: 20px;
    background-color: #000034 !important;
    box-shadow: none !important;
    height: 3em;
    line-height: 3em;
    border-radius: 30px;
    text-transform: none;
}

.cart table {
    padding: 0 20px;
}

.cart thead {
    display: none !important;
}

.cart .responsive-table tbody {
    white-space: normal !important;
    display: flex;
}

.cart .freight .flex {
    justify-content: flex-start;
    width: 100%;
    overflow: hidden;
}

.cart tbody tr {
    min-width: 100% !important;
    margin-right: 30px;
}

.cart tbody td:first-child {
    display: flex;
    align-items: center;
}

.cart img {
    width: 90px;
    height: 90px;
    object-fit: contain;
    margin-right: 10px;
}

.cart h2,
.cart h3,
.cart h4 {
    font-size: 1em;
    color: #666;
    margin: 5px 0;
}

.cart tbody td:nth-of-type(3),
.cart tbody td:nth-of-type(4),
.cart tbody td:nth-of-type(5) {
    width: calc(100% / 3);
    float: left;
    text-align: center;
}

.cart tbody td:nth-of-type(2) {
    display: none;
}

.cart tbody td:nth-of-type(3) label {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #ccc;
    padding: 10px;
}

.cart input {
    width: 100% !important;
    border: none !important;
    text-align: center;
    font-family: Hind Madurai, Arial, sans-serif !important;
    height: 20px !important;
    padding: 0 !important;
    margin: 0 !important;
    color: #666;
}

.cart label button {
    background-color: transparent;
    border: none;
}

.cart td {
    padding: 0;
}

.cart tbody td:nth-of-type(4) {
    font-size: 1.25em;
    font-weight: bold;
    height: 40px;
    line-height: 40px;
}

.cart tbody td:nth-of-type(5) svg {
    width: 40px !important;
    height: 40px;
    border: 1px solid #666;
    border-radius: 50%;
    color: #666;
    padding: 10px;
}

@media(min-width: 601px) {
    .cart tbody tr {
        min-width: calc(50% - 15px) !important;
    }
}

@media(min-width: 993px) {
    .cart {
        padding: 0 20px !important;
        width: 75% !important;
        float: left;
    }
    .cart img {
        margin-right: 50px;
        margin-left: 20px;
    }
    .cart thead th {
        text-align: center;
        padding: 10px 20px !important;
        font-family: Hind Madurai Bold, Arial, sans-serif !important;
    }
    .cart thead th:nth-of-type(1) {
        text-align: left;
    }
    .cart thead {
        display: table-row-group !important;
        background-color: #ccc;
        border: none;
    }
    .cart .responsive-table tbody {
        display: table-row-group;
    }
    .cart tbody td:nth-of-type(2) {
        display: table-cell;
    }
    .cart tbody td:nth-of-type(2),
    .cart tbody td:nth-of-type(3),
    .cart tbody td:nth-of-type(4),
    .cart tbody td:nth-of-type(5) {
        width: inherit;
        float: none;
        text-align: center;
    }
    .cart label {
        max-width: 120px;
        margin: 0 auto;
    }
}


/*-------- Cupom de Desconto --------*/

.cupom {
    padding: 20px !important;
    padding-left: 0 !important;
}

.cupom form {
    display: flex;
    align-items: center;
    max-width: 300px;
    margin: 0 auto;
}

.cupom label {
    width: 100%;
    font-size: 1em;
    color: #666;
    margin-right: 10px;
}

.cupom input {
    text-align: left;
    margin: 0 !important;
    height: 40px !important;
    padding-left: 10px !important;
    width: calc(90% - 10px) !important;
    border: 1px solid #ccc !important;
    color: #999;
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.cupom input:focus {
    box-shadow: none !important;
}

.cupom input::placeholder {
    color: #999;
}

.cupom .btn {
    width: 120px;
    padding: 0;
    height: 42px;
    box-shadow: none !important;
    border-radius: 0;
    background-color: #000;
    font-family: Hind Madurai, Arial, sans-serif !important;
    font-weight: bold;
}

@media(min-width: 993px) {
    .cupom form {
        margin: 0;
    }
}


/*-------- Frete Do Carrinho --------*/

.freteCarrinho {
    padding: 20px !important;
    padding-left: 0 !important;
}

.freteCarrinho form {
    display: flex;
    align-items: center;
    max-width: 250px;
    margin: 0 auto;
}

.freteCarrinho label {
    width: 100%;
    font-size: 1em;
    color: #666;
    margin-right: 10px;
}

.freteCarrinho input {
    text-align: left;
    margin: 0 !important;
    height: 40px !important;
    padding-left: 10px !important;
    width: calc(90% - 10px) !important;
    border: 1px solid #ccc !important;
    color: #999;
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.freteCarrinho input:focus {
    box-shadow: none !important;
}

.freteCarrinho input::placeholder {
    color: #999;
}

.freteCarrinho .btn {
    width: 120px;
    padding: 0;
    height: 42px;
    box-shadow: none !important;
    border-radius: 0;
    background-color: #000;
    font-family: Hind Madurai, Arial, sans-serif !important;
    font-weight: bold;
}

@media(min-width: 993px) {
    .freteCarrinho form {
        margin: 0;
    }
}


/*-------- Preço Final --------*/

.price {
    padding: 20px;
}

.price h2 {
    margin: 0;
    margin-bottom: 15px;
    font-size: 1.5em;
    font-weight: bold;
    color: #000034;
}

.price hgroup {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.price h3 {
    margin: 5px 0;
    font-size: 1.5em;
    color: #666;
}

.price hr {
    width: 100%;
    height: 1px;
    background-color: #d8d8d8;
    border: none;
}

.price h4 {
    font-size: 1.75em;
    font-weight: bold;
    margin: 10px 0;
    margin-bottom: 0;
}

.price p {
    text-align: right;
    margin: 0;
    font-size: 1.25em;
    color: #666;
    margin-bottom: 10px;
}

.price .btn:nth-of-type(1) {
    float: right;
    width: 100% !important;
    height: 50px !important;
    background-color: #40cd28 !important;
    box-shadow: none !important;
    font-weight: bold;
    font-size: 1.1em;
    color: white !important;
    line-height: 50px !important;
    margin-top: 10px;
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.price .btn:nth-of-type(2) {
    float: right;
    margin-top: 10px;
    background-color: transparent !important;
    color: #000034;
    border: 1px solid #000034;
    box-shadow: none !important;
    font-weight: bold;
    font-size: .8em;
}

@media(min-width: 993px) {
    .price {
        width: 25%;
        float: left;
        padding: 0 20px 20px 0;
    }
    .price h3 {
        font-size: 1.1em;
    }
    .price h4 {
        font-size: 1.25em;
    }
    .price p {
        font-size: 1em;
    }
}

.cep {
    display: none !important;
    font-size: .8em;
}

.cep.active,
.desconto.active {
    display: flex !important;
}

.desconto {
    display: none !important;
    font-size: .8em;
}

.cep h3:nth-of-type(2) {
    color: #95002d;
}

.desconto h3:nth-of-type(2) {
    color: #40cd28;
}


/*-------- Pagina de Login --------*/

.login {
    font-family: Hind Madurai, Arial, sans-serif !important;
    position: relative;
}

.login .menu {
    position: relative !important;
}

.login .asidenav-action,
.login .pull-m3,
.login .push-m6,
.login .destaque {
    display: none !important;
}

.login .menu {
    height: 70px !important;
}

.login .menu .flex {
    display: block;
    padding: 0 !important;
}

.login .menu img {
    position: absolute;
    top: 0px;
    left: 10px;
    height: 50px !important;
    margin: 0 !important;
    padding: 0 !important;
    object-position: left;
}

.shadow {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: calc(100vh - 70px) !important;
    padding: 40px;
    max-width: 500px;
}

.shadow .box {
    background-color: white;
    box-shadow: 0 0 10px 0px rgba(0, 0, 0, .3);
    padding: 40px !important;
    position: relative;
    z-index: 1;
}

.shadow h1, .shadow h2 {
    font-size: 2em;
    color: #000034;
    text-align: center;
    font-weight: bold;
    margin: 0;
}

.shadow label {
    margin-top: 10px;
    float: left;
    width: 100%;
    position: relative;
    color: #666;
}

.shadow input {
    background-color: #fff !important;
    padding-left: 1em !important;
    width: calc(100% - 1em) !important;
    color: #232323 !important;
    font-family: Hind Madurai, Arial, sans-serif !important;
    font-size: 1em !important;
    border-radius: 10px !important;
    border: 1px solid #9e9e9e !important;
    margin: 0 !important;
    height: 40px !important;
}

.shadow input::placeholder {
    font-family: Hind Madurai, Arial, sans-serif !important;
    color: #9e9e9e;
    font-weight: bold;
}

.shadow .eyes {
    position: absolute;
    bottom: 5px;
    right: 0px;
    background-color: transparent;
    border: 0;
}

.shadow .eyes svg {
    width: 30px !important;
    height: 30px;
    padding: 2px;
    color: #666;
}

.shadow a:not(.btn) {
    width: 100%;
    float: right;
    text-align: right;
    margin: 5px 0;
    color: #666;
    text-decoration: underline;
    font-size: .8em;
}

.shadow button.btn {
    width: 100% !important;
    height: 50px !important;
    background-color: #40cd28 !important;
    box-shadow: none !important;
    font-weight: bold;
    font-size: 1.1em;
    color: white !important;
    line-height: 50px !important;
    margin-top: 10px;
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.shadow .btn:nth-of-type(2) {
    width: 100%;
    text-transform: none;
    box-shadow: none !important;
    height: 3em;
    line-height: 3em;
    border-radius: 5px;
}

.shadow .btn:nth-of-type(2) {
    background: #4267b2 !important;
    padding: 8px;
}

.shadow .btn:nth-of-type(2) svg {
    width: 25px;
    height: 25px;
    fill: #fff;
    margin: 0;
    float: left;
}

.shadow .btn:nth-of-type(2) span {
    font-size: 1em;
    font-weight: bold;
    margin-left: 10px;
    margin-top: -7px;
    float: left;
    text-align: center;
    width: calc(100% - 60px);
}

.shadow .flex {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
}

.shadow hr {
    width: 100%;
    height: 1px;
    background-color: #e8e8e8;
    border: none;
}

.shadow .flex p {
    position: absolute;
    background-color: white;
    padding: 0 15px;
    color: #666;
}

.shadow p {
    text-align: center;
}

.shadow p a {
    font-size: 1em !important;
    float: none !important;
    width: min-content !important;
}

.shadow #form-2,
.shadow #form-3,
.shadow #form-4 {
    display: none;
}

.shadow #form-3 input {
    letter-spacing: 20px;
    text-align: center;
    font-size: 2em;
    padding-left: 0 !important;
    -moz-appearance: textfield;
}

.shadow #form-3 input::-webkit-outer-spin-button,
.shadow #form-3 input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

.login .wave {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
}

.login .wave path {
    fill: #000034;
}


/*-------- Cadastro --------*/

.cadastro {
    padding: 40px;
}

.cadastro fieldset {
    display: flex;
    align-items: center;
    justify-content: center;
}

.cadastro form {
    max-width: 350px;
}

.cadastro .container {
    max-width: 700px !important;
    text-align: center;
}

.cadastro h1 {
    font-size: 2em;
    color: #000034;
    text-align: center;
    font-weight: bold;
    margin: 0;
}

.cadastro label {
    margin-top: 10px;
    float: left;
    width: 100%;
    position: relative;
    color: #666;
    font-size: .9em;
}

.cadastro input {
    background-color: #fff !important;
    padding-left: 1em !important;
    width: calc(100% - 1em) !important;
    color: #232323 !important;
    font-family: Hind Madurai, Arial, sans-serif !important;
    font-size: 1em !important;
    border-radius: 10px !important;
    border: 1px solid #9e9e9e !important;
    margin: 0 !important;
    height: 40px !important;
}

.cadastro input:focus {
    box-shadow: none !important;
}

.cadastro input::placeholder {
    font-family: Hind Madurai, Arial, sans-serif !important;
    color: #9e9e9e;
}

.cadastro input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

.cadastro input[type=number] {
    -moz-appearance: textfield;
    appearance: textfield;
}

.cadastro [type="checkbox"].filled-in:checked+span:not(.lever):after {
    background-color: #000034 !important;
    border-color: #000034 !important;
}

.cadastro [type="checkbox"].filled-in:not(:checked)+span:not(.lever):after {
    border: 1px solid #ccc !important;
}

.cadastro label[name="sendEmail"] {
    width: 100% !important;
    float: left;
    padding: 10px 0;
}

.cadastro label span {
    text-transform: capitalize;
}

.cadastro form p {
    text-align: left;
    float: left;
    margin: 0;
}

.cadastro p label {
    display: flex;
    align-items: center;
    font-family: Hind Madurai, Arial, sans-serif !important;
    color: #666;
}

.cadastro label span {
    font-size: 1em !important;
}

.cadastro [type="radio"]:not(:checked)+span,
.cadastro [type="radio"]:checked+span {
    margin-right: 20px;
}

.cadastro [type="radio"]:not(:checked)+span:before,
.cadastro [type="radio"]:not(:checked)+span:after {
    border: 1px solid #9e9e9e !important;
}

.cadastro [type="radio"]:checked+span:after,
.cadastro [type="radio"].with-gap:checked+span:before,
.cadastro [type="radio"].with-gap:checked+span:after {
    border: 2px solid #000034;
}

.cadastro [type="radio"]:checked+span:after,
.cadastro [type="radio"].with-gap:checked+span:after {
    background-color: #000034;
}

.cadastro [type="radio"]+span:before,
.cadastro [type="radio"]+span:after {
    width: 20px;
    height: 20px;
    top: -3px;
}

.cadastro .eyes {
    position: absolute;
    bottom: 5px;
    right: 0px;
    background-color: transparent;
    border: 0;
}

.cadastro .eyes svg {
    width: 30px !important;
    height: 30px;
    padding: 2px;
    color: #666;
}

.cadastro a:not(.btn) {
    width: 100%;
    float: right;
    text-align: right;
    margin: 5px 0;
    color: #666;
    text-decoration: underline;
    font-size: .8em;
}

.cadastro button.btn {
    width: 100% !important;
    height: 50px !important;
    background-color: #40cd28 !important;
    box-shadow: none !important;
    font-weight: bold;
    font-size: 1.1em;
    color: white !important;
    line-height: 50px !important;
    margin-top: 10px;
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.cadastro a.btn {
    width: 100%;
    text-transform: none;
    box-shadow: none !important;
    height: 3em;
    line-height: 3em;
    border-radius: 5px;
    background: #4267b2 !important;
    padding: 8px;
    max-width: 350px;
}

.cadastro a.btn svg {
    width: 25px;
    height: 25px;
    fill: #fff;
    margin: 0;
    float: left;
}

.cadastro a.btn span {
    font-size: 1em;
    font-weight: bold;
    margin-left: 10px;
    margin-top: -7px;
    float: left;
    text-align: center;
    width: calc(100% - 60px);
}

.cadastro .flex {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
}

.cadastro hr {
    width: 100%;
    height: 1px;
    background-color: #e8e8e8;
    border: none;
}

.cadastro .flex p {
    position: absolute;
    background-color: white;
    padding: 0 15px;
    color: #666;
}

.cadastro p {
    text-align: center;
}

.cadastro p a {
    font-size: 1em !important;
    float: none !important;
    width: min-content !important;
}


/*-------- Minha Conta --------*/

.conta {
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.conta section {
    padding: 0 5%;
}

.conta .menu {
    position: relative !important;
}

.conta .asidenav-action,
.conta .push-m6 a:not(.account) {
    display: none;
}

.conta .l2 {
    display: none;
    width: 100% !important;
    max-width: 250px;
}

.conta .fixed-action-btn {
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.conta .fixed-action-btn .btn-floating {
    background-color: #000034;
    padding: 0;
    font-size: 2em;
    line-height: 2.1em;
    z-index: 9999;
}

.conta .fixed-action-btn ul {
    background-color: #fff;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, .3);
    left: auto;
    right: 27px !important;
    padding: 5px 20px;
    margin: 0 !important;
}

.conta nav.l2 li,
.conta .fixed-action-btn li {
    margin: 5px 0 !important;
}

.conta .fixed-action-btn li.btn-floating {
    display: initial !important;
    color: #fff;
    position: relative;
    overflow: hidden;
    z-index: 1;
    width: auto !important;
    height: auto !important;
    line-height: 40px;
    padding: 0;
    background-color: #fff;
    border-radius: 0;
    -webkit-transition: background-color .3s;
    transition: background-color .3s;
    cursor: pointer;
    vertical-align: middle;
}

.conta nav.l2 li a,
.conta .fixed-action-btn li a {
    display: flex !important;
    align-items: center !important;
    line-height: 35px;
    font-size: .6em;
    color: #777;
}

.conta nav.l2 li svg,
.conta .fixed-action-btn li svg {
    width: 25px !important;
    height: 25px;
    margin-right: 10px;
    color: #000034;
}

.conta .collapsible {
    box-shadow: none !important;
    border: none !important;
}

.conta .collapsible-header {
    line-height: 1.5;
    padding: 0;
    background-color: transparent;
    border-bottom: none;
    outline: none !important;
    min-width: 150px;
}

.conta .collapsible-body {
    border-bottom: none;
    padding: 0;
    margin-bottom: -10px;
}

.conta nav.l2 h3,
.conta .fixed-action-btn h3 {
    font-size: 1.1em;
    margin: 0;
    width: 100%;
    font-weight: bold;
    color: #000034;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.conta nav.l2 h3 svg,
.conta .fixed-action-btn h3 svg {
    margin: 0 !important;
    transition: all .5s;
}

.conta nav.l2 li.active h3 svg,
.conta .fixed-action-btn li.active h3 svg {
    transform: rotate(180deg);
}

.conta nav.l2 p,
.conta .fixed-action-btn p {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    font-size: .9em;
    line-height: 1em;
    margin: 10px 0;
}

.conta nav.l2 p strong,
.conta .fixed-action-btn p strong {
    width: 100%;
    float: left;
    text-align: left;
}

.conta nav.l2 address,
.conta .fixed-action-btn address {
    display: flex !important;
    align-items: center !important;
    line-height: 35px;
    font-size: 1.1em;
    color: #777;
}

.conta nav.l2 .collapsible {
    padding: 0 15px;
    width: 100%;
    float: left;
    margin-top: 20px !important;
}

.conta nav.l2 ul li.active {
    background-color: transparent !important;
}

.conta nav.l2 li {
    min-width: 100%;
}

.conta nav.l2 a {
    font-size: 1.1em !important;
    background-color: transparent !important;
}

.conta nav.l2 h1 {
    font-size: 2em;
    font-weight: bold;
    color: #000034;
    margin: 0;
    padding: 40px 15px;
    padding-bottom: 20px;
}

.conta nav.l2 h3 {
    font-size: 1.25em;
}

.conta nav.l2 .collapsible-body {
    padding: 10px 0 !important;
}

@media(min-width: 993px) {
    .conta nav.l2 {
        display: block;
    }
    .conta .fixed-action-btn {
        display: none;
    }
}


/*-------- Status do Pedidos --------*/

.order {
    padding: 40px .75rem !important;
}

.order h2 {
    font-size: 2em;
    font-weight: bold;
    margin: 0;
    color: #666;
    margin-top: 40px;
}

.order .sequence {
    border: 1px solid #ccc !important;
    padding: 10px 40px;
    position: relative;
    margin-top: 20px;
}

.order .sequence::before {
    content: "";
    height: calc(100% + 2px);
    width: 4px;
    position: absolute;
    left: -1px;
    top: -1px;
}

.order .sequence.cancel::before {
    background-color: #dd3341;
}

.order .sequence.success::before {
    background-color: #40cd28;
}

.order .collapsible-header {
    display: block !important;
    min-width: 0 !important;
}

.order .flex {
    display: flex;
    align-items: center;
    width: 100%;
    float: left;
    position: relative;
}

.order h3 {
    margin: 0;
    margin-top: 10px;
    font-size: 1.1em;
    padding-bottom: 10px;
    border-bottom: 1px solid #ccc;
    width: 100%;
    float: left;
    font-weight: bold;
    padding-left: 30px;
    margin-bottom: 10px;
}

.order .collapsible-header p {
    position: absolute;
    right: -20px;
    margin: 0;
    bottom: 15px;
    color: #666;
    max-width: 30%;
    text-align: right;
    line-height: 1.25em;
}

.order .cancel h3,
.order .cancel strong {
    color: #dd3341;
}

.order .success h3,
.order .success strong {
    color: #40cd28;
}

.order .flex svg {
    position: absolute;
    top: 0px;
    left: -30px;
    width: 40px !important;
    height: 40px !important;
    color: #ccc;
    transition: all .5s;
}

.order .active .flex svg {
    transform: rotate(180deg);
}

.order h6 {
    width: 100%;
    float: left;
    font-size: 1em;
    color: #666;
    font-weight: bold;
    opacity: 0;
    transform: scale(0);
    transition: all .5s;
    height: 0;
    position: relative;
}

.order .active h6 {
    transform: scale(1);
    opacity: 1;
    margin-top: 10px;
    margin-bottom: 20px;
    height: auto;
}

.order .item {
    display: flex;
    align-items: center;
    width: 100%;
}

.order img {
    width: 80px;
    height: 80px;
    object-fit: contain;
    margin-right: 10px;
    transition: all .5s;
}

.order .active img {
    width: 120px;
    height: 120px;
}

.order h4 {
    max-width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    width: 150px;
    margin: 0;
    font-size: 1em;
    color: #666;
}

@media(min-width: 601px) {
    .order h4 {
        width: 100%;
        white-space: normal;
    }
}

.order h5 {
    position: relative;
    width: 100%;
    margin: 0;
    margin-top: 10px;
    font-size: 1.1em;
    color: #666;
    font-weight: bold;
}

.order .center {
    padding-bottom: 20px;
}

.order .btn {
    background-color: #04D483 !important;
    box-shadow: none !important;
    font-weight: bold;
    margin-bottom: 10px;
    margin-right: 10px;
    line-height: 3em;
    height: 3em;
    text-transform: none;
    font-size: 1.1em;
    width: 250px;
}

.order .center .btn:last-child {
    background-color: transparent !important;
    border: 2px solid #000034;
    color: #000034;
}

.statusOrder {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    text-align: center;
    padding: 40px 0;
}

.statusOrder li {
    width: 100%;
}

.statusOrder .svg {
    margin: 0 auto;
    width: 100%;
    float: left;
    position: relative;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px;
}

.statusOrder .svg svg {
    width: 15px !important;
    height: 15px !important;
    background-color: #ccc;
    border-radius: 50%;
    color: #ccc;
    padding: 5px;
    position: relative;
}

.statusOrder .current .svg svg {
    width: 50px !important;
    height: 50px !important;
    background-color: #fff;
    padding: 10px;
    border: 2px solid;
}

.statusOrder .svg::before {
    content: "";
    height: 0px;
    width: calc(150% - 15px);
    border-bottom: 3px solid #ccc;
    position: absolute;
    left: 50%;
    top: calc(50% - 1.5px);
}

.statusOrder li:nth-last-of-type(2) .svg::before {
    width: 100%;
}

.statusOrder li:last-child .svg::before {
    content: none;
}

.cancel .statusOrder .check .svg::before {
    border-color: #dd3341;
}

.cancel .statusOrder .check .svg svg {
    background-color: #dd3341;
    color: #dd3341;
}

.cancel .statusOrder .current .svg svg {
    color: #dd3341;
    border-color: #dd3341;
}

.success .statusOrder .check .svg::before {
    border-color: #40cd28;
}

.success .statusOrder .check .svg svg {
    background-color: #40cd28;
    color: #40cd28;
}

.success .statusOrder .current .svg svg {
    color: #40cd28;
    border-color: #40cd28;
}

.statusOrder p {
    color: #666;
    line-height: 1.25em;
    margin: 0 auto;
    max-width: 100px;
}

.statusOrder small {
    font-weight: bold;
    color: #666;
    font-size: .8em;
}

.statusOrder p,
.statusOrder small {
    display: none;
}

.statusOrder .current p,
.statusOrder .current small {
    display: block;
}

@media(min-width: 601px) {
    .statusOrder p,
    .statusOrder small {
        display: block;
    }
}


/*-------- Dados Cadastrados --------*/

.dados {
    padding: 40px .75rem !important;
}

.dados h2 {
    font-size: 2em;
    font-weight: bold;
    margin: 0;
    color: #666;
    margin-top: 40px;
}

.dados p {
    margin: 0;
    margin-bottom: 20px;
}

.dados fieldset {
    display: flex;
    align-items: center;
    justify-content: center;
}

.dados form {
    max-width: 350px;
}

.dados .container {
    max-width: 700px !important;
    text-align: center;
}

.dados h1 {
    font-size: 2em;
    color: #000034;
    text-align: center;
    font-weight: bold;
    margin: 0;
}

.dados label {
    margin-top: 10px;
    float: left;
    width: 100%;
    position: relative;
    color: #666;
    font-size: .9em;
}

.dados input {
    background-color: #fff !important;
    padding-left: 1em !important;
    width: calc(100% - 1em) !important;
    color: #232323 !important;
    font-family: Hind Madurai, Arial, sans-serif !important;
    font-size: 1em !important;
    border-radius: 10px !important;
    border: 1px solid #9e9e9e !important;
    margin: 0 !important;
    height: 40px !important;
}

.dados input:focus {
    box-shadow: none !important;
}

.dados input::placeholder {
    font-family: Hind Madurai, Arial, sans-serif !important;
    color: #9e9e9e;
}

.dados input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

.dados input[type=number] {
    -moz-appearance: textfield;
    appearance: textfield;
}

.dados [type="checkbox"].filled-in:checked+span:not(.lever):after {
    background-color: #000034 !important;
    border-color: #000034 !important;
}

.dados [type="checkbox"].filled-in:not(:checked)+span:not(.lever):after {
    border: 1px solid #ccc !important;
}

.dados label[name="sendEmail"] {
    width: 100% !important;
    float: left;
    padding: 10px 0;
}

.dados label span {
    text-transform: capitalize;
}

.dados form p {
    text-align: left;
    float: left;
    margin: 0;
}

.dados p label {
    display: flex;
    align-items: center;
    font-family: Hind Madurai, Arial, sans-serif !important;
    color: #666;
}

.dados label span {
    font-size: 1em !important;
}

.dados [type="radio"]:not(:checked)+span,
.dados [type="radio"]:checked+span {
    margin-right: 20px;
}

.dados [type="radio"]:not(:checked)+span:before,
.dados [type="radio"]:not(:checked)+span:after {
    border: 1px solid #9e9e9e !important;
}

.dados [type="radio"]:checked+span:after,
.dados [type="radio"].with-gap:checked+span:before,
.dados [type="radio"].with-gap:checked+span:after {
    border: 2px solid #000034;
}

.dados [type="radio"]:checked+span:after,
.dados [type="radio"].with-gap:checked+span:after {
    background-color: #000034;
}

.dados [type="radio"]+span:before,
.dados [type="radio"]+span:after {
    width: 20px;
    height: 20px;
    top: -3px;
}

.dados .eyes {
    position: absolute;
    bottom: 5px;
    right: 0px;
    background-color: transparent;
    border: 0;
}

.dados .eyes svg {
    width: 30px !important;
    height: 30px;
    padding: 2px;
    color: #666;
}

.dados button.btn {
    width: 100% !important;
    height: 50px !important;
    background-color: #40cd28 !important;
    box-shadow: none !important;
    font-weight: bold;
    font-size: 1.1em;
    color: white !important;
    line-height: 50px !important;
    margin-top: 10px;
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.dados a.btn {
    background-color: transparent !important;
    color: #000034;
    border: 2px solid #000034;
    box-shadow: none !important;
    font-weight: bold;
}


/*-------- Endereço Painel --------*/

.addressClient {
    padding: 40px .75rem !important;
}

.addressClient h2 {
    font-size: 2em;
    font-weight: bold;
    margin: 0;
    color: #666;
    margin-top: 40px;
}

.addressClient .col {
    margin-top: 2em;
}

.addressClient label {
    cursor: pointer;
    border: 2px solid #ccc;
    width: 100%;
    float: left;
    padding: 20px;
    padding-bottom: 25px;
    transition: all .5s;
}

.addressClient h4 {
    font-size: 1.5em;
    color: #666;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 0;
    border-bottom: 2px solid #ccc;
    padding-bottom: 10px;
    margin-bottom: 20px;
    width: 100%;
    float: left;
    transition: all .5s;
}

.addressClient h4 strong {
    width: 70px;
    float: right;
    text-align: right;
}

.addressClient svg {
    color: #000034;
}

.addressClient p {
    font-size: 1.25em !important;
    color: #666;
    margin: 0;
    transition: all .5s;
}

.addressClient p:first-of-type {
    font-size: 1.3em !important;
    font-weight: bold;
}

.addressClient .checked p,
.addressClient .checked h4,
.addressClient .checked {
    color: #000034 !important;
    border-color: #000034 !important;
}

.addressClient [type="radio"]:not(:checked)+span,
.addressClient [type="radio"]:checked+span {
    margin-right: 20px;
    margin-top: 20px;
    padding-top: 8px;
    border-top: 1px solid #ccc;
    width: 100%;
    float: left;
}

.addressClient [type="radio"]:checked+span {
    color: #000034;
    font-weight: bold;
    border-top-color: #000034;
}

.addressClient [type="radio"]:not(:checked)+span:before,
.addressClient [type="radio"]:not(:checked)+span:after {
    border: 1px solid #9e9e9e !important;
}

.addressClient [type="radio"]:checked+span:after,
.addressClient [type="radio"].with-gap:checked+span:before,
.addressClient [type="radio"].with-gap:checked+span:after {
    border: 2px solid #000034;
}

.addressClient [type="radio"]:checked+span:after,
.addressClient [type="radio"].with-gap:checked+span:after {
    background-color: #000034;
}

.addressClient [type="radio"]+span:before,
.addressClient [type="radio"]+span:after {
    width: 20px;
    height: 20px;
    top: 5px;
}

.addressClient .box {
    border: 2px dashed #ccc;
    height: 220px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.addressClient h3 {
    font-size: 1.25em;
    font-weight: bold;
    color: #000034;
    text-align: center;
}

.addressClient h3 strong {
    width: 100%;
    float: left;
}

.addressClient h3 svg {
    width: 40px !important;
    height: 40px;
    border: 2px solid #000034;
    border-radius: 50%;
    padding: 8px;
    margin-bottom: 10px;
}

.address.create {
    padding: 40px .75rem !important;
}

.address.create h2 {
    font-size: 2em;
    font-weight: bold;
    margin: 0;
    color: #666;
    margin-top: 40px;
}

.address.create .btn {
    width: 100% !important;
    height: 50px !important;
    background-color: #40cd28 !important;
    box-shadow: none !important;
    font-weight: bold;
    font-size: 1.1em;
    color: white !important;
    line-height: 50px !important;
    font-family: Hind Madurai, Arial, sans-serif !important;
}


/*-------- Meus Favoritos --------*/

.favorite {
    padding: 40px .75rem !important;
    overflow: hidden;
}

a.favorite {
    overflow: initial;
}

.favorite h2 {
    font-size: 2em;
    font-weight: bold;
    margin: 0;
    color: #666;
    margin-top: 40px;
}

.favorite header {
    margin-top: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    padding: 10px 20px;
    border-bottom: 1px solid #ccc;
}

.favorite label {
    display: none;
    padding-left: 70px;
}

.favorite li {
    position: relative;
}

.favorite .btn {
    background-color: #000034 !important;
    box-shadow: none !important;
    font-weight: bold;
    font-family: Hind Madurai, Arial, sans-serif !important;
    padding: 0 2em;
    text-transform: none;
}

.favorite p {
    color: #999;
    font-size: .9em;
    margin: 0;
}

.favorite [type="checkbox"]+span:not(.lever) {
    position: absolute;
    top: calc(50% - 10px);
    left: 30px;
}

.favorite [type="checkbox"].filled-in:checked+span:not(.lever):after {
    background-color: #000034 !important;
    border-color: #000034 !important;
}

.favorite [type="checkbox"].filled-in:not(:checked)+span:not(.lever):after {
    border: 1px solid #ccc !important;
}

.favorite li {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    padding: 20px 0;
    border-bottom: 1px solid #ccc;
    margin-bottom: 20px;
}

.favorite img {
    width: 90px;
    height: 90px;
    object-fit: contain;
    margin-right: 20px;
}

.favorite .flex {
    display: flex;
    align-items: center;
    width: 100%;
    float: left;
    padding: 0 20px;
}

.favorite h3 {
    font-size: 1.1em;
    color: #666;
    font-weight: bold;
    margin: 5px 0;
}

.favorite h4 {
    font-size: 1em;
    margin: 5px 0;
    text-decoration: line-through;
    color: #999;
}

.favorite h5 {
    margin: 5px 0;
    font-size: 2em;
    color: #000034;
    font-weight: bold;
}

.favorite h6 {
    margin: 5px 0;
    font-size: .9em;
    color: #000034;
}

.favorite li .btn {
    width: 100%;
    margin-top: 10px;
    border-radius: 5px;
    line-height: 3em;
    height: 3em;
    text-transform: uppercase;
    background-color: #04D483 !important;
}

.favorite .fa-trash-alt {
    position: absolute;
    right: 0;
    top: 0;
    color: #dd3341;
    font-size: 1.5em;
}

.favorite .flex .flex {
    width: 100%;
    float: left;
    max-width: initial;
    padding: 0;
    justify-content: space-between;
    color: #999;
    margin: 5px 0;
}

.favorite .flex .flex svg {
    color: #FF9800;
}

.favorite .evaluation {
    padding: 0;
}

.favorite .evaluation p {
    line-height: 1.25em;
}

@media(min-width: 601px) {
    .favorite label {
        display: block;
    }
    .favorite img {
        width: 150px;
        height: 150px;
    }
    .favorite li {
        flex-wrap: nowrap;
    }
    .favorite .flex {
        width: fit-content;
        max-width: 250px;
    }
    .favorite h3 {
        font-size: 1.5em;
        max-width: 250px;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
    }
    .favorite .fa-trash-alt {
        display: none;
    }
    .favorite li .btn {
        width: 120px;
        padding: 0;
        position: absolute;
        top: 30px;
        right: 0;
    }
}

@media(min-width: 993px) {
    .favorite .flex,
    .favorite h3 {
        width: 100%;
        max-width: 50%;
    }
}


/*-------- Cadastro de Endereço --------*/

.head {
    background-color: #000034;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 10px;
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.head img {
    width: 100%;
    height: 70px;
    object-fit: contain;
}

.head div {
    display: none;
}

@media(min-width: 601px) {
    .head {
        padding: 10px 10%;
        position: relative;
        justify-content: end;
    }
    .head img {
        width: 50%;
        position: absolute;
        left: 0;
        top: 5px;
        padding: 5px;
    }
    .head div {
        display: block;
        position: relative;
        width: 15%;
    }
    .head div:last-child {
        width: 20%;
    }
    .head div::before {
        content: "";
        height: 0px;
        width: calc(100% - 20px);
        border-bottom: 3px solid #fff;
        position: absolute;
        left: -50%;
        top: calc(30% - 1px);
        filter: opacity(0.05);
    }
    .head div:first-of-type::before {
        left: 0;
        width: 50%;
    }
    .head div:nth-last-child(2)::before {
        width: calc(100% - 20px);
        left: -50%;
    }
    .head div:last-child::before {
        width: calc(100% - 65px);
        left: calc(-45% + 35px);
    }
    .head svg {
        width: 40px !important;
        height: 40px;
        background-color: #fff;
        color: #000034;
        padding: 10px;
        border-radius: 50%;
        position: relative;
        filter: opacity(0.5);
    }
    .head .check svg,
    .head .check::before {
        filter: none;
    }
    .head .check svg {
        z-index: 1;
    }
    .head .current svg,
    .head .current::before {
        background-color: #000034;
        border-color: #000034;
        filter: brightness(70%);
        color: white;
    }
    .head div:nth-of-type(4).current svg,
    .head div:nth-of-type(4).current::before {
        background-color: #40cd28;
        border-color: #40cd28;
        filter: none;
        color: white;
    }
    .head p {
        margin: 0;
        font-size: .9em;
        color: white;
        font-weight: bold;
    }
}

.address {
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.status {
    font-size: 1em;
    color: #666;
    text-align: center;
    margin: 0;
    border-bottom: 1px solid #9e9e9e;
    padding: 10px 0;
}

.details .status {
    font-size: .9em;
    color: #666;
    text-align: center;
    margin: 0;
    border: none;
    padding: 0;
}

.details input[type=number]::-webkit-inner-spin-button { 
    -webkit-appearance: none;
    
}

.details input[type=number] { 
   -moz-appearance: textfield;
   appearance: textfield;

}

.address a {
    display: flex;
    align-items: center;
    padding: 30px calc(.75rem + 20px);
}

.address a h1 {
    font-size: 1.25em;
    margin: 0;
    color: #666;
    font-weight: bold;
}

.address a svg {
    color: #000034;
    font-size: 1.25em;
    margin-right: 10px;
    margin-top: -5px;
}

.address form {
    padding: 20px;
}

.address form a {
    padding: 0;
    color: #666;
    font-weight: bold;
    text-decoration: underline;
    font-size: .8em;
    margin-top: 5px;
}

.address label {
    margin-top: 10px;
    float: left;
    width: 100%;
    position: relative;
    color: #343434;
    font-size: 1em;
}

.address input {
    background-color: #fff !important;
    padding-left: 1em !important;
    width: calc(100% - 1em) !important;
    color: #232323 !important;
    font-family: Hind Madurai, Arial, sans-serif !important;
    font-size: 1em !important;
    border-radius: 5px !important;
    border: 1px solid #343434 !important;
    margin: 0 !important;
    height: 40px !important;
    box-shadow: none !important;
}

.address input::placeholder {
    font-family: Hind Madurai, Arial, sans-serif !important;
    color: #343434;
    font-weight: bold;
}

.address input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

.address input[type=number] {
    -moz-appearance: textfield;
    appearance: textfield;
}

.address button.btn {
    width: 100% !important;
    height: 50px !important;
    background-color: #000034 !important;
    box-shadow: none !important;
    font-weight: bold;
    font-size: 1.1em;
    color: white !important;
    line-height: 50px !important;
    margin-top: 20px;
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.address form div {
    display: none;
    width: 100%;
    float: left;
}

@media(min-width: 601px) {
    .address fieldset {
        display: flex;
        justify-content: center;
    }
    .address form {
        max-width: 450px;
    }
    .address a {
        max-width: 450px;
        margin: 0 auto;
        padding-bottom: 0;
    }
}


/*-------- Pagamento --------*/

.payment {
    font-family: Hind Madurai, Arial, sans-serif !important;
    position: relative;
    width: 100%;
    float: left;
}

.payment::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 997;
}

.payment.check::before{
    content: none;
}

.payment .mensage{
    width: 100%;
    max-width: 300px;
    position: absolute;
    top: 10px;
    left: calc(50% - 150px);
    z-index: 999;
    background-color: #fff;
    border-radius: 10px;
    padding: 20px !important;
    display: none;
}

.payment .mensage::before{
    content: '';
    position: absolute;
    top: -20px;
    left: calc(50% - 20px);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 20px 20px 20px;
    border-color: transparent transparent #fff transparent;
    z-index: 998;
}

.payment .mensage h2{
    font-size: 1.25em !important;
    margin: 0 !important;
}

.payment .mensage p{
    font-size: .85em !important;
    line-height: 1.25em;
    margin: 0;
    text-align: left !important;
}

.payment .mensage .btn{
    background-color: #000034 !important;
    box-shadow: none !important;
    text-transform: none;
    margin-top: 10px;
    margin-bottom: 10px;
    border-radius: 5px;
    font-weight: bold;
    font-family: Hind Madurai, Arial, sans-serif !important;
    width: 100%;
    font-size: 1em !important;
    height: auto !important;
    line-height: 40px !important;
}

.payment .mensage small{
    width: 100%;
    float: left;
    text-align: center;
}

.resume {
    padding: 40px 20px;
}

.resume .col.current{
    position: relative;
    z-index: 999;
    background-color: #fff;
    border-radius: 10px;
    padding: 10px !important;
}

.checkout.current{
    position: relative;
    z-index: 999;
    background-color: #fff;
    border-radius: 10px;
}

.checkout .mensage::before{
    content: '';
    position: absolute;
    top: auto;
    bottom: -20px;
    left: calc(50% - 20px);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 20px 20px 0 20px;
    border-color: #fff transparent transparent transparent;
    z-index: 998;
}

.resume h2 {
    margin: 0;
    font-size: 1.5em;
    font-weight: bold;
    color: #000034;
}

.resume li:first-of-type {
    font-weight: bold;
}

.resume li {
    font-size: 1em;
}

.resume a:not(.btn) {
    color: #666;
    font-weight: bold;
    text-decoration: underline;
}

.resume .price h2 {
    margin-bottom: 20px;
}

.resume .price a:not(.btn) {
    margin-left: 10px;
    font-size: .9em;
    font-weight: normal;
}

.resume .price h2 {
    margin-top: 80px;
}

@media(min-width: 601px) {
    .resume {
        padding: 40px 15%;
    }
    .resume .price h2 {
        margin-top: 0;
    }
}


/*-------- Frete do Pagamento --------*/

.freight {
    width: 100%;
    float: left;
    padding: 40px 20px;
    padding-top: 0;
}

.freight h2 {
    margin: 0;
    font-size: 1.5em;
    font-weight: bold;
    color: #000034;
    margin-bottom: 20px;
}

.freight [type="radio"]:not(:checked)+span,
.freight [type="radio"]:checked+span {
    height: auto !important;
}

.freight hr {
    width: 100%;
    height: 1px;
    background-color: #d8d8d8;
    border: none;
    margin-bottom: 40px;
}

.freight .flex {
    display: flex;
    align-items: center;
    overflow: auto;
    position: relative;
}

.freight p {
    min-width: 50% !important;
    border: 1px solid #9e9e9e;
    padding: 10px;
    margin-right: 10px;
    color: #000034;
}

.freight span {
    line-height: 1.25em !important;
    font-size: 1.25em !important;
}

.freight strong {
    width: 100%;
    float: left;
    font-size: 1.25em;
    color: #000034;
    margin-top: 5px;
}

.freight [type="radio"]:not(:checked)+span,
.freight [type="radio"]:checked+span {
    margin-right: 20px;
}

.freight [type="radio"]:not(:checked)+span:before,
.freight [type="radio"]:not(:checked)+span:after {
    border: 1px solid #9e9e9e !important;
}

.freight [type="radio"]:checked+span:after,
.freight [type="radio"].with-gap:checked+span:before,
.freight [type="radio"].with-gap:checked+span:after {
    border: 2px solid #000034;
}

.freight [type="radio"]:checked+span:after,
.freight [type="radio"].with-gap:checked+span:after {
    background-color: #000034;
}

.freight [type="radio"]+span:before,
.freight [type="radio"]+span:after {
    width: 20px;
    height: 20px;
    top: -3px;
}

@media(min-width: 601px) {
    .freight {
        padding: 40px 15%;
    }
    .freight .flex {
        justify-content: space-between;
    }
    .freight .flex p:last-of-type {
        margin-right: 0;
    }
    .freight p {
        min-width: calc(100% / 4 - 10px) !important;
    }
}


/*-------- Checkout --------*/

.checkout {
    width: 100%;
    float: left;
    padding: 40px 20px;
    padding-top: 0;
}

.checkout h2 {
    margin: 0;
    font-size: 1.5em;
    font-weight: bold;
    color: #000034;
    margin-bottom: 20px;
}

.checkout hr {
    width: 100%;
    height: 1px;
    background-color: #d8d8d8;
    border: none;
    margin-bottom: 40px;
}

.checkout .tabs {
    height: 120px !important;
    white-space: normal !important;
}

.checkout .tabs .tab {
    height: 120px !important;
    line-height: 1.5em !important;
    display: flex !important;
    align-items: center;
    border: 1px solid #D8D8D8 !important;
}

.checkout .tabs .tab:first-of-type {
    border-right: none !important;
}

.checkout .tabs .tab a {
    color: #666 !important;
    height: auto !important;
    font-weight: bold;
    opacity: .5;
    transition: all .5s;
}

.checkout .tabs svg {
    width: 100% !important;
    font-size: 3em;
    margin-bottom: 5px;
}

.checkout .tabs .tab a:hover {
    color: #000034 !important;
    background-color: transparent !important;
}

.checkout .tabs .tab a.active {
    color: #000034 !important;
    background-color: transparent !important;
    opacity: 1;
}

.checkout .tabs .indicator {
    background-color: #000034 !important;
}

.checkout form {
    padding: 20px;
}

.checkout label {
    margin-top: 10px;
    float: left;
    width: 100%;
    position: relative;
    color: #343434;
    font-size: 1em;
}

.checkout input,
.checkout label div {
    background-color: #fff !important;
    padding-left: 1em !important;
    width: calc(100% - 1em) !important;
    color: #232323 !important;
    font-family: Hind Madurai, Arial, sans-serif !important;
    font-size: 1em !important;
    border-radius: 5px !important;
    border: 1px solid #343434 !important;
    margin: 0 !important;
    height: 40px !important;
    box-shadow: none !important;
}

.checkout label div {
    width: 100% !important;
    font-size: .9em !important;
    color: #232323 !important;
}

.checkout input::placeholder {
    color: #737373;
    font-size: 1.1em;
}

.checkout select {
    background-color: #fff;
    border: 1px solid #000034 !important;
    border-radius: 5px !important;
}

.checkout .dropdown-content li>a,
.checkout .dropdown-content li>span {
    color: #666;
    font-weight: bold;
    padding: 8px 24px;
}

.checkout .dropdown-content li {
    min-height: auto !important;
}

.checkout .dropdown-content.select-dropdown::-webkit-scrollbar-track {
    background-color: #F4F4F4;
}

.checkout .dropdown-content.select-dropdown::-webkit-scrollbar {
    width: 6px;
    background: #F4F4F4;
}

.checkout .dropdown-content.select-dropdown::-webkit-scrollbar-thumb {
    background: #dad7d7;
}

.checkout hgroup {
    width: 100%;
    float: left;
    padding: 40px .75rem;
    padding-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.checkout hgroup h2 {
    margin: 5px 0;
    font-size: 1.5em;
    color: #000;
}

.checkout p {
    font-size: 1.1em;
    line-height: 1.25em;
    display: flex;
    align-items: center;
}

.checkout p svg {
    background-color: #666;
    width: 50px !important;
    height: 50px;
    padding: 12px;
    color: white;
    border-radius: 50%;
    margin-right: 10px;
}

.checkout button.btn {
    width: 100% !important;
    height: 60px !important;
    background-color: #04D483 !important;
    box-shadow: none !important;
    font-weight: bold;
    font-size: 1.1em;
    color: white !important;
    line-height: 60px !important;
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.checkout #pix img {
    width: 100%;
    height: auto;
    padding: 40px;
}

.checkout #pix label {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
}

.checkout #pix input {
    border-radius: 5px 0 0 5px !important;
    height: 2.5em !important;
}

.checkout #pix .btn {
    background-color: #000034 !important;
    text-transform: none !important;
    height: 2.65em !important;
    width: 150px !important;
    font-size: 1em !important;
    line-height: 1em !important;
    border-radius: 0 5px 5px 0;
    font-weight: normal;
}

@media(min-width: 601px) {
    .checkout fieldset {
        display: flex;
        justify-content: center;
    }
    .checkout form {
        max-width: 450px;
    }
    .checkout {
        padding: 40px 15%;
    }
    .checkout .tabs {
        display: flex;
        justify-content: center;
    }
    .checkout .tabs .tab {
        width: calc(100% / 4) !important;
        margin: 0 !important;
    }
}


/*-------- Thank You Page --------*/

.thanks {
    min-height: calc(100vh - 118px);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
    text-align: center;
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.thanks .wave {
    width: 100%;
    position: absolute;
    z-index: -1;
    bottom: -5px;
}

.thanks .wave path {
    fill: #000034;
}

.thanks article {
    padding: 40px;
}

.thanks article svg {
    color: #40cd28;
    font-size: 6em;
    margin-bottom: 20px;
}

.thanks h1 {
    color: #000034;
    font-weight: bold;
    font-size: 2em;
    margin: 0;
    font-family: Hind Madurai Bold, Arial, sans-serif !important;
}

.thanks h2 {
    color: #666;
    font-size: 1.25em;
    margin: 0;
}

.thanks p {
    font-size: 1.5em;
    line-height: 1.25em;
    color: #666;
    margin: 15px auto;
    max-width: 380px;
    text-align: center;
}

.thanks q {
    width: 100%;
    float: left;
    font-size: 1.25em;
    font-weight: bold;
    margin-bottom: -5px;
}

.thanks q::before {
    content: '';
}

.thanks cite {
    font-style: italic;
    width: 100%;
    float: left;
}

.thanks .btn {
    margin-top: 10px;
    width: 100% !important;
    height: 60px !important;
    background-color: #04D483 !important;
    box-shadow: none !important;
    font-weight: bold;
    font-size: 1.1em;
    color: white !important;
    line-height: 60px !important;
    font-family: Hind Madurai, Arial, sans-serif !important;
    text-transform: none;
}

@media(min-width: 601px) {
    .thanks {
        min-height: calc(100vh - 129px);
    }
    .thanks .wave {
        bottom: -100px;
    }
}


/*-------- Depoimentos --------*/

.depoimentos {
    font-family: Hind Madurai, Arial, sans-serif !important;
    padding: 30px;
}

.depoimentos h2 {
    font-size: 1.25em;
    line-height: 1.5em;
    color: #777;
    margin-bottom: 0;
}

.depoimentos hr {
    width: 150px;
    height: 2px;
    border: none;
    background-color: #000034;
    margin-bottom: 2em;
    float: left;
}

.depoimentos strong {
    font-family: Hind Madurai Bold, Arial, sans-serif !important;
    color: black;
    float: left;
    width: 100%;
    font-size: 1.5em;
}

.depoimentos .item {
    border: 1px solid #e8e8e8;
    border-radius: 10px;
    padding: 20px !important;
    padding-bottom: 15px !important;
}

.depoimentos .flex {
    display: flex;
    align-items: center;
}

.depoimentos img {
    width: 50px !important;
    height: 50px;
    object-fit: cover;
    border-radius: 50%;
    margin-right: 10px;
}

.depoimentos .flex svg {
    width: 50px !important;
    height: 50px;
    color: #000034;
    margin-right: 10px;
}

.depoimentos h3 {
    font-size: 1.25em;
    font-family: Hind Madurai Bold, Arial, sans-serif !important;
    margin: 0;
}

.depoimentos h4 {
    font-size: 1.1em;
    font-family: Hind Madurai, Arial, sans-serif !important;
    margin: 0;
    color: #999;
}

.depoimentos p {
    font-size: 1.25em;
    line-height: 1.25em;
    color: #666;
}

.depoimentos .estrelas {
    border-top: 1px solid #e8e8e8;
    padding-top: 10px;
}

.depoimentos .estrelas svg {
    color: #FF9800;
}

.depoimentos .owl-nav button {
    position: absolute;
    top: calc(50% - 20px);
    width: 40px;
    height: 40px;
    border: 1px solid #e8e8e8;
    color: #666;
    background-color: white;
    transition: all .5s;
    font-size: 2em;
}

.depoimentos .owl-next {
    right: -25px;
    padding-left: 10px;
}

.depoimentos .owl-prev {
    left: -25px;
    padding-right: 10px;
}

.depoimentos .owl-prev.disabled {
    transform: scale(0);
}

.depoimentos .owl-next.disabled {
    transform: scale(0);
}

.depoimentos .owl-dots {
    display: none;
}

@media(min-width: 601px) {
    .depoimentos {
        padding: 3%;
    }
    .depoimentos h2 {
        text-align: center;
    }
    .depoimentos h3 {
        font-size: 1em;
    }
    .depoimentos hr {
        float: none;
    }
}


/*-------- Instagram --------*/

.instagram {
    font-family: Hind Madurai, Arial, sans-serif;
    padding: 30px;
}

.instagram h2 {
    font-size: 1.25em;
    line-height: 1.5em;
    color: #777;
    margin-bottom: 0;
}

.instagram hr {
    width: 150px;
    height: 2px;
    border: none;
    background-color: #047adb;
    margin-bottom: 2em;
    float: left;
}

.instagram strong {
    font-family: Hind Madurai Bold, Arial, sans-serif !important;
    color: black;
    float: left;
    width: 100%;
    font-size: 1.5em;
}

.instagram a {
    width: 100% !important;
    border-radius: 10px;
}

.instagram img {
    display: none;
}

@media(min-width: 601px) {
    .instagram {
        padding: 3%;
    }
    .instagram h2 {
        text-align: center;
    }
    .instagram hr {
        float: none;
    }
    .instagram a {
        width: calc(100% / 3 - 2%) !important;
    }
}

@media(min-width: 993px) {
    .instagram a {
        margin: 5px !important;
        width: calc(100% / 6 - 10px) !important;
    }
}


/*-------- Politicas --------*/

.politics {
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.politics .breadcrumbs {
    padding: 20px;
}

.politics .breadcrumbs a {
    text-transform: none;
}

.politics .breadcrumbs li:first-child a {
    color: #000034 !important;
    text-decoration: underline;
}

.politics article {
    padding: 40px 0;
}

.politics h1 {
    font-size: 2em;
    font-weight: bold;
    color: #000034;
    margin: 0;
}

.politics p {
    font-size: 1em;
    line-height: 1.25em;
}

.politics h2,
.politics h3,
.politics h4,
.politics h5,
.politics h6 {
    font-size: 1.5em;
    font-weight: bold;
    color: #000034;
    margin: 0;
    margin-top: 20px;
}


/*-------- Footer --------*/

.footer {
    background-color: #fff !important;
    padding: 20px;
    font-family: Hind Madurai, Arial, sans-serif !important;
    border-top: 1px solid #e8e8e8;
}

.footer h2 {
    font-size: 1.5em;
    color: #000034;
    font-family: Hind Madurai Bold, Arial, sans-serif !important;
    text-transform: uppercase;
}

.footer li {
    line-height: 1.75em !important;
}

.footer li a {
    color: #333;
}

.footer p {
    color: #333;
    margin: 0;
}

.footer article:nth-of-type(3) li a {
    color: #777;
    font-size: 1.25em;
}

.footer article:nth-of-type(3) .btn {
    background-color: #fff !important;
    border: 1px solid #000034;
    border-radius: 5px !important;
    color: #000034;
    font-weight: bold;
    box-shadow: none;
    margin-top: 10px;
}

.footer form {
    box-shadow: 0 0 2px 0px rgba(0, 0, 0, 0.3);
    margin-top: 10px !important;
    padding: 10px !important;
    border-radius: 5px !important;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
}

.footer input {
    border: none !important;
    color: #999 !important;
    margin: 0 !important;
    padding: 0 10px !important;
    height: 2.5em !important;
}

.footer input::placeholder {
    color: #999;
}

.footer input:focus {
    box-shadow: none !important;
}

.footer form .btn {
    border-radius: 5px !important;
    box-shadow: none;
    background-color: #000034 !important;
    padding: 0 15px !important;
    padding-right: 30px !important;
    height: 3em !important;
}

.footer article:nth-of-type(4) section:nth-of-type(2) ul {
    display: flex;
    align-items: center;
    justify-content: center;
}

.footer article:nth-of-type(4) svg {
    font-size: 2em;
    margin: 0 10px !important;
    color: #777;
}

@media(min-width: 601px) {
    .footer h2 {
        font-size: 1.25em;
    }
    .footer article:nth-of-type(3) li a {
        font-size: 1em;
    }
}

.footer-links {
    background-color: #000034;
    padding: 20px;
    font-family: Hind Madurai, Arial, sans-serif !important;
}

.footer-links ul {
    display: flex;
    justify-content: space-between;
    flex-wrap: nowrap;
    position: relative;
    overflow: auto;
    width: 100%;
}

.footer-links ul::-webkit-scrollbar-track {
    display: none;
}

.footer-links ul::-webkit-scrollbar {
    display: none;
}

.footer-links ul::-webkit-scrollbar-thumb {
    display: none;
}

.footer-links li {
    min-width: max-content;
}

.footer-links li a {
    min-width: 100%;
    color: #fff;
    font-size: 1.1em;
    line-height: 2.5em;
    padding: 10px 20px;
    transition: all .5s;
}

.footer-links li a:hover {
    font-weight: bold;
    background-color: #fff;
    color: #000034;
    opacity: .5;
}

.footer-links h2 {
    font-size: 1.1em;
    color: white;
    text-align: center;
    margin: 0;
}

.footer-links h3 {
    font-size: 1em;
    color: white;
    text-align: center;
    margin: 0;
}

.footer-links h3 a {
    color: #fff;
    font-weight: bold;
}


/*-------- TIPOGRAFIA --------*/

@font-face {
    font-family: 'Hind Madurai';
    src: url(../fonts/hindmadurai.ttf);
}

@font-face {
    font-family: 'Hind Madurai Bold';
    src: url(../fonts/hindmadurai-bold.ttf);
}

@font-face {
    font-family: 'FontAwesome';
    src: url(../fonts/fontawesome.ttf);
}

button {
    cursor: pointer !important;
}

.row {
    margin-bottom: 0 !important;
}

nav {
    color: #000 !important;
    background-color: transparent !important;
    width: initial !important;
    height: initial !important;
    line-height: initial !important;
    box-shadow: none !important;
}

address {
    font-style: normal;
}

cite {
    font-style: normal;
}

strong {
    font-weight: bold !important;
}

figcaption {
    display: none !important;
}

figure {
    margin: 0 !important;
}

fieldset {
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
}