#sign-in-page1{
    width: 100%;
    height: 100vh;
   
    background-color: #3d4c74;
    position: relative;
   

    .sign-in-form{
        position: absolute;
        top: 50%;
        left:50%;
        transform: translateX(-50%) translateY(-50%);  
        form{
           
            width: 400px;

            .title101{
                color: #fff;
                text-transform: uppercase;
                font-weight: 700;
                text-shadow: 1px 2px 1px rgba($color: #000000, $alpha: 0.2);
                margin-bottom: 1rem;
                border-bottom: 1px solid #1161ee;
                width: fit-content;
            }

            .form-group{
                label{
                    color: #eee;
                    text-transform: uppercase;
                }
                input{
                    border-radius: 30px;
                    background-color: rgba($color: #000000, $alpha: 0.2);
                    border: none;
                    height: 40px;
                    color: #fff;
                    &:focus{
                        box-shadow: none;
                    }
              
                }
            }
            #custom-checkbox1{
                margin-bottom: 1rem;
                .custom-checkbox{
                    label{
                        color: #fff;
                        font-weight: 500;
                    }
                }
            }

            button{
                width: 100%;
                background-color: #1161ee;
                color: #fff;
                border: none;
                text-transform: uppercase;
                font-size: 14px;
                height: 40px;
                margin-bottom: 1rem;
                box-shadow: none;
               outline: none;
                border-radius: 30px;
                &:hover{
                    background-color: lighten(#1161ee,10);
                }
                &:focus{
                    box-shadow: none;
                }
            }
            .forgot-pass-btn{
                float: right;
                color: #eee;
                text-decoration: none;
                &:hover{
                    color: #fff;
                }
            }
           
        }
        

    }
}

@media (max-width:576px){
    #sign-in-page1{
        width: 100%;
        height: 100vh;
       
        background-color: #3d4c74;
        position: relative;
       
    
        .sign-in-form{
            position: absolute;
            top: 50%;
            left:50%;
            transform: translateX(-50%) translateY(-50%);  
            form{
               
                width: 300px;
    
                .title101{
                    color: #fff;
                    text-transform: uppercase;
                    font-weight: 700;
                    text-shadow: 1px 2px 1px rgba($color: #000000, $alpha: 0.2);
                    margin-bottom: 1rem;
                    border-bottom: 1px solid #1161ee;
                    width: fit-content;
                }
    
                .form-group{
                    label{
                        color: #eee;
                        text-transform: uppercase;
                    }
                    input{
                        border-radius: 30px;
                        background-color: rgba($color: #000000, $alpha: 0.2);
                        border: none;
                        height: 40px;
                        color: #fff;
                        &:focus{
                            box-shadow: none;
                        }
                  
                    }
                }
                #custom-checkbox1{
                    margin-bottom: 1rem;
                    .custom-checkbox{
                        label{
                            color: #fff;
                            font-weight: 500;
                        }
                    }
                }
    
                button{
                    width: 100%;
                    background-color: #1161ee;
                    color: #fff;
                    border: none;
                    text-transform: uppercase;
                    font-size: 14px;
                    height: 40px;
                   
                    border-radius: 30px;
                    &:hover{
                        background-color: lighten(#1161ee,10);
                    }
                }
               
            }
            
    
        }
    }

}