.main-hero-area .personal-contact-box h4,
.main-hero-area .personal-contact-box h5  {
    color: var(--ztc-text-text-1);
}

.card.qume {
    position: relative;
    z-index: 1;
    background: var(--ztc-bg-bg2);
    border: 1px solid var(--ztc-border-border-2);
    border-radius: 8px;
    transition: all 0.4s;
}
.card.filter {
    position: relative;
    z-index: 1;
    background: var(--ztc-bg-bg2);
    border: 1px solid var(--ztc-border-border-2);
    border-radius: 8px;
}


.card.qume h2,
.card.qume p {
    color: var(--ztc-text-text-1);
}

.card.qume:hover {
    border: 1px solid var(--ztc-bg-btn-bg1);
    transition: all 0.4s;
    transform: translateY(-5px);
}

.alert-danger p,
.alert-danger li {
    color: var(--ztc-text-text-1);
}

.social-media {
    display: flex;
    justify-content: center; /* Zentriert die Icons horizontal */
    flex-wrap: wrap; /* Falls nötig, Icons umbrechen */
}

.social-media a {
    color: #ffffff;
    padding-bottom: 20px;
    font-size: 12px;
    display: flex;
    align-items: center;
    transition: 0.5s ease-in-out;
}

.social-media a i {
    width: 32px;
    height: 32px;
    background-color: #000;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    margin-right: 10px;
    color: #fff;
}
.social-media a.inaktiv i {
    background: #a5a5a5;
}

.social-media a i:hover {
    background-color: #e71e6c;
    color: #000;
}
.social-media a.inaktiv i:hover {
    background-color: #a5a5a5;
    color: #fff;
}

.lizenz {
    position: absolute;
    left: 10px;
    top:10px;
}

.infopage {
    position: absolute;
    top: 14px;
    bottom: auto;
    right: 10px;
}

.infopage i {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: #fff;
    background: #000;
}

.profilbild {
    position: relative;
    display: inline-block;
}

.country-flag i {
    width: 28px; /* Größe der Flagge */
    height: 28px;
    position: absolute;
    top: 14px; /* Etwas Abstand zum Rand */
    left: 10px;
    border-radius: 50%; /* Falls die Flagge rund sein soll */
}

.form-control {
    color: var(--ztc-text-text-1);
    font-family: var(--ztc-family-font1);
    font-size: var(--ztc-font-size-font-s14);
    font-style: normal;
    font-weight: var(--ztc-weight-medium);
    line-height: 16px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.2);
    padding: 16px 16px;
    background-repeat: no-repeat;
    width: 100%;
}

.form-select {
    color: var(--ztc-text-text-1);
    font-family: var(--ztc-family-font1);
    font-size: var(--ztc-font-size-font-s14);
    font-style: normal;
    font-weight: var(--ztc-weight-medium);
    line-height: 16px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.2);
    padding: 16px 16px;
    background-repeat: no-repeat;
    width: 100%;
}

.form-control:hover, .form-control:focus, .form-control.active,
.form-select:hover, .form-select:focus, .form-select.active {
    color: var(--ztc-text-text-1);
    font-family: var(--ztc-family-font1);
    font-size: var(--ztc-font-size-font-s14);
    font-style: normal;
    font-weight: var(--ztc-weight-medium);
    line-height: 16px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.2);
    padding: 16px 16px;
    background-repeat: no-repeat;
    width: 100%;
}

label.form-label,
label.form-check-label {
    color: var(--ztc-text-text-1);
}
.btn {
    border-radius: 20px;
}


.select2-container--default .select2-selection--single,
.select2-selection .select2-selection--single {
    background: rgba(255, 255, 255, 0.2);
    border: 0;
    border-radius: 8px;
    padding: 16px 16px;
    height: 50px;
    line-height: 30px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--ztc-text-text-1);
}

.form-control::placeholder {
    color: #ccc;
}

.btn-area span a {
    color: var(--ztc-text-text-1);
}

.card {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.light-mode .lizenz img {
    filter: brightness(0);
}

.btn.btn-light {
    border-radius: 52px;
    background: #dadada;
    color: var(--ztc-text-btn-text1);
    font-family: var(--ztc-family-font1);
    font-size: var(--ztc-font-size-font-s16);
    font-style: normal;
    font-weight: var(--ztc-weight-semibold);
    line-height: 20px;
    padding: 16px 20px;
    position: relative;
    z-index: 1;
    border: 1px solid #000;
    transition: all 0.4s;
}

.btn.btn-primary {
    border-radius: 52px;
    background: #e71e6c;
    color: #fff;
    font-family: var(--ztc-family-font1);
    font-size: var(--ztc-font-size-font-s16);
    font-style: normal;
    font-weight: var(--ztc-weight-semibold);
    line-height: 20px;
    padding: 16px 20px;
    position: relative;
    z-index: 1;
    border: 1px solid #000;
    transition: all 0.4s;
}

.btn.btn-secondary {
    border-radius: 52px;
    background: #173861;
    color: #fff;
    font-family: var(--ztc-family-font1);
    font-size: var(--ztc-font-size-font-s16);
    font-style: normal;
    font-weight: var(--ztc-weight-semibold);
    line-height: 20px;
    padding: 16px 20px;
    position: relative;
    z-index: 1;
    border: 1px solid #000;
    transition: all 0.4s;
}

.header-site-icon .slide-bar.slide-bar1 .sidebar-content ul li a {
    margin-top: 20px;
}

.vl-btn1 {
    border-radius: 52px;
    background: var(--ztc-bg-btn-bg1);
    color: var(--ztc-text-btn-text1);
    font-family: var(--ztc-family-font1);
    font-size: var(--ztc-font-size-font-s16);
    font-style: normal;
    font-weight: var(--ztc-weight-semibold);
    line-height: 20px;
    padding: 16px 20px;
    position: relative;
    z-index: 1;
    border: 1px solid var(--ztc-bg-btn-bg1);
    transition: all 0.4s;
    text-transform: uppercase;
}

.vl-btn2 {
    border-radius: 52px;
    background: #e71e6c;
    color: var(--ztc-text-btn-text1);
    font-family: var(--ztc-family-font1);
    font-size: var(--ztc-font-size-font-s16);
    font-style: normal;
    font-weight: var(--ztc-weight-semibold);
    line-height: 20px;
    padding: 16px 20px;
    position: relative;
    z-index: 1;
    border: 1px solid #e71e6c;
    transition: all 0.4s;
    text-transform: uppercase;
}

.pagination {
    --bs-pagination-active-bg: var(--bs-primary);
    --bs-pagination-active-border-color: var(--bs-primary);
}

.card.card-video h4{
    color: var(--ztc-text-text-1);
}