* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.container{
    height: 100vh;
    max-width: 1500px;
    margin: auto;
    display: grid;
    grid-template-columns: 10rem repeat(6,1fr);
    grid-template-rows: repeat(7,1fr) 50px;
    opacity: .8;
}




.box{
    
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: start;
    gap: 0.2rem;
    padding: 10px;
}

.box1{
    background-color: #E2DED0;
    grid-area: 1/ 1/ 2/2;
}
.box2{
    background-color: #E2E8DC;
    grid-area: 2/ 1/ 4/2;
display: flex;
flex-direction: column;
padding: .5rem;
gap: .5rem;
align-items: start;
justify-content: center;
}
.box15{
    background-color: #E2DED0;
    grid-area: 4/ 1/9/2;
}

h4{
font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
font-weight: bold;
font-size: 1.5rem;

}
input{
border:none;
background-color: #E2DDCF;
padding: 4px;
width: 100%;
}

select{
    border:none;
    background-color: #E2DDCF;
    padding: 4px;
    width: 100%;
    }
a{
/* text-decoration: none; */
color: black;
}





.box3{
    background-image: url("https://picsum.photos/id/543/600/400");
    background-size: cover;
    background-position: center;
    grid-area: 1/ 2 /3 /4;
}
.box4{
    background-color: #8ea77e95;
    grid-area: 2/ 3/3/4 ;
}
.box5{
    background-image: url("https://picsum.photos/id/643/600/400");
    background-size: cover;
    background-position: center;
    grid-area: 1 / 4/ 3 /6;
}
.box6{
    background-color: #9d877178;
    grid-area: 2 / 5/ 3/6;
}
.box7{
    background-image: url("https://picsum.photos/id/765/600/400");
    background-size: cover;
    background-position: center;
    grid-area: 1/ 6/ 3/ 8 ;
}
.box8{
    background-color: #83786eba;
    grid-area: 2 / 7/ 3/ 8;
}

.box9{
    background-image: url("https://picsum.photos/id/894/600/400");
    background-size: cover;
    background-position: center;
    grid-area: 3 / 2 /5 / 4;
}
.box10{
    background-color: #C4CEE2ba;
    grid-area: 4 / 3 /5 /4;
}
.box11{
    background-image: url("https://picsum.photos/id/452/600/400");
    background-size: cover;
    background-position: center;
    grid-area: 3 / 4 /5 / 6;
}

.box12{
    background-color: #829887ba;
    grid-area: 4 / 5 /5 /6;
}


.box13{
    background-image: url("https://picsum.photos/id/234/600/400");
    background-size: cover;
    background-position: center;
    grid-area: 3 / 6 /5 / 8;
}

.box14{
    background-color: #E2DECAba;
    grid-area: 4 / 7 /5 /8;
}

.box16{
    background-image: url("https://picsum.photos/id/555/600/400");
    background-size: cover;
    background-position: center;
    grid-area: 5 / 2 / 7 / 3;
}

.box17{
    background-color: #c7d6b1ba;
    grid-area: 6/ 2 /7 /3;
}


.box18{
    background-image: url("https://picsum.photos/id/777/600/400");
    background-size: cover;
    background-position: center;
    grid-area: 5 / 3/ 7 / 4;
}

.box19{
    background-color: #FFF2C9ba;
    grid-area: 6/ 3 /7 /4;
}

.box20{
    background-image: url("https://picsum.photos/id/433/600/400");
    background-size: cover;
    background-position: center;
    grid-area: 5 / 4 / 7 / 6;
}

.box21{
    background-color: #DCC9B2ba;
    grid-area: 6 / 5 / 7 /6;
}

.box22{
    background-image: url("https://picsum.photos/id/611/600/400");
    background-size: cover;
    background-position: center;
    grid-area: 5 / 6 / 7 / 8;
}

.box23{
    background-color: #909697ba;
    grid-area: 6 / 7 / 7 /8;
}
.box24{
    background-image: url("https://picsum.photos/id/177/600/400");
    background-size: cover;
    background-position: center;
    grid-area: 7 / 2 / 9 / 4;
}

.box25{
    background-color: #C6BD9Bba;
    grid-area: 8 / 3 / 9 /4;


}

.text-center{

    margin: auto;

}

.box26{
    background-image: url("https://picsum.photos/id/588/600/400");
    background-size: cover;
    background-position: center;
    grid-area: 7 / 4 / 9 / 5;
}

.box27{
    background-color: #C5CCD2ba;
    grid-area: 8 / 4 / 9 /5;
}
.box28{
    background-image: url("https://picsum.photos/id/465/600/400");
    background-size: cover;
    background-position: center;
    grid-area: 7 / 5 / 9 / 6;
}

.box29{
    background-color: #A09CA5ba;
    grid-area: 8 / 5 / 9 /6;
}

.box30{
    background-image: url("https://picsum.photos/id/999/600/400");
    background-size: cover;
    background-position: center;
    grid-area: 7 / 6 / 9 / 8;
}

.box31{
    background-color: #b29a8cba;
    grid-area: 8 / 7 / 9 /8;
}