body, html {
    height: 100%;
    text-align:center;
}
body, td, div, li, select, option, input, textarea
{
	font-size: 14pt;
	onFocus: this.blur();
    font-family:Verdana, Geneva, Tahoma, sans-serif;
	margin: 0px;
    padding:0px;
}

/* do not group these rules */
*::-webkit-input-placeholder {
    color:gray;
}
*:-moz-placeholder {
    /* FF 4-18 */
    color:gray;
}
*::-moz-placeholder {
    /* FF 19+ */
    color:gray;
}
*:-ms-input-placeholder {
    /* IE 10+ */
    color:gray;
}

input[type=radio]{
    zoom:2;
}

input[type="checkbox"]:checked + label::after {
   content: '';
   position: absolute;
   width: 1.2ex;
   height: 0.4ex;
   background: rgba(0, 0, 0, 0);
   top: 15px;
   left: 14px;
   border: 3px solid blue;
   border-top: none;
   border-right: none;
   -webkit-transform: rotate(-45deg);
   -moz-transform: rotate(-45deg);
   -o-transform: rotate(-45deg);
   -ms-transform: rotate(-45deg);
   transform: rotate(-45deg);
}
input[type="checkbox"] {
    position: absolute;
    left: -999em;
}
input[type="checkbox"] + label {
    position: relative;
    color:gray;
    cursor: pointer;
}
input[type="checkbox"]:checked + label {
    color:black;
}
input[type="checkbox"] + label::before {
   content: "";
   display: inline-block;
   vertical-align: -25%;
   height: 2ex;
   width: 2ex;
   background-color: white;
   border: 1px solid rgb(166, 166, 166);
   border-radius: 4px;
   box-shadow: inset 0 2px 5px rgba(0,0,0,0.25);
   margin-right: 0.5em;
}

input[type=text], select, option{
    padding: 5px 5px 5px 5px;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
}
label{
    padding: 6px 10px;
    display: inline-block;
    box-sizing: border-box;
}

input[type="text"] + label {
    position: absolute;
    top: 8px;
    left: 8px;
    bottom: 0;
    height: 35px;
    color:black;
    line-height: 35px;
    border-radius: 3px 0 0 3px;
    padding: 0 20px;
    background: #55eb44;
    transform: translateZ(0) translateX(0);
    transition: all 0.3s ease-in;
    transition-delay: 0.2s;
    border:solid;
    border-width:1px;
}
.verticalLine {
    margin-left: 40px;
    padding-left: 40px;
    height: 35px;
    line-height: 35px;
    color: black;
    border-radius: 3px 0 0 3px;
    padding: 0 20px;
    background: #55eb44;
    transform: translateZ(0) translateX(0);
    transition: all 0.3s ease-in;
    transition-delay: 0.2s;
    border:solid;
    border-width:1px;
}
.timeLabel {
    top:1px;
    position:relative;
    padding-left: 40px;
    height: 35px;
    line-height: 35px;
    color: black;
    border-radius: 3px 0 0 3px;
    padding: 0 20px;
    background: #55eb44;
    transform: translateZ(0) translateX(0);
    transition: all 0.3s ease-in;
    transition-delay: 0.2s;
    border:solid;
    border-width:1px;
}
input[type="text"]:focus + label {
    transform: translateY(-120%) translateX(0%);
    border-radius: 3px;
    transition: all 0.1s ease-out;
}
input[type="text"]:focus {
    padding: 5px;
    transition: all 0.3s ease-out;
    transition-delay: 0.2s;
}

#logo{
    position:relative;
    top:20px;
}

table {
    border-collapse: collapse;
    border-style: solid;
    border-color: dimgrey;
    border-width: 1px;
    margin-left: auto;
    margin-right: auto;
    position:relative;
    width:1200px;
}

table #signIn td{
    padding:10px;
}
table #divide_facility td{
    padding:10px;
    text-align:center;
    background-color:#dce8f6;
}
table #divide_patient td{
    padding:10px;
    text-align:center;
    background-color:#dff3ca;
}
table #divide_trip td{
    padding:10px;
    text-align:center;
    background-color:#f8e9c4;
}

table .facility_info{
    background-color:#dce8f6;
}

table .patient_info{
    background-color:#dff3ca;
}
    table .patient_info #sex {
        margin-left:100px;
        position:relative;
    }

table .trip_info{
    background-color:#f8e9c4;
}

table tr td {
    border-collapse: collapse;
    border-style: solid;
    border-color: dimgrey;
    border-width: 1px;
    padding:8px;
    position:relative;
    text-align:left;
}

#cbx_isOpen{
    position:relative;
}

#send_func{
    position:relative;
    top:10px;
    text-align:center;
    margin-bottom:50px;
}
#send_func img{
    display:block;
    margin-left:auto;
    margin-right:auto;
    display:none;
}

.button {
    display: block;
    border-radius: 4px;
    background-color: #2cbf45;
    border: none;
    color: black;
    font-weight: bold;
    text-align: center;
    font-size: 32px;
    padding: 16px;
    width: 1100px;
    transition: all 0.5s;
    cursor: pointer;
    margin: 5px;
    margin-left: auto;
    margin-right: auto;
    outline: none;
}
    .button span {
        cursor: pointer;
        display: inline-block;
        position: relative;
        transition: 0.5s;
    }
        .button span:after {
            content: '\00bb';
            position: absolute;
            opacity: 0;
            top: 0;
            right: -20px;
            transition: 0.5s;
        }
    .button:hover span {
        padding-right: 25px;
    }
        .button:hover span:after {
            opacity: 1;
            right: 0;
        }
    .button:active {
        background-color: red;
        font-size: 40px;
    }

#los{
    margin-left:20px;
}

.time_divide{
    margin-left:-7px;
    margin-right:-7px;
}

/*-------------------------------------------------------------------------------------------- moving label start*/
#tbx_member_signin{
    padding: 5px 5px 5px 150px;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    width:600px;
    margin-left:31px;
}
#tbx_member_signin + label{
    left:524px;
    top:10px;
}
#tbx_member_signin:focus {
    padding: 5px;
}

#tbx_facility_name{
    padding: 5px 5px 5px 180px;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    width:600px;
}
#tbx_facility_name + label{
    left:8px;
    top:8px;
}
#tbx_facility_name:focus {
    padding: 5px;
}

#tbx_facility_phone{
    padding: 5px 5px 5px 130px;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    width:400px;
}
#tbx_facility_phone + label{
    left:615px;
    top:8px;
}
#tbx_facility_phone:focus {
    padding: 5px;
}

#tbx_facility_address{
    padding: 5px 5px 5px 200px;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    width:1100px;
}
#tbx_facility_address + label{
    left:8px;
    top:8px;
}
#tbx_facility_address:focus {
    padding: 5px;
}

#tbx_patient_Firstname{
    padding: 5px 5px 5px 150px;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    width:500px;
}
#tbx_patient_Firstname + label{
    left:8px;
    top:8px;
}
#tbx_patient_Firstname:focus {
    padding: 5px;
}

#tbx_patient_Lastname{
    padding: 5px 5px 5px 150px;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    width:500px;
}
#tbx_patient_Lastname + label{
    left:515px;
    top:8px;
}
#tbx_patient_Lastname:focus {
    padding: 5px;
}

#tbx_patient_DOB{
    padding: 5px 5px 5px 90px;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    width:250px;
}
#tbx_patient_DOB + label{
    left:8px;
    top:8px;
}
#tbx_patient_DOB:focus {
    padding: 5px;
}

#tbx_room{
    padding: 5px 5px 5px 125px;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    width:300px;
    margin-left:80px;
    position:relative;
}
#tbx_room + label{
    left:345px;
    top:8px;
}
#tbx_room:focus {
    padding: 5px;
}

#tbx_visitto{
    padding: 5px 5px 5px 195px;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    width:1100px;
}
#tbx_visitto + label{
    left:8px;
    top:8px;
}
#tbx_visitto:focus {
    padding: 5px;
}

#tbx_visit_address{
    padding: 5px 5px 5px 195px;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    width:1100px;
}
#tbx_visit_address + label{
    left:8px;
    top:8px;
}
#tbx_visit_address:focus {
    padding: 5px;
}

#tbx_visit_phone{
    padding: 5px 5px 5px 125px;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    width:400px;
}
#tbx_visit_phone + label{
    left:8px;
    top:8px;
}
#tbx_visit_phone:focus {
    padding: 5px;
}

#tbx_visit_room{
    padding: 5px 5px 5px 365px;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    width:600px;
}
#tbx_visit_room + label{
    left:415px;
    top:8px;
}
#tbx_visit_room:focus {
    padding: 5px;
}

#tbx_date_app{
    padding: 5px 5px 5px 245px;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    width:400px;
}
#tbx_date_app + label{
    left:8px;
    top:8px;
}
#tbx_date_app:focus {
    padding: 5px;
}

#tbx_return_date{
    padding: 5px 5px 5px 165px;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    width:300px;
}
#tbx_return_date + label{
    left:240px;
    top:8px;
}
#tbx_return_date:focus {
    padding: 5px;
}


#tbx_comment{
    padding: 5px 5px 5px 170px;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    width:1100px;
}
#tbx_comment + label{
    left:8px;
    top:8px;
}
#tbx_comment:focus {
    padding: 5px;
}

#tbx_requestBy{
    padding: 5px 5px 5px 180px;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    width:500px;
}
#tbx_requestBy + label{
    left:8px;
    top:8px;
}
#tbx_requestBy:focus {
    padding: 5px;
}

#tbx_email{
    padding: 5px 5px 5px 100px;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    width:500px;
}
#tbx_email + label{
    left:515px;
    top:8px;
}
#tbx_email:focus {
    padding: 5px;
}
/*-------------------------------------------------------------------------------------------- moving label end*/
/*-------------------------------------------------------------------------------------------- radio button start*/
.inline{
  display: inline-block;
}
.inline + .inline{
  margin-left:-10px;
}
.radio{
  color:black;
  font-size:24px;
  position:relative;
  margin-top:-6px;
  top:2px;
}
.radio + .radio{
    position:relative;
    margin-left:-15px;
    margin-right:-25px;
}
.radio span{
  position:relative;
   padding-left:20px;
}
.radio span:after{
  content:'';
  width:23px;
  height:23px;
  border:3px solid;
  position:absolute;
  left:-5px;
  top:4px;
  border-radius:100%;
  -ms-border-radius:100%;
  -moz-border-radius:100%;
  -webkit-border-radius:100%;
  box-sizing:border-box;
  -ms-box-sizing:border-box;
  -moz-box-sizing:border-box;
  -webkit-box-sizing:border-box;
}
.radio input[type="radio"]{
   cursor: pointer; 
  position:absolute;
  width:100%;
  height:100%;
  z-index: 1;
  opacity: 0;
  filter: alpha(opacity=0);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"
}
.radio input[type="radio"]:checked + span{
  color:#d307af;  
}
.radio input[type="radio"]:checked + span:before{
    content:'';
  width:11px;
  height:11px;
  position:absolute;
  background:#d307af;
  left:1px;
  top:10px;
  border-radius:100%;
  -ms-border-radius:100%;
}
/*-------------------------------------------------------------------------------------------- radio button end*/