@import "typography.css";@import "bootstrap.css";
@import "https://fonts.googleapis.com/css?family=Open+Sans:300,400,700,800";

body{font:13px "Open Sans", Arial, Helvetica;color:#777 ! important;}
#wrapper{width:100%;margin:0px auto;box-shadow:0px 0px 20px #ccc;}
.container {width:100%;}

#fixed-wrapper{position:fixed;margin:0;z-index:1040;width:100%;}

/* HEADER */
#primary-header {margin:0 auto -54px}
#primary-header .header{position:relative;width:100%;margin:0 auto;padding:0;}
.header .social{width:300px;float:right}
.header .social a{margin:0}
.header .social .icon{color:#fff;text-align:center;width:160px;border-radius:0 0 25px 25px;height:23px;margin:0 auto}
.icon .fa{height:28px;width:28px;line-height:28px;text-align:center;margin:6px 0 0;font-size:16px;color:#fff;border-radius:50%;transition:all .5s ease .1s}

#tick {position:relative; z-index:99;}
.tickercontainer { font-family : 'Open Sans'; width: 100%;  height: 30px; margin: 0; padding: 0 ; 
overflow: hidden; }
.tickercontainer .mask { position: relative; margin: 0; overflow: hidden; height: 30px;}
.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: 5px 0; padding: 0;}
ul.newstickers li { float: left; margin: 0; padding: 0; height: 20px; font-size: 14px; overflow: hidden;}
ul.newstickers a { white-space: nowrap; padding: 0; font-weight: normal; margin: 0 50px 0 0; color:#fff;} 
ul.newstickers .fa { margin-right: 10px; } 
ul.newstickers span { margin: 0; font-weight: bold; padding: 0; line-height: 20px; border-radius: 3px;color: #fff;text-transform: uppercase;} 

/* SLIDE HOMEPAGE */
.slideshow {margin-top:58px;}
#slideshow, .slideshow {height: auto; width: 100%; overflow: hidden; position: relative;}
.slide {height: auto; width: 100%;}
.slide img {display: block; float: left; width: 100%; height: auto; position: relative; top:0; left:0;}
.slideshow #rarr, .slideshow #larr {position:absolute; bottom:30px;width:40px;height:40px;z-index: 10}
.slideshow #rarr {left:75px;}
.slideshow #larr {left:30px;}

#image-slider {position: relative;height: auto;overflow:hidden;margin:15px 0 0;}
#image-slider .slide-title {position: absolute;top: 15px;right: 15px;z-index: 99;padding: 0px 10px;font: 700 18px/30px 'Open Sans';}
#image-slider .slides li{ position: relative;width: 100%;}
#image-slider li img {width: 100%;}

#image-slider-two {position: relative;height: auto;overflow:hidden;margin:15px 0;}
#image-slider-two .slide-title {position: absolute;bottom: 20px;right: -50px;z-index: 99;padding: 4px 48px;transform: rotate(-45deg);font: 700 20px 'Open Sans';}
#image-slider-two .slides li{ position: relative;width: 100%;}
#image-slider-two #slider.flexslider{ padding: 20px;}
#image-slider-two li img {width: 100%;}


#image-slider .flex-direction-nav .flex-prev {left: 47px;opacity:1;}
#image-slider .flex-direction-nav .flex-next {right: auto;opacity:1;left:15px;}
#image-slider .flex-direction-nav a {top:35px;bottom:auto;}
.phead { padding: 20px 30px;}
.phead h4 {font: 700 20px/22px 'Open Sans';margin-bottom:10px;}

.datainner {position:absolute; right:-500px;top:0px;bottom:-500px; left:50%;
z-index: 100;transform: rotate(30deg);overflow:hidden;}
.inners {transform: rotate(-30deg);margin-top: 0px;margin-left: -80px;padding-left: 0;}
.inners h3 {font: 800 45px "Open Sans";overflow: hidden;margin-left: -30px;}
.inners h3 .fa {line-height: 70px;font-size:50px;width: 135px;text-align: right;padding-right: 25px;margin-right: 10px;}
.timers {transform: rotate(-30deg);margin-top: 250px;margin-left: -120px;padding-left: 0;height:80px;}
.timers h4 {font: 800 45px "Open Sans";overflow: hidden;margin-left: -30px;position:relative;}
.timers .time {font: 800 45px/45px "Open Sans" ! important;position:absolute;}
.timers .fa {line-height: 80px;font-size:65px;float:left;width: 115px;text-align: right;padding-right: 15px;margin-right: 20px;}
.timers #projam { margin-left:4px;padding-top:8px;}
.timers .date {font-weight:300;}
.address {transform: rotate(-30deg);margin-top: 3px;margin-left: -80px;padding-left: 0;}
.address h5 {font: 400 14px "Open Sans";overflow: hidden;margin-left: -14px;}
.address h5 .fa {line-height: 30px;width: 128px;text-align: right;padding-right: 15px;margin-right: 8px;}

/* INFO SEKOLAH */
.inseko {padding: 30px;position:relative;overflow:hidden;}
.rightbot {width: 500px;height: 500px;position: absolute;transform: rotate(-30deg);right: -100px;top: -200px;}
.scola {font-size:16px;float:left;}
.scola .fa {width:25px;}
.scola .fa-envelope {margin-left:25px;}
.scola h2 {font: italic 700 35px/45px "Open Sans";letter-spacing: -1px;}
.scola h6 {font: italic 20px/35px "Georgia";}

.my-style.callus {z-index:100;position:relative;float:right;max-width:300px;z-index:999px;}
.my-style.callus button{ margin-top: 25px;font-weight: bold;border: none;padding: 8px 15px;cursor: pointer;font: 700 24px 'Open Sans';}

.konten {padding: 15px 30px 0px 15px;}
.konten .quicknews {width:70%;float:left;}
.konten .quicknews .new-span {margin-left:15px;}
.konten .quicknews .new-span .spanl {font:800 35px/35px 'Open Sans';}
.konten .quicknews .new-span .spanl .fa { line-height: 35px;font-size: 32px;}
.konten .quicknews .new-span .spanr {font:italic 35px/35px 'Georgia';}
.konten .quicknews ul li {margin:15px 30px 30px 15px;list-style:none;overflow:hidden;}
.konten .quicknews ul li .postkon {width:50%; float:left;position:relative}
.konten .quicknews ul li .postkon .postisi {height:400px;padding:30px;position: absolute;bottom: 0px;top: 0px;right: 0px;}
.konten .quicknews ul li .postkon .postisi h4 {font:800 25px/25px 'Open Sans';}
.konten .quicknews ul li .postkon .postisi p {margin-top:15px;height:72px;overflow:hidden;}
.konten .quicknews ul li .postkon .postisi .home-more {height:60px; margin-top:25px;font-weight:bold;}
.konten .quicknews ul li .postkon .postisi .home-more a {padding: 10px 15px;}
.konten .quicknews ul li .postimg {width:50%; float:right;position:relative;}
.konten .quicknews ul li .postimg .imgisi {margin:0 0 -35px;transition:all .5s ease .1s;}
.konten .quicknews ul li .postimg .imgisi img {width:100%;}
.konten .quicknews ul li:hover .postimg .imgisi {margin:-30px 0 -5px;}

.konten .quicknews ul li .postimg .top-image {position:absolute;top:50%;left:50%;right:50%;bottom:50%;opacity:0.4;
transition: all .25s ease .1s;}
.konten .quicknews ul li:hover .postimg .top-image {top:0%;left:15px;right:0%;bottom:0%;}
.konten .quicknews ul li:nth-child(2):hover .postimg .top-image,
.konten .quicknews ul li:nth-child(4):hover .postimg .top-image {top:0%;left:0%;right:15px;bottom:0%;}
.konten .quicknews ul li:nth-child(2) .postkon {float:right;}
.konten .quicknews ul li:nth-child(2) .postkon .postisi {position: absolute;bottom: 0px;top: 0px;left: 0px;border-right: 0;}
.konten .quicknews ul li:nth-child(2) .postkon .postisi .home-more a {padding: 10px 15px;}
.konten .quicknews ul li:nth-child(2) .postimg {width:50%; float:left;}
.konten .quicknews ul li:nth-child(2) .postimg .imgisi {border-left: 0;}
.konten .quicknews ul li:nth-child(3) .postkon .postisi .home-more a {padding: 10px 15px;}
.konten .quicknews ul li:nth-child(4) .postkon {float:right;}
.konten .quicknews ul li:nth-child(4) .postkon .postisi {position: absolute;bottom: 0px;top: 0px;left: 0px;border-right: 0;}
.konten .quicknews ul li:nth-child(4) .postkon .postisi .home-more a {padding: 10px 15px;}
.konten .quicknews ul li:nth-child(4) .postimg {width:50%; float:left;}
.konten .quicknews ul li:nth-child(4) .postimg .imgisi {border-left: 0;}
.konten .quicknews ul li:nth-child(5) .postkon .postisi .home-more a {padding: 10px 15px;}

.konten .rightbar {width:30%;float:right;overflow:hidden;}
.konten .rightbar .new-span {margin-left:0; text-shadow:0 1px 2px #aaa;}
.konten .rightbar .new-span .spanl {font:800 35px/35px 'Open Sans';}
.konten .rightbar .new-span .spanl .fa { line-height: 35px;font-size: 32px;}
.konten .rightbar .new-span .spanr {font:italic 35px/35px 'Georgia';}

/* PENGUMUMAN + MOTIVASI + INFO SEKOLAH + SOCIAL */
.slide-after{}
.two-after{}
.two-after.menus{height:auto;}
.two-after.mores{height:auto;}
.konten .umum-after{padding:0;height:auto;position:relative;overflow:hidden;}
.konten .umum-after span{position:absolute;top:25px;left:10px;padding:6px 10px;font-weight:bold;z-index:1}
.konten .umum-after ul {margin-bottom:15px;}
.konten .umum-after li {list-style:none;height:55px; padding:0 20px;cursor:pointer;margin:0;}
.konten .umum-after li {font-weight:800;font-size:20px;line-height:55px;}
.konten .umum-after li .fa {margin-right:8px;font-size:20px;line-height:55px;}

#news-ticker{width:100%;margin:0 auto}
#news-ticker li{list-style:none;text-align:center;width:90%;
line-height:163px;padding:0;font:italic 300 17px/19px 'Open Sans'}

/* SAMBUTAN KEPSEK + SEKILAS INFO */

.head-o {position: relative;padding:15px;}
.head-o.home {position: relative;padding:15px 0 0;}
.head-o.home .headtalk {position:absolute; bottom:35px;right:30px;left:30px; 
padding:15px 25px 30px;}
.head-o .headtalk {position:absolute; bottom:35px;right:30px;left:30px; 
padding:15px;}
.head-o.home .headtalk {position:absolute; bottom:20px;right:15px;left:15px; }
.head-o  .headtalk h4{font-size:16px;font-weight:bold; margin-bottom:15px;}
.head-o  .headtalk p{font:italic 14px Georgia;}
.head-o  .headtalk  .headname {margin-bottom:20px;}
.head-o  .headtalk  .headname strong {position: relative;margin-top: 15px;font:800 14px 'Open Sans';}
.head-o  .headtalk  .headname a {float:right;font: italic 13px 'Open Sans';}
.bottom-after{float:right;width:512px;margin:0;height:200px;overflow:hidden;position:relative}
.bottom-after h4 { font:bold 16px "Open Sans";}

.bottom-after h3 { font:bold 16px "Open Sans";padding: 10px 15px;position:relative;}

#bot-bar{ padding:0;margin:0;clear:both}
.star {position:absolute;top:-135px;right:-180px;font-size:350px ! important;}
.poll{padding:0 15px;position: relative;}
.poll .fa{margin-right:5px}
.poll p{margin:15px 0;font-size:16px; line-height:16px;}
.botpoll{margin-top:10px;overflow:hidden}
.botpoll button{height:32px;font:bold 13px 'Open Sans';border:none;
border-radius:none;line-height:32px;padding:0px 15px;margin-right:3px}
.botpoll .jawaban{height:30px;font:bold 13px 'Open Sans';border:none;
border-radius:none;line-height:30px;padding:8px 15px;
margin-right:10px;text-transform:uppercase}

#home-bot {overflow:hidden;}
#home-bot .bottom .new-span {margin-left:30px;padding: 15px 0;margin-right:30px;}
#home-bot .bottom .new-span a {float:right;}
#home-bot .bottom .new-span .spanl {font:800 35px/35px 'Open Sans';}
#home-bot .bottom .new-span .spanl .fa { line-height: 35px;font-size: 32px;}
#home-bot .bottom .new-span .spanr {font:italic 35px/35px 'Georgia';color:#aaa;}
#galimg li.galhome {position:relative;list-style:none;float:left;margin:0;width:25%}
#galimg li.galhome img{display:block;width:100%;height:auto}
#galimg li.galhome .hover-e {position:absolute; top:0;bottom:0;left:0;right:0;z-index:1000;transition:all .5s ease .1s;}
#galimg li.galhome .hover-e .fa {position:absolute; top:50%;right:50%; font-size:25px;width:45px;height:45px;
line-height:45px; text-align:center;border-radius:23px;margin-right:-23px;margin-top:-23px;
transform:scale(10);opacity:0;transition:all .5s ease .1s;}
#galimg li.galhome .hover-e:hover .fa {transform:scale(1);opacity:1;}

canvas {width:100% ! important;}

#gallery-photo li{list-style:none;float:left;width:33.3333333%;margin:0}
#gallery-photo li img{display:block;width:100%;height:auto}

/*///////////////////////////////// MENU MENU //////////////////////////////////////////////////*/
#primary-navigator{position:relative;margin:0 auto;width:100%;padding:0;z-index:999}
#primary-navigator-list{margin:0 auto;width:100%;width:100%;}
.tree-menu,.tree-menu *{margin:0;padding:0;list-style:none}
.tree-menu li{position:relative}
.tree-menu ul{position:absolute;display:none;top:100%;left:0;z-index:99}
.tree-menu > li{float:left;padding:12px 8px}
.tree-menu > li:active{float:left;padding:12px 8px}
.tree-menu li:hover > ul,.tree-menu li.sfHover > ul{display:block}
.tree-menu a{display:block;position:relative}
.tree-menu ul ul{top:0;left:100%}.tree-menu{float:left}
.tree-menu ul{min-width:16em;*width:16em}
.tree-menu a{padding:6px 4px;text-decoration:none;zoom:1}
.tree-menu a{font:bold 16px/22px 'Open Sans', 'Patua One';}
.tree-menu li{white-space:nowrap;*white-space:normal}
.tree-menu li.quicksand {padding: 12px 14px;}
.tree-menu li.facebook, .tree-menu li.twitter, .tree-menu li.youtube, .tree-menu li.google, .tree-menu li.rss {float:right;width:54px;line-height:59px; text-align:center;padding:12px 0;}
.tree-menu li .fa {font-size:22px;}
.tree-menu ul li a,.tree-menu ul ul li a{padding:10px 10px;font:bold 13px/14px 'Open Sans', 'Patua One', sans-serif}
.tree-menu li:hover{-webkit-transition:none;transition:none}

/* HUBUNGI KAMI */

#promaps {width:100%;height:500px;position:relative;margin-top:58px;}
#promaps .addmaps {position:absolute; bottom:100px;right:40px; width:300px;padding:30px;border-radius:45px 0 45px 0;font:300 18px 'Open Sans';}

.mobimenu{display:none}
#dd-menu{display:none}
.widget .livevideo{width:645px;height:482px}

.homepage{width:100%}

.page-title  { margin-top:58px;}
.page-title.callus  { margin-top:0px;}
.page-title .de-title {text-align:center;padding: 40px 100px;}
.page-title .de-title h4 { font:800 35px/40px 'Open Sans';}

#main-content {float:right;padding:0px;width:75%;}
#main-content .incontent {width:66.6666%;float:left;}
#main-content .widget {position:relative;margin:15px;overflow-x:auto;}
#main-content .widget h5{font-size:14px;font-weight:bold;margin:10px 0 10px 4px;}
#main-content .widget-title h4{font:bold 18px/18px 'Open Sans', sans-serif;text-align:left;margin:5px 0 15px;
padding:5px 0 10px;position:relative;}
#main-content .widget-title h4 .fa{float:right}
#main-content .widget .widget-title{position:relative}
#main-content .widget .widget-title .views-all{margin:3px 10px 0 0}
#main-content .widget .postmore {margin:0px;}
#main-content .widget .postmore img {width:100%;margin-bottom:10px;}
#main-content .widget .postmore .post-content {padding:20px 0;font:14px/1.5 'Open Sans';}
#main-content .widget .postmore .metadata{font:13px 'Open Sans';text-transform:uppercase;padding:5px 0 15px 0;position:relative;}
#main-content .widget .postmore .metadata .fa{margin:0}
#main-content .widget .postmore .metadata span{margin:0 10px 0 5px}
#main-content .widget .postmore .metadata .soc{float:right;position:absolute; right:0px;top:0px;}
#main-content .widget .postmore .metadata .soc .fa {width:25px;height:25px; line-height:25px; text-align:center;}

#main-content .widget .postmore .postbott .bot-list {margin-bottom:30px;}
#main-content .widget .postmore .postbott .bot-list li {list-style: none; padding:10px 0;}
#main-content .widget .postmore .postbott .bot-list li a {font-size:14px;font-weight:bold}
#main-content .widget .postmore .postbott h4 {font: 20px/24px 'Open Sans';padding: 10px 0;}

#main-content .widget .table {font-size: 13px;}
#main-content .widget .link h4 {font-size: 16px;font-weight:bold;margin-top: 10px;}
#main-content .widget .more li{padding:5px 0}
#main-content .widget .more a{display:inline-block;font-size:13px;text-decoration:underline}
#main-content .widget .provideo {width:100%;height:400px;}

#main-content .widget .table th, #main-content .widget  .table td {padding: 8px 5px;vertical-align:top;}
#main-content .widget .table th.number, #main-content .widget  .table td.number {padding: 8px 5px;width: 30px;text-align: center;}
#main-content .widget .table .motmodal {font-size: 20px;padding: 10px 0px;}

#main-content .widget .table.dfile th, #main-content .widget  .table.dfile td {padding: 10px 15px;}
#main-content .widget .table.dfile h3 {font:700 20px 'Open Sans';}
#main-content .widget .table.dfile td.downfile { width:50px;}

#main-content .widget .postmore .modal-header {border-bottom: 0 ! important}
#main-content .widget .postmore .modal-body .ptk-pict {float:left;width:50%;}
#main-content .widget .postmore .modal-body .ptk-pict .img {position:relative; margin:0 15px 0 0;}
#main-content .widget .postmore .modal-body .ptk-pict .img .ptk-name {position:absolute; left:15px; bottom:20px; right:15px; padding:10px; text-align:center;}
#main-content .widget .postmore .modal-body .ptk-detail { float:right;width:50%;}
#main-content .widget .postmore .modal-footer {border-top: 0 ! important}

#main-content .widget .postmore .my-style {padding-bottom:10px;}
#main-content .widget .postmore .vidtitle {padding: 10px 20px;font-size:20px; font-weight: 700;margin-top: -5px;}
#main-content .widget .postmore .vidtitle .fa {margin-right:8px;}

#main-content .widget .postmore #gallery-photo img {margin:0;}

#main-content .widget .postmore .post-loop li { list-style: none;padding:15px 15px 10px; margin-bottom: -1px;}
#main-content .widget .postmore .post-loop li .loop { float:left; width:45%; margin:0 15px 0 0;}
#main-content .widget .postmore .post-loop li .loop img {margin:0;}
#main-content .widget .postmore .post-loop li a {font-weight:700; font-size:14px;}
#main-content .widget .postmore .post-loop li h4 { padding-bottom:8px;}
#main-content .widget .postmore .post-loop li h4 a { font:700 22px/25px 'Open Sans';}
#main-content .widget .postmore .post-loop li h4.sitemap { padding:0px;font:700 22px/25px 'Open Sans';}


.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; }

/* SIDEBAR QUICKSAND */
#aside-primary {font-size:13px;width:25%;padding:8px 0 0;float:left;}
#aside-primary .primahead h4 {margin: 0px 15px;font: 800 28px "Open Sans";padding-bottom: 6px;}
#aside-primary .primacon .primanews {margin-bottom:30px;}
#aside-primary .primacon .primanews li{list-style:none;padding: 10px 0;margin:0 15px;font-size:14px;line-height:18px;}
#aside-primary .primacon .primanews li a {font:700 14px/18px 'Open Sans';}
#aside-primary .primacon .primanews li span {font-size:12px;}
#aside-primary .primacon .primanews li img {float:left; width:80px; margin-right:15px;}

#aside-secondary {font-size:13px;width:33.3333%;padding:8px 0 0;float:right;}
#aside-secondary .primahead h4 {margin: 0px 15px;font: 800 28px "Open Sans";padding-bottom: 6px;}
#aside-secondary .probar{margin:0 15px 15px;}
#aside-secondary .probar form p{margin-top:8px;margin-bottom:15px}
#aside-secondary .probar input[type=radio]{padding:0;margin:5px 10px 5px 0;vertical-align:middle}
#aside-secondary .facebooks {margin:0 15px 15px;text-align:center;}
#aside-secondary .facebooks .fb-like-box {margin: 0 auto;}

#aside-secondary .propoll {padding:15px;position:relative;overflow:hidden;}
#aside-secondary .propoll .star {right: -200px;left: auto;}
#aside-secondary .propoll form {margin:0 ! important;z-index: 100;position: relative;}

#aside-secondary .yahoo {text-align:center;}

/* FOOTER PROGRESS */
#sub-footer{padding:30px 0 0;margin:0}
#footcont{padding:15px;}
.footer-title {margin-top: 24px;}
.footer-title h4 span{font-size: 20px;padding: 5px 20px;font-weight: 800;letter-spacing:-1px;margin-left:10px;}
.infooter {width:40%;padding:0;margin:0;float:left}
.infooter.sch {width:60%;padding:0;margin:0;float:left}
.infooter.sch img {float:left; margin-right:15px;padding:0 15px;margin-bottom:50px;width:45%;}
.infooter.sch h2 {font-weight:700;}
.infooter.sch p .fa {width:25px;}
.infooter .list{margin:10px;padding-top:10px;}
.infooter .list h4{font:bold 14px 'Open Sans';margin-bottom:10px;margin-top: 15px;}
.infooter .list .ul-list {margin-top:10px;}
.infooter .list .ul-list li {list-style: none;line-height: 24px;display:inline-block;}
.infooter .list .ul-list li span{float:right;}
.infooter .list .tags-list li {display:inline-block; list-style:none;padding:3px 10px;margin-right:8px;margin-bottom:8px;line-height:24px;font-size:14px; font-weight:700;}
.infooter .list .tags-list li a span {font-weight:700;margin-left:10px;padding-left:10px;}
.infooter .list .falist {margin-top:15px;}
.infooter .list .falist li {list-style: none;display:inline-block;}
.infooter .list .falist li .fa {width: 44px;height: 44px;line-height: 44px;text-align: center;font-size: 30px;margin-right: 5px;border-radius: 22px;}

.inlink {padding: 30px;font-size: 14px;}
.inlink .list span {list-style: none;display:inline-block;}

#footer{width:959px;padding:4px 0 6px 0;text-align:center;font-size:12px;margin:5px auto 0 auto}

.copyright{width:50%;float:left;line-height:20px}
.copyright a{text-decoration:none}
.dev{width:50%;float:right;text-align:right}
.dev .eloper{line-height:20px;height:30px;padding:5px 0 5px 15px}
.dev .eloper a{padding:2px 6px;margin-left:6px}
#copyright-wrapper{clear:both;padding:20px 30px}
.pagination ul li a{border:0;}
.pagination ul li:last-child a{border-right:0}
.pagination ul li.active a,.pagination ul li.active a:hover{background:transparent;}

#form-wrapper{margin:18px 15px 15px 15px}
input[type="submit"] 
.form{margin-top:20px}
.form input[type="text"],
.form input[type="email"],
.form input[type="url"],
.form input[type="password"],
.form textarea{padding:9px 10px}
.form select{padding:9px}
.form .btn-success{position:relative;top:5px;padding:7px}

.widget form label, .widget form p {font-weight: normal;font-size: 13px}
.login input{width: 92%;padding: 8px;font-size: 11px;}

.well {min-height: 20px;padding: 19px;margin-bottom: 20px;border-radius: 4px;}
.well-lg {padding: 24px;border-radius: 6px;}
.well-sm {padding: 9px;border-radius: 3px;}

a{text-decoration:none}

h1,h2,h3,h4,h5{font-family:'Open Sans', sans-serif;font-weight:300}
h1{font-size:24px}
h2{font-size:18px}
h3{font-size:14px}
h4{font-size:12px}
h5{font-size:10px}
h6{font-size:8px}

#sub-footer .widget.last{border:0;width:320px}

.widget form label,.widget form p{font-weight:normal;font-size:13px}

/* KALENDER CMS SEKOLAHKU 	*/
.fc-day-grid-event .fc-content {white-space: normal;}
#calendar {max-width: 100%;margin: 15px auto;}

/* DOWNLOAD FILE */
.table tbody tr:hover td, .table tbody tr:hover th {cursor: pointer;}
.table h3 {font-weight:bold;}

@media screen and (max-width: 1024px) {
.tree-menu > li{float:left;padding:6px 6px}
.tree-menu > li:active{float:left;padding:6px}
.tree-menu li:hover > ul,.tree-menu li.sfHover > ul{display:block}
.tree-menu a{display:block;position:relative}
.tree-menu ul ul{top:0;left:100%}.tree-menu{float:left}
.tree-menu ul{min-width:16em;*width:16em}
.tree-menu a{padding:6px 4px;text-decoration:none;zoom:1}
.tree-menu a{font:bold 14px/18px 'Open Sans', 'Patua One';}
.tree-menu li{white-space:nowrap;*white-space:normal}
.tree-menu li.quicksand {padding: 5px 8px;}
.tree-menu li.facebook, .tree-menu li.twitter, .tree-menu li.youtube, .tree-menu li.google, .tree-menu li.rss {float:right;width:36px;line-height:42px; text-align:center;padding:5px 0;}
.tree-menu li .fa {font-size:18px;}

.slideshow {margin-top: 41px;}
.inners {margin-left: -85px;}
.inners h3 {font: 800 35px "Open Sans";}
.inners h3 .fa {line-height: 60px;font-size: 40px;}
.timers {margin-top: 150px;height: 70px;}
.timers .date {font-size:13px ! important;}
.timers .time {font: 800 35px/35px "Open Sans" ! important;}
.timers .fa {line-height: 70px;font-size: 55px;}

.scola { width: 60%;}
.scola h2 { font: italic 700 25px/35px "Open Sans";}
.scola h6 {font: italic 16px/20px "Georgia";}
.scola .phone {font-size:13px; margin-top:10px;}
.scola .fa {width: 18px;}
.scola .fa-envelope {margin-left: 18px;}
.rightbot {right: -200px;}

.konten .quicknews .new-span .spanl, .konten .rightbar .new-span .spanl {font: 800 25px/25px 'Open Sans';}
.konten .quicknews .new-span .spanl .fa, .konten .rightbar .new-span .spanl .fa {line-height: 25px;font-size: 24px;}
.konten .quicknews .new-span .spanr, .konten .rightbar .new-span .spanr {font: italic 25px/25px 'Georgia';}

.konten .quicknews ul li .postkon .postisi {padding: 15px;}
.konten .quicknews ul li .postkon .postisi h4 {font: 800 18px/18px 'Open Sans';}
.konten .quicknews ul li .postkon .postisi p { margin-top: 10px;font-size: 13px;}
.konten .quicknews ul li {margin: 8px 16px 16px 8px;}
.konten .quicknews ul li:nth-child(1) .postkon .postisi {border-right: 8px solid #f2f2f2;}
.konten .quicknews ul li:nth-child(1) .postimg .imgisi {border-left: 8px solid #f2f2f2;}
.konten .quicknews ul li:nth-child(2) .postkon .postisi {border-left: 8px solid #f2f2f2 ! important; border-right: 0 ! important;}
.konten .quicknews ul li:nth-child(2) .postimg .imgisi { border-right: 8px solid #f2f2f2 !important;}
.konten .quicknews ul li:nth-child(3) .postkon .postisi {border-right: 8px solid #f2f2f2;}
.konten .quicknews ul li:nth-child(3) .postimg .imgisi {border-left: 8px solid #f2f2f2;}
.konten .quicknews ul li:nth-child(4) .postkon .postisi {border-left: 8px solid #f2f2f2 ! important; border-right: 0 ! important;}
.konten .quicknews ul li:nth-child(4) .postimg .imgisi { border-right: 8px solid #f2f2f2 !important;}
.konten .quicknews ul li:nth-child(5) .postkon .postisi {border-right: 8px solid #f2f2f2;}
.konten .quicknews ul li:nth-child(5) .postimg .imgisi {border-left: 8px solid #f2f2f2;}

.konten .quicknews ul li .postimg .imgisi {margin:0 0 -20px;transition:all .5s ease .1s;}
.konten .quicknews ul li .postimg .imgisi img {width:100%;}
.konten .quicknews ul li:hover .postimg .imgisi {margin:-15px 0 -5px;}

.konten { padding: 15px 23px 0px 15px;}
#image-slider { margin: 8px 0 0;}
.phead {padding: 10px 15px;}
.phead h4 {font: 700 16px/18px 'Open Sans';}
.phead p { font-size: 12px;line-height: 14px;}

.konten .umum-after li {list-style:none;height:35px; padding:0 10px;cursor:pointer;margin:0;}
.konten .umum-after li {font-weight:800;font-size:18px;line-height:35px;}
.konten .umum-after li .fa {margin-right:8px;font-size:18px;line-height:35px;}

.head-o.home .headtalk {bottom: 10px;right: 8px;left: 8px;padding: 8px 15px 15px;}
.head-o .headtalk {bottom: 30px;right: 25px;left: 25px;}
.head-o .headtalk p { font: italic 12px Georgia;}
.head-o .headtalk .headname {margin-bottom: 10px;}
.konten .quicknews ul li:hover .postimg .top-image {left: 8px;}
.konten .quicknews ul li:nth-child(2):hover .postimg .top-image, 
.konten .quicknews ul li:nth-child(4):hover .postimg .top-image {right: 8px;}

#image-slider-two #slider.flexslider{ padding: 15px;}
#news-ticker li { font: italic 300 14px/19px 'Open Sans';}

#sub-footer {padding: 0;}
.footer-title h4 span {font-size: 16px;padding: 5px 10px;}
.infooter .list .tags-list li {padding: 3px 7px;margin-right: 5px;margin-bottom: 5px;line-height: 18px;font-size: 13px;}

/* CONTENT */
.page-title  { margin-top:41px;}
.page-title .de-title h4 { font:800 30px/35px 'Open Sans';}
#main-content .widget .postmore .post-content {padding: 20px 0;font: 13px/1.5 'Open Sans';}
#main-content .widget .postmore .postbott .bot-list li a {font-size: 13px;}
#main-content .widget .postmore .vidtitle {font-size:16px;}
#main-content .widget .provideo {height: 320px;}
#promaps {margin-top:41px;}
#promaps .addmaps {padding: 20px;font: 300 16px 'Open Sans';}

#aside-primary .primahead h4 {font: 800 20px/38px "Open Sans";}
#aside-secondary .primahead h4 {font: 800 20px/38px "Open Sans";}
#aside-primary .primacon .primanews li{font-size:13px;line-height:15px;}
#aside-primary .primacon .primanews li a {font:700 13px/15px 'Open Sans';}
#aside-primary .primacon .primanews li img {margin-bottom: 10px;width:70px;}
}

@media screen and (max-width: 800px) {
#fixed-wrapper {position: fixed;}
#primary-navigator {display:none;}
.mobimenu {display:block; height: 42px;}
#openmobi {line-height: 38px; font-size:20px; color: #fff;}
#openmobi .soc-mob {height:42px;}
#openmobi .soc-mob li {display:inline-block;list-style: none;overflow:hidden;height:42px;}
#openmobi .soc-mob li .fa {line-height:42px; width:42px; height:42px; text-align:center;font-size:18px;color:#fff;}
#openmobi .soc-mob li.navicon {width:42px;margin-right:15px}
#openmobi .soc-mob li.facebook  {background:#2066AD;width:42px;float:right}
#openmobi .soc-mob li.twitter  {background:#3bf;width:42px;float:right}
#openmobi .soc-mob li.youtube {background:#f02;width:42px;float:right}
#openmobi .soc-mob li.google {background:#d22;width:42px;float:right}
#openmobi .soc-mob li.rss {background:#f90;width:42px;float:right}

.accordion li {padding: 8px 15px;}
.accordion li .fa {float:right; color: #eee;}
.accordion li a {color: #fff;width:100%}
.accordion li ul {margin-top: 8px;margin-bottom: -9px;}
.accordion li ul li {list-style:none;}

.mclose {display:none;}
.inners h3 {font: 800 25px "Open Sans";}
.inners h3 .fa {line-height: 60px;font-size: 30px;}
.konten {padding: 15px 15px 0px 15px;}
.konten .quicknews {width: auto;float: none;}
.konten .quicknews .new-span {margin-left:0; text-shadow:0 1px 2px #aaa;}
.konten .quicknews .new-span .spanl {font:800 35px/35px 'Open Sans';}
.konten .quicknews .new-span .spanl .fa { line-height: 35px;font-size: 32px;}
.konten .quicknews .new-span .spanr {font:italic 35px/35px 'Georgia';}
.konten .rightbar .new-span {margin-left:0; text-shadow:0 1px 2px #aaa;}
.konten .rightbar .new-span .spanl {font:800 35px/35px 'Open Sans';}
.konten .rightbar .new-span .spanl .fa { line-height: 35px;font-size: 32px;}
.konten .rightbar .new-span .spanr {font:italic 35px/35px 'Georgia';}

.konten .quicknews ul li .postkon .postisi h4 {font: 800 25px/25px 'Open Sans';}
.konten .quicknews ul li {margin: 8px 8px 16px 8px;}
.konten .quicknews .new-span {margin-left: 8px;}

.konten .rightbar {width: auto;float: none;margin:8px;}
.two-after.mores {height: auto;width: 50%;float: left;}
.two-after.menus {display:none;}

#image-slider { margin-right: 8px;}
.head-o.home { padding: 8px 0 0 8px;}
.konten .rightbar .new-span {display:none}
.two-after.mores.two {width:100% ! important;}
#news-ticker li { font: italic 300 17px/19px 'Open Sans';}
.infooter.sch, .infooter {width:100%}
.head-o.home .headtalk {bottom: 20px;right: 15px;left: 23px;}

#main-content {width: 100%;}
#main-content .incontent {width: 100%;}

#aside-primary {display:none;}
#aside-secondary {width: 100%;}
#aside-secondary .two-after.mores {width: 100%;}
#aside-secondary .primahead h4 {display:none}
.head-o {display:none;}
.head-o.home {display:block ! important;}
#promaps .addmaps {width: 200px;font: 300 13px 'Open Sans';}

}

@media screen and (max-width: 768px) {
.timers {margin-left: -110px;}
.inners { margin-left: -80px;}
.inners h3 .fa { line-height: 45px;}

.inseko { padding: 20px;}
.rightbot {right: -280px;}
.scola { width: 65%;}
.my-style.callus button {font: 700 16px 'Open Sans';}

}

@media screen and (max-width: 640px) {
#openmobi { font-size: 16px;}

.page-title .de-title h4 { font:800 25px/30px 'Open Sans';}
.page-title .de-title {text-align:center;padding: 40px 40px;}

.datainner {display: none;}
.slideshow #larr { left: 20px;}
.slideshow #rarr { left: 60px;}
.slideshow #larr, .slideshow #rarr {bottom: 20px;width: 35px;height: 35px;}

.konten .quicknews ul li .postkon .postisi h4 { font: 800 20px/20px 'Open Sans';}
.inseko { padding: 20px;}
.scola h2 {font: italic 700 20px/30px "Open Sans";}
.scola h6 {font: italic 13px/18px "Georgia";}
.scola .phone { font-size: 12px;}
.rightbot {right: -310px;}
.scola { width: 65%;}
.my-style.callus button {font: 700 14px 'Open Sans';}

.konten .quicknews ul li .postkon .postisi p { height: 52px;}

}

@media screen and (max-width: 480px) {
#openmobi .soc-mob li.school {display:none}
#fixed-wrapper {position: relative;}
.rightbot {right: -420px;}
.scola { width: 80%;}
.my-style.callus {display:none}
.scola .phone { font-size: 13px;}

.page-title , #promaps, .slideshow {margin-top:0px;}

.konten .quicknews ul li .postkon, .konten .quicknews ul li:nth-child(2) .postkon,  .konten .quicknews ul li:nth-child(4) .postkon { width: 100%; float: none;}
.konten .quicknews ul li .postimg {display:none}
.konten .quicknews ul li:nth-child(1) .postkon .postisi, .konten .quicknews ul li:nth-child(3) .postkon .postisi , .konten .quicknews ul li:nth-child(5) .postkon .postisi{border:0 ! important;}
.konten .quicknews ul li .postkon .postisi { height: auto;position:relative;}
.two-after.mores { width: 100%;float: none;}
.konten .rightbar .new-span {display: block;}
#image-slider { margin: 15px 0;}
.head-o.home { padding: 8px 0 0;}
.head-o.home .headtalk {left: 15px;}
#home-bot .bottom .new-span { margin-left: 20px;}

#home-bot .bottom .new-span .spanl {font:800 25px/25px 'Open Sans';}
#home-bot .bottom .new-span .spanl .fa { line-height: 25px;font-size: 23px;}
#home-bot .bottom .new-span .spanr {font:italic 25px/25px 'Georgia';}
.infooter.sch img {width:100%; padding:0; margin-bottom:15px;}

#main-content .widget .postmore .post-loop li .loop {float: none;width: 100%;argin: 0 15px 15px 0;}

}

@media screen and (max-width: 360px) {
#openmobi {font-size:14px}
.slideshow #larr, .slideshow #rarr  {display:none;}
.rightbot {right: -460px;}

#home-bot .bottom .new-span .spanl {font:800 18px/18px 'Open Sans';}
#home-bot .bottom .new-span .spanl .fa { line-height: 18px;font-size: 16px;}
#home-bot .bottom .new-span .spanr {font:italic 18px/18px 'Georgia';}

.konten .quicknews .new-span .spanl {font:800 25px/25px 'Open Sans';}
.konten .quicknews .new-span .spanl .fa { line-height: 25px;font-size: 22px;}
.konten .quicknews .new-span .spanr {font:italic 25px/25px 'Georgia';}
.konten .rightbar .new-span .spanl {font:800 25px/25px 'Open Sans';}
.konten .rightbar .new-span .spanl .fa { line-height: 25px;font-size: 22px;}
.konten .rightbar .new-span .spanr {font:italic 25px/25px 'Georgia';}

.copyright, .dev {width: 100%;float: none; text-align: center}
.dev {font-size: 12px;margin-top:15px;}

}