.colorgraph {
	height: 5px;
	border-top: 0;
	background: #c4e17f;
	border-radius: 5px;
	background-image: -webkit-linear-gradient(left, #c4e17f, #c4e17f 12.5%, #f7fdca 12.5%, #f7fdca 25%, #fecf71 25%, #fecf71 37.5%, #f0776c 37.5%, #f0776c 50%, #db9dbe 50%, #db9dbe 62.5%, #c49cde 62.5%, #c49cde 75%, #669ae1 75%, #669ae1 87.5%, #62c2e4 87.5%, #62c2e4);
	background-image: -moz-linear-gradient(left, #c4e17f, #c4e17f 12.5%, #f7fdca 12.5%, #f7fdca 25%, #fecf71 25%, #fecf71 37.5%, #f0776c 37.5%, #f0776c 50%, #db9dbe 50%, #db9dbe 62.5%, #c49cde 62.5%, #c49cde 75%, #669ae1 75%, #669ae1 87.5%, #62c2e4 87.5%, #62c2e4);
	background-image: -o-linear-gradient(left, #c4e17f, #c4e17f 12.5%, #f7fdca 12.5%, #f7fdca 25%, #fecf71 25%, #fecf71 37.5%, #f0776c 37.5%, #f0776c 50%, #db9dbe 50%, #db9dbe 62.5%, #c49cde 62.5%, #c49cde 75%, #669ae1 75%, #669ae1 87.5%, #62c2e4 87.5%, #62c2e4);
	background-image: linear-gradient(to right, #c4e17f, #c4e17f 12.5%, #f7fdca 12.5%, #f7fdca 25%, #fecf71 25%, #fecf71 37.5%, #f0776c 37.5%, #f0776c 50%, #db9dbe 50%, #db9dbe 62.5%, #c49cde 62.5%, #c49cde 75%, #669ae1 75%, #669ae1 87.5%, #62c2e4 87.5%, #62c2e4);
}
.g-recaptcha{
	position: relative;
	padding-bottom: 10%;
	padding-top: 3%;
	height: 0;
	overflow: hidden;
    text-transform: uppercase;
}
.g-recaptcha iframe{
	position: absolute;
	top:0;
	left: 0;
	width: 100%;
	height: 100%;
}
/* Tags input di blog */
.tagsinput {
    border: 1px solid #CCC;
    background: #FFF;
    padding: 6px 6px 0;
    width: 300px;
    overflow-y: auto
}
span.tag {
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    display: block;
    float: left;
    padding: 5px 9px;
    text-decoration: none;
    background: #1ABB9C;
    color: #F1F6F7;
    margin-right: 5px;
    font-weight: 500;
    margin-bottom: 5px;
    font-family: helvetica
}
span.tag a {
    color: #F1F6F7 !important
}
.tagsinput span.tag a {
    font-weight: bold;
    color: #82ad2b;
    text-decoration: none;
    font-size: 11px
}
.tagsinput input {
    width: 80px;
    margin: 0px;
    font-family: helvetica;
    font-size: 13px;
    border: 1px solid transparent;
    padding: 3px;
    background: transparent;
    color: #000;
    outline: 0px
}
.tagsinput div {
    display: block;
    float: left
}
.tags_clear {
    clear: both;
    width: 100%;
    height: 0px
}
code {
    font-family: monospace;
}
.video-container {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
}
.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}
/* blinking teks */
.blink{
  animation: blink 1s infinite;
}
@keyframes blink{
  0%{opacity: 1;}
  75%{opacity: 1;}
  76%{ opacity: 0;}
  100%{opacity: 0;}
}
/* tanda pada input required  */
input[type=text],
input[type=email],
input[type=number],
textarea,
fieldset {
  -webkit-appearance: none;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/*input:invalid {
  box-shadow: 0 0 1px 1px red;
}*/

input:focus:invalid {
  box-shadow: none;
}

/*spinner loader*/
#loader {
  transition: all 0.3s ease-in-out;
  opacity: 1;
  visibility: visible;
  position: fixed;
  height: 100vh;
  width: 100%;
  background: #fff;
  z-index: 90000;
}

#loader.fadeOut {
  opacity: 0;
  visibility: hidden;
}

.spinner {
  width: 40px;
  height: 40px;
  position: absolute;
  top: calc(50% - 20px);
  left: calc(50% - 20px);
  background-color: dodgerblue;
  border-radius: 100%;
  -webkit-animation: sk-scaleout 1.0s infinite ease-in-out;
  animation: sk-scaleout 1.0s infinite ease-in-out;
}

@-webkit-keyframes sk-scaleout {
  0% { -webkit-transform: scale(0) }
  100% {
    -webkit-transform: scale(1.0);
    opacity: 0;
  }
}

@keyframes sk-scaleout {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
  } 100% {
    -webkit-transform: scale(1.0);
    transform: scale(1.0);
    opacity: 0;
  }
}
.bg-login {
	background: url("../img/bg-login.jpg") no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	height: 100vh; /* Gunakan 100vh untuk tinggi layar penuh */
	text-align: center;
	padding-top: 200px;
}

.table{
	font-size: 13px;
}
.table thead th {
  text-align: center;
  vertical-align: middle;
	/*padding-bottom: 0;
	padding-top: 0;*/
}
div.ColVis {
	float: left;
}
th, td { white-space: nowrap; }

.bg-lock {
  background-image: url("../img/bg-lock.jpg");
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.select2-selection--single{
    height: 38px !important;
}

label:not(.form-check-label):not(.custom-file-label) {
	font-weight: normal !important;
}