@media(min-width: 576px) {
    /********** ==================== **********\
    |               TELA VÍDEOS
    \********** ==================== **********/
    .video_title     {
        width: 260px;
    }

    .dropdown_wrapper {
        gap: 12px;
    }


    /********** ==================== **********\
    |               TELA VÍDEO
    \********** ==================== **********/
    #sect_thumb {
        width: 812px;
    }
}

@media(min-width: 768px) {
    .bg {
        padding: 24px 24px 64px 64px;
    }
    /********** ==================== **********\
    |               TELA HOME
    \********** ==================== **********/
    #infs_canal {
        width: fit-content;
        margin: 0 auto 24px auto;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
    }
    #metricas_title {
        font-size: clamp(1.125em, 1.25em + 2vw, 1.25em); /* min 18px, max 20px */
    }
    #metricas_links {
        display: flex;
        flex-wrap: wrap;
        gap: 4px;
    }
    #metricas_title {
        width: 76%;
    }
    #acoes {
        width: 712px;
        margin: 0 auto;
    }
    .acoes_item {
        height: 200px;
    }
    #acoes_programar {
        width: 350px;
        height: 200px;
    }
    #roteiro_crescimento_wrap {
        width: fit-content;
    }


    /********** ============================= **********\
    |               TELA PROGRAMAR VÍDEOS
    \********** ============================= **********/
    .programarVideo_arquivos {
        flex-direction: row;
    }


    /********** ==================== **********\
    |               TELA VÍDEOS
    \********** ==================== **********/
    .item_video {
        width: 344px;
    }
    .video_title {
        width: 354px;
    }

    /********** ==================== **********\
    |          TELA LISTA DE ROTEIROS
    \********** ==================== **********/
    #roteiros_container {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media(min-width: 992px) {
    main {
        flex-direction: row;
        /* padding: 0 24px 0 0; */
    }

    /********** ==================== **********\
    |               TELA VÍDEOS
    \********** ==================== **********/
    #lista_videos {
        justify-content: flex-start;
    }

    /********** ============================= **********\
    |               TELA PROGRAMAR VÍDEOS
    \********** ============================= **********/
    #form_programarVideo_container {
        width: 100%;
    }
    #main_content_programar_video {
        width: 80%;
        max-width: 944px;
        margin: 24px auto 0 auto!important;

        form {
            flex-direction: row;
            align-items: normal;

            .programarVideo_arquivos {
                width: 40%;
            }
            .programarVideo_arquivos {
                flex-direction: column;
            }
            .programarVideo_dados {
                width: 60%;
            }
        }
    }
    .visibilidade_hora_wrap {
        display: flex;
        gap: 12px;
    }

    /********** ==================== **********\
    |               TELA ROTEIRO
    \********** ==================== **********/
    #roteiro_descricao_tags {
        grid-template-columns: repeat(2, 1fr)!important;
    }

    /********** ==================== **********\
    |          TELA LISTA DE ROTEIROS
    \********** ==================== **********/
    #roteiros_container {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media(min-width: 1200px) {
    /********** ==================== **********\
    |               TELA CALENDÁRIO
    \********** ==================== **********/
    #main_content_calendario {
        width: 50%;
    }
    .btn_programar_video {
        width: fit-content;
    }

    
    /********** ==================== **********\
    |               TELA ROTEIRO
    \********** ==================== **********/
    #resultados {
        flex-direction: row!important;
    }

    /********** ==================== **********\
    |          TELA LISTA DE ROTEIROS
    \********** ==================== **********/
    #roteiros_container {
        grid-template-columns: repeat(4, 1fr);
    }
}

@media(min-width: 1400px) {
    /********** ==================== **********\
    |               TELA VÍDEO
    \********** ==================== **********/
    #visao_geral {
        max-width: 30%!important;
    }
}