/*=============================================================================================	
	style css decorated by : Web Architect (webarq.com)
	Author : Debfry Andhi
==============================================================================================*/
@media screen and (max-width: 430px) {
	.table_rank div.right {
		width: 100%;
	}
	.table_rank div.right label {
		display: block;
	}
	.table_rank div.right a.arrow {
		position: absolute;
	    right: 12px;
	    bottom: -24px;
	}
}
 @media screen and (max-width:640px) {
/* Tablet styles */

/*====header====*/
#menu-mobile .nav_close{ top:15px; right:15px; }
/*====middle====*/
.outer-wrapper{ margin:0 10px; }
article h1{ font-size:30px; }
article h2{ font-size:24px; line-height:24px; }
article h3{ font-size:22px; }
#calendar .c_title{ float:none; text-align:center; }
#calendar .list_carousel{ margin-left:0px; }
#latest-news .outer-wrapper{ width:auto; margin:0 10px; }
.list-news .items.full{ width:auto; overflow:hidden; }
.list-news .items.full .image{ width:585px; }
.list-news .items{ float:none; width:auto; margin-right:0px; }
#latest-news .title{ text-align:center; }
#latest-news .title nav{ float:none; margin-top:20px; margin-bottom:20px; }
#latest-news .title h2{ margin-right:0px; }
#about .outer-wrapper h2{ font-size:26px; }
#about .outer-wrapper p{ font-size:16px; }
#about .outer-wrapper{ left:10px; right:10px; }
#about .outer-wrapper nav a{ display:block; margin: 5px 0px; }
#about .outer-wrapper nav a::before{ display:none; }
#development .outer-wrapper{ max-width:370px; margin:0 auto; }
#development .cols{ width:auto; float:none; display:block; margin-right:0px; margin-bottom:30px; }
#member .outer-wrapper > div{ overflow:auto; }
.camera_caption{ height:150px; }
.camera_caption p,.camera_next,.camera_prev{ display:none; }
.camera_caption h1{ font-size:26px; line-height:28px; }
.camera_caption div{ width:auto; }
#menu-mobile{ overflow-y:auto; overflow-x:hidden; }
#menu-mobile ul li a,#menu-mobile .other{ width:300px; }
#announcer{ margin:0 15px; }
#announcer h2{ width:0px; padding-right:0px; overflow:hidden; padding-top:0px; padding-bottom:18px;  }

#announcer nav{ overflow:hidden; text-indent:-50px; width:30px; padding:20px 0px;}
#announcer nav:after{ margin-left:15px; }
#announcer .news{ width:auto; max-width:400px; }
.list_member{ width:auto; float:none; display:block; }
.list_member ul li .member .detail_member p.nama_mem{ font-size:18px; }
.list-country .cols{}
.detail-association .row .cols{ display:block; width:auto; }
article .table_meeting table thead{ display:none; }
article .table_meeting table tbody tr{ border-top: 1px solid #d7d7d7; border-bottom: 1px solid #d7d7d7; padding:15px 0px; }
article .table_meeting table tbody td{ display:block; text-align:left; padding:10px; border-bottom:0; width:100%; }
article .table_meeting table tbody td:before{
	content: attr(data-label);
	display: inline-block;
	width: 50%;
	text-transform: capitalize;
	font-weight:600;
}
article .table_meeting.table_rank .top_title h5{ float:left; }
.popup{ width:auto; max-height:250px; }
.popup .detail-association{ margin:0 20px; }
.popup .title{ padding:20px; }
/*====footer====*/
footer .left,footer .right{ float:none; display:block; text-align:center; }
footer .right p{ text-align:center; }
}
@media screen and (max-width:400px){
	#menu-mobile ul li a{ padding:15px 0px; }
	#menu-mobile .wrap{ margin:65px 0px; }
	.form-input .cols3{ width:100%; margin:10px 0px; }
	.form-input .rows nav.right,.form-input .rows .left{ float:none; display:block; margin-top:15px; }
	#development .outer-wrapper{ max-width:none; margin:0 10px; }
	article ul.vertical li{ width:50%; }
	.list-country .cols{ width:95%; }
	.list-news.bordered .items,.list-news.twocols .items{ width:auto; }
	.list-news.bordered .items:nth-child(3n+3){ margin-right:0px; }
	.top_title .left{ float:none; display:block; margin-bottom:20px; }
	article .search.right{ float:none; display:block; }
	.top_title .share{ float:none; }
	#menu-mobile .other{ width:auto; margin:0 10px; }
	/*#announcer .news p{ width:800px;  }*/
	#announcer .news{ width:auto; max-width:150px; overflow:hidden; white-space: nowrap; }
}
