@media (max-width: 991.98px) {

    /* Inicio: Fontes*/
    .title1 {
        font-family: "Darker Grotesque", sans-serif;
        font-size: 48px;
        line-height: 56px;
        font-weight: 900;
        letter-spacing: 0;
    }

    .title2 {
        font-family: "Darker Grotesque", sans-serif;
        font-size: 32px;
        line-height: 40px;
        font-weight: 900;
        letter-spacing: 0;
    }

    .title3 {
        font-family: "Manrope", sans-serif;
        font-size: 24px;
        line-height: 32px;
        font-weight: 400;
        letter-spacing: 0;
    }

    .title4 {
        font-family: "Darker Grotesque", sans-serif;
        font-size: 20px;
        line-height: 28px;
        font-weight: 900;
        letter-spacing: 0;
    }

    .title5 {
        font-family: "Darker Grotesque", sans-serif;
        font-size: 16px;
        line-height: 24px;
        font-weight: 900;
        letter-spacing: 0;
    }

    .title6 {
        font-family: "Darker Grotesque", sans-serif;
        font-size: 14px;
        line-height: 22px;
        font-weight: 800;
        letter-spacing: 0;
    }

    /* Fim: Fontes*/

    #mainMenu-trigger {
        position: relative;
        opacity: 1;
        visibility: visible;
        float: left;
        padding-left: 28px;
        height: 86px;
    }

    .header-extras {
        float: right;
        padding-right: 28px;
        height: 84px;
    }

    .header-extras>ul>li>a:not(.btn),
    .header-extras>ul>li .topbar-dropdown>.title,
    #header .header-inner #logo,
    #header #header-wrap #logo,
    #header .header-inner {
        height: 84px;
    }


    #header {
        height: 88px;
        line-height: 88px;
        border-bottom: 4px solid #E8412C;
    }

    #header .header-inner #logo a {
        margin: 0 0 0 75px;
    }

    #header #logo {
        text-align: left;
    }

    #header .header-inner #logo a>img {
        display: block;
        height: 20px;
        margin-bottom: 0px;
        padding: 0;
    }

    .header-extras iconify-icon svg {
        width: 20px;
        height: 20px;
    }

    iconify-icon.mAberto {
        display: none;
    }

    .lines-button.toggle-active iconify-icon.mAberto {
        display: block;
    }

    .lines-button.toggle-active iconify-icon.mFechado {
        display: none;
    }

    body.mainMenu-open #header {
        height: 88px;
        line-height: 88px;
        border-bottom: none;
        border-top: 4px solid #E8412C;
    }

    .mainMenu-open #header #mainMenu {
        width: 100%;
        display: block;
        opacity: 1;
        overflow-y: scroll;
        background-color: var(--white);
        margin-top: -4px;
        padding: 0px 32px;
    }

    #mainMenu:not(.menu-overlay) nav>ul.extraMobile>li>a {
        font-size: 14px;
        border: 0;
        border-radius: 0;
        font-weight: 800;
        margin: 0;
        padding: 0;
        display: flex;
        height: auto;
        margin-bottom: 16px;
        gap: 16px;
        align-items: center;
    }

    #mainMenu:not(.menu-overlay) nav>ul.extraMobile>li>a .title6 {
        font-weight: 800;
        margin: 0;
    }

    #mainMenu nav>ul>li>a iconify-icon {
        color: var(--gray-dark);
        margin-right: 0px;
    }

    .mobSearch {
        align-items: center;
        border-bottom: 1px solid #F5F5F5;
        margin-top: 32px;
        margin-bottom: 64px;
    }

    .mobSearch .seaarch-icon {
        margin-left: 16px;
    }

    .menuMobile .menu2 iconify-icon {
        color: var(--gray-medium);
    }

    .menuMobile .menu2:hover iconify-icon {
        color: var(--accent);
    }

    #footer .footer-content {
        padding: 32px 32px 0px 32px;
    }

    #footer .copyright-content {
        padding: 0px 12px 13px 12px;
    }

    #footer .footer-logo {
        padding: 64px 12px 16px 12px;
    }

    .widget {
        margin-bottom: 64px;
        position: relative;
    }

    .p-4 {
        padding: 0px 4px !important;
    }

    .header-ext-garantia {
        bottom: auto;
        left: 12px;
        width: calc(100vw - 32px);
        max-width: none;
        padding: 20px 32px 20px 32px;
    }

    .header-sobre-nos {
        bottom: 0;
        left: 12px;
        max-width: none;
        width: calc(100vw - 32px);
        padding: 20px 32px 20px 32px;
    }

    .header-sobre-nos .hsn-title .title5 {
        text-decoration: unset;
    }

    #bannerPrincipal .texto {
        position: absolute;
        top: 100px;
        left: 28px;
    }

    .numberHeader {
        color: var(--white);
    }

    #marcas {
        padding: 0px 16px;
        height: 128px;
        margin-bottom: 4px;
    }

    #footer {
        width: calc(100vw - 8px);
    }

    #destaques {
        padding: 0 0px 64px 16px;
    }

    .bg-marcas {
        padding: 32px 1px 32px 64px;
    }

    #carouselMarcas.owl-carousel .owl-item img {
        display: block;
        width: auto;
        height: 32px;
    }

    #carouselCategorias.owl-carousel .owl-nav button.owl-next,
    #carouselDestaques.owl-carousel .owl-nav button.owl-next {
        right: 16px;
    }

    #carouselCategorias.owl-carousel .owl-nav button.owl-prev,
    #carouselDestaques.owl-carousel .owl-nav button.owl-prev {
        left: auto;
        right: 74px;
    }

    #cont2 {
        padding: 0px 16px 128px 16px;
        max-height: fit-content;
    }

    #cards {
        margin-bottom: 128px;
        padding: 0 16px;
    }

    #cards .card1 .conteudo {
        position: absolute;
        top: 32px;
        left: 34px;
        z-index: 3;
    }

    #cards .card2 .conteudo {
        position: absolute;
        top: 32px;
        left: 34px;
        z-index: 3;
    }

    #cards .card2 .produt-img {
        right: -164px;
        top: 52px;
        background-position: bottom;
    }

    #cards .card1 .produt-img {
        bottom: 4px;
        right: -64px;
    }

    #cards .card1.image-container {
        margin-bottom: 8px;
    }

    #categorias {
        padding: 0px 0px 32px 16px;
    }

    #carouselCont2 {
        width: calc(100vw - 16px);
    }

    #cont2 .img-background {
        margin-bottom: 16px;
    }

    #cont2 .conteudo {
        left: 32px;
    }

    #headerIndex {
        padding: 0px 4px 32px;
        width: calc(100vw - 0px);
    }

    #bannerPrincipal.owl-carousel .owl-item img {
        height: 552px;
        object-fit: cover;
        border-radius: 2px;
        margin-left: 0px;
    }

    #GridProdutos {
        padding: 0 12px 0px;
        width: calc(100vw - 8px);
        margin-left: 4px;
        margin-bottom: 48px;
        background-color: var(--menus-bg);
    }

    .info-page {
        padding: 16px 0px 64px;
    }

    .pd-28 {
        padding: 0 28px;
    }

    #carouselGridProdutos {
        padding: 0 28px;
    }

    #carouselGridProdutos.owl-carousel .owl-nav button.owl-prev {
        left: -16px;
    }

    #carouselGridProdutos.owl-carousel .owl-nav button.owl-next {
        right: -16px;
    }

    #ListagemProdutos {
        padding: 0px 16px 32px;
    }

    .botoesfiltros {
        display: flex;
        justify-content: flex-end;
        gap: 16px;
    }

    .PagNumber {
        margin-top: 48px;
    }

    .filtrosListagem {
        flex-direction: row-reverse;
        justify-content: space-between;
    }

    .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        width: calc(100vw - 16px);
    }

    .table td {
        min-width: 120px;
    }

    #ProdutoInformacoes .info-page {
        padding: 16px 20px 16px;
    }

    .extrabuttons {
        position: absolute;
        top: 142px;
        left: auto;
        right: 12px;
        z-index: 4;
    }

    .favProduto {
        background-color: transparent;
        border: 1px solid transparent;
        width: 32px;
        height: 32px;
        padding: 4px;
        margin-bottom: 0px;
        border-radius: 2px;
    }

    .favProduto:hover {
        background-color: transparent;
        border: 1px solid transparent;
        width: 32px;
        height: 32px;
        padding: 4px;
        margin-bottom: 0px;
        border-radius: 2px;
    }

    .favProduto iconify-icon {
        color: #CCCCCC;
    }

    .favProduto.active iconify-icon {
        color: var(--accent);
    }

    #ImagesMobile {
        padding: 0 4px;
        margin-bottom: 32px;
    }

    #ImagesMobile .item {
        position: relative;
        aspect-ratio: 1 / 1;
        background-color: #F5F5F5;
        margin-bottom: 0px;
        border-radius: 2px;
    }

    #ImagesMobile .item img {
        width: 100%;
        height: 100%;
        object-fit: contain;
        mix-blend-mode: multiply;
    }

    #ImagesMobile.owl-theme .owl-dots .owl-dot span {
        width: 49px;
        height: 2px;
        margin: 0 4px;
        background: #E0E0E0;
        display: block;
        -webkit-backface-visibility: visible;
        transition: opacity .2s ease;
        border-radius: 0px;
    }

    #ImagesMobile.owl-theme .owl-nav.disabled+.owl-dots {
        margin-top: 0;
        position: absolute;
        bottom: 12px;
        width: 100%;
    }

    #ImagesMobile.owl-theme .owl-dots .owl-dot.active span,
    #ImagesMobile .owl-theme .owl-dots .owl-dot:hover span {
        background: var(--accent);
    }

    .listagem {
        padding: 0 16px;
    }

    body {
        overflow-x: hidden;
    }

    #carouselAvaliacoes {
        margin-top: 32px;
        padding: 0 16px;
    }

    .listaAvaliacoes {
        margin-bottom: 128px;
    }

    #carouselAvaliacoes.owl-carousel .owl-nav button.owl-prev {
        left: -16px;
    }

    #carouselAvaliacoes.owl-carousel .owl-nav button.owl-next {
        right: -16px;
    }

    #addProd.btn-adicinar {
        width: 100%;
    }

    #tamanhosMobile {
        margin-bottom: 24px;
    }

    #tamanhosMobile .cardMobile {
        margin-bottom: 8px;
        padding: 16px;
        background-color: #FAFAFA;
        border-radius: 2px;
    }

    #tamanhosMobile .cardMobile .caption {
        color: #8F8F8F;
    }

    #tamanhosMobile .cardMobile .caption b {
        color: #292929;
    }

    #tamanhosMobile .cardMobile .title5 {
        color: #E0543E;
    }

    #tamanhosMobile .cardMobile .title5.text-decoration-line-through {
        color: #8F8F8F;
        font-weight: 400;
    }

    .politicas {
        padding: 96px 32px;
    }

    .quemSomos {
        padding: 0 4px 64px;
    }

    .quemSomos .conteudo {
        position: absolute;
        z-index: 1;
        top: 96px;
        left: 28px;
        padding-right: 28px;
    }

    .quemSomos .img-background {
        width: 100%;
        height: 468px;
        object-fit: cover;
        object-position: 40% 50%;
    }

    .quemSomos .image-container {
        position: relative;
        display: inline-block;
        width: 100%;
        margin-left: 0;
        margin-bottom: 64px;
    }

    .quemSomos .title4 {
        margin-bottom: 32px;
        margin-top: 0;
        color: #292929;
        padding: 0 28px;
    }

    .quemSomos .text {
        margin-bottom: 32px;
        color: #8F8F8F;
        padding: 0 28px;
    }

    .quemSomos .title2 {
        color: #FFFFFF;
    }

    .quemSomos .title3 {
        color: #FFFFFFB8;
    }

    .quemSomos .image-container::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        pointer-events: none;
        border-radius: 2px;
        background: linear-gradient(180deg, #0C1114 0%, rgba(12, 17, 20, 0) 100%);
    }

    .login .img img {
        height: 400px;
        width: 100%;
        object-fit: cover;
        padding: 0 4px 4px 4px;
        border-radius: 2px;
    }

    .login .divTexto {
        margin-top: 64px;
        margin-bottom: 96px;
        padding: 0 32px;
    }

    .login .divTexto .title2,
    .login .divTexto .text {
        padding: 0 16px;
    }

    .login .divTexto .Info #BtnLogin {
        margin-left: 16px;
    }

    .login .loginExterno {
        padding: 64px 64px 32px 16px;
    }

    .login .divTexto .inputs {
        padding: 32px 16px 32px 16px;
    }

    #registo .invertMobile {
        flex-direction: column-reverse;
    }

    .tabs.tabs-folder .nav-tabs .nav-item {
        margin-bottom: 0;
        width: 50%;
    }

    .tabs.tabs-folder .nav-tabs .nav-link {
        text-align: center;
    }

    .BannerCriarConta {
        background-color: #FCEFED;
        padding: 16px 32px;
        border-radius: 2px;
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    .recuperarPass {
        padding: 64px 16px;
    }

    .recuperarPass .text,
    .recuperarPass .title2 {
        padding: 0 16px;
    }

    .recuperarPass #BtnLogin {
        margin-left: 16px;
    }

    .recuperarPass .inputs {
        padding: 32px 16px;
    }

    #AreaPessoal {
        padding: 32px 6px 118px;
    }

    #escolhas {
        padding: 0 26px;
    }

    #resumo {
        margin-top: 64px;
        margin-bottom: 64px;
        padding: 0px 16px;
    }

    #IrLoja {
        margin-top: 0px;
        width: 100%;
    }

    #Carrinho,
    #checkout {
        padding: 16px 16px 96px;
    }

    #AreaPessoal #menuAreaPessoal {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        height: 88px;
        border-bottom: 4px solid #E8412C;
        align-items: center;
        position: fixed;
        top: 0px;
        left: 0;
        right: 0;
        padding: 0 28px;
        background-color: #FFFFFF;
        z-index: 2;
    }

    #AreaPessoal {
        margin-top: 32px;
    }

    #VoltarMenuMobile {
        background-color: transparent;
        border: none;
        display: flex;
        align-items: center;
        gap: 16px;
    }

    .contagemCarrinho,
    .contagemFavoritos {
        position: absolute;
        top: 20px;
        right: -8px;
        background: var(--accent);
        border-radius: 100%;
        height: 16px;
        width: 16px;
        display: flex;
        justify-content: center;
        align-items: center;
        color: var(--white);
    }

    #AreaPessoal .informacao #menuAreaPessoal button {
        border: none;
        background: transparent;
        display: flex;
        flex-direction: row;
        gap: 16px;
    }

    .listaMarcas {
        padding: 0 32px;
    }

    .masonry {
        text-align: center;
        column-count: 2;
    }

    #header.header-sticky.sticky-active .header-inner,
    #header.header-sticky.sticky-active #header-wrap {
        box-shadow: none;
        top: 0;
        position: fixed;
        margin: 0 auto;
        width: 100%;
        border-bottom: 4px solid #E8412C;
        height: 88px;
        transition: none;
    }

    #header .header-inner,
    #header #header-wrap {
        transition: none;
    }

    .menuVoltar {
        background-color: transparent;
        border: none;
        width: 100%;
        display: flex;
        align-items: center;
        padding: 32px 0px 64px;
        gap: 16px;
        color: var(--accent);
    }

    .menuVoltar .title3 {
        color: var(--accent);
    }

    .mainMenu-open #header #mainMenu.bg-grey {
        background-color: #FAFAFA;
    }

    #GridBlog,
    #GridCatalogo {
        padding: 0 28px 32px;
        background-color: #FAFAFA;
        width: calc(100% - 8px);
        margin-left: 4px;
    }

    #ListagemCatalogo,
    #ListagemBlog {
        padding: 32px 32px 64px;
    }

    .menu3 .title6 {
        margin: 0;
        color: var(--gray-medium);
    }

    .listaTextoMob {
        height: calc(100vh - 380px);
        overflow-y: auto;
        scrollbar-width: thin;
        scrollbar-color: #E8412C transparent;
        padding-right: 8px;
        list-style: none;
        padding: 0;
    }

    #ModalFilter .modal-dialog {
        position: relative;
        width: 100%;
        height: 100%;
        margin: 0;
        pointer-events: none;
    }

    #ModalFilter .modal-content {
        /* height: 100%; */
        border: 0;
        border-radius: 0;
        padding: 4px;
    }

    #ModalFilter .modal-footer {
        padding: 12px 16px 28px;
        border: 0;
    }

    #ModalFilter .modal-footer>* {
        margin: 0;
    }

    .filtrosListagem #BtnMostrar.btn-principal iconify-icon {
        color: var(--accent);
        border-left: none;
    }

    #ModalFilter #listFiltroMarca {
        padding: 0 16px 0 0;
        max-height: 234px;
        overflow-y: auto;
        scrollbar-width: thin;
        scrollbar-color: #E8412C transparent;
        padding-right: 8px;
        list-style: none;
    }

    .informacao {
        margin-top: 100px;
        padding: 0 12px;
    }

    #areaClienteContentTable .DivPass {
        background-color: #FAFAFA;
        border-radius: 2px;
        padding: 32px 28px;
        margin-bottom: 16px;
    }

    #CarrinhoMenuMobile .contagemCarrinho {
        top: -8px;
    }

    #ModalMorada .modal-dialog {
        position: fixed;
        margin: auto;
        width: 100%;
        height: 100%;
        right: 0px;
    }

    .filtroGeraisInfo {
        flex-direction: row-reverse;
        gap: 16px !important;
    }

    .gap-sm-16 {
        gap: 16px !important;
    }

    .infoProdutoCart {
        display: flex;
        gap: 24px;
        align-items: center;
        margin-top: 8px;
        margin-bottom: 14px;
    }

    .GridCarrinho .infoDisponibilidade {
        margin-top: 0px;
    }

    .cardCarrinho {
        padding: 16px 16px;
        margin-bottom: 16px;
    }

    .cardCarrinho .TotalProduto {
        display: flex;
        align-items: center;
        margin-bottom: 0;
        gap: 8px;
        justify-content: flex-end;
        flex-direction: row;
    }

    .cardCarrinho .cartPrecosCard {
        width: 100% !important;
    }

    .cardCarrinho .cartPrecosCard .row {
        flex-direction: row-reverse;
    }

    .cart-product-quantity .inputValor {
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }

    :root:has(.mainMenu-open),
    :root:has(.modal-open),
    :root:has(.overlay.show) {
        padding-right: 0px;
    }

    .cardPagamento.selecionado .select {
        top: 6px;
    }

    .CardResumo {
        margin: 0;
        padding: 16px 0;
    }

    .CardResumoB,
    .resumoValores {
        padding: 16px;

    }

    .tamanhosInfo {
        display: flex;
        align-items: flex-end;
        justify-content: space-between;
    }

    #GridMoradas,
    #GridEncomendas,
    #GridFaturas,
    #GridPedidoCotacao,
    #GridEquipamentos,
    #GridHistoricoProdutos {
        padding: 0 16px;
    }

    #areaClienteContentTable .InfoEncomenda {
        margin-top: 16px;
        gap: 16px;
    }

    #areaClienteContentTable .totalEncomenda {
        display: flex;
        justify-content: flex-end;
        align-items: flex-start;
        margin-top: 16px;
    }

    #areaClienteContentTable #GridFaturas .listProducts {
        margin-top: 16px;
    }

    #areaClienteContentTable #GridPedidoCotacao .cardsAreaclinete {
        padding: 46px 32px 28px;
    }

    .infoEquipamento {
        margin-bottom: 16px;
    }

    .header-extras iconify-icon,
    #VoltarMenuMobile iconify-icon,
    .lines-button iconify-icon {
        color: var(--gray-dark);
    }

}