@charset "utf-8";
/* CSS Document */	
@media screen and (min-width:1000px) and (max-width:1129px){
.container_24{
	width: 1000px;
	margin-left: auto;
	margin-right: auto;
}
#cssmenu > ul > li > a {
	padding: 17px;
	padding-bottom: 14px;
	padding-top: 14px;
  	color: #FFF;
  	text-transform: uppercase;
  	font-size: 14px;
  	z-index: 2;
  	position: relative;
  	transition: all 0.5s ease 0s; 
  	-webkit-transition: all 0.5s ease 0s;
}
}
@media screen and (min-width:1130px){
.container_24{
	width: 1120px;
	margin-left: auto;
	margin-right: auto;
}
#cssmenu > ul > li > a {
	padding: 17px;
	padding-bottom: 14px;
	padding-top: 14px;
  	color: #FFF;
  	text-transform: uppercase;
  	font-size: 14px;
  	z-index: 2;
  	position: relative;
  	transition: all 0.5s ease 0s; 
  	-webkit-transition: all 0.5s ease 0s;
}
}
@media screen and (min-width:1000px){
body{
	margin: 0px;
	background: #FFF;
}
.menu-mobile{
	display: none;
}
#menumob{
	display: none;
}
.top1{
	float: left;
	width: 100%;
	height: 30px;
	overflow: hidden;
	background: #dfdfdf;
	font-family: 'open_sansregular';
	font-size: 11px;
	color: #414141;
}
.top1 .sosmed{
	float: right;
	margin-right: 10px;
	margin-top: 4px;
}
.top1 .sosmed img{
	height: 20px;
	margin-right: 5px;
}
.top1 span{
	float: right;
	margin-top: 7px;
	margin-right: 5px;
}
.top2{
	float: left;
	width: 100%;
	height: 95px;
	background: #FFF;
	position: relative;
	z-index: 5;
}
.top2 .logo{
	float: left;
}
.top2 .logo img{
	margin-top: -10px;
	width: 480px;
}
.top2 .logo-mob{
	display: none;
}
.top2 .cari{
	float: right;
	margin-top: 30px;
}
.top2 .cari .input{
	float: right;
	width: 230px;
	height: 37px;
	padding-left: 5px;
	background: #FFF;
	border: 1px solid #cfcfcf;
	font-family: 'open_sansregular';
	font-size: 12px;
	color: #757575;
	border-top-left-radius: 4px;
	border-bottom-left-radius: 4px;
}
.top2 .cari .submit{
	float: right;
	width: 39px;
	height: 39px;
	background: url(../images/cari.png) no-repeat center #737373;
	text-align: center;
	border: 1px solid #737373;
	border-top-right-radius: 4px;
	border-bottom-right-radius: 4px;
}
.menu{
	float: left;
	width: 100%;
	height: 42px;
	background: #267abf;
}
#cssmenu {
  	width: 80%;
  	float: left;
  	margin-left: 11%;
  	padding: 0;
  	line-height: 1;
  	display: block;
  	position: relative;
  	font-family: 'open_sanssemibold';
}
#cssmenu ul {
  	list-style: none;
  	margin: 0;
  	padding: 0;
  	display: block;
}
#cssmenu ul:after,
#cssmenu:after {
  	content: " ";
  	display: block;
  	font-size: 0;
  	height: 0;
  	clear: both;
  	visibility: hidden;
}
#cssmenu ul li {
  	margin: 0;
  	padding: 0;
  	display: block;
  	position: relative;
}
#cssmenu ul li a {
  	text-decoration: none;
  	display: block;
  	margin: 0;
  	-webkit-transition: color .2s ease;
  	-moz-transition: color .2s ease;
  	-ms-transition: color .2s ease;
  	-o-transition: color .2s ease;
  	transition: color .2s ease;
  	-webkit-box-sizing: border-box;
  	-moz-box-sizing: border-box;
  	box-sizing: border-box;
}
#cssmenu ul li ul {
  	position: absolute;
  	left: -9999px;
  	top: auto;
  	z-index:20;
}
#cssmenu ul li ul li {
  	max-height: 0;
  	position: absolute;
  	-webkit-transition: max-height 0.4s ease-out;
  	-moz-transition: max-height 0.4s ease-out;
  	-ms-transition: max-height 0.4s ease-out;
  	-o-transition: max-height 0.4s ease-out;
  	transition: max-height 0.4s ease-out;
  	background: rgba(51,57,93,0.8);
}
#cssmenu ul li ul li.has-sub:after {
  	position: absolute;
  	top: 17px;
  	right: 12px;
  	width: 4px;
  	height: 4px;
  	border-top: 2px solid #FFF;
  	border-right: 2px solid #FFF;
  	content: "";
  	-webkit-transform: rotate(45deg);
  	-moz-transform: rotate(45deg);
  	-ms-transform: rotate(45deg);
  	-o-transform: rotate(45deg);
  	transform: rotate(45deg);
  	-webkit-transition: border-color 0.2s ease;
  	-moz-transition: border-color 0.2s ease;
  	-ms-transition: border-color 0.2s ease;
  	-o-transition: border-color 0.2s ease;
  	transition: border-color 0.2s ease;
}
#cssmenu ul li ul li a {
  	font-size: 14px;
  	text-transform: none;
  	color: #FFF;
  	letter-spacing: 0;
  	display: block;
  	padding: 10px;
  	line-height:1.3em;
  	transition: all 0.5s ease 0s; 
  	-webkit-transition: all 0.5s ease 0s;
}
#cssmenu ul li ul li:hover > a,
#cssmenu ul li ul li.active > a {
  	background: #33395d;
}
#cssmenu ul li ul li:hover > ul {
  	left: 100%;
  	top: 0;
}
#cssmenu ul li ul li:hover > ul > li {
  	max-height: 72px;
  	position: relative;
}
#cssmenu > ul > li {
  	float: left;
}
#cssmenu.align-center > ul > li {
  	float: none;
  	display: inline-block;
}
#cssmenu.align-center > ul {
  	text-align: center;
}
#cssmenu.align-center ul ul {
  	text-align: left;
}
#cssmenu.align-right > ul {
  	float: right;
}
#cssmenu.align-right > ul > li:hover > ul {
  	left: auto;
  	right: 0;
}
#cssmenu.align-right ul ul li:hover > ul {
  	right: 100%;
  	left: auto;
}
#cssmenu.align-right ul ul li a {
  	text-align: right;
}
#cssmenu > ul > li:after {
  	content: "";
  	display: block;
  	position: absolute;
  	width: 100%;
  	height: 0;
  	top: 0;
  	z-index: 0;
  	background:none;
  	-webkit-transition: height .2s;
  	-moz-transition: height .2s;
  	-ms-transition: height .2s;
  	-o-transition: height .2s;
  	transition: height .2s;
}
#cssmenu > ul > li.has-sub > a::after {
  	position: absolute;
  	top: 17px;
  	right: 8px;
  	width: 4px;
  	height: 4px;
  	border-bottom: 2px solid #FFF;
  	border-right: 2px solid #FFF;
  	content: "";
  	-webkit-transform: rotate(45deg);
  	-moz-transform: rotate(45deg);
  	-ms-transform: rotate(45deg);
  	-o-transform: rotate(45deg);
  	transform: rotate(45deg);
  	-webkit-transition: border-color 0.2s ease;
  	-moz-transition: border-color 0.2s ease;
  	-ms-transition: border-color 0.2s ease;
  	-o-transition: border-color 0.2s ease;
  	transition: border-color 0.2s ease;
}
#cssmenu > ul > li:hover:after,
#cssmenu > ul > li.active:after {
  	background: #33395d;
}
#cssmenu > ul > li:hover > a,
#cssmenu > ul > li.active > a {
  	background: #33395d;
}
#cssmenu > ul > li:hover > a:after,
#cssmenu > ul > li.active > a:after {
  	background:none;
}
#cssmenu > ul > li:hover > a:before,
#cssmenu > ul > li.active > a:before {
  	border-top-color:none;
}
#cssmenu > ul > li:hover > ul {
  	left: 0;
}
#cssmenu > ul > li:hover > ul > li {
  	max-height: 72px;
  	position: relative;
}
#cssmenu #menu-button {
  	display: none;
}
#cssmenu > ul > li > a {
  	display: block;
}
#cssmenu > ul > li {
  	width: auto;
}
#cssmenu > ul > li > ul {
  	width: 220px;
  	display: block;
}
#cssmenu > ul > li > ul > li {
  	width: 220px;
  	display: block;
}

.slide{
	float: left;
	width: 100%;
	position: relative;
}

.news-home{
	float: left;
	width: 100%;
	margin-top: 70px;
	margin-bottom: 70px;
}
.news-home .atas{
	float: left;
	width: 100%;
	margin-bottom: 20px;
}
.news-home .atas h1{
	float: left;
	font-family: 'GothamBold';
	font-size: 18px;
	color: #4f4f4f;
	letter-spacing: 0.5px;
}
.news-home .atas .more{
	float: right;
}
.news-home .atas .more a{
	float: right;
	padding: 10px;
	border-radius: 3px;
	background: #267abf; 
	color: #FFF;
	font-family: 'open_sansbold';
	font-size: 11px;
	transition: all 0.5s ease 0s; 
  	-webkit-transition: all 0.5s ease 0s;
}
.news-home .atas .more a:hover{
	background: #000; 
}
.news-home .bawah{
	float: left;
	width: 100%;
	height: 420px;
	overflow: hidden;
}
.news-home .bawah .left{
	float: left;
	width: 60%;
	height: 420px;
	overflow: hidden;
	position: relative;
}
.news-home .bawah .left img{
	width: 100%;
	transition: all 0.5s ease 0s; 
  	-webkit-transition: all 0.5s ease 0s;
}
.news-home .bawah .left:hover img{
	-webkit-transform: scale(1.05);
  	transform: scale(1.05);
}
.news-home .bawah .left .back{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	background: rgba(0,0,0,0.4);
}
.news-home .bawah .left .back h1{
	float: left;
	width: 90%;
	margin: 5%;
	margin-top: 45%;
	margin-bottom: 10px;
	color: #FFF;
	font-family: 'open_sansbold';
	font-size: 26px;
}
.news-home .bawah .left .back .tgl{
	float: left;
	width: 90%;
	margin: 5%;
	margin-top: 0%;
	color: #FFF;
	font-family: 'open_sansregular';
	font-size: 12px;
}
.news-home .bawah .right{
	float: right;
	width: 39.5%;
	height: 420px;
	overflow: hidden;
}
.news-home .bawah .right .box{
	float: right;
	width: 49.5%;
	height: 209px;
	margin-bottom: 5px;
	overflow: hidden;
	position: relative;
}
.news-home .bawah .right .box:nth-child(odd){
	float: left;
	width: 49.5%;
	height: 209px;
	overflow: hidden;
	position: relative;
}
.news-home .bawah .right .box img{
	height: 100%;
	transition: all 0.5s ease 0s; 
  	-webkit-transition: all 0.5s ease 0s;
}
.news-home .bawah .right .box:hover img{
	-webkit-transform: scale(1.05);
  	transform: scale(1.05);
}
.news-home .bawah .right .box .back{
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	background: rgba(0,0,0,0.3);
}
.news-home .bawah .right .box .back h1{
	float: left;
	width: 90%;
	margin: 5%;
	margin-top: 50%;
	margin-bottom: 10px;
	color: #FFF;
	font-family: 'open_sansbold';
	font-size: 14px;
}
.news-home .bawah .right .box .back .tgl{
	float: left;
	width: 90%;
	margin: 5%;
	margin-top: 0%;
	color: #FFF;
	font-family: 'open_sansregular';
	font-size: 11px;
}

.sambutan{
	float: left;
	width: 100%;
	height: 333px;
	background: #cbeaed;
}
.sambutan .kiri{
	float: left;
	width: 45%;
	height: 333px;
	overflow: hidden;
	position: relative;
}

.sambutan .kiri img{
	height: 100%;
	width: 100%;
}

.sambutan .kanan{
	float: left;
	width: 50%;
	margin-left: 3%;
	margin-top: 50px;
}
.sambutan .kanan h1{
	float: left;
	width: 100%;
	margin-bottom: 20px;
	font-family: 'GothamBold';
	color: #000;
	font-size: 24px;
}
.sambutan .kanan .text{
	float: left;
	width: 100%;
	margin-bottom: 20px;
	font-family: 'open_sansregular';
	color: #545454;
	font-size: 14px;
	line-height: 1.3em;
}
.sambutan .kanan a{
	float: left;
	padding: 10px;
	padding-left: 15px;
	padding-right: 15px;
	border-radius: 3px;
	background: #267abf; 
	color: #FFF;
	font-family: 'open_sansbold';
	font-size: 11px;
	transition: all 0.5s ease 0s; 
  	-webkit-transition: all 0.5s ease 0s;
}
.sambutan .kanan a:hover{
	background: #000; 
}

.dewan{
	float: left;
	width: 100%;
	padding-top: 60px;
	padding-bottom: 40px;
	background: #FFF;
}
.dewan h1{
	float: left;
	width: 100%;
	text-align: center;
	margin-bottom: 30px;
	font-family: 'GothamBold';
	color: #4e4e4e;
	font-size: 18px;
	letter-spacing: 1px;
}
.dewan .area{
	float: left;
	width: 100%;
}
.dewan .area .box{
	float: left;
	width: 90%;
	margin: 5%;
	height: 280px;
	text-align: center;
}
.dewan .area .box .pic{
	float: left;
	width: 100%;
	height: 153px;
	text-align: center;
	margin-bottom: 20px;
}
.dewan .area .box .pic img{
	width: 153px;
}
.dewan .area .box h1{
	float: left;
	width: 100%;
	text-align: center;
	font-family: 'GothamBold';
	color: #01294a;
	font-size: 16px;
	letter-spacing: 0px;
	margin-bottom: 5px;
}
/* Bob */
@-webkit-keyframes hvr-bob {
  0% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }
  50% {
    -webkit-transform: translateY(-4px);
    transform: translateY(-4px);
  }
  100% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }
}
@keyframes hvr-bob {
  0% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }
  50% {
    -webkit-transform: translateY(-4px);
    transform: translateY(-4px);
  }
  100% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }
}
@-webkit-keyframes hvr-bob-float {
  100% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }
}
@keyframes hvr-bob-float {
  100% {
    -webkit-transform: translateY(-8px);
    transform: translateY(-8px);
  }
}
.hvr-bob {
  	display: inline-block;
  	vertical-align: middle;
  	-webkit-transform: perspective(1px) translateZ(0);
  	transform: perspective(1px) translateZ(0);
  	box-shadow: 0 0 1px transparent;
}
.hvr-bob:hover, .hvr-bob:focus, .hvr-bob:active {
  	-webkit-animation-name: hvr-bob-float, hvr-bob;
  	animation-name: hvr-bob-float, hvr-bob;
  	-webkit-animation-duration: .3s, 1.5s;
  	animation-duration: .3s, 1.5s;
  	-webkit-animation-delay: 0s, .3s;
  	animation-delay: 0s, .3s;
  	-webkit-animation-timing-function: ease-out, ease-in-out;
  	animation-timing-function: ease-out, ease-in-out;
  	-webkit-animation-iteration-count: 1, infinite;
  	animation-iteration-count: 1, infinite;
  	-webkit-animation-fill-mode: forwards;
  	animation-fill-mode: forwards;
  	-webkit-animation-direction: normal, alternate;
  	animation-direction: normal, alternate;
}

.mapshome{
	float: left;
	width: 100%;
	background: #FFF;
}

.sub-head{
	float: left;
	width: 100%;
	padding-top: 30px;
	padding-bottom: 30px;
	background: #7a7a7a;
	font-family: 'open_sansregular';
	font-size: 11px;
	color: #FFF;
}
.sub-head2{
	float: left;
	width: 100%;
	padding-top: 15px;
	padding-bottom: 15px;
	background: #267abf;
}
.sub-head2 h1{
	float: left;
	font-size: 30px;
	color: #FFF;
	font-family: 'GothamBold';
}
.sub-head2 .sort{
	float: right;
	height: 38px;
	overflow: hidden;
	font-size: 14px;
}
:root .css3-metro-dropdown option,
:root .css3-metro-dropdown:after,
:root .css3-metro-dropdown::after,
:root .css3-metro-dropdown select
{
    color: #FFF;
	cursor:pointer;
}
 
:root .css3-metro-dropdown select,
:root .css3-metro-dropdown:after,
:root .css3-metro-dropdown::after
{
    display: block;
    background:none;
	color:#FFF;
}
 
:root .css3-metro-dropdown select,
:root .css3-metro-dropdown option
{
	color:#FFF;
}
 
:root .css3-metro-dropdown
{
    position: relative;
    display: inline-block;
	border-left:none;
}
 
:root .css3-metro-dropdown::after
{
    content: "\25bc";
    position: absolute;
    top: 0;
    right: 0;
    display: block;
    width: 22px;
    font-size: 8px;
    line-height: 38px;
    text-align: center;
    -webkit-pointer-events: none;
    -moz-pointer-events: none;
    pointer-events: none;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}
 
:root .css3-metro-dropdown select
{
   height: 38px;
   padding-left: 10px;
   padding-right: 20px;
   border: 0;
   vertical-align: middle;
   font-family: 'open_sansregular';
   font-size:14px;
   outline: 0 none;
   border-radius: 5px;
}
 
:root .css3-metro-dropdown option
{
    background:none;
    color: #000;
	border:none;
	cursor:pointer;
}
 
/* more colors */ 
:root .css3-metro-dropdown-color-ff2e12 select
{
    background: #FFF;
	color:#000;
}
:root .css3-metro-dropdown-color-ff2e12:after
{
    background: #FFF;
	color:#000;
}
:root .css3-metro-dropdown-color-ff2e12::after
{
    background: #FFF;
	color:#6d6d6d;
}
.sub-head3{
	float: left;
	width: 100%;
	height: 167px;
	overflow: hidden;
	position: relative;
	background: #000;
}
.sub-head3 .back{
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	background: rgba(0,0,0,0.4);
	color: #FFF;
	font-family: 'GothamBook';
	font-size: 30px;
}
.sub-head3 .back span{
	float: right;
	margin-top: 60px;
}

.konten{
	float: left;
	width: 100%;
	padding-top: 30px;
	padding-bottom: 30px;
	background: #FFF;
	border-bottom: 1px solid #c8c8c8;
}
.konten .left{
	float: left;
	width: 25%;
}
.konten .left h1{
	float: left;
	width: 90%;
	padding: 5%;
	background: #267abf;
	color: #FFF;
	text-align: center;
	font-family: 'open_sansbold';
	font-size: 17px;
}
.konten .left .area{
	float: left;
	width: 95%;
	padding: 2.5%;
	background: #f4f4f4;
	font-family: 'open_sansbold';
	font-size: 13px;
}
.konten .left .area li{
	float: left;
	width: 90%;
	margin: 2.5%;
	padding-right: 2.5%;
	padding-left: 2.5%;
	padding-bottom: 10px;
	list-style: none;
	border-bottom: 1px solid #e7e7e7; 
}
.konten .left .area li:nth-last-child(1){
	float: left;
	width: 90%;
	margin: 2.5%;
	padding-right: 2.5%;
	padding-left: 2.5%;
	padding-bottom: 10px;
	list-style: none;
	border-bottom: none; 
}
.konten .left .area li a{
	color: #0c0c0c;
	transition: all 0.5s ease 0s; 
  	-webkit-transition: all 0.5s ease 0s;
}
.konten .left .area li a:hover, .konten .left .area li a.active{
	color: #267abf;
}
.konten .left img{
	float: left;
	width: 100%;
	margin-top: 30px;
}
.konten .right{
	float: right;
	width: 70%;
}
.konten .right h1{
	float: left;
	width: 100%;
	color: #202020;
	font-family: 'open_sansbold';
	font-size: 30px;
	margin-bottom: 30px;
}
.konten .right .pic{
	float: left;
	width: 100%;
	margin-bottom: 20px;
}
.konten .right .pic img{
	width: 100%;
}
.konten .right .text{
	float: left;
	width: 100%;
	font-family: 'open_sansregular';
	font-size: 14px;
	color: #545454;
	line-height: 1.5em;
}
.konten .right .text img{
    height:100%;
	width: 100%;
}
.konten .right .text p{
	padding-bottom: 10px;
}
.konten .right .text li{
	padding-bottom: 10px;
	padding-left: 5px;
	margin-left: 15px;
}
.konten .right .sdm{
	float: left;
	width: 30%;
	margin: 1.5%;
	height: 370px;
	overflow: hidden;
	margin-bottom: 30px;
}
.konten .right .sdm .pic2{
	float: left;
	width: 100%;
	height: 263px;
	overflow: hidden;
	margin-bottom: 10px;
	text-align: center;
	background: #0879e3;
}
.konten .right .sdm .pic2 img{
	height: 100%;
	transition: all 0.5s ease 0s; 
  	-webkit-transition: all 0.5s ease 0s;
}
.konten .right .sdm:hover .pic2 img{
	-webkit-transform: scale(1.05);
  	transform: scale(1.05);
}
.konten .right .sdm h1{
	float: left;
	width: 100%;
	height: 23px;
	overflow: hidden;
	margin-bottom: 5px;
	font-family: 'open_sansbold';
	font-size: 16px;
	color: #004b71;
}
.konten .right .sdm .text{
	float: left;
	width: 100%;
	height: 63px;
	overflow: hidden;
	font-family: 'open_sansregular';
	font-size: 13px;
	color: #000;
}

.konten{
	float: left;
	width: 100%;
	padding-top: 30px;
	padding-bottom: 50px;
	background: #FFF;
	border-bottom: 1px solid #c8c8c8;
}
.konten h2{
	float: left;
	width: 100%;
	color: #202020;
	text-align: left;
	font-family: 'open_sansbold';
	font-size: 30px;
	margin-bottom: 30px;
}
.konten .box-pp{
	float: left;
	width: 22%;
	height: 420px;
	margin-right: 3%;
	margin-bottom: 30px;
	overflow: hidden;
}
.konten .box-pp .pic img:hover{
	transform: scale(1.1);
}
.konten .box-pp .pic{
	float: left;
	width: 100%;
	height: 340px;
	margin-bottom: 10px;
	text-align: center;
	overflow: hidden;
}
.konten .box-pp .pic img{
	width: 100%;
	transition: transform .2s;
}
.konten .box-pp h1{
	float: left;
	width: 100%;
	height: 60px;
	overflow: hidden;
	text-align: center;
	color: #202020;
	font-size: 16px;
	font-family: 'GothamBold';
}

.konten h3{
	float: left;
	color: #202020;
	font-family: 'open_sansbold';
	font-size: 30px;
	margin-bottom: 30px;
}
.konten h4{
	float: left;
	width: 100%;
	color: #202020;
	font-family: 'open_sansbold';
	font-size: 30px;
	margin-bottom: 30px;
}
.konten .cari{
	float: right;
}
.konten .cari .input{
	float: right;
	width: 180px;
	height: 37px;
	padding-left: 5px;
	background: #FFF;
	border: 1px solid #cfcfcf;
	font-family: 'open_sansregular';
	font-size: 12px;
	color: #757575;
	border-top-left-radius: 4px;
	border-bottom-left-radius: 4px;
}
.konten .cari .submit{
	float: right;
	width: 39px;
	height: 39px;
	background: url(../images/cari.png) no-repeat center #737373;
	text-align: center;
	border: 1px solid #737373;
	border-top-right-radius: 4px;
	border-bottom-right-radius: 4px;
}
.konten table#anggota{
	float: left;
	width: 100%;
	background: #f2f1f1;
	margin-top: 10px;
	margin-bottom: 30px;
}
.konten table#anggota tr{
	padding: 2.5%;
	width: 45%;
	float: left;
}
.konten .pic-foto{
	width: 161px;
	float: left;
	margin-right: 20%;
	height: 164px;
	overflow: hidden;
}
.konten .pic-foto img{
	width: 100%;
}
.konten .nama-anggota{
	width: 100%;
	float: left;
	color: #202020;
	font-family: 'GothamBold';
	font-size: 18px;
	margin-top: 5px;
	margin-bottom: 20px;
	overflow: hidden;
}
.konten .jabatan-anggota{
	width: 100%;
	float: left;
	color: #202020;
	font-family: 'GothamBook';
	font-size: 14px;
	overflow: hidden;
}
.konten .anggota-bawah{
	width: 100%;
	float: left;
	color: #202020;
	font-family: 'GothamBook';
	font-size: 14px;
	overflow: hidden;
}
.konten .anggota-bawah span{
	width: 100%;
	float: left;
	margin-bottom: 10px;
}
.konten .anggota-bawah a{
	float: left;
	padding: 10px;
	border-radius: 5px;
	border: 1px solid #aeaeae;
	background: #ededed;
    background: -webkit-linear-gradient(#ededed, #d0d0d0); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#ededed, #d0d0d0); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#ededed, #d0d0d0); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#ededed, #d0d0d0); /* Standard syntax */
	color: #000;
	font-family: 'open_sansbold';
	font-size: 15px;
}

.konten .left2{
	float: left;
	width: 65%;
}
.konten .left2 .box-news{
	float: right;
	width: 48%;
	height: 396px;
	overflow: hidden;
	margin-bottom: 20px;
}
.konten .left2 .box-news:nth-child(odd){
	float: left;
	width: 48%;
	height: 396px;
	overflow: hidden;
	margin-bottom: 20px;
}
.konten .left2 .box-news .pic{
	float: left;
	width: 100%;
	height: 202px;
	overflow: hidden;
	margin-bottom: 15px;
}
.konten .left2 .box-news .pic img{
	width: 110%;
	transition: all 0.5s ease 0s; 
  	-webkit-transition: all 0.5s ease 0s;
}
.konten .left2 .box-news:hover .pic img{
	-webkit-transform: scale(1.05);
  	transform: scale(1.05);
}
.konten .left2 .box-news h1{
	float: left;
	width: 100%;
	height: 38px;
	overflow: hidden;
	margin-bottom: 10px;
	font-family: 'open_sansbold';
	font-size: 16px;
	line-height: 1.1em;
}
.konten .left2 .box-news h1 a{
	color: #000000;
	transition: all 0.5s ease 0s; 
  	-webkit-transition: all 0.5s ease 0s;
}
.konten .left2 .box-news h1 a:hover{
	color: #585858;
}
.konten .left2 .box-news .tgl{
	float: left;
	width: 100%;
	font-family: 'open_sansregular';
	font-size: 11px;
	color: #e76229;
	margin-bottom: 15px;
}
.konten .left2 .box-news .text{
	float: left;
	width: 100%;
	height: 62px;
	font-family: 'open_sansregular';
	font-size: 14px;
	line-height: 1.5em;
	color: #585858;
	overflow: hidden;;
	margin-bottom: 10px;
}
.konten .left2 .box-news a.more{
	float: left;
	width: 100%;
	font-family: 'open_sansregular';
	font-size: 11px;
	color: #267abf;
	transition: all 0.5s ease 0s; 
  	-webkit-transition: all 0.5s ease 0s;
}
.konten .left2 .box-news a.more:hover{
	color: #000;
}
.konten .right2{
	float: right;
	width: 30%;
}
.konten .right2 h1{
	float: left;
	width: 95%;
	padding: 2.5%;
	background: #267abf;
	color: #FFF;
	text-align: center;
	font-family: 'open_sansbold';
	font-size: 15px;
	position: relative;
}
.konten .right2 h1::after{
    content: "\25bc";
    position: absolute;
    bottom: -15px;
    right: 47%;
    display: block;
    font-size: 20px;
    color: #267abf;
    text-align: center;
    -webkit-pointer-events: none;
    -moz-pointer-events: none;
    pointer-events: none;
}
.konten .right2 .area{
	float: left;
	width: 95%;
	padding: 2.5%;
	background: #f4f4f4;
	font-family: 'open_sansbold';
	font-size: 13px;
}
.konten .right2 .area .news-lain{
	float: left;
	width: 100%;
	font-family: 'open_sansregular';
	font-size: 13px;
	margin-bottom: 10px;
	margin-top: 10px;
	border-bottom: 1px solid #e7e7e7;
}
.konten .right2 .area .news-lain:nth-last-child(1){
	float: left;
	width: 100%;
	font-family: 'open_sansregular';
	font-size: 13px;
	margin-bottom: 10px;
	margin-top: 10px;
	border-bottom: none;
}
.konten .right2 .area .news-lain .pic{
	float: left;
	width: 25%;
	height: 70px;
	overflow: hidden;
}
.konten .right2 .area .news-lain .pic img{
	height: 100%;
}
.konten .right2 .area .news-lain h2{
	float: right;
	width: 70%;
	text-align: left;
	overflow: hidden;
	font-family: 'open_sanssemibold';
	font-size: 13px;
	line-height: 1.2em;
	margin-top: 5px;
}
.konten .right2 .area .news-lain h2 a{
	color: #000;
	transition: all 0.5s ease 0s; 
  	-webkit-transition: all 0.5s ease 0s;
}
.konten .right2 .area .news-lain h2 a:hover{
	color: #585858;
}

.konten .left2 h5{
	float: left;
	width: 100%;
	color: #000;
	font-family: 'open_sansbold';
	font-size: 30px;
	margin-bottom: 15px;
}
.konten .left2 .tgl-detail{
	float: left;
	width: 100%;
	font-family: 'open_sansregular';
	font-size: 12px;
	color: #e76229;
	margin-bottom: 15px;
}
.konten .left2 .pic-detail{
	float: left;
	width: 100%;
	overflow: hidden;
	margin-bottom: 20px;
}
.konten .left2 .pic-detail img{
	width: 100%;
}
.konten .left2 .text-detail{
	float: left;
	width: 100%;
	font-family: 'open_sansregular';
	font-size: 14px;
	line-height: 1.5em;
	color: #585858;
	margin-bottom: 10px;
	background-color: #fff;
    
}
.konten .left2 .text-detail p{
	padding-bottom: 5px;
}
.konten .left2 .text-detail li{
	padding-left: 5px;
	margin-left: 15px;
}
.konten .left2 .text-detail ul{
	padding-left: 5px;
	margin-left: 10px;
}

.konten .galeri{
	float: left;
	width: 100%;
}

.konten .galeri .box-folder{
	float: left;
	width: 18%;
	height: 270px;
	overflow: hidden;
	margin: 1%;
	font-family: 'open_sansbold';
	font-size: 16px;
	color: #000;
	margin-bottom: 30px;
	text-align: center;
}
.konten .galeri .box-folder .pic{
	float: left;
	width: 100%;
	height: 150px;
	overflow: hidden;
	position: relative;
	margin-bottom: 10px;
	text-align: center;
}
.konten .galeri .box-folder .pic img{
	height: 100%;
	transition: transform .2s;
}
.konten .galeri .box-folder:hover .pic img{
	transform: scale(1.1);
}
.konten .galeri .box-folder h1{
	float: left;
	width: 100%;
	height: 40px;
	overflow: hidden;
	color: #000;
	text-align: center;
	margin-bottom: 5px;
}

.konten .galeri .box{
	float: left;
	width: 31%;
	height: 270px;
	overflow: hidden;
	margin-right: 2%;
	font-family: 'open_sansbold';
	font-size: 16px;
	color: #000;
	margin-bottom: 30px;
}
.konten .galeri .box .pic{
	float: left;
	width: 100%;
	height: 200px;
	overflow: hidden;
	position: relative;
	margin-bottom: 10px;
}
.konten .galeri .box .pic img{
	width: 100%;
	transition: transform .2s;
}
.konten .galeri .box:hover .pic img{
	transform: scale(1.1);
}
.konten .galeri .box .pic .back{
 	opacity: 0;
    transition: all 0.5s ease 0s; 
    -webkit-transition: all 0.5s ease 0s;
}
.konten .galeri .box .pic:hover .back{
    opacity: 1;
    width: 100%;
    height: 100%;
    position: absolute;
    text-align: center;
    left: 0;
    top: 0;
    background: rgba(0,0,0,0.4);
}
.konten .galeri .box .pic:hover .back img{
    width: 48px;
    height: 48px;
    margin-top: 20%;
    transform: scale(1);
}
.konten .galeri .box h1{
	float: left;
	width: 100%;
	height: 40px;
	overflow: hidden;
	color: #000;
	margin-bottom: 5px;
}
.konten .galeri .box .tgl{
	float: left;
	width: 100%;
	color: #e76229;
	font-family: 'open_sansregular';
	font-size: 11px;
}

.kontak{
	float: left;
	width: 100%;
	background: #FFF;
	border-bottom: 1px solid #c8c8c8;
	position: relative;
}
.kontak .left{
	float: left;
	width: 40%;
	margin: 5%;
}
.kontak .left h1{
	float: left;
	width: 100%;
	margin-bottom: 20px;
	color: #202020;
	font-size: 24px;
	font-family: 'GothamBold';
}
.kontak .left .text{
	float: left;
	width: 100%;
	color: #646464;
	font-size: 15px;
	line-height: 1.5em;
	font-family: 'GothamBook';
}
.kontak .left .text p{
	padding-bottom: 10px;
}
.kontak .right{
	float: left;
	width: 50%;
	margin-top: 5%;
	margin-bottom: 5%;
}
.kontak .right .teks{
	float: left;
	width: 100%;
	font-family: 'open_sansregular';
	font-size: 16px;
	color: #616161;
	line-height: 1.5em;
	overflow: hidden;
	margin-bottom: 30px;
}
.kontak .right .input{
	float: left;
	width: 60%;
	padding-left: 2%;
	height: 40px;
	font-family: 'open_sansregular';
	font-size: 15px;
	margin-bottom: 15px;
	color: #000;
	background: #f2f2f2;
	overflow: hidden;
	border: none;
	-webkit-box-shadow: inset 1px 1px 0px 0px rgba(195,195,195,1);
	-moz-box-shadow: inset 1px 1px 0px 0px rgba(195,195,195,1);
	box-shadow: inset 1px 1px 0px 0px rgba(195,195,195,1);
}
.kontak .right textarea{
	float: left;
	width: 90%;
	padding-top: 2%;
	padding-left: 2%;
	height: 160px;
	font-family: 'open_sansregular';
	font-size: 15px;
	margin-bottom: 15px;
	color: #000;
	background: #f2f2f2;
	overflow: hidden;
	border: none;
	-webkit-box-shadow: inset 1px 1px 0px 0px rgba(195,195,195,1);
	-moz-box-shadow: inset 1px 1px 0px 0px rgba(195,195,195,1);
	box-shadow: inset 1px 1px 0px 0px rgba(195,195,195,1);
}
.kontak .right .submit{
	float: left;
	color: #FFF;
	font-size: 16px;
	font-family: 'open_sansbold';
	padding: 12px;
	padding-left: 50px;
	padding-right: 50px;
	border-radius: 5px;
	background: #267abf;
	text-align: center;
	-webkit-transition: background-color 0.5s, color 0.5s, border 0.5s;
  	transition: background-color 0.5s, color 0.5s, border 0.5s;
  	border: none;
}
.kontak .right .submit:hover{
	color: #FFF;
	background: #000;
}
.map-kontak{
	float: left;
	width: 100%;
	height: 400px;
	overflow: hidden;
}

.footer-atas{
	float: left;
	width: 100%;
	padding-top: 40px;
	padding-bottom: 60px;
	background: #005689;
}
.footer-atas .satu{
	float: left;
	width: 20%;
	margin-right: 2%;
	text-align: right;
	overflow: hidden;
}
.footer-atas .satu img{
	width: 100px;
}
.footer-atas .dua{
	float: left;
	width: 23%;
	margin-right: 2%;
	margin-top: 10px;
	overflow: hidden;
}
.footer-atas .dua h1{
	float: left;
	width: 100%;
	margin-bottom: 20px;
	font-family: 'GothamBold';
	color: #FFF;
	font-size: 18px;
}
.footer-atas .dua .text{
	float: left;
	width: 100%;
	font-family: 'GothamBook';
	color: #FFF;
	line-height: 1.5em;
	font-size: 13px;
}
.footer-atas .dua img{
	float: left;
	height: 21px;
	margin-right: 7px;
}
.footer-bawah{
	float: left;
	width: 100%;
	padding-top: 15px;
	padding-bottom: 15px;
	background: #FFF;
	text-align: center;
	font-family: 'GothamBook';
	font-size: 12px;
	color: #4b4b4b;
}

.pag{
    width: 100%;
    float: left;
    font-family: 'open_sansbold';
    font-size: 16px;
    margin-top: 20px;
    margin-bottom: 50px;
}
.pag ul{
    width: 100%;
    float: left;
}
.pag ul li{
    float:left;
    list-style:none;
}
.pag ul li a{
    float: left;
    width: 35px;
    height: 35px;
    background: #FFF;
    border: 1px solid #DDD;
    list-style: none;
    margin-right: 5px;
    color: #000;
    text-align: center;
    line-height: 2.1em;
    -webkit-transition: background-color 0.5s, color 0.5s;
    transition: background-color 0.5s, color 0.5s;
    text-decoration: none;
}
.pag ul li a:hover, .pag ul li.active a{
    background: #267abf;
    border: 1px solid #267abf;
    color: #FFF;
}

.bold { font-weight: bold; }