@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Playball&display=swap');


p {
    line-height: 27px;
    color: #4E4E4E;
}

a {
    text-decoration: none;
    color: black;
    font-weight: 600;    
}
button {
    cursor: pointer;
}

body{    
    margin: 0 ;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Plus Jakarta Sans', sans-serif;
}

.Headers{        
    background-color: white;
   top: 0;
   position: sticky;
   display: flex;
   justify-content: space-between;
   align-items: center;  
   height: 80px;
   z-index: 99999;   
   border-radius: 0 0 10px 10px;
}
.Header_Links{        
    display: flex;
    justify-content: center;   
    gap: 80px;
    align-items: center;    
    margin-right: 90px;    
}
.Header_Links a:focus , .Header_Links a:hover {
    transition: 0.2s;
    color: #f05454;    
}
.Logo_favicon{
    margin-left: 90px;
}
.Header_Links_Mob{
    display: none;
}
.Hamburger{
    display: none;
}

@media screen and (max-width:3840px) and (min-width:2256px) {    
    .Headers{
        width: 1609px;              
        margin: auto;
    }    
}

@media screen and (max-width:2255px) and (min-width:1920px) {
    .Headers {
      width: 1900px;
      margin: auto;
    }
}

@media screen and (max-width:1599px) and (min-width:1440px) {
    .Why_Hackit .Why_Hackit_boxe1 {
        width: 1360px;        
        margin: auto;
        display: flex;        
        align-items: center;
    }
    .Why_Hackit .Why_Hackit_boxe1 div {
        width: 400px;          
    } 
    .Why_Hackit .Why_Hackit_boxe1 div p {
        width: 100%;
    }
    .Why_Hackit .Why_Hackit_boxe2 {
        margin-top: 30px;
        width: 1360px;        
    }
    .Why_Hackit .Why_Hackit_boxe2 div {
        width: 630px;        
    }
}

@media screen and (min-width:1025px) and (max-width:1439px) {    
    .Header_Links {        
      margin-right: 20px;         
      gap: 50px;
    }
    .Headers .Logo_favicon{ 
      margin-left: 20px;      
      flex-grow: 3;
    }
} 

@media screen and (min-width:769px) and (max-width:1438px) {
    .Header_Links{
        display: flex;
        justify-content: center;   
        gap: 40px;
        align-items: center;
        margin-right: 50px;
    }
    .Logo_favicon{
        margin-left: 50px;
    }
    .Header_Links{
        display: none;
    }
    .Header_Links_Mob{    
        z-index: 1000000px;          
        transition: 0.5s;   
        border-top-right-radius: 20px;        
        border-bottom-right-radius: 20px;
        transform: translateX(-100%);
        height: 300px;
        color: white;        
        width: 500px;
        top: 80px;        
        position: absolute;
        display: flex;        
        justify-content: center;
        align-items: center;
        flex-direction: column;
        background-color: #f05454;   
        gap: 20px;     
    }
    .Header_Links_Mob.active{
        z-index: -1000000;
        transition: 0.5s;   
        border-top-right-radius: 20px;        
        border-bottom-right-radius: 20px;                
        transform: translateX(0px);
        height: 300px;
        color: white;        
        width: 500px;
        top: 80px;        
        position: absolute;
        display: flex;        
        justify-content: center;
        align-items: center;
        flex-direction: column;
        background-color: #f05454;   
        border: 1px solid #EAEBF0; 
        gap: 20px;       
    }
    .Header_Links_Mob a{      
        position: relative;                  
        z-index: 999;        
    }
    .Hamburger{                     
        transition: 0.3s;
        display: block;
        position: relative;        
        margin-right: 70px;
        height: 5px;
        width: 30px;        
        background-color: #f05454;        
    }
    .Hamburger::before{          
        transition: 0.3s;      
        border-bottom-left-radius: 20px;
        border-bottom-right-radius: 20px;
        left: 0px;
        position: absolute;
        content:' ';
        top: 8px;
        height: 5px;
        width: 30px;
        background-color: black;            
    }
    .Hamburger::after{        
        transition: 0.3s;
        left: 0px;
        border-top-right-radius: 20px;
        border-top-left-radius: 20px;
        position: absolute;
        content:' ';
        bottom: 8px;
        height: 5px;
        width: 30px;
        background-color: black;            
    }
    .Hamburger.active{        
        display: block;
        position: relative;
        margin-right: 70px;
        height: 5px;
        width: 30px;        
        background-color: #f05454;                
    }
    .Hamburger.active::before{           
        transition: 0.3s;
        border-bottom-left-radius: 20px;
        border-bottom-right-radius: 20px;
        position: absolute;        
        left: -10px;
        content:' ';
        top: 8px;
        height: 5px;
        width: 30px;
        background-color: black;            
    }
    .Hamburger.active::after{        
        transition: 0.3s;
        border-top-right-radius: 20px;
        border-top-left-radius: 20px;
        position: absolute;
        left: 10px;
        content:' ';        
        bottom: 8px;
        height: 5px;
        width: 30px;
        background-color: black;            
    }
    .Hamburger{
        transition: 0.3s;
        display: block;
        position: relative;
        margin-right: 30px;
        height: 5px;
        width: 30px;        
        background-color: #f05454;        
    }
    .Hamburger.active{
        margin-right: 30px;
    }
    .Logo_favicon{
        margin-left: 30px;
    }
    .Header_Links_Mob.active{        
        width: 70%;        
    }
    
}

@media screen  and (max-width:768px) {
    .Header_Links{
        display: flex;
        justify-content: center;   
        gap: 40px;
        align-items: center;
        margin-right: 50px;
    }
    .Logo_favicon{
        margin-left: 50px;
    }
    .Header_Links{
        display: none;
    }
    .Header_Links_Mob{    
        z-index: 1000000px;          
        transition: 0.5s;   
        border-top-right-radius: 20px;        
        border-bottom-right-radius: 20px;
        transform: translateX(-100%);
        height: 300px;
        color: white;        
        width: 500px;
        top: 80px;        
        position: absolute;
        display: flex;        
        justify-content: center;
        align-items: center;
        flex-direction: column;
        background-color: #f05454;   
        gap: 20px;     
    }
    .Header_Links_Mob.active{
        z-index: -1000000;
        transition: 0.5s;   
        border-top-right-radius: 20px;        
        border-bottom-right-radius: 20px;                
        transform: translateX(0px);
        height: 300px;
        color: white;        
        width: 500px;
        top: 80px;        
        position: absolute;
        display: flex;        
        justify-content: center;
        align-items: center;
        flex-direction: column;
        /* background-color: #f05454;        */
        border: 1px solid #EAEBF0; 
        gap: 20px;       
    }
    .Header_Links_Mob a{      
        position: relative;                  
        z-index: 999;        
    }
    .Hamburger{                     
        transition: 0.3s;
        display: block;
        position: relative;        
        margin-right: 70px;
        height: 5px;
        width: 30px;        
        background-color: #f05454;        
    }
    .Hamburger::before{          
        transition: 0.3s;      
        border-bottom-left-radius: 20px;
        border-bottom-right-radius: 20px;
        left: 0px;
        position: absolute;
        content:' ';
        top: 8px;
        height: 5px;
        width: 30px;
        background-color: black;            
    }
    .Hamburger::after{        
        transition: 0.3s;
        left: 0px;
        border-top-right-radius: 20px;
        border-top-left-radius: 20px;
        position: absolute;
        content:' ';
        bottom: 8px;
        height: 5px;
        width: 30px;
        background-color: black;            
    }
    .Hamburger.active{        
        display: block;
        position: relative;
        margin-right: 70px;
        height: 5px;
        width: 30px;        
        background-color: #f05454;                
    }
    .Hamburger.active::before{           
        transition: 0.3s;
        border-bottom-left-radius: 20px;
        border-bottom-right-radius: 20px;
        position: absolute;        
        left: -10px;
        content:' ';
        top: 8px;
        height: 5px;
        width: 30px;
        background-color: black;            
    }
    .Hamburger.active::after{        
        transition: 0.3s;
        border-top-right-radius: 20px;
        border-top-left-radius: 20px;
        position: absolute;
        left: 10px;
        content:' ';        
        bottom: 8px;
        height: 5px;
        width: 30px;
        background-color: black;            
    }
    .Hamburger{
        transition: 0.3s;
        display: block;
        position: relative;
        margin-right: 30px;
        height: 5px;
        width: 30px;        
        background-color: #f05454;        
    }
    .Hamburger.active{
        margin-right: 30px;
    }
    .Logo_favicon{
        margin-left: 30px;
    }
    .Header_Links_Mob.active{        
        width: 70%;        
    }    
}
/* @media screen and (min-width:375px) and (max-width:767px)  {
    .Hamburger{
        transition: 0.3s;
        display: block;
        position: relative;
        margin-right: 30px;
        height: 5px;
        width: 30px;        
        background-color: #f05454;        
    }
    .Hamburger.active{
        margin-right: 30px;
    }
    .Logo_favicon{
        margin-left: 30px;
    }
    .Header_Links_Mob.active{        
        width: 100%;        
    }
}
@media screen and (max-width:376px) {
    .Header_Links_Mob.active{
        width: 100%;
    }
} */


/* -------------------Home_Part---------------------- */

.Home_Part{
    display: flex;    
    justify-content: center;
    align-items: center;
    position: relative;
    overflow: hidden;
    height: 100vh;
    background: linear-gradient(to right , #6c353565 , #c50000c4);    
}
.Home_Part .ThemeVideo {
    width: 100%;    
    height: 100%;
    object-fit: cover;    
    top: 50%;
    left: 50%;
    transform: translate(-50% , -50%);
    position: absolute;
    z-index: -1;
}
.Home_Part1{  
    color: white;
    text-align: center;     
    display: grid;    
}
.Home_Part1 h2{      
    text-align: center;
    margin-bottom: 0;    
    font-weight: 700;
    font-size: 52px;
    width: 624px;
    margin: auto;
}
.Home_Part1 p{    
    text-align: center;    
    font-weight: 400;
    font-size: 16px;
    width: 624px;   
    margin: auto; 
    margin-top: 18px;
    color: #F9F9F9;
;
}
.Home_Part1 button{
    transition: 0.5s;
    margin: auto;
    margin-top: 48px;
    color:#f05454;
    width: 121px;
    height: 46px;
    font-weight: 600;
    font-size: 15px;
    background-color: #ffffff;
    border: none;
    border-radius: 6px;
}
.Home_Part1 button:hover {
    background-color: #424242;
}

@media screen and (min-width:1024px) and (max-width:1439px) {
    .Home_Part1 h2{   
        /* display: none;          */
    }
    .Home_Part1 p{
        /* display: none;         */
    }
    .Home_Part1 button{
        display: none;     
    }
    .Home_Part1{
        position: absolute;                
    }
    .Home_Part img{
        width: 800px;
    }
}
@media screen and (min-width:769px) and (max-width:1023px)  {     
    .Home_Part{                           
        /* z-index: -50000;   */
        display: grid;            
        height: 100vh;             
    }         
    .Home_Part1 h2{   
        display: block;
    }
    .Home_Part1 button{
        display: block;     
    }
    .Home_Part  img{        
        left: 100px;        
        position: relative;
        width: 500px;
    }
    .Home_Part1{          
        margin-left: 50px;                
    }
    .Home_Part .ThemeVideo{
        object-fit: cover;
    }
}

@media screen and (max-width:768px) and (min-width:426px){
    .Home_Part {        
        height: 500px;           
    }
    .Home_Part div:last-child img{
        display: none;
    }
    .Home_Part1{           
        width: 400px; 
        margin: auto;        
        left: 0;
        top: 0;
        position: relative;        
    }
    .Home_Part1 h2 {
        margin-bottom: 38px;      
        width: 100%;               
        font-size: 36px;
        font-weight: 700;           
        margin: auto;
    }
    .Home_Part1 p{        
        display: none;
    }
    .Home_Part1{                   
        width: 100%;
        margin: auto;
        left: 0;
        top: 0;
        position: relative;        
    }
    .Home_Part .ThemeVideo {
        object-fit: cover;
    }
}

@media screen and (max-width:425px) {
    .Home_Part {
        margin-top: 40px;
        background:none;
        height: auto;
    }
    .Home_Part .ThemeVideo {
        display: none;           
    }
    .Home_Part1 h2 {
        color: black;
        font-size: 36px;
        text-align: start;
        width: 343px;
    }
    .Home_Part1 p {
        display: none;
    }
    .Home_Part1 button {
        width: 100%;
        background-color: #f05454;
        color: white;
    }
}
/* 
@media screen and (max-width:375px) {
    .Home_Part1{           
        width: 340px; 
        margin: auto;        
        left: 0;
        top: 0;
        position: relative;        
    }
} */




/* -------------------------------------Why HackIt-------------------------------------- */

.Why_Hackit{       
    margin: 141px 0 141px 0;

    
}
.Why_Hackit h1{    
    text-align: center;
    font-size: 36px;
    font-weight: 700;
}
.Why_Hackit .Why_Hackit_desc{                  
    font-size: 16px;
    font-weight: 400;
    text-align: center;
    margin-bottom: 60px;   
}

.Why_Hackit_boxe1{    
    width: 1609px;
    margin: auto;    
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;    
}

.Why_Hackit_boxe1 div{
    width: 490px;
    height: 230px;
    text-align: left;    
    border: 1px solid #EAEBF0;    
    padding-left: 32px;
    padding-top: 24px;
    border-radius: 5px;
}
.Why_Hackit_boxe1 div:last-child{
    display: none;
}
.Why_Hackit_boxe1 div p{        
    padding-bottom: 8px;
    width: 425px;    
}
.Why_Hackit_boxe1 div img{
    padding-bottom: 24px;
    /* width: 425px;     */
}
.Why_Hackit_boxe2{
    margin: auto;
    width: 1609px;
    display: flex;
    justify-content: space-between;
}
.Why_Hackit_boxe2 div{
    text-align: left;
    padding-left: 32px;
    padding-top: 24px;
    width: 760px;
    height: 230px;    border: 1px solid #EAEBF0;    
    border-radius: 5px;    
}
.Why_Hackit_boxe2 div p{
    text-align: left;            
}
.Why_Hackit_boxe2 div img{
    padding-bottom: 24px;    
}

.Why_Hackit_boxe3 { 
    height: 400px;      
    transition: 0.3s;    
    display: flex; 
    justify-content: center;
    align-items: start;            
    width: 100%;         
    margin: auto;
    gap: 20px;             
}
.Why_Hackit_boxe3 .box {
    transition: 0.5s;
    padding: 15px;
    border-radius: 6px;
    box-shadow: 0px 0px 5px  rgba(0, 0, 0, 0.274);
    height: 360px;
    max-width: 277px;
    min-width: 100px;       
    
}
.Why_Hackit_boxe3 .line {
    transition: 0.5s;
    height: 3px;
    width: 60%;
    background-color: #f14141;
}

.Why_Hackit_boxe3 .box p{
    width: 100%;
    color: #4E4E4E;
}

/* .Why_Hackit_boxe3 .box:hover {    
    transition: 0.5s;
    height: 400px;    
} */

.Why_Hackit_boxe3 div:hover .line {   
    transition: 0.5s;
     width: 270px;         
    width: 100%;
}



.Why_Hackit_boxe3 div .desc {
    margin-top: 20px;
    line-height: 30px;
}

.Why_Hackit_boxe div img {
    width: 65px;
}
@media screen and (max-width:1919px) and (min-width:1600px) {
    .Why_Hackit_boxe3 {        
        width: 1570px;
        display: grid;
        height: auto;        
        grid-template-columns: auto auto auto auto auto;
        place-items: center;
    }
    .Why_Hackit_boxe3 .box:hover {        
        height: 410px;
    }
    .Why_Hackit_boxe3 .box {              
        height: 410px;
    }    
}
@media screen and (max-width:1599px) and (min-width:1440px) {
    .Why_Hackit_boxe3 {        
        width: 1250px;
        display: grid;
        height: auto;        
        grid-template-columns: auto auto auto auto auto;
        place-items: center;
    }
    .Why_Hackit_boxe3 .box:hover {        
        height: 410px;
    }
    .Why_Hackit_boxe3 .box {              
        height: 410px;
    }    
}
@media screen and (max-width:1439px) and (min-width:1024px) {
    .Why_Hackit_boxe3 {
        width: 900px;        
        display: grid;
        height: auto;        
        grid-template-columns: 1fr 1fr 1fr;
        place-items: center;
    }
    .Why_Hackit_boxe3 .box:hover {        
        height: 410px;
    }
    .Why_Hackit_boxe3 .box {              
        height: 410px;
        
    }
}
@media screen and (max-width:1023px) and (min-width:768px) {
    .Why_Hackit_boxe3 {
        width: 760px;        
        display: grid;
        height: auto;        
        grid-template-columns: 1fr 1fr 1fr;
        place-items: center;
    }
    .Why_Hackit_boxe3 .box:hover {        
        height: 450px;
    }
    .Why_Hackit_boxe3 .box {              
        height: 450px;
        
    }
}
@media screen and (max-width:767px) {
        .Why_Hackit_boxe3 {
            height: auto;
            width: fit-content;
            margin: auto;
            /* display: flex;  
            justify-content: center;          
            align-items: center; */
         display: grid;
         grid-template-columns:repeat(auto-fit,minmax(300px ,1fr));
         place-items: center;         
        }
        .Why_Hackit_boxe3 .box {    
            flex-grow: 1;
            height: 400px;
        }
        .Why_Hackit_boxe3 .box .desc {
           margin-top: 50px;
        }
        .Why_Hackit_boxe3 .box:last-child {                       
           
        }
}


@media screen and (max-width:1919px) and (min-width:1600px) {
    .Why_Hackit .Why_Hackit_boxe1  {
        width: 1420px;        
    }    
    .Why_Hackit .Why_Hackit_boxe1 div {                
        width: 420px;        
        height: auto;
        justify-content: center;        
        margin: auto;
    }
    .Why_Hackit .Why_Hackit_boxe1 div p {
        width: 400px;
    }   
    .Why_Hackit .Why_Hackit_boxe2 {
        width: 1400px;        
    }
    .Why_Hackit .Why_Hackit_boxe2 div {
        width: 655px;        
    } 
    .Why_Hackit .Why_Hackit_boxe2 div p {
        width: 600px;
    }
    
}
@media screen and (min-width:1024px) and (max-width:1439px) {
    .Why_Hackit_boxe1 div:last-child{
        display: block;
    }
    .Why_Hackit_boxe2 div:last-child{
        display: none;
    }
    .Why_Hackit_boxe1{     
        margin: auto;                   
        margin-bottom: 20px;        
        display: grid;
        grid-template-columns: repeat(2,490px);  
        place-content: center;                      
        place-items: center;
        grid-gap: 20px;        
        width: 100%;        
    }
    .Why_Hackit_boxe1 div{
        width: 400px;
    }
    .Why_Hackit_boxe1 div p{
        width: 350px;
    }
    .Why_Hackit_boxe2{
        width: 100%;        
    }
    .Why_Hackit_boxe2 div{
        width: 910px;
        margin: auto;
    }
}
@media screen and (min-width:768px) and (max-width:1023px) {
    .Why_Hackit .Why_Hackit_desc{
        display: none;
    }
    .Why_Hackit_boxe1 div{                
        width: 310px;
        height: 250px;
    }
    .Why_Hackit_boxe1 div p{
         width: 286px;
    }
    .Why_Hackit_boxe1 div:last-child {        
        display: block;
    }
    .Why_Hackit_boxe1{     
        margin: auto;                   
        margin-bottom: 20px;        
        display: grid;
        grid-template-columns: repeat(2,342px);  
        place-content: center;                      
        place-items: center;
        grid-gap: 20px;        
        width: 100%;        
    }
    .Why_Hackit_boxe2 {
        width: 100%;        
    }
    .Why_Hackit_boxe2 div{
        margin: auto;
        width: 672px;
    }
    .Why_Hackit_boxe2 div:first-child {
        display: none;
    }
}

@media screen and (max-width:767px) and (min-width:320px) {
    .Why_Hackit .Why_Hackit_desc {        
        display: none;
    }
    .Why_Hackit {        
        margin-top: 46px;      
        margin-bottom: 46px;  
    }
    .Why_Hackit h1 {
        text-align: center;        
        font-size: 24px;
        font-weight: 700;
    }
    .Why_Hackit_boxe1{
        display: grid;
        grid-template-columns: 1fr;  
        width: 100%;      
        gap: 24px;
    }
    .Why_Hackit_boxe1 div {
        width: 320px;
        margin: auto;             
    }
    .Why_Hackit_boxe1 div p {
        width: 90%;
    }
    .Why_Hackit_boxe2{
        width: 100%;
        display: grid;
        place-content: center;
        gap: 20px;
    }
    .Why_Hackit_boxe2 div {  
        height: auto;
        margin: auto;        
        width: 320px;        
    }
}

@media screen and (max-width:374px) {
 .Why_Hackit .Why_Hackit_desc {        
        display: none;
  }
}


/* ----------------------------SkillSets-------------------------------------- */
.Our_Customers{
    font-size: 36px;
    font-weight: 700;
    text-align: center;
}
.SkillSets{
    display: flex;
    justify-content: center;
    align-items: center;
}
.SkillSets .leftArrow{
    transform: rotateZ(180deg);    
}
.SkillSets button{
    cursor: pointer;
    height: 50px;
    width: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    border: solid 2px #f05454;
    background-color: transparent;
}
.SkillSets button img{
    width: 20px;
}
.SkillSet_Container{    
    border-radius: 20px;    
    width: 1500px;    
    overflow: hidden;        
}
.SkillSet_Container_inner{        
    width: auto;
    margin-left: 1750px;    
    gap: 200px;
    transition: 0.5s;
    transition-timing-function: ease-out;
    display: flex;    
    justify-content: center;
    align-items: center;    
}
.SkillSets .Slogos{
    width: 200px;
}


/* ---------------------------------------Our Customers------------------------------------------ */

.Our_Customers_Logo h2{
    text-align: center;
} 
.Our_Customers_Logo .Our_Customers_Desc {
    text-align: center;
}
.Our_Customers_Logo .Bubbles{    
    max-width:89vw;
    margin: 88px auto;
    display: flex;    
    justify-content: space-between; 
    align-items: center;
    flex-wrap: wrap;    
    gap: 30px;
    padding: 0 50px 0 50px;    
}
.Our_Customers_Logo .Bubbles div {
    width: 13vw;
    height: 8vw;    
    border-radius: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.Clogo1 {
    background-color: #a7c3094d;        
}
.Clogo3 {
    background-color: #ed1d245b;
}
.Clogo4 {
    background-color: #22af4a49;
}
.Clogo5 {
    background-color: #CCDBEC;
}
.Clogo6 {
    background-color: #7eb2ff46;
}
.Clogo7 {
    background-color: #CDDDEC;
}
.Clogo8 {
    background-color: #FFDFDF;
}
.Clogo9 {
    background-color: #fed40163;
}
.Clogo10 {
    background-color: #181b2662;
}
.Clogo11 {
    background-color: #fe0000;
}
.Clogo12 {
    background-color: #CEE0EE;
}
.Clogo13 {
    background-color: #5e9e1e52;
}
.Clogo14 {
    background-color: #1b1c1c52;
}
.Clogo15 {
    background-color: #D3DDE7;
}
.Clogo16 {
    background-color: #340c646c;
}
.Clogo17 {
    background-color: #0c6aa56c;
}
.Clogo18 {
    background-color: #0096dc71;    
}
.Clogo19 {
    background-color: #D3EFDB;    
}
.Our_Customers_Logo .Bubbles div img {
        width: 8vw;
        height: 8vw;
}
.ShowMore {    
    margin: auto;
    width: 110px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: none;
    background-color: transparent;
}
.ShowMore p {
    color: #437EF7;
    margin: 0;
    font-size: 16px;
}

@media screen and (max-width:768px) and (min-width:376px){   
    .Our_Customers_Desc {
        display: none;
    }     
    .Our_Customers_Logo .Bubbles {        
        max-width:700px;             
    }
    .Our_Customers_Logo .Bubbles div {
       height: 15vw;
       width: 26vw;
    }
    .Our_Customers_Logo .Bubbles div img{
        width: 15vw;        
        height: 15vw;         
    }
    .Our_Customers_Logo .Bubbles .Clogo11 {
    display: none;
   }
   .Our_Customers_Logo .Bubbles .Clogo12 {    
    display: none;    
   }
   .Our_Customers_Logo .Bubbles .Clogo13 {
    display: none;
   }
   .Our_Customers_Logo .Bubbles .Clogo14 {    
    display: none;
   }
   .Our_Customers_Logo .Bubbles .Clogo15 {    
    display: none;
   }
   .Our_Customers_Logo .Bubbles .Clogo16 {    
    display: none;
   }
   .Our_Customers_Logo .Bubbles .Clogo17 {    
    display: none;
   }
   .Our_Customers_Logo .Bubbles .Clogo18 {    
    display: none;
   }
   .Our_Customers_Logo .Bubbles .Clogo19 {    
    display: none;
   }
}

@media screen and (max-width:375px) {        
    .Our_Customers_Desc {
        display: none;
    }
    
    .Our_Customers_Logo .Bubbles {        
        max-width: 370px;                
        margin: 0;
    }
    .Our_Customers_Logo .Bubbles div {
        height: 73px;
        width: 120px;        
        margin-bottom: 10px;
     }
     .Our_Customers_Logo .Bubbles div img{
         width: 100%;        
         height: 100%;         
         object-fit:contain;
     }
     .Our_Customers_Logo .Bubbles .Clogo8 {
        display: none;
     }
     .Our_Customers_Logo .Bubbles .Clogo9 {
        display: none;
     }
     .Our_Customers_Logo .Bubbles .Clogo10 {
        display: none;
     }

     .Our_Customers_Logo .Bubbles .Clogo11 {
        display: none;
       }
       .Our_Customers_Logo .Bubbles .Clogo12 {    
        display: none;    
       }
       .Our_Customers_Logo .Bubbles .Clogo13 {
        display: none;
       }
       .Our_Customers_Logo .Bubbles .Clogo14 {    
        display: none;
       }
       .Our_Customers_Logo .Bubbles .Clogo15 {    
        display: none;
       }
       .Our_Customers_Logo .Bubbles .Clogo16 {    
        display: none;
       }
       .Our_Customers_Logo .Bubbles .Clogo17 {    
        display: none;
       }
       .Our_Customers_Logo .Bubbles .Clogo18 {    
        display: none;
       }
       .Our_Customers_Logo .Bubbles .Clogo19 {    
        display: none;
       }
}
@media screen and (max-width:374px) {
    .Our_Customers_Logo .Bubbles {
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .Our_Customers_Logo .Bubbles div {
        width: 70vw;
    }
}

/*
.Our_Customers_Logo{
    height: auto;    
    position: relative; 
    text-align: center;    
}
.Our_Customers_Logo h2{   
    margin-bottom: 16px;
    text-align: center;
    font-size: 36px;
    font-weight: 700;
    position: relative;
    z-index: -10;
}
.Our_Customers_Logo p {
    margin-bottom: 21px;
    font-size: 16px;
    font-weight: 400;
}
.Our_Customers_Logo .Bubbles img{    
    border: solid 1px rgb(173, 171, 171);
    border-radius:50% ;
    position: absolute;
    transition: 2s;
}

.Our_Customers_Logo .Bubbles{ 
    display: flex;
    justify-content: center;
    align-items: center;
    margin: auto;
    overflow: hidden;
    width: 100%;        
    position: relative;    
    height: 500px;    
    z-index: -10;
}

.Bubbles .Clogo1{      
    display: flex;  
    justify-content: center;    
    top: 45px;
    left: 134px;
    height: 150px;
    width: 150px;
    object-fit: contain; 
    animation-name: bounce-back;
    animation-duration: 5s;
    animation-timing-function: ease-out;    
    animation-fill-mode: forwards;    
    animation-iteration-count: infinite;         
}
.Bubbles .Clogo2{        
    width: 113px;
    top: 219px;
    left: 94px;
    animation-name: bounce;
    animation-duration: 5s;
    animation-timing-function: ease-out;    
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
}
.Bubbles .Clogo3{    
    width: 113px;
    top: 173px;
    left: 283px;
    animation-name: bounce-back;
    animation-duration: 5s;
    animation-timing-function: ease-out;    
    animation-fill-mode: forwards;    
    animation-iteration-count: infinite;  
}
.Bubbles .Clogo4{
    width: 152px;    
    top: 336px;
    left: 244px;
    animation-name: bounce;
    animation-duration: 5s;
    animation-timing-function: ease-out;    
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
}
.Bubbles .Clogo5 {        
    width: 108px;
    top: 290px;
    left: 433px;
    animation-name: bounce-back;
    animation-duration: 5s;
    animation-timing-function: ease-out;    
    animation-fill-mode: forwards;    
    animation-iteration-count: infinite;  
}
.Bubbles .Clogo6{    
    width: 113px;
    top: 80px;
    left: 433px;
    animation-name: bounce-back;
    animation-duration: 5s;
    animation-timing-function: ease-out;    
    animation-fill-mode: forwards;    
    animation-iteration-count: infinite;  
}
.Bubbles .Clogo7{        
    width: 152px;
    top: 169px;
    left: 622px;
    animation-name: bounce;
    animation-duration: 5s;
    animation-timing-function: ease-out;    
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
}
.Bubbles .Clogo8{    
    width: 109px;
    top: 381px;
    left: 642px;
    animation-name: bounce-back;
    animation-duration: 5s;
    animation-timing-function: ease-out;    
    animation-fill-mode: forwards;    
    animation-iteration-count: infinite;  
}
.Bubbles .Clogo9{    
    width: 113px;
    top: 80px;
    left: 811px;
    animation-name: bounce-back;
    animation-duration: 5s;
    animation-timing-function: ease-out;    
    animation-fill-mode: forwards;    
    animation-iteration-count: infinite;  
}
.Bubbles .Clogo10{    
    width: 152px;
    top: 286px;
    left: 843px;
    animation-name: bounce;
    animation-duration: 5s;
    animation-timing-function: ease-out;    
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
}
.Bubbles .Clogo11{
    background-color: #fe0000;
    width: 113px;
    top: 126px;
    left: 1008px;
    animation-name: bounce-back;
    animation-duration: 5s;
    animation-timing-function: ease-out;    
    animation-fill-mode: forwards;    
    animation-iteration-count: infinite;  
}
.Bubbles .Clogo12{        
    width: 152px;
    top: 286px;
    left: 1053px;
    animation-name: bounce;
    animation-duration: 5s;
    animation-timing-function: ease-out;    
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
}
.Bubbles .Clogo13{        
    width: 147px;
    top: 64px;
    left: 1273px;
    animation-name: bounce-back;
    animation-duration: 5s;
    animation-timing-function: ease-out;    
    animation-fill-mode: forwards;    
    animation-iteration-count: infinite;  
}
.Bubbles .Clogo14{        
    width: 112px;
    top: 232px;
    left: 1244px;
    animation-name: bounce-back;
    animation-duration: 5s;
    animation-timing-function: ease-out;    
    animation-fill-mode: forwards;    
    animation-iteration-count: infinite;  

}
.Bubbles .Clogo15{        
    width: 112px;
    top: 86px;
    left: 1509px;
    animation-name: bounce-back;
    animation-duration: 5s;
    animation-timing-function: ease-out;    
    animation-fill-mode: forwards;    
    animation-iteration-count: infinite;  
}
.Bubbles .Clogo16{        
    width: 111px;
    top: 290px;
    left: 1509px;
    animation-name: bounce-back;
    animation-duration: 5s;
    animation-timing-function: ease-out;    
    animation-fill-mode: forwards;    
    animation-iteration-count: infinite;    
 
}
.Bubbles .Clogo17{        
    width: 152px;
    top: 177px;
    left: 1650px;
    animation-name: bounce;
    animation-duration: 5s;
    animation-timing-function: ease-out;    
    animation-fill-mode: forwards;
    animation-iteration-count: infinite;
}
.Bubbles .Clogo18{            
    width: 113px;
    top: 379px;
    left: 1679px;
    animation-name: bounce;
    animation-duration: 5s;
    animation-timing-function: ease-out;    
    animation-fill-mode: forwards;    
    animation-iteration-count: infinite;
}

.Our_Customers_Logo button{    
    position: relative;
    z-index: -10;
    font-size: 15px;
    font-weight: 600;
    margin: auto;
    display: flex;
    justify-content: space-around;
    align-items: center;            
    height: 50px;
    background-color: transparent;    
    border: none;
    color: #437EF7;
    gap: 13px;
    border-radius: 8px;
    cursor: pointer;
    margin-top: 100px;
 }
 .Our_Customers_Logo button p {
    margin: 0   ;
 }


 @media screen and (max-width:3840px) and (min-width:2256px) {
    .Our_Customers_Logo .Bubbles{  
        width: 1900px;        
        margin: auto;        
    }    
 }
@media screen and (max-width:2255px) and (min-width:1920px) { 
    .Our_Customers_Logo .Bubbles{          
        width: 1900px;
        margin: auto;        
    }
}

@media screen and (max-width:1919px) and (min-width:1600px) {
    .Our_Customers_Logo .Bubbles {
        width: 1500px;        
        margin: auto;        
    }
}

@media screen and (max-width:1599px) and (min-width:1440px) {
    .Our_Customers_Logo .Bubbles{ 
        margin: auto;
        overflow: hidden;
        max-width: 1243px;        
        position: relative;    
        height: 500px;    
    }
 }
 @media screen and (max-width:1439px) and (min-width:1024px) {    
    .Our_Customers_Logo .Our_Customers_Desc{
        display: none;
    }    
    .Our_Customers_Logo .Bubbles{ 
        margin: auto;
        overflow: hidden;
        max-width: 1024px;        
        position: relative;    
        height: 500px;    
    }
    .Bubbles .Clogo11{
        display: none;
    }
 }
 @media screen  and (max-width:1023px) {      
    .Our_Customers_Logo h2{        
        text-align: center;
        margin-left: 14px;
    }  
    .Our_Customers_Logo .Bubbles{         
        max-width: 400px;        
        margin: auto;
        overflow: hidden;        
        position: relative;            
        height: 350px;
    }  
    .Bubbles .Clogo1{
        display: none;
    }
    .Bubbles .Clogo2{        
        display: none;
    }
    .Bubbles .Clogo3{
        display: none;
    }
    .Bubbles .Clogo4{
        display: none;
    }        
    .Bubbles .Clogo5{        
        top: 154px;
        left: 15px;
        width: 69px;
    }    
    .Bubbles .Clogo6{   
        width: 72px;     
        top: 20px;
        left: 13px;                
    }    
    .Bubbles .Clogo7{        
        width: 92px;
        top: 78px;
        left: 135px;                
    }   
    .Bubbles .Clogo8{
        top: 210px;
        left: 134px;        
    }
    .Bubbles .Clogo9{        
        width: 72px;
        top: 19.7px;
        left: 252.63px;                
    }
    .Bubbles .Clogo10{        
        width: 91px;
        top: 152px;
        left: 250px;        
    }
    .Our_Customers_Logo button{
        margin-top: 20px;
        width: 111px;
    }
 } 
@keyframes bounce {
   0%{
     transform: translateY(0px);
   }
   50%{
    transform: translateY(-20px);
   }
   100%{
    transform: translateY(0px);
   }   
}
@keyframes bounce-back {
    0%{
      transform: translateY(0px);
    }
    50%{
     transform: translateY(10px);
    }
    100%{
     transform: translateY(0px);
    }   
 } */

/* ----------------------------------------------------------------Industries-------------------------------------------------------------------------- */

.Industrie {  
    margin-top: 184px;    
    background-color: #4E4E4E;  
    width: 100%;    
    /* height: 829px; */
    padding-top: 57px;
    padding-bottom: 120px;
}
.Industrie h1 {
    color: white;
    text-align: center;
    font-size: 36px;
    font-weight: 700;
}
.Industrie .Idisc {    
    color: white;
    text-align: center;
    margin: auto;
}
.Industrie .IndOpts {    
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    flex-wrap: wrap;
    max-width: 1820px;
    margin: auto;    
    gap: 24px;
    margin-top: 60px;    
}
.Industrie .IndOpts div {
    display: flex;   
    flex-direction: column;    
    justify-content: center;    
    border-radius: 8px;
    padding-left: 15px;    
    width: 553px;
    height: 266px;
    background-color: white;
}
.Industrie .IndOpts div img {
    width: 51px;
}
@media screen and (max-width:1919px) and (min-width:1601px) {
    .Industrie .IndOpts {            
        max-width: 1200px;
    }
}
@media screen and (max-width:1600px) and (min-width:1440px) {
    .Industrie .IndOpts {            
        max-width: 1200px;
    }
}
@media screen and (max-width:1439px) and (min-width:1025px) {
    .Industrie .IndOpts {            
        max-width: 1200px;
    }    
}
@media screen and (max-width:1024px) and (min-width:769px) {
    .Industrie .Idisc {
        max-width: 800px;
    }
}
@media screen and (max-width:768px) {
    .Industrie {
        margin-top: 10px;
    }
    .Industrie .Idisc {        
        line-height: 30px;        
    }   
    .Industrie .IndOpts div {
        width: 330px;
    } 
}





 /* -------------------------------------Training and capacity----------------------------------- */
 .TandC{        
    width: 100% ;
    margin: 121px 0 121px 0 ;
    height: 685px;
    display: flex;
    justify-content: center;
    align-items: center;    
    /* background: url(./assets/background/Mask\ group.svg); */    
    background-size: cover;
    background-position: center;     
    background-color: #4E4E4E;   
 }
.TandC_Inner{        
     z-index: 0;
    position: relative;
    max-width: 100vw;
    margin: auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12vw;
}
.TandC_Inner h2{
    margin-bottom: 16px;
    color: white;
}
.TandC_Inner .TandC_Disc{
    width: 532px;
    line-height: 24px;
    color: white;
}
.TandC .BLTpoints {
    color: white;
    
}
.TandC .BLTpoints div{
    display: flex;    
}
.TandC .BLTpoints div p{
    color: #F9F9F9;
}
.TandC .BLTpoints div img{
    margin-right: 11px;
}
.TandCImg{
    width: 600px;
}
.TandC button{
    margin-top: 24px;
    font-size: 15px;
    font-weight: 600;
    color: #FFFFFF;
    border: none;
    background-color: #f05454;
    width:137px;
    display: flex;
    justify-content: space-around;
    align-items: center;
    border-radius: 6px;
}
@media screen and (max-width:1024px){
    .TandC{
        width: 100%;        
    }
    .TandCImg{
        /* display: none; */
        width: auto;
    }
    .TandC_Inner{                
        width:950px;
        display: flex;        
        justify-content: space-between;
        margin: auto;        
    }        
    
}

@media screen and (min-width:768px) and (max-width:1023px) {   
    .TandC{
        width: 100%;        
    }
    .TandCImg{
        position: relative;
        /* display: none; */
        top: 30%;
        width: auto;
    }
    .TandC_Inner{        
        width:600px;
        display: flex;        
        justify-content: center;
        margin: auto;
    }         
    .TandC{
        background-image: url(./assets/background/Mask\ group.svg);
        background-size: 1500px ;        
        background-repeat: no-repeat;
        background-position: -700px;
    }    
    .TandC .BLTpoints p{
        width: 276px;
        color: black;
    }    
    .TandC .TandCDTL{
        position: relative;
        left: -80px;
    }
    .TandCImg{
        width: 352px;
        position: absolute;
        left: 300px;
    }
    .TandC button{
        margin-top: 51px;
    }
}

@media screen  and (max-width:767px){

    .TandC {                
        width: 100%;        
        margin: auto;
        background-color: white;
    }
    .TandCImg{        
        display: none;        
    }
    .TandC_Inner{            
        width: 100%;
        margin: auto;
        display: flex;        
        justify-content: center;
        align-items: center;
    }    
    .TandCDTL {       
       max-width: 320px;
       margin: 0 auto;
    }
    .TandCDTL .BLTpoints {
        color: white;
        max-width: 350px;
        margin: auto;
    }
    .TandCDTL h2{
        text-align: center;
        color: black;
        font-size: 24px;
        font-weight: 700;
    }
    .TandCDTL p {
        color: black  !important;
    }
    .TandCDTL .TandC_Disc{   
        color: black;
        max-width: 320px;
        font-size: 16px;
        font-weight: 400;
        margin: auto;
    }
}


.container_ser1  {
  margin-top: 130px;
}
.container_ser1 .container_tittel h1{
  text-align: center;
}
.container_ser1 .container_tittel p {
  width: 1010px;
  text-align: center;
  margin: auto;  
}
.container_ser1 .container_tittel {
  margin-bottom: 46px;
}

.row1_ser {     
  display: grid;  
  grid-template-columns: repeat(4,425PX);      
  margin: auto;
  place-content: center;
  max-width: 1920px;
  gap: 20px;
}
.row1_ser .det1_ser {  
  border: 1px solid #D9D9D9;
   border-radius: 10px;
  height: 400px;
  width: 425px; 
}
.row1_ser .det1_ser {
  width: 425px;
  height: auto;
}
.row_img{
  width: 70px;
  display: flex;
    padding: 30px 16px 10px 26px;
    align-items: start;
}
.row1_ser .det1_ser .row_cont {
   width: 393px;
   margin: auto;
} 
.row1_ser .row_cont p {
  width: 100%;
}
.row_cont h3{
  font-size: 22px;
}
.para{
  height: 104px;
  line-height: 170%;
}
.ser_btn img{
  width: 12px;
}
.ser_btn {
  color: #437EF7;    
  border-radius: 6px;  
  border: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: transparent;
  width: 100px;
  text-align: start;
  padding: 0px;
  font-size: 15px;
}
.ser_btn p{
    color: #437EF7!important;
}
.spl_he{
  margin: auto;
}
@media screen and (max-width:1919px) and (min-width:1600px) {
  .row1_ser {    
    width: 1600px;
    margin: 0 auto;
    justify-content: center;
    align-items: center;    
  }
  .row1_ser .det1_ser {    
    margin: 20px; 
    width: 475px; 
    height: 430px;  
  }
.row1_ser .det1_ser .row_cont{
  width: 450px;

}
.Home_Part1 {
  margin-right: 100px;
}
}
@media screen and (max-width:1919px) and (min-width:1601px) {
  .row1_ser {    
    width: 1600px;
    margin: 0 auto;
    justify-content: center;
    align-items: center;    
  }
  .row1_ser .det1_ser {    
    margin: 10px;
    width: 425px;
    height: auto;
  }
.row1_ser .det1_ser .row_cont{
  width: 375px;

}
.Home_Part1 {
  margin-right: 100px;
}
}
@media screen and (max-width:1800px) and (min-width:1440px) {
  .container_ser1 .container_tittel p {    
    width: 1440px;
    margin: auto;
  }
  .row1_ser {     
    width: 1440px;   
    margin: auto;
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    align-items: center;    
  }  
  .row1_ser .det1_ser  {
    margin: 20px;
  }
  .Home_Part1{
    width: 600px;

  }
  .Home_Part img{
    width: 600px;
  }
}

@media screen and (max-width:1439px) and (min-width:768px) {
  .container_ser1 .container_tittel p {
    width: 768px;
    margin: auto;
  }
  .container_ser1 .row1_ser .row_img {
    object-fit: cover;
  }
  .row1_ser {
    width: 100%;    
    display: grid;
    grid-template-columns: 425px;
    flex-direction: column;
    place-items: center;
  }
  .row1_ser .det1_ser .row_cont {
    width: 644px;
    
  }
  .row1_ser .det1_ser{
    width: 708px;
    margin-bottom: 30px;
  }
  .para{
    height: 100px;
    line-height: 190%;
  }
  .row_img{
    padding: 30px 32px 10px 26px;
  }
  .spl_he{
    margin: 22px 0px 22px 0px;
  }

}
@media screen and (max-width:767px){
  
  .container_ser1 .row1_ser .det1_ser {    
    height: auto;
    width: 343px;    
    margin: auto;
  }
  .container_ser1 .row1_ser .det1_ser .row_cont {        
    width: 299px;
    margin: auto;
  }
  .container_ser1 .row1_ser .det1_ser .para {
    text-align: justify;
    /* width: 90%;  */
    line-height: 150%;
    height: 129px;   
  }
  .row_img{
    padding-top: 30px;
    padding-left: 21px
  }
  .row_cont h3{
    margin-top: 13px;
  }
  .container_ser1 {
    margin-top: 0;
    margin-bottom: 0;
  }
  .container_ser1 .container_tittel p {    
    display: none;
  }
  .container_ser1 .row1_ser {    
    gap: 20px;
    width: 100%;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    flex-wrap: wrap;
  }
}
/* @media only screen and (max-width: 769px) {
  .container_ser1 {
    width: 740px;
    margin: auto;
  }
  .head_banner {
    flex-direction: column;   
  }
  .banner_cont {
    width: 580px;
    height: 180px;
  }
  .banner_img {
    width: 460px;
    margin-left: 200px;


  }
  .row1_ser {    
    display: flex;
    flex-direction: column;
    align-items: center;    
  }
  .det1_ser {
    width: 706px;
    margin-left: 15px;
  }
  .row_img {
    width: 100%;
    height: 100%;
  }
  .row_cont {    
    width: 660px;
    line-height: 24px;
    padding-bottom: 10px;
  }
  .container_tittel {    
    width: 100%;
    
  }
} */
@media only screen and (max-width: 464px) and (min-width: 320px){
  .Home_Part1 h2 {
    width: 315px;
  }
  .Home_Part .Home_Part1 p {
    width: 315px;
  }
  .container_ser1 .row1_ser .det1_ser {    
    width: 315px;
    margin: auto;
  }
}

/* ------------------------------------------------Industries-------------------------------------------------------- */
.Industries{
    background-color: #F5F5F5;
    padding-top: 130px;
}
.Industries h2{
    margin-bottom: 25px;
    /* ----- */
    text-align: center;
    font-size: 36px;
    font-weight: 700;
}
.Industries .IndP1{
    display: flex;
    justify-content: center;
    align-items: center;
}
.Industries .IndP2{
    display: none;
}
.Industries .IndDet{
    width: 753px;
    margin: auto;
    text-align: center;
}
.Industries .IndP1 .IndImg{        
    position: relative;
    height: 1000px;        
    width: 1000px;     
}
.Industries .IndP1 .IndImg img:first-child{    
    position: absolute;    
    top: 10px;
    left: 350px;
}
.Industries .IndP1 .IndImg img:last-child{
    position: absolute;
    top: 450px;
    left: 10px;
}
.Industries_Disc {    
    display: grid;    
}
.Industries_Disc h3{    
    margin-bottom: 10px;
}
.Industries .InduBox {
    display: flex;
    justify-content: center;
    align-items: center;
}
.Industries .InduBox img{
    margin-right: 26px;    
}
.Industries .InduBox p{
   width: 470px;
}

.Industries .InduBox h3 {
    font-size: 24px;
    font-weight: 400;    
    width: 244px;
}



@media screen and (min-width:768px) and (max-width:1439px) {    
    .Industries {        
        width: 100%;
    }
    .Industries .IndDet{
        margin-bottom: 50px;
    }    
    .Industries .IndP1 {
        display: none;
    }
    .Industries .IndP2 {
        width: 100%;
        margin: auto;
        padding-bottom: 130px;
        display: flex;    
        justify-content: center;
        flex-direction: column;
        align-items: center;
    }
    .Industries .IndP2 .IndCont {            
        margin-left: 35px;
        margin-right: 35px;
        display: flex;
        justify-content: space-between ;
        align-items: center;
        margin-bottom: 102px;
        width: 700px;     
    }
    .Industries .IndP2 .IndCont .IndImg {
        width: 266px;
    }
    .Industries .IndP2 .IndCont p {        
        width: 100%;
    }
    .Industries .InduBox {
        width: 300px;
        justify-content: center;
    }
}

@media screen and (min-width:375px) and (max-width:767px) {
    .Industries {
        background-color: white;             
    }
    .Industries h2{        
        text-align: center;
        margin-left: 37px;
    }
    .Industries .IndDet {
        text-align: left;  
        display: none;      
        width: 350px;       
    }
    .Industries .IndP1  .IndImg {
        display: none;
    }
    .Industries .IndP2 .IndCont .IndImg {
        display: none;
    }
    .Industries .IndP2 .IndCont{
        margin-bottom: 0;
    }
    .Industries .Industries_Disc {
        gap: 20px;
    }
    .Industries .Industries_Disc .InduBox p {
        width: 100%;
    }
    .Industries .Industries_Disc .InduBox {
        display: grid;
        width: 345px;
        margin: auto;        
    }
}
@media screen and (max-width:376px){
    .Industries h2 {
        margin-left: 20px;
    }
    .Industries .IndDet{
        margin-left: 20px;
        width: 300px;
    }
}


/* -------------------------------OurSER--------------------------------------------- */

.Skillset {
    margin-top: 93px;
    text-align: center;
}
.SkillsetPara {
    text-align: center;
}
@media screen and (max-width:767px) {
    .SkillsetPara {
        display: none;        
    }
    .Skillset {
        display: none;
    }
}
@media screen and (min-width:768px) {
    .SkillsetPara {
        width: 700px;
        margin: auto;     
    }
}


.Arrow {
    border: 1px solid #A5A5A5;
    border-radius: 50%;
    padding: 1vw;      
    margin: 1vw;
  }
  .OurSER {   
    margin-top: 127px;    
    display: flex;
    justify-content: center;
    align-items: center;  
    margin-bottom: 127px;
    padding: 0 30px 0 30px;    
  }
  .OurSER .SliderOuter {    
    width: 61vw;  
    overflow: hidden;      
    display: flex;
    justify-content: start;
    align-items: center;
  }
  .OurSER .Slider {              
    transition: 0.5s;
    display: flex;  
    justify-content: start;
    align-items: center;
    gap: 2.55vw;      
    width: 170vw;        
  }
  .OurSER .Slider img{ 
    border: 1px solid #C9C9C9; 
    border-radius: 50%;  
    width: 7.5vw;
    padding: 1.25vw;
  }  
  @media screen and (max-width:768px) {
    .OurSER {        
        padding: 0;        
    }
    .OurSER .SliderOuter {          
          width: 63vw;          
    }
    .OurSER .Slider {              
        /* width: 10vw; */
    }
  }
  @media screen and (max-width:767px) {
    .OurCostomer {
        display: none;
      }
      .OurSER {
        display: none;  
      }  
  }
  

/* ---------------------------------------Feedback------------------------------------- */
.FeedBack {           
    margin-top: 191px;
    margin-bottom: 191px;    
}
.FeedBack h2 , .FeedBack .FeedDTL {    
    text-align: center;
}

.FeedBack .FeedDTL  {
    line-height: 26px;
    width: 800px;
    margin: auto;
}
.FeedBack .comments {   
    /* background-color: #437EF7;     */
    display: flex;
    width: 100%;    
    justify-content: center;    
    align-items: center;
    gap: 80px;
    margin: auto;
    margin-top: 36px;
}

.FeedBack .comments .FBox {
    display: flex;
    flex-direction: column;    
    justify-content: space-between;
    align-items: start;
    height: 437px;
    width: 401px;
    /* background-color: #30475E; */
    margin: 10px;
    padding: 22px;
    box-shadow: 5px 5px 8px #0000002a;    
    border-radius: 16px;
}
.FeedBack .comments .FBox p {
    line-height: 170%;
}
.FeedBack .comments .FBox .FeedBox {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 401px;
    margin: 0 auto;
}
.FeedBack .comments .FBox .FeedBox div h4{
    margin: auto;
}
.FeedBack .comments .FBox .FeedBox div p {
    margin: auto;
}
.FeedBack .comments .FBox .FeedBox .Logo {
    width: 130px;
}

@media screen and (min-width:1440px) and (max-width:1600px) { 
    .FeedBack .comments {    
        gap: 0px;            
    }
    .FeedBack .comments .FBox {
        flex-grow: 1;
        width: 390px;
    }
}

@media screen and (min-width:768px ) and (max-width:1439px){
    .FeedBack .FeedDTL {
        width: 100%;
    }
    .FeedBack .comments {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        gap: 50px;
    }

    .FeedBack .comments .FBox {
        height: 349px;        
        width: 617px;
    }
    .FeedBack .comments .FBox .FeedBox  {
        width: 100%;
    }
}

@media screen and (max-width:769px ) {
    .FeedBack {
        margin-top: 10px;
    }
    .FeedBack .comments {        
        gap: 22px;
    }
    .FeedBack .FeedDTL  {
        line-height: 26px;
        width: 100%;        
    }
}

@media screen and (max-width:767px) {   
    .FeedBack h2 {
        width: 343px;
        text-align: left;
        margin: auto;
        margin-bottom: 16px;
    } 
    .FeedBack .comments .FBox {
        width: 343px;        
        height: 437px;
    }
    .FeedBack .FeedDTL {        
        width: 343px;
        text-align: left;        
        margin: auto;        
    }
    .FeedBack .comments {
        display: grid;
        width: 100%;
    }
    .FeedBack .comments .FBox {
        width: 310px;        
        height: 449px;
    }
    .FeedBack .comments .FBox .FeedBox {
        width: 100% ;        
    }
    .FeedBack .comments .FBox .FeedBox .Logo {
        width: 120px;        
    }
    .FeedBack .comments .FBox .FeedBox div {        
        height: 80px;
    }
    .FeedBack .comments .FBox .FeedBox div h4 , .FeedBack .comments .FBox .FeedBox div p {
        height: 50px;        
        display: flex;        
        flex-direction: column;
        justify-content: space-between;
        align-items: start;
        margin: 0;
        padding: 0;
    }
}
/* @media screen and (max-width:376px ) {
    .FeedBack .comments {
        width: 100%;
    }
    .FeedBack .comments .FBox {
        width: 310px;        
        height: 449px;
    }
    .FeedBack .comments .FBox .FeedBox {
        width: 100% ;        
    }
    .FeedBack .comments .FBox .FeedBox .Logo {
        width: 120px;        
    }
    .FeedBack .comments .FBox .FeedBox div {        
        height: 80px;
    }
    .FeedBack .comments .FBox .FeedBox div h4 , .FeedBack .comments .FBox .FeedBox div p {
        height: 50px;        
        display: flex;        
        flex-direction: column;
        justify-content: space-between;
        align-items: start;
        margin: 0;
        padding: 0;
    }

} */


/* .FeedBack {
    background-image: url(./assets/background/Group\ 378.svg);
}
.FeedBack h2{
    margin-top: 200px;
    text-align: center;
}
.FeedBack .FeedDTL{
    text-align: center;
    width: 800px;
    margin: auto;
}
.FeedBack .comments {
    background-color: white;    
    display: flex;
    justify-content: space-between;
    align-items: center ;
    margin: auto;
    width:   1500px;
    margin-top: 36px;
}
.FeedBack .comments p{
    width: 357px;
}
.FeedBack .FBox{    
    height: 437px;
    padding: 25px;
    box-shadow: 0px 0px 5px #8b8a8a;
    border-radius: 10px;
    width: 401px;
}
.FeedBack .FeedBox {        
    width: 401px;           
    bottom: 0%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 100px;   
    margin-bottom: 10px;
}
.FeedBack .FeedBox div{        
    height: 100%;      
    margin-left: 10px;
    font-size: 16px;
    font-weight: 600;
    width:200px;    
    line-height: 1;    
}
.FeedBack .FeedBox div p , .FeedBack .FeedBox div h4 {
    width: 100%;
}
.FeedBack .FeedBox .Logo {
    width: 120px;
}
@media screen and (max-width:1025px) {          
    .FeedBack .FBox{
        margin-bottom: 50px;
        height: 200px;
        padding: 25px;
        box-shadow: 0px 0px 5px #8b8a8a;
        border-radius: 10px;
        width: 90%;
    }     
    .FeedBack .FBox p {
        width: 100%;        
    }
    .FeedBack .comments { 
        display: flex;      
        flex-direction: column  ;
        width: 100%;
    }  
    .FeedBack .FeedBox{        
        width: 900px;        
        margin: auto;
    }  
}
@media screen and (max-width:768px) {    
    .FeedBack {        
    }
    .FeedBack h2{        
        text-align: left;
        margin-left: 30px;
        width: 80%;
    }    
    .FeedBack .FeedBox{             
        width: 617px;        
        margin: auto;
    }  
    .FeedBack .comments {
        z-index: -10;
    }
    .FeedBack .FeedDTL {        
        text-align: left;
        margin-left: 30px;
        width: 90%;                
    }        
    
    .FeedBack .FBox{            
        width: 617px;       
        height: 349px;
    }       
}

@media screen and (max-width:426px){
    .FeedBack {
        margin-top: 66px;
    }
    .FeedBack .FBox {
        width: 343px;
        height: 449px;
    }.FeedBack .FeedDTL {        
        width: 343px;
    }  
    .FeedBack .FeedBox{        
        width: 360px;
        margin: auto;
    }    
}
@media screen and (max-width:376px){
    .FeedBack .FeedDTL {
        text-align: left;
        margin-left: 30px;
        width: 300px;
    }    
    .FeedBack .FBox {
        width: 250px;
        margin: auto;
    }
    .FeedBack .FBox p {
        width: 100%;        
    }
    .FeedBack .comments {        
        grid-gap: 30px;
    }
    .FeedBack .FeedBox {
        width: 100%;
    }
    .FeedBack .FeedBox div h4 {        
        width: 100%;
    }
    .FeedBack .FeedBox .Logo {
        display: none;
    }
} */


/* --------------------------------------Contact Form ----------------------------------- */
.Contact_Form  {
    margin-top: 122px;    
}
.Contact_Form  h2{
    text-align: center;
    font-size: 36px;
    font-weight: 700;
    margin: 50px;
}
.Contact_Form .CForm_All{  
    display: flex;     
    justify-content: space-between;
    align-items: center;
    width: 1665px;
    margin: auto;          
}
.Contact_Form .CForm_All img{
    width: 716px;
}
.Contact_Form .Form {
    height: 503px;    
    padding: 32px;
    border: 0.5px solid #DAE0E6;
    border-radius: 10px;
    /* display: grid; */
    display: flex;
    /* grid-gap: 24px; */
    flex-direction: column;
    justify-content: space-between  ;
}
.Contact_Form .Form .PInfo {    
    width: 100%;    
    display: grid;
    grid-template-columns: 1fr 1fr;    
    margin: 20px auto;
    grid-gap:24px; 
    
}
.Contact_Form .Form .PInfo input {
    width: 328px;
    height: 46px;    
    border-radius: 10px;   
    border: 1px solid #DAE0E6;
    padding-left: 16px  ;
    font-family: "Plus Jakarta Sans", sans-serif;
    outline: none;
}
.Contact_Form .Form  textarea {      
    padding: 12px 16px 12px 12px;  
    /* margin-left: 32px; */
    height: 201px;    
    border-radius: 10px;
    border: 0.5px solid #DAE0E6;    
    resize: vertical;
    font-family: "Plus Jakarta Sans", sans-serif;
    outline: none;
}
.Contact_Form .Form .Button {    
    display: flex;    
    justify-content: space-between;
    align-items: center;        
    width: 100%;        
}
.Contact_Form .Form .Button p{    
    width: fit-content;     
}
.Contact_Form .Form .Button .RobotCheck {
    border: 0.5px solid #DAE0E6;
    border-radius: 8px;
    padding: 0 10px 0 10px;
}
.Contact_Form .Form .Button button{
    color: #FFFFFF;
    background-color: #f05454;
    width: 88px;
    height: 46px;
    border: none;
    border-radius: 10px;
}

.RobotCheck {
    border: 1px solid #DAE0E6;
    display: flex;
    height: 46px;
}
.RobotCheck p {    
    margin: auto 0 auto 10px;       
}
.RobotCheck input {
    margin: auto;
    height: 20px;
    width: 20px;    
}

@media screen and (max-width:1919px) and (min-width:1600px) {    
    .Contact_Form .CForm_All{     
        width: 100%;   
        justify-content: center;
        margin: auto;        
        gap: 20px;
    }
    .Contact_Form .CForm_All img{
        width: 600px;
    }        
}

@media screen and (max-width:1599px) and (min-width:1440px) {    
    .Contact_Form .CForm_All {
        display: flex;
        justify-content: center;
        gap: 20px;
        width: 100%;
    }
    .Contact_Form .CForm_All img{
        width: 500px;
    }
}

@media screen and (min-width:768px) and (max-width:1439px) {    
    .Contact_Form {
        height: auto;
    }
    .Contact_Form .CForm_All {    
        width: 70%;    
        height: auto;
        /* background-color: #437EF7; */

    }
    .Contact_Form .CForm_All .Form {               
        width: 100%;           
    }
    .Contact_Form .CForm_All .Form .PInfo{
        display: flex;        
        width: 100%;
    }
    .Contact_Form .CForm_All .Form textarea{           
        place-items: center;        
        width: 94%;
    }
    .Contact_Form .CForm_All .Form .Button{       
    }
    .Contact_Form .CForm_All .vector1 {
        display: none;
    } 
    .Contact_Form .Form {        
        width: 100%;
        margin: auto;
    }   
    .Contact_Form .Form .PInfo input {                

    }
}
@media screen and (min-width:768px) and (max-width:1023px){
    
    .Contact_Form .CForm_All .Form .PInfo input {
        width: 140px;
    }
    .Contact_Form .CForm_All .Form .PInfo {
        justify-content: space-between;
        width: 100%;        
    }
    .Contact_Form .CForm_All .Form .Button p{
        width: 268px;
    }
    .Contact_Form .CForm_All .Form .Button .RobotCheck {                
        width: 150px;        
    }

}

@media screen and (max-width:767px) {        
    .Contact_Form {        
        width: 100%;           
    }
    .Contact_Form .CForm_All {        
        width: 90%;    
        display: flex;    
        justify-content: center;
        align-items: center;
    }
    .Contact_Form .CForm_All .vector1 {
        display: none;
    }
    .Contact_Form .CForm_All label {
        margin-bottom: 10px;
    }
    .Contact_Form .Form {          
        border: none;
        width: 300px;    
        margin: auto;   
        height: 600px;        
    }
    .Contact_Form .Form .PInfo input {                
        width: 280px;
        margin: auto;
    }
    .Contact_Form .Form .PInfo {      
        width: 100%;          
        display: grid;
        grid-template-columns: 1fr;
    }
    .Contact_Form .Form  textarea {
        height: 100px;
    }
    .Contact_Form .Form .Button {
        width: 300px;        
        display: grid;
        height: 300px;
    }
}
@media screen and (max-width:376px) {
    .Contact_Form .Form {          
        border: none;
        width: 290px;  
        margin: auto; 
        padding: 0px;   
    }
    .Contact_Form .Form .PInfo input {
        margin: auto;
        width: 280px;     
    }
}