#overlay {
  position: fixed; /* Sit on top of the page content */
  display: none; /* Hidden by default */
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.5); /* Black background with opacity */
  z-index: 10; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
}

.orange{
  background-color : #0293df !important;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(10%, #0293df), to(#0293df));
  background-image: linear-gradient(180deg, #0293df 10%, #0293df 100%);
  background-size: cover;
}

.orange .card{
  background-color : rgba(255, 255, 255, 0.2) !important;
  border-radius : 30px;
  height: 75%;
  margin-top:15% !important;
}

.btn-hover:hover{
  background-color: #0275d8;
  padding: 6px 10px 6px 10px;
  color: white;
  border-radius: 4px;
  text-decoration: none;
}

.keahlian{
  padding: 10px 10px 10px 10px;
  border-radius: 10px;
  border: 1px solid lightgray;
}

.label-text{
  font-size: 14px;
  margin-bottom: 0px !important;
  color: grey;
}

.orange-menu {
  background-color:#34b5fa !important;
}

.white-menu {
  background-color:rgba(255, 255, 255, 0) !important;
}

.hover-new:hover{
  background-color: #34b5fa !important;
}

.hover-new:hover .fa {
  background-color: #34b5fa;
}

.force-text {
  font-family:"Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
  font-weight:800px;
  color:white !important;
}

footer {
  bottom: 0;
  width: 100%;
}

.position-add-button{
  margin-right:3rem !important;
}

.color-blue-fix{
  background-color: #0293df;
}

.sidebar{
  background-color: #045078;
}
.sidebar-divider{
  margin:0px !important;
}

.sidebar-heading{
  padding-top:1rem;
}

.sidebar .nav-item:last-child{
  margin-bottom:0px !important;
}

#formFilter{
  margin-top:17px;
}

.image-view{
  width:50%;
  left:0;
  right:0;
  margin:auto;
  top:5%;

}

.bottom-force-up{
  margin-bottom:100px;
}

.push{
  margin-bottom:80px;
}

.force-nomargin{
  margin:0px !important;
  padding:0px !important;
}

.detail-donate{
  margin-right:130px !important;
  margin-left:0px !important;
}

.frm-login #email,
.frm-login #password,
.frm-login .btn-block{
  border-radius:10px !important;
}

.frm-login .btn-block{
  color:#7ED1FC;
  background-color:black;
}

.border-red{
  border-left:1rem solid #EEB0B0 !important;
}

.border-yellow{
  border-left:1rem solid #FFE59D !important;
}

.border-blue{
  border-left:1rem solid #AE91FC !important;
}

.border-green{
  border-left:1rem solid #C9CC6C !important;
}

.border-left-red{
  border-left:6rem solid #EEB0B0 !important;
}

.border-left-yellow{
  border-left:6rem solid #FFE59D !important;
}

.border-left-blue{
  border-left:6rem solid #AE91FC !important;
}

.border-left-green{
  border-left:6rem solid #C9CC6C !important;
}

.position-relative{
  position:relative;
}

.position-relative .card-body{
  height:110px;
  text-align:right;
}

.love_hand{
  position:absolute;
  left:-93px;
  top:-50px
}

.money_hand{
  position:absolute;
  left:-90px;
  top:-50px
}

.science{
  position:absolute;
  left:-105px;
  top:-50px
}

.ok_hand{
  position:absolute;
  left:-110px;
  top:-50px
}

.topright-0{
  position:absolute;
  top:0%;
  right:0;
}

.bottomright-0{
  position:absolute;
  top:50px;
  right:0;
}

#formFilter input[type=text],
#formFilter .searchborder{
  border: 1px solid #0293df ;
}

.overflow{
  max-height: 500px;
  overflow-y: scroll;
  overflow-x: none;
}

.untouch{
  pointer-events: none;
}