/****tablat****/
#navbar .main-nav {
    flex-direction: column;
}

#navbar .logo {
    margin-bottom: 1.2rem;    
}

#navbar ul {
    margin-bottom: 1rem;
}

/* showcase */
#showcase .main-section {
    grid-template-columns: repeat(4, 1fr);
}

/* technology */
#technology .info-icon {
    grid-template-columns: repeat(2, 1fr);
}

#technology .logo {
    grid-template-columns: repeat(3, 1fr);
}

 /* footer */
 #footer .footer-content {
    flex-direction: column;
}


/* mobile responsive */
@media(max-width: 500px) {
    #navbar ul {
     flex-direction: column;
    }

    #navbar ul li  {
        padding-bottom: 2rem;
    }


    /* showcase */
    #showcase .showcase-content {
        grid-template-columns: 1fr;
        text-align: center;
    }

    #showcase .main-section {
        grid-template-columns: repeat(2, 1fr);
    }

    /* technology */
    #technology .info-icon {
        grid-template-columns: 1fr;
    }
    #technology .info-icon div{
        border: 1px solid #887878;
        padding-bottom: 1rem;
    }
    
    #technology .logo {
        grid-template-columns: repeat(1, 1fr);
        display: inline-block;
    }

    /* customers */
    #customers .section-a, .section-b, .section-c {
        grid-template-columns: 1fr;
    }

    /* company */
    #company .info-company {
        grid-template-columns: 1fr;
        grid-gap: 1rem;
        text-align: center;
    }

    /* customers */
    #customers .section-a, .section-b, .section-c {
        margin-bottom: 2rem;
        border: 1px solid #887878;
    }

    #customers  h1 {
        text-align: center;
    }

    #company .info-company div {
        border: 1px solid #887878;
        padding: 20px;
    }

    /* footer */
    #footer .footer-content h1, p {
        text-align: center;
    }
    
    #footer .social {
        text-align: center;
    }
}