/*
Theme Name: Rok Mini
Theme URI: http://google.com/
Description: For just only mine, Schatzie.
Author: SCH CORP Team
Version: 0.1
*/

@import url('http://fonts.googleapis.com/css?family=Lato:400,300,700');
@import url(http://fonts.googleapis.com/css?family=Roboto:400);


body {
    width: 100%;
    height: 100%;
    font-family: 'Lato', verdana, arial, sans-serif;
	font-weight: 300;
    color: #222;
    background-color: #fff;
	font-size: 14px;
	overflow-x: hidden;
	backg-round:url(../../gambar/bgbody.jpg) no-repeat fixed;
  -webkit-bac-kground-size: cover;
  -moz-backg-round-size: cover;
  -o-back-ground-size: cover;
  backg-round-size: cover;
}


html {
    width: 100%;
    height: 100%;
}

.b-tn { font-size: 12px; }

a { color: #0000CC; text-decoration: none; cursor: pointer; }
a:hover, a:focus { color: #990088; text-decoration: underline;}
a:visited, a:active  { color: #000088; }


h1,
h2,
h3,
h4,
h5,
h6 {
    text-transform: uppercase;
    font-family: 'Roboto', arial, verdana, sans-serif; 
    letter-spacing: 1px;
}
h1,
h2,
h3 {
    letter-spacing: 3px;
}

label { cursor: pointer; font-weight: normal; }

/**** Struktur
*****************************/
#wrapper { margin: 0; }
#k-epala { background-color: #ee-e; width: 100%; height: 75px; margin: 0 auto 0 auto; clear: both; }
#k-epala img { padding: 0; margin: 0; }
#isi { back-ground-color: #0066CC; min-hei-ght: 200px; width: 100%; margin: 20px auto 0 auto; clear: both; float: left; padding: 0; }
#footer { color: #555; font-size: 12px; width: 100%; clear: both; padding: 0; background-color: #eee; }

#konten img, #satukonten img { max-width: 100%; }

#i-si { box-shadow: 0px 0px 10px #999; }
#luar { margin-top: 100px; }
#panelicon { padding: 10px auto 40px auto; }

/****** Isi ****************/
#satukonten	{ border: 1px solid #999; margin: 10px auto; width: 930px; min-height: 500px; clear: both; float: none; padding: 10px; 	-moz-border-radius: .5em;
	border-radius: .5em;
	-webkit-border-radius: .5em;
	-o-border-radius: .5em;
 }
#konten { border: 1px solid #ddd; margin: 10px 5px; width: 605px; min-height: 500px; clear: both; float: left; padding: 10px; 	-moz-border-radius: .5em; border-radius: .5em; -webkit-border-radius: .5em; -o-border-radius: .5em; }
#judulHalaman { margin: 10px 0 15px 0; padding: 0 0 10px 0; font-size: 20px; border-bottom: 1px solid #eee; }


/***** Header **************/
#branding-kepala { display: none; }
#sitetitle { float: left; text-align: left; margin: 10px 0 0 0; font-size: 30px; font-family: 'Poiret One', verdana, arial; }

#sitetitle a {
	font-weight: bold;
	text-decoration: none;
}
#sitedescription { position: absolute; top: 0; right: 0; text-align: right; font-size: 18px; padding: 0 10px 0 0; margin: 0; }
#sitedescriptionZZ { opacity: .8; position: fixed; top: 15px; right: 25px; text-align: right; font-size: 18px; padding: 0 10px 0 0; margin: 0; }



/***** Footer **************/
#footerDalem { text-align: center; clear: both; margin: 0 auto; }
#footer a { color: #fff; text-decoration: none; }
#footer a:hover { color: #aaa; text-decoration: underline; }

/********** classs ***********/
.l50 { width: 50%; float: left; clear: both; }
.l75 { width: 75%; float: left; clear: both; }
.tengah { text-align: center; }
.right { text-align: right; }
.left { text-align: left; }
.vtengah { vertical-align:middle; }
.tengah blink {color: #eee;}
.tebal {font-weight: bold;}

.tabelListData { font-size: 12px; }

.pointer { cursor: pointer; }

.warnaijo { color:#090; }
.warnamerah { color: #900; }
.warnabiru { color: #00f; }
.warnaputih { color: #fff; }

.bgfff { background-color: #ffffff; }
.bg24 { background-color: #242424; color: #eee; }
.bgF8 { background-color: #F8F8F8; color: #333; }
.bgF0F { background-color: #ECECFB; color: ; }
.bgD4 { background-color: #D43076; color: ; }
.bg67B { background-color: #67B0D1; color: ; }
.bg40 { background-color: #404040; color: #eee; }

.font16 { font-size: 16px;  }

.judulmultiple { font-family: 'Lato', verdana, arial, sans-serif; font-size: 36px; }
.judulsingle { font-family: 'Lato', verdana, arial, sans-serif; font-size: 30px; }
.judulberita { font-family: 'Lato', verdana, arial, sans-serif; text-transform: normal; letter-spacing: 1px; font-size: 22px; }

.gambarjudul {
    width: 100%; /*slider width*/
    max-height: 250px; /*slider height*/
	overflow: hidden;
}
.gambarjudul img {
    width: 100%; /*img width*/
}

.galeri { margin-left: 15px; padding: auto; background:#ddd;}
.galeridiv { padding: 0; height: 125px; overflow: hidden; }
.galeridiv1 { padding: 0; max-height: 250px; overflow: hidden; }
.galeridiv img, .galeridiv1 img {min-width: 100%; min-height:100%;}
.img100 img { width: 100%; }
.width100 { width: 100%; }
.height100 { max-height: 100px; overflow: hidden; }
.height150 { max-height: 150px; overflow: hidden; }
.height200 { max-height: 200px; overflow: hidden; }
.height250 { max-height: 250px; overflow: hidden; }
.height300 { max-height: 300px; overflow: hidden; }
.height350 { max-height: 350px; overflow: hidden; }


#rbmes { position: fixed; bottom: 0; right: 10px; }

table.makealink td { color: #0000CC; }
table.makealink td:hover { color: #cc0000; }

.martop25 { margin-top: 25px; }
.martop50 { margin-top: 50px; }
.martop75 { margin-top: 75px; }
.martop100 { margin-top: 100px; }

.marbot20 { margin-bottom: 20px; }
.marbot25 { margin-bottom: 25px; }
.marbot50 { margin-bottom: 50px; }
.marbot75 { margin-bottom: 75px; }


.padtop50 { padding-top: 50px; }
.padbot50 { padding-bottom: 50px; }

.rounded4 {
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
}
.rounded5{
  -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
          border-radius: 5px;
}
.rounded6 {
  -webkit-border-radius: 6px;
     -moz-border-radius: 6px;
          border-radius: 6px;
}
.rounded7 {
  -webkit-border-radius: 7px;
     -moz-border-radius: 7px;
          border-radius: 7px;
}

/*************** bootstrap **************/
.navbar2{ margin-bottom: 0; }
.navbar-inverse {

}

.breadcrumb2 { width: 100%; padding: 10px 0; background-color: #f9f9f9; border-bottom: 1px dotted #eee; }
.breadcrumb2 a { padding: 0 3px; }

.table.table-borderless td,
.table.table-borderless th {
    border-top: 0; !important;
}
.table-pointer tbody tr { cursor: pointer; }

table thead th {background-color: #E8EFF5;}
.table { margin-bottom: 0;}
.full100 { max-width: 100%; }

.input-group {margin-bottom: 5px;}
.surattugasmodal .modal-dialog{width: 700px;}
.modal600 .modal-dialog{width: 600px;}
.modal650 .modal-dialog{width: 650px;}
.modal700 .modal-dialog{width: 700px;}
.modal750 .modal-dialog{width: 750px;}
.modal800 .modal-dialog{width: 800px;}
.modal850 .modal-dialog{width: 850px;}
.modal900 .modal-dialog{width: 900px;}
.modal950 .modal-dialog{width: 950px;}
.modal1000 .modal-dialog{width: 1000px;}

.modal50 .modal-dialog{width: 50%;}
.modal60 .modal-dialog{width: 60%;}
.modal70 .modal-dialog{width: 70%;}
.modal80 .modal-dialog{width: 80%;}
.modal90 .modal-dialog{width: 90%;}
.modalauto .modal-dialog{width: auto;}

ta-ble .b-tn { margin: 0; padding: 2px 4px;}

.smallpaging .pagination{
  margin: 0px;
}

.maindepan .page-header {margin-top: 0; padding-top: 0;}

.dropdown-header {
  background-image: -webkit-gradient(linear, left 0%, left 100%, from(#5cb85c), to(#449d44));
  background-image: -webkit-linear-gradient(top, #5cb85c, 0%, #449d44, 100%);
  background-image: -moz-linear-gradient(top, #5cb85c 0%, #449d44 100%);
  background-image: linear-gradient(to bottom, #5cb85c 0%, #449d44 100%);
  background-repeat: repeat-x;
  border-color: #419641;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff449d44', GradientType=0);	
	color:#fff;
	font-size:14px;
}




        #kepala {
            position: fixed;
            width: 100%;
            text-align: left;
            height: 100px;
            background: #ECECFB;
            color: #fff;
			font-size: 24px;
            font-family: 'PT Sans', arial, verdana, sans-serif;
			z-index: 9;
			top: 0;
			left: 0;
			opac-ity: .6;
			background: url('../bg_transparent/FFFFFF_25.png') repeat top left;
            
            // set animation
            -webkit-transition: all 0.4s ease;
            transition: all 0.4s ease;
			box-sizing: border-box;
			box-shadow:0 0 15px #999;

        }
        
        #kepala.sticky {
            height: 55px; 
            background: #9EDC5E;
            text-align: left;
			font-size: 16px;
			opacity: 1;
			border-bottom: 2px solid #333;
			background: url('../bg_transparent/FFFFFF_75.png') repeat top left;
        }
		#kepala img{
			float: left;
			height: 75px;
            -webkit-transition: all 0.5s ease;
            transition: all 0.5s ease;
			margin-left: 10px;
			margin-top: 13px;
		}
		#kepala.sticky img {
			height: 50px;
			margin-top: 3px;
		}
		
		#kepala nav { float: right; margin: 16px 15px 0 0; font-family: 'Roboto', arial, verdana, sans-serif; }
		#kepala.sticky nav { float: right; margin: 17px 15px 0 0; }
		#kepala nav a { flo-at: right; margin: 0 0; padding: 11px; -webkit-transition: all 0.5s ease; transition: all 0.5s ease;  }
		#kepala.sticky nav a { color: #196600; }
		#kepala.sticky nav a:hover { background-color: #45FFA3; color: #000088; border-top: 5px solid #45FFA3; border-bottom: 5px solid #777; text-decoration: none; }

@media (max-width: 999px) {
    #kepala nav { display: none; }
}
@media (min-width: 850px) {
    #kepala { font-size: 16px; }
    #kepala nav { display: block; }
}  
@media (min-width: 999px) {
    #kepala { font-size: 24px; }
}   
		
		
.carousel .item {
    width: 100%; /*slider width*/
    max-height: 550px; /*slider height*/
}
.carousel .item img {
    width: 100%; /*img width*/
}
/*add some makeup*/
.carousel .carousel-control {
    background: none;
    border: none;
    to-p: 50%;
	opacity: .2;
}
/*full width container*/
@media (max-width: 767px) {
    .block {
        margin-left: -20px;
        margin-right: -20px;
    }
}




/*===========================
  --- Sections ----
=========================== */

section.section {
	margin:0;
	padding: 80px 0 60px 0;
}


.bg-white {
	background-color: #fff;
}

/* --- section heading --- */
.section-header {
	text-align: center;
padding-top: 30px;
}
.section-header h2.section-heading {
	text-transform: uppercase;
	font-weight: 700;
}


/*=========================
  Footer
 ================= */

section#footer {
	background: #242424;
	margin:0;
	padding: 20px 0 30px 0;
	font-size:16px;
	color: #999;
}

section#footer .copyright {
	text-align: center;
}

/* footer social icons */
ul.social-network {
	list-style: none;
	display: inline;
	margin-left:0 !important;
	padding: 0;
}
ul.social-network li {
	display: inline;
	margin: 0 5px;
}

/* footer menu */
ul.footer-menu {
	list-style: none;
	display: inline;
	margin-left:0 !important;
	padding: 0;
}
ul.footer-menu li {
	display: inline;
	margin: 0 5px;
}

a.scrollup{
	height:40px;
	width:40px;
	color:#fff;
	font-size:22px;
	line-height:40px;
	text-align:center;
	text-decoration:none;
	position:fixed;
	bottom:10px;
	right:10px;
	z-index:9999;
	opacity:0.5;
}
a.scrollup:hover{
	opacity:1;
	color:#fff;
	font-size:18px;
	line-height:30px;
	
}

/*===========================
  --- Template Components ----
=========================== */

/* footer social icons */
.social-network a.icoRss:hover {
	background-color: #F56505;
	
}
.social-network a.icoFacebook:hover {
	background-color:#3B5998;
	
}
.social-network a.icoTwitter:hover {
	background-color:#33ccff;
	
}
.social-network a.icoGoogle:hover {
	background-color:#BD3518;
	
}
.social-network a.icoVimeo:hover {
background-color:#0590B8;
	
}
.social-network a.icoLinkedin:hover {
background-color:#007bb7;
	
}
.social-network a.icoRss:hover i, .social-network a.icoFacebook:hover i, .social-network a.icoTwitter:hover i, 
.social-network a.icoGoogle:hover i, .social-network a.icoVimeo:hover i, .social-network a.icoLinkedin:hover i {
	color:#fff;
}
a.socialIcon:hover, .socialHoverClass {
	color:#417630;
}

.social-circle li a {
	display:inline-block;
	position:relative;
	margin:0 auto 0 auto;
	-moz-border-radius:50%;
	-webkit-border-radius:50%;
	border-radius:50%;
	text-align:center;
	width: 50px;
	height: 50px;
	font-size:20px;
}
.social-circle li i {
	margin:0;
	line-height:50px;
	text-align: center;
}

.social-circle li a:hover i, .triggeredHover, .rotico h2 a:hover i {
	-moz-transform: rotate(360deg);
	-webkit-transform: rotate(360deg);
	-ms--transform: rotate(360deg);
	transform: rotate(360deg);
	-webkit-transition: all 0.2s;
	-moz-transition: all 0.2s;
	-o-transition: all 0.2s;
	-ms-transition: all 0.2s;
	transition: all 0.2s;
}
.social-circle i {
	color: #fff;
	-webkit-transition: all 0.8s;
	-moz-transition: all 0.8s;
	-o-transition: all 0.8s;
	-ms-transition: all 0.8s;
	transition: all 0.8s;
}

