body {
    margin: 0;
    padding: 0;
    font-family: montserrat;
    font-size: 16px;
}

h1 {
    font-size: 2.7em;
    font-weight: 300;
}

h2 {
    font-size: 1.8em;
}

p {
    font-size: 1.25em;
}

header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
    background-color: white;
}

.header_href {
    text-decoration: none;
    font-size: 1em;
}

header:hover {
    background-color: whitesmoke;
}

a {
    text-decoration: none;
    color: black;
}

img, video {
    width: 100%;
    max-width: 100%;
    height: auto;
}

.card_tm {
    text-align: left;
    background-color: #093637;
    color: #44a08d;
    padding: 10px;
    font-family: 'lobster';
    padding-left: 40px;
}

/* australia start  */

.card_white {
    padding: 5em;
    display: grid;
    grid-template-columns: repeat(3, 1fr) ;
    grid-template-rows: 100px 280px 280px ;
    gap: 20px;
    justify-content: center;
    align-items: center;
    width: 65%;
    /* max-width: 1000px; */
    margin: auto;
}
.item_text {
    grid-row: 1 / 2;
    grid-column: 1 / 2;
}
.item_one {
    grid-row: 2 / 3;
    grid-column: 1 / 2;
}
.item_two {
    grid-row: 2 / 3;
    grid-column: 2 / 3;
}
.item_three {
    grid-row: 2 / 3;
    grid-column: 3 / 4;
}
.item_four {
    grid-row: 3 / 4;
    grid-column: 1 / 2;
}
.item_five {
    grid-row: 3 / 4;
    grid-column: 2 / 3;
}
.item_six {
    grid-row: 3 / 4;
    grid-column: 3 / 4;
}

.card_color {
    padding: 5em;
    display: grid;
    grid-template-columns: repeat(3, 1fr) ;
    grid-template-rows: 100px 280px 280px ;
    gap: 20px;
    justify-content: center;
    align-items: center;
    /* grid-template-rows: auto ; */
    background-color: #093637;
    color: #44a08d;
    width: 65%;
    margin: auto;
    border-radius: 4%;
}
.item_text {
    grid-row: 1 / 2;
    grid-column: 1 / 2;
}
.item_one {
    grid-row: 2 / 3;
    grid-column: 1 / 2;
}

.item_two {
    grid-row: 2 / 3;
    grid-column: 2 / 3;
}
.item_three {
    grid-row: 2 / 3;
    grid-column: 3 / 4;
}
.item_four {
    grid-row: 3 / 4;
    grid-column: 1 / 2;
}
.item_five {
    grid-row: 3 / 4;
    grid-column: 2 / 3;
}
.item_six {
    grid-row: 3 / 4;
    grid-column: 3 / 4;
}
.indo_audio {
    grid-row: 1 /2;
    grid-column: 3 / 4;
}



footer:hover {
    background-color: #093637;
    transition: background-color 1s ease-in-out;
    /* color: #44a08d; */
}
footer {
    display: flex;
    align-items: center;
    padding: 20px;
    justify-content: space-between;
    background-color: white;
    color: black;
}
.footer_href {
    text-decoration: none;
    font-size: 1em;
}
.insta_logo {
    width: 6%;
}
.youtube_logo {
    width: 8%;
}

/* @media (max-width: 768px) {
    .card_white, .card_color {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: auto;
    margin: auto;
    }
    .card_tm {
        text-align: center;
    } */

@media (max-width: 992px) {
    .card_white, .card_color {
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: auto;
        margin: auto;
        }
        .card_tm {
            text-align: center;
        }
}

@media (max-width: 480px) {
    .card_white, .card_color {
        grid-template-columns: repeat(2, 100px);
        grid-row: repeat(3, 200px);
        width: 40%;
        padding: 60px;
        gap: 5px;
        border-radius: 10px;
    }
    .item_three {
        grid-row: 5 / 6;
        grid-column: 1 / 2;
    }
    .item_six {
        grid-row: 5 / 6;
        grid-column: 2 / 3;
    }
    .card_tm {
        text-align: center;
        font-size: 0.7em;
    }
    header, footer {
        font-size: 0.5em;
    }
    img, video {
        border-radius: 5px;
    }
}