@charset "UTF-8";
/* CSS Document */

@font-face{ /* Mendeklarasikan font dari sisi server*/
	font-family:"Gabriola"; /* Penamaan font bebas*/
	src:url(../font/Gabriola.ttf);
}

.100 img:{
	width:100%;
	
}

.container {
	position: relative;
}


body{
	background-color:#f3f4f5;
}
.pad-0{
	padding:0px;
}


.pad-10{
	padding:10px;
}

.mb-10{
	margin-bottom:10px;
}

.mb-20{
	margin-bottom:20px;
}

.mr-5{
	margin-right:5px;
}

h1{
	color:#F30;
	font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
	font-size:18px;
	font-weight:bold;
}

h3{
	color:#F30;
	font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
	font-size:18px;
	font-weight:bold;
}

.pad-60{
	padding-top:60px;
}

/*-------------header----------------------------*/
.relative{
	position:relative;

}

.text-absolute{
	position:absolute;
	font-family:Gabriola;
	font-size:50px;
	font-weight:bold;
	color:#FF0;
	text-shadow:1px 1px #000;
	top:850px;
	left:60px;
	
}

.text-slide{
	position:absolute;
	font-family:Verdana, Geneva, sans-serif;
	font-size:20px;
	color:#FFF;
	text-shadow:1px 1px #000;
	top:900px;
	left:60px;
}

.float-left{
	float:left;
	margin-left:5px;
	font-family:"Gabriola";
	font-size:16px;
	letter-spacing:1px;
	
}

.navbar-default {
    background-color: #333333;
    border-color: #CCCCCC;
}
.navbar-default .navbar-brand {
    color: #ffffff;
}
.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus {
    color: #FF3300;
}
.navbar-default .navbar-nav > li > a {
    color: #ffffff;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
    color:#FF3300;
}

.navbar-default .navbar-nav > li .active{
	color: #FF3300;
		
}

.navbar-default .navbar-nav > .active > a, 
.navbar-default .navbar-nav > .active > a:hover, 
.navbar-default .navbar-nav > .active > a:focus {
    color: #FF3300;
    background-color: #FFFFFF;
}
.navbar-default .navbar-nav > .open > a, 
.navbar-default .navbar-nav > .open > a:hover, 
.navbar-default .navbar-nav > .open > a:focus {
    color: #FF3300;
    background-color: transparent;
}
.navbar-default .navbar-nav > .dropdown > a .caret {
    border-top-color: #ffffff;
    border-bottom-color: #ffffff;
}
.navbar-default .navbar-nav > .dropdown > a:hover .caret,
.navbar-default .navbar-nav > .dropdown > a:focus .caret {
    border-top-color: #8a0e0b;
    border-bottom-color: #8a0e0b;
}
.navbar-default .navbar-nav > .open > a .caret, 
.navbar-default .navbar-nav > .open > a:hover .caret, 
.navbar-default .navbar-nav > .open > a:focus .caret {
    border-top-color: #8a0e0b;
    border-bottom-color: #8a0e0b;
}
.navbar-default .navbar-toggle {
    border-color: #d65c14;
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
    background-color: #d65c14;
}
.navbar-default .navbar-toggle .icon-bar {
    background-color: #ffffff;
}

.caret {
  display: inline-block;
  width: 0;
  height: 0;
  margin-left: 2px;
  vertical-align: middle;
  border-top: 4px dashed;
  border-top: 4px solid \9;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
}
.dropup,
.dropdown {
  position: relative;
  }
.dropdown-toggle:focus {
  outline: 0;
}
.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  display: none;
  float: left;
  min-width: 160px;
  padding: 5px 0;
  margin: 2px 0 0;
  font-size: 14px;
  text-align: left;
  list-style: none;
  background-color:#333;
  -webkit-background-clip: padding-box;
          background-clip: padding-box;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, .15);
  border-radius: 4px;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
          box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
}

.dropdown-menu > li > a {
  padding: 3px 20px;
  clear: both;
  font-weight: normal;
  line-height: 1.42857143;
  color:#FFF;
  white-space: nowrap;
}
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
  color:#FF3300;
  text-decoration: none;
  background-color: transparent;
}
.dropdown-menu > .active > a,
.dropdown-menu > .active > a:hover,
.dropdown-menu > .active > a:focus {
  color:#F30;
  text-decoration: none;
  background-color: transparent;
  outline: 0;
}
.dropdown-menu > .disabled > a,
.dropdown-menu > .disabled > a:hover,
.dropdown-menu > .disabled > a:focus {
  color: #F30;
}
.dropdown-menu > .disabled > a:hover,
.dropdown-menu > .disabled > a:focus {
  text-decoration: none;
  cursor: not-allowed;
  background-color: transparent;
  background-image: none;
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}
.open > .dropdown-menu {
  display: block;
}
.open > a {
  outline: 0;
}

.navbar-brandnew {
	color:#FFF;
	float: left;
	height: 50px;
	padding: 15px 15px;
	font-family:Tahoma, Geneva, sans-serif;
	font-size: 15px;
	line-height: 20px;
}

.navbar-brandnew:hover {
	color:#FFF;
	float: left;
	height: 50px;
	padding: 15px 15px;
	font-family:Tahoma, Geneva, sans-serif;
	font-size: 15px;
	line-height: 20px;
	text-decoration:none;
}

.pict-background{
	z-index: 1;
	padding: 500px 0;
	position: relative;;
	background:url(../Images/HD/barong%20plok.jpg);
	background-repeat:no-repeat;
 	background-size:cover;
	background-position: center center;
}



/*-------------Content----------------------------*/
.text-block {
    position: absolute;
	font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
	font-size: 14px;
    top: 0px;
    left: 15px;
    background-color:green;
    color: white;
    padding-left: 5px;
    padding-right: 5px;
	text-align: center;
	border-bottom-right-radius: 10px;
}


.box-feature{
	background-color:#FFF;
	padding:10px 0px;
}

.news img:hover {
	padding:0px;
    box-shadow: 1px 1px 10px 3px rgba(0,0,0,0.5);
	transition: all 1s;
    border-radius:0;
    -moz-border-radius:0;
    -webkit-border-radius:0;
    -o-border-radius:0;
	z-index:100;
}

.contact-us{
	background-color:#FFF;
	padding:10px;
	min-height:450px;
}

.text-home{
	background-color:#FFF;
	padding:10px;
	font:Verdana, Geneva, sans-serif;
	font-size:14px;
	text-height:35px;
	color:#000;
	text-align:left;
}

.text-news{
	font:Verdana, Geneva, sans-serif;
	font-size:18px;
	text-height:35px;
	color:#F30;
	font-weight:bold;
	
}

.text-header{
	background-color:#060;
	height:40px;
	padding:5px;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:20px;
	color:#FFF;
	text-align:center;
	margin-bottom:2px;
}

.text-header2{
	height:35px;
	padding:5px;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:20px;
	text-shadow:1px 1px #000;
	color:#F30;
	text-align:center;
	margin-bottom:2px;
}

.address{
	width:100%; 
	min-height:500px;
	margin:0px;
	float:left;
}

.content-form {
	width:100%; 
	padding:10px;
	margin:0px;
	float:left;
	
}
	.form-control{
	border:solid 1px #CCCCCC;
	padding:5px;
	border-radius:3px;
	width:250px;
	font-family:Verdana, Geneva, sans-serif;
	}

	.form-are{
	border:solid 1px #CCCCCC;+
	padding:5px;
	border-radius:3px;
	width:250px;
	min-height:200px;
	font-family:Verdana, Geneva, sans-serif;
	resize:none;
	top:0;
	left:0;
	}
	
	.form-are:focus {
  	border-color: #3cb22d;
  	outline: 0;
  	-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
          box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102, 175, 233, .6);
	}
	
	.font-form {
	font-family:Verdana, Geneva, sans-serif;
	font-size:14px;
	}

.line{
	border:none;
	display:block;
	height:1px;
	background:-webkit-linear-gradient(left,#FFF,#000,#FFF);
	background:-o-linear-gradient(left,#FFF,#000,#FFF);
	background:-moz-linear-gradient(left,#FFF,#000,#FFF);
	background:linear-gradient(left,#FFF,#000,#FFF);
	width:90%
	
}

/*-------------Footer----------------------------*/
.to-top{
	width:20px;
	height:20px;
	position:fixed;
	cursor:pointer;
	bottom:60px;
	right:20px;
	display:none;	
}

.border-footer{
	background-color:#333333;
	padding:10px;
	color:#FFF;
	text-align:center;
}

.border-footer :hover{
	text-decoration:none;
	color:#FFF;
}

.text-footer{
	margin:0px 5px;
	text-decoration:none;
	font-size:14px;
	color:#FFF;
	
}

.to-top{
	width:40px;
	height:40px;
	position:fixed;
	cursor:pointer;
	bottom:20px;
	right:10px;
	display:none;
}

.header-contact{
	height:35px;
	padding:5px;
	background-color:#060;
	color:#FFF;
	font-family:Verdana, Geneva, sans-serif;
	font-size:16px;
	text-align:center;
}



/*-------------------- Media Query----------------------------*/

@media(min-width:768px)
{
	.form-control{
	border:solid 1px #CCCCCC;
	padding:5px;
	border-radius:3px;
	min-width:600px;
	font-family:Verdana, Geneva, sans-serif;
	}
	
	.form-are{
	border:solid 1px #CCCCCC;
	padding:5px;
	border-radius:3px;
	min-width:600px;
	height:300px;
	font-family:Verdana, Geneva, sans-serif;
	resize:none;
	top:0;
	left:0;
	}
	
	.float-left{
	float:left;
	margin-left:5px;
	font-family:"Gabriola";
	font-size:20px;
	letter-spacing:1px;
	}
	
}

@media (max-width: 767px) {
.navbar-default .navbar-nav .open .dropdown-menu > li > a {
    color: #FFF;
  }
  
.navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus  {
    color: #F30;
    background-color: #000;
  }
  
  .text-header{
	background-color:#060;
	height:30px;
	padding:5px;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:15px;
	color:#FFF;
	text-align:center;
	
	}
	
.zoom {
    height:auto;
    transition: all 0.5s;
    -o-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -webkit-transition: all 0.5s;
}

.zoom:hover {
    transition: all 0.3s;
    -o-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    transform: scale(1.5);
    -moz-transform: scale(1.5);
    -o-transform: scale(1.5);
    -webkit-transform: scale(1.5);
    box-shadow: 2px 2px 6px rgba(0,0,0,0.5);
}
	

  
}

  
