/* Minification failed. Returning unminified contents.
(13,17): run-time error CSS1039: Token not allowed after unary operator: '-primary-normal'
(19,17): run-time error CSS1039: Token not allowed after unary operator: '-black-title'
(20,23): run-time error CSS1039: Token not allowed after unary operator: '-font-title'
(22,23): run-time error CSS1039: Token not allowed after unary operator: '-font-medium'
(37,28): run-time error CSS1039: Token not allowed after unary operator: '-footer-background'
(40,28): run-time error CSS1039: Token not allowed after unary operator: '-primary-light'
(53,17): run-time error CSS1039: Token not allowed after unary operator: '-black-title'
(54,23): run-time error CSS1039: Token not allowed after unary operator: '-font-title'
(56,23): run-time error CSS1039: Token not allowed after unary operator: '-font-medium'
(74,17): run-time error CSS1039: Token not allowed after unary operator: '-black-title'
(75,23): run-time error CSS1039: Token not allowed after unary operator: '-font-title'
(77,23): run-time error CSS1039: Token not allowed after unary operator: '-font-medium'
(123,26): run-time error CSS1039: Token not allowed after unary operator: '-gray-text'
(131,26): run-time error CSS1039: Token not allowed after unary operator: '-primary-normal'
 */
#about {
    padding: 90px 0 150px 0;
}
/*MAIN*/
#about .title-box {
    align-items: center;
    display: flex;
    flex-flow: column;
    justify-content: center;
    height: 100%
}
#about .pretitle {
    color: var(--primary-normal);
    font-size: 1rem; 
    margin-bottom: 1.25rem;
    text-align: center;
}
#about .title {
    color: var(--black-title);
    font-family: var(--font-title);
    font-size: 1.625rem;
    font-weight: var(--font-medium);
    margin-bottom: 2rem;
    text-align: center;
}
#about .subtitle {
    font-size: 1rem;
    text-align: center;
}
/*END MAIN*/
/*MISSION*/
#about .mission-box {
    margin: 100px 0;
    padding: 50px;
}
#about .mission-box.mission-box-1 {
    background-color: var(--footer-background);
}
#about .mission-box.mission-box-2 {
    background-color: var(--primary-light);
}
#about .mission-box.mission-box-3 {
    background-color: #E0F0E3;
}
#about .mission-box .mission-image {
    height: auto;
    margin-bottom: 2rem;
    width: 100px;
}
#about .mission-box .mission-info {
}
#about .mission-box .mission-title {
    color: var(--black-title);
    font-family: var(--font-title);
    font-size: 1.625rem;
    font-weight: var(--font-medium);
}
#about .mission-box .mission-text {
    font-size: 1rem;
}
/*MISSION*/
/*VALUES*/
#about .values-box {
    align-items: flex-start;
    display: flex;
    flex-flow: column;
    justify-content: center;
    height: 100%
}
#about .values-box .values-title {
    margin: 0
}
#about .values-box .values-text {
    color: var(--black-title);
    font-family: var(--font-title);
    font-size: 1.5rem;
    font-weight: var(--font-medium);
    margin: 1.375rem 0 1.375rem 1.375rem;
    transition: all 0.3s ease-in-out;
}
#about .values-box .values-text:hover {
    margin-left: 2rem;
}
#about .values-box .values-text i {
    font-size: 1.1rem;
    transition: all 0.3s ease-in-out;
}
#about .values-box .values-text:last-child {
    margin-bottom: 0;
}
/*END VALUES*/
/*RESPONSIVE*/
/*XS && SM*/
@media (max-width: 767px) {
    #about {
        padding: 3rem 0;
    }
    #about .title {
        font-size: 1.25rem;
    }
    #about .subtitle {
        font-size: 1rem;
        margin-bottom: 2rem;
    }
}
/*XS TO MD*/
@media (max-width: 991px) {
    #about #mission-carousel {
        margin: 2rem 0;
    }
    #about .mission-box {
        align-items: center;
        display: flex;
        flex-flow: column;
        justify-content: center;
        text-align: center;
        margin: 0 0 2rem 0;
    }
    #about .mission-box .mission-image {
        width: 42px;
    }
    #about .carousel-indicators button {
        background: var(--gray-text);
        border: none;
        border-radius: 50%;
        height: 7px;
        padding: 0;
        width: 7px;
    }
    #about .carousel-indicators .active {
        background: var(--primary-normal);
    }
    #about .values-box {
        align-items: center;
    }
    #about .values-box .values-title{
        text-align: center;
    }
    #about .values-box .fa-ul,
    #about .values-box .values-text {
        font-size: 1rem;
        margin: 1.25rem 0 1.25rem 0;
        padding: 0;
        text-align: center;
    }
    #about .values-box .values-text span {
        display: none;
    }
}
/*END RESPONSIVE*/