/* cmsms stylesheet: product_configurator modified: 30.07.2025 16:31:23 */
a.gh-g-button.in-nav {
    display: none !important;
}

nav#gh-g-navigation--main {
    padding: 0 0 0 27px !important;
}

input[type='number'] {
    -moz-appearance: textfield;
}

input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

.gh-pc-header {
    height: calc(200px + 96px);
    padding-top: 96px;
    display: flex;
    align-items: center;
    /* background-color: #f6f8f9; */
    /* margin-bottom: 30px; */
}

.gh-pc-body--wrapper {
    max-width: 100%;
    margin: 0 auto;
    padding: 0 3.8rem;
    display: flex;
    flex-direction: row;
    justify-content: center;
}

.gh-pc-body--left {
    flex: 2;
    padding-right: 30px;
    max-width: 960px;
}

.gh-pc-body--shoppingcart {
    position: sticky;
    top: 7rem;
    overflow: auto;
    padding-right: 4px;
}

.gh-pc-body--shoppingcart > div:not(.requirements) {
    /* border: 1px solid #e5e5e5; */
    width: 100%;
    flex: 1;
    border-radius: var(--border-radius);
    padding: 10px 20px 20px 20px;
    background-color: #fff;
    overflow: hidden;
}

.gh-pc-h4 {
    margin: 10px 0 5px 3px;
}

.requirements {
    font-size: 12px;
    padding: 12px;
    margin-top: 12px;
    line-height: 1.6;
    opacity: 0.5;
    letter-spacing: 0.2px;
}

.gh-pc-body--right {
    flex: 1;
    max-width: 460px;
    padding-bottom: 25px;
}

.gh-pc-button {
    display: flex;
    /* background-color: #f3f3f3; */
    border-radius: 4px;
    height: 38px;
    align-content: center;
    align-items: center;
    justify-content: center;
    /* margin-top: 6px; */
    color: #1a73e8;
    font-size: 14px;
    padding: 0 12px;
    cursor: pointer;
    min-width: 130px;
    /* font-weight: 600; */
}

.gh-pc-button.active {
    color: var(--gh23-b);
    background-color: var(--gh23-y);
}

buttoncontrol .gh-pc-button {
    border-radius: 32px;
    height: 40px;
    align-content: center;
    align-items: center;
    justify-content: center;
    margin-top: 6px;
    color: var(--gh23-b);
    font-size: 1rem;
    padding: 10px 24px;
    cursor: pointer;
    min-width: 130px;
    font-weight: 800;
    border: 2px solid;
}

.gh-pc-body--shoppingcart .gh-pc-button.active {
    margin-top: 10px;
}

.gh-pc-module--header {
    font-size: 1.8rem;
    margin-bottom: 12px;
    line-height: 1.4;
    font-weight: 600;
}

.gh-pc-module p {
}

.gh-pc-module dt, .gh-pc-product--summary dt {
    font-weight: 600;
    font-size: 1.2rem;
    line-height: 1.3;
    margin-bottom: 15px;
}

.gh-pc-product--summary .toggle {
    display: none;
}

.gh-pc-module dd, .gh-pc-product--summary dd {
    font-size: 1rem;
    line-height: 1.8rem;
    break-inside: avoid-column;
    padding-left: 35px;
    position: relative;
    margin-bottom: 15px;
}

.gh-pc-module dl, .gh-pc-product--summary dl {
    list-style: none;
    font-size: 14px;
    break-inside: avoid-column;
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid-column;
    /* display: table; */
    margin-bottom: 25px;
}

.gh-pc-module dd:before, .gh-pc-product--summary dd:before {
    content: "";
    border-right: 3px solid #000000;
    border-bottom: 3px solid #000000;
    width: 7px;
    height: 14px;
    display: inline-block;
    transform: rotate(45deg);
    margin: 0 16px 0 4px;
    position: absolute;
    left: 0;
    top: 6px;
}

.gh-pc-module label.pc-toggle {
    display: flex;
    border: 2px solid #cccccc;
    border-radius: 4px;
    height: 64px;
    position: relative;
    box-sizing: border-box;
    margin-top: 25px;
}

.gh-pc-module label.pc-toggle span {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
}

.gh-pc-module input {
    display: none;
}

.gh-pc-module label.pc-toggle:before {
    content: "";
    border: 2px solid #1a73e8;
    position: absolute;
    top: -2px;
    left: -2px;
    bottom: -2px;
    width: calc(50% - 2px);
    border-radius: 4px 0 0 4px;
}

.gh-pc-module input:checked + label.pc-toggle:before {
    top: -2px;
    left: calc(50% - 2px);
    right: 0px;
    width: 50%;
    bottom: -2px;
    border-radius: 0 4px 4px 0;
}

.gh-pc--price--product, .gh-pc--price--addon {
    display: grid;
    grid-template:
        "name price"
        "extra priceonetime";
    grid-template-rows: 20px 20px;
    height: 68px;
    background-color: var(--gh23-g25);
    border-radius: 6px;
    padding: 6px 12px;
    align-content: center;
    gap: 4px;
    margin-bottom: 6px;
    user-select: none;
}

.gh-pc--price--mobileapi, .gh-pc--price--plus, .gh-pc--price--hosting, .gh-pc--price--automation, .gh-pc--price--deepl, .gh-pc--price--texterkennung, .gh-pc--price--virenschutzpro, .gh-pc--price--ada {
    display: grid;
    grid-template: "name price" "extra price";
    grid-template-rows: 20px 20px;
    height: 64px;
    background-color: var(--gh23-g25);
    border-radius: 6px;
    padding: 6px 12px;
    align-content: center;
    gap: 4px;
    margin-bottom: 6px;
    user-select: none;
}


.gh-pc--price--ada .extra {
    line-height: 1;
}

.gh-pc--price--ada {
    grid-template-rows: max-content 20px;
    padding: 8px 12px;
    height: 75px;
}

.gh-pc--price--hosting {
    grid-template-rows: max-content 20px;
    padding: 8px 12px;
    height: 75px;
}

.gh-pc--price--product span {
    display: inline-block;
}

.gh-pc--price--product .name, .gh-pc--price--hosting .name, .gh-pc--price--mobileapi .name, .gh-pc--price--plus .name, .gh-pc--price--addon .name, .gh-pc--price--automation .name, .gh-pc--price--deepl .name, .gh-pc--price--texterkennung .name, .gh-pc--price--virenschutzpro .name, .gh-pc--price--ada .name {
    font-weight: 800;
    font-size: 1rem;
    grid-area: name;
    align-self: center;
    line-height: 1;
}

.gh-pc--price--hosting.nodetail span.name {
    grid-row: 1 / span 2;
    max-width: 190px;
}

.gh-pc--price--product .price, .gh-pc--price--hosting .price, .gh-pc--price--mobileapi .price, .gh-pc--price--plus .price, .gh-pc--price--addon .price, .gh-pc--price--automation .price, .gh-pc--price--deepl .price, .gh-pc--price--texterkennung .price, .gh-pc--price--virenschutzpro .price, .gh-pc--price--ada .price {
    font-weight: 700;
    text-align: right;
    font-size: 1rem;
    grid-area: price;
    align-self: center;
}

.gh-pc--price--product .extra, .gh-pc--price--hosting .extra, .gh-pc--price--mobileapi .extra, .gh-pc--price--plus .extra, .gh-pc--price--addon .extra, .gh-pc--price--automation .extra, .gh-pc--price--deepl .extra, .gh-pc--price--texterkennung .extra, .gh-pc--price--virenschutzpro .extra, .gh-pc--price--ada .extra {
    font-size: 0.875rem;
    grid-area: extra;
    align-self: center;
    opacity: 0.7;
}

.gh-pc--price--product .price-onetime, .gh-pc--price--hosting .price-onetime, .gh-pc--price--mobileapi .price-onetime, .gh-pc--price--plus .price-onetime, .gh-pc--price--addon .price-onetime {
    text-align: right;
    font-size: 0.875rem;
    grid-area: priceonetime;
    /* align-self: flex-end; */
    opacity: 0.7;
}

div.gh-pc-addonselect {
    margin-top: 25px;
}

.gh-pc-addonselect {
    display: grid;
    grid-auto-flow: column;
    gap: 20px;
    grid-template-columns: 1fr 1fr;
    position: relative;
}

.gh-pc-addonselect div, .gh-pc-addonselect label {
    display: grid;
    border: 2px dashed #ccc;
    place-content: center;
    /* height: 137px; */
    border-radius: 4px;
    cursor: pointer;
    transition: background-color .3s, border-color .3s;
    grid-template-columns: auto;
    min-height: 119px;
}

label.gh-pc-addonselect:hover {
    background-color: var(--gh23-y);
    border-color: var(--gh23-b);
}

.gh-pc-addonselect div:hover {
    background-color: #efefef;
}

.pc-products {
    margin-bottom: 30px;
}

.gh-pc-module {
    margin-bottom: 30px;
    padding: 30px;
    border-radius: var(--border-radius);
    background-color: #fff;
}

.culs.gh-pc-module {
    display: grid;
    grid-auto-flow: column;
    gap: 30px;
    grid-template-columns: 2fr 1fr;
}

.gh-pc-body {
    background-color: var(--gh23-g25);
}

.gh-pc-body .gh-pc-body--wrapper {
    padding: 7rem 20px 0 20px;
}

.cul-count {
    display: grid;
    grid-template: "count increase" "count increase" "count decrease" "title decrease";
    border: 2px solid;
    border-radius: var(--border-radius);
    user-select: none;
    overflow: hidden;
}

.cul-count input {
    grid-area: count;
    display: block;
    outline: none;
    border: none;
    font-size: 2.5rem;
    font-weight: 800;
    text-align: center;
    width: 100%;
    min-width: 120px;
    background-color: transparent;
    font-family: 'Oscine';
}

.cul-count span {
    grid-area: title;
    text-align: center;
    font-size: 1rem;
    line-height: 28px;
}

.cul-count--increase {
    grid-area: increase;
    border-bottom: 2px solid;
}

.cul-count--decrease {
    grid-area: decrease;
}

.cul-count--increase, .cul-count--decrease {
    border-left: 2px solid;
    display: grid;
    place-content: center;
    width: 100%;
    min-width: 60px;
    height: 50px;
    cursor: pointer;
    transition: background-color .2s;
}

.cul-count--increase:hover, .cul-count--decrease:hover {
    background-color: var(--gh23-y);
}

/* Raido Toggles */
fieldset.radio-toggle {
    display: flex;
    border-radius: var(--border-radius);
    height: 64px;
    position: relative;
    box-sizing: border-box;
    margin-top: 25px;
    padding: 0;
}

fieldset.radio-toggle label {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    border-left: 2px solid;
    border-top: 2px solid;
    border-bottom: 2px solid;
    font-size: 16px;
    box-sizing: border-box;
    position: relative;
    user-select: none;
    cursor: pointer;
    align-content: stretch;
    z-index: 1;
    font-weight: 800;
}

fieldset.radio-toggle input:checked + label:before {
    border: 2px solid;
    z-index: +1;
    font-size: 16px;
    box-sizing: border-box;
    content: "";
    position: absolute;
    top: -2px;
    left: -2px;
    right: -2px;
    bottom: -2px;
    background-color: var(--gh23-y);
    z-index: -1;
}

fieldset.radio-toggle label:not(:first-of-type) {
    margin-left: -2px;
    border-left: none;
    border-right: 2px solid;
}

fieldset.radio-toggle label:first-of-type {
    border-radius: 10px 0 0 10px;
}

fieldset.radio-toggle label:first-of-type:before, fieldset.radio-toggle label:first-of-type {
    border-radius: 10px 0 0 10px;
}

fieldset.radio-toggle label:last-of-type:before, fieldset.radio-toggle label:last-of-type {
    border-radius: 0 10px 10px 0;
}

label.hosting {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border: 2px solid var(--gh23-g);
    height: 118px;
    border-radius: 4px;
    user-select: none;
    cursor: pointer;
    transition: background-color .15s;
    position: relative;
}

label.hosting:hover {
    background-color: var(--gh23-g25);
}

.radio-grid {
    grid-gap: 20px;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    margin-top: 25px;
}

input:checked + label.hosting {
    border: 2px solid;
    background-color: var(--gh23-y);
}

label.hosting .gh-pc-addon-name-frame-sub {
    font-size: 22px;
    font-weight: 600;
    line-height: 29px;
    text-align: center;
}

label#hosting-eigenbetrieb span.gh-pc-addon-name-frame-sub {
    font-size: 19px;
    max-width: 150px;
}

span.gh-pc-addon-name {
    font-weight: 800;
    font-size: 1rem;
}

span.gh-pc-hosting-price {
    opacity: 0.;
}

.gh-pc-sum {
    text-align: center;
    margin: 30px 0 10px 0;
}

span.gh-pc-cp-preis {
    font-weight: 800;
    font-size: 20px;
}

span.gh-pc-hosting-price span.gh-pc-cp-preis {
    font-size: 1rem;
}

span.gh-pc-sum--pre {
    font-size: 1rem;
    line-height: 1.2;
    margin-bottom: 15px;
    margin-top: -7px;
    display: block;
    font-weight: 100;
}

.gh-pc-sum .gh-pc-sum-price {
    font-size: 3rem;
    font-weight: 800;
    line-height: 44px;
}

span.gh-pc-sum--multiplyer {
    font-size: 18px;
    margin-left: 9px;
}

.gh-pc-sum--ontime {
    font-size: 1rem;
    line-height: 32px;
    margin-bottom: 0;
    color: #8c8c8c;
}

.gh-pc-product--head-title {
    place-self: flex-end;
    flex: 1;
    line-height: 1.4;
}

.gh-pc-product--head {
    display: flex;
    align-items: flex-end;
    margin-bottom: 25px;
}

.gh-pc-product--head-title h2 {
    font-weight: 600;
}

.gh-pc-product--head-title span {
    max-width: 80%;
    display: block;
}

.gh-pc-product--head-preis {
    text-align: right;
}

.gh-pc---product-price {
    font-weight: 700;
    text-align: right;
    font-size: 28px;
    line-height: 28px;
}

.gh-pc---product-onetime {
    font-size: 12px;
    /* opacity: 0.7; */
    color: #8c8c8c;
}

.gh-pc---product-type {
    font-size: 12px;
}

div#product0 {
}

.pc-product > div {
    border-radius: var(--border-radius);
    padding: 30px;
    background-color: #fff;
}

.pc-product p {
}

.gh-pc-product--summary {
    margin-top: 33px;
}

.gh-pc-product--summary-wrapper {
    display: grid;
    grid-auto-columns: 1fr 1fr;
    margin-top: 15px;
    grid-auto-flow: column;
    gap: 20px;
}

span.info, a.info {
    display: inline-grid;
    border: 2px solid;
    width: 16px;
    height: 16px;
    border-radius: 20px;
    place-content: center;
    color: #000;
    margin-left: 5px;
    flex-shrink: 0;
    position: relative;
    font-size: 12px;
    font-weight: 800;
}

.hosting-tt {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #000;
    color: #fff;
    font-size: 12px;
    line-height: 1.4;
    text-align: center;
    display: grid;
    place-content: center;
    padding: 5px;
    opacity: 0;
    transition: opacity .3s;
}

label:hover .hosting-tt {
    opacity: 1;
}

input:disabled + label#hosting-eigenbetrieb  {
    cursor: auto; 
    background-color: var(--gh23-g50);
}

.pc-products:after, .pc-culs:after, .pc-hosting:after {
    display: none !important;
}

.cul-count--increase svg, .cul-count--decrease svg {
    height: 18px;
    width: 18px;
}

.gh-pc-addonselect div svg, .gh-pc-addonselect label svg {
    height: 18px;
    width: 18px;
}

.gh-pc-addon-window, .gh-pc-testen-window, .gh-pc-infopack-window {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #fff;
    width: 100%;
    display: flex;
    background-color: #10121cd1;
    z-index: 100001;
    padding: 30px;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    opacity: 0;
    transition: opacity .3s;
}

.gh-pc-addon-window svg {
    width: 16px;
}

.addons-filter .gh-pc-addons {
    display: grid;
}

.addons-filter {
    /* grid-gap: 15px; */
    /* display: grid; */
    /* grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); */
    /* margin-top: 25px; */
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    align-items: flex-start;
    overflow-y: auto;
    flex: 1;
    overflow-x: hidden;
    /* padding: 10px; */
    background-color: var(--gh23-g50);
}

.addons-filter input {
    display: none;
}

span.gh-pc-addon--icon {
    height: 40px;
    width: 40px;
    display: block;
    border-radius: 12px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 90%;
    position: relative;
}

.gh-pc-addon--icon:before {
    content: attr(data-info);
    position: absolute;
    top: 5px;
    left: 0;
    color: #fff;
    background-color: #000c;
    border-radius: 4px;
    padding: 3px 6px;
    font-size: 10px;
    opacity: 0;
    z-index: +1;
    transition: top .3s, left .3s, opacity .3s;
    transition-delay: .2s;
    line-height: 16px;
    pointer-events: none;
    width: 160px;
    display: block;
    height: fit-content;
}

.gh-pc-addon--icon:hover:before {
    top: 0;
    left: 0;
    opacity: 1;
}

span.gh-pc-addon--head {
    display: grid;
    grid-template: "feld1 feld2";
    grid-template-columns: 40px auto;
    gap: 12px;
    padding: 12px;
    flex: 1;
    min-height: 0;
    /* height: 74px; */
    align-items: flex-start;
}

span.gh-pc-addon--name {
    font-weight: 700;
    font-size: 14px;
    line-height: 1.45;
    min-height: 40px;
    display: inline-flex;
    align-items: center;
}

label.gh-pc-addon {
    border-radius: 4px;
    display: flex !important;
    width: 24.8% !important;
    padding: 0;
    box-sizing: border-box;
    align-self: flex-start;
    z-index: 1 !important;
    /* perspective: none !important; */
}

label.gh-pc-addon.filtr-item.filteredOut {
    pointer-events: none;
    z-index: 0 !important;
}

label.gh-pc-addon:hover {
    z-index: +100 !important;
    transition: z-index .3s;
}

label.gh-pc-addon > span {
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    /* box-shadow: 5px 5px 10px #00000017, -5px -5px 10px 0px #f3f3f3de; */
    width: 100%;
    height: 123px;
    background-color: #fff;
    position: relative;
    /* overflow: hidden; */
    cursor: pointer;
    /* border: 1px solid #eff1f3; */
    margin: 8px;
}

span.gh-pc-addon--price-frame {
    display: flex;
    border-top: 1px solid #ccc;
    /* height: 50px; */
    flex: 1 0 auto;
    /* flex-shrink: 0; */
    border-radius: 0 0 10px 10px;
    overflow: hidden;
    max-height: 51px;
    min-height: 0;
}

span.gh-pc-addon-price, span.gh-pc-addon-einmalig {
    flex: 1;
    align-content: center;
    display: flex;
    flex-direction: column;
    align-self: center;
    align-content: center;
    height: 50px;
    padding: 9px 4px 9px 4px;
}

span.gh-pc-addon-einmalig {
    border-left: 1px solid #ccc;
}

span.cp-preis-title {
    display: flex;
    justify-content: center;
    flex: 0 0;
    /* height: 14px; */
    color: currentColor;
    opacity: 0.7;
    font-size: 0.75rem;
    flex-direction: row;
    text-align: center;
}

span.cp-preis {
    display: flex;
    text-align: center;
    font-size: 20px;
    line-height: 24px;
    font-weight: 600;
    justify-content: center;
    flex: 1;
    align-items: center;
    font-size: 1rem;
    font-weight: 700;
    line-height: 17px;
}

.gh-pc-filtergroup {
    display: flex;
    flex: 1;
    overflow: hidden;
}

.gh-pc-filtergroup-list {
    width: 250px;
}

ul.nav.gh-fitler-menu.filters {
    list-style: none;
    display: flex;
    margin: 0;
    flex-direction: column;
    padding: 9px;
}

ul.nav.gh-fitler-menu.filters li:not(:last-child) {
    list-style: none;
    padding: 0;
    margin: 0;
    border: 0px solid transparent;
    line-height: 38px;
    display: flex;
    padding: 2px 16px;
    font-size: 1rem;
    color: #000;
    white-space: nowrap;
    height: 40px;
    cursor: pointer;
    width: 100%;
    border-radius: 32px;
    margin-bottom: 3px;
}

ul.nav.gh-fitler-menu.filters li:not(.active):hover {
    background-color: var(--gh23-g75);
}

ul.nav.gh-fitler-menu.filters li:not(:first-child) {
    border: none;
    margin-left: -1px;
}

ul.nav.gh-fitler-menu.filters li:first-child {
    /* border-radius: 4px 0 0 4px; */
}

ul.nav.gh-fitler-menu.filters li:last-child {
    list-style: none;
    padding: 0;
    border: none;
    line-height: 38px;
    display: flex;
    padding: 0 15px;
    border-radius: 32px;
    color: #000;
    white-space: nowrap;
    height: 40px;
    cursor: pointer;
}

ul.nav.gh-fitler-menu.filters li.active {
    border-color: var(--gh23-g50);
    background-color: var(--gh23-g50);
    color: var(--gh23-b);
    z-index: +1;
    font-weight: 800;
}

.gh-pc-addon-head-filter {
    display: flex;
}

.gh-pc-addon-search {
    list-style: none;
    padding: 0;
    border: 2px solid var(--gh23-b);
    display: flex;
    padding: 0 12px;
    border-radius: 32px;
    height: 40px;
    margin-left: 20px;
    overflow: hidden;
}

.gh-pc-addon-search input {
    border: none;
    padding: 0;
    color: #000;
    outline: none;
}

.gh-pc-addon-head {
    display: flex;
    justify-content: space-between;
    padding: 12px 12px 12px 20px;
    border-bottom: 1px solid #eff1f3;
}

.gh-pc-addon-head h3 {
    margin: initial;
    font-size: 1rem;
    margin-bottom: 0;
    line-height: 1.5;
    font-weight: 600;
    align-self: center;
}

.gh-pc-addons {
    display: flex;
    flex-direction: column;
    max-width: 1190px;
    max-height: 800px;
    width: 100%;
    height: 100%;
    background-color: #fff;
    border-radius: var(--border-radius);
    overflow: hidden;
    box-shadow: 0px -1px 50px 14px #00000042;
    flex-wrap: nowrap;
}

.gh-pc-addon-window.active {
    opacity: 1;
    pointer-events: all;
}

input:checked + label.gh-pc-addon.filtr-item .gh-pc-addon--wrapper:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border: 2px solid #1a73e8;
    border-radius: 10px;
    pointer-events: none;
}

input:checked + label.gh-pc-addon.filtr-item .gh-pc-addon-price {
    background-color: #1a73e8;
    color: #fff;
    border-color: #0000004f;
}

input:checked + label.gh-pc-addon.filtr-item .gh-pc-addon-einmalig {
    background-color: #1a73e8;
    color: #fff;
    border-color: #0000004f;
}

.gh-pc-addon-footer {
    display: flex;
    justify-content: right;
    padding: 10px;
    border-top: 1px solid #eff1f3;
    flex-grow: 0;
    height: 71px;
    align-items: center;
}

buttoncontrol {
    display: flex;
    grid-auto-flow: column;
    align-items: center;
    gap: 14px;
    margin-left: auto;
    align-content: center;
    flex-wrap: nowrap;
    justify-content: flex-end;
}

.gh-pc-body--shoppingcart .gh-pc-button.action--testen {
    border: 2px solid var(--gh23-b);
    border-radius: 32px;
    text-align: center;
    box-sizing: border-box;
    line-height: initial;
    text-decoration: none;
    font-weight: bold;
    color: var(--gh23-b);
    background-color: var(--gh23-y);
    display: inline-flex;
    align-items: center;
    background-image: linear-gradient(var(--gh23-b),var(--gh23-b));
    background-size: 0% 100%;
    background-repeat: no-repeat;
    background-position: left bottom;
    transition: background-size .3s, color .3s;
    cursor: pointer;
    padding: 24px 40px;
    width: 100%;
    font-size: 1rem;
}

.gh-pc-body--shoppingcart .gh-pc-button.action--testen:hover {
    background-size: 100% 100%;
    color: var(--gh23-y);
}

input[disabled] + label.gh-pc-addon {
    opacity: 0.3 !important;
}

label.gh-pc-addon.filtr-item.filteredOut {
    opacity: 0 !important;
}

.gh-pc-addonselect label.active {
    border: 2px solid #1a73e8;
    width: 100%;
    display: flex;
}

.gh-pc-addonselect label.active > span {
    width: 100%;
    border-radius: 4px;
    display: flex;
    flex-direction: column;
    background-color: #fff;
    position: relative;
    /* overflow: hidden; */
    cursor: pointer;
    flex: 1;
}

header.gh-g-header {
    background-color: transparent;
}

.icon dd svg {
    height: 20px;
    width: 20px;
    position: absolute;
    left: 2px;
    top: 3px;
}

.icon dd:before {
    content: none;
}

.gh-feature-toggle {
    display: flex;
    border-radius: 32px;
    align-content: center;
    align-items: center;
    justify-content: center;
    padding: 9px 12px;
    cursor: pointer;
    min-width: 130px;
    font-weight: 600;
    margin-top: 25px;
    border: 2px solid var(--gh23-b);
    background-image: linear-gradient(var(--gh23-b),var(--gh23-b));
    background-size: 0% 100%;
    background-repeat: no-repeat;
    transition: background-size .3s, color .3s;
}

.gh-feature-toggle:hover, .gh-feature-toggle.active {
    background-size: 100% 100%;
    color: var(--gh23-w);
}

.gh-feature-toggle span {
    display: none;
}

.gh-feature-toggle.active .hide {
    display: block;
}

.gh-feature-toggle:not(.active) .show {
    display: block;
}

.gh-pc-testen-window-wrapper, .gh-pc-infopack-window-wrapper {
    display: flex;
    flex-direction: column;
    max-width: 970px;
    max-height: 90vh;
    background-color: #fff;
    border-radius: 20px;
    overflow: auto;
    box-shadow: 0px -1px 50px 14px #00000042;
}

.active.gh-pc-testen-window, .active.gh-pc-infopack-window {
    opacity: 1;
    pointer-events: all;
}

.gh-pc-configurator input[type="text"], .gh-pc-configurator input[type="email"], .gh-pc-configurator select {
    box-sizing: border-box;
    font-weight: 100;
    order: 2;
    width: 100%;
    padding: 9px 12px;
    border-radius: 6px;
    outline: none;
    font-size: 1rem;
    border: 1px solid var(--gh23-g);
}

.gh-pc-configurator textarea {
    width: 100%;
    box-sizing: border-box;
    border-radius: 4px;
    border: 1px solid #bec1c5;
    padding: 0 10px;
    outline: none;
    font-weight: 600;
    order: 2;
    padding: 8px;
    resize: none;
}

.gh-pc-configurator label {
    font-weight: 600;
    color: #040404;
    order: 1;
    font-size: 0.875rem;
    /* padding: 8px 0 8px 0; */
    display: block;
    font-weight: 800;
}

.gh-pc-configurator div {
    display: flex;
    flex-direction: column;
    position: relative;
}

.gh-pc-configurator .hidden {
    display: none;
}

.gh-pc-testen-window .cms_form, .gh-pc-infopack-window .cms_form {
    max-width: 600px;
    padding: 25px;
}

.gh-pc-configurator div.required.datenschutz label {
    color: #000;
    font-weight: 100;
    margin-top: 4px;
    line-height: 1.5;
    padding-left: 38px;
}

.gh-pc-configurator div.required.datenschutz label .h4 {
    font-size: 14px;
    margin-bottom: 8px;
    font-weight: 699;
}

.gh-pc-configurator div.required.datenschutz {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
}

.gh-pc-configurator div.submit {
    display: grid;
    grid-auto-flow: column;
    align-items: center;
    gap: 7px;
    padding: 7px 0 0 0;
    flex-shrink: 0;
    margin-bottom: 0;
}

input#cntnt01fbrp_submit {
        align-content: center;
        justify-content: center;
        margin-top: 0;
        min-width: 130px;
        border: 2px solid var(--gh23-b);
        border-radius: 32px;
        padding: 10px 25px;
        text-align: center;
        box-sizing: border-box;
        text-decoration: none;
        color: var(--gh23-b);
        display: inline-flex;
        align-items: center;
        background-image: linear-gradient(var(--gh23-b),var(--gh23-b));
        background-size: 0% 100%;
        background-repeat: no-repeat;
        background-position: left bottom;
        transition: background-size .3s, color .3s;
        cursor: pointer;
        font-weight: 800;
        font-size: 0.85rem;
        font-family: 'Oscine';
        order:2;
        background-color: var(--gh23-y);
}

input#cntnt01fbrp_submit:hover {
    background-size: 100% 100%;
    color: var(--gh23-w);
}

input#abbrechen, input#ip-abbrechen {
    align-content: center;
    justify-content: center;
    margin-top: 0;
    min-width: 130px;
    border: 2px solid var(--gh23-b);
    border-radius: 32px;
    padding: 10px 25px;
    text-align: center;
    box-sizing: border-box;
    text-decoration: none;
    color: var(--gh23-b);
    display: inline-flex;
    align-items: center;
    background-image: linear-gradient(var(--gh23-y),var(--gh23-y));
    background-size: 0% 100%;
    background-repeat: no-repeat;
    background-position: left bottom;
    transition: background-size .3s, color .3s;
    cursor: pointer;
    font-weight: 800;
    background-color: #fff;
    font-size: 0.85rem;
    font-family: 'Oscine';
}

.gh-pc-testen-window-wrapper .error_message {
    max-width: 600px;
    padding: 25px 25px 0px 25px;
    font-size: 12px;
}

.error_message ul {
    list-style: none;
}

.gh-pc-testen-window-wrapper .error_message li:before {
    content: "!";
    position: absolute;
    width: 26px;
    background-color: #dd0000;
    left: 0;
    top: 0;
    bottom: 0;
    display: grid;
    place-content: center;
    font-weight: bold;
    color: #fff;
}

.gh-pc-testen-window-wrapper .error_message li {
    line-height: 1.5;
    color: #000;
    border: 2px solid #dd0000;
    padding: 7px 7px 7px 38px;
    box-sizing: border-box;
    position: relative;
    border-radius: 4px;
    font-size: 14px;
    font-weight: b;
}

span.info:before {
    content: attr(data-info);
    position: absolute;
    top: -60%;
    color: #fff;
    background-color: #000;
    border-radius: 4px;
    padding: 3px 6px;
    transform: translateX(-50%);
    margin-left: 50%;
    font-size: 10px;
    opacity: 0;
    white-space: nowrap;
    z-index: 100;
    transition: top .3s, opacity .3s;
    transition-delay: .2s;
    line-height: 16px;
    pointer-events: none;
}

span.info:hover:before {
    top: -26px;
    opacity: 1;
}

.gh-content ul.gh-pc-testen-perks li {
    list-style: none;
    font-size: 12px;
    line-height: 1.5;
    position: relative;
    padding-left: 28px;
    padding-right: 12px;
    color: #000;
    padding-bottom: 12px;
}

.gh-content ul.gh-pc-testen-perks li:before {
    content: "";
    height: 18px;
    width: 18px;
    background-color: #4ac399;
    position: absolute;
    left: 0;
    top: 0px;
    border-radius: 10px;
}

.gh-content ul.gh-pc-testen-perks {
    padding: 0;
    margin: 0;
    padding-top: 10px;
    padding-left: 8px;
}

ul.gh-pc-testen-perks li:after {
    content: "";
    border-right: 2px solid #ffffff;
    border-bottom: 2px solid #ffffff;
    width: 3px;
    height: 7px;
    display: inline-block;
    transform: rotate( 45deg );
    margin: 0 16px 0 4px;
    position: absolute;
    left: 3px;
    top: 4px;
}

@media (max-width: 1300px) {
    .gh-pc-body--wrapper {
        padding: 15px;
    }

    .gh-pc-header h1 {
        text-align: center;
        font-weight: 800;
        padding: 0 15px;
    }
}

@media (max-width: 1050px) {
    .gh-pc-product--summary-wrapper {
        display: flex;
        flex-direction: column;
    }

    .gh-pc-body--wrapper {
        flex-direction: column;
    }

    .pc-product {
        flex-direction: column;
    }

    .gh-pc-body--right {
        max-width: 100%;
        z-index: 100;
    }

    .gh-pc-body--left {
        flex: 0;
        padding: 0;
    }
.gh-pc-body--right .gh-pc-body--shoppingcart {
    max-height: none;
    padding-bottom: 0;
}
    .gh-pc-body--wrapper {
        padding: 15px;
    }

    .gh-pc-body .gh-pc-body--wrapper {
        padding: 76px 12px 15px 11px;
    }

    .gh-pc-product--head {
        flex-direction: column;
        text-align: center;
    }

    .gh-pc-product--head-title span {
        max-width: 100%;
    }

    .gh-pc-product--head-preis {
        /* width: 100%; */
        position: absolute;
        top: -5px;
        background-color: #216eff;
        right: -6px;
        padding: 4px 10px 9px 9px;
        border-left: 1px solid #216eff;
        border-bottom: 1px solid #216eff;
        border-bottom-left-radius: 4px;
        color: #fff;
    }

    .gh-pc---product-price {
    }

    div#product0 {
        position: relative;
        padding: 15px 15px 25px 15px;
    }

    .culs.gh-pc-module {
        grid-auto-flow: row;
        grid-template-columns: 1fr;
    }

    .gh-pc-product--head-preis .gh-pc---product-onetime {
        color: #ffffff85;
    }

    .gh-pc-product--head-preis span.info {
        color: #ffffff87;
        border: 1px solid #ffffff87;
    }

    fieldset.radio-toggle label:not(:first-of-type) {
        text-align: center;
        display: inline-block;
    }

    .radio-toggle span.gh-pc-cp-preis-title {
        display: block;
        font-size: 12px;
    }

    .gh-pc-addonselect {
        grid-auto-flow: row;
        grid-template-columns: 1fr;
    }

    .gh-pc-filtergroup {
        flex-direction: column;
    }

    .gh-pc-filtergroup-list {
        width: auto;
    }

    ul.nav.gh-fitler-menu.filters li:not(:last-child) {
        display: inline-block;
        width: initial;
    }

    ul.nav.gh-fitler-menu.filters {
        display: flex;
        text-align: center;
        flex-direction: row;
        overflow: hidden;
        overflow-x: auto;
    }

    ul.nav.gh-fitler-menu.filters li:last-child {
        display: inline-block;
    }

    .gh-pc-addon-head {
        flex-direction: column;
        padding: 10px;
        text-align: left;
    }

    .gh-pc-addon-head-filter {
        width: 100%;
    }

    .gh-pc-addon-search {
        margin: 0;
        width: 100%;
    }

    input#gh-filter-search {
        width: 100%;
    }

    .gh-pc-addon-window.active {
        padding: 5px;
    }

    .gh-pc-addon-head h3 {
        padding: 10px 0px 16px 7px;
        text-align: left !important;
        margin: 0;
        align-self: auto;
    }

    label.gh-pc-addon.filtr-item {
        width: 100% !important;
    }

    span.gh-pc-addon--head {
        padding: 10px;
    }

    label.gh-pc-addon > span {
        height: 114px;
        margin: 3px;
    }

    .addons-filter {
        padding: 5px;
    }

    .gh-pc-module dl {
        columns: 1 !important;
    }

    .gh-pc-module {
        padding: 20px 15px;
    }

    .pc-products, .pc-culs, .pc-hosting {
        margin-bottom: 15px;
    }

    .gh-pc-module--header {
        text-align: center;
    }

    .pc-product p {
        text-align: center;
    }

    .gh-pc-module p {
        text-align: center;
    }
}


.gh-pc-configurator {
    display: grid;
    grid-template-areas:
        "i i"
        "f f"
        "s l"
        "sd sd"
        "t t"
        "e e"
        "w w"
        "d d"
        "sm sm";
    gap: 15px;
}

.intro {
    grid-area: i;
}

.gh-pc-configurator h2.light {
    line-height: 1.2 !important;
    margin: 20px 0 0 0 !important;
    padding: 0 !important;
}

.required.required.vorname {
    grid-area: s;
}

.required.nachname {
    grid-area: l;
}

.required.firma {
    grid-area: f;
}

.required.subdomain {
    grid-area: sd;
}

.required.telefon {
    grid-area: t;
}

.required.email {
    grid-area: e;
}

.pc-select.referrer_dd {
    grid-area: w;
}

.required.datenschutz {
    grid-area: d;
}

.submit {
    grid-area: sm;
}


.gh-pc-configurator div.required.datenschutz input#fbrp__933 {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}


.gh-pc-configurator a {
    font-weight: 800;
    text-decoration: none;
    color: var(--gh23-b);
}

.gh-pc-configurator  a:hover {
    background-image: linear-gradient(var(--gh23-y),var(--gh23-y));
    background-size: 100% 8px;
    background-repeat: no-repeat;
    background-position: left bottom;
    transition: background-size .3s;
}

.gh-pc-configurator  input#fbrp__933 + label:before {
    content: "";
    height: 20px;
    width: 20px;
    border-radius: 4px;
    border: 2px solid;
    display: block;
    position: absolute;
    left: 5px;
    top: 5px;
}

.gh-pc-configurator  input#fbrp__933:checked + label:before {
    background-color: var(--gh23-y);
}



.gh-pc-configurator  input#fbrp__933:checked + label:after {
    content: "";
    height: 11px;
    width: 6px;
    border: 0px solid transparent;
    border-right: 2px solid #000;
    border-bottom: 2px solid  #000;
    display: block;
    position: absolute;
    left: 12px;
    top: 8px;
    transform: rotate(45deg);
}

.gh-pc-configurator div.required.datenschutz label p {
    margin: 0;
}

.gh-pc--support {
    display: grid;
    grid-template:
        "name checkbox"
        "extra checkbox";
    /* grid-template-rows: 20px 20px; */
    background-color: var(--gh23-g25);
    border-radius: 6px;
    padding: 12px 12px;
    align-content: center;
    gap: 4px;
    margin-bottom: 6px;
    user-select: none;
    margin-top: 20px;
    cursor: pointer;
}

.gh-pc--support .name {
    grid-area: name;
    font-weight: 800;
    line-height: 1;
    margin-bottom: 5px;
}

.gh-pc--support .extra {
    grid-area: extra;
    line-height: 1.2;
    font-size: 0.8rem;
}

.gh-pc--support .checkbox {
    grid-area: checkbox;
    border: 2px solid;
    height: 32px;
    place-self: center;
    width: 58px;
    border-radius: 29px;
    position: relative;
}

span.checkbox {}

.gh-pc--support .checkbox:before {
    content: "";
    position: absolute;
    height: 24px;
    width: 24px;
    top: 2px;
    left: 2px;
    background-color: #000;
    border-radius: 28px;
    transition: left .2s;
}

.gh-pc--support.active .checkbox {
    background-color: var(--gh23-y);
}

.gh-pc--support.active .checkbox:before {
    left: 28px;
}


#pc-product-table td, #ptotal table td, #pmt table td {
    padding: 10px 5px 10px 5px;
    vertical-align: text-bottom;
}

#pc-product-table td strong, #pmt table strong{
    padding-bottom: 5px;
    display: inline-block;
}

#pc-product-table th, #ptotal table th, #pmt table th {
    padding: 5px;
}


#pc-product-table th, #ptotal table th, #pmt table th {
    background-color: #000;
    color:#fff
}

#pc-product-table tr, #ptotal table  tr {
    border-bottom: 1px solid;
}

#pc-product-table td:nth-child(1), #pc-product-table th:nth-child(1), #pmt table th:nth-child(1) {
    text-align: left;
    width: 60px;
}

#pc-product-table td:nth-child(2), #pc-product-table th:nth-child(2), #pmt table th:nth-child(2) {
    text-align: left;
}


#pc-product-table td:nth-child(3), #pc-product-table th:nth-child(3), #pmt table th:nth-child(3), #pmt table td:nth-child(3) {
    width: 120px;
    text-align: right;
}

#pc-product-table td:nth-child(4), #pc-product-table th:nth-child(4) {
    width: 120px;
    text-align: right;
}


#ptotal table  td:nth-child(2), #ptotal table  td:nth-child(3), #ptotal table  th:nth-child(2), #ptotal table  th:nth-child(3), #pmt table  th:nth-child(4), #pmt table  td:nth-child(4){
    width: 120px;
    text-align: right;
}
div#pfooter {
    text-align: center;
    margin: 30px 0;
    font-size: 0.75em;
}

div#interntable table td:nth-child(1), div#interntable table td:nth-child(3) {
    border-top: 1px solid #000;
    padding: 10px 5px 10px 5px;
    font-weight: 800;
}

div#interntable table td {
    height: 2cm;
    vertical-align: text-top;
}

div#interntable table {margin-top: 2cm;}

div#interntable {
    margin-top: 20px;
    page-break-before: always;
}

div#interntable table td:nth-child(2) {
    width: 25px;
}

div#print {
    display: none;
    padding: 0.25cm 0.25cm 0.25cm 1cm;
    font-size: 7pt;
    line-height: 1.3;
}

.letterhead {
    font-size: 6pt;
}
.letterhead svg {
    height: 1em;
    margin-bottom: -1px;
}


td.letterhead-info {
    width: 8cm;
    line-height: 1.6;
}

.letterhead-info table {
    vertical-align: top;
    border-collapse: initial;
}

td.letterhead-info a {
    color: #000;
    font-weight: bold;
    text-decoration: none;
}

div#pAddress {
    height: 130px;
}



div#plogo {
    text-align: right;
    margin-bottom: 70px;
    margin-top: 1cm;
}

div#plogo svg {
    width: 6.5cm;
    fill: #000 !important;
}

.letterhead-info table td:nth-child(1) {
    white-space: nowrap;
    font-weight: bold;
    padding-right: 10px;
}

.letterhead-info table tr:nth-child(1) td:nth-child(2) {
    text-align: right;
}

.letterhead-info table td {
    vertical-align: top;
}
.ghp-controls {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    margin: 20px -20px -20px -20px;
    border-top: 2px solid var(--gh23-g);
}

.ghp-controls div {
    height: 52px;
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 10px 10px;
    transition: background-color .2s;
    cursor: pointer;
    align-items: center;
}

.ghp-controls div:hover {
    background-color: var(--gh23-g50);
}

div#cc {
    border-right: 2px solid var(--gh23-g);
}

.ghp-controls div svg {
    height: 20px;
}

span.tokennummer {
    line-height: 1.2;
    display: inline-block;
    font-size: 6pt;
}

.letterhead-info table tr td {
    padding-bottom: 10px;
}


@media print{
svg#greyhound--logo-mobile {
    display: none;
}
    
    div#print {
    display: block;
    font-size: 12px;    
}
    header, content, .mobile-lock, gh-pc-testen-window ,#gh-g-navigation--mobile-menu, footer, .gh-g-copyright, #moin-ai-container{
        display: none;
    }
}

div#pProducts, #pmt {
    margin-bottom: 20px;
}

#pProducts > span, #ptotal > span, #pmt > span {
    margin: 10px 0;
    display: block;
}

textarea#paddresse {
    width: 100%;
    resize: none;
    height: 117px;
    padding: 10px;
    font-family: inherit;
    border: 2px solid;
    border-radius: 8px;
    background-color: var(--gh23-g25);
}

div#intern {
    margin: 20px -20px -20px -20px;
    border-top: 2px solid var(--gh23-g);
    padding: 10px 10px 0 10px;
    position: relative;
}

div#intern h4 {
    font-weight: bold;
    margin: 0;
}

div#mt {
    display: flex;
    width: calc(100% - 20px);
    /* max-width: 200px; */
    gap: 8px;
    justify-content: space-between;
    margin-bottom: 32px;
}

div#mt div {
    display: flex;
    flex-direction: column;
    flex: 1;
    white-space: nowrap;
    justify-content: flex-end;
}

div#mt input {
    padding: 9px 9px;
    font-size: 16px;
    border-radius: 8px;
    border: 2px solid;
}

div#intern label {
    font-weight: 800;
}

.mt--day {
    width: 70px;
}

.mt--dayto {
    width: 70px;
}

.mt--price {
    width: 165px;
}

.mt--spacer {
    padding-bottom: 7px;
}

#cc svg {
    height: 24px;
    width: 24px;
}

#cc #done {fill: transparent;}
}

#cc #link {
     animation: fadeOutIn 5s linear;
}

#cc #load {opacity: 0;}


#cc.active #done {
    animation: copydone 1s linear 1s forwards;
    fill: transparent;
}

#cc.active #link {
     animation: fadeOutIn 0.5s linear forwards;
}

#cc.active #load {
    transform-origin: center;
    fill: var(--skill-color);
    animation: rotate 1s linear 0.5s forwards;
    opacity: 0;
    }

@keyframes rotate {
         0% { opacity: 0;
              transform: rotate(0deg)
            }
     20% { opacity: 1;}
     90% { opacity: 0;}   
    100% {opacity: 1;
          transform: rotate(720deg)
         }
}

@keyframes fadeOutIn {
      0% { opacity: 1;}   
    100% {opacity: 0;}
}

@keyframes copydone  {
      0% {
        fill: transparent;
    }
    33% {
        fill: var(--skill-color);
    }
     66% {
        fill: transparent;
    }
    100% {
        fill: var(--skill-color);     
    }
}


.gh-pc-body--shoppingcart > div:not(.requirements).cta--panel {
    margin-top: 20px;
    padding: 25px 20px 20px 20px;
}

.cta--panel a.button {
    padding: 6px 18px;
    width: 100%;
}

.cta--panel h3 {
    font-size: 18px;
}

.gh-pc-body--shoppingcart > div:not(.requirements).cta--panel.yellow {
    background-color: var(--gh23-y);
}

/* width */
.gh-pc-body--shoppingcart::-webkit-scrollbar {
  width: 8px;
}

/* Track */
.gh-pc-body--shoppingcart::-webkit-scrollbar-track {
  border-radius: 5px;
}
 
/* Handle */
.gh-pc-body--shoppingcart::-webkit-scrollbar-thumb {
  background: #d6dce7; 
  border-radius: 10px;
}

/* Handle on hover */
.gh-pc-body--shoppingcart::-webkit-scrollbar-thumb:hover {
  background: #000; 
}