/*
Theme Name: Simple Parallax Website
Description: Simple Parallax Scrolling Effect
Author: Samuel Dalusung
*/

/*= GENERAL STYLING
--------------------------------------------------------*/

/*css all page*/
@font-face {
	font-family: 'heavy';
	src: url('../fonts/heavy/FUTURAH.eot');
	src: local(''), url('../fonts/heavy/FUTURAH.woff') format('woff'), url('../fonts/heavy/FUTURAH.ttf') format('truetype'), url('../fonts/heavy/FUTURAH.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'contenttype';
	src: url('../fonts/isi/FUTURAH.eot');
	src: local(''), url('../fonts/isi/FUTURAH.woff') format('woff'), url('../fonts/isi/FUTURAH.ttf') format('truetype'), url('../fonts/isi/FUTURAH.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

.text-shadow {
	text-shadow: 2px 2px 5px #000000; 
}
/*
carousel modifikasi properti
*/
/*
  .carousel-inner > .item > img,
  .carousel-inner > .item > a > img {
      width: 100%;
      margin: auto;
  }


.carousel,.item,.active{height:100%;}
.carousel-inner{height:100%;}
.carousel .carousel-control { visibility: hidden; }
.carousel:hover .carousel-control { visibility: visible; }
  .carousel-inner > .item > img,
  .carousel-inner > .item > a > img {
      width: 100%;
      margin: auto;
  }
*/
.carousel-fade .carousel-inner .item {
  opacity: 0;
  transition-property: opacity;
}

.carousel-fade .carousel-inner .active {
  opacity: 1;
}

.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  opacity: 0;
  z-index: 1;
}

.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
  opacity: 1;
}

.carousel-fade .carousel-control {
  z-index: 2;
}

.animateme
{
  width:100%;
  transform-origin:center center center;
}
.scrollme
{
  perspective:60000px;
}

		.animated {
            -webkit-animation-duration: 10s;
            animation-duration: 10s;
            -webkit-animation-fill-mode: both;
            animation-fill-mode: both;
         }
         
         @-webkit-keyframes fadeIn {
            0% {opacity: 0;}
            100% {opacity: 1;}
         }
         
         @keyframes fadeIn {
            0% {opacity: 0;}
            100% {opacity: 1;}
         }
         
         .fadeIn {
            -webkit-animation-name: fadeIn;
            animation-name: fadeIn;
         }


	.menu { color:#551C00; text-decoration:none; font-family:heavy; }


/*These styles contain basic styles for fomatting along with our animation css*/
strong,
b {
  font-weight: 600
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 300;
  line-height: 150%;
}

i.fa {
  color: #333;
}

*,
*:before,
*:after {
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}
/*clearfixes*/

.cf:before,
.cf:after {
  content: " ";
  display: table;
}

.cf:after {
  clear: both;
}

.main-container {
  background: #fff;
  max-width: 1000px;
  margin: 25px auto 25px auto;
  position: relative;
}

/*animation element*/

.animation-element {
  opacity: 0;
  position: relative;
}
/*animation element sliding left*/

.animation-element.slide-left {
  opacity: 0;
  -moz-transition: all 500ms linear;
  -webkit-transition: all 500ms linear;
  -o-transition: all 500ms linear;
  transition: all 500ms linear;
  -moz-transform: translate3d(-100px, 0px, 0px);
  -webkit-transform: translate3d(-100px, 0px, 0px);
  -o-transform: translate(-100px, 0px);
  -ms-transform: translate(-100px, 0px);
  transform: translate3d(-100px, 0px, 0px);
}

.animation-element.slide-left.in-view {
  opacity: 1;
  -moz-transform: translate3d(0px, 0px, 0px);
  -webkit-transform: translate3d(0px, 0px, 0px);
  -o-transform: translate(0px, 0px);
  -ms-transform: translate(0px, 0px);
  transform: translate3d(0px, 0px, 0px);
}
/*animation slide left styled for testimonials*/

.animation-element.slide-left.testimonial {
  float: left;
  width: 47%;
  margin: 0% 1.5% 3% 1.5%;
  background: #F5F5F5;
  padding: 15px;
box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.2);
  border: solid 1px #EAEAEA;
}
.animation-element.slide-left.testimonial:hover,
.animation-element.slide-left.testimonial:active{
  box-shadow: 0px 2px 8px 0px rgba(0, 0, 0, 0.25);
}

.animation-element.slide-left.testimonial:nth-of-type(odd) {
  width: 48.5%;
  margin: 0% 1.5% 3.0% 0%;
}

.animation-element.slide-left.testimonial:nth-of-type(even) {
  width: 48.5%;
  margin: 0% 0% 3.0% 1.5%;
}

.animation-element.slide-left.testimonial .header{
  float: left;
  width: 100%;
  margin-bottom: 10px;
}
.animation-element.slide-left.testimonial .left{
  float: left;
  margin-right: 15px;
}
.animation-element.slide-left.testimonial .right{
  float: left;
}

.animation-element.slide-left.testimonial img {
  width: 65px;
  height: 65px;
  border-radius: 50%;
  box-shadow: 0px 1px 3px rgba(51, 51, 51, 0.5);
}

.animation-element.slide-left.testimonial h3 {
  margin: 0px 0px 5px 0px;
}

.animation-element.slide-left.testimonial h4 {
  margin: 0px 0px 5px 0px;
}

.animation-element.slide-left.testimonial .content {
  float: left;
  width:100%;
  margin-bottom: 10px;
}

.animation-element.slide-left.testimonial .rating{}

.animation-element.slide-left.testimonial i {
  color: #aaa;
  margin-right: 5px;
}



/*media queries for small devices*/
@media screen and (max-width: 678px){
  /*testimonials*/
  .animation-element.slide-left.testimonial,
  .animation-element.slide-left.testimonial:nth-of-type(odd),
  .animation-element.slide-left.testimonial:nth-of-type(even){
    width: 100%;
    margin: 0px 0px 20px 0px;
  }
  .animation-element.slide-left.testimonial .right,
  .animation-element.slide-left.testimonial .left,
  .animation-element.slide-left.testimonial .content,
  .animation-element.slide-left.testimonial .rating{
    text-align: center;
    float: none;
  }
  .animation-element.slide-left.testimonial img{
    width: 85px;
    height: 85px;
    margin-bottom: 5px;
  }
  
}



@media (min-width: 1025px) and (max-width: 1920px) {
    .header-unit {
    height: 700px;
    border-right:none;
    border-left: none;
    position: relative;
    padding: 20px;
	}
	.btn-home {
		width: auto; float: left; margin-right: 20px; font-family: Montserrat-Medium; font-size: 18px; text-decoration: underline; color: #622E10; padding-top: 3px;
	}
	.btn-home:hover {
		color: #622E10;
	}

	.youtubebanner{width:100%;height:700px; float: none; clear: both; margin: 2px auto;}
	.grad_left {
		height: 100%;
		width:100px;
		float:left;
		position:fixed; top:0; left:0;
		z-index:9999;
		background: -webkit-linear-gradient(left, rgba(84,27,0,0.1), rgba(51,51,51,0.3)); /* For Safari 5.1 to 6.0 */
		background: -o-linear-gradient(right, rgba(84,27,0,0.1), rgba(51,51,51,0.3)); /* For Opera 11.1 to 12.0 */
		background: -moz-linear-gradient(right, rgba(84,27,0,0.1), rgba(51,51,51,0.3)); /* For Firefox 3.6 to 15 */
		background: linear-gradient(to right, rgba(84,27,0,0.1), rgba(51,51,51,0.3)); /* Standard syntax (must be last) */		
		/*
		background-color: rgba(0,0,0,.1);
		box-shadow: inset -7px 0px 9px -7px rgba(0,0,0,1);
		*/
	}
	.grad_right {
		position:fixed; top:0; right:0;
		z-index:9999;
		height: 100%;
		width:100px;
		float:right;
		background: -webkit-linear-gradient(right, rgba(84,27,0,0.1), rgba(51,51,51,0.3)); /* For Safari 5.1 to 6.0 */
		background: -o-linear-gradient(left, rgba(84,27,0,0.1), rgba(51,51,51,0.3)); /* For Opera 11.1 to 12.0 */
		background: -moz-linear-gradient(left, rgba(84,27,0,0.1), rgba(51,51,51,0.3)); /* For Firefox 3.6 to 15 */
		background: linear-gradient(to left, rgba(84,27,0,0.1), rgba(51,51,51,0.3)); /* Standard syntax (must be last) */
	
	}

		.rcornersbouth {
			background: #73AD21;
			z-index:3; display:table;
			position:relative;
			border:3px solid #fff;
			float:left; webkit-border-radius: 50%; moz-border-radius: 50%; border-radius:50%; overflow:hidden;
			margin:23px; width:200px; height:200px;
		}
		.rcornersbouth:hover #sidebar {
			margin-top:45%;
			opacity: 1;
		}
	
		div.text{ 
			vertical-align:middle;
			display:table-cell;
			text-align:center;
			font-family:heavy; font-size:25px; color:#fff;
			z-index:2; text-transform:uppercase;
			background-color: rgba(85, 28, 0, 0.5);
		}
		#sidebar {
			transition: all 0.5s ease-in-out;
			-moz-transition: all 0.5s ease-in-out;
			-o-transition: all 0.5s ease-in-out;
			opacity: 0;
		}

	.expanmenu{width:100%; float:left; text-align:center; position:absolute; top:630px; z-index:1}
	.slider{margin-top:0; margin-bottom:0; height:auto; overflow:hidden}
	.slider_nav{position:absolute; top:400px; width:100%;}
	.classkiri{background:#fff; color:#666666; padding-top:7px; width:50px; font-size:34px; height:50px; border-radius:100%; margin-left:120px}
	.classkanan{background:#fff; color:#666666; padding-top:7px; width:50px; font-size:34px; height:50px; border-radius:100%; margin-right:120px}
	
	.desk{ display:block; }
	.mobi{ display:none; }
	.borderleft{border-left:1px solid #ccc; padding-left:50px}
	.margincontent{margin-top:30px; padding-left:87px;}
	.bodytitle{font-size:35px; width:100%; float:left; font-family:heavy; color:#551C00; margin-top:150px; padding-left:100px}
	.breadcrumb{ width:100%; float:left; background:#fff; padding-left:120px}
	.gallerythumb{height:370px; margin-bottom:30px; overflow:hidden; border-bottom:1px solid #ccc}
	.galleryimg{width:300px; height:300px;}
	.imgcss{width:200px; height:200px}
	.imgcsst{width:170px; height:170px}
	.padding0{ padding: 0;}
	.titlebouthome{font-size:30px; font-family:heavy; color:#541C00; text-align:center; margin-bottom:50px}
	.posisibouthome{margin-top:200px; margin-bottom:50px}
	.contentbouthome{font-size:18px; line-height:30px; font-family:contenttype; color:#000; margin-bottom:0; padding:0 150px; text-align:center}
	.subcontent{margin-top:50px; padding:50px 90px 50px 90px;}
	.expertimghome{width:400px; height:400px; float:left; margin-left:100px; text-align:center; overflow:hidden}
	.expertgbrhome{height:100%; text-align:center}
	.experttexthome{width:600px; padding:100px 100px 0 100px; float:left; margin-right:100px; text-align:center; color:#fff}
	.experttitle{font-size:30px; font-family:heavy}
	.expertcontent{font-size:16px; line-height:25px; margin-top:20px; font-weight:contenttype}
	.expertsub{width:200px; height:250px; position:relative; margin:auto 25px}
	.expertsubimg{webkit-border-radius: 50%; moz-border-radius: 50%; border-radius:50%; border:2px solid #fff; width:100px; height:100px; border:0}
	.expertsubname{color:#A88952; margin-top:20px; text-transform:uppercase; font-size:20px; font-family:'heavy'; text-decoration:none}
	.paddingfoot{padding:0 70px 0 70px}
	.sosmedfoot{width:1100px; margin:auto; position:absolute; top:3px; text-align:right; }
}
@media (min-width: 751px) and (max-width: 1024px) {
    .header-unit {
    height: 500px;
    border-right:none;
    border-left: none;
    position: relative;
    padding: 20px;
	}

	.youtubebanner{width:100%;height:100%; float: none; clear: both; margin: 2px auto;}
		.rcornersbouth {
			background: #73AD21;
			z-index:3; display:table;
			position:relative;
			border:3px solid #fff;
			float:left; webkit-border-radius: 50%; moz-border-radius: 50%; border-radius:50%; overflow:hidden;
			margin:20px; width:160px; height:160px;
		}
		.rcornersbouth:hover #sidebar {
			margin-top:45%;
			opacity: 1;
		}
	
		div.text{ 
			vertical-align:middle;
			display:table-cell;
			text-align:center;
			font-family:heavy; font-size:25px; color:#fff;
			z-index:2; text-transform:uppercase;
			background-color: rgba(85, 28, 0, 0.5);
		}
		#sidebar {
			transition: all 0.5s ease-in-out;
			-moz-transition: all 0.5s ease-in-out;
			-o-transition: all 0.5s ease-in-out;
			opacity: 0;
		}
	header{ display:none; }
	.headermobi{ display:block; }
	.desk{ display:none; }
	.mobi{ display:block; }
	.grad_left { display:none; }
	.grad_right { display:none; }
	.borderleft{border-left:0px solid #ccc;}
	.margincontent{margin-top:5px;}
	.bodytitle{font-size:35px; width:100%; float:left; font-family:heavy; color:#551C00; margin-top:50px; padding-left:10px}
	.breadcrumb{ width:100%; float:left; background:#fff; padding-left:30px}
	.gallerythumb{margin-bottom:30px; overflow:hidden; padding:0; border-bottom:1px solid #ccc}
	.galleryimg{width:100%; float:left; border:1px solid #ccc}
	.imgcss{width:100%; border-radius:0; webkit-border-radius: 0; moz-border-radius: 0;}
	.imgcsst{width:100%; border-radius:0; webkit-border-radius: 0; moz-border-radius: 0;}
	.padding0{padding:0}
	.titlebouthome{font-size:25px; font-family:heavy; color:#541C00; text-align:center; margin-bottom:30px}
	.posisibouthome{margin-top:50px; margin-bottom:100px}
	.contentbouthome{font-size:16px; line-height:30px; font-family:contenttype; color:#000; margin-bottom:0; padding:0 10px; text-align:center}
	.subcontent{padding:50px}
	.expertimghome{width:100%; float:left; padding:15px; text-align:center; overflow:hidden}
	.expertgbrhome{width:100%;}
	.experttexthome{width:100%; padding:15px; color:#fff}
	.experttitle{font-size:20px; font-family:heavy}
	.expertcontent{font-size:12px; font-family:contenttype}
	.expertsub{width:100px; height:150px; position:relative; margin:auto 12px}
	.expertsubimg{webkit-border-radius: 50%; moz-border-radius: 50%; border-radius:50%; border:2px solid #fff; width:70px; height:70px; border:0}
	.expertsubname{color:#A88952; margin-top:20px; text-transform:uppercase; font-size:12px; font-family:'heavy'; text-decoration:none}

	.expanmenu{width:100%; float:left; text-align:center; position:absolute; top:630px; z-index:1}
	.slider{margin-top:0; margin-bottom:0; height:auto; overflow:hidden}
	.slider_nav{position:absolute; top:400px; width:100%;}
	.classkiri{background:#fff; color:#666666; padding-top:7px; width:50px; font-size:34px; height:50px; border-radius:100%; margin-left:120px}
	.classkanan{background:#fff; color:#666666; padding-top:7px; width:50px; font-size:34px; height:50px; border-radius:100%; margin-right:120px}
	.paddingfoot{padding:0}
	.sosmedfoot{width:100%; position:absolute; top:5px; text-align:center}
}

@media (min-width: 400px) and (max-width: 750px) {
    .header-unit {
    height: 300px;
    border-right:none;
    border-left: none;
    position: relative;
    padding: 20px;
	}

	.youtubebanner{width:100%;height:100%; float: none; clear: both; margin: 2px auto;}
		.rcornersbouth {
			background: #73AD21;
			z-index:3; display:table;
			position:relative;
			border:3px solid #fff;
			float:left; webkit-border-radius: 50%; moz-border-radius: 50%; border-radius:50%; overflow:hidden;
			margin:15px; width:200px; height:200px;
		}
		.rcornersbouth:hover #sidebar {
			margin-top:45%;
			opacity: 1;
		}
	
		div.text{ 
			vertical-align:middle;
			display:table-cell;
			text-align:center;
			font-family:heavy; font-size:15px; color:#fff;
			z-index:2; text-transform:uppercase;
			background-color: rgba(85, 28, 0, 0.5);
		}
		#sidebar {
			transition: all 0.5s ease-in-out;
			-moz-transition: all 0.5s ease-in-out;
			-o-transition: all 0.5s ease-in-out;
			opacity: 0;
		}
	header{ display:none; }
	.headermobi{ display:block; }
	.desk{ display:none; }
	.mobi{ display:block; }
	.grad_left { display:none; }
	.grad_right { display:none; }
	.borderleft{border-left:0px solid #ccc;}
	.margincontent{margin-top:5px;}
	.bodytitle{font-size:35px; width:100%; float:left; font-family:heavy; color:#551C00; margin-top:50px; padding-left:10px}
	.breadcrumb{ width:100%; float:left; background:#fff; padding-left:30px}
	.gallerythumb{margin-bottom:30px; overflow:hidden; padding:0; border-bottom:1px solid #ccc}
	.galleryimg{width:100%; float:left; border:1px solid #ccc}
	.imgcss{width:100%; border-radius:0; webkit-border-radius: 0; moz-border-radius: 0;}
	.imgcsst{width:100%; border-radius:0; webkit-border-radius: 0; moz-border-radius: 0;}
	.padding0{padding:0}
	.titlebouthome{font-size:20px; font-family:heavy; color:#541C00; text-align:center; margin-bottom:50px}
	.posisibouthome{margin-top:50px; margin-bottom:100px}
	.contentbouthome{font-size:16px; line-height:30px; font-family:contenttype; color:#000; margin-bottom:0; padding:0 10px; text-align:center}
	.subcontent{padding:50px}
	.expertimghome{width:100%; float:left; padding:15px; text-align:center; overflow:hidden}
	.expertgbrhome{width:100%;}
	.experttexthome{width:100%; padding:15px; color:#fff}
	.experttitle{font-size:20px; font-family:heavy}
	.expertcontent{font-size:12px; font-family:contenttype}
	.expertsub{width:100px; height:150px; position:relative; margin:auto 12px}
	.expertsubimg{webkit-border-radius: 50%; moz-border-radius: 50%; border-radius:50%; border:2px solid #fff; width:70px; height:70px; border:0}
	.expertsubname{color:#A88952; margin-top:20px; text-transform:uppercase; font-size:14px; font-family:'heavy'; text-decoration:none}

	.expanmenu{width:100%; float:left; text-align:center; position:absolute; top:630px; z-index:1}
	.slider{margin-top:0; margin-bottom:0; height:auto; overflow:hidden}
	.slider_nav{position:absolute; top:400px; width:100%;}
	.classkiri{background:#fff; color:#666666; padding-top:7px; width:50px; font-size:34px; height:50px; border-radius:100%; margin-left:120px}
	.classkanan{background:#fff; color:#666666; padding-top:7px; width:50px; font-size:34px; height:50px; border-radius:100%; margin-right:120px}
	.paddingfoot{padding:0}
	.sosmedfoot{width:100%; position:absolute; top:5px; text-align:center}
}

@media (min-width: 60px) and (max-width: 399px) {
    .header-unit {
    height: 200px;
    border-right:none;
    border-left: none;
    position: relative;
    padding: 20px;
	}
	.btn-home {
		position: absolute !important; top: 27px !important; right: 225px !important; font-family: Montserrat-Medium; font-size: 16px; text-decoration: underline; color: #622E10; padding-top: 3px;
	}

	.youtubebanner{width:100%;height:100%; float: none; clear: both; margin: 2px auto;}
		.rcornersbouth {
			background: #73AD21;
			z-index:3; display:table;
			position:relative;
			border:3px solid #fff;
			float:left; webkit-border-radius: 50%; moz-border-radius: 50%; border-radius:50%; overflow:hidden;
			margin:10px; width:200px; height:200px;
		}
		.rcornersbouth:hover #sidebar {
			margin-top:45%;
			opacity: 1;
		}
	
		div.text{ 
			vertical-align:middle;
			display:table-cell;
			text-align:center;
			font-family:heavy; font-size:15px; color:#fff;
			z-index:2; text-transform:uppercase;
			background-color: rgba(85, 28, 0, 0.5);
		}
		#sidebar {
			transition: all 0.5s ease-in-out;
			-moz-transition: all 0.5s ease-in-out;
			-o-transition: all 0.5s ease-in-out;
			opacity: 0;
		}

	header{ display:none; }
	.headermobi{ display:block; }
	.desk{ display:none; }
	.mobi{ display:block; }
	.grad_left { display:none; }
	.grad_right { display:none; }
	.borderleft{border-left:0px solid #ccc;}
	.margincontent{margin-top:5px;}
	.bodytitle{font-size:35px; width:100%; float:left; font-family:heavy; color:#551C00; margin-top:50px; padding-left:10px}
	.breadcrumb{ width:100%; float:left; background:#fff; padding-left:30px}
	.gallerythumb{margin-bottom:30px; overflow:hidden; padding:0; border-bottom:1px solid #ccc}
	.galleryimg{width:100%; float:left; border:1px solid #ccc}
	.imgcss{width:100%; border-radius:0; webkit-border-radius: 0; moz-border-radius: 0;}
	.imgcsst{width:100%; border-radius:0; webkit-border-radius: 0; moz-border-radius: 0;}
	.padding0{padding:0}
	.titlebouthome{font-size:20px; font-family:heavy; color:#541C00; text-align:center; margin-bottom:50px}
	.posisibouthome{margin-top:50px; margin-bottom:10px}
	.contentbouthome{font-size:16px; line-height:30px; font-family:contenttype; color:#000; margin-bottom:0; padding:0 10px; text-align:center}
	.subcontent{padding:50px}
	.expertimghome{width:100%; float:left; padding:15px; text-align:center; overflow:hidden}
	.expertgbrhome{width:100%;}
	.experttexthome{width:100%; padding:15px; color:#fff}
	.experttitle{font-size:20px; font-family:heavy}
	.expertcontent{font-size:12px; font-family:contenttype}
	.expertsub{width:100px; height:150px; position:relative; margin:auto 12px}
	.expertsubimg{webkit-border-radius: 50%; moz-border-radius: 50%; border-radius:50%; border:2px solid #fff; width:70px; height:70px; border:0}
	.expertsubname{color:#A88952; margin-top:20px; text-transform:uppercase; font-size:12px; font-family:'heavy'; text-decoration:none}

	.expanmenu{width:100%; float:left; text-align:center; position:absolute; top:630px; z-index:1}
	.slider{margin-top:0; margin-bottom:0; height:auto; overflow:hidden}
	.slider_nav{position:absolute; top:400px; width:100%;}
	.classkiri{background:#fff; color:#666666; padding-top:7px; width:50px; font-size:34px; height:50px; border-radius:100%; margin-left:120px}
	.classkanan{background:#fff; color:#666666; padding-top:7px; width:50px; font-size:34px; height:50px; border-radius:100%; margin-right:120px}
	.paddingfoot{padding:0}
	.sosmedfoot{width:100%; position:absolute; top:5px; text-align:center}
}
/*versi desktop*/


#video-container {
    position: absolute;
}
#video-container {
    top:0%;
    left:0%;
    height:100%;
    width:100%;
    overflow: hidden;
}
video {
    position:absolute;
    z-index:0;
}
video.fillWidth {
    width: 100%;
}
