/* 

1. Add your custom Css styles below
2. Place the this code in your template: 

 <link href="css/custom.css" rel="stylesheet">

*/

.flex-same-width {
    flex: 1;
}

.custom-btn {
    padding: 0.5rem 1rem;
    border: solid 2px;
    border-radius: 100px;
    transition: background-color 0.2s, color 0.2s;
    color: white!important;
}

.btn-red {
    background-color: #c0272d;
    border-color: #c0272d;
}

.btn-red:hover {
    background-color: white;
    border-color: #c0272d;
    color: #c0272d!important;
}

.btn-blue {
    background-color: #0071bb;
    border-color: #0071bb;
}

.btn-blue:hover {
    background-color: white;
    border-color: #0071bb;
    color: #0071bb!important;
}

.text-section-3 {
    text-align: left;
}

.image {
    margin: 3rem 0;
    max-width: 400px;
}

@media (max-width: 767px) {
    .text-section-3 {
        text-align: center;
    }
}

@media (max-width: 500px)
{

    .image {
        max-width: 100%;
    }

}

@media (max-width: 366px) {
    
    .custom-btn {
        font-size: 12px ;
    }
}