@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@100..900&display=swap');

* {
  --body-font: "Roboto Slab", serif;
  --body-font-size: 16px;
  --body-font-color: #93a0af;
  --body-font-color-dark: rgba(255, 255, 255, .6);
  --body-font-weight: 400;
  --heading-font: "Roboto Slab", serif; 
  --heading-font-weight: 600;
  --heading-font-color: #10244b;
  --heading-text-transform: none;
  --h1-font-size: 40px;
  --h1-font-weight: var(--heading-font-weight);
  --h1-letter-spacing: -0.027em;
  --h1-line-height: 1.15em;
  --h1-margin-bottom: 20px;
  --h2-font: var(--heading-font);
  --h2-font-size: 48px;
  --h2-font-weight: var(--heading-font-weight);
  --h2-letter-spacing: -0.025em;
  --h2-line-height: 1.2em;
  --h2-margin-bottom: 20px;
  --h3-font-size: 26px;
  --h3-font-weight: var(--heading-font-weight);
  --h3-letter-spacing: 0;
  --h3-line-height: 1.5em;
  --h3-margin-bottom: 10px;
  --h4-font-size: 20px;
  --h4-font-weight: var(--heading-font-weight);
  --h4-letter-spacing: 0;
  --h4-line-height: 1.6em;
  --h4-margin-bottom: 10px;
  --h5-font-size: 18px;
  --h5-font-weight: var(--heading-font-weight);
  --h5-letter-spacing: 0;
  --h5-line-height: 1.6em;
  --h5-margin-bottom: 10px;
  --h6-font-size: 16px;
  --h6-font-weight: var(--heading-font-weight);
  --h6-letter-spacing: 0;
  --h6-line-height: 1.6em;
  --h6-margin-bottom: 10px;
  --mainmenu-font: var(--body-font);
  --mainmenu-font-size: 15px;
  --mainmenu-font-weight: 600;
  --mainmenu-letter-spacing: 0;
  --mainmenu-text-transform: none;
  --mainmenu-item-padding: 35px 0;
  --mainmenu-item-padding-hover: 20px 0;
  --logo-width: 250px;
  --border-default: solid 1px rgba(30, 30, 30, 1);
  --bg-color-even: #E8E8E8;
  --bg-color-odd: #F4F4F4;
  --bg-light: #F8F9FA;
  --bg-dark-1: #090D10;
  --bg-dark-2: #071630;
  --bg-dark-3: #1e1e1e;  
  --bg-dark-1-rgb: 0, 10, 91;
  --bg-grey: #eeeeee;
  --bg-gradient-1: 0deg, rgba(var(--primary-color-rgb), .1) 0%, rgba(var(--secondary-color-rgb), .2) 100%;
  --swiper-theme-color: var(--secondary-color);
  --rounded-1: 20px;
  --border-color:#bbbbbb;
  --container-max-width:1240px;
  --btn-color: #fff;
  --btn-hover-bg: var(--bg-dark-1);
  --btn-font-family: var(--body-font);
  --btn-font-size: 15px;
  --btn-font-weight: bold;
  --btn-letter-spacing: 0;
  --btn-padding: 6px 20px;
  --btn-rounded: 8px;
  --btn-text-decoration: none;
  --btn-text-transform: none;
}

html {
  overflow-x: hidden;
  padding: 0;
  margin: 0;
}

body {
  overflow-x: hidden;
  font-family: var(--body-font);
  font-size: var(--body-font-size);
  font-weight: var(--body-font-weight);;
  color: var(--body-font-color);
  padding: 0;
  line-height: 1.9em;
  word-spacing: 0px;
}

a,
a:hover {
  color:var(--body-font-color);
  text-decoration: none;
  outline: none;
}

header {
  width: 100%;
  position: absolute;
  left: 0;
  z-index: 1001;
  background: var(--bg-dark-1);
  margin: 0;
}

header.header-s1 {
  top: 0;
}

header.header-bg {
  background: rgba(0, 0, 0, 0.5);
}

header.transparent {
  background: none;
}

body:not(.side-layout) header:not(.smaller):not(.header-mobile).header-light.transparent {
  background: rgba(255, 255, 255, 0.0);
}

header.autoshow {
  top: -120px;
  height: 70px !important;
}

header.autoshow.scrollOn,
header.autoshow.scrollOff {
  -o-transition: .5s;
  -ms-transition: .5s;
  -moz-transition: .5s;
  -webkit-transition: .5s;
  transition: .5s;
  outline: none;
}

header.autoshow.scrollOn {
  top: 0;
}

header.autoshow.scrollOff {
  opacity: ;
  top: -120px;
}

header div#logo {
  color: white;
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -ms-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}

header .logo-2 {
  display: none;
}

header .logo-scroll {
  display: none;
}

header .logo,
header .logo-2 {
  font-family: var(--body-font);
  color: #fff;
  font-size: 40px;
  font-weight: 300;
}

header .logo-2 {
  color: #333;
}

header.header-full nav {
  float: left;
}

header nav a {
  -webkit-transition: all 0.3s;
  -moz-transition: all 0.3s;
  -ms-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}

header nav a:hover {
  color: #555;
}

header.smaller #mainmenu ul ul {
  top: 0px;
}

header.smaller {
  position: fixed;
  top: 0px;
  background: var(--bg-dark-1);
  -webkit-backdrop-filter: blur(10px);
  -o-backdrop-filter: blur(10px);
  -moz-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border: none;*/
}

header.smaller.header-float .header-inner,
header.header-mobile.header-float .header-inner{
  background: none;
  margin-top: 0;
  padding: 0;
}

header.smaller.header-float.header-light .header-inner{
  background: none;
}

header.smaller #mainmenu > li > a{
  padding: var(--mainmenu-item-padding-hover);
}

header.header-light.smaller{
  background: rgba(255, 255, 255, 1.0);
}

.scroll-down {
    margin-top: -90px;
}

.scroll-up {
    margin-top: 0;
}

header.header-center.scroll-down{
  margin-top: -175px;
}

header.header-center #logo-center{
  display: inline-block;
  padding-top: 40px;
}

header.header-center #mainmenu{
  display: inline-block;
}

header.header-center{
  text-align: center;
}

header.header-center #logo{
  display: none;
}

header.smaller div#logo,
header.s2 div#logo {}

header.smaller .logo-init {
  display: none;
}

header.smaller #topbar {
  margin-top:-42px;
  overflow: hidden;
}

header.smaller #topbar.topbar-dark {
  background: rgba(34, 34, 34, .05);
}

header.smaller #topbar.topbar-dark a {
  color: #333333;
}

header .logo-mobile {
  display: none;
}


header.smaller.scroll-light {
  background: #ffffff;
}

header.scroll-light .logo-scroll{
  display: none;
}

header.smaller.scroll-light .logo-main{
  display: none;
}

header.smaller.scroll-light .logo-scroll{
  display: block;
}

header.smaller.scroll-dark {
  background: var(--bg-color-even);
}

header.header-light .h-phone,
header.smaller.scroll-light .h-phone {
  color: #202020;
}

header:not(.header-light).smaller.scroll-light div#logo .logo {
  display: none;
}

header.smaller.scroll-light div#logo .logo-2 {
  display: inline-block;
}

header.smaller.scroll-light div#logo .logo-scroll {
  display: inline-block;
}

header.smaller.header-light div#logo .logo {
  display: none;
}

header.smaller.scroll-light .social-icons i {
  color: var(--heading-font-color);
}

header.smaller.scroll-light #mainmenu li a,
header.smaller.scroll-light #mainmenu li.has-child:after {
  color: var(--heading-font-color);
}

.logo-smaller div#logo {
  width: 150px;
  height: 30px;
  line-height: 65px;
  font-size: 30px;
}

.logo-smaller div#logo img {
  font-size: 30px;
}

div#logo img{
  max-width: var(--logo-width);
  padding: var(--mainmenu-item-padding);
}

footer .logo-footer{
  max-width: var(--logo-footer-width);
}

header.smaller div#logo .logo-1 {
  display: none;
}

header.smaller div#logo .logo-2 {
  display: inline-block;
}

.logo-small {
  margin-bottom: 20px;
}

header.header-full {
  padding-left: 30px;
  padding-right: 30px;
}

header .header-row {
  text-align: center;
}

header .header-col {
  position: relative;
  height: 100%;
}

/* left col header */
header .header-col.left {
  float: left;
  padding: 0 30px 0 0;
  /* border-right:solid 1px rgba(255,255,255,.2); */
}

/* middle col header */
header .header-col.mid {
  float: right;
}

header .header-col.mid .social-icons {
  float: right;
  /* border-left:solid 1px rgba(255,255,255,.2); */
  padding: 0 30px 0 30px;
}

header.header-float .header-inner{
  padding: 0 30px;
  background: var(--bg-dark-1);
  margin-top: 40px;
  border-radius: 10px;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
}

header.header-float.header-light .header-inner{
  background: #ffffff;
}

.header-col-right {
  text-align: right;
}

.text-light a,
.text-light a:hover {
  color:var(--body-font-color-dark);
  text-decoration: none;
  outline: none;
}

#content {
  width: 100%;
  background: #ffffff;
  padding: 90px 0 90px 0;
  z-index: 100;
}

section {
  padding: 120px 0 120px 0;
}

.d-rating i {
  font-size: 15px;
  color: #FEC42C;
  margin-right: 3px;
}

.text-light::-ms-input-placeholder {
  color: #ffffff;
}

a {
  text-decoration: none;
}

button.btn-main:hover,
.btn-main:hover,
button.btn-main.btn-line:hover {
  color: #fff;
  background: var(--btn-hover-bg);
}

button.btn-main,
button.btn-main:active,
button.btn-main:focus,
button.btn-main:visited,
.btn-main,
button.btn-line {
  background: var(--primary-color);
  color: var(--btn-color);
  font-family: var(--btn-font-family);
  font-size: var(--btn-font-size);
  font-weight: var(--btn-font-weight);
  letter-spacing: var(--btn-letter-spacing);
  padding: var(--btn-padding); 
  text-decoration: var(--btn-text-decoration);
  text-transform: var(--btn-text-transform);
  border-radius: var(--btn-rounded);
  -moz-border-radius: var(--btn-rounded);
  -webkit-border-radius: var(--btn-rounded);
  border: none;
  position: relative;
  display: inline-block;
  text-align: center;
  outline: 0;
}

button.btn-main.fx-slide{
  overflow: hidden;
}

button.btn-main.fx-slide span{
  display: block;
  position: relative;
  transition: all .3s ease-in-out;
}

button.btn-main.fx-slide:hover span{
  transform: translate(0, 40px);
  opacity: 0;
}

button.btn-main.fx-slide:hover:before {
  opacity: 1;
  transform: translate(0, 0);
}

button.btn-main.fx-slide:before {
  content: attr(data-hover);
  position: absolute;
  left: 0;
  width: 100%;
  opacity: 0;
  transform: translate(0, -100%);
  transition: all 0.3s ease-in-out;
}

button.btn-line,
button.btn-line:hover {
  background: none;
  color: #35404e;
  border: solid 1px rgba(255, 255, 255, .5);
}

button.btn-line:hover {
  border: solid 1px rgba(255, 255, 255, 0);
}

.text-light .btn-line{
  color:#ffffff;
}


button.btn-line:hover {
  color: #ffffff;
}

.spacer-single {
  width: 100%;
  height: 30px;
  display: block;
  clear: both;
}

h1 {
  margin-top: 0;
  font-family: var(--heading-font);
  font-weight: var(--heading-font-weight);
  color: var(--heading-font-color);
  text-transform: var(--heading-text-transform);
}

h1{
  font-size: var(--h1-font-size);
  font-weight: var(--h1-font-weight);  
  letter-spacing: var(--h1-letter-spacing);
  line-height: var(--h1-line-height);
  margin-bottom: var(--h1-margin-bottom);
}

.text-light {
  color: var(--body-font-color-dark);
}

.text-light h1 {
  color: #fff;
}

.overflow-hidden {
  overflow: hidden;
}

a.btn-line:after,
.btn-main{
  -o-transition: .5s;
  -ms-transition: .5s;
  -moz-transition: .5s;
  -webkit-transition: .5s;
  transition: .5s;
  outline: none;
}

@-webkit-keyframes scaleIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(1.5, 1.5, 1.5);
    transform: scale3d(1.5, 1.5, 1.5);
  }

  100% {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes scaleIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(1.5, 1.5, 1.5);
    transform: scale3d(1.5, 1.5, 1.5);
  }

  100% {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.scaleIn {
  -webkit-animation-name: scaleIn;
  animation-name: scaleIn;
}

.d-flex {
  display: flex;
  white-space: nowrap;
}

.gradient-edge-left {
  z-index: 1;
  position: absolute;
  top: 0;
  width: 50%;
  height: 100%;
  background: linear-gradient(90deg, rgba(var(--bg-dark-1-rgb), 1) 0%, rgba(var(--bg-dark-1-rgb), 0) 100%);
}

.w-100{width: 100%;}

.fs-14{font-size: 14px;}

.op-5{ opacity:.5; }

.mh-800{height:100vh;}

.abs { position: absolute;}
.abs-centered{ position: absolute; top: 50%; left: 50%;transform: translate(-50%, -50%);}
.relative { position: relative; }

.z-2{ z-index:2 }

.swiper{
  background: var(--bg-dark-1);  
}

.swiper,
.sw-overlay{
    position: absolute;
    width: 100%;
    height: 100%;
    left:0;
    top: 0;
}

.swiper-slide{
    position: relative;
    background: var(--bg-dark-1);
} 

.sw-overlay{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    z-index: 1;
    pointer-events: none;
}

.swiper-inner{
  display: block;
  position: absolute;
  top:0;
  width: 100%;
  height: 100%;
}

.subtitle{
  position: relative;
  font-weight: 400;
  position: relative;
  display: inline-block;
  font-size: 16px;
  font-family:var(--body-font);
  color:var(--primary-color);
  text-transform: none;
  letter-spacing: 0;
  line-height: 1.5em;
  margin-bottom: 20px;
}

.text-light .subtitle{
  border-color: rgba(255, 255, 255, .5);
}

.text-light .subtitle:not(.id-color){
  color:#ffffff;
}

.de-flex {
  display: flex;
  justify-content: space-between;
}

.de-flex>.de-flex-col {
  display: flex;
  justify-content: center;
  align-items: center;
}

.no-bottom {
  margin-bottom: 0;
  padding-bottom: 0;
}

.no-bottom {
  padding-bottom: 0 !important;
}

.no-top {
  padding-top: 0 !important;
  border-radius: 25px;
}

.wow {
  visibility: hidden;
}

a {
  outline: 0;
}

@media (min-width: 1000px){
    .container {
        max-width: var(--container-max-width);
    }
}


@media (min-width: 1200px) {

  .container {
    max-width: 1200px;
  }
}

@media (min-width: 1400px) {

  .container {
    max-width: 1304px;
  }
}

@media(min-width:980px) and (max-width: 1199px) {

  .container {
    min-width: 95%;
  }
}

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

  .container{
    max-width: 100%;
  }

  .sm-hide {
    display: none;
  }

  section{
    padding: 60px 0;
  }

  h1{
    font-size: 40px;
  }

}

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

  .container {
    padding-left: 20px;
    padding-right: 20px;
  }

  section{
    padding: 40px 0;
  }

  h1{
    font-size: 30px;
  }
}

@media only screen and (min-width: 480px) and (max-width: 767px) {
  .container {
    padding-left: 30px;
    padding-right: 30px;
  }
}

@media only screen and (min-device-width: 768) and (max-device-width: 1024) and (orientation: portrait) {
  section {
    -webkit-background-size: auto 100%;
    -moz-background-size: auto 100%;
    -o-background-size: auto 100%;
    background-size: auto 100%;
    background-attachment: scroll;
  }
}

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

  section {
    -webkit-background-size: auto 100%;
    -moz-background-size: auto 100%;
    -o-background-size: auto 100%;
    background-size: auto 100%;
    background-attachment: scroll;
  }
}

.form-control {
    padding: 10px;
    border: solid 1px rgb(246 246 246 / 76%);
    background: rgba(0,0,0,.025);
    border-radius:6px;
    -moz-border-radius:6px;
    -webkit-border-radius:6px;
}

.form-control:focus {
    box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
}