/* to -md */
@media (max-width: 767px) {

    /*****************************
    General
    *****************************/

    .collapse:not(.show) {
        display: none !important;
    }

    .collapsing {
        display: block !important;
        height: 0;
        overflow: hidden;
        transition: height 0.35s ease;
    }

    .glass-button {
        height: 3.0rem;
        width: 15rem;
        font-size: 1.0rem;
    }

    .main-container {
        scroll-snap-type: none;
        overflow-y: auto;
        height: auto;
    }

    .custom-navbar {
        height: 6rem;
        right: 1.7rem;
        left: 1.7rem;
    }

    /*****************************
    Sections
    *****************************/

    .section-intro,
    .section-services,
    .section-contacts {
        min-height: calc(100vh - 8.0rem);
    }

    .section-intro,
    .section-services,
    .section-whoami,
    .section-contacts {
        scroll-snap-align: none;
    }

    section:not(.section-intro) {
        padding-top: 2rem;
        scroll-margin-top: 6.5rem;
    }

    /*****************************
    Intro
    *****************************/

    .section-intro {
        margin-top: 8.0rem;
        align-items: flex-start;
    }

    .section-intro .glass-button {
        height: 3rem;
        width: 15rem;
        font-size: unset;
    }

    .intro-words p {
        font-size: 1rem;
    }

    .intro-card {
        height: 30rem;
        width: 20rem;
    }

    .intro-card .intro-card-section:not(:last-child) {
        border-bottom: 1px solid rgb(119, 119, 119);
    }

    .intro-card .intro-section-name {
        height: 20%;
    }

    .intro-card .intro-section-services {
        height: 30%;
    }

    .intro-card .intro-section-description {
        height: 50%;
    }

    .intro-card .intro-section-name {
        font-size: 0.8rem;
    }

    .intro-card .name {
        font-weight: 700;
        font-size: 1.5rem !important;
    }

    .intro-card .intro-section-services {
        font-size: 0.8em;
    }

    .intro-card .intro-service {
        font-size: 1.0rem;
    }

    .intro-card .icons {
        font-size: 1.2rem;
        margin-bottom: 0 !important;
    }

    .intro-card .intro-section-description {
        font-size: 0.8rem;
    }

    /*****************************
    Services
    *****************************/

    .service-card {
        width: 20rem;
    }

    .service-card-automation,
    .service-card-it {
        height: 41rem;
    }

    .service-card-consulting {
        height: 43rem;
    }

    .service-card .card-title {
        font-size: 1.4rem;
    }

    .service-card .service-description {
        font-size: 0.8rem;
    }

    /*****************************
    Who am I
    *****************************/

    .whyworktogether-card {
        width: 20rem;
        height: 30rem;
    }

    .whyworktogether-card .card-title {
        font-size: 1.4rem;
    }

    .whyworktogether-card .whyworktogether-description {
        font-size: 0.8rem;
    }

    .whyworktogether-card .whyworktogether-description .whyworktogether-title {
        font-size: 1.2rem;
    }

    .aboutme-card {
        width: 20rem;
        height: 35rem;
    }

    .aboutme-card .card-title {
        font-size: 1.4rem;
    }

    .aboutme-card .aboutme-description {
        font-size: 0.8rem;
    }

    .aboutme-card img {
        max-width: 5rem;
    }

    /*****************************
    Contacts
    *****************************/

    .contacts-card {
        width: 20rem;
        height: 38rem;
    }

    .contacts-card .card-title {
        font-size: 1.4rem;
        font-weight: 500;
    }

    .contacts-card .card-subtitle {
        font-size: 1.0rem;
    }

    .contacts-card .contact-item {
        margin-left: -0.5rem;
        margin-right: -0.5rem;
        width: 18rem;
    }

    .contact-icon-wrapper {
        width: 3rem;
        height: 3rem;
    }

    .contact-label {
        display: none;
    }

    .contact-value {
        margin-left: 0.5rem;
        color: white;
        background: none;
        -webkit-text-fill-color: unset;
    }

    .bottom-text {
        font-size: 0.6rem;
    }
}