/* =========================
   WRAPPER
========================= */

#wrapper{
    width:100%;
}

/* =========================
   MAIN
========================= */

#main{
    width:100%;
    max-width:1350px;

    margin:50px auto;

    padding:0 40px;

    display:flex;
    justify-content:center;
    gap:40px;

    align-items:flex-start;
}

/* =========================
   SIDEBARS
========================= */

#column-one{
    width:220px;
    flex-shrink:0;
}

#column-two{
    width:220px;
    flex-shrink:0;
}

/* =========================
   CONTEÚDO CENTRAL
========================= */

#main-content{

    width:100%;
    max-width:1000px /*720px;*/

    flex:none;
}

/* =========================
   RESPONSIVO
========================= */

@media(max-width:1200px){

    #main{
        gap:25px;
        padding:0 25px;
    }

    #column-one,
    #column-two{
        width:200px;
    }

    #main-content{
        max-width:650px;
    }

}

@media(max-width:980px){

    #main{
        flex-direction:column;
        align-items:center;
    }

    #column-one,
    #column-two,
    #main-content{
        width:100%;
        max-width:850px;
    }

}

@media(max-width:768px){

    #main{
        padding:0 16px;
        margin:25px auto;
    }

}