.signupdiv{
    background-color: rgb(255,255,255);
    border:0px solid pink;
    width:60%;
    height:650px;
 margin: auto;  
    left: 0%;
border-radius: 15px;
position: absolute;
   /* display: none;    */
 visibility: hidden;
 transform: translateY(-400px);
 transition: width 9s;
 transition: all .9s ease-in-out;
 opacity: 0;
 z-index: 100;
}
.signupdiv>h1{
    text-align: center;
    margin-top: 10%;
}
.allfields{
    border:0px solid red;
    width: 80%;
    height:60%;
    display: grid;
    justify-items: center;
    margin-top: 100px;
    margin-left: 90px;
    /* margin: auto; */
}
.allfields>img{
    width:15%;
}
.allfields p{
    font-family: SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
    font-weight: 400;
}
.allfields>div>div>input{
    height:30px;
    width:80%;
     border: none; 
     outline: none;
     font-size: 15px;
     color: #494949;
     font-weight: 500;
     font-family: SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
}
.allfields>div>div{
    border: 1px solid #d2d2d7;
    width:80%;
}
.allfields>div>div>img{
    width: 15%;
}
#inputforid>div{
display: flex;
}
#createnewid,#forgotidps{
border: none;
color: rgb(0,113,227);
background: white;
font-size: .875rem;
}
#createnewid:hover,#forgotidps:hover{
    text-decoration: underline;
    cursor: pointer;
}
.cross{
    border: 2px solid grey;
    width:2%;
    position: absolute;
    top:2%;
    left: 2%;
}
.cross:hover,#cross1:hover{
    cursor: pointer;
}
#showshow{
    /* display: block;  */
    visibility: visible;
  z-index: 200;
  opacity: 5;
  left: 20%;
  /* margin-left: 400px;  */
 transform: translateX(400px);
transform: translateY(0px);
z-index: 100;
 
}
#cross1{
    border: 0px solid grey;
    width:2%;
    position: absolute;
  top:2%;
  left: 2%;
}
.continuepart2{
    width:40%;
    background-color:rgb(0,113,227);
    height: 50px;
    border-radius: 10px;
    color: white;
}
.img1{
    width:10%;
    margin-bottom: 0px;
    border: 0px solid black;
}
.img2{
    margin-bottom: -15px;
    
}
.allfields1{
    border:0px solid red;
    width: 80%;
    height:80%;
    display: grid;
    justify-items: center;
    margin-top: 70px;
    margin-left: 90px;
    /* margin: auto; */
}
.level2p{
    margin-top: 0px;
    font-size:15px;
    width:70%;
    text-align: center;
    color: grey;
    font-family: SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
    font-weight: 600;
}
/* h2{
    margin-top:-15px  ;
    margin-bottom:0px  ;border: 0px solid black;
} */
.divlastupper{
    margin: auto;
    margin-top: 1%;
    border:0px solid red;
    width:90%;
   display: flex; 
justify-content:space-between;
}
.imgpart3cross,.imgpart3apple{
width:3%;
border:0px solid black;
cursor: pointer;
}
.formdiv{
    margin: auto;
    border:0px solid red;
    width:70%;
}
#name,#email,#username,#password,#mobile,#description{
    border: 1px solid #d2d2d7;
    margin: auto;
    width:90%;
    height:40px;
    margin: 0px 5%;
    margin-bottom: 15px;
    border-radius: 10px ;
    font-size: 17px;
    font-family: SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
}
::placeholder{
    color: grey;
    font-family: SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
    font-weight: 350;
    font-size: larger;
    padding: 30px;
}
#checkbox{
    margin-left: 5%;
    width: 20px;
    height: 20px;
}
.label{
    margin-left: 20px;
    font-size: larger;
    font-family: SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
    font-weight: 600;
}
.lastline{
    margin: auto;
   margin-top: 20px;
    width:70%;
    font-family: SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
    font-size: smaller;
}
.lastbuttondiv{
    margin: auto;
    margin-top: 10px;
    width: 80%;
    border: 0px solid pink;
    padding: 10px;
    display: grid;
    justify-content: flex-end;
    align-items: flex-end; 
}
button{
    border: none;
}
.lastbutton{
    padding: 10px;
    color: white;
    background-color: rgb(0,113,227);
    border-radius: 7px;
    cursor: pointer;
    border:none;
}
.nowcansignin{
    margin: auto;
    margin-top: 10%;
    margin-left: 40%;
    text-align: center;
    padding: 6px;
    color: white;
    background-color: rgb(0,113,227);
    border-radius: 7px;
    cursor: pointer;
    border:none;
}