@media (min-width:991px){
    .mobile-nav{
        display: none;
    }
    .hamburger{
        display: none;
    }
}

@media (max-width:1200px){
    /* Banner */
    .top-right-sec{
        display: none;
    }
    /* Portfolio */
    .portfolio-list {
        column-gap: 5rem;
    }
    .img-holder2 {
        width: 450px;
    }
    .img-holder3 {
        width: 525px;
    }
    .img-holder4 {
        width: 525px;
    } 
    .brand-img {
        width: 200px;
        height: 80px;
        object-fit: cover;
    }   
}

@media (max-width:991px){
    /* Banner */
    .brand-img {
        width: 130px;
        height: 50px;
        object-fit: cover;
    }  
    /* About*/
    .subpara{
        width: 100%;
        text-align: center;
    }
    .about_wrapper{
        text-align: center;
    }
    .about-banner{
        width: 500px;
    }
    /* Portfolio */
    .portfolio_wrapper {
        padding-block-end: 150px;
        margin-block-end: 60px;
    }
    .portfolio-list {
        column-gap: 1rem;
    }
    .img-holder2 {
        width: 350px;
    }
    .img-holder3 {
        width: 425px;
    }
    .img-holder4 {
        width: 425px;
    }
    /*Footer */
    .footer_wrapper{
        background-image: none;
    }
    .responsive-img2{
        background-image: url(../images/footer-bg2.png);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    }
}

@media (max-width:768px){
    h2{
        font-size: 30px;
        line-height: 42px;
    }
    /* Banner */
    .banner-heading{
        width: 399px;
        height: 200px;
    }
    .bottom-img{
        gap: 1rem;
    }
    .brand-img {
        width: 130px;
        height: 50px;
        object-fit: cover;
    }  
    /* Portfolio */
    .portfolio_wrapper {
        padding-block-end: 150px;
        margin-block-end: 60px;
    }
    .portfolio-list {
        display: grid;
        column-gap: 1rem;
        align-items: center;
        justify-content: center;
    }
    .card-margin{
        margin-top: 0rem;
    }
    .card-margin2{
        margin-top: 0rem;
    }
    .card-margin3{
        margin-top: 0rem;
    }
    .card-margin4{
        margin-top: 0rem;
    }
    .img-holder2 {
        width: 500px;
        height: 600px;
    }
    .img-holder3 {
        width: 500px;
        height: 600px;
    }
    .img-holder4 {
        width: 500px;
        height: 600px;
    }
    /*Footer*/
    .img--footer-logo{
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .footer-content{
        margin-top: 3rem;
    }
    .footer__copy{
        margin-top: 3rem;
    }
}

@media (max-width:576px){
    h2{
        font-size: 20px;
    }
    .subpara{
        font-size: 23px;
        line-height: 32px;
    }
    .main-btn{
        display: flex;
        align-items: center;
        justify-content: center;
    }
    /* Banner */
    .banner-heading{
        width: 299px;
        height: 150px;
        margin-top: 23rem;
    }
    .bottom-img{
        gap: 1rem;
    }
    .brand-img {
        width: 100px;
        height: 40px;
        object-fit: cover;
    }  
    /* Gallary */
    .img-cover {
        width: 100%;
        height: 100%;
        object-fit: cover;
      }
    .gallery-list {
        display: grid;
        place-content: center;
    }    
    .gallery-card .btn-icon {
        transform-origin: top right;
        transform: scale(0);
    }    
    .gallery-card:is(:hover, :focus-within) .btn-icon { transform: scale(1); }
    .gallery [data-reveal] {
        transform: translateY(0);
        opacity: 1;
    } 
    /* Portfolio */
    .portfolio_wrapper {
        padding-block-end: 150px;
        margin-block-end: 60px;
    }
    .portfolio-list {
        display: grid;
        column-gap: 1rem;
        align-items: center;
        justify-content: center;
    }
    .card-margin{
        margin-top: 0rem;
    }
    .card-margin2{
        margin-top: 0rem;
    }
    .card-margin3{
        margin-top: 0rem;
    }
    .card-margin4{
        margin-top: 0rem;
    }
    .img-holder2 {
        height: 600px;
        width: 100%;
    }
    .img-holder3 {
        width: 100%;
        height: 600px;
    }
    .img-holder4 {
        width: 100%;
        height: 600px;
    }
}

@media (max-width:450px){
    h2{
        font-size: 20px;
    }
    h3{
        font-size: 20px;
    }
    /* Banner */
    .banner_wrapper{
        min-height: 700px;
        background-image: none;
    }
    .responsive-img{
        background-image: url(../images/responsive-img.png);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    }
    .banner-heading{
        width: 280px;
        height: 150px;
        margin-left: .75rem;
        margin-top: 20rem;
    }
    .box{
        height: 50px;
    }
    .bottom-container{
        top: 724px;
        height: 90px;
    }
    .bottom-img{
        gap: 1rem;
    }
    .brand-img {
        width: 60px;
        height: 25px;
    }
    .text{    
        margin-left: 0%;
    }
    /* Portfolio */
    .portfolio_wrapper {
        padding-block-end: 100px;
        margin-block-end: 60px;
    }
    .portfolio_wrapper .section-title{
        font-size: 40px;
        line-height: 52px;
    }
    .portfolio-list {
        display: grid;
        column-gap: 1rem;
        align-items: center;
        justify-content: center;
    }
    .card-margin{
        margin-top: 0rem;
    }
    .card-margin2{
        margin-top: 0rem;
    }
    .card-margin3{
        margin-top: 0rem;
    }
    .card-margin4{
        margin-top: 0rem;
    }
    .card-banner{
        width: 100%;
    }
    .img-holder2 {
        height: 500px;
        width: 100%;
    }
    .img-holder3 {
        width: 100%;
        height: 500px;
    }
    .img-holder4 {
        width: 100%;
        height: 500px;
    }
    .footer__copy{
        font-size: 1rem;
    }
    .icon1{
        width: 40px;
        height: 40px;
    }
    .img-footer-logo{
        margin-top: -4rem;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .footer_wrapper{
        min-height: 650px;
    }
}
@media (max-width:350px){
    h3{
        font-size: 15px;
    }
    .icon1{
        width: 30px;
        height: 30px;
    }
    .footer__copy{
        font-size: .75rem;
    }
}