input[type=text], input[type=password], input[type=number], select
{
  background: #fff;
  border: 1px solid #c0c0c0;
  color: #000;
  font-size: 12px;
  display: block;
  text-align: justify;
  width: 100%;
  padding: 3px 0px 3px 3px;
}
#gateinput
{
  padding: 10px 15px;
  border-radius: 8px;
  width: 100%;
  margin: 5px auto;
}
input[type=button], input[type=submit], input[type=reset]
{
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
width: 100%;
color: #fff;
margin: 5px auto 5px auto;
padding: 5px 12px;
border: none;
border-radius: 7px;
cursor: pointer;
text-decoration: none;
display: block;
text-align: center;
font: 14px arial;
}
input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover
{
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
label
{
 font-weight: bold;
}


#btnnext { background: #4285f4; } #btnnext:hover { background: #649ef2; }
#btnsave { background: #22aa5d; } #btnsave:hover { background: #1c8849; }
#btncancel { background: #f43a35; } #btncancel:hover { background: #ec1313; }
#btnfinish { background: #ec920a; } #btnfinish:hover { background: #ddb579; }
#btnstart { background: #e52c5c; } #btnstart:hover { background: #dd8099; }

#gatecode
{
    background: #fff;
    border: 1px solid #c0c0c0;
    color: #000;
    font-size: 16px;
    border-radius: 22px;
    display: block;
    margin: 5px auto;
    padding: 10px 10px;
    text-align: center;
    width: 100%;
    text-transform: uppercase;
    letter-spacing: 5px;  
}
#btnsavesm
{
background: #22aa5d;
width: 70px;
display: inline-block;
margin: 5px auto 5px auto;
padding: 5px 5px;
font: 12px arial;
}
#btnsavesm:hover
{
background: #1c8849;
width: 70px;
display: inline-block;
margin: 5px auto 5px auto;
padding: 5px 5px;
font: 12px arial;
}
textarea
{
background: #fff;
border: 1px solid #c0c0c0;
color: #3b00ab;
font-size: 12px;
border-radius: 8px;
display: block;
margin: 5px auto;
padding: 10px 10px;
text-align: justify;
width: 100%;
height: 80px;
resize: none;
}


 /*collapsible */

 .collapsible {
    padding: 10px;
    width: 100%;
    border: none;
    text-align: center;
    outline: none;
    font-size: 15px;
    background-color: transparent;
  }
  .active, .collapsible:hover
  {
    cursor: pointer;
  }
  
  .badgetextcontent {
    padding: 0px 5px;
    display: none;
    overflow: hidden;
    background-color: #f1f1f1;
    transition: max-height 0.2s ease-out;
  }
  .modal-button
  {

    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 100px;
    color: #fff;
    margin: 2px 5px;
    padding: 5px 5px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    display:inline-block;
    text-decoration: none;
    text-align: center;
    font: 12px arial; 
  }


    #btnnext {background-color: #248ec9;}
    #btnsave {background-color:#37bb5a;}
    #btncancel {background-color: #e52c5c;}