Add files via upload

2022-11-20 23:31:05 +07:00 · 2022-11-20 23:31:05 +07:00 · 352cb5b0ae
commit 352cb5b0ae
parent c82ddeb876
48 changed files with 50544 additions and 0 deletions
--- a/css/bootstrap.min.css
+++ b/css/bootstrap.min.css
--- a/css/css-animate.css
+++ b/css/css-animate.css
--- a/css/css-bootstrap.css
+++ b/css/css-bootstrap.css
--- a/css/css-icomoon.css
+++ b/css/css-icomoon.css
--- a/css/css-magnific-popup.css
+++ b/css/css-magnific-popup.css
@ -0,0 +1,368 @@
+/* Magnific Popup CSS */
+.mfp-bg {
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 1042;
+  overflow: hidden;
+  position: fixed;
+  background: #0b0b0b;
+  opacity: 0.8;
+  filter: alpha(opacity=80); }
+
+.mfp-wrap {
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 1043;
+  position: fixed;
+  outline: none !important;
+  -webkit-backface-visibility: hidden; }
+
+.mfp-container {
+  text-align: center;
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  left: 0;
+  top: 0;
+  padding: 0 8px;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box; }
+
+.mfp-container:before {
+  content: '';
+  display: inline-block;
+  height: 100%;
+  vertical-align: middle; }
+
+.mfp-align-top .mfp-container:before {
+  display: none; }
+
+.mfp-content {
+  position: relative;
+  display: inline-block;
+  vertical-align: middle;
+  margin: 0 auto;
+  text-align: left;
+  z-index: 1045; }
+
+.mfp-inline-holder .mfp-content, .mfp-ajax-holder .mfp-content {
+  width: 100%;
+  cursor: auto; }
+
+.mfp-ajax-cur {
+  cursor: progress; }
+
+.mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close {
+  cursor: -moz-zoom-out;
+  cursor: -webkit-zoom-out;
+  cursor: zoom-out; }
+
+.mfp-zoom {
+  cursor: pointer;
+  cursor: -webkit-zoom-in;
+  cursor: -moz-zoom-in;
+  cursor: zoom-in; }
+
+.mfp-auto-cursor .mfp-content {
+  cursor: auto; }
+
+.mfp-close, .mfp-arrow, .mfp-preloader, .mfp-counter {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  user-select: none; }
+
+.mfp-loading.mfp-figure {
+  display: none; }
+
+.mfp-hide {
+  display: none !important; }
+
+.mfp-preloader {
+  color: #cccccc;
+  position: absolute;
+  top: 50%;
+  width: auto;
+  text-align: center;
+  margin-top: -0.8em;
+  left: 8px;
+  right: 8px;
+  z-index: 1044; }
+  .mfp-preloader a {
+    color: #cccccc; }
+    .mfp-preloader a:hover {
+      color: white; }
+
+.mfp-s-ready .mfp-preloader {
+  display: none; }
+
+.mfp-s-error .mfp-content {
+  display: none; }
+
+button.mfp-close, button.mfp-arrow {
+  overflow: visible;
+  cursor: pointer;
+  background: transparent;
+  border: 0;
+  -webkit-appearance: none;
+  display: block;
+  outline: none;
+  padding: 0;
+  z-index: 1046;
+  -webkit-box-shadow: none;
+  box-shadow: none; }
+button::-moz-focus-inner {
+  padding: 0;
+  border: 0; }
+
+.mfp-close {
+  width: 44px;
+  height: 44px;
+  line-height: 44px;
+  position: absolute;
+  right: 0;
+  top: 0;
+  text-decoration: none;
+  text-align: center;
+  opacity: 0.65;
+  filter: alpha(opacity=65);
+  padding: 0 0 18px 10px;
+  color: white;
+  font-style: normal;
+  font-size: 28px;
+  font-family: Arial, Baskerville, monospace; }
+  .mfp-close:hover, .mfp-close:focus {
+    opacity: 1;
+    filter: alpha(opacity=100); }
+  .mfp-close:active {
+    top: 1px; }
+
+.mfp-close-btn-in .mfp-close {
+  color: #333333; }
+
+.mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close {
+  color: white;
+  right: -6px;
+  text-align: right;
+  padding-right: 6px;
+  width: 100%; }
+
+.mfp-counter {
+  position: absolute;
+  top: 0;
+  right: 0;
+  color: #cccccc;
+  font-size: 12px;
+  line-height: 18px; }
+
+.mfp-arrow {
+  position: absolute;
+  opacity: 0.65;
+  filter: alpha(opacity=65);
+  margin: 0;
+  top: 50%;
+  margin-top: -55px;
+  padding: 0;
+  width: 90px;
+  height: 110px;
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
+  .mfp-arrow:active {
+    margin-top: -54px; }
+  .mfp-arrow:hover, .mfp-arrow:focus {
+    opacity: 1;
+    filter: alpha(opacity=100); }
+  .mfp-arrow:before, .mfp-arrow:after, .mfp-arrow .mfp-b, .mfp-arrow .mfp-a {
+    content: '';
+    display: block;
+    width: 0;
+    height: 0;
+    position: absolute;
+    left: 0;
+    top: 0;
+    margin-top: 35px;
+    margin-left: 35px;
+    border: medium inset transparent; }
+  .mfp-arrow:after, .mfp-arrow .mfp-a {
+    border-top-width: 13px;
+    border-bottom-width: 13px;
+    top: 8px; }
+  .mfp-arrow:before, .mfp-arrow .mfp-b {
+    border-top-width: 21px;
+    border-bottom-width: 21px;
+    opacity: 0.7; }
+
+.mfp-arrow-left {
+  left: 0; }
+  .mfp-arrow-left:after, .mfp-arrow-left .mfp-a {
+    border-right: 17px solid white;
+    margin-left: 31px; }
+  .mfp-arrow-left:before, .mfp-arrow-left .mfp-b {
+    margin-left: 25px;
+    border-right: 27px solid #3f3f3f; }
+
+.mfp-arrow-right {
+  right: 0; }
+  .mfp-arrow-right:after, .mfp-arrow-right .mfp-a {
+    border-left: 17px solid white;
+    margin-left: 39px; }
+  .mfp-arrow-right:before, .mfp-arrow-right .mfp-b {
+    border-left: 27px solid #3f3f3f; }
+
+.mfp-iframe-holder {
+  padding-top: 40px;
+  padding-bottom: 40px; }
+  .mfp-iframe-holder .mfp-content {
+    line-height: 0;
+    width: 100%;
+    max-width: 900px; }
+  .mfp-iframe-holder .mfp-close {
+    top: -40px; }
+
+.mfp-iframe-scaler {
+  width: 100%;
+  height: 0;
+  overflow: hidden;
+  padding-top: 56.25%; }
+  .mfp-iframe-scaler iframe {
+    position: absolute;
+    display: block;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
+    background: black; }
+
+/* Main image in popup */
+img.mfp-img {
+  width: auto;
+  max-width: 100%;
+  height: auto;
+  display: block;
+  line-height: 0;
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+  padding: 40px 0 40px;
+  margin: 0 auto; }
+
+/* The shadow behind the image */
+.mfp-figure {
+  line-height: 0; }
+  .mfp-figure:after {
+    content: '';
+    position: absolute;
+    left: 0;
+    top: 40px;
+    bottom: 40px;
+    display: block;
+    right: 0;
+    width: auto;
+    height: auto;
+    z-index: -1;
+    box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
+    background: #444444; }
+  .mfp-figure small {
+    color: #bdbdbd;
+    display: block;
+    font-size: 12px;
+    line-height: 14px; }
+  .mfp-figure figure {
+    margin: 0; }
+
+.mfp-bottom-bar {
+  margin-top: -36px;
+  position: absolute;
+  top: 100%;
+  left: 0;
+  width: 100%;
+  cursor: auto; }
+
+.mfp-title {
+  text-align: left;
+  line-height: 18px;
+  color: #f3f3f3;
+  word-wrap: break-word;
+  padding-right: 36px; }
+
+.mfp-image-holder .mfp-content {
+  max-width: 100%; }
+
+.mfp-gallery .mfp-image-holder .mfp-figure {
+  cursor: pointer; }
+
+@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
+  /**
+       * Remove all paddings around the image on small screen
+       */
+  .mfp-img-mobile .mfp-image-holder {
+    padding-left: 0;
+    padding-right: 0; }
+  .mfp-img-mobile img.mfp-img {
+    padding: 0; }
+  .mfp-img-mobile .mfp-figure:after {
+    top: 0;
+    bottom: 0; }
+  .mfp-img-mobile .mfp-figure small {
+    display: inline;
+    margin-left: 5px; }
+  .mfp-img-mobile .mfp-bottom-bar {
+    background: rgba(0, 0, 0, 0.6);
+    bottom: 0;
+    margin: 0;
+    top: auto;
+    padding: 3px 5px;
+    position: fixed;
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box; }
+    .mfp-img-mobile .mfp-bottom-bar:empty {
+      padding: 0; }
+  .mfp-img-mobile .mfp-counter {
+    right: 5px;
+    top: 3px; }
+  .mfp-img-mobile .mfp-close {
+    top: 0;
+    right: 0;
+    width: 35px;
+    height: 35px;
+    line-height: 35px;
+    background: rgba(0, 0, 0, 0.6);
+    position: fixed;
+    text-align: center;
+    padding: 0; } }
+
+@media all and (max-width: 900px) {
+  .mfp-arrow {
+    -webkit-transform: scale(0.75);
+    transform: scale(0.75); }
+  .mfp-arrow-left {
+    -webkit-transform-origin: 0;
+    transform-origin: 0; }
+  .mfp-arrow-right {
+    -webkit-transform-origin: 100%;
+    transform-origin: 100%; }
+  .mfp-container {
+    padding-left: 6px;
+    padding-right: 6px; } }
+
+.mfp-ie7 .mfp-img {
+  padding: 0; }
+.mfp-ie7 .mfp-bottom-bar {
+  width: 600px;
+  left: 50%;
+  margin-left: -300px;
+  margin-top: 5px;
+  padding-bottom: 5px; }
+.mfp-ie7 .mfp-container {
+  padding: 0; }
+.mfp-ie7 .mfp-content {
+  padding-top: 44px; }
+.mfp-ie7 .mfp-close {
+  top: 0;
+  right: 0;
+  padding-top: 0; }
--- a/css/css-owl.carousel.min.css
+++ b/css/css-owl.carousel.min.css
@ -0,0 +1 @@
+.owl-carousel .animated{-webkit-animation-duration:1000ms;animation-duration:1000ms;-webkit-animation-fill-mode:both;animation-fill-mode:both}.owl-carousel .owl-animated-in{z-index:0}.owl-carousel .owl-animated-out{z-index:1}.owl-carousel .fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut}@-webkit-keyframes fadeOut{0%{opacity:1}100%{opacity:0}}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.owl-height{-webkit-transition:height 500ms ease-in-out;-moz-transition:height 500ms ease-in-out;-ms-transition:height 500ms ease-in-out;-o-transition:height 500ms ease-in-out;transition:height 500ms ease-in-out}.owl-carousel{display:none;width:100%;-webkit-tap-highlight-color:transparent;position:relative;z-index:1}.owl-carousel .owl-stage{position:relative;-ms-touch-action:pan-Y}.owl-carousel .owl-stage:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}.owl-carousel .owl-stage-outer{position:relative;overflow:hidden;-webkit-transform:translate3d(0px,0,0)}.owl-carousel .owl-controls .owl-dot,.owl-carousel .owl-controls .owl-nav .owl-next,.owl-carousel .owl-controls .owl-nav .owl-prev{cursor:pointer;cursor:hand;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-loaded{display:block}.owl-carousel.owl-loading{opacity:0;display:block}.owl-carousel.owl-hidden{opacity:0}.owl-carousel .owl-refresh .owl-item{display:none}.owl-carousel .owl-item{position:relative;min-height:1px;float:left;-webkit-backface-visibility:hidden;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel .owl-item img{display:block;width:100%;-webkit-transform-style:preserve-3d}.owl-carousel.owl-text-select-on .owl-item{-webkit-user-select:auto;-moz-user-select:auto;-ms-user-select:auto;user-select:auto}.owl-carousel .owl-grab{cursor:move;cursor:-webkit-grab;cursor:-o-grab;cursor:-ms-grab;cursor:grab}.owl-carousel.owl-rtl{direction:rtl}.owl-carousel.owl-rtl .owl-item{float:right}.no-js .owl-carousel{display:block}.owl-carousel .owl-item .owl-lazy{opacity:0;-webkit-transition:opacity 400ms ease;-moz-transition:opacity 400ms ease;-ms-transition:opacity 400ms ease;-o-transition:opacity 400ms ease;transition:opacity 400ms ease}.owl-carousel .owl-item img{transform-style:preserve-3d}.owl-carousel .owl-video-wrapper{position:relative;height:100%;background:#000}.owl-carousel .owl-video-play-icon{position:absolute;height:80px;width:80px;left:50%;top:50%;margin-left:-40px;margin-top:-40px;background:url(../images/css-owl.video.play.png) no-repeat;cursor:pointer;z-index:1;-webkit-backface-visibility:hidden;-webkit-transition:scale 100ms ease;-moz-transition:scale 100ms ease;-ms-transition:scale 100ms ease;-o-transition:scale 100ms ease;transition:scale 100ms ease}.owl-carousel .owl-video-play-icon:hover{-webkit-transition:scale(1.3,1.3);-moz-transition:scale(1.3,1.3);-ms-transition:scale(1.3,1.3);-o-transition:scale(1.3,1.3);transition:scale(1.3,1.3)}.owl-carousel .owl-video-playing .owl-video-play-icon,.owl-carousel .owl-video-playing .owl-video-tn{display:none}.owl-carousel .owl-video-tn{opacity:0;height:100%;background-position:center center;background-repeat:no-repeat;-webkit-background-size:contain;-moz-background-size:contain;-o-background-size:contain;background-size:contain;-webkit-transition:opacity 400ms ease;-moz-transition:opacity 400ms ease;-ms-transition:opacity 400ms ease;-o-transition:opacity 400ms ease;transition:opacity 400ms ease}.owl-carousel .owl-video-frame{position:relative;z-index:1}
--- a/css/css-owl.theme.default.min.css
+++ b/css/css-owl.theme.default.min.css
@ -0,0 +1 @@
+.owl-theme .owl-controls{margin-top:10px;text-align:center;-webkit-tap-highlight-color:transparent}.owl-theme .owl-controls .owl-nav [class*=owl-]{color:#fff;font-size:14px;margin:5px;padding:4px 7px;background:#d6d6d6;display:inline-block;cursor:pointer;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px}.owl-theme .owl-controls .owl-nav [class*=owl-]:hover{background:#869791;color:#fff;text-decoration:none}.owl-theme .owl-controls .owl-nav .disabled{opacity:.5;cursor:default}.owl-theme .owl-dots .owl-dot{display:inline-block;zoom:1;*display:inline}.owl-theme .owl-dots .owl-dot span{width:10px;height:10px;margin:5px 7px;background:#d6d6d6;display:block;-webkit-backface-visibility:visible;-webkit-transition:opacity 200ms ease;-moz-transition:opacity 200ms ease;-ms-transition:opacity 200ms ease;-o-transition:opacity 200ms ease;transition:opacity 200ms ease;-webkit-border-radius:30px;-moz-border-radius:30px;border-radius:30px}.owl-theme .owl-dots .owl-dot.active span,.owl-theme .owl-dots .owl-dot:hover span{background:#869791}
--- a/css/css-style.css
+++ b/css/css-style.css
--- a/css/ket.css
+++ b/css/ket.css
@ -0,0 +1,560 @@
+.timeline-img {
+	width: 100%;
+	height: 250px;
+	object-fit: cover;
+	object-position: center;
+	margin-bottom: 10px;
+	border-radius: 10px;
+	background-color: #304058;
+}
+
+footer {
+	width: 100%;
+	height: 10vh;
+	color: #fff;
+	display: flex;
+	padding-top: 20px;
+	text-align: center;
+	align-items: center;
+	justify-content: center;
+	background-color: #304058;
+}
+
+footer p {
+	font-family: sans-serif;
+}
+
+/*========== MENU UCAPAN =============*/
+#konten {
+	display: flex;
+	flex-grow: 1;
+	flex-direction: row;
+	background: #e7e7e7;
+}
+
+.konten {
+	text-align: center;
+	background-size: contain;
+	background-position: center;
+	flex: 1;
+}
+
+#ucapan-konten {
+	margin: 10px 25px;
+}
+
+.ucapan-field {
+	max-width: 500px;
+	margin-left: auto;
+	margin-right: auto;
+}
+
+.komen-netizen {
+	margin-bottom: 15px;
+	margin-top: 15px;
+	max-width: 500px;
+	margin-left: auto;
+	margin-right: auto;
+}
+
+.komen {
+	display: none;
+	padding: 10px;
+	margin-left: -15px;
+	margin-right: -15px;
+	margin-bottom: 10px;
+	background-color: #f1f1f1;
+}
+
+.komen2 {
+	display: none;
+	padding: 10px;
+	margin-left: -15px;
+	margin-right: -15px;
+	margin-bottom: 10px;
+	background-color: #f1f1f1;
+}
+
+#submitKomen {
+	margin-top: 15px;
+	padding: 5px;
+	text-align: center;
+	background-color: #d1d1d1;
+	color: #16212a;
+	border-width: 1px;
+	border-style: solid;
+	border-color: #3e393c;
+	/*box-shadow: 0 1px 1px #ccc;*/
+	transition: all 600ms ease-in-out;
+	-webkit-transition: all 600ms ease-in-out;
+	-moz-transition: all 600ms ease-in-out;
+	-o-transition: all 600ms ease-in-out;
+}
+
+#submitKomen:hover {
+	background-color: #fff;
+	color: #3e393c;
+}
+
+#loadMore {
+	margin-bottom: 10px;
+	margin-top: 15px;
+	padding: 5px;
+	text-align: center;
+	background-color: #d1d1d1;
+	color: #16212a;
+	border-width: 1px;
+	border-style: solid;
+	border-color: #16212a;
+	/*box-shadow: 0 1px 1px #ccc;*/
+	transition: all 600ms ease-in-out;
+	-webkit-transition: all 600ms ease-in-out;
+	-moz-transition: all 600ms ease-in-out;
+	-o-transition: all 600ms ease-in-out;
+}
+
+#loadMore:hover {
+	background-color: #ffffff;
+	color: #16212a;
+}
+
+.komen-nama {
+	color: #16212a;
+	font-weight: bold;
+}
+
+.komen-isi {
+	/*color: #000000;*/
+
+}
+
+.ucapan-field {}
+
+@media (max-width: 300px) {
+	footer p {
+		font-size: .9rem;
+	}
+}
+
+@media (max-width: 575.98px) {
+
+
+	object {
+		width: 100%;
+		height: 350px;
+	}
+
+	.videoWrapper {
+		height: 350px;
+	}
+
+	footer p {
+		font-size: 1.2rem;
+	}
+
+}
+
+
+@media (min-width: 576px) {
+
+	object {
+		width: 100%;
+		height: 350px;
+	}
+
+	.videoWrapper {
+		height: 350px;
+	}
+}
+
+@media (min-width: 768px) {
+
+	object {
+		width: 100%;
+		height: 450px;
+	}
+
+	.videoWrapper {
+		height: 450px;
+	}
+}
+
+@media (min-width: 992px) {
+
+	object {
+		width: 100%;
+		height: 500px;
+	}
+
+	.videoWrapper {
+		height: 500px;
+	}
+}
+
+/* SPLASHSCREEN */
+#splashscreen {
+	position: absolute;
+	top: 0;
+	left: 0;
+	bottom: 0;
+	width: 100%;
+	background: #053742;
+
+}
+
+.splashscreen-bg {
+
+	/* The image used */
+	background-image: url("https://www.makenewstory.com/assets/users/mIjh78y8ge13b89d99c1a29132e57d2ca/album1.png?nocache=1440");
+
+	/* Full height */
+	height: 100%;
+
+	/* Center and scale the image nicely */
+	background-position: center;
+	background-repeat: no-repeat;
+	background-size: cover;
+	opacity: 0.2;
+	-webkit-filter: blur(4px);
+}
+
+.tengah {
+	margin: 0;
+	text-align: center;
+	position: absolute;
+	top: 50%;
+	left: 50%;
+	margin-right: -50%;
+	transform: translate(-50%, -50%);
+	color: #fff;
+}
+
+/* END OF SPLASHSCREEN */
+
+/* MUTE BUTTON */
+
+.floatmute {
+	position: fixed;
+	width: 40px;
+	height: 40px;
+	top: 25px;
+	right: 25px;
+	color: #FFF;
+	border-radius: 50px;
+	text-align: center;
+	background: rgba(0, 0, 0, 0.5);
+	font-size: 20px;
+	z-index: 100;
+}
+
+.my-float {
+	margin-top: 10px;
+}
+
+/* END MUTE BUTTON */
+
+/* GIFT BUTTON */
+.floatgift {
+	position: fixed;
+	width: 40px;
+	height: 40px;
+	top: 25px;
+	left: 25px;
+	color: #FFF;
+	/* border-radius:50px; */
+	text-align: center;
+	/* background:rgba(0, 0, 0, 0.5); */
+	/* font-size:20px; */
+	z-index: 100;
+}
+
+.mdc-button {
+	width: 146px;
+	font-size: 12px;
+}
+
+.mdc-button.mdc-button--raised {
+	background: rgba(0, 0, 0, 0.5);
+}
+
+
+.streaming.mdc-button {
+	width: 186px;
+	font-size: 12px;
+	margin-top: 10px;
+	margin-bottom: -10px;
+}
+
+.streaming.mdc-button.mdc-button--raised {
+	background: #304058;
+}
+
+.material-icons.mdc-button__icon {
+	display: inline-flex;
+	width: 15px;
+	height: 15px;
+	font-size: 15px;
+	vertical-align: middle;
+	margin-right: 8px;
+}
+
+.giftfloat {
+	margin-top: 10px;
+}
+
+/* END GIFT BUTTON */
+/* STYLE GIFT INPUT */
+
+.file-upload {
+	display: block;
+	text-align: center;
+	font-family: Helvetica, Arial, sans-serif;
+	font-size: 12px;
+}
+
+.file-upload .file-select {
+	display: block;
+	border: 2px solid #dce4ec;
+	color: #34495e;
+	cursor: pointer;
+	height: 40.4px;
+	line-height: 40px;
+	text-align: left;
+	background: #FFFFFF;
+	overflow: hidden;
+	position: relative;
+}
+
+.file-upload .file-select .file-select-button {
+	background: #dce4ec;
+	padding: 0 10px;
+	display: inline-block;
+	height: 40px;
+	line-height: 40px;
+}
+
+.file-upload .file-select .file-select-name {
+	line-height: 40px;
+	display: inline-block;
+	padding: 0 10px;
+}
+
+.file-upload .file-select:hover {
+	border-color: #34495e;
+	transition: all .2s ease-in-out;
+	-moz-transition: all .2s ease-in-out;
+	-webkit-transition: all .2s ease-in-out;
+	-o-transition: all .2s ease-in-out;
+}
+
+.file-upload .file-select:hover .file-select-button {
+	background: #34495e;
+	color: #FFFFFF;
+	transition: all .2s ease-in-out;
+	-moz-transition: all .2s ease-in-out;
+	-webkit-transition: all .2s ease-in-out;
+	-o-transition: all .2s ease-in-out;
+}
+
+.file-upload.active .file-select {
+	border-color: #3fa46a;
+	transition: all .2s ease-in-out;
+	-moz-transition: all .2s ease-in-out;
+	-webkit-transition: all .2s ease-in-out;
+	-o-transition: all .2s ease-in-out;
+}
+
+.file-upload.active .file-select .file-select-button {
+	background: #3fa46a;
+	color: #FFFFFF;
+	transition: all .2s ease-in-out;
+	-moz-transition: all .2s ease-in-out;
+	-webkit-transition: all .2s ease-in-out;
+	-o-transition: all .2s ease-in-out;
+}
+
+.file-upload .file-select input[type=file] {
+	z-index: 100;
+	cursor: pointer;
+	position: absolute;
+	height: 100%;
+	width: 100%;
+	top: 0;
+	left: 0;
+	opacity: 0;
+	filter: alpha(opacity=0);
+}
+
+.file-upload .file-select.file-select-disabled {
+	opacity: 0.65;
+}
+
+.file-upload .file-select.file-select-disabled:hover {
+	cursor: default;
+	display: block;
+	border: 2px solid #dce4ec;
+	color: #34495e;
+	cursor: pointer;
+	height: 40px;
+	line-height: 40px;
+	margin-top: 5px;
+	text-align: left;
+	background: #FFFFFF;
+	overflow: hidden;
+	position: relative;
+}
+
+.file-upload .file-select.file-select-disabled:hover .file-select-button {
+	background: #dce4ec;
+	color: #666666;
+	padding: 0 10px;
+	display: inline-block;
+	height: 40px;
+	line-height: 40px;
+}
+
+.file-upload .file-select.file-select-disabled:hover .file-select-name {
+	line-height: 40px;
+	display: inline-block;
+	padding: 0 10px;
+}
+
+/* END STYLE GIFT INPUT */
+/* NAVIGASI */
+.navigasi {
+	position: fixed;
+	bottom: 0;
+	width: 100%;
+	height: 55px;
+	box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
+	background: rgba(0, 0, 0, 0.5);
+	display: flex;
+	overflow-x: auto;
+}
+
+.navigasi__link {
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	justify-content: center;
+	flex-grow: 1;
+	min-width: 50px;
+	overflow: hidden;
+	white-space: nowrap;
+	font-family: sans-serif;
+	font-size: 13px;
+	color: #fff;
+	text-decoration: none;
+	-webkit-tap-highlight-color: transparent;
+	transition: background-color 0.1s ease-in-out;
+}
+
+.navigasi__link:hover {
+	background: rgba(127, 140, 141, 0.5);
+}
+
+.navigasi__link--active {
+	color: #009578;
+}
+
+.navigasi__icon {
+	font-size: 18px;
+}
+
+/* END NAVIGASI */
+
+/* SKROLL BUTTON ANIMATED */
+.icon-scroll,
+.icon-scroll:before {
+	position: absolute;
+	left: 50%;
+}
+
+.icon-scroll {
+	width: 30px;
+	height: 50px;
+	margin-left: -20px;
+	box-shadow: inset 0 0 0 1px #fff;
+	border-radius: 25px;
+}
+
+.icon-scroll:before {
+	content: '';
+	width: 8px;
+	height: 8px;
+	background: #fff;
+	margin-left: -4px;
+	top: 8px;
+	border-radius: 4px;
+	animation-duration: 1.5s;
+	animation-iteration-count: infinite;
+	animation-name: scroll;
+}
+
+@-moz-keyframes scroll {
+	0% {
+		opacity: 1;
+	}
+
+	100% {
+		opacity: 0;
+		transform: translateY(46px);
+	}
+}
+
+@-webkit-keyframes scroll {
+	0% {
+		opacity: 1;
+	}
+
+	100% {
+		opacity: 0;
+		transform: translateY(46px);
+	}
+}
+
+@-o-keyframes scroll {
+	0% {
+		opacity: 1;
+	}
+
+	100% {
+		opacity: 0;
+		transform: translateY(46px);
+	}
+}
+
+@keyframes scroll {
+	0% {
+		opacity: 1;
+	}
+
+	100% {
+		opacity: 0;
+		transform: translateY(25px);
+	}
+}
+
+/* END ANIMATED BUTTON SCROLL */
+
+/* KEHADIRAN */
+.Akan.Hadir {
+	background: #304058;
+	color: #fff;
+}
+
+.Berhalangan.Hadir {
+	background: #304058;
+	color: #ECD662;
+}
+
+/* END KEHADIRAN */
+
+
+/* VALIDASI */
+.isidulu {
+	box-shadow: 0 0 5px rgba(240, 52, 52, 1);
+	border: 1px solid rgba(240, 52, 52, 1);
+}
+
+/* END VALIDASI */
--- a/css/ket2.css
+++ b/css/ket2.css
@ -0,0 +1,56 @@
+* {
+	scroll-behavior: smooth;
+}
+
+#fh5co-header {
+	/* The image used */
+	background-image: url("../img/album1.png");
+	height: 100vh;
+	/* Center and scale the image nicely */
+	/* background-attachment: fixed; */
+	background-position: center;
+	background-repeat: no-repeat;
+	background-size: cover;
+}
+
+.paralax-acara {
+	/* The image used */
+	background-image: url("../img/album2.png");
+	height: 100vh;
+	/* Center and scale the image nicely */
+	/* background-attachment: fixed; */
+	background-position: center;
+	background-repeat: no-repeat;
+	background-size: cover;
+}
+
+.float {
+	position: fixed;
+	width: 50px;
+	height: 50px;
+	bottom: 95px;
+	right: 20px;
+	background-color: #304058;
+	opacity: 0.5;
+	color: #FFF;
+	border-radius: 50px;
+	text-align: center;
+	padding-top: 9px;
+	z-index: 1;
+}
+
+.videoWrapper {
+	position: relative;
+	padding-bottom: 56.25%;
+	/* 16:9 */
+	padding-top: 25px;
+	height: 0;
+}
+
+.videoWrapper iframe {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+}
--- a/css/lightbox.css
+++ b/css/lightbox.css
@ -0,0 +1,204 @@
+body.lb-disable-scrolling {
+  overflow: hidden;
+}
+
+.lightboxOverlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 9999;
+  background-color: black;
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
+  opacity: 0.8;
+  display: none;
+}
+
+.lightbox {
+  position: absolute;
+  left: 0;
+  width: 100%;
+  z-index: 10000;
+  text-align: center;
+  line-height: 0;
+  font-weight: normal;
+  outline: none;
+}
+
+.lightbox .lb-image {
+  display: block;
+  height: auto;
+  max-width: inherit;
+  max-height: none;
+  border-radius: 3px;
+
+  /* Image border */
+  border: 4px solid white;
+}
+
+.lightbox a img {
+  border: none;
+}
+
+.lb-outerContainer {
+  position: relative;
+  *zoom: 1;
+  width: 250px;
+  height: 250px;
+  margin: 0 auto;
+  border-radius: 4px;
+
+  /* Background color behind image.
+     This is visible during transitions. */
+  background-color: white;
+}
+
+.lb-outerContainer:after {
+  content: "";
+  display: table;
+  clear: both;
+}
+
+.lb-loader {
+  position: absolute;
+  top: 43%;
+  left: 0;
+  height: 25%;
+  width: 100%;
+  text-align: center;
+  line-height: 0;
+}
+
+.lb-cancel {
+  display: block;
+  width: 32px;
+  height: 32px;
+  margin: 0 auto;
+  background: url(../images/loading.gif) no-repeat;
+}
+
+.lb-nav {
+  position: absolute;
+  top: 0;
+  left: 0;
+  height: 100%;
+  width: 100%;
+  z-index: 10;
+}
+
+.lb-container > .nav {
+  left: 0;
+}
+
+.lb-nav a {
+  outline: none;
+  background-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');
+}
+
+.lb-prev, .lb-next {
+  height: 100%;
+  cursor: pointer;
+  display: block;
+}
+
+.lb-nav a.lb-prev {
+  width: 34%;
+  left: 0;
+  float: left;
+  background: url(../images/prev.png) left 48% no-repeat;
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
+  opacity: 0;
+  -webkit-transition: opacity 0.6s;
+  -moz-transition: opacity 0.6s;
+  -o-transition: opacity 0.6s;
+  transition: opacity 0.6s;
+}
+
+.lb-nav a.lb-prev:hover {
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
+  opacity: 1;
+}
+
+.lb-nav a.lb-next {
+  width: 64%;
+  right: 0;
+  float: right;
+  background: url(../images/next.png) right 48% no-repeat;
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
+  opacity: 0;
+  -webkit-transition: opacity 0.6s;
+  -moz-transition: opacity 0.6s;
+  -o-transition: opacity 0.6s;
+  transition: opacity 0.6s;
+}
+
+.lb-nav a.lb-next:hover {
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
+  opacity: 1;
+}
+
+.lb-dataContainer {
+  margin: 0 auto;
+  padding-top: 5px;
+  *zoom: 1;
+  width: 100%;
+  border-bottom-left-radius: 4px;
+  border-bottom-right-radius: 4px;
+}
+
+.lb-dataContainer:after {
+  content: "";
+  display: table;
+  clear: both;
+}
+
+.lb-data {
+  padding: 0 4px;
+  color: #ccc;
+}
+
+.lb-data .lb-details {
+  width: 85%;
+  float: left;
+  text-align: left;
+  line-height: 1.1em;
+}
+
+.lb-data .lb-caption {
+  font-size: 13px;
+  font-weight: bold;
+  line-height: 1em;
+}
+
+.lb-data .lb-caption a {
+  color: #4ae;
+}
+
+.lb-data .lb-number {
+  display: block;
+  clear: left;
+  padding-bottom: 1em;
+  font-size: 12px;
+  color: #999999;
+}
+
+.lb-data .lb-close {
+  display: block;
+  float: right;
+  width: 30px;
+  height: 30px;
+  background: url(../images/close.png) top right no-repeat;
+  text-align: right;
+  outline: none;
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
+  opacity: 0.7;
+  -webkit-transition: opacity 0.2s;
+  -moz-transition: opacity 0.2s;
+  -o-transition: opacity 0.2s;
+  transition: opacity 0.2s;
+}
+
+.lb-data .lb-close:hover {
+  cursor: pointer;
+  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
+  opacity: 1;
+}
--- a/css/material-components-web.css
+++ b/css/material-components-web.css
--- a/fonts/Chapaza.ttf
+++ b/fonts/Chapaza.ttf
--- a/fonts/NorthernSoul-Script.otf
+++ b/fonts/NorthernSoul-Script.otf
--- a/fonts/icomoon-icomoon.ttf
+++ b/fonts/icomoon-icomoon.ttf
--- a/fonts/icomoon-icomoon.woff
+++ b/fonts/icomoon-icomoon.woff
--- a/img/album1.png
+++ b/img/album1.png
--- a/img/album2.png
+++ b/img/album2.png
--- a/img/album3.png
+++ b/img/album3.png
--- a/img/album4.png
+++ b/img/album4.png
--- a/img/album5.png
+++ b/img/album5.png
--- a/img/album6.png
+++ b/img/album6.png
--- a/img/bride.png
+++ b/img/bride.png
--- a/img/couple-1.png
+++ b/img/couple-1.png
--- a/img/groom.png
+++ b/img/groom.png
--- a/img/images-loader.gif
+++ b/img/images-loader.gif
--- a/img/kita.png
+++ b/img/kita.png
--- a/index.html
+++ b/index.html
@ -0,0 +1,611 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+
+	<meta charset="utf-8">
+	<title>Wedding Invitation - Atep &amp; Arty </title>
+	<meta name="viewport" content="width=device-width, initial-scale=1">
+
+
+	<meta property="og:image" content="img/kita.png">
+	<meta property="og:image:width" content="300">
+	<meta property="og:image:height" content="300">
+	<meta property="og:title" content="Wedding Invitation - Atep &amp; Arty ">
+	<meta property="og:description" content="Hello ! Kamu Di Undang..">
+	<meta property="og:type" content="article">
+	<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
+	<meta http-equiv="Pragma" content="no-cache">
+	<meta http-equiv="Expires" content="0">
+	<link rel="icon" href="">
+
+
+	<link href="https://fonts.googleapis.com/css?family=Work+Sans:400,300,600,400italic,700" rel="stylesheet"
+		type="text/css">
+	<link href="https://fonts.googleapis.com/css?family=Sacramento" rel="stylesheet">
+
+	<link rel="stylesheet" href="css/bootstrap.min.css">
+
+	<!-- Animate.css -->
+	<link rel="stylesheet" href="css/css-animate.css">
+	<!-- Icomoon Icon Fonts-->
+	<link rel="stylesheet" href="css/css-icomoon.css">
+	<!-- Bootstrap  -->
+	<link rel="stylesheet" href="css/css-bootstrap.css">
+
+	<!-- Magnific Popup -->
+	<link rel="stylesheet" href="css/css-magnific-popup.css">
+
+	<!-- Owl Carousel  -->
+	<link rel="stylesheet" href="css/css-owl.carousel.min.css">
+	<link rel="stylesheet" href="css/css-owl.theme.default.min.css">
+
+	<!--lightbox-->
+	<link href="css/lightbox.css" rel="stylesheet">
+
+	<!-- Theme style  -->
+	<link rel="stylesheet" href="css/css-style.css">
+
+
+	<!-- icon -->
+	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
+	<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
+	<link href="css/material-components-web.css" rel="stylesheet">
+
+
+	<!-- Modernizr JS -->
+	<script src="js/js-modernizr-2.6.2.min.js"></script>
+	<!-- FOR IE9 below -->
+
+	<link rel="stylesheet" href="css/ket2.css">
+	<link rel="stylesheet" href="css/ket.css">
+
+</head>
+
+<body>
+
+
+	<div id="loader" class="fh5co-loader"></div>
+	<!-- SPLASHSCREEN -->
+	<div id="splashscreen">
+		<div class="splashscreen-bg"></div>
+		<div class="tengah">
+			<p>The Wedding Of</p>
+			<h1 style="font-size:80px;color:white;margin-top:-30px;">Arty &amp; Atep </h1>
+			<p style="margin-top:30px;">Kepada Yth.<br>
+				<a href="#" onclick="return OpenInvitation();">
+					<button class="btn-depan btn-4 btn-sep-depan icon-send popup1_open" data-popup-ordinal="0"
+						id="open_92089009">BUKA</button>
+				</a>
+		</div>
+	</div>
+
+	<!-- END SPLASHSCREEN -->
+
+	<!-- ============== MUSIK =============== -->
+	<audio loop="true" src="musik/musik.mp3" id="audio"></audio>
+	<!-- ============== MUSIK =============== -->
+
+	<div style="display: none;" id="page"><a href="#"
+			class="js-fh5co-nav-toggle fh5co-nav-toggle fh5co-nav-white"><i></i></a>
+		<div id="fh5co-offcanvas"></div>
+		<header id="fh5co-header" class="fh5co-cover" role="banner" data-stellar-background-ratio="0.5"
+			style="background-position: -25px -25px;">
+			<div id="fh5co-header">
+				<div class="overlay"></div>
+				<div class="container">
+					<div class="row">
+						<div class="col-md-8 col-md-offset-2 text-center">
+							<div class="display-t">
+								<div class="display-tc animate-box fadeIn animated-fast" data-animate-effect="fadeIn">
+									<div style="color:#fff;margin-top:250px;">
+
+										<p>The Wedding Of</p>
+
+										<h1 style="margin-top:-40px">
+											Arty &amp; Atep </h1>
+										<p><span>06 - 06 - 2021</span></p>
+										<p>
+											<a href="#fh5co-couple" class="icon-scroll"></a>
+										</p>
+									</div>
+									<div style="clear:both">
+										<br>
+									</div>
+								</div>
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+		</header>
+
+
+		<div id="fh5co-couple">
+			<div class="container">
+				<div class="row">
+					<div class="col-md-8 col-md-offset-2 text-center animate-box fadeInUp animated-fast">
+						<h1 style="color:#304058;font-size:50px">Hello!</h1>
+						<p><i style="white-space:pre-line;">Assalamu'alaikum warahmatullahi wabarakatuh
+								Izinkan kami mengundang sekaligus mengharapkan doa restu dari bapak/ibu dan
+								rekan-rekan dalam acara pernikahan kami</i>
+						</p>
+					</div>
+				</div>
+				<div class="couple-wrap animate-box fadeInUp animated-fast">
+					<div class="couple-half">
+						<div class="groom"> <img src="img/bride.png?nocache=1440" alt="groom" class="img-responsive">
+						</div>
+						<div class="desc-groom">
+							<h3 style="color:#304058;">
+								Arty Artya Melinda</h3>
+							<!-- untuk deskripsi mempelai -->
+							<p>
+								<i style="font-size:12px;">Putri dari :</i>
+								<br>
+								Bapak Arbi Sahtiadin &amp; Ibu Oneng Nurhayati
+							</p>
+						</div>
+					</div>
+					<p class="heart text-center"><i class="icon-heart2" style="color:#304058;"></i></p>
+					<div class="couple-half">
+						<div class="bride"> <img src="img/groom.png?nocache=1440" alt="groom" class="img-responsive">
+						</div>
+						<div class="desc-bride">
+							<h3 style="color:#304058;">
+								Atep Jaenudin</h3>
+							<!-- untuk deskripsi mempelai -->
+							<p><i style="font-size:12px;">Putra dari :</i>
+								<br>
+								Bapak H Enyang &amp; Ibu H Atik
+							</p>
+						</div>
+					</div>
+				</div>
+				<div class="col-md-12" style="text-align:center;font-size:12px;">
+					<br><i style="white-space:pre-line;">''
+						Dan di antara tanda-tanda kekuasaan-Nya ialah Dia menciptakan untukmu isteri-isteri dari
+						jenismu sendiri, supaya kamu cenderung dan merasa tenteram kepadanya, dan dijadikan-Nya
+						diantaramu rasa kasih dan sayang. Sesungguhnya pada yang demikian itu benar-benar
+						terdapat tanda-tanda bagi kaum yang berfikir.
+						''
+						QS Ar-Rum : 21</i>
+				</div>
+			</div>
+		</div>
+
+
+		<!-- ============== PHP GET DATA TANGGAL =============== -->
+		<!-- ============== PHP GET DATA TANGGAL =============== -->
+		<div id="fh5co-event" class="fh5co-bg paralax-acara" style="background-color:#304058; min-height:0px;">
+			<div class="overlay"></div>
+			<div class="container">
+				<!-- 
+		<div class="row">
+			<div class="col-md-8 col-md-offset-2 text-center animate-box"> 
+				<h2 style="color:#fff;font-size:30px">Wedding Events</h2> 
+			</div>
+		</div>-->
+				<div class="row">
+					<div class="display-t">
+						<div class="display-tc">
+							<div class="col-md-10 col-md-offset-1">
+
+
+								<div class="col-md-6 col-sm-6 text-center" style="margin-bottom:10px;">
+									<div class="event-wrap animate-box fadeInUp animated-fast">
+										<h3>Akad</h3>
+										<div class="event-col">
+											<i class="icon-clock"></i>
+											<span>
+												80.00 Pagi </span>
+										</div>
+										<div class="event-col"> <i class="icon-calendar"></i> <span>Minggu, 6
+												Juni 2021</span> </div>
+										<p>
+											<label style="font-weight:normal; font-size:22px;">
+												Gedung Herlina Mutiara </label>
+											<br>
+											Jl. Pramuka, Bojong, Karangtengah, Kabupaten Cianjur, Jawa Barat
+											43281
+										</p>
+									</div>
+								</div>
+								<div class="col-md-6 col-sm-6 text-center" style="margin-bottom:10px;">
+									<div class="event-wrap animate-box fadeInUp animated-fast">
+										<h3>Resepsi</h3>
+										<div class="event-col">
+											<i class="icon-clock"></i> <span>
+												10.00 - 14.00 </span>
+										</div>
+										<div class="event-col"> <i class="icon-calendar"></i> <span>Minggu, 6
+												Juni 2021</span> </div>
+										<p>
+											<label style="font-weight:normal; font-size:22px;">
+												Gedung Herlina Mutiara </label>
+											<br>
+											Jl. Pramuka, Bojong, Karangtengah, Kabupaten Cianjur, Jawa Barat
+											43281
+										</p>
+									</div>
+								</div>
+
+
+								<div class="col-md-8 col-md-offset-2 text-center animate-box fadeInUp animated-fast">
+									<a href="https://youtu.be/Ev-Rgy8HabA" target="_blank"
+										class="streaming mdc-button mdc-button--raised">
+										<i class="material-icons mdc-button__icon">play_arrow</i>
+										LIVE STREAMING
+									</a>
+								</div>
+
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+
+		<div id="fh5co-couple-story">
+			<div class="container">
+				<div class="row">
+					<div class="col-md-8 col-md-offset-2 text-center fh5co-heading animate-box fadeInUp animated-fast">
+						<h1 style="color:#304058;">Cerita Kita</h1>
+					</div>
+				</div>
+				<div class="row">
+					<div class="col-md-12 col-md-offset-0">
+						<ul class="timeline animate-box fadeInUp animated-fast">
+							<!-- GET DATA -->
+							<!-- ELSE -->
+							<li class="timeline-inverted animate-box fadeInUp animated-fast">
+								<div class="timeline-badge"
+									style="background-color:#304058; background-image:url(img/couple-1.png);">
+								</div>
+								<div class="timeline-panel">
+									<div class="timeline-heading">
+										<h3 class="timeline-title">Pertama bertemu</h3>
+										<img src="img/album1.png" alt="img" class="timeline-img">
+										<span class="date">14 Januari 2020</span>
+									</div>
+									<div class="timeline-body">
+										<p>
+											Waktu Pertama Kali
+											Kulihat Dirimu Hadir
+											Rasa hati ini inginkan dirimu </p>
+									</div>
+								</div>
+							</li>
+							<!--TUTUP PHP -->
+							<!-- GET DATA -->
+							<li class="animate-box fadeInUp animated-fast">
+								<div class="timeline-badge"
+									style="background-color:#304058; background-image:url(img/couple-1.png);">
+								</div>
+								<div class="timeline-panel">
+									<div class="timeline-heading">
+										<h3 class="timeline-title">Jatuh Cinta</h3>
+										<img src="img/album2.png" alt="img" class="timeline-img">
+										<span class="date">15 Maret 2020</span>
+									</div>
+									<div class="timeline-body">
+										<p>
+											Hati tenang mendengar
+											suara indah menyapa
+											Geloranya hati ini
+											Tak ku sangka.. </p>
+									</div>
+								</div>
+							</li>
+							<!-- ELSE -->
+							<!-- ELSE -->
+							<li class="timeline-inverted animate-box fadeInUp animated-fast">
+								<div class="timeline-badge"
+									style="background-color:#304058; background-image:url(img/couple-1.png);">
+								</div>
+								<div class="timeline-panel">
+									<div class="timeline-heading">
+										<h3 class="timeline-title">Ta'aruf</h3>
+										<img src="img/album3.png" alt="img" class="timeline-img"><span class="date">1
+											Mei 2020</span>
+									</div>
+									<div class="timeline-body">
+										<p>
+											Rasa ini.. tak tertahan..
+											Hati ini..slalu untukmu.. </p>
+									</div>
+								</div>
+							</li>
+							<!--TUTUP PHP -->
+							<!-- GET DATA -->
+							<li class="animate-box fadeInUp animated-fast">
+								<div class="timeline-badge"
+									style="background-color:#304058; background-image:url(img/couple-1.png);">
+								</div>
+								<div class="timeline-panel">
+									<div class="timeline-heading">
+										<h3 class="timeline-title">Khitbah</h3>
+										<img src="img/album4.png" alt="img" class="timeline-img">
+										<span class="date">16 Mei 2020</span>
+									</div>
+									<div class="timeline-body">
+										<p>
+											Terimalah lagu ini dari orang biasa
+											Tapi cintaku padamu luar biasa
+											Aku tak punya bunga
+											Aku tak punya harta
+											Yang ku punya hanyalah
+											Hati yang setia.. Tulus.. Padamu.. :) </p>
+									</div>
+								</div>
+							</li>
+							<!-- ELSE -->
+							<!--TUTUP PHP -->
+						</ul>
+					</div>
+				</div>
+			</div>
+		</div>
+		<div id="fh5co-gallery" class="fh5co-section-gray">
+			<div class="container">
+				<div class="row">
+					<div class="col-md-8 col-md-offset-2 text-center fh5co-heading animate-box fadeInUp animated-fast">
+						<h1 style="color:#304058;">Gallery</h1>
+					</div>
+				</div>
+				<div class="row row-bottom-padded-md">
+					<div class="col-md-12">
+						<ul id="fh5co-gallery-list">
+							<!-- GET DATA -->
+							<!-- GET DATA -->
+							<li class="one-third animate-box fadeIn animated-fast" data-animate-effect="fadeIn"
+								style="background-image: url(img/album1.png);">
+								<a href="img/album1.png" data-lightbox="roadtrip">
+									<div class="case-studies-summary"> <span></span>
+										<h2></h2>
+									</div>
+								</a>
+							</li>
+							<!-- CLOSE DATA -->
+							<!-- GET DATA -->
+							<li class="one-third animate-box fadeIn animated-fast" data-animate-effect="fadeIn"
+								style="background-image: url(img/album2.png);">
+								<a href="img/album2.png" data-lightbox="roadtrip">
+									<div class="case-studies-summary"> <span></span>
+										<h2></h2>
+									</div>
+								</a>
+							</li>
+							<!-- CLOSE DATA -->
+							<!-- GET DATA -->
+							<li class="one-third animate-box fadeIn animated-fast" data-animate-effect="fadeIn"
+								style="background-image: url(img/album3.png);">
+								<a href="img/album3.png" data-lightbox="roadtrip">
+									<div class="case-studies-summary"> <span></span>
+										<h2></h2>
+									</div>
+								</a>
+							</li>
+							<!-- CLOSE DATA -->
+							<!-- GET DATA -->
+							<li class="one-third animate-box fadeIn animated-fast" data-animate-effect="fadeIn"
+								style="background-image: url(img/album4.png);">
+								<a href="img/album4.png" data-lightbox="roadtrip">
+									<div class="case-studies-summary"> <span></span>
+										<h2></h2>
+									</div>
+								</a>
+							</li>
+							<!-- CLOSE DATA -->
+							<!-- GET DATA -->
+							<li class="one-third animate-box fadeIn animated-fast" data-animate-effect="fadeIn"
+								style="background-image: url(img/album5.png);">
+								<a href="img/album5.png" data-lightbox="roadtrip">
+									<div class="case-studies-summary"> <span></span>
+										<h2></h2>
+									</div>
+								</a>
+							</li>
+							<!-- CLOSE DATA -->
+							<!-- GET DATA -->
+							<li class="one-third animate-box fadeIn animated-fast" data-animate-effect="fadeIn"
+								style="background-image: url(img/album6.png);">
+								<a href="img/album6.png" data-lightbox="roadtrip">
+									<div class="case-studies-summary"> <span></span>
+										<h2></h2>
+									</div>
+								</a>
+							</li>
+							<!-- CLOSE DATA -->
+
+
+							<!-- GET DATA YT -->
+							<div class="videoWrapper" style="width:100%;">
+								<center>
+									<object data="https://www.youtube.com/embed/hrVyGEvVu7k"> </object>
+								</center>
+							</div>
+							<!-- CLOSE DATA -->
+
+
+						</ul>
+					</div>
+				</div>
+			</div>
+		</div>
+		<div id="fh5co-maps" class="fh5co-bg scrolltomap" style="background-color:#304058;">
+			<div class="overlay"></div>
+			<div class="container">
+				<div class="row">
+					<div class="col-md-8 col-md-offset-2 text-center animate-box  fadeInUp animated-fast">
+						<h1 class="color-putih" style="margin-top:30px;">Find Us</h1>
+
+						<p style="color:#fff;">
+							Gedung Herlina Mutiara <br>
+							Jl. Pramuka, Bojong, Karangtengah, Kabupaten Cianjur, Jawa Barat 43281 </p>
+					</div>
+				</div>
+				<div class="row">
+					<div class="display-t">
+						<div class="display-tc">
+							<div class="col-md-10 col-md-offset-1">
+								<div style="text-align:center;">
+									<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
+									<style>
+										@media (max-width: 575.98px) {
+											.maps iframe {
+												width: 100%;
+												height: 350px;
+											}
+										}
+
+										@media (min-width: 576px) {
+											.maps iframe {
+												width: 100%;
+												height: 350px;
+											}
+										}
+
+										@media (min-width: 768px) {
+											.maps iframe {
+												width: 100%;
+												height: 450px;
+											}
+										}
+
+										@media (min-width: 992px) {
+											.maps iframe {
+												width: 100%;
+												height: 500px;
+											}
+										}
+									</style>
+									<div style="margin-bottom:50px;" id="maps">
+										<iframe width="100%" height="450px" frameborder="0" style="border:0"
+											src="https://www.google.com/maps/embed/v1/place?q=-6.794355,107.172731&amp;key=AIzaSyBkXrQtu34bjG_8Apa0cvNENa_7frfCE2w">
+										</iframe>
+									</div>
+								</div>
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+
+
+		<footer>
+			<p> &copy; Copyright 2022, <a href="">MSN PRODUCTION - PT. Mulia Sejati Nusantara.</a> All Rights Reserved
+			</p>
+		</footer>
+
+
+		<!-- MUTE BUTTON -->
+		<a id="mute" href="#/" onclick="mute()" class="floatmute">
+			<i color="#fff" class="fa fa-volume-up my-float"></i>
+		</a>
+		<!-- MUTE BUTTON -->
+
+	</div>
+
+	<div class="gototop js-top">
+		<a href="#fh5co-header" class="js-gotop"><i class="icon-arrow-up"></i></a>
+	</div>
+
+	<script>
+		const splashscreen = document.getElementById("splashscreen")
+		const page = document.getElementById("page")
+
+		function OpenInvitation() {
+			splashscreen.style.display = "none"
+			page.style.display = "block"
+		}
+	</script>
+
+
+
+
+
+	<script src="js/2.1.3-jquery.min.js"></script>
+	<script src="js/js-bootstrap.min.js"></script>
+
+	<!-- jQuery -->
+	<!-- <script src="js/jquery.min.js"></script> -->
+
+	<!-- jQuery Easing -->
+	<script src="js/js-jquery.easing.1.3.js"></script>
+
+
+
+	<!-- JS AREA -->
+	<script src="js/moment-with-locales.js"></script>
+
+	<script src="js/lightbox.js"></script>
+	<!-- <script src="//cdn.jsdelivr.net/npm/less@3.13"></script> -->
+	<!-- Waypoints -->
+	<script src="js/js-jquery.waypoints.min.js"></script>
+	<!-- Carousel -->
+	<script src="js/js-owl.carousel.min.js"></script>
+	<!-- countTo -->
+	<script src="js/js-jquery.countTo.js"></script>
+
+	<!-- Stellar -->
+	<script src="js/js-jquery.stellar.min.js"></script>
+	<!-- Magnific Popup -->
+	<script src="js/js-jquery.magnific-popup.min.js"></script>
+
+	<script src="js/js-simplyCountdown.js"></script>
+	<!-- Main -->
+	<script src="js/js-main.js"></script>
+
+	<script src="js/js-index.js"></script>
+
+	<!-- VALIDASI DONASI -->
+	<script type="text/javascript" src="js/jquery.validate.min.js"></script>
+
+	<script src="js/jquery.popupoverlay.min.js"></script>
+
+
+	<!--script mute-->
+
+	<script>
+		document.addEventListener("DOMContentLoaded", function (event) {
+			let audio = document.getElementById("audio");
+			let button = document.getElementById('mute');
+			if (+localStorage.getItem('mute')) {
+				audio.muted = true;
+				button.innerHTML = '<i color="#000" class="fa fa-volume-off my-float"></i>';
+				audio.pause()
+			} else {
+				audio.volume = 0.9;
+				audio.play()
+			}
+		})
+
+		function mute() {
+			let audio = document.getElementById('audio');
+			let button = document.getElementById('mute');
+			let isMute = +localStorage.getItem('mute');
+			if (!isMute) {
+				audio.muted = true;
+				audio.pause()
+				button.innerHTML = '<i color="#000" class="fa fa-volume-off my-float"></i>';
+				localStorage.setItem('mute', 1);
+			} else {
+				audio.muted = false;
+				audio.volume = 0.9;
+				audio.play()
+				button.innerHTML = '<i color="#fff" class="fa fa-volume-up my-float"></i>';
+				localStorage.setItem('mute', 0);
+
+			}
+		}
+	</script>
+
+	<!--end script mute-->
+
+
+
+</body>
+
+</html>
--- a/js/2.1.3-jquery.min.js
+++ b/js/2.1.3-jquery.min.js
--- a/js/jquery-3.3.1.slim.min.js
+++ b/js/jquery-3.3.1.slim.min.js
--- a/js/jquery.popupoverlay.min.js
+++ b/js/jquery.popupoverlay.min.js
--- a/js/jquery.validate.min.js
+++ b/js/jquery.validate.min.js
--- a/js/js-bootstrap.min.js
+++ b/js/js-bootstrap.min.js
--- a/js/js-index.js
+++ b/js/js-index.js
@ -0,0 +1,3 @@
+ $(window).load(function(){        
+   $('#myModal').modal('show');
+    });
--- a/js/js-jquery.countTo.js
+++ b/js/js-jquery.countTo.js
@ -0,0 +1,130 @@
+(function (factory) {
+    if (typeof define === 'function' && define.amd) {
+        // AMD
+        define(['jquery'], factory);
+    } else if (typeof exports === 'object') {
+        // CommonJS
+        factory(require('jquery'));
+    } else {
+        // Browser globals
+        factory(jQuery);
+    }
+}(function ($) {
+  var CountTo = function (element, options) {
+    this.$element = $(element);
+    this.options  = $.extend({}, CountTo.DEFAULTS, this.dataOptions(), options);
+    this.init();
+  };
+
+  CountTo.DEFAULTS = {
+    from: 0,               // the number the element should start at
+    to: 0,                 // the number the element should end at
+    speed: 1000,           // how long it should take to count between the target numbers
+    refreshInterval: 100,  // how often the element should be updated
+    decimals: 0,           // the number of decimal places to show
+    formatter: formatter,  // handler for formatting the value before rendering
+    onUpdate: null,        // callback method for every time the element is updated
+    onComplete: null       // callback method for when the element finishes updating
+  };
+
+  CountTo.prototype.init = function () {
+    this.value     = this.options.from;
+    this.loops     = Math.ceil(this.options.speed / this.options.refreshInterval);
+    this.loopCount = 0;
+    this.increment = (this.options.to - this.options.from) / this.loops;
+  };
+
+  CountTo.prototype.dataOptions = function () {
+    var options = {
+      from:            this.$element.data('from'),
+      to:              this.$element.data('to'),
+      speed:           this.$element.data('speed'),
+      refreshInterval: this.$element.data('refresh-interval'),
+      decimals:        this.$element.data('decimals')
+    };
+
+    var keys = Object.keys(options);
+
+    for (var i in keys) {
+      var key = keys[i];
+
+      if (typeof(options[key]) === 'undefined') {
+        delete options[key];
+      }
+    }
+
+    return options;
+  };
+
+  CountTo.prototype.update = function () {
+    this.value += this.increment;
+    this.loopCount++;
+
+    this.render();
+
+    if (typeof(this.options.onUpdate) == 'function') {
+      this.options.onUpdate.call(this.$element, this.value);
+    }
+
+    if (this.loopCount >= this.loops) {
+      clearInterval(this.interval);
+      this.value = this.options.to;
+
+      if (typeof(this.options.onComplete) == 'function') {
+        this.options.onComplete.call(this.$element, this.value);
+      }
+    }
+  };
+
+  CountTo.prototype.render = function () {
+    var formattedValue = this.options.formatter.call(this.$element, this.value, this.options);
+    this.$element.text(formattedValue);
+  };
+
+  CountTo.prototype.restart = function () {
+    this.stop();
+    this.init();
+    this.start();
+  };
+
+  CountTo.prototype.start = function () {
+    this.stop();
+    this.render();
+    this.interval = setInterval(this.update.bind(this), this.options.refreshInterval);
+  };
+
+  CountTo.prototype.stop = function () {
+    if (this.interval) {
+      clearInterval(this.interval);
+    }
+  };
+
+  CountTo.prototype.toggle = function () {
+    if (this.interval) {
+      this.stop();
+    } else {
+      this.start();
+    }
+  };
+
+  function formatter(value, options) {
+    return value.toFixed(options.decimals);
+  }
+
+  $.fn.countTo = function (option) {
+    return this.each(function () {
+      var $this   = $(this);
+      var data    = $this.data('countTo');
+      var init    = !data || typeof(option) === 'object';
+      var options = typeof(option) === 'object' ? option : {};
+      var method  = typeof(option) === 'string' ? option : 'start';
+
+      if (init) {
+        if (data) data.stop();
+        $this.data('countTo', data = new CountTo(this, options));
+      }
+
+      data[method].call(data);
+    });
+  };
+}));
--- a/js/js-jquery.easing.1.3.js
+++ b/js/js-jquery.easing.1.3.js
@ -0,0 +1,205 @@
+/*
+ * jQuery Easing v1.3 - http://gsgd.co.uk/sandbox/jquery/easing/
+ *
+ * Uses the built in easing capabilities added In jQuery 1.1
+ * to offer multiple easing options
+ *
+ * TERMS OF USE - jQuery Easing
+ * 
+ * Open source under the BSD License. 
+ * 
+ * Copyright Ã‚Â© 2008 George McGinley Smith
+ * All rights reserved.
+ * 
+ * Redistribution and use in source and binary forms, with or without modification, 
+ * are permitted provided that the following conditions are met:
+ * 
+ * Redistributions of source code must retain the above copyright notice, this list of 
+ * conditions and the following disclaimer.
+ * Redistributions in binary form must reproduce the above copyright notice, this list 
+ * of conditions and the following disclaimer in the documentation and/or other materials 
+ * provided with the distribution.
+ * 
+ * Neither the name of the author nor the names of contributors may be used to endorse 
+ * or promote products derived from this software without specific prior written permission.
+ * 
+ * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY 
+ * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
+ * MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE
+ *  COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
+ *  EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE
+ *  GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED 
+ * AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+ *  NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED 
+ * OF THE POSSIBILITY OF SUCH DAMAGE. 
+ *
+*/
+
+// t: current time, b: begInnIng value, c: change In value, d: duration
+jQuery.easing['jswing'] = jQuery.easing['swing'];
+
+jQuery.extend( jQuery.easing,
+{
+	def: 'easeOutQuad',
+	swing: function (x, t, b, c, d) {
+		//alert(jQuery.easing.default);
+		return jQuery.easing[jQuery.easing.def](x, t, b, c, d);
+	},
+	easeInQuad: function (x, t, b, c, d) {
+		return c*(t/=d)*t + b;
+	},
+	easeOutQuad: function (x, t, b, c, d) {
+		return -c *(t/=d)*(t-2) + b;
+	},
+	easeInOutQuad: function (x, t, b, c, d) {
+		if ((t/=d/2) < 1) return c/2*t*t + b;
+		return -c/2 * ((--t)*(t-2) - 1) + b;
+	},
+	easeInCubic: function (x, t, b, c, d) {
+		return c*(t/=d)*t*t + b;
+	},
+	easeOutCubic: function (x, t, b, c, d) {
+		return c*((t=t/d-1)*t*t + 1) + b;
+	},
+	easeInOutCubic: function (x, t, b, c, d) {
+		if ((t/=d/2) < 1) return c/2*t*t*t + b;
+		return c/2*((t-=2)*t*t + 2) + b;
+	},
+	easeInQuart: function (x, t, b, c, d) {
+		return c*(t/=d)*t*t*t + b;
+	},
+	easeOutQuart: function (x, t, b, c, d) {
+		return -c * ((t=t/d-1)*t*t*t - 1) + b;
+	},
+	easeInOutQuart: function (x, t, b, c, d) {
+		if ((t/=d/2) < 1) return c/2*t*t*t*t + b;
+		return -c/2 * ((t-=2)*t*t*t - 2) + b;
+	},
+	easeInQuint: function (x, t, b, c, d) {
+		return c*(t/=d)*t*t*t*t + b;
+	},
+	easeOutQuint: function (x, t, b, c, d) {
+		return c*((t=t/d-1)*t*t*t*t + 1) + b;
+	},
+	easeInOutQuint: function (x, t, b, c, d) {
+		if ((t/=d/2) < 1) return c/2*t*t*t*t*t + b;
+		return c/2*((t-=2)*t*t*t*t + 2) + b;
+	},
+	easeInSine: function (x, t, b, c, d) {
+		return -c * Math.cos(t/d * (Math.PI/2)) + c + b;
+	},
+	easeOutSine: function (x, t, b, c, d) {
+		return c * Math.sin(t/d * (Math.PI/2)) + b;
+	},
+	easeInOutSine: function (x, t, b, c, d) {
+		return -c/2 * (Math.cos(Math.PI*t/d) - 1) + b;
+	},
+	easeInExpo: function (x, t, b, c, d) {
+		return (t==0) ? b : c * Math.pow(2, 10 * (t/d - 1)) + b;
+	},
+	easeOutExpo: function (x, t, b, c, d) {
+		return (t==d) ? b+c : c * (-Math.pow(2, -10 * t/d) + 1) + b;
+	},
+	easeInOutExpo: function (x, t, b, c, d) {
+		if (t==0) return b;
+		if (t==d) return b+c;
+		if ((t/=d/2) < 1) return c/2 * Math.pow(2, 10 * (t - 1)) + b;
+		return c/2 * (-Math.pow(2, -10 * --t) + 2) + b;
+	},
+	easeInCirc: function (x, t, b, c, d) {
+		return -c * (Math.sqrt(1 - (t/=d)*t) - 1) + b;
+	},
+	easeOutCirc: function (x, t, b, c, d) {
+		return c * Math.sqrt(1 - (t=t/d-1)*t) + b;
+	},
+	easeInOutCirc: function (x, t, b, c, d) {
+		if ((t/=d/2) < 1) return -c/2 * (Math.sqrt(1 - t*t) - 1) + b;
+		return c/2 * (Math.sqrt(1 - (t-=2)*t) + 1) + b;
+	},
+	easeInElastic: function (x, t, b, c, d) {
+		var s=1.70158;var p=0;var a=c;
+		if (t==0) return b;  if ((t/=d)==1) return b+c;  if (!p) p=d*.3;
+		if (a < Math.abs(c)) { a=c; var s=p/4; }
+		else var s = p/(2*Math.PI) * Math.asin (c/a);
+		return -(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
+	},
+	easeOutElastic: function (x, t, b, c, d) {
+		var s=1.70158;var p=0;var a=c;
+		if (t==0) return b;  if ((t/=d)==1) return b+c;  if (!p) p=d*.3;
+		if (a < Math.abs(c)) { a=c; var s=p/4; }
+		else var s = p/(2*Math.PI) * Math.asin (c/a);
+		return a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b;
+	},
+	easeInOutElastic: function (x, t, b, c, d) {
+		var s=1.70158;var p=0;var a=c;
+		if (t==0) return b;  if ((t/=d/2)==2) return b+c;  if (!p) p=d*(.3*1.5);
+		if (a < Math.abs(c)) { a=c; var s=p/4; }
+		else var s = p/(2*Math.PI) * Math.asin (c/a);
+		if (t < 1) return -.5*(a*Math.pow(2,10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )) + b;
+		return a*Math.pow(2,-10*(t-=1)) * Math.sin( (t*d-s)*(2*Math.PI)/p )*.5 + c + b;
+	},
+	easeInBack: function (x, t, b, c, d, s) {
+		if (s == undefined) s = 1.70158;
+		return c*(t/=d)*t*((s+1)*t - s) + b;
+	},
+	easeOutBack: function (x, t, b, c, d, s) {
+		if (s == undefined) s = 1.70158;
+		return c*((t=t/d-1)*t*((s+1)*t + s) + 1) + b;
+	},
+	easeInOutBack: function (x, t, b, c, d, s) {
+		if (s == undefined) s = 1.70158; 
+		if ((t/=d/2) < 1) return c/2*(t*t*(((s*=(1.525))+1)*t - s)) + b;
+		return c/2*((t-=2)*t*(((s*=(1.525))+1)*t + s) + 2) + b;
+	},
+	easeInBounce: function (x, t, b, c, d) {
+		return c - jQuery.easing.easeOutBounce (x, d-t, 0, c, d) + b;
+	},
+	easeOutBounce: function (x, t, b, c, d) {
+		if ((t/=d) < (1/2.75)) {
+			return c*(7.5625*t*t) + b;
+		} else if (t < (2/2.75)) {
+			return c*(7.5625*(t-=(1.5/2.75))*t + .75) + b;
+		} else if (t < (2.5/2.75)) {
+			return c*(7.5625*(t-=(2.25/2.75))*t + .9375) + b;
+		} else {
+			return c*(7.5625*(t-=(2.625/2.75))*t + .984375) + b;
+		}
+	},
+	easeInOutBounce: function (x, t, b, c, d) {
+		if (t < d/2) return jQuery.easing.easeInBounce (x, t*2, 0, c, d) * .5 + b;
+		return jQuery.easing.easeOutBounce (x, t*2-d, 0, c, d) * .5 + c*.5 + b;
+	}
+});
+
+/*
+ *
+ * TERMS OF USE - EASING EQUATIONS
+ * 
+ * Open source under the BSD License. 
+ * 
+ * Copyright Ã‚Â© 2001 Robert Penner
+ * All rights reserved.
+ * 
+ * Redistribution and use in source and binary forms, with or without modification, 
+ * are permitted provided that the following conditions are met:
+ * 
+ * Redistributions of source code must retain the above copyright notice, this list of 
+ * conditions and the following disclaimer.
+ * Redistributions in binary form must reproduce the above copyright notice, this list 
+ * of conditions and the following disclaimer in the documentation and/or other materials 
+ * provided with the distribution.
+ * 
+ * Neither the name of the author nor the names of contributors may be used to endorse 
+ * or promote products derived from this software without specific prior written permission.
+ * 
+ * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY 
+ * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF
+ * MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE
+ *  COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
+ *  EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE
+ *  GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED 
+ * AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING
+ *  NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED 
+ * OF THE POSSIBILITY OF SUCH DAMAGE. 
+ *
+ */
--- a/js/js-jquery.magnific-popup.min.js
+++ b/js/js-jquery.magnific-popup.min.js
--- a/js/js-jquery.stellar.min.js
+++ b/js/js-jquery.stellar.min.js
--- a/js/js-jquery.waypoints.min.js
+++ b/js/js-jquery.waypoints.min.js
--- a/js/js-magnific-popup-options.js
+++ b/js/js-magnific-popup-options.js
--- a/js/js-main.js
+++ b/js/js-main.js
@ -0,0 +1,233 @@
+;(function () {
+	
+	'use strict';
+
+	var mobileMenuOutsideClick = function() {
+
+		$(document).click(function (e) {
+	    var container = $("#fh5co-offcanvas, .js-fh5co-nav-toggle");
+	    if (!container.is(e.target) && container.has(e.target).length === 0) {
+
+	    	if ( $('body').hasClass('offcanvas') ) {
+
+    			$('body').removeClass('offcanvas');
+    			$('.js-fh5co-nav-toggle').removeClass('active');
+	    	}
+	    }
+		});
+
+	};
+
+
+	var offcanvasMenu = function() {
+
+		$('#page').prepend('<div id="fh5co-offcanvas" />');
+		$('#page').prepend('<a href="#" class="js-fh5co-nav-toggle fh5co-nav-toggle fh5co-nav-white"><i></i></a>');
+		var clone1 = $('.menu-1 > ul').clone();
+		$('#fh5co-offcanvas').append(clone1);
+		var clone2 = $('.menu-2 > ul').clone();
+		$('#fh5co-offcanvas').append(clone2);
+
+		$('#fh5co-offcanvas .has-dropdown').addClass('offcanvas-has-dropdown');
+		$('#fh5co-offcanvas')
+			.find('li')
+			.removeClass('has-dropdown');
+
+		// Hover dropdown menu on mobile
+		$('.offcanvas-has-dropdown').mouseenter(function(){
+			var $this = $(this);
+
+			$this
+				.addClass('active')
+				.find('ul')
+				.slideDown(500, 'easeOutExpo');				
+		}).mouseleave(function(){
+
+			var $this = $(this);
+			$this
+				.removeClass('active')
+				.find('ul')
+				.slideUp(500, 'easeOutExpo');				
+		});
+
+
+		$(window).resize(function(){
+
+			if ( $('body').hasClass('offcanvas') ) {
+
+    			$('body').removeClass('offcanvas');
+    			$('.js-fh5co-nav-toggle').removeClass('active');
+				
+	    	}
+		});
+	};
+
+
+	var burgerMenu = function() {
+
+		$('body').on('click', '.js-fh5co-nav-toggle', function(event){
+			var $this = $(this);
+
+
+			if ( $('body').hasClass('overflow offcanvas') ) {
+				$('body').removeClass('overflow offcanvas');
+			} else {
+				$('body').addClass('overflow offcanvas');
+			}
+			$this.toggleClass('active');
+			event.preventDefault();
+
+		});
+	};
+
+
+
+	var contentWayPoint = function() {
+		var i = 0;
+		$('.animate-box').waypoint( function( direction ) {
+
+			if( direction === 'down' && !$(this.element).hasClass('animated-fast') ) {
+				
+				i++;
+
+				$(this.element).addClass('item-animate');
+				setTimeout(function(){
+
+					$('body .animate-box.item-animate').each(function(k){
+						var el = $(this);
+						setTimeout( function () {
+							var effect = el.data('animate-effect');
+							if ( effect === 'fadeIn') {
+								el.addClass('fadeIn animated-fast');
+							} else if ( effect === 'fadeInLeft') {
+								el.addClass('fadeInLeft animated-fast');
+							} else if ( effect === 'fadeInRight') {
+								el.addClass('fadeInRight animated-fast');
+							} else {
+								el.addClass('fadeInUp animated-fast');
+							}
+
+							el.removeClass('item-animate');
+						},  k * 200, 'easeInOutExpo' );
+					});
+					
+				}, 100);
+				
+			}
+
+		} , { offset: '85%' } );
+	};
+
+
+	var dropdown = function() {
+
+		$('.has-dropdown').mouseenter(function(){
+
+			var $this = $(this);
+			$this
+				.find('.dropdown')
+				.css('display', 'block')
+				.addClass('animated-fast fadeInUpMenu');
+
+		}).mouseleave(function(){
+			var $this = $(this);
+
+			$this
+				.find('.dropdown')
+				.css('display', 'none')
+				.removeClass('animated-fast fadeInUpMenu');
+		});
+
+	};
+
+
+	var testimonialCarousel = function(){
+		var owl = $('.owl-carousel-fullwidth');
+		owl.owlCarousel({
+			items: 1,
+			loop: true,
+			margin: 0,
+			responsiveClass: true,
+			nav: false,
+			dots: true,
+			smartSpeed: 800,
+			autoHeight: true,
+		});
+	};
+
+
+	var goToTop = function() {
+
+		$('.js-gotop').on('click', function(event){
+			
+			event.preventDefault();
+
+			$('html, body').animate({
+				scrollTop: $('html').offset().top
+			}, 500, 'easeInOutExpo');
+			
+			return false;
+		});
+
+		$(window).scroll(function(){
+
+			var $win = $(window);
+			if ($win.scrollTop() > 200) {
+				$('.js-top').addClass('active');
+			} else {
+				$('.js-top').removeClass('active');
+			}
+
+		});
+	
+	};
+
+
+	// Loading page
+	var loaderPage = function() {
+		$(".fh5co-loader").fadeOut("slow");
+	};
+
+	var counter = function() {
+		$('.js-counter').countTo({
+			 formatter: function (value, options) {
+	      return value.toFixed(options.decimals);
+	    },
+		});
+	};
+
+	var counterWayPoint = function() {
+		if ($('#fh5co-counter').length > 0 ) {
+			$('#fh5co-counter').waypoint( function( direction ) {
+										
+				if( direction === 'down' && !$(this.element).hasClass('animated') ) {
+					setTimeout( counter , 400);					
+					$(this.element).addClass('animated');
+				}
+			} , { offset: '90%' } );
+		}
+	};
+
+	// Parallax
+	var parallax = function() {
+		$(window).stellar();
+	};
+
+	
+	$(function(){
+		mobileMenuOutsideClick();
+		parallax();
+		offcanvasMenu();
+		burgerMenu();
+		contentWayPoint();
+		dropdown();
+		testimonialCarousel();
+		goToTop();
+		loaderPage();
+		counter();
+		counterWayPoint();
+	});
+
+
+}());
+
--- a/js/js-modernizr-2.6.2.min.js
+++ b/js/js-modernizr-2.6.2.min.js
--- a/js/js-owl.carousel.min.js
+++ b/js/js-owl.carousel.min.js
--- a/js/js-simplyCountdown.js
+++ b/js/js-simplyCountdown.js
@ -0,0 +1,285 @@
+/*!
+ * Project : simply-countdown
+ * File : simplyCountdown
+ * Date : 27/06/2015
+ * License : MIT
+ * Version : 1.3.2
+ * Author : Vincent Loy <vincent.loy1@gmail.com>
+ * Contributors : 
+ *  - Justin Beasley <JustinB@harvest.org>
+ *  - Nathan Smith <NathanS@harvest.org>
+ */
+/*global window, document*/
+(function (exports) {
+    'use strict';
+
+    var // functions
+        extend,
+        createElements,
+        createCountdownElt,
+        simplyCountdown;
+
+    /**
+     * Function that merge user parameters with defaults one.
+     * @param out
+     * @returns {*|{}}
+     */
+    extend = function (out) {
+        var i,
+            obj,
+            key;
+        out = out || {};
+
+        for (i = 1; i < arguments.length; i += 1) {
+            obj = arguments[i];
+
+            if (obj) {
+                for (key in obj) {
+                    if (obj.hasOwnProperty(key)) {
+                        if (typeof obj[key] === 'object') {
+                            extend(out[key], obj[key]);
+                        } else {
+                            out[key] = obj[key];
+                        }
+                    }
+                }
+            }
+        }
+
+        return out;
+    };
+
+    /**
+     * Function that create a countdown section
+     * @param countdown
+     * @param parameters
+     * @param typeClass
+     * @returns {{full: (*|Element), amount: (*|Element), word: (*|Element)}}
+     */
+    createCountdownElt = function (countdown, parameters, typeClass) {
+        var innerSectionTag,
+            sectionTag,
+            amountTag,
+            wordTag;
+
+        sectionTag = document.createElement('div');
+        amountTag = document.createElement('span');
+        wordTag = document.createElement('span');
+        innerSectionTag = document.createElement('div');
+
+        innerSectionTag.appendChild(amountTag);
+        innerSectionTag.appendChild(wordTag);
+        sectionTag.appendChild(innerSectionTag);
+
+        sectionTag.classList.add(parameters.sectionClass);
+        sectionTag.classList.add(typeClass);
+        amountTag.classList.add(parameters.amountClass);
+        wordTag.classList.add(parameters.wordClass);
+
+        countdown.appendChild(sectionTag);
+
+        return {
+            full: sectionTag,
+            amount: amountTag,
+            word: wordTag
+        };
+    };
+
+    /**
+     * Function that create full countdown DOM elements calling createCountdownElt
+     * @param parameters
+     * @param countdown
+     * @returns {{days: (*|Element), hours: (*|Element), minutes: (*|Element), seconds: (*|Element)}}
+     */
+    createElements = function (parameters, countdown) {
+        var spanTag;
+
+        if (!parameters.inline) {
+            return {
+                days: createCountdownElt(countdown, parameters, 'simply-days-section'),
+                hours: createCountdownElt(countdown, parameters, 'simply-hours-section'),
+                minutes: createCountdownElt(countdown, parameters, 'simply-minutes-section'),
+                seconds: createCountdownElt(countdown, parameters, 'simply-seconds-section')
+            };
+        }
+
+        spanTag = document.createElement('span');
+        spanTag.classList.add(parameters.inlineClass);
+        return spanTag;
+    };
+
+    /**
+     * simplyCountdown, create and display the coundtown.
+     * @param elt
+     * @param args (parameters)
+     */
+    simplyCountdown = function (elt, args) {
+        var parameters = extend({
+                year: 2017,
+                month: 6,
+                day: 16,
+                hours: 0,
+                minutes: 0,
+                seconds: 0,
+                words: {
+                    days: 'day',
+                    hours: 'hour',
+                    minutes: 'minute',
+                    seconds: 'second',
+                    pluralLetter: 's'
+                },
+                plural: true,
+                inline: false,
+                enableUtc: true,
+                onEnd: function () {
+                    return;
+                },
+                refresh: 1000,
+                inlineClass: 'simply-countdown-inline',
+                sectionClass: 'simply-section',
+                amountClass: 'simply-amount',
+                wordClass: 'simply-word',
+                zeroPad: false
+            }, args),
+            interval,
+            targetDate,
+            targetTmpDate,
+            now,
+            nowUtc,
+            secondsLeft,
+            days,
+            hours,
+            minutes,
+            seconds,
+            cd = document.querySelectorAll(elt);
+
+        targetTmpDate = new Date(
+            parameters.year,
+            parameters.month - 1,
+            parameters.day,
+            parameters.hours,
+            parameters.minutes,
+            parameters.seconds
+        );
+
+        if (parameters.enableUtc) {
+            targetDate = new Date(
+                targetTmpDate.getUTCFullYear(),
+                targetTmpDate.getUTCMonth(),
+                targetTmpDate.getUTCDate(),
+                targetTmpDate.getUTCHours(),
+                targetTmpDate.getUTCMinutes(),
+                targetTmpDate.getUTCSeconds()
+            );
+        } else {
+            targetDate = targetTmpDate;
+        }
+
+        Array.prototype.forEach.call(cd, function (countdown) {
+            var fullCountDown = createElements(parameters, countdown),
+                refresh;
+
+            refresh = function () {
+                var dayWord,
+                    hourWord,
+                    minuteWord,
+                    secondWord;
+
+                now = new Date();
+                if (parameters.enableUtc) {
+                    nowUtc = new Date(now.getFullYear(), now.getMonth(), now.getDate(),
+                        now.getHours(), now.getMinutes(), now.getSeconds());
+                    secondsLeft = (targetDate - nowUtc.getTime()) / 1000;
+
+                } else {
+                    secondsLeft = (targetDate - now.getTime()) / 1000;
+                }
+
+                if (secondsLeft > 0) {
+                    days = parseInt(secondsLeft / 86400, 10);
+                    secondsLeft = secondsLeft % 86400;
+
+                    hours = parseInt(secondsLeft / 3600, 10);
+                    secondsLeft = secondsLeft % 3600;
+
+                    minutes = parseInt(secondsLeft / 60, 10);
+                    seconds = parseInt(secondsLeft % 60, 10);
+                } else {
+                    days = 0;
+                    hours = 0;
+                    minutes = 0;
+                    seconds = 0;
+                    window.clearInterval(interval);
+                    parameters.onEnd();
+                }
+
+                if (parameters.plural) {
+                    dayWord = days > 1
+                        ? parameters.words.days + parameters.words.pluralLetter
+                        : parameters.words.days;
+
+                    hourWord = hours > 1
+                        ? parameters.words.hours + parameters.words.pluralLetter
+                        : parameters.words.hours;
+
+                    minuteWord = minutes > 1
+                        ? parameters.words.minutes + parameters.words.pluralLetter
+                        : parameters.words.minutes;
+
+                    secondWord = seconds > 1
+                        ? parameters.words.seconds + parameters.words.pluralLetter
+                        : parameters.words.seconds;
+
+                } else {
+                    dayWord = parameters.words.days;
+                    hourWord = parameters.words.hours;
+                    minuteWord = parameters.words.minutes;
+                    secondWord = parameters.words.seconds;
+                }
+
+                /* display an inline countdown into a span tag */
+                if (parameters.inline) {
+                    countdown.innerHTML =
+                        days + ' ' + dayWord + ', ' +
+                        hours + ' ' + hourWord + ', ' +
+                        minutes + ' ' + minuteWord + ', ' +
+                        seconds + ' ' + secondWord + '.';
+
+                } else {
+                    fullCountDown.days.amount.textContent = (parameters.zeroPad && days.toString().length < 2 ? '0' : '') + days;
+                    fullCountDown.days.word.textContent = dayWord;
+
+                    fullCountDown.hours.amount.textContent = (parameters.zeroPad && hours.toString().length < 2 ? '0' : '') + hours;
+                    fullCountDown.hours.word.textContent = hourWord;
+
+                    fullCountDown.minutes.amount.textContent = (parameters.zeroPad && minutes.toString().length < 2 ? '0' : '') + minutes;
+                    fullCountDown.minutes.word.textContent = minuteWord;
+
+                    fullCountDown.seconds.amount.textContent = (parameters.zeroPad && seconds.toString().length < 2 ? '0' : '') + seconds;
+                    fullCountDown.seconds.word.textContent = secondWord;
+                }
+            };
+
+            // Refresh immediately to prevent a Flash of Unstyled Content
+            refresh();
+            interval = window.setInterval(refresh, parameters.refresh);
+        });
+    };
+
+    exports.simplyCountdown = simplyCountdown;
+}(window));
+
+/*global $, jQuery, simplyCountdown*/
+if (window.jQuery) {
+    (function ($, simplyCountdown) {
+        'use strict';
+
+        function simplyCountdownify(el, options) {
+            simplyCountdown(el, options);
+        }
+
+        $.fn.simplyCountdown = function (options) {
+            return simplyCountdownify(this.selector, options);
+        };
+    }(jQuery, simplyCountdown));
+}
--- a/js/lightbox.js
+++ b/js/lightbox.js
@ -0,0 +1,554 @@
+/*!
+ * Lightbox v2.11.3
+ * by Lokesh Dhakar
+ *
+ * More info:
+ * http://lokeshdhakar.com/projects/lightbox2/
+ *
+ * Copyright Lokesh Dhakar
+ * Released under the MIT license
+ * https://github.com/lokesh/lightbox2/blob/master/LICENSE
+ *
+ * @preserve
+ */
+
+// Uses Node, AMD or browser globals to create a module.
+(function (root, factory) {
+    if (typeof define === 'function' && define.amd) {
+        // AMD. Register as an anonymous module.
+        define(['jquery'], factory);
+    } else if (typeof exports === 'object') {
+        // Node. Does not work with strict CommonJS, but
+        // only CommonJS-like environments that support module.exports,
+        // like Node.
+        module.exports = factory(require('jquery'));
+    } else {
+        // Browser globals (root is window)
+        root.lightbox = factory(root.jQuery);
+    }
+}(this, function ($) {
+
+  function Lightbox(options) {
+    this.album = [];
+    this.currentImageIndex = void 0;
+    this.init();
+
+    // options
+    this.options = $.extend({}, this.constructor.defaults);
+    this.option(options);
+  }
+
+  // Descriptions of all options available on the demo site:
+  // http://lokeshdhakar.com/projects/lightbox2/index.html#options
+  Lightbox.defaults = {
+    albumLabel: 'Image %1 of %2',
+    alwaysShowNavOnTouchDevices: false,
+    fadeDuration: 600,
+    fitImagesInViewport: true,
+    imageFadeDuration: 600,
+    // maxWidth: 800,
+    // maxHeight: 600,
+    positionFromTop: 50,
+    resizeDuration: 700,
+    showImageNumberLabel: true,
+    wrapAround: false,
+    disableScrolling: false,
+    /*
+    Sanitize Title
+    If the caption data is trusted, for example you are hardcoding it in, then leave this to false.
+    This will free you to add html tags, such as links, in the caption.
+
+    If the caption data is user submitted or from some other untrusted source, then set this to true
+    to prevent xss and other injection attacks.
+     */
+    sanitizeTitle: false
+  };
+
+  Lightbox.prototype.option = function(options) {
+    $.extend(this.options, options);
+  };
+
+  Lightbox.prototype.imageCountLabel = function(currentImageNum, totalImages) {
+    return this.options.albumLabel.replace(/%1/g, currentImageNum).replace(/%2/g, totalImages);
+  };
+
+  Lightbox.prototype.init = function() {
+    var self = this;
+    // Both enable and build methods require the body tag to be in the DOM.
+    $(document).ready(function() {
+      self.enable();
+      self.build();
+    });
+  };
+
+  // Loop through anchors and areamaps looking for either data-lightbox attributes or rel attributes
+  // that contain 'lightbox'. When these are clicked, start lightbox.
+  Lightbox.prototype.enable = function() {
+    var self = this;
+    $('body').on('click', 'a[rel^=lightbox], area[rel^=lightbox], a[data-lightbox], area[data-lightbox]', function(event) {
+      self.start($(event.currentTarget));
+      return false;
+    });
+  };
+
+  // Build html for the lightbox and the overlay.
+  // Attach event handlers to the new DOM elements. click click click
+  Lightbox.prototype.build = function() {
+    if ($('#lightbox').length > 0) {
+        return;
+    }
+
+    var self = this;
+
+    // The two root notes generated, #lightboxOverlay and #lightbox are given
+    // tabindex attrs so they are focusable. We attach our keyboard event
+    // listeners to these two elements, and not the document. Clicking anywhere
+    // while Lightbox is opened will keep the focus on or inside one of these
+    // two elements.
+    //
+    // We do this so we can prevent propogation of the Esc keypress when
+    // Lightbox is open. This prevents it from intefering with other components
+    // on the page below.
+    //
+    // Github issue: https://github.com/lokesh/lightbox2/issues/663
+    $('<div id="lightboxOverlay" tabindex="-1" class="lightboxOverlay"></div><div id="lightbox" tabindex="-1" class="lightbox"><div class="lb-outerContainer"><div class="lb-container"><img class="lb-image" src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" alt=""/><div class="lb-nav"><a class="lb-prev" aria-label="Previous image" href="" ></a><a class="lb-next" aria-label="Next image" href="" ></a></div><div class="lb-loader"><a class="lb-cancel"></a></div></div></div><div class="lb-dataContainer"><div class="lb-data"><div class="lb-details"><span class="lb-caption"></span><span class="lb-number"></span></div><div class="lb-closeContainer"><a class="lb-close"></a></div></div></div></div>').appendTo($('body'));
+
+    // Cache jQuery objects
+    this.$lightbox       = $('#lightbox');
+    this.$overlay        = $('#lightboxOverlay');
+    this.$outerContainer = this.$lightbox.find('.lb-outerContainer');
+    this.$container      = this.$lightbox.find('.lb-container');
+    this.$image          = this.$lightbox.find('.lb-image');
+    this.$nav            = this.$lightbox.find('.lb-nav');
+
+    // Store css values for future lookup
+    this.containerPadding = {
+      top: parseInt(this.$container.css('padding-top'), 10),
+      right: parseInt(this.$container.css('padding-right'), 10),
+      bottom: parseInt(this.$container.css('padding-bottom'), 10),
+      left: parseInt(this.$container.css('padding-left'), 10)
+    };
+
+    this.imageBorderWidth = {
+      top: parseInt(this.$image.css('border-top-width'), 10),
+      right: parseInt(this.$image.css('border-right-width'), 10),
+      bottom: parseInt(this.$image.css('border-bottom-width'), 10),
+      left: parseInt(this.$image.css('border-left-width'), 10)
+    };
+
+    // Attach event handlers to the newly minted DOM elements
+    this.$overlay.hide().on('click', function() {
+      self.end();
+      return false;
+    });
+
+    this.$lightbox.hide().on('click', function(event) {
+      if ($(event.target).attr('id') === 'lightbox') {
+        self.end();
+      }
+    });
+
+    this.$outerContainer.on('click', function(event) {
+      if ($(event.target).attr('id') === 'lightbox') {
+        self.end();
+      }
+      return false;
+    });
+
+    this.$lightbox.find('.lb-prev').on('click', function() {
+      if (self.currentImageIndex === 0) {
+        self.changeImage(self.album.length - 1);
+      } else {
+        self.changeImage(self.currentImageIndex - 1);
+      }
+      return false;
+    });
+
+    this.$lightbox.find('.lb-next').on('click', function() {
+      if (self.currentImageIndex === self.album.length - 1) {
+        self.changeImage(0);
+      } else {
+        self.changeImage(self.currentImageIndex + 1);
+      }
+      return false;
+    });
+
+    /*
+      Show context menu for image on right-click
+
+      There is a div containing the navigation that spans the entire image and lives above of it. If
+      you right-click, you are right clicking this div and not the image. This prevents users from
+      saving the image or using other context menu actions with the image.
+
+      To fix this, when we detect the right mouse button is pressed down, but not yet clicked, we
+      set pointer-events to none on the nav div. This is so that the upcoming right-click event on
+      the next mouseup will bubble down to the image. Once the right-click/contextmenu event occurs
+      we set the pointer events back to auto for the nav div so it can capture hover and left-click
+      events as usual.
+     */
+    this.$nav.on('mousedown', function(event) {
+      if (event.which === 3) {
+        self.$nav.css('pointer-events', 'none');
+
+        self.$lightbox.one('contextmenu', function() {
+          setTimeout(function() {
+              this.$nav.css('pointer-events', 'auto');
+          }.bind(self), 0);
+        });
+      }
+    });
+
+
+    this.$lightbox.find('.lb-loader, .lb-close').on('click', function() {
+      self.end();
+      return false;
+    });
+  };
+
+  // Show overlay and lightbox. If the image is part of a set, add siblings to album array.
+  Lightbox.prototype.start = function($link) {
+    var self    = this;
+    var $window = $(window);
+
+    $window.on('resize', $.proxy(this.sizeOverlay, this));
+
+    this.sizeOverlay();
+
+    this.album = [];
+    var imageNumber = 0;
+
+    function addToAlbum($link) {
+      self.album.push({
+        alt: $link.attr('data-alt'),
+        link: $link.attr('href'),
+        title: $link.attr('data-title') || $link.attr('title')
+      });
+    }
+
+    // Support both data-lightbox attribute and rel attribute implementations
+    var dataLightboxValue = $link.attr('data-lightbox');
+    var $links;
+
+    if (dataLightboxValue) {
+      $links = $($link.prop('tagName') + '[data-lightbox="' + dataLightboxValue + '"]');
+      for (var i = 0; i < $links.length; i = ++i) {
+        addToAlbum($($links[i]));
+        if ($links[i] === $link[0]) {
+          imageNumber = i;
+        }
+      }
+    } else {
+      if ($link.attr('rel') === 'lightbox') {
+        // If image is not part of a set
+        addToAlbum($link);
+      } else {
+        // If image is part of a set
+        $links = $($link.prop('tagName') + '[rel="' + $link.attr('rel') + '"]');
+        for (var j = 0; j < $links.length; j = ++j) {
+          addToAlbum($($links[j]));
+          if ($links[j] === $link[0]) {
+            imageNumber = j;
+          }
+        }
+      }
+    }
+
+    // Position Lightbox
+    var top  = $window.scrollTop() + this.options.positionFromTop;
+    var left = $window.scrollLeft();
+    this.$lightbox.css({
+      top: top + 'px',
+      left: left + 'px'
+    }).fadeIn(this.options.fadeDuration);
+
+    // Disable scrolling of the page while open
+    if (this.options.disableScrolling) {
+      $('body').addClass('lb-disable-scrolling');
+    }
+
+    this.changeImage(imageNumber);
+  };
+
+  // Hide most UI elements in preparation for the animated resizing of the lightbox.
+  Lightbox.prototype.changeImage = function(imageNumber) {
+    var self = this;
+    var filename = this.album[imageNumber].link;
+    var filetype = filename.split('.').slice(-1)[0];
+    var $image = this.$lightbox.find('.lb-image');
+
+    // Disable keyboard nav during transitions
+    this.disableKeyboardNav();
+
+    // Show loading state
+    this.$overlay.fadeIn(this.options.fadeDuration);
+    $('.lb-loader').fadeIn('slow');
+    this.$lightbox.find('.lb-image, .lb-nav, .lb-prev, .lb-next, .lb-dataContainer, .lb-numbers, .lb-caption').hide();
+    this.$outerContainer.addClass('animating');
+
+    // When image to show is preloaded, we send the width and height to sizeContainer()
+    var preloader = new Image();
+    preloader.onload = function() {
+      var $preloader;
+      var imageHeight;
+      var imageWidth;
+      var maxImageHeight;
+      var maxImageWidth;
+      var windowHeight;
+      var windowWidth;
+
+      $image.attr({
+        'alt': self.album[imageNumber].alt,
+        'src': filename
+      });
+
+      $preloader = $(preloader);
+
+      $image.width(preloader.width);
+      $image.height(preloader.height);
+      windowWidth = $(window).width();
+      windowHeight = $(window).height();
+
+      // Calculate the max image dimensions for the current viewport.
+      // Take into account the border around the image and an additional 10px gutter on each side.
+      maxImageWidth  = windowWidth - self.containerPadding.left - self.containerPadding.right - self.imageBorderWidth.left - self.imageBorderWidth.right - 20;
+      maxImageHeight = windowHeight - self.containerPadding.top - self.containerPadding.bottom - self.imageBorderWidth.top - self.imageBorderWidth.bottom - self.options.positionFromTop - 70;
+
+      /*
+      Since many SVGs have small intrinsic dimensions, but they support scaling
+      up without quality loss because of their vector format, max out their
+      size.
+      */
+      if (filetype === 'svg') {
+        $image.width(maxImageWidth);
+        $image.height(maxImageHeight);
+      }
+
+      // Fit image inside the viewport.
+      if (self.options.fitImagesInViewport) {
+
+        // Check if image size is larger then maxWidth|maxHeight in settings
+        if (self.options.maxWidth && self.options.maxWidth < maxImageWidth) {
+          maxImageWidth = self.options.maxWidth;
+        }
+        if (self.options.maxHeight && self.options.maxHeight < maxImageHeight) {
+          maxImageHeight = self.options.maxHeight;
+        }
+
+      } else {
+        maxImageWidth = self.options.maxWidth || preloader.width || maxImageWidth;
+        maxImageHeight = self.options.maxHeight || preloader.height || maxImageHeight;
+      }
+
+      // Is the current image's width or height is greater than the maxImageWidth or maxImageHeight
+      // option than we need to size down while maintaining the aspect ratio.
+      if ((preloader.width > maxImageWidth) || (preloader.height > maxImageHeight)) {
+        if ((preloader.width / maxImageWidth) > (preloader.height / maxImageHeight)) {
+          imageWidth  = maxImageWidth;
+          imageHeight = parseInt(preloader.height / (preloader.width / imageWidth), 10);
+          $image.width(imageWidth);
+          $image.height(imageHeight);
+        } else {
+          imageHeight = maxImageHeight;
+          imageWidth = parseInt(preloader.width / (preloader.height / imageHeight), 10);
+          $image.width(imageWidth);
+          $image.height(imageHeight);
+        }
+      }
+      self.sizeContainer($image.width(), $image.height());
+    };
+
+    // Preload image before showing
+    preloader.src = this.album[imageNumber].link;
+    this.currentImageIndex = imageNumber;
+  };
+
+  // Stretch overlay to fit the viewport
+  Lightbox.prototype.sizeOverlay = function() {
+    var self = this;
+    /*
+    We use a setTimeout 0 to pause JS execution and let the rendering catch-up.
+    Why do this? If the `disableScrolling` option is set to true, a class is added to the body
+    tag that disables scrolling and hides the scrollbar. We want to make sure the scrollbar is
+    hidden before we measure the document width, as the presence of the scrollbar will affect the
+    number.
+    */
+    setTimeout(function() {
+      self.$overlay
+        .width($(document).width())
+        .height($(document).height());
+
+    }, 0);
+  };
+
+  // Animate the size of the lightbox to fit the image we are showing
+  // This method also shows the the image.
+  Lightbox.prototype.sizeContainer = function(imageWidth, imageHeight) {
+    var self = this;
+
+    var oldWidth  = this.$outerContainer.outerWidth();
+    var oldHeight = this.$outerContainer.outerHeight();
+    var newWidth  = imageWidth + this.containerPadding.left + this.containerPadding.right + this.imageBorderWidth.left + this.imageBorderWidth.right;
+    var newHeight = imageHeight + this.containerPadding.top + this.containerPadding.bottom + this.imageBorderWidth.top + this.imageBorderWidth.bottom;
+
+    function postResize() {
+      self.$lightbox.find('.lb-dataContainer').width(newWidth);
+      self.$lightbox.find('.lb-prevLink').height(newHeight);
+      self.$lightbox.find('.lb-nextLink').height(newHeight);
+
+      // Set focus on one of the two root nodes so keyboard events are captured.
+      self.$overlay.focus();
+
+      self.showImage();
+    }
+
+    if (oldWidth !== newWidth || oldHeight !== newHeight) {
+      this.$outerContainer.animate({
+        width: newWidth,
+        height: newHeight
+      }, this.options.resizeDuration, 'swing', function() {
+        postResize();
+      });
+    } else {
+      postResize();
+    }
+  };
+
+  // Display the image and its details and begin preload neighboring images.
+  Lightbox.prototype.showImage = function() {
+    this.$lightbox.find('.lb-loader').stop(true).hide();
+    this.$lightbox.find('.lb-image').fadeIn(this.options.imageFadeDuration);
+
+    this.updateNav();
+    this.updateDetails();
+    this.preloadNeighboringImages();
+    this.enableKeyboardNav();
+  };
+
+  // Display previous and next navigation if appropriate.
+  Lightbox.prototype.updateNav = function() {
+    // Check to see if the browser supports touch events. If so, we take the conservative approach
+    // and assume that mouse hover events are not supported and always show prev/next navigation
+    // arrows in image sets.
+    var alwaysShowNav = false;
+    try {
+      document.createEvent('TouchEvent');
+      alwaysShowNav = (this.options.alwaysShowNavOnTouchDevices) ? true : false;
+    } catch (e) {}
+
+    this.$lightbox.find('.lb-nav').show();
+
+    if (this.album.length > 1) {
+      if (this.options.wrapAround) {
+        if (alwaysShowNav) {
+          this.$lightbox.find('.lb-prev, .lb-next').css('opacity', '1');
+        }
+        this.$lightbox.find('.lb-prev, .lb-next').show();
+      } else {
+        if (this.currentImageIndex > 0) {
+          this.$lightbox.find('.lb-prev').show();
+          if (alwaysShowNav) {
+            this.$lightbox.find('.lb-prev').css('opacity', '1');
+          }
+        }
+        if (this.currentImageIndex < this.album.length - 1) {
+          this.$lightbox.find('.lb-next').show();
+          if (alwaysShowNav) {
+            this.$lightbox.find('.lb-next').css('opacity', '1');
+          }
+        }
+      }
+    }
+  };
+
+  // Display caption, image number, and closing button.
+  Lightbox.prototype.updateDetails = function() {
+    var self = this;
+
+    // Enable anchor clicks in the injected caption html.
+    // Thanks Nate Wright for the fix. @https://github.com/NateWr
+    if (typeof this.album[this.currentImageIndex].title !== 'undefined' &&
+      this.album[this.currentImageIndex].title !== '') {
+      var $caption = this.$lightbox.find('.lb-caption');
+      if (this.options.sanitizeTitle) {
+        $caption.text(this.album[this.currentImageIndex].title);
+      } else {
+        $caption.html(this.album[this.currentImageIndex].title);
+      }
+      $caption.fadeIn('fast');
+    }
+
+    if (this.album.length > 1 && this.options.showImageNumberLabel) {
+      var labelText = this.imageCountLabel(this.currentImageIndex + 1, this.album.length);
+      this.$lightbox.find('.lb-number').text(labelText).fadeIn('fast');
+    } else {
+      this.$lightbox.find('.lb-number').hide();
+    }
+
+    this.$outerContainer.removeClass('animating');
+
+    this.$lightbox.find('.lb-dataContainer').fadeIn(this.options.resizeDuration, function() {
+      return self.sizeOverlay();
+    });
+  };
+
+  // Preload previous and next images in set.
+  Lightbox.prototype.preloadNeighboringImages = function() {
+    if (this.album.length > this.currentImageIndex + 1) {
+      var preloadNext = new Image();
+      preloadNext.src = this.album[this.currentImageIndex + 1].link;
+    }
+    if (this.currentImageIndex > 0) {
+      var preloadPrev = new Image();
+      preloadPrev.src = this.album[this.currentImageIndex - 1].link;
+    }
+  };
+
+  Lightbox.prototype.enableKeyboardNav = function() {
+    this.$lightbox.on('keyup.keyboard', $.proxy(this.keyboardAction, this));
+    this.$overlay.on('keyup.keyboard', $.proxy(this.keyboardAction, this));
+  };
+
+  Lightbox.prototype.disableKeyboardNav = function() {
+    this.$lightbox.off('.keyboard');
+    this.$overlay.off('.keyboard');
+  };
+
+  Lightbox.prototype.keyboardAction = function(event) {
+    var KEYCODE_ESC        = 27;
+    var KEYCODE_LEFTARROW  = 37;
+    var KEYCODE_RIGHTARROW = 39;
+
+    var keycode = event.keyCode;
+    if (keycode === KEYCODE_ESC) {
+      // Prevent bubbling so as to not affect other components on the page.
+      event.stopPropagation();
+      this.end();
+    } else if (keycode === KEYCODE_LEFTARROW) {
+      if (this.currentImageIndex !== 0) {
+        this.changeImage(this.currentImageIndex - 1);
+      } else if (this.options.wrapAround && this.album.length > 1) {
+        this.changeImage(this.album.length - 1);
+      }
+    } else if (keycode === KEYCODE_RIGHTARROW) {
+      if (this.currentImageIndex !== this.album.length - 1) {
+        this.changeImage(this.currentImageIndex + 1);
+      } else if (this.options.wrapAround && this.album.length > 1) {
+        this.changeImage(0);
+      }
+    }
+  };
+
+  // Closing time. :-(
+  Lightbox.prototype.end = function() {
+    this.disableKeyboardNav();
+    $(window).off('resize', this.sizeOverlay);
+    this.$lightbox.fadeOut(this.options.fadeDuration);
+    this.$overlay.fadeOut(this.options.fadeDuration);
+
+    if (this.options.disableScrolling) {
+      $('body').removeClass('lb-disable-scrolling');
+    }
+  };
+
+  return new Lightbox();
+}));
--- a/js/moment-with-locales.js
+++ b/js/moment-with-locales.js
--- a/js/script.js
+++ b/js/script.js
@ -0,0 +1,222 @@
+(function($) {
+
+    "use strict";
+    /*------------------------------------------
+        = ACTIVE POPUP IMAGE
+    -------------------------------------------*/
+    if ($(".fancybox").length) {
+        $(".fancybox").fancybox({
+            openEffect  : "elastic",
+            closeEffect : "elastic",
+            wrapCSS     : "project-fancybox-title-style"
+        });
+    }
+
+
+    /*------------------------------------------
+        = POPUP VIDEO
+    -------------------------------------------*/
+    if ($(".video-play-btn").length) {
+        $(".video-play-btn").on("click", function(){
+            $.fancybox({
+                href: this.href,
+                type: $(this).data("type"),
+                'title'         : this.title,
+                helpers     : {
+                    title : { type : 'inside' },
+                    media : {}
+                },
+
+                beforeShow : function(){
+                    $(".fancybox-wrap").addClass("gallery-fancybox");
+                }
+            });
+            return false
+        });
+    }
+
+
+    /* =================
+        sampul awal THE BEGINING
+    =================*/
+
+    $('#konten').hide(); //hided konten scr deafult
+    $(".thebegining").click(function(){
+        $(this).hide(); //hide the begining
+        $('#konten').show()  //show konten
+        $("#audio").get(0).play(); //play musik
+        document.documentElement.requestFullscreen();  //fullscreen
+    
+    });
+
+     /*------------------------------------------
+        = NAV BOTTOM BAR
+    -------------------------------------------*/
+
+    var navItems = document.querySelectorAll(".mobile-bottom-nav__item");
+        navItems.forEach(function(e, i) {
+            e.addEventListener("click", function(e) {
+                navItems.forEach(function(e2, i2) {
+                    e2.classList.remove("mobile-bottom-nav__item--active");
+                })
+                this.classList.add("mobile-bottom-nav__item--active");
+            });
+        });
+
+
+    $(".icons").click(function(){
+
+        $("#nav2").animate({
+            height: "toggle",
+            opacity: "toggle",
+          },100, 'linear');
+
+        $("#lain").animate({
+            height: "toggle",
+            opacity: "toggle",
+          },200, 'linear');
+
+        $("#tutup").toggleClass('rotate');
+
+    });
+
+    $("#lain").click(function(){
+
+        $("#nav2").animate({
+            height: "toggle",
+            opacity: "toggle",
+          },100, 'linear');
+
+        $("#lain").animate({
+            height: "toggle",
+            opacity: "toggle",
+          },200, 'linear');
+
+        $("#tutup").toggleClass('rotate');
+
+    });
+
+    var $allContentDivs = $('#sampul-konten, #mempelai-konten, #acara-konten, #album-konten, #ucapan-konten, #lokasi-konten, #cerita-konten').hide(); // Hide All Content Divs
+    
+    $("#sampul-konten").show();
+    $(".dekorasi-sampul").show();
+    $(".dekorasi-all").hide();
+    
+
+    $('#sampul, #mempelai, #acara, #album, #ucapan, #lokasi, #cerita').click(function(){
+        var $contentDiv = $("#" + this.id + "-konten");
+
+        if(this.id == "sampul"){
+            
+            $("#imgbawah").hide();
+            $(".dekorasi-sampul").show();
+            $(".dekorasi-all").hide();
+            // $("#imgatas").hide();
+
+        }else{
+
+            $("#imgbawah").show();
+            $(".dekorasi-sampul").hide();
+            $(".dekorasi-all").show();    
+
+            
+        }
+        if($contentDiv.is(":visible")) {
+        } else {            
+            $allContentDivs.hide(); // Hide All Divs
+            $contentDiv.show(); // Show Div
+        }
+        
+        $('body,html').animate({
+                scrollTop: 0
+        }, 600);
+
+    });
+
+    /*=======================================
+        Load more content with jQuery - May 21, 2013
+        (c) 2013 @ElmahdiMahmoud
+    ================================*/   
+
+    $(".komen").slice(0, 4).show();
+    $("#loadMore").on('click', function (e) {
+        e.preventDefault();
+        $(".komen:hidden").slice(0, 4).slideDown();
+        if ($(".komen:hidden").length == 0) {
+            $("#loadMore").fadeOut('slow');
+        }
+        $('html,body').animate({
+            scrollTop: $(this).offset().top
+        }, 1500);
+    });
+
+
+    /*=================
+     FORMAT TANGGAL
+    ======================= */
+    moment.locale('id'); //set indonesian format
+
+    //output = Senin, 17 Agustus 2020
+    var date_resepsi = moment(tanggal_resepsi).format('dddd, Do MMMM YYYY'); 
+    var date_akad = moment(tanggal_akad).format('dddd, Do MMMM YYYY'); 
+
+    //output = 17 / 08 / 2020
+    var date_pernikahan = moment(tanggal_resepsi).format('DD / MM / YYYY'); //untuk sampul
+
+
+    $('#tanggal-acara-resepsi').html(date_resepsi);
+    $('#tanggal-acara-akad').html(date_akad);
+    $('.tanggal-weddingnya').html(date_pernikahan); //untuk sampul
+
+    /*=================
+     ADD KOMENTAR
+    ======================= */
+    $('#submitKomen').on('click', function(event) {
+        $("form[name='rsvpucapan']").validate({
+            ignore: ".ignore",
+            rules: {
+                namatamu: "required",
+                kehadiran: "required",
+                pesantamu: "required",
+            },
+            errorClass: 'isidulu',
+            errorPlacement: function(error, element) {
+            },
+            submitHandler: function(form) {
+                $('#loading_').css('display','inline');
+                $('#submitKomen').css('display','none');
+                var nama =  $('#nama').val();
+                var kehadiran =  $('#kehadiran').val();
+                var komentar =  $('#komentar').val();
+                $.ajax({
+                    url : base_url+'/add_komentar',
+                    method : "POST",
+                    data : {nama: nama,kehadiran: kehadiran,komentar: komentar},
+                    async : true,
+                    dataType : 'html',
+                    success: function(hasil){
+                        var json = JSON.parse(hasil);
+                        var status = json.status;
+                        var nama = json.nama;
+                        var kehadiran = json.kehadiran;
+                        var komentar = json.komentar;
+                        console.log(json);
+        
+                        if(status == 'sukses'){
+                            $('.layout-komen2').append("<div class='komen2' style='display:block'><div class='col-12 komen-nama'>"+nama+"<i class='"+kehadiran+"' style='margin-left:3px;border-radius:2px;font-size:10px;padding:2px;padding-left:5px;padding-right:5px;'>"+kehadiran+"</i></div><div class='col-12 komen-isi'>"+komentar+"</div></div>");
+                            $('html, body').animate({
+                                scrollTop: $("#komen-netizen").offset().top
+                            }, 2000);
+                            $('.layout-komen2').css('display', '');
+                            $('#loading_').css('display','none');
+                            $('#submitKomen').css('display','block');
+                            $('#submitKomen').prop('disabled', true); 
+                        }
+                    }
+                });
+            }
+        });
+    });
+
+})(window.jQuery);
+
--- a/musik/musik.mp3
+++ b/musik/musik.mp3
				`@ -0,0 +1 @@`
				.owl-carousel .animated{-webkit-animation-duration:1000ms;animation-duration:1000ms;-webkit-animation-fill-mode:both;animation-fill-mode:both}.owl-carousel .owl-animated-in{z-index:0}.owl-carousel .owl-animated-out{z-index:1}.owl-carousel .fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut}@-webkit-keyframes fadeOut{0%{opacity:1}100%{opacity:0}}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.owl-height{-webkit-transition:height 500ms ease-in-out;-moz-transition:height 500ms ease-in-out;-ms-transition:height 500ms ease-in-out;-o-transition:height 500ms ease-in-out;transition:height 500ms ease-in-out}.owl-carousel{display:none;width:100%;-webkit-tap-highlight-color:transparent;position:relative;z-index:1}.owl-carousel .owl-stage{position:relative;-ms-touch-action:pan-Y}.owl-carousel .owl-stage:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}.owl-carousel .owl-stage-outer{position:relative;overflow:hidden;-webkit-transform:translate3d(0px,0,0)}.owl-carousel .owl-controls .owl-dot,.owl-carousel .owl-controls .owl-nav .owl-next,.owl-carousel .owl-controls .owl-nav .owl-prev{cursor:pointer;cursor:hand;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-loaded{display:block}.owl-carousel.owl-loading{opacity:0;display:block}.owl-carousel.owl-hidden{opacity:0}.owl-carousel .owl-refresh .owl-item{display:none}.owl-carousel .owl-item{position:relative;min-height:1px;float:left;-webkit-backface-visibility:hidden;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel .owl-item img{display:block;width:100%;-webkit-transform-style:preserve-3d}.owl-carousel.owl-text-select-on .owl-item{-webkit-user-select:auto;-moz-user-select:auto;-ms-user-select:auto;user-select:auto}.owl-carousel .owl-grab{cursor:move;cursor:-webkit-grab;cursor:-o-grab;cursor:-ms-grab;cursor:grab}.owl-carousel.owl-rtl{direction:rtl}.owl-carousel.owl-rtl .owl-item{float:right}.no-js .owl-carousel{display:block}.owl-carousel .owl-item .owl-lazy{opacity:0;-webkit-transition:opacity 400ms ease;-moz-transition:opacity 400ms ease;-ms-transition:opacity 400ms ease;-o-transition:opacity 400ms ease;transition:opacity 400ms ease}.owl-carousel .owl-item img{transform-style:preserve-3d}.owl-carousel .owl-video-wrapper{position:relative;height:100%;background:#000}.owl-carousel .owl-video-play-icon{position:absolute;height:80px;width:80px;left:50%;top:50%;margin-left:-40px;margin-top:-40px;background:url(../images/css-owl.video.play.png) no-repeat;cursor:pointer;z-index:1;-webkit-backface-visibility:hidden;-webkit-transition:scale 100ms ease;-moz-transition:scale 100ms ease;-ms-transition:scale 100ms ease;-o-transition:scale 100ms ease;transition:scale 100ms ease}.owl-carousel .owl-video-play-icon:hover{-webkit-transition:scale(1.3,1.3);-moz-transition:scale(1.3,1.3);-ms-transition:scale(1.3,1.3);-o-transition:scale(1.3,1.3);transition:scale(1.3,1.3)}.owl-carousel .owl-video-playing .owl-video-play-icon,.owl-carousel .owl-video-playing .owl-video-tn{display:none}.owl-carousel .owl-video-tn{opacity:0;height:100%;background-position:center center;background-repeat:no-repeat;-webkit-background-size:contain;-moz-background-size:contain;-o-background-size:contain;background-size:contain;-webkit-transition:opacity 400ms ease;-moz-transition:opacity 400ms ease;-ms-transition:opacity 400ms ease;-o-transition:opacity 400ms ease;transition:opacity 400ms ease}.owl-carousel .owl-video-frame{position:relative;z-index:1}
				`@ -0,0 +1 @@`
				.owl-theme .owl-controls{margin-top:10px;text-align:center;-webkit-tap-highlight-color:transparent}.owl-theme .owl-controls .owl-nav [class=owl-]{color:#fff;font-size:14px;margin:5px;padding:4px 7px;background:#d6d6d6;display:inline-block;cursor:pointer;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px}.owl-theme .owl-controls .owl-nav [class=owl-]:hover{background:#869791;color:#fff;text-decoration:none}.owl-theme .owl-controls .owl-nav .disabled{opacity:.5;cursor:default}.owl-theme .owl-dots .owl-dot{display:inline-block;zoom:1;*display:inline}.owl-theme .owl-dots .owl-dot span{width:10px;height:10px;margin:5px 7px;background:#d6d6d6;display:block;-webkit-backface-visibility:visible;-webkit-transition:opacity 200ms ease;-moz-transition:opacity 200ms ease;-ms-transition:opacity 200ms ease;-o-transition:opacity 200ms ease;transition:opacity 200ms ease;-webkit-border-radius:30px;-moz-border-radius:30px;border-radius:30px}.owl-theme .owl-dots .owl-dot.active span,.owl-theme .owl-dots .owl-dot:hover span{background:#869791}