/*RESPONSIVE MEDIAQUERY*/

/*Break Point 768px resolution*/
@media (width > 768px) {
/*Header responsive settings*/
    header nav {
        padding: 2rem 1rem;
        position: static;
        max-width: 900px;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    header .nav_bar {
        display: none;
    }

    header .nav_link {
        padding: 0;
        width: 100%;
        position: static;
        transform: translateY(0);
        flex-direction: row;
        justify-content: space-between;
        background-color: transparent;
    }

    header .nav_link .nav_logo {
        max-width: 180px;
        display: block;
    }

    /*Banner responsive settings*/
    .banner_grid {
        grid-auto-rows: 320px;
    }

    .banner_grid img {
        display: flex;
    }

    .banner_strip {
        grid-template-columns: repeat(3, 1fr) !important;
    }

    .banner_strip_card:nth-child(4n),
    .banner_strip_card:nth-child(4n-1) {
        grid-auto-flow: unset;
        direction: unset;
    }

    .banner_strip_card:nth-child(6n),
    .banner_strip_card:nth-child(6n-1),
    .banner_strip_card:nth-child(6n-2) {
        grid-auto-flow: dense;
        direction: rtl;
    }

    /*Feacture responsive settings*/
    .feacture_grid {
        grid-template-columns: repeat(2, 1fr);
        align-items: center;
    }

    .feacture_content>div {
        transform: translateX(2rem);
    }

    .feacture_vide video {
        transform: translateX(-2rem);
    }

/*Blog responsive settings*/
    .blog_grid {
        grid-template-columns: repeat(3, 1fr) !important;
    }
/*Instagram responsive settings*/
    .instagram_flex img {
        max-width: 150px;
    }

    /*Footer responsive settings*/
    .footer_container{
        grid-template-columns: repeat(3, 1fr);
        text-align: left;
        gap: 2rem;
    }

    .footer_col:nth-child(1){
        grid-area: 1/2/2/3;
    }
    .footer_col form{
        margin-inline-start: unset;
    }
}


/*Break Point 480px resolution*/
@media (width > 480px) {
    /*Banner responsive settings*/
    .banner_grid {
        grid-auto-rows: 280px;
        grid-template-columns: repeat(2, 1fr);
    }

    .banner_card:nth-child(4) {
        grid-area: 2/1/3/2;
    }

    .banner_strip {
        grid-template-columns: repeat(2, 1fr);
    }

    .banner_strip_card:nth-child(even) {
        grid-auto-flow: unset;
        direction: unset;
    }

    .banner_strip_card:nth-child(4n),
    .banner_strip_card:nth-child(4n-1) {
        grid-auto-flow: dense;
        direction: rtl;
    }
/*blog responsive settings*/
    .blog_grid {
        grid-template-columns: repeat(2, 1fr);
    }
/*Instagram responsive settings*/
    .instagram_flex img {
        max-width: 135px;
    }
}