﻿body {
    font-family: 'Roboto', sans-serif;
    /* You can add additional styling for the body here */
}


.hiw-item-list {
    /*background: #0099cc12 !important;
    padding: 10px !important;
    border-radius: 10px;*/
    /*font-weight: bold;*/
 /*   border: 1px solid #e9e9e9;
   box-shadow: -5px 5px 8px #e9e9e9;*/
 font-size:15px;
}
.hiw-list-bullet {
    color: #0099cc;
    font-size: 20px;
}
.hiw-list-li {
    padding-left: 20px!important; /* Adjust this value as needed */
    text-indent: -20px;
    padding-top:5px!important;
    padding-bottom:0px!important;
}
.text-thm {
 color:   #1791b9;
}
.text-thm-dark {
    color: #0b7699;
}
.demo-wrap {
    overflow: hidden;
    position: relative;
}

.demo-bg {
    opacity: 0.1;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: auto;
}

.demo-content {
    position: relative;
}
.services-grid-sky-blue {
    background: rgb(32 183 235 / 33%) !important;
    border-bottom: 5px solid #3582ff;
}

    .services-grid-sky-blue :hover, bg-primary-multiply:hover {
        color: #0099cc;
    }

.services-grid-blue {
    background: rgb(0 218 229 / 52%) !important;
    border-bottom: 5px solid #0099cc;
}

    .services-grid-blue :hover {
        color: #0099cc;
    }

.normal-bullet-list {
    font-size: 19px !important;
    background: #0099cc !important;
    padding: 5px !important;
    width: 30px !important;
    height: 30px !important;
    color: white !important;
}

.demo-wrap {
    overflow: hidden;
    position: relative;
}

.demo-bg {
    opacity: 0.6;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: auto;
}

.demo-content {
    position: relative;
}

.position-relative {
    position: relative;
}

.position-relative {
    position: relative;
}


.f-20{
    font-size:20px!important;
}
.theam-bg-grad {
  background:  radial-gradient(circle 248px at center, #086989 0%, #0582ab 47%, #2090b5 100%);
}
.bg-theam-solid {
    background: #0582ab!important;
}

.hw-18 {
    height: 18px !important;
    min-width: 18px !important;
    width: 18px !important;
}

.rounded-circle {
    border-radius: 50% !important;
}

.border {
    border: 1px solid #cbd5e1 !important;
}

.badge-light {
    color: #101729;
    background-color: #f1f4f9;
}

.badge {
    display: inline-block;
    padding: .25em .4em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.say-yes:before {
    content: "";
    vertical-align: middle;
    display: inline-block;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg height='24' width='24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%2314b89c' d='M9.707 19.121a.997.997 0 01-1.414 0l-5.646-5.647a1.5 1.5 0 010-2.121l.707-.707a1.5 1.5 0 012.121 0L9 14.171l9.525-9.525a1.5 1.5 0 012.121 0l.707.707a1.5 1.5 0 010 2.121z'/%3E%3C/svg%3E");
}

.say-yes, .say-yes:before {
    height: 1.5rem;
    width: 1.5rem;
}

.say-yes {
    position: relative;
    display: block;
    margin: 0 auto;
}

.btn-white {
    border: 1px solid #cbd5e1;
    background-color: #fff;
}

.mt-3, .my-3 {
    margin-top: 1rem !important;
}

.btn-group-sm > .btn, .btn-sm {
    padding: .7rem 1.55rem;
    font-size: .875rem;
    line-height: 1.5;
    border-radius: .25rem;
}

p {
    margin-top: 0;
    margin-bottom: 1rem;
}

.table.table-lg td, .table.table-lg th {
    padding: 1rem .75rem;
}

.table.table-lg td, .table.table-lg th {
    padding: 1rem .75rem;
}

.table-borderless tbody + tbody, .table-borderless td, .table-borderless th, .table-borderless thead th {
    border: 0;
}

.compare-number {
    font-size: 20px;
    background: #0f62a3;
    padding: 10px 16px 10px 14px;
    color: #fdfdfd;
    border-radius: 50%;
    border: 3px solid #e3e3d9;
    text-align: center;
    margin-right: 10px;
}

.compare-first-col {
    background: linear-gradient(90deg, rgb(0 128 179) 0%, rgb(10 75 133) 35%, rgb(3 102 122) 100%);
    color: white;
    border-radius: 25px 0px 0px 25px;
    font-size: 20px;
}

.compare-2nd-col {
    background: #91caff !important;
    color: black;
    font-weight: bold;
    font-size: 20px;
}

.compare-row {
    border-top: 3px solid white;
}

.service-grid {
    border-bottom: 8px solid #1677ff;
}

.why-us h2 {
    position: relative;
    margin-bottom: 35px;
}

    .why-us h2::after {
        content: "";
        width: 120px;
        height: 3px;
        display: inline-block;
        background: #FFC107;
        position: absolute;
        left: 0px;
        right: 0px;
        bottom: -20px;
        margin: 0 auto;
    }

.why-us .box {
    padding: 50px 30px;
    box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.10);
    transition: 0.5s;
    position: relative;
    background-color: #0a8db9;
    max-height: 230px;
    overflow: hidden;
    margin-bottom: 30px;
    border-radius: 10px;
}

    .why-us .box:hover {
        padding: 30px 30px 70px 30px;
        box-shadow: 10px 15px 30px rgba(0, 0, 0, 0.20);
        background-color: rgb(14 102 131);
    }

    .why-us .box img {
        position: absolute;
        top: 0px;
        left: 0px;
        width: 100%;
        z-index: -1;
        opacity: 0;
        transition: all ease 1s;
    }

    .why-us .box:hover img {
        opacity: 1;
    }

    .why-us .box span {
        display: block;
        font-size: 56px;
        font-weight: 700;
        color: #077ca3;
        position: absolute;
        right: 10px;
        top: 0px;
        line-height: normal;
    }

    .why-us .box h4 a {
        font-size: 24px;
        font-weight: 600;
        padding: 0;
        margin: 20px 0;
        color: #dadada;
        text-decoration: none;
    }

    .why-us .box p {
        color: #aaaaaa;
        font-size: 15px;
        margin: 0;
        padding: 0;
    }

    .why-us .box:hover span,
    .why-us .box:hover h4 a,
    .why-us .box:hover p {
        color: #fff;
    }

.service-lst-item{
    color:white;
    font-size:16px;
}
.srvic-lst-shortdes {
    font-size: 16px;
    line-height: normal;
}
.srvc-icon {
    /*background: #074053;*/
    border-radius: 8px;
    padding: 5px 8px 5px 8px;
}
.text-justify{
    text-align:justify;
}
.Solution-bg-section {
    /*background-image: url('data:image/svg+xml;charset=utf-8,<svg viewBox="14.351 45.317 471.299 137.463" width="471.299" height="137.463" xmlns="http://www.w3.org/2000/svg"><defs><radialGradient gradientUnits="userSpaceOnUse" cx="250" cy="-114.049" r="235.649" id="gradient-0" gradientTransform="matrix(0.506409, -0.371796, 0.591808, 0.806079, 190.892801, 70.832456)"><stop offset="0" style="stop-color: rgb(0% 0% 0%)"/><stop offset="1" style="stop-color: rgb(0% 0% 0%)"/></radialGradient></defs><path d="M 245.28751 -182.78 L 485.65 -45.317 L 14.351 -45.317 L 245.28751 -182.78 Z" style="stroke: url(\'#gradient-0\'); fill-rule: nonzero; fill: rgb(32, 116, 153); paint-order: fill; stroke-width: 0px; transform-origin: 250px -114.049px;" transform="matrix(1, 0, 0, -1, 0.00000190735, 228.09700012207)"/><text style="fill: rgb(255, 255, 255); font-family: Arial, sans-serif; font-size: 28px; white-space: pre;" x="189.577" y="97.432" transform="matrix(0.9999999999999999, 0, 0, 0.9999999999999999, 0, -1.4210854715202004e-14)">Solutions</text></svg>');
    background-repeat: no-repeat;
    background-position: center bottom;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 300px;*/ /* Adjust height as needed */
    /*z-index: -1;
    border: 1px solid red;*/ /* Temporarily add a border to check visibility */
}

.why-us-blt-icon {
    background: #0582ab;
    padding: 3px 10px 3px 10px;
    font-size: 25px;
    float: right;
    margin-top: -55px;
    margin-right: -40px;
    color: white;
    border: 2px solid;
}
   
.rounded-circle {
    border-radius: 50% !important
}
.why-us-tab-p {
    line-height: 1.5;
   
}
.WhyUs-nav {
    /*box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.5);*/
    /*transition: transform ease .5s, box-shadow ease .5s;*/
}
.WhyUs-nav :hover 
{
        /*transform: translateY(-5px);*/
        /*box-shadow: 0px 10px 20px 2px rgba(0, 0, 0, 0.25);*/
 }
.why-us-btn {
    border-radius: 12px !important;
    padding: 20px !important;
    background: #0582ab1f !important;
    box-shadow: 0px 4px 4px 0px rgb(131 138 143 / 20%);
    border: 1px solid #e4e5eb !important;
   font: 400 16px/1.5 exo, ubuntu, "segoe ui", helvetica, arial, sans-serif;
}
.font-thm2 {
   font:  "segoe ui", helvetica, arial, sans-serif;
}

.why-us-btn :active{
    border-radius: 12px !important;
    padding: 20px !important;
    color:white!important;
  
}
why-us-title:focus{
    color:white!important;
}
.why-us-title {
   
    font-size: 20px;
    font-weight: bold;
}
/*.nav-pills .nav-link {
    line-height: 10px !important;
    padding: 20px !important;
    border-right: 2px solid #5d90e3;
    border-bottom: 1px solid #ffd27861;
}*/
/*
.child-tab {
    text-align: left;
    color: black;
    margin-bottom: 0px;
}

    .child-tab:hover {
        text-align: right;
        color: black !important;
        background: orange;
    }*/
.nav-tabs .nav-link.active {
    background: #0582ab !important;
}

.hiw-step-img {
    max-width: 300px;
    max-height: 300px;
    background: #1faad7;
    border-radius: 20px;
    padding:5px;
}
.about-bg-img {
    position: absolute;
    right: 0px;
    float: right;
    top: 1120px;
    opacity: 0.09;
    max-width: 1000px;
}
.grp-list-2 {
    font-size: 16px !important;
    font-weight: bold;
    color: #0682ab;
}
.fs-16{
    font-size:16px!important;
}

@media (min-width: 375px) and (max-width: 700px) {
    .pt-sm-0 {
        padding-top: 0px !important;
    }

    .pb-sm-0 {
        padding-top: 0px !important;
    }

    .pb-sm-0 {
        padding-top: 0px !important;
    }
	 .slider-title{
     font-size:32px;
 }
}

