@charset "utf-8";
/* CSS Document for only the Signup presentation */

#user{
   width: 65%;
}


#signup_form_element_table{
   width: 65%;
}

#signup_label{
   color:#006633;
   font-weight:bold;
}

#signup_label:hover{
   cursor: pointer;
}

#signup_div{
   position: fixed;
   top: 0em;
   width: 100%;
   height: 100%;
   margin-left:auto;
   margin-right:auto;
   padding: 0px;
   z-index: 12000 !important;
   left:0px;
   right:0px;	
   display:none;
   transition: 0.8s;
   background-color: rgb(0,0,0);
   background-color: rgba(0,0,0, 0.4);
}

.closebtn{
   font-size: 40px;
   top: 15px;
   float: right;
   margin-top: 10px;
   margin-right: 10px;
   padding-left: auto;
   padding-right: auto;
   text-decoration:none;
   color:#FFFFFF;
   font-weight:bolder;
   border: solid;
   border-color:#FFFFFF;
   border-radius: 5em;
}

.closebtn:hover{
   background: rgba(33,33, 33, 0.8);
   cursor:pointer;
}

#form_label{
   font-size:18px;
   color:#006633;
   font-weight:bold;
}

#gender_div{
   text-align: center;
}


#warning_message{
   color: #FF0000;
   display: none;
}

#signup_category{
   width: 100%;
}

.padded_table_cell{
   padding-left: 0%;
 }
 
#category_label, #date_of_birth_label,
#gender_label, #upload_photo_label{
   margin-left:0%;
}


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

   #user{
      width: 100%;
   }

   #signup_form_element_table{
      width:90%;
      font-size:56px;
   }   
   
   #signup_label{
      font-size: 90px;
   }
   
   #category_label, #date_of_birth_label,
   #gender_label, #upload_photo_label{
       width:80%;
       font-size:65px;
   }
   
   .padded_table_cell{
       padding-left: 10%;
   }
   
   #signup_category, #signup_first_name, 
   #signup_last_name, #signup_other_names,
   #signup_date_of_birth, #signup_gender,
   #signup_status, #signup_username,
   #signup_email, #signup_password,
   #signup_retype_password, #signup_privilege,
   #signup_telephone, #signup_mobile,
   #national_id_number, #signup_gender_label, 
   #signup_date_of_birth_label, #signup_category_label, 
   #signup_photo_label{
       width:80%;
       margin:0% 10% 0% 10%;
       height: 90px;
       font-size:65px;
       padding-bottom: 80px; 
       border: 2px;
       border-color: #333333;  
   }
   
   #signup_submit_button{
       height: 180px;
       font-size:65px;
   }
   
}