/* 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(236, 43, 8);
            border-radius: 50%;
            width: 20px;
            height: 20px;
            animation: spin 1s linear infinite;
        
        }

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