/*-- Common Styles Start --*/


@font-face {
    font-family: 'Poppins';
    src: url('../fonts/Poppins-Regular.woff2') format('woff2'),
        url('../fonts/Poppins-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../fonts/Poppins-Medium.woff2') format('woff2'),
        url('../fonts/Poppins-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../fonts/Poppins-Bold.woff2') format('woff2'),
        url('../fonts/Poppins-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../fonts/Poppins-SemiBold.woff2') format('woff2'),
        url('../fonts/Poppins-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}


body{
    background-color: #fff;
    font-family: 'Poppins';
    font-size:20px;
    color:#444444;
}
.container{
    width:100%;
    max-width:1300px;
    padding:0px 30px;
}

.page-adjust{
    width: 100%;
    float: left;
    padding: 50px 0;
}
.no-page-adjust{
      width: 100%;
    float: left;
    padding: 0px 0;

}

.page-heading h2{
    position: relative;
    font-size: 18px;
    font-weight: 500;
    color: #333;
    padding-left: 85px;
    margin-bottom: 10px;
}

.page-heading h5{
    padding-left: 85px;
}


.page-heading span.dot::after,
.page-heading span.dot::before{
    content: '';
    position: absolute;
    top: 8px;
    left: -80px;
    background-color: #46699c;
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.page-heading span.dot::before{
    content: '';
    left: -72px;
    background-color: #f46f3b;
}

.page-heading h5 span.dot::before, .page-heading h5 span.dot::after{
    top: 15px;
}


.page-heading span{
position: relative;
    font-size: 20px;
    font-weight: normal;
}

.page-heading span.line::before{
content: '';
    position: absolute;
    background-color: #f46f3b;
    height: 0.5px;
    width: 55px;
    left: -61px;
    top: 13px;
} 

.page-heading h5 span.line::before{
    top: 20px;
}

.page-heading h3{
    font-size: 42px;
    line-height: 52px;
  background-image: -webkit-linear-gradient(0deg, #19456f 22%,#2b6aa6 0%,#e7602c 38%,#ff9e79 50%);
  background-clip: text;
  -webkit-background-clip: text;
  text-fill-color: transparent;
  -webkit-text-fill-color: transparent;
    padding-bottom: 30px;
    padding-top:20px;
    font-weight:600;
}

.page-heading h4{
    position: relative;
    color: #373636;
    padding-bottom: 30px;
    font-size: 36px;
    font-weight: 600;
}

.page-heading p{        
    padding-bottom: 15px;
        line-height: 36px;
        margin:0px;
}

.page-heading.center p{
    max-width: 1200px;
    margin: 0px auto;
}

.modal-lg, .modal-xl {    
    max-width:1000px;
}


.bg-light{
    background-color: #eff7ff8c !important;
}

.bg-blue{
    background-color: #7979e8;
}

.bg-white{
    background-color: #fff;
}

.text-orange{
    color: #ff7020;
}

.text-black{
    color: #000 !important;
}
.modal-body{
    padding:50px 50px !important;
}

a, a:hover{
    text-decoration: none;
}

ul{
    padding: 0;
}

li{
    list-style: none;
}

h1, h2, h3, h4, h5, h6{
    font-weight:600;
}

h1{
    font-size: 38px;    
}
h2{
    font-size: 32px;    
}
h3{
    font-size: 30px;    
}
h4{
    font-size: 28px;    
}
h5{
    font-size: 26px;    
}
h6{
    font-size: 24px;    
}


ul.list-icon li{
    position: relative;
    font-size: 18px;
    padding: 10px 20px;
}

ul.list-icon li::before{
    content: "\f0da";
    font-family: "FontAwesome";
    position: absolute;
    top: 23px;
    transform: translateY(-50%);
    font-size: 22px;
    color: #ff7020;
    left: 0px;
}


/*-- Slick Slider Styles Start --*/

.slick-dots button{
    display: none !important;
}

.slick-dots{
    display: flex;
    margin-top: 30px;
    justify-content: center;
    margin-bottom: 10px;
    bottom: -40px;
}

.slick-dots li{
    border: 1px solid #91a2e9;
    border-radius: 50%;
    width: 12px !important;
    height: 12px !important;
    margin: 0 5px !important;
    cursor: pointer;
    float: none !important;
}

.slick-dots li.slick-active{
    background-color: #ff7020;
    border:none;
}

.slick-prev{
    left: 0;
    z-index: 1;
}

.slick-next{
    right: 10px;
    z-index: 1;
}

.slick-disabled{
    opacity: 0;
    pointer-events: none;
}

.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before{
    opacity: 1;
}

.slick-prev:before, .slick-next:before {
    opacity: 1;
    color: white;
    background: #ff7020;
    padding: 5px;
    border-radius: 50%;
}

/*-- Slick Slider Styles Start --*/

/*-- Image Animation Styles Start --*/


.image-animation{
    position: relative;
    overflow: hidden;
}

.image-animation img{
    overflow: hidden;
}


.image-animation::before{
    content: '';
    position: absolute;
    top: 0;
    left: -50%;
    background-color: #fff;
    width: 100%;
    height: 100%;
    z-index: 1;
    transition: 0.5s all linear;
    transition-delay: 0.2s;
}
.image-animation::after{
    content: '';
    position: absolute;
    top: 0;
    right: -50%;
    background-color: #fff;
    width: 100%;
    height: 100%;
    z-index: 1;
    transition: 0.5s all linear;
    transition-delay: 0.2s;
}

.image-animation.is-animated::before{
    left: -100%;
}


.image-animation.is-animated::after{
    right: -100%;
}

.image-anim-bg-light::before, .image-anim-bg-light::after{
    background-color: #f7f7f7 !important;
}


/*-- Image Animation Styles End --*/


body.active{
    overflow: hidden;
}




.wave-bg::before{
    content: '';
    position: absolute;
    top: 20px;
    left: 0;
    background: url('../images/common/pattern.png') no-repeat;
    background-size: contain;
    width: 100%;
    height: 100%;
    z-index: -1;
}





/*-- Button Effect New Start --*/

.btn-animation {
    border: none;
    display: block;
    text-align: center;
    cursor: pointer;
    outline: none;
    overflow: hidden;
    position: relative;
    color: #fff;
    font-weight: 500;
    font-size: 18px;
    background-color: #24609d;
    padding: 7px 30px;
    width: max-content;
    border-radius: 10px;
  }
  
  .btn-animation span {
    position: relative; 
    z-index: 1;
    color: #fff;
  }
  
  .btn-animation:after {
    content: "";
    position: absolute;
    left: 0;
    top: 25px;
    height: 400px;
    width: 500px;
    background: #ff7020;
    color: #fff;
    -webkit-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
    -webkit-transform: translateX(-98%) translateY(-25%) rotate(45deg);
    transform: translateX(-85%) translateY(-25%) rotate(45deg);
  }
  
  .btn-animation:hover:after {
    -webkit-transform: translateX(-9%) translateY(-25%) rotate(45deg);
    transform: translateX(-5%) translateY(-25%) rotate(45deg);
  }


  .bg-white-btn{
    background-color: #fff;
  }

  .bg-white-btn span{
    color: #ff7020;
  }

  .bg-white-btn:hover span{
    color: #fff;
  }


/*-- Button Effect New End --*/

/*-- Scroll Top Start --*/


.scroll-top {
    position: fixed;
    right: 30px;
    bottom: 30px;
    background-color: #ff7020;
    padding: 20px;
    opacity: 0;
    transition: all 0.4s ease-in-out 0s;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1111;
  }
  
  .scroll-top a {
    font-size: 24px;
    color: #fff;
    transition: 0.5s all linear;
  }


  .scroll-top:hover a{
    transform: translateY(-5px);
  }

/*-- Scroll Top End --*/

/*-- Common Styles End --*/


/*-- Banner Section Dot Animation Styles Start --*/

.home-page-slider{
    overflow: hidden;
}

.inner-top-banner{
    position: relative;
    overflow: hidden;
}


.bg-dot{
    position: relative;
    z-index: 1;
}

.bg-dot span{
    position: absolute;
    top: 92vh;
    width: 4px;
    height: 4px;
    background-color: #fff;
    border-radius: 50%;
}

.inner-top-banner .bg-dot span{
    top: 400px;
}

.bg-dot span.small{
    width: 2px;
    height: 2px;
}

.bg-dot span.big{
    width: 6px;
    height: 6px;
}

.bg-dot span:nth-child(1){
    left: 200px;
    animation: span-one 10s linear 0s infinite forwards;
}

.bg-dot span:nth-child(2){
    left: 500px;
    animation: span-one 10s linear 1.5s infinite forwards;
}

.bg-dot span:nth-child(3){
    left: 800px;
    animation: span-one 10s linear 20s infinite forwards;
}

.bg-dot span:nth-child(4){
    left: 300px;
    animation: span-one 10s linear 11.8s infinite forwards;
}

.bg-dot span:nth-child(5){
    left: 900px;
    animation: span-one 10s linear 25s infinite forwards;
    background-color: #f00;
}

.bg-dot span:nth-child(6){
    left: 400px;
    animation: span-one 10s linear 2.5s infinite forwards;
}

.bg-dot span:nth-child(7){
    left: 1000px;
    animation: span-one 10s linear 12s infinite forwards;
    background-color: #f00;
}

.bg-dot span:nth-child(8){
    left: 700px;
    animation: span-one 10s linear 10.5s infinite forwards;
}

.bg-dot span:nth-child(9){
    left: 1200px;
    animation: span-one 10s linear 3.5s infinite forwards;
}

.bg-dot span:nth-child(10){
    left: 550px;
    animation: span-one 10s linear 14s infinite forwards;
    background-color: #f00;
}

.bg-dot span:nth-child(11){
    left: 750px;
    animation: span-one 10s linear 18s infinite forwards;
}
.bg-dot span:nth-child(12){
    left: 150px;
    animation: span-one 10s linear 8s infinite forwards;
}
.bg-dot span:nth-child(13){
    left: 650px;
    animation: span-one 10s linear 9.5s infinite forwards;
    background-color: #f00;
}
.bg-dot span:nth-child(14){
    left: 450px;
    animation: span-one 10s linear 22.5s infinite forwards;
}
.bg-dot span:nth-child(15){
    left: 850px;
    animation: span-one 10s linear 9s infinite forwards;
}
.bg-dot span:nth-child(16){
    top: 950px;
    animation: span-one 10s linear 4s infinite forwards;
    background-color: #f00;
}


@keyframes span-one{
    to{
        top: 0%;
    }
}

/*-- Banner Section Dot Animation Styles End --*/
/*-- Clients Section Styles Start --*/


.our-clients-list{
    overflow: hidden;
}

.our-clients-list li.item{
    box-shadow: 0px 1px 5px 1px #d3ecf2;
    padding: 15px;
    height: 140px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 200px;
    margin: 20px;
    background-color: #fff;
    border-radius: 8px;
    overflow: hidden;
}

.our-clients-list img{
    width: 100%;
    max-width:75%;
        margin: 0px auto;
    object-fit: cover;
    transition: 0.5s all linear;
}

.our-clients-list li.item:hover img{
    transform: scale(1.2, 1.2);
}


.our-clients-gal{
    visibility: hidden;
    opacity: 0;  
    transition: opacity 0.1s;}
  
  .our-clients-gal.slick-initialized {
    visibility: visible;
    opacity: 1;}
  
  .our-clients-gal .item {
    display: none;}
  
  .our-clients-gal .item:first-child {
    display: block;
    visibility: hidden;}
  
  .our-clients-gal.slick-initialized .item {
    display: block;
    visibility: visible!important;}


/*-- Clients Section Styles End --*/



/*-- Let's Together Section Styles Start --*/


.lets-together{
   
    width: 100%;
    height: 100%;
    background: url('../images/home/home-contact-bg.jpg') no-repeat;
    background-size: cover;
}


.lets-together-info{
        padding: 30px 0px;
    position: relative;
    z-index: 1;
}
.lets-together-info-lt-cont {
        padding-top: 30px;
}



.lets-together-info-lt-cont a{
    font-size: 36px;
    font-weight: 500; 
    color: #fff;   
}

.lets-together-info-rt-contact{
    border-radius: 15px;
}

.lets-together-info-rt-contact h2{
    line-height: 54px;
    font-size: 44px;
}


.contact-us-form h2{
    font-size: 32px;
    line-height: 44px;
}

.lets-together-info-rt-contact p{
    color: #000;
    font-size: 15px;
    font-weight: 500;
}

.lets-together-info-rt-contact ::placeholder{
    font-size: 16px;
}

.form-select:focus,
.form-control:focus{
    box-shadow: none;
}

.lets-together-info-rt-contact .form-select,
.lets-together-info-rt-contact .form-control{
    border: 1px solid #1b2862;
    padding: 12px 30px;
    margin-bottom: 15px;
}


.lets-together-info-rt-contact ::placeholder{
    color: #212529;
}


/*-- Let's Together Section Styles End --*/


/*-- Blog Section Styles Start --*/

 .our-blogs-features-data-gal{
    overflow: hidden;
    border-radius: 15px;
    width: 100%;
    max-height: 250px;
}

.our-blogs-features-data img{
    width: 100%;
    max-width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 15px;
    transition: 0.5s all linear;
}

.our-blogs-features-data:hover img{
    transform: scale(1.2, 1.2);
}

.our-blogs-features-data a{
    background-color: #4283c5;
    font-size: 14px;
    color: #fff;
    padding: 5px 20px 5px 20px;
    border-radius: 15px;
    margin: 20px 0 15px 0;
    display: inline-block;
}

.our-blogs-features-data p{    
    color: #000;
    margin: 0;
}

.our-blogs-features-data:hover p{
    text-decoration: underline;
}

.our-blogs-features-data span{
    font-size: 14px;
    color: #3333338c;
}


/*-- Blog Section Styles End --*/




/*-- Our Followers Section Styles Start --*/


.our-followers{
    background: url('../images/home/social-bg.jpg') no-repeat;
    background-size: cover;
    width: 100%;
}

.header-inner .our-followers{
    background: none;
}



.our-followers-info ul{
    display: flex;
    justify-content: center;
    position: relative;
}

.our-followers-info li{
    
    float: left;
        
    border-radius: 10px;
}

.our-followers-info li:hover{
    box-shadow: 2px 3px 10px 0px #ddd;
    background-color: #fff;
}

.our-followers-info li a{
    display: flex !important;
    justify-content: center;
    align-items: center;
        padding: 10px 30px;

}

.our-followers-info li .fa{
    font-size: 16px;
    color: #fff;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.our-followers-info li span{
    font-size: 26px;
    padding-left: 10px;
}

.our-followers-info li:nth-child(1) .fa{
    background-color: #3c579e;
}

.our-followers-info li:nth-child(1) span{
    color: #3c579e;
}

.our-followers-info li:nth-child(2) .fa{
    background-color: #ff3333;
}
.our-followers-info li:nth-child(2) span{
    color: #ff3333;
}

.our-followers-info li:nth-child(3) .fa{
    background-color: #0064a6;
}

.our-followers-info li:nth-child(3) span{
    color: #0064a6;
}

.our-followers-info li:nth-child(4) .fa{
    background-color: #00aeef;
}

.our-followers-info li:nth-child(4) span{
    color: #00aeef;
}


/*-- Our Followers Section Styles End --*/


@media (max-width:1200px){

    /*-- Common Styles Start --*/

    img{
        width: auto;
        height: auto;
    }

    /*-- Common Styles End --*/
}




@media (max-width:1024px){

    /*-- Common Styles Start --*/


    .page-heading h3 {
        font-size: 34px;
    }

    .lets-together-info-rt-contact h2 {
        line-height: 42px;
        font-size: 32px;
    }

    /*-- Common Styles End --*/
    
}






@media (max-width: 991px) {

    /*-- Common Styles Start --*/
    
    
        .page-heading h3 {
            font-size: 36px;
            line-height: 44px;
        }
    
        .page-heading h4 {
            font-size: 28px;
        }
    
        .btn-animation{
            padding: 5px 25px;
        }
    
  
        .modal-lg, .modal-xl { 
            margin: 20px;
        }
    
    .lets-together-info-rt-contact h2 {
        font-size: 24px;
        line-height: 38px;
    }

    .lets-together-info-lt-cont a {
        font-size: 28px;
    }
    
    .our-blogs-features-data p {
        font-size: 18px;
    }

    .our-followers-info li span {
        font-size: 20px;
    }
    
    /*-- Common Styles End --*/

        /*-- Contact Us Page Styles Start --*/
    
        .thank-you-popup-info .our-followers-info ul{
            flex-wrap: wrap;
        }
        
        .thank-you-popup-info .our-followers-info li{
            width: 50%;
            margin-top: 10px;
        }
        
        
        /*-- Contact Us Page Styles End --*/
  
    
    
    }


    @media (max-width:768px){

        /*-- Common Styles Start --*/

        .bg-dot span{
            top: 75vh;
        }
        
        .lets-together-info-lt, .lets-together-info-rt{
            width: 100%;
            max-width: 100%;
        }

        .lets-together-info-lt-cont p br{
            display: none;
        }

        .lets-together-info-lt-cont{
            padding-top: 0;
            padding-bottom: 25px !important;
        }

        .lets-together-info-rt-contact h2 br{
            display: none;
        }

        

        /*-- Common Styles Start --*/
    }


    
@media (max-width:767px){


    /*-- Common Styles Start --*/
    
    
        h1{
            font-size: 32px;    
        }
        
        h2{
            font-size: 30px;    
        }
        h3{
            font-size: 28px;    
        }
        h4{
            font-size: 26px;    
        }
        h5{
            font-size: 24px;    
        }
        h6{
            font-size: 22px;    
        }
        
    
        .arrow a{
            display: none;
        }

        .page-heading h3 br{
            display: none;
        }
    
      
        .our-followers-info ul {
            flex-wrap: wrap;
        }
        
        .our-followers-info li {
            width: 50%;
            float: left;
            margin-bottom: 20px;
        }
        .lets-together-info-lt-cont h4 {
            font-size: 22px;
        }
        .home-contact-info-details {
            justify-content: flex-start !important;
        }

        .lets-together-info{
            padding: 0;
        }

      
    
        /*-- Common Styles End --*/
    
    }



    


    @media (max-width:640px){


        /*-- Common Page Styles Start --*/
    
    
        .our-clients-list li {
            width: 45%;
            float: left;
            margin: 10px;
        }

        .our-clients-list img{
            max-width: 100%;
        }
    
        /*-- Common Page Styles End --*/
    }




    
@media (max-width:480px){

    /*-- Common Styles Start --*/

    body{
        font-size:16px;
    }

    .page-adjust{
        padding: 30px 0;
    }

    .page-heading p {
        line-height: 28px;
    }

    .page-heading h3 {
        font-size: 24px;
        line-height: 34px;
    }

    .page-heading h4 {
        font-size: 22px;
        line-height: 32px;
        padding-bottom: 10px;
    }

    ul.list-icon li {
        font-size: 16px;
    }

    .slick-dots li {
        width: 10px !important;
        height: 10px !important;
        margin: 0 3px !important;
    }

    .lets-together-info-lt-cont a {
        font-size: 24px;
    }

    .lets-together-info-rt-contact {
        padding: 30px !important;
    }

    .our-blogs-features {
        max-width: 100%;
    }
 

    .our-followers-info ul {
        display: block;
    }
    .our-followers-info li {
        width: 50%;
        margin-bottom: 10px;
    }

    .our-followers-info li span {
        font-size: 16px;
    }


    .modal-body {
        padding: 20px 15px !important;
    }

   

   /*-- Common Styles End --*/

}






@media (max-width:429px){

    /*-- Common Styles Start --*/

   

    .page-heading span {
        font-size: 16px;
    }

    .orange-bg-btn, .white-bg-btn, .dark-bg-btn{
        padding: 10px;
    }

    .our-followers-info li a {
        padding: 10px 5px;
    }

.our-followers-info li .fa {
    font-size: 14px;
    width: 25px;
    height: 25px;

}

.lets-together-info-lt-cont a {
    font-size: 22px;
}

.lets-together-info-lt-cont p{
    font-size: 16px;
}

.lets-together-info-rt-contact h2 {
    font-size: 20px;
    line-height: 30px;
}

.lets-together-info-rt-contact .btn-animation{
    padding: 7px 15px;
    font-size: 14px;
}


.lets-together-info-rt-contact .form-select,
.lets-together-info-rt-contact .form-control{
    padding: 12px 30px 12px 10px;
}

.our-clients-list li.item{
    height: auto;
}


   
/*-- Common Styles End --*/


}