body,form,figure{margin:0;padding:0}img{border:0}header,footer,nav,section,aside,article,figure,figcaption{display:block}body{font-size:100.01%}select,input,textarea{font-size:99%}#container,.inside{position:relative}#main,#left,#right{float:left;position:relative}#main{width:100%}#left{margin-left:-100%}#right{margin-right:-100%}#footer{clear:both}#main .inside{min-height:1px}.ce_gallery>ul,.content-gallery>ul{margin:0;padding:0;overflow:hidden;list-style:none}.ce_gallery>ul li,.content-gallery>ul li{float:left}.ce_gallery>ul li.col_first,.content-gallery>ul li.col_first{clear:left}.float_left,.media--left>figure{float:left}.float_right,.media--right>figure{float:right}.block{overflow:hidden}.media{display:flow-root}.clear,#clear{height:.1px;font-size:.1px;line-height:.1px;clear:both}.invisible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.custom{display:block}#container:after,.custom:after{content:"";display:table;clear:both} @media (max-width:767px){#wrapper{margin:0;width:auto}#container{padding-left:0;padding-right:0}#main,#left,#right{float:none;width:auto}#left{right:0;margin-left:0}#right{margin-right:0}}img{max-width:100%;height:auto}.audio_container audio{max-width:100%}.video_container video{max-width:100%;height:auto}.aspect,.responsive{position:relative;height:0}.aspect iframe,.responsive iframe{position:absolute;top:0;left:0;width:100%;height:100%}.aspect--16\:9,.responsive.ratio-169{padding-bottom:56.25%}.aspect--16\:10,.responsive.ratio-1610{padding-bottom:62.5%}.aspect--21\:9,.responsive.ratio-219{padding-bottom:42.8571%}.aspect--4\:3,.responsive.ratio-43{padding-bottom:75%}.aspect--3\:2,.responsive.ratio-32{padding-bottom:66.6666%} .rsts-main,.rsts-main *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.rsts-header,.rsts-footer,.rsts-thumbs-header,.rsts-thumbs-footer{overflow:hidden}.rsts-view,.rsts-thumbs-view{position:relative}@media print{.rsts-view,.rsts-thumbs-view{position:static}}.rsts-crop,.rsts-thumbs-crop{position:relative;overflow:hidden}@media print{.rsts-crop,.rsts-thumbs-crop{position:static;overflow:visible;width:auto !important;height:auto !important;transform:none !important}}.rsts-slides,.rsts-slide,.rsts-thumbs-slides,.rsts-thumbs-slide{position:absolute;left:0;top:0}@media print{.rsts-slides,.rsts-slide,.rsts-thumbs-slides,.rsts-thumbs-slide{position:static;width:auto !important;height:auto !important;transform:none !important}.rsts-slides.rsts-slide-image img,.rsts-slides.rsts-slide-video img,.rsts-slides.rsts-thumbs-slide-image img,.rsts-slides.rsts-thumbs-slide-video img,.rsts-slide.rsts-slide-image img,.rsts-slide.rsts-slide-video img,.rsts-slide.rsts-thumbs-slide-image img,.rsts-slide.rsts-thumbs-slide-video img,.rsts-thumbs-slides.rsts-slide-image img,.rsts-thumbs-slides.rsts-slide-video img,.rsts-thumbs-slides.rsts-thumbs-slide-image img,.rsts-thumbs-slides.rsts-thumbs-slide-video img,.rsts-thumbs-slide.rsts-slide-image img,.rsts-thumbs-slide.rsts-slide-video img,.rsts-thumbs-slide.rsts-thumbs-slide-image img,.rsts-thumbs-slide.rsts-thumbs-slide-video img{width:100% !important;height:auto !important;margin:0 !important}}.rsts-slide,.rsts-thumbs-slide{overflow:hidden}@media print{.rsts-slide,.rsts-thumbs-slide{position:static}}.rsts-video-iframe,.rsts-thumbs-video-iframe{position:absolute;top:0;left:0;width:100%;height:100%}.rsts-type-slide .rsts-view,.rsts-thumbs-type-slide .rsts-thumbs-view{cursor:url("../../bundles/rocksolidslider/img/openhand.cur"),default;cursor:-webkit-grab;cursor:-moz-grab;cursor:-ms-grab;cursor:-o-grab;cursor:grab}.rsts-type-slide.rsts-dragging .rsts-view,.rsts-thumbs-type-slide.rsts-thumbs-dragging .rsts-thumbs-view{cursor:url("../../bundles/rocksolidslider/img/closedhand.cur"),default;cursor:-webkit-grabbing;cursor:-moz-grabbing;cursor:-ms-grabbing;cursor:-o-grabbing;cursor:grabbing;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.rsts-type-slide.rsts-dragging-disabled .rsts-view,.rsts-thumbs-type-slide.rsts-thumbs-dragging-disabled .rsts-thumbs-view{cursor:auto}@media print{.rsts-nav,.rsts-prev,.rsts-next,.rsts-overlay-prev,.rsts-overlay-next,.rsts-progress,.rsts-thumbs-nav,.rsts-thumbs-prev,.rsts-thumbs-next,.rsts-thumbs-overlay-prev,.rsts-thumbs-overlay-next,.rsts-thumbs-progress{display:none !important}} .rsts-skin-default.rsts-main{position:relative}.rsts-skin-default.rsts-type-fade .rsts-slide{background-color:#fff}.rsts-skin-default .rsts-caption{position:absolute;top:20px;left:20px;margin-right:20px;padding:5px 10px;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;color:#fff;background-color:#000;background-color:rgba(0,0,0,0.4);filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=0);opacity:0;-webkit-transform:translate(0, -20px);-moz-transform:translate(0, -20px);-ms-transform:translate(0, -20px);-o-transform:translate(0, -20px);transform:translate(0, -20px);-webkit-transition:opacity 0.5s,-webkit-transform 0.5s;-moz-transition:opacity 0.5s,-moz-transform 0.5s;-o-transition:opacity 0.5s,-o-transform 0.5s;transition:opacity 0.5s,transform 0.5s}.rsts-skin-default .rsts-active .rsts-caption{filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=100);opacity:1;-webkit-transform:translate(0, 0);-moz-transform:translate(0, 0);-ms-transform:translate(0, 0);-o-transform:translate(0, 0);transform:translate(0, 0)}.rsts-skin-default .rsts-prev,.rsts-skin-default .rsts-next,.rsts-skin-default .rsts-video-play,.rsts-skin-default .rsts-video-stop,.rsts-skin-default .rsts-thumbs-prev,.rsts-skin-default .rsts-thumbs-next{position:absolute;right:55px;bottom:15px;overflow:hidden;width:30px;height:30px;border:1px solid #ccc;border:1px solid rgba(0,0,0,0.1);-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;outline:none;line-height:0;text-align:center;text-decoration:none;text-indent:-9999px;-webkit-background-clip:padding;-moz-background-clip:padding;background-clip:padding-box;background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAMAAAAM7l6QAAAAilBMVEUHBwg/QEF5enp5ensCAwQHCAhzdHUAAQEGBwh8fX37+/svMDBub3COjo9yc3NtbW709fWvsLDm5uba2trR0dEuLi6Pj4/Q0NDl5eXZ2toFBgfz8/MuLy/09PT29vb8/Pz6+vp7e3x0dXZzdHT4+Pj39/f9/v3+/v79/f3///8EBQb5+fkAAAD19fVMP6q+AAAALnRSTlOAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICA8hTP8QAAAJ1JREFUeNrV0lkPwiAMAOB53zrva2xOxQm0///vWZ4a1o3EN20gNPnSlFASRKVQIS2KFHPKaPvcH8St8WesXYzddVMIZn3NZ1tTZ9Y7QLa7MdfVWlgYZqk9lzML7VZPbGCdDsFekpI14GoN/fGoY6aqkbVaUvVg0lKN7v3wvcuwt/Tg5tIPRjA77I/i1dhX2dnEJnYq4vP+2a/4FX8AsSOXytKixMYAAAAASUVORK5CYII=');-webkit-box-shadow:0 0 2px rgba(0,0,0,0.1);-moz-box-shadow:0 0 2px rgba(0,0,0,0.1);box-shadow:0 0 2px rgba(0,0,0,0.1);background-position:50% 50%;-webkit-transition:opacity 0.05s linear;-moz-transition:opacity 0.05s linear;-o-transition:opacity 0.05s linear;transition:opacity 0.05s linear}@media only screen and (-webkit-min-device-pixel-ratio: 1.3), only screen and (min--moz-device-pixel-ratio: 1.3), only screen and (-o-device-pixel-ratio: 4 / 3), only screen and (min-device-pixel-ratio: 1.3){.rsts-skin-default .rsts-prev,.rsts-skin-default .rsts-next,.rsts-skin-default .rsts-video-play,.rsts-skin-default .rsts-video-stop,.rsts-skin-default .rsts-thumbs-prev,.rsts-skin-default .rsts-thumbs-next{background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAMAAAANIilAAAAAIVBMVEWhoaE7PD15enqVlpaTk5N2d3h0dHVoaWpmZmcGBwj19fXsWX/bAAAAC3RSTlOAgICAgICAgICAgMiF55wAAAB9SURBVHja7dUxEoAgFANRFBTw/ge2YythEivHn/6VmU3XiwUOHPhPuGYf196zjLHPOi0tWsBYtICx/Zxgw4INCzYs2LBgw4INC55ZFadhN+NVbeh9jhf6mGJDgw0NNjTY0GBDgz0NXusiYDRWwGisgNHFL0Yrnwxd4MCBtd3+EosAicYyWQAAAABJRU5ErkJggg==');background-size:30px,30px}}.rsts-skin-default .rsts-prev:hover,.rsts-skin-default .rsts-next:hover,.rsts-skin-default .rsts-video-play:hover,.rsts-skin-default .rsts-video-stop:hover,.rsts-skin-default .rsts-thumbs-prev:hover,.rsts-skin-default .rsts-thumbs-next:hover{background-color:#eee;background-color:rgba(238,238,238,0.7)}.rsts-skin-default .rsts-next,.rsts-skin-default .rsts-thumbs-next{right:20px;background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAMAAAAM7l6QAAAAkFBMVEUBAQLPz9AlJiYlJifS0tIsLS0nJyjQ0dDR0tIBAQElJSYrLC2tra39/PwFBQYFBgf6+fmBgYKCgoL9/f339vZBQULIycnIyMiCg4PR0dEmJycmJyjMzMz8/Pzl5eXj4+MCAwQGBwghIiP09PT7+/shIiL6+vrNzs7Nzc0iIyP29vb39/cHCAkAAAD////19fV/WdL3AAAAMHRSTlOAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICRnvRdAAAAnklEQVR42tXSxw7CMAwG4LL3XqUtLdRQqNPY7/92WEJVDhkSN7B8iPTpl6M4ETMAA0t/ChmwPTELe+uPGKsQKywWflYUJxn5eI9xpOsneXidp7pp3Wa+dHrGbWY6d43bLD673nR9vLsZaL5cNfoAyp0eDyRdntxp6icy+/Ei981HqVGLq3xo1GaFm4kuRb1vvp1mFNzYLrzvn/2KX/MbXNOe099MDj0AAAAASUVORK5CYII=')}@media only screen and (-webkit-min-device-pixel-ratio: 1.3), only screen and (min--moz-device-pixel-ratio: 1.3), only screen and (-o-device-pixel-ratio: 4 / 3), only screen and (min-device-pixel-ratio: 1.3){.rsts-skin-default .rsts-next,.rsts-skin-default .rsts-thumbs-next{background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAMAAAANIilAAAAAHlBMVEWhoaE7PD2VlpaTk5N2d3h0dHVoaWpmZmcGBwj19fXtfGSSAAAACnRSTlOAgICAgICAgICAXdxslAAAAHxJREFUeNrt1TEOgDAMxdDSAi33vzBbPVUoZkLE+1O2/HK9KHHixH/A9fS4jnGGMfZZl6VFBzAWHcLHQD9gocFCg4UGCw0WGiw0WGjwum3qEsb7tH1xWViwsGBhwcKChQULC5Z2jRs2itHdfc+GjWB094vR+ieHLnHixK4bjyV89TB6vlgAAAAASUVORK5CYII=');background-size:30px,30px}}.rsts-skin-default .rsts-thumbs-prev,.rsts-skin-default .rsts-thumbs-next{position:absolute;top:50%;right:10px;margin-top:-15px}.rsts-skin-default .rsts-thumbs-prev{right:auto;left:10px}.rsts-skin-default.rsts-direction-y .rsts-prev{background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAMAAAAM7l6QAAAAbFBMVEUgISLDw8MgICGUlZaIiImSk5PCwsP9/f39/PyHh4iUlJWSkpLX2NgAAQIoKSkGBwgdHR7Ly8skJSYEBAXHyMj+/v739/ciIyMhIiImJyfNzc3S0tL8/Pz7+/v29vYHCAnNzs4AAAD////19fVh+HN2AAAAJHRSTlOAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIC401waAAAAiUlEQVR42uXRyQ7CMAwE0LC2QHfaQkji1sP//yNR1csEiXMlfPFI7zCWbN7JCCVmnj9i738x2hbMpHPTzCAmfag+XyAmrWt2QzqV5URuSLWqdHXmsDMRbFHYuPbnkPBw0rtaBzgbw21IWPKjdg6xxHV68ZJ2j9mhXyrRX/34fblgLQyQLf57S/wBI9V2nx3O9QoAAAAASUVORK5CYII=')}@media only screen and (-webkit-min-device-pixel-ratio: 1.3), only screen and (min--moz-device-pixel-ratio: 1.3), only screen and (-o-device-pixel-ratio: 4 / 3), only screen and (min-device-pixel-ratio: 1.3){.rsts-skin-default.rsts-direction-y .rsts-prev{background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAMAAAANIilAAAAAG1BMVEWjpKQ5OTqVlpaTk5NmZmdoaWp2d3gGBwj19fXoTOf7AAAACXRSTlOAgICAgICAgIC7HeZcAAAAeUlEQVR42u3UMQ6AMAzF0A8BmvufGHVpyOIOFRJI8f5WyxcqXLhw4U9jLeCznYzRNtYi2zsIs2UttqzFlrXYshZb1mLLWmg31iJ7+YVaaJ210GY9x/awWdsc+z5s1uaEQ4cNbY449LChzQFn3W3S9qsBFi5cuPDr+AYQcW8C6kiUiAAAAABJRU5ErkJggg==');background-size:30px,30px}}.rsts-skin-default.rsts-direction-y .rsts-next{background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAMAAAAM7l6QAAAAbFBMVEUwMTKKi4suLzAGBwja2trR0dEwMDEuLi/Q0NDZ2dmJiYp7e3x6e3t/gIEAAQL09PTn5+f6+vr8/Px0dHVwcHH8/f329vYFBgdzdHT+/v79/v339/f9/f3///90dXb4+Pj5+fkEBQYAAAD19fUC5l8BAAAAJHRSTlOAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIC401waAAAAnElEQVR42uXSyQ4CIQwG4HEddRZmZUSEQnn/d7RkSAi4HI2Jf6AlfIceoHCOMcccrTXcMR5OtInf5k/YyLVL84qHjoHvwLrhmdW+0AJIhT6eVc79YYtYCQBRIZanPmO1QWuxVqr2/aIylqD9fdP4OoLMZ5sb+dK2i8Xr3cTZie+CRk49aOTUcSRNOfo8TXPUnB1QPj0J5z/5Hb7OD7UPdeTEuFeXAAAAAElFTkSuQmCC')}@media only screen and (-webkit-min-device-pixel-ratio: 1.3), only screen and (min--moz-device-pixel-ratio: 1.3), only screen and (-o-device-pixel-ratio: 4 / 3), only screen and (min-device-pixel-ratio: 1.3){.rsts-skin-default.rsts-direction-y .rsts-next{background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAMAAAANIilAAAAAG1BMVEWjpKQ5OTqVlpaTk5NmZmdoaWp2d3gGBwj19fXoTOf7AAAACXRSTlOAgICAgICAgIC7HeZcAAAAg0lEQVR42u3UMQ6EMAxE0WVDYu5/YhpLXzBSRkAF8i9tvXZ+24MKFy5c+HP4P06H0RzGRoyjjWgOY1Nj0YLFpsaip7hFNrBog3ug02brDKsWK3imxQqe6EWsxWi1HqOxHqONBTuN9RiN9Vg11mPVWI9V99tL0rEe6/dVA1i4cOHCl9oBak1vAkBKLfwAAAAASUVORK5CYII=');background-size:30px,30px}}.rsts-skin-default.rsts-video-playing .rsts-nav,.rsts-skin-default.rsts-video-playing .rsts-prev,.rsts-skin-default.rsts-video-playing .rsts-next{display:none}.rsts-skin-default.rsts-video-playing .rsts-nav-thumbs{display:block}.rsts-skin-default.rsts-touch .rsts-nav-numbers,.rsts-skin-default.rsts-touch .rsts-nav-tabs{display:none}.rsts-skin-default .rsts-nav{position:absolute;right:95px;bottom:12px;left:10px;text-align:right}.rsts-skin-default .rsts-nav ul{margin:0 !important;padding:0 !important}.rsts-skin-default .rsts-nav li{display:inline}.rsts-skin-default .rsts-nav-numbers a,.rsts-skin-default .rsts-nav-tabs a{display:inline-block;height:30px;min-width:30px;padding:0.65em 0.5em 0.5em;margin:0 2px 3px;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;outline:none;font-size:12px;text-align:center;text-decoration:none;color:#fff;background-color:#555;background-color:rgba(85,85,85,0.6);-webkit-background-clip:padding;-moz-background-clip:padding;background-clip:padding-box;-webkit-box-shadow:0 0 2px rgba(0,0,0,0.2);-moz-box-shadow:0 0 2px rgba(0,0,0,0.2);box-shadow:0 0 2px rgba(0,0,0,0.2);filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=0);opacity:0;-webkit-transition:opacity 0.2s ease-in;-moz-transition:opacity 0.2s ease-in;-o-transition:opacity 0.2s ease-in;transition:opacity 0.2s ease-in}.rsts-skin-default .rsts-nav-numbers a:hover,.rsts-skin-default .rsts-nav-numbers a.active,.rsts-skin-default .rsts-nav-tabs a:hover,.rsts-skin-default .rsts-nav-tabs a.active{color:#333;background-color:#fff;background-color:rgba(255,255,255,0.5)}.rsts-skin-default:hover .rsts-nav-numbers a,.rsts-skin-default:hover .rsts-nav-tabs a{filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=100);opacity:1}.rsts-skin-default .rsts-nav-bullets{line-height:0}.rsts-skin-default .rsts-nav-bullets a{display:inline-block;width:9px;height:9px;overflow:hidden;margin:12px 4px;-webkit-border-radius:100%;-moz-border-radius:100%;border-radius:100%;outline:none;text-align:left;text-indent:-999px;background-color:#fff;background-color:rgba(255,255,255,0.8);-webkit-background-clip:padding;-moz-background-clip:padding;background-clip:padding-box;-webkit-box-shadow:0 0 2px #777;-moz-box-shadow:0 0 2px #777;box-shadow:0 0 2px #777}.rsts-skin-default .rsts-nav-bullets a:hover,.rsts-skin-default .rsts-nav-bullets a.active{background-color:#777;-webkit-box-shadow:inset 0 2px 0 -1px rgba(255,255,255,0.5),inset 0 -2px 0 -1px rgba(0,0,0,0.3),0 0 0 1px #555;-moz-box-shadow:inset 0 2px 0 -1px rgba(255,255,255,0.5),inset 0 -2px 0 -1px rgba(0,0,0,0.3),0 0 0 1px #555;box-shadow:inset 0 2px 0 -1px rgba(255,255,255,0.5),inset 0 -2px 0 -1px rgba(0,0,0,0.3),0 0 0 1px #555}.rsts-skin-default .rsts-nav-thumbs{position:static;padding-top:5px}.rsts-skin-default .rsts-nav .rsts-nav-prev,.rsts-skin-default .rsts-nav .rsts-nav-next{display:none}.rsts-skin-default .rsts-video-play{top:50%;right:auto;bottom:auto;left:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border:none;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEYAAABGCAMAAABG8BK2AAAAb1BMVEU4ODgGBgbx8fGurq7i4uIODg5QUFD7+/vBwcEUFBQYGBggICC1tbXNzc0JCQkVFRWsrKwTExPExMTS0tImJibv7+9KSkozMzP4+PhYWFj+/v6Dg4MDAwPl5eVycnKenp4MDAza2toPDw////8AAACZ5/RyAAAAJXRSTlOAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAwmBGiwAAALNJREFUeNrt1kcOwkAQRFFyxsYmBxtDc/8zIrGpA/xaWKhnO9KT5ncvZvCxnGSSSSaZv2GK0sIsFzMHM53MWwPzfkU8OwsT9cHCRHOyMHFpLYwCIUaBEKNAiFEgxCgQYhSIMQrEGAXijAJxJrZrC7NZGZjb/WF41PHqSLw/Owa+q9D6KQthlAUwykIYZSGMsiBGWRCjLIhRFsQoC2Ga0S8LZMqx7gAzLPr0aUsmmWSS6SXzBf8cqwAv1zglAAAAAElFTkSuQmCC')}@media only screen and (-webkit-min-device-pixel-ratio: 1.3), only screen and (min--moz-device-pixel-ratio: 1.3), only screen and (-o-device-pixel-ratio: 4 / 3), only screen and (min-device-pixel-ratio: 1.3){.rsts-skin-default .rsts-video-play{background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIwAAACMCAMAAACZHrEMAAAARVBMVEUJCQlOTk4nJyddXV1gYGD29vbh4eGTk5PAwMA2NjYYGBgGBga3t7dUVFQtLS0SEhKHh4fb29sDAwPz8/NaWlr///8AAACZTZFgAAAAF3RSTlOAgICAgICAgICAgICAgICAgICAgICAgCZn8kAAAAFfSURBVHja7dpZUsMwFAVR5gDRLMT+l8r1Cqjih/5oLyB1kurYlp4evkGXGDFixIgRI0aMGDFixIgRI0aMGDFifseQvsBfPvjrdgdhzvsnCHPePkCY8/oCwpxzu4MwCQeESTggTMIBYa5wQJiEA8IkHBAm4YAwVzggTMIBYRIOCJNwQJgrHBAm4YAwCQeESTggzBUOCJNwQJiEA8IkHBDmCgeESTggTMIBYRIOCHOFA8IkHBAm4YAw5/UZhDn7iYOZjfPLlM5pZizMv2lXzk1vNs4duHTOs2kszFN7V87L1WycN73SOe/AY2FWB7tyFnGzcVaUpXPW2mNhdiF25WwWzcbZuSqds6c3Fma3c1fOpvRsnB3y0jmzg7EwU5VdOcOv2TiTuNI5M8qxMNPbXTlD9tk4E//SOWchxsKcEnmsoMM8qGNOYsRgLjFixIgRI0aMGDFixIgRI0aMGDH/e/0Ai4OJ2+ZcrkwAAAAASUVORK5CYII=');background-size:70px,70px}}.rsts-skin-default .rsts-video-stop{top:20px;right:20px;left:auto;background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAMAAAAM7l6QAAAAbFBMVEWnp6dOTk7x8fHv7+9HR0fw8PDu7u7e3t5NTU3f398UFBQTExP4+PhLS0tvb29xcXH09PRJSUn39/fn5+cWFhampqb29vZISEhMTExLS0ukpKT////r6+sAAAD///8AAABKSkr19fUAAAD///8df9PJAAAAJHRSTlN6e35+e35+e3t7fX1/fHl5fXt/e315fnt7e3p/foGBfnt9gIDdofLFAAAAk0lEQVR42u2SSQ7DIAxF03nKPBEC2Ni9/x3jsMXqsuqiljxITx/8EcX7Y/wxuOmUhmPhIMdlg4akzxGbMscrBu4IyHLANce+Ymb7WKRWPsdyqpCnZJzVzUmUEgvpxmAYA4dxAB3TIanvupqisJdkRwr2O403K9V43bdpgaLuu6/x3KY7sO7VN7+m4TI5+K3v8H28AYM7doAzbo6MAAAAAElFTkSuQmCC')}@media only screen and (-webkit-min-device-pixel-ratio: 1.3), only screen and (min--moz-device-pixel-ratio: 1.3), only screen and (-o-device-pixel-ratio: 4 / 3), only screen and (min-device-pixel-ratio: 1.3){.rsts-skin-default .rsts-video-stop{background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAMAAAANIilAAAAALVBMVEXo6OjGxsZjY2PKysq3t7ewsLCOjo7f39+Pj4/l5eVfX19hYWHj4+NRUVH///80A/15AAAAD3RSTlOGkL2PlZemiKWHvr2HyICcCOzTAAAAv0lEQVR42u3VSQ7DIAxA0bRJSBjs+x83mzYfNnatLqpKeM0THmRY9IuYeOKJJ7bwlsdTWwCfUpsS+Smni7EipfVW5PQwtte5iqAdvIvcGiuy25gs0e1ta7YwuqJ76+NRr6P1MbkSTM7HaKyP0QXK1HyMxgaxrjde1cBe1TV4MzZeMxYdm7OvF9OWR7H0YtpDG/ojnDurnc6hfT7Iw9tnImE7ney00bdFJ3Uw+mXpQoq822Nv8/Yf383EE0/8G3wBfh3Bcn7dsMIAAAAASUVORK5CYII=');background-size:30px,30px}}.rsts-skin-default .rsts-video-youtube>.rsts-video-stop{top:25px}.rsts-skin-default .rsts-video-vimeo>.rsts-video-stop{top:10px;right:auto;left:10px}.rsts-skin-default .rsts-progress{position:absolute;top:0;right:0;width:100%;height:2px;background-color:#000;filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=0);opacity:0;-webkit-transition:opacity 0.2s linear;-moz-transition:opacity 0.2s linear;-o-transition:opacity 0.2s linear;transition:opacity 0.2s linear}.rsts-skin-default .rsts-progress div{height:100%;background-color:#fff}.rsts-skin-default .rsts-progress.rsts-progress-active{filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=30);opacity:0.3}.rsts-skin-default .rsts-thumbs-slide{filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=80);opacity:0.8}.rsts-skin-default .rsts-thumbs-slide.rsts-thumbs-active-thumb{filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=100);opacity:1} #colorbox,#cboxOverlay,#cboxWrapper{position:absolute;top:0;left:0;z-index:9999;overflow:hidden;-webkit-transform:translate3d(0,0,0)}#cboxWrapper{max-width:none}#cboxOverlay{position:fixed;width:100%;height:100%}#cboxMiddleLeft,#cboxBottomLeft{clear:left}#cboxContent{position:relative}#cboxLoadedContent{overflow:auto;-webkit-overflow-scrolling:touch}#cboxTitle{margin:0}#cboxLoadingOverlay,#cboxLoadingGraphic{position:absolute;top:0;left:0;width:100%;height:100%}#cboxPrevious,#cboxNext,#cboxClose,#cboxSlideshow{cursor:pointer}.cboxPhoto{float:left;margin:auto;border:0;display:block;max-width:none;-ms-interpolation-mode:bicubic}.cboxIframe{width:100%;height:100%;display:block;border:0;padding:0;margin:0}#colorbox,#cboxContent,#cboxLoadedContent{box-sizing:content-box;-moz-box-sizing:content-box;-webkit-box-sizing:content-box}#cboxOverlay{background:#000;opacity:.9;filter:alpha(opacity = 90)}#colorbox{outline:0}#cboxContent{margin-top:20px;background:#000}.cboxIframe{background:#fff}#cboxError{padding:50px;border:1px solid #ccc}#cboxLoadedContent{border:5px solid #000;background:#fff}#cboxTitle{position:absolute;top:-20px;left:0;color:#ccc}#cboxCurrent{position:absolute;top:-20px;right:0;color:#ccc}#cboxLoadingGraphic{background:url(../../assets/colorbox/images/loading.gif) no-repeat center center}#cboxPrevious,#cboxNext,#cboxSlideshow,#cboxClose{border:0;padding:0;margin:0;overflow:visible;width:auto;background:0 0}#cboxPrevious:active,#cboxNext:active,#cboxSlideshow:active,#cboxClose:active{outline:0}#cboxSlideshow{position:absolute;top:-20px;right:90px;color:#fff}#cboxPrevious{position:absolute;top:50%;left:5px;margin-top:-32px;background:url(../../assets/colorbox/images/controls.png) no-repeat top left;width:28px;height:65px;text-indent:-9999px}#cboxPrevious:hover{background-position:bottom left}#cboxNext{position:absolute;top:50%;right:5px;margin-top:-32px;background:url(../../assets/colorbox/images/controls.png) no-repeat top right;width:28px;height:65px;text-indent:-9999px}#cboxNext:hover{background-position:bottom right}#cboxClose{position:absolute;top:5px;right:5px;display:block;background:url(../../assets/colorbox/images/controls.png) no-repeat top center;width:38px;height:19px;text-indent:-9999px}#cboxClose:hover{background-position:bottom center} /* ----- PRELOADER ----- styles defined in bundles/markocupicpreloaderoverlay/css/preloader-overlay.css */ #preloaderOverlay { background-color: #ffffff; height: 100%; width: 100%; position: fixed; top: 0; left: 0; bottom: 0; right: 0; z-index: 9998; opacity: 1; } #preloaderOverlay .preloader-icon { z-index: 9999; width: 100px; height: 100px; position: absolute; left: 50%; top: 50%; margin-left: -50px; margin-top: -50px; border-radius: 50%; border-left: 2px solid #e6e6e6; border-right: 2px solid #e6e6e6; border-top: 2px solid #e6e6e6; border-bottom: 2px solid #2acfff; -webkit-animation: rotation 1.6s infinite linear; -moz-animation: rotation 1.6s infinite linear; -ms-animation: rotation 1.6s infinite linear; -o-animation: rotation 1.6s infinite linear; animation: rotation 1.6s infinite linear; } #preloaderOverlay .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; -webkit-clip-path: inset(50%); clip-path: inset(50%); border: 0; } @-webkit-keyframes rotation { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes rotation { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @font-face { font-family: 'Motiva Sans Black'; /* Gewünschter Name */ src: url('/files/layout/fonts/MotivaSansBlack.eot'); /* für IE9 */ src: url('/files/layout/fonts/MotivaSansBlack.woff') format('woff'), /* für moderne Browser */ url('/files/layout/fonts/MotivaSansBlack.ttf') format('truetype'); /* für Safari, Android, iOS */ font-display: swap; } @font-face { font-family: 'Motiva Sans'; /* Gewünschter Name */ src: url('/files/layout/fonts/MotivaSansRegular.eot'); /* für IE9 */ src: url('/files/layout/fonts/MotivaSansRegular.woff') format('woff'), /* für moderne Browser */ url('/files/layout/fonts/MotivaSansRegular.ttf') format('truetype'); /* für Safari, Android, iOS */ font-display: swap; } /*Allgemeines*/ html{ overflow-x: hidden; } body { font-family: 'Motiva Sans', sans-serif; font-size: 18px; font-weight: 200; font-style: normal; color: #1D2536; background-color: #EBEBEC; margin: 0; padding: 0; width: 100%; overflow-x: hidden; } @media (max-width: 450px) { body{ font-size: 16px; } } strong { font-family: 'Motiva Sans Black', sans-serif; } ::-webkit-scrollbar { width: 15px; height: 15px; } ::-webkit-scrollbar-thumb { background: #1D2536; border-radius: 1px; } ::-webkit-scrollbar-track { background: linear-gradient(90deg, #DFDFDF, #DFDFDF 1px, #EBEBEC 0, #EBEBEC); } ::selection { background: rgba(220, 4, 46, 0.88); color: #fff; text-shadow: none; } .relative { position: relative; } :focus { outline: none !important; } .headlinder-full { flex-basis: 100%; text-align: center; margin-bottom: 6rem; } .logo.ce_image { width: 160px; position: relative; padding: 35px 0px; right: 3%; top: 2%; display: inline-block; cursor: pointer; transition-property: opacity, filter; transition-duration: 0.15s; font-weight: 500; transition-timing-function: linear; font: inherit; color: #424242; text-transform: none; background-color: transparent; border: 0; margin: 0; overflow: visible; z-index: 2; } #preloaderOverlay .preloader-icon { border-color: transparent transparent transparent !important; border-width: 0px !important; } .startseite .logo a, .error .logo a { display: block; position: relative; z-index: 1; } .startseite .logo img, .error .logo img { visibility: hidden; z-index: -9999; } .startseite .logo a:before, .error .logo a:before { background-image: url('/files/layout/bilder/hofer-werbung-logo-weiß.png'); background-size: contain; background-repeat: no-repeat; background-position: center top; position: absolute; z-index: 0; width: 100%; height: 45px; display: block; left: 0; top: 0; content: ""; } .startseite .sprechblase { position: fixed; z-index: 10000; top: calc(50% - 100px); right: 0; width: 200px; margin: 0; color: #fff; background-image: url('https://new.hofer-werbung.de/files/web/startseite/2019_hofer_logo_sprechblase-rot.png'); background-repeat: no-repeat; background-size: contain; height: 200px; display: flex; flex-direction: column; justify-content: center; text-align: center; cursor: pointer; } .mt-2 { margin-top: 2rem; } .mt-6 { margin-top: 6rem; } hr { border: 0; height: 1px; background: #0c1b26; clear: left; } a { -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; text-decoration: none; color: #1D2536; } strong { color: #1D2536; font-family: 'Motiva Sans Black', sans-serif; } p { color: #1D2536; } .active { font-family: 'Motiva Sans Black', sans-serif; } .center { text-align: center; } h1{ color: #1D2536; font-weight: normal; font-family: 'Motiva Sans Black', sans-serif; text-transform: uppercase; font-size: 3em; margin-bottom: 0; word-break: break-word; } h2 { color: #1D2536; font-weight: normal; font-family: 'Motiva Sans Black', sans-serif; font-size: 1.5em; margin-top: 15px; } h3, h4, h5, h6, h7 { color: #1D2536; font-weight: normal; font-family: 'Motiva Sans Black', sans-serif; font-size: 2em; margin-bottom: 1rem; text-transform: uppercase; } p, ul, strong, a { line-height: 24px; } @media (max-width: 450px) { h1 { font-size: 30px; } h2, h3, h4, h5, h6{ font-size: 1.3em; } } @media (max-width: 370px) { h1, h2, h3, h4, h5, h6{ font-size: 1.2em; } } @media (max-width: 350px) { h1, h2, h3, h4, h5, h6{ font-size: 1.1em; } } .ce_image { width: 100%; } .ce_image img { display: block; } .bg-hellgrau { background-color: #fbfbfb; } .bg-grau { background-color: #DFDFDF; } .bg-rot, .bg-rot p, .bg-rot strong, .bg-rot a { background-color: #DC042E; color: #fff !important; } /*Navigation*/ #header { height: 90px; } .startseite #header { height: 0; } #header>.inside { display: flex; justify-content: space-between; position: fixed; width: 100vw; background-color: rgba(29, 37, 54, 0); transition: background-color 0.75s ease; z-index: 999; top: 0; } #header.scrolled>.inside, #header.active > .inside, .mm-wrapper_opened #header > .inside{ background-color: #fff; } .startseite #header.scrolled>.inside, .error #header.scrolled>.inside, .startseite.mm-wrapper_opened #header > .inside { background-color: rgb(29, 37, 54) !important; } .navtop { max-height: 70%; overflow-y: auto; width: 92%; left: 2%; border-radius: 2px; padding: 2% 2% 5rem 2%; position: fixed; top: -5000px; background-color: rgba(220, 4, 46, 0.88); z-index: 1; transition: all 0.4s; -ms-transform: all 0.4s; -moz-transform: all 0.4s; -webkit-transform: all 0.4s; -o-transform: sall 0.4s; } @media (min-width: 1440px) { .navtop { padding: 5rem 2% 0 2%; } } .mod_navigation { width: 100%; display: flex; justify-content: center; } .mod_navigation>ul { display: flex; justify-content: space-between; flex-flow: wrap; width: 100%; } .mod_navigation ul { list-style: none; padding: 0; } .mod_navigation ul a.submenu { font-family: 'Motiva Sans Black'; } .mod_navigation>ul>li { padding: 0 3em 0 1.5em; margin-bottom: 2em; } .mod_navigation ul li a, .mod_navigation ul li strong { display: block; text-decoration: none; padding-bottom: 25px; color: #fff; width: 100%; text-transform: uppercase; font-size: 40px; } .mod_navigation .level_1 > li > a, .mod_navigation .level_1 > li > strong { font-family: 'Motiva Sans Black', sans-serif; } .mod_navigation .level_2 li a, .mod_navigation .level_2 li strong { font-size: 20px; padding-bottom: 10px; } .mod_navigation ul li a:hover, .mod_navigation ul li strong:hover { color: #fff; } .mod_navigation ul .level_2 { margin-top: 25px; } .mod_navigation ul .level_2 li a { font-family: 'Motiva Sans Black', sans-serif; } .mod_navigation ul.level_1 .historie { background-color: transparent; } .open { top: 6rem; z-index: 99; } #nav_back { text-align: left; flex-basis: 100%; } #nav_back p { display: inline-block; cursor: pointer; color: black; font-weight: 700; } /*Hamburger menu*/ @media (min-width: 751px) { .menu-toggle{ display: none !important; } } .mm-panel, .mm-navbar, .mm-panels{ background: rgba(247, 0, 0, 0); background-color: rgba(247, 0, 0, 0); } .mm-menu .level_1 > li > a.submenu span{ padding-left: 51px; } .mm-menu .level_1 > li span{ padding-bottom: 9px; } .mm-menu .level_1 > li > a > span, .mm-menu .level_1 > li > span, .mm-menu .level_1 > li > a{ text-transform: uppercase; padding-bottom: 9px; font-family: 'Motiva Sans Black', sans-serif; } .mm-btn_next:after{ top: -5px; } /* .mm-listitem_opened>.mm-panel { height: 170px; } */ .mod_mmenu{ top: 90px !important; text-align: center; padding-bottom: 90px; } .mm-listitem__text{ padding-right: 20px; } .mm-listitem_vertical>.mm-listitem__btn{ height: 50px !important; } .mm-listitem{ font-size: 20px; } .mm-listitem_vertical>.mm-panel{ padding: 10px 10px 10px 10px; } .mm-menu_position-bottom.mm-menu_opened, .mm-menu_position-front.mm-menu_opened, .mm-menu_position-top.mm-menu_opened, .mm-panel{ z-index: 9999999; } .mm-listitem:after{ left: 0; } .level_2 .mm-listitem{ font-size: 18px; } .mm-menu{ background: rgba(247, 0, 0, 0); background-color: rgba(220, 4, 46, 0.95); height: auto !important; min-height: 100vh !important; max-height: auto !important; } .mm-listitem, .mm-navbar__title>span{ color: #fff; } /* .mm-listview.level_1{ padding-top: 1rem; } */ .mm-navbar_sticky{ border-bottom: 0; text-transform: uppercase; font-family: 'Motiva Sans Black', sans-serif; font-size: 20px; padding-top: 3px; } .mm-btn:after, .mm-btn:before{ border-color: rgba(255, 255, 255, 0.6) !important; } .mm-listitem{ border-color: rgba(255, 255, 255, 0) !important } .hamburger, .menu-toggle { position: relative; padding: 35px 0px; left: 5%; top: 2%; display: inline-block; cursor: pointer; transition-property: opacity, filter; transition-duration: 0.15s; font-weight: 500; transition-timing-function: linear; font: inherit; color: #424242; text-transform: none; background-color: transparent; border: 0; margin: 0; overflow: visible; z-index: 999; } .menu-toggle .hamburger{ padding: 0 !important; } .menu-toggle{ display: flex; align-items: center; } .hamburger:focus { outline: none !important; } .hamburger:hover { opacity: 0.7; } .hamburger-box { width: 40px; height: 24px; display: inline-block; position: relative; } .hamburger-inner { display: block; top: 50%; margin-top: -2px; } .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after { width: 40px; height: 2px; border-radius: 0px; position: absolute; transition-property: transform; transition-duration: 0.15s; transition-timing-function: ease; } .hamburger-inner::after, .hamburger-inner, .hamburger-inner::before { background-color: #1D2536; } .startseite .hamburger-inner::after, .startseite .hamburger-inner, .startseite .hamburger-inner::before, .error .hamburger-inner::after, .error .hamburger-inner, .error .hamburger-inner::before { background-color: #EBEBEC; } .hamburger-inner::before, .hamburger-inner::after { content: ""; display: block; } .hamburger-inner::before { top: -10px; } .hamburger-inner::after { bottom: -10px; } .hamburger--collapse .hamburger-inner { top: auto; bottom: 0; transition-duration: 0.13s; transition-delay: 0.13s; transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); } .hamburger--collapse .hamburger-inner::after { top: -20px; transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear; } .hamburger--collapse .hamburger-inner::before { transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19); } .hamburger--collapse.is-active .hamburger-inner { transform: translate3d(0, -10px, 0) rotate(-45deg); transition-delay: 0.22s; transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); } .hamburger--collapse.is-active .hamburger-inner::after { top: 0; opacity: 0; transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.22s linear; } .hamburger--collapse.is-active .hamburger-inner::before { top: 0; transform: rotate(-90deg); transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1); } .hamburger-container { text-align: right; } /* Akkordion */ .toggler { background-color: #e61a3e; padding: 1% 0%; color: #fff; font-family: 'Motiva Sans Black', sans-serif; margin-bottom: 1%; cursor: pointer; } @media (max-width: 450px) { #job p, #job ul, #job li, #job strong, #job a, #job h1, #job h2, #job h3, #job h4, #job h5, #job h6{ text-align: left !important; } } /*Footer*/ #footer { background-color: #1D2536; color: #f9f9fa; padding-top: 25px; padding-bottom: 25px; position: relative; } #footer .inside { margin-left: 2.5%; margin-right: 2.5%; text-align: left; width: 95%; display: flex; justify-content: space-between; flex-flow: wrap; } #footer li { list-style: none; } #footer p, #footer a, #footer li, #footer h2 { color: #f9f9fa; } #footer strong { color: #f9f9fa; display: inline-block; font-size: 19px; font-weight: normal; margin-bottom: 5px; font-weight: 500; text-transform: uppercase; } #footer div div:last-child { margin-right: 0; } #footer .inside ul { padding-left: 0; } #footer .inside div>ul li { margin-right: 15px; padding-bottom: 3px; padding-top: 3px; } #footer .inside div>ul li a { display: block; text-decoration: none; } @media (max-width: 1280px) { #footer .inside>div { flex-basis: 33.333%; } #footer .inside ul { padding-left: 15%; } } @media (max-width: 800px) { #footer .inside>div { flex-basis: 50%; } #footer .inside ul { padding-left: 5%; } } @media (max-width: 600px) { #footer .inside>div { flex-basis: 100%; } } /*Headerbild Video*/ .headerbild-big { height: 100vh; } .headerbild-big #headervideo { width: 100vw; height: 100vh; object-fit: cover; } #headervideo.active { animation: videoflyin 1s linear; animation-delay: -0s; -webkit-animation: videoflyin 0.5s linear; -webkit-animation-delay: 0s; } @keyframes videoflyin { from { transform: scale(2); transform-origin: 50% 0%; } to { transform: scale(1); transform-origin: 50% 0%; } } @-webkit-keyframes videoflyin { from { transform: scale(1.5); transform-origin: 50% 0%; } to { transform: scale(1); transform-origin: 50% 0%; } } .headerbild-big.bild-text-big .ce_text p { padding-right: 50px; } .headerbild-big.bild-text-big .ce_text p.active { animation: textflyin 0.5s ease; animation-delay: 0s; -webkit-animation: textflyin 0.5s ease; -webkit-animation-delay: 0s; } @keyframes textflyin { from { opacity: 0; transform: translateY(-250px); } to { opacity: 1; transform: translateY(0); } } @-webkit-keyframes textflyin { from { opacity: 0; transform: translateY(-250px); } to { opacity: 1; transform: translateY(0); } } .headerbild-big .circle { position: absolute; left: calc(50vw - 50px); bottom: -100px; height: 100px; width: 100px; cursor: pointer; } .headerbild-big .circle.active { animation: textflyin 0.5s ease; animation-delay: 0s; -webkit-animation: textflyin 0.5s ease; -webkit-animation-delay: 0s; } .headerbild-big .circle.active p { margin: 0; animation: circlearrow 2s ease; animation-delay: 2s; animation-iteration-count: infinite; -webkit-animation: circlearrow 2s ease; -webkit-animation-delay: 2s; -webkit-animation-iteration-count: infinite; } @keyframes circlearrow { from { transform: translateY(0); } to { transform: translateY(40px); } } @-webkit-keyframes circlearrow { from { transform: translateY(0); } to { transform: translateY(30px); } } .headerbild-big .circle p::after { content: url("data:image/svg+xml,%3Csvg id='Gruppe_140' data-name='Gruppe 140' xmlns='http://www.w3.org/2000/svg' width='30' height='37.474' viewBox='0 0 30 37.474'%3E%3Crect id='Rechteck_68' data-name='Rechteck 68' width='3.561' height='33.602' transform='translate(13.225)' fill='%23fff'/%3E%3Cpath id='Pfad_236' data-name='Pfad 236' d='M15,24.392,2.692,11.511,0,13.944,15,29.63,30,13.944l-2.692-2.434Z' transform='translate(0 7.843)' fill='%23fff'/%3E%3C/svg%3E%0A"); width: 40px; margin-left: 35px; } .headerbild-big.bild-text-big .ce_text p:after{ background-size: contain; background-repeat: no-repeat; background-position: center top; content: ""; position: absolute; width: 100px; height: 100px; margin: auto; right: -15px; top: -80px; background-image: url('/files/layout/bilder/hofer-werbung-icon.png'); } .header_leistungen { position: absolute; top: calc(100vh - 55px); display: grid; width: 90%; left: 5%; grid-template-columns: repeat(4,1fr); } .header_leistungen p, .header_leistungen a { color: #fff; font-family: 'Motiva Sans Black'; text-align: center; padding: 10px 0; } .header_leistungen p:nth-child(1), .header_leistungen p:nth-child(3) { border-right: 2px solid #fff; } .pfeil { display: flex; flex-direction: row; justify-content: center; margin-top: 20px; padding-bottom: 20px; } .pfeil p:hover { animation: circlearrow 2s ease; animation-delay: 0s; animation-iteration-count: infinite; -webkit-animation: circlearrow 2s ease; -webkit-animation-delay: 0s; -webkit-animation-iteration-count: infinite; } #article-1 .pfeil{ position: relative; grid-column: 1 / 3; width: 100%; cursor: pointer; left: 0; } .pfeil p::after { content: url("data:image/svg+xml,%3Csvg id='Gruppe_140' data-name='Gruppe 140' xmlns='http://www.w3.org/2000/svg' width='30' height='37.474' viewBox='0 0 30 37.474'%3E%3Crect id='Rechteck_68' data-name='Rechteck 68' width='3.561' height='33.602' transform='translate(13.225)' fill='%231D2536'/%3E%3Cpath id='Pfad_236' data-name='Pfad 236' d='M15,24.392,2.692,11.511,0,13.944,15,29.63,30,13.944l-2.692-2.434Z' transform='translate(0 7.843)' fill='%231D2536'/%3E%3C/svg%3E%0A"); width: 40px; display: flex; flex-direction: row; justify-content: center; } #main #article-1 { margin-bottom: 0rem; } #article-23 .pfeil { margin-top: 40px; } #article-55 .pfeil { margin-bottom: 0; } #jobs .pfeil { flex-basis: 100%; } #article-25 .ce_text.text-bild img { max-height: 500px; width: 100%; } #article-25 .ce_text.text-bild .redbutton { margin-top: 50px; } .pfeil_zurueck p a::after { content: url("data:image/svg+xml,%3Csvg id='Gruppe_140' data-name='Gruppe 140' xmlns='http://www.w3.org/2000/svg' width='30' height='37.474' viewBox='0 0 30 37.474'%3E%3Crect id='Rechteck_68' data-name='Rechteck 68' width='3.561' height='33.602' transform='translate(13.225)' fill='%231D2536'/%3E%3Cpath id='Pfad_236' data-name='Pfad 236' d='M15,24.392,2.692,11.511,0,13.944,15,29.63,30,13.944l-2.692-2.434Z' transform='translate(0 7.843)' fill='%231D2536'/%3E%3C/svg%3E%0A"); width: 40px; display: flex; flex-direction: row; justify-content: center; transform: rotate(90deg); } #popup .popup_startseite { display: none; position: fixed; background-color: rgb(255 255 255 / 70%); top: 0; z-index: 10000; width: 100vw; height: 100vh; } #popup .popup_startseite.visible { display: flex; } #popup .popup_startseite figure { height: 100vh; display: flex; flex-direction: column; justify-content: center; } #popup .popup_startseite img { margin-left: auto; margin-right: auto; object-fit: contain; } #popup .popup_bewerbung{ display: none; position: fixed; width: 100vw; height: calc(100vh - 90px); background-color: rgb(255 255 255 / 70%); z-index: 100000; flex-direction: column; justify-content: center; } #popup .popup_bewerbung.visisble { display: flex; } #popup .popup_bewerbung .ce_form { margin-left: auto; margin-right: auto; width: 60%; padding: 5%; background-color: #fff; border: 5px solid #DC042E; border-radius: 5px; } #popup .popup_bewerbung .ce_form h2 { text-transform: uppercase; } #popup .close { content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='45.584' height='45.584' viewBox='0 0 45.584 45.584'%3E%3Cg id='Gruppe_45' data-name='Gruppe 45' transform='translate(-359.708 -38.708)'%3E%3Cpath id='Pfad_112' data-name='Pfad 112' d='M3.771.028,52.794.386a3.838,3.838,0,0,1,3.8,3.8,3.705,3.705,0,0,1-3.743,3.743L3.826,7.57a3.838,3.838,0,0,1-3.8-3.8A3.705,3.705,0,0,1,3.771.028Z' transform='translate(365.294 38.669) rotate(45)' fill='%23DC042E'/%3E%3Cpath id='Pfad_113' data-name='Pfad 113' d='M3.771-.028,52.794-.386a3.705,3.705,0,0,1,3.743,3.743,3.838,3.838,0,0,1-3.8,3.8L3.716,7.515A3.705,3.705,0,0,1-.028,3.771,3.838,3.838,0,0,1,3.771-.028Z' transform='translate(360 78.959) rotate(-45)' fill='%23DC042E'/%3E%3C/g%3E%3C/svg%3E%0A"); height: 30px; position: absolute; right: calc(20vw - 75px); margin-top: 20px; cursor: pointer; } @media (max-width: 1750px) { #popup .close { right: calc(20vw - 50px); } } #popup .formbody { display: grid; grid-template-columns: 50% 50%; gap: 15px; } #popup .widget-text, #popup .widget-password { display: flex; flex-direction: column; padding-bottom: 25px; } #popup .widget-explanation { grid-column: 1 / 3; } #popup .widget-explanation p { font-size: 14px; margin-top: 0; margin-bottom: 0; text-align: right; } #popup label{ padding-bottom: 10px; font-family: 'Motiva Sans Black'; font-size: 20px; } #popup input[type="text"], #popup input[type="tel"], #popup input[type="email"], #popup textarea, #popup input[type="file"] { background-color: #EBEBEC; outline-color: transparent; border: 0px solid transparent; border-radius: 10px; padding: 10px; } #popup textarea { width: calc(100% - 20px); } #popup .widget-upload { display: flex; flex-direction: column; justify-content: flex-end; margin-bottom: 4px; } #popup .widget-upload input[type="file"] { height: 80px; } #popup .widget-checkbox { grid-column: 1 / 3; } #popup .widget-checkbox fieldset { padding: 0; margin: 0; border: 0px solid transparent; } #popup .widget_odd.widget-checkbox input[type=checkbox] { width: 30px; height: 30px; background-color: #fff; padding: 3px; margin: 0; } #popup .widget input[type='checkbox']:checked, #popup .widget input[type='checkbox']:not(:checked) { background: transparent; position: relative; visibility: hidden; margin:0; padding:0; } #popup .widget input[type='checkbox'] + label { cursor: pointer; font-size: 16px; } #popup .widget input[type='checkbox']:checked + label::before, #popup .widget input[type='checkbox']:not(:checked) + label::before { content:' '; display: inline-block; width: 20px; height: 20px; position: relative; top: 2px; border-radius: 42px; border: 2px solid #DC042E; background: white; margin-right: 5px; box-shadow: inset 0 1px 1px 0 rgba(0,0,0,.1); } #popup .widget input[type='checkbox']:hover + label::before { background: #e93357; box-shadow: inset 0 0 0 2px white; } #popup .widget input[type='checkbox']:checked + label::before { background:#DC042E; box-shadow: inset 0 0 0 2px white; } #popup .widget-submit { padding: 10px 30px; padding-right: 20px; color: #fff; background-color: #DC042E; border-radius: 7px; width: max-content; } #popup .submit { color: #fff; font-family: 'Motiva Sans Black', sans-serif; background-color: transparent; border-color: transparent; font-weight: bold; text-transform: uppercase; background-repeat: no-repeat; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='37.474' height='30' viewBox='0 0 37.474 30'%3E%3Cg id='Komponente_32_41' data-name='Komponente 32 – 41' transform='translate(0 30) rotate(-90)'%3E%3Cg id='Gruppe_140' data-name='Gruppe 140'%3E%3Crect id='Rechteck_68' data-name='Rechteck 68' width='3.561' height='33.602' transform='translate(13.225)' fill='%23ebebec'/%3E%3Cpath id='Pfad_236' data-name='Pfad 236' d='M15,24.392,2.692,11.511,0,13.944,15,29.63,30,13.944l-2.692-2.434Z' transform='translate(0 7.843)' fill='%23ebebec'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A"); background-position: right; background-size: contain; padding-right: 30px; } @media (max-width: 750px){ .headerbild-big.bild-text-big p { top: 30%; } .headerbild-big.bild-text-big p:after{ width: 80px; height: 80px; right: 0px; top: -65px; } } @media (max-width: 450px){ .headerbild-big.bild-text-big p { padding-right: 5%; } } #article-1 { margin-top: 6rem; } #main #article-125 { margin-left: 0; margin-right: 0; width: 100%; margin-bottom: 0; } .farbige_leistung { display: flex; flex-wrap: wrap; } .farbige_leistung p { font-family: 'Motiva Sans Black', sans-serif; background-color: #1d2536; color: #fff; width: max-content; padding: 10px; margin-bottom: 0px !important; margin-top: 20px !important; padding-bottom: 5px; margin-right: 10px; } .farbige_leistung p a { color: #fff; } .ce_slick-slider .slick-slide { margin-right: 30px; } #main>.inside>.mod_article.kunden { margin-left: 0; margin-right: 0; width: 100%; margin-bottom: 3rem; margin-top: 6rem; } .kunden .text-bild { margin-left: 10%; margin-right: 10%; } .kunden .blauerkasten { margin-top: -250px; padding: 200px 10%; } .ce_slick-slider { margin-top: 25px; } .ce_slick-slider .slick-dots { display: flex; flex-direction: row; list-style-type: none; margin-left: 150px; padding-left: 0; width: 100%; margin-top: 50px; gap: 10px; } .ce_slick-slider .slick-dots li { border-bottom: 4px solid #fff; cursor: pointer; width: calc((25% - 100px) / 4); height: 4px; border-radius: 2px; } .ce_slick-slider .slick-dots li.slick-active { border-bottom: 4px solid #dc042e; height: 4px; width: calc((25% - 100px) / 4); } .ce_slick-slider .slick-dots li button { display: none; } .own_slider { display: flex; height: calc(100vh - 90px); } .own_slider .slidetext { width: calc(25vw - 50px); padding: 25px; padding-bottom: 100px; cursor: pointer; } .own_slider .slidetext.active { opacity: 1; background-color: transparent; } .own_slider .slidetext:nth-child(1) { background-image: url('/files/web/startseite/2023_hofer-werbung_images_leistungen-webseiten-onlineshops-hand-laptop-code_305-ffk00307_blau-web.jpg'); background-repeat: no-repeat; background-size: cover; } .own_slider .slidetext:nth-child(2) { background-image: url('/files/web/startseite/2023_hofer-werbung_images_leistungen-druckprodukte-hand-fadenzähler-farbpalette_352-ffk00354_blau-web.jpg'); background-repeat: no-repeat; background-size: cover; } .own_slider .slidetext:nth-child(3) { background-image: url('/files/web/startseite/2023_hofer-werbung_images_leistungen-markenentwicklung-hand-logo-entwurf_330-ffk00332_blau-web.jpg'); background-repeat: no-repeat; background-size: cover; } .own_slider .slidetext:nth-child(4) { background-image: url('/files/web/startseite/2023_hofer-werbung_images_leistungen-social-media-unterstützung-hand-handy-feed_321-ffk00323_blau-web.jpg'); background-repeat: no-repeat; background-size: cover; } .own_slider .slidetext p:nth-child(1) img { height: 180px; } .own_slider .slidetext .slide-overlay { background-color:#1D2536; opacity: 0.9; position: absolute; width: 25%; height: calc(100vh - 90px); margin-left: -25px; margin-top: -25px; } .own_slider .slidetext.active .slide-overlay { display: none; } .own_slider .slidetext .slide-inner { height: 100%; display: flex; flex-direction: column; padding-bottom: 100px; } .own_slider .slidetext h3 { color: #EBEBEC; height: 150px; font-size: 35px; line-height: 50px; word-wrap: break-word; } .own_slider .slidetext p { color: #EBEBEC; display: flex; } .own_slider .slidetext.active p { font-family: 'Motiva Sans', sans-serif; } .own_slider .slidetext p.redbutton { margin-top: auto; } .own_slider .slidetext hr { height: 4px; background: #EBEBEC; border-radius: 2px; margin-top: -40px; position: absolute; width: calc(25% - 50px); } .own_slider .slidetext.active hr { background: #DC042E; } /*Kontakt*/ #kontakt>div { display: flex; flex-flow: wrap; } #kontakt>div>div { flex-basis: 33.333%; display: flex; align-items: center; justify-content: center; min-height: 300px; } #kontakt>div>div p { text-align: center; } #kontakt>div>div>div { padding: 0 15px; } #kontakt>div>div a{ color: #0c1b26; } #kontakt>div>div p strong { font-size: 2em; line-height: 1.25em; font-weight: 200; text-transform: uppercase; display: block; } @media (max-width: 1150px) { #kontakt>div>div p strong { font-size: 30px; } #kontakt>div>div { min-height: 225px; } } @media (max-width: 950px) { #kontakt>div>div { flex-basis: 50%; } #kontakt>div>div:first-child { flex-basis: 100%; } #kontakt .bg-hellgrau { background-color: #DC042E; } #kontakt .bg-hellgrau strong { color: #fff; } .footer-social a { background-image: url("data:image/svg+xml,%3Csvg id='Gruppe_1790' data-name='Gruppe 1790' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='27.778' height='27.778' viewBox='0 0 27.778 27.778'%3E%3Cdefs%3E%3CclipPath id='clip-path'%3E%3Crect id='Rechteck_191' data-name='Rechteck 191' width='27.778' height='27.778' fill='%23ebebec'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg id='Gruppe_1789' data-name='Gruppe 1789' clip-path='url(%23clip-path)'%3E%3Cpath id='Pfad_4141' data-name='Pfad 4141' d='M13.888,2.5c3.708,0,4.148.014,5.612.081a7.684,7.684,0,0,1,2.579.478,4.3,4.3,0,0,1,1.6,1.039,4.3,4.3,0,0,1,1.039,1.6,7.685,7.685,0,0,1,.478,2.579c.067,1.465.081,1.9.081,5.612s-.014,4.148-.081,5.612a7.685,7.685,0,0,1-.478,2.579,4.6,4.6,0,0,1-2.636,2.636,7.684,7.684,0,0,1-2.579.478c-1.464.067-1.9.081-5.612.081s-4.148-.014-5.612-.081A7.685,7.685,0,0,1,5.7,24.716a4.3,4.3,0,0,1-1.6-1.039,4.3,4.3,0,0,1-1.039-1.6A7.686,7.686,0,0,1,2.582,19.5c-.067-1.465-.081-1.9-.081-5.612s.014-4.148.081-5.612A7.686,7.686,0,0,1,3.061,5.7,4.3,4.3,0,0,1,4.1,4.1,4.3,4.3,0,0,1,5.7,3.062a7.685,7.685,0,0,1,2.579-.478c1.465-.067,1.9-.081,5.612-.081m0-2.5C10.116,0,9.643.016,8.162.084A10.2,10.2,0,0,0,4.79.729a6.808,6.808,0,0,0-2.46,1.6,6.808,6.808,0,0,0-1.6,2.46A10.194,10.194,0,0,0,.083,8.163C.015,9.644,0,10.117,0,13.889s.016,4.245.084,5.726a10.194,10.194,0,0,0,.646,3.371,6.808,6.808,0,0,0,1.6,2.46,6.808,6.808,0,0,0,2.46,1.6,10.2,10.2,0,0,0,3.371.646c1.481.068,1.954.084,5.726.084s4.245-.016,5.726-.084a10.2,10.2,0,0,0,3.371-.646,7.1,7.1,0,0,0,4.062-4.062,10.194,10.194,0,0,0,.646-3.371c.068-1.481.084-1.954.084-5.726s-.016-4.245-.084-5.726a10.194,10.194,0,0,0-.646-3.371,6.809,6.809,0,0,0-1.6-2.46,6.809,6.809,0,0,0-2.46-1.6A10.2,10.2,0,0,0,19.614.084C18.133.016,17.66,0,13.888,0' transform='translate(0.001 0)' fill='%23ebebec'/%3E%3Cpath id='Pfad_4142' data-name='Pfad 4142' d='M129.687,122.556a7.132,7.132,0,1,0,7.132,7.132,7.132,7.132,0,0,0-7.132-7.132m0,11.762a4.63,4.63,0,1,1,4.63-4.63,4.63,4.63,0,0,1-4.63,4.63' transform='translate(-115.798 -115.799)' fill='%23ebebec'/%3E%3Cpath id='Pfad_4143' data-name='Pfad 4143' d='M359.5,88.882a1.667,1.667,0,1,1-1.667-1.667,1.667,1.667,0,0,1,1.667,1.667' transform='translate(-336.53 -82.407)' fill='%23ebebec'/%3E%3C/g%3E%3C/svg%3E%0A") !important; } .footer-social a:nth-child(4) { background-image: url("data:image/svg+xml,%3Csvg id='Gruppe_1792' data-name='Gruppe 1792' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='27.778' height='27.609' viewBox='0 0 27.778 27.609'%3E%3Cdefs%3E%3CclipPath id='clip-path'%3E%3Crect id='Rechteck_192' data-name='Rechteck 192' width='27.778' height='27.609' fill='%23ebebec'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg id='Gruppe_1791' data-name='Gruppe 1791' transform='translate(0 0)' clip-path='url(%23clip-path)'%3E%3Cpath id='Pfad_4144' data-name='Pfad 4144' d='M27.778,13.891a13.889,13.889,0,1,0-16.059,13.72V17.906H8.192V13.891h3.526v-3.06c0-3.481,2.074-5.4,5.246-5.4a21.358,21.358,0,0,1,3.109.271V9.117H18.322a2.007,2.007,0,0,0-2.263,2.169v2.605h3.852L19.3,17.906H16.059v9.705a13.892,13.892,0,0,0,11.719-13.72' transform='translate(0 -0.002)' fill='%23ebebec'/%3E%3C/g%3E%3C/svg%3E%0A") !important; } .footer-social a:last-child { background-image: url("data:image/svg+xml,%3Csvg id='Gruppe_1788' data-name='Gruppe 1788' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='27.778' height='27.781' viewBox='0 0 27.778 27.781'%3E%3Cdefs%3E%3CclipPath id='clip-path'%3E%3Crect id='Rechteck_190' data-name='Rechteck 190' width='27.778' height='27.781' fill='%23ebebec'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg id='Gruppe_1787' data-name='Gruppe 1787' clip-path='url(%23clip-path)'%3E%3Cpath id='Pfad_4140' data-name='Pfad 4140' d='M25.412,27.781H2.392a.434.434,0,0,0-.071-.025A2.8,2.8,0,0,1,0,25Q0,13.9,0,2.8a2.839,2.839,0,0,1,.022-.345A2.787,2.787,0,0,1,2.8,0H24.972a2.449,2.449,0,0,1,.371.023,2.75,2.75,0,0,1,2.33,1.96c.045.132.071.271.105.408V25.414a.455.455,0,0,0-.026.069,2.762,2.762,0,0,1-1.875,2.169c-.151.055-.31.086-.465.128M15.279,23.61v-.177q0-3.543,0-7.086a2.14,2.14,0,0,1,.212-.969,2.1,2.1,0,0,1,2.35-1.15,2.152,2.152,0,0,1,1.617,2.055q0,3.575,0,7.151v.175h4.156v-.144q0-3.923,0-7.845a3.486,3.486,0,0,0-.032-.487,4.857,4.857,0,0,0-2.249-3.521,4.3,4.3,0,0,0-2.854-.743,4.35,4.35,0,0,0-3.13,1.833c-.016.021-.035.04-.07.08V11.13H11.129V23.61ZM8.326,11.132H4.185V23.61H8.326Zm.423-4.879a2.5,2.5,0,1,0-2.482,2.5,2.484,2.484,0,0,0,2.482-2.5' transform='translate(0 0)' fill='%23ebebec'/%3E%3C/g%3E%3C/svg%3E%0A") !important; } #kontakt .bg-grau { background-color:#fbfbfb; } #kontakt .bg-rot { background-color: #DFDFDF; } #kontakt .bg-rot p, #kontakt .bg-rot strong, #kontakt .bg-rot a { background-color: transparent; color: #1D2536 !important; } } @media (max-width: 650px) { #kontakt>div>div { flex-basis: 100%; } #kontakt>div>div { min-height: 200px; } } /*Firmen*/ #job hr, #jobs hr, #arbeiten hr, .simple-text hr { margin-left: 15%; margin-right: 15%; margin-bottom: 0.5rem; } .uebersicht .ce_text, #jobs .ce_text { text-align: center; margin: auto; margin-bottom: 2rem; } #jobs .ce_gallery ul, #arbeiten .ce_gallery ul { display: flex; flex-flow: wrap; justify-content: center; } #firmen .ce_gallery ul li, #jobs .ce_gallery ul li, #arbeiten .ce_gallery ul li { display: flex; justify-content: center; } #jobs .ce_gallery ul li figure { margin: 5px; width: 220px; height: 150px; text-align: center; } #jobs { padding-top: 25px; } #arbeiten .ce_gallery ul li figure { margin: 5px; width: 220px; height: 150px; text-align: center; box-sizing: border-box; } #firmen .ce_gallery ul li figure a, #jobs .ce_gallery ul li figure a, #arbeiten .ce_gallery ul li figure a { display: flex; height: 100%; width: 100%; justify-content: center; align-items: center; } #jobs .ce_gallery ul li img, #arbeiten .ce_gallery ul li img { max-height: 80%; max-width: 80%; display: block; width: auto; } #jobs .redbutton { cursor: pointer; font-family: 'Motiva Sans Black', sans-serif; } #firmen { background-color: #fff; margin-bottom: 0 !important; padding-bottom: 0rem; margin-left: 0 !important; margin-right: 0 !important; padding-left: 10%; padding-right: 10%; padding-top: 25px; } #firmen .text-bild { display: grid; grid-template-columns: 40% 60%; } #firmen .ce_text { text-align: left; margin-bottom: 0; } #firmen .ce_gallery { margin-left: 50px; } #firmen .ce_gallery ul { display: grid; grid-template-columns: repeat(2,1fr); } #firmen .ce_gallery ul li img{ max-height: 100%; max-width: 100%; display: block; width: auto; margin-right: auto; object-fit: contain; } #firmen .ce_gallery ul li figure { margin: 5px; max-width: 220px; height: 150px; text-align: center; } #firmen .pfeil { margin-top: 40px; } #article-25 .text-bild { display: grid; grid-template-columns: 40% 60%; } #article-25 .text-bild div { margin-bottom: 0; } #article-25 .text-bild figure { text-align: center; margin-top: 3rem; margin-left: 3rem; width: auto; height: calc(100% - 3.5rem); } #article-25 .text-bild figure img { object-fit: cover; } #article-25 .gallerie { margin-left: 0; margin-right: 0; } .team_ueberschrift { margin-left: 10%; margin-right: 10%; } #main #jobs { background-color: #fff; margin-left: 0%; margin-right: 0%; padding-left: 10%; padding-right: 10%; margin-bottom: 0; padding-bottom: 6rem; } #jobs .ce_text.text-icon { text-align: left; } #jobs .ce_text:not(.text-icon) { display: flex; flex-direction: column; justify-content: center; margin-bottom: auto; } #jobs .ce_text:not(.text-icon) p { margin-left: auto; } .text-beratung { background-color: #fbfbfb; padding: 50px 10%; } .text-beratung p:nth-child(3) { width: 50%; } @media (max-width: 600px) { #firmen .ce_gallery ul li figure, #jobs .ce_gallery ul li figure, #arbeiten .ce_gallery ul li figure { width: 130px !important; height: 130px !important; } } /*Hauptteil*/ .startseite #main{ margin-top: 0; } #main>.inside>.mod_article, .space, #firmen { margin-left: 10%; margin-right: 10%; width: 80%; } #slider_home { display: none; } .space-top { margin-top: 6rem; } #main>.inside>.mod_article { margin-bottom: 6rem; } .text-icon figure { width: 290px; text-align: center; } .text-icon img { max-height: 130px; object-fit: contain; } .text-icon p { margin-top: 0; } .text-bild .text-icon p { margin-top: 25px; } .text-bild .text-icon .redbutton { margin-top: 50px; } .text-bild .zitat { background-image: url('/files/web/startseite/hofer_sprechblase_hellgrau.png'); background-repeat: no-repeat; position: absolute; right: -15%; background-size: contain; height: 100vh; width: 50vw; margin-top: -200px; display: flex; flex-direction: column; justify-content: center; } .text-bild .zitat p, .text-bild .zitat h6 { text-align: center; padding-right: 20%; font-size: 20px; } .text-bild .zitat h6 { font-size: 14px; } .text-kacheln .leistungs-kacheln { float: left; margin-right: 6rem; } .text-kacheln h2, .text-kacheln h1 { margin-top: 5px; margin-bottom: 2rem; } .text-kacheln p { margin-top: 0; } .beschreibung_leistung { margin: 50px 10%; } @media (max-width: 750px) { .text-icon figure { float: none; margin: auto; } .text-icon img { max-height: 95px; } } /*Leistungen*/ .leistungs-kacheln { max-width: 490px; } .leistungs-kacheln ul li figure figcaption{ visibility: hidden; position: absolute; background-color: #fff; border: 1px solid #e8e8e8; margin-left: 122px; margin-top: -35px; padding-top: 4px; padding-left: 4px; padding-right: 4px; z-index: 9999; } .leistungs-kacheln ul li figure:hover figcaption{ visibility: visible; } @media (max-width: 950px) { .leistungs-kacheln ul li figure figcaption{ display: none; } } .leistungs-kacheln ul { display: flex; flex-flow: wrap; justify-content: center; padding: 0; margin: 0; } .leistungs-kacheln ul li { display: flex; justify-content: center; } .zeit-kacheln ul li:last-child{ visibility: hidden; } .leistungs-kacheln ul li figure, .zeit-kacheln li button { border: 1px solid black; margin: 5px; width: 150px; height: 150px; display: flex; text-align: center; justify-content: center; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; } .zeit-kacheln li button { align-items: center; } .leistungs-kacheln ul li figure a, .zeit-kacheln a { display: flex; height: 100%; width: 100%; align-items: center; justify-content: center; position: relative; } .leistungs-kacheln ul li img { max-height: 100%; object-fit: contain; display: block; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; } .leistungs-kacheln ul li img, .leistungs-kacheln ul li figure a:before { max-width: 105px; } .leistungs-kacheln.one ul li:nth-child(1) figure, .leistungs-kacheln.second ul li:nth-child(2) figure, .leistungs-kacheln.third ul li:nth-child(3) figure, .leistungs-kacheln.fourth ul li:nth-child(4) figure, .leistungs-kacheln.fifth ul li:nth-child(5) figure, .leistungs-kacheln.sixth ul li:nth-child(6) figure, .zeit-kacheln ul li .active { background-color: #dc042e; border-color: #dc042e; } .leistungs-kacheln ul li figure:hover { background-color: #dc042e; border-color: #dc042e; } .leistungs-kacheln ul li figure:hover img { opacity: 0; } .leistungs-kacheln ul li figure a:before { background-size: contain; background-repeat: no-repeat; background-position: center center; height: 100%; position: absolute; width: 105px; content: ""; opacity: 0; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; } .leistungs-kacheln ul li figure:hover a:before { opacity: 1; } .leistungs-kacheln ul li:nth-child(1) figure a:before { background-image: url('/files/web/leistungen/icons-weiß/icon-weiss-marketing.png'); } .leistungs-kacheln ul li:nth-child(2) figure a:before { background-image: url('/files/web/leistungen/icons-weiß/icon-weiss-webdesign.png'); } .leistungs-kacheln ul li:nth-child(3) figure a:before { background-image: url('/files/web/leistungen/icons-weiß/icon-weiss-corporate.png'); } .leistungs-kacheln ul li:nth-child(4) figure a:before { background-image: url('/files/web/leistungen/icons-weiß/icon-weiss-suchmaschinenoptimierung.png'); } .leistungs-kacheln ul li:nth-child(5) figure a:before { background-image: url('/files/web/leistungen/icons-weiß/icon-weiss-fotografie.png'); } .leistungs-kacheln ul li:nth-child(6) figure a:before { background-image: url('/files/web/leistungen/icons-weiß/icon-weiss-workshop.png'); } @media (max-width: 1280px) { .text-kacheln .leistungs-kacheln { margin-right: 2rem; } } @media (max-width: 950px) { .text-kacheln .leistungs-kacheln { float: none; margin: auto; margin-bottom: 2rem; } .leistungs-kacheln ul li figure, .zeit-kacheln li button { width: 115px; height: 115px; } .leistungs-kacheln ul li img, .leistungs-kacheln ul li figure a:before{ max-height: 100px; max-width: 100px; } } .rsts-skin-default .rsts-nav { position: absolute; text-align: left; margin-left: 10%; left: 0; top: 80vh; height: max-content; margin-bottom: 15px; } .rsts-slides .leistung.webseite { background-image: url('/files/web/leistungen/2023_hofer-werbung_images_leistungen-webseiten-onlineshops-hand-laptop-code_305-ffk00307-web.jpg'); background-repeat: no-repeat; background-size: cover; background-position: center; height: 100vh; } .rsts-slides .leistung.print { background-image: url('/files/web/leistungen/2023_hofer-werbung_images_leistungen-druckprodukte-hand-fadenzähler-farbpalette_352-ffk00354-web.jpg'); background-repeat: no-repeat; background-size: cover; background-position: center; height: 100vh; } .rsts-slides .leistung.markenentwicklung { background-image: url('/files/web/leistungen/2023_hofer-werbung_images_leistungen-markenentwicklung-hand-logo-entwurf_330-ffk00332-web.jpg'); background-repeat: no-repeat; background-size: cover; background-position: center; height: 100vh; } .rsts-slides .leistung.socialmedia { background-image: url('/files/web/leistungen/2023_hofer-werbung_images_leistungen-social-media-unterstützung-hand-handy-feed_321-ffk00323-web.jpg'); background-repeat: no-repeat; background-size: cover; background-position: center; height: 100vh; } .rsts-slides .leistung .ce_headline { padding: 50px 10%; color: #EBEBEC; height: 30vh; margin: 0; font-size: 85px; display: flex; flex-direction: column; justify-content: flex-end; position: absolute; font-size: 45px; padding: 40px 10%; width: 100%; word-wrap: break-word; } .rsts-slides .leistung .ce_image { position: absolute; width: auto; right: 15%; height: 33vh; aspect-ratio: 1; top: 10vh; } .rsts-slides .leistung .ce_image figure, .rsts-slides .leistung .ce_image img { width: auto; height: 100%; } .rsts-slides .leistung .ce_text { padding: 50px 10%; background-color: rgba(29 37 54 / 90%); height: 100vh; display: flex; flex-direction: column; padding-top: calc(33vh + 50px); } .rsts-slides .leistung .ce_text p:not(:last-child) { width: 60%; } .rsts-slides .leistung .redbutton { margin-top: auto; margin-bottom: 20px; } .rsts-slides .leistung p { color: #EBEBEC; } .rsts-slides .gallerie { margin: 25px 10%; } .rsts-skin-default .rsts-nav-bullets.rsts-nav ul li a { height: 4px; width: calc((25% - 100px) / 4); border-radius: 2px; background-color: #EBEBEC; border-color: transparent; box-shadow: none; -webkit-box-shadow: none; } .rsts-skin-default .rsts-nav-bullets.rsts-nav ul li a.active, .rsts-skin-default .rsts-nav-bullets.rsts-nav ul li a:hover { background-color: #DC042E; } #article-124 { margin-top: 100px; } #article-124 .auflistung { position: absolute; display: grid; grid-template-columns: 15vw 15vw; grid-column-gap: 30px; width: 30vw; right: 0; margin-top: 50px; } #article-124 .auflistung h2 { list-style: none; vertical-align: middle; font-size: 1em; margin: 0; cursor: pointer; display: flex; flex-direction: column; text-transform: uppercase; word-break: break-word; } #article-124 .auflistung h2:nth-child(2):before { background-image: url(/files/web/leistungen/2023_hofer-werbung_icons_neu_leistungen_webseiten-onlineshops.png); object-fit: scale-down; content: ''; height: 100px; background-repeat: no-repeat; background-size: contain; } #article-124 .auflistung h2:nth-child(3):before { background-image: url(/files/web/leistungen/2023_hofer-werbung_icons_neu_leistungen_printprodukte.png); object-fit: scale-down; content: ''; height: 100px; background-repeat: no-repeat; background-size: contain; } #article-124 .auflistung h2:nth-child(1):before { background-image: url(/files/web/leistungen/2023_hofer-werbung_icons_neu_leistungen_markenentwicklung.png); object-fit: scale-down; content: ''; height: 100px; background-repeat: no-repeat; background-size: contain; } #article-124 .auflistung h2:nth-child(4):before { background-image: url(/files/web/leistungen/2023_hofer-werbung_icons_neu_leistungen_social-media-unterstützung.png); object-fit: scale-down; content: ''; height: 100px; background-repeat: no-repeat; background-size: contain; } /*Startseite*/ .text-bild { display: grid; grid-template-columns: repeat(2,1fr); } .text-bild>div { flex-basis: 50%; margin-bottom: 2rem; } .full-text .text-bild > div { flex-basis: 100%; } .text-bild p { margin-top: 0; margin-bottom: 0; } .text-bild figure { margin-left: 1rem; margin-top: 2rem; } .text-bild img { max-width: 750px; width: 100%; margin-left: auto; display: block; } @media (max-width: 750px) { .text-bild>div { flex-basis: 100%; } .text-bild figure { margin: 0; } .text-bild h2{ margin-bottom: 2rem; } h2 { margin-top: 5px; } } #main #article-23 { margin-left: 0; margin-right: 0; width: 100%; } .blauerkasten { padding: 100px 10%; background-color: #1d2536; } .blauerkasten h2, .blauerkasten p { color: #fff; } .redbutton { margin-top: 50px; padding: 10px 30px; padding-right: 20px; color: #fff; background-color: #DC042E; border-radius: 7px; width: max-content; } .redbutton a { color: #fff; font-family: 'Motiva Sans Black', sans-serif; text-transform: uppercase; background-repeat: no-repeat; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='37.474' height='30' viewBox='0 0 37.474 30'%3E%3Cg id='Komponente_32_41' data-name='Komponente 32 – 41' transform='translate(0 30) rotate(-90)'%3E%3Cg id='Gruppe_140' data-name='Gruppe 140'%3E%3Crect id='Rechteck_68' data-name='Rechteck 68' width='3.561' height='33.602' transform='translate(13.225)' fill='%23ebebec'/%3E%3Cpath id='Pfad_236' data-name='Pfad 236' d='M15,24.392,2.692,11.511,0,13.944,15,29.63,30,13.944l-2.692-2.434Z' transform='translate(0 7.843)' fill='%23ebebec'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A"); background-position: right; background-size: contain; padding-right: 35px; } .blauerkasten .redbutton { margin-bottom: 50px; } .leistungen_reihe { padding: 20px 10%; display: grid; grid-template-columns: repeat(5, 1fr); grid-gap: 20px; margin-top: -100px; } .leistungen_reihe .ce_text { padding: 20px; display: flex; flex-direction: column; box-shadow: -4px 4px 4px rgb(0 0 0 / 16%); background-color: #fff; border: 1px solid #EBEBEC; } .leistungen_reihe .ce_text h2 { font-size: 1.5em; text-align: center; line-height: 1; margin: auto 0; padding: 20px 0; } .leistungen_reihe .ce_text p { margin-top: auto; } .leistungen_reihe .ce_text figure { margin-left: auto; width: max-content; margin-right: auto; margin-bottom: 25px; } .kunden .text-bild div:nth-child(2):not(.farbige_leistung):not(.pfeil_zurueck) { position: absolute; right: -2rem; top: -14rem; height: 100vh; } .kunden .text-bild div:nth-child(2) img { height: 100vh; max-width: 50vw; object-fit: contain; } .kunden .text-bild table, .kunden .text-bild table tbody, .kunden .text-bild table td { border: none; } .gallerie ul { display: flex; flex-flow: wrap; justify-content: center; } .gallerie ul li { display: flex; justify-content: center; max-height: 500px; margin-bottom: 2rem; } .gallerie ul li:nth-of-type(4n+1) { width: 25%; } .gallerie ul li:nth-of-type(4n+1).row_last.col_last { width: 50%; } .gallerie ul li:nth-of-type(4n+2) { width: 75%; } .gallerie ul li:nth-of-type(4n+3) { width: 50%; } .gallerie ul li:nth-of-type(4n+4) { width: 50%; } .gallerie ul li:nth-of-type(4n+1) figure, .gallerie ul li:nth-of-type(4n+3) figure { margin-right: 1rem; margin-left: 0; } .gallerie ul li:nth-of-type(4n+2) figure, .gallerie ul li:nth-of-type(4n+4) figure { margin-left: 1rem; margin-right: 0; } .gallerie ul li figure { text-align: center; width: 100%; } .gallerie ul li img { width: 100%; object-fit: cover; margin: auto; display: block; height: 100%; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; } .gallerie ul li img:not(:nth-child(1)):not(:nth-child(2)) { aspect-ratio: 4 / 3; } #article-25 .text-bild figure img { width: 100%; object-fit: cover; display: block; height: 100%; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; } .gallerie ul li img, #article-25 .text-bild figure img { filter: grayscale(100%); -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); -webkit-filter: grayscale(1); } .gallerie ul li img:hover, #article-25 .text-bild figure img:hover { filter: none; -webkit-filter: none; -moz-filter: none; -ms-filter: none; -o-filter: none; } .kontakt_slider { position: fixed; right: 0; bottom: 100px; z-index: 100; margin-right: calc(-50vw - 80px); } .kontakt_slider .ce_text { padding: 10px 20px; background-color: #1D2536; margin-right: -60px; width: 80px; height: 170px; display: flex; font-family: 'Motiva Sans Black', sans-serif; flex-direction: column; justify-content: center; } .kontakt_slider .kontakt_ueberschrift p { rotate: 270deg; margin-left: -33px; width: max-content; } .kontakt_slider .ce_text p { color: #EBEBEC; } .kontakt_slider { display: flex; } .kontakt_slider:hover { display: flex; animation: slider 1s ease 0s 1 normal forwards; -webkit-animation: slider 1s ease 0s 1 normal forwards; -moz-animation: slider 1s ease 0s 1 normal forwards; } @keyframes slider { 0% { margin-right: calc(-50vw - 80px); } 100% { margin-right: 0; } } @-webkit-keyframes slider { 0% { margin-right: calc(-50vw - 80px); } 100% { margin-right: 0; } } @-moz-keyframes slider { 0% { margin-right: calc(-50vw - 80px); } 100% { margin-right: 0; } } .kontakt_slider .kontakt_text_slider { display: flex; } .kontakt_slider .kontakt_text_slider .ce_text { color: #1D2536; background-color: #EBEBEC; margin-right: 0; width: 25vw; text-align: center; display: flex; flex-direction: column; justify-content: center; border-color: #EBEBEC; } .kontakt_text_slider .ce_text:nth-child(2) { background-color: #DFDFDF; } .kontakt_text_slider .ce_text strong{ font-family: 'Motiva Sans Black'; font-size: 2em; line-height: 1.25em; font-weight: 200; text-transform: uppercase; display: block; } .kontakt_text_slider .ce_text a { color: #0c1b26; font-family: 'Motiva Sans', sans-serif; } @media (max-width: 750px) { .gallerie { margin-top: 1rem; margin-bottom: 2rem; } .gallerie ul li { margin-bottom: 1rem; } .gallerie ul li:nth-of-type(4n+2) figure, .gallerie ul li:nth-of-type(4n+4) figure { margin-left: 0.5rem; } .gallerie ul li:nth-of-type(4n+1) figure, .gallerie ul li:nth-of-type(4n+3) figure { margin-right: 0.5rem; } } /*Leistung Seiten*/ .text-kacheln-klein .leistungs-kacheln { max-width: 370px; } .text-kacheln-klein a{ color: #be0a30; } .list { padding: 2rem; } .list ul:first-child { float: left; margin-right: 10rem; } @media (max-width: 1600px) { .list ul:first-child { margin-right: 0rem; float: none; } } @media (max-width: 1350px) { .text-bild .zitat { width: 60vw; right: 0; } #article-124 .auflistung { width: 43vw; grid-template-columns: 21vw 21vw; } #article-1 { grid-template-columns: 60% 40%; } .text-bild .zitat p, .text-bild .zitat h6 { padding-left: 20%; padding-right: 0; } } @media (max-width: 550px) { .list { padding: 1rem; } .list ul { padding-left: 15px; } .list ul:first-child { margin-right: 0rem; float: none; } } /*großes Bild in Main*/ .bild-text-big { margin: 0 !important; width: 100% !important; position: relative; } .bild-text-big>div { margin-bottom: 6rem; } .bild-text-big img { height: 100vh; width: 100%; object-fit: cover; display: block; } .bild-text-big .ce_text p { position: absolute; top: 30%; color: #fff; font-size: 75px; left: 7%; margin: 0; line-height: 105px; text-align: left !important; } .bild-text-big .ce_text p strong{ color: #fff; background-color: #dc042e; padding: 10px 20px; text-align: left !important; } @media (max-width: 1100px) { .bild-text-big p { font-size: 50px; line-height: 85px; } } @media (max-width: 750px) { .bild-text-big img { height: 50vh; } .bild-text-big p { font-size: 22px; line-height: 45px; top: 20%; max-width: 80%; } } @media (max-width: 350px) { .bild-text-big img { height: 35vh; } .bild-text-big p { font-size: 20px; } } /*Text*/ .simple-text h2 { text-align: center; margin-top: 0; } .simple-text>div { max-width: 1300px; margin: auto; text-align: center; } /*zeit-kacheln*/ .zeit-kacheln ul li button { color: #fff; font-family: 'Motiva Sans Black', sans-serif; font-size: 35px; border: none; background-color: #1D2536; cursor: pointer; } .zeit-kacheln ul li button:hover { background-color: #dc042e; border-color: #dc042e; } /*Mission*/ .historie { background-color: #fff; } #mission { position: relative; padding-top: 150px; margin-left: 0 !important; margin-right: 0 !important; padding-left: 10%; padding-right: 10%; width: 80% !important; } #mission .ce_text p { margin-bottom: 20px; } #mission .werte { grid-column: 1 / 3; margin-left: -10vw; margin-right: -10vw; background-image: url('/files/web/historie/2025_hw_images_auge-geometrie-verlauf_adobestock-970565998_erweitert_cmyk_ultra.jpg'); background-repeat: no-repeat; background-size: cover; padding: 300px 10%; margin-top: 50px; margin-bottom: 0; } #mission .werte div { width: 50%; } #mission .werte div h3 { color: #fff; margin-top: 0; } #mission .werte div h3:first-child { margin-bottom: 10px; } #mission .werte div p { color: #fff; } #mission .werte_grid { display: grid; grid-template-columns: repeat(2,1fr); grid-column-gap: 30px; grid-row-gap: 20px; grid-column: 1 / 3; margin-top: 100px; margin-bottom: 100px; } #mission .pfeil { grid-column: 1 / 3; } .history { margin-top: 75px; position: relative; } .history #zeitstrahl img { position: absolute; width: 50px; left: calc(50% - 25px); top: 150px; } .history .text_odd.first { height: 550px; } .history .text_odd { width: calc(40vw - 100px); float: left; padding-right: 75px; height: 870px; } .history .text_odd:not(.first) h1, .history .text_odd:not(.first) h2 { text-align: right; } .history .text_odd:not(.first) h1 { display: flex; justify-content: flex-end; } .history .text_odd:not(.first) h1::after { content: '•••••••••••'; color: #DC042E; font-size: 25px; margin-right: -80px; align-self: center; } .history .text_even.first { margin-top: 100px; } .history .text_even { width: calc(40vw - 100px); float: right; margin: 0; padding-left: 75px; height: 870px; } .history .text_even.last { height: 550px; } .history .text_even h1 { display: flex; } .history .text_even h1::before { content: '••••••••••'; color: #DC042E; font-size: 25px; margin-left: -75px; align-self: center; } /*Mitarbeiter*/ .mitarbeiter-reihe { display: flex; flex-flow: wrap; justify-content: center; } .mitarbeiter-reihe>div { display: flex; flex-flow: wrap; justify-content: center; margin-bottom: 2rem; } .mitarbeiter-reihe>div:nth-of-type(4n+1) { width: 50%; } .mitarbeiter-reihe>div:nth-of-type(4n+2) { width: 50%; } .mitarbeiter-reihe>div:nth-of-type(4n+3) { width: 50%; } .mitarbeiter-reihe .mitarbeiter:nth-child(7) { margin-right: auto; } .mitarbeiter-reihe>div:nth-of-type(4n+4) { width: 50%; } .mitarbeiter-reihe>div:nth-of-type(4n+1)>div, .mitarbeiter-reihe>div:nth-of-type(4n+3)>div { margin-right: 1rem; margin-left: 0; } .mitarbeiter-reihe>div:nth-of-type(4n+2)>div, .mitarbeiter-reihe>div:nth-of-type(4n+4)>div { margin-left: 1rem; margin-right: 0; } .mitarbeiter-reihe>div>div { width: 100%; } .mitarbeiter:hover>div>div>div { top: 83%; } .mitarbeiter { position: relative; width: 100%; float: left; } .mitarbeiter>div>div { box-sizing: border-box; position: relative; display: block; } .mitarbeiter>div>div img { margin: auto; display: block; height: 100%; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; -o-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } .mitarbeiter>div>div>div { background-color: rgba(255, 255, 255, 0.65); position: absolute; left: 0; right: 0; top: 100%; height: 100%; color: #1D2536; -webkit-transition: top .8s; transition: top .8s; z-index: 98; padding: 10px 35px; text-align: right; } .mitarbeiter>div div p, .text-kachel>div div strong { color: #1D2536; } .mitarbeiter>div p { margin: 0px; } .mitarbeiter>div p>strong { font-size: 2em; line-height: 35px; color: #1D2536; } .mitarbeiter-reihe .mitarbeiter img { transition: opacity 0.8s ease-in-out; } .mitarbeiter-reihe .mitarbeiter .back { position: absolute; top: 0; opacity: 0; } .mitarbeiter-reihe .mitarbeiter:hover .back { opacity: 1; } /*arbeiten*/ #arbeiten .ce_gallery ul li figure { background-color: #1D2536; width: 150px; height: 150px; } #arbeiten .ce_gallery ul li img { max-height: 90%; max-width: 90%; } .arbeit-1 .ce_gallery ul li:nth-of-type(1), .arbeit-2 .ce_gallery ul li:nth-of-type(2), .arbeit-3 .ce_gallery ul li:nth-of-type(3), .arbeit-4 .ce_gallery ul li:nth-of-type(4), .arbeit-5 .ce_gallery ul li:nth-of-type(5), .arbeit-6 .ce_gallery ul li:nth-of-type(6), .arbeit-7 .ce_gallery ul li:nth-of-type(7), .arbeit-8 .ce_gallery ul li:nth-of-type(8), .arbeit-9 .ce_gallery ul li:nth-of-type(9), .arbeit-10 .ce_gallery ul li:nth-of-type(10){ display: none !important; } /*Kunden*/ .kunden .gallerie { margin-top: 3rem; } .kunden .text-bild p img { max-width: 250px; height: 100px; margin-left: 0; object-fit: contain; } .kunden .text-bild td { width: auto !important; font-family: 'Motiva Sans Black', sans-serif; } .kunden .text-bild tr td:first-child { padding-right: 20px; } .kunden .text-bild figure { margin-top: 0; } .kunden p{ text-align: left !important; } .kunden .kontakt_text_slider p { text-align: center !important; } .kunden .ce_image img { height: 90vh; object-fit: contain; margin-left: auto; margin-right: auto; } .gallerie-three, .gallerie { margin-left: 10%; margin-right: 10%; } .gallerie-three ul li:nth-of-type(6n+6), .gallerie-three ul li:nth-of-type(6n+1) { width: 20%; } .gallerie-three ul li:nth-of-type(6n+2), .gallerie-three ul li:nth-of-type(6n+5) { width: 25%; } .gallerie-three ul li:nth-of-type(6n+3), .gallerie-three ul li:nth-of-type(6n+4) { width: 55%; } .gallerie-three ul li:nth-of-type(6n+1) figure, .gallerie-three ul li:nth-of-type(6n+4) figure { margin-right: 1rem; margin-left: 0; } .gallerie-three ul li:nth-of-type(6n+3) figure, .gallerie-three ul li:nth-of-type(6n+6) figure { margin-left: 1rem; margin-right: 0; } .gallerie-three ul li:nth-of-type(6n+2) figure, .gallerie-three ul li:nth-of-type(6n+5) figure { margin-right: 0.5rem; margin-left: 0.5rem; } @media (max-width: 550px) { .gallerie-three ul li { margin-bottom: 1rem; } .gallerie-three ul li figure { margin: 0 !important; } .gallerie-three ul li { width: 100% !important; } } .uebersicht .ce_gallery .cols_4 { display: grid; grid-template-columns: repeat(4,1fr); grid-column-gap: 25px; grid-row-gap: 20px; } .uebersicht .ce_gallery .cols_4 li img { filter: grayscale(1); cursor: pointer; } .uebersicht .ce_gallery .cols_4 li:hover img { filter: grayscale(0); } .text-100 { width: 100%; } .text-100 h1, .text-100 h2 { text-align: left; } .text-100 p { width: 50%; text-align: left; } /*Abstand mobile*/ @media (max-width: 750px) { .headlinder-full { margin-bottom: 2rem; margin-top: 2rem; } .gallerie ul{ margin-bottom: -1rem; } .bild-text-big>div { margin-bottom: 2rem; margin-top: 2rem; } .headerbild-big.bild-text-big>div { margin-top: 0rem; } #main>.inside>.mod_article { margin-bottom: 0rem; } .space-top { margin-top: 2rem; } #main { margin-top: 2rem; } #firmen hr, #arbeiten hr, .simple-text hr { margin-bottom: 1rem; margin-top: 2rem; } .mt-6 { margin-top: 2rem; } .kunden .gallerie { margin-top: 2rem; } #firmen h2{ margin-bottom: 2rem; } .headerbild-big .circle { bottom: 0; } } /*Error*/ .error { background: #1d2536; color: #fff; overflow-x: hidden; } .error #main .c { text-align: center; display: block; position: relative; width: 80%; margin: 100px auto; } .error #main ._404 { font-size: 220px; position: relative; display: inline-block; z-index: 2; height: 250px; letter-spacing: 15px; } .error #main ._1 { text-align: center; display: block; position: relative; letter-spacing: 12px; font-size: 4em; line-height: 80%; margin-top: 15px; } .error #main ._2 { text-align: center; display: block; position: relative; font-size: 20px; margin-top: 15px; } .error #main .text { font-size: 70px; text-align: center; position: relative; display: inline-block; margin: 19px 0px 0px 0px; /* top: 256.301px; */ z-index: 3; width: 100%; line-height: 1.2em; display: inline-block; } .error #main .btn { background-color: rgb(255, 255, 255); position: relative; display: inline-block; width: 350px; padding: 10px; padding-top: 15px; z-index: 5; font-size: 25px; margin: 0 auto; color: #1d2536; text-decoration: none; margin-top: 15px; } .error #main .right { float: right; width: 60%; } .error #main hr { padding: 0; border: none; border-top: 5px solid #fff; color: #fff; text-align: center; margin: 0px auto; max-width: 420px; height: 10px; z-index: -10; background: transparent; } .error #main .cloud { width: 350px; height: 120px; background: #FFF; background: linear-gradient(top, #FFF 100%); background: -webkit-linear-gradient(top, #FFF 100%); background: -moz-linear-gradient(top, #FFF 100%); background: -ms-linear-gradient(top, #FFF 100%); background: -o-linear-gradient(top, #FFF 100%); border-radius: 100px; -webkit-border-radius: 100px; -moz-border-radius: 100px; position: absolute; margin: 120px auto 20px; z-index: -1; transition: ease 1s; } .error #main .cloud:after, .error #main .cloud:before { content: ''; position: absolute; background: #FFF; z-index: -1 } .error #main .cloud:after { width: 100px; height: 100px; top: -50px; left: 50px; border-radius: 100px; -webkit-border-radius: 100px; -moz-border-radius: 100px; } .error #main .cloud:before { width: 180px; height: 180px; top: -90px; right: 50px; border-radius: 200px; -webkit-border-radius: 200px; -moz-border-radius: 200px; } .error #main .x1 { top: -50px; left: 100px; -webkit-transform: scale(0.3); -moz-transform: scale(0.3); transform: scale(0.3); opacity: 0.9; -webkit-animation: moveclouds 15s linear infinite; -moz-animation: moveclouds 15s linear infinite; -o-animation: moveclouds 15s linear infinite; } .error #main .x1_5 { top: -80px; left: 250px; -webkit-transform: scale(0.3); -moz-transform: scale(0.3); transform: scale(0.3); -webkit-animation: moveclouds 17s linear infinite; -moz-animation: moveclouds 17s linear infinite; -o-animation: moveclouds 17s linear infinite; } .error #main .x2 { left: 250px; top: 30px; -webkit-transform: scale(0.6); -moz-transform: scale(0.6); transform: scale(0.6); opacity: 0.6; -webkit-animation: moveclouds 25s linear infinite; -moz-animation: moveclouds 25s linear infinite; -o-animation: moveclouds 25s linear infinite; } .error #main .x3 { left: 250px; bottom: -70px; -webkit-transform: scale(0.6); -moz-transform: scale(0.6); transform: scale(0.6); opacity: 0.8; -webkit-animation: moveclouds 25s linear infinite; -moz-animation: moveclouds 25s linear infinite; -o-animation: moveclouds 25s linear infinite; } .error #main .x4 { left: 470px; botttom: 20px; -webkit-transform: scale(0.75); -moz-transform: scale(0.75); transform: scale(0.75); opacity: 0.75; -webkit-animation: moveclouds 18s linear infinite; -moz-animation: moveclouds 18s linear infinite; -o-animation: moveclouds 18s linear infinite; } .error #main .x5 { left: 200px; top: 300px; -webkit-transform: scale(0.5); -moz-transform: scale(0.5); transform: scale(0.5); opacity: 0.8; -webkit-animation: moveclouds 20s linear infinite; -moz-animation: moveclouds 20s linear infinite; -o-animation: moveclouds 20s linear infinite; } @-webkit-keyframes moveclouds { 0% { margin-left: 1000px; } 100% { margin-left: -1000px; } } @-moz-keyframes moveclouds { 0% { margin-left: 1000px; } 100% { margin-left: -1000px; } } @-o-keyframes moveclouds { 0% { margin-left: 1000px; } 100% { margin-left: -1000px; } } @media (max-width: 1200px) { .error #main{ margin-top: 0; } .error #main .btn { width: 250px; } } @media (max-width: 750px) { .error #main ._404 { font-size: 90px; height: 90px; } .error #main ._1 { letter-spacing: 10px; font-size: 2em; } .error #main .btn { width: 200px; } .rsts-skin-default .rsts-nav-bullets.rsts-nav ul li a { width: 15px; } } /*Arbeiten Übersicht*/ #job{ text-align: center; } #main #arbeiten { background-color: #fff; margin-left: 0; margin-right: 0; padding-right: 10%; padding-left: 10%; margin-bottom: 0; padding-bottom: 6rem; padding-top: 25px; } #job hr{ margin-bottom: 2.5rem; margin-top: 2.5rem; } /* Footer social */ .footer-social > div > p{ display: flex; align-items: center; justify-content: center; flex-flow: wrap; } .footer-social > div > p strong{ width: 100%; } .footer-social a, .mobile-social a{ text-indent: -9999px; display: block; white-space: nowrap; overflow: hidden; background-repeat: no-repeat; background-position: center; background-size: contain; width: 38px; height: 38px; margin: 10px 15px; color: #fbfbfb !important; } .footer-social a{ background-image: url("data:image/svg+xml,%3Csvg id='Logo' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%231D2536;%7D%3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M15,2.7c4,0,4.48,0,6.06.09a8.3,8.3,0,0,1,2.79.52,4.5,4.5,0,0,1,1.72,1.12,4.5,4.5,0,0,1,1.12,1.72,8.3,8.3,0,0,1,.52,2.79c.07,1.58.09,2.05.09,6.06s0,4.48-.09,6.06a8.3,8.3,0,0,1-.52,2.79,5,5,0,0,1-2.84,2.84,8.3,8.3,0,0,1-2.79.52c-1.58.07-2,.09-6.06.09s-4.48,0-6.06-.09a8.3,8.3,0,0,1-2.79-.52,4.5,4.5,0,0,1-1.72-1.12,4.5,4.5,0,0,1-1.12-1.72,8.3,8.3,0,0,1-.52-2.79C2.72,19.48,2.7,19,2.7,15s0-4.48.09-6.06a8.3,8.3,0,0,1,.52-2.79A4.5,4.5,0,0,1,4.43,4.43,4.5,4.5,0,0,1,6.15,3.31a8.3,8.3,0,0,1,2.79-.52C10.52,2.72,11,2.7,15,2.7M15,0c-4.07,0-4.58,0-6.18.09a11,11,0,0,0-3.65.7A7.23,7.23,0,0,0,2.52,2.52,7.23,7.23,0,0,0,.79,5.17a11,11,0,0,0-.7,3.65C0,10.42,0,10.93,0,15s0,4.58.09,6.18a11,11,0,0,0,.7,3.65,7.23,7.23,0,0,0,1.73,2.65,7.23,7.23,0,0,0,2.65,1.73,11,11,0,0,0,3.65.7c1.6.07,2.11.09,6.18.09s4.58,0,6.18-.09a11,11,0,0,0,3.65-.7,7.7,7.7,0,0,0,4.38-4.38,11,11,0,0,0,.7-3.65C30,19.58,30,19.07,30,15s0-4.58-.09-6.18a11,11,0,0,0-.7-3.65,7.23,7.23,0,0,0-1.73-2.65A7.23,7.23,0,0,0,24.83.79a11,11,0,0,0-3.65-.7C19.58,0,19.07,0,15,0Z'/%3E%3Cpath class='cls-1' d='M15,7.3A7.7,7.7,0,1,0,22.7,15,7.7,7.7,0,0,0,15,7.3ZM15,20a5,5,0,1,1,5-5A5,5,0,0,1,15,20Z'/%3E%3Ccircle class='cls-1' cx='23.01' cy='6.99' r='1.8'/%3E%3C/svg%3E"); } .footer-social a:nth-child(4) { background-image: url("data:image/svg+xml,%3Csvg id='Logo' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%231D2536;%7D%3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M30,15.09A15,15,0,1,0,12.66,29.91V19.43H8.85V15.09h3.81v-3.3C12.66,8,14.9,6,18.32,6a23.37,23.37,0,0,1,3.36.29V9.93H19.79a2.17,2.17,0,0,0-2.45,2.35v2.81H21.5l-.66,4.34h-3.5V29.91A15,15,0,0,0,30,15.09Z'/%3E%3C/svg%3E"); margin: 10px 0; } .footer-social a:last-child{ background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath id='Icon_awesome-linkedin' data-name='Icon awesome-linkedin' d='M22.286,2.25H1.709A1.722,1.722,0,0,0,0,3.98V24.52a1.722,1.722,0,0,0,1.709,1.73H22.286A1.726,1.726,0,0,0,24,24.52V3.98A1.726,1.726,0,0,0,22.286,2.25ZM7.254,22.821H3.7V11.368H7.259V22.821ZM5.475,9.8A2.063,2.063,0,1,1,7.538,7.741,2.063,2.063,0,0,1,5.475,9.8ZM20.587,22.821H17.03V17.25c0-1.329-.027-3.038-1.848-3.038-1.854,0-2.138,1.446-2.138,2.941v5.668H9.488V11.368H12.9v1.564h.048a3.747,3.747,0,0,1,3.37-1.848c3.6,0,4.27,2.373,4.27,5.459Z' transform='translate(0 -2.25)' fill='%231D2536'/%3E%3C/svg%3E"); } /* Social für Header */ #header .footer-social{ max-width: 170px; text-transform: uppercase; margin-left: 1.5em; } #header .footer-social strong{ color: #fff; } #header .footer-social > div > p{ justify-content: flex-start; width: 220px; } #header .footer-social a, .mobile-social a{ background-image: url("data:image/svg+xml,%3Csvg id='Logo' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23ffffff;%7D%3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M15,2.7c4,0,4.48,0,6.06.09a8.3,8.3,0,0,1,2.79.52,4.5,4.5,0,0,1,1.72,1.12,4.5,4.5,0,0,1,1.12,1.72,8.3,8.3,0,0,1,.52,2.79c.07,1.58.09,2.05.09,6.06s0,4.48-.09,6.06a8.3,8.3,0,0,1-.52,2.79,5,5,0,0,1-2.84,2.84,8.3,8.3,0,0,1-2.79.52c-1.58.07-2,.09-6.06.09s-4.48,0-6.06-.09a8.3,8.3,0,0,1-2.79-.52,4.5,4.5,0,0,1-1.72-1.12,4.5,4.5,0,0,1-1.12-1.72,8.3,8.3,0,0,1-.52-2.79C2.72,19.48,2.7,19,2.7,15s0-4.48.09-6.06a8.3,8.3,0,0,1,.52-2.79A4.5,4.5,0,0,1,4.43,4.43,4.5,4.5,0,0,1,6.15,3.31a8.3,8.3,0,0,1,2.79-.52C10.52,2.72,11,2.7,15,2.7M15,0c-4.07,0-4.58,0-6.18.09a11,11,0,0,0-3.65.7A7.23,7.23,0,0,0,2.52,2.52,7.23,7.23,0,0,0,.79,5.17a11,11,0,0,0-.7,3.65C0,10.42,0,10.93,0,15s0,4.58.09,6.18a11,11,0,0,0,.7,3.65,7.23,7.23,0,0,0,1.73,2.65,7.23,7.23,0,0,0,2.65,1.73,11,11,0,0,0,3.65.7c1.6.07,2.11.09,6.18.09s4.58,0,6.18-.09a11,11,0,0,0,3.65-.7,7.7,7.7,0,0,0,4.38-4.38,11,11,0,0,0,.7-3.65C30,19.58,30,19.07,30,15s0-4.58-.09-6.18a11,11,0,0,0-.7-3.65,7.23,7.23,0,0,0-1.73-2.65A7.23,7.23,0,0,0,24.83.79a11,11,0,0,0-3.65-.7C19.58,0,19.07,0,15,0Z'/%3E%3Cpath class='cls-1' d='M15,7.3A7.7,7.7,0,1,0,22.7,15,7.7,7.7,0,0,0,15,7.3ZM15,20a5,5,0,1,1,5-5A5,5,0,0,1,15,20Z'/%3E%3Ccircle class='cls-1' cx='23.01' cy='6.99' r='1.8'/%3E%3C/svg%3E"); margin-left: 0; } #header .footer-social a:nth-child(2), .mobile-social a:nth-child(2) { background-image: url("data:image/svg+xml,%3Csvg id='Logo' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill:%23ffffff;%7D%3C/style%3E%3C/defs%3E%3Cpath class='cls-1' d='M30,15.09A15,15,0,1,0,12.66,29.91V19.43H8.85V15.09h3.81v-3.3C12.66,8,14.9,6,18.32,6a23.37,23.37,0,0,1,3.36.29V9.93H19.79a2.17,2.17,0,0,0-2.45,2.35v2.81H21.5l-.66,4.34h-3.5V29.91A15,15,0,0,0,30,15.09Z'/%3E%3C/svg%3E") !important; margin-left: 0px; margin-right: 0; } #header .footer-social a:last-child, .mobile-social a:last-child{ background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath id='Icon_awesome-linkedin' data-name='Icon awesome-linkedin' d='M22.286,2.25H1.709A1.722,1.722,0,0,0,0,3.98V24.52a1.722,1.722,0,0,0,1.709,1.73H22.286A1.726,1.726,0,0,0,24,24.52V3.98A1.726,1.726,0,0,0,22.286,2.25ZM7.254,22.821H3.7V11.368H7.259V22.821ZM5.475,9.8A2.063,2.063,0,1,1,7.538,7.741,2.063,2.063,0,0,1,5.475,9.8ZM20.587,22.821H17.03V17.25c0-1.329-.027-3.038-1.848-3.038-1.854,0-2.138,1.446-2.138,2.941v5.668H9.488V11.368H12.9v1.564h.048a3.747,3.747,0,0,1,3.37-1.848c3.6,0,4.27,2.373,4.27,5.459Z' transform='translate(0 -2.25)' fill='%23fff'/%3E%3C/svg%3E"); margin-left: 15px; } .mobile-social{ margin-top: 10px; } .mobile-social a{ display: block; background-size: 38px; margin: 0 !important; } @media (max-width: 450px) { #header .footer-social { max-width: 100%; } } /* FAQ - Seite */ #article-181 { margin: 0 !important; width: 100% !important; } .mod_newslist { margin: 0 10%; margin-top: 100px; display: grid; grid-template-columns: repeat(4,1fr); grid-column-gap: 25px; grid-row-gap: 100px; height: 100%; padding-bottom: 100px; } .mod_newslist .layout_latest:first-child { grid-column: 1 / 5; display: grid; grid-template-columns: repeat(2,1fr); } .mod_newslist .layout_latest { height: 100%; display: flex; flex-direction: column; } .mod_newslist .layout_latest:first-child figure { grid-column: 2; grid-row: 1; } .mod_newslist .layout_latest:first-child figure img { height: 100%; object-fit: cover; } .mod_newslist .layout_latest .news_text { display: flex; flex-direction: column; height: 100%; } .mod_newslist .layout_latest .news_text .info { font-family: 'Motiva Sans Black', sans-serif; } .mod_newslist .layout_latest:first-child .news_text { grid-column: 1; grid-row: 1; padding-right: 75px; padding-top: 50px; padding-bottom: 25px; height: max-content; } .mod_newslist .layout_latest .more { margin-top: auto; padding-top: 20px; } .mod_newslist .layout_latest .more a { padding: 10px 30px; padding-right: 55px; color: #fff; background-color: #DC042E; border-radius: 7px; width: max-content; font-family: 'Motiva Sans Black', sans-serif; text-transform: uppercase; background-repeat: no-repeat; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='37.474' height='30' viewBox='0 0 37.474 30'%3E%3Cg id='Komponente_32_41' data-name='Komponente 32 – 41' transform='translate(0 30) rotate(-90)'%3E%3Cg id='Gruppe_140' data-name='Gruppe 140'%3E%3Crect id='Rechteck_68' data-name='Rechteck 68' width='3.561' height='33.602' transform='translate(13.225)' fill='%23ebebec'/%3E%3Cpath id='Pfad_236' data-name='Pfad 236' d='M15,24.392,2.692,11.511,0,13.944,15,29.63,30,13.944l-2.692-2.434Z' transform='translate(0 7.843)' fill='%23ebebec'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A"); background-position: 170px; background-size: 25px; } .mod_newslist .layout_latest h2 { height: 65px; margin: 0; text-transform: uppercase; } .mod_newsreader .back { position: absolute; top: calc(50vh - 75px); margin-left: 10%; } .mod_newsreader .back a { color: #fff; font-family: 'Motiva Sans Black', sans-serif; text-transform: uppercase; background-repeat: no-repeat; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='37.474' height='30' viewBox='0 0 37.474 30'%3E%3Cg id='Komponente_32_167' data-name='Komponente 32 – 167' transform='translate(37.474) rotate(90)'%3E%3Cg id='Gruppe_140' data-name='Gruppe 140'%3E%3Crect id='Rechteck_68' data-name='Rechteck 68' width='3.561' height='33.602' transform='translate(13.225)' fill='%23ebebec'/%3E%3Cpath id='Pfad_236' data-name='Pfad 236' d='M15,24.392,2.692,11.511,0,13.944,15,29.63,30,13.944l-2.692-2.434Z' transform='translate(0 7.843)' fill='%23ebebec'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A"); background-position: 15px center; background-size: 25px; padding: 10px 30px; padding-left: 60px; background-color: #DC042E; border-radius: 7px; width: max-content; } .mod_newsreader .layout_full { display: grid; grid-template-columns: repeat(1,1fr); padding: 0 10%; padding-bottom: 50px; } .mod_newsreader .layout_full::after { content: url("data:image/svg+xml,%3Csvg id='Gruppe_140' data-name='Gruppe 140' xmlns='http://www.w3.org/2000/svg' width='30' height='37.474' viewBox='0 0 30 37.474'%3E%3Crect id='Rechteck_68' data-name='Rechteck 68' width='3.561' height='33.602' transform='translate(13.225)' fill='%231D2536'/%3E%3Cpath id='Pfad_236' data-name='Pfad 236' d='M15,24.392,2.692,11.511,0,13.944,15,29.63,30,13.944l-2.692-2.434Z' transform='translate(0 7.843)' fill='%231D2536'/%3E%3C/svg%3E%0A"); width: 100%; height: 40px; display: flex; flex-direction: row; justify-content: center; padding-top: 75px; } .mod_newsreader .layout_full .ce_image { grid-row: 1; margin-left: -10vw; margin-right: -10vw; width: 100vw; height: 50vh; } .mod_newsreader .layout_full .ce_image img { width: 100%; height: 50vh; object-fit: cover; object-position: center; } .mod_newsreader .layout_full .info { grid-row: 2; color: #1D2536; font-family: 'Motiva Sans Black', sans-serif; font-size: 25px; margin-top: 75px; } .mod_newsreader .layout_full h1 { margin-top: 0px; margin-bottom: 25px; } @media (max-width: 1300px) { .mod_newslist { grid-template-columns: repeat(3,1fr); } .mod_newslist .layout_latest:first-child { grid-column: 1 / 4; } } @media (max-width: 1200px) { .mod_newslist { margin: 0 5%; margin-top: 100px; } .mod_newsreader .layout_full { padding: 0 5%; padding-bottom: 50px; } .mod_newsreader .layout_full .ce_image { margin-left: -5vw; margin-right: -5vw; } } @media (max-width: 900px) { .mod_newslist { grid-template-columns: repeat(1,1fr); margin-top: 0; grid-row-gap: 50px; } .mod_newslist .layout_latest:first-child { grid-column: 1 / 2; grid-template-columns: repeat(1,1fr); } .mod_newslist .layout_latest:first-child figure, .mod_newslist .layout_latest:first-child .news_text { grid-column: 1; grid-row: auto; } .mod_newslist .layout_latest figure img { height: 300px !important; object-fit: cover; } .mod_newslist .layout_latest:first-child .news_text { padding-top: 0; padding-right: 0; } .mod_newslist .layout_latest h2 { height: max-content; } .mod_newsreader .layout_full .info { margin-top: 25px; } .mod_newsreader .layout_full::after { padding-top: 50px; } } @media (max-width: 450px) { .mod_newslist .layout_latest .more a { background-position: 155px; } .mod_newsreader .layout_full .info { font-size: 16px; } .mod_newsreader .layout_full h1 { margin-bottom: 10px; } } /* Login Formular */ #loginform { height: 40vh; } #loginform form { width: 25em; background: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); text-transform: uppercase; font-family: 'Motiva Sans', sans-serif; color: #fff; border: 0px solid transparent; } #loginform .widget-text { background-color: #dfdfdf; height: 81px; display: flex; flex-direction: column; } #loginform .widget-text::after { content: ""; width: 0px; height: 0px; position: absolute; border-style: solid; border-width: 0.5em 0.469em 0 0.469em; border-color: #dfdfdf transparent transparent transparent; top: 81px; left: 50%; margin-left: -0.496em; } #loginform .widget-password { background-color: #1d2536; height: 81px; display: flex; flex-direction: column; } #loginform .widget-password::after { content: ""; width: 0px; height: 0px; position: absolute; border-style: solid; border-width: 0.5em 0.469em 0 0.469em; border-color: #1d2536 transparent transparent transparent; top: 162px; left: 50%; margin-left: -0.496em; } #loginform .widget-submit button { background-color: #DC042E; color: #fff; border-color: transparent; font-size: 18px !important; display: table-cell; vertical-align: middle; text-align: center; font-size:3em; cursor: pointer; width: 100%; height: 81px; } #loginform input { text-align: center; border: 0; outline: 0; color: #fff; background: transparent; border: 0.033em #fff solid; padding: 15px; width: max-content; margin-left: auto; margin-right: auto; margin-top: 15px; margin-bottom: 15px; } #loginform ::placeholder { color: #fff; } #loginform ::-moz-placeholder { color: #fff; } #loginform :-ms-input-placeholder { color: #fff; } #loginform ::-webkit-input-placeholder { color: #fff; } #main #article-54 { margin-bottom: 1rem; } #main #article-55 .ce_image, #main #article-95 { margin-bottom: 3rem; } #main #article-95 { margin-top: 75px; } #main #article-55 .team_ueberschrift { margin-bottom: 3rem; } #main #team .pfeil { width: 100%; margin-bottom: 0; } #main #jobs, #main #arbeiten { padding-bottom: 3rem; } #main #jobs .pfeil { grid-column: 1 / 3; margin-bottom: 0; } #article-55 .ce_image img{ object-position: 75%; } .mehranzeigen, .wenigeranzeigen { display: none; } .kunden .text-icon img { display: none; } @media (max-width: 1400px) { #article-96 .pfeil:nth-child(2), #article-136 .pfeil:nth-child(2), #article-176 .pfeil:nth-child(2) { margin-bottom: 0px !important; } } @media (max-width: 1200px) { #main>.inside>.mod_article, .space, #firmen { margin-left: 5%; margin-right: 5%; width: 90%; } #firmen, #main #jobs, #main #arbeiten { padding-left: 5%; padding-right: 5%; } #article-124 { display: flex; flex-direction: column; } #article-124 .auflistung { width: 100%; grid-template-columns: repeat(4,1fr); position: relative; } #article-124 .text-icon { width: 50%; } } @media (max-width: 1050px) { .header_leistungen { display: none; } .text-bild .zitat p { margin-top: -100px; } .history .text_even, .history .text_odd { width: calc(45vw - 100px) !important; } .own_slider{ display: none; } #slider_home { display: block; } #main #article-23, #main #article-25 { margin-bottom: 0; } .rsts-slides .leistung .ce_text { padding-top: 200px; } .rsts-slides .leistung .ce_headline { position: absolute; font-size: 45px; padding: 40px 5%; margin-top: calc(33vh + 25px); width: 100%; height: max-content; word-wrap: break-word; } .rsts-skin-default .rsts-nav { margin-left: 5%; } .rsts-slides .leistung .ce_text p:not(:last-child) { width: 100%; } .rsts-slides .leistung .ce_image { right: auto; left: 5vw; height: 200px; top: 7vh; margin-top: 25px; } .text-beratung p:nth-child(3) { width: 100%; } .rsts-slides .leistung .ce_text { height: 100vh; padding: 50px 5%; padding-top: calc(33vh + 200px); } #article-124 .auflistung { grid-template-columns: repeat(2,1fr); } .mod_navigation .submenu .level_2 { display: none; } .mod_navigation ul { flex-direction: column; margin-top: 50px; } .navtop { height: 65%; padding: 5rem 2% ; } .text-bild img { max-width: unset; } .text-bild .zitat p, .text-bild .zitat h6 { padding-right: 0; } } @media (max-width: 900px) { .mehranzeigen, .wenigeranzeigen { display: block; } .text-bild .zitat p { display: none; } .text-bild .zitat h6 { display: none; } #main .text-bild .zitat { width: 90vw; } .text-bild .zitat .auflistung { display: none; } .text-bild { display: flex; flex-direction: column; } .text-bild>div { flex-basis: 100% !important; } .own_slider { display: none; } #slider_home { display: block; } #article-25 .text-bild { display: flex; flex-direction: column; } #article-25 .text-bild figure { margin-left: 0; height: auto; } #firmen .ce_gallery { margin-left: 0; margin-bottom: 0; } .gallerie-three, .gallerie { margin: 0 !important; margin-top: 50px !important; } #article-125 .rsts-slide .gallerie { margin: 50px 5% !important; } .gallerie ul { flex-direction: column !important; } .gallerie ul li:nth-of-type(4n+1), .gallerie ul li:nth-of-type(4n+2), .gallerie ul li:nth-of-type(4n+3), .gallerie ul li:nth-of-type(4n+4) { width: 100% !important; } .gallerie ul li:nth-of-type(4n+1) figure, .gallerie ul li:nth-of-type(4n+3) figure, .gallerie ul li:nth-of-type(4n+2) figure, .gallerie ul li:nth-of-type(4n+4) figure { margin-right: 0 !important; margin-left: 0 !important; } #article-25 .gallerie .cols_2 .row_0.col_first img { content: url('/files/web/startseite/2023_hofer-werbung_referenzen_mockup_home-2-2.jpg'); } #firmen .text-bild { display: flex; flex-direction: column; } .history #zeitstrahl img { left: 25px; top: 400px; } .history .ce_image { display: none; } .history .text_odd, .history .text_even { width: auto !important; float: none; padding-left: 50px; height: 435px; } .history .text_odd.first { height: 350px; margin-top: 50px; } .history .text_even.last { height: 400px; } .history .text_even.first{ margin-top: 0; } .history .text_odd:not(.first) h1 { justify-content: flex-start; } .history .text_odd:not(.first) h1, .history .text_odd:not(.first) h2 { text-align: left; } .history .text_odd:not(.first) h1::after, .history .text_even h1::before { content: ''; margin-left: 0; } .text-100 p { width: 100%; } .uebersicht .ce_gallery .cols_4 { grid-template-columns: repeat(3,1fr); } .kunden .text-bild div:nth-child(2):not(.farbige_leistung):not(.pfeil_zurueck) { position: relative; right: auto; top: auto; height: auto; } .kunden .text-bild div:nth-child(2) figure { display: flex; flex-direction: row; justify-content: center; } .kunden .text-bild div:nth-child(2) img { height: auto; max-width: 90%; margin-left: 0; } #main #article-55 .team_ueberschrift{ margin-top: 0; } #main #article-55 .team_ueberschrift h1 { margin-top: 0; } .ce_slick-slider .slick-slide { width: 85vw; } .slick-lide img { aspect-ratio: 2 / 1; object-fit: contain; } .ce_slick-slider .slick-dots { margin-left: 75px; margin-right: 75px; } .ce_slick-slider .slick-dots li.slick-active, .ce_slick-slider .slick-dots li { width: calc((50% - 50px) / 5); } .kunden .ce_image img { height: 40vh; } .kunden .ce_gallery { width: 90%; margin-left: 5% !important; margin-right: 5% !important; } .kunden .blauerkasten { padding: 150px 10%; } #article-124 .text-icon { width: 100%; } .mitarbeiter>div>div>div, .mitarbeiter:hover>div>div>div { top: 75%; } .mitarbeiter>div p>strong { font-size: 27px; } .mitarbeiter>div p { font-size: 16px; } #main #article-54 { margin-left: 0; margin-right: 0; width: 100%; } .history .text_odd, .history .text_even { padding-left: 50px; padding-right: 50px; } .history .text_odd:not(.first), .history .text_even { padding-left: 100px; } .history .ce_text:not(.text_odd.first) h1 { margin-top: 0px; } .history .ce_text:not(.text_odd.first) h1::before { content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='55.866' viewBox='0 0 80 55.866'%3E%3Cg id='Gruppe_2142' data-name='Gruppe 2142' transform='translate(-37 -740.067)'%3E%3Cg id='Gruppe_2007' data-name='Gruppe 2007' transform='translate(-702 -101)'%3E%3Ccircle id='Ellipse_18' data-name='Ellipse 18' cx='2.5' cy='2.5' r='2.5' transform='translate(764 858)' fill='%23dc042e'/%3E%3Ccircle id='Ellipse_22' data-name='Ellipse 22' cx='2.5' cy='2.5' r='2.5' transform='translate(804 858)' fill='%23dc042e'/%3E%3Ccircle id='Ellipse_20' data-name='Ellipse 20' cx='2.5' cy='2.5' r='2.5' transform='translate(784 858)' fill='%23dc042e'/%3E%3Ccircle id='Ellipse_19' data-name='Ellipse 19' cx='2.5' cy='2.5' r='2.5' transform='translate(774 858)' fill='%23dc042e'/%3E%3Ccircle id='Ellipse_23' data-name='Ellipse 23' cx='2.5' cy='2.5' r='2.5' transform='translate(814 858)' fill='%23dc042e'/%3E%3Ccircle id='Ellipse_21' data-name='Ellipse 21' cx='2.5' cy='2.5' r='2.5' transform='translate(794 858)' fill='%23dc042e'/%3E%3C/g%3E%3Cpath id='Pfad_4230' data-name='Pfad 4230' d='M254.8,152.279l-22.175-10.247a2.682,2.682,0,0,0-2.793.2l-14.782,10.709-7.722,5.594a2.626,2.626,0,0,0-1.1,2.134V175.31a2.628,2.628,0,0,0,1.23,2.221l11.752,7.423a2.621,2.621,0,0,1,1.061,3.143l-2.786,7.384a1.574,1.574,0,0,0,2.381,1.829l35.223-24.317a2.627,2.627,0,0,0,1.139-2.161V154.613A2.631,2.631,0,0,0,254.8,152.279Z' transform='translate(-169.232 598.335)' fill='%23dc042e'/%3E%3C/g%3E%3C/svg%3E%0A"); margin-left: -80px; color: #DC042E; font-size: 25px; align-self: center; height: 65px; object-fit: contain; padding-top: 10px; } .history .text_odd, .history .text_even { min-height: 435px; height: auto; } .history .ce_text .history_text { display: flex; flex-direction: row; min-height: 360px; } .history .ce_text .history_text .ganzer_text{ display: flex; flex-direction: column; padding-left: 40px; } .history .ce_text .history_text .ganzer_text div{ display: flex; flex-direction: column; } .history .ce_text .history_text::before { content: ''; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='816.33' viewBox='0 0 30 816.33'%3E%3Cg id='Gruppe_2034' data-name='Gruppe 2034' transform='translate(0 198.526)'%3E%3Crect id='Rechteck_68' data-name='Rechteck 68' width='3.561' height='812.33' transform='translate(13.225 -198.526)' fill='%231d2536'/%3E%3Cpath id='Pfad_236' data-name='Pfad 236' d='M15,24.392,2.692,11.511,0,13.944,15,29.63,30,13.944l-2.692-2.434Z' transform='translate(0 588.174)' fill='%231d2536'/%3E%3C/g%3E%3C/svg%3E%0A"); background-repeat: no-repeat; background-size: cover; background-position: bottom; width: 30px; padding-left: 25px; margin-left: -70px; } .history .text_odd.first { min-height: max-content; height: max-content; margin-bottom: 50px; } .history .ce_text.ce_text:not(.text_odd.first) h2, .history .ce_text.ce_text:not(.text_odd.first) p { margin-bottom: 0; } #popup .inside { padding-top: 0px; overflow: scroll; height: 100%; top: 0; } #popup .ce_form { width: 80%; padding-top: 0px; padding-bottom: 20px; margin-top: 250px; } #popup .formbody { display: flex; flex-direction: column; } #popup .widget-text, #popup .widget-password { padding-bottom: 0; } #popup .close { right: calc(5% + 20px); } #popup .popup_startseite img { margin-left: 50px; margin-right: 50px; width: calc(100vw - 100px); } .farbige_leistung { flex-direction: column; } .farbige_leistung p{ margin-top: 0px !important; } .kunden .text-icon img { display: block; margin-bottom: 25px; } .kunden .text-bild div:nth-child(2):not(.farbige_leistung):not(.pfeil_zurueck) { display: none; } .kunden .ce_text.text-bild { background-image: url('/files/web/startseite/hofer_sprechblase_hellgrau.png'); background-repeat: no-repeat; background-size: contain; background-position: right bottom; margin-left: 0%; margin-right: 0%; padding-left: 10%; padding-right: 10%; } #article-25 .gallerie { margin-top: 1rem !important; } .pfeil_zurueck { display: none; } .farbige_leistung p { margin-bottom: 10px !important; } #mission { padding-top: 50px; padding-left: 5%; padding-right: 5%; width: 90% !important; } #mission .werte { grid-column: auto; padding: 200px 5%; margin-left: -5vw !important; margin-right: -5vw !important; background-position: right; } #mission .werte div { width: 100%; } #mission .werte_grid { grid-column: auto; padding: 0px 5%; margin-left: -5vw !important; margin-right: -5vw !important; margin-top: 75px; margin-bottom: 0px; } #mission .pfeil { grid-column: 1; } } @media (max-width: 767px) { .mitarbeiter>div>div>div, .mitarbeiter:hover>div>div>div { top: 70%; padding: 10px; } } @media (max-width: 700px) { .mod_navigation>ul { display: block; } .mod_navigation>ul>li:first-child { border-right: none; } .headerbild-big.bild-text-big .ce_text p.active { font-size: 45px; line-height: 70px; } .kontakt_slider .ce_text { height: 100px; width: 60px; } .kontakt_slider .ce_text p { font-size: 14px; } .kontakt_slider:hover .kontakt_text_slider { width: calc(100vw - 40px); } .kontakt_slider:hover .kontakt_text_slider .ce_text { width: 50vw; } .kontakt_slider .ce_text p br { display: none; } .rsts-slides .leistung.webseite, .rsts-slides .leistung.markenentwicklung, .rsts-slides .leistung.print, .rsts-slides .leistung.socialmedia { height: calc(100vh - 120px); } .rsts-slides .leistung .ce_text { height: calc(100vh - 120px); padding-top: 350px; } .rsts-slides .leistung .ce_image { height: 180px; top: 5vh; } .rsts-slides .leistung .ce_headline { margin-top: 225px; font-size: 27px; } .mitarbeiter>div p>strong { font-size: 20px; line-height: 22px; } .mitarbeiter>div p { font-size: 15px; line-height: 20px; } } @media (max-width: 600px) { .uebersicht .ce_gallery .cols_4 { grid-template-columns: repeat(2,1fr); } #article-124 .auflistung h2 { font-size: 20px } .mitarbeiter-reihe div.mitarbeiter { width: 100% !important; } .mitarbeiter>div>div>div, .mitarbeiter:hover>div>div>div { top: 83% } .mitarbeiter-reihe>div:nth-of-type(4n+1)>div, .mitarbeiter-reihe>div:nth-of-type(4n+3)>div { margin-right: 0; } .mitarbeiter-reihe>div:nth-of-type(4n+2)>div, .mitarbeiter-reihe>div:nth-of-type(4n+4)>div { margin-left: 0; } #mission .werte_grid { grid-template-columns: repeat(1,1fr); } } @media (max-width: 550px) { .mitarbeiter>div p { font-size: 14px; } } @media (max-width: 532px) { #popup .ce_form { margin-top: 290px; } } @media (max-width: 450px) { #article-124 .auflistung h2 { font-size: 18px; } .history .ce_text:not(.text_odd.first) h1 { line-height: 2em; } #article-124 .auflistung h2:nth-child(1):before { background-image: url(/files/web/leistungen/2023_hofer-werbung_icons_neu_leistungen_webseiten-onlineshops.png); object-fit: scale-down; content: ''; height: 75px; background-repeat: no-repeat; background-size: contain; } #article-124 .auflistung h2:nth-child(2):before { background-image: url(/files/web/leistungen/2023_hofer-werbung_icons_neu_leistungen_printprodukte.png); object-fit: scale-down; content: ''; height: 75px; background-repeat: no-repeat; background-size: contain; } #article-124 .auflistung h2:nth-child(3):before { background-image: url(/files/web/leistungen/2023_hofer-werbung_icons_neu_leistungen_markenentwicklung.png); object-fit: scale-down; content: ''; height: 75px; background-repeat: no-repeat; background-size: contain; } #article-124 .auflistung h2:nth-child(4):before { background-image: url(/files/web/leistungen/2023_hofer-werbung_icons_neu_leistungen_social-media-unterstützung.png); object-fit: scale-down; content: ''; height: 75px; background-repeat: no-repeat; background-size: contain; } .headerbild-big.bild-text-big .ce_text p strong { font-size: 30px; line-height: 50px; } .headerbild-big.bild-text-big p:after{ width: 50px !important; height: 50px !important; top: -20px !important; right: 10px !important; } .mitarbeiter>div>div>div, .mitarbeiter:hover>div>div>div { top: 75%; } } @media (max-width: 500px) { .kontakt_text_slider .ce_text strong { font-size: 1.5em; } .kontakt_slider:hover .kontakt_text_slider .ce_text { padding: 10px; } #popup .popup_startseite img { margin-left: 25px; margin-right: 25px; width: calc(100vw - 50px); } } @media (max-width: 400px) { .uebersicht .ce_gallery .cols_4 { grid-template-columns: repeat(1,1fr); } .kontakt_text_slider .ce_text strong { font-size: 1.1em; } .kontakt_text_slider .ce_text a { font-size: 12px; } }