@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100..900&display=swap');
 footer{
     height: 8vw;
     background: black;
     display: flex;
     padding: 2vw;
     align-items:center;
}
 header {
     height: 2vw;
     background: black;
     display: flex;
     align-items: center;
     padding: 2vw;
}
 .content-container{
     display: grid;
     grid-auto-columns: repeat (12, auto);
     padding: 1.5vw;
     gap: 1.5vw;
}
 .logo {
     cursor: pointer;
     font-weight: 600;
     font-size: 2vw;
}
 .navigation{
     display: flex;
     margin-left: auto;
     gap: 1.2vw;
     font-weight: 600;
     font-size: 1.2vw;
}
 .label {
     cursor: pointer;
     gap: 0.8vw;
     display: flex;
     padding: 0.8vw 1.6vw 0.8vw 1.6vw;
     grid-column: 1;
     grid-row: 1;
     align-items: center;
     border-radius: 0.3vw;
     background: black;
     height: 3vw;
     font-size: 2vw;
     width: fit-content;
}
 .like {
     height: 2.4vw;
     width: 2.4vw;
}
 .permission{
     width: 40vw;
     margin-left: auto;
     margin-right: 1vw;
     font-weight: 300;
     font-size: 1vw;
}

.info{
    background: black;
    height: fit-content;
    padding: 4vw;

    font-weight: 300;
    font-size: 1.5vw;
}
 #project-a {
     height: 50vw;
     grid-column: 1;
     grid-row: 1;
     background-image: url('./../resources/lakehouse.jpg');
     background-repeat: no-repeat;
     background-size: 100% 100%;
     grid-column: span 12;
}
 #project-b {
     height: 150vw;
     grid-column: 1;
     grid-row: 2;
     background-image: url('./../resources/gen_plan.jpg');
     background-repeat: no-repeat;
     background-size: 100% 100%;
     grid-column: span 12;
}
 #project-c {
     height: 66vw;
     grid-column: 1;
     grid-row: 3;
     background-image: url('./../resources/bali_foodmall.webp');
     background-repeat: no-repeat;
     background-size: 100% 100%;
     grid-column: span 12;
}
 #project-d {
     height: 150vw;
     grid-column: 1;
     grid-row: 4;
     background-image: url('./../resources/decorations.jpeg');
     background-repeat: no-repeat;
     background-size: 100% 100%;
     grid-column: span 12;
}
 #project-e {
     height: 60vw;
     grid-column: 1;
     grid-row: 5;
     background-image: url('./../resources/showroom.jpg');
     background-repeat: no-repeat;
     background-size: 100% 100%;
     grid-column: span 12;
}
 #project-f {
     height: 110vw;
     grid-column: 1;
     grid-row: 6;
     background-image: url('./../resources/reconstruction.jpg');
     background-repeat: no-repeat;
     background-size: 100% 100%;
     grid-column: span 12;
}