/* Values */
.values {
    position: relative;
}

.values .col-12 {
    background-color: #081F2C ;
    align-content: center;
}

.values .row:first-child .col-12 {
    background-color: #1C2D3A;
} 

 
/* .values .row .col-12:hover {
    background-color: #002b55;
    color: var(--primary);
    transition: 2s all;
} */

.values .row .col-12:hover  {
    background-color: #fff;
    transition: 2s all;    
}

.values .col-12:hover h2,
.values .col-12:hover .description {
    color: var(--primary);
    transition: 2s all;
}
.values .col-12:hover h2 {
    border-bottom: 1px solid var(--primary);
}


.values .content {
    color: var(--white);
    padding: 0% 25%;
}

.values .title {
    border-bottom: 1px solid var(--white);
    color: var(--white);
    padding-bottom: 4%;
    margin-bottom: 4%;    
}

.values .description {
    font-size:21px;
    margin-bottom: 0px;
}

.values {
    margin-top: 50px;
}

@media(min-width:768px){
    .values {
        z-index: 1;
    }
}
@media(max-width:600px){
    .values .title,
    .values .content p {
        text-align: center !important;
    }
    .values .description {
        font-size: 14px;
    }
    .values .content {
        color: var(--white);
        padding: 10% 10%;
    }
    .values .row    {
        flex-direction: column-reverse;
    }    
}