* {

}
.input69, select {

 width: 100%;
 padding: 12px;
 border: 1px solid #ccc;
 border-radius: 5px;
 resize: vertical;
 color: #2b0ff6;
 margin-top: 0.5vh; /*form select top chang*/
 box-sizing: border-box;
 /*margin-top: 10px;*/
}
#code
{
  width: 16%;
  color: #2b0ff6;
}
#number
{
  width: 64%;
  color: #2b0ff6;
}
#pword
{
  width: 100%;
  height: 42px;
  border-radius: 5px;
  margin-bottom: 1vh;
  color: #2b0ff6;
}
legend
{
  text-align: center;
  color: white;
  padding-top: 12px ;
  padding-bottom: 5px;
  background-color: rgb(0, 0, 0, 0.4);
  border-radius: 2vh 2vh 2vh 2vh;;
  margin-top: -20px;
}
label
 {
  padding: 12px 12px 12px 0;
  display: inline-block;
  color: white;
  font-size: 18px;
   /*margin-top: 50px;*/
}
.save
{
  background-color: #04AA6D;
  color: white;
  margin: 0.2vh 0vh 0vh 3vh;
  border: none;
  padding: 2.5vh 12vh;
  border-radius: 4px;
  cursor: pointer;
  float: right;
}
input[type=reset] {
  background-color: #04AA6D;
  color: white;
  margin: 0.2vh 0vh 0vh 3vh;
  border: none;
  border-radius: 4px;
  padding: 2.5vh 12vh;
  cursor: pointer;
  float: right;
  margin-right: -0.5%;
}
input[type=reset]:hover {
  background-color: #5390F5;
}
.save:hover {
 background-color: #5390F5;
}
#cotainer_sub1 {
  /*border-radius: 10vh 10vh 10vh 10vh;
  background-color: rgb(0, 0, 0, 0.5);*/
  padding: 15vw;
  
 }
.formcss
 {
  background-color: rgb(0, 0, 0, 0.5);
  border-radius: 5vh 5vh 5vh 5vh;
  padding: 60px;
  margin-top: -15vh;

 }
.col-25 {
  float: left;
  width: 25%;
  margin-top: 6px;
}
.col-75 {
  float: left;
  width: 75%;
  margin-top: 6px;
}
.row:after 
{
  content: "";
  display: table;
  clear: both;
}
@media screen and (max-width: 900px) {
  .col-25, .col-75
  {
    width: 100%;
    margin-bottom: -18px;

  }


   .save , input[type=reset] 
  {
    width: 100%;
    margin-top: 0;
    padding: 15px;

  }
   input[type=reset] 
  {
    width: 100%;
    margin-top: 2%;
    margin-right: 0%;
    
  }
.formcss
  {
    margin-top: -10vh;
    padding: 30px;


  }

}

@media screen and (max-width: 768px) {
  .col-25, .col-75
  {
    width: 100%;
    margin-bottom: -20px;

  }
  legend
  {
    padding-top: 10px ;
    padding-bottom: 20px;
    border-radius: 2vh 2vh 2vh 2vh;;

  }
  .save , input[type=reset] 
  {
    width: 100%;
    margin-top: 0;
    padding: 15px;

  }
   input[type=reset] 
  {
    width: 100%;
    margin-top: 2%;
    margin-right: 0%;
    
  }
.formcss
  {
    margin-top: -8vh;
    padding: 20px;
    /*width: 600px;
    margin-left: ;*/
    
  }
#container2
  {
    height: 150vh;
  }
  label
 {
  padding: 18px 18px 18px 0;
 
  font-size: 18px;
   /*margin-top: 50px;*/
}
}
@media screen and (max-width: 600px) {
  .col-25, .col-75
  {
    width: 100%;
    margin-bottom: -20px;

  }
  legend
  {
    padding-top: 10px ;
    padding-bottom: 20px;
    border-radius: 2vh 2vh 2vh 2vh;;

  }
  .save , input[type=reset] 
  {
    width: 100%;
    margin-top: 0;
    padding: 15px;

  }
   input[type=reset] 
  {
    width: 100%;
    margin-top: 2%;
    margin-right: 0%;
    
  }
.formcss
  {
    margin-top: -5vh;

  }

 
}

@media screen and (max-width: 500px) {
  .formcss
  {

    width: 342px;
    margin-left: -40px;
    margin-top: -2vh;
  }
  }
  @media screen and (max-width: 400px) {
  .formcss
  {

    width: 260px;
    margin-left: -20px;
    margin-top: -2vh;
  }
  }
   @media screen and (max-width: 350px) {
  .formcss
  {

    width: 270px;
    margin-left: -40px;
    margin-top: -2vh;
  }
  }
    @media screen and (max-width: 300px) {
  .formcss
  {

    width: 230px;
    margin-left: -40px;
    margin-top: -2vh;
  }
  }
 @media screen and (max-width: 250px) {
  .formcss
  {

    width: 190px;
    margin-left: -30px;
    margin-top: -2vh;
  }
  }