.bg-login {

	background:linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.85)), url(assets/img/bg1.jpg); 

	background-size:cover;

	background-position:center;

	background-repeat:no-repeat;

}



.bg {

	background:linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url(assets/img/bg1.png);

	background-size:cover;

	background-repeat:no-repeat;

}




.row {

	margin-left: -10px;

	margin-right: -10px;

}



.red {

	color: red;

}



.content-header > .breadcrumb {

	color: #fff;

	border-radius: 0px;

	/*border-top-color: #FC9544;*/

	border-top: 1px solid #FC9544;

	border-bottom: 1px solid #FC9544;

}



.content-header > .breadcrumb > li > a {

	color: #fff;

}



.label {

	border-radius: 0px;

}



.notif {

	position:absolute; 

	right:0; 

	font-size:16px; 

	float:right;

}



.top {

	margin-top: 20px;

}



.content-header {

	color: #fff;

}



.ribbon {

	font-size: 18px !important;

	width: 100%;

	position: relative;

	/*background: linear-gradient(0deg, #069 0%, #09c 99%);*/

	background: #FFD72A;

	/*color: #fff;*/

	text-align: center;

	padding: 0.3em 0em;

	margin: 2em auto;

}



.ribbon:before,.ribbon:after{

	content: "";

	position: absolute;

	display: block;

	bottom: -1em;

	border: 1.5em solid #FECC30;

	z-index: -1;

}

.ribbon:before{

	left: -2em;

	border-left-color: transparent;

}

.ribbon:after{

	right: -2em;

	border-right-color: transparent;

}

.ribbon-folds:before,.ribbon-folds:after{

	content: "";

	position: absolute;

	display: block;

	border-style: solid;

	border-color: #FC9544 transparent;

	bottom: -1em;

}

.ribbon-folds:before{

	left: 0;

	border-width: 1em 0 0 1em;

}

.ribbon-folds:after{

	right: 0;

	border-width: 1em 1em 0 0;

}

.ribbon-z-index{

	position: relative;

	z-index: 1;

}



.hexagon {

	width: 100px;

	height: 55px;

	background: red;

	position: relative;

}

.hexagon:before {

	content: "";

	position: absolute;

	top: -25px;

	left: 0;

	width: 0;

	height: 0;

	border-left: 50px solid transparent;

	border-right: 50px solid transparent;

	border-bottom: 25px solid red;

}

.hexagon:after {

	content: "";

	position: absolute;

	bottom: -25px;

	left: 0;

	width: 0;

	height: 0;

	border-left: 50px solid transparent;

	border-right: 50px solid transparent;

	border-top: 25px solid red;

}



.breadcrumb {

	padding: 1px 15px;

	border-radius: 0px;

	border-top-right-radius: 30px;

	border-bottom-left-radius: 40px;

	border-top-color: #FC9544;

	border-top: 3px solid #FC9544;

}



.box.box-default {

	border-top-color: #FC9544;

}



.box-profile {

	border: 1px solid #fff;

	padding: 10px;

	background-color: #fff;

}



.box-button {

	margin-top: 10px;

}



.carousel-caption {

	background-color: #000;

	padding: 45px;

	opacity: 0.7;

	color: #fff;

	right: 5px;

	left: 5px;

	top: 5px;

	bottom: 5px;

}



#chartdiv {

	width: 100%;

	height: 100%;

}

.chartdiv {

	width: 100%;

	height: 100%;

}



.modal{

	overflow: auto !important;

}



.flexer,.progress-indicator{

	display:-webkit-box;

	display:-moz-box;

	display:-ms-flexbox;

	display:-webkit-flex;

	display:flex

}

.no-flexer,.progress-indicator.stacked{

	display:block

}

.no-flexer-element{

	-ms-flex:0;

	-webkit-flex:0;

	-moz-flex:0;

	flex:0

}

.flexer-element,.progress-indicator>li{

	-ms-flex:1;

	-webkit-flex:1;

	-moz-flex:1;

	flex:1

}

.progress-indicator{

	margin:0 0 1em;

	padding:0;

	font-size:80%;

	text-transform:capitalize;

}

.progress-indicator>li{

	list-style:none;

	text-align:center;

	width:auto;

	padding:0;

	margin:0;

	position:relative;

	text-overflow:ellipsis;

	color:#bbb;

	display:block

}

.progress-indicator>li:hover{

	color:#6f6f6f

}

.progress-indicator>li.completed,.progress-indicator>li.completed .bubble{

	color:#65d074;

}

.progress-indicator>li.process,.progress-indicator>li.process .bubble{

	color:#000;

}

.progress-indicator>li.completed-perubahan,.progress-indicator>li.completed-perubahan .bubble{

	color:#2986CC;

}

.progress-indicator>li.process-perubahan,.progress-indicator>li.process-perubahan .bubble{

	color:#000;

}

.progress-indicator>li .bubble{

	border-radius:1000px;

	width:20px;

	height:20px;

	background-color:#bbb;

	display:block;

	margin:0 auto .5em;

	border-bottom:1px solid #888

}

.progress-indicator>li .bubble:after,.progress-indicator>li .bubble:before{

	display:block;

	position:absolute;

	top:9px;

	width:100%;

	height:3px;

	content:'';

	background-color:#bbb

}

.progress-indicator>li.completed .bubble,.progress-indicator>li.completed .bubble:after,.progress-indicator>li.completed .bubble:before{

	background-color: #65d074;

	border-color: #247830

}

.progress-indicator>li.process .bubble,.progress-indicator>li.process .bubble:after,.progress-indicator>li.process .bubble:before{

	background-color: #fecc00;

	border-color: #fecc00

}

.progress-indicator>li.completed-perubahan .bubble,.progress-indicator>li.completed-perubahan .bubble:after,.progress-indicator>li.completed-perubahan .bubble:before{

	background-color: #2986CC;

	border-color: #247830

}

.progress-indicator>li.process-perubahan .bubble,.progress-indicator>li.process-perubahan .bubble:after,.progress-indicator>li.process-perubahan .bubble:before{

	background-color: #fecc00;

	border-color: #fecc00

}

.progress-indicator>li .bubble:before{

	left:0

}

.progress-indicator>li .bubble:after{

	right:0

}

.progress-indicator>li:first-child .bubble:after,.progress-indicator>li:first-child .bubble:before{

	width:50%;

	margin-left:50%

}

.progress-indicator>li:last-child .bubble:after,.progress-indicator>li:last-child .bubble:before{

	width:50%;

	margin-right:50%

}

.progress-indicator>li.active,.progress-indicator>li.active .bubble{

	color:#337AB7

}

.progress-indicator>li.active .bubble,.progress-indicator>li.active .bubble:after,.progress-indicator>li.active .bubble:before{

	background-color:#337AB7;

	border-color:#122a3f

}

.progress-indicator>li a:hover .bubble,.progress-indicator>li a:hover .bubble:after,.progress-indicator>li a:hover .bubble:before{

	background-color:#5671d0;

	border-color:#1f306e

}

.progress-indicator>li a:hover .bubble{

	color:#5671d0

}

.progress-indicator>li.danger .bubble,.progress-indicator>li.danger .bubble:after,.progress-indicator>li.danger .bubble:before{

	background-color:#d3140f;

	border-color:#440605

}

.progress-indicator>li.danger .bubble{

	color:#d3140f

}

.progress-indicator>li.warning .bubble,.progress-indicator>li.warning .bubble:after,.progress-indicator>li.warning .bubble:before{

	background-color:#edb10a;

	border-color:#5a4304

}

.progress-indicator>li.warning .bubble{

	color:#edb10a

}

.progress-indicator>li.info .bubble,.progress-indicator>li.info .bubble:after,.progress-indicator>li.info .bubble:before{

	background-color:#5b32d6;

	border-color:#25135d

}

.progress-indicator>li.info .bubble{

	color:#5b32d6

}

.progress-indicator.stacked>li{

	text-indent:-10px;

	text-align:center;

	display:block

}

.progress-indicator.stacked>li .bubble:after,.progress-indicator.stacked>li .bubble:before{

	left:50%;

	margin-left:-1.5px;

	width:3px;

	height:100%

}

.progress-indicator.stacked .stacked-text{

	position:relative;

	z-index:10;

	top:0;

	margin-left:60%!important;

	width:45%!important;

	display:inline-block;

	text-align:left;

	line-height:1.2em

}

.progress-indicator.stacked>li a{

	border:none

}

.progress-indicator.stacked.nocenter>li .bubble{

	margin-left:0;

	margin-right:0

}

.progress-indicator.stacked.nocenter>li .bubble:after,.progress-indicator.stacked.nocenter>li .bubble:before{

	left:10px

}

.progress-indicator.stacked.nocenter .stacked-text{

	width:auto!important;

	display:block;

	margin-left:40px!important

}

@media handheld,screen and (max-width:400px){

	.progress-indicator{

		font-size:60%

	}

}