/* ==========================================
   Radio Mega-Sunshine Framework
   Responsive
========================================== */

/* ===========================
   Laptop
=========================== */

@media (max-width:1200px){

    .site-container{

        grid-template-columns:240px 1fr 240px;

        gap:20px;

    }

}


/* ===========================
   Tablet
=========================== */

@media (max-width:992px){

    .header-top{

        flex-direction:column;

        gap:20px;

    }

    .main-menu{

        flex-wrap:wrap;

        justify-content:center;

    }

    .site-container{

        grid-template-columns:1fr;

    }

    .left-sidebar{

        order:2;

    }

    .content{

        order:1;

    }

    .right-sidebar{

        order:3;

    }

}


/* ===========================
   Handy
=========================== */

@media (max-width:768px){

    h1{

        font-size:2.2rem;

    }

    h2{

        font-size:1.6rem;

    }

    .hero{

        min-height:380px;

    }

    .hero-overlay{

        padding:60px 20px;

    }

    .hero-buttons{

        flex-direction:column;

        align-items:center;

    }

    .btn{

        width:260px;

        text-align:center;

    }

    .main-menu{

        flex-direction:column;

        width:100%;

        gap:10px;

    }

    .main-menu li{

        width:100%;

    }

    .main-menu li a{

        text-align:center;

    }

}


/* ===========================
   Kleine Smartphones
=========================== */

@media (max-width:480px){

    .logo img{

        max-height:65px;

    }

    h1{

        font-size:1.8rem;

    }

    .card{

        padding:18px;

    }

}