@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@100;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Saira:wght@100;300;400;500;700;900&display=swap');
body{
	height:100vh;
	color:#222;
	font-family:"Nunito Sans",Arial,serif;
}
body{
	background-color:#494d56;
	font-size:16px;
}
h1, h2, h3, h4{
	font-family:Saira;
	font-weight:700;
}
h1{
	margin:0 0 30px;
	font-size:30px;
}
.index h1{
	font-size:40px;
	color:#FFF;
}
h2{
	font-size:22px;
}
h3{
	font-size:18px;
}
p{
	font-size:16px;
}
a{
	font-weight:bold;
	color:#090;
}
a:hover{
	color:#0C0;
}
ol, ul{
	margin:0;
	padding:0 0 0 25px;
}
li{
	margin:0;
	padding:0 0 0 15px;
}
table{
	font-size:14px;
}
.btn{
	height:50px;
	padding:15px 30px;
	border-radius:0;
	font-family:Saira;
	font-size:12px;
	font-weight:500;
	line-height:20px;
	text-align:left;
	text-transform:uppercase;
	background-color:#fcc836;
	color:#000;
}
.btn:hover{
	background-color:#CCC;
}
.btn.grey{
	background-color:#3c4049;
	border:solid 1px #3c4049;
	color:#FFF;
}
.btn.grey:hover{
	border:solid 1px #000;
}
.red{
	color:#F00;
}
.green{
	color:#0C0;
}
.img-full{width:100%; height:100%; object-fit:cover;}
.clearfloat{clear:both; height:0; font-size:1px; line-height:0px;}
.textbox, .textarea{font-family:Arial,Verdana,Helvetica,sans-serif; font-size:1em; line-height:1em; color:#252525;}
.inline_warning, .error-message{color:#F00; font-size:12px;}
.error{margin:120px 0; padding:40px; background:#F0F0F0; text-align:center;}
.scrollable .wrap{
	padding:0 15px 0 0;
}
.desc img{
	max-width:100%;
}
.wrapper{
	height:100%;
	margin:0 !important;
	padding:0;
	overflow:hidden;
}
.loader{
	height:100%;
}
.left{
	height:100%;
	padding:0;
	background-color:#494d56;
}
.middle{
	height:100%;
	padding:0;
	background-color:#3c4049;
	background-image:url(../images/front/middle.jpg);
	background-size:cover;
	background-repeat:no-repeat;
}
.right{
	height:100%;
	padding:0;
	background-color:#fcc836;
}
.logo{
	width:120px;
	height:90px;
	padding:15px 0;
	text-align:center;
	background-color:#FFF;
	position:absolute;
	z-index:3;
	left:60px;
	top:90px;
	box-shadow:0 0 10px rgba(0,0,0,0.05);
}
.index .logo{
	left:0;
	top:60px;
}
.logo img{
	width:auto;
	height:60px;
}
.menu{
	width:100vw;
	height:26px;
	position:absolute;
	top:0;
	left:0;
	z-index:2;
	text-align:center;
}
.menu ul{
	float:left;
	width:100%;
	margin:20px 0 0;
	padding:0;
	position:relative;
	list-style:none;
	font-family:Saira, Arial;
	font-size:12px;
	text-transform:uppercase;
}
.menu ul li{
	display:inline-block;
	margin:0 5px 0 0;
	padding:0;
	line-height:26px;
}
.menu ul a{
	display:block;
	margin:0;
	padding:0 15px;
	color:#999;
	font-weight:400;
	line-height:26px;
	text-shadow:0 0 3px rgba(0,0,0,0.3);
}
.menu ul a:hover, .menu ul a.active{
	color:#FFF;
	text-decoration:none;
}
.menu ul a.capsule{
	background-color:#494e59;
	border-radius:13px;
	color:#FFF;
}
.menu ul li.capsule{
	padding-top:5px;
}
.menu ul li.capsule a{
	display:inline-block;
	background-color:#494e59;
	color:#DDD;
}
.menu ul li.capsule a:first-child{
	padding-right:8px;
	border-top-left-radius:13px;
	border-bottom-left-radius:13px;
	border-right:solid 1px #666;
}
.menu ul li.capsule a:first-child i{
	margin-right:3px;
}
.menu ul li.capsule a:last-child{
	padding-left:8px;
	padding-right:10px;
	border-top-right-radius:13px;
	border-bottom-right-radius:13px;
	background-color:#333;
}
.menu ul li.capsule a:hover{
	color:#FFF;
}
.menu sup{
	width:12px;
	height:12px;
	margin-left:-4px;
	padding:0 2px 0 1px;
	z-index:-1;
	background-color:#F00;
	color:#FFF;
	font-size:10px;
	text-align:center;
	line-height:12px;
	overflow:hidden;
	display:inline-block;
	border-radius:6px;
}
.index h1{
	position:absolute;
	z-index:2;
	width:50vw;
	left:0;
	top:165px;
	padding:0;
	margin:0 0 0 120px;
	font-size:72px;
	font-weight:100;
	color:#FFF;
	text-transform:none;
}
.index h1 strong.ml50{
	margin-left:50px;
}
.index .slideshow{
	position:absolute;
	top:350px;
	padding:30px 50px 75px;
	background-color:#FFF;
	color:#1e2025;
	font-size:14px;
	font-weight:600;
	line-height:1.5em;
}
.index .slideshow>.btns{
	position:absolute;
	left:0;
	top:0;
	z-index:3;
	width:100px;
	text-align:left;
	margin-left:100%;
}
.index .slideshow>.btns img{
	width:50px;
	float:left;
}
.slider-container{
	width:100%;
}
.slider-item.active{
	display:block;
	opacity:1;
}
.slider-item:not(.active){
	display:none;
	opacity:0;
}
.slider-item>.btns{
	position:absolute;
	right:50px;
	bottom:0;
}
.slider-item>.btns .btn.more i{
	font-size:18px;
	margin-left:3px;
}
.hero{
	position:absolute;
	z-index:2;
	left:-50px;
	top:100px;
}
.hero img{
	width:33vw;
	height:auto;
	border:solid 6px #FFF;
	border-radius:50%;
}



.submenu{
	width:60%;
	margin:0;
	padding:0;
	position:absolute;
	right:0;
	top:120px;
	list-style:none;
}
.submenu li{
	width:100%;
	margin:0;
	padding:10px 0;
	border-bottom:solid 1px #000;
}
.submenu li a{
	font-size:12px;
	line-height:1em;
	color:#000;
}




.address{
	width:100%;
	padding:12px 0;
	bottom:0;
	position:absolute;
	z-index:2;
	color:#888;
	font-size:12px;
	text-align:center;
	text-shadow:0 0 3px rgba(0,0,0,0.3);
}




#sidebar2{
    width: 75px;
    height: 75px;
    position: fixed;
    right: 15px;
    bottom: 30px;
	z-index:200;
}
#sidebar2 img{
	width:75px;
	height:75px;
}
#sidebar2 a{
	display:block;
}
#sidebar2 a:first-child{
	margin-bottom:5px;
}


.wrapper2{
	width:100%;
	height:100vh;
	padding:15px;
	position:absolute;
	z-index:2;
	left:0;
	top:0;
	background-color:#010713;
	display:none;
}
.wrapper2 h2{
	text-align:center;
	height:10vh;
}
.wrapper2 iframe{
	width:100% !important;
	height:80vh !important;
	border:solid 1px #FFF;
}

@keyframes fadein {
	from {opacity:0;}
	to {opacity:1;}
}
@keyframes fadeinleft100to0 {
	from {left:100px; opacity:0;}
	to {left:0; opacity:1;}
}
@keyframes fadeinleft100tomin50 {
	from {left:100px; opacity:0;}
	to {left:-50px; opacity:1;}
}
@keyframes fadeinrightmin100to0 {
	from {left:-100px; opacity:0;}
	to {left:0; opacity:1;}
}
@keyframes fadeinright0to40 {
	from {left:0; opacity:0;}
	to {left:40px; opacity:1;}
}
@keyframes fadeinright0to60 {
	from {left:0; opacity:0;}
	to {left:60px; opacity:1;}
}
@keyframes fadeinrightmin100tomin50 {
	from {left:-100px; opacity:0;}
	to {left:-50px; opacity:1;}
}
@keyframes fadeinboth {
	from {margin-left:0; margin-right:0; opacity:0;}
	to {margin-left:-80px; margin-right:-80px; opacity:1;}
}
@keyframes fadeinbottom {
	from {margin-top:-15px; opacity:0;}
	to {margin-top:0px; opacity:1;}
}



@keyframes fadeout {
	from {opacity:1;}
	to {opacity:0;}
}
@keyframes fadeoutleft0tomin100 {
	from {left:0; opacity:1;}
	to {left:-100px; opacity:0;}
}
@keyframes fadeoutleftmin50tomin100 {
	from {left:-50px; opacity:1;}
	to {left:-100px; opacity:0;}
}
@keyframes fadeoutright0to100 {
	from {left:0; opacity:1;}
	to {left:100px; opacity:0;}
}
@keyframes fadeoutleft60to0 {
	from {left:60px; opacity:1;}
	to {left:0; opacity:0;}
}
@keyframes fadeoutleft40to0 {
	from {left:40px; opacity:1;}
	to {left:0; opacity:0;}
}
@keyframes fadeoutboth {
	from {margin-left:-80px; margin-right:-80px; opacity:1;}
	to {margin-left:0; margin-right:0; opacity:0;}
}
@keyframes fadeouttop {
	from {margin-top:0px; opacity:1;}
	to {margin-top:-15px; opacity:0;}
}



/* BY RIGHT */
@keyframes fadeinrightleftmin100to0 {
	from {right:-100px; opacity:0;}
	to {right:0; opacity:1;}
}
@keyframes fadeoutrightright0tomin100 {
	from {right:0; opacity:1;}
	to {right:-100px; opacity:0;}
}




/* MENU */
body.enter .menu li:first-child {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-fill-mode: both;
}
body.enter .menu li:nth-child(8n+1) {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-delay: 0.1s;
	animation-fill-mode: both;
}
body.enter .menu li:nth-child(8n+2) {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-delay: 0.2s;
	animation-fill-mode: both;
}
body.enter .menu li:nth-child(8n+3) {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-delay: 0.3s;
	animation-fill-mode: both;
}
body.enter .menu li:nth-child(8n+4) {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-delay: 0.4s;
	animation-fill-mode: both;
}
body.enter .menu li:nth-child(8n+5) {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-delay: 0.5s;
	animation-fill-mode: both;
}
body.enter .menu li:nth-child(8n+6) {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-delay: 0.6s;
	animation-fill-mode: both;
}
body.enter .menu li:nth-child(8n+7) {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-delay: 0.7s;
	animation-fill-mode: both;
}
body.enter .menu li:nth-child(8n+8) {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-delay: 0.8s;
	animation-fill-mode: both;
}
body.exit .menu li:first-child {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-fill-mode: both;
}
body.exit .menu li:nth-child(8n+1) {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-delay: 0.1s;
	animation-fill-mode: both;
}
body.exit .menu li:nth-child(8n+2) {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-delay: 0.2s;
	animation-fill-mode: both;
}
body.exit .menu li:nth-child(8n+3) {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-delay: 0.3s;
	animation-fill-mode: both;
}
body.exit .menu li:nth-child(8n+4) {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-delay: 0.4s;
	animation-fill-mode: both;
}
body.exit .menu li:nth-child(8n+5) {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-delay: 0.5s;
	animation-fill-mode: both;
}
body.exit .menu li:nth-child(8n+6) {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-delay: 0.6s;
	animation-fill-mode: both;
}
body.exit .menu li:nth-child(8n+7) {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-delay: 0.7s;
	animation-fill-mode: both;
}
body.exit .menu li:nth-child(8n+8) {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-delay: 0.8s;
	animation-fill-mode: both;
}



/* COMMON ANIMATION */
.enter .fadein {
	animation-name: fadein;
	animation-duration: 2s;
	animation-fill-mode: both;
}
.enter .fadeinboth {
	animation-name: fadeinboth;
	animation-duration: 2s;
	animation-delay: 0.2s;
	animation-fill-mode: both;
}
.exit .fadeout {
	animation-name: fadeout;
	animation-duration: 2s;
	animation-fill-mode: both;
}
.exit .fadeoutboth {
	animation-name: fadeoutboth;
	animation-duration: 2s;
	animation-delay: 0.4s;
	animation-fill-mode: both;
}


/* INDEX */
.index.enter .fadeinright {
	animation-name: fadeinrightmin100to0;
	animation-duration: 2s;
	animation-fill-mode: both;
}
.index.enter .fadeinleft2 {
	animation-name: fadeinleft100to0;
	animation-duration: 2s;
	animation-delay: 0.1s;
	animation-fill-mode: both;
}
.index.enter .fadeinright3 {
	animation-name: fadeinrightmin100tomin50;
	animation-duration: 2s;
	animation-delay: 0.2s;
	animation-fill-mode: both;
}
.index.exit .fadeoutleft{
	animation-name: fadeoutleft0tomin100;
	animation-duration: 2s;
	animation-fill-mode: both;
}
.index.exit .fadeoutright2 {
	animation-name: fadeoutright0to100;
	animation-duration: 2s;
	animation-delay: 0.1s;
	animation-fill-mode: both;
}
.index.exit .fadeoutleft3{
	animation-name: fadeoutleftmin50tomin100;
	animation-duration: 2s;
	animation-fill-mode: both;
}


/* ABOUT */
.paper{
	position:absolute;
	z-index:2;
	top:70px;
	width:calc(100% + 160px);
	height:80vh;
	overflow:hidden;
	margin:0 -80px;
	color:#1e2025;
}
.paper .image{
	height:80vh;
	padding:0;
	background-color:#FFF;
}
.paper .content{
	height:100%;
	padding:0;
	overflow:hidden;
}
.paper .content .scrollable{
	width:100%;
	height:100%;
	overflow:auto;
}
.paper .subcontent{
	height:100%;
	padding:30px 10px 30px 50px;
	overflow:hidden;
	background-color:#F0F0F0;
}
.paper .subcontent .scrollable{
	width:100%;
	height:100%;
	overflow:auto;
}
.paper .subimage{
	width:150px;
	height:150px;
	margin:0 auto 30px;
	overflow:hidden;
	border-radius:50%;
	border:solid 3px #FFF;
}
.paper .image img{
	width:100%;
	height:100%;
	object-fit:cover;
	object-position:top;
}
.paper h1{
	color:#1e2025;
}
.paper .section{
	width:100%;
	margin-bottom:-1px;
	padding:30px 50px;
	background-color:#FFF;
}
.paper .section2{
	background-color:#666;
	color:#FFF;
}
.paper .section3{
	background-color:#6eaf2f;
	color:#FFF;
}
.pengurus h1{
	display:none;
}
.pengurus h2 br{
	display:none;
}
.riwayat-organisasi .content table.table{
	font-size:12px;
}
.riwayat-organisasi .content table.table tbody tr td:first-child{
	width:25%;
}
.riwayat-organisasi .content table.table tbody tr td:nth-child(2n){
	width:35%;
}
.list-people{
	margin:30px 0 0;
	padding:0;
	list-style:none;
}
.list-people li{
	width:100%;
	margin:0;
	padding:10px 0 15px;
	display:inline-block;
	border-bottom:dotted 1px #000;
}
.list-people li .col-sm-4{
	padding-left:0;
}
.list-people li img{
	width:100%;
	height:120px;
	margin:0;
	object-fit:cover;
	object-position:center top;
	border-radius:4px;
}
.list-people li h3{
	margin:10px 0 3px;
	padding:0;
}



/* ABOUT ANIMATION */
.tentang-kami.enter .fadeinright, .riwayat-organisasi.enter .fadeinright, .keanggotaan.enter .fadeinright, .kode-etik.enter .fadeinright {
	animation-name: fadeinright0to60;
	animation-duration: 2s;
	animation-fill-mode: both;
}
.tentang-kami.exit .fadeoutleft, .riwayat-organisasi.exit .fadeoutleft, .keanggotaan.exit .fadeoutleft, .kode-etik.exit .fadeoutleft {
	animation-name: fadeoutleft60to0;
	animation-duration: 2s;
	animation-fill-mode: both;
}
.tentang-kami.enter .fadeinleft3, .riwayat-organisasi.enter .fadeinleft3, .keanggotaan.enter .fadeinleft3, .kode-etik.enter .fadeinleft3 {
	animation-name: fadeinrightleftmin100to0;
	animation-duration: 2s;
	animation-fill-mode: both;
}
.tentang-kami.exit .fadeoutright3, .riwayat-organisasi.exit .fadeoutright3, .keanggotaan.exit .fadeoutright3, .kode-etik.exit .fadeoutright3 {
	animation-name: fadeoutrightright0tomin100;
	animation-duration: 2s;
	animation-fill-mode: both;
}





/* SKPPL ANIMATION */
.skppl.enter .fadeinright {
	animation-name: fadeinright0to60;
	animation-duration: 2s;
	animation-fill-mode: both;
}
.skppl.exit .fadeoutleft {
	animation-name: fadeoutleft60to0;
	animation-duration: 2s;
	animation-fill-mode: both;
}



/* GALLERY */
.gallery .image img{
	width:100%;
	height:auto;
	margin-bottom:5px;
}
.gallery .image p{
	color:#FFF;
	font-size:18px;
	margin-bottom:30px;
}
.gallery .image a{
	text-decoration:none;
}
.gallery .warning{
	padding:25% 0 25%;
	text-align:center;
}
.gallery em{
	font-size:12px;
}


/* GALLERY ANIMATION */
.gallery.enter .fadeinright {
	animation-name: fadeinright0to60;
	animation-duration: 2s;
	animation-fill-mode: both;
}
.gallery.exit .fadeoutleft {
	animation-name: fadeoutleft60to0;
	animation-duration: 2s;
	animation-fill-mode: both;
}


/* NEWS */
.news .logo{
	left:40px;
}
.news .paper{
	padding:0;
}
.news h1{
	margin:0;
	padding:0 15px 15px;
}
.news .center>div:first-child{
	text-align:left;
}
.news .news-list, .news .scrollable{
	height:100%;
}
.news .news-list{
	padding-right:15px;
}
.news .news-list .warning{
	padding:50px 15px;
}
.news .scrollable .wrap{

}
.news .news_archieve{
	list-style:none;
	margin:0;
	padding:0;
}
.news .news_archieve li{
	margin:0 0 10px;
	padding:0 5px;
}
.news .news_archieve li:nth-child(4n+1){
	clear:left;
}
.news .news_archieve li .news-item{
	padding:15px;
	background-color:#FFF;
	border-radius:6px;
}
.news .news_archieve .news-image img{
	width:100%;
	height:150px !important;
	margin-bottom:10px;
	object-fit:cover;
}
.news .news_archieve .news-date{
	margin-bottom:6px;
	font-size:10px;
	color:#666;
}
.news .news_archieve .news-title{
	line-height:1.125em;
}
.news .news_archieve .news-title a{
	color:#222;
}
.news .paging{
	width:100%;
	margin:10px 0 30px;
	padding:0 10px;
	font-size:12px;
	color:#CCC;
}
.news .paging_label{
	margin:0 0 30px;
}


/* NEWS ANIMATION */
.news.enter .fadeinright {
	animation-name: fadeinright0to40;
	animation-duration: 2s;
	animation-fill-mode: both;
}
.news.exit .fadeoutleft{
	animation-name: fadeoutleft40to0;
	animation-duration: 2s;
	animation-fill-mode: both;
}
.news.enter .news_archieve li:first-child {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-fill-mode: both;
}
.news.enter .news_archieve li:nth-child(8n+1) {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-delay: 0.1s;
	animation-fill-mode: both;
}
.news.enter .news_archieve li:nth-child(8n+2) {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-delay: 0.2s;
	animation-fill-mode: both;
}
.news.enter .news_archieve li:nth-child(8n+3) {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-delay: 0.3s;
	animation-fill-mode: both;
}
.news.enter .news_archieve li:nth-child(8n+4) {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-delay: 0.4s;
	animation-fill-mode: both;
}
.news.enter .news_archieve li:nth-child(8n+5) {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-delay: 0.5s;
	animation-fill-mode: both;
}
.news.enter .news_archieve li:nth-child(8n+6) {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-delay: 0.6s;
	animation-fill-mode: both;
}
.news.enter .news_archieve li:nth-child(8n+7) {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-delay: 0.7s;
	animation-fill-mode: both;
}
.news.enter .news_archieve li:nth-child(8n+8) {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-delay: 0.8s;
	animation-fill-mode: both;
}
.news.exit .news_archieve li:first-child {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-fill-mode: both;
}
.news.exit .news_archieve li:nth-child(8n+1) {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-delay: 0.1s;
	animation-fill-mode: both;
}
.news.exit .news_archieve li:nth-child(8n+2) {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-delay: 0.2s;
	animation-fill-mode: both;
}
.news.exit .news_archieve li:nth-child(8n+3) {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-delay: 0.3s;
	animation-fill-mode: both;
}
.news.exit .news_archieve li:nth-child(8n+4) {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-delay: 0.4s;
	animation-fill-mode: both;
}
.news.exit .news_archieve li:nth-child(8n+5) {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-delay: 0.5s;
	animation-fill-mode: both;
}
.news.exit .news_archieve li:nth-child(8n+6) {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-delay: 0.6s;
	animation-fill-mode: both;
}
.news.exit .news_archieve li:nth-child(8n+7) {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-delay: 0.7s;
	animation-fill-mode: both;
}
.news.exit .news_archieve li:nth-child(8n+8) {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-delay: 0.8s;
	animation-fill-mode: both;
}



/* NEWS DETAIL */
.news-detail .paper a{
	color:#222;
}
.news-detail .paper .image{
	background-color:transparent;
}
.news-detail .paper .image img{
	height:auto;
	min-height:50%;
	object-fit:cover;
}
.news-detail .scrollable{
	height:100%;
}
.news-detail .scrollable .wrap{

}
.news-detail .scrollable .wrap img{
	width:100%;
	height:auto;
}
.nd_title{
	font-weight:700;
}
.nd_paging{
	width:100%;
	padding:25px 0 25px;
	text-align:left;
}


/* NEWS DETAIL ANIMATION */
.news-detail.enter .fadeinright {
	animation-name: fadeinright0to60;
	animation-duration: 2s;
	animation-fill-mode: both;
}
.news-detail.exit .fadeoutleft{
	animation-name: fadeoutleft60to0;
	animation-duration: 2s;
	animation-fill-mode: both;
}




/* EVENTS */
.events .logo{
	left:40px;
}
.events .paper{
	padding:0;
}
.events h1{
	margin:0;
	padding:0 15px 15px;
}
.events .center>div:first-child{
	text-align:left;
}
.events .events-list, .events .scrollable{
	height:100%;
}
.events .events-list{
	padding-right:15px;
}
.events .events-list .warning{
	padding:50px 15px;
}
.events .scrollable .wrap{

}
.events .events_archieve{
	list-style:none;
	margin:0;
	padding:0;
}
.events .events_archieve li{
	margin:0 0 10px;
	padding:0 5px;
}
.events .events_archieve li:nth-child(4n+1){
	clear:left;
}
.events .events_archieve li .events-item{
	padding:15px;
}
.events .events_archieve .events-image img{
	width:100%;
	height:200px !important;
	object-fit:cover;
	object-position:top;
}
.events .events_archieve .events-date{
	margin:8px 0 6px;
	font-size:10px;
	color:#999;
}
.events .events_archieve .events-date.coming{
	padding:3px 6px;
	border-radius:7px;
	background:green;
	color:#FFF;
}
.events .events_archieve .events-title{
	line-height:1.125em;
}
.events .events_archieve .events-title a{
	color:#FFF;
}
.events .paging{
	width:100%;
	margin:10px 0 30px;
	padding:0 10px;
	font-size:12px;
	color:#CCC;
}
.events .paging_label{
	margin:0 0 30px;
}


/* EVENTS ANIMATION */
.events.enter .fadeinright {
	animation-name: fadeinright0to40;
	animation-duration: 2s;
	animation-fill-mode: both;
}
.events.exit .fadeoutleft{
	animation-name: fadeoutleft40to0;
	animation-duration: 2s;
	animation-fill-mode: both;
}
.events.enter .events_archieve li:first-child {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-fill-mode: both;
}
.events.enter .events_archieve li:nth-child(8n+1) {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-delay: 0.1s;
	animation-fill-mode: both;
}
.events.enter .events_archieve li:nth-child(8n+2) {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-delay: 0.2s;
	animation-fill-mode: both;
}
.events.enter .events_archieve li:nth-child(8n+3) {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-delay: 0.3s;
	animation-fill-mode: both;
}
.events.enter .events_archieve li:nth-child(8n+4) {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-delay: 0.4s;
	animation-fill-mode: both;
}
.events.enter .events_archieve li:nth-child(8n+5) {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-delay: 0.5s;
	animation-fill-mode: both;
}
.events.enter .events_archieve li:nth-child(8n+6) {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-delay: 0.6s;
	animation-fill-mode: both;
}
.events.enter .events_archieve li:nth-child(8n+7) {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-delay: 0.7s;
	animation-fill-mode: both;
}
.events.enter .events_archieve li:nth-child(8n+8) {
	animation-name: fadeinbottom;
	animation-duration: 2s;
	animation-delay: 0.8s;
	animation-fill-mode: both;
}
.events.exit .events_archieve li:first-child {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-fill-mode: both;
}
.events.exit .events_archieve li:nth-child(8n+1) {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-delay: 0.1s;
	animation-fill-mode: both;
}
.events.exit .events_archieve li:nth-child(8n+2) {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-delay: 0.2s;
	animation-fill-mode: both;
}
.events.exit .events_archieve li:nth-child(8n+3) {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-delay: 0.3s;
	animation-fill-mode: both;
}
.events.exit .events_archieve li:nth-child(8n+4) {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-delay: 0.4s;
	animation-fill-mode: both;
}
.events.exit .events_archieve li:nth-child(8n+5) {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-delay: 0.5s;
	animation-fill-mode: both;
}
.events.exit .events_archieve li:nth-child(8n+6) {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-delay: 0.6s;
	animation-fill-mode: both;
}
.events.exit .events_archieve li:nth-child(8n+7) {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-delay: 0.7s;
	animation-fill-mode: both;
}
.events.exit .events_archieve li:nth-child(8n+8) {
	animation-name: fadeouttop;
	animation-duration: 2s;
	animation-delay: 0.8s;
	animation-fill-mode: both;
}

/* EVENTS DETAIL */
.events-detail .subimage{

}
.events-detail .subimage img{

}
.events-detail .logo{
	left:0;
}
.events-detail .scrollable{
	height:100%;
}
.events-detail .scrollable .wrap{

}
.events-detail .center>div:first-child{
	text-align:left;
}
.events-detail .center img{
	width:100%;
}
.events-detail .scrollable .wrap img{
	width:100%;
	height:100%;
}
.register{
	margin:30px 0 0;
}
.ed_material{
	width:100%;
	text-align:right;
	font-size:12px;
	font-weight:bold;
}
.ed_material img{
	height:32px !important;
	width:auto !important;
}
.ed_title{
	font-weight:700;
}
.ed_paging{
	width:100%;
	padding:25px 0 25px;
	text-align:left;
}
.events-detail .subcontent h3{
	font-size:15px;
}
.events-detail .subcontent div, .events-detail .subcontent p{
	font-size:13px;
}
.events-detail .normal, .events-detail .early, .events-detail .register{
	margin:30px 0 5px;
	padding:5px 15px 15px;
	background-color:#FFF;
	border:solid 1px #CCC;
}
.events-detail .register .price{
	padding-top:8px;
	text-align:center;
}


/* EVENTS DETAIL ANIMATION */
.events-detail.enter .fadeinright {
	animation-name: fadeinright0to60;
	animation-duration: 2s;
	animation-fill-mode: both;
}
.events-detail.exit .fadeoutleft{
	animation-name: fadeoutleft60to0;
	animation-duration: 2s;
	animation-fill-mode: both;
}



/* REGISTER EVENT */
.event-add{
	margin: 0 auto;
	float: none;
}
.event-add h1{
	margin:50px 0 30px;
}
.event-add h3{
	font-size: 24px;
	text-align: center;
	font-family: 'Roboto';
	font-weight: 700;
	color: #1e3953;
}
.register-event .contact_ctn{
	margin-bottom:30px;
	padding:0;
}
.register-event .contact_ctn h2{
	margin-bottom:20px;
	font-size:20px;
}
.register-event blockquote{
	margin:0 0 5px;
	background:#a3d553;
	border-left-color:#8fc238;
	font-weight:bold;
}
.register-event blockquote.price{
	margin-bottom:50px;
	background:#fdd030;
	border-left-color:#f4bd0e;
	font-weight:bold;
}
.register-event .warning{
	margin:0 0 15px;
	padding:15px;
	background:#FFC;
	border:solid 1px #f0a901;
}
.register-event .warning p{
	margin:0;
	font-size:14px;
	line-height:1.5em;
}
.register-event .contact_ctn label{
	width:100%;
	margin:5px 0 5px;
}
.register-event .contact_ctn label.disabled{
	color:#999;
}

/* INVOICE */
.invoice .contact_ctn{
	margin-bottom:30px;
}
.invoice .contact_ctn h2{
	margin-bottom:10px;
	font-size:18px;
}
.invoice blockquote{
	margin:0 0 5px;
	background:#a3d553;
	border-left-color:#8fc238;
	font-weight:bold;
}
.invoice blockquote.price{
	margin-bottom:50px;
	background:#fdd030;
	border-left-color:#f4bd0e;
	font-weight:bold;
}
.invoice .warning{
	margin:0 0 15px;
	padding:15px;
	background:#FFC;
	border:solid 1px #f0a901;
}
.invoice .warning p{
	margin:0;
	font-size:14px;
	line-height:1.5em;
}
.invoice .contact_ctn .form-group{
	width:100%;
	margin:0 0 1px;
	padding:8px 5px;
	font-size:16px;
	border-bottom:dotted 1px #CCC;
}
.invoice .contact_ctn .form-group.price{
	margin:0;
	background:#FFC;
}
.invoice .contact_ctn .form-group.total{
	background:#ffe403;
	border-bottom:solid 3px #FC0;
}
.invoice .btns{
	margin-top:50px;
}


/* FAQ */
.faq .panel-group{
	margin-top:30px;
}
.faq .panel-group .panel-title a{
	color:#222;
}

/* FAQ ANIMATION */
.faq.enter .fadeinright {
	animation-name: fadeinright0to60;
	animation-duration: 2s;
	animation-fill-mode: both;
}
.faq.exit .fadeoutleft {
	animation-name: fadeoutleft60to0;
	animation-duration: 2s;
	animation-fill-mode: both;
}



/* MEMBER LOGIN */
.member .section1 p{
	margin-bottom:30px;
}
.member .c_l{
	font-size:14px;
	font-weight:bold;
}
.member .btns{
	margin-top:50px;
}
.member .c_l .btn{
	margin-top:30px;
}
.member .form-error input{
	border:solid 1px #F00;
}

/* MEMBER PROFILE */
.member .paper .subcontent img{
	width:100%;
	height:auto;
}
.profileleft #upload-call{
	text-align:center;
}
.profileleft #uploader{
	display:none;
}
.profileright .input-sm{
	height:auto;
}
.profileright .info{
	margin:0 0 30px;
	padding:0;
	font-size:10px;
	font-style:italic;
	line-height:1em;
}
.profileright .info a{
	font-family: 'Roboto', helvetica, sans-serif;
}
.field_change_password{
	display:none;
}
.profile h1{
	margin-top:5px;
	font-weight: bold;
	font-size: 42px;
	font-weight:700;
	text-transform:uppercase;
}
.common-image-upload .txt_image, .common-image-upload .progress{
	margin-top:10px;
}
.profile-form-container{
	width:100%;
	margin-bottom:30px;
}
.profile-form-container .form-group{
	margin-bottom:5px;
}
.profile-form-container .c_l{
	width:100%;
	font-size:13px;
	font-weight:bold;
}
.profile-form-container .c_r{
	width:100%;
	margin:1px 0 8px;
	padding:4px 8px;
	font-size:13px;
	font-weight:400;
	border:solid 1px #CCC;
	border-radius:5px;
	background-color:#FAFAFA;
}
.profile-form-container .info .c_r{
	margin:30px 0 50px;
	padding:0;
	background-color:transparent;
	border:none;
}
.profile-form-container .editable-container.editable-inline, .profile-form-container .editable-container.editable-inline>div, .profile-form-container .editableform, .profile-form-container .editableform .control-group, .profile-form-container .editableform .form-control{
	width:100%;
}
.profile-form-container .editable-empty, .profile-form-container .editable-empty:hover, .profile-form-container .editable-empty:focus{
	color:#090;
}
.profile-form-container .editable-input{
	width:calc(100% - 120px);
}
.profile-form-container .editableform .form-control{
	height:60px;
}
.profile-form-container .editable-buttons{
	width:120px;
}
.profile-form-container .editable-buttons .btn{
	width:50px;
	height:30px;
	padding:5px 0;
	text-align:center;
}
.profile-form-container .editable-buttons .btn.editable-cancel{
	background-color:#3c4049;
	color:#FFF;
}
.profile-datepicker{
	width:100%;
	padding:0;
	border:none;
	background-color:transparent;
}
.profile-datepicker, .profile-datepicker::placeholder {
	color:#009900;
	font-weight:bold;
	font-style:italic;
}
.profile p{
	font-size: 18px;
	padding: 0 40px 0 0;
}
.profile .field_change_password{
	margin-bottom:10px;
	font-size:18px;
}
.profile .field_change_password input[type="password"]{
	width:100%;
}
.profile .field_change_password .error-message{

}
input.profile-input{
	transition: all .35s ease;
	width: 100%;
	margin: 20px 0 5px;
}
input.profile-button{
	margin:20px 0 0;
}
.profile-form-container .common-image{
	padding:0 15px 0 0;
	text-align:center;
}
.profile-form-container .common-image-upload img {
	width:50px;
	height:50px;
	object-fit:contain;
}
.profile-form-container .common-image-upload .txt_image, .profile-form-container .common-image-upload .txt_file{
	margin:0 0 5px;
}
.profile-form-container .common-image-upload .txt_image input, .profile-form-container .common-image-upload .txt_file input{
	width:90%;
	margin:0;
	padding:0;
	line-height:1.8em;
	vertical-align:middle;
	border:none;
}
.profile-form-container .common-image-upload .txt_image a, .profile-form-container .common-image-upload .txt_file a{
	margin:0 10px 0 0;
}
.profile-form-container .common-image-upload .txt_image img, .profile-form-container .common-image-upload .txt_file img{
	opacity:0.3;
}
.profile-form-container .common-image-upload .btn{
	float:left;
	height:32px;
	padding:5px 15px;
}
.profile-form-container .common-image-upload .progress{
	float:left;
	width:200px;
	margin:8px 0 10px 15px;
}
.profile-form-container .common-image-upload .files{
	float:left;
	margin:7px 0 0 15px;
}
.profileleft .common-image-upload .fileinput-button{
	width:100%;
	text-align:center;
}



/* HISTORY */
.history-container{
	margin-bottom:30px;
}
.history-container>.row, .upcoming-seminar>.row{
	margin-top:15px;
	margin-bottom:15px;
	padding:15px;
	background:#F0F0F0;
	border-bottom:solid 3px #CCC;
}
.history-container hr{
	margin:10px 0;
	border-color:#000;
}
.history-container .date, .upcoming-seminar .date{
	float:left;
	width:100%;
	margin:0 0 5px;
	font-size:12px;
}
.history-container .date i, .upcoming-seminar .date i{
	margin-right:10px;
	color:#FC0;
}
.history-container .info{
	padding:30px 15px;
	text-align:center;
}
.history-container .title, .upcoming-seminar .title{
	float:left;
	width:100%;
	margin-bottom:20px;
	font-size:13px;
}
.history-container .skppl, .upcoming-seminar .skppl{
	float:left;
	width:100%;
	margin:0 0 5px;
	font-size:12px;
}
.history-container .tags, .upcoming-seminar .tags{
	width:100%;
	margin:15px 0 0;
}
.history-container .tags .tag{
	float:left;
	margin:0 5px 0 0;
	padding:3px 5px;
	background:#FFF;
	font-size:12px;
	color:#CCC;
	border-radius:10px;
	border:solid 1px #F0F0F0;
	border-bottom:solid 1px #BBB;
}
.history-container .tags .tag.active{
	border:solid 1px #FC0;
	border-bottom:solid 1px #f0a901;
	color:#000;
}
.history-container .skppl .tag{
	float:left;
	margin:0 5px 0 0;
	padding:3px 5px;
	font-size:10px;
	color:#FFF;
	border-radius:6px;
	background:#000;
}
.history-container .skppl .tag.total{
	background:#FC0;
	text-shadow:0 1px 0 #f0a901;
}
.history-container h2{
	margin:100px 0 0;
}
.history-container .title a, .upcoming-seminar .title a{
	color:#000;
	font-weight:bold;
}



.member-point{
	width:100%;
	margin:0;
	padding:15px;
	font-size:1.2em;
	border:solid 1px #FFF;
	background:#F0F0F0;/*fff9e0*/
	border-radius:8px;
}
.member-point h2{
	font-size:16px;
	text-align:center;
}
.member-point .count{
	font-size:10px;
	text-align:center;
}
.member-point .count strong{
	font-size:24px;
}
.member-menu{
	margin:40px 0 0;
}
.member-menu .btn{
	width:100%;
	margin:0 0 10px;
	padding:5px 0;
	text-align:center;
	box-shadow:0 1px 0 #f0a901;
}


/* PROFILE MOBILE */
#upload-call2{
	padding:10px 0;
}

/* CONTACT */
.contact .paper .subcontent{
	padding:30px 50px 30px 50px;
	overflow:hidden;
	background-color:#F0F0F0;
}
.contact .paper .subcontent iframe{
	margin:0 0 15px;
	border:solid 1px #FFF !important;
}
.contact .paper .subcontent h3{
	margin:0 0 15px;
	padding:0;
	font-size:14px;
}
.contact .paper .subcontent p{
	font-size:12px;
}
.contact .section1 p{
	margin-bottom:30px;
}
.contact .c_l{
	font-weight:bold;
}
.contact .section1 .btn{
	margin-top:30px;
}


/* CONTACT ANIMATION */
.contact.enter .fadeinright {
	animation-name: fadeinright0to60;
	animation-duration: 2s;
	animation-fill-mode: both;
}
.contact.exit .fadeoutleft {
	animation-name: fadeoutleft60to0;
	animation-duration: 2s;
	animation-fill-mode: both;
}


/* MOBILE */
.mobile-header{
	width:100%;
	padding:10px 15px;
	position:fixed;
	top:0;
	z-index:10;
	background-color:#FFF;
	box-shadow:0 0 10px rgba(0,0,0,0.3);
	display:none;
}
.mobile-logo{
	float:left;
	width:50px;
	margin:10px 0 0 10px;
}
.mobile-logo img{
	width:100%;
}
.mobile-button{
	float:right;
	width:50px;
	padding:10px 0;
}
.mobile-button img{
	width:100%;
}
.mobile-menu{
	position:fixed;
	top:0;
	left:0;
	z-index:11;
	width:100%;
	height:100vh;
	background-color:#FFF;
	color:#010713;
	display:none;
}
.mobile-menu-close{
	width:50px;
	height:50px;
	position:absolute;
	top:15px;
	right:15px;
}
.mobile-menu-close img{
	width:100%;
}
.mobile-menu-logo{
	margin:30px 30px 0;
}
.mobile-menu-logo img{
	width:60px;
}
.mobile-menu ul{
	list-style:none;
	margin:10% 0 0;
	padding:0;
}
.mobile-menu li{
	margin:15px 0;
	padding:0 0 0 30px;
	text-align:left;
	font-size:16px;
	font-weight:700;
	letter-spacing:1px;
}
.mobile-menu li a{
	color:#010713;
	font-weight:100;
}
.mobile-menu li.menu-header{
	font-size:22px;
}
.mobile-menu li a:active{

}
.mobile-menu sup{
	background-color:#F00;
	color:#FFF;
	width:18px;
	height:18px;
	margin-left:-4px;
	z-index:-1;
	font-size:12px;
	text-align:center;
	line-height:18px;
	overflow:hidden;
	display:inline-block;
	border-radius:9px;
}
.mobile-submenu{float:left; background-color:#FC0; width:100%; padding:30px; display:none;}
.mobile-submenu .submenu{position:static; top:auto; right:auto; width:100%; padding:0 0 0 45px; list-style:decimal-leading-zero;}
.mobile-submenu .submenu li{border-bottom:none; font-size:16px; font-weight:700;}
.mobile-submenu .submenu li a{font-size:16px; font-weight:inherit;}
.mobile-hero{display:none;}
.mobile-hero img{width:100%; height:auto; object-fit:cover;}
.mobile-intro{background-color:#FFF; padding:30px; display:none;}
.mobile-intro .btn{margin:30px 0 0;}
.mobile-intro2{width:100%; padding:50px 30px 70px; background-image:url(../images/front/middle.jpg); background-size:cover; color:#FFF; display:none;}
.mobile-intro2 img{width:150px; height:150px; margin:0 auto 15px; border-radius:50%;}
.mobile-intro2 .btn{margin:30px 0 0;}
.mobile-content{float:left; width:100%; background-color:#FFF; display:none;}
.mobile-content .section{width:100%; padding:45px; background-color:#FFF; float:left;}
.mobile-content .section2{
	background-color:#666;
	color:#FFF;
}
.mobile-content .section3{
	background-color:#6eaf2f;
	color:#FFF;
}
.mobile-content ol, .mobile-content ul{
	margin:0;
	padding:0 0 0 20px;
}
.mobile-content li{
	margin:0;
	padding:0 0 0 15px;
}
.mobile-footer{float:left; width:100%; padding:50px 40px 50px; background-color:#444; color:#FFF; display:none;}
.mobile-footer h3{font-size:24px; margin:0 0 30px; color:#FC0;}
.mobile-footer h4{font-size:18px;}
.mobile-footer p{font-size:14px; color:#CCC;}
.news .mobile-content .section{padding:30px 15px 30px; background-color:#F0F0F0;}
.news .mobile-content h1{margin:0 5px 5px;}
.news .mobile-content .news_archieve li{margin:0;}
.news .mobile-content .news_archieve li .news-item{border-radius:0; padding:15px 15px 30px; background-color:transparent;}
.news .mobile-content .news_archieve .news-date{margin:20px 0 3px;}
.news .mobile-content .news_archieve img{width:100%; height:auto !important; margin-bottom:0;}
.news-detail .mobile-content .nd_date{color:#222; margin:0 0 10px;}
.news-detail .mobile-content .btn{margin:30px 0 0;}
.events .mobile-content .section{padding:30px 15px 30px;}
.events .mobile-content h1{margin:0 5px 5px;}
.events .mobile-content .events_archieve li{margin:0;}
.events .mobile-content .events_archieve li .events-item{border-radius:0; padding:15px 15px 30px;}
.events .mobile-content .events_archieve .events-date{margin:15px 0 3px;}
.events-detail .mobile-content .nd_date{color:#222; margin:0 0 10px;}
.events-detail .mobile-content .btn{margin:30px 0 0;}
.mobile-subcontent{float:left; width:100%; padding:45px; background-color:#F0F0F0; display:none;}
.mobile-subcontent img{width:250px; height:250px; margin:0 auto 30px; border-radius:50%; border:solid 3px #FFF;}



@media (min-width: 1600px) {
h1{
	font-size:48px;
}
h2{
	font-size:32px;
}
h3{
	font-size:28px;
}
p, li{
	font-size:20px;
}
.logo{
	width:240px;
	height:135px;
	top:150px;
}
.index .logo{
	top:90px;	
}
.logo img{
	height:100px;
}
.menu{
	height:40px;
}
.menu ul{
	margin:30px 0 0;
	font-size:22px;
}
.menu ul a{
	padding:5px 15px;
}
.index h1{
	top:280px;
}
.index .slideshow{
	top:530px;
	font-size:20px;
}
.hero{
	top:150px;
}
.paper{
	top:100px;
}
.submenu{
	width:70%;
}
.submenu li{
	padding:15px 0;
}
.submenu li a{
	font-size:20px;
}
.address{
	font-size:18px;
}
#sidebar2{
	width:120px;
	height:120px;
}
#sidebar2 img{
	width:120px;
	height:120px;
}
}

@media (max-width: 767px) {
	.wrapper{overflow:auto;}
	.menu{display:none;}
	.loader{width:100%; height:auto; margin-top:90px; float:left;}
	.left{height:auto; float:left;}
	.middle{height:auto; float:left;}
	.right{height:auto; float:left;}
	.logo{position:fixed;}
	.index .right{display:none;}
	.logo, .index .logo{display:none;}
	.index h1{display:none;}
	.index .slideshow{display:none;}
	.paper{display:none;}
	.scrollable .wrap{padding:0;}
.center .contacts h3{
	margin:0;
}
.center .contacts, .center .contacts p{
	line-height:1.2em;
}
.news .scrollable .wrap, .contact .scrollable .wrap{
	padding:0;
}
.events .events_archieve .events-image img{
	width:100%;
	height:auto !important;
}
.events .events_archieve .events-date{
	color:#666;
}
.events .events_archieve .events-title{
	line-height:1.125em;
}
.events .events_archieve .events-title a{
	color:#222;
}
.gallery .center>.subtitle h2{
	margin-bottom:50px;
}
.mobile-header{display:block;}
.mobile-hero{display:block;}
.mobile-intro{display:block;}
.mobile-intro2{display:block;}
.mobile-content{display:block;}
.mobile-subcontent{display:block;}
.mobile-submenu{display:block;}
.mobile-footer{display:block;}
.index.enter .fadeinright4{animation-fill-mode:none;}
.tentang-kami .middle, .riwayat-organisasi .middle, .keanggotaan .middle, .kode-etik .middle{background-color:#333; background-image:none;}
.tentang-kami .right, .riwayat-organisasi .right, .keanggotaan .right, .kode-etik .right{display:none;}
.profile-form-container .info{margin:30px 0 50px;}
.list-people{margin:30px 0 0 !important; padding:0 !important;}
.list-people li{padding:0 !important; border:none;}
.list-people li .col-sm-4{padding:0;}
.list-people li .col-sm-8{margin:0 0 30px; padding:0;}
.list-people li img{width:100%; height:auto;}
.contact .mobile-content .section{padding:45px 30px;}
.address{float:left; padding:45px 0; position:relative; background-color:#333;}
#sidebar2{bottom:75px;}
}

@media (max-width: 480px) {

}

@media (max-width: 320px) { 

}