/* your styles go here */
.img-gradient {
    position: relative;
    z-index: 99;
}
.img-gradient::before {
    content: "";
    display: block;
    width: 100%;
    padding-bottom: 30%;
    position: absolute;
    bottom: -2rem;
    left: -2rem;
    background: linear-gradient(45deg, #5985f5, #0d2050);
    border-radius: 0.25rem;
    z-index: -1;
    opacity: 0.8;
}
.img-gradient-left::before,
.img-gradient-right::before {
    width: 70%;
    height: 70%;
    padding-bottom: 0;
}
.img-gradient-right::before {
    left: auto;
    right: -2rem;
}
nav.navbar a.nav-link {
  color:#555;
}
.service-fa-icon{
    background: #072951;
    padding: 10px 10px;
    color: #fff;
    border-radius: 50%;
    text-align: center;
    width: 50px;
    height: 50px;
    font-size: 22px;
    line-height: 31px;
    margin-right: 2px;
}
.our-story-heading {
    /* background: #e4e4e4; */
    padding: 0px 15px 0px 15px;
    height: 48px;
    display: flex;
    align-items: center;
}
.our-story-heading span{
    font-size: 25px;
    align-self: center;
    padding-left: 5px;
    color: #222222;
    font-weight: 600;
}
/* SERVICE BOX CSS */
.serviceBox{
    background: #f5f5f5;
    text-align: center;
    padding: 0px 25px 40px;
    margin: 20px 0 0;
    border-radius: 20px;
    position: relative;
    transition: all 0.3s ease;
}
.serviceBox:hover{ box-shadow: 0 10px 10px rgba(0,0,0,0.2); }
.serviceBox:before,
.serviceBox:after{
    content: "";
    background: linear-gradient(to top,#008d86,#01a2a6);
    /* width: 10px;
    border-radius: 0 100px 100px 0;
    position: absolute;
    top: 110px;
    bottom: 35px;
    left: 0; */
    width: 1px;
    position: absolute;
    top: 110px;
    bottom: 35px;
    left: 0;
}
.serviceBox:after{
    border-radius: 100px 0 0 100px;
    left: auto;
    right: 0;
}
.serviceBox .service-icon{
    /* color: #fff;
    background: linear-gradient(-45deg,#008d86 49%,#01a2a6 50%);
    font-size: 45px;
    line-height: 92px;
    width: 120px;
    height: 120px;
    margin: 0 auto;
    border-radius: 100px;
    border: 15px solid #fff;
    box-shadow: 0 0 10px rgba(0,0,0,0.2);
    transform: translateY(-20px);
    transition: all 0.3s ease; */
    color: #fff;
    background: linear-gradient(-45deg,#008d86 49%,#01a2a6 50%);
    font-size: 40px;
    line-height: 85px;
    width: 100px;
    height: 100px;
    margin: 0 auto;
    border-radius: 100px;
    border: 8px solid #fff;
    box-shadow: 0 0 10px rgba(0,0,0,0.2);
    transform: translateY(-20px);
    transition: all 0.3s ease;
}
.serviceBox:hover .service-icon i{
    transform: rotateX(360deg);
    transition: all 0.3s;
}
.serviceBox .title{
    color: #008d86;
    font-size: 17px;
    font-weight: 600;
    text-transform: uppercase;
    margin: 0 0 10px;
}
.serviceBox .description{
    color: #444;
    font-size: 15px;
    line-height: 24px;
    margin: 0;
}
.serviceBox.purple:before,
.serviceBox.purple:after{ background: linear-gradient(to top,#8b33cc 49%,#a23adc); }
.serviceBox.purple .service-icon{ background:linear-gradient(-45deg,#8b33cc 49%,#a23adc 50%); }
.serviceBox.purple .title{ color: #8b33cc; }
.serviceBox.blue:before,
.serviceBox.blue:after{ background: linear-gradient(to top,#038bec 49%,#01aeee); }
.serviceBox.blue .service-icon{ background:linear-gradient(-45deg,#038bec 49%,#01aeee 50%); }
.serviceBox.blue .title{ color: #038bec; }
@media only screen and (max-width:990px){
    .serviceBox, #servicesWeProvide .card{
    margin: 20px 0 50px;
    }
    .serviceBox, #servicesWeProvide .card{
       margin: 20px 0 ;
    }
}

 @media only screen and (max-width:767px) {
   #ftcoSection .heading-section {
       margin-bottom: 0rem!important;
   }
   #ftcoSection .heading-section {
       margin-top: 0rem!important;
   }
   #project-name .col-md-4 {
       margin-bottom: 0rem!important;
   }
 }




 .typeOfMl{
    padding: 1.25rem;
}
 .typeOfMl p{
    overflow: auto;
}
::-webkit-scrollbar {
    width: 5px;

    border-radius:5px;
}

::-webkit-scrollbar-thumb {
    background: #2c292a;
    outline: 1px solid #201f20;
}


/*============
 FTO SECTION CSS
 ==============*/

 .ftco-section {
    padding: 4em 0 1.5em;
    position: relative;
}
.heading-section h2 {
    font-size: 30px;
    font-weight: 800;
}
.ftco-faqs .myaccordion {
    margin: 0 auto;
    overflow: hidden;
}
.ftco-faqs .img {
    height: 220px;
    -webkit-box-shadow: 0px 8px 21px -10px rgba(0, 0, 0, 0.12);
    -moz-box-shadow: 0px 8px 21px -10px rgba(0, 0, 0, 0.12);
    box-shadow: 0px 8px 21px -10px rgba(0, 0, 0, 0.12); }
    .ftco-faqs .img.img-2 {
      height: 250px; }

  .ftco-faqs .myaccordion {
    margin: 0 auto;
    overflow: hidden; }

  .ftco-faqs .myaccordion .card,
  .ftco-faqs .myaccordion .card:last-child .card-header {
    border: none;
    background: transparent; }

  .ftco-faqs .myaccordion .card-header {
    border: none;
    background: transparent; }
    .ftco-faqs .myaccordion .card-header p {
      position: relative;
      font-weight: 500;
      font-size: 18px;
      text-align: left; }

  .ftco-faqs .myaccordion .fa {
    font-size: 16px;
    color: rgba(0, 0, 0, 0.3); }

  .ftco-faqs .myaccordion .btn {
    width: 100%;
    font-weight: 600;
    color: black;
    padding: 0;
    text-transform: capitalize;
    letter-spacing: 0;
    border-radius: 0 !important;
    margin-bottom: 10px;
    border-radius: 40px !important;
    -webkit-box-shadow: 0px 2px 8px -4px rgba(0, 0, 0, 0.21) !important;
    -moz-box-shadow: 0px 2px 8px -4px rgba(0, 0, 0, 0.21) !important;
    box-shadow: 0px 2px 8px -4px rgba(0, 0, 0, 0.21) !important; }

  .ftco-faqs .myaccordion .btn-link:hover,
  .ftco-faqs .myaccordion .btn-link:focus {
    text-decoration: none; }

  .ftco-faqs [data-toggle="collapse"] .fa:before {
    content: "\f068";
    font-family: "FontAwesome";
    font-style: normal; }

  .ftco-faqs [data-toggle="collapse"].collapsed .fa:before {
    content: "\f067";
    font-family: "FontAwesome";
    font-style: normal; }


    .ftco-faqs button[aria-expanded="true"] .fa, .ftco-faqs button[aria-expanded="true"] p{
      color: #fff !important; }

  .ftco-faqs button[aria-expanded="false"] {
    background-color: #fff; }
    .ftco-faqs button[aria-expanded="true"] {
        background-color: #4E6298;
        color: #fff !important;
    }
  .ftco-faqs .card-body {
    background: #fff;
    margin-bottom: 10px;
    border-radius: 30px;
    -webkit-box-shadow: 0px 2px 8px -4px rgba(0, 0, 0, 0.21) !important;
    -moz-box-shadow: 0px 2px 8px -4px rgba(0, 0, 0, 0.21) !important;
    box-shadow: 0px 2px 8px -4px rgba(0, 0, 0, 0.21) !important; }
    .ftco-faqs .card-body ol li {
      margin-bottom: 10px;
      padding-left: 10px;
      color: rgba(0, 0, 0, 0.8); }
      .ftco-faqs .card-body ol li:last-child {
        margin-bottom: 0;
     }

     .aboutImg{
        width: 100%;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center center;
    }
     /* whisperapprox */
     .why-us {
        /* background: #f1f8ff; */
        padding: 0;
    }
    .why-us .video-box {
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center center;
        min-height: 400px;
        position: relative;
    }
    .why-us .content {

        padding: 60px 100px 60px 100px;
    }
    .why-us .content h3 {
        font-weight: 700;
        font-size: 32px;
        color: #072951;

    }
    .why-us .content ul {
        list-style: none;
        padding: 0;
    }
    .why-us .content ul li {
        padding-bottom: 10px;
        color: #555;
    }
    .why-us .content ul i {
        font-size: 20px;
        padding-right: 4px;
        color: #072951;
    }
    .tab-pane ul li {
        color: #555;
    }
    /* ===============
        back-to-top
       =============== */
    .back-to-top {
        position: fixed;
        display: none;
        right: 15px;
        bottom: 15px;
        z-index: 99999;
    }

    .back-to-top i {
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 24px;
        width: 40px;
        height: 40px;
        border-radius: 4px;
        background: #4e6192;
        color: #fff;
        transition: all 0.4s;
    }


/*-----------------------------------------------------------------------------
    Flexslider
-----------------------------------------------------------------------------*/

.circle-box-section .flex-control-nav { bottom: 0; }
.flexslider .content-box { display: none; }
.flexslider .content-box .role-box { width: 96%; margin-left: auto; margin-right: auto; }
.flexslider { background-color: transparent; border: none; }
.recent-posts-section .flexslider { width: 100% !important; padding-left: 0!important; padding-right: 0!important; }
.recent-posts-section .flexslider .content-box { padding-left: 0!important; padding-right: 0!important; }

@media only screen and (min-width: 769px) {
    .flexslider { margin: 0!important; }
    .flexslider .pri-row { width: 100%!important; max-width: 1200px!important; margin: auto!important; }
    .recent-posts-section .flexslider .pri-col-third { width: 33.333%!important; padding: 5px 3px!important; }
    .flexslider .pri-col-third { width: 33.333%!important; padding: 5px 4px!important; }
    .flexslider .pri-col-half { width: 50%!important; padding: 5px 0!important; }
    .circle-box-section .flex-viewport { overflow: visible!important; }
    .flexslider .circle-box:before {left: 98px!important; top: 260px!important;}

    .circle-box-section .flex-viewport:before,
    .circle-box-section .flex-viewport:after,
    .flexslider .pri-row:before,
    .flexslider .pri-row:after {
        content: " "; /* 1 */
        display: table; /* 2 */
    }

    .circle-box-section .flex-viewport:after,
    .flexslider .pri-row:after {
        clear: both;
    }
    .flex-control-nav { display: none; }
}

@media only screen and (max-width: 768px) {
    .content-slider .flexslider .content-box { display: none; }
}

#last-roles-section { margin-bottom: 70px!important; }