@import url('https://fonts.googleapis.com/css2?family=Aladin&family=Butcherman&family=Emblema+One&family=Ewert&family=Fondamento&family=Gotu&family=IM+Fell+DW+Pica+SC&family=Julee&family=Metal+Mania&family=Overlock+SC&family=Rampart+One&family=Rye&family=Sancreek&family=Sansita+Swashed&family=Vollkorn+SC:wght@600;700&family=Ysabeau+SC:wght@400;500&display=swap');


  *{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    /* overflow-x: hidden !important; */
}
html{
    overflow-x: hidden !important;

}
body{
    background-color: #FFE5B4;
}

@media (min-width:250px) {
    .service_banner{
        width: 100%; 
        height: 100%;
        margin-bottom: 40px;
    }
    .service_banner video{
        width: 100%;
        position: absolute;
        z-index: -1;
    }
    .service_banner .banner_heading{
        position: absolute;
        top: 12%;
        bottom: 0;
        left: 0;
        right: 0;
        font-size: 24px;
        text-align: center;
        text-transform: capitalize;
        font-weight: 700;
        /* padding-top: 60px; */
        color: aliceblue;
    }
    .service_banner ol li a{
        text-decoration: none;
        color: antiquewhite;
    }
    .service_banner ol{
        margin: 0;
        width: auto;
    }
    .service_banner ol li{
        color: antiquewhite !important;
        position: relative; 
        padding-top: 49%;
        left: 60%;
    }
    
    .over-row{
        padding-left: 10px;
        padding-right: 10px;
    }
    .main-service-content{
        text-align: center;
        background-color: #FFE5B4;
        color: rgb(0, 0, 0);
    }.main-service-content>h2{
        font-family: 'Aladin', cursive;
        margin: 10px 0;
        letter-spacing: 2px;
    
    }
    .main-service-content>P{
        font-family: 'Aref Ruqaa', serif;
        font-size: 20px;
        text-transform: capitalize;
        line-height: 25px;
        text-align:justify ;
        /* text-align: center; */
        letter-spacing: 1px;
    }
    .service-col img{
        width: 250px;
    }
    .service-col-content{
        text-align: center;
    }
    .service-col-content>h2{
        font-family: 'Aladin', cursive;
        font-size: 24px;
        font-weight: 700;
        margin:15px 0;
        letter-spacing: 2px;
    }
    .service-col-content>p{
        text-align: justify;
    }
    .service-img{
        /* margin: 4rem 0 0 0; */
        text-align: center;
    }
    .service-work{
        text-align: left;
        font-weight: 600;
        margin-bottom: 10px;
        letter-spacing: 1px;
        line-height: 20px;
        font-size: 14px;
        text-transform: uppercase;
    }
    .line{
        width: 15%;
        height: 3px;
        margin-bottom: 20px;
        background-color: aliceblue;
    }
    .line-1{
        background-color: plum;
    }
    .line-2{
        background-color: rgb(241, 99, 48);
    }
    .line-3{
        background-color: #DFFF00;
    }
    .line-4{
        background-color: rgb(94, 94, 226);
    }
    .line-5{
        background-color: aquamarine;
    }
    .line-6{
        background-color: rgb(0, 174, 255);
    }
    .line-7{
        background-color: rgb(238, 40, 40);
    }
    
    .end-line{
        margin: 2px 0;
        height: 2px;
        background-color: rgb(255, 166, 0);
    }
    .service-row{
        margin: 30px 0;
        /* border: 1px solid white;
        padding: 5px; */
    }
    .service-col-content:hover .line{
        width: 100%;
        transition: .7s;
    
    } 
}


/* // Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) { 
    .service_banner{
        width: 100%; 
        height: 100%;
        margin-bottom: 40px;
    }
    .service_banner video{
        width: 100%;
        position: absolute;
        z-index: -1;
    }
    .service_banner .banner_heading{
        position: absolute;
        top: 18%;
        bottom: 0;
        left: 0;
        right: 0;
        font-size: 32px;
        text-align: center;
        text-transform: capitalize;
        font-weight: 700;
        /* padding-top: 60px; */
        color: aliceblue;
    }
    .service_banner ol li a{
        text-decoration: none;
        color: antiquewhite;
    }
    .service_banner ol{
        margin: 0;
        width: auto;
    }
    .service_banner ol li{
        color: antiquewhite !important;
        position: relative; 
        padding-top: 52%;
        left: 75%;
    }
    
    .over-row{
        padding-left: 10px;
        padding-right: 10px;
    }
    .main-service-content{
        text-align: center;
        background-color: #FFE5B4;
        color: rgb(0, 0, 0);
    }.main-service-content>h2{
        font-family: 'Aladin', cursive;
        margin: 10px 0;
    
    }
    .main-service-content>P{
        font-family: 'Aref Ruqaa', serif;
        font-size: 20px;
        text-transform: capitalize;
        line-height: 25px;
        text-align:justify ;
        /* text-align: center; */
        letter-spacing: 1px;
    }
    .service-col img{
        width: 250px;
    }
    .service-col-content{
        text-align: center;
    }
    .service-col-content>h2{
        font-family: 'Aladin', cursive;
        font-size: 24px;
        font-weight: 700;
        margin:15px 0;
        letter-spacing: 2px;
    }
    .service-col-content>p{
        text-align: justify;
    }
    .service-img{
        /* margin: 4rem 0 0 0; */
        text-align: center;
    }
    .service-work{
        text-align: left;
        font-weight: 600;
        margin-bottom: 10px;
        letter-spacing: 1px;
        line-height: 20px;
        font-size: 14px;
        text-transform: uppercase;
    }
    .line{
        width: 15%;
        height: 3px;
        margin-bottom: 20px;
        background-color: aliceblue;
    }
    .line-1{
        background-color: plum;
    }
    .line-2{
        background-color: rgb(241, 99, 48);
    }
    .line-3{
        background-color: #DFFF00;
    }
    .line-4{
        background-color: rgb(94, 94, 226);
    }
    .line-5{
        background-color: aquamarine;
    }
    .line-6{
        background-color: rgb(0, 174, 255);
    }
    .line-7{
        background-color: rgb(238, 40, 40);
    }
    
    .end-line{
        margin: 2px 0;
        height: 2px;
        background-color: rgb(255, 166, 0);
    }
    .service-row{
        margin: 30px 0;
        /* border: 1px solid white;
        padding: 5px; */
    }
    .service-col-content:hover .line{
        width: 100%;
        transition: .7s;
    
    } 
 }

/* // Medium devices (tablets, 768px and up) */
@media (min-width: 768px) { 
    .service_banner{
        width: 100%; 
        height: 100%;
        margin-bottom: 40px;
    }
    .service_banner video{
        width: 100%;
        position: absolute;
        z-index: -1;
    }
    .service_banner .banner_heading{
        position: absolute;
        top: 25%;
        bottom: 0;
        left: 0;
        right: 0;
        font-size: 40px;
        text-align: center;
        text-transform: capitalize;
        font-weight: 700;
        /* padding-top: 60px; */
        color: aliceblue;
    }
    .service_banner ol li a{
        text-decoration: none;
        color: antiquewhite;
    }
    .service_banner ol{
        margin: 0;
        width: auto;
    }
    .service_banner ol li{
        color: antiquewhite !important;
        position: relative; 
        padding-top: 52%;
        left: 82%;
    }
    
    .over-row{
        padding-left: 10px;
        padding-right: 10px;
    }
    .main-service-content{
        text-align: center;
        background-color: #FFE5B4;
        color: rgb(0, 0, 0);
    }.main-service-content>h2{
        font-family: 'Aladin', cursive;
        margin: 10px 0;
        letter-spacing: 2px;
    
    }
    .main-service-content>P{
        font-family: 'Aref Ruqaa', serif;
        font-size: 20px;
        text-transform: capitalize;
        line-height: 25px;
        text-align:justify ;
        /* text-align: center; */
        letter-spacing: 1px;
    }
    .service-col img{
        width: 260px;
    }
    .service-col-content{
        text-align: center;
    }
    .service-col-content>h2{
        font-family: 'Aladin', cursive;
        font-size: 24px;
        font-weight: 700;
        margin:15px 0;
        letter-spacing: 2px;
    }
    .service-col-content>p{
        text-align: justify;
    }
    .service-img{
        /* margin: 4rem 0 0 0; */
        text-align: center;
    }
    .service-work{
        text-align: left;
        font-weight: 600;
        margin-bottom: 10px;
        letter-spacing: 1px;
        line-height: 20px;
        font-size: 14px;
        text-transform: uppercase;
    }
    .line{
        width: 15%;
        height: 3px;
        margin-bottom: 20px;
        background-color: aliceblue;
    }
    .line-1{
        background-color: plum;
    }
    .line-2{
        background-color: rgb(241, 99, 48);
    }
    .line-3{
        background-color: #DFFF00;
    }
    .line-4{
        background-color: rgb(94, 94, 226);
    }
    .line-5{
        background-color: aquamarine;
    }
    .line-6{
        background-color: rgb(0, 174, 255);
    }
    .line-7{
        background-color: rgb(238, 40, 40);
    }
    
    .end-line{
        margin: 2px 0;
        height: 2px;
        background-color: rgb(255, 166, 0);
    }
    .service-row{
        margin: 30px 0;
        /* border: 1px solid white;
        padding: 5px; */
    }
    .service-col-content:hover .line{
        width: 100%;
        transition: .7s;
    
    } 
 }

/* // Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 
    .service_banner{
        width: 100%; 
        height: 100%;
        margin-bottom: 40px;
    }
    .service_banner video{
        width: 100%;
        position: absolute;
        z-index: -1;
    }
    .service_banner .banner_heading{
        position: absolute;
        top: 30%;
        bottom: 0;
        left: 0;
        right: 0;
        font-size: 42px;
        text-align: center;
        text-transform: capitalize;
        font-weight: 700;
        /* padding-top: 60px; */
        color: aliceblue;
    }
    .service_banner ol li a{
        text-decoration: none;
        color: antiquewhite;
    }
    .service_banner ol{
        margin: 0;
        width: auto;
    }
    .service_banner ol li{
        color: antiquewhite !important;
        position: relative; 
        padding-top: 53%;
        left: 84%;
    }
    
    .over-row{
        padding-left: 10px;
        padding-right: 10px;
    }
    .main-service-content{
        text-align: center;
        background-color: #FFE5B4;
        padding-top: 20px;
        color: rgb(0, 0, 0);
    }.main-service-content>h2{
        font-family: 'Aladin', cursive;
        margin: 10px 0;
        letter-spacing: 2px;
    
    }
    .main-service-content>P{
        font-family: 'Aref Ruqaa', serif;
        font-size: 20px;
        text-transform: capitalize;
        line-height: 25px;
        text-align:justify ;
        /* text-align: center; */
        letter-spacing: 1px;
    }
    .service-col img{
        width: 270px;
    }
    .service-col-content{
        text-align: center;
    }
    .service-col-content>h2{
        font-family: 'Aladin', cursive;
        font-size: 24px;
        font-weight: 700;
        margin:15px 0;
        letter-spacing: 2px;
    }
    .service-col-content>p{
        text-align: justify;
    }
    .service-img{
        /* margin: 4rem 0 0 0; */
        text-align: center;
    }
    .service-work{
        text-align: left;
        font-weight: 600;
        margin-bottom: 10px;
        letter-spacing: 1px;
        line-height: 20px;
        font-size: 14px;
        text-transform: uppercase;
    }
    .line{
        width: 15%;
        height: 3px;
        margin-bottom: 20px;
        background-color: aliceblue;
    }
    .line-1{
        background-color: plum;
    }
    .line-2{
        background-color: rgb(241, 99, 48);
    }
    .line-3{
        background-color: #DFFF00;
    }
    .line-4{
        background-color: rgb(94, 94, 226);
    }
    .line-5{
        background-color: aquamarine;
    }
    .line-6{
        background-color: rgb(0, 174, 255);
    }
    .line-7{
        background-color: rgb(238, 40, 40);
    }
    
    .end-line{
        margin: 2px 0;
        height: 2px;
        background-color: rgb(255, 166, 0);
    }
    .service-row{
        margin: 30px 0;
        /* border: 1px solid white;
        padding: 5px; */
    }
    .service-col-content:hover .line{
        width: 100%;
        transition: .7s;
    
    } 
 }

/* // X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 
    .service_banner{
        width: 100%; 
        height: 100%;
        margin-bottom: 40px;
    }
    .service_banner video{
        width: 100%;
        position: absolute;
        z-index: -1;
    }
    .service_banner .banner_heading{
        position: absolute;
        top: 40%;
        bottom: 0;
        left: 0;
        right: 0;
        width: 80%;
        margin: 0 auto;
        font-size: 45px;
        text-align: center;
        text-transform: capitalize;
        font-weight: 700;
        /* padding-top: 60px; */
        color: aliceblue;
    }
    .service_banner ol li a{
        text-decoration: none;
        color: antiquewhite;
    }
    .service_banner ol{
        margin: 0;
        width: auto;
    }
    .service_banner ol li{
        color: antiquewhite !important;
        position: relative; 
        padding-top: 53%;
        left: 85%;
    }
    
    .over-row{
        padding-left: 10px;
        padding-right: 10px;
    }
    .main-service-content{
        text-align: center;
        background-color: #FFE5B4;
        color: rgb(0, 0, 0);
    }.main-service-content>h2{
        font-family: 'Aladin', cursive;
        margin: 10px 0;
        letter-spacing: 2px;
    
    }
    .main-service-content>P{
        font-family: 'Aref Ruqaa', serif;
        font-size: 20px;
        text-transform: capitalize;
        line-height: 25px;
        text-align:justify ;
        /* text-align: center; */
        letter-spacing: 1px;
    }
    .service-col img{
        width: 280px;
    }
    .service-col-content{
        text-align: center;
    }
    .service-col-content>h2{
        font-family: 'Aladin', cursive;
        font-size: 24px;
        font-weight: 700;
        margin:15px 0;
        letter-spacing: 2px;
    }
    .service-col-content>p{
        text-align: justify;
    }
    .service-img{
        /* margin: 4rem 0 0 0; */
        text-align: center;
    }
    .service-work{
        text-align: left;
        font-weight: 600;
        margin-bottom: 10px;
        letter-spacing: 1px;
        line-height: 20px;
        font-size: 14px;
        text-transform: uppercase;
    }
    .line{
        width: 10%;
        height: 3px;
        margin-bottom: 20px;
        background-color: aliceblue;
    }
    .line-1{
        background-color: plum;
    }
    .line-2{
        background-color: rgb(241, 99, 48);
    }
    .line-3{
        background-color: #DFFF00;
    }
    .line-4{
        background-color: rgb(94, 94, 226);
    }
    .line-5{
        background-color: aquamarine;
    }
    .line-6{
        background-color: rgb(0, 174, 255);
    }
    .line-7{
        background-color: rgb(238, 40, 40);
    }
    
    .end-line{
        margin: 2px 0;
        height: 2px;
        background-color: rgb(255, 166, 0);
    }
    .service-row{
        margin: 30px 0;
        /* border: 1px solid white;
        padding: 5px; */
    }
    .service-col-content:hover .line{
        width: 100%;
        transition: .7s;
    
    } 
 }


 /* // XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {  
    .service_banner{
        width: 100%; 
        height: 100%;
        margin-bottom: 40px;
    }
    .service_banner video{
        width: 100%;
        position: absolute;
        z-index: -1;
    }
    .service_banner .banner_heading{
        position: absolute;
        top: 40%;
        bottom: 0;
        left: 0;
        width: 80%;
        margin: 0 auto;
        right: 0;
        font-size: 52px;
        text-align: center;
        text-transform: capitalize;
        /* backdrop-filter: blur(10px); */
        font-weight: 700;
        /* padding-top: 60px; */
        height: 70px;
        color: aliceblue;
    }
    .service_banner ol li a{
        text-decoration: none;
        color: antiquewhite;
    }
    .service_banner ol{
        margin: 0;
        width: auto;
    }
    .service_banner ol li{
        color: antiquewhite !important;
        position: relative; 
        padding-top: 45%;
        left: 86%;
    }
    
    .over-row{
        padding-left: 10px;
        padding-right: 10px;
    }
    .main-service-content{
        text-align: center;
        background-color: #FFE5B4;
        margin: 0 auto;
        width: 70%;
        padding-top: 30px;
        color: rgb(0, 0, 0);
    }.main-service-content>h2{
        font-family: 'Aladin', cursive;
        margin: 10px 0;
    
    }
    .main-service-content>P{
        font-family: 'Aref Ruqaa', serif;
        font-size: 20px;
        text-transform: capitalize;
        line-height: 25px;
        /* text-aligify; */
        letter-spacing: 1px;
    }
    .service-col img{
        width: 400px;
    }
    .service-col-content{
        text-align: center;
        margin: 3rem 0 0 0;
    }
    .service-col-content>h2{
        font-family: 'Aladin', cursive;
        font-size: 28px;
        text-transform: uppercase;
        font-weight: 700;
        margin:15px 0;
        letter-spacing: 2px;
    }
    .service-col-content>p{
        text-align: justify;
        font-size: 19px;
        /* text-transform: capitalize; */
    }
    .service-img{
        /* margin: 4rem 0 0 0; */
        text-align: center;
    }
    .service-work{
        text-align: left;
        font-weight: 600;
        margin-bottom: 10px;
        letter-spacing: 1px;
        line-height: 20px;
        font-size: 14px;
        text-transform: uppercase;
    }
    .line{
        width: 15%;
        height: 3px;
        margin-bottom: 20px;
        background-color: aliceblue;
    }
    .line-1{
        background-color: plum;
    }
    .line-2{
        background-color: rgb(241, 99, 48);
    }
    .line-3{
        background-color: #DFFF00;
    }
    .line-4{
        background-color: rgb(94, 94, 226);
    }
    .line-5{
        background-color: aquamarine;
    }
    .line-6{
        background-color: rgb(0, 174, 255);
    }
    .line-7{
        background-color: rgb(238, 40, 40);
    }
    
    .end-line{
        margin: 2px 0;
        height: 2px;
        background-color: rgb(255, 166, 0);
    }
    .service-row{
        margin: 30px 0;
        /* border: 1px solid white;
        padding: 5px; */
    }
    .service-col-content:hover .line{
        width: 100%;
        transition: .7s;
    
    }
}