#hero{
    padding: 100px 0;
    color: #fff;
}

#hero .inner{
    padding: 0 200px;
    margin-bottom: 50px;
}

#hero h1{
    margin: 0 0 50px;
}

@media(max-width:991px){
    #hero .inner{
        padding: 0;
    }
}


#services{
    padding: 50px 0;
}

#services .row{
    justify-content: center;
}

#services .inner{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 50px;
}

#services .left{
    width: 34%;
}

#services img{
    width: 100%;
    border-radius: 60px;
}

#services .right{
    width: 64%;
}

#services h5{
    color: #26555A;
}

#services .click a{
    color: #26555A;
    font-size: 18px;
    text-decoration: none;
    display: flex;
    align-items: center;
    width: fit-content
}

#services .click a:hover{
    color: #00B3BF;
}

#services .click a i{
    margin-left: 10px;
}

@media(max-width:991px){
    #services .inner{
        flex-direction: column;
    }
    
    #services .left,
    #services .right{
        width: 60%;
        text-align: center;
    }
    
    #services .left{
        margin-bottom: 30px;
    }
    
    #services .click a{
        justify-content: center;
        width: auto;
    }
}

@media(max-width:767px){
    #services .left,
    #services .right{
        width: 90%;
        text-align: center;
    }
}