signup.css

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
.outbox{
    height:100vh;
    width: 100vw;
    border: 10px;
    border-color: black;
    background: linear-gradient(to top left,rgb(144, 136, 233),white);
}
.ele{
    /* text-align: center; */
    margin:10px 0;
}

.inbox{
    
    width:370px;
    /* background-color: #ffffff09; */
    background: linear-gradient(to top left,white,rgba(255, 255, 255, 0.011));
    margin: 0 auto;
    padding: 40px 100px;
    position: relative;
    top:20vh;
    border-radius: 5px;
    box-shadow: 2px 2px  rgb(110, 110, 134) ;
    z-index: 2;

     backdrop-filter: blur(2px); 
}
.header h1{
    padding-left :30px; 
    padding-bottom: 5px;
    font-size: 2em;
    color: rgb(27, 26, 26);

}
.main  p input{
    width: 300px;
    height: 40px;
    border-radius: 5px;
    border-color: rgb(217, 215, 215);
    box-sizing: border-box;
    position: relative;
    left:-60px;

}
.main p label{
    box-sizing: border-box;
    position: relative;
    left:-60px;
    display: block;
    font-weight: bold;
}

.main p {
   margin:10px auto;
}
#signin{
       background-color: rgb(114, 114, 232);
       border-style: none;
       color: azure;
}
footer p{
    display: block;
      /* position: absolute; */ 
      text-align: center;
      
}
#signin:hover{
  cursor: pointer;
  background-color: rgb(103, 103, 237);
}
.circle{
    height: 200px;
    width: 200px;
    border-radius: 100px;
    background: linear-gradient(to top right,#ffffff11,white);
}
#c1{
    position: absolute;
    top: 100px;
     left:20px;
}
#c2{
    position: absolute;
    bottom: 100px;
     right:20px;
}