body {
    font-family: "Open Sans",sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    color: #343a40;
    text-align: left;
}

.h3, h3 {
    font-size: 20px;
}

h4 {
    margin: 0;
    font-weight: 600;
    font-size: 17px;
}

p {
    font-size: 13px;
    margin-top: 0;
    margin-bottom: 1.875rem;
}

hr{
	border-color:#666}

a{
	text-decoration:none;}
	
.header{
	height:80px;padding-top:10px;box-shadow: 0 0 16px rgba(0,0,0,.15);	}
	
.padatas{
	padding-top:0px;	}
.padatas2{
	padding-top:10px;	}
.maratas{
	margin-top:0px;		}
	
.header .navbar-nav .nav-item .nav-link {
    color: #555 !important;
	font-size:14px;
	font-weight:600;
	margin-left:6px;
	margin-right:6px;
}	
.header .navbar-nav .nav-item .nav-link.active, .header .navbar-nav .nav-item .nav-link:hover {
    color: #24b314 !important;
	background:none;
    text-decoration: none;
    border-bottom: 2px solid #24b314;
	
}
.header .navbar-nav .nav-item .nav-link.active, .header .navbar-nav .nav-item .nav-link.active {
    color: #24b314 !important;
}




.kotakform{
	background:#fff;min-height:120px;height:auto;padding:30px 0;box-shadow: 0 0 16px rgba(0,0,0,.15);	}
	
.kdiv{
	padding-bottom:9px;	}
	
.tombol2{
	width:150px;text-align:center;
	font-weight: bold;
    color: #fff;
	text-transform:uppercase;
	background-color: #E7001A;
    border: 2px solid transparent;
        border-top-color: transparent;
        border-right-color: transparent;
        border-bottom-color: transparent;
        border-left-color: transparent;
    padding: 10px 15px;
	border-radius: 12px;
	text-decoration:none;
	}
	

.input-group {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    width: 100%;
}

.input-group-append {
    margin-left: -2px;
}
.input-group-append, .input-group-prepend {
    display: flex;
}

.input-group > .custom-select:not(:last-child), .input-group > .form-control:not(:last-child) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.input-group > .custom-file, .input-group > .custom-select, .input-group > .form-control, .input-group > .form-control-plaintext {
    position: relative;
    flex: 1 1 auto;
    width: 1%;
    min-width: 0;
    margin-bottom: 0;
}

.form-control {

    display: block;
    width: 100%;
    padding: .45rem .9rem;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    color: #6c757d;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0.3em;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;

}

.subscription .btn {
    display: inline-block;
    font-weight: 400;
    color: #333;
    text-align: center;
    vertical-align: middle;
    user-select: none;
    background-color: transparent;
    border: 2px solid transparent;
        border-top-color: transparent;
        border-right-color: transparent;
        border-bottom-color: transparent;
        border-left-color: transparent;
    padding: .375rem .75rem;
    font-size: .875rem;
    line-height: 1.5;
    border-radius: 4px;
        border-top-right-radius: 4px;
        border-bottom-right-radius: 4px;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.subscription .btn-inverse{
	 color: #fff; width:40px;font-size:15px;
    background-color: #1D2226;
    border-color: #1D2226;}

.subscription  .btn-inverse:hover {
    color: #fff;
    background-color: #1D2226;
    border-color: #1D2226;
}

.tombol{
	
	width:100%;text-align:center;
	font-weight: 400;
    color: #fff;
	background-color: #aa0818;
    border: 2px solid transparent;
        border-top-color: transparent;
        border-right-color: transparent;
        border-bottom-color: transparent;
        border-left-color: transparent;
    padding: 15px 25px;
	border-radius: 12px;
	text-decoration:none;
	}
	
.tombol:hover{
	text-decoration:none;color:#333;}
	
	
.select2-container--default .select2-selection--single {
    background-color: #F8F8F8;
    border: 1px solid #ddd;
    border-radius: 4px;
	height: 44px;
}	

.select2-container--default .select2-selection--single .select2-selection__placeholder {
     font-family: 'Roboto', FontAwesome;
    font-size: 16px;
    font-weight: 300;
    line-height: 44px;
	color: #888;
	padding: 0 20px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 26px;
    position: absolute;
    top: 10px;
    right: 1px;
    width: 20px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    font-family: 'Roboto', FontAwesome;
    font-size: 16px;
    font-weight: 300;
    line-height: 44px;
	color: #555;
	
}

.panel-footer {
    padding: 10px 0px;}

.text-right {
    text-align: left;
}

.content{
	min-height:400px;height:auto;padding:30px 0;}
	
.content .content-title{
	
	text-align: center;
	position: relative;
	
	padding-bottom: .9375rem;
	margin-top: 0;}	
	
.content .content-desc {
	color:#666;
    text-align: center;
    margin-bottom: 3.75rem;
   
	font-size:14px;
}	

.spinner {
  margin: 0px auto;
  width: 20px;
  height: 20px;
  text-align: center;
  font-size: 10px;
}

.spinner > div {
  background-color: #fff;
  height: 100%;
  width: 3px;
  display: inline-block;
  
  -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;
  animation: sk-stretchdelay 1.2s infinite ease-in-out;
}

.spinner .rect2 {
  -webkit-animation-delay: -1.1s;
  animation-delay: -1.1s;
}

.spinner .rect3 {
  -webkit-animation-delay: -1.0s;
  animation-delay: -1.0s;
}

.spinner .rect4 {
  -webkit-animation-delay: -0.9s;
  animation-delay: -0.9s;
}

.spinner .rect5 {
  -webkit-animation-delay: -0.8s;
  animation-delay: -0.8s;
}

@-webkit-keyframes sk-stretchdelay {
  0%, 40%, 100% { -webkit-transform: scaleY(0.4) }  
  20% { -webkit-transform: scaleY(1.0) }
}

@keyframes sk-stretchdelay {
  0%, 40%, 100% { 
    transform: scaleY(0.4);
    -webkit-transform: scaleY(0.4);
  }  20% { 
    transform: scaleY(1.0);
    -webkit-transform: scaleY(1.0);
  }
}
	

.form-horizontal{
	padding-top:20px;}

.col-form-label {
    padding-top: calc(.375rem + 2px);
    padding-bottom: calc(.375rem + 2px);
    margin-bottom: 0;
    font-size: inherit;
    line-height: 1.5;
}	

.kotak-login{
	width:500px;margin:0 auto;}

.mb-3 {
    margin-bottom: 1.5rem !important;
}

.form-label {
    margin-bottom: .5rem;
}
label {
    font-weight: 600;
}

.text-muted {
    color: #98a6ad !important;
}
.float-end {
    float: right !important;
}
	
/*.content .content-title::after {
    content: '';
    display: block;
    position: absolute;
    width: 4.5rem;
    background: #2d353c;
    height: .125rem;
    bottom: 0;
    left: 50%;
    margin-left: -1.25rem;
}*/	

.footer{
	padding: 3.75rem 0;
	background: #22282d;
	color: rgba(255,255,255,.5);
	font-size: 13px;
	-webkit-box-shadow: inset 0 100px 80px -80px rgba(0,0,0,.7);
	box-shadow: inset 0 100px 80px -80px rgba(0,0,0,.7);}
	
.container{
	width:1140px;	}

.footer .content-title {
    margin-bottom: 1.875rem;
    padding-bottom: .9375rem;
    margin-top: 0;
	color: #fff;
}

.footer p {
    margin-top: 0;
    margin-bottom: 1.875rem;
}

.footer ul{
	margin:0;padding:0;}
.footer li{
	padding-left:0;margin:0;list-style-type:none;}

a.footlink{
	color: rgba(255,255,255,.5);
	text-decoration:none;}
	
a.footlink:hover{
	color: #fff;
	text-decoration:underline;}	
	
.footnote{
	border-top:1px solid #535556;
	text-align:center;
	padding:20px 0;margin-top:40px;}
	

.bulat{
	border-radius:50%;border:1px solid #535556;
	--icon-padding: 0.9em; color:#fff;	}	
	
.kotaks{
	border-radius:8px;border:1px solid #535556;
	--icon-padding: 0.9em; color:#535556;	}		

	
.pagination{
	margin-top:90px;	}
.pagination span{
	color:#ccc;padding:5px 10px;border:1px solid #ccc;margin-right:5px;	}
.pagination span.last, .pagination span.first, .pagination span.next, .pagination span.prev{
	color:#ccc;border:1px solid #ccc;	}
.pagination a{
	color:#333;padding:5px 10px;border:1px solid #666;margin-right:5px;	}
.pagination a:hover{
	color:#fff ;border:1px solid #d11010 ;background:#E7001A	}
.pagination .current{
	color:#fff ;border:1px solid #d11010 ;background:#E7001A	}		
	
.tableku{
	width: 100%;
	margin-bottom: 1rem;
	color: #212529;	}
	
.tableku thead{	
    box-shadow: 0 0 13px 0 hsla(0,0%,87.1%,.81);
	}	
	
.tableku thead th {
    border: 0 !important;
    font-size: 14px;
	
}
.tableku thead th {
    vertical-align: bottom;
    border-bottom: 2px solid #dee2e6;
	background:#dedede;color:#333;
}
.tableku td, .tableku th {
    padding: .75rem;
    vertical-align: top;
    border-top: 1px solid #dee2e6;
}	


.tengah{
	margin:0 auto;width:600px;}
	
.inpcon{
	border-radius: 4px;
	box-shadow: 2px 2px 12px 2px #bbb;	}
.tablehas thead {
    border-bottom: 2px solid #ddd;
    background-color: #f1f2f4;
}	

.merah{
	color:#E7001A	}
.abu{
	color:#b2b2b2	}
	
.sticky {
    position: fixed;
    top: 0;
    width: 100%;
	z-index:99999;
	background:#fff;
    border-bottom: 1px solid rgba(234, 234, 234, 0.5) !important;
   /* -webkit-box-shadow: inset 0 100px 80px -80px rgba(0,0,0,.7);
	box-shadow: inset 0 100px 80px 80px rgba(0,0,0,.7);*/
	box-shadow: 0 0 8px 0 rgba(0,0,0,.12);
}	

.error{
	color:red}

.text-xs{
	font-size:14px;}

.kotakmenu{
	width:100%;height:400px;
	box-shadow: 0 1px 2px rgba(0,0,0,0.07), 
                0 2px 4px rgba(0,0,0,0.07), 
                0 4px 8px rgba(0,0,0,0.07), 
                0 8px 16px rgba(0,0,0,0.07),
                0 16px 32px rgba(0,0,0,0.07), 
                0 32px 64px rgba(0,0,0,0.07);}
				
.listmenu{
	border:1px solid #dedede;width:90%;padding:0;margin:10px 10px;}
.listmenu li{
	list-style-type:none;height:30px;padding:10px 15px;}

.listmenu li {
	color: #6c757d;
	font-weight: 600;	margin-bottom: .375rem !important;height:50px;}
	
.listmenu li.selesai{
	border-radius: .25rem;
	display: block;
padding: .5rem 1rem;
color: #f06b78;
transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;
	color: #fff;
	background-color: #f06b78;}
	

.jq-tab-menu .jq-tab-title:first-child {
    border-top: 1px solid #5f99d3;
}
	
.jq-tab-menu .jq-tab-title.active, .jq-tab-menu .jq-tab-title:hover {
    background: #0277e5;
    border-left: 3px solid #1b6cb7;
	color:#fff;
}	

.jq-tab-menu .jq-tab-title {
    background: #fff;
    border: 1px solid #0277e5;
    cursor: pointer;
    padding: 1em 1em;
	font-size:12px;
    -webkit-transition: background .2s;
    -o-transition: background .2s;
    transition: background .2s;}
	
	
.tomku{
	background:#0277E5;color:#fff;padding:3px 10px;	}
	
.panel-footer{
	background-color: #fff;	
	border-top: 0px solid #ddd;
	border-bottom-right-radius: 0px;
	border-bottom-left-radius: 0px;
	}
	
.cursorm{
	cursor:pointer;	}
.nyata{
	margin:10px 0;padding:0;}
.nyata li{
	padding:8px 0;border-top:1px solid #ccc;list-style-type:none;}	
.peringatan{
	color:red;padding:15px 0;font-weight:bold;	}
.par{
	font-size:14px;	}
.red{
	color:red;font-weight:bold	}
	
.judul{
	font-weight:bold;padding-bottom:15px;font-size:14px;		}
	
.info{
	margin:0;padding:10px 0 0 10px;	}
	
.info li{
	padding-top:5px;margin-left:15px;	}	
	

/* menu*/
.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
    clear: both;
}
.clearfix {
    *zoom: 1;
}


@media only screen and (min-width: 1200px) {
    .container {
        width: 1210px;
    }
}

@media only screen and (min-width: 960px) and (max-width: 1199px) {
    .container {
        width: 1030px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 959px) {
    .container {
        width: 682px;
    }
}

@media only screen and (min-width: 480px) and (max-width: 767px) {
    .container {
        width: 428px;
        margin: 0 auto;
    }
}

@media only screen and (max-width: 479px) {
    .container {
        width: 320px;
        margin: 0 auto;
    }
}


  
.mcd-menu {
  list-style: none;
  padding: 0;
  margin: 0;
  background: #FFF;
  /*height: 100px;*/
  border-radius: 2px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  
  /* == */
  width: 250px;
  /* == */
}
.mcd-menu li {
  position: relative;
  /*float:left;*/
}
.mcd-menu li a {
  display: block;
  text-decoration: none;
  padding: 16px 20px;
  color: #777;
  /*text-align: center;
  border-right: 1px solid #E7E7E7;*/
  
  /* == */
  text-align: left;
  height: 56px;
  position: relative;
  border-bottom: 1px solid #EEE;
  /* == */
}
.mcd-menu li a i {
  /*display: block;
  font-size: 30px;
  margin-bottom: 10px;*/
  
  /* == */
  float: left;
  font-size: 16px;
  margin: 5px 10px 0 0;
  font-weight:600;
  /* == */
  
}
/* == */
.mcd-menu li a p {
  float: left;
  margin: 0 ;
}
/* == */

.mcd-menu li a strong {
  display: block;
  text-transform: uppercase;
  font-weight:400;
}
.mcd-menu li a small {
  display: block;
  font-size: 10px;
}

.mcd-menu li a i, .mcd-menu li a strong, .mcd-menu li a small {
  position: relative;
  
  /*transition: all 300ms linear;
  -o-transition: all 300ms linear;
  -ms-transition: all 300ms linear;
  -moz-transition: all 300ms linear;
  -webkit-transition: all 300ms linear;*/
}
.mcd-menu li:hover > a i {
    opacity: 1;
    /*-webkit-animation: moveFromTop 300ms ease-in-out;
    -moz-animation: moveFromTop 300ms ease-in-out;
    -ms-animation: moveFromTop 300ms ease-in-out;
    -o-animation: moveFromTop 300ms ease-in-out;
    animation: moveFromTop 300ms ease-in-out;*/
}
.mcd-menu li:hover a strong {
    opacity: 1;
    /*-webkit-animation: moveFromLeft 300ms ease-in-out;
    -moz-animation: moveFromLeft 300ms ease-in-out;
    -ms-animation: moveFromLeft 300ms ease-in-out;
    -o-animation: moveFromLeft 300ms ease-in-out;
    animation: moveFromLeft 300ms ease-in-out;*/
}
.mcd-menu li:hover a small {
    opacity: 1;
   /* -webkit-animation: moveFromRight 300ms ease-in-out;
    -moz-animation: moveFromRight 300ms ease-in-out;
    -ms-animation: moveFromRight 300ms ease-in-out;
    -o-animation: moveFromRight 300ms ease-in-out;
    animation: moveFromRight 300ms ease-in-out;*/
}

.mcd-menu li:hover > a {
  color: #e67e22;
}
.mcd-menu li a.active {
  position: relative;  color: #666;
  border:0;
  /*border-top: 4px solid #e67e22;
  border-bottom: 4px solid #e67e22;
  margin-top: -4px;*/
  box-shadow: 0 0 5px #DDD;
  -moz-box-shadow: 0 0 5px #DDD;
  -webkit-box-shadow: 0 0 5px #DDD;
  
  /* == */
  border-left: 4px solid #47A447;
  /*border-right: 4px solid #47A447;*/
  margin: 0 -4px;
  /* == */
}
.mcd-menu li a.active:before {
  content: "";
  position: absolute;
  /*top: 0;
  left: 45%;
  border-top: 5px solid #e67e22;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;*/
  
  /* == */
  top: 42%;
  left: 0;
  border-left: 5px solid #47A447;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  /* == */
}

/* == */
.mcd-menu li a.active:after {
  /*content: "";
  position: absolute;
  top: 42%;
  right: 0;
  border-right: 5px solid #e67e22;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;*/
}
/* == */

@-webkit-keyframes moveFromTop {
    from {
        opacity: 0;
        -webkit-transform: translateY(200%);
        -moz-transform: translateY(200%);
        -ms-transform: translateY(200%);
        -o-transform: translateY(200%);
        transform: translateY(200%);
    }
    to {
        opacity: 1;
        -webkit-transform: translateY(0%);
        -moz-transform: translateY(0%);
        -ms-transform: translateY(0%);
        -o-transform: translateY(0%);
        transform: translateY(0%);
    }
}
@-webkit-keyframes moveFromLeft {
    from {
        opacity: 0;
        -webkit-transform: translateX(200%);
        -moz-transform: translateX(200%);
        -ms-transform: translateX(200%);
        -o-transform: translateX(200%);
        transform: translateX(200%);
    }
    to {
        opacity: 1;
        -webkit-transform: translateX(0%);
        -moz-transform: translateX(0%);
        -ms-transform: translateX(0%);
        -o-transform: translateX(0%);
        transform: translateX(0%);
    }
}
@-webkit-keyframes moveFromRight {
    from {
        opacity: 0;
        -webkit-transform: translateX(-200%);
        -moz-transform: translateX(-200%);
        -ms-transform: translateX(-200%);
        -o-transform: translateX(-200%);
        transform: translateX(-200%);
    }
    to {
        opacity: 1;
        -webkit-transform: translateX(0%);
        -moz-transform: translateX(0%);
        -ms-transform: translateX(0%);
        -o-transform: translateX(0%);
        transform: translateX(0%);
    }
}



.mcd-menu li ul,
.mcd-menu li ul li ul {
  position: absolute;
  height: auto;
  min-width: 200px;
  padding: 0;
  margin: 0;
  background: #FFF;
  /*border-top: 4px solid #e67e22;*/
  opacity: 0;
  visibility: hidden;
  transition: all 300ms linear;
  -o-transition: all 300ms linear;
  -ms-transition: all 300ms linear;
  -moz-transition: all 300ms linear;
  -webkit-transition: all 300ms linear;
  /*top: 130px;*/
  z-index: 1000;
  
  /* == */
  left:280px;
  top: 0px;
  border-left: 4px solid #e67e22;
  /* == */
}
.mcd-menu li ul:before {
  content: "";
  position: absolute;
  /*top: -8px;
  left: 23%;
  border-bottom: 5px solid #e67e22;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;*/
  
  /* == */
  top: 25px;
  left: -9px;
  border-right: 5px solid #e67e22;
  border-bottom: 5px solid transparent;
  border-top: 5px solid transparent;
  /* == */
}
.mcd-menu li:hover > ul,
.mcd-menu li ul li:hover > ul {
  display: block;
  opacity: 1;
  visibility: visible;
  /*top: 100px;*/
  
  /* == */
  left:250px;
  /* == */
}
/*.mcd-menu li ul li {
  float: none;
}*/
.mcd-menu li ul li a {
  padding: 10px;
  text-align: left;
  border: 0;
  border-bottom: 1px solid #EEE;
  
  /* == */
  height: auto;
  /* == */
}
.mcd-menu li ul li a i {
  font-size: 16px;
  display: inline-block;
  margin: 0 10px 0 0;
}
.mcd-menu li ul li ul {
  left: 230px;
  top: 0;
  border: 0;
  border-left: 4px solid #e67e22;
}  
.mcd-menu li ul li ul:before {
  content: "";
  position: absolute;
  top: 15px;
  /*left: -14px;*/
  /* == */
  left: -9px;
  /* == */
  border-right: 5px solid #e67e22;
  border-bottom: 5px solid transparent;
  border-top: 5px solid transparent;
}
.mcd-menu li ul li:hover > ul {
  top: 0px;
  left: 200px;
}



/*.mcd-menu li.float {
  float: right;
}*/
.mcd-menu li a.search {
  /*padding: 29px 20px 30px 10px;*/
  padding: 10px 10px 15px 10px;
  clear: both;
}
.mcd-menu li a.search i {
  margin: 0;
  display: inline-block;
  font-size: 18px;
}
.mcd-menu li a.search input {
  border: 1px solid #EEE;
  padding: 10px;
  background: #FFF;
  outline: none;
  color: #777;
  
  /* == */
  width:170px;
  float:left;
  /* == */
}
.mcd-menu li a.search button {
  border: 1px solid #e67e22;
  /*padding: 10px;*/
  background: #e67e22;
  outline: none;
  color: #FFF;
  margin-left: -4px;
  
  /* == */
  float:left;
  padding: 10px 10px 11px 10px;
  /* == */
}
.mcd-menu li a.search input:focus {
  border: 1px solid #e67e22;
}





@media only screen and (min-width: 960px) and (max-width: 1199px) {
    .mcd-menu {
		margin-left:10px;
	}
}

@media only screen and (min-width: 768px) and (max-width: 959px) {
    .mcd-menu {
		width: 200px;
	}
	.mcd-menu li a {
		height:30px;
	}
	.mcd-menu li a i {
		font-size: 22px;
	}
	.mcd-menu li a strong {
		font-size: 12px;
	}
	.mcd-menu li a small {
		font-size: 10px;
	}	
	.mcd-menu li a.search input {
		width: 120px;
		font-size: 12px;
	}
	.mcd-menu li a.search buton{
		padding: 8px 10px 9px 10px;
	}
	.mcd-menu li > ul {
		min-width:180px;
	}
	.mcd-menu li:hover > ul {
		min-width:180px;
		left:200px;
	}
	.mcd-menu li ul li > ul, .mcd-menu li ul li ul li > ul {
		min-width:150px;
	}
	.mcd-menu li ul li:hover > ul {
		left:180px;
		min-width:150px;
	}
	.mcd-menu li ul li ul li:hover > ul {
		left:150px;
		min-width:150px;
	}
	.mcd-menu li ul a {
		font-size:12px;
	}
	.mcd-menu li ul a i {
		font-size:14px;
	}
}

@media only screen and (min-width: 480px) and (max-width: 767px) {
	
	.mcd-menu { 
		width: 50px;
	}
	.mcd-menu li a { 
		position: relative;
		padding: 12px 16px;
		height:20px;
	}
	.mcd-menu li a small { 
		display: none;
	}
	.mcd-menu li a strong { 
		display: none;
	}
	.mcd-menu li a:hover strong,.mcd-menu li a.active strong {
		display:block;
		font-size:10px;
		padding:3px 0;
		position:absolute;
		bottom:0px;
		left:0;
		background:#e67e22;
		color:#FFF;
		min-width:100%;
		text-transform:lowercase;
		font-weight:normal;
		text-align:center;
	}
	.mcd-menu li .search { 
		display: none;
	}
	
	.mcd-menu li > ul {
		min-width:180px;
		left:70px;
	}
	.mcd-menu li:hover > ul {
		min-width:180px;
		left:50px;
	}
	.mcd-menu li ul li > ul, .mcd-menu li ul li ul li > ul {
		min-width:150px;
	}
	.mcd-menu li ul li:hover > ul {
		left:180px;
		min-width:150px;
	}
	.mcd-menu li ul li ul li > ul {
		left:35px;
		top: 45px;
		border:0;
		border-top:4px solid #e67e22;
	}
	.mcd-menu li ul li ul li > ul:before {
		left:30px;
		top: -9px;
		border:0;
		border-bottom:5px solid #e67e22;
		border-left:5px solid transparent;
		border-right:5px solid transparent;
	}
	.mcd-menu li ul li ul li:hover > ul {
		left:30px;
		min-width:150px;
		top: 35px;
	}
	.mcd-menu li ul a {
		font-size:12px;
	}
	.mcd-menu li ul a i {
		font-size:14px;
	}
	
}

@media only screen and (max-width: 479px) {
    .mcd-menu { 
		width: 50px;
	}
	.mcd-menu li a { 
		position: relative;
		padding: 12px 16px;
		height:20px;
	}
	.mcd-menu li a small { 
		display: none;
	}
	.mcd-menu li a strong { 
		display: none;
	}
	.mcd-menu li a:hover strong,.mcd-menu li a.active strong {
		display:block;
		font-size:10px;
		padding:3px 0;
		position:absolute;
		bottom:0px;
		left:0;
		background:#e67e22;
		color:#FFF;
		min-width:100%;
		text-transform:lowercase;
		font-weight:normal;
		text-align:center;
	}
	.mcd-menu li .search { 
		display: none;
	}
	
	.mcd-menu li > ul {
		min-width:180px;
		left:70px;
	}
	.mcd-menu li:hover > ul {
		min-width:180px;
		left:50px;
	}
	.mcd-menu li ul li > ul, .mcd-menu li ul li ul li > ul {
		min-width:150px;
	}
	.mcd-menu li ul li:hover > ul {
		left:180px;
		min-width:150px;
	}
	.mcd-menu li ul li ul li > ul {
		left:35px;
		top: 45px;
		border:0;
		border-top:4px solid #e67e22;
	}
	.mcd-menu li ul li ul li > ul:before {
		left:30px;
		top: -9px;
		border:0;
		border-bottom:5px solid #e67e22;
		border-left:5px solid transparent;
		border-right:5px solid transparent;
	}
	.mcd-menu li ul li ul li:hover > ul {
		left:30px;
		min-width:150px;
		top: 35px;
	}
	.mcd-menu li ul a {
		font-size:12px;
	}
	.mcd-menu li ul a i {
		font-size:14px;
	}
    
}	



/*
 * WTF, forms?
 * Released under MIT and copyright 2014 Mark Otto.
 * http://wtfforms.com
 *
 * Embedded icons from Open Iconic.
 * Released under MIT and copyright 2014 Waybury.
 * http://useiconic.com/open
 */



/*
 * Checkboxes and radios
 */

.control {
  position: relative;
  display: inline-block;
  padding-left: 1.5rem;
  color: #555;
  cursor: pointer;
}
.control input {
  position: absolute;
  opacity: 0;
  z-index: -1; /* Put the input behind the label so it doesn't overlay text */
}
.control-indicator {
  position: absolute;
  top: .25rem;
  left: 0;
  display: block;
  width:  1rem;
  height: 1rem;
  line-height: 1rem;
  font-size: 65%;
  color: #eee;
  text-align: center;
  background-color: #eee;
  background-size: 50% 50%;
  background-position: center center;
  background-repeat: no-repeat;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

/* Hover state */
/* Uncomment if you need it, but be aware of the sticky iOS states.
.control:hover .control-indicator {
  color: #fff;
  background-color: #ccc;
}
*/

/* Focus */
.control input:focus ~ .control-indicator {
  box-shadow: 0 0 0 .075rem #fff, 0 0 0 .2rem #0074d9;
}

/* Checked state */
.control input:checked ~ .control-indicator {
  color: #fff;
  background-color: #0074d9;
}

/* Active */
.control input:active ~ .control-indicator {
  color: #fff;
  background-color: #84c6ff;
}

/* Checkbox modifiers */
.checkbox .control-indicator {
  border-radius: .25rem;
}
.checkbox input:checked ~ .control-indicator {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNy4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgOCA4IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA4IDgiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHBhdGggZmlsbD0iI0ZGRkZGRiIgZD0iTTYuNCwxTDUuNywxLjdMMi45LDQuNUwyLjEsMy43TDEuNCwzTDAsNC40bDAuNywwLjdsMS41LDEuNWwwLjcsMC43bDAuNy0wLjdsMy41LTMuNWwwLjctMC43TDYuNCwxTDYuNCwxeiINCgkvPg0KPC9zdmc+DQo=);
}

/* Radio modifiers */
.radio .control-indicator {
  border-radius: 50%;
}
.radio input:checked ~ .control-indicator {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNy4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgOCA4IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA4IDgiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHBhdGggZmlsbD0iI0ZGRkZGRiIgZD0iTTQsMUMyLjMsMSwxLDIuMywxLDRzMS4zLDMsMywzczMtMS4zLDMtM1M1LjcsMSw0LDF6Ii8+DQo8L3N2Zz4NCg==);
}

/* Alternately, use another character */
.control-x input:checked ~ .control-indicator {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNy4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iOHB4IiBoZWlnaHQ9IjhweCIgdmlld0JveD0iMCAwIDggOCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgOCA4IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiNGRkZGRkYiIGQ9Ik0xLjQsMEwwLDEuNGwwLjcsMC43bDEuOCwxLjhMMC43LDUuN0wwLDYuNGwxLjQsMS40bDAuNy0wLjdsMS44LTEuOGwxLjgsMS44bDAuNywwLjdsMS40LTEuNEw3LjEsNS43DQoJTDUuMywzLjlsMS44LTEuOGwwLjctMC43TDYuNCwwTDUuNywwLjdMMy45LDIuNUwyLjEsMC43QzIuMSwwLjcsMS40LDAsMS40LDB6Ii8+DQo8L3N2Zz4NCg==);
}
.control-dash input:checked ~ .control-indicator {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNy4xLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iOHB4IiBoZWlnaHQ9IjhweCIgdmlld0JveD0iMCAwIDggOCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgOCA4IiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiNGRkZGRkYiIGQ9Ik0wLDN2Mmg4VjNIMHoiLz4NCjwvc3ZnPg0K)
}



/*
 * Select
 */

.select {
  position: relative;
  display: inline-block;
  color: #555;
}
.select select {
  display: inline-block;
  width: 100%;
  margin: 0;
  padding: .5rem 2.25rem .5rem 1rem;
  line-height: 1.5;
  color: #555;
  background-color: #eee;
  border: 0;
  border-radius: .25rem;
  cursor: pointer;
  outline: 0;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
/* Undo the Firefox inner focus ring */
.select select:focus:-moz-focusring {
  color: transparent;
  text-shadow: 0 0 0 #000;
}
/* Dropdown arrow */
.select:after {
  position: absolute;
  top: 50%;
  right: 1.25rem;
  display: inline-block;
  content: "";
  width: 0;
  height: 0;
  margin-top: -.15rem;
  pointer-events: none;
  border-top: .35rem solid;
  border-right: .35rem solid transparent;
  border-bottom: .35rem solid transparent;
  border-left: .35rem solid transparent;
}

/* Hover state */
/* Uncomment if you need it, but be aware of the sticky iOS states.
.select select:hover {
  background-color: #ddd;
}
*/

/* Focus */
.select select:focus {
  box-shadow: 0 0 0 .075rem #fff, 0 0 0 .2rem #0074d9;
}

/* Active/open */
.select select:active {
  color: #fff;
  background-color: #0074d9;
}

/* Hide the arrow in IE10 and up */
.select select::-ms-expand {
  display: none;
}

/* Media query to target Firefox only */
@-moz-document url-prefix() {
  /* Firefox hack to hide the arrow */
  .select select {
    text-indent: 0.01px;
    text-overflow: '';
    padding-right: 1rem;
  }

  /* <option> elements inherit styles from <select>, so reset them. */
  .select option {
    background-color: #fff;
  }
}

/* IE9 hack to hide the arrow */
@media screen and (min-width:0\0) {
  .select select {
    z-index: 1;
    padding: .5rem 1.5rem .5rem 1rem;
  }
  .select:after {
    z-index: 5;
  }
  .select:before {
    position: absolute;
    top: 0;
    right: 1rem;
    bottom: 0;
    z-index: 2;
    content: "";
    display: block;
    width: 1.5rem;
    background-color: #eee;
  }
  .select select:hover,
  .select select:focus,
  .select select:active {
    color: #555;
    background-color: #eee;
  }
}


.datepicker td, .datepicker th {
	font-size:14px;}
	
	
.cont_flex{
	display:flex;justify-content: center;
	flex-wrap: wrap;
	margin: 0;
    margin-bottom: 0px;
    margin-left: 0px;
	padding: 0;
`	list-style: none;
	}
	
.cont_flex > * {
    /*width: 33.32223%;*/
	width: 50%; 
}	

.has-text-left {
    text-align: left !important;
}
	
.card {	
	background-color: #fff;
	border-radius: .25rem;
	box-shadow: 0 .5em 2em 1em rgba(10,10,10,.1),0 0 0 1px rgba(10,10,10,.1);
	color: #4a4a4a;
	max-width: 89%;
	height:500px;
	position: relative;margin-bottom:35px;	
	border-top-left-radius: .95rem;
    border-top-right-radius: .95rem;
	}

.card-image {
    display: block;
    position: relative;
}

.card-image:first-child img {
    border-top-left-radius: .95rem;
    border-top-right-radius: .95rem;
	object-fit: cover;
	height: 221px;
	width: 100%;
}

.card-content{
	height:150px;
	padding:5px 25px;
	}
	
.card-content h3{
	font-size:16px;
	text-align: center !important;
	font-weight:bold;
	}

.card-content .demo > div {
    max-height: 150px;
    overflow: auto;
}

.card-footer{
	display:flex;height:32px;justify-content:center;margin-top:70px;}

.menulogin{
	display:none;	}
.tombolku{
	margin-top:15px;	}
.nonorm{
	display:none;	}
.norm{
	display:block;	}	

.wise-iframe-wrapper { position: relative; padding-bottom: 56.10%; height: 0; overflow: hidden; } .wise-iframe-wrapper iframe, .wise-iframe-wrapper object, .wise-iframe-wrapper embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }