
/* determina a estrutura do menu;quanto a posição da coluna e da linha */
 /* coloca a borda superior e inferior */
 .second-nav{
    grid-column: 2/10;
    grid-row:3;
    border-top:.1rem solid #12376e;
    border-bottom:.1rem solid #12376e;
    /* background: yellow; */
 }
 
 /* determina que o modelo da 'UL' é um grid e emimina o estilo da 
 lista. */
 /* também determina como vai vai ser distribuida e como será preenchida. */
 .segunda-nav-list{
     display:grid;
     grid-template-columns: repeat(auto-fit,minmax(10rem,1fr));
     list-style: none;
 }
 
 /* O link é o elemento <a> */
 /* define algumas caracteristica do link */
 .segunda-nav-link{
     text-align: center;
     display: grid;
     text-transform: uppercase;
     text-decoration: none;
     font-size: 1.4rem;
     color: #12376e;
     padding: .8rem 0;
     transition: all .5s .3s;
  }
 
  /* Se passa-se o mouse sobre o link ele muda a cor do fundo e do text
    invertendo as cores */
 .segunda-nav-item:hover .segunda-nav-link{
     background-color: #12376e;
     color:#fff;
 }
 
 /* antes e depois : muda o comprimento da linha top/bottom*/
 .segunda-nav-link::before,
 .segunda-nav-link::after{
     content: "";
     width: 90%;
     height: .1rem;
     background-color:#12376e ;
     display: block;
     transition: width .3s cubic-bezier(.55,0,.98,.54),
     background-color .5s .3s;
 }
 
 /* esse aqui ainda não definição */
 .segunda-nav-link::after{
     justify-self: end;
 }
 
 /* se passar o mouse então o menu altera o fundo para */
 .segunda-nav-item:hover .segunda-nav-link::before,
 .segunda-nav-item:hover .segunda-nav-link::after{
     width: 100%;
     background-color: #fff;
 }
 
 .segunda-nav-item:nth-child(2){
     position: relative;
 }
 
 .segunda-nav-item:nth-child(3){
     position: relative;
 }
 
 .segunda-nav-item:nth-child(4){
     position: relative;
 }
 
 .segunda-nav-item:nth-child(5){
     position: relative;
 }
 
 .segunda-nav-item:nth-child(6){
     position: relative;
 }
 
 .dropdown{
     position: absolute;
     top:100%;
     width: 10rem;
     padding: 1.6rem;
     display: grid;
     grid-template-columns: repeat(7,10rem);
     visibility: hidden;
     opacity: 0;
     z-index:  100;
     transition: all 1s;
     border-radius: .4rem;
 }

 .dropdown-aquecedor{
     /* background-color: #125ba0; */
     background-color: #fdfbfb;
     /* background: linear-gradient(to right,#032f58,#4989c5);  */
     /* border: solid #808080 1.5px; */
     color: #c0120c; 
 }
 
 .dropdown-cozinha{
     width: 12rem;
     /* background: linear-gradient(to right ,#440402,#c0120c); */
     background-color: #fdfbfb;
 }
 
 .dropdown-distrib{
     width: 13rem;
     /* background: linear-gradient(to right ,#024430,#39da9c); */
     background-color: #fdfbfb;
 }
 
 .dropdown-exaust{
     width: 10rem;
     /* background: linear-gradient(to right,#022241,#4989c5); */
     background-color: #fdfbfb;
 }
 
 .dropdown-poupe{
     width: 12rem;
     /* background: linear-gradient(to right ,#440402,#c0120c); */
     background-color: #fdfbfb;
 }
 
 .segunda-nav-item:nth-child(2):hover .dropdown-aquecedor{
     visibility: visible;
     opacity: 1;
 }
 
 .segunda-nav-item:nth-child(3):hover .dropdown-cozinha{
     visibility: visible;
     opacity: 1;
 }
 
 .segunda-nav-item:nth-child(3)::after .dropdown-cozinha{
     visibility: visible;
     opacity: 1;
 }
 
 .segunda-nav-item:nth-child(4):hover .dropdown-distrib{
     visibility: visible;
     opacity: 1;
 }
 
 .segunda-nav-item:nth-child(5):hover .dropdown-exaust{
     visibility: visible;
     opacity: 1;
 }
 
 .segunda-nav-item:nth-child(6):hover .dropdown-poupe{
     visibility: visible;
     opacity: 1;
 }
 
 
 .segunda-nav-item:nth-child(7):hover .dropdown-outros{
     visibility: visible;
     opacity: 1;
 }
 
 .dropdown-1-list{
     grid-column: 1/2;
 }
 
 .dropdown-2-list{
     grid-column: 1/2;
 }
 
 .dropdown-3-list{
     grid-column: 1/2;
 }
 
 .dropdown-5-list{
     grid-column: 1/2;
 }
 
 .dropdown-list-item{
     list-style: none;
 }
 
 .dropdown-list-link{
     font-size: 1.3rem;
     text-decoration: none;
     text-transform: uppercase;
     /* color:#34598f; */
     color: #000000;
     margin: 0 0 1rem 1.6rem;
     display: block;
 }
 
 .dropdown-list-link:hover{
     color: #458a9f;
     /* color:aqua; */
     color: blue;
 }
 
 .home{
    background-color: #ffffff;
    width: 98%;
    margin: auto;
    height:500px;
    padding: 3px;
    margin-top:10px;
}

.aquecedores{
    width: 98%;
    /* height:1000px; */
    margin: auto;
    padding: 0 8px;
    /* background: brown; */
    height:82rem;
    margin-top: 2px;
    padding-top: 1px;
}

.cozinha{
    width: 98%;
    margin: auto;
    height:600px;
    padding: 0 8px;
}

.coifas{
    width: 94%;
    margin: auto;
    height:800px;
    padding: 0 8px;
}

.cooktop{
    width: 98%;
    margin: auto;
    height:450px;
}

.fornos{
    background-color: gainsboro;
    width: 98%;
    margin: auto;
    height:600px;
}

.exaustao{
    width: 98%;
    margin: auto;
    height:600px;
}

.outros{
    background-color: #002144;
    width: 98%;
    margin: auto;
    height:auto;
    text-align: center;
}

.dropdown-menu{
    left:20px;
    width: 12rem;
    z-index: 100;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    padding: 4px 0px 4px 0px;
}

.dropdown-list-link{
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-size: 1.2rem ;
    /* color:rgba(4, 102, 214, 0.8); */
   
    letter-spacing: 0.5px;
    color: rgb(255, 255, 255);
    color:#12376e;
}

@media(max-width:2200px){
.menu-hamburger{
    display: none;
    visibility: hidden;
}
             
.grid-produto{
    visibility: hidden;
}
    
.corpo{
    visibility: visible;
}

}

@media(max-width:1800px){
.menu-hamburger{
    display: none;
    visibility: hidden;
}
            
.grid-produto{
    visibility: hidden;
}

.corpo{
    visibility: visible;
}    

}

@media(max-width:1200px){
.menu-hamburger{
    display: none;
    visibility: hidden;
}
            
.grid-produto{
    visibility: hidden;
}

.corpo{
    visibility: visible;
}

}
@media(max-width:900px){
.menu-hamburger{
    display: none;
    visibility: hidden;
}
            
.grid-produto{
    visibility: hidden;
}

.corpo{
    visibility: visible;
}

}

@media(max-width:600px){
.menu-hamburger{
    visibility: visible;
}
            
.grid-produto{
    visibility: visible;
}

.corpo{
    visibility: hidden;
}    

}

@media(max-width:400px){
.menu-hamburger{
    visibility: visible;
}
            
.grid-produto{
    visibility: visible;
}

.corpo{
    visibility: hidden;
}    
    
}