@import url(//fonts.googleapis.com/css?family=Kaushan+Script|Oswald);
body{background-color:#013513;color:#404040;
	background-image:url(uploads/pengaturan/header-elearning.jpg);background-attachment:;
padding-bottom: 20px;}

a{color: #367fa9}
a:hover{color: #ba390e}

h1{font-size:24px}
h2{font-size:18px}
h3{font-size:16px}

header{padding: 0px}
header .left img.logo{max-height: 150px}
header .text{color:#144c33;margin-top: 20px}
header h1{margin:0;margin-bottom: 10px}

.top-info{padding: 10px;background: linear-gradient(to top, #ddd, #fff);}
.top-menu{border-top: 1px solid #fff}

.main{background: linear-gradient(to bottom, #ffffff, #fff, #fff);color:#000000;padding: 10px 0;border-bottom: 10px solid #b0b5b4}
.main .content{background: #fff}
.main .content .section-title{box-shadow: none;border-top-left-radius: 0;border-top-right-radius: 0;}
.main .content .section-content{padding: 10px}
.main .sidebar-left{padding-left: 10px}
.main .sidebar-right{padding-right: 10px}
.main .content-left {padding-left: 10px;padding-right: 10px;}

header h3{margin:0;margin-bottom: 10px;line-height: 1.5}

.section-item{margin-bottom: 15px}
.section-title{background: linear-gradient(to top,#efefef, #fff);padding:7px 10px;color:#404040;border:1px solid #efefef;box-shadow:1px 1px 0 #e0e0e0 inset;border-top-left-radius:4px;border-top-right-radius:4px;margin-top:0;font-family:Oswald, Arial, Open Sans;}
.section-title:after{position:absolute;left:0;bottom:-8px;width:100%;display:block;content:""}
.section-title.no-margin{margin-bottom: 0}

::selection {
  color: #f9f9f9;
  background: #08b76d; /* WebKit/Blink Browsers */
}
::-moz-selection {
  color: #f9f9f9;
  background: #08b76d; /* Gecko Browsers */
}

.sidebar-item{margin-bottom:15px}

footer.content {
	color: #ffffff;
	padding-top: 10px;
	padding-bottom: 10px;
	background: linear-gradient(to bottom, #013513, #080000);
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	box-shadow: 0px 1px 10px 1px black;
}
footer a {color:#ffffff;}
footer.main p{text-align:justify}

.bottom{padding-top:20px;padding-bottom:10px}
.bottom-title{margin-top:0}

ol.block-list{counter-reset:li;list-style:none;*list-style:decimal;padding:0;text-shadow:0 1px 0 rgba(255,255,255,.5);padding-bottom: 10px}
ol.block-list ol{margin:0 0 0 2em}
.block-list a{position:relative;display:block;padding:.4em .4em .4em .8em;margin:.5em 0 .5em 2.5em;text-decoration:none;transition:all .3s ease-out}
.block-list a:before{content:counter(li);counter-increment:li;position:absolute;left:-2.5em;top:50%;margin-top:-1em;background:#efefef;height:2em;width:2em;line-height:2em;text-align:center;color: #404040}
.block-list a:after{position:absolute;content:'';border:.5em solid transparent;left:-1em;top:50%;margin-top:-.5em;transition:all .3s ease-out}
.block-list a:hover:after{left:-.5em;border-left-color:#efefef}

.komentar-list dd{margin-bottom:5px;padding-bottom:5px;border-bottom:1px dashed #e0e0e0}
.komentar-list dd:last-child{margin-bottom:0;border-bottom:none}

.sidebar-menu{list-style: none;padding: 0;margin:0}
.sidebar-menu li{padding: 8px 15px;border-bottom: 1px solid #efefef !important;position: relative;}
.sidebar-menu li:hover:after{width: 4px;}
.sidebar-menu li:after{position: absolute;height: 100%;width: 0;background: #404040;left: 0;top: 0;display: block;content: "";transition: width .3s ease}
.sidebar-menu li:last-child{border-bottom: none;}
.sidebar-menu li a{display: block}
.sidebar-menu li.dropdown span{float: right;}
.sidebar-menu li.dropdown:hover ul{display: block;}
.sidebar-menu li ul.menu-dropdown{padding: 0;list-style-position: inside;list-style-type: square;display: none}
.sidebar-menu li ul.menu-dropdown li{border-bottom: none;padding: 5px 0px}
.sidebar-left h3 {
	border-radius: 0 123px 0 0;
	border-right: 8px solid #044200;
}
.sidebar-right h3 {
	border-radius: 123px 0 0 0;
	border-left: 8px solid #044200;
}

.artikel-list article{margin-bottom: 10px;border-bottom: 1px dashed #b0b5b4;margin-bottom: 10px;padding-top: 0;padding-bottom: 10px}
.artikel-list article:last-child{border-bottom: none;padding-bottom: 0;margin-bottom: 0}
.artikel-list .title{margin: 0}
.artikel-list p{margin-top: 5px;text-align: justify;}
.artikel-list img{max-width: 150px;width: 100%;padding: 3px;border: 1px solid #EAEAEA;}
.artikel li { 
	list-style-position: outside;
	margin: 0 0 5px 25px;
	padding: 0 5px;
}
.artikel-list figure {
    width: 100%;
    height: auto;
    overflow: hidden;
}
.artikel-list figure img{transition: .5s ease}
.artikel-list figure img:hover{transform: scale(1.3) rotate(10deg);}

.sb{display:inline-block;padding:5px;background:#efefef;color:#404040}
.sb-fb{border-bottom:4px solid #47639E}
.sb-tweet{border-bottom:4px solid #55ACEE}
.sb-gplus{border-bottom:4px solid #DD4E40}
.sb-whatsapp{border-bottom:4px solid #25D366}

article.artikel{padding: 0 10px}
article.artikel .title{border-bottom: 2px solid #b0b5b4;margin: 0;padding-bottom: 5px;margin-bottom: 5px}
article.artikel .image{margin:10px auto;max-width:95%;text-align:center}
article.artikel .content{padding: 10px 0}
article.artikel .content p{text-align:justify}
article.artikel .content ul,article.artikel .content ol{list-style-position:inside}
article.artikel .foot{padding:5px 0}

.form-komentar{padding: 10px}

.komentar-list{padding: 10px}
.komentar-list .item{padding-bottom: 10px;margin-bottom:10px;border-bottom:1px dashed #e0e0e0}
.komentar-list h3{margin: 0}
.komentar-list .isi{margin-top: 5px}

.form-login{border-left:1px solid #e0e0e0;border-right:1px solid #e0e0e0;border-bottom:1px solid #e0e0e0;padding:10px}
.bottom-menu{padding:0;list-style-position:inside}
.bottom-menu li a{color:#fff}
.paralax-title{line-height: 50px;font-size: 32px;text-align: center;}

.holder{background: #f0f0f0;padding: 10px;margin-bottom: 10px;margin-top: 10px}
.widget-edit{background: #f0f0f0;border: 1px dashed #a0a0a0;padding: 5px;margin-bottom: 10px}
.widget-item{margin-bottom: 15px;background: #fff;border-radius: 3px}
.widget-item .komentar-list{padding: 0 10px}

.ticker{background: #013513 linear-gradient(to bottom, #013513, #077f31);padding: 8px 10px;color: #fff}
.ticker ul{list-style: none;padding: 0;}

.img-thumb{opacity: .7;transition: opacity .5s ease;}
.img-thumb:hover{opacity: 1}
.img-item{height: 150px;margin-bottom: 10px;display: inline-block;}
.gallery-slide img{width: 100%;max-width: 310px;}

.navbar-brand{padding:5px}
.navbar-static-top{margin-bottom: 0}
.navbar-fixed-top{-webkit-box-shadow: 0px 2px 10px -4px rgba(0,0,0,1);-moz-box-shadow: 0px 2px 10px -4px rgba(0,0,0,1);box-shadow: 0px 2px 10px -4px rgba(0,0,0,1);}
.navbar-default{background: #077f31 linear-gradient(to bottom, #077f31, #013513);border-color: #044200;box-shadow: 0px 1px 10px 1px black;}
.navbar-default ul a{color: #ffffff !important;}
.navbar-default .navbar-nav > .active > a, {
    background: #077f31 linear-gradient(to top, #077f31, #013513);color: #FFF;
}
.navbar-default li.active a{color: #404040 !important}
.navbar-default a:focus{color: #333 !important}
.navbar-default ul ul a{color: #404040 !important}
.navbar-brand.visible-xs.judul {
    padding: 12px;
    color: #ffffff ;
    overflow: hidden;
	font-family: 'Kaushan Script', cursive;
	font-weight: 500;
	font-size: 20px;	
}
.navbar-nav>li {
  border-right: 1px solid #044200;
  -moz-box-shadow: 1px 0 0 rgba(255, 255, 255, 0.2);
  -webkit-box-shadow: 1px 0 0 rgba(255, 255, 255, 0.2);
  box-shadow: 1px 0 0 rgba(255, 255, 255, 0.2);
}
.navbar-nav>li:last-child {
  border-right: 0 none;
  -moz-box-shadow: 0 0 0 transparent;
  -webkit-box-shadow: 0 0 0 transparent;
  box-shadow: 0 0 0 transparent;
  -webkit-border-radius: 0 4px 4px 0;
  -moz-border-radius: 0 4px 4px 0;
  border-radius: 0 4px 4px 0;
}
.navbar-nav > li > a:hover{
	color: #FFF;
	background-color: #170202;
}
.navbar-nav > li > a:hover::after {
    content: "";
    position: absolute;
    right: 0px;
    top: 29px;
    border-width: 0 8px 8px;
    border-style: double;
    border-color: transparent transparent #FFF;
    z-index: 200;
    -webkit-animation: fadeInDown .2s ease-in;
    -moz-animation: fadeInDown .2s ease-in;
    animation: fadeInDown .2s ease-in;
}
blockquote {
	display: block;
	position: relative;
	background-color: #FFFAC2;
	color: #077704;
	border-radius: 4px;
	margin: .75em 0;
	padding: 10px 15px
	font-family: Courier New;
}
blockquote:before {
	content: "";
	width: 0;
	height: 0;
	position: absolute;
	bottom: 100%;
	left: 15px;
	border: 7px solid transparent;
	border-color: transparent transparent #FFFAC2
}
blockquote a {
	color: #1474A6;
}
.mystyle  {
	font-family: 'Kaushan Script', cursive, Arial, sans-serif;
	font-size: 200%;
	color: #0c83c5;
	font-weight: bold;
	text-shadow: 4px 4px 4px #BCBCBC;
    -webkit-transform: skew(0deg,-3deg);
    transform: skew(0deg,-3deg);
}
.footstyle  {
	font-family: 'Kaushan Script', cursive, Arial, sans-serif;
	font-size: 24px;
	color: #ffffff;
	font-weight: bold;
	text-shadow: 4px 4px 4px #000;
}
.fotokepsek{
	max-width: 100px;
	max-height: 140px;
	float: left;
	margin: 0px 10px 10px 0px;
	padding: 3px;
	border: 1px solid #EAEAEA;
}
.foto3x4{
	max-width: 150px;
	max-height: 200px;
	float: left;
	margin: 0px 10px 10px 0px;
	padding: 3px;
	border: 1px solid #EAEAEA;
}
.content img:hover {
	 -webkit-filter: brightness(145%);
	 -moz-filter: brightness(145%);
	 -o-filter: brightness(145%);
	 -ms-filter: brightness(145%);
	 filter: brightness(145%);
	-webkit-filter: contrast(120%);
	-moz-filter: contrast(120%);
	-o-filter: contrast(120%);
	-ms-filter: contrast(120%);
	filter: contrast(120%);
	border:1px solid #CCC;
	border-radius:20px;
}

.bottom{
    position: relative;
    padding: 0px 0;
}
.bottom:before {
    content:"";
    margin: 0 auto;
    position: absolute;
    top: 50%; left: 0; right: 0; bottom: 0;
    width: 100%;
    z-index: -1;
}

.social-icons{font-size: 24px;padding: 0 10px}
ul.social-icons{font-size: 24px;}
.social-icons li{vertical-align:top;display:inline;height:100px}
.social-icons a{color:#fff;text-decoration:none}
.social-icon{background-color: #fff;color: #000;position:relative}
.social-icon .fa-facebook{padding:10px 14px;-o-transition:.5s;-ms-transition:.5s;-moz-transition:.5s;-webkit-transition:.5s;transition:.5s;background-color:#3d5b99}
.social-icon .fa-facebook:hover{background-color:#322f30}
.social-icon .fa-twitter{padding:10px 12px;-o-transition:.5s;-ms-transition:.5s;-moz-transition:.5s;-webkit-transition:.5s;transition:.5s;background-color:#00aced}
.social-icon .fa-twitter:hover{background-color:#322f30}
.social-icon .fa-rss{padding:10px 14px;-o-transition:.5s;-ms-transition:.5s;-moz-transition:.5s;-webkit-transition:.5s;transition:.5s;background-color:#eb8231}
.social-icon .fa-rss:hover{background-color:#322f30}
.social-icon .fa-youtube{padding:10px 14px;-o-transition:.5s;-ms-transition:.5s;-moz-transition:.5s;-webkit-transition:.5s;transition:.5s;background-color:#e64a41}
.social-icon .fa-youtube:hover{background-color:#322f30}
.social-icon .fa-linkedin{padding:10px 14px;-o-transition:.5s;-ms-transition:.5s;-moz-transition:.5s;-webkit-transition:.5s;transition:.5s;background-color:#0073a4}
.social-icon .fa-linkedin:hover{background-color:#322f30}
.social-icon .fa-google-plus{padding:10px 9px;-o-transition:.5s;-ms-transition:.5s;-moz-transition:.5s;-webkit-transition:.5s;transition:.5s;background-color:#e25714}
.social-icon .fa-google-plus:hover{background-color:#322f30}
.social-icon .fa-instagram{padding:10px 9px;-o-transition:.5s;-ms-transition:.5s;-moz-transition:.5s;-webkit-transition:.5s;transition:.5s;background-color:#873711}
.social-icon .fa-instagram:hover{background-color:#322f30}


#stream{position:relative;padding-bottom:60%;height:0;overflow:hidden;}
#stream iframe,#stream embed,#stream object{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;border:0px;}
.sticky {
	position: fixed;
	top: 0;
	z-index: +9999;
	margin-left: 0;
	margin-right: 0;
	max-width: 1010px;
	padding-right: 10px;
	width: 100%;
}/
.sticky + .content {
  padding-top: 60px;
}
ul.no-padding{padding: 0;list-style-position: inside}
ul.no-padding li:nth-child(1) {background-color:#A51A5D; padding: 10px 0;
}
ul.no-padding li:nth-child(2) {background-color:#F53477; padding: 10px 0;
}
ul.no-padding li:nth-child(3) {background-color:#FD7FAA; padding: 10px 0;
}
ul.no-padding li:nth-child(4) {background-color:#FF9201; padding: 10px 0;
}
ul.no-padding li:nth-child(5) {background-color:#FDCB01; padding: 10px 0;
}
ul.no-padding li:nth-child(6) {background-color:#DEDB00; padding: 10px 0;
}
ul.no-padding li:nth-child(7) {background-color:#89C237; padding: 10px 0;
}
ul.no-padding li:nth-child(8) {background-color:#44CCF2; padding: 10px 0;
}
ul.no-padding li:nth-child(9) {background-color:#01ACE2; padding: 10px 0;
}
ul.no-padding li:nth-child(10) {background-color:#94368E; padding: 10px 0;
}
ul.no-padding a {
    color: #000;
}
/* facebook comments */
.fbbox-comments {
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	background:#f6f6f6;
	border:1px solid #e5e5e5;
	margin: 0 0 20px;
}
.fb-comments{width: 100% !important;}
.fb-comments iframe[style]{width: 100% !important;}
.fb-comments span{width: 100% !important;}
.fb-comments iframe span[style]{width: 100% !important;}
}
@media all and (max-width: 600px) {
	.navbar-nav>li {
	  border-bottom: 1px solid #044200;
	}
	.navbar-nav>li:last-child {
	  border-bottom: 0 none;
	}
	.navbar-brand > img {
		margin: -2px 0px 0px 10px;
	}
	.sidebar-left, .sidebar-right  {
		padding: 10px;
	}
	.sidebar-left h3, .sidebar-right h3 {
		border-radius: 0 123px 0 0;
		border-right: 8px solid #044200;
		border-left: 0;
	}
}