:root{

    --white-color:#fffefe;

    --bg-color:#09706b;

    --font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

}

.section_count{
    background-color: rgb(19, 54, 107);
    margin-bottom: 3%;
    /* background-image: url(/assets/images/home/why_choose_us/clueless-confused-cute-timid-girl-shrugging-unaware-pointing-fingers-sideways-two-sides-with-indecisive-face-standing-blue-background.jpg); */
}

.suva-content{

    height: auto;

    width: 100%;

    padding-top: 40px;
    padding-bottom: 20px;

    display: flex;

    flex-wrap: wrap;

    justify-content: space-evenly;

    align-items: center;

    /* background: linear-gradient(#023262, #12c3f2); */

}

.suva-content .box{

    height: 270px;

    width: 270px;

    margin-bottom: 40px;

    position: relative;

    overflow: hidden;

}

.suva-content .box .main-box{

    position: absolute;

    height: 100%;

    width: 100%;

    clip-path: polygon(100% 50%, 0 50%, 50% 80%);

    background-color: #13366b;

    z-index: 3;

}

.suva-content .box .bg-box{

    position: absolute;

    height: 100%;

    width: 100%;

    top: 4px;

    z-index: 2;

    clip-path: polygon(100% 50%, 0 50%, 50% 86%);

    background-color: white;

}

.suva-content .box .text-box{

    position: absolute;

    width: 100%;

    justify-items: center;

    align-content: center;
    text-align: center;
    top: 40px;
    z-index: 3;
    cursor: pointer;

}
 .suva-content .box .text-box .text {
    text-transform: capitalize;
    color: var(--white-color);
    /* background: linear-gradient(#023262, #12c3f2); */
    border-radius: 9px;
    text-align: center;
    align-content: center;
    font-size: 14px;
    font-weight: 600;
    padding: 11px 24px;
    /* box-shadow: 0px 0px 5px 2px #e4e4e4; */
    margin-bottom: 2px;
    /* border: 4px solid var(--white-color); */
 }

/* .suva-content .box .text-box .text{

    text-transform: capitalize;

    color: var(--white-color);

        background: linear-gradient(#023262, #12c3f2);

    border-radius: 20px;

    text-align: center;

    align-content: center;

    font-size: 18px;

    font-weight: 600;
    
    padding: 14px 15px;

    margin-bottom:12px;

    box-shadow: 0px 0px 5px 2px #e4e4e4;

    border: 4px solid var(--white-color);

} */

.suva-content .box .text-box i{
    font-size: 3rem;
    color: white;
}
.suva-content .box .text-box p{

    color: var(--white-color);

    text-align: center;

    align-content: center;

    font-size: 30px;

    font-weight: 800;
    margin-bottom: 20px;

}
@media (max-width:1070px) {
    .suva-content .box {
        margin: 0;
    }
}