@charset "UTF-8";


/* CSS GERAL ( MOBILE FIRST ). As adptações para telas de tablet e desktop se encontra no media_queries.css
*/

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    text-decoration: none;
    list-style: none;
}

body{
    width: 100%;
    height: 100vh;
	font-family:"brandon_grotesqueregular";
}


textarea:focus, input:focus {
    box-shadow: 0 0 0 0;
    outline: 0;
}


@font-face {
    font-family: 'brandon_grotesqueregular';
    src: url('brandon_reg-webfont.woff2') format('woff2'),
         url('brandon_reg-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'brandon_grotesquebold';
    src: url('brandon_bld-webfont.woff2') format('woff2'),
         url('brandon_bld-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* INICIO CSS -> TEMPORARIO APENAS PARA CRIAÇÃO DA PAGINA */

.textoSize0_8 {font-size: 0.8em;}
.textoSize1 {font-size: 1em;}
.textoSize1_1 {font-size: 1.1em;}
.textoSize1_2 {font-size: 1.2em;}
.textoSize1_3 {font-size: 1.3em;}
.textoSize1_4 {font-size: 1.4em;}
.textoSize1_5 {font-size: 1.5em;}
.textoSize2 {font-size: 2em;}

.texto   {font-family:"brandon_grotesqueregular" ;font-style: normal;text-decoration: none;font-weight:normal;color: #000;}
.texto8  {font-size: 8px;}
.texto10 {font-size: 10px;}
.texto12 {font-size: 12px;}
.texto13 {font-size: 13px;}
.texto14 {font-size: 14px;}
.texto15 {font-size: 15px;}
.texto16 {font-size: 16px;}
.texto18 {font-size: 18px;}
.texto20 {font-size: 20px;}
.texto22 {font-size: 22px;}
.texto24 {font-size: 24px;}
.texto26 {font-size: 26px;}
.texto28 {font-size: 28px;}

.textoBold   {font-weight:bold;}
.textoBolder {font-weight:bolder;}
.textoBoldB  {font-family:"brandon_grotesquebold" ;font-weight:bold;}

.textoWhite {color: #fff;}
.textoGray  {color: #444444;}
.textoBlack {color: #000;}
.textoRed   {color:#CC0000;}
.textoBlue  {color:#0000FF;}
.textoViolet{color:#660000;}

.textoCenter  {text-align:center;}
.textoLeft    {text-align:left;}
.textoRight   {text-align:right;}
.textoJustify {text-align:justify;}

.textoUpper {text-transform: uppercase;}

.textoSpace1 {letter-spacing: 1px;}

.textoTruncate {overflow: hidden;text-overflow: ellipsis;}


.inputTextoForm {padding: 10px 10px; height:30px; border-radius: 1px; box-sizing: border-box; border: 1px solid #CCC; outline: none; background-color: #FFF; font-family: "brandon_grotesqueregular";font-size: 14px;}
.inputTextoForm:focus {border: 1px solid #000; background-color: #FFFFCC;}
.inputTextoFormValor {text-align:right;}
.inputTextoForm::placeholder {font: 10px sans-serif;}
.inputTextoFormDisabled {padding: 5px 5px; height:26px; border-radius: 3px; box-sizing: border-box; border: 1px solid #999999; outline: none; background-color:#F0F0F0; font-family: "brandon_grotesqueregular";font-size: 12px;}
.inputSenhaForm {padding: 10px 26px 10px 10px;}


/* ______________ CSS MOBILE FIRST ______________ */


.owl-carousel .prev-arrow {
    position: absolute;
    left: 0;
    top: 50%;
    font-size: 40px;
}

.owl-carousel .next-arrow {
    position: absolute;
    right: 0;
    top: 50%;
    font-size: 40px;
}

.owl-carousel .owl-item {
    display: flex;
    justify-content: center;
}




/* DISPLAY DE PRODUTOS */
.produto { position:relative; min-width: 300px;width: 300px;height: 500px;display: flex;flex-direction: column;flex-shrink: 0;justify-content: space-evenly;align-items: center;border: 1px solid lightgray;box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.19);}
.produto .img {width: 275px;height: 275px;object-fit: cover;}
.produto .descricao {width: 100%;height: 60px;padding: 0 15px;}
.produto .valor {height: 30px; display: flex;flex-direction: column;justify-content: space-evenly;}


/*Owl carrossel*/
.owl-dot > span {border-radius: 0;}
.owl-dots {width:100%; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);}

.bloco_produtos_slider .owl-dots , .bloco_img_e_pro .owl-dots, .bloco_kits .owl-dots { bottom: -30px;}
/*Owl carrossel*/

.main_header{width: 100%; display: flex;flex-direction: column;justify-content: space-between;}
.main_content {background-color: white;display: flex;flex-direction: column;justify-content: center;align-items: center;}

#menu_top { width: 100%; position: fixed;top: 0;transition: 0.25s; z-index: 2}

.menu_invisible{display: none;}
.menu_hover {background-color: #ffffff;}

/* ---------------- DROPDOWN VERTICAL ------------------ */
.DropDown-Vertical {
    display: flex;
    flex-direction: column;
    color: black;
}
.DropDown-Vertical .DropDown-Container {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    border-top: 1px solid #f1f1f1;
    border-left: 1px solid #f1f1f1;
    border-right: 1px solid #f1f1f1;
    border-radius: 6px;
    background-color: white;
}
.DropDown-Vertical .DropDown-Container:last-child {
    border-bottom: 1px solid #f1f1f1;
}
.DropDown-Vertical .DropDown-Trigger {
    padding: 20px;
    border: 0;
    background-color: transparent;
    cursor: pointer;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}
.DropDown-Vertical .DropDown-Result {
    min-height: 0px;
    width: 100%;
    overflow: hidden;
    transition: height 0.5s ease;
}
.DropDown-Vertical * {
    color: #000;
}


.featured_header {width: 100%;padding: 6px;background-color:black;color: white; text-align: center;}

.menu_top-hover {background-color: #ffffff;}
.menu_top-hover .hover_menu , .menu_top-hover .hover_menu::placeholder, .menu_top-hover .box_border, .menu_top-hover .burguer {color: black; border-color: black;}
.menu_top-hover .nav_area > ul > li:hover > a {color: white;}
.menu_top-hover .featured_header {color: white;}

#menu-mobile .search_box {color: black;border-color: black;display: flex;width:100%;padding:30px 15px 5px 15px;margin-bottom:30px;justify-content: space-between; align-items: center;position: relative;}
#menu-mobile .search_box input {border: 0;background-color: transparent;font-size: 0.9em;letter-spacing: 1px;color: black;}
#menu-mobile .search_box label {cursor: pointer;font-size: 1.8em;color: black;border-color: black;}
#menu-mobile .search_box .box_border {color: black ;width: 100%;padding:0 30px;height: 1px;border-bottom:2px solid #bcbcbc;position: absolute;left: 0px;bottom: 0px;}


/* [CABEÇALHO] ---> MENU DO CABEÇALHO ----- */
.header_menu {height: 65px; padding: 30px 15px 0px 15px; display: flex;justify-content: space-between;align-items: flex-end; flex-flow: row nowrap;}
.header_menu .left_menu {display: flex;width:100%;max-width: 250px;justify-content: flex-start; align-items: center; padding-left: 15px; position: relative; }
#input_search, #input_search_mobile {background-color: transparent;font-size: 0.9em;letter-spacing:1px;}
#input_search {display:none;}
.header_menu .left_menu #icon_search {display: none;font-size: 1.8em;}
.header_menu .left_menu .burguer {display: block;user-select: none; cursor:pointer;}
.header_menu .left_menu label {font-size: 1.8em;}
.header_menu .logo {width:120px; object-fit: cover;cursor: pointer;}
.header_menu .left_menu .box_border {display: none; width: 100%; height: 1px; border-bottom: 1px solid white; position: absolute;left: 0px; bottom: 7px;}
.header_menu .right_menu {display: flex;width:100%;max-width: 250px;justify-content:flex-end;gap: 5px;}
.header_menu .right_menu a {width: auto;color: white;}
#icon_login, #icon_shop, .burguer {font-size: 23px;}

#input_search, #input_search::placeholder, #icon_search ,#icon_login, #icon_shop, .burguer, #pontoslovers * {color: white;transition: 0.25s;}
.menu_top-hover #input_search, .menu_top-hover #input_search::placeholder, .menu_top-hover #icon_search ,.menu_top-hover #icon_login, .menu_top-hover #icon_shop,.menu_top-hover .burguer, .menu_top-hover #pontoslovers * , .menu_top-hover .header_menu .left_menu {color: black;border-color: black;}


/* [CABEÇALHO] ---> NAVEGAÇÃO DO CABEÇALHO ----- */
.header_nav {font-family:"brandon_grotesqueregular";  display: flex; flex-direction: column; align-items: center; user-select: none;}
/* [CABEÇALHO] ---> MENU DA NAVEGAÇÃO DO CABECALHO ----- */
.nav_area {width:100%; display: flex;justify-content: center;align-items: center;text-align: center; border: 1px solid rgba(0, 0, 0, 0.429); font-size: 1em;text-transform: uppercase; z-index: 2;}
.nav_area ul , .nav_area li , .nav_area a {width: 100%;list-style: none;text-decoration: none;color: white;flex-direction: column;transition: 0.25s;}
.nav_area a {padding: 8px 10px;}
.nav_area > ul { display: flex;justify-content: center;align-items: center;gap: 10px}
.nav_area > ul > li {display: flex;align-items: flex-start;position: relative;}
.nav_area > ul > li:hover a {background: black;color:#fff;}
.nav_area > ul > li:hover > ul {display: flex;}
.nav_area > ul > li > ul {display: none;position: relative;top: 100%;background: #4082fd;}
.nav_area > ul > li > ul > li {display: flex;}
.nav_area > ul > li > ul > li > a {text-align: center; min-width: 160px;}
.nav_area > ul > li > ul > li:hover > a { background: white; color: black; }

.featured_advertising .slider {max-width: none;}
.featured_advertising .img {width: 100%; object-fit: cover;}

#carrosel {overflow: hidden;width: 100%;}
#carrosel .slides{display: flex;transition: transform 0.5s ease-in-out; transform: translateX(0); gap: 0;}
#carrosel .slide {width:100vw; object-fit: cover;}



/* [BLOCO] ----> BLOCO PRODUTOS --- */
.bloco_produtos_multi , .bloco_produtos_slider, .bloco_kits, .bloco_kitsmulti {margin: 70px 0;width: 100%;display: flex;
flex-direction: column;justify-content: center;align-items: center;}
.bloco_produtos_multi > .container, .bloco_kitsmulti > .container {width: 100%;display: flex;flex-direction: row;justify-content: center;align-items: center;flex-wrap: wrap;gap: 15px;}

/* [BLOCO] ----> BLOCO BANNERS -- */
.bloco_banners  {width: 100%;margin: 70px 0;display: flex;}
.bloco_banners ul {width: 100%;display: flex;justify-content: center;align-items: center;flex-flow: row wrap;list-style: none;}
.bloco_banners img {width:100%; object-fit: cover; margin: 0 -1px;}

/* [BLOCO] ----> BLOCO IMAGEM -- */
.bloco_img {width: 100%;margin: 70px 0;display: flex;justify-content: center;align-items: center; padding: 0 10px;}
.bloco_img a {width: 100%;cursor: pointer;}
.bloco_img img {width: 100%;object-fit: cover;}


/* [BLOCO] ----> BLOCO IMAGEM E PRODUTOS -- */
.bloco_img_e_pro {width: 100%;display: flex;flex-flow: column nowrap;justify-content: space-evenly;align-items: center; margin: 70px 0; padding: 0 10px;}
.bloco_img_e_pro > .img {width: 100%;}
.bloco_img_e_pro > .container {width: 100%; display: flex; justify-content: center; align-items: center;}
.bloco_img_e_pro .banner {width: 100%;object-fit: cover;}

/* [BLOCO] ----> BLOCO IMAGEM E TEXTO -- */
.bloco_img_e_txt {display: flex;flex-direction: column;width: 100%;max-width: 400px;height: 800px;margin: 70px 0px; padding: 0 10px;}
.bloco_img_e_txt > .banner {width: 100%;height: 50%;}
.bloco_img_e_txt > .banner > img {width: 100%;height:100%;}
.bloco_img_e_txt > .container {width: 100%;height: 50%;display: flex;flex-direction: column;justify-content: space-evenly;align-items: center;background-color: #F6F6F6;overflow: hidden;}
.bloco_img_e_txt .titulo , .bloco_img_e_txt .texto {padding: 15px;}

/* [BLOCO] ----> BLOCO TEXTO -- */
.bloco_txt {display: flex;flex-direction: column;justify-content: space-evenly;align-items: center;width: 100%; max-width: 400px;margin: 70px 0px;background-color: #F6F6F6; border-radius: 20px;}
.bloco_txt .titulo ,.bloco_txt .texto {padding: 15px;}

/* [BLOCO] ----> BLOCO TITULO -- */
.bloco_tit {width: 100%;display: flex;justify-content: center;align-items: center;}
.bloco_tit > .banner {width: 100%;object-fit: cover;}


/*INICIO CSS -> FOOTER PRINCIPAL*/
.main_footer {width: 100%;display: flex;flex-direction: column;align-items: center; justify-content: space-evenly;flex-wrap: nowrap; padding:0 70px; margin-top: 30px; color: black;letter-spacing:1px;} 
.main_footer a {cursor: pointer; color: black;}
.main_footer .informative{ width: 100%;min-height: 400px;display:flex; flex-direction: column; justify-content: space-between;align-items: center; flex-wrap: nowrap; gap: 20px; margin: 0px 124px; padding:70px 0 20px 0;}
.main_footer .logos {display: flex; gap: 17px; flex-wrap: wrap; justify-content: center; align-items: center;}
/*FIM CSS -> FOOTER PRINCIPAL*/
.main_footer .block_infor{display: flex; flex-direction: column;gap: 25px;flex-wrap: nowrap;}
.main_footer .block_infor.one{width: 100%;display: flex;justify-content: center; align-items: center;}
.main_footer .block_content{display: flex; flex-direction: column;gap: 14px;flex-wrap: nowrap; align-items: center;text-align:center;}
.main_footer .sub {display: none; flex-direction: column; gap: 14px;}
.main_footer .block_logos{display: flex; flex-flow: row nowrap;gap: 14px;}
.main_footer .copyright {width:100%; height:85px; border-top:1px solid #E8E9EC; margin-top:35px; display: flex; justify-content: center; align-items: center;}


.modal-background{
	height: 100vh;
	width: 100vw;
    padding:0 15px;
	background-color: rgba(0, 0, 0, 0.404);
	position: fixed;
	top: 0;
	left: 0;
	z-index: 999;
	display: none;
}
.modal-content {
	width: 100%;
    max-width: 460px;
	padding: 15px;
    

    display: flex;
    flex-flow: column nowrap;
    align-items: center;
    
	background-color: white;
    border: 2px solid lightgray;
    box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.19);
}

.glide__slide { width: 33.33%; float: left;}

.invisible-mobile-resp {display: none;}
.visible-desktop-resp {display: none;}



.flex-row {display: flex; flex-direction: row;}
.flex-column {display: flex; flex-direction: column;}
.flex-column-wrap {display: flex; flex-flow: column wrap;}
.flex-column-nowrap {display: flex; flex-flow: column nowrap;}
.flex-row-wrap {display: flex; flex-flow: row wrap;}
.flex-row-nowrap {display: flex; flex-flow: row nowrap;}


.flex-column-mobile-resp {display: flex;flex-flow: column wrap;}
.flex-column-mobile-resp-nowrap {display: flex;flex-flow: column nowrap;}
.flex-column-desktop-resp {display: flex;flex-flow: row wrap;}
.flex-row-mobile-resp {display: flex;flex-flow: row wrap;}
.flex-row-desktop-resp {display: flex;flex-flow: column wrap;}

.flex-column-resp {display: flex; flex-flow: column wrap;}
.flex-column-resp {display: flex; flex-flow: column wrap;}
.flex-row-resp {display: flex; flex-flow: row wrap;}

.flex-between   {justify-content: space-between;}
.flex-between-f {justify-content: space-between; align-items: stretch;}
.flex-between-c {justify-content: space-between; align-items: center;}
.flex-between-s {justify-content: space-between; align-items: flex-start;}
.flex-between-e {justify-content: space-between; align-items: flex-end;}

.flex-evenly-f {justify-content: space-evenly; align-items: stretch;}
.flex-evenly-c {justify-content: space-evenly; align-items: center;}
.flex-evenly-s {justify-content: space-evenly; align-items: flex-start;}
.flex-evenly-e {justify-content: space-evenly; align-items: flex-end;}

.flex-center-f {justify-content: center; align-items:  stretch;}
.flex-center-c {justify-content: center; align-items:  center;}
.flex-center-s {justify-content: center; align-items:  flex-start;}
.flex-center-e {justify-content: center; align-items:  flex-end;}

.flex-start-c {justify-content: flex-start; align-items:  center;}
.flex-start-s {justify-content: flex-start; align-items:  flex-start;}
.flex-start-e {justify-content: flex-start; align-items:  flex-end;}

.flex-end-c {justify-content: flex-end; align-items:  center;}
.flex-end-s {justify-content: flex-end; align-items:  flex-start;}
.flex-end-e {justify-content: flex-end; align-items:  flex-end;}


.flex-stretch {align-items: stretch;}
.flex-center {align-items:  center;}
.flex-baseline {align-items: baseline;}
.flex-start {align-items: flex-start;}
.flex-end {align-items: flex-end;}

.flex-s-e-e {align-items: flex-start;}


.flex-wrap {flex-wrap: wrap;}

.flex-grow1 {flex-grow: 1;}


.flex-space-between-c {justify-content: space-between; align-items: center;}
.flex-space-between-s {justify-content: space-between; align-items: flex-start;}

.flex-space-evenly-c {justify-content: space-evenly; align-items: center;}
.flex-space-evenly-s {justify-content: space-evenly; align-items: flex-start;}

.flex-gap1  {gap: 1px; }
.flex-gap2  {gap: 2px;}
.flex-gap3  {gap: 3px;}
.flex-gap4  {gap: 4px;}
.flex-gap5  {gap: 5px;}
.flex-gap6  {gap: 6px;}
.flex-gap7  {gap: 7px;}
.flex-gap8  {gap: 8px;}
.flex-gap9  {gap: 9px;}
.flex-gap10 {gap: 10px;}
.flex-gap15 {gap: 15px;}
.flex-gap20 {gap: 20px;}
.flex-gap25 {gap: 25px;}
.flex-gap30 {gap: 30px;}
.flex-gap40 {gap: 40px;}
.flex-gap50 {gap: 50px;}
.flex-gap60 {gap: 60px}
.flex-gap70 {gap: 70px}
.flex-gap80 {gap: 80px}
.flex-gap90 {gap: 90px}
.flex-gap100 {gap: 100px}
.flex-gap20-resp {gap: 20px;}
.flex-gap8-resp {gap:8px;}
.flex-gap-5-20 {gap:5px}


.padding-5 {padding: 5px;}
.padding-50x40 {padding: 50px 40px;}
.padding-50x150 {padding: 50px 100px;}
.padding-50x150 {padding: 50px 150px;}

.padding-50x20-50x40 {padding: 50px 20px ;}
.padding-50x40-resp {padding: 0;}
.padding-left-50-resp {padding-left: 0px;}
.padding-x-25-resp {padding: 0 25px;}

.width-100perc-450px {width: 100%;}
.height-45x60-resp, .height-45x90-resp {height: 45px;}
.height-30x45-resp {height: 30px;}
.height-100-auto-resp {height: 100%;}
.max-height-45-90-resp {max-height: 45px;}
.max-height-400-resp {max-width: none;}

.width-100perc-950px-resp {width: 100%;}
.width-100perc-300px-resp {width: 100%;}
.width-100-82-resp {width: 100%;}
.width-100-50-resp {width: 100%;}
.width-100-70-resp {width: 100%;}
.width-100-30-resp {width: 100%;}
.width-50-25 {width: 50%;}

.texto8-10-resp  {font-size: 8px;}
.texto10-12-resp {font-size: 10px;}
.texto11-13-resp {font-size: 11px;}
.texto13-15-resp {font-size: 13px;}
.texto16-18-resp {font-size: 16px;}
.texto15-20-resp {font-size: 15px;}
.texto25-40-resp {font-size: 25px;}
.texto35-50-resp {font-size: 35px;}



.max-width-400-none-resp {max-width: 400px;}
.max-width-300-none-resp {max-width: 300px;}



.unselectable {
    -webkit-touch-callout: none; 
    -webkit-user-select: none; 
    -khtml-user-select: none; 
    -moz-user-select: none; 
    -ms-user-select: none; 
    user-select: none; 
  }

.input-txt-login {
    border: 0;
    background-color: white;
    cursor: pointer;
    font-weight: bold;
}
.input-txt-none {
    border: 0;
    background-color: white;
    cursor: pointer;
}
.input-txt-checked {
    border-bottom: 1px solid #626B4F; color: #626B4F;
    font-weight:bold; 
}
.input-form-dados {
    padding: 5px; color: #626B4F; font-size: 17px; border: 1px solid #CCCCCC;
}
.input-form-dados:focus {background-color: #FFFFCC;}

.input-form {border: 1px solid #999999;background-color: white;}
.input-form:focus {border: 1px solid black;background-color: #FFFFCC;}

.input-none {background-color: transparent; border: 0;}


.range-container {display: flex;align-items: center;}
.range-container .range-min, .range-container .range-max {position: relative;margin: 0 10px;font-size: 14px;}
.ui-slider-handle {border-radius: 50%;}


.carrinho-header-resp {
    justify-content: space-between;
    align-items: center;
    padding: 0 30px;
    height: 80px;
    background-color: #F6F6F6;
}
.carrinho-logo-resp {width: 90px;object-fit:cover}
.carrinho-fonts-resp {display: flex; flex-flow: row nowrap; justify-content: center; align-items: center;}



.texto-10-12-14 {font-size: 10px;}
.texto-6-8-10   {font-size: 6px;}



.button {
    background-color:#CCCCCC;
    border: none;
    color: black;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    transition-duration: 0.4s;
    cursor: pointer;
  }
  
.buttonSmall  {padding: 3px 10px;font-size: 12px;}
.buttonSmallP {padding: 1px 6px;font-size: 10px;}
.buttonNormal {padding: 4px 10px;font-size: 10px;}
.buttonLarge  {padding: 8px 25px;font-size: 14px;}
.buttonLarge2 {padding: 8px 50px;font-size: 14px;}
.buttonBig    {padding: 8px 25px;font-size: 20px;}
.buttonGG    {padding: 15px 20px;font-size: 20px;}

.buttonBlue {background-color:#F8F8F8; color: black; border: 2px solid #008CBA;}
.buttonBlue:hover {background-color: #008CBA;color: white;}

.buttonRed {background-color:#F8F8F8; color: black; border: 2px solid #CC3300;}
.buttonRed:hover {background-color: #CC3300;color: white;}

.buttonBlack {background-color:#000; color: white; border: 2px solid #000;}
.buttonBlack:hover {background-color: #fff;color: black;}

.buttonWhite {background-color:#fff; color: black; border: 2px solid #000;}
.buttonWhite:hover {background-color: #000;color: white;}

.divvisible {display: none;}
.divinvisible {display: block;}

/* ______________ CSS ADPTADOS PARA TELA DE MOBILE ______________ */
@media screen and (max-width: 768px) {

    /* DISPLAY DE PRODUTOS (MINI)*/
    .produto.mini { min-width: 150px;width: 150px;height: 300px;}
    .produto.mini .img {width: 130px;height: 130px;}
    .produto.mini .descricao {width: 100%;height: auto;padding: 0 7px;}
    .produto.mini .valor {height: auto;}
    .produto.mini .buttonLarge2 {padding: 8px 30px;}
    .produto.mini .texto14 {font-size: 8px;}
    .produto.mini .texto18 {font-size: 14px;}

}

/* ______________ CSS ADPTADOS PARA TELA DE TABLET ______________ */
@media screen and (min-width: 768px) and (max-width: 1080px) {

    .header_menu  {padding: 30px 20px 0px 20px;}


    /* [CABEÇALHO] ---> NAVEGAÇÃO DO CABEÇALHO ----- */
    .header_nav > nav > ul {flex-direction: column;}
    .header_menu .left_menu .burguer {display: block;}
    .header_menu .logo {width:140px;}
    .header_menu .right_menu {gap: 20px;}
    #icon_login, #icon_shop, .burguer {font-size: 26px;}

    /* [BLOCO] ----> BLOCO BANNERS -- */
    .bloco_banners ul {flex-wrap: wrap;}

    /* [BLOCO] ----> BLOCO IMAGEM E TEXTO -- */
    .bloco_img_e_txt { width: 600px; height: 1200px; max-width: none;}
    
    /* [BLOCO] ----> BLOCO IMAGEM E PRODUTOS --*/
    .bloco_img_e_pro {flex-direction: column;}
    .bloco_img_e_pro > .container {width: 100%; max-width: 800px;}
    .bloco_img_e_pro > .img {width: 100%;}

    /* [BLOCO] ----> BLOCO TEXTO -- */
    .bloco_txt {width: 600px;max-width: none;}
    .bloco_txt > .title {width: 50%;}
    .bloco_txt > .text {width: 50%;height: 50%;background-color: black;}

    .invisible-mobile-resp {display: flex;}
    .visible-desktop-resp {display: none;}


    .flex-gap20-resp {gap: 0;}
    .flex-gap8-resp {gap:0;}
    .flex-gap-5-20 {gap:20px}

    .flex-column-resp {flex-direction: row;}
    .flex-row-resp {flex-direction: column;}

    .flex-column-mobile-resp {display: flex;flex-flow: row wrap;}
    .flex-column-mobile-resp-nowrap {display: flex;flex-flow: row nowrap;}
    .flex-column-desktop-resp {display: flex;flex-flow: row wrap;}
    .flex-row-mobile-resp {display: flex;flex-flow: column wrap;}
    .flex-row-desktop-resp {display: flex;flex-flow: column wrap;}


    .padding-50x20-50x40 {padding: 50px 40px ;}
    .padding-50x40-resp {padding: 50px 40px;}
    .padding-left-50-resp {padding-left: 50px;}
    .padding-x-25-resp {padding: 0 100px 0 25px;}


    .width-100perc-950px-resp {width: 950px;}
    .width-100-50-resp {width: 50%;}
    .width-100-82-resp {width: 82%;}
    .width-100-70-resp {width: 100%;}
    .width-100-30-resp {width: 100%;}
    
    
    .width-100perc-450px {width: 450px;}
    .width-100perc-300px-resp {width: 300px;}
    .max-width-400-none-resp, .max-width-300-none-resp {max-height: none;}

    .texto25-40-resp {font-size: 40px;}
    .texto35-50-resp {font-size: 50px;}

    .flex-s-e-e {align-items: flex-end;}

    .texto-10-12-14 {font-size: 12px;}
    .texto-6-8-10   {font-size: 8px;}

}

/* ______________ CSS ADPTADOS PARA TELA DE DESKTOP ______________ */
@media screen and (min-width: 1080px) {



    /* [CABEÇALHO] ---> MENU DO CABEÇALHO ----- */
    .header_menu  {height:  90px; padding: 30px 30px 0px 30px;}
    .header_menu .left_menu {justify-content: space-between; border-bottom:1px solid white;}
    .header_menu .left_menu #input_search {display: block;border: 0;}
    .header_menu .left_menu #icon_search {display: block;}
    .header_menu .left_menu .burguer {display: none;}
    .header_menu .logo {width:160px;}
    .header_menu .right_menu {gap: 30px;}
    #icon_login, #icon_shop, .burguer {font-size: 30px;}
    .box_border {display: block;}

    /* [CABEÇALHO] ---> MENU DA NAVEGAÇÃO DO CABEÇALHO ----- */
    .nav_area {border: 0;}
    .nav_area ul, .nav_area li,  .nav_area a {width: auto;}
    .nav_area > ul { flex-direction: row; justify-content: center; align-items: center;}
    .nav_area > ul > li > ul {position: absolute; box-shadow: 0 3px 15px rgba(0,0,0,0.5);}
    .nav_area > ul > li > ul > li > a {text-align: left;}

    /* [BLOCO] ----> BLOCO BANNERS -- */
    .bloco_banners ul {flex-wrap: nowrap;}

    /* [BLOCO] ----> BLOCO IMAGEM E PRODUTOS -- */
    .bloco_img_e_pro {flex-direction: row;}
    .bloco_img_e_pro > .container {width: 70%;max-width: 800px;}
    .bloco_img_e_pro > .img {width: 30%;}

    /* [BLOCO] ----> BLOCO IMAGEM E TEXTO -- */
    .bloco_img_e_txt {width: 1000px;height: 500px;flex-direction: row; max-width: none;}
    .bloco_img_e_txt .banner {width: 50%;height: 100%;}
    .bloco_img_e_txt .container {width: 50%;height: 100%;}

    /* [BLOCO] ----> BLOCO TEXTO -- */
    .bloco_txt {width: 1000px; max-width: none;}
    .bloco_txt > .title {width: 50%;}
    .bloco_txt > .text {width: 50%;height: 50%;background-color: black;}

    .main_footer .informative{flex-direction: row;align-items:flex-start;gap: 50px;}
    .main_footer * {color: black;}
    .main_footer .sub {display: flex;}
    .main_footer .block_infor.one{width: 25%;gap: 50px;align-items: flex-start;}
    .main_footer .block_content{ align-items: flex-start;text-align:left;}

    .invisible-mobile-resp {display: flex;}
    .visible-desktop-resp {display: flex;}    

    .flex-column-resp {flex-direction: row; flex-wrap: nowrap;}
    .flex-row-resp {flex-direction: column;flex-wrap: nowrap;}

    .flex-column-mobile-resp {display: flex;flex-flow: row wrap;}
    .flex-column-mobile-resp-nowrap {display: flex;flex-flow: row nowrap;}
    .flex-column-desktop-resp {display: flex;flex-flow: column wrap;}
    .flex-row-mobile-resp {display: flex;flex-flow: column wrap;}
    .flex-row-desktop-resp {display: flex;flex-flow: row wrap;}


    .flex-gap20-resp {gap: 0;}
    .flex-gap8-resp {gap:0;}
    .flex-gap-5-20 {gap:20px}

    .padding-50x20-50x40 {padding: 50px 40px ;}
    .padding-50x40-resp {padding: 50px 40px;}
    .padding-left-50-resp {padding-left: 50px;}
    .padding-x-25-resp {padding: 0 100px 0 25px;}

    .height-45x90-resp {height: 90px;}
    .height-45x60-resp {height: 60px;}
    .height-30x45-resp {height: 45px;}
    .height-100-auto-resp {height: auto;}
    .max-height-45-90-resp {max-height: 90px}
    .max-height-400-resp {max-height: 400px;}
    .width-100perc-950px-resp {width: 950px;}
    .width-100-50-resp {width: 50%;}
    .width-100-82-resp {width: 82%;}
    .width-100-70-resp {width: 70%;}
    .width-100-30-resp {width: 30%;}
    .width-50-25 {width: 25%;}
    
    .width-100perc-450px {width: 450px;}
    .width-100perc-300px-resp {width: 300px;}
    .max-width-300-none-resp, .max-width-400-none-resp {max-width: none;}

    .flex-row-desktop-resp.flex-center-c {
        align-items: flex-start;
    }
    
    .texto8-10-resp {font-size:10px}
    .texto10-12-resp {font-size: 12px;}
    .texto11-13-resp {font-size: 13px;}
    .texto13-15-resp {font-size: 15px;}
    .texto16-18-resp {font-size: 20px;}
    .texto15-20-resp {font-size: 20px;}
    .texto25-40-resp {font-size: 40px;}
    .texto35-50-resp {font-size: 50px;}

    .carrinho-header-resp {justify-content: space-evenly;padding:0 0px;height: 110px;}
    .carrinho-logo-resp {width: 160px;}
    .carrinho-fonts-resp {justify-content: space-between;}

    .flex-s-e-e {align-items: flex-end;}

    .texto-10-12-14 {font-size: 14px;}
    .texto-6-8-10   {font-size: 10px;}
    

}