html {
  position: relative;
  min-height: 100%;
}
body {
  /* Margin bottom by footer height */
	margin-top:100px;
	margin-bottom: 40px;
	  /* Background image is centered vertically and horizontally at all times */
	  background-position: center center;
	  
	  /* Background image doesn't tile */
	  background-repeat: repeat;

	  background-attachment: fixed;
background:url(../img/boxed-bgx.jpg) repeat fixed;
  
}
.set-radius-zero {
    border-radius: 0px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: #C3C3C3;
    border: none ; 
    color: #FFFFFF !important;
} 

.atas {
   background-color: #06F;
           
        }
		
.container {
  width: 90%;
}
		
.pagination>.active>a, .pagination>.active>span, .pagination>.active>a:hover, .pagination>.active>span:hover, .pagination>.active>a:focus, .pagination>.active>span:focus {

  background-color: #06F;
  border-color: #84BFF2;
  
}

.navbar-default {
  background-color: #00CCFF;
  border-color: #e7e7e7;
    border-bottom: 4px solid #fcab0e;
	     border-top: 4px solid #F00;
}
.navbar-inverse {
    padding-left: 60px;
    padding-right: 20px;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#2c539e+0,2c539e+100;Blue+3D+%232 */
background: rgb(44,83,158); /* Old browsers */
background: -moz-linear-gradient(45deg,  rgba(44,83,158,1) 0%, rgba(44,83,158,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(45deg,  rgba(44,83,158,1) 0%,rgba(44,83,158,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(45deg,  rgba(44,83,158,1) 0%,rgba(44,83,158,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2c539e', endColorstr='#2c539e',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    border-color: #E7E7E7;
	  border-bottom: 4px solid #fcab0e;
	     border-top: 4px solid #F00;
		 padding-bottom:5px;

}
.navbar .nav > li {
    display: block;
    float: left;
}
.navbar .nav > li > a {
    float: none;
    padding: 10px 10px 11px;
    line-height: 19px;
    color: #ffffff;
    text-decoration: none;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}
.navbar .nav > li > a:hover {
    background-color: transparent;
    color: #ffffff;
    text-decoration: none;
}

.brand {
	padding: 4px 20px !important;
}

.sidebar-nav {
    padding: 9px 0;
}


.nav-tabs .dropdown-menu, .nav-pills .dropdown-menu, .navbar .dropdown-menu {
    margin-top: 0;
}

.navbar .sub-menu:before {
    border-bottom: 7px solid transparent;
    border-left: none;
    border-right: 7px solid rgba(0, 0, 0, 0.2);
    border-top: 7px solid transparent;
    left: -7px;
    top: 10px;
}
.navbar .sub-menu:after {
    border-top: 6px solid transparent;
    border-left: none;
    border-right: 6px solid #fff;
    border-bottom: 6px solid transparent;
    left: 10px;
    top: 11px;
    left: -6px;
}


.footer {
  position: absolute;
   border-top: 4px solid #FFF;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 40px;
  /*background-color: #f5f5f5;*/
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f9fcf7+0,f5f9f0+100;L+Green+3D */
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#2c539e+0,2c539e+100;Blue+3D+%232 */
background: rgb(44,83,158); /* Old browsers */
background: -moz-linear-gradient(45deg,  rgba(44,83,158,1) 0%, rgba(44,83,158,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(45deg,  rgba(44,83,158,1) 0%,rgba(44,83,158,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(45deg,  rgba(44,83,158,1) 0%,rgba(44,83,158,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2c539e', endColorstr='#2c539e',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

  color:#FFFFFF;
}


/* Custom page CSS
-------------------------------------------------- */
/* Not required for template or sticky footer method. */

.vertical-center{
	min-height: 95%;  /* Fallback for browsers do NOT support vh unit */
	min-height: 95vh; /* These two lines are counted as one :-)       */
	 display: -webkit-flex; /* Safari */
    -webkit-align-items: center; /* Safari 7.0+ */
	display: flex;
	align-items: center;
	max-width:400px;
}

.container .text-muted {
  margin: 10px 0;
  color:#FFF;
}

.footer > .container {
  padding-right: 15px;
  padding-left: 15px;
}

code {
  font-size: 80%;
}

/* navbar */

.navbar{
	 
  min-height: 80px;
  border:0px solid transparent;
  border-radius:0;
}
.navbar-brand{
	margin-top:-12px;
	
}
.navbar-title{
  float: left;
  max-width:400px;
  border:0px solid #fff;
  margin-top:10px;
  margin-left:0px;
}

.nama-sms:hover,
.nama-sms:focus {
  text-decoration: none;
  color:#FFF;
}

.nama-sms{
   display:block;
   color:#FFF;
   font-size: 18px;
  line-height: 20px;
}
p.alamat-sms{
   display:block;
   color:#FFF;
   font-size:0.8em;
   border:0px solid #fff;
   margin-bottom:0;
}

.navbar-nav{
	border:0px solid #fff;
	margin-top:10px;

}

/* Profile sidebar */
.profile-sidebar {
  padding: 20px 0 10px 0;
  background: #fff;
}

.profile-userpic img {
  float: none;
  margin: 0 auto;
  width: 80px;
  height: 80px;
  -webkit-border-radius: 50% !important;
  -moz-border-radius: 50% !important;
  border-radius: 50% !important;
}

.profile-usertitle {
  text-align: center;
  margin-top: 20px;
}

.profile-usertitle-name {
  color: #5a7391;
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 7px;
}

.profile-usertitle-job {
  text-transform: uppercase;
  color: #5b9bd1;
  font-size: 12px;
  font-weight: 600;
  margin-bottom: 15px;
}

.profile-userbuttons {
  text-align: center;
  margin-top: 10px;
}

.profile-userbuttons .btn {
  text-transform: uppercase;
  font-size: 11px;
  font-weight: 600;
  padding: 6px 15px;
  margin-right: 5px;
}

.profile-userbuttons .btn:last-child {
  margin-right: 0px;
}
    
.profile-usermenu {
  margin-top: 30px;
}

.profile-usermenu ul li {
  border-bottom: 1px solid #f0f4f7;
}

.profile-usermenu ul li:last-child {
  border-bottom: none;
}

.profile-usermenu ul li a {
  color: #93a3b5;
  font-size: 14px;
  font-weight: 400;
}

.profile-usermenu ul li a i {
  margin-right: 8px;
  font-size: 14px;
}

.profile-usermenu ul li a:hover {
  background-color: #fafcfd;
  color: #5b9bd1;
}

.profile-usermenu ul li.active {
  border-bottom: none;
}

.profile-usermenu ul li.active a {
  color: #5b9bd1;
  background-color: #f6f9fb;
  border-left: 2px solid #5b9bd1;
  margin-left: -2px;
}
/*.dropdown-submenu.pull-left>.dropdown-menu {
	left: 100%	
}*/
.breaking-news {
	display: block;
	margin-bottom: 20px;
	background: #fff;
	box-shadow: 0px 3px 0px 0px rgba(0,0,0,0.04);
	position: relative;
	overflow: hidden;
}

.breaking-news:after {
	display: block;
	content: '';
	position: absolute;
	width: 20px;
	background: inherit;
	height: 100%;
	top: 0px;
	right: 0px;
	z-index: 10;
	box-shadow: -10px 0px 20px #fff;
}

.breaking-news .the-title {
	display: block;
	position: relative;
	float: left;
	background: #5a9e25;
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	text-transform: uppercase;
	font-family: 'Source Sans Pro', sans-serif;
	padding: 7px 13px;
	z-index: 6;
}

.breaking-news ul {
	position: absolute;
	z-index: 5;
}

.breaking-news ul:after {
	display: block;
	content: '';
	clear: both;
}

.breaking-news .slide_container {
	height: 32px!important;
}

.breaking-news ul li {
	display: block;
	float: left;
	font-weight: 400;
	font-size: 14px;
	font-family: 'Source Sans Pro', sans-serif;
	margin: 6px 0px 0px 0px;
	position: relative;
}

.breaking-news ul li:after {
	display: block;
	position: absolute;
	content: '\25CF';
	font-family: 'Entypo';
	font-size: 8px;
	top: 0px;
	right: -4px;
	color: #c9c9c9;
}

.breaking-news ul li:last-child:after {
	display: none;
}

.breaking-news ul li a {
	display: block;
	padding-left: 13px;
	padding-right: 10px;
}


.chart-wrapper {
  background: #fff;
  border: 1px solid #e2e2e2;
  border-radius: 3px;
  margin-bottom: 10px;
}
.chart-wrapper .chart-title {
  border-bottom: 1px solid #d7d7d7;
  color: #666;
  font-size: 16px;
  font-weight: 200;
  font-family:Arial, Helvetica, sans-serif;
  padding: 7px 10px 4px;
  text-align:center;
}

.chart-wrapper .chart-stage {
  overflow: hidden;
  padding: 5px 10px;
  position: relative;
}

.chart-wrapper .chart-notes {
  background: #fbfbfb;
  border-top: 1px solid #e2e2e2;
  color: #808080;
  font-size: 12px;
  padding: 8px 100px 5px;
  
}
/* EFFECT */
.effect-14 a {
	background-color: #EAEAEA;
	border-radius: 32px;
	font-size: 35px;
	line-height: 65px;
	z-index: 1;
	overflow: visible !important;
}
.effect-14 a:after {
	border-radius: 32px;
	position:absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	-webkit-transform: scale(1.3);
	    -ms-transform: scale(1.3);
	        transform: scale(1.3);
	opacity: 0;
	filter: alpha(opacity=0);
	content: '';
	z-index: -1;
}
.effect-14 a:hover:after {
	-webkit-transform: scale(1.0);
	    -ms-transform: scale(1.0);
	        transform: scale(1.0);
	opacity: 1;
	filter: alpha(opacity=100);
}
.effect-14 a:hover:before{
	color: #FFFFFF;
}

.effect-14 a {
	margin-right: 5px;
}

/* Icon */
.effect-14 .fb:before{
	content: "\f09a";
}
.effect-14 .fb:after {
	background-color: #3b5998;
}
.effect-14 .fb:hover {
    box-shadow: 0 0 0 7px rgba(58, 136, 171, 0.25);
}

/* Github */
.effect-14 .dribbble:before {
	content: "\f17d";
}
.effect-14 .dribbble:after {
	background-color: #F26798;
}
.effect-14 .dribbble:hover {
    box-shadow: 0 0 0 7px rgba(242, 103, 152, 0.25);
}

/* SU */
.effect-14 .su:before {
	content: "\f1a4";
}
.effect-14 .su:after {
	background-color: #5FBB4C;
}
.effect-14 .su:hover {
    box-shadow: 0 0 0 7px rgba(95, 187, 76, 0.25);
}

/* Gplus */
.effect-14 .gplus:before {
	content: "\f0d5";
}
.effect-14 .gplus:after {
	background-color: #d34836;
}
.effect-14 .gplus:hover {
    box-shadow: 0 0 0 7px rgba(211, 72, 54, 0.25);
}

/* Instagram */
.effect-14 .instagram:before {
	content: "\f16d";
}
.effect-14 .instagram:after {
	background-color: #DCAD65;
}
.effect-14 .instagram:hover {
    box-shadow: 0 0 0 7px rgba(220, 173, 101, 0.25);
}

/* Twitter */
.effect-14 .twitter:before {
	content: "\f099";
}
.effect-14 .twitter:after {
	background-color: #4099ff;
}
.effect-14 .twitter:hover {
    box-shadow: 0 0 0 7px rgba(64, 153, 255, 0.25);
}

/* RSS */
.effect-14 .rss:before {
	content: "\f09e";
}
.effect-14 .rss:after {
	background-color: #FF9F5B;
}
.effect-14 .rss:hover {
    box-shadow: 0 0 0 7px rgba(255, 159, 91, 0.25);
}


/* Digg */
.effect-14 .digg:before {
	content: "\f1a6";
}
.effect-14 .digg:after {
	background-color: #79BAFF;
}
.effect-14 .digg:hover {
    box-shadow: 0 0 0 7px rgba(121, 186, 255, 0.25);
}

/* Youtube */
.effect-14 .youtube:before {
	content: "\f167";
}
.effect-14 .youtube:after {
	background-color: #CF2200;
}
.effect-14 .youtube:hover {
    box-shadow: 0 0 0 7px rgba(207, 34, 0, 0.25);
}

/* Vimeo */
.effect-14 .vimeo:before {
	content: "\f27d";
}
.effect-14 .vimeo:after {
	background-color: #85C6FD;
}
.effect-14 .vimeo:hover {
    box-shadow: 0 0 0 7px rgba(133, 198, 253, 0.25);
}

/* Delicious */
.effect-14 .delicious:before {
	content: "\f1a5";
}
.effect-14 .delicious:after {
	background-color: #3F92DC;
}
.effect-14 .delicious:hover {
    box-shadow: 0 0 0 7px rgba(63, 146, 220, 0.25);
}

/* Linkedin */
.effect-14 .linkedin:before {
	content: "\f0e1";
}
.effect-14 .linkedin:after {
	background-color: #4698BD;
}
.effect-14 .linkedin:hover {
    box-shadow: 0 0 0 7px rgba(70, 152, 189, 0.25);
}