.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} .rs-columns { clear: both; display: inline-block; width: 100%; } .rs-column { float: left; width: 100%; margin-top: 7.69231%; margin-right: 7.69231%; } .rs-column.-large-first { clear: left; } .rs-column.-large-last { margin-right: -5px; } .rs-column.-large-first-row { margin-top: 0; } .rs-column.-large-col-1-1 { width: 100%; } .rs-column.-large-col-2-1 { width: 46.15385%; } .rs-column.-large-col-2-2 { width: 100%; } .rs-column.-large-col-3-1 { width: 28.20513%; } .rs-column.-large-col-3-2 { width: 64.10256%; } .rs-column.-large-col-3-3 { width: 100%; } .rs-column.-large-col-4-1 { width: 19.23077%; } .rs-column.-large-col-4-2 { width: 46.15385%; } .rs-column.-large-col-4-3 { width: 73.07692%; } .rs-column.-large-col-4-4 { width: 100%; } .rs-column.-large-col-5-1 { width: 13.84615%; } .rs-column.-large-col-5-2 { width: 35.38462%; } .rs-column.-large-col-5-3 { width: 56.92308%; } .rs-column.-large-col-5-4 { width: 78.46154%; } .rs-column.-large-col-5-5 { width: 100%; } .rs-column.-large-col-6-1 { width: 10.25641%; } .rs-column.-large-col-6-2 { width: 28.20513%; } .rs-column.-large-col-6-3 { width: 46.15385%; } .rs-column.-large-col-6-4 { width: 64.10256%; } .rs-column.-large-col-6-5 { width: 82.05128%; } .rs-column.-large-col-6-6 { width: 100%; } @media screen and (max-width: 900px) { .rs-column { margin-top: 7.69231%; margin-right: 7.69231%; } .rs-column.-large-first { clear: none; } .rs-column.-large-last { margin-right: 7.69231%; } .rs-column.-large-first-row { margin-top: 7.69231%; } .rs-column.-medium-first { clear: left; } .rs-column.-medium-last { margin-right: -5px; } .rs-column.-medium-first-row { margin-top: 0; } .rs-column.-medium-col-1-1 { width: 100%; } .rs-column.-medium-col-2-1 { width: 46.15385%; } .rs-column.-medium-col-2-2 { width: 100%; } .rs-column.-medium-col-3-1 { width: 28.20513%; } .rs-column.-medium-col-3-2 { width: 64.10256%; } .rs-column.-medium-col-3-3 { width: 100%; } .rs-column.-medium-col-4-1 { width: 19.23077%; } .rs-column.-medium-col-4-2 { width: 46.15385%; } .rs-column.-medium-col-4-3 { width: 73.07692%; } .rs-column.-medium-col-4-4 { width: 100%; } .rs-column.-medium-col-5-1 { width: 13.84615%; } .rs-column.-medium-col-5-2 { width: 35.38462%; } .rs-column.-medium-col-5-3 { width: 56.92308%; } .rs-column.-medium-col-5-4 { width: 78.46154%; } .rs-column.-medium-col-5-5 { width: 100%; } .rs-column.-medium-col-6-1 { width: 10.25641%; } .rs-column.-medium-col-6-2 { width: 28.20513%; } .rs-column.-medium-col-6-3 { width: 46.15385%; } .rs-column.-medium-col-6-4 { width: 64.10256%; } .rs-column.-medium-col-6-5 { width: 82.05128%; } .rs-column.-medium-col-6-6 { width: 100%; } } @media screen and (max-width: 599px) { .rs-column { margin-top: 7.69231%; margin-right: 7.69231%; } .rs-column.-large-last { margin-right: 7.69231%; } .rs-column.-large-first-row { margin-top: 7.69231%; } .rs-column.-medium-first { clear: none; } .rs-column.-medium-last { margin-right: 7.69231%; } .rs-column.-medium-first-row { margin-top: 7.69231%; } .rs-column.-small-first { clear: left; } .rs-column.-small-last { margin-right: -5px; } .rs-column.-small-first-row { margin-top: 0; } .rs-column.-small-col-1-1 { width: 100%; } .rs-column.-small-col-2-1 { width: 46.15385%; } .rs-column.-small-col-2-2 { width: 100%; } .rs-column.-small-col-3-1 { width: 28.20513%; } .rs-column.-small-col-3-2 { width: 64.10256%; } .rs-column.-small-col-3-3 { width: 100%; } .rs-column.-small-col-4-1 { width: 19.23077%; } .rs-column.-small-col-4-2 { width: 46.15385%; } .rs-column.-small-col-4-3 { width: 73.07692%; } .rs-column.-small-col-4-4 { width: 100%; } .rs-column.-small-col-5-1 { width: 13.84615%; } .rs-column.-small-col-5-2 { width: 35.38462%; } .rs-column.-small-col-5-3 { width: 56.92308%; } .rs-column.-small-col-5-4 { width: 78.46154%; } .rs-column.-small-col-5-5 { width: 100%; } .rs-column.-small-col-6-1 { width: 10.25641%; } .rs-column.-small-col-6-2 { width: 28.20513%; } .rs-column.-small-col-6-3 { width: 46.15385%; } .rs-column.-small-col-6-4 { width: 64.10256%; } .rs-column.-small-col-6-5 { width: 82.05128%; } .rs-column.-small-col-6-6 { width: 100%; } } /* ========================================================================== Fonts: Used Colors: White: Black: /* ========================================================================== Variablen ========================================================================== */ :root { --blue: #0095c8; --hintergrund: #ccc; --akzent: #c32e04; --linkfarbe: #09c; --darkblue: #054763; --lightblue: #EBF0F5; --cyan: #16B6BC; } /* ========================================================================== Breakpoints ========================================================================== */ /* ========================================================================== Mixins ========================================================================== */ /* ========================================================================== Helper ========================================================================== */ * { padding: 0; border: 0; margin: 0; } *, *:before, *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } img { display: block; width: auto; max-width: 100%; height: auto !important; } .invisible { display: block; height: 0; overflow: hidden; } img, embed, object, audio, video { height: auto; max-width: 100%; /* width: 100%; */ /* margin: 0 auto; */ } .rsts-slide .block { padding-left: 0 !important; } .ce_text ul { padding-left: 1em; } .align-center {text-align: center;} /** * @license * MyFonts Webfont Build ID 3551887, 2018-04-05T06:47:20-0400 * * The fonts listed in this notice are subject to the End User License * Agreement(s) entered into by the website owner. All other parties are * explicitly restricted from using the Licensed ../fonts(s). * * You may obtain a valid license at the URLs below. * * Webfont: Rawson-Black by Latinotype * URL: https://www.myfonts.com/fonts/latinotype/rawson/black/ * * Webfont: Rawson-BlackIt by Latinotype * URL: https://www.myfonts.com/fonts/latinotype/rawson/black-italic/ * * Webfont: Rawson-Bold by Latinotype * URL: https://www.myfonts.com/fonts/latinotype/rawson/bold/ * * Webfont: Rawson-BoldIt by Latinotype * URL: https://www.myfonts.com/fonts/latinotype/rawson/bold-italic/ * * Webfont: Rawson-ExtraBlack by Latinotype * URL: https://www.myfonts.com/fonts/latinotype/rawson/extra-black/ * * Webfont: Rawson-ExtraBlackIt by Latinotype * URL: https://www.myfonts.com/fonts/latinotype/rawson/extra-black-italic/ * * Webfont: Rawson-ExtraBold by Latinotype * URL: https://www.myfonts.com/fonts/latinotype/rawson/extra-bold/ * * Webfont: Rawson-ExtraBoldIt by Latinotype * URL: https://www.myfonts.com/fonts/latinotype/rawson/extra-bold-italic/ * * Webfont: Rawson-ExtraLight by Latinotype * URL: https://www.myfonts.com/fonts/latinotype/rawson/extra-light/ * * Webfont: Rawson-ExtraLightIt by Latinotype * URL: https://www.myfonts.com/fonts/latinotype/rawson/extra-light-italic/ * * Webfont: Rawson-Light by Latinotype * URL: https://www.myfonts.com/fonts/latinotype/rawson/light/ * * Webfont: Rawson-LightIt by Latinotype * URL: https://www.myfonts.com/fonts/latinotype/rawson/light-italic/ * * Webfont: Rawson-Medium by Latinotype * URL: https://www.myfonts.com/fonts/latinotype/rawson/medium/ * * Webfont: Rawson-MediumIt by Latinotype * URL: https://www.myfonts.com/fonts/latinotype/rawson/medium-italic/ * * Webfont: Rawson-Regular by Latinotype * URL: https://www.myfonts.com/fonts/latinotype/rawson/regular/ * * Webfont: Rawson-RegularIt by Latinotype * URL: https://www.myfonts.com/fonts/latinotype/rawson/regular-italic/ * * Webfont: Rawson-SemiBold by Latinotype * URL: https://www.myfonts.com/fonts/latinotype/rawson/semi-bold/ * * Webfont: Rawson-SemiBoldIt by Latinotype * URL: https://www.myfonts.com/fonts/latinotype/rawson/semi-bold-italic/ * * Webfont: Rawson-Thin by Latinotype * URL: https://www.myfonts.com/fonts/latinotype/rawson/thin/ * * Webfont: Rawson-ThinIt by Latinotype * URL: https://www.myfonts.com/fonts/latinotype/rawson/thin-italic/ * * * License: https://www.myfonts.com/viewlicense?type=web&buildid=3551887 * Licensed pageviews: 10,000 * ../fonts copyright: Copyright © 2017 by Alfonso García - Latinotype Team. All rights reserved. * * © 2018 MyFonts Inc */ /* @import must be at top of file, otherwise CSS will not work */ /*@import url("//hello.myfonts.net/count/36328f"); */ @font-face {font-family: 'Rawson-Black';src: url('../../files/themes/h2well/fonts/36328F_0_0.eot');src: url('../../files/themes/h2well/fonts/36328F_0_0.eot?#iefix') format('embedded-opentype'),url('../../files/themes/h2well/fonts/36328F_0_0.woff2') format('woff2'),url('../../files/themes/h2well/fonts/36328F_0_0.woff') format('woff'),url('../../files/themes/h2well/fonts/36328F_0_0.ttf') format('truetype');} @font-face {font-family: 'Rawson-BlackIt';src: url('../../files/themes/h2well/fonts/36328F_1_0.eot');src: url('../../files/themes/h2well/fonts/36328F_1_0.eot?#iefix') format('embedded-opentype'),url('../../files/themes/h2well/fonts/36328F_1_0.woff2') format('woff2'),url('../../files/themes/h2well/fonts/36328F_1_0.woff') format('woff'),url('../../files/themes/h2well/fonts/36328F_1_0.ttf') format('truetype');} @font-face {font-family: 'Rawson-Bold';src: url('../../files/themes/h2well/fonts/36328F_2_0.eot');src: url('../../files/themes/h2well/fonts/36328F_2_0.eot?#iefix') format('embedded-opentype'),url('../../files/themes/h2well/fonts/36328F_2_0.woff2') format('woff2'),url('../../files/themes/h2well/fonts/36328F_2_0.woff') format('woff'),url('../../files/themes/h2well/fonts/36328F_2_0.ttf') format('truetype');} @font-face {font-family: 'Rawson-BoldIt';src: url('../../files/themes/h2well/fonts/36328F_3_0.eot');src: url('../../files/themes/h2well/fonts/36328F_3_0.eot?#iefix') format('embedded-opentype'),url('../../files/themes/h2well/fonts/36328F_3_0.woff2') format('woff2'),url('../../files/themes/h2well/fonts/36328F_3_0.woff') format('woff'),url('../../files/themes/h2well/fonts/36328F_3_0.ttf') format('truetype');} @font-face {font-family: 'Rawson-ExtraBlack';src: url('../../files/themes/h2well/fonts/36328F_4_0.eot');src: url('../../files/themes/h2well/fonts/36328F_4_0.eot?#iefix') format('embedded-opentype'),url('../../files/themes/h2well/fonts/36328F_4_0.woff2') format('woff2'),url('../../files/themes/h2well/fonts/36328F_4_0.woff') format('woff'),url('../../files/themes/h2well/fonts/36328F_4_0.ttf') format('truetype');} @font-face {font-family: 'Rawson-ExtraBlackIt';src: url('../../files/themes/h2well/fonts/36328F_5_0.eot');src: url('../../files/themes/h2well/fonts/36328F_5_0.eot?#iefix') format('embedded-opentype'),url('../../files/themes/h2well/fonts/36328F_5_0.woff2') format('woff2'),url('../../files/themes/h2well/fonts/36328F_5_0.woff') format('woff'),url('../../files/themes/h2well/fonts/36328F_5_0.ttf') format('truetype');} @font-face {font-family: 'Rawson-ExtraBold';src: url('../../files/themes/h2well/fonts/36328F_6_0.eot');src: url('../../files/themes/h2well/fonts/36328F_6_0.eot?#iefix') format('embedded-opentype'),url('../../files/themes/h2well/fonts/36328F_6_0.woff2') format('woff2'),url('../../files/themes/h2well/fonts/36328F_6_0.woff') format('woff'),url('../../files/themes/h2well/fonts/36328F_6_0.ttf') format('truetype');} @font-face {font-family: 'Rawson-ExtraBoldIt';src: url('../../files/themes/h2well/fonts/36328F_7_0.eot');src: url('../../files/themes/h2well/fonts/36328F_7_0.eot?#iefix') format('embedded-opentype'),url('../../files/themes/h2well/fonts/36328F_7_0.woff2') format('woff2'),url('../../files/themes/h2well/fonts/36328F_7_0.woff') format('woff'),url('../../files/themes/h2well/fonts/36328F_7_0.ttf') format('truetype');} @font-face {font-family: 'Rawson-ExtraLight';src: url('../../files/themes/h2well/fonts/36328F_8_0.eot');src: url('../../files/themes/h2well/fonts/36328F_8_0.eot?#iefix') format('embedded-opentype'),url('../../files/themes/h2well/fonts/36328F_8_0.woff2') format('woff2'),url('../../files/themes/h2well/fonts/36328F_8_0.woff') format('woff'),url('../../files/themes/h2well/fonts/36328F_8_0.ttf') format('truetype');} @font-face {font-family: 'Rawson-ExtraLightIt';src: url('../../files/themes/h2well/fonts/36328F_9_0.eot');src: url('../../files/themes/h2well/fonts/36328F_9_0.eot?#iefix') format('embedded-opentype'),url('../../files/themes/h2well/fonts/36328F_9_0.woff2') format('woff2'),url('../../files/themes/h2well/fonts/36328F_9_0.woff') format('woff'),url('../../files/themes/h2well/fonts/36328F_9_0.ttf') format('truetype');} @font-face {font-family: 'Rawson-Light';src: url('../../files/themes/h2well/fonts/36328F_A_0.eot');src: url('../../files/themes/h2well/fonts/36328F_A_0.eot?#iefix') format('embedded-opentype'),url('../../files/themes/h2well/fonts/36328F_A_0.woff2') format('woff2'),url('../../files/themes/h2well/fonts/36328F_A_0.woff') format('woff'),url('../../files/themes/h2well/fonts/36328F_A_0.ttf') format('truetype');} @font-face {font-family: 'Rawson-LightIt';src: url('../../files/themes/h2well/fonts/36328F_B_0.eot');src: url('../../files/themes/h2well/fonts/36328F_B_0.eot?#iefix') format('embedded-opentype'),url('../../files/themes/h2well/fonts/36328F_B_0.woff2') format('woff2'),url('../../files/themes/h2well/fonts/36328F_B_0.woff') format('woff'),url('../../files/themes/h2well/fonts/36328F_B_0.ttf') format('truetype');} @font-face {font-family: 'Rawson-Medium';src: url('../../files/themes/h2well/fonts/36328F_C_0.eot');src: url('../../files/themes/h2well/fonts/36328F_C_0.eot?#iefix') format('embedded-opentype'),url('../../files/themes/h2well/fonts/36328F_C_0.woff2') format('woff2'),url('../../files/themes/h2well/fonts/36328F_C_0.woff') format('woff'),url('../../files/themes/h2well/fonts/36328F_C_0.ttf') format('truetype');} @font-face {font-family: 'Rawson-MediumIt';src: url('../../files/themes/h2well/fonts/36328F_D_0.eot');src: url('../../files/themes/h2well/fonts/36328F_D_0.eot?#iefix') format('embedded-opentype'),url('../../files/themes/h2well/fonts/36328F_D_0.woff2') format('woff2'),url('../../files/themes/h2well/fonts/36328F_D_0.woff') format('woff'),url('../../files/themes/h2well/fonts/36328F_D_0.ttf') format('truetype');} @font-face {font-family: 'Rawson-Regular';src: url('../../files/themes/h2well/fonts/36328F_E_0.eot');src: url('../../files/themes/h2well/fonts/36328F_E_0.eot?#iefix') format('embedded-opentype'),url('../../files/themes/h2well/fonts/36328F_E_0.woff2') format('woff2'),url('../../files/themes/h2well/fonts/36328F_E_0.woff') format('woff'),url('../../files/themes/h2well/fonts/36328F_E_0.ttf') format('truetype');} @font-face {font-family: 'Rawson-RegularIt';src: url('../../files/themes/h2well/fonts/36328F_F_0.eot');src: url('../../files/themes/h2well/fonts/36328F_F_0.eot?#iefix') format('embedded-opentype'),url('../../files/themes/h2well/fonts/36328F_F_0.woff2') format('woff2'),url('../../files/themes/h2well/fonts/36328F_F_0.woff') format('woff'),url('../../files/themes/h2well/fonts/36328F_F_0.ttf') format('truetype');} @font-face {font-family: 'Rawson-SemiBold';src: url('../../files/themes/h2well/fonts/36328F_10_0.eot');src: url('../../files/themes/h2well/fonts/36328F_10_0.eot?#iefix') format('embedded-opentype'),url('../../files/themes/h2well/fonts/36328F_10_0.woff2') format('woff2'),url('../../files/themes/h2well/fonts/36328F_10_0.woff') format('woff'),url('../../files/themes/h2well/fonts/36328F_10_0.ttf') format('truetype');} @font-face {font-family: 'Rawson-SemiBoldIt';src: url('../../files/themes/h2well/fonts/36328F_11_0.eot');src: url('../../files/themes/h2well/fonts/36328F_11_0.eot?#iefix') format('embedded-opentype'),url('../../files/themes/h2well/fonts/36328F_11_0.woff2') format('woff2'),url('../../files/themes/h2well/fonts/36328F_11_0.woff') format('woff'),url('../../files/themes/h2well/fonts/36328F_11_0.ttf') format('truetype');} @font-face {font-family: 'Rawson-Thin';src: url('../../files/themes/h2well/fonts/36328F_12_0.eot');src: url('../../files/themes/h2well/fonts/36328F_12_0.eot?#iefix') format('embedded-opentype'),url('../../files/themes/h2well/fonts/36328F_12_0.woff2') format('woff2'),url('../../files/themes/h2well/fonts/36328F_12_0.woff') format('woff'),url('../../files/themes/h2well/fonts/36328F_12_0.ttf') format('truetype');} @font-face {font-family: 'Rawson-ThinIt';src: url('../../files/themes/h2well/fonts/36328F_13_0.eot');src: url('../../files/themes/h2well/fonts/36328F_13_0.eot?#iefix') format('embedded-opentype'),url('../../files/themes/h2well/fonts/36328F_13_0.woff2') format('woff2'),url('../../files/themes/h2well/fonts/36328F_13_0.woff') format('woff'),url('../../files/themes/h2well/fonts/36328F_13_0.ttf') format('truetype');} /* ========================================================================== Typo Fonts: XXX ========================================================================== */ @import "MyFontsWebfontsKit.css"; html { font-family: Rawson-Regular, sans-serif; font-style: normal; font-variant: normal; font-weight: 300; color: var(--darkblue); } html { font-size: 16px; } @media screen and (min-width: 320px) { html { font-size: calc(16px + 2 * ((100vw - 320px) / 640)); } } @media screen and (min-width: 960px) { html { font-size: 18px; } } h1, h2 {font-family: Rawson-SemiBold; color: var(--darkblue);margin-bottom: 0.8em;} h3, h4 {font-family: Rawson-Regular; color: var(--darkblue);margin-bottom: 0.8em;} .iw h1, .iw h2, .iw h3, .iw h4 {text-transform: none;} @media screen and (min-width: 760px) { h1 { font-size: 3rem; margin-bottom: .5em; } h2 { font-size: 2.7rem; margin-bottom: .5em; } h3 { font-size: 1.8rem; margin-top: calc(1em + .25vh); margin-bottom: .5em; } h4 { font-size: 1.5rem; margin-bottom: .5em; } h1.ce_headline, h2.ce_headline { margin-bottom: 70px; } } h1 + *, h1 + [class], h2 + *, h2 + [class], h3 + *, h3 + [class], h4 + *, h4 + [class], h5 + *, h5 + [class], h6 + *, h6 + [class] { margin-top: 0; } p { color: var(--darkblue); /* font-size: 14px; font-size: 0.875rem; font-weight: 400; */ line-height: 1.667; margin-top: 18px; margin-bottom: 18px; } a { text-decoration: none; } em { font-style: normal; } #footer a, #footer p, #footer strong { font-family: Rawson-Medium, sans-serif; color: #ffffff; line-height: 1.389; } #footer p { margin-top: 10px; margin-bottom: 10px; } #footer a, #footer p { font-size: 16px; } @media screen and (min-width: 1024px) { #footer a, #footer p { font-size: 18px; } } /* ========================================================================== Layout Inhalt: 1 - HEADER 2 - MAIN 3 - FOOTER ========================================================================== */ * { overflow-wrap: break-word; } body { background: #fffffff; white-space: normal; line-break: strict; -webkit-hyphens: auto; hyphens: auto; } /*** 1 - HEADER ***/ #header { /* background-color: #0095c8; background-color: var(--blue); height: 370px;*/ } #header .logobar-mobile { background: #006787; padding: 40px 32px 0 32px; } #header .logobar-mobile .inside { position: relative; } #header .logobar-mobile .inside .hamburger{ position: absolute; top: 10px; right: 0; } @media only screen and (min-width: 768px) { #header .logobar-mobile { display: none; } } #header .nav-mobile { background: #006787; padding: 0 32px 40px 32px; } @media only screen and (min-width: 768px) { #header .nav-mobile { display: none; } } #header .logobar { display: none; } @media only screen and (min-width: 768px) { #header .logobar { display: block; padding: 15px 1rem; } #header .logobar .inside { max-width: 1200px; width: 100%; margin: 0 auto; position: relative; } #header .logobar .foerdergeber { display: -webkit-box; display: -ms-flexbox; display: flex; display: -ms-flex; max-width: 480px; } #header .logobar .foerdergeber > *{ width: 100%; } #header .logobar .logo-bund { max-width: 200px; width: 100%; } #header .logobar .foerdergeber .logo-wir { margin-top: 50px; max-width: 280px; width: 100%; } #header .imagebar .inside { /* max-width: 1920px; */ width: 100%; margin: 0 auto; } #header .imagebar .inside img { /* max-width: 1920px; */ width: 100%; } } #header .logobar .logo { position: absolute; right: 0; top: 70px; z-index: 1; } @media only screen and (min-width: 768px) and (max-width: 1200px) { #header .logobar .logo { width: calc(280px + (379 - 280) * ((100vw - 768px) / (1200 - 768))); } } .iw #header .logobar .logo { position: absolute; right: 0; top: -15px; } @media only screen and (min-width: 768px) and (max-width: 1700px) { .iw #header .logobar .logo { width: calc(390px + 100 * ((100vw - 900px) / 1600)); } } #header .navbar { display: none; } @media only screen and (min-width: 768px) { #header .navbar { display: block; background: #EBF0F5; padding: 15px 1rem; } } /*** 2 - MAIN ***/ #main > .inside > .block { padding-left: 24px; padding-right: 24px; padding: 70px 24px 70px 24px; } #main .mod_article.content-1200 .inside { max-width: 1200px; margin: 0 auto; position: relative; } #main .mod_article.content-960 .inside { max-width: 960px; margin: 0 auto; } #main .mod_article.content-860 .inside { max-width: 860px; margin: 0 auto; } #main .mod_article.content-768 .inside { max-width: 768px; margin: 0 auto; } @media only screen and (min-width: 1024px) { /*#main .mod_article.content-1200 .block { */ #main .mod_article.content-1200 > .inside > div { padding-left: 160px; } #main .content-text.col2 p { column-count: 2; /* Anzahl der Spalten */ column-gap: 2rem; text-align: justify; } } #main .mod_article.content-1200 .block > h1, #main .mod_article.content-1200 .block > h2, #main .mod_article.content-1200 .block > h3, #main .mod_article.content-1200 .block > h4 { padding-left: 0px; } .cards .block { padding-left: 0px !important; margin-bottom: 3%; } .container { position: relative; width: 100%; overflow: hidden;} .container-content { position: absolute; top: 0; left: 0; bottom: 0; right: 0;} .aspect-ratio-3-2 .container { padding-top: calc(100% / 1.75); /* 3.5:2 Aspect Ratio */} @media only screen and (min-width: 600px) { .aspect-ratio-3-2 .container { padding-top: calc(100% / .75); /* 3.5:2 Aspect Ratio */} } @media only screen and (min-width: 860px) { .aspect-ratio-3-2 .container { padding-top: calc(100% / 3 * 2); /* 3.5:2 Aspect Ratio */} } .cards .container-content { background: #DEE0E9; border-radius: 10px; padding: 20px 30px; /* position: relative;*/ width: 100%; } .cards .container-content a { color: #01344C; font-family: Rawson-SemiBold, sans-serif; line-height: 1.1; font-size: 24px; } .cards .container-content p { margin: 0; overflow: hidden; } .cards .container-content p.more { height: 0px; } .container-content { margin-bottom: inherit; /* display: -ms-grid; display: grid; -ms-grid-columns: 1fr; grid-template-columns: 1fr; -ms-grid-rows: 1fr 2fr 4fr 0fr; grid-template-rows: 1fr 2fr 4fr 0fr; */ } .container-content > *:nth-child(1) {align-items: bottom;} .container-content > *:nth-child(2) { display: block; border-bottom: solid 3px #16B6BC; /* overflow: hidden;*/ } .cards .container-content p.more a::after { position: absolute; content: url(../../files/themes/h2well/img/pfeil.svg); bottom: 20px; right: 30px; z-index: 10; } .cards .container-content h2 { font-size: inherit; display: block; height: 3em; } .cards .container-content p.info { display: block; /*height: 1em; */ font-family: Rawson-medium, sans-serif; line-height: 2; font-size: 18px; display: inline-block; vertical-align: top; } /*.cards .container-content > div { line-height: 2; } */ .col-2::after { content: ""; display: block; clear: both; } @media screen and (min-width: 600px) { .col-2 > * { float: left; margin-right: 3%; width: 48.5%; } .col-2 > *:nth-child(2n) { margin-right: 0; } } .block.label_01_Branchen { position: relative; } .block.label_01_Branchen:before { position: absolute; content: '01 _ Branchen'; width: 200px; top: 104px; left:-196px; z-index: 1; transform: rotate(270deg); text-align: right; text-transform: uppercase; } .block.label_02_ani-icons { position: relative; } .block.label_02_ani-icons:before { position: absolute; content: '02 _ Animierte Icons'; width: 200px; top: 104px; left:-196px; z-index: 1; transform: rotate(270deg); text-align: right; text-transform: uppercase; } .block.label_04_partner { position: relative; } .block.label_04_partner:before { position: absolute; /*content: '04 _ B\00fcndnispartner';*/ /* Umlaute im ISO-Code*/ content: url('../../files/themes/h2well/img/label/label-partner.svg'); width: 250px; top: 20px; left:-130px; z-index: 1; /*transform: rotate(270deg);*/ /* text-align: right; */ text-transform: uppercase; } .block.label_05_technik { position: relative; } .block.label_05_technik:before { position: absolute; /*content: '04 _ B\00fcndnispartner';*/ /* Umlaute im ISO-Code*/ content: url('../../files/themes/h2well/img/label/label-technik.svg'); width: 250px; top: 20px; left:-130px; z-index: 1; /*transform: rotate(270deg);*/ /* text-align: right; */ text-transform: uppercase; } .block.label_08_veranstaltungen { position: relative; } .block.label_08_veranstaltungen:before { position: absolute; /*content: '04 _ B\00fcndnispartner';*/ /* Umlaute im ISO-Code*/ content: url('../../files/themes/h2well/img/label/label-veranstaltungen.svg'); width: 250px; top: 10px; left:-130px; z-index: 1; /*transform: rotate(270deg);*/ /* text-align: right; */ text-transform: uppercase; } .block.label_09_testimonials { position: relative; } .block.label_09_testimonials:before { position: absolute; /*content: '04 _ B\00fcndnispartner';*/ /* Umlaute im ISO-Code*/ content: url('../../files/themes/h2well/img/label/label-testimonials.svg'); width: 250px; top: 0px; left:-130px; z-index: 1; /*transform: rotate(270deg);*/ /* text-align: right; */ text-transform: uppercase; } .block.label_10_berufsfelder { position: relative; } .block.label_10_berufsfelder:before { position: absolute; content: url('../../files/themes/h2well/img/label/label-berufsfelder.svg'); width: 250px; top: 0px; left:-130px; z-index: 1; } .block.label_11_film-h2well { position: relative; } .block.label_11_film-h2well:before { position: absolute; content: url('../../files/themes/h2well/img/label/label-film-h2well.svg'); width: 250px; top: 0px; left:-130px; z-index: 1; } .bg-dunkelblau { background: var(--darkblue); } .mod_article.bg-dunkelblau *, .mod_article.bg-blau * { color: #ffffff; } .bg-blau { background: #29799E; } .bg-cyan { background: #98e8e8; } .bg-grau { background: #DEE0E9; } .no-padding { padding-left: 0px !important; } .mod_article.veranstaltungs-leser { padding: 70px 0 !important; } .mod_article.veranstaltungs-leser .event > *:not(.width-full), .mod_article.veranstaltungs-leser p.back { width: 100%; max-width: 1248px; margin: 0 auto; padding-left: 24px; padding-right: 24px; } .mod_article.veranstaltungs-leser p.back { text-align: right; margin-bottom: 50px; } .mod_article.veranstaltungs-leser p.back a { text-decoration: underline; text-transform: lowercase; color: #054763; font-family: Rawson-Bold, sans-serif; font-size: 24px; line-height: 1.33; } .mod_article.veranstaltungs-leser .event > *:not(.width-full):not(h1) { padding-left: 160px; } .mod_article.veranstaltungs-leser .event .ce_image:not(.width-full) { margin-bottom: 20px; } .mod_article.veranstaltungs-leser h1 { margin-bottom: 70px !important; } .mod_article.veranstaltungs-leser .ce_text { margin-bottom: 70px !important; margin-top: 50px !important; } .mod_article.animation { padding: 0 !important; } .mod_article.animation .inside { overflow: hidden; } .animation .ce_image { position: absolute; left: 0; top: 0; width:100%; max-width: 1200px; padding-left: 0 !important; margin: 0 auto ; } .animation .ce_image.dummy { position: relative; } /*.animation .ce_image figure { max-width: 70em; margin: 0 auto; } */ /*** 3 - FOOTER ***/ #footer { background: #054763; } /* #footer:before { position: absolute; content: ' '; background: #054763; top: 50px; left: 0; right: 0; bottom: 0; z-index: -1; } */ #footer .inside { padding: 50px 1rem; } #footer .grid { max-width: 300px; margin: 0 auto; } #footer .text-1, #footer .text-2, #footer .text-3 { margin: 0 auto; max-width: 240px; width: 100%; } #footer .grid { display: -ms-grid; display: grid; -ms-grid-columns: 1fr; grid-template-columns: 1fr; -ms-grid-rows: 1fr 1fr 1fr 1fr 0.2fr; grid-template-rows: 1fr 1fr 1fr 1fr 0.2fr; } @media only screen and (min-width: 768px) { #footer .grid { max-width: 1200px; margin: 0 auto; display: -ms-grid; display: grid; -ms-grid-columns: 1fr 1fr 1fr; grid-template-columns: 1fr 1fr 1fr; -ms-grid-rows: 1fr 1fr 0.2fr; grid-template-rows: 1fr 1fr 0.2fr; } #footer .grid .text-1 { -ms-grid-column: 1; grid-column: 1; -ms-grid-row: 1; grid-row: 1; } #footer .grid .text-2 { -ms-grid-column: 2; grid-column: 2; -ms-grid-row: 1; grid-row: 1; } #footer .text-3 { -ms-grid-column: 3; grid-column: 3; -ms-grid-row: 1; grid-row: 1; } #footer .grid .logo { -ms-grid-column: 2; grid-column: 2; -ms-grid-row: 2; grid-row: 2 ; align-self: center; } #footer .grid .nav-footer { -ms-grid-column: 2; grid-column: 2; -ms-grid-row: 3; grid-row: 3; } } @media only screen and (min-width: 1024px) { #footer .grid { max-width: 1200px; position: relative; } #footer .grid { display: -ms-grid; display: grid; -ms-grid-columns: 1fr 1fr 1fr 1fr; grid-template-columns: 1fr 1fr 1fr 1fr; -ms-grid-rows: 100px 70px; grid-template-rows: 100px 70px; } #footer .grid .text-1 { -ms-grid-column: 1; grid-column: 1; -ms-grid-row: 1; grid-row: 1; } #footer .grid .text-2 { -ms-grid-column: 2; grid-column: 2; -ms-grid-row: 1; grid-row: 1; } #footer .text-3 { -ms-grid-column: 3; grid-column: 3; -ms-grid-row: 1; grid-row: 1; } #footer .grid .logo { -ms-grid-column: 4; grid-column: 4; -ms-grid-row: 1; grid-row: 1 ; position: relative; } #footer .grid .logo > div { position: absolute; top: -140px; left: 0; } #footer .grid .nav-footer { -ms-grid-column: 4; grid-column: 4; -ms-grid-row: 1; grid-row: 1; margin-top: 70px; margin-bottom: 10px; } } .hyperlink-box { text-align: center; } .hyperlink-box a { background: #DEE0E9; border-radius: 10px; padding: 20px 30px; /* position: relative; */ width: 100%; color: #01344C; font-weight: bold; font-size: 125%; text-align: center; margin-top: 1em; } /* Basis für alle Grid-Klassen (Attribute-Selector) */ [class*="grid-col-"] { display: grid; grid-template-columns: 1fr; /* Mobile: immer 1-spaltig */ gap: 2rem; margin-block: 2rem; } /* Verhindert Layout-Brechungen durch große Bilder oder lange Wörter */ [class*="grid-col-"] > * { min-width: 0; } /* Innenleben-Styling für Contao-Elemente */ [class*="grid-col-"] .content-hyperlink figure { margin: 0; height: 100%; display: flex; flex-direction: column; justify-content: space-between; } [class*="grid-col-"] img { width: 100%; height: auto; display: block; } /* Breakpoint Tablet (ab 768px) */ @media (min-width: 768px) { .grid-col-2 { grid-template-columns: repeat(2, 1fr); } .grid-col-3 { grid-template-columns: repeat(2, 1fr); } /* Auf Tablet noch 2-spaltig */ .grid-col-4 { grid-template-columns: repeat(2, 1fr); } /* Auf Tablet noch 2-spaltig */ } /* Breakpoint Desktop (ab 1024px) */ @media (min-width: 1024px) { .grid-col-3 { grid-template-columns: repeat(3, 1fr); } .grid-col-4 { grid-template-columns: repeat(4, 1fr); } } /* ========================================================================== Grid Card Component (.grid-card) ========================================================================== */ .grid-card { position: relative; background-color: #ffffff; border: 1px solid #c0ebf3; border-radius: 12px; overflow: hidden; transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease; box-shadow: 0 4px 12px rgba(0, 91, 112, 0.06); } /* Hover-Status: Karte hebt sich an */ .grid-card:hover { transform: translateY(-6px); border-color: #0083A0; box-shadow: 0 12px 24px rgba(0, 91, 112, 0.15); cursor: pointer; } /* Gesamte Karte anklickbar machen */ .grid-card a::after { content: ''; position: absolute; inset: 0; z-index: 2; } /* Innenleben-Ausrichtung & Bild-Zoom */ .grid-card figure { margin: 0; height: 100%; display: flex; flex-direction: column; } .grid-card img { width: 100%; height: auto; display: block; transition: transform 0.4s ease; } .grid-card:hover img { transform: scale(1.02); } /* Subtitle als interaktiver CTA-Riegel */ .grid-card figcaption { padding: 1.25rem 1.5rem; font-size: 1.05rem; font-weight: 700; color: #005B70; background-color: #f2fbfd; border-top: 1px solid #e0f5f8; display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; transition: background-color 0.3s ease, color 0.3s ease; } /* Dynamischer Pfeil */ .grid-card figcaption::after { content: '→'; font-size: 1.3rem; font-weight: 400; color: #0083A0; transition: transform 0.3s ease, color 0.3s ease; } /* Hover-Reaktion des CTA-Riegels */ .grid-card:hover figcaption { background-color: #0083A0; color: #ffffff; } .grid-card:hover figcaption::after { color: #ffffff; transform: translateX(6px); } /* Card-Basis innerhalb deines Grids */ .links-foerderung .content-hyperlink { display: flex; flex-direction: column; justify-content: space-between; background-color: var(--lightblue); border: 1px solid #e2e8f0; border-radius: 8px; padding: 1.5rem; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05); transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease; height: 100%; } /* Hover-Effekt für die Karte */ .links-foerderung .content-hyperlink:hover { transform: translateY(-4px); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1); border-color: #62c4d2; } /* Ãœberschrift-Styling */ .links-foerderung .content-hyperlink h2 { font-size: 1.05rem; font-weight: 700; line-height: 1.35; color: #0a3144; margin: 0 0 1.25rem 0; text-transform: uppercase; } /* Button-Styling für den Link */ .links-foerderung .content-hyperlink a { display: inline-flex; align-items: center; justify-content: center; background-color: var(--darkblue); color: #ffffff !important; text-decoration: none; font-weight: 600; font-size: 0.9rem; padding: 0.65rem 1rem; border-radius: 4px; transition: background-color 0.2s ease; margin-top: auto; text-align: center; } /* Button-Hover & Pfeil-Icon */ .links-foerderung .content-hyperlink a:hover { background-color: #29799E; color: #fff !important; } .links-foerderung .content-hyperlink a::after { content: " →"; margin-left: 0.4rem; font-weight: bold; } /* Container-Grid */ .links-foerderung { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1.5rem; margin-top: 2rem; } /* Card-Basis für content-text */ .links-foerderung .content-text { display: flex; flex-direction: column; background-color: var(--lightblue); border: 1px solid #e2e8f0; border-radius: 8px; padding: 1.5rem; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05); transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease; height: 100%; box-sizing: border-box; } /* Hover-Effekt für die gesamte Kachel */ .links-foerderung .content-text:hover { transform: translateY(-4px); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1); border-color: #62c4d2; } /* Ãœberschrift (h2) in der Kachel */ .links-foerderung .content-text h2 { font-size: 1.1rem; font-weight: 700; line-height: 1.35; color: var(--darkblue); margin: 0 0 0.75rem 0; } /* Flexbox-Container für den Inhalt (.rte) */ .links-foerderung .content-text .rte { display: flex; flex-direction: column; flex-grow: 1; /* Füllt den verbleibenden Platz aus */ } /* Beschreibungstext (z. B. "Projektträger Jülich (ptj)") */ .links-foerderung .content-text .rte p:not(:last-child) { color: #475569; font-size: 0.95rem; margin: 0 0 1.25rem 0; line-height: 1.4; } /* Letzter p-Tag mit dem Link – drückt sich automatisch nach unten */ .links-foerderung .content-text .rte p:last-child { margin-top: auto; margin-bottom: 0; } /* Link-Styling als Button */ .links-foerderung .content-text .rte a { display: inline-flex; align-items: center; justify-content: center; width: 100%; background-color: var(--darkblue); color: #ffffff !important; text-decoration: none; font-weight: 600; font-size: 0.9rem; padding: 0.65rem 1rem; border-radius: 4px; transition: background-color 0.2s ease; text-align: center; box-sizing: border-box; } /* Button-Hover & Pfeil-Icon */ .links-foerderung .content-text .rte a:hover { background-color: #29799E; color: #fff !important; } .links-foerderung .content-text .rte a::after { content: " →"; margin-left: 0.4rem; font-weight: bold; } /* ========================================================================== Navigation ========================================================================== */ .nav-main { max-width: 1200px; width: 100%; margin: 0 auto; } .nav-main nav > ul { display: -webkit-box; display: -ms-flexbox; display: flex; display: -ms-flex; justify-content: space-between; flex-wrap: nowrap; } .nav-main ul.level_1 li.active ul, .nav-main ul.level_1 li.submenu.trail ul { z-index: 1000; } .nav-main ul.level_1 li:first-child ul { z-index: 1500; } .nav-main ul.level_1 li.active ul { z-index: 1600; } .nav-main ul.level_1 li:hover ul { z-index: 1700; } .nav-mobile-area { height: 0; overflow: hidden; transition: 0.3s } .nav-mobile-area.active { padding-top: 50px; height: 400px; transition: 0.3s; } /* Formatierungen und Farben */ .nav-mobile ul, .nav-main ul, .nav-footer ul { list-style: none; } .nav-main li > *, .nav-mobile-main li > * { font-family: Rawson-SemiBold, sans-serif; font-size: 25px; line-height: 1.36; text-transform: uppercase; text-decoration: none; } @media screen and (min-width: 760px) and (max-width: 1200px) { .nav-main li > *, .nav-mobile-main li > * { font-size: calc(16px + (25 - 16) * ((100vw - 760px) / (1200 - 760))); } } .nav-mobile-ob { margin-top: 6rem; text-align: center; } .nav-mobile-ob a { font-family: Rawson-SemiBold, sans-serif; font-size: 18px; line-height: 1.38; } .nav-main > ul > li { } .nav-main ul li > * { color: #04506D;} .nav-mobile ul li > * { color: #ffffff;} .nav-main ul.level_2 li a { color: white; font-weight: bold; font-size: 16px; } .nav-main ul.level_3 li a { font-weight: normal; padding-left: 16px; } .nav-main ul.level_1 ul.level_2 { background: #c2c2c2; } .nav-footer ul.level_1 { display: -ms-flex; display: flex; flex-wrap: nowrap; /* justify-content: space-between;*/ } .nav-footer ul.level_1 li:nth-child(1) { flex-grow: 1; } .nav-footer ul.level_1 li:nth-child(2) { text-align: center; flex-grow: 1; position: relative; } .nav-footer ul.level_1 li:nth-child(2):before { position: absolute; content: '|'; left: -4px; color: #ffffff; line-height: 1.389; } .nav-footer ul.level_1 li:nth-child(2):after { position: absolute; content: '|'; right: -5px; color: #ffffff; line-height: 1.389; } .nav-footer ul.level_1 li:nth-child(3) { text-align: right; flex-grow: 1; } /* Hamburger */ /*@media (min-width: 48em) { .nav-toggler { display: none; }}*/ .hamburg { display: block; /* background: #0074A3; */ border: 0 solid #4C6271; /* border-radius: 8px;*/ position: relative; margin-left: auto; /*margin-right: auto;*/ width: 64px; height:44px; } div.hamburg.checked { display: block; /*background: #ffffff;*/ border: 0 solid #ffffff; /*border-radius: 8px; */ position: relative; margin-left: auto; /*margin-right: auto;*/ width: 64px; height:46px; } .line { position: absolute; left:0; height: 9px; width: 64px; background: #ffffff; display: block; transition: 0.5s; transform-origin: center; border-radius: 4px; } div.hamburg.checked .line { background: #ffffff; } .line:nth-child(1) { top: 0px; } .line:nth-child(2) { top: 18px; } .line:nth-child(3) { top: 37px; } .hamburg.checked .line:nth-child(1){ transform: translateY(18px) rotate(-45deg); } .hamburg.checked .line:nth-child(2){ opacity:0; } .hamburg.checked .line:nth-child(3){ transform: translateY(-18px) rotate(45deg); } .content-gallery li { list-style: none; } .gallery-partner ul { display: -ms-grid; display: grid; -ms-grid-columns: 1fr 1fr; grid-template-columns: 1fr 1fr; -ms-grid-rows: 1fr 1fr 1fr 1fr 1fr 1fr; grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr; align-items: center; justify-content:center; } .gallery-partner ul li:nth-child(even) {padding: 12px 0 12px 12px;} .gallery-partner ul li:nth-child(odd) {padding: 12px 12px 12px 0;} .gallery-partner img { margin: 0 auto; width: 100%; } @media only screen and (min-width: 768px) { .gallery-partner ul { display: -ms-grid; display: grid; -ms-grid-columns: 1fr 1fr 1fr 1fr; grid-template-columns: 1fr 1fr 1fr 1fr; -ms-grid-rows: 1fr 2fr 1fr 1fr; grid-template-rows: 1fr 2fr 1fr 1fr; align-items: center; justify-content:space-evenly; } .gallery-partner ul li {padding: 0 10px} .gallery-partner ul li:nth-child(4n+1) {padding: 0 60px 0 0;} .gallery-partner ul li:nth-child(4n+4) {padding: 0 0 0 60px;} .gallery-partner ul li:nth-child(4n+2) {padding: 0 40px 0 20px;} .gallery-partner ul li:nth-child(4n+3) {padding: 0 20px 0 40px;} .gallery-partner ul li {height: fit-content; } } .grid.veranstaltungen > div { background: #DEE0E9; border-radius: 10px; padding: 0 30px; position: relative; margin-bottom: 30px; } .grid.veranstaltungen > div > *:nth-child(1) { padding-top: 30px;display: block;border-bottom: solid 3px #16B6BC; overflow: hidden;} .grid.veranstaltungen > div > *:nth-child(2) { padding-top: 15px; } .grid.veranstaltungen > div > *:nth-child(1) { -ms-grid-column: 1; grid-column: 1; -ms-grid-row: 1; grid-row: 1;} .grid.veranstaltungen > div > *:nth-child(2) { -ms-grid-column: 1; grid-column: 1; -ms-grid-row: 2; grid-row: 2; } .grid.veranstaltungen > div > *:nth-child(1):after { position: absolute; content: url('../../files/themes/h2well/img/pfeil.svg'); bottom: 20px; right: 30px; z-index: 1; } .square > * { aspect-ratio: 4; } @media only screen and (min-width: 768px) { .grid.veranstaltungen { display: -ms-grid; display: grid; grid-gap: 30px; -ms-grid-columns: 1fr 1fr; grid-template-columns: 1fr 1fr; -ms-grid-rows: 1fr 1fr 1fr 1fr; grid-template-rows: 1fr 1fr 1fr 1fr; } .grid.veranstaltungen div:nth-child(1) {-ms-grid-column: 1; grid-column: 1; -ms-grid-row: 1; grid-row: 1;} .grid.veranstaltungen div:nth-child(2) {-ms-grid-column: 2; grid-column: 2; -ms-grid-row: 1; grid-row: 1;} .grid.veranstaltungen div:nth-child(3) {-ms-grid-column: 1; grid-column: 1; -ms-grid-row: 2; grid-row: 2;} .grid.veranstaltungen div:nth-child(4) {-ms-grid-column: 2; grid-column: 2; -ms-grid-row: 2; grid-row: 2;} .grid.veranstaltungen div:nth-child(5) {-ms-grid-column: 1; grid-column: 1; -ms-grid-row: 3; grid-row: 3;} .grid.veranstaltungen div:nth-child(6) {-ms-grid-column: 2; grid-column: 2; -ms-grid-row: 3; grid-row: 3;} .grid.veranstaltungen div:nth-child(7) {-ms-grid-column: 1; grid-column: 1; -ms-grid-row: 4; grid-row: 4;} .grid.veranstaltungen div:nth-child(8) {-ms-grid-column: 2; grid-column: 2; -ms-grid-row: 4; grid-row: 4;} .grid.veranstaltungen > div { margin-bottom: inherit; display: -ms-grid; display: grid; -ms-grid-columns: 1fr; grid-template-columns: 1fr; -ms-grid-rows: 1.4fr 1fr; grid-template-rows: 1.4fr 1fr; } .square > * { aspect-ratio: 1.05; } } @media only screen and (min-width: 960px) { .grid.veranstaltungen { display: -ms-grid; display: grid; grid-gap: 30px; -ms-grid-columns: 1fr 1fr 1fr 1fr; grid-template-columns: 1fr 1fr 1fr 1fr; -ms-grid-rows: 1fr 1fr; grid-template-rows: 1fr 1fr; } .grid.veranstaltungen div:nth-child(1) {-ms-grid-column: 1; grid-column: 1; -ms-grid-row: 1; grid-row: 1;} .grid.veranstaltungen div:nth-child(2) {-ms-grid-column: 2; grid-column: 2; -ms-grid-row: 1; grid-row: 1;} .grid.veranstaltungen div:nth-child(3) {-ms-grid-column: 3; grid-column: 3; -ms-grid-row: 1; grid-row: 1;} .grid.veranstaltungen div:nth-child(4) {-ms-grid-column: 4; grid-column: 4; -ms-grid-row: 1; grid-row: 1;} .grid.veranstaltungen div:nth-child(5) {-ms-grid-column: 1; grid-column: 1; -ms-grid-row: 2; grid-row: 2;} .grid.veranstaltungen div:nth-child(6) {-ms-grid-column: 2; grid-column: 2; -ms-grid-row: 2; grid-row: 2;} .grid.veranstaltungen div:nth-child(7) {-ms-grid-column: 3; grid-column: 3; -ms-grid-row: 2; grid-row: 2;} .grid.veranstaltungen div:nth-child(8) {-ms-grid-column: 4; grid-column: 4; -ms-grid-row: 2; grid-row: 2;} } .veranstaltungen a, .neuigkeiten a {color: #01344C; font-family: Rawson-SemiBold, sans-serif; line-height: 1.1; font-size: 24px; } .veranstaltungen time, .neuigkeiten time { color: #01344C; font-family: Rawson-Medium, sans-serif; font-size: 18px; } .hyperlink-archiv { text-align: right; margin-top: 24px; } .hyperlink-archiv a { text-decoration: underline; color: #054763; font-family: Rawson-Medium, sans-serif; font-size: 18px; line-height: 1.22; } .rsts-slide .block { padding-left: 0 !important; } .slider-testimonials { padding-left: 0px !important; } .slider-testimonials p { margin-top: 0 !important; } @media only screen and (min-width: 500px) { .slider-testimonials .rsts-slide > div { display: flex; /* align-items: center; justify-content:center;*/ } .slider-testimonials .rsts-slide > div > *:nth-child(1) {flex: 1;} .slider-testimonials .rsts-slide > div > *:nth-child(2) {flex: 2;} .slider-testimonials .rsts-slide > div > *:nth-child(2) { padding-left: 24px !important; } } @media only screen and (min-width: 1024px) { .slider-testimonials .rsts-slide > div > *:nth-child(1) {flex: 1;} .slider-testimonials .rsts-slide > div > *:nth-child(2) {flex: 1.55;} .slider-testimonials .rsts-slide > div > *:nth-child(2) { padding-left: 80px !important; } } @media only screen and (min-width: 1200px) { .slider-testimonials .rsts-slide > div { align-items: center; padding-left: 160px; } .slider-testimonials .rsts-slide > div > *:nth-child(2) {align-items: center;} } .slider-testimonials .rsts-slide > div > *:nth-child(2) { font-family: Rawson-RegularIt, sans-serif; line-height: 1.5; font-size: 24px; } .slider-testimonials .rsts-nav { position: revert; text-align: center; padding-top: 75px; padding-bottom: 75px; } .slider-testimonials .rsts-nav-bullets a { display: inline-block; width: 36px; height: 7px; overflow: hidden; margin: 12px 12px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; outline: none; text-align: left; text-indent: -999px; background-color: #fff; background-color: rgba(255,255,255,1); -webkit-background-clip: padding; -moz-background-clip: padding; background-clip: padding-box; -webkit-box-shadow: 0 0 2px #fff;; -moz-box-shadow: 0 0 2px #fff;; box-shadow: 0 0 2px #fff;; } .slider-testimonials .rsts-nav-bullets a:hover, .slider-testimonials .rsts-nav-bullets a.active { background-color: #054763; -webkit-box-shadow: 0 0 2px #054763; -moz-box-shadow: 0 0 2px #054763; box-shadow: 0 0 2px #054763; } .slider-testimonials figcaption.caption { padding: 10px 30px; color: #fff; background: #16B6BC; font-family: Rawson-Bold, sans-serif; line-height: 1.25; font-size: 28px; } @media only screen and (min-width: 1200px) { .slider-testimonials figure.image_container { position: relative; } .slider-testimonials figcaption.caption { position: absolute; left: -70px; top: 73%; z-index: 10; padding: 10px 30px; } } /* Slider Technik */ .slider-technik { padding-left: 0px !important; } .slider-technik .rsts-slide > div { display: -ms-grid; display: grid; -ms-grid-columns: 1fr 1fr; grid-template-columns: 1fr 1fr; -ms-grid-rows: 1fr; grid-template-rows: 1fr; justify-content:center; /*padding-left: 160px;*/ } .slider-technik .rsts-slide > div > *:nth-child(2) { padding: 80px 80px 80px 50px !important; } .slider-technik p { font-family: Rawson-Medium, sans-serif; line-height: 1.75; font-size: 20px; color: #fff; } .slider-technik h2 { font-family: Rawson-Bold, sans-serif; line-height: 1; font-size: 32px; color: #fff; text-transform: revert; } .slider-technik .rsts-nav { position: revert; text-align: center; padding-top: 75px; padding-bottom: 75px; } .slider-technik .rsts-nav-bullets a { display: inline-block; width: 36px; height: 7px; overflow: hidden; margin: 12px 12px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; outline: none; text-align: left; text-indent: -999px; background-color: #A3ADB7; /* background-color: rgba(255,255,255,1); */ -webkit-background-clip: padding; -moz-background-clip: padding; background-clip: padding-box; -webkit-box-shadow: 0 0 2px #A3ADB7;; -moz-box-shadow: 0 0 2px #A3ADB7;; box-shadow: 0 0 2px #A3ADB7;; } .slider-technik .rsts-nav-bullets a:hover, .slider-technik .rsts-nav-bullets a.active { background-color: #054763; -webkit-box-shadow: 0 0 2px #054763; -moz-box-shadow: 0 0 2px #054763; box-shadow: 0 0 2px #054763; } .slider-technik figure.image_container { position: relative; } .slider-technik figcaption.caption { position: absolute; left: -70px; top: 73%; z-index: 10; padding: 10px 30px; color: #fff; background: #16B6BC; font-family: Rawson-Bold, sans-serif; line-height: 1.25; font-size: 28px; } .bg-technik { position: relative; } .bg-technik:before { position: absolute; width: 70%; top: 0; right: 0; bottom: 0; content: ''; background-image: url("../../files/themes/h2well/img/background-technik.svg"); background-repeat: no-repeat; background-size: 100%; z-index: -1; } /* Tabs mit radio-Buttons */ .tabbed figure { display: block; margin-left: 0; clear: both; } .tabbed > input, .tabbed figure > div { display: none; } .tabbed figure>div { padding: 20px; width: 100%; background: #126787; } #tab1:checked ~ figure .tab1, #tab2:checked ~ figure .tab2, #tab3:checked ~ figure .tab3, #tab4:checked ~ figure .tab4 { display: block; } nav label { float: left; padding: 15px 15px; width: 22%; background-image: url("../../files/themes/h2well/img/tabbed-berufsbild.svg"); background-repeat: no-repeat; background-size: contain; /* aspect-ratio: 0.9; */ margin-right: 4%; display: flow-root; position: relative; } nav label::before { content: ''; float: left; padding-bottom: 115%; } nav label span { position: absolute; left:18px; bottom: 15%; color: #fff; font-family: Rawson-SemiBold, sans-serif; line-height: 1.2; font-size: 20px; } nav label:last-child { margin-right: 0; } /*nav label:nth-child(1) { border-left: 1px solid silver; } */ /* nav label:hover { background: hsl(210,50%,40%); } nav label:active { background: #ffffff; } */ /* #tab1:checked ~ nav label[for="tab1"], #tab2:checked ~ nav label[for="tab2"], #tab3:checked ~ nav label[for="tab3"], #tab4:checked ~ nav label[for="tab4"] { background: white; color: #111; position: relative; } */ #tab1:checked ~ nav label[for="tab1"]:after, #tab2:checked ~ nav label[for="tab2"]:after, #tab3:checked ~ nav label[for="tab3"]:after, #tab4:checked ~ nav label[for="tab4"]:after { content: ""; display: block; position: absolute; height: 2px; width: 100%; left: 0; bottom: -2px; height: 10px; background-image: url("../../files/themes/h2well/img/tabbed-line-select.png") } .tabbed { padding-left: 160px; } .tabbed .block { padding-left: 0px !important; } .tabbed figure { color: #fff; background: #16B6BC; font-family: Rawson-Medium, sans-serif; line-height: 1.667; font-size: 18px; } .tabbed .block > * { color: #fff !important; } .content-headline.label { /*position: relative;*/ } .content-headline.label { position: absolute; width: 300px; margin-top: 140px; left: -215px; z-index: 1; transform: rotate(270deg ); text-align: right; text-transform: uppercase; font-family: Rawson-Regular, sans-serif; line-height: 1.2; font-size: 20px; } .content-headline.label span { color: #16B6BC !important; } /* Accordion */ .ce_accordion { margin-bottom: 15px; } .ui-accordion-header { background: #2FA0F2; font-family: Rawson-Bold, sans-serif; line-height: 1.25 ; font-size: 28px; color: #fff; padding: 15px 30px; } .ui-accordion-content { background: #F2F2F2; padding: 32px 48px; } .ui-accordion-content p:first-child { margin-top: 0; } .ui-accordion-content p:last-child { margin-bottom: 0; } .ui-accordion-content > div > div { border-bottom: dotted 2px #2C3A58; padding: 15px 0; } .ui-accordion-content > div > div:first-child { padding: 0 0 15px 0; } .ui-accordion-content > div > div:last-child { border-bottom: 0; padding: 15px 0 0 0; } .ui-accordion-content > div > div > * { font-family: Rawson-Regular, sans-serif; line-height: 1.9 ; font-size: 18px; color: #2C3A58; } .ui-accordion-icons.ui-accordion-header-collapsed, .ui-accordion-icons.ui-accordion-header-active { position: relative; } .ui-accordion-icons.ui-accordion-header-collapsed::after { content: url('/files/themes/h2well/img/accordion-arrow-down.svg'); position: absolute; right: 30px; top: 15px; z-index: 10; } .ui-accordion-icons.ui-accordion-header-active::after { content: url('/files/themes/h2well/img/accordion-arrow-up.svg'); position: absolute; right: 30px; top: 15px; z-index: 10; } /* Timeline Accordion */ .timeline .ui-accordion-icons.ui-accordion-header-collapsed::after { content: ''; } .timeline .ui-accordion-icons.ui-accordion-header-active::after { content:''); } .timeline .ui-accordion-header { background: inherit; font-family: inherit; line-height: inherit ; font-size: inherit; color: inherit; padding: inherit; } .timeline .ce_accordion { margin-bottom: inherit; } .timeline .ui-accordion-content { background: inherit; padding: inherit; } .timeline section { position: relative; min-height: 40px; padding-bottom: 20px; } .timeline section::before { position: absolute; content: ''; width: 2px; height: 100%; background: silver; left: 20px; top: 0; z-index: -2; } .timeline section:first-child::after { position: absolute; content: ''; width: 20px; height: 2px; background: silver; left: 10px; top: 0; z-index: 2; } .timeline section:last-child::after { position: absolute; content: ''; width: 20px; height: 2px; background: silver; left: 10px; bottom: 0; z-index: 2; } .timeline section .ui-accordion-header span, .timeline section .ui-accordion-content { padding-left: 60px; } .timeline section.tl-year::after { content: ''; background-color: silver; position: absolute; width: 20px; height: 2px; top: 10px; left: 0; } .timeline section.tl-year::after { content: ''; background-color: silver; position: absolute; width: 20px; height: 2px; top: 10px; left: 0; } .timeline p { margin: 0; } .timeline .tl-year .ui-accordion-content { display: none !important; } .timeline .tl-year .ui-accordion-header { position: absolute; left: -100px; top: 0; } .tl-project .ui-accordion-header { color: #01344C; cursor: pointer; } .timeline .tl-project .ui-accordion-header::after { content: ''; background-color: #fff; position: absolute; width: 15px; height: 15px; top: 5px; left: 14px; border-radius: 7px; border: 2px solid silver; z-index: +10; } .timeline .tl-project .ui-state-active.ui-accordion-header::after { background-color: red; border: 2px solid silver; } .timeline .tl-project .ui-state-active.ui-accordion-header, .timeline .tl-project .ui-state-hover.ui-accordion-header { font-family: Rawson-Bold, sans-serif; } .timeline .tl-project .ui-state-active.ui-accordion-header { cursor: none; } .timeline .tl-project .ui-state-hover.ui-accordion-header::after { background-color: red; border: 2px solid silver; -webkit-animation: pulsate 1s ease-out; -webkit-animation-iteration-count: infinite; /* opacity: 0.0; */ } @-webkit-keyframes pulsate { 0% { -webkit-transform: scale(1, 1); opacity: 1.0; } 50% { opacity: 1.0; } 100% { -webkit-transform: scale(1.5, 1.5); opacity: 0.0; } } .bf-lottie { border: solid 4px #fff; border-radius: 30px; display: inline-block; padding-left: 0 !important; max-width: 150px; max-height: 150px; } .content-downloads { margin-left: 0; width:100%; max-width: 648px; margin: 0 auto; } .content-downloads ul { list-style: none; } .content-downloads ul li { background: #DEE0E9; margin-bottom: 20px; padding: 15px 70px 15px 30px; position: relative; } .content-downloads ul li:last-child { margin-bottom: 0; } .content-downloads a, .content-downloads span { font-family: Rawson-SemiBold, sans-serif; line-height: 1.2; font-size: 20px; color: #01344C; } .content-downloads a:after { position: absolute; content: url('../../files/themes/h2well/img/download.svg'); right:30px; top: calc(50% - 15px); } .form-kontakt { width: 100%; max-width: 920px; } .form-kontakt input, .form-kontakt textarea { widtH: 100%; } .form-kontakt-name, .form-kontakt-datenschutz {display: flex;} .form-kontakt-name > div {flex: 1;} .form-kontakt-name div:first-child {margin-right: 4.209183673%} .form-kontakt-datenschutz .widget-checkbox label {display: none;} .form-kontakt-datenschutz div:first-child { margin-right: 15px} .form-kontakt-datenschutz span input {width: auto;} .form-kontakt-datenschutz p {margin: 0;} .form-kontakt * { font-size: 18px; line-height: 1.44; } .form-kontakt .widget-submit {text-align: right;} .form-kontakt-name, .form-kontakt-datenschutz, .form-kontakt .widget.mandatory {margin-bottom: 40px;} .form-kontakt .widget-textarea {margin-bottom: 20px;} .form-kontakt input, .form-kontakt textarea { padding: 8px 16px; border-radius: 8px; font-family: Rawson-MediumIt, sans-serif; line-height: 1.2; font-size: 18px; color: #A3ADB7 !important; } .button-light button { width: 100%; max-width: 254px; padding: 16px; background: inherit; background-image: url("../../files/themes/h2well/img/button.svg"); background-repeat: no-repeat; background-size: 100%; color: #054763 !important; font-family: Rawson-Bold, sans-serif; line-height: 1.2; font-size: 20px; } #iw-fixed-button img { display: none; } @media only screen and (max-width: 499px) { #iw-fixed-button { background-color: #ee4663; text-align: center; color: #fff; font-family: Rawson-Bold, sans-serif; line-height: 1.2; font-size: 24px; display: block; padding: 16px; } } @media only screen and (min-width: 500px) { #iw-fixed-button span {display: none;} #iw-fixed-button img {display: block;} #iw-fixed-button { position: fixed; top: 25%; transition: all 0.3 ease; z-index: 100; } #iw-fixed-button img { width: 70px; } #iw-fixed-button.animate { margin-left: 0; left: -10px; transition: all 0.3s ease-in-out; } #iw-fixed-button.animate.move { /*left: 0;*/ margin-left: 10px; transition: all 0.3s ease-in-out; } } .iw-card { margin-bottom: 24px; } .iw-card img { margin: 0 auto; } .iw-card .c1 { background: #006787; padding: 50px; border-radius: 2em 2em 0 0; text-align: center; } .iw-card .c2 { flex: 2; background: #fff; padding: 2vw 3vw; border-radius: 0 0 2em 2em; } .iw-card .c2 * { font-family: Rawson-Medium, sans-serif; } .iw-card .caption { color: #fff; font-family: Rawson-Bold, sans-serif; font-size: 160%; margin-top: 1em; } @media only screen and (min-width: 500px) { .iw-card { display: flex; margin-bottom: 80px; } .iw-card .c1 { flex: 1; background: #006787; padding: 3vw 2vw; border-radius: 2em 0 0 2em; text-align: center; } .iw-card .c2 { border-radius: 0 2em 2em 0; } } /* .ce_accordion { margin-bottom: 15px; } .ui-accordion-header { background: #2FA0F2; font-family: Rawson-Bold, sans-serif; line-height: 1.25 ; font-size: 28px; color: #fff; padding: 15px 30px; } .ui-accordion-content { background: #F2F2F2; padding: 32px 48px; } .ui-accordion-content p:first-child { margin-top: 0; } .ui-accordion-content p:last-child { margin-bottom: 0; } .ui-accordion-content > div > div { border-bottom: dotted 2px #2C3A58; padding: 15px 0; } .ui-accordion-content > div > div:first-child { padding: 0 0 15px 0; } .ui-accordion-content > div > div:last-child { border-bottom: 0; padding: 15px 0 0 0; } .ui-accordion-content > div > div > * { font-family: Rawson-Regular, sans-serif; line-height: 1.9 ; font-size: 18px; color: #2C3A58; } .ui-accordion-icons.ui-accordion-header-collapsed, .ui-accordion-icons.ui-accordion-header-active { position: relative; } .ui-accordion-icons.ui-accordion-header-collapsed::after { content: url('/files/themes/h2well/img/accordion-arrow-down.svg'); position: absolute; right: 30px; top: 15px; z-index: 10; } .ui-accordion-icons.ui-accordion-header-active::after { content: url('/files/themes/h2well/img/accordion-arrow-up.svg'); position: absolute; right: 30px; top: 15px; z-index: 10; } */ #mitmachen .form-kontakt-name > div {flex: 1;} #mitmachen input, #mitmachen select { font-family: Rawson-RegularIt, sans-serif; /* line-height: 1.2;*/ font-size: 18px; color: #A3ADB7 !important ; border-bottom: 1px solid #CCC; width: 100%; } ::placeholder { opacity: 1 !important;color: grey !important ;} :-ms-input-placeholder { opacity: 1;color: grey !important ;} ::-ms-input-placeholder { opacity: 1;color: grey !important ;} #mitmachen select option:first-child { opacity: 1 !important; color: grey !important ; } #mitmachen select { -moz-appearance: none; -webkit-appearance: none; appearance: none; border: none; color: #A3ADB7 !important ; border-bottom: 1px solid #CCC; } #mitmachen fieldset.form-kontakt-name > div { margin-right: 25px; width: calc((100%-75px)/4); } #mitmachen fieldset.form-kontakt-name.col-2 > div { margin-right: 25px; width: calc((100%-25px)/2); } #mitmachen fieldset.form-kontakt-name > div:nth-child(4) { margin-right: 0;} #mitmachen fieldset.form-kontakt-name.col-2 > div:last-child { margin-right: 0; } @media screen and (max-width: 768px) { #mitmachen .form-kontakt-name {display: block !important; } #mitmachen fieldset.form-kontakt-name > div { margin-right: 0 !important; width: 100% !important; } } #mitmachen .checkbox { width: 20px; height: 20px; padding-top: 4px; } #mitmachen fieldset.form-kontakt-datenschutz > div:nth-child(1) { width: 100px; } #mitmachen .widget-submit {text-align: right;} #mitmachen .widget-submit button { background: #006787; border: 0; color: #fff; padding: 10px 35px; font-family: Rawson-Bold, sans-serif; line-height: 1.2; font-size: 20px; } @media screen and (max-width: 768px) { #mitmachen .widget-submit {text-align: center;} } .sm-fixed-button { position: fixed; transition: all 0.3 ease; z-index: 100; background: #006787; width: 90px; height: 80px; display: flex; align-items: center; justify-content: center; padding-left: 10px; } .sm-fixed-button img { width: 58px; } .sm-fixed-button.animate { margin-left: 0; left: -10px; transition: all 0.3s ease-in-out; } .sm-fixed-button.animate.move {margin-left: 10px; transition: all 0.3s ease-in-out;} #sm-insta.sm-fixed-button { top: 500px; border-radius: 0 15px 0 0;} #sm-mail.sm-fixed-button { top: 585px; } #sm-twitter.sm-fixed-button { top: 670px; border-radius: 0 0 15px 0;} .button a { width: 100%; max-width: 254px; padding: 2% 4%; background: inherit; background-image: url("../../files/themes/h2well/img/button.svg"); background-repeat: no-repeat; background-size: 100%; color: #054763 !important; font-family: Rawson-Bold, sans-serif; line-height: 1.2; font-size: 20px; } .button { margin-top: 40px;} /* Container & Listen-Reset */ .content-gallery--cols-3 ul { display: grid; grid-template-columns: 1fr; /* Mobile: 1-spaltig */ gap: 1.5rem; list-style: none; padding: 0; margin: 0; } /* Card & Figure Setup */ .content-gallery--cols-3 figure { display: flex; flex-direction: column; height: 100%; margin: 0; background-color: #f8f9fa; /* Subtiler Hintergrund für die Karte */ border-radius: 8px; overflow: hidden; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05); transition: transform 0.2s ease, box-shadow 0.2s ease; } .content-gallery--cols-3 figure:hover { transform: translateY(-4px); box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1); } /* Bild-Anpassung */ .content-gallery--cols-3 img { width: 100%; height: auto; aspect-ratio: 4 / 3; /* Sorgt für einheitliche Bildhöhen (anpassbar: 1/1, 3/4 etc.) */ object-fit: cover; display: block; } /* Bildunterschrift */ .content-gallery--cols-3 figcaption { padding: 1rem; font-size: 0.9rem; line-height: 1.45; color: #4a5568; /* margin-top: auto; Shiftet Text nach unten, falls Reihen unterschiedlich hoch sind */ } /* Responsive Breakpoints */ @media (min-width: 576px) { .content-gallery--cols-3 ul { grid-template-columns: repeat(2, 1fr); /* Tablet: 2-spaltig */ } } @media (min-width: 992px) { .content-gallery--cols-3 ul { grid-template-columns: repeat(3, 1fr); /* Desktop: 3-spaltig */ } } /* Strikte Linksausrichtung für das gesamte Formular */ form.form-one-stop-shop, form.form-one-stop-shop * { text-align: left !important; } /* Container-Card */ form.form-one-stop-shop fieldset { border: 1px solid #e2e8f0; border-radius: 8px; background-color: #ffffff; padding: 2rem; margin-bottom: 2.5rem; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.04); } /* Hauptkategorie-Überschrift (Ausgangslage & Projekt) */ form.form-one-stop-shop fieldset > legend { font-size: 1.15rem; font-weight: 800; letter-spacing: 0.5px; background-color: #ffffff; } /* Einzelne Fragen (innere Fieldsets & Labels) resetten */ form.form-one-stop-shop .widget fieldset.radio_container, form.form-one-stop-shop .widget fieldset.checkbox_container { border: none !important; padding: 0 !important; margin: 0 !important; background: transparent !important; box-shadow: none !important; } /* Fragentext styling (Überschriften der Fragen) */ form.form-one-stop-shop .widget legend, form.form-one-stop-shop .widget > label { font-size: 1rem; font-weight: 700; text-transform: none !important; /* Inaktiviert die störenden GROSSBUCHSTABEN */ line-height: 1.4; margin-bottom: 0.75rem; display: block; width: 100%; } /* Radio-Buttons horizontal & auf einer Höhe ausrichten */ form.form-one-stop-shop .radio_container span { display: inline-flex !important; align-items: center; margin-right: 2rem; margin-top: 0.25rem; cursor: pointer; } form.form-one-stop-shop .radio_container span.invisible { display: block !important; } form.form-one-stop-shop .widget { margin-bottom: 1.5rem; } form.form-one-stop-shop .radio_container input[type="radio"] { margin: 0 0.5rem 0 0 !important; width: 1.15rem; height: 1.15rem; accent-color: #0a3144; cursor: pointer; } form.form-one-stop-shop .radio_container label { font-size: 0.95rem; font-weight: 500; cursor: pointer; margin: 0 !important; } /* Textareas sauber unter die Frage setzen */ form.form-one-stop-shop textarea { width: 100%; border: 1px solid #cbd5e1; border-radius: 6px; padding: 0.75rem 1rem; font-family: inherit; font-size: 0.95rem; background-color: #f8fafc; box-sizing: border-box; margin-top: 0.25rem; } form.form-one-stop-shop textarea:focus { outline: none; border-color: #62c4d2; background-color: #ffffff; box-shadow: 0 0 0 3px rgba(98, 196, 210, 0.2); } /* Text-Eingabefelder (Name, Unternehmen, Mail, Telefon) & Select-Dropdowns */ form.form-one-stop-shop input.text, form.form-one-stop-shop select.select { display: block !important; width: 100% !important; padding: 0.75rem 1rem !important; border: 1px solid #cbd5e1 !important; border-radius: 6px !important; font-family: inherit !important; font-size: 0.95rem !important; background-color: #f8fafc !important; box-sizing: border-box !important; margin-top: 0.35rem !important; margin-bottom: 0.5rem !important; height: auto !important; transition: border-color 0.2s, background-color 0.2s, box-shadow 0.2s !important; } /* Custom Pfeil für das Select-Dropdown */ form.form-one-stop-shop select.select { appearance: none !important; -webkit-appearance: none !important; -moz-appearance: none !important; background-image: url("data:image/svg+xml;utf8,") !important; background-repeat: no-repeat !important; background-position: right 0.75rem center !important; background-size: 1.25rem !important; padding-right: 2.5rem !important; cursor: pointer !important; } /* Focus-Zustand für Felder & Selects */ form.form-one-stop-shop input.text:focus, form.form-one-stop-shop select.select:focus { outline: none !important; border-color: #62c4d2 !important; background-color: #ffffff !important; box-shadow: 0 0 0 3px rgba(98, 196, 210, 0.2) !important; } /* Absende-Button */ form.form-one-stop-shop .widget-submit { margin-top: 2rem !important; text-align: right !important; } form.form-one-stop-shop button.submit, form.form-one-stop-shop input.submit { display: inline-block !important; background-color: #054763 !important; color: #ffffff !important; font-family: inherit !important; font-weight: 700 !important; font-size: 1rem !important; padding: 0.85rem 2.5rem !important; border: none !important; border-radius: 6px !important; cursor: pointer !important; transition: background-color 0.2s ease, transform 0.1s ease !important; box-shadow: 0 4px 6px -1px rgba(10, 49, 68, 0.2) !important; text-decoration: none !important; } /* Hover-Zustand für Button */ form.form-one-stop-shop button.submit:hover, form.form-one-stop-shop input.submit:hover { background-color: #EBF0F5 !important; color: #0a3144 !important; transform: translateY(-1px) !important; } /* Container für Checkboxen strukturieren */ form.form-one-stop-shop .checkbox_container { display: flex !important; flex-direction: column !important; gap: 0.5rem !important; margin-top: 0.75rem !important; margin-bottom: 1.5rem !important; } /* Jedes Span (Checkbox + Label) als klickbarer Block */ form.form-one-stop-shop .checkbox_container span { display: flex !important; align-items: center !important; background-color: #f8fafc !important; border: 1px solid #e2e8f0 !important; border-radius: 6px !important; padding: 0.75rem 1rem !important; margin: 0 !important; cursor: pointer !important; transition: background-color 0.2s ease, border-color 0.2s ease !important; } /* Hover-Zustand für die Kacheln */ form.form-one-stop-shop .checkbox_container span:hover { background-color: #f1f5f9 !important; border-color: #cbd5e1 !important; } /* Checkbox Checkbox-Icon Styling */ form.form-one-stop-shop .checkbox_container input[type="checkbox"] { flex-shrink: 0 !important; width: 1.25rem !important; height: 1.25rem !important; margin: 0 0.85rem 0 0 !important; accent-color: #0a3144 !important; cursor: pointer !important; } /* Label-Text innerhalb des Spans */ form.form-one-stop-shop .checkbox_container label { display: inline-block !important; font-size: 0.95rem !important; font-weight: 500 !important; margin: 0 !important; cursor: pointer !important; line-height: 1.4 !important; } .slide11 { animation:fade11 60s infinite; -webkit-animation:fade11 60s infinite; } .slide12 { -webkit-animation: fade12 60s linear infinite; animation: fade12 60s linear infinite; } .slide21 { animation:fade21 60s infinite; -webkit-animation:fade21 60s infinite; } .slide22 { -webkit-animation: fade22 60s linear infinite; animation: fade22 60s linear infinite; } .slide31 { animation:fade31 60s infinite; -webkit-animation:fade31 60s infinite; } .slide32 { -webkit-animation: fade32 60s infinite; animation: fade32 60s infinite; } .slide41 { animation:fade41 60s infinite; -webkit-animation:fade41 60s infinite; } .slide42 { -webkit-animation: fade42 60s linear infinite; animation: fade42 60s linear infinite; } .slide51 { animation:fade51 60s infinite; -webkit-animation:fade51 60s infinite; } .slide52 { -webkit-animation: fade52 60s linear infinite; animation: fade52 60s linear infinite; } @keyframes fade11 { 0% { opacity: 0 } 5% { opacity: 0 } 10% { opacity: 1 } 15% { opacity: 1 } 20% { opacity: 1 } 25% { opacity: 0 } 30% { opacity: 0 } 35% { opacity: 0 } 40% { opacity: 0 } 45% { opacity: 0 } 50% { opacity: 0 } 55% { opacity: 0 } 60% { opacity: 0 } 65% { opacity: 0 } 70% { opacity: 0 } 75% { opacity: 0 } 80% { opacity: 0 } 85% { opacity: 0 } 90% { opacity: 0 } 95% { opacity: 0 } 100% { opacity: 0 } } @keyframes fade12 { 0% { opacity: 0 } 5% { opacity: 0 } 10% { opacity: 0 } 14.0% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 300, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 300, 0, 0, 1); } 14.0186% { -webkit-transform: matrix3d(3.905, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 254.415, 0, 0, 1); transform: matrix3d(3.905, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 254.415, 0, 0, 1);opacity: 0; } 14.0364% { -webkit-transform: matrix3d(4.554, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 213.552, 0, 0, 1); transform: matrix3d(4.554, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 213.552, 0, 0, 1); } 14.056% { -webkit-transform: matrix3d(4.124, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 172.823, 0, 0, 1); transform: matrix3d(4.124, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 172.823, 0, 0, 1); } 14.0816% { -webkit-transform: matrix3d(3.039, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 126.853, 0, 0, 1); transform: matrix3d(3.039, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 126.853, 0, 0, 1); } 14.1122% { -webkit-transform: matrix3d(1.922, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 82.133, 0, 0, 1); transform: matrix3d(1.922, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 82.133, 0, 0, 1); } 14.1258% { -webkit-transform: matrix3d(1.581, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 65.651, 0, 0, 1); transform: matrix3d(1.581, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 65.651, 0, 0, 1); } 14.1682% { -webkit-transform: matrix3d(1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 27.238, 0, 0, 1); transform: matrix3d(1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 27.238, 0, 0, 1);opacity: 1; } 14.1708% { -webkit-transform: matrix3d(1.034, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 25.346, 0, 0, 1); transform: matrix3d(1.034, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 25.346, 0, 0, 1); } 14.2152% { -webkit-transform: matrix3d(0.947, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 2.436, 0, 0, 1); transform: matrix3d(0.947, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 2.436, 0, 0, 1); } 14.2222% { -webkit-transform: matrix3d(0.948, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.948, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 14.3224% { -webkit-transform: matrix3d(0.996, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 13.007, 0, 0, 1); transform: matrix3d(0.996, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 13.007, 0, 0, 1); } 14.394% { -webkit-transform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 10.272, 0, 0, 1); transform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 10.272, 0, 0, 1); } 14.5728% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 1.505, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 1.505, 0, 0, 1); } 14.6666% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 14.7142% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.246, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.246, 0, 0, 1); } 14.7668% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.311, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.311, 0, 0, 1); } 15.1132% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 15.2112% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.007, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.007, 0, 0, 1); } 15.5576% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 15.6556% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 16.0% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 20% { opacity: 1 } 25% { opacity: 0 } 30% { opacity: 0 } 35% { opacity: 0 } 40% { opacity: 0 } 45% { opacity: 0 } 50% { opacity: 0 } 55% { opacity: 0 } 60% { opacity: 0 } 65% { opacity: 0 } 70% { opacity: 0 } 75% { opacity: 0 } 80% { opacity: 0 } 85% { opacity: 0 } 90% { opacity: 0 } 95% { opacity: 0 } 100% { opacity: 0 } } @keyframes fade21 { 0% { opacity: 0 } 5% { opacity: 0 } 10% { opacity: 0 } 15% { opacity: 0 } 20% { opacity: 0 } 25% { opacity: 1 } 30% { opacity: 1 } 35% { opacity: 1 } 40% { opacity: 0 } 45% { opacity: 0 } 50% { opacity: 0 } 55% { opacity: 0 } 60% { opacity: 0 } 65% { opacity: 0 } 70% { opacity: 0 } 75% { opacity: 0 } 80% { opacity: 0 } 85% { opacity: 0 } 90% { opacity: 0 } 95% { opacity: 0 } 100% { opacity: 0 } } @keyframes fade22 { 0% { opacity: 0 } 5% { opacity: 0 } 10% { opacity: 0 } 15% { opacity: 0 } 20% { opacity: 0 } 25% { opacity: 0 } 31.0% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 300, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 300, 0, 0, 1); } 31.0186% { -webkit-transform: matrix3d(3.905, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 254.415, 0, 0, 1); transform: matrix3d(3.905, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 254.415, 0, 0, 1);opacity: 0; } 31.0364% { -webkit-transform: matrix3d(4.554, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 213.552, 0, 0, 1); transform: matrix3d(4.554, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 213.552, 0, 0, 1); } 31.056% { -webkit-transform: matrix3d(4.124, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 172.823, 0, 0, 1); transform: matrix3d(4.124, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 172.823, 0, 0, 1); } 31.0816% { -webkit-transform: matrix3d(3.039, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 126.853, 0, 0, 1); transform: matrix3d(3.039, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 126.853, 0, 0, 1); } 31.1122% { -webkit-transform: matrix3d(1.922, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 82.133, 0, 0, 1); transform: matrix3d(1.922, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 82.133, 0, 0, 1); } 31.1258% { -webkit-transform: matrix3d(1.581, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 65.651, 0, 0, 1); transform: matrix3d(1.581, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 65.651, 0, 0, 1); } 31.1682% { -webkit-transform: matrix3d(1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 27.238, 0, 0, 1); transform: matrix3d(1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 27.238, 0, 0, 1);opacity: 1; } 31.1708% { -webkit-transform: matrix3d(1.034, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 25.346, 0, 0, 1); transform: matrix3d(1.034, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 25.346, 0, 0, 1); } 31.2152% { -webkit-transform: matrix3d(0.947, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 2.436, 0, 0, 1); transform: matrix3d(0.947, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 2.436, 0, 0, 1); } 31.2222% { -webkit-transform: matrix3d(0.948, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.948, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 31.3224% { -webkit-transform: matrix3d(0.996, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 13.007, 0, 0, 1); transform: matrix3d(0.996, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 13.007, 0, 0, 1); } 31.394% { -webkit-transform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 10.272, 0, 0, 1); transform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 10.272, 0, 0, 1); } 31.5728% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 1.505, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 1.505, 0, 0, 1); } 31.6666% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 31.7142% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.246, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.246, 0, 0, 1); } 31.7668% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.311, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.311, 0, 0, 1); } 32.1132% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 32.2112% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.007, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.007, 0, 0, 1); } 32.5576% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 32.6556% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 33.0% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 35% { opacity: 1 } 40% { opacity: 0 } 45% { opacity: 0 } 50% { opacity: 0 } 55% { opacity: 0 } 60% { opacity: 0 } 65% { opacity: 0 } 70% { opacity: 0 } 75% { opacity: 0 } 80% { opacity: 0 } 85% { opacity: 0 } 90% { opacity: 0 } 95% { opacity: 0 } 100% { opacity: 0 } } @keyframes fade31 { 0% { opacity: 0 } 5% { opacity: 0 } 10% { opacity: 0 } 15% { opacity: 0 } 20% { opacity: 0 } 25% { opacity: 0 } 30% { opacity: 0 } 35% { opacity: 0 } 40% { opacity: 0 } 45% { opacity: 1 } 50% { opacity: 1 } 55% { opacity: 1 } 60% { opacity: 0 } 65% { opacity: 0 } 70% { opacity: 0 } 75% { opacity: 0 } 80% { opacity: 0 } 85% { opacity: 0 } 90% { opacity: 0 } 95% { opacity: 0 } 100% { opacity: 0 } } @keyframes fade32 { 0% { opacity: 0 } 5% { opacity: 0 } 10% { opacity: 0 } 15% { opacity: 0 } 20% { opacity: 0 } 25% { opacity: 0 } 30% { opacity: 0 } 35% { opacity: 0 } 40% { opacity: 0 } 45% { opacity: 0 } 50.0% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 300, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 300, 0, 0, 1); } 50.0186% { -webkit-transform: matrix3d(3.905, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 254.415, 0, 0, 1); transform: matrix3d(3.905, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 254.415, 0, 0, 1);opacity: 0; } 50.0364% { -webkit-transform: matrix3d(4.554, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 213.552, 0, 0, 1); transform: matrix3d(4.554, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 213.552, 0, 0, 1); } 50.056% { -webkit-transform: matrix3d(4.124, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 172.823, 0, 0, 1); transform: matrix3d(4.124, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 172.823, 0, 0, 1); } 50.0816% { -webkit-transform: matrix3d(3.039, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 126.853, 0, 0, 1); transform: matrix3d(3.039, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 126.853, 0, 0, 1); } 50.1122% { -webkit-transform: matrix3d(1.922, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 82.133, 0, 0, 1); transform: matrix3d(1.922, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 82.133, 0, 0, 1); } 50.1258% { -webkit-transform: matrix3d(1.581, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 65.651, 0, 0, 1); transform: matrix3d(1.581, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 65.651, 0, 0, 1); } 50.1682% { -webkit-transform: matrix3d(1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 27.238, 0, 0, 1); transform: matrix3d(1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 27.238, 0, 0, 1);opacity: 1; } 50.1708% { -webkit-transform: matrix3d(1.034, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 25.346, 0, 0, 1); transform: matrix3d(1.034, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 25.346, 0, 0, 1); } 50.2152% { -webkit-transform: matrix3d(0.947, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 2.436, 0, 0, 1); transform: matrix3d(0.947, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 2.436, 0, 0, 1); } 50.2222% { -webkit-transform: matrix3d(0.948, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.948, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 50.3224% { -webkit-transform: matrix3d(0.996, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 13.007, 0, 0, 1); transform: matrix3d(0.996, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 13.007, 0, 0, 1); } 50.394% { -webkit-transform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 10.272, 0, 0, 1); transform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 10.272, 0, 0, 1); } 50.5728% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 1.505, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 1.505, 0, 0, 1); } 50.6666% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 50.7142% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.246, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.246, 0, 0, 1); } 50.7668% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.311, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.311, 0, 0, 1); } 51.1132% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 51.2112% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.007, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.007, 0, 0, 1); } 51.5576% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 51.6556% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 52.0% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 55% { opacity: 1 } 60% { opacity: 0 } 65% { opacity: 0 } 70% { opacity: 0 } 75% { opacity: 0 } 80% { opacity: 0 } 85% { opacity: 0 } 90% { opacity: 0 } 95% { opacity: 0 } 100% { opacity: 0 } } @keyframes fade41 { 0% { opacity: 0 } 5% { opacity: 0 } 10% { opacity: 0 } 15% { opacity: 0 } 20% { opacity: 0 } 25% { opacity: 0 } 30% { opacity: 0 } 35% { opacity: 0 } 40% { opacity: 0 } 45% { opacity: 0 } 50% { opacity: 0 } 55% { opacity: 0 } 60% { opacity: 0 } 65% { opacity: 1 } 70% { opacity: 1 } 75% { opacity: 1 } 80% { opacity: 0 } 85% { opacity: 0 } 90% { opacity: 0 } 95% { opacity: 0 } 100% { opacity: 0 } } @keyframes fade42 { 0% { opacity: 0 } 5% { opacity: 0 } 10% { opacity: 0 } 15% { opacity: 0 } 20% { opacity: 0 } 25% { opacity: 0 } 30% { opacity: 0 } 35% { opacity: 0 } 40% { opacity: 0 } 45% { opacity: 0 } 50% { opacity: 0 } 55% { opacity: 0 } 60% { opacity: 0 } 65% { opacity: 0 } 70.0% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 300, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 300, 0, 0, 1); } 70.0186% { -webkit-transform: matrix3d(3.905, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 254.415, 0, 0, 1); transform: matrix3d(3.905, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 254.415, 0, 0, 1);opacity: 0; } 70.0364% { -webkit-transform: matrix3d(4.554, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 213.552, 0, 0, 1); transform: matrix3d(4.554, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 213.552, 0, 0, 1); } 70.056% { -webkit-transform: matrix3d(4.124, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 172.823, 0, 0, 1); transform: matrix3d(4.124, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 172.823, 0, 0, 1); } 70.0816% { -webkit-transform: matrix3d(3.039, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 126.853, 0, 0, 1); transform: matrix3d(3.039, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 126.853, 0, 0, 1); } 70.1122% { -webkit-transform: matrix3d(1.922, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 82.133, 0, 0, 1); transform: matrix3d(1.922, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 82.133, 0, 0, 1); } 70.1258% { -webkit-transform: matrix3d(1.581, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 65.651, 0, 0, 1); transform: matrix3d(1.581, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 65.651, 0, 0, 1); } 70.1682% { -webkit-transform: matrix3d(1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 27.238, 0, 0, 1); transform: matrix3d(1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 27.238, 0, 0, 1);opacity: 1; } 70.1708% { -webkit-transform: matrix3d(1.034, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 25.346, 0, 0, 1); transform: matrix3d(1.034, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 25.346, 0, 0, 1); } 70.2152% { -webkit-transform: matrix3d(0.947, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 2.436, 0, 0, 1); transform: matrix3d(0.947, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 2.436, 0, 0, 1); } 70.2222% { -webkit-transform: matrix3d(0.948, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.948, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 70.3224% { -webkit-transform: matrix3d(0.996, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 13.007, 0, 0, 1); transform: matrix3d(0.996, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 13.007, 0, 0, 1); } 70.394% { -webkit-transform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 10.272, 0, 0, 1); transform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 10.272, 0, 0, 1); } 70.5728% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 1.505, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 1.505, 0, 0, 1); } 70.6666% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 70.7142% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.246, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.246, 0, 0, 1); } 70.7668% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.311, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.311, 0, 0, 1); } 71.1132% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 71.2112% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.007, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.007, 0, 0, 1); } 71.5576% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 71.6556% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 72.0% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 75% { opacity: 1 } 80% { opacity: 0 } 85% { opacity: 0 } 90% { opacity: 0 } 95% { opacity: 0 } 100% { opacity: 0 } } @keyframes fade51 { 0% { opacity: 0 } 5% { opacity: 0 } 10% { opacity: 0 } 15% { opacity: 0 } 20% { opacity: 0 } 25% { opacity: 0 } 30% { opacity: 0 } 35% { opacity: 0 } 40% { opacity: 0 } 45% { opacity: 0 } 50% { opacity: 0 } 55% { opacity: 0 } 60% { opacity: 0 } 65% { opacity: 0 } 70% { opacity: 0 } 75% { opacity: 0 } 80% { opacity: 0 } 85% { opacity: 1 } 90% { opacity: 1 } 95% { opacity: 1 } 100% { opacity: 0 } } @keyframes fade52 { 0% { opacity: 0 } 5% { opacity: 0 } 10% { opacity: 0 } 15% { opacity: 0 } 20% { opacity: 0 } 25% { opacity: 0 } 30% { opacity: 0 } 35% { opacity: 0 } 40% { opacity: 0 } 45% { opacity: 0 } 50% { opacity: 0 } 55% { opacity: 0 } 60% { opacity: 0 } 65% { opacity: 0 } 70% { opacity: 0 } 75% { opacity: 0 } 80% { opacity: 0 } 85% { opacity: 0 } 90.0% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 300, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 300, 0, 0, 1); } 90.0186% { -webkit-transform: matrix3d(3.905, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 254.415, 0, 0, 1); transform: matrix3d(3.905, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 254.415, 0, 0, 1);opacity: 0; } 90.0364% { -webkit-transform: matrix3d(4.554, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 213.552, 0, 0, 1); transform: matrix3d(4.554, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 213.552, 0, 0, 1); } 90.056% { -webkit-transform: matrix3d(4.124, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 172.823, 0, 0, 1); transform: matrix3d(4.124, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 172.823, 0, 0, 1); } 90.0816% { -webkit-transform: matrix3d(3.039, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 126.853, 0, 0, 1); transform: matrix3d(3.039, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 126.853, 0, 0, 1); } 90.1122% { -webkit-transform: matrix3d(1.922, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 82.133, 0, 0, 1); transform: matrix3d(1.922, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 82.133, 0, 0, 1); } 90.1258% { -webkit-transform: matrix3d(1.581, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 65.651, 0, 0, 1); transform: matrix3d(1.581, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 65.651, 0, 0, 1); } 90.1682% { -webkit-transform: matrix3d(1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 27.238, 0, 0, 1); transform: matrix3d(1.049, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 27.238, 0, 0, 1);opacity: 1; } 90.1708% { -webkit-transform: matrix3d(1.034, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 25.346, 0, 0, 1); transform: matrix3d(1.034, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 25.346, 0, 0, 1); } 90.2152% { -webkit-transform: matrix3d(0.947, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 2.436, 0, 0, 1); transform: matrix3d(0.947, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 2.436, 0, 0, 1); } 90.2222% { -webkit-transform: matrix3d(0.948, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(0.948, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 90.3224% { -webkit-transform: matrix3d(0.996, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 13.007, 0, 0, 1); transform: matrix3d(0.996, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 13.007, 0, 0, 1); } 90.394% { -webkit-transform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 10.272, 0, 0, 1); transform: matrix3d(1.001, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 10.272, 0, 0, 1); } 90.5728% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 1.505, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 1.505, 0, 0, 1); } 90.6666% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 90.7142% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.246, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.246, 0, 0, 1); } 90.7668% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.311, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.311, 0, 0, 1); } 91.1132% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 91.2112% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.007, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0.007, 0, 0, 1); } 91.5576% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 91.6556% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 92.0% { -webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1); } 95% { opacity: 1 } 100% { opacity: 0 } }