/*
Theme Name: DaurEsia
Author: dauresia.com
*/
html{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;font-family: 'Rubik';font-weight: 300;}
body{margin:0;color:#333;font-family: "Rubik", serif;font-weight: 300;font-size: 18px;}
h1 { font-weight: 500; font-size: 52px; }
h2 { font-weight: 500; font-size: 46px; }
h1, h2 { color: #222222; }
h3 { font-size: 30px; font-weight: 500; }
h4 { font-size: 24px; font-weight: 400; }
h5 { font-size: 20px; font-weight: 400; }
a { text-decoration: none; color: #333; cursor: pointer; }
a:hover,.link { color: #4ab8aa; }
.btn-de { background: #4ab8aa; color: #fff; }

.scrolling { -moz-transition: all 400ms ease; -ms-transition: all 400ms ease; -o-transition: all 400ms ease; transition: all 400ms ease;}
.navbar { padding: 15px 40px; background: #fff; }
.navbar-brand {width: 60px; height: 80px; margin-right: 30px; text-indent: -1000px; background: url("assets/img/logo.svg") center no-repeat; background-size: contain; position: relative;-moz-transition: all 400ms ease; -ms-transition: all 400ms ease; -o-transition: all 400ms ease; transition: all 400ms ease;}
.scrolling .navbar-brand { width: 54px; height: 70px; }
.navbar-nav .nav-link,.dropdown-item { font-family: 'Rubik',sans-serif; font-size: 16px; font-weight: 100; text-transform: uppercase; }
.navbar-nav .nav-link:hover,.navbar-nav .active .nav-link { color: #4ab8aa; }
.fa {width: 40px; height:  40px; border-radius: 8px; margin: 0 5px; display: inline-block; background-size: cover; }
.fa-instagram {background: url("assets/img/instagram.png"); }
.fa-instagram::before,.fa.fa-facebook::before,.fa-youtube::before { content: ' '; }
.fa-facebook {background: url("assets/img/facebook.png"); }
.fa-youtube {background: url("assets/img/youtube.png"); }
.dropdown-menu {border: none; padding: 0 20px;}
.dropdown-item {color: #333;padding: 10px 0; }
.dropdown-item:hover{background: none;color: #4ab8aa;}

.hero {position: relative; overflow-x: hidden; margin: 0; height: 100vh; background: url("assets/img/assets_01.jpg") center no-repeat; background-attachment: fixed; background-size: cover; z-index: -1; }
.hero-content { position: absolute; width: 50%; bottom: 260px; left: 120px; color: #fff; }
.hero-content h1 { font-size: 72px; line-height: 72px; color: #fff; text-shadow: 2px 2px 3px rgba(0,0,0,0.25); }
.hero-content span { color: #4ab8aa; }
.hero-bottom { position: absolute; bottom: -340px; left: 0; width: 100%; height: 758px; background: url("assets/img/assets_02.svg") center no-repeat; background-size: cover; z-index: -1; }
.block { padding: 30px 0; }
.top-up { margin-top: -80px; z-index: 1; }
blockquote { font-size: 30px; padding-left: 100px; position: relative; }
blockquote:before { position: absolute; width: 80px; height: 74px; left: 0; top: 10px; background: url("assets/img/quote.svg") center no-repeat; background-size: contain; content: ' '; }
.block h2 {color: #4ab8aa;}
.block h2 span {color: #725947;}
.block .heading { font-size: 24px; font-weight: 400; }
.entry-content p:first-child { font-size: 24px !important; font-weight: 400; }
.page-heading { position: relative; height: 680px; }
.heading-bottom { position: absolute; width: 100%; height: 666px; top: 340px; background: url("assets/img/page-heading-btm.svg") center top no-repeat; background-size: cover; }
.page-heading h1,.page-heading h2 { color: #fff; text-shadow: 2px 2px 3px rgba(0,0,0,0.25); font-size: 60px; margin-top: 60px; }
.page-heading h1 span,.page-heading h2 span {color: #4ab8aa;}
.about-us { background: url("assets/img/about-bg.jpg") center top no-repeat; z-index: -1; }
.Transformation, .Transformasi { background: url("assets/img/transformation-bg.jpg") center top no-repeat; z-index: -1; }
.Education, .Edukasi { background: url("assets/img/education-bg.jpg") center top no-repeat; z-index: -1; }
.Collaboration, .Kolaborasi { background: url("assets/img/collaboration-bg.jpg") center top no-repeat; z-index: -1; }
.contact-us { background: url("assets/img/contact-us-bg.jpg") center top no-repeat; z-index: -1; }
.subtitle { text-align: left }
.subtitle h1 { font-size: 36px; margin-bottom: 40px; }
.unique-item-content {margin-left: 20px;}
.subtitle h1,.subtitle h2,.subtitle h3,.unique-item h3 {color: #725947;}
.icon { min-width: 70px; height: 70px; }
.icon-01 { background: url("assets/img/icon/icon01.svg") center no-repeat; }
.icon-02 { background: url("assets/img/icon/icon02.svg") center no-repeat; }
.icon-03 { background: url("assets/img/icon/icon03.svg") center no-repeat; }
.icon-04 { background: url("assets/img/icon/icon04.svg") center no-repeat; }
.icon-05 { background: url("assets/img/icon/icon05.svg") center no-repeat; }
.transformation { min-width: 40px; height: 40px; background: url(assets/img/icon/transform.svg) center no-repeat; display: inline-block; margin-right: 15px; }
.eductaion { min-width: 40px; height: 40px; background: url(assets/img/icon/education.svg) center no-repeat; display: inline-block; margin-right: 15px; }
.collaboration { min-width: 40px; height: 40px; background: url(assets/img/icon/collaboration.svg) center no-repeat; display: inline-block; margin-right: 15px; }
.pillar h5 { font-size: 30px; font-weight: 500 }
.text-brown { color: #725947; }
.w-300 { font-weight: 300 !important }
.client { margin-bottom: -120px; }

.circular { background: #cde0d8; z-index: -2; }
.circular-item { position: relative; padding: 100px; background: #f2f4f3; }
.circular-content { padding: 100px; font-size: 24px; }
.circular-content h3 {font-size: 36px; color: #725947;}
.circular-content h4 {font-size: 30px; color: #725947; font-weight: 500;}
.pillar {padding-bottom: 280px; }
.pillar-divider {margin-top: -300px;}

.map-frame { width: 100%; height: 100%; height: 800px; position: relative; margin-bottom: -260px; }
.map-frame  iframe { border: none }
.footer { position: relative; padding: 300px 0 30px; background: url("assets/img/footer_bg.svg") top center no-repeat; background-size: cover; z-index: 10; }
.copyright { margin-top: 50px; }
.footer-block { text-align: center; }
.phone,.whatsapp {position: relative; padding-left: 30px; }
.phone:before { position: absolute; content: ''; width: 20px; height: 20px; top: 0; left: 0; background: url("assets/img/phone-icon.svg") center no-repeat; background-size: contain; }
.whatsapp:before { position: absolute; content: ''; width: 20px; height: 20px; top: 0; left: 0; background: url("assets/img/whatsapp-icon.svg") center no-repeat; background-size: contain; }
.social-footer { text-align: right; }
.address { text-align: left; }
.product-container,.news-container { margin-left: 15px; margin-right: 15px; border-radius: 20px; overflow: hidden; position: relative; height: 500px; margin-bottom: 30px; background-size: contain; }
.product-content,.news-content { position: absolute; width: 100%; height: 200px; bottom: 0; background: url("assets/img/assets_04.svg") top center no-repeat; background-size: cover; padding: 20px; }
.img-rounded { border-radius:15px !important; }
.news-content { height: 290px; background: url("assets/img/assets_04.svg") top center no-repeat; background-size: cover; }
.news-content h4 { font-size: 20px; }
.btn-archive,.btn-submit { line-height: 40px; background: #4ab8aa; font-weight: 500; color: #fff; padding: 0 30px; border-radius: 20px; margin: 0 15px; }
.btn-submit { line-height: 50px; margin: 0; border-radius: 25px; padding: 0 60px; }
.wa-call { position: fixed; bottom: 20px; right: 20px; width: 60px; height: 60px; z-index: 100; }
.img-rounded { border-radius: 30px }
.post-nav a { color: #4ab8aa; cursor: pointer; font-size: 16px; }

.wp-block-gallery { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: center; margin-left: -15px; margin-right: -15px; }
.wp-block-gallery .wp-block-image { width: auto; height: auto; margin: 15px; }

.MultiCarousel { float: left; overflow: hidden; padding: 15px; width: 100%; position:relative; }
.MultiCarousel .MultiCarousel-inner { transition: 1s ease all; float: left; }
.MultiCarousel .MultiCarousel-inner .item { float: left;}
.MultiCarousel .MultiCarousel-inner .item > div { padding:10px; margin:10px; }
.MultiCarousel .leftLst, .MultiCarousel .rightLst { width: 40px; height: 40px; position:absolute; border-radius:50%;top:calc(50% - 20px); }
.MultiCarousel .leftLst { left:0; }
.MultiCarousel .rightLst { right:0; }
.MultiCarousel .leftLst.over, .MultiCarousel .rightLst.over { pointer-events: none; background:#ccc; }
.MultiCarousel .btn-primary {background: #4ab8aa; border: none;}

.ngg-3-columns { padding: 15px 35px; border-radius: 20px !important;}
.ngg-2-columns,.ngg-5-columns { padding: 15px; border-radius: 20px !important;}
.ngg-gallery-thumbnail { max-height: 500px !important; border-radius: 20px !important; overflow: hidden; }
.ngg-gallery-thumbnail img { border-radius: 20px !important; }
.ngg-galleryoverview { text-align: center; }

@media (max-width: 991.98px) {
	h2 { font-size: 40px; }
	.navbar {padding: 15px 0; }
	.navbar-brand { width: 54px; height: 70px; margin-left: 15px; }
	.navbar-collapse {margin-top: 15px;background: #fff;}
	.navbar-collapse .nav-link{padding: 10px 20px;color: #666}
	.navbar-nav .btn { border-radius: 0; text-align: left;border:none;}
	.navbar-toggler,.navbar-toggler:focus{border:none; box-shadow: 0 0 0; }
	.dropdown-menu {padding: 0 40px;}
	.social { display: none }
	.hero-content {left: 30px; bottom: 320px; }
	.hero-content h1 { font-size: 48px; line-height: 48px; }
	.block { padding: 60px 15px }
	blockquote { font-size: 24px; padding-left: 80px; margin-bottom: 60px; }
	blockquote:before { width: 60px; height: 56px; }
	.social-footer,.address { text-align: center; }
	.page-heading { padding-left: 30px; padding-right: 30px; }
	.page-heading h1,.page-heading h2 { font-size: 40px; }
	.circular-item,.circular-content { padding: 40px; }
	.pillar {padding-bottom: 180px; }
	.copyright {text-align: center;}
	.footer { padding-top: 340px; background-position: top left no-repeat; }
	.page-heading {margin-bottom: -120px;}
	.subtitle h1,.subtitle h2 {font-size: 30px}
	.page-heading h2 {font-size: 36px}
	.maps { padding-left: 0; padding-right: 0; }
	.map-frame { margin-bottom: -340px; }
	.icon { min-width: 60px; height: 60px; }
	.wp-block-gallery { display: block }
	.product-container,.news-container { height: 400px; }
	.ngg-3-columns { padding: 15px 10px; border-radius: 20px !important;}
}

.bird{ background-image: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/174479/bird-cells-new.svg'); filter: invert(34%) sepia(55%) saturate(427%) hue-rotate(141deg) brightness(93%) contrast(91%); background-size: auto 100%; width: 88px; height: 125px; will-change: background-position; animation-name: fly-cycle; animation-timing-function: steps(10); animation-iteration-count: infinite; }
.bird-one{ animation-duration: 1s; animation-delay: -0.5s; }
.bird-two{ animation-duration: 0.9s; animation-delay: -0.75s; }
.bird-three{ animation-duration:1.25s; animation-delay: -0.25s; }
.bird-four{ animation-duration: 1.1s; animation-delay: -0.5s; }
.bird-container { position: absolute; top: 20%; left: -3%; transform: scale(0) translateX(-10vw); will-change: transform; animation-name: fly-right-one; animation-timing-function: linear; animation-iteration-count: infinite; }
.bird-container-one{ animation-duration: 15s; animation-delay: 0; }
.bird-container-two{ animation-duration: 16s; animation-delay: 1s; }
.bird-container-three{ animation-duration: 14.6s; animation-delay: 9.5s; }
.bird-container-four { animation-duration: 16s; animation-delay: 10.25s; }
@keyframes fly-cycle {
100% { background-position: -900px 0; } 
}

@keyframes fly-right-one {
0% {transform: scale(0.3) translateX(-10vw);}
10% {transform: translateY(2vh) translateX(10vw) scale(0.4);}
20% {transform: translateY(0vh) translateX(30vw) scale(0.5);}
30% {transform: translateY(4vh) translateX(50vw) scale(0.6);}
40% {transform: translateY(2vh) translateX(70vw) scale(0.6);}
50% {transform: translateY(0vh) translateX(90vw) scale(0.6);}
60% {transform: translateY(0vh) translateX(110vw) scale(0.6);}
100% {transform: translateY(0vh) translateX(110vw) scale(0.6);}
}

@keyframes fly-right-two {
0% {transform: translateY(-2vh) translateX(-10vw) scale(0.5);}
10% {transform: translateY(0vh) translateX(10vw) scale(0.4);}
20% {transform: translateY(-4vh) translateX(30vw) scale(0.6);}
30% {transform: translateY(1vh) translateX(50vw) scale(0.45);}
40% {transform: translateY(-2.5vh) translateX(70vw) scale(0.5);}
50% {transform: translateY(0vh) translateX(90vw) scale(0.45);}
51% { transform: translateY(0vh) translateX(110vw) scale(0.45);}
100% {transform: translateY(0vh) translateX(110vw) scale(0.45);}
}
