.header-blue {
  background-color: #fff;
  padding-bottom: 0px;
  font-family: 'Source Sans Pro', sans-serif;
  color: #000;
}

@media (min-width:768px) {
  .header-blue {
    padding-bottom: 10px;
  }
}

.header-blue .navbar {
  background 	: #fff;
  padding-top 	: .75rem;
  padding-bottom: .75rem;
  color 		: #000;

}

.header-blue .navbar-dark {
  color 		: #000;
}

@media (min-width:768px) {
  .header-blue .navbar {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
}

.navbar-brand{
	display 		: block;
    padding         : 0;
}

.img-fluid{
	width      : auto; 
	height     : auto;
}

@media (max-width:768px) {
  .img-fluid{
       width          : 80%; 
	   height         : auto;
	   text-align     : left;
	   padding-bottom : 0px;
	   padding-left   : 0px;
    }
}

.img-responsive{
    width          : 100%; 
	height         : auto;
	margin-left    : 40px;
	padding-bottom : 0px;
	padding-left   : 0px;
}


@media (max-width:768px) {
  .img-responsive{
       max-width      : 150%; 
	   height         : auto;
	   text-align     : center;
	   padding-bottom : 0px;
	   padding-left   : 0px;
    }
}

.padding-zero{
    padding : 0px;
    margin  : 0px;
}

.home-content{
    padding     : 5px;
    margin-left : 10px;
    margin-top  : 5px;
    margin-right: 10px;
}

@media (max-width:768px) {
  .home-content{
    padding     : 5px;
    margin-left : 0px;
    margin-top  : 5px;
    margin-right: 10px;
}
}

.img-responsive2{
    width          : auto; 
	height         : auto;
	margin         : 0px;
    padding        : 10px;
}

@media (min-width:768px) {
  .img-responsive2{
       width          : auto; 
	   height         : auto;
	   margin-left    : 10px;
       padding        : 10px;
    }
}

.img-profile{
	max-width      : 125%;
	height         : auto;
	margin-left    : 0px;
	padding-bottom : 0px;
	padding-left   : 0px;
}

#home-area{
	margin-top     : 0px;
    background     : linear-gradient(90deg, #ffecb3, #fff);
    padding-top    : 20px;
    padding-bottom : 0px;
}

.home-feature{
    margin-right    : 60px;
    margin-left     : 0px;
    padding         : -10px;
}

#blog-area{
	margin-top     : 0px;
    background     : #fff;
    padding-top    : 20px;
    padding-bottom : 0px;
}

.tebel{
	font-size      : 18px;
	font-weight    : bold;
}

.tebel2{
	font-size      : 28px;
	font-weight    : bold;
}

.tebal{
	font-size      : 20px;
}

@media (max-width:768px) {
    .tebel{
	   font-size      : 18px;
	   font-weight    : bold;
    }
    .tebel2{
	   font-size      : 24px;
	   font-weight    : bold;
    }
}

.header-blue .navbar .navbar-collapse {
  border-bottom : 1px solid rgba(0,0,0,0.9);
  margin-top    : .5rem;
  color         : #E0C262;
  border-color  : #E0C262;
  padding-bottom: 5px;
}

@media (min-width:768px) {
  .header-blue .navbar .navbar-collapse {
    border-color    : #E0C262;
    margin          : 0;
    color           : #E0C262;
  }
}

.navbar-toggler {
  border-color  : #E0C262;
  background    : #E0C262;
  position      : absolute;
  z-index       : 100;
  margin-top    : 20px;
  margin-left   : 80%;
}

.navbar-toggler:hover {
  border-color: #fff;
  background: #000;
}


.navbar-collapse ul{
	color: #000;
}

.navbar-collapse li{
	color: #000;
}

.navbar-collapse a{
	color: #000;
}

.navbar-nav {
	color: #000;
	font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";
}

.nav-item {
	color: #000;
	font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";
}

.nav-link{
	color: #000;
	font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";
}

@media (min-width: 768px) {
  .header-blue .navbar-nav .nav-link {
    padding-left: .7rem;
    padding-right: .7rem;
	color: #000;
  }
}

@media (min-width: 992px) {
  .header-blue .navbar-nav .nav-link {
    padding-left: 1.2rem;
    padding-right: 1.2rem;
       color: #000;
  }
}

.header-blue .navbar-nav .nav-link{
    color 			: #000;
}

.header-blue .navbar-nav .nav-link:hover {
    padding-left 	: 1.2rem;
    padding-right 	: 1.2rem;
    color 			: #E0C262;
}

.header-blue .action-button, .header-blue .action-button:not(.disabled):active {
  border        : 1px solid #E0C262;;
  border-radius : 40px;
  color         : #000;
  box-shadow    : none;
  text-shadow   : none;
  padding       : .3rem .8rem;
  background    : #E0C262;
  transition    : background-color 0.25s;
  outline       : none;
  margin-bottom : 20px;
  font-size 	: 16px;
}

.header-blue .action-button:hover {
  color         : #E0C262;
  background    : #fff;
}

.dropdown{
    margin-top: 3px;    
}

.btn-primary{
    border-color: #E0C262;
    background: #fff;
    color: #000;
}

.btn-primary:hover{
    border-color: #fff;
    background: #E0C262;
    color: #fff;
}

.btn-primary:checked{
    border-color: #fff;
    background: #000;
    color: #fff;
}

.centered{
	text-align: center;
    padding-top: 50px;
}

@media (max-width: 992px) {
  .centered{
	   text-align: center;
       padding-top: 10px;
       padding-left: 25px;
    }
}

.grafo{
    min-width: 250px;
	height: 50px;
	white-space: normal;
}

.titleSentence{
    display: block;
    margin-bottom: 50px;
}

.kuningtransparanRadius{
    background: #FFFBBE;
    padding: 20px;
    padding-top: 90px;
	border-radius: 50px;
}

.borderputih{
    padding: 10px;
	border : 5px solid rgba(255,255,255,1);
	border-radius: 20px;
	border-color: #fff;
	margin-top: 5px;
	margin-bottom: 5px;
}

.kuningtransparan{
    background: #FFFBBE;
    padding: 10px;
}

.hurufKeren{
    font-style: italic;
}

.warnabiru{
    color: darkcyan;
}

.besarDanMerah{
    color: crimson;
    font-size: 26px;
    font-style: italic;
    font-weight: bold;
}

.kecilDanBiru{
    display: block;
    color: dodgerblue;
    font-size: 11px;
    font-style: italic;
}

.document{
    display: block;
    width   : 20%; 
    height  : auto ;
}

@media (max-width: 768px) {
    .document{
    display: block;
    width   : 30%; 
    height  : auto ;
}
    
.redBack{
    background-color: crimson;
}