html {
scroll-padding-top: 140px;
}
/* GENERAL STYLES */
:root {
--smaller: .75;
}
body{
font-family: 'PF BeauSans Pro';
font-weight: 100;
font-size: 1.1rem;
overflow-x: hidden;
}
h2, h5 {
margin-top: 2rem !important;
}
.row p a {
font-weight: 400;
}
p.card-link {
padding: 22px 50px 18px 20px;
margin: 0px;
text-align:right;
}
.mn8-color-contrast-medium {
color: #212529 !important;
}
.container {
width: 100%;
max-width: 1200px;
margin: 0 auto;
padding: 0 25px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
position: relative;
}
.card img.heroboxicon {
max-width: 60px;
height: auto;
border-radius: 0;
}
.vcmeditable h3 {
margin-top: 3rem;
}
section .vcmeditable h3 {
margin-top: 0;
}
main.container {
margin-bottom: 6rem;
}
.vcmeditable figure {
margin: 0;
}
.vcmeditable figure img {
max-width: 100%;
border-radius: 20px;
}
.informationsstand {
text-align: center;
font-size: 0.9rem;
color: #6a7482;
}
#inVcmEdit_marathon #faq,
#inVcmEdit_marathon #altersklassen .modal-dialog,
#inVcmEdit_marathon #vorbereitungslauf .modal-dialog {
filter: blur(2px);
position: relative;
pointer-events:none;
}
#inVcmEdit_altersklassen .different-edit-info,
#inVcmEdit_vorbereitungslauf .different-edit-info,
#_noid .different-edit-info {
display: none;
}
.marathon .accordion-item,
.halfmarathon .accordion-item,
.relaymarathon .accordion-item,
.vienna5k .accordion-item,
.dm1600 .accordion-item,
.dm800 .accordion-item,
.inclusionrun .accordion-item,
.fml .accordion-item {
display:none;
}
.marathon .accordion-item.vcm,
.halfmarathon .accordion-item.hm,
.relaymarathon .accordion-item.rm,
.vienna5k .accordion-item.vienna5k,
.dm1600 .accordion-item.dm1600,
.dm800 .accordion-item.dm800,
.inclusionrun .accordion-item.ir,
.fml .accordion-item.fml {
display: block;
}
.blurededit {
position: relative;
min-width: 100%;
width: 100%;
max-width:fit-content;
margin: 0 auto;
}
.different-edit-info {
position: absolute;
display: flex;
flex-direction:column;
background: #fff;
padding: 20px;
align-items: center;
justify-content: center;
height: 300px;
z-index: 1;
top: 25%;
width: 90%;
max-width: 640px;
text-align: center;
left: 50%;
transform: translateX(-50%);
border: 1px solid #161c59;
border-radius: 20px;
}
/*
.container .row p {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
*/
#headerv2 a.nolinkstyle {
color: #73757d !important;
text-decoration: none;
font-weight: 100 !important;
}
.sponsorleiste-menu {
display: flex;
align-items: center;
justify-content: space-evenly;
padding: 20px 0 10px;
gap:20px;
}
.sponsorleiste-menu img {
max-height: 40px;
width: unset;
}
@media only screen and (max-width: 991px) {
.sponsorleiste-menu {
flex-wrap:wrap;
}
.mega-nav__item .sponsorleiste-menu img {
width: 100%;
max-width: 50px;
object-fit: contain;
aspect-ratio: 3/2;
}
.sponsorleiste-menu img {
max-height: unset;
}
}
.vcmeditable ul,
ul.vcm-list {
list-style-type: none;
padding-left: 0;
}
.vcmeditable ul li,
ul.vcm-list li {
position: relative;
padding-left: 15px;
}
.vcmeditable ul li::before,
ul.vcm-list li::before {
content: '\203A';
position: absolute;
left: 0;
top: 3px;
line-height: 1;
}
/* Fullwidth Wrapper Styling */
.fullwidth-wrapper {
position: relative;
width: 100vw;
left: 50%;
right: 50%;
margin-left: -50vw;
margin-right: -50vw;
}
/* Image Promotion Styling */
.imagepromotion {
min-height: 400px;
background-size: cover;
background-position: center;
background-attachment: fixed;
padding: 2rem;
}
.imagepromotion .container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
gap: 2rem;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background: #f8f8f8;
border-radius: 20px;
max-width: 1160px;
padding: 2.4rem;
}
@media only screen and (max-width: 991px) {
.imagepromotion .container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;;
}
}
.infobox {
text-align: left;
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
}
.infotitle {
font-size: 1.8rem;
margin-bottom: 1rem;
}
.infosubtitle {
font-size: 1.2rem;
margin-bottom: 1rem;
font-weight: 300;
line-height: 1.3;
}
.infotext {
font-size: 1rem;
margin-bottom: 1rem;
}
.infobox-video {
-webkit-box-flex: 2;
-ms-flex: 2;
flex: 2;
width: 100%;
}
/* responsive iframe */
@media (min-width: 682px) {
.twocol-video.rh5-media-wrapper-16\:9 {
padding-bottom: 28.125%;
}
}
:where(.rh5-media-wrapper-16\:9) {
position: relative;
height: 0;
}
.rh5-media-wrapper-16\:9 {
padding-bottom: 56.25%;
}
.rh5-media-wrapper-16\:9 > * {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 15px;
}
.rh5-media-wrapper-16\:9 > *:not(iframe) {
-o-object-fit: cover;
object-fit: cover;
}
.strava-iframe iframe {
width: 96% !important;
margin: 0 auto 2rem;
}
a{
cursor: pointer;
}
.list-group {
margin: 20px 0;
}
a.list-group-item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
section {
padding-top: 40px;
padding-bottom: 40px;
}
.nav-tabs .nav-link.active {
opacity: 1;
}
.mega-nav--mobile {
position: sticky;
top: 0;
}
/*Streckennav + Choose Box*/
.stickybar {
position: sticky;
background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), color-stop(82%, #ffffff), to(transparent));
background: -o-linear-gradient(top, #ffffff 0%, #ffffff 82%, transparent 100%);
background: linear-gradient(to bottom, #ffffff 0%, #ffffff 82%, transparent 100%);
top: 72px;
z-index: 2;
padding-bottom: 5px;
}
#course_navbar,
#training_navbar,
#gesundheit_navbar,
#nachhaltigkeit_navbar {
top: 20px;
z-index: 1;
background: #eef0f6;
border-radius: 25px;
}
/* Style the navbar items */
#course_navbar ul,
#training_navbar ul,
#gesundheit_navbar ul,
#nachhaltigkeit_navbar ul {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
list-style-type: none;
padding: 0;
}
#course_navbar li,
#training_navbar li,
#gesundheit_navbar li,
#nachhaltigkeit_navbar li {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
}
#course_navbar a,
#training_navbar a,
#gesundheit_navbar a,
#nachhaltigkeit_navbar a {
color: #161c58;
border-radius: 25px;
display: block;
padding: 10px;
text-align: center;
text-decoration: none;
opacity: 0.8;
-webkit-transition: opacity 0.3s;
-o-transition: opacity 0.3s;
transition: opacity 0.3s;
-o-transition: all .2s ease-in-out;
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}
@media (max-width: 640px) {
#course_navbar a,
#training_navbar a,
.choose-btn .nav-link {
font-size: 0.9rem;
}
}
#course_navbar a:hover,
#course_navbar a.active,
#training_navbar a:hover,
#training_navbar a.active,
#gesundheit_navbar a:hover,
#gesundheit_navbar a.active,
#nachhaltigkeit_navbar a:hover,
#nachhaltigkeit_navbar a.active {
opacity: 1;
background: #161c58;
border-radius: 25px;
color: #fff;
-o-transition: all .2s ease-in-out;
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}
#gesundheit_navbar ul,
#nachhaltigkeit_navbar ul {
list-style: none;
padding: 0;
margin: 0;
}
#gesundheit_navbar li,
#nachhaltigkeit_navbar li {
display: inline-block;
color: #161c58;
}
#gesundheit_navbar a,
#nachhaltigkeit_navbar a {
text-decoration: none;
padding: 10px;
color: #161c58;
}
#gesundheit_navbar .dropdown-toggle,
#nachhaltigkeit_navbar .dropdown-toggle {
display: none;
}
@media (max-width: 780px) {
#gesundheit_navbar {
top: 0;
z-index: 1;
background: #eef0f6;
border-radius: 25px;
padding: 10px 30px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
position: relative;
}
#gesundheit_navbar li {
display: block;
color: #161c58;
padding: 10px 10px;
}
#gesundheit_navbar ul {
display: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
background: #eef0f6;
border-radius: 25px;
color: #161c58;
-webkit-box-shadow: 0 0 50px rgba(0, 0, 0, 0.3);
box-shadow: 0 0 50px rgba(0, 0, 0, 0.3);
}
#gesundheit_navbar .dropdown-toggle {
display: inline-block;
color: #161c58;
}
}
@media (max-width: 1060px) {
#nachhaltigkeit_navbar {
top: 0;
z-index: 1;
background: #eef0f6;
border-radius: 25px;
padding: 10px 30px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
position: relative;
}
#nachhaltigkeit_navbar li {
display: block;
color: #161c58;
padding: 10px 10px;
}
#nachhaltigkeit_navbar ul {
display: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
background: #eef0f6;
border-radius: 25px;
color: #161c58;
-webkit-box-shadow: 0 0 50px rgba(0, 0, 0, 0.3);
box-shadow: 0 0 50px rgba(0, 0, 0, 0.3);
}
#nachhaltigkeit_navbar .dropdown-toggle {
display: inline-block;
color: #161c58;
}
}
.navbar .flex-center {
justify-content: center;
gap: 3rem;
flex-wrap: wrap;
}
@media (max-width: 920px) {
.navbar .flex-center {
justify-content: space-evenly;
gap: 0.5rem;
}
}
.linkDisabled {
cursor: not-allowed;
opacity: 0.5;
text-decoration: none;
}
.choose-btn {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
background: #eef0f6;
border-radius: 25px;
overflow: hidden;
gap: 10px;
}
.choose-btn .nav-item {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
}
.choose-btn .nav-link {
color: #161c58;
border-radius: 25px;
display: block;
padding: 10px 30px;
text-align: center;
text-decoration: none;
opacity: 0.8;
-webkit-transition: opacity 0.3s;
-o-transition: opacity 0.3s;
transition: opacity 0.3s;
-o-transition: all .2s ease-in-out;
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
font-weight: 100;
}
.choose-btn .nav-link:hover,
.choose-btn .nav-link.active {
opacity: 1;
background: #161c58;
border-radius: 25px;
color: #fff;
-o-transition: all .2s ease-in-out;
-webkit-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}
.legende-verpflegung {
display: flex;
justify-content: space-around;
flex-wrap: wrap;
border: 1px solid #eef0f6;
padding: 15px 30px;
border-radius: 50px;
margin-bottom: 3rem;
gap: 10px;
}
@media (max-width: 320px) {
.legende-verpflegung {
justify-content: flex-start;
}
}
.vcm-plaene .nav > li > a,
.vcm-plaene .nav-tabs > li.active > a,
.vcm-plaene .nav-tabs > li.active > a:hover,
.vcm-plaene .nav-tabs > li.active > a:focus{
padding: 0;
border: 0;
margin: 5px;
}
.vcm-plaene .nav > li > a {
opacity: 0.4;
}
.vcm-plaene .nav-tabs > li.active > a {
opacity: 1;
}
.vcm-plaene ul.nav.nav-tabs:before {
display:none;
}
.vcm-plaene ul.nav.nav-tabs {
display: -ms-grid;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}
.vcm-plaene img {
width:100%;
height:auto;
}
.zielplan-container {
margin-bottom:4rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 20px; /* Spacing between boxes */
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.zielplan-container .homenews-card {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
min-width: 200px;
}
.zielplan-container .homenews-card__thumb {
height: 150px;
}
#training .zielplan-container .homenews-card__thumb {
height: 220px;
}
#sampling .homenews-card__thumb img,
#b2b .homenews-card__thumb img,
#hospitality .homenews-card__thumb img {
top:35%;
}
.zielplan-container .homenews-card__thumb img {
top: 0%;
-webkit-transform: translate(-50%, 0%) scale(1);
-ms-transform: translate(-50%, 0%) scale(1);
transform: translate(-50%, 0%) scale(1);
}
.box-left-img {
display: flex;
justify-content: center;
align-items: center;
}
#charity .box-left-img img {
width: 140px;
min-width: unset;
max-width: unset;
height: auto;
padding: 20px;
object-fit: contain;
}
.box-btn-right {
text-align: right;
margin-right: 30px;
font-weight: 500;
}
.vcm-bg-blue{
background: #161c58;
}
.vcm-eventinfo-box div{
z-index: 1;
}
#partnerruns .bewerbegrid {
grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));
}
.card.flex-md-row {
padding: 0;
max-width: unset;
width: 100%;
margin: 20px auto;
}
.flex-md-row p.card-text {
padding: 0;
width:100%;
}
.card.flex-md-row img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
border-radius: 0;
max-width: 330px;
min-width:250px;
}
@media (min-width: 991px) {
#vcmyear .card.flex-md-row.boxshadow {
max-height: 220px;
}
}
.flex-md-row a.link-fx-1.lw7-color-contrast-higher {
width: fit-content;
}
.vcm-eventinfo-box.vcm-bg-light:before {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-image: url('/res/img/ui/stars-bg-blue.png');
background-size: cover;
opacity: 0.03;
z-index: -1;
-webkit-transition: all .5s;
-o-transition: all .5s;
transition: all .5s;
background-position: 60% 0%;
}
/**/
.vcm-bg-colored-blue {
position: relative;
background-image: url('/res/img/ui/stars-bg.png');
background-color: #161c59;
background-size: cover;
-webkit-transition: background-size 0.3s ease-in-out;
-o-transition: background-size 0.3s ease-in-out;
transition: background-size 0.3s ease-in-out;
}
.vcm-bg-colored-blue::after {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgb(22 28 89);
z-index: 0;
border-radius: 20px;
opacity: 0.9;
mix-blend-mode: unset;
}
.vcm-rounded.vcm-bg-colored-blue::after {
border-radius: 20px;
}
.vcm-bg-colored-blue:hover {
background-size: cover;
-webkit-transition: background-size 0.3s ease-in-out;
-moz-transition: background-size 0.3s ease-in-out;
-o-transition: background-size 0.3s ease-in-out;
}
*/
.vcm-bg-blue{
background: #161c58;
}
/*
.vcm-bg-colored-blue {
position: relative;
background-image: url(../img/eventbox-bg.png);
background-color: #0B1146;
background-size: cover;
-webkit-transition: background-size 0.3s ease-in-out;
-moz-transition: background-size 0.3s ease-in-out;
-o-transition: background-size 0.3s ease-in-out;
transition: background-size 0.3s ease-in-out;
}
.vcm-bg-colored-blue::after {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(22, 28, 89, 0.90);
mix-blend-mode: multiply;
z-index: 0;
}
.vcm-bg-colored-blue:hover {
background-size: cover;
-webkit-transition: background-size 0.3s ease-in-out;
-moz-transition: background-size 0.3s ease-in-out;
-o-transition: background-size 0.3s ease-in-out;
transition: background-size 0.3s ease-in-out;
}
.vcm-rounded.vcm-bg-colored-blue::after {
border-radius: 20px;
}
*/
.section-divider {
position: relative;
z-index: 2;
}
.home-box-container {
position: relative;
margin-top: -100px;
z-index: 2;
}
/*
.home-box-container::before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 60px;
background-image: url('data:image/svg+xml;utf8,');
transform: rotate(180deg);
z-index: 1;
}
*/
.row.heroboxes {
position: relative;
margin: auto;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
-ms-flex-line-pack: stretch;
align-content: stretch;
gap: 20px;
padding-bottom: 40px;
}
@media (min-width: 768px) {
.heroboxes {
display: -ms-grid;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
grid-column-gap: 25px;
grid-row-gap: 25px;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.heroboxes-item.card {
max-width: 300px;
width: 30%;
}
.spacer {
display: none;
}
}
@media (max-width: 768px) {
.heroboxes {
overflow-x: auto;
-ms-scroll-snap-type: x mandatory;
scroll-snap-type: x mandatory;
-webkit-overflow-scrolling: touch;
grid-column-gap: 20px;
padding: 4rem 4rem 0rem 0rem;
-webkit-box-pack: unset;
-ms-flex-pack: unset;
justify-content: unset;
}
.spacer {
-webkit-box-flex: 0;
-ms-flex: 0 0 50vw;
flex: 0 0 50vw; /* Half the viewport width */
}
}
.row.heroboxes::-webkit-scrollbar {
display: none; /* Hide scrollbar for Chrome, Safari, and Opera */
}
.heroboxes-item {
padding: 20px;
-webkit-box-flex: 0;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
scroll-snap-align: center;
width: 88%;
max-width: 300px;
}
.heroboxes-item.card:hover {
-webkit-transition: all .5s;
-o-transition: all .5s;
transition: all .5s;
}
.heroboxes-item.card:hover .hero-box-title {
-webkit-transition: all .5s;
-o-transition: all .5s;
transition: all .5s;
}
.heroboxes-item.card:hover:before {
-webkit-transition: all .5s;
-o-transition: all .5s;
transition: all .5s;
}
.heroboxes-item.card {
position: relative;
display: block;
color: #f3f3f3;
text-decoration: none;
background-color: #212352;
overflow: hidden;
text-align: center;
min-height: 140px;
-webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
}
.heroboxes-item.card:before {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-image: url('/res/img/ui/stars-bg.png');
background-size: 600%;
opacity: 0.04;
z-index: 0;
-webkit-transition: all .5s;
-o-transition: all .5s;
transition: all .5s;
}
.heroboxes-item.card:hover:before {
background-size: 800%;
-webkit-transition: all .5s;
-o-transition: all .5s;
transition: all .5s;
}
.heroboxes-item.card.bg-position-1:before {
background-position: 60% 50%;
}
.heroboxes-item.card.bg-position-2:before {
background-position: 40% 50%;
}
.heroboxes-item.card.bg-position-3:before {
background-position: 30% 50%;
}
.heroboxes-item.card:after {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 255, 0.5);
z-index: -1;
}
.bg-position-1 {
background-position: 10% 100%;
}
.bg-position-2 {
background-position: 80% 100%;
}
.bg-position-3 {
background-position: 60% 0%;
}
.vcm-bg-grey{
background: #555964;
}
.vcm-bg-colored-grey {
position: relative;
background-image: url(../img/eventbox-bg.png);
background-color: #5c5f75;
background-size: cover;
-webkit-transition: background-size 0.3s ease-in-out;
-o-transition: background-size 0.3s ease-in-out;
transition: background-size 0.3s ease-in-out;
border:0px;
}
.vcm-bg-colored-grey::after {
content: "";
position: absolute;
border-radius: 20px;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(51, 53, 66, 0.80);
mix-blend-mode: multiply;
z-index: 0;
}
.vcm-bg-colored-grey:hover {
background-size: cover;
-webkit-transition: background-size 0.3s ease-in-out;
-o-transition: background-size 0.3s ease-in-out;
transition: background-size 0.3s ease-in-out;
}
.vcm-bg-lightgrey{
background: #fafafa;
}
a img.img-fluid {
margin-bottom: -60px;
}
header.vcm-bg-blue {
position: relative;
z-index: 1;
}
.header-nav-container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
ul.navbar-nav {
gap: 5px;
}
.custom-shape-divider-bottom-1683114044 {
position: absolute;
bottom: 0;
left: 0;
width: 105%;
overflow: hidden;
line-height: 0;
-webkit-transform: rotate(180deg);
-ms-transform: rotate(180deg);
transform: rotate(180deg);
}
@media only screen and (max-width: 991px) {
.crazysignup {
display: none;
}
.custom-shape-divider-bottom-1683114044 {
width: 140vw;
min-width: 600px;
}
}
@media only screen and (max-width: 550px) {
.logo img {
width: 70px !important;
}
.col.text-end.fs-4 {
display: none;
}
}
@media only screen and (max-width: 480px) {
.hide-sm {
display: none;
}
}
@media only screen and (max-width: 430px) {
.hide-sx {
display: none;
}
}
@media only screen and (max-width: 390px) {
.col.text-end.fs-4,
.header-nav-container .nav-item {
display: none;
}
.header-nav-container .nav-item:last-of-type {
display: block;
}
}
#logo{
width:120px;
}
#logo-v2{
width: 50px;
margin-bottom: 0px;
background: white;
z-index: 2;
position: relative;
-webkit-transform-origin: 50% 100%;
-ms-transform-origin: 50% 100%;
transform-origin: 50% 100%;
}
#logo-v2.small-logo{
padding: 15px;
border-radius: 200px;
margin-bottom: 0px;
background: white;
z-index: 2;
position: relative;
-webkit-transform: scale(0.75) translateY(-15px);
-ms-transform: scale(0.75) translateY(-15px);
transform: scale(0.75) translateY(-15px);
-webkit-transition: -webkit-transform 0.2s ease;
transition: -webkit-transform 0.2s ease;
-o-transition: transform 0.2s ease;
transition: transform 0.2s ease;
transition: transform 0.2s ease, -webkit-transform 0.2s ease;
}
img#logo2 {
width: 100%;
max-width: 350px;
}
.align-items-start {
z-index: 1;
}
.sticky-md-top {
-webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}
#course_navbar {
top: 86px;
}
#course_navbar.scrolled {
-webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
@media only screen and (max-width: 991px) {
#logo-v2{
width:70px;
padding: 10px;
margin-bottom: 0px;
}
}
.navbar {
height: 70px;
padding: 0 !important;
}
.mega-menu-container {
position: relative;
}
.navbar-nav .dropdown-menu {
position: fixed !important;
}
.mega-menu {
position: fixed;
left: 0;
width: 100%;
-webkit-box-sizing: border-box;
box-sizing: border-box;
z-index: 1;
display: none;
}
.mega-nav__sub-nav {
padding-bottom: 10px !important;
}
li.mega-nav__label {
font-size: 1.3rem;
}
li .mn8-text-base a[href*="streckenhighlights"],
li .mn8-text-base a[href*="viennacitycard"],
li .mn8-text-base a[href*="glaubandich-schlusslaeufer"],
li .mn8-text-base a[href*="runningdoctors"] {
display: none;
}
li:not(.last-position-weitereinfos) > .mn8-text-base a[href*="vcmyear"] {
display: none;
}
li.last-position-weitereinfos {
border-top: 1px solid #cbcbcb;
margin-top: 30px;
text-transform: uppercase;
}
.mega-nav__item .shopbanner {
border-radius: 0;
-webkit-box-shadow: none;
box-shadow: none;
}
.mega-nav__item .shopbanner:hover {
-webkit-box-shadow: none;
box-shadow: none;
}
.mega-nav__sub-nav.mega-nav__sub-nav--layout-4.shopnav {
padding-top: 10px;
}
.fixed-mega-menu {
margin-top: 10px;
}
.nav-tabs .nav-link {
border: 0px;
}
.nav-item:hover .mega-menu {
display: block;
}
.nav-tabs,
.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
border:0px;
}
.mega-menu .col-lg-3,
.mega-menu .col-lg-5 {
border-right: 1px solid #ccc;
}
.mega-menu .col-lg-4 {
border-right: 0px;
}
.menu-toggler-link-flex {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-decoration: none;
padding: 0;
margin-right: -7px;
}
.menu-icon {
font-size: 24px;
}
.menu-text {
font-size: 11px;
-webkit-transform: scaleY(0.8);
-ms-transform: scaleY(0.8);
transform: scaleY(0.8);
display: none; /*Original nicht angezeigt*/
}
a .bi.bi-list {
padding: 0;
font-size: 40px;
margin-bottom: -8px;
}
#headerv2{
background: white;
}
#headerv2 a{
font-weight: 400;
color: #161c58;
}
#headerv2 .vcm-header-icons{
color: #9BA8B5;
font-size: 20px;
margin-right: 0px !important;
}
a.langswitch,
#headerv2 .vcm-header-icons i.bi.bi-search,
#headerv2 .vcm-header-icons i.bi.bi-person{
color: #9BA8B5!important;
border: 1px solid #9BA8B5;
border-radius: 5px;
padding: 5px 6px;
font-size: 0.8rem !important;
transition: all .3s;
text-decoration:unset;
line-height:1;
}
a.langswitch:hover,
#headerv2 .vcm-header-icons i.bi.bi-search:hover,
#headerv2 .vcm-header-icons i.bi.bi-person:hover {
color: #9BA8B5!important;
transition: all .3s;
text-decoration:unset;
background: #f3f3f3;
line-height:1;
}
/* Links (tertirary Button) */
.nav-showall {
margin-top: 24px;
text-transform: uppercase;
margin-bottom: 16px;
}
.borderless:before {
display: none;
}
/*
.card-link-wrapper {
cursor: pointer;
}
.card-link-wrapper:hover .fullwidthcircle.link-fx-1::before {
transform-origin: right;
transform: translateX(-17px) scaleX(0);
}
.card-link-wrapper:hover .link-fx-1 svg line {
display: block;
transform: rotate(-180deg);
transition: transform 0.6s 0.8s;
}
.card-link-wrapper:hover .link-fx-1 svg line:last-child {
display: block;
transform: rotate(180deg);
transition: transform 0.6s 0.8s;
}
.card-link-wrapper:hover .link-fx-1::before {
transform: translateX(17px) scaleX(0);
transition: transform 0.2s;
}
.card-link-wrapper:hover .link-fx-1 svg circle {
stroke-dashoffset: 200;
transition: stroke-dashoffset 0.2s 0.1s;
}
*/
a.link-fx-1.lw7-color-contrast-higher.fullwidthcircle {
width: 100%;
}
.fullwidthcircle.link-fx-1 svg {
right: 33px;
}
.fullwidthcircle.link-fx-1::before {
-webkit-transform-origin: right;
-ms-transform-origin: right;
transform-origin: right;
}
.fullwidthcircle.link-fx-1:hover::before {
-webkit-transform-origin: right;
-ms-transform-origin: right;
transform-origin: right;
-webkit-transform: translateX(-17px) scaleX(0);
-ms-transform: translateX(-17px) scaleX(0);
transform: translateX(-17px) scaleX(0);
}
.link-fx-1 {
position: relative;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
height: 32px;
padding: 0 6px;
text-decoration: none;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.link-fx-1 svg {
position: absolute;
right: 0;
bottom: 0;
-webkit-transform: translateX(100%) rotate(90deg);
-ms-transform: translateX(100%) rotate(90deg);
transform: translateX(100%) rotate(90deg);
font-size: 32px;
height: 33px;
}
.link-fx-1 svg circle {
stroke-dasharray: 100;
stroke-dashoffset: 100;
-webkit-transition: stroke-dashoffset 0.2s;
-o-transition: stroke-dashoffset 0.2s;
transition: stroke-dashoffset 0.2s;
}
.link-fx-1 svg line {
transition: transform 0.6s 0.8s, -webkit-transform 0.6s 0.8s;
-webkit-transform-origin: 13px 15px;
-ms-transform-origin: 13px 15px;
transform-origin: 13px 15px;
display: none;
}
.link-fx-1 svg line:last-child {
-webkit-transform-origin: 19px 15px;
-ms-transform-origin: 19px 15px;
transform-origin: 19px 15px;
display: none;
}
.link-fx-1::before {
content: "";
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 1px;
background-color: currentColor;
-webkit-transform-origin: right center;
-ms-transform-origin: right center;
transform-origin: right center;
transition: -webkit-transform 0.2s 0.1s;
-webkit-transition: -webkit-transform 0.2s 0.1s;
-o-transition: transform 0.2s 0.1s;
transition: transform 0.2s 0.1s;
transition: transform 0.2s 0.1s, -webkit-transform 0.2s 0.1s;
}
.link-fx-1:hover svg line {
display: block;
-webkit-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
transform: rotate(-180deg);
transition: transform 0.6s 0.8s, -webkit-transform 0.6s 0.8s;
}
.link-fx-1:hover svg line:last-child {
display: block;
-webkit-transform: rotate(180deg);
-ms-transform: rotate(180deg);
transform: rotate(180deg);
transition: transform 0.6s 0.8s, -webkit-transform 0.6s 0.8s;
}
.link-fx-1:hover::before {
-webkit-transform: translateX(17px) scaleX(0);
-ms-transform: translateX(17px) scaleX(0);
transform: translateX(17px) scaleX(0);
transition: -webkit-transform 0.2s;
-webkit-transition: -webkit-transform 0.2s;
-o-transition: transform 0.2s;
transition: transform 0.2s;
transition: transform 0.2s, -webkit-transform 0.2s;
}
.link-fx-1:hover svg circle {
stroke-dashoffset: 200;
-webkit-transition: stroke-dashoffset 0.2s 0.1s;
-o-transition: stroke-dashoffset 0.2s 0.1s;
transition: stroke-dashoffset 0.2s 0.1s;
}
/**Section devider**/
[class*=has-section-divider] {
position: relative;
}
.has-section-dividers {
padding-top: var(--section-divider-ratio);
padding-bottom: var(--section-divider-ratio);
}
.has-section-dividers .section-divider + .section-divider {
bottom: auto;
top: -1px;
-webkit-transform: scaleY(-1);
-ms-transform: scaleY(-1);
transform: scaleY(-1);
}
.has-section-divider-top {
padding-top: var(--section-divider-ratio);
}
.has-section-divider-top .section-divider {
bottom: auto;
top: -1px;
-webkit-transform: scaleY(-1);
-ms-transform: scaleY(-1);
transform: scaleY(-1);
}
.has-section-divider-bottom {
padding-bottom: var(--section-divider-ratio);
}
.section-divider {
position: absolute;
bottom: -1px;
left: 0;
width: 100%;
overflow: hidden;
}
.section-divider svg {
position: relative;
display: block;
height: auto;
max-width: none;
width: 102%;
left: -1%;
}
.carousel {
width: 100%;
height: 100px;
position: relative;
overflow: hidden;
margin: auto;
display:flex;
align-items:center;
}
#vcm-footer-logos.carousel img {
width: auto;
height: 40px;
float: left;
margin-right: 60px;
}
.carousel div {
display: flex;
align-items: center;
position: absolute;
animation: carousel 130s infinite linear;
}
@keyframes carousel {
0% { transform: translateX(0); }
100% { transform: translateX(-50%); }
}
/* Responsive design */
@media screen and (max-width: 800px) {
#vcm-footer-logos.carousel,
#vcm-footer-logos.carousel img {
height: 50px;
padding:10px;
}
#vcm-footer-logos.carousel img {
width: auto;
}
}
/* Buttons */
pre {
width:100%;
background-color: #f1f1f1;
padding:10px;
}
code {
font-family: Consolas,"courier new";
color: crimson;
background-color: #f1f1f1;
padding: 2px 10px;
font-size: 90%;
}
.btn-container {
margin: 80px 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
gap: 20px;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-align: baseline;
-ms-flex-align: baseline;
align-items: baseline;
position: relative;
}
.hero .btn-container {
margin: 1rem 0;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
}
.btn-container-2 {
margin: 3px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-align: baseline;
-ms-flex-align: baseline;
align-items: baseline;
position: relative;
}
.btn {
display: inline-block;
font-weight: 400;
line-height: 1.5;
/*Dominik why?? */
/*color: #212529;*/
text-align: center;
text-decoration: none;
vertical-align: middle;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-color: transparent;
border: 1px solid transparent;
padding: 0.375rem 0.75rem;
font-size: 1rem;
border-radius: 0.25rem;
-webkit-transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
-o-transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
}
.card .btn {
padding: 8px 16px;
}
.mt-3 {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
gap: 20px;
}
.fullwidth {
width: 100%;
}
.w-80 {
width: 80%;
margin: 10px auto 15px;
}
.w-90 {
width: 90%;
margin: 10px auto 15px;
}
.boxshadow {
-webkit-box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}
.ad.space-6rem.text-center img {
width: 100%;
max-width: 960px;
height: auto;
}
.space-40 {
margin: 40px auto;
}
.space-2rem {
margin: 2rem auto;
}
.space-4rem {
margin: 4rem auto;
}
.space-5rem {
margin: 5rem auto;
}
.space-6rem {
margin: 6rem auto;
}
.space-top-20 {
margin-top: 20px;
}
.space-top-30 {
margin-top: 30px;
}
.space-top-50 {
margin-top: 50px;
}
.space-bottom-2rem {
margin-bottom: 2rem !important;
}
.gap-15 {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
gap: 15px;
-webkit-box-align: baseline;
-ms-flex-align: baseline;
align-items: baseline;
}
.max600 {
max-width: 600px;
}
@media only screen and (max-width: 991px) {
.space-6rem {
margin: 1rem auto;
}
.space-4rem {
margin: 2rem auto;
}
}
.bewerbs-cta-section {
margin: 80px 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
gap: 20px;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-align: baseline;
-ms-flex-align: baseline;
align-items: baseline;
position: relative;
}
img.cta-arrow {
width: 50px;
position: absolute;
left: 30px;
top: -60px;
-webkit-transform: rotate(-25deg);
-ms-transform: rotate(-25deg);
transform: rotate(-25deg);
}
@media only screen and (max-width: 991px) {
img.cta-arrow {
width: 30px;
position: absolute;
left: 0px;
top: -70px;
-webkit-transform: rotate(-10deg);
-ms-transform: rotate(-10deg);
transform: rotate(-10deg);
}
}
@media only screen and (min-width: 959px) {
.mobile {
display: none !important;
}
.desktop-sm {
display: block;
}
}
.center {
text-align: center;
}
.left {
text-align: left;
}
.right {
text-align: right;
}
@media only screen and (max-width: 960px) {
.mobile {
display: block;
}
.desktop-sm {
display: none !important;
}
.mega-nav__sub-nav-wrapper {
padding: 0 1rem 3rem !important;
}
.mega-nav--mobile .mega-nav__control {
font-size: 1.6rem !important;
color: #161c58 !important;
}
ul.mega-nav__sub-items {
padding-left: 0 !important;
padding-top: 1rem;
}
ul.mega-nav__sub-items li h3 {
margin-top: 1rem !important;
font-size: 1.3rem;
}
.mn8-max-width-xs {
max-width: unset !important;
}
h3.mn8-text-base {
margin-top: 1rem !important;
font-size: 1.3rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 5px;
}
.link-fx-1 {
padding: 0;
}
.mega-nav__sub-nav.mega-nav__sub-nav--layout-3 {
display: block !important;
}
.mega-nav__item a {
width: 100%;
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
padding: 0.5rem;
}
.mega-nav--mobile .mega-nav__sub-items {
width: 100%;
}
}
@media only screen and (max-width: 991px) {
.desktop {
display: none !important;
}
.mobile-md {
display: block;
}
}
@media only screen and (min-width: 990px) {
.desktop {
display: block;
}
.mobile-md {
display: none !important;
}
}
@media only screen and (max-width: 1091px) {
.desktop-xl {
display: none !important;
}
}
@media only screen and (min-width: 1090px) {
.desktop-xl {
display: block;
}
}
.js-tabs__panels section {
padding: 10px;
}
/* BUTTON Primary */
.vcm-btn-primary {
background: #f3b21b;
color: #ffffff !important;
padding: 10px 20px;
border-radius: 100px;
position: relative;
}
.vcm-btn-primary:hover {
background-color: #f3b21b;
border-color:#f3b21b;
}
.vcm-btn-primary:before {
content: "";
position: absolute;
top: -5px;
right: -5px;
bottom: -5px;
left: -5px;
border: 2px solid #f3b21b;
border-radius: 104px;
opacity: 0;
-o-transition: all .4s ease-in-out;
-webkit-transition: all .4s ease-in-out;
transition: all .4s ease-in-out;
}
.vcm-btn-primary:hover:before {
opacity: 1;
}
a.btn.vcm-btn-primary.btnarrow:after {
position: absolute;
top: -55px;
left: -100px;
content: '';
display: inline-block;
width: 70px;
height: 80px;
background-image: url(https://wip.vienna-marathon.com/res/img/ui/cta-arrow.png);
background-size: contain;
background-repeat: no-repeat;
transform: rotate(-25deg);
}
.vcm-btn-primary.blue {
background: #161c58;
}
.vcm-btn-primary.blue:hover {
background-color: #161c58;
border-color:#161c58;
}
.vcm-btn-primary.blue:before {
border: 2px solid #161c58;
}
/* BUTTON Secondary */
.vcm-btn-secondary {
color: #697481;
background: transparent;
padding: 10px 20px;
border: 2px solid #8796a9;
border-radius: 100px;
position: relative;
}
.vcm-btn-secondary:hover {
background-color:transparent;
border-color:#8796a9;
}
.vcm-btn-secondary:before {
content: "";
position: absolute;
top: -5px;
right: -5px;
bottom: -5px;
left: -5px;
border: 2px solid #8796a9;
border-radius: 104px;
opacity: 0;
-o-transition: all .4s ease-in-out;
-webkit-transition: all .4s ease-in-out;
transition: all .4s ease-in-out;
}
.vcm-btn-secondary:hover:before {
opacity: 1;
}
.card a.btn.vcm-btn-secondary {
border: 2px solid #464c81;
color: #464c81;
}
.card .vcm-btn-secondary:before {
border: 2px solid #464c81;
}
/* BUTTON On Images */
.onimage {
background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.60)), to(rgba(0, 0, 0, 0.60))), url(/res/img/720p/vcm-bg2022.jpg);
background: -o-linear-gradient(rgba(0, 0, 0, 0.60), rgba(0, 0, 0, 0.60)), url(/res/img/720p/vcm-bg2022.jpg);
background: linear-gradient(rgba(0, 0, 0, 0.60), rgba(0, 0, 0, 0.60)), url(/res/img/720p/vcm-bg2022.jpg);
background-position: center;
height: 120px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.vcm-btn-onimg {
color: #ffffff;
background: transparent;
padding: 8px 18px;
border: 2px solid #ffffff;
border-radius: 100px;
position: relative;
}
.vcm-btn-onimg:hover {
color: #ffffff;
}
.vcm-btn-onimg:hover {
background-color:transparent;
border-color:#ffffff;
}
.vcm-btn-onimg:before {
content: "";
position: absolute;
top: -5px;
right: -5px;
bottom: -5px;
left: -5px;
border: 2px solid #ffffff;
border-radius: 104px;
opacity: 0;
-o-transition: all .4s ease-in-out;
-webkit-transition: all .4s ease-in-out;
transition: all .4s ease-in-out;
}
.vcm-btn-onimg:hover:before {
opacity: 1;
}
a.countdown-bg {
color: #ffffff;
text-decoration: none;
}
.vcm-bg-image {
background-size: cover;
background-position: 50% 80%;
height: 2vw;
max-height: 42px;
}
section.vcm-hero-50 {
padding: 0 0 70px 0;
}
.vcm-bg-image-seperator {
width: 100%;
background-repeat: no-repeat;
background-size: cover;
background-position: 50% 79%;
height: 1.4vw;
max-height: 8px;
padding: 0 !important;
}
.vcm-hero-20,
.vcm-hero-30,
.vcm-hero-40,
.vcm-hero-50 {
overflow-y: hidden;
-ms-overflow-style: none;
scrollbar-width: none;
}
.vcm-hero-20::-webkit-scrollbar,
.vcm-hero-30::-webkit-scrollbar,
.vcm-hero-40::-webkit-scrollbar,
.vcm-hero-50::-webkit-scrollbar {
display: none;
}
.vcm-hero-20,
.vcm-hero-30,
.vcm-hero-40,
.vcm-hero-50,
.vcm-hero-60 {
padding-top: 0;
padding-bottom: 0;
}
.vcm-hero-20{
min-height: 250px;
height: 20vh;
}
.vcm-hero-30{
min-height: 380px;
height: 30vh;
margin-bottom: -30px;
z-index: -1;
}
.vcm-hero-40{
min-height: 550px;
height: 40vh;
}
.vcm-hero-50 {
min-height: 500px;
height: 50vh;
max-height: unset;
}
.vcm-hero-55 {
min-height: 550px;
height: 55vh;
max-height: unset;
}
.vcm-hero-60 {
min-height: 550px;
height: 60vh;
max-height: unset;
}
@media only screen and (max-width: 768px) {
.vcm-hero-30{
min-height: 240px;
height: 30vh;
margin-bottom: -50px;
z-index: -1;
}
}
/*
section.vcm-hero-60.vcm-bg-image:before {
background: linear-gradient(270deg,hsla(0,0%,100%,0),rgb(16 15 28 / 60%));
content: "";
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
*/
.hero-box-topcontainer {
z-index: 1;
}
/* Responsive styles */
.hero-title {
font-size: 3rem;
}
.hero-subtitle {
font-size: 1rem;
z-index: 1;
margin-top: 0.6rem;
}
.hero-cta {
font-size: 1.2rem;
}
.hero-box-title {
font-size: 1.5rem;
}
.hero-box-subtitle {
font-size: 1rem;
z-index: 1;
margin: 0;
padding: 10px;
}
@media only screen and (max-width: 768px) {
.hero-title {
font-size: 3rem;
}
.hero-subtitle {
font-size: 1.5rem;
}
.hero-cta {
font-size: 1.2rem;
}
.hero-box-title {
font-size: 1.5rem;
}
.hero-box-subtitle {
font-size: 1rem;
}
.hero {
text-align: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.hero .btn-container {
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
}
@media only screen and (max-width: 480px) {
.hero-title {
font-size: 2.5rem;
}
.hero-subtitle {
font-size: 1rem;
}
.hero-cta {
font-size: 1rem;
width: 150px;
}
.hero-box-title {
font-size: 1.5rem;
}
.hero-box-subtitle {
font-size: 1rem;
}
}
.vcm-fx-rounded-bottom{
position: relative;
}
.vcm-fx-rounded-bottom:after{
content:"";
display: block;
background-image:url('data:image/svg+xml;charset=UTF-8,');
position: absolute;
bottom: 0px;
width: 100%;
height: 50px;
background-size: 100% 100%;
}
.vcm-fx-rounded-top{position: relative;}
.vcm-fx-rounded-top:before{
z-index: 1;
content:"";
display: block;
background-image:url('data:image/svg+xml;charset=UTF-8,');
position: absolute;
top: 0px;
width: 100%;
height: 50px;
margin-top: -1px;
background-size: 100% 100%;
}
.row-eq-height {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
z-index: 0;
position: relative;
}
.row-eq-height [class*="col-"] {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.card {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
height: 100%;
overflow: hidden;
}
.vcm-fx-rounded-bottom.br0{
border-radius: 0px !important;
}
.card .bi{font-size:40px;}
.vcm-nm-5{
margin-top:-150px;
}
.vcm-rounded {
width: 100%;
border-radius: 20px;
}
.vcm-hr-blue-white{
display: block;
height: 2px;
background-image: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(10%, transparent), color-stop(30%, #161c58), color-stop(30%, #161c58)), -webkit-gradient(linear, left top, right top, from(transparent), color-stop(#ffffff), to(transparent));
background-image: -o-linear-gradient(left, transparent, transparent 10%, #161c58 30%, #161c58 30%), -o-linear-gradient(left, transparent, #ffffff, transparent);
background-image: linear-gradient(90deg, transparent, transparent 10%, #161c58 30%, #161c58 30%), linear-gradient(90deg, transparent, #ffffff, transparent);
background-size: 10px 30px, 100% 2px;
border: none;
}
.vcm-hr-white-blue{
display: block;
height: 2px;
background-image: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(10%, transparent), color-stop(30%, #FFF), color-stop(30%, #FFF)), -webkit-gradient(linear, left top, right top, from(transparent), color-stop(#161c58), to(transparent));
background-image: -o-linear-gradient(left, transparent, transparent 10%, #FFF 30%, #FFF 30%), -o-linear-gradient(left, transparent, #161c58, transparent);
background-image: linear-gradient(90deg, transparent, transparent 10%, #FFF 30%, #FFF 30%), linear-gradient(90deg, transparent, #161c58, transparent);
background-size: 10px 30px, 100% 2px;
border: none;
}
.vcm-hr-white-blue-ltr{
display: block;
height: 2px;
background-image: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(10%, transparent), color-stop(30%, #FFF), color-stop(30%, #FFF)), -webkit-gradient(linear, right top, left top, from(transparent), to(#161c58));
background-image: -o-linear-gradient(left, transparent, transparent 10%, #FFF 30%, #FFF 30%), -o-linear-gradient(right, transparent, #161c58);
background-image: linear-gradient(90deg, transparent, transparent 10%, #FFF 30%, #FFF 30%), linear-gradient(270deg, transparent, #161c58);
background-size: 10px 30px, 100% 2px;
border: none;
margin: 1rem 0;
}
.vcm-hr-grey-white{
display: block;
height: 2px;
background-image: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(10%, transparent), color-stop(30%, #555964), color-stop(30%, #555964)), -webkit-gradient(linear, left top, right top, from(transparent), color-stop(#ffffff), to(transparent));
background-image: -o-linear-gradient(left, transparent, transparent 10%, #555964 30%, #555964 30%), -o-linear-gradient(left, transparent, #ffffff, transparent);
background-image: linear-gradient(90deg, transparent, transparent 10%, #555964 30%, #555964 30%), linear-gradient(90deg, transparent, #ffffff, transparent);
background-size: 10px 30px, 100% 2px;
border: none;
}
.vcm-hr-blue-white{
display: block;
height: 2px;
background-image: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(10%, transparent), color-stop(30%, #161c58), color-stop(30%, #161c58)), -webkit-gradient(linear, left top, right top, from(transparent), color-stop(#ffffff), to(transparent));
background-image: -o-linear-gradient(left, transparent, transparent 10%, #161c58 30%, #161c58 30%), -o-linear-gradient(left, transparent, #ffffff, transparent);
background-image: linear-gradient(90deg, transparent, transparent 10%, #161c58 30%, #161c58 30%), linear-gradient(90deg, transparent, #ffffff, transparent);
background-size: 10px 30px, 100% 2px;
border: none;
}
/*
a {
transition: all 0.2s ease-in-out;
}
a:hover{
transform: scale(0.98);
transition: all 0.2s ease-in-out;
}
*/
/* HEADER */
.hero {
-webkit-transform: translateY(-40px);
-ms-transform: translateY(-40px);
transform: translateY(-40px)
}
.vcm-hero-content>.container{
padding: 2rem;
}
.vcm-hero-content h1,
.vcm-hero-content h5 {
color: #ffffff;
}
.vcm-hero-content h1 {
font-size: 3.2rem;
font-weight: 700;
line-height: 1em;
color: #ffffff;
}
p.herotitle {
color: #f2f2f2;
font-weight:bold;
margin-bottom: 16px;
}
p.herotxt {
color: #f2f2f2;
font-size: 1.3rem;
line-height: 1.2;
font-weight: 300;
}
.vcm-hero-content h2{
font-size: 1.8rem;
}
@media only screen and (max-width: 991px) {
.vcm-hero-content h1{
font-size: 40px;
}
.vcm-hero-content h2{
font-size: 24px;
}
}
.modal-title h1,
.modal-title h2,
.modal-title h3,
.modal-title h4,
.modal-title h5 {
margin-bottom: 0;
}
h6 {
font-size:1.1rem;
}
h1,
h2,
h3,
h4,
h5,
h6,
.bewerbsdetailseite h1,
.bewerbsdetailseite h2,
.bewerbsdetailseite h3,
.bewerbsdetailseite h4 {
color: #161c58;
}
.text-light h1,
.text-light h2,
.text-light h3,
.text-light h4,
.text-light h5,
.text-light h1:hover,
.text-light h2:hover,
.text-light h3:hover,
.text-light h4:hover,
.text-light h5:hover,
.hero-box-topcontainer h1,
.hero-box-topcontainer h2,
.hero-box-topcontainer h3,
.hero-box-topcontainer h4,
.hero-box-topcontainer h5,
.hero-box-topcontainer h1:hover,
.hero-box-topcontainer h2:hover,
.hero-box-topcontainer h3:hover,
.hero-box-topcontainer h4:hover,
.hero-box-topcontainer h5:hover,
.countdown-bg h1,
.countdown-bg h2,
.countdown-bg h3,
.countdown-bg h4,
.countdown-bg h5,
.countdown-bg h1:hover,
.countdown-bg h2:hover,
.countdown-bg h3:hover,
.countdown-bg h4:hover,
.countdown-bg h5:hover,
.text-light a:hover,
.text-light a {
color: #fff;
}
.breadcrumb {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
padding: 0 0;
margin-bottom: 1rem;
list-style: none;
color: #7b7a7a;
font-weight: 400;
gap: 5px;
font-size: 0.9rem;
}
.breadcrumb a {
color: #7b7a7a;
text-decoration: none;
-webkit-transition: all 0.2s;
-o-transition: all 0.2s;
transition: all 0.2s;
}
a, a:hover {
color: #161c58;
}
a.hiddenlink {
text-decoration: none;
}
/* Divider */
.custom-shape-divider-bottom-1683114044 {
position: absolute;
bottom: 0;
left: 0;
width: 105%;
overflow: hidden;
line-height: 0;
-webkit-transform: rotate(180deg);
-ms-transform: rotate(180deg);
transform: rotate(180deg);
}
.custom-shape-divider-bottom-1683114044 svg {
position: relative;
display: block;
width: calc(130% + 1.3px);
height: 110px;
}
@media only screen and (max-width: 991px) {
.crazysignup {
display: none;
}
.custom-shape-divider-bottom-1683114044 {
width: 140vw;
min-width: 600px;
}
}
.custom-shape-divider-bottom-1683114044 .shape-fill {
fill: #FFFFFF;
}
.vcm-eventinfo-box {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
gap: 10px;
padding: 1.5rem;
border: 1px solid #161c59;
position: relative;
}
.vcm-eventinfo-box:before {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-image: url('/res/img/ui/stars-bg.png');
background-size: 400%;
opacity: 0.04;
z-index: 0;
-webkit-transition: all .5s;
-o-transition: all .5s;
transition: all .5s;
}
.mb-2 {
position: relative;
}
.imgcapt {
position: relative;
display: flex;
justify-content: end;
gap: 5px;
}
.mapinfo {
position: relative;
font-size: small;
}
.titlestar {
position: relative;
}
.titlestar a {
position: absolute;
right: -20px;
top: -160px;
}
.titlestar img {
height: 33vw;
max-height: 170px;
}
.bewerbseinleitung {
font-size: 1.1rem;
margin: 60px 0 50px;
}
/*
.moreinfo {
padding: 0px 0 80px;
}
*/
.pointer {
cursor: pointer;
}
.btn-close{
background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23FFF'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat;
}
.navbar a{color: #ffffff;}
.navbar a:hover{color:#009acc}
.nav-link:focus, .nav-link:hover {
color: #ffffff;
}
navmenu-cta-container {
-webkit-transition: all 0.4s;
-o-transition: all 0.4s;
transition: all 0.4s;
}
.menu-toggler-link {
display: inline-block;
padding: 10px;
cursor: pointer;
}
.menu-toggler {
position: relative;
width: 24px;
height: 2px;
background-color: #f9f9f9;
-webkit-transition: all 0.4s;
-o-transition: all 0.4s;
transition: all 0.4s;
}
.menu-toggler {
position: relative;
width: 24px;
height: 2px;
background-color: #f9f9f9;
-webkit-transition: all 0.4s;
-o-transition: all 0.4s;
transition: all 0.4s;
cursor: pointer;
}
.menu-toggler.open {
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
.menu-toggler.open::before,
.menu-toggler.open::after {
top: 0;
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
}
.menu-toggler::before,
.menu-toggler::after {
content: '';
position: absolute;
width: 100%;
height: 2px;
background-color: #f9f9f9;
-webkit-transition: all 0.4s;
-o-transition: all 0.4s;
transition: all 0.4s;
}
.menu-toggler::before {
top: -8px;
}
.menu-toggler::after {
top: 8px;
}
/* Offcanvas 2 */
button {
border: 0;
padding: 0;
background: transparent;
cursor: pointer;
}
.burger,
.menu {
position: fixed;
}
.burger {
z-index: 3;
top: 0;
left: 0;
display: -ms-grid;
display: grid;
place-items: center;
width: 88px;
height: 88px;
background-image: url("menu.svg");
background-repeat: no-repeat;
background-position: center;
}
body.open .burger {
background-image: url("close.svg");
}
.menu {
z-index: 99;
top: 0;
left: 0;
display: -ms-grid;
display: grid;
width: 100%;
height: 100%;
background: -o-linear-gradient(left, #161c58 480px, #161c58a3 80%, #161c581f);
background: linear-gradient(to right, #161c58 480px, #161c58a3 80%, #161c581f);
-webkit-transform: translateX(-100%);
-ms-transform: translateX(-100%);
transform: translateX(-100%);
-webkit-transition: -webkit-transform 0.375s cubic-bezier(0.175, 0.885, 0.32, 1);
transition: -webkit-transform 0.375s cubic-bezier(0.175, 0.885, 0.32, 1);
-o-transition: transform 0.375s cubic-bezier(0.175, 0.885, 0.32, 1);
transition: transform 0.375s cubic-bezier(0.175, 0.885, 0.32, 1);
transition: transform 0.375s cubic-bezier(0.175, 0.885, 0.32, 1), -webkit-transform 0.375s cubic-bezier(0.175, 0.885, 0.32, 1);
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch;
padding-left: 10%;
}
.navbar-nav .dropdown-toggle::after {
display: none;
}
.menu nav {
opacity: 0;
}
@-webkit-keyframes menu-in {
0% {
-webkit-clip-path: ellipse(60% 60% at 0% 50%);
clip-path: ellipse(60% 60% at 0% 50%);
}
100% {
-webkit-clip-path: ellipse(120% 120% at 0% 50%);
clip-path: ellipse(120% 120% at 0% 50%);
}
}
@keyframes menu-in {
0% {
-webkit-clip-path: ellipse(60% 60% at 0% 50%);
clip-path: ellipse(60% 60% at 0% 50%);
}
100% {
-webkit-clip-path: ellipse(120% 120% at 0% 50%);
clip-path: ellipse(120% 120% at 0% 50%);
}
}
body.open .menu {
opacity: 1;
visibility: visible;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
-webkit-animation: menu-in 0.375s;
animation: menu-in 0.375s;
overflow: scroll;
}
body.open .menu nav {
opacity: 1;
}
.menu nav:hover a {
opacity: 0.25;
}
.menu nav a:hover {
opacity: 1;
}
.menu nav {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.infolinks a {
font-size: 0.9rem !important;
padding: 15px !important;
}
nav.infolinks {
padding: 20px 0;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
}
@media only screen and (max-width: 760px) {
.menu a {
position: relative;
color: #f9f9f9;
font-size: 1.3rem;
padding: 20px 0;
text-decoration: none;
-webkit-transition: 0.4s;
-o-transition: 0.4s;
transition: 0.4s;
}
}
@media only screen and (min-width: 761px) {
.menu a {
position: relative;
color: #f9f9f9;
font-size: 1.8rem;
padding: 20px 0;
text-decoration: none;
-webkit-transition: 0.4s;
-o-transition: 0.4s;
transition: 0.4s;
}
}
a.close-menu {
font-size: 1rem;
padding: 0px;
}
.menu-header {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: end;
-ms-flex-align: end;
align-items: end;
padding: 30px 0px;
height: 130px;
border-bottom: 1px solid #ffffff47;
}
.menu-header #logo {
max-width: 80px;
}
@media only screen and (max-width: 480px) {
.menu-header {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: end;
-ms-flex-align: end;
align-items: end;
width: 80vw;
padding: 20px 0px;
}
}
.menu a::before,
.menu a::after {
content: "";
position: absolute;
left: 0;
bottom: 10px;
width: 100%;
height: 2px;
border-radius:2px;
-webkit-transition: 0.4s;
-o-transition: 0.4s;
transition: 0.4s;
}
.menu a::before {
opacity: 0;
background: rgb(255 255 255 / 20%);
}
.menu a::after {
-webkit-transform: scaleX(0);
-ms-transform: scaleX(0);
transform: scaleX(0);
-webkit-transform-origin: 0% 50%;
-ms-transform-origin: 0% 50%;
transform-origin: 0% 50%;
background: #f7f7f7;
}
.menu a:hover::before {
opacity: 1;
}
.menu a:hover::after {
-webkit-transform: scaleX(1);
-ms-transform: scaleX(1);
transform: scaleX(1);
}
body.open .menu a {
-webkit-animation: appear 0.25s backwards;
animation: appear 0.25s backwards;
}
@-webkit-keyframes appear {
0% {
opacity: 0;
-webkit-transform: translateX(-30px);
transform: translateX(-30px);
}
100% {
opacity: 1;
}
}
@keyframes appear {
0% {
opacity: 0;
-webkit-transform: translateX(-30px);
transform: translateX(-30px);
}
100% {
opacity: 1;
}
}
header .link-light {
min-height: 24px;
line-height: 1;
}
header .m-1 .link-light {
min-height: 21px;
line-height: 1;
}
.text-end {
text-align: right!important;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: end;
gap: 15px;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
/* countdown */
#headline {
font-size: 1.6rem;
}
#countdown ul {
padding-left: 0;
margin: 0;
}
#countdown li {
display: inline-block;
font-size: 1em;
list-style-type: none;
padding: 20px;
text-transform: uppercase;
border: 2px solid;
border-radius: 100px;
width: 138px;
margin: 5px 10px;
}
#countdown li span {
display: block;
font-size: 3.5rem;
line-height: normal;
}
@media all and (max-width: 768px) {
#countdown li {
font-size: calc(1.125rem * var(--smaller));
}
#countdown li span {
font-size: calc(2.375rem * var(--smaller));
}
}
/* OFFCANVAS *
.offcanvas {
width: 100%;
background: transparent;
}
.offcanvas-header {
background: linear-gradient(to left, #161c58, transparent);
}
.offcanvas-body {
display: flex;
justify-content: flex-end;
padding: 0;
}
.navbar {
background: linear-gradient(to left, #161c58, transparent);
width: 100%;
padding: 0;
}
.navbar-nav {
align-items: center;
height: 100%;
}
.nav-item {
align-self: center;
}
.offcanvas-body .nav-item {
align-self: end;
font-size: 1.4rem;
font-weight: 400;
}
.navbar a{color: #ffffff;}
.navbar a:hover{color:#ffffff}
.nav-link:focus, .nav-link:hover {
color: #ffffff;
transform: scale(1.2);
transform-origin: right;
}
/* HOME #### NEWSBLOG ##### */
.vcm-newsblog {
display: -ms-grid;
display: grid;
-ms-grid-columns: 1fr 5px 1fr 5px 1fr 5px 1fr;
grid-template-columns: repeat(4, 1fr);
-ms-grid-rows: 1fr 5px 1fr 5px 1fr 5px 1fr 5px 1fr;
grid-template-rows: repeat(5, 1fr);
grid-column-gap: 5px;
grid-row-gap: 5px;
height: 500px;
}
.vcm-newsblog > *:nth-child(1) {
-ms-grid-row: 1;
-ms-grid-column: 1;
}
.vcm-newsblog > *:nth-child(2) {
-ms-grid-row: 1;
-ms-grid-column: 3;
}
.vcm-newsblog > *:nth-child(3) {
-ms-grid-row: 1;
-ms-grid-column: 5;
}
.vcm-newsblog > *:nth-child(4) {
-ms-grid-row: 1;
-ms-grid-column: 7;
}
.vcm-newsblog > *:nth-child(5) {
-ms-grid-row: 3;
-ms-grid-column: 1;
}
.vcm-newsblog > *:nth-child(6) {
-ms-grid-row: 3;
-ms-grid-column: 3;
}
.vcm-newsblog > *:nth-child(7) {
-ms-grid-row: 3;
-ms-grid-column: 5;
}
.vcm-newsblog > *:nth-child(8) {
-ms-grid-row: 3;
-ms-grid-column: 7;
}
.vcm-newsblog > *:nth-child(9) {
-ms-grid-row: 5;
-ms-grid-column: 1;
}
.vcm-newsblog > *:nth-child(10) {
-ms-grid-row: 5;
-ms-grid-column: 3;
}
.vcm-newsblog > *:nth-child(11) {
-ms-grid-row: 5;
-ms-grid-column: 5;
}
.vcm-newsblog > *:nth-child(12) {
-ms-grid-row: 5;
-ms-grid-column: 7;
}
.vcm-newsblog > *:nth-child(13) {
-ms-grid-row: 7;
-ms-grid-column: 1;
}
.vcm-newsblog > *:nth-child(14) {
-ms-grid-row: 7;
-ms-grid-column: 3;
}
.vcm-newsblog > *:nth-child(15) {
-ms-grid-row: 7;
-ms-grid-column: 5;
}
.vcm-newsblog > *:nth-child(16) {
-ms-grid-row: 7;
-ms-grid-column: 7;
}
.vcm-newsblog > *:nth-child(17) {
-ms-grid-row: 9;
-ms-grid-column: 1;
}
.vcm-newsblog > *:nth-child(18) {
-ms-grid-row: 9;
-ms-grid-column: 3;
}
.vcm-newsblog > *:nth-child(19) {
-ms-grid-row: 9;
-ms-grid-column: 5;
}
.vcm-newsblog > *:nth-child(20) {
-ms-grid-row: 9;
-ms-grid-column: 7;
}
.vcm-newsblog-1 { -ms-grid-row: 1; -ms-grid-row-span: 5; -ms-grid-column: 1; -ms-grid-column-span: 2; grid-area: 1 / 1 / 6 / 3; }
.vcm-newsblog-2 { -ms-grid-row: 1; -ms-grid-row-span: 3; -ms-grid-column: 3; -ms-grid-column-span: 2; grid-area: 1 / 3 / 4 / 5; }
.vcm-newsblog-3 { -ms-grid-row: 4; -ms-grid-row-span: 2; -ms-grid-column: 3; -ms-grid-column-span: 1; grid-area: 4 / 3 / 6 / 4; }
.vcm-newsblog-4 {-ms-grid-row: 4;-ms-grid-row-span: 2;-ms-grid-column: 4;-ms-grid-column-span: 1;grid-area: 4 / 4 / 6 / 5; }
@media only screen and (max-width: 768px) {
.vcm-newsblog {height: 800px;}
.vcm-newsblog-1 { -ms-grid-row: 1; -ms-grid-row-span: 2; -ms-grid-column: 1; -ms-grid-column-span: 4; grid-area: 1 / 1 / 3 / 5; }
.vcm-newsblog-2 { -ms-grid-row: 3; -ms-grid-row-span: 1; -ms-grid-column: 1; -ms-grid-column-span: 4; grid-area: 3 / 1 / 4 / 5; }
.vcm-newsblog-3 { -ms-grid-row: 4; -ms-grid-row-span: 1; -ms-grid-column: 1; -ms-grid-column-span: 4; grid-area: 4 / 1 / 5 / 5; }
.vcm-newsblog-4 { -ms-grid-row: 5; -ms-grid-row-span: 1; -ms-grid-column: 1; -ms-grid-column-span: 4; grid-area: 5 / 1 / 6 / 5; }
}
.vcm-newsblog-card {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: start;
}
.vcm-newsblog-card label{
position: ;
}
.vcm-newsblog-card>div{
background: rgba(0,0,0,0.5);
width: 100%;
color: #fff;
}
h3,h4{
font-weight: 500;
line-height: 1;
margin-bottom: 1rem;
text-wrap: balance;
}
h3.mn8-text-base {
margin-bottom: 0.3rem;
}
/* Home Jumbotron */
.homeparent {
display: -ms-grid;
display: grid;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
grid-column-gap: 2rem;
grid-row-gap:2rem;
}
/*
@media (min-width: 890px) {
.homeparent {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(2, 1fr);
grid-column-gap: 20px;
grid-row-gap: 20px;
}
.homenewsbox1 { grid-area: 1 / 1 / 2 / 2; }
.homenewsbox2 { grid-area: 1 / 2 / 2 / 3; }
.homenewsbox3 { grid-area: 1 / 3 / 2 / 4; }
.homenewsbox4 { grid-area: 2 / 1 / 3 / 2; }
.homenewsbox5 { grid-area: 2 / 2 / 3 / 3; }
.homenewsbox6 { grid-area: 2 / 3 / 3 / 4; }
}
@media (min-width: 600px) AND (max-width: 890px) {
.homeparent {
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-template-rows: repeat(3, 1fr);
grid-column-gap: 20px;
grid-row-gap: 20px;
}
.homenewsbox1 { grid-area: 1 / 1 / 2 / 2; }
.homenewsbox2 { grid-area: 1 / 2 / 2 / 3; }
.homenewsbox3 { grid-area: 2 / 1 / 3 / 2; }
.homenewsbox4 { grid-area: 2 / 2 / 3 / 3; }
.homenewsbox5 { grid-area: 3 / 1 / 4 / 2; }
.homenewsbox6 { grid-area: 3 / 2 / 4 / 3; }
}
@media (max-width: 600px) {
.homeparent {
display: grid;
grid-template-columns: 1fr;
grid-template-rows: repeat(6, 1fr);
grid-column-gap: 20px;
grid-row-gap: 20px;
}
.homenewsbox1 { grid-area: 1 / 1 / 2 / 2; }
.homenewsbox2 { grid-area: 2 / 1 / 3 / 2; }
.homenewsbox3 { grid-area: 3 / 1 / 4 / 2; }
.homenewsbox4 { grid-area: 4 / 1 / 5 / 2; }
.homenewsbox5 { grid-area: 5 / 1 / 6 / 2; }
.homenewsbox6 { grid-area: 6 / 1 / 7 / 2; }
}
*/
.homenewsbox {
border: 1px solid #ccc;
padding: 10px;
-webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
.homenewsbox img {
max-width: 100%;
height: auto;
}
.homenewsbox .content {
padding: 10px;
}
.homenews-card {
width: 100%;
background: #fff;
-webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
-webkit-transition: -webkit-box-shadow 0.3s;
transition: -webkit-box-shadow 0.3s;
-o-transition: box-shadow 0.3s;
transition: box-shadow 0.3s;
transition: box-shadow 0.3s, -webkit-box-shadow 0.3s;
border-radius: 20px;
position: relative;
}
.homenews-card:hover {
-webkit-box-shadow: 0 0 50px rgba(0, 0, 0, 0.3);
box-shadow: 0 0 50px rgba(0, 0, 0, 0.3);
}
.homenews-card a {
color: inherit;
text-decoration: none;
}
.homenews-card__date {
background: #08c;
position: absolute;
top: 20px;
right: 20px;
width: 45px;
height: 45px;
border-radius: 50%;
color: #fff;
text-align: center;
line-height: 13px;
font-weight: bold;
padding-top: 10px;
}
.homenews-card__date__day {
display: block;
font-size: 14px;
}
.homenews-card__date__month {
display: block;
font-size: 10px;
text-transform: uppercase;
}
.homenews-card__thumb {
height: 200px;
overflow: hidden;
-webkit-transition: height 0.3s;
-o-transition: height 0.3s;
transition: height 0.3s;
border-radius: 20px 20px 0 0;
position: relative;
}
.eventinfo .homeparent {
grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
}
@media (max-width: 300px) {
.eventinfo .homeparent {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
}
}
.eventinfo .homenews-card__thumb {
height: 150px;
}
.eventinfo .homenews-card {
text-align: left;
}
.eventinfo .homeparent {
margin-bottom: 4rem;
}
.full-label {
display: inline;
}
.short-label {
display: none;
}
@media (max-width: 400px) {
.full-label {
display: none;
}
.short-label {
display: inline;
}
}
.homenews-card__thumb img {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -35%) scale(1);
-ms-transform: translate(-50%, -35%) scale(1);
transform: translate(-50%, -35%) scale(1);
min-width: 100%;
min-height: 100%;
width: auto;
max-width: 130%;
height: auto;
opacity: 1;
-webkit-transition: -webkit-transform 0.3s;
transition: -webkit-transform 0.3s;
-o-transition: transform 0.3s;
transition: transform 0.3s;
transition: transform 0.3s, -webkit-transform 0.3s;
}
.homenews-card:hover .homenews-card__thumb img {
-webkit-transform: translate(-50%, -35%) scale(1.2);
-ms-transform: translate(-50%, -35%) scale(1.2);
transform: translate(-50%, -35%) scale(1.2);
}
#training .homenews-card__thumb img,
#vorbereitung .homenews-card__thumb img,
#community .homenews-card__thumb img,
#moreevents .homenews-card__thumb img {
-webkit-transform: translate(-50%, -50%) scale(1);
-ms-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
#training .homenews-card:hover .homenews-card__thumb img,
#vorbereitung .homenews-card:hover .homenews-card__thumb img,
#community .homenews-card:hover .homenews-card__thumb img,
#moreevents .homenews-card:hover .homenews-card__thumb img {
-webkit-transform: translate(-50%, -50%) scale(1.2);
-ms-transform: translate(-50%, -50%) scale(1.2);
transform: translate(-50%, -50%) scale(1.2);
}
.homenews-card__body {
position: relative;
padding: 20px;
margin-bottom: 10px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
gap: 15px;
}
.homenews-card__category {
position: absolute;
top: -25px;
left: 0;
height: 25px;
padding: 0 15px;
color: #fff;
font-size: 11px;
line-height: 25px;
}
.homenews-card__category.national {
background: #ea5167;
}
.homenews-card__category.service {
background: #009ba8;
}
.homenews-card__category.anzeige {
background: #f07f36;
}
.homenews-card__category a {
color: #fff;
text-decoration: none;
text-transform: uppercase;
}
.homenews-card__smalldate {
color: #212529;
font-size: 1rem;
line-height: 1.2;
margin-bottom: 0;
}
.homenews-card__title {
font-size: 1.2rem;
line-height: 1.1;
color: #161c58;
font-weight: 500;
}
.homenews-card__subtitle {
color: #212529;
font-size: 1rem;
line-height: 1.2;
margin-bottom: 20px;
}
.homenewsbox0.homenews-card {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.homenewsbox0 .homenews-card__thumb {
height: 100%;
width: 80%;
border-radius: 20px 0 0 20px;
}
.newstext-container.link-fx-1 {
padding: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.newstext-container.borderless svg {
position: relative;
width: 60px;
color: #161c58;
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
}
.homenews-card:hover svg line {
display: block;
-webkit-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
transform: rotate(-180deg);
transition: transform 0.6s 0.8s, -webkit-transform 0.6s 0.8s;
}
.homenews-card:hover svg line:last-child {
display: block;
-webkit-transform: rotate(180deg);
-ms-transform: rotate(180deg);
transform: rotate(180deg);
transition: transform 0.6s 0.8s, -webkit-transform 0.6s 0.8s;
}
.homenews-card:hover::before {
-webkit-transform: translateX(17px) scaleX(0);
-ms-transform: translateX(17px) scaleX(0);
transform: translateX(17px) scaleX(0);
transition: -webkit-transform 0.2s;
-webkit-transition: -webkit-transform 0.2s;
-o-transition: transform 0.2s;
transition: transform 0.2s;
transition: transform 0.2s, -webkit-transform 0.2s;
}
.homenews-card:hover svg circle {
stroke-dashoffset: 200;
-webkit-transition: stroke-dashoffset 0.2s 0.1s;
-o-transition: stroke-dashoffset 0.2s 0.1s;
transition: stroke-dashoffset 0.2s 0.1s;
}
.homenews-card a.link-fx-1.lw7-color-contrast-higher {
font-size: 0.9rem;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
position: absolute;
right: 45px;
bottom: 15px;
font-weight: 600;
color: #161c58;
height: 25px;
}
.homenews-card .link-fx-1 svg {
height: 25px;
}
.homenews-card a.link-fx-1.lw7-color-contrast-higher.borderless span {
-webkit-transform: translateX(30px);
-ms-transform: translateX(30px);
transform: translateX(30px);
-webkit-transition: all .25s;
-o-transition: all .25s;
transition: all .25s;
}
.homenews-card:hover a.link-fx-1.lw7-color-contrast-higher.borderless span {
-webkit-transform: translateX(0px);
-ms-transform: translateX(0px);
transform: translateX(0px);
-webkit-transition: all .25s;
-o-transition: all .25s;
transition: all .25s;
color: #161c58;
}
.homenews-card:hover a.link-fx-1.lw7-color-contrast-higher {
-webkit-transition: all .25s;
-o-transition: all .25s;
transition: all .25s;
color: #161c58;
}
/* BEWERBE */
.vcm-bewerbe-image{
border-radius: 15px 0px 0px 15px;
width:30%;
height: 150px;
-o-object-fit: cover;
object-fit: cover;
}
.vcm-bewerbe-card{
min-height: 200px;
}
.vcm-bewerbe-card h4{
background: rgba(22,28,88,0.8);
}
/* BEWERBE DETAIL */
.progress-container {
display:-webkit-box;
display:-ms-flexbox;
display:flex;
border-radius: 15px;
overflow: hidden;
}
.progress {
display:inline-block;
-webkit-box-flex:1;
-ms-flex-positive:1;
flex-grow:1;
border-radius: 0;
height: auto;
}
.progress-bar {
background-color: #b2dbdf;
color: #454545;
padding: 10px 0px;
text-indent: 20px;
font-size: 14px;
}
/*
.progress-bar-success {
background-color: #5CB85C;
}
.progress-bar-info {
background-color: #5BC0DE;
}
.progress-bar-warning {
background-color: #FAB870;
}
*/
.progress-middle {
border-left: 1px solid #FFFFFF;
border-right: 1px solid #FFFFFF;
}
/* FOOTER */
#vcm-footer-logos img{
width: 90%;
max-width: 250px;
margin:10px;
}
#vcm-fixedsocialsidemenu{
left: 0px;
top:50%;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
justify-items: start;
margin-top: -100px;
z-index: 9;
}
#vcm-fixedsocialsidemenu li{
border-radius: 0px 5px 5px 0px;
}
#vcm-fixedsocialsidemenu a:hover{
padding-left:20px;
}
/* ACCODION */
.accordion-item{border: none 0px; margin-bottom:5px;}
.accordion-button{
background: #e5e8ec;
border-radius: 15px !important;
}
.accordion-button:not(.collapsed){
background: #161c58;
color: #fff;
}
.accordion-button:not(.collapsed)::after {
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
-webkit-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
transform: rotate(-180deg);
}
/* NEWS */
.vcm-news-date-box{
padding:10px;
border: 1px solid black;
margin-right: 20px;
text-align: center;
}
.vcm-news-box-imagecontainer{
min-height: 250px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: end;
position: relative;
}
.vcm-news-box-imagecontainer .vcm-news-date-box{
position: absolute;
left:0px;
top:20px;
background: white;
}
.vcm-news-box h4{
background: rgba(0,0,0,0.6);
padding: 10px;
text-align: center;
color: #fff;
margin: 0px;
}
.vcm-news-box{
border-radius: 15px;
border: 1px solid #ccc;
}
.page-item .page-link{
border:none;
color:#161c58;
}
.page-item.active .page-link{
text-decoration: underline;
font-weight: bold;
}
/* TEAM */
.teamimage{
max-width: 240px;
margin-bottom:20px;
width: 100%;
}
/* component radio switch START*/
:root {
--radio-switch-width: 186px;
--radio-switch-height: 46px;
--radio-switch-padding: 3px;
--radio-switch-radius: 50em;
--radio-switch-animation-duration: 0.3s;
}
.radio-switch {
position: relative;
display: inline-block;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
padding: var(--radio-switch-padding);
border-radius: calc(var(--radio-switch-radius) * 1.4);
background-color: hsl(var(--ri5-color-bg-darker-hsl));
}
.radio-switch:focus-within, .radio-switch:active {
-webkit-box-shadow: 0 0 0 2px hsla(var(--ri5-color-contrast-higher-hsl), 0.15);
box-shadow: 0 0 0 2px hsla(var(--ri5-color-contrast-higher-hsl), 0.15);
}
.radio-switch__item {
position: relative;
display: inline-block;
height: calc(var(--radio-switch-height) - 2*var(--radio-switch-padding));
width: calc(var(--radio-switch-width)*0.5 - var(--radio-switch-padding));
}
.radio-switch__label {
position: relative;
z-index: 2;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
height: 100%;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
border-radius: var(--radio-switch-radius);
cursor: pointer;
font-size: var(--ri5-text-sm);
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-transition: all var(--radio-switch-animation-duration);
-o-transition: all var(--radio-switch-animation-duration);
transition: all var(--radio-switch-animation-duration);
}
.radio-switch__input:checked ~ .radio-switch__label {
color: hsl(var(--ri5-color-white-hsl));
}
.radio-switch__input:focus ~ .radio-switch__label {
background-color: hsla(var(--ri5-color-primary-hsl), 0.6));
}
.radio-switch__label :not(*):focus-within, .radio-switch__input:focus ~ .radio-switch__label {
background-color: transparent;
}
.radio-switch__marker {
position: absolute;
z-index: 1;
top: 0;
left: -100%;
border-radius: var(--radio-switch-radius);
background-color: hsl(var(--ri5-color-primary-hsl));
height: calc(var(--radio-switch-height) - 2*var(--radio-switch-padding));
width: calc(var(--radio-switch-width)*0.5 - var(--radio-switch-padding));
-webkit-box-shadow: 0 0.9px 1.5px rgba(0, 0, 0, 0.03),0 3.1px 5.5px rgba(0, 0, 0, 0.08),0 14px 25px rgba(0, 0, 0, 0.12);
box-shadow: 0 0.9px 1.5px rgba(0, 0, 0, 0.03),0 3.1px 5.5px rgba(0, 0, 0, 0.08),0 14px 25px rgba(0, 0, 0, 0.12);
transition: -webkit-transform var(--radio-switch-animation-duration);
-webkit-transition: -webkit-transform var(--radio-switch-animation-duration);
-o-transition: transform var(--radio-switch-animation-duration);
transition: transform var(--radio-switch-animation-duration);
transition: transform var(--radio-switch-animation-duration), -webkit-transform var(--radio-switch-animation-duration);
}
.radio-switch__input:checked ~ .radio-switch__marker {
-webkit-transform: translateX(100%);
-ms-transform: translateX(100%);
transform: translateX(100%);
}
/* component radio switch END*/
/* CARDS Start */
@media (min-width: 1060px) {
.bewerbegrid,
.heroboxes {
display: -ms-grid;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
grid-column-gap: 25px;
grid-row-gap: 25px;
}
.testimonial-container {
margin: 2rem auto;
padding: 30px;
}
}
.bewerbegrid::-webkit-scrollbar {
display: none; /* Hide scrollbar for Chrome, Safari, and Opera */
}
@media (max-width: 1060px) {
.row.nomargin {
width: 100vw;
margin-left: -25px;
}
.bewerbegrid {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
overflow-x: scroll;
-ms-scroll-snap-type: x mandatory;
scroll-snap-type: x mandatory;
-webkit-overflow-scrolling: touch;
grid-column-gap: 20px;
padding: 60px 20px 60px;
}
.testimonial-container {
margin: 2rem auto;
padding: 0 2rem;
}
.card {
-webkit-box-flex: 0;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
scroll-snap-align: center;
width: 88%;
max-width: 380px;
}
}
.invorbereitung-overlay {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-color: rgba(255, 255, 255, 0.7);
-webkit-backdrop-filter: blur(5px);
backdrop-filter: blur(5px);
z-index: 1;
border-radius: 18px;
}
.invorbereitung-overlay-text {
font-size: 24px;
font-weight: bold;
color: #333;
}
.bewerbegrid {
margin-bottom: 30px;
}
.card {
-webkit-transition: 0.3s;
-o-transition: 0.3s;
transition: 0.3s;
border-radius: 20px;
}
.card:hover {
-webkit-box-shadow: 0 0 50px rgba(0, 0, 0, 0.3);
box-shadow: 0 0 50px rgba(0, 0, 0, 0.3);
}
a.mobile .card {
background: #161c58;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
width: 300px;
padding: 25px;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
}
.mobile .card h5 {
color: #F3F3F3;
}
.arrow {
-webkit-transition: all 0.5s;
-o-transition: all 0.5s;
transition: all 0.5s;
color: #F3F3F3;
font-size: 2rem;
margin-top: 15px;
-webkit-transform: translateX(-60px);
-ms-transform: translateX(-60px);
transform: translateX(-60px);
}
a.mobile .card:hover .arrow {
-webkit-transform: translateX(-20px);
-ms-transform: translateX(-20px);
transform: translateX(-20px);
}
.card-body {
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
padding: 1rem 1rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.card small {
color: #f4b21b;
font-weight: 500;
font-size: 0.75rem;
}
.card img {
width: 100%;
height: 200px;
-o-object-fit: cover;
object-fit: cover;
border-radius: 18px 18px 0 0;
}
#winterruns .card img {
object-position: 100% 0%;
}
.card-title {
text-transform: uppercase;
margin-bottom: 0;
}
.card-details {
display: -ms-grid;
display: grid;
-ms-grid-columns: 1fr 0px 1fr;
grid-template-columns: repeat(2, 1fr);
grid-column-gap: 0px;
grid-row-gap: 0px;
font-size: 0.9rem;
}
.card-details svg {
width: 24px;
-webkit-transform: translateY(-2px);
-ms-transform: translateY(-2px);
transform: translateY(-2px);
color: #fff;
}
.card-details svg#Light {
width: 20px;
}
.card-text {
margin: 10px auto 20px;
padding: 0 10px;
font-size: 1rem;
}
.card-footer {
padding: 0.9rem;
background-color: unset;
border-top: unset;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.card-footer .center {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.info-icon-disabled {
padding-left: 5px;
position: relative;
}
.info-icon {
padding-left: 5px;
cursor: help;
position: relative;
}
.info-icon::before {
content: attr(data-tooltip);
position: absolute;
bottom: 140%;
left: -50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
background: #333;
color: #fff;
padding: 5px;
border-radius: 5px;
white-space: pre-wrap;
visibility: hidden;
opacity: 0;
-webkit-transition: opacity 0.3s;
-o-transition: opacity 0.3s;
transition: opacity 0.3s;
width: 200px;
}
.info-icon:hover::before {
visibility: visible;
opacity: 1;
}
/* CARDS End */
.banner-wrapper {
height: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
position: sticky;
top: 30px;
padding: 70px 0 100px;
-webkit-box-align: end;
-ms-flex-align: end;
align-items: end;
}
@media only screen and (max-width: 991px) {
a.sticky_skybanner {
display: none;
}
}
/* Shopbanner Start */
.shopbanner {
display: block;
text-decoration: none;
color: inherit;
overflow: hidden;
background-color: hsl(0, 0%, 100%);
-webkit-box-shadow: 0 0 0 1px hsla(230, 13%, 9%, 0.05),
0 0.3px 0.4px hsla(230, 13%, 9%, 0.02),
0 0.9px 1.5px hsla(230, 13%, 9%, 0.045),
0 3.5px 6px hsla(230, 13%, 9%, 0.09);
box-shadow: 0 0 0 1px hsla(230, 13%, 9%, 0.05),
0 0.3px 0.4px hsla(230, 13%, 9%, 0.02),
0 0.9px 1.5px hsla(230, 13%, 9%, 0.045),
0 3.5px 6px hsla(230, 13%, 9%, 0.09);
border-radius: 20px;
-webkit-transition: 0.3s;
-o-transition: 0.3s;
transition: 0.3s;
}
.shopbanner__grid {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.shopbanner__grid > * {
min-width: 0;
}
.shopbanner__link {
position: relative;
text-decoration: none;
color: hsl(250, 84%, 54%);
display: inline-block;
-webkit-transition: 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
-o-transition: 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
transition: 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
}
.shopbanner__link i { /* label */
position: relative;
z-index: 2;
display: inline-block;
-webkit-transition: 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
-o-transition: 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
transition: 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.shopbanner__link::after { /* animated border */
content: "";
background-color: currentColor;
height: 2px;
width: 100%;
position: absolute;
z-index: 1;
bottom: 0;
left: 0;
-webkit-clip-path: inset(0% round 0.1875em);
clip-path: inset(0% round 0.1875em);
opacity: 0.15;
-webkit-transition: 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
-o-transition: 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
transition: 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.shopbanner__figure {
height: 0;
width: 100%;
padding-bottom: 50%;
-webkit-transition: 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
-o-transition: 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
transition: 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
background-repeat: no-repeat;
background-size: auto;
background-position: 34% 40%;
}
.shopnav .shopbanner__grid {
border-radius: 0 0 10px 0;
overflow: hidden;
}
.shopbanner__text {
padding: 1.5rem;
}
.shopmessage {
font-size: 1.1rem;
margin: 20px 0 40px;
}
.shopbanner__link-wrapper {
margin-top: 1rem;
margin-bottom: 0;
}
.shopbanner:hover {
-webkit-box-shadow: 0 0 0 1px hsla(230, 13%, 9%, 0.05),
0 0.9px 1.25px hsla(230, 13%, 9%, 0.025),
0 3px 5px hsla(230, 13%, 9%, 0.05),
0 12px 20px hsla(230, 13%, 9%, 0.09);
box-shadow: 0 0 0 1px hsla(230, 13%, 9%, 0.05),
0 0.9px 1.25px hsla(230, 13%, 9%, 0.025),
0 3px 5px hsla(230, 13%, 9%, 0.05),
0 12px 20px hsla(230, 13%, 9%, 0.09);
}
.shopbanner:hover .shopbanner__link {
-webkit-transform: scale(1.3);
-ms-transform: scale(1.3);
transform: scale(1.3);
}
.shopbanner:hover .shopbanner__link i { /* reverse parent transformation */
-webkit-transform: scale(0.7);
-ms-transform: scale(0.7);
transform: scale(0.7);
}
.shopbanner:hover .shopbanner__link::after {
height: 100%;
}
.shopbanner:hover .shopbanner__figure {
-webkit-transform: scale(1.05);
-ms-transform: scale(1.05);
transform: scale(1.05);
}
@media (min-width: 640px) {
.shopbanner__grid {
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
-ms-flex-direction: row-reverse;
flex-direction: row-reverse;
}
.shopbanner__grid > * {
width: 50%;
}
.shopbanner__figure {
height: 100%;
padding-bottom: 0;
-webkit-clip-path: polygon(100px 0%, 100% 0%, 100% 100%, 50px 100%);
clip-path: polygon(100px 0%, 100% 0%, 100% 100%, 50px 100%);
}
.shopbanner__text {
padding: 2rem;
}
.shopbanner__link-wrapper {
margin-top: 2rem;
}
.shopbanner--invert .shopbanner__grid {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
}
.shopbanner--invert .shopbanner__figure {
-webkit-clip-path: polygon(0% 0%, calc(100% - 100px) 0%, calc(100% - 50px) 100%, 0% 100%);
clip-path: polygon(0% 0%, calc(100% - 100px) 0%, calc(100% - 50px) 100%, 0% 100%);
}
.shopbanner--invert .shopbanner__text {
text-align: right;
}
.shopbanner--invert .shopbanner__link {
-webkit-transform-origin: right bottom;
-ms-transform-origin: right bottom;
transform-origin: right bottom;
}
.shopbanner:hover .shopbanner__figure {
-webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
}
}
@media (max-width: 640px) {
.shopbanner__text {
padding: 1rem 2rem 2rem;
}
}
/** Shopbanner ENDE **/
.pointer {
cursor: pointer;
}
.btn-close{
background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23FFF'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat;
}
.btn-primary {
background: #161c58 !important;
border-color: #161c58 !important;
}
.modal-footer .btn-primary {
color: #fff;
}
/* BEWERBE DETAIL */
.progress-container {
display:-webkit-box;
display:-ms-flexbox;
display:flex;
border-radius: 15px;
overflow: hidden;
}
.progress {
display:inline-block;
-webkit-box-flex:1;
-ms-flex-positive:1;
flex-grow:1;
border-radius: 0;
height: auto;
}
.progress-bar {
background-color: #b2dbdf;
color: #454545;
padding: 10px 0px;
text-indent: 20px;
font-size: 14px;
}
/*
.progress-bar-success {
background-color: #5CB85C;
}
.progress-bar-info {
background-color: #5BC0DE;
}
.progress-bar-warning {
background-color: #FAB870;
}
*/
.progress-middle {
border-left: 1px solid #FFFFFF;
border-right: 1px solid #FFFFFF;
}
/* NEWS NAV Start */
.mega-nav__sub-nav.mega-nav__sub-nav--layout-news {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
padding-bottom: 0 !important;
}
.mega-nav--mobile .mega-nav__nav, .mega-nav--mobile .mega-nav__search {
z-index: 10;
}
.news-container {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
max-width: 75%;
margin-right: 1rem;
}
.news-list-container {
background: #eef0f6;
padding: 10px;
border-radius: 15px;
}
.news-item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: 10px;
border-bottom: 1px solid #fff;
height: auto;
}
.news-item:nth-child(3) {
border-bottom: none;
}
a.news-item {
text-decoration: none;
}
.news-image {
width: 100px;
height: 100px;
-o-object-fit: cover;
object-fit: cover;
border-radius: 10px;
}
.news-info {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
margin-left: 15px;
width: calc(100% - 150px);
}
.news-title {
margin-bottom: 0.6rem;
font-size: 1.1rem;
font-weight: 600;
}
.news-date {
margin: 0;
font-size: 0.75rem;
color: #6a6a6a;
}
.news-summary {
margin: 0;
font-size: 0.95rem;
color: #595959;
line-height: 1.2;
}
a.news-item.link-fx-1.borderless svg {
position: relative;
width: 50px;
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
}
/* NEWS NAV End */
/* Testimonial Start */
.testimonial-container {
position: relative;
overflow: hidden;
}
.testimonial-slides {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-transition: all 1.5s ease;
-o-transition: all 1.5s ease;
transition: all 1.5s ease;
}
.testimonial-slide {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
min-width: 100%;
opacity: 0;
-webkit-transition: opacity 0.8s;
-o-transition: opacity 0.8s;
transition: opacity 0.8s;
}
.testimonial-quote {
position: relative;
text-align: center;
font-style: italic;
font-size: 1.6rem;
width: 90%;
max-width: 800px;
margin: 0 auto;
line-height: 1.2;
}
.testimonial-quote p:before {
content: '“';
font-size: 24rem;
position: absolute;
left: 0px;
top: -110px;
color: #ddd;
opacity: 0.4;
z-index: -1;
}
.testimonial-author {
text-align: center;
}
.testimonial-author h3 {
color: #333;
font-size: 1.1rem;
margin-bottom: 2px;
}
.testimonial-author p {
color: #666;
font-size: 0.9rem;
}
.testimonial-arrow {
font-size: 2rem;
cursor: pointer;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
z-index: 1;
color: #161c59;
opacity: 0.2;
}
.testimonial-arrow.left svg {
-webkit-transform: rotate(180deg);
-ms-transform: rotate(180deg);
transform: rotate(180deg);
}
.left { left: 2%; }
.right { right: 2%; }
/* Testimonial End */
/** Filter Tabs START **/
ul.news-kat-nav {
display: flex;
gap: 10px;
}
ul.news-kat-nav li {
padding: 10px 0;
}
ul.news-kat-nav li a {
background: #eef0f6;
border-radius: 20px;
border: 1px solid #c1c3d54d;
padding: 10px 20px;
text-decoration: none;
transition: .2s;
}
ul.news-kat-nav li a:hover,
ul.news-kat-nav li.active a {
border: 1px solid #161c58;
background: #161c582e;
transition: .2s;
}
/* buttons */
.fo5-btn {
position: relative;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
font-size: 1em;
white-space: nowrap;
text-decoration: none;
background: hsl(var(--fo5-color-bg-dark-hsl));
color: hsl(var(--fo5-color-contrast-higher-hsl));
cursor: pointer;
text-decoration: none;
line-height: 1.2;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-transition: all 0.2s ease;
-o-transition: all 0.2s ease;
transition: all 0.2s ease;
will-change: transform;
padding: var(--fo5-space-2xs) var(--fo5-space-sm);
border-radius: 0.25em;
}
.fo5-btn:focus-visible {
-webkit-box-shadow: 0px 0px 0px 2px hsl(var(--fo5-color-bg-hsl)), 0px 0px 0px 4px hsla(var(--fo5-color-contrast-higher-hsl), 0.15);
box-shadow: 0px 0px 0px 2px hsl(var(--fo5-color-bg-hsl)), 0px 0px 0px 4px hsla(var(--fo5-color-contrast-higher-hsl), 0.15);
outline: none;
}
.fo5-btn:active {
-webkit-transform: translateY(2px);
-ms-transform: translateY(2px);
transform: translateY(2px);
}
.fo5-btn--subtle {
background: hsl(var(--fo5-color-bg-lighter-hsl));
color: hsl(var(--fo5-color-contrast-higher-hsl));
-webkit-box-shadow: inset 0px 1px 0px hsla(var(--fo5-color-white-hsl), 0.1), 0px 0px 0px 1px hsla(var(--fo5-color-black-hsl), 0.02), 0px 1px 3px -1px hsla(var(--fo5-color-black-hsl), 0.2), 0 0.3px 0.4px rgba(0, 0, 0, 0.025),0 0.9px 1.5px rgba(0, 0, 0, 0.05), 0 3.5px 6px rgba(0, 0, 0, 0.1);
box-shadow: inset 0px 1px 0px hsla(var(--fo5-color-white-hsl), 0.1), 0px 0px 0px 1px hsla(var(--fo5-color-black-hsl), 0.02), 0px 1px 3px -1px hsla(var(--fo5-color-black-hsl), 0.2), 0 0.3px 0.4px rgba(0, 0, 0, 0.025),0 0.9px 1.5px rgba(0, 0, 0, 0.05), 0 3.5px 6px rgba(0, 0, 0, 0.1);
}
.fo5-btn--subtle:hover {
background: hsl(var(--fo5-color-bg-light-hsl));
-webkit-box-shadow: inset 0px 1px 0px hsla(var(--fo5-color-white-hsl), 0.1), 0px 0px 0px 1px hsla(var(--fo5-color-black-hsl), 0.02), 0px 1px 3px -1px hsla(var(--fo5-color-black-hsl), 0.2), 0 0.1px 0.3px rgba(0, 0, 0, 0.06),0 1px 2px rgba(0, 0, 0, 0.12);
box-shadow: inset 0px 1px 0px hsla(var(--fo5-color-white-hsl), 0.1), 0px 0px 0px 1px hsla(var(--fo5-color-black-hsl), 0.02), 0px 1px 3px -1px hsla(var(--fo5-color-black-hsl), 0.2), 0 0.1px 0.3px rgba(0, 0, 0, 0.06),0 1px 2px rgba(0, 0, 0, 0.12);
}
.fo5-btn--subtle:focus {
-webkit-box-shadow: inset 0px 1px 0px hsla(var(--fo5-color-white-hsl), 0.1), 0px 0px 0px 1px hsla(var(--fo5-color-black-hsl), 0.02), 0px 1px 3px -1px hsla(var(--fo5-color-black-hsl), 0.2), 0 0.1px 0.3px rgba(0, 0, 0, 0.06),0 1px 2px rgba(0, 0, 0, 0.12), 0px 0px 0px 2px hsl(var(--fo5-color-bg-hsl)), 0px 0px 0px 4px hsl(var(--fo5-color-contrast-high-hsl));
box-shadow: inset 0px 1px 0px hsla(var(--fo5-color-white-hsl), 0.1), 0px 0px 0px 1px hsla(var(--fo5-color-black-hsl), 0.02), 0px 1px 3px -1px hsla(var(--fo5-color-black-hsl), 0.2), 0 0.1px 0.3px rgba(0, 0, 0, 0.06),0 1px 2px rgba(0, 0, 0, 0.12), 0px 0px 0px 2px hsl(var(--fo5-color-bg-hsl)), 0px 0px 0px 4px hsl(var(--fo5-color-contrast-high-hsl));
}
/* icons */
.fo5-icon {
height: var(--fo5-size, 1em);
width: var(--fo5-size, 1em);
display: inline-block;
color: inherit;
fill: currentColor;
line-height: 1;
-ms-flex-negative: 0;
flex-shrink: 0;
max-width: initial;
}
.fo5-icon--2xs {
--fo5-size: 12px;
}
.fo5-icon--xs {
--fo5-size: 16px;
}
/* component */
/* --expanded version */
.filter-nav--expanded {
/* --v1 */
/* --v2 */
/* --v3 */
}
.filter-nav--expanded .filter-nav__nav {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
overflow: auto;
margin-bottom: 2rem;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.filter-nav--expanded .filter-nav__list {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
position: relative;
gap:10px;
}
.filter-nav--expanded .filter-nav__item {
-ms-flex-negative: 0;
flex-shrink: 0;
position: relative;
z-index: 1;
}
.filter-nav--expanded .filter-nav__btn {
/*