div {
    margin: 0 10%;
}

h1 {
    color: #6bb1ad;
    padding: 100px 20px;
    text-align: center;
    font-size: 50px;
}

.tip {
    display: flex;
    grid-template-columns: 10vw 80vw;
    grid-template-rows: 1fr;
    gap: 30px;
    padding: 40px 20px;
    
}
.tip img {
    max-width: 300px;
    grid-column: 0/1;
    grid-row: 0/1;
}

.tip p, .tip h2 {
    grid-column: 1/2;
    grid-row: 0/1;
    /* align-content: center; */
}

.tip p {
    padding: 10px;
}

.tip h2 {
    color: #6bb1ad;
}

.tip_reversed {
    display: flex;
    grid-template-columns: 10vw 80vw;
    grid-template-rows: 1fr;
    gap: 30px;
    padding: 40px 20px;
}
.tip_reversed img {
    max-width: 300px;
    grid-column: 1/2;
    grid-row: 0/1;
}
.tip_reversed{
    grid-column: 0/1;
    grid-row: 0/1;
    /* align-content: center; */
}

.tip_reversed p {
    padding: 10px;
}

.tip_reversed h2 {
    color: #6bb1ad;
}

.text {
    margin: 0%;
    align-content: center;
}

.tip img, .tip_reversed img {
    width: 100%;
    height: 250px;
    object-fit: cover;
    border-radius: 5px;
    box-shadow: -3px 3px 5px; 
    
}