@charset "UTF-8";
/* ***************************************************************************************** */
/* (c) designschmiede - www.wirschmiedendesign.de  
/* based on framework BOOTSTRAP V4 
/* ***************************************************************************************** */

/* navbar - basic adjustments
------------------------------------------------------------------------------------- */
#navbar {
	position          : fixed;
	top               : 0;
	left              : 0;
	z-index           : 997;
	width             : 100%;
	-webkit-transition: top 0.4s ease-in-out;
	transition        : top 0.4s ease-in-out;
	-webkit-transform : translateZ(0);
	transform         : translateZ(0);
}

#diagonalBorder img {
	height    : 25px;
	width     : 100%;
	margin    : 0;
	padding   : 0;
	margin-top: -1px;
}

/*
.docready #navbar {

  border-bottom: 1px solid rgba(58,74,77,1.00);	
	box-shadow    : 0px 1px 2px 0px rgba(0,0,0,0.75);
}
  */

#navbar .navbar-collapse {
	z-index: 0;
}

#navbar .navbar {
	position: relative;
}

@media screen and (max-width: 991px) {
	#navbar .navbar-nav {
		margin-left: auto;
	}
}

#navbar .navbar-light .nav-link {
	color: rgba(225, 225, 225, 1) !important;
}

/* navbar - items & links
------------------------------------------------------------------------------------- */
#navbar .navbar-nav {
	margin-bottom: 10px;
	margin-top   : 10px;
	z-index      : 1;
}

#navbar .navbar a,
#navbar .navbar .dropdown-item {
	font-size     : 16px;
	font-weight   : 300;
	letter-spacing: normal;
}

@media screen and (max-width: 991px) {
	#navbar .navbar a {
		font-size : 15px;
		text-align: left;
	}

	/* #navBackground {
	border-bottom: 1px solid grey; }*/
}

#navbar .navbar .nav-item {
	min-width    : 95px;
	padding-left : 5px;
	padding-right: 5px;
}

#navbar .navbar .nav-item a:focus {
	color: rgba(113, 113, 113, 1);
}

#navbar .navbar .nav-item .nav-link {
	border-bottom             : 3px solid transparent;
	border-bottom-right-radius: 5%;
	border-bottom-left-radius : 5%;
	/* display                : inline-block; CENTER LINKS */
}

#navbar .navbar .nav-item.active .nav-link {
	border-bottom               : 3px solid rgba(30, 83, 25, 1.00);
	/* border-bottom-left-radius: 5%;
  border-bottom-right-radius : 5%; */
	color                       : rgba(245, 245, 245, 1) !important;
}

/* navbar - brand
------------------------------------------------------------------------------------- */
#navbar .navbar-brand {
	width             : 200px;
	margin-right      : 10px;
	padding-top       : 23px;
	z-index           : 998;
	-webkit-transition: all 0.4s ease-in-out;
	transition        : all 0.4s ease-in-out;
}

#navbar.stickyscroll .navbar-brand {
	width: 170px;
}

@media screen and (max-width: 490px) {
	#navbar .navbar-brand {
		width         : 190px;
		padding-top   : 12px;
		padding-bottom: 11px;
	}

	#navbar.stickyscroll .navbar-brand {
		width: 140px;
	}
}

/* navbar - dropdown - caret & click-anim
-------------------------------------------------------------------------------------- 
#navbar .navbar .dropdown .dropdown-toggle[aria-expanded="true"]:after {
  -webkit-transform: rotate(180deg); 
	transform         : rotate(180deg);}

#navbar .navbar .dropdown .dropdown-toggle:after {
  -webkit-transition: 0.5s;
	transition         : 0.5s;}*/

/* navbar - dropdown - caret & hover-anim
-------------------------------------------------------------------------------------- */
/* #navbar .navbar .dropdown.caret .dropdown-toggle:after, */
#navbar .navbar .dropdown.show .dropdown-toggle:after {
	-webkit-transform: rotate(180deg);
	transform        : rotate(180deg);
}

#navbar .navbar .dropdown .dropdown-toggle:after {
	-webkit-transform : none;
	transform         : none;
	-webkit-transition: 0.5s;
	transition        : 0.5s;
}

/* navbar - dropdown - menu 
-------------------------------------------------------------------------------------- */
#navbar .navbar .dropdown-menu {
	border-radius: 0px 0px 7px 7px;
}

#navbar .dropdown-menu a:hover,
#navbar .dropdown-menu a:focus {
	-webkit-transition: background-color 0.2s;
	transition        : background-color 0.2s;
	background-color  : rgba(209, 209, 209, 1.00);
}

#navbar .dropdown-menu {
	background-color          : rgba(234, 234, 234, 1.00);
	margin-top                : 0px;
	border-top-left-radius    : 0;
	border-top-right-radius   : 0;
	border-bottom-left-radius : 2px;
	border-bottom-right-radius: 2px;
	/*border-top              : 1px solid rgba(140,140,140,1.00);
	border-bottom             : 1px solid rgba(120,120,120,1.00);*/
}

@media screen and (max-width: 991px) {
	#navbar .dropdown-menu .dropdown-item {
		font-size: 14px;
	}
}

/* navbar - hamburger-icon
-------------------------------------------------------------------------------------- */
#navbar .navbar-toggler {
	background-color: inherit;
	text-decoration : none;
	border          : none;
	outline         : none;
}

#navbar .hamburger {
	padding: 0;
}

#navbar .hamburger-inner:before,
#navbar .hamburger-inner:after,
#navbar .hamburger-inner {
	height          : 2px !important;
	background-color: rgba(220, 220, 220, 1.00) !important;
}

#navbar .hamburger-label {
	display    : block;
	font-weight: 300;
	color      : rgba(220, 220, 220, 1.00);
	font-size  : 13px;
	margin-top : 4px;
}

/* navbar - icons svg
-------------------------------------------------------------------------------------- */
#navbar .fa-svg {
	width         : 15px;
	height        : 15px;
	margin-bottom : 2px;
	display       : inline-block;
	vertical-align: middle;
}


/* navbarSub
-------------------------------------------------------------------------------------- */
#navbarSub {
	position          : fixed;
	top               : 0;
	left              : 0;
	z-index           : 997;
	width             : 100%;
	-webkit-transform : translateZ(0);
          transform : translateZ(0);
  box-shadow: 0px 0px 4px 2px rgba(0,0,0,0.75);  
}

#navbarSub .navbar-brand {
  margin: 0 auto;
  padding-top: 20px;	
  padding-bottom: 15px;
}
  
#navbarSub .navbar-brand img {
  width: 230px;
}


/* carouselMain - basic adjustments 
---------------------------------------------------------------------------- */
#carouselMain_bt4 {
	position: relative;
	padding         : 0;
	margin-top      : 90px;
	background-color: inherit;
	overflow        : hidden;
	box-shadow      : 0px 1px 2px 0px rgba(0, 0, 0, 0.75);
}

#carouselMain_bt4,
#carouselMain_bt4 .carousel-inner,
#carouselMain_bt4 .carousel-inner .carousel-item {
	height: calc(100vh - 90px);
	min-height   : 35rem;
	border-radius: 0 0 0 0;
}

/*
@media screen and (max-width: 1200px) {
#carouselMain .carousel-main {
	height: calc(100vh - 155px);}}
*/

@media screen and (orientation:portrait) {
#carouselMain_bt4,
#carouselMain_bt4 .carousel-inner,
#carouselMain_bt4 .carousel-inner .carousel-item {
	height: 35rem;
  min-height: auto;}
} 

.touchevents #carouselMain_bt4,
.touchevents #carouselMain_bt4 .carousel-inner,
.touchevents #carouselMain_bt4 .carousel-inner .carousel-item {
	height: 35rem;
  min-height: auto;
}

/* carouselMain - prev/next-buttons 
---------------------------------------------------------------------------------------------- */
@media screen and (max-width: 480px) {
	.touchevents #carouselMain_bt4 .cpn {
		display: none;
	}
}

.cpn {
	z-index: 100;
	cursor : pointer;
}

.cpn img {
	width : 3rem;
	height: 3rem;
}

/* carouselMain - carousel-item-overlay & loading-icon 
----------------------------------------------------------------------------	*/
#carouselMain_bt4 .carousel-item .carousel-item-overlay {
	position          : absolute;
	width             : 100%;
	height            : 100%;
	top               : 0;
	left              : 0;
	margin            : 0;
	visibility        : visible;
	opacity           : 1;
	background-color  : rgba(235, 235, 235, 1);
	-webkit-transition: visibility 0s linear 1s, opacity 0.8s 0.2s linear;
	transition        : visibility 0s linear 1s, opacity 0.8s 0.2s linear;
}

#carouselMain_bt4 .carousel-item.goaway .carousel-item-overlay {
	visibility: hidden;
	opacity   : 0;
}

#carouselMain_bt4 .carousel-item .carousel-item-overlay .icon-wrapper {
	position        : relative;
	width           : 11rem;
	height          : 11rem;
	border-radius   : 50%;
	background-color: inherit;
	opacity         : 0;
}

#carouselMain_bt4 .carousel-item .carousel-item-overlay .icon-wrapper.active {
	-webkit-animation-timing-function: ease-in;
	animation-timing-function        : ease-in;
	-webkit-animation-duration       : 0.4s;
	animation-duration               : 0.4s;
	-webkit-animation-fill-mode      : both;
	animation-fill-mode              : both;
	-webkit-animation-name           : iconwrapper;
	animation-name                   : iconwrapper;
}

@-webkit-keyframes iconwrapper {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@keyframes iconwrapper {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

#carouselMain_bt4 .carousel-item .carousel-item-overlay .icon-wrapper .icon {
	width            : 100%;
	height           : 100%;
	position         : absolute;
	top              : 0;
	left             : 0;
	border-radius    : 50%;
	background-color : rgba(190, 193, 206, 1.00);
	-webkit-animation: carousel_main_bt4-icon 1.5s infinite ease-in-out;
	animation        : carousel_main_bt4-icon 1.5s infinite ease-in-out;
}

@-webkit-keyframes carousel_main_bt4-icon {
	0% {
		-webkit-transform: scale3d(0, 0, 0);
		transform        : scale3d(0, 0, 0);
	}

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

@keyframes carousel_main_bt4-icon {
	0% {
		-webkit-transform: scale3d(0, 0, 0);
		transform        : scale3d(0, 0, 0);
	}

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

/* carouselMain - fade-effect of slides (use #mycarouselContainer!)
---------------------------------------------------------------------------- */
#mycarouselContainer .carousel.fade_image {
	opacity: 1;
}

#mycarouselContainer .carousel.fade_image .carousel-item {
	-webkit-transition: opacity ease-in-out 1.7s;
	transition        : opacity ease-in-out 1.7s;
	left              : 0;
	opacity           : 0;
	top               : 0;
	position          : absolute;
	width             : 100%;
	display           : block;
}

#mycarouselContainer .carousel.fade_image .carousel-item.active {
	opacity: 1;
}

/* carouselMain - background-images with media queries
---------------------------------------------------------------------------------------------- */
#carouselMain_bt4 .carousel-inner .carousel-item {
	background-size  : cover;
	background-repeat: no-repeat;
}

#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(1) {
	background-position: center bottom;
}

#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(2) {
	background-position: center bottom;
}

#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(3) {
	background-position: center bottom;
}

#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(4) {
	background-position: center bottom;
}

@media screen and (max-width: 768px) and (-webkit-max-device-pixel-ratio: 1.4),
screen and (max-width: 768px) and (max-resolution: 191dpi),
screen and (max-width: 768px) and (max-resolution: 1.4dppx) {
	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(1) {
		background-image: url("../images/carouselMain_bt4/01-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-768.jpg");
	}

	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(2) {
		background-image: url("../images/carouselMain_bt4/02-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-768.jpg");
	}

	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(3) {
		background-image: url("../images/carouselMain_bt4/03-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-768.jpg");
	}

	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(4) {
		background-image: url("../images/carouselMain_bt4/04-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-768.jpg");
	}
}

@media screen and (min-width: 769px) and (max-width: 1023px) and (-webkit-max-device-pixel-ratio: 1.4),
screen and (min-width: 769px) and (max-width: 1023px) and (max-resolution: 191dpi),
screen and (min-width: 769px) and (max-width: 1023px) and (max-resolution: 1.4dppx) {
	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(1) {
		background-image: url("../images/carouselMain_bt4/01-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-996.jpg");
	}

	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(2) {
		background-image: url("../images/carouselMain_bt4/02-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-996.jpg");
	}

	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(3) {
		background-image: url("../images/carouselMain_bt4/03-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-996.jpg");
	}

	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(4) {
		background-image: url("../images/carouselMain_bt4/04-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-996.jpg");
	}
}

@media screen and (min-width: 1024px) and (max-width: 1440px) and (-webkit-max-device-pixel-ratio: 1.4),
screen and (min-width: 1024px) and (max-width: 1440px) and (max-resolution: 191dpi),
screen and (min-width: 1024px) and (max-width: 1440px) and (max-resolution: 1.4dppx) {
	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(1) {
		background-image: url("../images/carouselMain_bt4/01-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-1440.jpg");
	}

	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(2) {
		background-image: url("../images/carouselMain_bt4/02-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-1440.jpg");
	}

	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(3) {
		background-image: url("../images/carouselMain_bt4/03-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-1440.jpg");
	}

	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(4) {
		background-image: url("../images/carouselMain_bt4/04-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-1440.jpg");
	}
}

@media screen and (min-width: 1441px) and (-webkit-max-device-pixel-ratio: 1.4),
screen and (min-width: 1441px) and (max-resolution: 191dpi),
screen and (min-width: 1441px) and (max-resolution: 1.4dppx) {
	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(1) {
		background-image: url("../images/carouselMain_bt4/01-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-1920.jpg");
	}

	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(2) {
		background-image: url("../images/carouselMain_bt4/02-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-1920.jpg");
	}

	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(3) {
		background-image: url("../images/carouselMain_bt4/03-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-1920.jpg");
	}

	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(4) {
		background-image: url("../images/carouselMain_bt4/04-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-1920.jpg");
	}
}

@media screen and (max-width: 768px) and (-webkit-min-device-pixel-ratio: 1.5),
screen and (max-width: 768px) and (min-resolution: 192dpi),
screen and (max-width: 768px) and (min-resolution: 1.5dppx) {
	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(1) {
		background-image: url("../images/carouselMain_bt4/01-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-996.jpg");
	}

	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(2) {
		background-image: url("../images/carouselMain_bt4/02-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-996.jpg");
	}

	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(3) {
		background-image: url("../images/carouselMain_bt4/03-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-996.jpg");
	}

	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(4) {
		background-image: url("../images/carouselMain_bt4/04-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-996.jpg");
	}
}

@media screen and (min-width: 769px) and (max-width: 1023px) and (-webkit-min-device-pixel-ratio: 1.5),
screen and (min-width: 769px) and (max-width: 1023px) and (min-resolution: 192dpi),
screen and (min-width: 769px) and (max-width: 1023px) and (min-resolution: 1.5dppx) {
	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(1) {
		background-image: url("../images/carouselMain_bt4/01-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-1440.jpg");
	}

	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(2) {
		background-image: url("../images/carouselMain_bt4/02-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-1440.jpg");
	}

	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(3) {
		background-image: url("../images/carouselMain_bt4/03-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-1440.jpg");
	}

	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(4) {
		background-image: url("../images/carouselMain_bt4/04-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-1440.jpg");
	}
}

@media screen and (min-width: 1024px) and (max-width: 1440px) and (-webkit-min-device-pixel-ratio: 1.5),
screen and (min-width: 1024px) and (max-width: 1440px) and (min-resolution: 192dpi),
screen and (min-width: 1024px) and (max-width: 1440px) and (min-resolution: 1.5dppx) {
	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(1) {
		background-image: url("../images/carouselMain_bt4/01-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-1920.jpg");
	}

	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(2) {
		background-image: url("../images/carouselMain_bt4/02-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-1920.jpg");
	}

	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(3) {
		background-image: url("../images/carouselMain_bt4/03-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-1920.jpg");
	}

	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(4) {
		background-image: url("../images/carouselMain_bt4/04-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-1920.jpg");
	}
}

@media screen and (min-width: 1441px) and (-webkit-min-device-pixel-ratio: 1.5),
screen and (min-width: 1441px) and (min-resolution: 192dpi),
screen and (min-width: 1441px) and (min-resolution: 1.5dppx) {
	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(1) {
		background-image: url("../images/carouselMain_bt4/01-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-2560.jpg");
	}

	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(2) {
		background-image: url("../images/carouselMain_bt4/02-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-2560.jpg");
	}

	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(3) {
		background-image: url("../images/carouselMain_bt4/03-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-2560.jpg");
	}

	#carouselMain_bt4 .carousel-inner .carousel-item:nth-child(4) {
		background-image: url("../images/carouselMain_bt4/04-Gunthard_Klatt_Handelsvertretung_Parkett_Leisten_Dielen-2560.jpg");
	}
}

/* ueberuns - basic adjustments
------------------------------------------------------------------------------------- */
#ueberuns .columnOne {
	width: 155rem;}

#ueberuns .gunthard {
  margin-top: 3rem;}  

#ueberuns .columnOne img {
	border-radius: 0%;
  /*
	border: 1px solid rgba(225,225,225,1.00);	
	box-shadow: 0px 0px 4px 2px rgba(0,0,0,0.9);
	box-shadow: inset 0px 0px 15px 2px rgba(0,0,0,0.9), 0px 0px 3px 2px rgba(0,0,0,0.9);
	outline: none;
  */
}

#ueberuns .columnTwo img {
	width: 12.5rem;
}

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

  #ueberuns .gunthard {
    margin-top: 0;
  }  
  
	#ueberuns .flexColumn {
		flex-direction: column-reverse;
	}

	#ueberuns .columnOne {
    width: 90%;
    		max-width: 33rem;
	}
}


/* imagePlanks - basic adjustments
------------------------------------------------------------------------------------- */
#imagePlank1,
#imagePlank2,
#imagePlank3,
#imagePlank4,
#imagePlank5 {
	position: relative;
	z-index : 2;
	padding : 0;
}

#imagePlank1.loaded,
#imagePlank2.loaded,
#imagePlank3.loaded,
#imagePlank4.loaded,
#imagePlank5.loaded {
	box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.75);
}

#imagePlank1 .item,
#imagePlank2 .item,
#imagePlank3 .item,
#imagePlank4 .item,
#imagePlank5 .item {
	height             : 9rem;
	background-size    : cover;
	background-repeat  : no-repeat;
	background-position: center center;
}

/* imagePlanks - background-image with media queries
---------------------------------------------------------------------------------------------- */
@media screen and (max-width: 768px) and (-webkit-max-device-pixel-ratio: 1.4),
screen and (max-width: 768px) and (max-resolution: 191dpi),
screen and (max-width: 768px) and (max-resolution: 1.4dppx) {
	#imagePlank1 .item {
		background-image: url("../images/imagePlank/oak-768.jpg");
	}

	#imagePlank2 .item {
		background-image: url("../images/imagePlank/oak2-768.jpg");
	}

	#imagePlank3 .item {
		background-image: url("../images/imagePlank/oak-768.jpg");
	}

	#imagePlank4 .item {
		background-image: url("../images/imagePlank/oak2-768.jpg");
	}

	#imagePlank5 .item {
		background-image: url("../images/imagePlank/oak-768.jpg");
	}
}

@media screen and (min-width: 769px) and (max-width: 1023px) and (-webkit-max-device-pixel-ratio: 1.4),
screen and (min-width: 769px) and (max-width: 1023px) and (max-resolution: 191dpi),
screen and (min-width: 769px) and (max-width: 1023px) and (max-resolution: 1.4dppx) {
	#imagePlank1 .item {
		background-image: url("../images/imagePlank/oak-996.jpg");
	}

	#imagePlank2 .item {
		background-image: url("../images/imagePlank/oak2-996.jpg");
	}

	#imagePlank3 .item {
		background-image: url("../images/imagePlank/oak-996.jpg");
	}

	#imagePlank4 .item {
		background-image: url("../images/imagePlank/oak2-996.jpg");
	}

	#imagePlank5 .item {
		background-image: url("../images/imagePlank/oak-996.jpg");
	}
}

@media screen and (min-width: 1024px) and (max-width: 1440px) and (-webkit-max-device-pixel-ratio: 1.4),
screen and (min-width: 1024px) and (max-width: 1440px) and (max-resolution: 191dpi),
screen and (min-width: 1024px) and (max-width: 1440px) and (max-resolution: 1.4dppx) {
	#imagePlank1 .item {
		background-image: url("../images/imagePlank/oak-1440.jpg");
	}

	#imagePlank2 .item {
		background-image: url("../images/imagePlank/oak2-1440.jpg");
	}

	#imagePlank3 .item {
		background-image: url("../images/imagePlank/oak-1440.jpg");
	}

	#imagePlank4 .item {
		background-image: url("../images/imagePlank/oak2-1440.jpg");
	}

	#imagePlank5 .item {
		background-image: url("../images/imagePlank/oak-1440.jpg");
	}
}

@media screen and (min-width: 1441px) and (-webkit-max-device-pixel-ratio: 1.4),
screen and (min-width: 1441px) and (max-resolution: 191dpi),
screen and (min-width: 1441px) and (max-resolution: 1.4dppx) {
	#imagePlank1 .item {
		background-image: url("../images/imagePlank/oak-1920.jpg");
	}

	#imagePlank2 .item {
		background-image: url("../images/imagePlank/oak2-1920.jpg");
	}

	#imagePlank3 .item {
		background-image: url("../images/imagePlank/oak-1920.jpg");
	}

	#imagePlank4 .item {
		background-image: url("../images/imagePlank/oak2-1920.jpg");
	}

	#imagePlank5 .item {
		background-image: url("../images/imagePlank/oak-1920.jpg");
	}
}

@media screen and (max-width: 768px) and (-webkit-min-device-pixel-ratio: 1.5),
screen and (max-width: 768px) and (min-resolution: 192dpi),
screen and (max-width: 768px) and (min-resolution: 1.5dppx) {
	#imagePlank1 .item {
		background-image: url("../images/imagePlank/oak-996.jpg");
	}

	#imagePlank2 .item {
		background-image: url("../images/imagePlank/oak2-996.jpg");
	}

	#imagePlank3 .item {
		background-image: url("../images/imagePlank/oak-996.jpg");
	}

	#imagePlank4 .item {
		background-image: url("../images/imagePlank/oak2-996.jpg");
	}

	#imagePlank5 .item {
		background-image: url("../images/imagePlank/oak-996.jpg");
	}
}

@media screen and (min-width: 769px) and (max-width: 1023px) and (-webkit-min-device-pixel-ratio: 1.5),
screen and (min-width: 769px) and (max-width: 1023px) and (min-resolution: 192dpi),
screen and (min-width: 769px) and (max-width: 1023px) and (min-resolution: 1.5dppx) {
	#imagePlank1 .item {
		background-image: url("../images/imagePlank/oak-1440.jpg");
	}

	#imagePlank2 .item {
		background-image: url("../images/imagePlank/oak2-1440.jpg");
	}

	#imagePlank3 .item {
		background-image: url("../images/imagePlank/oak-1440.jpg");
	}

	#imagePlank4 .item {
		background-image: url("../images/imagePlank/oak2-1440.jpg");
	}

	#imagePlank5 .item {
		background-image: url("../images/imagePlank/oak-1440.jpg");
	}
}

@media screen and (min-width: 1024px) and (max-width: 1440px) and (-webkit-min-device-pixel-ratio: 1.5),
screen and (min-width: 1024px) and (max-width: 1440px) and (min-resolution: 192dpi),
screen and (min-width: 1024px) and (max-width: 1440px) and (min-resolution: 1.5dppx) {
	#imagePlank1 .item {
		background-image: url("../images/imagePlank/oak-1920.jpg");
	}

	#imagePlank2 .item {
		background-image: url("../images/imagePlank/oak2-1920.jpg");
	}

	#imagePlank3 .item {
		background-image: url("../images/imagePlank/oak-1920.jpg");
	}

	#imagePlank4 .item {
		background-image: url("../images/imagePlank/oak2-1920.jpg");
	}

	#imagePlank5 .item {
		background-image: url("../images/imagePlank/oak-1920.jpg");
	}
}

@media screen and (min-width: 1441px) and (-webkit-min-device-pixel-ratio: 1.5),
screen and (min-width: 1441px) and (min-resolution: 192dpi),
screen and (min-width: 1441px) and (min-resolution: 1.5dppx) {
	#imagePlank1 .item {
		background-image: url("../images/imagePlank/oak-2560.jpg");
	}

	#imagePlank2 .item {
		background-image: url("../images/imagePlank/oak2-2560.jpg");
	}

	#imagePlank3 .item {
		background-image: url("../images/imagePlank/oak-2560.jpg");
	}

	#imagePlank4 .item {
		background-image: url("../images/imagePlank/oak2-2560.jpg");
	}

	#imagePlank5 .item {
		background-image: url("../images/imagePlank/oak-2560.jpg");
	}
}


/* vertretungen - basic adjustments
---------------------------------------------------------------------------------------------- */
#vertretungen {
	position: relative;
	padding : 25px 0;
}

#vertretungen .box_width {
	max-width: 950px;
}

/* masonry/isotope - grid
---------------------------------------------------------------------------------------------- */
#vertretungen .grid-gap-h {
	padding-left : 2rem;
	padding-right: 2rem;
	margin-bottom: 3rem;
}

#vertretungen .item-container {
	margin                 : 0;
	position               : relative;
	border-top-left-radius : 4px;
	border-top-right-radius: 4px;
	/* border                 : solid 1px grey; */
	overflow               : hidden;
	/*  box-shadow          : 0px 0px 2px 0px rgba(0,0,0,0.75); */
}

/* masonry/isotope 
----------------------------------------------------------------------------------------------*/
#vertretungen .grid-item .description-main {
  position               : relative;
  overflow               : hidden;
	padding: 0;
  box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.75);
  background-color: rgba(255,255,255,1.00);
  border-radius : 6px;
}

#vertretungen .textCMS {
	text-align: left;
}

#vertretungen .grid-item .description-main .btn {
	margin-top: 10px;
	padding   : 0.8rem;
	display   : block;
}

#vertretungen .grid-item .item-container .imageOverlay-wrapper {
	position             : absolute;
	border-radius        : inherit;
	top                  : 0;
	left                 : 0;
	height               : 100%;
	width                : 100%;
	background           : radial-gradient(transparent, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.5));
	opacity              : 0;
	/* -webkit-transition: opacity 0.4s ease-in;
	        transition   : opacity 0.4s ease-in;*/
}

/* 
.no-touchevents #vertretungen .grid-item.active .item-container.loaded:hover .imageOverlay-wrapper {
	opacity                        : 1;
	-webkit-transition-timing-function: ease-in;
					transition-timing-function    : ease-in;
}
*/

#vertretungen .grid-item .item-container .imageOverlay {
	position: absolute;
}

#vertretungen .grid-item .item-container .imageOverlay-content {
	color             : rgba(250, 250, 250, 1.00);
	text-shadow       : 1px 1px 2px rgba(0, 0, 0, 1);
	-webkit-transition: transform 0.5s;
	transition        : transform 0.5s;
	-webkit-transform : scale3d(0, 0, 0);
	-ms-transform     : scale3d(0, 0, 0);
	transform         : scale3d(0, 0, 0);
}

#vertretungen .grid-item.active .item-container.loaded:hover .imageOverlay-content,
.touchevents #vertretungen .grid-item.active .item-container.loaded .imageOverlay-content {
	-webkit-transform                 : scale3d(1, 1, 1);
	-ms-transform                     : scale3d(1, 1, 1);
	transform                         : scale3d(1, 1, 1);
	-webkit-transition-timing-function: ease-in-out;
	transition-timing-function        : ease-in-out;
}

#vertretungen .plus {
	width : 4.5rem;
	height: 4.5rem;
	margin: 0 auto;
}

/* card/collapse 
-------------------------------------------------------------------------------------- */
#vertretungen .card {
	background-color: transparent;
	border          : none;
	border-radius   : 0;
}

#vertretungen .card-body {
	padding-left : 1rem;
	padding-right: 1rem;
}

/* dropdown - caret & click-anim
-------------------------------------------------------------------------------------- */
#vertretungen .dropdown-toggle[aria-expanded="true"]:after {
	-webkit-transform: rotate(180deg);
	transform        : rotate(180deg);
}

#vertretungen .dropdown-toggle:after {
	-webkit-transition: 0.5s;
	transition        : 0.5s;
}


/* produkte - basic adjustments
---------------------------------------------------------------------------------------------- */
#produkte {
	position: relative;
	padding : 25px 0;
}

/* cell-description
---------------------------------------------------------------------------------------------- */
#produkte .cell-description {
	position               : absolute;
	z-index                : 1;
	text-align             : center;
	border-top-left-radius : 5px;
	border-top-right-radius: 5px;
	bottom                 : 0;
	left                   : 0;
	padding                : 0.5rem;
	background-color       : rgba(25,25,25,1.00);
	color                  : rgba(250, 250, 250, 1.00);
	width                  : 100%;
	height                 : auto;
	opacity                : 0;
	-webkit-transition     : all 0.9s 0.1s;
	transition             : all 0.9s 0.1s;
	-webkit-transform      : translateY(100%);
	-ms-transform          : translateY(100%);
	transform              : translateY(100%);
	font-weight            : 300;
	border-top             : solid 3px rgba(30, 83, 25, 1.00);
}

#produkte .carousel-cell.is-selected .cell-description {
	opacity                           : 1;
	-webkit-transform                 : none;
	-ms-transform                     : none;
	transform                         : none;
	-webkit-transition-timing-function: ease-out;
	transition-timing-function        : ease-out;
}


/* prev/next-button only on desktop 
---------------------------------------------------------------------------------------------- */
#produkte .flickity-prev-next-button {
	opacity           : 0;
	-webkit-transition: all 0.5s ease-in-out;
	transition        : all 0.5s ease-in-out;
}

#produkte .flickity-prev-next-button.previous {
	left: -20px;
}

#produkte .flickity-prev-next-button.next {
	right: -20px;
}

#produkte .carousel-wrapper:hover .flickity-prev-next-button,
.touchevents #produkte .flickity-prev-next-button {
	opacity                           : 1;
	-webkit-transition-timing-function: ease-in-out;
	transition-timing-function        : ease-in-out;
}

#produkte .carousel-wrapper:hover .flickity-prev-next-button.previous,
.touchevents #produkte .flickity-prev-next-button.previous {
	left: 20px;
}

#produkte .carousel-wrapper:hover .flickity-prev-next-button.next,
.touchevents #produkte .flickity-prev-next-button.next {
	right: 20px;
}

/* text-transformation for selected item
---------------------------------------------------------------------------------------------- */
@media screen and (min-width: 768px) {
	#produkte .cell-caption {
		-webkit-transform : scale3d(1, 1, 1);
		transform         : scale3d(1, 1, 1);
		-webkit-transition: transform 1.4s ease-in-out;
		transition        : transform 1.4s ease-in-out;
	}

	#produkte .carousel-cell.is-selected .cell-caption {
		-webkit-transform                 : scale3d(1.1, 1.1, 1.1);
		transform                         : scale3d(1.1, 1.1, 1.1);
		-webkit-transition-timing-function: ease-in-out;
		transition-timing-function        : ease-in-out;
	}
}

/* carousel & carousel-cell
---------------------------------------------------------------------------------------------- */
#produkte .carousel {
	height: 27rem;
}

@media screen and (min-width: 1441px) {
	#produkte .carousel {
		height: 21rem;
	}
}

#produkte .carousel-cell {
	position          : relative;
	width             : 100%;
	height            : inherit;
	margin-right      : 1.5rem;
	overflow          : hidden;
	/* https          ://stackoverflow.com/questions/49066011/overflow-hidden-with-border-radius-not-working-on-safari */
	border-radius     : 5px;
	-webkit-mask-image: -webkit-radial-gradient(white, black);
	mask-image: -webkit-radial-gradient(white, black);
}

@media screen and (min-width: 580px) {
	#produkte .carousel-cell {
		width: 50%;
	}
}

@media screen and (min-width: 996px) {
	#produkte .carousel-cell {
		width: 40%;
	}
}

@media screen and (min-width: 1441px) {
	#produkte .carousel-cell {
		width: 25%;
	}
}

@media screen and (min-width: 1920px) {
	#produkte .carousel-cell {
		width: 20%;
	}
}

#produkte .cell-caption .overlay {
  position: absolute;
  top: 0;
  left: 0;
	opacity           : 1;
	-webkit-transition: opacity 2s;
	transition        : opacity 2s;
	width             : 100%;
	height            : 100%;
	background-color  : rgba(235, 235, 235, 1);
}

#produkte .cell-caption.flickity-bg-lazyloaded .overlay {
	opacity: 0;
}

#produkte .cell-caption {
	width              : 100%;
	height             : 100%;
	background-size    : cover;
	background-repeat  : no-repeat;
	background-position: center center;
}


/* contactform_B2C - basic-adjustments
------------------------------------------------------------------------------------- */
#contactform_B2C {
	position  : relative;
	padding   : 25px 0;
	box-shadow: 0px -1px 2px 0px rgba(0, 0, 0, 0.75);
}

#contactform_B2C .contactform-wrapper {
	margin: 0 auto;
}

#contactform_B2C .contactform .btn {
	margin: 1rem auto;
}

#contactform_B2C_error_para {
	color     : red;
	margin-top: 5px;
}

#contactform_B2C textarea:placeholder-shown,
#contactform_B2C input:placeholder-shown {
	font-weight: 300 !important;
}

#contactform_B2C_form {
	padding: 0 10px;
}

@media screen and (min-width: 560px) {
	#contactform_B2C input[type=checkbox] {
		transform: scale(1.5) !important;
	}
}

#contactform_B2C textarea,
#contactform_B2C input[type=text],
#contactform_B2C input[type=password],
#contactform_B2C input[type=email],
#contactform_B2C input[type=number] {
	font-size: 1rem;
}


/* galerie - basic adjustments
---------------------------------------------------------------------------------------------- */
#galerie {
	position: relative;
	padding : 25px 0;
}

/* prev/next-button only on desktop 
---------------------------------------------------------------------------------------------- */
#galerie .flickity-prev-next-button {
	opacity           : 0;
	-webkit-transition: all 0.5s ease-in-out;
	transition        : all 0.5s ease-in-out;
}

#galerie .flickity-prev-next-button.previous {
	left: -20px;
}

#galerie .flickity-prev-next-button.next {
	right: -20px;
}

#galerie .carousel-wrapper:hover .flickity-prev-next-button,
.touchevents #galerie .flickity-prev-next-button {
	opacity                           : 1;
	-webkit-transition-timing-function: ease-in-out;
	transition-timing-function        : ease-in-out;
}

#galerie .carousel-wrapper:hover .flickity-prev-next-button.previous,
.touchevents #galerie .flickity-prev-next-button.previous {
	left: 20px;
}

#galerie .carousel-wrapper:hover .flickity-prev-next-button.next,
.touchevents #galerie .flickity-prev-next-button.next {
	right: 20px;
}

/* text-transformation for selected item
---------------------------------------------------------------------------------------------- */
@media screen and (min-width: 768px) {
	#galerie .cell-caption {
		-webkit-transform : scale3d(1, 1, 1);
		transform         : scale3d(1, 1, 1);
		-webkit-transition: transform 1.4s ease-in-out;
		transition        : transform 1.4s ease-in-out;
	}

	#galerie .carousel-cell.is-selected .cell-caption {
		-webkit-transform                 : scale3d(1.1, 1.1, 1.1);
		transform                         : scale3d(1.1, 1.1, 1.1);
		-webkit-transition-timing-function: ease-in-out;
		transition-timing-function        : ease-in-out;
	}
}

/* carousel & carousel-cell
---------------------------------------------------------------------------------------------- */
#galerie .carousel {
	height: 27rem;
}

@media screen and (min-width: 1441px) {
	#galerie .carousel {
		height: 21rem;
	}
}

#galerie .carousel-cell {
	width             : 100%;
	height            : inherit;
	margin-right      : 1.5rem;
	overflow          : hidden;
	position          : relative;
	/* https          ://stackoverflow.com/questions/49066011/overflow-hidden-with-border-radius-not-working-on-safari */
	border-radius     : 5px;
	-webkit-mask-image: -webkit-radial-gradient(white, black);
	mask-image: -webkit-radial-gradient(white, black);
}

@media screen and (min-width: 580px) {
	#galerie .carousel-cell {
		width: 50%;
	}
}

@media screen and (min-width: 996px) {
	#galerie .carousel-cell {
		width: 40%;
	}
}

@media screen and (min-width: 1441px) {
	#galerie .carousel-cell {
		width: 25%;
	}
}

@media screen and (min-width: 1920px) {
	#galerie .carousel-cell {
		width: 20%;
	}
}

#galerie .cell-caption .overlay {
  position: absolute;
  top: 0;
  left: 0;
	opacity           : 1;
	-webkit-transition: opacity 2s;
	transition        : opacity 2s;
	width             : 100%;
	height            : 100%;
	background-color  : rgba(235, 235, 235, 1);
}

#galerie .cell-caption.flickity-bg-lazyloaded .overlay {
	opacity: 0;
}

#galerie .cell-caption {
	width              : 100%;
	height             : 100%;
	background-size    : cover;
	background-repeat  : no-repeat;
	background-position: center center;
}

/* galerie - zoom-icon
------------------------------------------------------------------------------------- */
#galerie .zoomicon {
	position         : absolute;
	right            : 14px;
	width            : 41px;
	height           : 41px;
	opacity          : 0.95;
	background-color : transparent;
	background-size  : contain;
	background-repeat: no-repeat;
	background-image : url("../images/icons/zoom.svg");
}

#galerie .zoomicon.up {
	top: 15px;
}

#galerie .zoomicon.down {
	bottom: 15px;
}

/* topscrollBar
------------------------------------------------------------------------------------- */
/* watch out: 
https://alligator.io/css/position-sticky/
https://medium.com/@elad/css-position-sticky-how-it-really-works-54cd01dc2d46
https://gedd.ski/post/position-sticky/
https://codepen.io/elad2412/pen/MZZVjw
---------------------------------------------------------------------------------------------- */
#topscrollBar {
	position           : -webkit-sticky;
	position           : sticky;
	bottom             : 0px;
	cursor             : pointer;
	font-size          : 13px;
	font-weight        : 300;
	line-height        : 16px;
	left               : 0;
	padding            : 7px 0 10px 0;
	width              : 100%;
	z-index            : 100 !important;
	opacity            : 0;
	background-color   : rgba(16, 44, 14, 1.00);
	background-size    : cover;
	background-repeat  : no-repeat;
	background-position: center center;
	background-image   : url("../images/topscrollBar/oakSmoked-1440.jpg");
	border-top         : solid 1px rgba(79, 79, 79, 1.00);
	-webkit-transition : all 0.9s 0.2s;
	transition         : all 0.9s 0.2s;
	-webkit-transform  : translate3d(0, 100%, 0);
	-ms-transform      : translate3d(0, 100%, 0);
	transform          : translate3d(0, 100%, 0);
}

#topscrollBar.active {
	opacity          : 1;
	-webkit-transform: none;
	-ms-transform    : none;
	transform        : none;
}

#topscrollBar .image {
	width : 9px;
	height: 9px;
	margin: 6px auto;
}

#topscrollBar a:link,
#topscrollBar a:visited,
#topscrollBar a:active {
	outline        : none;
	text-decoration: none;
	color          : rgba(235, 235, 235, 1.00);
}


/* footer - basic adjustments
---------------------------------------------------------------------------------------------- */
#footer {
	position  : relative;
	padding   : 1rem 0 1rem 0;
	box-shadow: 0px -1px 2px 0px rgba(0, 0, 0, 0.75);
}

#footer .footer-1 {
	margin     : 0 auto;
	font-size  : 17px;
	line-height: 25px;
}

#footer .footer-1 .smart-line {
	margin        : 1.5rem auto 0.8rem auto;
	padding-bottom: 4px;
	border-bottom : 1px solid rgba(115, 115, 115, 1.00);
}

#footer .footer-2 {
	margin   : 2rem auto 1rem auto;
	font-size: 14px;
}

/* social-icons
-------------------------------------------------------------------------------------- */
#footer .socialicons figure {
	display: inline-block;
	margin : 0 0.5rem 1rem 0.5rem;
}

#footer .socialicons .linkedin {
	width: 9rem;
}

#footer .socialicons .facebook {
	width: 6.5rem;
}

#footer .socialicons .pinterest {
	width: 10rem;
}


/* downloads
-------------------------------------------------------------------------------------- */
#downloads .item {
  width: 180px;
  padding: 3px;
  margin: 0 auto 0 0;}
    
#downloads .item img {
  box-shadow: 1px 1px 3px 0px rgba(0,0,0,0.75);}