@import url("typography.css");
@import url("bootstrap.css");

@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,700,800);
@import url(https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,400,700,800);
@import url(https://fonts.googleapis.com/css?family=Montserrat);

html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}
body{margin:0; font-family: 'Open Sans' ! important; font-size: 13px ! important;}
article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}
audio,canvas,video{display:inline-block;vertical-align:baseline}

a{background-color:transparent;}
a:active,a:hover{outline:0}
abbr[title]{border-bottom:1px dotted}
b,strong,optgroup{font-weight:bold}

h1, h2, h3, h4, h5, h6 { font-family: 'Open Sans'; font-weight: 700 ! important; }

#pirates { width:1170px; margin: 0 auto; padding:0;}
#pirates .container { max-width: 1170px;}
#pirates .sobry.bintoro { padding: 0 ; margin: 0 auto;}
#pirates .sobry.bintoro .container { max-width: 1170px; height: 40px;}
#pirates .sobry.bintoro .bajak { height: 40px; overflow: hidden; }
#pirates .sobry.bintoro .bajak .main-css.com { }

#pirates .bajak.sawah .asyik { list-style: none;}
#pirates .bajak.sawah .asyik li { display: inline-block; font-size: 15px; font-family: 'Open Sans';}
#pirates .bajak.sawah .asyik li a { padding: 4px 8px; font-weight: bold; font-size: 13px; margin-top: 6px;}

.tickercontainer { font-family : 'Open Sans'; width: 100%;  height: 40px; margin: 0; padding: 0; overflow: hidden; }
.tickercontainer .mask { position: relative; margin: 0; overflow: hidden; height: 34px;}
.mask .ticker-title { height: 26px; position: absolute; z-index: 300; padding: 0 10px; top: 7px;font: bold 14px/26px 'Open Sans'; }
ul.newstickers { position: relative; left: 100%; list-style-type: none; margin: 10px 0; padding: 0;}
ul.newstickers li { float: left; margin: 0; padding: 0; height: 24px; font-size: 12px; overflow: hidden;}
ul.newstickers a { white-space: nowrap; padding: 0; font-weight: normal; margin: 0 50px 0 0; } 
ul.newstickers .fa { margin-right: 10px; } 
ul.newstickers span { margin: 0 10px 0 0; font-weight: bold; padding: 0 8px; line-height: 20px; border-radius: 3px;} 

#pirates .sobry.bintoro .bajak .jack.sparrow .ga-keren .wekzzz{ text-align: right; padding-top: 0; font-size: 16px; list-style: none;}
.wekzzz li { display: inline;}
#keren { margin:0 0 10px; display: inline; display: block; font: bold 28px 'Open Sans Condensed', 'Open Sans';}
#keren span.time { float: right; font: bold 25px 'Open Sans';}
#keren span .hour { line-height: 30px; padding: 0 5px; text-align: center; }
#keren span .second { line-height: 30px; padding: 0 5px; text-align: center;}
#pirates .sobry.bintoro .ga-keren .fa { width:45px; height: 45px; line-height: 45px; text-align: center;}
#pirates .sosial { text-align: center; margin-top: -20px; margin-right: 30px;}
#pirates .sosial .fa { width: 40px; height: 40px; line-height: 35px; text-align: center; border-radius: 50%; font-size: 22px;}
#pirates .sosial .fa:hover { width: 40px; height: 40px; line-height: 35px; text-align: center; border-radius: 50%; font-size: 22px;}

#header.mumet { height: 100px;}
#header.mumet .logo {margin-top: 10px; }
#header.mumet .logo img {height: 80px;}
#header.mumet .logo .col-md-6 {margin-top: 20px; }

#header.mumet .menu-bajak { position: absolute; z-index:1000; width: 100%;}
#header.mumet .menu-bajak .pilih-bajak { list-style: none; margin-top: 15px; padding-top: 10px; padding-bottom: 10px; margin-bottom: 0px; line-height: 25px;}
#header.mumet .menu-bajak .pilih-bajak li { list-style: none; display: inline; position: relative; padding:10px 5px; }
#header.mumet .menu-bajak .pilih-bajak li  a { font-weight: bold; text-decoration: none;}
#header.mumet .menu-bajak .pilih-bajak li ul { display: none; position: absolute; left: 0; top: 42px; padding:0; 
transition: all .1s ease .1s ! important; width: 200px;}
#header.mumet .menu-bajak .pilih-bajak li:hover ul { display: block; transition: all 1s ease .1s ! important; top:42px; margin-top: 0  ! important;}
#header.mumet .menu-bajak .pilih-bajak li ul li { border-bottom: none ! important; display: block; padding: 4px 15px; position: relative;}
#header.mumet .menu-bajak .pilih-bajak li ul li a {padding: 8px 0; line-height:13px; font-weight: normal;}
#header.mumet .menu-bajak .pilih-bajak li ul li ul {position: absolute; left: 200px; top: 0px ! important; padding:0; display: none ! important;}
#header.mumet .menu-bajak .pilih-bajak li ul li:hover ul {display: block ! important;}
#header.mumet .mbajak.sawah .pake-kebo { margin-top:20px;}

#openmobi { display: none;}

#pirates #primary-header .container {padding: 0 ! important;}
#pirates-flag {width: 1170px; margin: 0 -15px;}
.container.bigheader, .col-md-12.jack-sparrow {padding: 0; position: relative; min-height:400px;}
.loading { width:100%; height:200px; position: absolute; top:0;}
.col-md-12.jack-sparrow img { width: 100%;}
.col-md-12.jack-sparrow .deskripsi { width: 50%; height: 180px; position: absolute; bottom: 0; right: 0;
 z-index:999; }
.deskripsi .bajakan { height: 180px; margin-right:30px; padding: 20px;}
.deskripsi h1 { margin:10px 0; padding-bottom: 10px;  text-align: center; font: bold 36px/36px 'Open Sans Condensed';}
.deskripsi .address { text-align: center;}

#home-content  .col-md-6.quotes { padding: 0;}
#home-content .quotes .bajak-quotes { margin-right:30px; padding: 20px; text-align: center;}
#home-content  .col-md-6.sambutan { padding: 0;}
.kepala {margin-left: 30px; padding: 20px 20px 20px 0; font-size: 13px;}
.photo-kepala {float:left; width: 115px; height: 115px; border-radius: 50%; margin-right:20px; overflow: hidden;}
.photo-kepala img { width: 100%;}
.issam { margin-left:145px;}

.p-kepsek {position: relative; padding:10px;}
.p-kepsek h4 {position: absolute; bottom: 10px; left:5px; z-index:1000; padding: 8px 20px; font-size: 14px; font-style: italic;}

.col-md-6.news { }
.col-md-6.news h3 { position: relative; margin-top:0; }
.news .dashed { margin-bottom:-15px; height:1px; display: block; width: 100%;}
.news h3 .h3title { padding-right:10px;}
.news h3 .fa { padding-left:10px; padding-right: 15px; float: right;}

.col-md-5.thumbnail { margin-bottom:10px; margin-top: 10px; overflow:hidden;}
.jack-meta { margin-top: 10px;}
.jack-meta span {float: right;}

.col-md-6.pirates-news { padding: 0px;}
.col-md-6.pirates-news .sobry-copy { margin-right:15px; padding: 15px; color: #fff; position: relative; overflow:hidden;}
.youtube .vpirates {width: 100%; height:300px;}
.sobry-copy:after { content: "\f086"; font-family: FontAwesome; position: absolute; top: -70px; right: -50px; 
font-size:200px; z-index:1;}
.sobry-copy h3 { margin-top: 0;}
.sobry-copy .bold { font-weight: bold;}
.sobry-copy .peng { padding: 10px 0; z-index:1000;}
.sobry-copy.nge-blank { padding: 15px 0 ! important;}
.sobry-copy.nge-blank .list a.photos img { width: 24.5%; margin:0 0 5px ! important;}

.is-bottom { margin:15px; line-height:40px;}

.vote-bajak  label { display: block; line-height:18px;}
input[type="radio"] {
    padding: 0;
    margin: 5px 10px 5px 0 ! important ;
    vertical-align: middle;
}

/* MAIN CONTENT */
#main-content.row {margin: 15px 0 0;}

.overflow { overflow-x:auto;}

.sidebar h3 {margin: 0; padding: 10px 25px; text-align: left; font: 700 16px/26px 'Open Sans'; z-index: 1000px; position: relative; margin-top: 0px;}
#aside-secondary { margin-bottom: 20px;}
#aside-secondary .circle { width: 100px; height: 100px; margin: 20px; border-radius: 50%; overflow: hidden; float: left;}
#aside-secondary .circle img { width: 100%;} 
#aside-secondary p { text-align: left; font-family: 'Open Sans'; font-size: 13px; padding: 25px 20px; margin-bottom: 30px; }
#aside-secondary .is-poll, #aside-secondary .is-links { margin:0 0 15px; padding: 15px 20px;}
#aside-secondary .is-poll label { display: block ! important; font-weight: normal ! important;}
#aside-secondary .is-links .links { line-height:30px;}
#aside-secondary .is-links .links .fa { float: right; line-height: 30px;}

/* MAPS Hubungi Kami */
#maps .col-md-12 { padding:0;}
#maps #googleMap { width: 100%; height: 350px;}
#main-content .left-content { overflow: hidden; margin-bottom: 15px;}
.left-content h3 { margin: 0; padding: 10px 0; text-align: left; font: 700 18px/28px 'Open Sans';}
.left-content h3 span {line-height: 28px; border:1px solid #ccc; padding: 0 10px;}
.left-content h3 span.share { float: right; }
.left-content h3 span .fa { width: 18px; height: 18px; text-align: center; line-height: 18px; font-size: 14px; }
.left-content .widget { padding: 15px 0;}
.left-content .widget h5 { font: 400 13px/20px 'Open Sans' !important; margin-top: 6px; margin-bottom: 6px;}

.widget .post .piratitle { font: 700 26px/30px 'Open Sans'; }

.left-content .modal-header { padding: 0 20px ! important; position: relative;}
.left-content .modal-header h3 { border: none ! important; padding: 5px 0;}
.left-content .modal-header button { position: absolute; top: 10px; right:10px; background: none; border: none;}
.left-content .modal-header button .fa { font-size: 18px;}
.left-content .modal-body { padding: 15px 20px ! important;}
.left-content .modal-body img { max-width: 100%; margin-bottom: 20px;}
.left-content .modal-body img.mod-pho { width: 200px; height: auto; float: left; margin-right:30px;}
.left-content .modal-body h5 { font: 700 24px/28px 'Open Sans Condensed', 'Open Sans' ! important; margin-bottom: 15px ! important;}
.left-content .modal-body .is-photo {width: 40%; float: left;}
.is-photo .p-photo {margin-right:20px;}
.left-content .modal-body .is-data {width: 60%; float: right;}
.left-content .modal-body p { text-align: left;}
.left-content .tdcen {text-align: center;}

.gallimg { float:left; width: 25%;}
.gallimg img { width: 100%; height: auto;}

.vi-tube { width: 100%; height: 400px;}
.featured {width: 100%;}

.post h4 { font: 700 18px/1.2 'Open Sans'; margin-top: 0;}
.metadata { line-height: 30px;}
.metadata span { font: 13px 'Open Sans'; line-height: 18px; padding: 3px 5px;}
.post p { font: 14px/20px 'Open Sans'; margin-top:20px;}
.post .readmore { width: 100%; margin-bottom: 10px;}

.widget canvas {width:100%; height: auto; margin:0 auto;}

.left-content h3.inseko { font: 700 18px 'Open Sans'; margin: 20px 0; padding: 10px 15px;}

/* PPDB */
.widget .ppdb { line-height:22px; padding: 0; margin: 0 0 20px;} 
.btn { margin-top: 16px ! important;}
input.btn-primary, button.btn-primary, a.btn-primary { font: 700 15px 'Open Sans'; border: 0 ! important;}
a.btn-primary { margin-left: 3px;}
a.btn-warning { font: 700 18px 'Open Sans'; padding: 7px 12px; border-radius: 4px; }

.comments { position:relative;}
.comments:after { clear: both;}
.fb_iframe_widget { display: inline-block; position: relative; margin: 0 auto; width: 100% !important; }
.fb_iframe_widget span { display: inline-block; position: absolute; text-align: justify; right: 0; left: 0; width: 100% !important; }
.fb_iframe_widget iframe { position: absolute; right: 0; left: 0; width: 100% !important; clear: both; }

/* Agenda */
.fc-row table {border-right: 1px solid #ddd ! important;}

/* Hubungi Kami */
label span, legend span { font: 400 14px 'Open Sans' ! important; margin-top: 5px;}

/* Styling Footer */

#sub-footer { padding: 0; font: 13px 'Open Sans';}
#footcont { padding: 15px 30px ! important;}
#sub-footer li { list-style: none; font-weight: bold;}
#sub-footer li span { float: right;}
#sub-footer h4 { font : 700 18px/1.1 'Open Sans'; border-bottom: 1px dotted #fff; padding: 10px 0;}
#sub-footer h5 { font : 700 18px/1.5 'Open Sans'; }
#sub-footer .is-facebook {margin-top: 20px;}

#copyright-wrapper { padding: 15px 0; font :12px/1.4 'Open Sans';}
#copyright-wrapper #close.container {padding: 0 15px ! important;}
#copyright-wrapper .row {margin-bottom: 0;}
.design { text-align: right;}

@media screen and (max-width: 1024px) {
#pirates { width: 970px ! important;}
#pirates .container { max-width: 970px;}
#pirates .sobry.bintoro .bajak .main-css.com { display: none;}
#pirates .sobry.bintoro .bajak .col-md-8.jack.sparrow { width: 100%; }
#pirates .col-md-5 { width: 31.666666%;}
#pirates .col-md-7 { width: 68.33333333%;}
#header.mumet .logo img {width: 100%; height: auto;}
#pirates-flag { width: 970px;}
#keren { margin:0 0 10px; display: inline; display: block; font: bold 20px 'Open Sans Condensed', 'Open Sans';}
#keren span.time { float: right; font: bold 20px 'Open Sans';}
#keren span .hour { line-height: 30px; padding: 0 5px; text-align: center; }
#keren span .second { line-height: 30px; padding: 0 5px; text-align: center;}
.deskripsi h1 { font: bold 28px/28px 'Open Sans Condensed';}
.sobry-copy.nge-blank .list a.photos img { width: 24.4%;}
#header.mumet .logo { padding-top: 10px;}
.youtube .vpirates {width: 100%; height:250px;}
.vi-tube { width: 100%; height: 350px;}
}

@media screen and (max-width: 768px) {
#pirates { width: 100% ! important;}
#pirates .container { width: 100%;}
#header.mumet { height: auto;}
#pirates .col-md-5 { width: 50%; float: left;}
#pirates .col-md-7 { width: 50%; float: right;}
#header.mumet .logo { padding-top: 0px;}
#header.mumet .logo img {width: 90%; height: auto; margin: 0 auto;}
#header .menu-bajak { display: none;}
.sidebar .side {height: 140px;}

#openmobi { display: block; font-weight: bold; font-size: 24px; line-height: 40px; text-align: center;}
#pirates-flag { width: 768px;}
.col-md-12.jack-sparrow .deskripsi { width: 100%; height: 190px;}
.deskripsi .bajakan { margin: 0 30px; height: 165px;}
#pirates .sosial { margin-right: 0px;}
.kepala { padding: 20px 20px 40px 0; margin-right:30px;}
#home-content .quotes .bajak-quotes { margin: 0px; padding: 20px 30px;}
#pirates .col-md-5.thumbnail { width: 35%; float: left;}
#pirates .col-md-7.content { width: 65%; float: right;}
.jack-meta { margin-top: 40px;}
.loop-post .sekilas .jack-meta { margin-top: 15px;}
.col-md-6.pirates-news .sobry-copy { margin: 15px 15px 0;}
.sobry-copy.nge-blank .list a.photos img { width: 24.6%;}
.youtube .vpirates, .vi-tube { width: 100%; height: 350px;}

#copyright-wrapper #close.container { padding: 0 30px !important;}
}

@media screen and (max-width: 640px) {
#pirates-flag { width: 640px;}
.jack-meta { margin-top: 25px;}
.loop-post .jack-meta { margin-top: 5px;}
.sobry-copy.nge-blank .list a.photos img { width: 24.5%;}
.youtube .vpirates, .vi-tube  {width: 100%; height:300px;}
}

@media screen and (max-width: 600px) {
#header.mumet { height: 70px;}
.container.bigheader, .col-md-12.jack-sparrow { min-height: 365px;}
#pirates-flag { width: 600px;}
.jack-meta { margin-top: 15px;}
.sobry-copy.nge-blank .list a.photos img { width: 24.5%;}
}

@media screen and (max-width: 480px) {
#header.mumet { height: auto;}
#header.mumet .logo { text-align: center;}
#pirates-flag { width: 480px;}
.container.bigheader, .col-md-12.jack-sparrow { min-height: 360px;}
.deskripsi .bajakan { margin: 0 20px; padding: 10px;}
.deskripsi h1 { margin: 15px 0 10px;}
#pirates .col-md-5, #pirates .col-md-7 { width: 100%; float: none; padding:0;}
#pirates .col-md-5.thumbnail { width: 40%; padding: 4px;}
#pirates .col-md-7.content { width: 60%; padding: 0 0 0 15px;}
#pirates .col-md-7.content h4{ font-size: 16px; }
#pirates  .sks .col-md-5, #pirates  .sks .col-md-7 { padding: 0 15px;}
.kep-post { margin-top:30px;}
.pake-kebo {margin-top:10px;}
.col-md-6.pileft { width: 50%; float: left; margin-bottom: 10px;}
.sobry-copy.nge-blank .list a.photos img { width: 24.3%;}
.youtube .vpirates , .vi-tube {width: 100%; height:250px;}

/* GALERI ALBUM */
.left-content .widget h5 a span { display: none;}

.copyright, .design { text-align: center;}
}

@media screen and (max-width: 360px) {
#pirates-flag { width: 360px;}
.container.bigheader, .col-md-12.jack-sparrow { min-height: 305px;}
.col-md-6.pileft { width: 100%; float: none; margin-bottom: 5px; text-align: center;}
#keren {font: bold 14px/30px 'Open Sans Condensed', 'Open Sans';}
#keren span.time { float: right; font: bold 14px 'Open Sans';}
.deskripsi h1 { font: bold 18px/24px 'Open Sans Condensed';}
.photo-kepala { float: none; margin: 0 auto; padding: 20px 0 40px 0;}
.issam { margin: 20px 0;}
.sobry-copy.nge-blank .list a.photos img { width: 49.3%;}
.youtube .vpirates, .vi-tube  {width: 100%; height:200px;}
.is-bottom .infos { line-height: 20px; padding: 8px 0;}

/* ALUMNI */
.left-content .modal-body img.mod-pho { width: 100%; margin-right:0;}
/* POST */
.loop-post .col-xs-6 { width: 100%;}

#aside-secondary .circle { margin: 20px auto 0; float: none;}
.sidebar .side { height: auto;}
}

@media screen and (max-width: 320px) {
#pirates-flag { width: 320px;}
.container.bigheader, .col-md-12.jack-sparrow { min-height: 290px;}
.deskripsi .bajakan { margin: 0 10px; padding: 10px;}
#pirates .col-md-5.thumbnail  { width: 100%;}
#pirates .col-md-7.content { width: 100%; padding: 0;}
}