@charset "utf-8";
/* CSS Document */
body {
            font-family: sans-serif;
            margin: 0;
            padding: 0;
            background-color: #f4f4f4;
        }

        header {
            background-color: #333;
            color: white;
            padding: 1rem 0;
            text-align: center;
        }

        header img {
            max-width: 200px;
            height: auto;
        }

        nav {
            background-color: #444;
            color: white;
            text-align: center;
        }

        nav ul {
            list-style: none;
            padding: 0;
            margin: 0;
            display: inline-block;
        }

        nav li {
            display: inline-block;
            position: relative;
        }

        nav a {
            color: white;
            text-decoration: none;
            padding: 1rem;
            display: block;
        }

        nav a:hover {
            background-color: #555;
        }

.container_desc {
  margin-left: 200px;
  margin-right: 200px;
}

        .dropdown-content {
            display: none;
            position: absolute;
            background-color: #444;
            min-width: 160px;
            box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
            z-index: 1;
        }

        .dropdown-content a {
            color: white;
            padding: 1rem;
            text-decoration: none;
            display: block;
        }

        .dropdown-content a:hover {
            background-color: #555;
        }

        .dropdown:hover .dropdown-content {
            display: block;
        }

        .hero {
            background-image: url('/assets/img/it-background.jpg');
            background-size: cover;
            background-position: center;
            color: white;
            text-align: center;
            padding: 10rem 0;
        }

        .hero h2 {
            font-size: 3rem;
            margin-bottom: 1rem;
        }

        .hero p {
            font-size: 1.2rem;
        }

        .container {
            width: 80%;
            margin: 2rem auto;
            overflow: hidden;
            display: flex;
            flex-wrap: wrap;
            justify-content: space-around;
        }

        .block {
            background-color: white;
            padding: 2rem;
            margin-bottom: 1rem;
            width: 30%;
            box-sizing: border-box;
            text-align: center;
        }

        .block a {
            background-color: #007bff;
            color: white;
            padding: 1rem 2rem;
            text-decoration: none;
            border-radius: 5px;
            display: inline-block;
            margin-top: 1rem;
        }

        .features {
            width: 80%;
            margin: 2rem auto;
            overflow: hidden;
            display: flex;
            flex-wrap: wrap;
            justify-content: space-around;
        }

        .feature-block {
            background-color: white;
            padding: 2rem;
            margin-bottom: 1rem;
            width: 45%;
            box-sizing: border-box;
            text-align: center;
        }

        .domain-search {
            background-color: white;
            padding: 2rem;
            margin-top: 2rem;
            text-align: center;
        }

        .domain-search input[type="text"] {
            padding: 0.5rem;
            width: 300px;
            border: 1px solid #ccc;
            border-radius: 5px;
        }

        .domain-search button {
            background-color: #007bff;
            color: white;
            padding: 0.5rem 1rem;
            border: none;
            border-radius: 5px;
            cursor: pointer;
        }



        .domain-search {
            background-color: white;
            padding: 2rem;
            margin-bottom: 1rem;
            text-align: center;
        }

        .domain-search h2 {
            margin-bottom: 1rem;
        }

        .domain-search input[type="text"] {
            padding: 0.5rem;
            width: 300px;
            border: 1px solid #ccc;
            border-radius: 5px;
        }

        .domain-search button {
            background-color: #007bff;
            color: white;
            padding: 0.5rem 1rem;
            border: none;
            border-radius: 5px;
            cursor: pointer;
        }

        .tlds {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-around;
        }

        .tld {
            background-color: white;
            padding: 1rem;
            margin-bottom: 1rem;
            width: 20%;
            box-sizing: border-box;
            text-align: center;
        }

        .tld h3 {
            margin-bottom: 0.5rem;
        }

        .tld p {
            font-size: 0.8rem;
            color: #777;
        }

        .transfer {
            background-color: #f0f0f0;
            padding: 2rem;
            text-align: center;
        }

        .transfer h2 {
            margin-bottom: 1rem;
        }

.domain-faq {
    display: grid;
    grid-template-columns: 1fr;
    grid-gap: 20px;
    padding: 20px;
}

.faq-item {
    background-color: #f9f9f9;
    padding: 15px;
    border-radius: 5px;
}

.faq-item__question {
    font-weight: bold;
    cursor: pointer;
    padding-bottom: 10px;
    border-bottom: 1px solid #eee;
}

.faq-item__answer {
    padding-top: 10px;
}

details {
    /* Optional: Anpassen des Details-Elements */
    border: 1px solid #ccc;
    border-radius: 4px;
    margin-bottom: 10px;
    padding: 10px;
}

summary {
    /* Optional: Anpassen des Summary-Elements */
    font-weight: bold;
    cursor: pointer;
    list-style: none; /* Entfernt den Pfeil im Summary */
    position: relative;
    padding-left: 25px; /* Platz für ein Icon */
}

summary::before {
    /* Optional: Icon vor dem Summary */
    content: '\f059'; /* Fragezeichen von Font Awesome */
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    color: #007bff;
}

        .support-offers {
            width: 80%;
            margin: 2rem auto;
            overflow: hidden;
            display: flex;
            flex-wrap: wrap;
            justify-content: space-around;
        }

        .support-block {
            background-color: white;
            padding: 2rem;
            margin-bottom: 1rem;
            width: 30%;
            box-sizing: border-box;
            text-align: center;
         
			transition: transform 0.3s ease;
        }

        .support-block:hover {
            transform: scale(1.05);
        }

        .support-block button {
            background-color: #007bff;
            color: white;
            padding: 10px 20px;
            border: none;
            border-radius: 5px;
            cursor: pointer;
            margin-top: 20px;
            transition: background-color 0.3s ease;
        }

        .support-block button:hover {
            background-color: #0056b3;
        }

        .support-block img {
            width: 50px;
            height: 50px;
            border-radius: 50%;
            margin-bottom: 1rem;
        }



        footer {
            background-color: #333;
            color: white;
            text-align: center;
            padding: 1rem 0;
        }

       a {
            color: white;
        }

		a:hover {
            color: lightgoldenrodyellow;
        }

.top-bar {
            background-color: #333; /* Hellgrau */
            padding: 0.5em 1em;
            text-align: right;
            font-size: 0.9em;
        }

        .top-bar a {
            color: #fff; /* Dunkelgrau für Links */
            text-decoration: none;
            margin-left: 1em;
        }

        .top-bar a:hover {
			color: antiquewhite;
            text-decoration: underline;
        }

        .top-bar .social-icons img {
            width: 20px; /* Kleinere Icon-Größe */
            height: 20px;
            vertical-align: middle; /* Icons vertikal zentriert */
        }
.container {
            width: 80%;
            margin: 2rem auto;
            overflow: hidden;
        }

        .agb-content {
            background-color: white;
            padding: 2rem;
            margin-bottom: 1rem;
        }

        .agb-content h2 {
            margin-bottom: 1rem;
        }

        .agb-content p {
            margin-bottom: 1.5rem;
        }

 .chat-plans {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-around;
        }

        .chat-plan {
            background-color: white;
            padding: 2rem;
            margin-bottom: 1rem;
            width: 30%;
            box-sizing: border-box;
            text-align: center;
        }

        .chat-plan h3 {
            margin-bottom: 1rem;
        }

        .chat-plan p {
            margin-bottom: 1.5rem;
        }

        .chat-plan .price {
            font-size: 2rem;
            font-weight: bold;
            margin-bottom: 1rem;
        }

        .chat-plan ul {
            list-style: none;
            padding: 0;
            margin-bottom: 1.5rem;
        }

        .chat-plan li {
            margin-bottom: 0.5rem;
        }

        .chat-plan a {
            background-color: #007bff;
            color: white;
            padding: 1rem 2rem;
            text-decoration: none;
            border-radius: 5px;
            display: inline-block;
        }

        .features {
            background-color: #f0f0f0;
            padding: 2rem 0;
            text-align: center;
        }

        .features h2 {
            margin-bottom: 2rem;
        }

        .feature-list {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-around;
        }

        .feature {
            width: 30%;
            margin-bottom: 2rem;
        }

        .feature img {
            max-width: 100px;
            height: auto;
            margin-bottom: 1rem;
        }

        .faq {
            background-color: white;

            padding: 2rem;
            margin-top: 2rem;
        }

        .faq h2 {
            text-align: center;
            margin-bottom: 2rem;
        }

        .faq-item {
            margin-bottom: 1.5rem;
        }

        .question {
            font-weight: bold;
            margin-bottom: 0.5rem;
        }

.container {
            width: 80%;
            margin: 2rem auto;
            overflow: hidden;
        }

        .hosting-plans {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-around;
        }

        .hosting-plan {
            background-color: white;
            padding: 2rem;
            margin-bottom: 1rem;
            width: 30%;
            box-sizing: border-box;
            text-align: center;
        }

        .hosting-plan h3 {
            margin-bottom: 1rem;
        }

        .hosting-plan p {
            margin-bottom: 1.5rem;
        }

        .hosting-plan .price {
            font-size: 2rem;
            font-weight: bold;
            margin-bottom: 1rem;
        }

        .hosting-plan ul {
            list-style: none;
            padding: 0;
            margin-bottom: 1.5rem;
        }

        .hosting-plan li {
            margin-bottom: 0.5rem;
        }

        .hosting-plan a {
            background-color: #007bff;
            color: white;
            padding: 1rem 2rem;
            text-decoration: none;
            border-radius: 5px;
            display: inline-block;
        }

        .features {
            background-color: #f0f0f0;
            padding: 2rem 0;
            text-align: center;
        }

        .features h2 {
            margin-bottom: 2rem;
        }

        .feature-list {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-around;
        }

        .feature {
            width: 30%;
            margin-bottom: 2rem;
        }

        .feature img {
            max-width: 100px;
            height: auto;
            margin-bottom: 1rem;
        }

        .faq {
            background-color: white;
            padding: 2rem;
            margin-top: 2rem;
        }

        .faq h2 {
            text-align: center;
            margin-bottom: 2rem;
        }

        .faq-item {
            margin-bottom: 1.5rem;
        }

        .question {
            font-weight: bold;
            margin-bottom: 0.5rem;
        }

.cloud-plans {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-around;
        }

        .cloud-plan {
            background-color: white;
            padding: 2rem;
            margin-bottom: 1rem;
            width: 30%;
            box-sizing: border-box;
            text-align: center;
        }

        .cloud-plan h3 {
            margin-bottom: 1rem;
        }

        .cloud-plan p {
            margin-bottom: 1.5rem;
        }

        .cloud-plan .price {
            font-size: 1.5rem;
            font-weight: bold;
            margin-bottom: 1rem;
        }

        .cloud-plan ul {
            list-style: none;
            padding: 0;
            margin-bottom: 1.5rem;
        }

        .cloud-plan li {
            margin-bottom: 0.5rem;
        }

        .cloud-plan a {
            background-color: #007bff;
            color: white;
            padding: 1rem 2rem;
            text-decoration: none;
            border-radius: 5px;
            display: inline-block;
        }

        .features {
            background-color: #f0f0f0;
            padding: 2rem 0;
            text-align: center;
        }

        .features h2 {
            margin-bottom: 2rem;
        }

        .feature-list {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-around;
        }

        .feature {
            width: 30%;
            margin-bottom: 2rem;
        }

        .feature img {
            max-width: 100px;
            height: auto;
            margin-bottom: 1rem;
        }

        .faq {
            background-color: white;
            padding: 2rem;
            margin-top: 2rem;
        }

        .faq h2 {
            text-align: center;
            margin-bottom: 2rem;
        }

        .faq-item {
            margin-bottom: 1.5rem;
        }

        .question {
            font-weight: bold;
            margin-bottom: 0.5rem;
        }

.widerruf-content {
            background-color: white;
            padding: 2rem;
            margin-bottom: 1rem;
        }

        .widerruf-content h2 {
            margin-bottom: 1rem;
        }

        .widerruf-content p {
            margin-bottom: 1.5rem;
        }

.datenschutz-content {
            background-color: white;
            padding: 2rem;
            margin-bottom: 1rem;
        }

        .datenschutz-content h2 {
            margin-bottom: 1rem;
        }

        .datenschutz-content p {
            margin-bottom: 1.5rem;
        }

.dedicated-plans {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-around;
        }

        .dedicated-plan {
            background-color: white;
            padding: 2rem;
            margin-bottom: 1rem;
            width: 30%;
            box-sizing: border-box;
            text-align: center;
        }

        .dedicated-plan h3 {
            margin-bottom: 1rem;
        }

        .dedicated-plan p {
            margin-bottom: 1.5rem;
        }

        .dedicated-plan .price {
            font-size: 2rem;
            font-weight: bold;
            margin-bottom: 1rem;
        }

        .dedicated-plan ul {
            list-style: none;
            padding: 0;
            margin-bottom: 1.5rem;
        }

        .dedicated-plan li {
            margin-bottom: 0.5rem;
        }

        .dedicated-plan a {
            background-color: #007bff;
            color: white;
            padding: 1rem 2rem;
            text-decoration: none;
            border-radius: 5px;
            display: inline-block;
        }

        .features {
            background-color: #f0f0f0;
            padding: 2rem 0;
            text-align: center;
        }

        .features h2 {
            margin-bottom: 2rem;
        }

        .feature-list {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-around;
        }

        .feature {
            width: 30%;
            margin-bottom: 2rem;
        }

        .feature img {
            max-width: 100px;
            height: auto;
            margin-bottom: 1rem;
        }

        .faq {
            background-color: white;
            padding: 2rem;
            margin-top: 2rem;
        }

        .faq h2 {
            text-align: center;
            margin-bottom: 2rem;
        }

        .faq-item {
            margin-bottom: 1.5rem;
        }

        .question {
            font-weight: bold;
            margin-bottom: 0.5rem;
        }


 .payment-methods {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-around;
        }

        .payment-method {
            background-color: white;
            padding: 2rem;
            margin-bottom: 1rem;
            width: 30%;
            box-sizing: border-box;
            text-align: center;
        }

        .payment-method img {
            max-width: 100px;
            height: auto;
            margin-bottom: 1rem;
        }

        .payment-method h3 {
            margin-bottom: 1rem;
        }

        .payment-method p {
            margin-bottom: 1.5rem;
        }

 .vps-plans {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-around;
        }

        .vps-plan {
            background-color: white;
            padding: 2rem;
            margin-bottom: 1rem;
            width: 30%;
            box-sizing: border-box;
            text-align: center;
        }

        .vps-plan h3 {
            margin-bottom: 1rem;
        }

        .vps-plan p {
            margin-bottom: 1.5rem;
        }

        .vps-plan .price {
            font-size: 2rem;
            font-weight: bold;
            margin-bottom: 1rem;
        }

        .vps-plan ul {
            list-style: none;
            padding: 0;
            margin-bottom: 1.5rem;
        }

        .vps-plan li {
            margin-bottom: 0.5rem;
        }

        .vps-plan a {
            background-color: #007bff;
            color: white;
            padding: 1rem 2rem;
            text-decoration: none;
            border-radius: 5px;
            display: inline-block;
        }

        .tekbase-plans {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-around;
        }

        .tekbase-plan {
            background-color: white;
            padding: 2rem;
            margin-bottom: 1rem;
            width: 30%;
            box-sizing: border-box;
            text-align: center;
        }

        .tekbase-plan h3 {
            margin-bottom: 1rem;
        }

        .tekbase-plan p {
            margin-bottom: 1.5rem;
        }

        .tekbase-plan .price {
            font-size: 2rem;
            font-weight: bold;
            margin-bottom: 1rem;
        }

        .tekbase-plan ul {
            list-style: none;
            padding: 0;
            margin-bottom: 1.5rem;
        }

        .tekbase-plan li {
            margin-bottom: 0.5rem;
        }

        .tekbase-plan a {
            background-color: #007bff;
            color: white;
            padding: 1rem 2rem;
            text-decoration: none;
            border-radius: 5px;
            display: inline-block;
        }

        .teamspeak-plans {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-around;
        }

        .teamspeak-plan {
            background-color: white;
            padding: 2rem;
            margin-bottom: 1rem;
            width: 30%;
            box-sizing: border-box;
            text-align: center;
        }

        .teamspeak-plan h3 {
            margin-bottom: 1rem;
        }

        .teamspeak-plan p {
            margin-bottom: 1.5rem;
        }

        .teamspeak-plan .price {
            font-size: 2rem;
            font-weight: bold;
            margin-bottom: 1rem;
        }

        .teamspeak-plan ul {
            list-style: none;
            padding: 0;
            margin-bottom: 1.5rem;
        }

        .teamspeak-plan li {
            margin-bottom: 0.5rem;
        }

        .teamspeak-plan a {
            background-color: #007bff;
            color: white;
            padding: 1rem 2rem;
            text-decoration: none;
            border-radius: 5px;
            display: inline-block;
        }

        .support-options {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-around;
        }

        .support-option {
            background-color: white;
            padding: 2rem;
            margin-bottom: 1rem;
            width: 30%;
            box-sizing: border-box;
            text-align: center;
        }

        .support-option h3 {
            margin-bottom: 1rem;
        }

        .support-option p {
            margin-bottom: 1.5rem;
        }

        .support-option a {
            background-color: #007bff;
            color: white;
            padding: 1rem 2rem;
            text-decoration: none;
            border-radius: 5px;
            display: inline-block;
        }

 .stream-plans {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-around;
        }

        .stream-plan {
            background-color: white;
            padding: 2rem;
            margin-bottom: 1rem;
            width: 30%;
            box-sizing: border-box;
            text-align: center;
        }

        .stream-plan h3 {
            margin-bottom: 1rem;
        }

        .stream-plan p {
            margin-bottom: 1.5rem;
        }

        .stream-plan .price {
            font-size: 2rem;
            font-weight: bold;
            margin-bottom: 1rem;
        }

        .stream-plan ul {
            list-style: none;
            padding: 0;
            margin-bottom: 1.5rem;
        }

        .stream-plan li {
            margin-bottom: 0.5rem;
        }

        .stream-plan a {
            background-color: #007bff;
            color: white;
            padding: 1rem 2rem;
            text-decoration: none;
            border-radius: 5px;
            display: inline-block;
        }

.plesk-plans {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-around;
        }

        .plesk-plan {
            background-color: white;
            padding: 2rem;
            margin-bottom: 1rem;
            width: 30%;
            box-sizing: border-box;
            text-align: center;
        }

        .plesk-plan h3 {
            margin-bottom: 1rem;
        }

        .plesk-plan p {
            margin-bottom: 1.5rem;
        }

        .plesk-plan .price {
            font-size: 2rem;
            font-weight: bold;
            margin-bottom: 1rem;
        }

        .plesk-plan ul {
            list-style: none;
            padding: 0;
            margin-bottom: 1.5rem;
        }

        .plesk-plan li {
            margin-bottom: 0.5rem;
        }

        .plesk-plan a {
            background-color: #007bff;
            color: white;
            padding: 1rem 2rem;
            text-decoration: none;
            border-radius: 5px;
            display: inline-block;
        }

        .features {
            background-color: #f0f0f0;
            padding: 2rem 0;
            text-align: center;
        }

        .features h2 {
            margin-bottom: 2rem;
        }

        .feature-list {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-around;
        }

        .feature {
            width: 30%;
            margin-bottom: 2rem;
        }

        .feature img {
            max-width: 100px;
            height: auto;
            margin-bottom: 1rem;
        }

        .faq {
            background-color: white;
            padding: 2rem;
            margin-top: 2rem;
        }

        .faq h2 {
            text-align: center;
            margin-bottom: 2rem;
        }

        .faq-item {
            margin-bottom: 1.5rem;
        }

        .question {
            font-weight: bold;
            margin-bottom: 0.5rem;
        }

.office-plans {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-around;
        }

        .office-plan {
            background-color: white;
            padding: 2rem;
            margin-bottom: 1rem;
            width: 30%;
            box-sizing: border-box;
            text-align: center;
        }

        .office-plan h3 {
            margin-bottom: 1rem;
        }

        .office-plan p {
            margin-bottom: 1.5rem;
        }

        .office-plan .price {
            font-size: 2rem;
            font-weight: bold;
            margin-bottom: 1rem;
        }

        .office-plan ul {
            list-style: none;
            padding: 0;
            margin-bottom: 1.5rem;
        }

        .office-plan li {
            margin-bottom: 0.5rem;
        }

        .office-plan a {
            background-color: #007bff;
            color: white;
            padding: 1rem 2rem;
            text-decoration: none;
            border-radius: 5px;
            display: inline-block;
        }

        .features {
            background-color: #f0f0f0;
            padding: 2rem 0;
            text-align: center;
        }

        .features h2 {
            margin-bottom: 2rem;
        }

        .feature-list {
            display: flex;
            flex-wrap: wrap;
            justify-content: space-around;
        }

        .feature {
            width: 30%;
            margin-bottom: 2rem;
        }

        .feature img {
            max-width: 100px;
            height: auto;
            margin-bottom: 1rem;
        }

        .faq {
            background-color: white;
            padding: 2rem;
            margin-top: 2rem;
        }

        .faq h2 {
            text-align: center;
            margin-bottom: 2rem;
        }

        .faq-item {
            margin-bottom: 1.5rem;
        }

        .question {
            font-weight: bold;
            margin-bottom: 0.5rem;
        }

 .impressum-content {
            background-color: white;
            padding: 2rem;
            margin-bottom: 1rem;
        }

        .impressum-content h2 {
            margin-bottom: 1rem;
        }

        .impressum-content p {
            margin-bottom: 1.5rem;
        }

/* Anpassung der Optik an ihren Styleguide */
.contact-us {
    background-color: #f0f0f0; /* Hintergrundfarbe anpassen */
    text-align: center;
    padding: 50px 20px;
    margin-top: 40px;
}

.contact-us-content h2 {
    font-size: 2.5em; /* Schriftgröße anpassen */
    margin-bottom: 20px;
    color: #333; /* Textfarbe anpassen */
}

.contact-us-content p {
    font-size: 1.1em; /* Schriftgröße anpassen */
    margin-bottom: 30px;
    color: #666; /* Textfarbe anpassen */
}

.contact-button {
    background-color: #007bff; /* Button-Farbe anpassen */
    color: white;
    padding: 15px 30px;
    text-decoration: none;
    border-radius: 5px;
    font-size: 1.1em;
    transition: background-color 0.3s ease;
}

.contact-button:hover {
    background-color: #0056b3; /* Button-Hover-Farbe anpassen */
}

.announcements {
    background-color: #f9f9f9;
    padding: 40px 20px;
    text-align: left;
}

.announcements-container {
    max-width: 800px;
    margin: 0 auto;
}

.announcements h2 {
    font-size: 2em;
    margin-bottom: 20px;
    color: #333;
}

.announcement-item {
    border-bottom: 1px solid #eee;
    padding-bottom: 20px;
    margin-bottom: 20px;
}

.announcement-item h3 {
    font-size: 1.3em;
    color: #007bff;
    margin-bottom: 10px;
}

.announcement-item p {
    color: #666;
    line-height: 1.6;
}

.announcement-date {
    font-size: 0.9em;
    color: #999;
    margin-top: 10px;
    display: block;
}

/* Responsives Design */
@media (max-width: 600px) {
    .announcements h2 {
        font-size: 1.8em;
    }
    .announcement-item h3 {
        font-size: 1.2em;
    }
}

.hosting-plan__features {
    list-style: none;
    padding: 0;
    margin-bottom: 20px;
}

.hosting-plan__feature {
    display: flex; /* Erstellt einen Flexbox-Container */
    align-items: center; /* Vertikale Zentrierung der Elemente */
}

.hosting-plan__feature1 {
    display: flex; /* Erstellt einen Flexbox-Container */
    align-items: center; /* Vertikale Zentrierung der Elemente */
}

.hosting-plan__feature::before {
    content: '✓';
    color: green;
    margin-right: 5px; /* Abstand zwischen Häkchen und Text */
}

.hosting-plan__feature1::before {
    content: '✖'; /* Unicode-Zeichen für ein Kreuz */
    color: red;
    margin-right: 5px; /* Abstand zwischen Kreuz und Text */
}

.hosting-plan__feature2 {
    display: flex; /* Erstellt einen Flexbox-Container */
    align-items: center; /* Vertikale Zentrierung der Elemente */
}

.hosting-plan__feature2::before {
  content: '★'; /* Unicode-Zeichen für einen Stern */
  color: darkgoldenrod; /* Farbe des Sterns */
  margin-right: 5px; /* Abstand zwischen Stern und Text */
  /*font-size: 1.2em;*/ /* Optionale Anpassung der Sterngröße */
}

.webhosting-features {
    padding: 20px;
    text-align: center;
}

.webhosting-features__title {
    font-size: 2em;
    margin-bottom: 20px;
}

.webhosting-features__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.webhosting-features__item {
    margin: 10px;
    padding: 20px;
    border: 1px solid #ddd;
    border-radius: 8px; /* Fügt abgerundete Ecken hinzu */
    text-align: center;
    max-width: 300px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Fügt einen subtilen Schatten hinzu */
    background-color: white; /* Hintergrundfarbe für die Boxen */
    transition: transform 0.3s ease; /* Fügt eine sanfte Übergangsanimation hinzu */
}

.webhosting-features__item:hover {
    transform: translateY(-5px); /* Hebt die Box beim Hover leicht an */
}

.feature__icon {
    width: 80px;
    height: 80px;
    margin-bottom: 10px;
}

.feature__title {
    font-size: 1.2em;
    margin-bottom: 10px;
}

.feature__description {
    color: #666;
}

/* Responsives Design */
@media (max-width: 768px) {
    .webhosting-features__item {
        max-width: 100%;
    }
}

.faq-modern {
    padding: 250px;
    background-color: #f8f8f8;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.faq-modern__title {
    font-size: 2.5em;
    text-align: center;
    margin-bottom: 30px;
    color: #333;
}

.faq-modern__item {
    border-bottom: 1px solid #eee;
    margin-bottom: 20px;
}

.faq-modern__item:last-child {
    border-bottom: none;
}

.faq-modern__question {
    background-color: #fff;
    border: none;
    padding: 20px;
    width: 100%;
    text-align: left;
    cursor: pointer;
    font-size: 1.1em;
    font-weight: 600;
    color: #007bff;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.faq-modern__question::after {
    content: '+';
    font-size: 1.5em;
    color: #007bff;
}

.faq-modern__item[open] .faq-modern__question::after {
    content: '-';
}

.faq-modern__answer {
    padding: 20px;
    background-color: #f0f0f0;
    line-height: 1.6;
}

#dashboard-btn,
#login-btn {
  display: none;
}

#admin-btn {
  display: none !important;
}