/* general variables */
:root {
  --spacing-unit: 40px;
  --color-primary: #00c3c0;
  --color-primary-hover: #00a3a0;
  --color-primary-light: #00ead8;
  --color-primary-light-ico: #00eadd;
  --color-success: #00bb4b;
  --color-bg: #f6f6f6;
  --color-bg-odd: #ebebeb;
  --color-bg-invert: #2d2d2d;
  --color-text-invert: #ffffff;
  --font-sans: 'Roboto', sans-serif;
  --font-round: 'Varela round';
  --transition: all 0.3s;
}

body {
  font-family: var(--font-sans);
}


/* utilities */
html{height: 100%;}
body{-webkit-font-smoothing: antialiased; background: var(--color-bg); font-size: 16px; line-height: 2;}
.fullheight{height: 100%;}
.center-items{display: flex; align-items: center;}
.big-text{font-size: 1.3rem; font-weight: 200; margin: 0;}
.h-33{height: 33%;}
.h-40{height: 40%;}
.h-90{height: 90%;}
.minh-100{height: 85%;}
.section-block.minh-100 > div{overflow: auto;}
.mw-500px{max-width: 500px;}
.mw-650px{max-width: 650px;}
.mw-750px{max-width: 750px;}
.mw-900px{max-width: 900px;}
.display-1 {font-size: 5.5rem;font-family: var(--font-round);}
.display-2 {font-size: 5rem;font-family: var(--font-round);}
.display-3 {font-size: 4rem;font-family: var(--font-round);}
.display-4 {font-size: 3.5rem;font-family: var(--font-round);}
.display-5 {font-size: 2.6rem;font-weight: 300;line-height: 1.2;font-family: var(--font-round);}
.display-6 {font-size: 2rem;font-weight: 300;line-height: 1.4;}
.display-7 {font-size: 1.3rem;font-weight: 300;line-height: 1.7;}
.color-white, .color-white:hover{color: #ffffff;}
.color-success{color: var(--color-success);}
.step-nr{ vertical-align: 2px; margin-right: 10px; border: 1px solid var(--color-primary); color: var(--color-primary); display: inline-block; width: 25px; height: 25px; line-height: 23px; text-align: center; border-radius: 15px; font-size: 16px; font-weight: bold;}
a{color: var(--color-primary);}
a:hover{color: var(--color-primary-hover);}
@media (max-width: 575px) {
  .display-1{font-size: 5rem;}
  .display-2{font-size: 4.5rem;}
  .display-3{font-size: 3.5rem;}
  .display-4{font-size: 2.5rem;}
  .display-5{font-size: 2rem;}
  .display-6{font-size: 1.6rem;}
  .display-7{font-size: 1.3rem;}
}
@media (max-width: 575px) {
  .h-xs-33{height: 33%;}
  .h-xs-40{height: 40%;}
  .h-xs-80{height: 80%;}
  .h-xs-90{height: 90%;}
}
@media (min-width: 576px) {
  .h-sm-33{height: 33%;}
  .h-sm-40{height: 40%;}
  .h-sm-80{height: 80%;}
  .h-sm-90{height: 90%;}
  .resize-font{font-size: var(--resize-sm, 100%)}
}
@media (min-width: 768px) {
  .h-md-33{height: 33%;}
  .h-md-40{height: 40%;}
  .h-md-80{height: 80%;}
  .h-md-90{height: 90%;}
}
@media (min-width: 992px) {
  .h-lg-33{height: 33%;}
  .h-lg-40{height: 40%;}
  .h-lg-80{height: 80%;}
  .h-lg-90{height: 90%;}
}
@media (min-width: 1200px) {
  .h-xl-33{height: 33%;}
  .h-xl-40{height: 40%;}
  .h-xl-80{height: 80%;}
  .h-xl-90{height: 90%;}
}

@media (max-width: 575px) {
  .resize-font{font-size: var(--resize-xs, 100%)}
}
@media (min-width: 576px) and (max-width: 767px){
  .resize-font{font-size: var(--resize-sm, 100%)}
}
@media (min-width: 768px) and (max-width: 991px){
  .resize-font{font-size: var(--resize-md, 100%)}
}
@media (min-width: 992px) and (max-width: 1199px){
  .resize-font{font-size: var(--resize-lg, 100%)}
}
@media (min-width: 1200px){
  .resize-font{font-size: var(--resize-xl, 100%)}
}

@media (max-width: 575px) {
  .text-center-xs{text-align: center;}
}
@media (max-width: 767px){
  .text-center-sm{text-align: center;}
}
@media (max-width: 991px){
  .text-center-md{text-align: center;}
}
@media (max-width: 1199px){
  .text-center-lg{text-align: center;}
}

/* navigation */
.center-under-lg{display: none;}
.navbar-dark{transition: var(--transition);padding-top: 0; padding-bottom: 0;}
.moving-nav{background: rgba(17, 20, 29, 0.8); -webkit-backdrop-filter: blur(10px);}
.moving-nav .center-under-lg{display: inline-block;}
.navbar-dark .navbar-toggler{border: 0; font-size: 0.9rem; text-transform: uppercase; margin-right: -5px;}
.navbar .navbar-toggler .ico{margin-left: 3px; vertical-align: -6px; color: #ffffff;}
.navbar-nav{text-transform: uppercase; font-size: 0.9rem;font-weight: 600;}
.nav-logo-name{margin-left: 10px; vertical-align: middle;}
@media (max-width: 991px){
  .navbar-collapse{position: fixed;left: 0;right: 0;top: 0px; padding-top: 50px; z-index: -1; background: rgba(0,0,0,0.8); -webkit-backdrop-filter: blur(10px);}
  .navbar-dark .navbar-nav{padding: 30px 20px 20px;}
  .navbar-dark .navbar-nav .nav-link{margin-bottom: 15px;}
  .navbar-dark .navbar-nav .nav-link:last-child{margin-bottom: 0px;}
  .s-footer .col-md-4{text-align: left !important;}
}
@media (min-width: 992px){
  .navbar-nav .nav-link{ padding-right: 1rem !important; padding-left: 1rem !important;}
}


/* section block */
.section-block{padding: calc(var(--spacing-unit) * 2) 0;}
.section-block .container::after{content:''; clear: both; display: block;}
.block-invert{background: var(--color-bg-invert); color: var(--color-text-invert);}
.block-invert .text-muted{color: var(--color-text-invert) !important; opacity: 0.7}
.block-invert a:not(.btn){color: var(--color-text-invert); text-decoration: underline;}
.block-invert a:not(.btn):hover{color: var(--color-primary-light);}
.block-gradient {
  background: linear-gradient(-129deg, #06B895 0%, #00B9E5 100%) !important;
  color: var(--color-text-invert);
}
.block-odd{background: var(--color-bg-odd);}
.block-img{background-size: cover; background-position: center center;}
.block-img .block-invert{background: rgba(19,20,29,0.7)}
@media (min-width: 992px){
  .section-block{padding: calc(var(--spacing-unit) * 4) 0;}
  .big-text{font-size: 1.7rem; }
}

.block-feature{margin-bottom: calc(var(--spacing-unit) * 2);margin-top: calc(var(--spacing-unit) * var(--block-top));max-width: 100%;}
.block-feature-margin{margin-left: 10px; margin-right: 10px; max-width: calc(100% - 20px)}
div.block-feature{padding: 40px 10px; font-size: 1.5rem; border-radius: 7px;margin-bottom: var(--spacing-unit);}
@media (min-width: 768px) {
  .block-feature{float: var(--block-float, right); width: var(--block-width, 50%); margin-top: calc(var(--spacing-unit) * var(--block-top));}
  .block-feature-margin{margin-left: 40px; margin-right: 40px;}
  div.block-feature{padding: 100px 50px;}
}
@media (min-width: 992px){
  .block-feature{margin-top: calc(var(--spacing-unit) * var(--block-top) * 2.5);}
}

/* footer */
.s-footer{font-size: 0.9rem;}
.footer-nav > ul > li > a{font-weight: 600; text-decoration: none !important; display: inline-block; text-transform: uppercase; padding: 5px 10px; margin: 5px 0; position: relative;}
.footer-nav > ul > li.active > a{color: var(--color-primary-light);}
.s-footer .social-links-big{margin-bottom: 40px;}
.social-links-big li {margin: 0 10px;}
.social-links-big li a{font-size: 30px;}
.block-invert .social-links-big li a:hover{color: var(--color-primary-light-ico);}
.copyright .ico{vertical-align: -6px;}

/* news letter */
.newsletter-form{display: flex; flex-direction: column; margin-top: 40px;}
.newsletter-form input{margin: 0 0 10px;}
@media (min-width: 576px) {
  .newsletter-form{flex-direction: row; max-width: 500px; margin-left: auto; margin-right: auto;  }
  .newsletter-form input{margin: 0 20px 0 0;}
}
.news-bar {
  padding: 20px 10px;
}

.news-bar a {
  font-size: 20px;
  text-decoration: none !important;
  transition: var(--transition);
  display: block;
  line-height: 1.5;
}

.news-bar a:hover {
  opacity: 0.7;
  margin-left: 7px;
  margin-right: -7px;
}

.news-bar a .ico {
  vertical-align: -5px;
}