@charset "utf-8";
/*Skyfly Bootstrap standar styles (any altered styles on header or footer should be coded in below)*/

header .sf_container #but_filter,header .sf_container #but_close{
	display:none;
}

.sf_container {
  margin-right: auto;
  margin-left: auto;
  padding-left: 15px;
  padding-right: 15px;
}
@media (min-width: 768px) {
  .sf_container {
    width: 750px;
  }
}
@media (min-width: 992px) {
  .sf_container {
    width: 970px;
  }
}
@media (min-width: 1200px) {
  .sf_container {
    width: 1170px;
  }
}
.sf_container-fluid {
  margin-right: auto;
  margin-left: auto;
  padding-left: 15px;
  padding-right: 15px;
}
.sf_container > .navbar-header,
.sf_container-fluid > .navbar-header,
.sf_container > .navbar-collapse,
.sf_container-fluid > .navbar-collapse {
  margin-right: -15px;
  margin-left: -15px;
}
@media (min-width: 768px) {
  .sf_container > .navbar-header,
  .sf_container-fluid > .navbar-header,
  .sf_container > .navbar-collapse,
  .sf_container-fluid > .navbar-collapse {
    margin-right: 0;
    margin-left: 0;
  }
}
@media (min-width: 768px) {
  .navbar > .sf_container .navbar-brand,
  .navbar > .sf_container-fluid .navbar-brand {
    margin-left: -15px;
  }
}
.sf_container .jumbotron {
  border-radius: 2px;
}
.jumbotron .sf_container {
  max-width: 100%;
}
@media screen and (min-width: 768px) {
  .jumbotron {
    padding-top: 48px;
    padding-bottom: 48px;
  }
  .sf_container .jumbotron {
    padding-left: 60px;
    padding-right: 60px;
  }
  .jumbotron h1,
  .jumbotron .h1 {
    font-size: 63px;
  }
}
.clearfix:before,
.clearfix:after,
.dl-horizontal dd:before,
.dl-horizontal dd:after,
.sf_container:before,
.sf_container:after,
.sf_container-fluid:before,
.sf_container-fluid:after,
.row:before,
.row:after,
.form-horizontal .form-group:before,
.form-horizontal .form-group:after,
.btn-toolbar:before,
.btn-toolbar:after,
.btn-group-vertical > .btn-group:before,
.btn-group-vertical > .btn-group:after,
.nav:before,
.nav:after,
.navbar:before,
.navbar:after,
.navbar-header:before,
.navbar-header:after,
.navbar-collapse:before,
.navbar-collapse:after,
.pager:before,
.pager:after,
.panel-body:before,
.panel-body:after,
.modal-footer:before,
.modal-footer:after {
  content: " ";
  display: table;
}
.clearfix:after,
.dl-horizontal dd:after,
.sf_container:after,
.sf_container-fluid:after,
.row:after,
.form-horizontal .form-group:after,
.btn-toolbar:after,
.btn-group-vertical > .btn-group:after,
.nav:after,
.navbar:after,
.navbar-header:after,
.navbar-collapse:after,
.pager:after,
.panel-body:after,
.modal-footer:after {
  clear: both;
}

footer a, header a{
	color: #998675;
  text-decoration: none;
	background: transparent;
}
footer a:hover, header a:hover{
	text-decoration: underline;
}

/*End Skyfly standar styles*/

/*Header styles*/
.nav{
	padding:0 10px 0 10px;
}

.navbar-nav > li:hover > a, .navbar-nav > li:focus > a {
  color: #998675;
  background-color: rgba(0, 0, 0, 0.75);
}
.dropdown:hover .dropdown-menu {
  display: block;
	height: auto;
}
.cbp-af-header {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 999;
	height: 230px;
}
.cbp-af-header ul {
	margin-top: 50px;
}

.cbp-af-header .cbp-af-inner {
	width: 90%;
	max-width: 69em;
	margin: 0 auto;
	padding: 0 1.875em;
}

.cbp-af-header h1,
.cbp-af-header nav {
	display: inline-block;
	position: relative;
}

 /* We just have one-lined elements, so we'll center the elements with the line-height set to the height of the header */
.cbp-af-header nav ul.navbar-right {
	right:0;
}

.cbp-af-header h1 {
	width: 170px;
	height: 150px;
	text-transform: uppercase;
	color: #333;
	letter-spacing: 4px;
	font-size: 4em;
	margin: 0;
	float: left;
	background-color: rgba(17, 17, 17, 0.85);
}
.cbp-af-header h1:hover {
	background-color: #111;
	border: #998376; 
}
header {
	position: relative;
}
.cbp-af-header h1 img {
	width: 80%;
	position: absolute;
	top:50px;
	left: 15px;
}

.cbp-af-header a {
	color: #fff;
	font-size: 1em;
}


.cbp-af-header nav a:hover {
	color: #333;
	background-color:none;
}

/* Transitions and class for reduced height */
.cbp-af-header.cbp-af-header-shrink {
	height: 50px;
	background-color: #111;
	-webkit-box-shadow: 0px 2px 0px 0px rgba(0,0,0,0.25);
	-moz-box-shadow: 0px 2px 0px 0px rgba(0,0,0,0.25);
	box-shadow: 0px 2px 0px 0px rgba(0,0,0,0.25);
}

/*-- cckuo update 20141029 start --*/
.cbp-af-header-shrink div{
	margin-left: 0;
	margin-right: 0;	
}

.cbp-af-header-shrink .sf_container{
	position: absolute;
	z-index: 9;
	width: 100%;	
}

/*-- cckuo update 20141029 end --*/

.cbp-af-header.cbp-af-header-shrink h1,
.cbp-af-header.cbp-af-header-shrink nav a {
	line-height: normal;
}
.cbp-af-header.cbp-af-header-shrink h1 {
	height: 50px;
	background-color: transparent;
}
.cbp-af-header.cbp-af-header-shrink ul {
	margin-top: 0;
}
.cbp-af-header.cbp-af-header-shrink h1 img {
	width: 65%;
	margin-top:8px;
	position: absolute;
	top:0px;
	left: 0px;
}

/* Example Media Queries */
@media screen and (max-width: 55em) {
	
	.cbp-af-header .cbp-af-inner {
		width: 100%;
	}

	.cbp-af-header h1,
	.cbp-af-header nav {
		display: block;
		margin: 0 auto;
		text-align: center;
		float: none;
	}

	.cbp-af-header h1,
	.cbp-af-header nav a {
		line-height: 115px;
	}

	.cbp-af-header nav a {
		margin: 0 10px;
	}

	.cbp-af-header.cbp-af-header-shrink h1,
	.cbp-af-header.cbp-af-header-shrink nav a {
		line-height: 45px;
	}

	.cbp-af-header.cbp-af-header-shrink h1 {
		font-size: 2em;
	}

	.cbp-af-header.cbp-af-header-shrink nav a {
		font-size: 1em;
	}
}

@media screen and (max-width: 32.25em) {
	.cbp-af-header nav a {
		font-size: 1em;
	}
}

@media screen and (max-width: 24em) {
	.cbp-af-header nav a,
	.cbp-af-header.cbp-af-header-shrink nav a {
		line-height: 1;
	}
}
@media (max-width: 767px) {
.cbp-af-header {
	height: 50px;
	background-color: rgba(153, 134, 117, 0.9);
	-webkit-box-shadow: 0px 2px 0px 0px rgba(0,0,0,0.25);
	-moz-box-shadow: 0px 2px 0px 0px rgba(0,0,0,0.25);
	box-shadow: 0px 2px 0px 0px rgba(0,0,0,0.25);
}
.cbp-af-header ul {
	margin-top: 0px;
}
.cbp-af-header h1 {
	height: 50px;
	background-color: transparent;
}
.cbp-af-header h1:hover {
	background-color: #111;
}
.cbp-af-header h1 img {
	width: 65%;
	margin-top:8px;
	position: absolute;
	top:0px;
	left: 0px;
}
.navbar-toggle {
  position: relative;
  float: right;
  margin-right: 15px;
  padding: 9px 10px;
  margin-top: 8px;
  margin-bottom: 8px;
  background-color: #8c7968;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 2px;
}
.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
	background:rgba(0, 0, 0,.75);
	border-color: rgba(0, 0, 0, 0);
}
.navbar-default .navbar-nav .open .dropdown-menu {

	background:rgba(0, 0, 0,.35);
}
.navbar-default .navbar-nav .open .dropdown-menu > li > a {
	color: #999;
}
.navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
.navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
	color: #fff;
	background-color: #111 !important;
}
.navbar-default .navbar-nav .open .dropdown-menu > .active > a,
.navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
.navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
	color: #fff;
	background-color: #111;
}
}
.dropdown-menu > li > a:hover
,.dropdown-menu > li > a:focus{
	background-color: #111 !important;	
}
/*Ended Header styles*/



/*Footer styles*/
#gotop {
	display: none;
	position: fixed;
	right: 0;
	bottom: 57px;    
	padding: 10px 15px;    
	font-size: 20px;
	background: #998675;
	color: #2b2b2b;
	cursor: pointer;
	transition: color .3s;
	-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
	box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
}
#gotop:hover {
	color: #fff;
	background:#a59282;
	cursor: pointer;
}
@media (max-width: 767px) {
	#gotop {
		bottom: 95px;
	}
}
/* Icon */
/* enable absolute positioning */
.inner-addon { 
    position: relative; 
}

/* style icon */
.inner-addon .glyphicon {
  position: absolute;
  padding: 10px;
  pointer-events: none;
  z-index:5;
}

/* align icon */
.left-addon .glyphicon  { left:  0px;}
.right-addon .glyphicon { right: 0px;}

/* add padding  */
.left-addon input  { padding-left:  30px; }
.right-addon input { padding-right: 30px; }

/* Social */
.socialIcon {
	display: inline-block;
	width: 48px;
	height: 48px;
	margin: 0 3px;
	line-height: 50px;
	font-family: Entypo;
	font-size: 2em;
	text-align: center;
	color: #2b2b2b;
	border-radius: 50%;
	background: #998675;
	overflow: hidden;
	transition: color .3s;
}
.socialIcon {
   text-shadow: rgb(140, 123, 108) 1px 1px,
    rgb(141, 124, 109) 2px 2px,
    rgb(141, 124, 109) 3px 3px,
    rgb(142, 125, 110) 4px 4px,
    rgb(143, 126, 111) 5px 5px,
    rgb(143, 126, 111) 6px 6px,
    rgb(144, 127, 112) 7px 7px,
    rgb(145, 128, 113) 8px 8px,
    rgb(146, 129, 114) 9px 9px,
    rgb(147, 130, 115) 10px 10px,
    rgb(147, 130, 115) 11px 11px,
    rgb(148, 131, 116) 12px 12px,
    rgb(148, 131, 116) 13px 13px,
    rgb(149, 132, 117) 14px 14px,
    rgb(150, 133, 118) 15px 15px,
    rgb(150, 133, 118) 16px 16px,
    rgb(151, 134, 119) 17px 17px,
    rgb(151, 134, 119) 18px 18px,
    rgb(152, 135, 120) 19px 19px,
    rgb(153, 136, 121) 20px 20px;
}
.socialIcon:hover {
	color: #fff;
	background:#a59282;
	cursor: pointer;
}
.socialIcon i{
	margin:10px;
	transform: initial !important; 
}
.borderlineA {
	border-bottom: rgba(255,255,255,0.1) 1px solid;
}
.borderlineL {
	min-height:150px;
	border-left: rgba(255,255,255,0.1) 1px solid;
}
@media (max-width: 767px) {
	.borderlineL {
		border-left: none;
		border-top: rgba(255,255,255,0.1) 1px solid;
		padding: 2% 0;
	}
}
@media (max-width: 360px) {
	.borderlineL {
		border-left: none;
		border-top: rgba(255,255,255,0.1) 1px solid;
		padding: 2% 0;
	}
}
.sf_infoContainer {
	min-height: 200px;
	padding:25px;
	color:#959595;
	background-color:#2b2b2b;
}
.sf_infoContainer ul li {
	list-style:none;
	line-height:2.2em;
}
.sf_copyrightContainer {
	min-height: 42px;
	padding:12px;
	color:#666;
	vertical-align:bottom;
	background-color:#111;
}
.btn_scroll_down{
	position: absolute; z-index:999; display:block; left: 50%; margin-left: -34px; top:0; margin-top:-33px;
}
.btn_close {
	z-index: 1;
}
footer h4{
	padding:10px 0;
	font-size:18px;
	color:inherit;
	margin: 0 !important;
}
footer p{
	margin: 0 0 10px;
}
.sf_container h1, .sf_container h1, .sf_container h2, .sf_container h3, .sf_container h4, .sf_container h5, .sf_container h6 {
  color: rgb(149, 149, 149);
}

/*Ended Footer styles*/

/*Additional style: from skyfly.css*/
/* section1 */
.section-video {
	background-attachment: fixed;
	background-color: #272822;
	height: 100vh;
	overflow: hidden;
}
#ctrl_video{
  display:none;
  position:absolute;
  top:50%;
  left:50%;
  margin:-32px 0 0 -32px;
  z-index:100;
  opacity: 0.25;
  cursor:pointer;
}
.section-video:hover #ctrl_video{
  display:block;
}
.video-container{
  position: relative;
  width: 100%;
  height:100%;
  overflow:hidden;
}
video#bgvid {
	/*position: fixed; */
	right: 0; bottom: 0;
	min-width: 100%; min-height: 100%;
	width: auto; height: auto; z-index: -100;
	background: url(/images/transparent.png) no-repeat;
	background-size: cover;
}
.bgvid-init{
	width: 100%;
	height: 100%;
	background: url(/images/hear-the-texture-of-sound-b.gif) no-repeat 0 0; 
	-webkit-background-size:cover; 
	-moz-background-size:cover; 
	-o-background-size:cover; 
	background-size:cover;  
}
.nav{
  padding:0 10px 0 10px;
}
.nav_menu {
	position: absolute;
}
@media (max-width: 767px) {
	.nav .dropdown-menu {
		position: relative;
	}
}
.dropdown:hover .dropdown-menu {
    display: block;
    height: auto;
}
/* General */
a {
	color:rgb(153, 134, 117);
	cursor:pointer;
	border: 0;
}

#hidFrame{
	display:none;
}
.pos-abs{
	position:absolute;
}
	/* Panel */
	.modal-content {
		color:#929494;
	}
/* Media */
#fullVideo{
	position: absolute;
	right: 0;
	bottom: 0;
	top:0;
	right:0;
	width: 100%;
	height: 100%;
	z-index: 10;
	background-size: 100% 100%;
	background-color: black; /* in case the video doesn't fit the whole page*/
	background-image: inherit;/* our video */
	background-position: center center;
	background-size: contain;
	object-fit: cover; /*cover video background */
}

/* Function */
#nextTopic {
	width:64px;
	height:64px;
	float: left;
	position: relative;
	right: 50%;
	bottom: 50%;    
	padding: 10px 15px;    
	font-size: 20px;
	background: #998675;
	color: #2b2b2b;
	cursor: pointer;
	transition: color .3s;
	-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
	box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
	z-index:10000;
}
#nextTopic:hover {
	color: #fff;
	background:#a59282;
	cursor: pointer;
}
#onlineChat {
	position: fixed;
	right: 0;
	bottom: 80px;    
	padding: 10px 15px;    
	font-size: 20px;
	background: #998675;
	color: #2b2b2b;
	cursor: pointer;
	transition: color .3s;
	-webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
	box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
}
#onlineChat:hover {
	color: #fff;
	background:#a59282;
	cursor: pointer;
}

/* = Product Only Css Settings = */
.nav > li.product-only{
	display:none;
}
/* = Share = */

.btn-sign{ color: #FFF; display: block; padding: 5% 0 5% 20%; margin: 0 0 2% 0;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	border-radius: 2px;
}
.btn-sign:hover{  color: #FFF; text-decoration: none;}
.sign_facebook{ background: #0043a7 url(../images/icon-fb.png) 10% 50% no-repeat; }
.sign_google{ background: #de4c32 url(../images/icon-googleplus.png) 10% 50% no-repeat; }
.sign_base{ background: #e89214 url(../images/icon-base.png) 10% 50% no-repeat; }
.sign_twitter{ background: #33ccff url(../images/icon-twitter.png) 10% 50% no-repeat; }

.iconshare{ display:block; background: url(../images/icon-share.png) no-repeat; }

	/*to prevent style rewrite*/
.modal h1, .modal h2, .modal h3, .modal h4, .modal h5, .modal h6{
	color:inherit;
}
/*Ended additional style*/