/* style css
Farbflächen:
hellgrün: #A9C938
dunkelgrün: #6B8220

dunkelgrau: #727971 (Text)

*/

/* ========================================================================================================================================= */
/* +++ custom basic styles +++ */
/* ========================================================================================================================================= */
/* +++ Font +++ */
/* noto-sans-sc-300 - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Noto Sans SC';
	font-style: normal;
	font-weight: 300;
	src: url('/_assets/css/fonts/noto-sans-sc-v26-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* noto-sans-sc-regular - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Noto Sans SC';
	font-style: normal;
	font-weight: 400;
	src: url('/_assets/css/fonts/noto-sans-sc-v26-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* noto-sans-sc-500 - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Noto Sans SC';
	font-style: normal;
	font-weight: 500;
	src: url('/_assets/css/fonts/noto-sans-sc-v26-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* +++ resets +++ */
* :focus, * :active { outline: 0 none; -moz-outline: 0 none; }
a:active, a:focus {outline: none;}

/* +++ basics +++ */
body {
	background-color: #fff;
	color:#727971;
	font-family: 'Noto Sans SC','Arial Narrow', Arial, sans-serif;
	font-size:0.9rem;
	font-weight: 300;
	/*
	-ms-hyphens: auto;
	-webkit-hyphens: auto;
	hyphens: auto;
	*/
}
section img {
	max-width: 100%;
	height: auto;
}
p {
	margin: 0 0 10px;
}
strong {
	font-weight:600;
}

h1, h2, h3, h4, h5, h6 {
	font-size:1rem;
	color:#A9C938;
	font-weight:300;
}
h1 {
	font-size:1.8rem;
	font-weight:300;
}
h2 { 
	font-size:1.5rem;
}
h3 { 
	font-size:1.1rem;
}


a {
	text-decoration:none;
	color:#3C3C3C;
}
a:focus, a:hover, a:active {
	color: #000;
	text-decoration:none;
}

ul {
	margin:0; padding:0;
	padding-left:13px;
	margin-left:0;
	margin-bottom:10px;
	list-style-image: url('/_assets/css/images/bull.gif');
}
ol {
	margin:0; padding:0;
	padding-left:20px;
	margin-left:0;
	margin-bottom:10px;
}

/* +++ layout +++ */
/* ========== mainnav ================ */
.bg_mobilenav {
	position:absolute;
	z-index:2000;
	top:0;
	left:0;
	width:100%;
	height:240px;
	background: transparent url(/_assets/css/svg/rmb_bg_grn_nav.svg) no-repeat top left;
	background-size:cover;
	display:none;
}

@media (max-width: 767px) {
	.mainnav {
		width:480px;
		height:200px;
		position:absolute;
		right:0;
		z-index:30011;
		background:url(/_assets/css/svg/rmb_logo.svg) no-repeat top left;
		background-size:cover;
	}
	.navbox {
		padding:20px 0 10px 75px;
	}
}

.mainnav {
	width:200px;
	height:84px;
	position:absolute;
	right:3%;
	z-index:30011;
	background:url(/_assets/css/svg/rmb_logo.svg) no-repeat top left;
	background-size:200px 84px;
}
.navbox {
	padding:20px 0 10px 63px;
}
.hamburger {
	width: 30px;
	position: absolute;
	left: 40px;
	top: 15px;
	z-index: 30012;
	cursor: pointer;
}


@media (min-width: 576px) {
	.mainnav {
		width:300px;
		height:125px;
		position:absolute;
		right:5%;
		z-index:30011;
		background:url(/_assets/css/svg/rmb_logo.svg) no-repeat top left;
		background-size:300px 125px;
	}
	.navbox {
		padding:20px 0 10px 75px;
	}
	.hamburger {
		width: 40px;
		position: absolute;
		left: 48px;
		top: 26px;
		z-index: 30012;
		cursor: pointer;
	}
}

@media (min-width: 768px) {
	.mainnav {
		width:430px;
		height:180px;
		position:absolute;
		right:0;
		z-index:30011;
		background:url(/_assets/css/svg/rmb_logo.svg) no-repeat top left;
		background-size:100%;
	}
	.navbox {
		padding: 15px 0 10px 55px;
	}
	.hamburger {
		width: 40px;
		position: absolute;
		left: 48px;
		top: 26px;
		z-index: 30012;
		cursor: pointer;
	}
}



/* ========== cycle slider ================ */
.cycleslider {
	position:relative;
	width:100%;
}
.cycle-slideshow, .cycle-slideshow * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.cycle-slideshow { width: 100%; min-width: 200px; margin: auto; padding: 0; }
.cycle-slideshow img { opacity: 1; filter:alpha(opacity=1); height:100% }

/* divs */
.cycle-slideshow > div { 
	position: absolute; top: 0; left: 0;
	width: 100%; padding: 0;
}
.cycle-slideshow > div { background: #fff }
.cycle-slideshow > div > img { display: block; }
.cycle-slideshow > div .cycle-overlay {
	position: absolute;
	top: 0;
	width: 100%;
}
.cycle-slideshow .cycle-img {
	background-repeat:no-repeat;
	background-position: center center;
	width:100%;
	background-size:cover;
}
.cycleslider,
.cycle-slideshow,
.cycle-slideshow .cycle-img {
	height:600px;
}


/* pager */
.cycle-pager { 
	text-align: center; width: 100%; z-index: 500; position: absolute; top: 10px; overflow: hidden;
}
.cycle-pager span.cycle-pager-active { color: #46B714; }

.bullet-pager { text-align: center; position: relative; z-index: 500; margin-top: -55px; overflow: hidden; }
.bullet-pager span { font-size: 50px; width: 16px; padding:4px 8px; height: 16px; display: inline-block; color: #fff; }
.bullet-pager span.cycle-pager-active { color: #46B714;}
.bullet-pager > * { cursor: pointer;}

@media (max-width: 767px) {
	.cycleslider,
	.cycle-slideshow,
	.cycle-slideshow .cycle-img {
		height:240px;
	}
}

@media (min-width: 768px) {
	/* welcome */
	.welcomebox {
		position:absolute;
		z-index:300011;
		bottom:0;
		left:10%;
		width:580px;
		height:285px;
		background:url(/_assets/css/svg/rmb_gruenflaechen_meisterbetrieb.svg) no-repeat bottom left;
		background-size:cover;
	}
	.welcometxt {
		color:#fff;
		padding: 90px 150px 20px 140px;
	}
}


main { margin-bottom:40px; }
/* maincontainer (in pagetypes) */
.maincontainer {

}
section {
	margin-top:30px;
}
section:first-child {
	margin-top:0;
}
/* Zwiswchenüberschriften h3 */
.container.sectionheadline {
	margin-top: 30px;
	margin-bottom: -30px;
}
/* divtable */
.divtable {
	display: table;
	width: 100%;
	border-collapse:collapse;
}
.divtrow {
	display: table-row;
}
.divtheading {
	display: table-header-group;
}
.divtcell, .divthead {
	display: table-cell;
	padding: 0;
}
.divtbody {
	display: table-row-group;
}
.clear { clear:both; }

.img-responsive {
	display: block;
	max-width: 100%;
	height: auto;
}


/* ========== Header ================ */
header {}
.logo {

}
.homelink {

}
.homelink a {
	display:block;
	width:100%;
	height:100%;
}
/* ========== Content ================ */
.mobtitle {
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.areaimg img {
	width:auto;
	height:60px;
}
@media ( max-width: 575px ) {
	.areaimg {
		text-align:left;
		margin-bottom:40px;
	}
	.areaimg:last-child {
		margin-bottom:20px;
	}
}
@media ( min-width: 576px ) {
	.areaimg {
		text-align:center;
	}
}

.latestprojects .greenbox {
	position:absolute;
	bottom:-25px;
	right:0;
	width:70%;
	height:70%;
	background:transparent url(/_assets/css/svg/rmb_bg_grn_latest.svg) no-repeat top right 20px;
}
.latestprojects .greenbox .art {
	color: #fff;
	font-size: 0.9rem;
	text-align: left;
	padding-left: 25%;
	padding-right: 40px;
	padding-top: 20px;
	text-transform: uppercase;
	font-style: italic;
}
@media ( min-width: 374px ) {
	.latestprojects .greenbox .art {
		font-size: 1rem;
	}
}
@media ( min-width: 414px ) {
	.latestprojects .greenbox .art {
		font-size: 1.1rem;
	}
}
@media ( min-width: 576px ) {
	.latestprojects .greenbox .art {
		font-size: 1.4rem;
	}
}
@media ( min-width: 768px ) {
	.latestprojects .greenbox .art {
		font-size: 1rem;
		padding-left: 30%;
	}
}

@media ( min-width: 768px ) {
	.latestprojects .greenbox {
		width:80%;
	}
	.latestprojects .greenbox .art {
		font-size: 0.7rem;
	}
}
@media ( min-width: 992px ) {
	.latestprojects .greenbox .art {
		font-size: 0.9rem;
	}
}
@media ( min-width: 1200px ) {
	.latestprojects .greenbox .art {
		font-size: 1.2rem;
	}
}



/* ========== Projekte ================ */
.projects .pimg {
	margin-bottom: 30px;
}
.projects .pinfo { 
	position: absolute;
	z-index: 2;
	top:0;
	right:15px;
	padding-top: 15px;
	padding-left: 12%;
	padding-right: 1%;
	width:70%;
	height:60%;
	background:transparent url(/_assets/css/svg/rmb_bg_grn_pro_overview.svg) no-repeat top right;
	background-size: 100% 90%;
	color:#fff;
}
.prolink.active .pimg {
	border:2px solid #6B8220;
}
.prolink .pimg:hover {
	border:2px solid #6B8220;
}
.projects .pinfo .bezeichnung {
	font-size:1rem;
	line-height:1.1rem;
	letter-spacing: -0.5px;
}
.projects .pinfo .ort {
	font-size:0.8rem;
}

@media ( min-width: 374px ) {
	.projects .pinfo .bezeichnung {
		font-size:1.2rem;
		line-height:1.1rem;
	}
	.projects .pinfo .ort {
		font-size:0.9rem;
	}
}
@media ( min-width: 414px ) {
	.projects .pinfo .bezeichnung {
		font-size:1.3rem;
		line-height:1.2rem;
	}
	.projects .pinfo .ort {
		font-size:1rem;
	}
}
@media ( min-width: 576px ) {
	.projects .pinfo { 
		height:65%;
	}
	.projects .pinfo .bezeichnung {
		font-size:0.9rem;
		line-height:1rem;
	}
	.projects .pinfo .ort {
		font-size:0.8rem;
	}
}
@media ( min-width: 768px ) {
	.projects .pinfo { 
		height:65%;
	}
	.projects .pinfo .bezeichnung {
		font-size:0.8rem;
		line-height:0.9rem;
	}
	.projects .pinfo .ort {
		font-size:0.7rem;
	}
}
@media ( min-width: 992px ) {
	.projects .pinfo { 
		height:65%;
	}
	.projects .pinfo .bezeichnung {
		font-size:1rem;
		line-height:1.1rem;
	}
	.projects .pinfo .ort {
		font-size:0.9rem;
	}
}
@media ( min-width: 1200px ) {
	.projects .pinfo { 
		height:60%;
	}
	.projects .pinfo .bezeichnung {
		font-size:1.2rem;
		line-height:1.1rem;
	}
	.projects .pinfo .ort {
		font-size:1rem;
	}
}
.prolink {
	cursor:pointer;
}

.btn_showmore { 
	padding:5px 10px;
	margin:10px auto 20px auto;
	width:100%;
	text-align:center;
	text-transform:uppercase;
	cursor:pointer;
}
.btn_showmore:hover {
	color:#96a426;
	/* background-color:#333; */
}
/* Projektdetails */
@media ( max-width: 991px ) {
	.detailbox {
		width:100%;
		background-color:#6B8129;
	}
	.detailtxt {
		color:#fff;
		padding:60px 30px 20px 30px;
	}
	.bullet-pager { 
		padding-left:0;
	}
}

@media ( min-width: 992px ) {
	.detailbox {
		position:absolute;
		z-index:300011;
		bottom:0;
		margin-left:auto;
		margin-right:auto;
		width:100%;
		left:10%;
		width:650px;
		height:235px;
		background:url(/_assets/css/svg/rmb_bg_grn_pro_detail.svg) no-repeat bottom -2px left;
		background-size:100%;
	}
	.detailtxt {
		color:#fff;
		padding:30px 160px 20px 190px;
	}
	.bullet-pager { 
		padding-left:500px;
	}
}


/* ========== Leistungen, Unternehmen, Kontakt ================ */
.bilddiv {
	position:relative;
}
/* Leistungen */
.sectionlinks {
	position:absolute;
	left:0;
	right:0;
	z-index:2;
	bottom:30px;
}
.seclink {
	text-align:center;
}
.seclink img {
	width:80%
}
.seclink a {
	display:block;
}
@media (max-width: 575px) {
	.sectionlinks {
		display:none;
	}
}
/* Unternehmen, Kontakt */
.bg_grn {
	position: absolute;
	z-index: 2;
	bottom: 0;
	left: 2%;
	width: 100%;
	height: 30%;
	background: url(/_assets/css/svg/rmb_bg_grn_kontakt.svg) no-repeat bottom -2px left;
}
.claim {
	position:absolute;
	left:10%;
	z-index:3;
	bottom:30px;
	font-size:24px;
	color:#fff;
}
@media ( max-width: 575px ) {
	.bg_grn {
		display:none;
	}
	.claim {
		font-size:16px;
		left:40px;
		bottom:5px;
	}
}


/* ========== Footer ================ */
footer { 
	background-color:#A9C938;
	color:#fff;
	font-size:0.9em;
	line-height:1.2em;
	padding:40px 0;
}
/*
.footergreen {
position:absolute;
bottom: -30px;
left: 15px;
width: 270px;
height: 180px;
background:transparent url(/_assets/css/svg/rmb_bg_grn_footer.svg) no-repeat bottom left;
background-size: 100%;
}
*/

.footergreen {
	position:absolute;
	top: -60px;
	left: -25px;
	width: 320px;
	height: 200px;
	background:transparent url(/_assets/css/svg/rmb_bg_grn_footer.svg) no-repeat bottom left;
	background-size: 100%;
}

.leftnav {
	position:relative;
	padding-left:40px;
}
.rightnav {
	position:relative;
	padding-left:20px;
	max-width:160px;
}
footer .address {
	padding-right:0;
	padding-left:15px;
}



.rmbh_addroute {
	position:relative
}
.routenplaner_kontakt {
	position: absolute;
	left: 360px;
	top: 20px;
	font-style:italic;
}
.routenplaner_kontakt a {
	text-transform:uppercase;
	color:#6B8220;
}
.routenplaner_kontakt a:hover {
	color:#A9C938;
}
.routenplaner_kontakt img {
	width:30px;
}

@media ( max-width: 576px ) {
	.leftnav {
		padding-left:20px;
	}
	footer .address {
		width:100%;
	}
	.routenplaner_kontakt {
		position: relative;
		left:0;
	}
}


footer .routenplaner {
	padding-left:15px;
}
@media (min-width: 992px) {
	footer .routenplaner {
		padding-left:30px;
	}
}
footer .routenplaner img {
	width:30px;
}
footer .creators {
	font-size:12px;
	margin-top:30px;
	padding-left:15px;
}
footer .social {
	margin-top:20px;
	padding-left:55px;
	margin-bottom: 80px;
}
footer .social img {
	height:15px;
}
footer .social a {
	margin-right:3px;
}


@media (min-width: 1200px) {

}



/* ========== Abstände ================ */
.spacer-10-btm, .spacer-10-top {
	height:10px;
}
.spacer-20-btm, .spacer-20-top {
	height:20px;
}
.spacer-30-btm, .spacer-30-top {
	height:30px;
}
.spacer-40-btm, .spacer-40-top {
	height:40px;
}
.spacer-50-btm, .spacer-50-top {
	height:50px;
}
.spacer-60-btm, .spacer-60-top {
	height:60px;
}

/* ========== Ränder ================ */
.marginbtm {
	margin-bottom:20px;
}
.borderless {
	padding-left:0;
	padding-right:0;
}

/* ========== Hintergründe ================ */
.bg_grau {
	background-color: #efefef;
}

/* ========== Accordion ================ */
.accordion {
	margin: 0 0;
	border-bottom:1px solid #999;
}
.accohead { /* Kopfbereich */
	cursor:pointer;
	display:block;
	background:url(/_assets/css/svg/o-plus.svg) no-repeat right center;
	background-size: 30px 30px;
	border-top:1px solid #999;
	font-size:1.3em;
	line-height:1.3em;
	font-weight:300;
	min-height:45px;
	padding:15px 35px 15px 0;
	display: table;
	width: 100%;
	-webkit-touch-callout: none; 
	-webkit-user-select: none; 
	-khtml-user-select: none; 
	-moz-user-select: none; 
	-ms-user-select: none; 
	user-select: none;
}
.accoheadactive {
	background:url(/_assets/css/svg/o-minus.svg) no-repeat right center;
	background-size: 30px 30px;
}
.accobody {
	padding:20px 0 15px;
}
.accobody img {
	display: block;
	max-width:100%;
	height:auto;
}
.accosecdivider {
	height:20px;
}

/* -- Accordion contents -- */
/* s. Basics  */
.accordion .accotxt {}
.accordion .accoleft {}
.accordion .accoright {}


/* ========== Scrollicon ================ */
.scrollicon {
	position: fixed;
	display:none;
	bottom: 30px;
	right: 10px;
	padding: 10px 5px;
	width:60px;
	height:60px;
	cursor:pointer;
}

/* ========================================================================================================================================= */
/* +++ Responsive +++ */
/* ========================================================================================================================================= */
@media ( max-width: 1199px ) { /* < 1200, md */

}

@media ( max-width: 991px ) { /* < 992, sm */
	/* end Bootstrap patch */
	.marginbtm {
		margin-bottom: 30px;
	}
	.accordion .accolink {
		position: relative;
	}
}

@media ( max-width: 767px ) { /* < 768, xs */

}


@media ( max-width: 575px ) { /* < 576, xxs */

}

@media ( max-width: 414px ) { /* < 321, iPhone 6 portrait */

}

@media ( max-width: 321px ) { /* < 321, iPhone 5 portrait */


}


/* Display mobile only
**************************************************************** **/
@media (min-width: 768px) {
	.hide-desktop { display:none !important; }
}
@media (max-width: 767px) { /* 575px */
	.hide-xs { display:none !important; }
}
@media (max-width: 575px) { /* 575px */
	.hide-xxs { display:none !important; }
}
/* Display on desktop only
**************************************************************** **/
@media (min-width: 768px) {

	/* +++ Font +++ */


} 
@media (min-width: 576px) { /* 576px */
	.show-xxs { display:none !important; }
}






