@import url(../../global/css/global.css);
@import url(../../global/css/animate.css);
@import url(tooltip.css);
@import url(https://fonts.googleapis.com/css?family=Roboto);
@import url(https://fonts.googleapis.com/css?family=Oswald);

body {font-family: 'Roboto', sans-serif; font-size:12px;  margin:0px; padding:0px;  background:url(../images/background.jpg);color:#fff;}
h1 {font-weight:400; text-transform:uppercase; text-align:center; margin:0px; font-size:12px; letter-spacing:4px;}
h2 {font-family: 'Oswald', sans-serif;font-weight:400; margin:0px; font-size:28px;}

#toTop {width:36px;height:39px;position:fixed;bottom:60px;right:5%;cursor:pointer;display:none; z-index:999;background:url(../images/totopoff.png) center center no-repeat; border:none;}

.marquee  p {margin:0px;}

.header { background:#ECECEC url(../images/header.jpg) top center no-repeat ; color:#000;}

.klik {
	font-family: 'Oswald', sans-serif;
	font-size:16px;
	text-transform:uppercase;
	color:#fff;
    -webkit-animation-name: blinker;
    -webkit-animation-duration: 1s;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    
    -moz-animation-name: blinker;
    -moz-animation-duration: 1s;
    -moz-animation-timing-function: linear;
    -moz-animation-iteration-count: infinite;
    
    animation-name: blinker;
    animation-duration: 1s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}

@-moz-keyframes blinker {  
    0% { opacity: 1.0; }
    50% { opacity: 0.5; }
    100% { opacity: 1.0; }
}

@-webkit-keyframes blinker {  
    0% { opacity: 1.0; }
    50% { opacity: 0.5; }
    100% { opacity: 1.0; }
}

@keyframes blinker {  
    0% { opacity: 1.0; }
    50% { opacity: 0.5; }
    100% { opacity: 1.0; }
}

@media (max-width: 768px) 
{
	.menufixed {position:fixed; z-index:999; top:0; left:0; background:#4a2f04;}
	.ganjel {height:40px;}
	
	.klik {text-align:center;}
	
	.alamat {text-align:center;}
	.alamatbawah {text-align:center;}
	

	
	.hotline li {margin-bottom:5px; text-align:center; }
	.hotline li img { clear:both;}
	.hotline li .akun {clear:both; margin-left:10px;}
	
	.search input { width:100%;}
	.search select {width:100%;}
	.search li { width:50%;padding:2%;}
	.search .submitli { width:100%;padding:2%;}
	

	
	.padatas {padding-top:10px;}
	
	.greeting {text-align:center; margin:10px 0px;}
	
	.header {  color:#000;}
	
}
@media (min-width: 768px)
{
	
	
	
	
	.alamat {text-align:right; margin-top:20px;}
	
	


	
	.hotline {float:right; }
	.hotline li {margin-left:10px; float:left;}
	.hotline li img {float:left; margin:0px 5px;}
	.hotline li .akun {float:left;margin:0px;padding-top:3px;}
	

	.search {float:right;}
	.search input { width:60px;}
	.search li { margin:0px 0px 0px 10px;}
	.search select {width:60px; }
	

	
	.back2 {min-height:1500px;}
	

	
	.menuopt li img {width:30px;}
	
	
	.maratas {margin:50px 0px 20px 0px;}
	
	.judulatas {margin-top:20px;}
	

}
@media (min-width: 992px) 
{

	
	.search input { width:100px;}
	.search select {width:100px; }
	

	.menuopt li img {width:60px;}
	
	
	
}

.alamat p {margin-bottom:5px;}


.judulatas li {text-align:center;}

.search li {float:left;}
.search input {font-size:11px; padding:10px; background:#f2f2f2;box-shadow:inset 0px 10px 15px 0px rgba(0,0,0,0.15);border:none; color:#333333;}
.search select {font-size:11px; padding:9px; background:#f2f2f2;box-shadow:inset 0px 10px 15px 0px rgba(0,0,0,0.15);border:none;color:#333333;}
.search .submit {padding:9px; cursor:pointer; background:#333333; color:#FFF;}

.back1 { background-color:rgba(0,0,0,0.3);-moz-border-radius:10px;border-radius:10px; border:1px solid #CB8D28;}
.back2 { background:#333; color:#fff;}
.back3 { background:#333;}

.hotline li .akun { font-weight:bold;font-size:16px;}


.head { padding:5px 10px; font-size:13px; font-family: 'Oswald', sans-serif;text-align:center;  color:#fff; text-transform:uppercase;background:url(../images/besi3.jpg);background-size:100% ;text-shadow: 2px 2px 4px #000000; }

.listhot {padding:3%; text-align:center;  font-size:16px;color:#da6c08;border-bottom:1px solid #CB8D28;}
.listhot  a { color:#fff;}
.listhot  a:hover { color:#f60;}

.testi .slide {margin-bottom:10px;}
.testi .slide img { float:left; margin:0px 5px 5px 0px; width:50px;}
.testi .slide p {margin:0px; font-size:11px;}
.more {padding:10px; margin-bottom:20px;}
.more a {text-decoration:underline; color:#fff; font-size:14px; }
.more a:hover {color:#f60;}



.menuopt li {float:left; margin-right:10px;font-family: 'Oswald', sans-serif;text-align:center;}
.menuopt li a {color:#fff;}
.menuopt li a:hover {color:#f60;}
.menuopt li img:hover {-webkit-transform:scale(2);transform:scale(2);}
.menuopt li img {-webkit-transition: all 0.7s ease;transition: all 0.7s ease;}

.cso li{ border-bottom:1px solid #CB8D28; padding:10px 0px; }
.cso li img {float:left; margin-top:8px;}
.cso li .akun {float:right; font-size:13px; margin-top:10px;}

.social li {float:left; margin:0px 5px 5px;}

.track li {margin-bottom:3px; text-align:center; font-size:12px; }
.track input {font-size:11px; text-align:center; border:1px solid #dddcdd; padding:3px;}

.bawah {font-size:11px;text-transform:uppercase;}
.bawah a { color:#fff;}
.bawah a:hover {color:#f60;}

.alamat {text-align:center;}
.alamat p {margin:0px 0px 5px 0px;}