@import url(mainStyle.css);

.subsection {
    width: 100%;
    padding: 5%;
    border: 2px solid var(--main-primary-color);
    background-color: var(--main-primary-color);
    margin: auto;
}

.subsection-3 {
    width: 100%;
    background-color: var(--main-primary-color);
}

.col {
    margin-bottom: 5px;
}

.social {
    margin-bottom: 2vh;
}

.separator {
    width: 100%;
    margin-top: 5vh;
    margin-bottom: 3vh;
    background-color: transparent;
}

.separator-e {
    width: 100%;
    margin-top: 5vh;
    margin-bottom: 3vh;
    background-color: transparent;
}

.horizontal-separator {
    width: 1px;
    margin-top: 1vh;
    margin-bottom: 1vh;
}

@media (max-width:480px) {
    .horizontal-separator {
        width: 100%;
        margin-top: 5vh;
        margin-bottom: 3vh;
    }
}

.card {
    margin-bottom: 3vh;
}

.subsection-2 {
    width: 100%;
    padding: 10px;
    background-color: var(--main-primary-color);
}

.section-style {
    min-height: 45vh;
}

.text-center {
    justify-content: center;
    text-align: center;
}

/* tm */

@media (min-width:480px) {
    .subsection-middle-s {
        background-color: red;
        margin: auto;
    }
}


@media (max-width:480px) {
    .responsive-subsection-middle-tm {
        border-radius: 0px var(--radius-bord-2) var(--radius-bord-2) 0px;
        margin-right: 5%;
        width: 95%;
    }
}

@media (min-width:480px) {
    .responsive-subsection-middle-tm {
        margin: auto;
        width: 93%;
        border-radius: var(--radius-bord-2);
    }
}

/* AVM */
@media (max-width:480px) {
    .responsive-subsection-middle-avm {
        border-radius: 0px var(--radius-bord) var(--radius-bord) 0px;
        margin-right: 5%;
        width: 95%;
    }
}

@media (min-width:480px) {
    .responsive-subsection-middle-avm {
        margin: auto;
        width: 90%;
        border-radius: var(--radius-bord);
    }
}

/* About */
@media (max-width:480px) {
    .responsive-subsection-middle-about {
        border-radius: var(--radius-bord) 0px 0px var(--radius-bord);
        margin-top: 2vh;
        margin-left: 5%;
    }
}

@media (min-width:480px) {
    .responsive-subsection-middle-about {
        margin: auto;
        width: 90%;
        border-radius: var(--radius-bord);
    }
}