/* css zu baustoffe */
/* baustoffeMenue  */
/*=======================================================*/
/*==================== baustoffMenue ====================*/
/*=======================================================*/

body{overflow-x: hidden;}
#main {background-color: #f0f0f0;}
input[type="radio"] {display: none;}

/*------------- lbl_openMenu & lbl_closeMenu ------------*/

#lbl_openMenu, #lbl_closeMenu {
	width: 40px;
	height: 30px;
	display: flex;
	position: fixed;
	z-index: 2;
	right: calc((100% - 1440px) / 2 + 60px);
	top: 35px;
	line-height: 0;
	transition: 0.5s;
}

#rad2_menuClosed:checked ~ #lbl_openMenu::after,
#rad2_menuClosed:checked ~ #lbl_openMenu::before,
#rad2_menuOpen:checked ~ #jubaconMenu #lbl_closeMenu::after,
#rad2_menuOpen:checked ~ #jubaconMenu #lbl_closeMenu::before,
#lbl_openMenu > span {
	display: inline-block;
	width: 100%;
}

#lbl_openMenu::after, #lbl_openMenu::before, #lbl_closeMenu::after, #lbl_closeMenu::before {
	content: '';
	position: absolute;
}

#lbl_openMenu::before, #lbl_closeMenu::before {top: 0;}

#lbl_openMenu::after, #lbl_closeMenu::after {bottom: 0;}

/*------------- lbl_openMenu ------------*/

#rad2_menuClosed:checked ~ #lbl_openMenu::after,
#rad2_menuClosed:checked ~ #lbl_openMenu::before,
#rad2_menuClosed:checked ~ #lbl_openMenu > span {
	height: 4px;
	background-color: white;
}

#lbl_openMenu > span {margin: auto;}

#rad2_menuOpen:checked ~ #lbl_openMenu {right: 35px; transition: 0.5s;}
#rad2_menuOpen:checked ~ #lbl_openMenu {z-index: 1;}

@media (max-width: 1455px) {
	#lbl_openMenu {right: 60px;}
}

@media (max-width: 600px) {
	#lbl_openMenu {right: 15px;}
}

/*------------- lbl_closeMenu ------------*/

#rad2_menuOpen:checked ~ #jubaconMenu #lbl_closeMenu::after,
#rad2_menuOpen:checked ~ #jubaconMenu #lbl_closeMenu::before {
	height: 2px;
	background-color: black;
}

#jubaconMenu #lbl_closeMenu > span {display: none;}

#rad2_menuOpen:checked ~ #jubaconMenu #lbl_closeMenu {right: 15px; transition: 0.5s;}

#rad2_menuClosed:checked ~ #jubaconMenu #lbl_closeMenu {right: calc((100% - 1440px) / 2 + 60px);}
#rad2_menuClosed:checked ~ #jubaconMenu #lbl_closeMenu {z-index: 0;}

#rad2_menuOpen:checked ~ #jubaconMenu #lbl_closeMenu::after {
	transform: rotate(45deg);
	bottom: 14px;
}

#rad2_menuOpen:checked ~ #jubaconMenu #lbl_closeMenu::before {
	transform: rotate(-45deg);
	top: 14px;
}

@media (max-width: 1455px) {
	#rad2_menuClosed:checked ~ #jubaconMenu #lbl_closeMenu {right: 60px;}
}

/*------------- jubaconMenu ------------*/

#jubaconMenu {
	right: 0;
	position: fixed;
	z-index: 1;
	width: 280px;
	height: 100%;
	background-color: #eaedf0;
	transition: 0.5s;
}

#rad2_menuClosed:checked ~ #jubaconMenu {right: -280px;}

/*------------- menu_eb_1 ------------*/

#menu_eb_1 {
	margin-top: 120px;
	list-style: none;
	padding: 0;
}

#menu_eb_1::before {
	content: '';
	display: block;
	background-image: url('/upload/baustoffe/slider_logo.gif');
	height: 55px;
	background-size: contain;
	background-repeat: no-repeat;
	top: 25px;
	left: 50px;
	width: 100%;
	position: absolute;
}

/*------------- menuItem_eb_1 ------------*/

.menuItem_eb_1 {
	padding: 10px 10px 10px 50px;
	font-size: 22px;
	font-weight: lighter;
}

.menuItem_eb_1 > a {color: #333333;}

/*=======================================================*/
/*=======================================================*/
/*=======================================================*/
/* --- --- */
/* FooterCSS  */
footer{color:#fff;}
footer a{color:white;}
footer .footer_green_cloumn > *{padding:20px 15px;}
footer .footer_green_cloumn > h3{margin:0}
footer .footer_green_cloumn{
	border-top:2px solid #329C67;
	margin: 0 6px;
}
.footer_flexbox:first-of-type > .footer_green_cloumn > *{
	border-bottom: 1px solid #329C67;
}
.footer_flexbox:first-of-type > .footer_green_cloumn{
	padding-bottom:112px
}
.footer_green_wrapper{
	max-width:1152px;
	margin:0 auto;
}
.footer_green_cloumn > .HoverPfeil > .Footer_facebook:after{
	content:'\f105';
	font-size: 30px;
	vertical-align: middle;
	margin-top:-6px
}
.footer_green_cloumn > .HoverPfeil > .Footer_instagramm:after{
	content:'';
	height: 25px;
	width: 25px;
	background-size:contain;
	background-image:url('/bilder/Instagram-logo.png');
	background-repeat: no-repeat;
	vertical-align: middle;
	margin-top:-3px;
}
.footer_green{margin-top:100px; padding-top:71px; position:relative;padding-bottom: 20px;}
.footer_green > .footer_logo_container{
	width:100%;
	text-align:center;
	max-width:1440px;
	position: absolute;
	top:-100px;
	left:50%;
	transform:translateX(-50%);
	height:100px;
	background-color:#fff;
	padding-top:25px
}
.footer_gray{padding-top:71px;padding-bottom:47px}
.footer_gray a{
	font-family: iconfont;
	font-size:65px;
	width:50px;
	height: 50px;
	display:inline-block;
	margin:0 20px;
	font-weight:100;
}
.footer_gray a img{max-width:100%}

@media screen and (max-width:1024px){
	footer{margin-bottom:60px;}
	.footer_flexbox{flex-direction: column;padding:0 30px;}
	.footer_green_cloumn{	margin:0 !important;}
	.footer_flexbox:first-of-type > .footer_green_cloumn{border-top:none; padding-bottom:60px}
	.footer_flexbox:first-of-type > .footer_green_cloumn > h3{font-size:34px;}
	.HoverPfeil{position: relative; padding-right:50px !important;}
	.HoverPfeil > span::after{
		position: absolute;
		margin:0;
		right:20px;
	}
	.HoverPfeil:hover > span::after{right:0;}
	.HoverPfeil .Footer_facebook::after,.HoverPfeil .Footer_instagramm::after{bottom:20px;}
}
@media screen and (max-width: 600px) {.footer_flexbox:first-of-type > .footer_green_cloumn > h3{font-size:27px;}}
/* --- --- */
#baustoffe {background-color: #f0f0f0;}
#bannerBild {width: 100%;}
#bannerBlaetter {
  bottom: -8%;
  width: 37%;
}

#bannerText {
  width: 30%;
  left: 50%;
  bottom: 17%;
}

#bannerPic {
  line-height: 0;
  overflow: hidden;
}

.baustoffeContent {
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  padding: 0 40px;
  box-sizing: content-box;
}

.kontaktButton {
  padding: 25px 50px;
  border-radius: 20px;
  border: solid 1px #ff2d15;
  font-size: 110%;
  font-weight: bold;
  box-shadow: 0px 2px 3px #6e6e6e;
  margin-right: 40px;
  text-decoration: none;
  display: inline-block;
  margin-bottom: 25px;
  min-width:120px;
}


#jetztAnrufen {
  color: white;
  background-color: #ff2d15;
}

#rueckruf {
  color: #ff2d15;
  background-color: white;
}

.parallaxBild {
  height: 500px;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.footer_green > .footer_logo_container {background-color: #f0f0f0;}

#fotoCredit {
  position: absolute;
  bottom: 10px;
  right: 10px;
}

#fotoCredit > a {
  text-decoration: none;
  font-size: 90%;
  line-height: 1.75rem;
  font-weight: bolder;
  color: #fff;
}

.menuItem:hover {background-color: #d7dce2;}
/* --- --- */