@charset "utf-8";
* { box-sizing : border-box;}

/*------ başkasının fontuna güvenme ! ---------*/
/* poppins-300 - latin-ext_latin */
@font-face {
   font-family : 'Poppins';
   font-style  : normal;
   font-weight : 300;
   font-display: swap;
   src         : url('../fonts/poppins-v15-latin-ext_latin-300.eot');
   src         : local(''),
   url('../fonts/poppins-v15-latin-ext_latin-300.eot?#iefix') format('embedded-opentype'),
   url('../fonts/poppins-v15-latin-ext_latin-300.woff2') format('woff2'),
   url('../fonts/poppins-v15-latin-ext_latin-300.woff') format('woff'),
   url('../fonts/poppins-v15-latin-ext_latin-300.ttf') format('truetype'),
   url('../fonts/poppins-v15-latin-ext_latin-300.svg#Poppins') format('svg');
   }

/* poppins-regular - latin-ext_latin */
@font-face {
   font-family : 'Poppins';
   font-style  : normal;
   font-weight : 400;
   font-display: swap;
   src         : url('../fonts/poppins-v15-latin-ext_latin-regular.eot');
   src         : local(''),
   url('../fonts/poppins-v15-latin-ext_latin-regular.eot?#iefix') format('embedded-opentype'),
   url('../fonts/poppins-v15-latin-ext_latin-regular.woff2') format('woff2'),
   url('../fonts/poppins-v15-latin-ext_latin-regular.woff') format('woff'),
   url('../fonts/poppins-v15-latin-ext_latin-regular.ttf') format('truetype'),
   url('../fonts/poppins-v15-latin-ext_latin-regular.svg#Poppins') format('svg');
   }

/* poppins-900 - latin-ext_latin */
@font-face {
   font-family : 'Poppins';
   font-style  : normal;
   font-weight : 900;
   font-display: swap;
   src         : url('../fonts/poppins-v15-latin-ext_latin-900.eot');
   src         : local(''),
   url('../fonts/poppins-v15-latin-ext_latin-900.eot?#iefix') format('embedded-opentype'),
   url('../fonts/poppins-v15-latin-ext_latin-900.woff2') format('woff2'),
   url('../fonts/poppins-v15-latin-ext_latin-900.woff') format('woff'),
   url('../fonts/poppins-v15-latin-ext_latin-900.ttf') format('truetype'),
   url('../fonts/poppins-v15-latin-ext_latin-900.svg#Poppins') format('svg');
   }

/* oswald-300 - latin-ext_latin */
@font-face {
   font-family : 'Oswald';
   font-style  : normal;
   font-weight : 300;
   font-display: swap;
   src         : url('../fonts/oswald-v40-latin-ext_latin-300.eot');
   src         : local(''),
   url('../fonts/oswald-v40-latin-ext_latin-300.eot?#iefix') format('embedded-opentype'),
   url('../fonts/oswald-v40-latin-ext_latin-300.woff2') format('woff2'),
   url('../fonts/oswald-v40-latin-ext_latin-300.woff') format('woff'),
   url('../fonts/oswald-v40-latin-ext_latin-300.ttf') format('truetype'),
   url('../fonts/oswald-v40-latin-ext_latin-300.svg#Oswald') format('svg');
   }

/* oswald-regular - latin-ext_latin */
@font-face {
   font-family : 'Oswald';
   font-style  : normal;
   font-weight : 400;
   font-display: swap;
   src         : url('../fonts/oswald-v40-latin-ext_latin-regular.eot');
   src         : local(''),
   url('../fonts/oswald-v40-latin-ext_latin-regular.eot?#iefix') format('embedded-opentype'),
   url('../fonts/oswald-v40-latin-ext_latin-regular.woff2') format('woff2'),
   url('../fonts/oswald-v40-latin-ext_latin-regular.woff') format('woff'),
   url('../fonts/oswald-v40-latin-ext_latin-regular.ttf') format('truetype'),
   url('../fonts/oswald-v40-latin-ext_latin-regular.svg#Oswald') format('svg');
   }

/* oswald-700 - latin-ext_latin */
@font-face {
   font-family : 'Oswald';
   font-style  : normal;
   font-weight : 700;
   font-display: swap;
   src         : url('../fonts/oswald-v40-latin-ext_latin-700.eot');
   src         : local(''),
   url('../fonts/oswald-v40-latin-ext_latin-700.eot?#iefix') format('embedded-opentype'),
   url('../fonts/oswald-v40-latin-ext_latin-700.woff2') format('woff2'),
   url('../fonts/oswald-v40-latin-ext_latin-700.woff') format('woff'),
   url('../fonts/oswald-v40-latin-ext_latin-700.ttf') format('truetype'),
   url('../fonts/oswald-v40-latin-ext_latin-700.svg#Oswald') format('svg');
   }

/*-------// font -----------*/

body {
   font-family : 'Poppins', sans-serif;
   overflow-x  : hidden;
   margin      : 0;
   color       : #d5d3d3;
   }

a:active,
a:focus {
   text-decoration : none;
   color           : initial;
   outline         : none;
   }

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
   font-weight : 600;
   color       : inherit;
   }

.bg {
   background      : url('bg1.html') no-repeat;
   background-size : cover;
   }

img { max-width : 100%; }

.z-index1 { z-index : 1; }
.z-index2 { z-index : 2; }
.z-index3 { z-index : 3; }
.z-index4 { z-index : 4; }
.z-index5 { z-index : 5; }
.z-index6 { z-index : 6; }
.z-index7 { z-index : 7; }
.z-index8 { z-index : 8; }
.z-index9 { z-index : 9; }
.z-index10 { z-index : 10; }

.box-shadow-0 {box-shadow : none !important;}
.box-shadow-2 { box-shadow : -5px 5px 30px rgba(0, 0, 0, 0.4) !important; }

.cursor-ew-resize { cursor : ew-resize; }

.section-title {
   font-weight : 400;
   color       : #fff;
   }

.big-text {
   font-size      : 16px;
   letter-spacing : 0.8px;
   }

::selection {
   color      : #fff;
   background : #000;
   }

iframe {
   min-width  : 100%;
   min-height : 100%;
   border     : none;
   }

/*Full width style*/
.fullWidth {
   width  : 100%;
   height : 100%;
   }

.absoluteFullWidth {
   position : absolute !important;
   top      : 0;
   left     : 0;
   width    : 100%;
   height   : 100%;
   }

.fixedFullWidth {
   position : fixed !important;
   top      : 0;
   left     : 0;
   width    : 100%;
   height   : 100%;
   }

canvas {
   position : absolute !important;
   z-index  : 0;
   top      : 0;
   right    : 0;
   bottom   : 0;
   left     : 0;
   }

.overlay {
   position        : fixed;
   z-index         : 0;
   top             : 0;
   right           : 0;
   bottom          : 0;
   left            : 0;
   background      : rgba(0, 0, 0, 1);
   background-size : cover;
   }

.wrapper {
   position : relative;
   z-index  : 2;
   }

.main-wrapper {
   display         : flex;
   overflow        : auto;
   align-items     : center;
   justify-content : center;
   min-height      : 100vh;
   }

.main-content {
   position      : relative;
   overflow      : hidden;
   width         : 50%;
   max-width     : 515px;
   padding       : 0 20px;
   text-align    : center;
   border-radius : 5px;
   background    : rgba(12, 12, 12, 0.81);
   box-shadow    : -15px 15px 40px rgba(0, 0, 0, 0.4);
   }

@media only screen and (min-width : 901px) {
   .main-wrapper.box-right-align {
      justify-content : flex-end;
      }

   .main-wrapper.box-right-align .main-content {
      right : 7%;
      }

   .main-wrapper.box-left-align {
      justify-content : flex-start;
      }

   .main-wrapper.box-left-align .main-content {
      left : 7%;
      }
   }

.main-content.opacity-0 { background : rgba(12, 12, 12, 0); }
.main-content.opacity-1 { background : rgba(12, 12, 12, 0.10); }
.main-content.opacity-2 { background : rgba(12, 12, 12, 0.20); }
.main-content.opacity-3 { background : rgba(12, 12, 12, 0.30); }
.main-content.opacity-4 { background : rgba(12, 12, 12, 0.40); }
.main-content.opacity-5 { background : rgba(12, 12, 12, 0.50); }
.main-content.opacity-6 { background : rgba(12, 12, 12, 0.60); }
.main-content.opacity-7 { background : rgba(12, 12, 12, 0.70); }
.main-content.opacity-8 { background : rgba(12, 12, 12, 0.80); }
.main-content.opacity-9 { background : rgba(12, 12, 12, 0.90); }
.main-content.opacity-10 { background : rgba(12, 12, 12, 1); }

.main-content.bg-trans {
   background : transparent;
   box-shadow : none;
   }

.main-content.bg-trans .home-content {
   text-shadow : rgba(0, 0, 0, 0.2);
   }

.main-content.hide-view {
   margin-top : -50px;
   transition : all .6s;
   opacity    : 0;
   }

.main-content.in-view {
   transition : all .8s;
   opacity    : 1;
   }

.home-content {
   left    : 0;
   width   : 100%;
   padding : 120px 12px;
   }

@keyframes bounce1 {
   40%,
   50%,
   80%,
   100% {transform : translateY(-0%); }
   45% {transform : translateY(-30px); }
   60% {transform : translateY(-15px); }
   }

.main-content p { color : rgba(255, 255, 255, 1); }

.main-content p {
   font-size      : 14px;
   font-weight    : 400;
   letter-spacing : 1px;
   word-spacing   : 3px;
   }

.title {
   font-size    : 28px;
   font-weight  : 900;
   margin       : 0;
   text-align   : center;
   word-spacing : 5px;
   color        : rgba(255, 255, 255, 0.9);
   }

.theme-title {
   font-family    : 'Oswald', sans-serif;
   font-size      : 16px;
   font-weight    : 400;
   line-height    : 20px;
   margin-bottom  : 20px;
   letter-spacing : 3px;
   text-transform : uppercase;
   color          : #f7f7f7;
   }

/*countdown style*/
.countdown {
   font-size      : 26px;
   font-weight    : 700;
   margin         : 0;
   text-align     : center;
   word-spacing   : 5px;
   text-transform : lowercase;
   color          : rgba(255, 255, 255, 0.9);
   }

.countdown span {
   font-size   : 28px;
   font-weight : 900;
   }

.logo {
   font-size   : 20px;
   font-weight : 900;
   position    : absolute;
   top         : 30px;
   left        : 50%;
   width       : 100%;
   transform   : translateX(-50%);
   text-align  : center;
   color       : #ddd;
   }

.logo i { margin-right : 5px; }

.social-wrapper {
   position : absolute;
   z-index  : 3;
   top      : 35px;
   right    : 100px;
   }

.social-list {
   position   : absolute;
   bottom     : 30px;
   left       : 50%;
   width      : 100%;
   margin     : 50px 0 0;
   padding    : 0;
   list-style : none;
   transform  : translateX(-50%);
   }

.social-list li {display : inline-block;}

.social-list li a {
   font-size   : 12px;
   line-height : 34px;
   display     : block;
   width       : 34px;
   height      : 34px;
   text-align  : center;
   color       : #999;
   background  : rgba(0, 0, 0, 0.2);
   }

.social-list li a { transition : all .3s; }

.social-list li a:hover {
   color      : #fff;
   background : #fff;
   }

.social-list li.facebook a:hover {background : #3b5998;}
.social-list li.whatsapp a:hover {background : #4dc247;}
.social-list li.rss a:hover {background : #f60;}

.line-divider {
   display    : block;
   width      : 50px;
   height     : 2px;
   margin     : 20px auto 15px;
   background : #fff;
   }

hr.light { border-top : 1px solid #333; }

.button-wrapper {
   font-size  : 0;
   margin-top : 35px;
   }

.button-wrapper a,
.button-wrapper [class^="btn"] {
   display      : inline-block;
   margin-right : 3px;
   margin-left  : 3px;
   }

.arrow {
   font-size   : 30px;
   line-height : 40px;
   position    : fixed;
   bottom      : 20px;
   left        : 50%;
   width       : 40px;
   height      : 40px;
   margin-left : -20px;
   cursor      : pointer;
   animation   : bounce 2s forwards infinite;
   text-align  : center;
   color       : #ddd;
   }

@keyframes bounce {
   0%,
   20%,
   50%,
   80%,
   100% {transform : translateY(0);}
   40% {transform : translateY(-30px);}
   60% {transform : translateY(-15px);}
   }

/* button styles */

.btn-light,
.btn-light:focus {
   font-size       : 12px;
   padding         : 10px 15px;
   transition      : all .4s;
   text-decoration : none;
   letter-spacing  : 3px;
   text-transform  : uppercase;
   color           : #000;
   border          : 1px solid #fff;
   border-radius   : 0;
   background      : #fff;
   }

.btn-light:hover {
   text-decoration : none;
   color           : #fff;
   background      : transparent;
   }

.btn-dark,
.btn-dark:focus {
   font-size       : 12px;
   padding         : 10px 15px;
   transition      : all .4s;
   text-decoration : none;
   letter-spacing  : 3px;
   text-transform  : uppercase;
   color           : #000;
   border          : 1px solid rgba(12, 12, 12, 0.7);
   border-radius   : 0;
   background      : #fff;
   }

.btn-dark:hover {
   text-decoration : none;
   color           : #fff;
   border-color    : rgba(12, 12, 12, 0.7);
   background      : rgba(12, 12, 12, 0.7);
   }

.btn-transparent,
.btn-transparent:focus {
   font-size       : 14px;
   padding         : 7px 15px;
   transition      : all .4s;
   text-decoration : none;
   letter-spacing  : 3px;
   text-transform  : uppercase;
   color           : #fff;
   border          : 1px solid rgba(255, 255, 255, 0.5);
   border-radius   : 0;
   background      : transparent;
   }

.btn-transparent:hover {
   text-decoration : none;
   color           : #000;
   background      : #fff;
   }

.fill-btn,
.fill-btn:focus {
   font-size       : 12px;
   padding         : 10px 30px;
   text-decoration : none;
   letter-spacing  : 3px;
   text-transform  : uppercase;
   color           : rgba(0, 0, 0, 0.8);
   border          : 1px solid #fff;
   border-radius   : 0;
   background      : #fff;
   }

.fill-btn:hover {
   text-decoration : none;
   color           : #fff;
   background      : transparent;
   }

/* Slider nav style */
.owl-nav {
   font-family : sans-serif;
   font-size   : .8em;
   padding-top : .4em;
   }

.owl-nav > div {
   font-size     : 18px;
   line-height   : 38px;
   position      : absolute;
   top           : 50%;
   display       : block;
   width         : 38px;
   height        : 38px;
   transform     : translateY(-50%);
   text-align    : center;
   color         : #333;
   border-radius : 50%;
   background    : #000;
   background    : #fff;
   box-shadow    : .1em .1em .4em rgba(0, 0, 0, .5);
   }

.owl-nav > div.disabled { display : none;}
.owl-prev { left : 0; }
.owl-next { right : 0; }

#title {
   font-family    : 'Poppins', sans-serif;
   font-size      : 50px;
   font-weight    : 300;
   position       : absolute;
   top            : 50%;
   right          : 0;
   left           : 0;
   margin-top     : -60px;
   padding-left   : 10px;
   text-align     : center;
   letter-spacing : 10px;
   color          : #fff;
   }

.title-slider {font-family : Oswald, sans-serif; }

#title span {
   background              : -webkit-linear-gradient(white, #38495a);
   -webkit-background-clip : text;
   -webkit-text-fill-color : transparent;
   }

@-webkit-keyframes rotate {
   0% {
      -webkit-transform : rotate(0deg);
      }
   100% {
      -webkit-transform : rotate(360deg);
      }
   }

/* close */
.close {
   font-size       : 12px;
   line-height     : 38px;
   width           : 40px;
   height          : 40px;
   text-align      : center;
   text-decoration : none;
   color           : #000;
   border          : 1px solid #434648;
   border-radius   : 50%;
   background      : #fff;

   }

.close:hover {
   text-decoration : none;
   color           : #000;
   background      : #fff;
   }

.close-square,
.close-info,
.close-btn {
   font-size       : 18px;
   line-height     : 36px;
   position        : fixed;
   z-index         : 5;
   top             : 30px;
   right           : -40px;
   width           : 40px;
   height          : 40px;
   cursor          : pointer;
   transition      : all .5s;
   text-align      : center;
   text-decoration : none;
   color           : #000;
   border          : 1px solid #434648;
   background      : #fff;
   }

.view-more.in-view .close-btn { right : 0; }

.close-square:hover,
.close-info:hover,
.close-btn:hover {opacity : 0.8;}

/* more-info-block */
.more-info-block {
   position   : fixed;
   z-index    : 4;
   top        : 0;
   left       : 0;
   /*opacity: 0.5;*/
   overflow   : auto;
   width      : 0;
   height     : 5px;
   transition : all 1s;
   background : #282827 url(../images/t1.jpg) no-repeat;
   }

.more-info-block.active .close-info {
   right            : 20px;
   transition-delay : 1s;
   }

.more-info-block.disactive .close-info {transition-delay : 0.1s;}

.more-info-block.active {
   animation : fullscreen 1.5s forwards;
   }

.more-info-block.disactive {
   animation : fullscreen-rev .75s forwards;
   }

/* more-info fade effect */
.more-info-fade .more-info-block {
   width  : 100%;
   height : 100%;
   }

.more-info-fade .close-square {right : 20px;}

@keyframes fullscreen {
   0% {
      width : 100%;
      }
   40% {
      width  : 100%;
      height : 5px;
      }
   100% {
      width  : 100%;
      height : 100%;
      }
   }

@keyframes fullscreen-rev {
   0% {
      width  : 100%;
      height : 100%;
      }
   40% {
      width  : 100%;
      height : 5px;
      }
   100% {
      width  : 0;
      height : 0;
      }
   }

.content-wrapper {
   position         : relative;
   width            : 700px;
   max-width        : 100%;
   margin           : 40px auto;
   padding          : 0 20px;
   transition       : 1s;
   transition-delay : .5s;
   transform        : translateY(50px);
   }

.fadeEffect.in .content-wrapper,
.active .content-wrapper {
   transform : translateY(0px);
   }

/* more-info intro */

.section-intro {padding : 30px 0;}

.intro-title {
   font-size   : 16px;
   line-height : 24px;
   color       : #dfdfdf;
   }

.block .details {
   padding    : 20px;
   border     : 1px solid #333;
   background : rgba(31, 31, 31, 0.15);
   }

/** icon-box **/
.icon-box {
   margin-bottom : 50px;
   text-align    : left;
   }

.icon-box i {
   font-size     : 50px;
   margin-bottom : 10px;
   }

.icon-box h5 {
   font-size      : 16px;
   margin-bottom  : 15px;
   letter-spacing : 1.5px;
   }

.icon-box.icon-left {
   position : relative;
   }

.icon-box.icon-left i {
   position  : absolute;
   top       : 50%;
   transform : translateY(-50%);
   }

.icon-box.icon-left h5,
.icon-box.icon-left p {
   padding-left : 75px;
   }

/* form */
.form-control {
   height         : 40px;
   letter-spacing : 1px;
   color          : #fff;
   border         : 1px solid #434648;
   border-radius  : 0;
   background     : transparent;
   box-shadow     : none;
   }

.form-control:focus {
   border     : 1px solid #777;
   box-shadow : none;
   }

label {
   font-weight : 300;
   color       : #fff;
   }

textarea {resize : vertical;}

.mce_inline_error,
.mce_inline_error:focus {
   border : 1px solid red !important;
   }

/*  contact **/
.contact-info { margin-top : 30px; }

.info-item {
   position      : relative;
   margin-bottom : 20px;
   padding-left  : 36px;
   }

.info-item i {
   font-size : 20px;
   position  : absolute;
   top       : 6px;
   left      : 0;
   }

/* default modal */
.modal {
   padding    : 0 !important;
   text-align : center;
   }

.modal:before {
   display        : inline-block;
   height         : 100%;
   margin-right   : -4px;
   content        : '';
   vertical-align : middle;
   }

.modal-dialog {
   display        : inline-block;
   max-width      : 540px;
   text-align     : left;
   vertical-align : middle;
   }

/* modal vertical center end */

@media only screen and (min-width : 768px) {
   .modal-dialog {
      width : 540px;
      }
   }

.modal-backdrop.in {opacity : 0.75; }

.modal-content {
   border        : none;
   border-radius : 0;
   background    : transparent;
   box-shadow    : none;
   }

.modal-header { border : none; }

.dialog-box {
   position : relative;
   padding  : 70px 40px;
   }

.dialog-box h3 {
   font-family    : 'Oswald', sans-serif;
   font-size      : 24px;
   margin         : 0 0 10px;
   letter-spacing : 0.85px;
   color          : #fff;
   }

.dialog-box p {color : #fff;}

.dialog-box .close {
   font-size : 30px;
   position  : absolute;
   top       : 5px;
   right     : 5px;
   color     : #fff;
   }

.dialog-box .close:hover,
.dialog-box .close:focus {
   opacity    : 0.9;
   outline    : 0;
   background : transparent;
   }

.dialog-box .subscription {
   margin-top   : 30px;
   margin-right : auto;
   margin-left  : auto;
   }

.bg-layer {background : rgba(0, 0, 0, 0.2);}
.bg-light h3 { color : rgba(31, 31, 31, 0.9); }
.bg-light p { color : rgba(31, 31, 31, 1); }
.bg-light .dialog-box .close { color : rgba(31, 31, 31, 1); }

.bg-light .form-control {
   color      : rgba(12, 12, 12, 1);
   background : #ddd;
   }

.bg-light .form-control:focus { border-color : rgba(67, 70, 72, 0.5); }

@media only screen and (min-width : 768px) {
   .dialog-box .subscription {
      max-width : 75%;
      }
   }

.subscription .form-control { margin-bottom : 15px; }
.subscription [class^="btn"] {
   width     : 60%;
   min-width : 120px;
   }

.btn-subscribe {
   font-size       : 12px;
   padding         : 10px 15px;
   transition      : all .4s;
   text-decoration : none;
   letter-spacing  : 3px;
   text-transform  : uppercase;
   color           : #fff;
   border          : 1px solid rgba(12, 12, 12, 0.7);
   border-radius   : 0;
   background      : rgba(12, 12, 12, 0.7);
   }

.btn-subscribe:hover {
   text-decoration : none;
   color           : rgba(12, 12, 12, 1);
   background      : transparent;
   }

.bg-dark { background : rgba(31, 31, 31, 1); }
.bg-dark .btn-subscribe {
   color      : rgba(12, 12, 12, 0.7);
   background : rgba(255, 255, 255, 0.9);
   }

.bg-light { background : rgba(255, 255, 255, 1); }

.copyright {
   margin-top : 20px;
   text-align : center;
   color      : rgba(255, 255, 255, 0.8);
   }

.copyright a { color : #ccc; }
.copyright a:hover { color : #ccc; }

@media only screen and (max-width : 1400px) {
   .main-content {
      max-width : 480px;
      }

   .title {font-size : 24px;}
   .theme-title {font-size : 14px;}
   }

@media only screen and (min-width : 681px) {
   .main-content {
      min-width : 480px;
      }

   .main-content {
      display         : flex;
      align-items     : center;
      justify-content : center;
      width           : 50%;
      height          : 90vh;
      min-height      : 550px;
      max-height      : 750px;
      margin-top      : 32px;
      margin-bottom   : 32px;
      padding         : 0 20px;
      }
   }

@media only screen and (max-width : 680px) {
   .main-wrapper {
      display     : flex;
      align-items : center;
      }

   .main-content {
      position : relative;
      width    : 95%;
      margin   : 10px auto;
      padding  : 0 20px;
      }

   .main-content p {font-size : 12px;}

   .home-content {
      position  : relative;
      margin    : 50px 0;
      padding   : 30.5% 0;
      transform : translate(0);
      }

   .logo { position : relative !important; }

   .social-list { position : relative !important; }

   .countdown {
      font-size   : 16px;
      font-weight : 300;
      }

   }

@media only screen and (max-width : 480px) {
   .main-content {
      padding : 0 10px;
      }

   .title { font-size : 22px;}

   .theme-title {
      font-size      : 12px;
      letter-spacing : 2px;
      }

   .col-xsm-100 { width : 100%; }

   .block { margin-bottom : 20px; }
   }

@media only screen and (max-width : 414px) {
   .button-wrapper a,
   .button-wrapper [class^="btn"] {
      font-size : 12px;
      display   : block;
      min-width : 170px;
      max-width : 170px;
      margin    : 0 auto 10px;
      padding   : 6px 15px;
      }
   }

/** color  ver **/
.more-info-block.vs-black {color : #ccc;}

/* version white */
.more-info-block.vs-white {
   color      : #080808;
   background : #fff;
   }

.more-info-block.vs-white .section-title,
.more-info-block.vs-white .copyright,
.more-info-block.vs-white .copyright a,
.more-info-block.vs-white .intro-title {
   color : #080808;
   }

.more-info-block.vs-white .block .details {
   border-top : none;
   background : #fff;
   }

.more-info-block.vs-white .form-control {
   color      : #333;
   background : #fff;
   }

.vs-white .btn-light { border-color : #434648; }

.vs-white .btn-light:hover { color : #000; }

/* version kebikec */
.more-info-block.vs-kebikec {
   color      : #080808;
   background : #78ab3a;
   }

.vs-keb {
   border-radius : 14px;
   background    : #fefefe;
   }

.more-info-block.vs-kebikec .section-title,
.more-info-block.vs-kebikec .copyright,
.more-info-block.vs-kebikec .copyright a,
.more-info-block.vs-kebikec .intro-title {
   color : #080808;
   }

.more-info-block.vs-kebikec .block .details {
   border-top : none;
   background : #78ab3a;
   }

.more-info-block.vs-kebikec .form-control {
   color      : #333;
   background : #78ab3a; /* #cfe874; */
   }

.vs-kebikec .btn-light { border-color : #434648; }

.vs-kebikec .btn-light:hover { color : #000; }

/*=== Common Theme style End  ===*/
.color {
   color : rgb(85, 71, 106);
   color : rgb(209, 113, 147);
   color : rgb(255, 254, 255);
   color : rgb(209, 151, 142);
   color : rgb(170, 146, 232)
   }

/* snowCanvas */
.fullCanvas {
   width  : 100%;
   height : 100%;
   }

.bg-blue { background : #17293a; }

/* Gradient background */
.gradient-background {
   background : linear-gradient(to left, #67b26f, #4ca2cd);
   background : linear-gradient(141deg, #108a83 0%, #31c9da 51%, #42b0da 75%);
   }

.gradient-background2 {
   background : linear-gradient(141deg, #1d6b66 0%, #2b666d 51%, #275668 75%);
   }

.gradient-background3 {
   background : linear-gradient(141deg, #108a83 0%, #31c9da 51%, #42b0da 75%);
   }

/* Gradiend animation */
@-webkit-keyframes gradientAnimation {
   0% {background-position : 90% 0%}
   50% {background-position : 11% 100%}
   100% {background-position : 90% 0%}
   }

@-moz-keyframes gradientAnimation {
   0% {background-position : 90% 0}
   50% {background-position : 11% 100%}
   100% {background-position : 90% 0}
   }

@keyframes gradientAnimation {
   0% {background-position : 90% 0}
   50% {background-position : 11% 100%}
   100% {background-position : 90% 0}
   }

.gradient-animation {
   -moz-animation    : gradientAnimation 30s ease infinite;
   /*background:linear-gradient(45deg,rgb(62,35,255),   rgb(60,255,60),   rgb(35, 191, 255),   rgb(45,175,230),   rgb(41, 30, 41),   rgb(255,128,0));*/
   -webkit-animation : gradientAnimation 30s ease infinite;
   animation         : gradientAnimation 30s ease infinite;
   background        : linear-gradient(45deg, rgb(62, 35, 255),
      rgb(49, 181, 49),
      rgb(35, 191, 255),
      rgb(24, 60, 74),
      rgb(45, 175, 230),
      rgb(41, 30, 41),
      rgb(255, 128, 0));
      background-size   : 1000% 1000%;
   }

/* Parallax */
.parallax-items {
   position : absolute;
   z-index  : 2;
   top      : 0;
   overflow : hidden;
   width    : calc(90% - 515px);
   height   : 100%;
   }

.parallax-items .layer {
   position : absolute;
   }

.parallax-items .layer1 {
   top   : 100px !important;
   left  : 50px !important;
   width : 200px;
   }

.parallax-items .layer2 {
   top    : auto !important;
   bottom : 130px !important;
   left   : 60px !important;
   width  : 200px;
   }

.parallax-items .layer3 {
   top   : 250px !important;
   left  : 350px !important;
   width : 200px;
   }

.parallax-items .layer4 {
   top   : 5% !important;
   right : 20px !important;
   left  : auto !important;
   width : 200px;
   }

.parallax-items .layer5 {
   top   : 55% !important;
   right : 0 !important;
   left  : auto !important;
   width : 200px;
   }

.parallax-items .layer6 {
   top       : 50% !important;
   left      : 50% !important;
   transform : translate(-50%, -50%) !important;
   }

.parallax-items .layer7 {
   top  : 50% !important;
   left : 60% !important;
   /*opacity:0.6;*/
   }

.parallax-items .layer7 img {
   transform : rotate(45deg);
   filter    : blur(5px);
   }

@media only screen and (max-width : 1200px) {
   .parallax-items {
      width  : 100%;
      height : 100%;
      }
   }

/* parallax background */
.parallax-background {
   position : absolute;
   top      : 0;
   left     : 0;
   overflow : hidden;
   width    : 100%;
   height   : 100%;
   }

.full-width {
   width  : 100%;
   height : 100%;
   }

.parallax-background .layer {
   width  : 100%;
   height : 100%;
   }

.layer .background {
   width  : 100%;
   height : 100%;
   }

.layer2 .background {
   position : relative;
   bottom   : -2.5%;
   left     : -2.5%;
   width    : 105%;
   }

/* video opening animation */
.video-wrap {
   position            : fixed;
   z-index             : 1000;
   top                 : 0;
   left                : 0;
   display             : -webkit-flex;
   display             : flex;
   -webkit-align-items : center;
   align-items         : center;
   width               : 100%;
   height              : 100%;
   pointer-events      : none;
   }

.video-wrap--show { pointer-events : auto;}

.video-inner {
   position   : relative;
   overflow   : hidden;
   width      : 100%;
   height     : 100%;
   margin     : 0 auto;
   opacity    : 0;
   background : black;
   }

.video-wrap--show .video-inner {opacity : 1;}

.video-player {
   position          : absolute;
   top               : 50%;
   width             : 100%;
   -webkit-transform : translate3d(0, -50%, 0);
   transform         : translate3d(0, -50%, 0);
   }

.action--close {
   line-height        : 1;
   position           : absolute;
   z-index            : 1000;
   top                : 30px;
   right              : 30px;
   width              : 60px;
   height             : 60px;
   padding            : 0;
   -webkit-transition : -webkit-transform 0.3s, opacity 0.3s;
   transition         : transform 0.3s, opacity 0.3s;
   -webkit-transform  : scale3d(0.7, 0.7, 1);
   transform          : scale3d(0.7, 0.7, 1);
   opacity            : 0;
   border             : none;
   border-radius      : 50%;
   background         : #fff;
   }

.video-wrap--show .action--close {
   -webkit-transition-delay : 1.2s;
   transition-delay         : 1.2s;
   -webkit-transform        : scale3d(1, 1, 1);
   transform                : scale3d(1, 1, 1);
   opacity                  : 1;
   }

@media screen and (min-width : 25em) {
   .deco-stack__img {
      width  : 20vw;
      height : 20vw;
      }

   .video-inner {
      width             : 30vw;
      height            : 30vw;
      -webkit-transform : scale3d(0.1, 0.1, 1) rotate3d(0, 0, 1, -5deg);
      transform         : scale3d(0.1, 0.1, 1) rotate3d(0, 0, 1, -5deg);
      border            : 0px solid #fff;
      }

   .video-wrap--show .video-inner {
      -webkit-animation : showVideo-1 1.25s forwards;
      animation         : showVideo-1 1.25s forwards;
      opacity           : 0;
      }

   .video-wrap--hide .video-inner {
      -webkit-animation : hideVideo 1.25s forwards;
      animation         : hideVideo 1.25s forwards;
      }

   .video-player {
      left               : 50%;
      width              : auto;
      height             : 100vh;
      -webkit-transition : -webkit-transform 1s;
      transition         : transform 1s;
      -webkit-transform  : translate3d(-50%, -50%, 0) scale3d(0.7, 0.7, 1) rotate3d(0, 0, 1, 5deg);
      transform          : translate3d(-50%, -50%, 0) scale3d(0.7, 0.7, 1) rotate3d(0, 0, 1, 5deg);
      }

   .video-wrap--show .video-player,
   .video-wrap--hide .video-player {
      -webkit-transform : translate3d(-50%, -50%, 0) scale3d(1, 1, 1);
      transform         : translate3d(-50%, -50%, 0) scale3d(1, 1, 1);
      }
   }

/* This is the same as an aspect ratio of 16/9.
Here we take the viewport height as main measure
and size the video-inner accordingly.
The video itself will use the viewport width as main 
measure so that we ensure a filling of the screen.
*/
@media screen and (min-width : 25em) and (min-aspect-ratio : 1280/720) {

   .video-inner {
      width  : 30vh;
      height : 30vh;
      }

   .video-wrap--show .video-inner {
      -webkit-animation : showVideo-2 1.25s forwards;
      animation         : showVideo-2 1.25s forwards;
      }

   .video-player {
      width  : 100vw;
      height : auto;
      }
   }

/* Animation for showing the video wrapper */
@-webkit-keyframes showVideo-1 {
   50% {
      width             : 50vw;
      height            : 50vw;
      opacity           : 1;
      -webkit-transform : scale3d(0.5, 0.5, 1) rotate3d(0, 0, 1, -5deg);
      transform         : scale3d(0.5, 0.5, 1) rotate3d(0, 0, 1, -5deg);
      }
   100% {
      width             : 100vw;
      height            : 100vh;
      opacity           : 1;
      -webkit-transform : scale3d(1, 1, 1) rotate3d(0, 0, 1, 0deg);
      transform         : scale3d(1, 1, 1) rotate3d(0, 0, 1, 0deg);
      }
   }

@keyframes showVideo-1 {
   50% {
      width             : 50vw;
      height            : 50vw;
      opacity           : 1;
      -webkit-transform : scale3d(0.5, 0.5, 1) rotate3d(0, 0, 1, -5deg);
      transform         : scale3d(0.5, 0.5, 1) rotate3d(0, 0, 1, -5deg);
      }
   100% {
      width             : 100vw;
      height            : 100vh;
      opacity           : 1;
      -webkit-transform : scale3d(1, 1, 1) rotate3d(0, 0, 1, 0deg);
      transform         : scale3d(1, 1, 1) rotate3d(0, 0, 1, 0deg);
      }
   }

/* Alternate animation for showing the video wrapper */
@-webkit-keyframes showVideo-2 {
   50% {
      width             : 50vh;
      height            : 50vh;
      opacity           : 1;
      -webkit-transform : scale3d(0.5, 0.5, 1) rotate3d(0, 0, 1, -5deg);
      transform         : scale3d(0.5, 0.5, 1) rotate3d(0, 0, 1, -5deg);
      }
   100% {
      width             : 100vw;
      height            : 100vh;
      opacity           : 1;
      -webkit-transform : scale3d(1, 1, 1) rotate3d(0, 0, 1, 0deg);
      transform         : scale3d(1, 1, 1) rotate3d(0, 0, 1, 0deg);
      }
   }

@keyframes showVideo-2 {
   50% {
      width             : 50vh;
      height            : 50vh;
      opacity           : 1;
      -webkit-transform : scale3d(0.5, 0.5, 1) rotate3d(0, 0, 1, -5deg);
      transform         : scale3d(0.5, 0.5, 1) rotate3d(0, 0, 1, -5deg);
      }
   100% {
      width             : 100vw;
      height            : 100vh;
      opacity           : 1;
      -webkit-transform : scale3d(1, 1, 1) rotate3d(0, 0, 1, 0deg);
      transform         : scale3d(1, 1, 1) rotate3d(0, 0, 1, 0deg);
      }
   }

/* Animation for hiding the video wrapper */
@-webkit-keyframes hideVideo {
   0% {
      width             : 100vw;
      height            : 100vh;
      opacity           : 1;
      -webkit-transform : scale3d(1, 1, 1) rotate3d(0, 0, 1, 0deg);
      transform         : scale3d(1, 1, 1) rotate3d(0, 0, 1, 0deg);
      }
   100% {
      width             : 100vw;
      height            : 100vh;
      opacity           : 0;
      -webkit-transform : scale3d(1, 1, 1) rotate3d(0, 0, 1, 0deg);
      transform         : scale3d(1, 1, 1) rotate3d(0, 0, 1, 0deg);
      }
   }

@keyframes hideVideo {
   0% {
      width             : 100vw;
      height            : 100vh;
      opacity           : 1;
      -webkit-transform : scale3d(1, 1, 1) rotate3d(0, 0, 1, 0deg);
      transform         : scale3d(1, 1, 1) rotate3d(0, 0, 1, 0deg);
      }
   100% {
      width             : 100vw;
      height            : 100vh;
      opacity           : 0;
      -webkit-transform : scale3d(1, 1, 1) rotate3d(0, 0, 1, 0deg);
      transform         : scale3d(1, 1, 1) rotate3d(0, 0, 1, 0deg);
      }
   }

/* Bird  canvas*/
.hasBirdCanvas > canvas {
   position : fixed !important;
   top      : 0;
   left     : 0;
   width    : 100%;
   height   : 100%;
   }

/* Rainy day canvas*/
.rainydayCanvas > canvas {
   position : fixed !important;
   top      : 0;
   left     : 0;
   width    : 100%;
   height   : 100%;
   }

/*Ripple image*/
.rplimg {
   position : absolute;
   top      : 0;
   left     : 0;
   width    : 100%;
   height   : 100%;
   }

/*Geometry canvas*/
.geometry-canvas {
   position : absolute;
   top      : 0;
   left     : 0;
   display  : block !important;
   width    : 100%;
   height   : 100%;
   }

[class^=geometry-canvas] .fss-output canvas {
   position : fixed !important;
   width    : 100% !important;
   height   : 100% !important;
   }

/* Google map */
.map-wrapper {
   position : absolute;
   top      : 0;
   left     : 0;
   width    : 100%;
   height   : 100%;
   }

.gmap {
   width  : 100%;
   height : 100%;
   }

/** item slider style */
.block-wrapper {
   position : absolute;
   top      : 0;
   right    : 0;
   bottom   : 0;
   left     : 0;
   }

.block-inner { position : absolute; }

.block-background {
   top    : 0;
   left   : 0;
   width  : 100%;
   height : 100%;
   }

.block-object {
   position  : absolute;
   z-index   : 3;
   top       : 50%;
   transform : translatey(-50%);
   }

.block-object.right-align { right : 0; }

.block-object.left-align { left : 0; }

.block-object :not(.fullwidth).item-wrapper {
   width     : 30%;
   width     : 30vw;
   min-width : 260px;
   max-width : 430px;
   margin    : 0 auto;
   }

.fullwidth.item-wrapper {
   width  : 100%;
   height : 100%;
   }

.item-wrapper { text-align : center; }
.item-wrapper .item {display : inline-block;}
.item-wrapper .item img {width : auto;}

@media only screen and (min-width : 901px) {
   .block-object {
      width : calc(93% - 515px);
      }

   .button-wrapper .item-view-btn {display : none;}
   }

@media only screen and (max-width : 900px) {

   /*360*/
   .block-wrapper {
      position   : fixed;
      z-index    : 10;
      top        : 0;
      left       : 0;
      visibility : hidden;
      width      : 100%;
      height     : 100%;
      background : #fff;
      }

   .block-inner {width : 100%;}
   }

/** 360 image style */
.threesixty-wrapper {
   position : absolute;
   top      : 0;
   right    : 0;
   bottom   : 0;
   left     : 0;
   overflow : hidden;
   }

.threesixty-inner {position : absolute;}

.threesixty-background {
   top    : 0;
   left   : 0;
   width  : 100%;
   height : 100%;
   }

.threesixty-object {
   position  : absolute;
   z-index   : 3;
   top       : 50%;
   right     : 0;
   transform : translatey(-50%);
   }

.threesixty-object #image-reel {
   position : relative;
   /*width:30%;
   width:30vw;
   padding-top:30vw; */
   }

.threesixty-object :not(.fullwidth).reel {
   position  : absolute;
   top       : 0;
   width     : 430px;
   min-width : 260px;
   margin    : 0 auto;
   /*padding-top: 100%;*/
   }

.fullwidth.reel {
   width  : 100%;
   height : 100%;
   }

@media only screen and (min-width : 901px) {
   .threesixty-wrapper {visibility : visible !important;}

   .threesixty-object {width : calc(93% - 515px);}

   .threesixty-wrapper .close-btn,
   .button-wrapper .item-view-btn {
      display : none;
      }
   }

@media only screen and (max-width : 900px) {

   /*360*/
   .threesixty-wrapper {
      position   : fixed;
      z-index    : 10;
      top        : 0;
      left       : 0;
      visibility : hidden;
      width      : 100%;
      height     : 100%;
      background : #fff;
      }

   .threesixty-inner {width : 100%;}
   }

/** Host video bg **/
.vidbg {
   position        : fixed;
   z-index         : -100;
   top             : 50%;
   left            : 50%;
   width           : auto;
   min-width       : 100%;
   height          : auto;
   min-height      : 100%;
   transition      : 1s opacity;
   transform       : translateX(-50%) translateY(-50%);
   background      : #000;
   background-size : cover;
   }

.stopfade {opacity : .9;}

.vidCtl {
   font-size  : 18px;
   position   : absolute;
   z-index    : 3;
   top        : 20px;
   opacity    : 0;
   color      : #ddd;
   border     : none;
   background : transparent;
   }

.bg-video:hover .vidCtl.active {
   pointer-events : none;
   opacity        : 0.3;
   }

.vidCtl:focus,
.vidCtl:visited,
.vidCtl:active {
   outline : 0;
   }

.vidCtl:nth-child(1) {right : 50px;}
.vidCtl:nth-child(2) {right : 86px;}
.vidCtl:nth-child(3) {right : 116px;}
.vidCtl:nth-child(4) {right : 146px;}
.bg-video:hover .vidCtl {opacity : 0.8;}

/** Preloader **/
#jpreOverlay {
   position   : fixed;
   z-index    : 9999999;
   top        : 0;
   left       : 0;
   width      : 100%;
   height     : 100%;
   background : #131313;
   }

#jpreLoader {
   top        : 50% !important;
   width      : 100% !important;
   transform  : translatey(-50%);
   text-align : center;
   color      : #fff;
   }

#jpreBar {
   position   : absolute;
   bottom     : 0;
   height     : 1px !important;
   background : #fff;
   }

#jprePercentage {
   font-size   : 24px;
   font-weight : 300;
   top         : -10px;
   }

#jpreButton {
   position  : absolute !important;
   left      : 50%;
   transform : translate(-50%, 20px);
   }