* {
    margin: 0;
    padding: 0;
    font-family: 'Jost', sans-serif;
}

.experience-container {
    display: flex;
    box-sizing: border-box;
    width: 100%;
    height: 100vh;
    align-items: center;
    justify-content: space-evenly;
    flex-wrap: wrap;
    position: relative;
}

.grid-container {
    width: 40vmax;
    height: 40vmax;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5px;
    background-color: #680c0c00;
    padding: 10px;
}



.grid-container>div {
    background-color: rgb(174, 210, 241);
    text-align: center;
    font-size: 30px;
}


.item1 {
    grid-row-start: 1;
    grid-row-end: 3;
    background-image: url(images/cutimages_experiences/Left_top_01.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.item2 {
    background-image: url(images/cutimages_experiences/right_top_02.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.item3 {
    grid-row-start: 2;
    grid-row-end: 4;
    background-image: url(images/cutimages_experiences/right_bottom_03.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.item4 {
    background-image: url(images/cutimages_experiences/Left_bottom_04.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.exp-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 35vmax;
    height: 30vmax;

}

.exp-text h2 {
    font-size: 3.5vmax;
    font-weight: 500;
    text-transform: uppercase;

}

.exp-text p {
    font-size: 1.2vmax;
    text-align: justify;

}

.btn-container {
    position: relative;
    left: -1em;
    display: flex;
    margin-top: 1vmax;
    justify-content: flex-start;
    align-items: center;
}

.btn {
    cursor: pointer;
    height: 2em;
    width: 9em;
    position: relative;
    border-radius: 0 10em 10em 0;
    outline: none;
    background-color: transparent;
    border-top: 2px solid rgb(88, 170, 12);
    border-right: 2px solid rgb(88, 170, 12);
    border-left: none;
    border-bottom: 2px solid rgb(88, 170, 12);
    transition: all 0.5s ease-in-out;
}

.btn:hover {
    background: rgba(88, 170, 12, 0.441);
}

a {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
}

a:active {
    border: none;
}

.btn-container img {
    position: relative;
    width: 3em;
    height: 3em;
    left: 1em;
    z-index: 1;
}

.main-social {
    position: relative;
    display: flex;
    box-sizing: border-box;
    width: 100%;
    height: 100vh;
    align-items: center;
    justify-content: space-evenly;
    flex-wrap: wrap;

}

.ss-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 30vmax;
    height: 30vmax;
}

.ss-text h2 {
    font-size: 3.5vmax;
    font-weight: 500;
    text-transform: uppercase;

}

.ss-text p {
    font-size: 1.2vmax;
    text-align: justify;

}

.social-container {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    width: 40vmax;
    gap: 1vmax;
}


.gridsocial {
    display: grid;
    grid-template-rows: repeat(2, 15vmax);
    gap: 1vmax;
}

.gridsocial>a {
    background-color: beige;
    /* border: 4px solid rgb(100, 141, 216); */
    text-align: center;
    aspect-ratio: 1/1;
}

.instagram-media {
    width: 15vmax;
}

.social1 {
    background-image: url(images/guest.jpeg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.social2 {
    background-image: url(images/guest2.jpeg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.social3 {
    background-image: url(images/guest3.jpeg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.social4 {
    background-image: url(images/guest4.jpeg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}