body {

    overflow-y: hidden; 
     overflow-x: hidden;
   }


   #verificationid{
    overflow-y: visible; 
     overflow-x: visible;
   }
   
   
   #edumessblue{
           width:15%;
           margin-top:2%;
       }
       
       #edumessbluesignup{
         width:30%;
       margin-top:4%;  
       }
       
   
       #contentlogin {
        width: 45%;
        
        }
    

   .center {
     margin: auto;
     /*width: 90%;*/
     background-color: white;
     padding-bottom: 10px;
      padding-top: 10px;
     box-shadow:0 2px 5px 0 #D3D3D3, 0 3px 11px 0 #D3D3D3;
     margin-top:6%;
     border-radius:5px;
     
   }
   .progress-bar {
        border-radius: 8px;
        margin-top: 10px;
        height:12px;
       
        
      }

   #contentverication {
    width: 45%;

    } 

    .centerverification {
        margin: auto;
        width: 59%;
        background-color: #F1F5F9;
        padding-bottom: 14px;
         padding-top: 50px;
        /*display: flex;*/
      }
   
      
     
      
   .centerlogin {
    margin: auto;
    width: 80%;
    background-color: white;
    padding-bottom: 14px;
    padding-top: 14px;
    box-shadow:0 2px 5px 0 #D3D3D3, 0 3px 11px 0 #D3D3D3;
    margin-top:8%;
    border-radius:9px;
  }
  
  
  .centerloginpassword {
    margin: auto;
    width: 100%;
    background-color: white;
    padding-bottom: 14px;
    padding-top: 14px;
    box-shadow:0 2px 5px 0 #D3D3D3, 0 3px 11px 0 #D3D3D3;
    margin-top:8%;
    border-radius:9px;
  }

    
  

  /* centerlogin  */
  
  .centerlogin:hover{
         outline: 2px solid #007ffb;
         
  }
   
   #signup-btn{
      width: 100%; 
   }
   
   #signinbtn{
    width: 80%;    
   }
   
   .usernamecontent {
     /*margin: auto;*/
     /*width: 450%;*/
     background-color: white;
     padding-bottom: 10px;
      padding-top: 10px;
     box-shadow:0 2px 5px 0 #D3D3D3, 0 3px 11px 0 #D3D3D3;
     margin-top:8%;
     border-radius:9px;
     /*display:flex;*/
   }
   
    #backgroundimgs-signup {
        height: 100vh;
    background-repeat: no-repeat;

    border-top-left-radius: 5%;

    }
   
 
    #otpsent{
        font-size:14px;   
        font-weight:550;
       }

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

       body {

            overflow-y: visible; 
             overflow-x: visible;
       }
       #googlegrid{
              width:90%;     
       }
       
       #otpsent{
        font-size:14px;   
        font-weight:550;
       }

    .center {
        margin: auto;
        /*width: 90%;*/
        background-color: white;
        padding-bottom: 10px;
        padding-top: 10px;
        box-shadow:0 2px 5px 0 #D3D3D3, 0 3px 11px 0 #D3D3D3;
        margin-top:6%;
        border-radius:5px;
        
    }

    .centerverification {
        margin: auto;
        width: 90%;
        background-color: #F1F5F9;
         padding-bottom: 14px;
         padding-top: 50px;   
   }

   #contentverication
   {
       width: 90%;
   }

           
    #contentlogin
    {
        width: 90%;
    }
            
    .centerlogin {
        margin: auto;
        width: 80%;
        background-color: white;
        padding-bottom: 14px;
        padding-top: 14px;
        box-shadow:0 2px 5px 0 #D3D3D3, 0 3px 11px 0 #D3D3D3;
        margin-top:10%;
        border-radius:9px;
        
    }
    
    
    
  .centerloginpassword {
    margin: auto;
    width: 100%;
    background-color: white;
    padding-bottom: 14px;
    padding-top: 14px;
    box-shadow:0 2px 5px 0 #D3D3D3, 0 3px 11px 0 #D3D3D3;
    margin-top:10%;
    border-radius:9px;
  }
       
        
    #backgroundimgs-signup{
        background-image: none;   
    }
      
      
      
           
        .prosdisplayhide-forgetpass{
            display: none;   
        }
       
      
       .usernamecontent {
            display:flex;
            box-shadow:0 2px 5px 0 #D3D3D3, 0 3px 11px 0 #D3D3D3;
            margin-top:8%;
            border-radius:9px;
            margin: auto;
            width: 90%;
            background-color: white;
            padding-bottom: 10px;
            padding-top: 10px;
        
        
        
        
        }
        
           #edumessblue{
            width:30%;
            margin-top:9%;
           }
       
       #verificatitle{
           font-size:19px;
       }
       
         #signin{
           font-size:14px;    
          }
          
       #edumessbluesignup{
         width:30%;
         margin-top:7%;  
       }
       
   }
   
  
       input{
        
          width: 80%; 
          border: none;
       }
       
       input:focus{
        
          width: 80%; 
          outline: none;
       
       }


       
       input[id=signinemail]{
             
        width: 80%; 
        border:none;
     
     }
     
      input[id=signinpassword]{
      
        width: 80%; 
        border:none;
     
     }
     
   
   input[id=signinemail]:focus{
     width: 80%; 
      outline: none;
    

   }
   input[id=signinpassword]:focus{
     width: 80%; 
      outline: none;
    

   }

/* verification content */



   .pasteitems:focus{
    outline: none;
    font-size:29px;
    font-weight:bold;
    
     top: -20px;

  }
  
  .pasteitems {
     
     font-size:29px;
    font-weight:bold;
    text-align: center;
    
    }
    
     .numberarrow::-webkit-outer-spin-button,
    .numberarrow::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
    } 


     .numberarrow{
        -moz-appearance:textfield;
    } 
  /* verification content */