@import url('style.css');
img{width: 30px;}
button{background: var(--dark-brown); color: white; padding: 10px; border: none; border-radius: 5px;}

#who-we-are, #philosophy, #aboutUsAndYou{padding: 25px 25px 0 25px;}
#who-we-are *, #philosophy *, #aboutUsAndYou *{margin: 10px;}

#who-we-are .btns{display: flex;}
#who-we-are a{display: grid; place-items: center; margin: 0;}
#who-we-are button{margin: 0;}


#who-we-are .container{display: flex;}
#who-we-are .text{width: 60%;}

#who-we-are span{
    width: 40%; height: 300px;
    display: inline-block;
    background: url('../images/about-us.png') center/cover no-repeat;
    border-radius: 15px;
}

/*****************/

#aboutUsAndYou .container{display: flex;}
#aboutUsAndYou .container p{width: 30%; margin: 20px 0 0 0;}

.images{
    width: 70%; min-height: 50vh;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(3, 1fr);
    grid-column-gap: 25px;
    grid-row-gap: 25px;
}
.images span{width: 100%; height: 100%; display: grid; border-radius: 10px;}

.images span:nth-child(1){background: url('../images/cioccolateria.jpg') center/cover no-repeat; grid-area: 1 / 1 / 3 / 3;}
.images span:nth-child(2){background: url('../images/campagna-toscana.jpg') center/cover no-repeat; grid-area: 3 / 1 / 4 / 3;}
.images span:nth-child(3){background: url('../images/cioccolateria-2.jpg') center/cover no-repeat; grid-area: 2 / 3 / 4 / 5;}
.images span:nth-child(4){background: url('../images/toscana.webp') center/cover no-repeat; grid-area: 1 / 3 / 2 / 5;}

/*****************/

footer{margin-top: 100px;}