:root {
	--biru-pupr: #293785;
	--kuning-pupr: #F0C62B;
	--dark-biru-pupr: #353e67;
	--widget-bar-bgcolor: #f2f2f2;
	--widget-height : 200px;
	--widget-header-height: 2rem;
	--widget-bottom-border: 4px;
	--nav-height: 4rem;
	--running-text-height: 2rem;
	--content-height: calc(100vh - var(--nav-height) - var(--widget-height) - var(--widget-bottom-border) - var(--running-text-height));
	--content-height-without-running-text: calc(100vh - var(--nav-height) - var(--widget-height) - var(--widget-bottom-border));
	--content-height-pure: calc(100vh - var(--nav-height));
	--side-panel-width: 525px;
	--running-text-bgcolor: rgba(41, 55, 133, 0.8);
	--teal-eker: #1565C0;
}
* {
	box-sizing: border-box;
	font-family: 'Open Sans', sans-serif;
}

html, body {
	margin: 0px;
	padding: 0px;
}

.nomp { margin: 0px; padding: 0px; }
.nom { margin: 0px; }
.nop { padding: 0px; }
.nob { border:none; }

.bold { font-weight: bold; }
.thin-text { font-weight: 100; }
.italic { font-style: italic; }
.normal-size-text { font-size: 1rem; }
.bigger-text { font-size: 1.2rem; }
.biggest-text { font-size: 1.4rem; }
.smaller-text { font-size: 0.8rem; }
.smallest-text { font-size: 0.6rem; }

.w-100 { width: 100%; }
.w-90 { width: 90%; }
.w-80 { width: 80%; }
.w-70 { width: 70%; }
.w-60 { width: 60%; }
.w-50 { width: 50%; }
.w-40 { width: 40%; }
.w-30 { width: 30%; }
.w-20 { width: 20%; }
.w-10 { width: 10%; }
.w-0 { width: 0%; }
.h-100 { height: 100%; }


.max-h-100 { max-height:100%; }
.max-h-90 { max-height:90%; }
.max-h-80 { max-height:80%; }
.max-h-70 { max-height:70%; }
.max-h-60 { max-height:60%; }
.max-h-50 { max-height:50%; }
.max-h-40 { max-height:40%; }
.max-h-30 { max-height:30%; }
.max-h-20 { max-height:20%; }
.max-h-10 { max-height:10%; }


.p-1rem { padding: 1rem; }
.p-05rem { padding: 0.5rem; }
.p-05rem-1rem { padding: 0.5rem 1rem; }
.m-t-4px { margin-top: 4px; }
.m-t-8px { margin-top: 8px; }
.m-t-12px { margin-top: 12px; }
.m-t-1rem { margin-top: 1rem; }
.m-r-1rem { margin-right: 1rem; }
.m-b-4px { margin-bottom: 4px; }
.m-b-8px { margin-bottom: 8px; }
.m-b-12px { margin-bottom: 12px; }
.m-4px { margin: 4px; }
.m-8px { margin: 8px; }
.p-t-4px { padding-top: 4px; }
.p-b-4px { padding-bottom: 4px; }
.p-b-8px { padding-bottom: 8px; }
.p-l-4px { padding-left: 4px; }
.p-r-4px { padding-right: 4px; }
.p-r-1rem { padding-right: 1rem; }
.p-12px { padding: 12px; }
.p-8px { padding: 8px; }
.p-4px { padding: 4px; }
.p-2px { padding: 2px; }

/* .navi-bar {
	height: var(--nav-height);
	background-color: black;
	width: 100%;
	position: relative;
}

.navi-bar .logo-img {
	height: 1.5rem;
}

.navi-bar .navi-button {
	position: absolute;
	left: 0.8rem;
}

.maincontent {
	height: var(--content-height-pure);
	width:100%;
} */

.clickable{
	cursor:pointer;
}

.kuning-pupr { background-color: var(--kuning-pupr); }
.kuning-pupr-text { color: var(--kuning-pupr); }
.biru-pupr { background-color: var(--biru-pupr); }
.biru-pupr-text { color: var(--biru-pupr); }
.dark-biru-pupr { background-color: var(--dark-biru-pupr); }
.dark-biru-pupr-text { color: var(--dark-biru-pupr); }
.teal-eker { background-color: var(--teal-eker); }
.navy-eker { background-color: var(--biru-pupr);; }
.teal-eker-text {color: var(--teal-eker)}
.navy-eker-text { color: var(--biru-pupr); }
.bigger-text { font-size: 1.2rem !important; }
.smaller-text { font-size: 0.8rem !important; }
.smallest-text { font-size: 0.6rem !important; }

.header{
  /* background-color:rgba(76,176,80,0.85); */
	background: url("../images/green2.jpg");
  border-top-left-radius: 25px;
  border-top-right-radius: 25px;
	/* background-position: center; */
	/* background-repeat: no-repeat; */
	background-size: cover;
}
h5{
	font-weight: 600;
}
/* END GET FROM SIMADU */


/* NEW CSS SITAMU  */

/* BODY */
body{
  /* background-color:#eefbb3; */
	background: url("../images/green2.jpg");
  padding:1rem;
  overflow-y: scroll;
	/* background-position: center; */
	/* background-repeat: no-repeat; */
	/* background-size: cover; */
}
.card-sitamu{
  position:relative;
  border-radius: 25px;
  /* background-color: #fff; */
  box-shadow: 0 10px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19) !important;
  min-height: calc(100% - 4rem);
  /* height:calc(100vh-4em); */
}


/* HEADER SITAMU */
.p-1em{ padding:1em; }
.p-2em{ padding:2em; }
.m-left-right-1em{ margin-left: 1em; margin-right: 1em;}

.p-left-right-1em{ padding-left:1em;padding-right: 1em; }

.p-top-bottom-2em{ padding-top:2em; padding-bottom: 2em; }
.p-top-bottom-1em{ padding-top:1em; padding-bottom: 1em; }
.p-top-bottom-dot9em{padding-top: .9em; padding-bottom: .9em}
.p-top-bottom-dot8em{padding-top: .8em; padding-bottom: .8em}
.p-top-bottom-dot7em{padding-top: .7em; padding-bottom: .7em}
.p-top-bottom-dot6em{padding-top: .6em; padding-bottom: .6em}
.p-top-bottom-dot5em{padding-top: .5em; padding-bottom: .5em}
.p-top-bottom-dot4em{padding-top: .4em; padding-bottom: .4em}
.p-top-bottom-dot3em{padding-top: .3em; padding-bottom: .3em}
.p-top-bottom-dot2em{padding-top: .2em; padding-bottom: .2em}
.p-top-bottom-dot1em{padding-top: .1em; padding-bottom: .1em}

.p-top-1dot5em{ padding-top:1.5em; }
.p-top-1dot7em{ padding-top:1.7em; }


.p-bottom-1em{ padding-bottom: 1em; }
.p-bottom-2em{ padding-bottom: 2em; }

.m-bottom-1em{ margin-bottom: 1em; }
.m-bottom-dot9em{ margin-bottom: 0.9em; }
.m-bottom-dot8em{ margin-bottom: 0.8em; }
.m-bottom-dot7em{ margin-bottom: 0.7em; }
.m-bottom-dot6em{ margin-bottom: 0.6em; }
.m-bottom-dot5em{ margin-bottom: 0.5em; }
.m-bottom-dot4em{ margin-bottom: 0.4em; }
.m-bottom-dot3em{ margin-bottom: 0.3em; }
.m-bottom-dot2em{ margin-bottom: 0.2em; }
.m-bottom-dot1em{ margin-bottom: 0.1em; }





.container-logo{
  background-color:rgba(53,109,86,0.7);
  border-top-right-radius: 25px;
  border-top-left-radius:25px;
	margin-top: -.1em;
}
.container-dashboard{
	width:90% !important;
}
.navigator{
  display:none;
}
.navigator-active{
  border-bottom:5px solid rgba(181,255,119,1);
  color:#000 !important;
}

.navigator a:hover{
  color:#fff !important;
  background-color: rgba(0,0,0,0.025);
  border-top-left-radius: 25px;
  border-top-right-radius: 25px;
}
.navigator-mobile{
	display:block;
}
.logo-kerjasama{
	width:50px;
	width:50px;
}
/* .sidenav-trigger{
  display:block;
  float:left;
  position:fixed;
  font-size:10px;
  z-index:99;
} */

@media only screen and (min-width: 992px){
  body{
    overflow-y: hidden;
		padding: 2em;
  }
  .navigator{
    display:block
  }
  .container-logo{
    border-top-right-radius: 0px;
    border-bottom-right-radius: 25px;
  }
	.container-logo.m0{
		border-radius: 0px 0px 25px 25px;
	}
	.navigator-mobile{
		display: none;
	}
  .sidenav-trigger{
    display:none;
  }
	.logo-kerjasama{
		width:60px;
		height:60px;
	}
}

@media only screen and (min-width:768){
  body{
    overflow-y: scroll;
    padding: 2em;
  }
  .container-logo, .container-logo.m0{
    border-top-right-radius: 25px;
    border-bottom-right-radius: 0px;
  }
}

/* CONTAINER LEFT  ================================================  */
.content-left{

  /* height:82vh; */
  /* height:100%; */
  /* filter:brightness(0.9); */
  overflow-y: auto;
  border-bottom-left-radius: 0px;
  border-bottom-right-radius: 0px;
}

.filter-gray1{
  background-color:rgba(0,0,0,0.2);
  height:100%;
  width:100%;
}


@media only screen and (min-width: 992px){
  .content-left{
		height:78vh;
		overflow:hidden;
		border-bottom-left-radius: 25px;
		border-bottom-right-radius: 0px;
  }
}
@media only screen and (min-width:1025px){
	.content-left{
		height:82vh;

		/* border-bottom-left-radius: 0px; */
		/* border-bottom-right-radius: 0px; */
	}
}

/* ================================================================== */

/* CONTAINER RIGHT ================================================== */
.content-right{
  padding-left:2em;
	padding-right: 2em;

	background-color:rgba(245,245,245,1);

	border-bottom-left-radius: 25px;
	border-bottom-right-radius: 25px;
}

@media only screen and (min-width: 992px){
  .content-right{
		height:78vh;
		overflow:auto;
		border-bottom-left-radius: 0px;
		/* border-bottom-right-radius: 25px; */
	}

}
@media only screen and (min-width:768px){
	/* .content-right{
		border-bottom-right-radius: 25px;
	} */
}

@media only screen and (min-width: 1025px){
	.content-right{
		height:82vh;
		/* overflow:auto; */
	}
}
@media only screen and (min-width: 1440px){
	/* .content-right{
		height:82vh;
		overflow:auto;
	} */
}
/* ================================================================== */

/* CONTENT FULL ===================================================== */
.content-full{
	padding:2em;
	/* background-color: #f5f5f5; */
	background-color: rgba(245,245,245,1);
	border-bottom-left-radius: 25px;
	border-bottom-right-radius: 25px;
}

@media only screen and (min-width: 992px){
  .content-full{
		height:78vh;
		overflow:auto;
	}

}
@media only screen and (min-width:768px){
}

@media only screen and (min-width: 1025px){
	.content-full{
		height:82vh;
	}
}
/* ================================================================== */

h3{ font-size: 2.92rem; }
h4{ font-size: 1.5rem; }
.widget-val{ font-size:1.1rem; }
@media only screen and (min-width: 768px){
	h4 { font-size:2.1rem; }
}
@media only screen and (min-width: 1024px){
	h3{font-size: 2.3rem; }
	h4{font-size: 2.1rem; }
}
@media only screen and (min-width: 1280px){
	h3{ font-size: 2.92rem; }
}


.rounded-card{
	border-radius: 25px;
}

.mini-card{
  padding:.4em 1em;
  font-size:2em;
}
.uploadimage.browser-default{
	border: 1px solid #0f0f0f;
	padding: 1em;
}





.select2-container--default .select2-search--dropdown .select2-search__field,
.select2-container--default .select2-search--dropdown .select2-search__field:focus {
	padding: 0.5rem 1rem;
	border: 1px solid #eee;
	width: 100%;
}
.select2-selection__rendered {
		line-height: 31px !important;
}
.select2-container .select2-selection--single {
		min-height: 34px !important;
}
.select2-selection__arrow {
		min-height: 34px !important;
}
.select2-container--default .selection{
	padding: 0 !important;
}