/* LOGO SLIDES STYLES STARTS HERE */

            .company-logo-slides{
               
                position: relative;
                background-color: rgb(219, 218, 210);
                width: 90%;
                max-width: 1536px;
                margin-inline: auto;
                height: 100px;
                margin-top: 22px;
                overflow: hidden;
                 mask-image: linear-gradient(
                    to right,
                    rgba(224, 234, 37, 0)5%,
                    rgba(0,0,0,1) ,
                    rgba(0,0,0,0) 95%,
                    rgba(0,0,0,0)
                    ); 
               
            }


            .logo{
               
                position: absolute;
               width: 200px;
               height: 100px;
               left: 100%;
               animation-name: scrollleft;
               animation-duration: 20s;
               animation-timing-function: linear;
               animation-iteration-count: infinite;


            }

            @keyframes scrollleft{
                to{
                    left: -200px;
                }
            }


             .logo1{
                animation-delay: calc(20s / 4 * (4 - 1) * -1);
                
                }
                .logo2{
                animation-delay: calc(20s / 4 * (4 - 2) * -1);
                }
                .logo3{
                animation-delay: calc(20s / 4 * (4 - 3) * -1);
                }
                .logo4{
                animation-delay: calc(20s / 4 * (4 - 4) * -1);
                }
                

                         
        /* LOADER */

          .submit{
            position: relative;
        }

    #loader{
        position: absolute;
        display: none;
        top: 50%;
        left: 87%;
        transform: translate(-50% , -50%);
        
    }

    .loader{
        
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        background:transparent;
        z-index: 999;

    }

    .spinner{
        border: 3px solid #d2cfcf;
        border-top: 3px solid rgb(61, 56, 55);
        border-radius: 50%;
        width: 20px;
        height: 20px;
        animation: spin 4s linear infinite;
    
    }


    @keyframes spin{
        to{
            transform: rotate(360deg);
        }
    
    }