/* ==========================================================================
*
* Custom CSS Stylesheet. Standard Colors
*
** ========================================================================== */
:root{
    --body-bg: #E4F1F9;
    --nav-header-bg: #000000;
    --nav-header-top-border: #1aaf46;

}
/* ==========================================================================
*
* Custom CSS Stylesheet. This is where you should add your own styles!
*
** ========================================================================== */

/* Simple style overrides or custom adds */

body{
	background-color: var(--body-bg);
}

.border-tcolor{
 border-color: var(--nav-header-top-border) !important;
}
/* Header anfang */
.site-header[data-header-style="5"] {background: var(--nav-header-bg);border-top: 3px solid var(--nav-header-top-border);}
.site-logo img {max-height: 90px;}
.sticky-header .site-logo img { max-height: 60px;}
.main-nav > ul > li a { text-decoration: none;}
/* Header ende */

/* Slider anfang */
.kl-slideshow.uh_light_gray { background-color: var(--body-bg);  border-bottom: 6px solid var(--nav-header-top-border);}
.tp-bullets.kallyas-default.vertical {  position: absolute;}
.tp-caption.very_big_white, .very_big_white { background-color: transparent !important;}
/* Slider ende */



/* Card anfang */
.card.hover-shadow-lg { box-shadow: 0 1px 6px 0 rgba(68, 68, 68, 0.1), 0 1px 2px 0 rgba(68, 68, 68, 0.3); background-color: rgba(255, 255, 255, 0.94);}
.hover-shadow-lg:hover  { box-shadow: 0 5px 15px 0 rgba(102, 102, 102, 0.3)!important;}
.card.hover-shadow-lg a{ text-decoration: none !important;}
/* Card ende */

.bg-bg{
  background-color: var(--body-bg);
}
/* Listen anfang */
ul.features {
  margin: 25px 0;
  padding: 0;
  list-style: none;
}
ul.features li:first-child {
  margin-top: 0;
}

ul.features li {
  padding-left: 50px;
  background: url(../images/ok3.png) no-repeat left center;
  margin-top: 20px;
}
/* Listen Ende */

/* Footer Anfang */
.social-icons li a {text-decoration: none;}
#footer[data-footer-style="5"] .menu a { color: #ffffff !important; text-decoration: none;}
#footer[data-footer-style="5"] .menu a:hover { color: var(--nav-header-top-border) !important; text-decoration: none;}
#footer p { color: #fff !important;}
/* Footer Ende */

.some-css-selector {font-size:13px;}
.site-logo img {

  width: auto;
}
.tcolor {
  color: hsl(150, 100%, 25%) !important;
}
.bg-magenta {
  background-color: #f653a6 !important;
}

/* ==========================================================================
** Responsive styles custom rules
* These rules are ready to be used for either overrides
* or just your own custom rules.
========================================================================== */


/** Higher screens+ **/
@media only screen and (min-width : 1921px){

}


/** Desktop+ **/
@media (min-width: 1200px) {

}


/** Laptop **/
@media (max-width: 1200px) {

}
@media screen and (min-width: 992px) {
    .main-nav > ul > li > a::before {
      background-color: var(--nav-header-top-border);
    }
  }

/** Laptop+ **/
@media (min-width: 991px) {

}


/** Laptop **/
@media (min-width: 992px) and (max-width: 1199px) {

}


/** Large Tablets **/
@media (max-width: 992px) {

  .site-logo img {
    max-height: 60px;
    width: auto;
  }
  .fs-2 {
    font-size: calc(1.0rem + .9vw) !important;
  }
}


/** Tablets (landscape mode)  **/
@media (min-width: 768px) and (max-width: 991px) {

}


/** Tablets+  **/
@media (min-width: 768px) {

}


/** Tablets (portrait mode)  **/
@media (min-width : 481px) and (max-width : 768px) {

}


/** Smartphone landscape mode / Mini Tablet **/
@media (max-width: 767px) {
  .tbk__title {
    width: 80%;
    margin: 0 auto;
  }
}


/** Smartphone landscape mode / Mini Tablet **/
@media (max-width: 600px) {
  body{
    background-color: #fff;
  }
  .site-logo img {
    max-height: 50px;
    width: auto;
  }
}


/** Smartphone portrait mode **/
@media (max-width: 480px) {

}


/** Normal phone portrait mode+ **/
@media (min-width: 320px) {
	
}