body {box-sizing: border-box;
    padding: 0;
    margin: 0;
    background-color: black;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 600;}
    
    .cabeca {display: flex;justify-content: space-between;}
    
    .logo {width: 120px;
    height: 120px;
    margin-left: 5%;
    cursor: pointer;}
    #logo {position: absolute;
    color: white;
    top: 108px;
    left: 10px;
    cursor: pointer;}
    
    .conteudo {display: flex;
        justify-content: space-between;
    width: 30%;
    height: 50%;
    margin-top: 2%;
    margin-right: 45%;}
    
    .c2 {text-decoration: none;
    color: white;
    font-size: 20px;}
    .c1 {color: #FD8210;
    font-size: 20px;
text-decoration: none;}
    .c2:hover {color: #FD8210;
    transition: 0.5s;}
    
    .cont {
    height: 2%;
    position: absolute;
    left: 85%;
    top: 2.7%;}
    
    .search {width: 25px;
    height: 50px;
    margin-right: 30px;}
    .carrinho {width: 25px;
        height: 52px;
    margin-right: 28px;}
    .user {width: 25px;
         height: 50px;}
    

         .parent {
            display: grid;
            grid-template-columns: repeat(5, 1fr);
            grid-template-rows: repeat(5, 1fr);
            gap: 8px;
            height: 1000px;
            padding-top: 3%;
            ;
        } 
        .div1 {
            grid-row: span 2 / span 2;
            background-color: white;
          
            cursor: pointer;
        }
        .div1:hover {background-color: #FD8210;
        transition: 0.5s;
        border: white solid 2px;}

        .div2 {
            grid-row: span 3 / span 3;
            background-color: white;
           
            cursor: pointer;
        }
        .div2:hover {background-color: #FD8210;
            transition: 0.5s;
            border: white solid 2px;}

        .div3 {
            grid-row: span 3 / span 3;
            grid-column-start: 1;
            grid-row-start: 3;
            background-color: white;
   
            cursor: pointer;
            
        }
        .div3:hover {background-color: #FD8210;
            transition: 0.5s;
            border: white solid 2px;}
            
        .div5 {
            grid-row: span 2 / span 2;
            grid-column-start: 2;
            grid-row-start: 4;
            background-color: white;
          
            cursor: pointer;
        }
        .div5:hover {background-color: #FD8210;
            transition: 0.5s;
            border: white solid 2px;}
            
        .div6 {
            grid-row: span 5 / span 5;
            grid-column-start: 3;
            grid-row-start: 1;
            background-color: white;
           
            cursor: pointer;
        }
        .div6:hover {background-color: #FD8210;
            transition: 0.5s;
            border: white solid 2px;}

        .div7 {
            grid-row: span 2 / span 2;
            grid-column-start: 4;
            grid-row-start: 1;
            background-color: white;
           
            cursor: pointer;
        }
        .div7:hover {background-color: #FD8210;
            transition: 0.5s;
            border: white solid 2px;}

        .div8 {
            grid-row: span 2 / span 2;
            grid-column-start: 4;
            grid-row-start: 3;
            background-color: white;
         
            cursor: pointer;
        }
        .div8:hover {background-color: #FD8210;
            transition: 0.5s;
            border: white solid 2px;}

        .div9 {
            grid-column: span 2 / span 2;
            grid-column-start: 4;
            grid-row-start: 5;
            background-color: white;
           
            cursor: pointer;
        }
        .div9:hover {background-color: #FD8210;
            transition: 0.5s;
            border: white solid 2px;}

        .div12 {
            grid-row: span 2 / span 2;
            grid-column-start: 5;
            grid-row-start: 3;
            background-color: white;
          
            cursor: pointer;
        }
        .div12:hover {background-color: #FD8210;
            transition: 0.5s;
            border: white solid 2px;}

        .div14 {
            grid-column-start: 5;
            grid-row-start: 1;
            background-color: white;
            
            cursor: pointer;
        }
        .div14:hover {background-color: #FD8210;
            transition: 0.5s;
            border: white solid 2px;}

        .div15 {
            grid-column-start: 5;
            grid-row-start: 2;
            background-color: white;
           
            cursor: pointer;
        }
        .div15:hover {background-color: #FD8210;
            transition: 0.5s;
        border: white solid 2px;}

.rodape {background-color: white;
border: #FD8210 solid 3px;
height: 30vh;
width: 99.7%;
margin-top: 50%;}

.bbloc {margin-left: 2.2%;
font-size: 22px;}

.bbloc2 {height: 3vh;
    width: 20%;
background-color: black;
margin-left: 2%;
display: flex;
justify-content: end;
cursor: text;
border: #FD8210 solid 2px;
}

.sbsc {margin-top: 6px;
margin-right: 6px;}

.inscrever {width: 8%;
  display: flex;
  justify-content: center;
  align-items: center;
background-color: #FD8210;
border-radius: 8px;
height: 12%;
margin-left: 2%;
margin-top: 1%;
cursor: pointer;}

.lor {margin-left: 2%;
margin-top: 2%;}

.icones {
display: flex;
position: absolute;
width: 30%;
justify-content: space-around;
left: 55%;
top: 245%;
}

#icon {width: 10%;
height: 10%;
cursor: pointer;}
.teteni {width: 100%;
height: 70%;
margin-left: 3%;}
            
#bloco {background-color: black;
width: 100%;
height: 29.5%;
color: white;
text-align: center;}

.div8 {background-color: black;
border: black}  

.buy {background-color: white;
width: 30%;
margin-top: 6%;
margin-left: 34%;
color: black;
height: 3vh;
display: flex;
align-items: center;
justify-content: center;}

.lo {font-size: 35px;}
.lo14 {font-size: 10px;}