@import '/css/common.css';


#about .about{
    flex-direction: column-reverse;
    text-align: center;
    max-width: 1200px;
    margin: 0 auto;
    padding: 100px 20px;
}
/* 
#about{
    height: 115vh;
    width: 100%;
} 
*/

#about .col-left{
    width: 300px;
    height: 350px;
}

#about .col-right{
    width: 100%;
}
#about .col-right h3{
    font-size: 1.8rem;
    font-weight: 500;
    letter-spacing: 0.3rem;
}   


#about .cta{
    display: inline-block;
    padding: 10px 20px;
    color: crimson;
    text-transform: uppercase;
    font-size: 1.5rem;
    border: 2px solid crimson;
    letter-spacing: .2rem;
    /* margin-top: 30px; */
    transition: .35s ease-in-out background-color; 
    /* border-radius: 14% 0%; */
    background: transparent;
    margin:30px auto;
}

#about .cta:hover{
    background-color: rgb(216, 52, 85);
    color: rgb(255, 255, 255) ;   
}
#about .col-left .about-img{
    position: relative;
    border: 10px solid white;
}

#about .col-left .about-img::after{
    content: " ";
    position: absolute;
    left: -23px;
    top: 19px;
    height: 95%;
    width: 98%;
    border: 5px solid red;
    z-index: -1;
}