/* RESPONSIVE */
.hgd-pad {width: 100%; max-width: 1140px; margin: 0px auto; padding: 30px 0 90px 0;}

.parallax-window {
	z-index: 99999;
}


/* HINTERGRUNDFARBEN */
.color-topbar {background: var(--color-template); padding: 5px 0;}

.color-featureboxen {width: 100%; padding: 50px 0; text-overflow: clip; background-color: var(--color-template); background-position: 0% 0%, 0% 0%, 0% 0%; background-attachment: scroll, scroll, scroll; background-image: linear-gradient(0deg, rgba(255,255,255, 0) 20%, rgba(255,255,255, 0.098) 20%, rgba(255,255,255, 0.098) 40%, rgba(255,255,255, 0.2) 40%, rgba(255,255,255, 0.2) 60%, rgba(255,255,255, 0.4) 60%, rgba(255,255,255, 0.4) 80%, rgba(255,255,255, 0.6) 80%), linear-gradient(-90deg, rgba(255,255,255, 0) 20%, rgba(255,255,255, 0.098) 20%, rgba(255,255,255, 0.098) 40%, rgba(255,255,255, 0.2) 40%, rgba(255,255,255, 0.2) 60%, rgba(255,255,255, 0.4) 60%, rgba(255,255,255, 0.4) 80%, rgba(255,255,255, 0.6) 80%), none; background-origin: padding-box; background-clip: border-box; background-size: 100% 100%;}

.color-copyright {background: var(--color-template); border-top: 1px solid #fff;}
 .color-quick-kontakt,  .color-bottom {background: var(--color-templateA); filter: brightness(.9);}
.color-timeline {background: var(--color-template);
background-image: -moz-linear-gradient(left, rgba(255,255,255, 0.4) 0%, rgba(255,255,255, 0.4) 50%, rgba(255,255,255, 0.8) 50%, rgba(255,255,255, 0.8) 100%);
background-image: -webkit-linear-gradient(left, rgba(255,255,255, 0.4) rgba(255,255,255, 0.4) 50%, rgba(255,255,255, 0.8) 50%,rgba(255,255,255, 0.8) 100%);
background-image: linear-gradient(to right, rgba(255,255,255, 0.4) 0%, rgba(255,255,255, 0.4) 50%, rgba(255,255,255, 0.8) 50%, rgba(255,255,255, 0.8) 100%);}

/* LOGO */

.logo, .logomin {padding: 1% 0 1% 0;}

/* LOGO-BOTTOM */
.table .box-top-icon {width: 100%; max-width: 40px;}
.hgd-footer-item-content .table h4 {letter-spacing: 2px;}
.hgd-footer-item-content .table h4 strong {letter-spacing: 3px; font-size: large;}

/* SLIDER */
.hgd-slider {margin-top: 100px;}

/* NAVIGATION + LOGO / INLINE */
#navigation-logo {background: #fff; box-shadow: 0px 2px 3px rgba(0,0,0,0.3); z-index: 999;}

.navigation {margin-top: 8% !important;}
.navigation {float: right;}

/* NAVIGATION + LOGO / STACK */
.hgd-stack .navigation {margin: 3% 0 !important; }

/******************************************************/


/*										HGD-NAVIGATION (responsive)			  */

ul.hgd-navigation {background: var(--color-white); width: 100%; margin: 0; padding: 0; font-size: 0.9em; list-style: none outside none; display: flex; justify-content: end; }

	ul.hgd-navigation ul { left: -9999em; opacity: 0; position: absolute; background: var(--color-white); margin: 0; padding: 0; margin-top: 15px; }
	ul.hgd-navigation ul ul { background: var(--color-white);}

	ul.hgd-navigation > li {display: block; float: left; vertical-align: middle; position: relative; }
	ul.hgd-navigation > li > a, ul.hgd-navigation span.separator {display: block; vertical-align: middle; padding: 8px 15px; font-size: medium; letter-spacing: 1px; color: var(--color-gray); border-bottom: 4px solid var(--color-white); transition: all ease .3s;}
	ul.hgd-navigation li.active > a, ul.hgd-navigation li > a:hover {border-bottom: 4px solid var(--color-template);}

	ul.hgd-navigation > li:hover > ul {opacity: 1; top: 30px; left: 0; }
	ul.hgd-navigation > li > ul > li:hover ul {opacity: 1; top: 32px; left: 100%; }

		ul.hgd-navigation ul > li {display: block;}
		ul.hgd-navigation ul > li > a {display: block; padding: 10px 20px; font-size: medium; width: 100%; border-bottom: 0px !important; white-space: nowrap;}
		ul.hgd-navigation ul > li a:hover,
		ul.hgd-navigation ul > li:hover a {background: var(--color-template); color: var(--color-template-font); }

			ul.hgd-navigation > li > ul > li > ul > li a {background: var(--color-white) !important; color: var(--color-gray) !important; }
			ul.hgd-navigation > li > ul > li > ul > li a:hover {background: var(--color-template) !important; color: var(--color-template-font) !important; }


/* BOTTOM-BOXEN */
.color-bg-parallax {background: rgba(0,0,0,0.2); }

.hgd-bottom-box a {color: var(--color-template-font); text-decoration: none; transition: all ease .3s;}
.hgd-bottom-box a:hover, .hgd-bottom-box .hgd-social-media .fab:hover, .color-topbar a:hover  {color: var(--color-silver);}

.hgd-bottom-box h3 {font-size: x-large; color: var(--color-template-font); letter-spacing: 1px; border-bottom: 1px dotted var(--color-template-font); padding-bottom: 10px;}
.hgd-bottom-box h4 {font-size: medium; color: var(--color-template-font); line-height: 1.7em;}

.hgd-bottom-box .hgd-social-media .fab {font-size: large; color: var(--color-template-font);}
.hgd-bottom-box .table tr td {border: 0px; vertical-align: middle;}

.bottom a {text-decoration: none; color: var(--color-template-font);}
.bottom a:hover {color: var(--color-silver);}
.hgd-bottom-box {margin: 60px 0 35px 0; color: var(--color-template-font);}

.hgd-bottom-box table {color: var(--color-template-font);}

.hgd-bottom-box .fal {color: var(--color-template-font);}

.box-top-icon .fal.fa-home {font-size: 4vw;}

.hgd-social-media .fab {font-size: 2.7em; color: var(--color-template-font); float: left; margin-right: 15px; transition: all ease .3s;}
.hgd-social-media .fab:hover {color: var(--color-silver); }

.bottom-menu li {float: none; width: 100%; border-bottom: 1px dotted var(--color-template-font); padding: 3px 0;}

/* CONTENTBOXEN */
.contentbox {padding: 10% 5%;  hyphens: auto; color: var(--color-white);}


/* IMAGEBOX-HEADER */
.hgd-imageboxen-header {margin-bottom: 20px;}
.hgd-imageboxen-header h2 {text-align: center; color: var(--color-template-font); font-size: 2.5em !important; font-weight: 600; letter-spacing: 1px; padding: 50px 0 30px 0;}
.hgd-imageboxen-header h2::after {content: ""; position: absolute; left: 50%; transform: translateX(-50%); bottom: 15px; width: 20%; border-bottom: 3px solid var(--color-template);}

/* IMAGEBOX */
.hgd-imageboxen {position:relative; display: flex; align-items: center; text-align: center; overflow:hidden; box-sizing : border-box; width:100%; box-shadow: 0px 5px 42px -15px var(--color-black-a);}
.hgd-imageboxen * {box-sizing : border-box;}
.hgd-imageboxen figure {margin:0;}
.hgd-imageboxen h4 {color: var(--color-white); width: 100%; position: absolute; padding: 10px 0; margin-bottom: 0px; z-index: 1;}
.hgd-imageboxen img {display:block; width:100%; height:auto; transition: all ease 1s;}
.hgd-imageboxen figcaption {position:absolute; bottom:0; left:0; width:100%; display:block; overflow:hidden; background-color: rgba(255,255,255,.3); color:var(--color-white); text-align:center; font-weight : bold;}
.hgd-imageboxen .hgd-description {overflow-y:auto; margin:0; padding:0; position:absolute; z-index: 2; left:-100%; top:0; bottom:0; width:100%; transition : width .55s ease-in-out; background-color: rgba(255,255,255,.4); color:var(--color-white); }
.hgd-imageboxen .hgd-description {text-align: center; top:0;left:0; bottom:0; width:100%; transition : transform .5s ease-in-out;}
.hgd-imageboxen-left .hgd-description {transform : translate(-100% ,0);}
.hgd-imageboxen-right .hgd-description {transform : translate(100%, 0);}
.hgd-imageboxen-top .hgd-description {transform : translate(0, -100%);}
.hgd-imageboxen-bottom .hgd-description {transform : translate(0, 100%);}
.hgd-imageboxen:hover img {filter : blur(10px) grayscale(70%);}
.hgd-imageboxen:hover .hgd-description {transform : translate(0, 0);}

.hgd-description {font-size: small; align-items: center; justify-content: center;}
.hgd-description h3 {color: var(--color-gray); font-size: x-large; letter-spacing: 2px; text-transform: uppercase; padding-top: 25px;}
.hgd-description h5 {width: 70%; margin: 0 auto; color: var(--color-gray); font-size: medium; padding: 0px 0 15px; border-bottom: 1px solid var(--color-gray);}
.hgd-description p {padding: 20px;font-size: large; font-weight: 500; line-height: 1.5em; margin: 0px; color: var(--color-white); text-shadow: 1px 1px 2px var(--color-template-font);}

.hgd-description .table {width: 70%;margin: 5% auto;}
.hgd-description .table tr {color: var(--color-gray); transition: all ease .3s;}
.hgd-description .table tr:hover {background: var(--color-white-a); color: var(--color-template-font);}
.hgd-description .table td {border-top: 0px;}
.hgd-description .table tr a {border-top: 0px; color: var(--color-gray); transition: all ease .3s;}
.hgd-description .table tr a:hover {border-top: 0px; color: var(--color-template);}
.hgd-description .table tr .fal:before {font-size: large;}
.hgd-description .table tr .fal:hover:before {color: var(--color-template);}

a.imgagebox-content-link {width: 50%; margin: 0; padding: 7px; font-size: medium; color: var(--color-gray); letter-spacing: 2px;}

.hgd-imageboxen-container {margin-top:10px; box-shadow: 0px 10px 30px 0px var(--color-04);}
.hgd-imageboxen-container h4 {font-size: 4em; transition: all ease .5s; opacity: .6;}
.hgd-imageboxen-container:hover h4 {color: transparent;}

/* TOPBAR */
.color-topbar, .color-topbar a {color: var(--color-template-font); text-decoration: none; transition: all ease .3s;}

.topbar .fal {font-size: medium; padding-right: 7px;}

.hgd-social-media .fab {font-size: large;}
.hgd-social-media .fab:hover  {color: #333;}

/* COPYRIGHT */
.hgd-footer {display: flex; justify-content: center; color: var(--color-template-font); font-size: small; padding: 7px 0;}

.hgd-footer-copyright {float: left; margin-right: 7px;}
.hgd-footer-copyright-firma {float: left; margin-right: 7px;}

@media screen and (max-width: 800px) {
.hgd-footer {flex-direction: column; text-align: center; }

.hgd-footer-copyright {width: 100%; display: block; float: none; margin-right: 0px;}
.hgd-footer-copyright-firma {width: 100%; display: block; float: none; margin-right: 0px;}
.hgd-footer-copyright-recht {width: 100%; display: block; }
}

.copyright-menu ul {width: 100%;}
.copyright-menu li {display: inline-block;}

/* HGD-MEDIA + EXTRA */
.hgd-row {display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: 0px; margin-left: 0px;}

.titleFeatureboxsmall h3 {font-size: 1.7vw !important; letter-spacing: 3px; padding-top: 10px; padding-bottom: 10px;}
.subtitleFeatureboxsmall h4 {font-size: 1vw !important; font-weight: 500;}

.titleContentbox h2 {font-size: xx-large; padding-bottom: 20px;}
.titleContentbox h2:before {background-color: var(--color-white);}
.titleContentbox h2:after {background-color: var(--color-white);}


h3.start-01 {font-size: x-large; font-weight: 500; letter-spacing: 2px;}
ul.hgd-li-check {margin: 25px 0; padding: 0px;}
ul.hgd-li-check li {list-style: none; font-weight: 500; letter-spacing: 1px;}
ul.hgd-li-check li:before {font-family: 'Font Awesome 5 Pro'; font-weight: lighter; content: '\f058';  color: var(--color-template); margin-right: 7px;}

ul.hgd-li-check-print {margin: 25px 0; padding: 0px;}
ul.hgd-li-check-print li {list-style: none; font-weight: 500; letter-spacing: 1px;}
ul.hgd-li-check-print li:before {font-family: 'Font Awesome 5 Pro'; font-weight: lighter; content: '\f0a9'; font-size: 1.5rem; color: var(--color-template); margin-right: 7px;}

img.content-image {margin-top: 30px;width: 70%;}

.linkContentbox {margin-top: 40px;}
a.contentboxlink {font-size: large; color: var(--color-white); padding: 10px 20px; border: 1px solid var(--color-white);}
a.contentboxlink:hover {background: var(--color-gray-a); color: var(--color-white); border: 1px solid var(--color-white-a);}

hr {margin-top: 3rem; margin-bottom: 3rem; border-top: 5px solid rgba(0,0,0,.3);}

.hgd-ref {display: flex; align-items: center; justify-content: center;}
.hgd-ref img {width: 100%; max-width: 200px; max-height: 150px; transition: all ease .4s;}
.hgd-ref img:hover {box-shadow: 0px 3px 7px var(--color-black-a); transform: scale(1.2);}

a.link-uu:before {font-family: 'Font Awesome 5 Pro'; font-weight: lighter; content: '\f0c0'; font-size: 1.1rem; color: var(--color-templateA); margin-right: 7px;}
a.link-r:before {font-family: 'Font Awesome 5 Pro'; font-weight: lighter; content: '\f302'; font-size: 1.1rem; color: var(--color-templateA); margin-right: 7px;}
a.link-p:before {font-family: 'Font Awesome 5 Pro'; font-weight: lighter; content: '\f576'; font-size: 1.1rem; color: var(--color-templateA); margin-right: 7px;}
a.link-gd:before {font-family: 'Font Awesome 5 Pro'; font-weight: lighter; content: '\f618'; font-size: 1.1rem; color: var(--color-templateA); margin-right: 7px;}
a.link-w:before {font-family: 'Font Awesome 5 Pro'; font-weight: lighter; content: '\f6a3'; font-size: 1.1rem; color: var(--color-templateA); margin-right: 7px;}
a.link-k:before {font-family: 'Font Awesome 5 Pro'; font-weight: lighter; content: '\f073'; font-size: 1.1rem; color: var(--color-templateA); margin-right: 7px;}