.myDivs{
	display:none;
}  



.img-left{
float:left;
height:200px;
margin-top:10px;
border:dashed 0px #FF0000;
}

.img-right{
float: right;
margin-top:10px;
border:dashed 0px #FF0000;
}

.clear{clear:both;}


.con-sub-form{
margin-bottom:10px;
border:dashed 0px #FF0000;
}

.sub-form-left{
float:left;
border:dashed 0px #FF0000;
overflow:hidden;
}


.sub-form-titik{
float:left;
border:dashed 0px #FF0000;
text-align:center;
}

.sub-form-rig{
float:left;
border:dashed 0px #FF0000;
text-align:left;
}


.sub-form-leftAa{
float:left;
width:20%;
margin-top:10px;
border:dashed 0px #FF0000;
overflow:hidden;
}


.sub-form-rigAa{
float:left;
width:80%;
border:dashed 0px #FF0000;
text-align:left;
}



.con-sub-form2{
margin-bottom:10px;
border:dashed 0px #FF0000;
position:relative;
}


.sub-form-left2{
float:left;
width:15%;
border:dashed 0px #FF0000;
margin-top:20px;

}

.sub-form-left3{
float:left;
width:13%;
border:dashed 0px #FF0000;

}


.sub-form-rig2{
float:left;
width:80%;
border:dashed 0px #FF0000;
position:relative;
}





/* LOGOUT */

.con-sub-form-log{
margin-bottom:10px;
border:dashed 0px #FF0000;
}

.sub-form-left-log{
float: left;
text-align:right;
width:45%;
border:dashed 0px #FF0000;
overflow:hidden;
}

.sub-form-right-log{
float: right;
width:45%;
border:dashed 0px #FF0000;
text-align:left;
}
/* LOGOUT */



.user-back{
top:0;
height:60px;
background:#337ab7;
box-shadow:1px 4px 0px 0px rgba(229,229,229,1.00);
right:0;
z-index:9999;
border:0px dashed #FF0000;
}



.hb-helo-xx{
display:flex;
flex-wrap:wrap;
justify-content:flex-start;
align-content:center;
align-items:center;
margin-top:8px;
border:0px dashed #FF0000;
}


.img-user{
border-radius:100%;
background:#E1E1E1;
padding:2px;
display: block;
margin-left: auto;
margin-right: auto;
cursor:pointer;
}





.info{
width:80%;
margin-top:100px;
margin-left:auto;
margin-right:auto;
padding:30px;
background:#FFFFFF;
text-align:center;
display:none;
font-weight:bold;
font-size:30px;
}
.red{color:rgba(245,52,56,1.00);}
.green{color:#05C734;}

.blue{
color:#0898BC;
font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
font-size:14px;
}


/*----------------------*/
.pure-radiobuttonX {
float:left;
margin-right:20px;
margin-bottom:0;
margin-top:0;
border:0px dashed #FF0000;
position:relative;
min-height:60px;
}

.pure-radiobuttonX input[type="radio"] {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: 20px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  border:1px dashed #FF0000;
  
}
.pure-radiobuttonX input[type="radio"]:focus + label:before,
.pure-radiobuttonX input[type="radio"]:hover + label:before {
  border-color: #4f8196;
  background-color: #f2f2f2;
}
.pure-radiobuttonX input[type="radio"]:active + label:before {
  transition-duration: 0s;
}
.pure-radiobuttonX input[type="radio"] + label {
  display: flex;
  align-items: center; 
  position: relative;
  padding-left: 70px; 
  user-select: none;
  cursor: pointer;
  border: 0px dashed #FF0000;
  height: 60px;
}

.pure-radiobuttonX input[type="radio"] + label:before {
  box-sizing: content-box;
  content: '';
  color: rgba(17,91,132,1.00);
  position: absolute;
  top: 0;
  left: 0;
  width: 50px;
  height: 50px;
  margin-top: 0px;
  border: 2px solid rgba(17,91,132,1.00);
  text-align: center;
  transition: all 0.4s ease;
}
.pure-radiobuttonX input[type="radio"] + label:after {
  box-sizing: content-box;
  content: '';
  background:rgba(17,91,132,1.00);
  position: absolute;
  top: 0;
  left: 0;
  width: 54px;
  height: 54px;
  margin-top:0;
  transform: scale(0);
  transform-origin: 50%;
  transition: transform 200ms ease-out;
}
.pure-radiobuttonX input[type="radio"]:disabled + label:before {
  border-color: #cccccc;
}
.pure-radiobuttonX input[type="radio"]:disabled:focus + label:before,
.pure-radiobuttonX input[type="radio"]:disabled:hover + label:before {
  background-color: inherit;
}
.pure-radiobuttonX input[type="radio"]:disabled:checked + label:before {
  background-color: #cccccc;
}

.pure-radiobuttonX input[type="radio"]:checked + label:before {
  animation: borderscale 300ms ease-in;
  background-color: white;
}
.pure-radiobuttonX input[type="radio"]:checked + label:after {
  transform: scale(1);
}




