/* ++++++++++++++++++++++++++++++++++ */
/*     custom.css Valoris Immo     */
/* ++++++++++++++++++++++++++++++++++ */

body {line-height: 1.35em;}
h1 {font-size: 2em; text-transform: uppercase;}
h2 {font-size: 1.7em;}
h3 {font-size: 1.3em;}
a {text-decoration: none;}
.maincontent {padding: 80px 20px;}
.hornav ul.menu > li.active > a {color: #f8ab1b !important; font-weight: 600;}
.hornav > ul > li > ul > li.active > a {color: #f8ab1b !important; font-weight: 600;}
.hornav > ul > li > ul > li:hover > a {background-color: inherit ; color: #f8ab1b !important;}
.module:first-of-type .module_surround {padding-top: 40px;}
#container_header {position: fixed; top: 0; z-index: 10; background-image: url('/images/design/VALORIS_Leiste_oben_2.jpg');}
#footer-1 {background-color: #333;}
#footer-2 {background-color: #333;}
.container_footer .wrapper960 {width: 100%;}
.video-container {
    max-width: 100%;
    width: 100%;
    padding: 20px;
    box-sizing: border-box;
  }
  
  video {
    width: 100%;
    height: auto;
    border: 2px solid #ccc;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  }
.clsBtnBewerbung {background-color: #004a8b; text-align: center; max-width: 60%; margin-left: auto; margin-right: auto; padding: 11px 5px;}
.clsBtnBewerbung a {color: #fff; font-size: 1.4em; font-weight: 600; letter-spacing: 1px;}

div.clsImgZoom img {width: 100%; height: auto;	
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);	transform: scale(1); -webkit-transition: all 0.6s linear; -moz-transition: all 0.6s linear; -ms-transition: all 0.6s linear;	-o-transition: all 0.6s linear;	transition: all 0.6s linear;}
div.clsImgZoom img:hover {-webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1);	-o-transform: scale(1.1);	transform: scale(1.1);}

div.layerslideshow .tns-slider img {transform: scale(1);transition: all 0s linear;transition-delay: 0s;transition-delay: 0s;}
/* .layerslideshow .info {left: -10% !important;} */
.layerslideshow111 .layerslideshow-title {line-height: 1.1em; padding-bottom: 13px;}
.layerslideshow .info-wrapper {padding-left: 0 !important;}
.header_top {background-color: rgba(0,0,0,0) !important; background-image: url('/images/design/VALORIS_Leiste_oben_Einzelteil2.jpg'); }
.hornav ul.menu > li > a, .hornav ul.menu > li > span {font-size: 1em; letter-spacing: 3px;}
.hornav ul.menu > li + li {margin-left: 25px;}
.module_surround {padding: 0 10px 90px;}
.clsKeyPortal, .clsKeyPortal a {text-align: right; text-decoration: none; text-transform: uppercase; font-weight: 600; letter-spacing: 3px; font-size: 1em;padding-right: 10px;} 
.clsShowTitle01 {font-size: 1.08em; font-weight:bold; letter-spacing: 1px;line-height: 2rem;}
.clsShowTitle02 {font-size: 0.9em; font-weight:bold; letter-spacing: 1px;}
.clsShowTxt {font-size: 1.2em; line-height: 1.3em; font-weight: 600;}
.clsLeistWindow {margin: 20px auto; width: 50%;}
.j51_numbers .j51_numbers_number {color: var(--h1-color) !important;}
.j51_numbers .j51_number_title {text-transform: uppercase; color: #004a8b;font-size: 1em;}
.j51_numbers .j51_number_caption {font-size: 0.8em; line-height: 1.25em; color: #656565;}
.clsH3Sub {text-transform: uppercase; font-size: 0.9em; text-align: center; margin-bottom: 0.9em; font-weight: 600; line-height: 0em;}
.clsH3Left {text-transform: uppercase; font-size: 0.9em; margin-bottom: 5px; font-weight: 600; color: #656565;}
.clsYel {color: #f8ab1b !important;}
.clsGrey {color: #656565 !important;}
.clsWhite {color: #fff !important;}
.clsMailBig {font-size: 1.1em; color: #fff; font-weight: 600; line-height: 2.8em;}
.clsTxtBig {font-size: 1.4em; color: #fff; line-height: 1.4em;}
.clsFirmaTeam {width: 57.5vw; background-color: #004a8b; text-align: center; padding: 12px 0; text-transform: uppercase; font-weight: 600;}
div.clsNachHalt {width: 100%;
    background-color: rgba(255,255,255,0.7);
    padding: 20px 0 1px 0;}
.clsDoH1 {font-size: 1.6em; text-transform: uppercase;color: #004a8b; line-height: 1.2em;}
.clsDoH1kl {font-size: 1.8em; text-transform: uppercase;color: #004a8b; line-height: 1.2em;}
.clsLeistH1 {font-size: 1.6em; text-transform: uppercase;color: #fff; line-height: 1.2em;}
.box-grid {display: grid; grid-template-columns: 45% 45%; grid-gap: 2rem; justify-items: center; margin: 0; padding: 0; max-width: 1000px;}
.box-caption {position: absolute; max-width: 300px; word-break: break-word;}
.box-flex {display: block; flex-flow: row nowrap; align-items: center; justify-content: center; position: relative; text-align: center; padding: 15px; font-size: 0.8em; min-width: 400px; max-width: 400px;}
.clsRasterTitle {font-size: 1.4em; font-weight: bold; color: #004a8b;}
#container_top2_modules .wrapper960 {margin: 0 auto -24px auto;}
#base1_modules a {color: #fff; text-decoration: none;}
/* #base2_modules .module_surround {padding-top: 0px;} */
.base-1b, .base-1c {text-transform: uppercase; letter-spacing: 1px;}
.box-g3 {display: grid; grid-template-columns: repeat(3, 1fr); grid-gap: 1rem; justify-items: center; margin: 0; padding: 0; max-width: 1230px;}
.box-fx3 {display: block; flex-flow: row nowrap; align-items: center; justify-content: center; position: relative; padding: 5px; font-size: 0.8em; min-width: 400px; max-width: 400px;}
/* #big-video-vid {top: 100px !important;} */
.clsVideoTxt {font-size: 2.4em; font-weight: 600; color: #fff; line-height: 1.4em; position: relative; top:100px;}
.clsFirmaTxt {font-size: 17px;}
:root {--j51-grid-row-gap: 20px;}
.back-to-top svg {fill: #2a73bd;}
.clsMailKontakt {font-size: 1.2em; font-weight: 600; color: #004a8b !important;}

/* Leistungen */
.clsLeistGrid {display: grid; grid-template-columns: 1fr; gap: 10px;}
.clsLeistItem {padding: 2px;}
/* Standardmäßig alle Elemente verstecken außer dem ersten */
.clsLeistItem:not(:first-child) {display: none;}
.clsRespImg {position: relative; width: 100%; max-width: 1120px; margin: 0 auto;}
.clsPCImg, .clsMobileImg { width: 100%; display: block;}
.clsMobileImg {display: none;}

/* Unternehmen */
#container_bottom1_modules .wrapper960, #container_bottom2_modules .wrapper960 {margin-bottom: 40px;}

/* Services */
.clsServiceCont {display: grid; grid-template-columns: 1fr 1fr; gap: 20px; max-width: 100%;}
.clsServiceItem {color: white; text-align: center; align-content: center;}

/* Footer */
.clsGridCont {display: grid; grid-template-columns: 0.9fr 0.9fr 0.5fr 1fr 0.3fr; gap: 8px; /* optional */ width: 100%;}
.clsGridCont > div {padding: 10px; text-align: left;}
.clsTxtUp {text-transform: uppercase;}
.clsFtLink {color: #fff; font-size: 0.8em;}

/* MWall Grid */
#mwall_items_3 .mwall-desc {font-size: 0.9em; font-weight: 500;}
.mwall-big .mwall-item-inner h3.mwall-title a {font-size: 4vh; line-height: 22px;}

@media only screen and ( max-width: 959px) {
h1 {font-size: 2.2em; padding-left: 3px;}
h2 {font-size: 1.6em; line-height: 2rem;}
body {font-size: 0.9em !important;}
#container_header {position: relative;}
.header-2 {margin-left: 120px; margin-right: auto;}
}

@media only screen and ( max-width: 767px ) {
h1 {font-size: 1.8em; padding-left: 5px;}
h2 {font-size: 1.4em; line-height: 2rem;}
body {font-size: 0.85em !important;}
#container_header {position: relative;}
.logo {padding: 20px 1px;}
.clsImgSmall {width: 50%;}
.top-1b {visibility: collapse;}
.clsKeyPortal, .clsKeyPortal a {letter-spacing: 1px; font-size: 0.9em; padding-right: 3px; padding-left: 3px;}
.clsDoH1 {font-size: 1.2em;}
.clsFirmaTxt {font-size: 0.85em;}
.module .module_surround, .module_menu .module_surround {padding: 0 20px 0 15px;}
.module_content {padding-right: 15px !important;}
.header-2 {margin-left: 10px; margin-right: 5px;}
:root {--j51-grid-row-gap: 15px; --j51-grid-column-gap: 10px;}
.box-grid {grid-template-columns: 400px; grid-gap: 1rem;}
.box-g3 {grid-template-columns: 400px; grid-gap: 1rem; max-width: 360px;}
.box-fx3 {min-width: 360px; max-width: 360px;}
.maincontent {padding-left: 10px; padding-right: 10px;}
/* Services */
.clsServiceCont {grid-template-columns: 1fr; gap: 0px;}
/* Leistungen */
.clsLeistItem {display: flex !important; justify-content: center;}
.clsPCImg {display: none;}
.clsMobileImg {display: block;}
/* Footer */
.clsGridCont {grid-template-columns: repeat(1,1fr); gap: 0px;}
}

@media only screen and ( max-width: 440px ) {
h1 {font-size: 1.5em; padding-left: 5px;}
h2 {font-size: 1.4em; line-height: 2rem;}
h3 {font-size: 1.1rem;}
body {font-size: 0.85em !important;}
p {hyphens: auto;word-break: normal;}
.module .module_surround, .module_menu .module_surround {padding: 0 20px 0 15px;}
.module_content {padding-right: 15px !important;}
.header-2 {margin-left: 5px; margin-right: 5px;}
:root {--j51-grid-row-gap: 15px; --j51-grid-column-gap: 10px;}
.maincontent .item-content {max-width: 93%;}
.logo {padding: 20px 1px;}
.clsUmbruch::after {content: '\A'; white-space: pre;}

.clsImgSmall {width: 50%;}
.clsImgContact {float: none !important; margin: 25px 75px 0px 5px !important;}
.top-1b {display: none;}
.clsKeyPortal, .clsKeyPortal a {letter-spacing: 1px; font-size: 0.9em; padding-right: 3px; padding-left: 3px;}
.clsDoH1 {font-size: 1.2em;}
.clsFirmaTxt {font-size: 0.85em;}
.clsLeistWindow {width: 95%;}
.clsH3Sub {line-height: 1.2em;}

.box-grid {grid-template-columns: 400px; grid-gap: 1rem; margin-left: -25px;}
.box-flex {padding: 5px; min-width: 360px; max-width: 360px;}
.box-g3 {grid-template-columns: 360px; grid-gap: 1rem; max-width: 360px;}
.box-fx3 {min-width: 360px; max-width: 360px;}
.menu-toggle {margin: 12px 80px 10px 15px;}
/* Services */
.clsServiceCont {grid-template-columns: 1fr; gap: 0px;}
/* Leistungen */
.clsLeistItem {display: flex !important; justify-content: center;}
.clsPCImg {display: none;}
.clsMobileImg {display: block;}
/* Footer */
.clsGridCont {grid-template-columns: repeat(1,1fr); gap: 0px;}
}