/* =============================================================================
   MY Accounting & Tax Solutions
   =============================================================================
   File        : responsive.css
   File Code   : CSS008
   Version     : 1.0.0
   Description : Responsive Website Styles
   Author      : MY Accounting & Tax Solutions
   ============================================================================= */


/* =============================================================================
   Large Devices
   ============================================================================= */

@media (max-width: 1199.98px) {

    .hero h1{

        font-size:3rem;

    }

}


/* =============================================================================
   Tablets
   ============================================================================= */

@media (max-width:991.98px){

    /* Header */

    .navbar{

        padding:15px 0;

    }

    .brand-tagline{

        display:none;

    }

    .navbar-collapse{

        margin-top:20px;

    }

    .navbar-nav{

        align-items:flex-start !important;

    }

    .navbar-nav .nav-item{

        width:100%;

    }

    .navbar-nav .nav-link{

        padding:12px 0;

    }

    /* Hero */

    .hero{

        padding:80px 0;

        text-align:center;

    }

    .hero-content{

        margin-bottom:50px;

    }

    .hero h1{

        font-size:2.7rem;

    }

    .hero-buttons{

        justify-content:center;

    }

    .hero-features{

        justify-content:center;

    }

    /* Sections */

    .section-header{

        margin-bottom:50px;

    }

    .home-section{

        padding:80px 0;

    }

    /* Footer */

    .site-footer{

        text-align:center;

    }

}


/* =============================================================================
   Mobile Devices
   ============================================================================= */

@media (max-width:767.98px){

    .hero{

        padding:60px 0;

    }

    .hero h1{

        font-size:2.2rem;

    }

    .hero-buttons{

        flex-direction:column;

        gap:15px;

    }

    .hero-buttons .btn{

        width:100%;

    }

    .hero-features{

        flex-direction:column;

        align-items:center;

        gap:15px;

    }

    .section-header h2{

        font-size:2rem;

    }

    .about-image{

        margin-bottom:30px;

    }

    .why-item{

        flex-direction:column;

        text-align:center;

    }

    .why-item i{

        margin-bottom:15px;

    }

    .cta-contact-item{

        margin-bottom:30px;

    }

}


/* =============================================================================
   Small Mobile Devices
   ============================================================================= */

@media (max-width:575.98px){

    .container{

        padding-left:20px;

        padding-right:20px;

    }

    .hero h1{

        font-size:1.9rem;

    }

    .badge-primary{

        font-size:.75rem;

    }

    .section-header h2{

        font-size:1.75rem;

    }

    .card{

        border-radius:15px;

    }

}