/* @import url('https://fonts.cdnfonts.com/css/gilroy'); */
html{
    overflow-x: hidden;
}

/* width */
::-webkit-scrollbar {
    width: 10px;
  }
  
@font-face {
    font-family: gilroy;
    src: url(Gilroy-Bold.ttf);
}


  /* Track */
  ::-webkit-scrollbar-track {
    background:#eeeded ; 
  }
   
  /* Handle */
  ::-webkit-scrollbar-thumb {
    background:  #144274b8  ;
    /* width:1px; */
    border-radius: 5px;
    height: 20vh;
  }
  .flex{
    display: flex;
    align-items: center;        
    justify-content: center;
  }
  /* Handle on hover */
  ::-webkit-scrollbar-thumb:hover {
    background: #255E98; 
  }
.main {
    overflow-y: hidden;
    height: 100vh;
    position: relative;
    /* scroll-snap-type: y mandatory;
    scroll-behavior: smooth; */
    transition: transform 0.5s ease; /* Add sliding transition */
}
.field{
    color: #144374;
}
.field:focus{
    color: #144374 !important ;
    font-weight: bold;
    opacity: 1;
}
.section {
    height: 100%;
    width: 100%;
    margin-bottom: 1vh;
    background-position: 50% 100%;
    background-repeat: no-repeat;
    scroll-snap-align: center;
    background-size: cover;
    position: fixed;
    /* opacity: 0; Initially set opacity to 0 */
    /* transition: opacity 1s ease; Add transition for smooth opacity change */
}
@keyframes fadeUp {
    from {
        opacity: 0.5;
        transform: translateY(70px);
        /* Adjust this value as needed */
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.no-animation {
    opacity: 1 !important; /* Set the opacity to 1 to prevent animation */
    transform: translateY(0) !important; /* Reset the transform property */
    transition: none !important;  /* Remove the transition for this element */
}
.fade {
    animation: fadeUp 2s ease 1;
}
.section:hover {
    background-size: 110% 110%;
}

.scroll-button.previous {
    opacity: 0.5;
    pointer-events: none;
}

.scroll-button.previous.enabled {
    pointer-events: auto;
    opacity: 1;
}


#myBtn {
    display: block;
    position: fixed;
    bottom: 40px;
    right: 6vw;
    z-index: 99;
}
.svg-container {
    position: absolute;
    height: 100vh;
    overflow: hidden;
    margin-left: 67vw;
}
.svg-container1 {
    position: absolute;
    height: 100vh;
    overflow: hidden;
    margin-left: 67vw;
}

@keyframes drawPath {
    to {
        stroke-dashoffset: 0;
        /* Reveal the entire path */
    }
}
.rotation-container {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
    margin:1vw 0 0 4vw;
}

.rotate-img {
    position: absolute;
    z-index: 5;
    width: 34vw;
    height: 32vw;
    animation: rotateSlowly 25s linear infinite;
    top: 1%;
    /* Adjust the duration as needed */
}


@keyframes rotateSlowly {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* slider */

  /* slider */
  
  /* slider 2*/
  .container-slider {
    position: relative;
    overflow: hidden;
    width: 20vw;
    /* height: 240px !important; */
}

.slider-1 li img{
    height: 300px !important;
    width: auto !important;
}

.scrollable-list {
    list-style: none;
    margin: 0;
    padding: 0;
    transition: transform 1.5s ease-in-out;
}

.scrollable-list li img {
    height: 70%;
    width: 70%;
    /* line-height: 30px; */
}

.scrolled {
    transform: translateY(-150px);
}

  /* slider 2*/
  
#nxt{height: 5vh;}
#prv{height: 5vh;}

.blue{
    color: #144374;
}
.sidenav{
    font-family: 'Raleway', sans-serif;
}
@keyframes bubble {
    0%, 100% {
        transform: translateY(0); /* Start and end position */
    }
    50% {
        transform: translateY(-10px); /* Middle position (bubbling up) */
    }
}

/* Apply the animation to the element */
.scrl img {
    animation: bubble 2s ease-in-out infinite; /* Customize the animation duration as needed */
}

.modal{
    --bs-modal-width: 100vw;
    margin: 0;
    --bs-modal-border-radius:0;
  
}
.bnav{
    /* background: linear-gradient(91deg, #589BFF 0%, #00F0FF 100%); */
    display: none;
}
.sec1head{
    width: 65%;

}
.robot-smallscreen{
    display: none;
}
.robotics{
    margin-top: 20vh;
}
.display-inline-block {
    display: inline-block;
    vertical-align: top; /* Align the inline-block div with the top of the line */
  }
.robo-txt{
    /* text-align: center; */
    margin-top: 7vh;
    margin-left: 8vw;
     /* max-width: 40rem;  */
     font-family: 'Raleway', sans-serif;
      color: #144374;
}
.button{
    margin-top: 40vh;
}
.navbar{
    margin-top: 5vh;
}
.sm{
    display: none;
}
.bg{
    display: block;
}
.sec2txt{
    margin-left: 20vw;
}

.mod{
    background-image: url(../img/modalbg.webp);
    background-position: center;
    background-repeat: no-repeat;
    background-size:contain;
    max-height: 85vh;
}


.formdiv {
    width: 90%;
    height: 100%;
    
}
.section .row{position: relative;}
input{
    text-transform: uppercase;
     opacity: 0.50;
      width: 100%;
       border: none;
       color: #144374;
     border-bottom:2px solid #144374; 
}
form input:focus{
    border: none;
    outline: none;
    border-bottom: 2px solid #255E98;
    color: aqua;
}
input::placeholder{
    color: #255E98;
}
.sn{
    margin-left: vw;
}
.sec2 .svg1{
    margin-left:-10vw;
    transform: rotateY(180deg); 
}
.cnt-2{
    height: 135px !important;
}
.cnt-2 ul li img {
height: 100%;
width: auto;
}
.cnt-2 ul li {
    height: 135px;
}
.cnt-3{
    height: 135px !important;
}
.cnt-3 ul li {
    height: 135px;
}
.cnt-3 ul li img {
height: 100%;
width: auto;
}
.owlc li {
width: fit-content;
}

.owl-item{
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.owl-carousel .owl-item img{
    /* width: auto !important; */
}
@media (max-width:995px) {

    .navbar{
        margin-top: 1vh;
        margin-bottom: 3vh;
        padding: 0;
        /* border-top: 1px solid #144374; */
        /* border-bottom: 1px solid #144374; */
    }
    ::-webkit-scrollbar {
       display: none;
      }
    .section{
        /* background-position: bottom; */
        max-height: 100vh;
    }
    
    .owl-dots{
        display: none;
    }
    .sec7{
        /* background-image: url(../images/bg.PNG); */
    }
    /* .sec5,.sec4,.sec6,.sec8,.sec11{
        background-image: url(../images/bgw.svg);
    } */

    .sn{
        display: none;
    }
  .logosm{
    height:4vh ;
  }
  
  .rbs{
    margin-top: -2vh !important;
  }
    .bnav{
        /* top: 95vh; */
        bottom: 0;
        position: absolute;
        background: rgb(88,155,255);
background: linear-gradient(94deg, rgba(88,155,255,1) 3.4%, rgba(0,240,255,1) 48.15%);
        display: flex;
        width: 100%;
        /* height: 5vh; */
        left: 0;
        z-index: 3;
        color: #fff;
        text-transform: uppercase;
        flex-wrap: wrap;
    }
    .bnav .mt-1 a{
        color: #fff;
        font-size: 1.4rem;
    }
    .slider-1 li img{
        height: 190px !important;
    }
    .tst{
        margin-left: 0 !important;
    }
    .mod{
        background-color: white !important;
        background-image: none !important;
    }
    /* .slider-2 li img{
        height: 190px !important;
        width: 100%;
    } */
    .container{
        margin: 0;
        padding: 0;
    }
    .container-slider {
        width: 90%;
        margin-top: 7vh;
        height: 25vh;
    }
    
    .sec1head{
        width: 17.9375rem;
        letter-spacing: 0.004rem;
        color: #144374;
        font-feature-settings: 'clig' off, 'liga' off;
        font-family: Raleway;
        font-size: 1.5rem;
        font-style: normal;
        font-weight: 300;
        line-height: 120%; /* 2.4rem */
        letter-spacing: 0.004rem;
        text-transform: uppercase;
        
    }
    .robot-widescreen{
        display: none;
    }
    .robot-smallscreen{
        display: block;
        text-align: center;
        margin-bottom: 5vh;
    }
    .robotics{
        margin-top: 0vh;
    }
    .robo-txt{
        padding-right:2vw;
        margin-top: 2vh;
        font-size: 0.9rem;
    }
    .button{
        display: none;
    }
    .sm{
        display: block;
    }
    .smt{
        font-size: 0.75rem;
    }
    .bg{
        display: none;
    }
    #myBtn{
        display: none;
    }
    .sec2txt{
        margin-left: 0vw;
    }
    .svg-container{
        
        margin-top: 28vh;
        margin-left: 49vw;
        width: 56%;
        height: 65vh;
    }
    .sec2 .svg1{
        margin-left:42vw;
        transform: rotateY(0deg); 
    }
    
    .pol{
        width: 6vh;
    }
    .scroll-button img{
        margin-top: 3vh !important;
    }
    
}