/* Ein Umlaut wie ä nötig für UTF-8 ohne BOM */

/* CSS Variables */
:root {
    --color-henrys: #d90368;
    --color-henrys-rgb: 204, 177, 115;
    --color-black: #0D1321;
    --color-gray-dark: #546478;
    --color-gray-dark-rgb: 84, 100, 120;
    --color-gray: #DBE0E6;
    --color-gray-light: #F3F5F7;
    --color-red: #BD1E1E;
    --color-red-rgb: 189, 30, 30;
    --color-blue: #49598B;
    --color-blue-rgb: 73, 89, 139;
    --color-green: #8BC34A;
    --color-white: #ffffff;
    --color-pink: #c90358;

    --shadow-color: 0deg 0% 0%;
    --shadow-md:
        0.3px 0.5px 0.7px hsl(var(--shadow-color) / 0.11),
        0.8px 1.6px 2px -0.8px hsl(var(--shadow-color) / 0.11),
        2.1px 4.1px 5.2px -1.7px hsl(var(--shadow-color) / 0.11),
        5px 10px 12.6px -2.5px hsl(var(--shadow-color) / 0.11);
    --shadow-lg:
        0.3px 0.5px 0.7px hsl(var(--shadow-color) / 0.1),
        1.5px 2.9px 3.7px -0.4px hsl(var(--shadow-color) / 0.1),
        2.7px 5.4px 6.8px -0.7px hsl(var(--shadow-color) / 0.1),
        4.5px 8.9px 11.2px -1.1px hsl(var(--shadow-color) / 0.1),
        7.1px 14.3px 18px -1.4px hsl(var(--shadow-color) / 0.1),
        11.2px 22.3px 28.1px -1.8px hsl(var(--shadow-color) / 0.1),
        17px 33.9px 42.7px -2.1px hsl(var(--shadow-color) / 0.1),
        25px 50px 62.9px -2.5px hsl(var(--shadow-color) / 0.1);
}

@font-face {
    font-display: swap;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 300;
    src: url('Fonts/inter-v18-latin-300.woff2') format('woff2');
}

@font-face {
    font-display: swap;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    src: url('Fonts/inter-v18-latin-regular.woff2') format('woff2');
}

@font-face {
    font-display: swap;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    src: url('Fonts/inter-v18-latin-500.woff2') format('woff2');
}

@font-face {
    font-display: swap;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 600;
    src: url('Fonts/inter-v18-latin-600.woff2') format('woff2');
}

@font-face {
    font-display: swap;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 700;
    src: url('Fonts/inter-v18-latin-700.woff2') format('woff2');
}

*, *::before, *::after {
    box-sizing: border-box;
}
html, body {
    font-size: 15px;
}
body {
    font-family: 'Inter';
    font-weight: 100;
    line-height: 1.5;
    background: var(--color-gray-light);
    margin: 0;
    padding: 0;
    font-size: 18px;
}

a {
    text-decoration: none;
    color: var(--color-pink);
}

a:hover {
    text-decoration: underline;
}
.promo-banner {
    background: #D90368;
    background: linear-gradient(90deg, rgba(217, 3, 104, 1) 0%, rgba(13, 19, 33, 1) 100%);
    padding: .5rem 1rem;
    text-align: center;
}

.promo-banner-content {
    max-width: 1200px;
    margin: 0 auto;
    color: #fff;
    font-weight: 500;
}
.promo-banner-content p  {
    margin: 0;
}

header {
    background-color: #fff;
    padding: 1px 0;
}
header .logo {
    text-align: center;
    margin-top: 2rem;
}

header .logo #TopLogo img {
    width: 100%;
    max-width: 300px;
}
.wrapper {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1rem;
    position: relative;
}

main {
    background-color: #fff;
    padding: 2rem 0;
}
h1 {
    margin: 0;
    text-align: center;
    text-transform: uppercase;
    color: var(--color-black);
    font-weight: 700;
    font-size: 2rem;
    letter-spacing: -0.015em;
}

.products .product a:hover {
    text-decoration: none;
}
.products {
    display: flex;
    flex-direction: row;
    gap: 0;
    align-items: stretch;
    flex-wrap: wrap;
}

.product {
    position: relative;
    width: 90%;
    margin: 0 5%;
}
.product-image {
    height: 310px;
    text-align: center;
}
.product-image img {
    width: auto;
    height: 100%;
    transition: all 200ms ease;
    transform: scale(0.95);
}
.product-content {
    display: flex;
    flex-direction: row;
    gap: 1rem;
    justify-content: space-between;
}
.product-name {
  width: 65%;
}
.product-name h2, h3 {
    font-size: 1rem;
    font-weight: 700;
    color: var(--color-black);
    margin: 0;
    padding: 0;
}
.product-name h3 {
    font-weight: 300;
}
.product-price p {
    font-size: 1rem;
    font-weight: 700;
    color: var(--color-black);
    margin: 0;
    padding: 0;
}
.product-price .Strike {
    font-size: 1rem;
    font-weight: 100;
    color: var(--color-gray-dark);
    margin: 0;
    padding: 0;
    text-decoration: line-through;
    text-decoration-thickness: auto;
    text-decoration-skip-ink: none;
}

.product-status {
    text-align: center;
    color: red;
    font-weight: bold;
    font-size: 1rem;
    margin-bottom: 10px;
}

.MoreOffer {
    padding-top: 4rem;
}

.MoreOfferProducts {
    display: flex;
    gap: 3rem;        
    justify-content: space-between; 
}

.MoreOfferProducts .MoreOfferProduct {
    flex: 1 1 33.333%;
}

.MoreOfferProducts .MoreOfferProduct a:hover {
    text-decoration: none;
}

.MoreOfferProducts .MoreOfferProduct-image {
    height: 310px;
    text-align: center;
}
.MoreOfferProducts .MoreOfferProduct-image img {
    width: auto;
    height: 100%;
}
.MoreOfferProducts .MoreOfferProduct-content {
    display: flex;
    flex-direction: row;
    gap: 1rem;
    justify-content: space-between;
}

.item {
    flex-wrap: nowrap;
    position: relative;
    align-items: start;
}

.item-images img {
    width: 100%;
    height: auto;
}

/* Mobile Slider Styles */
/*
.slider-container {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.slider-wrapper {
    display: flex;
    transition: transform 0.3s ease-in-out;
    cursor: grab;
}

.slider-wrapper:active {
    cursor: grabbing;
}

.slider-wrapper img {
    flex: 0 0 100%;
    width: 100%;
    height: auto;
    object-fit: cover;
}

.slider-dots {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
    padding: 1rem 0;
}

.slider-dots .dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: var(--color-gray);
    cursor: pointer;
    transition: all 0.3s ease;
}

.slider-dots .dot.active {
    background-color: var(--color-henrys);
    transform: scale(1.2);
}

.slider-dots .dot:hover {
    background-color: var(--color-gray-dark);
}
*/

.slider-container {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.slider-wrapper {
    display: flex;
    transition: transform 0.3s ease-in-out;
    cursor: grab;
    touch-action: pan-y;
}

.slider-wrapper:active {
    cursor: grabbing;
}

.slider-wrapper img {
    flex: 0 0 100%;
    width: 100%;
    height: auto;
    object-fit: cover;
}

.slider-dots {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
    padding: 1rem 0;
}

.slider-dots .dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: var(--color-gray);
    cursor: pointer;
    transition: all 0.3s ease;
}

.slider-dots .dot.active {
    background-color: var(--color-henrys);
    transform: scale(1.2);
}

.slider-dots .dot:hover {
    background-color: var(--color-gray-dark);
}




.item-content h1 {
    text-align: left;
}
.item-content h2 {
    margin-top: 0;
}
#PosText ul {
    padding: 0;
    list-style: none;
}
#PosText ul li {
    margin: 0;
}
.item .item-price {
    font-size: 1.72rem;
    line-height: 1.1;
    text-align: right;
    position: relative;
}
.item .item-price span.Strike {
    color: #546478;
    font-weight: 100;
    font-size: 1.72rem;
    text-decoration: line-through;
}
.item .item-price span {
    font-weight:700;
}

.item-rebate {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: .5rem 1rem;
    background: #d90d6a;
    border-radius: 1rem 1rem 1rem 0;
    color: #ffffff;
    font-weight: 300;
    font-size: 1.5rem;
}
.item-rebate p {
    margin: 0;
}

div#PosText {
    margin-top: 3rem;
}
div#PosText ul {
    margin: 1rem;
    font-size: 1rem;
    padding-left: 1rem;
}
div#PosText ul li {
    list-style-type: square;
}
button.btn {
    background: #0d1321;
    border: 1px solid #0d1321;
    display: block;
    width: 100%;
    color: #fff;
    font-size: 1.2rem;
    font-weight: 500;
    cursor: pointer;
    text-transform: uppercase;
    transition: all 200ms ease;
    padding: 1.37rem 1rem;
}
button.btn:hover {
    background: #ffffff;
    border-color: #0d1321;
    color: #0d1321;
}
button.btn-ghost {
    background: #ffffff;
    border: 1px solid #546478;
    display: block;
    width: 100%;
    color: #546478;
    font-size: 1.2rem;
    font-weight: 500;
    cursor: pointer;
    text-transform: uppercase;
    transition: all 200ms ease;
    padding: 1.37rem 1rem;
    margin-top: 1rem;
}
button.btn-ghost:hover {
    background: #C3C5C7;
    border-color: #0d1321;
    color: #0d1321;
}

/* Info Boxes */
.info-boxes {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin: 2rem 0;
}

.info-box {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.info-box-icon {
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

.info-box-icon img {
    width: 42px;
    height: 42px;
    object-fit: contain;
}

.info-box-content {
    flex: 1;
}

.info-box-content h3 {
    margin: 0 0 0.5rem 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--color-black);
}

.info-box-content p {
    margin: 0;
    font-size: 0.9rem;
    color: var(--color-gray-dark);
    line-height: 1.4;
}

.cart {
    padding-top: 2rem;
}

.cart .image img {
    width: 100%;
    height: auto;
}

.cart-item {
    display: flex;
    border-bottom: 1px solid #d4d7de;
}
.cart-item {
    display: flex;
    justify-content: space-between;
}

.cart-item .image {
    width: 20%;
}
.cart-item .description {
    font-size: 1rem;
    flex: auto;
}
.cart-item .description h2 {
    margin: 10px 0;
    padding: 0;
    font-weight: 700;
    color: black;
}

.cart-item .amount {
    font-size: 1rem;
}
.cart-sum {
    flex: 1;
}

.cart-sum .inline {
    display: flex;
    justify-content: space-between;
    padding: .5rem;
}

.inline.total {
    font-weight: 700;
    border-top: 1px solid;
    margin-bottom: 2rem;
}

.customer-menu ul {
    margin: 0;
    padding: 0;
    list-style: none;
}
.customer-menu ul li a {
    display: block;
    margin-bottom: 1px;
    color: #ffffff;
    background: #0d1321;
    padding: 1rem 1.5rem;
    font-weight: 400;
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    text-decoration: none;
    transition: all 120ms ease-in-out;
}
.customer-menu ul li:first-child a {
    border-radius: 1rem 1rem 0 0;
}
.customer-menu ul li:last-child a {
    border-radius: 0 0 1rem 1rem;
}
.customer-menu ul li a:hover {
    background-color: var(--color-henrys);
}
.customer-menu ul li.Sel a {
    background-color: var(--color-gray-dark);
}

.customer-content {
    padding-top: 2rem;
}
.customer-content h1 {
    font-size: 2.5rem;
}
.customer-content th {
    text-align: left;
}

.footer-boxes {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin: 2rem 0;
    align-items: center;
}

.footer-box {
    display: flex;
    align-items: center;
    gap: 1rem;
}
.footer-logo img {
    width: 100%;
    max-width: 220px;
}
footer .menu {
    text-align: left;
}

footer .menu h3 {
    margin: 0;
    padding: 0;
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--color-black);
}
footer .menu ul {
    margin: 0;
    padding: 0;
    list-style: none;
    text-align: center;
}
footer .menu ul a {
    color: var(--color-black);
    font-size: 1rem;
    font-weight: 400;
    text-decoration: none;
    transition: all 120ms ease-in-out;
}
footer .menu ul a:hover {
    color: var(--color-henrys);
    text-decoration: underline;
}

.similar-item {
    flex: 1 1 auto;
    display: flex;
    align-content: space-between;
    flex-direction: column;
    justify-content: space-between;
}
.similar-item img {
    width: 100%;
    height: auto;
}
.similar-item .description {
    padding-top: 1rem;
}
.similar-item .description p {
    margin: 0;
    font-size: 1rem;
    font-weight: 700;
}
.similar-item .description p .Strike {
    font-weight: 100;
    color: #546478;
    text-decoration: line-through;
    text-decoration-thickness: auto;
    text-decoration-skip-ink: none;
}

/* Desktop Layout */
@media (min-width: 768px) {
    #main-navigation ul {
        flex-direction: row;
        justify-content: space-around;
        gap: 0;
    }
    #main-navigation > ul > li {
        flex: 1;
        margin: 0;
    }

    .product {
        position: relative;
        width: 45%;
        margin: 0 2.5%;
    }
    .product-image {
        height: 320px;
        text-align: center;
    }
    .product-image img {
        width: auto;
        height: 100%;
    }

    /* Desktop: Disable slider, show images normally */
    .slider-wrapper {
        display: block;
        cursor: default;
    }
    .slider-wrapper img {
        flex: none;
        width: 100%;
        margin-bottom: 0;
    }
    .slider-dots {
        display: block;
    }
    /* Info Boxes - Desktop Layout */
    .info-boxes {
        flex-direction: row;
        gap: 1.5rem;
    }
    .info-box {
        flex: 1;
        flex-direction: column;
        text-align: center;
        padding: 2rem 1rem;
    }
    .footer-boxes {
        flex-direction: row;
        gap: 1.5rem;
        align-items: stretch;

    }
    .footer-box {
        flex: 1;
        flex-direction: column;
        text-align: center;
        padding: 2rem 1rem;
    }
    footer .menu ul {
        text-align: left;
    }

    h1 {
        margin: 0;
        text-align: center;
        text-transform: uppercase;
        color: var(--color-black);
        font-weight: 700;
        font-size: 3.5rem;
        letter-spacing: -0.015em;
    }

    .item {
        display: flex;
    }

    .item-images {
        width: 50%;
    }
    .item-content {
        width: 50%;
        padding: 0 3rem;
        position: sticky;
        top: 0;
    }

    .similar-items {
        display: flex;
        padding: 1rem 0 5rem 0;
        flex-wrap: nowrap;
        gap: 1rem;
    }
    .similar-item {
        flex: 1 1 auto;
        display: flex;
        align-content: space-between;
        flex-direction: column;
        justify-content: space-between;
    }
    .similar-item img {
        width: 100%;
        height: auto;
    }
    .similar-item .description {
        padding-top: 1rem;
    }
    .similar-item .description p {
        margin: 0;
        font-size: 1rem;
        font-weight: 700;
    }
    .similar-item .description p .Strike {
        font-weight: 100;
        color: #546478;
        text-decoration: line-through;
        text-decoration-thickness: auto;
        text-decoration-skip-ink: none;
    }

    .cart {
        display: flex;
    }
    .cart-items {
        width: 60%;
    }
    .payment-items {
        width: 60%;
    }
    .cart-sum {
        flex: 1;
        margin-left: 3rem;
    }

    .customer-area {
        display: flex;
    }

    .customer-menu {
        width: 300px;
    }
    .customer-content {
        flex: 1;
        margin-left: 3rem;
        padding-top: 0;
    }
    .customer-content h1 {
        text-align: left;
    }

}
@media (min-width: 1200px) {
    .product {
        position: relative;
        width: 28%;
        margin: 0 2.5%;
    }
    .product-image {
        height: 320px;
        text-align: center;
    }
    .product-image img {
        width: auto;
        height: 100%;
    }
}
@media (min-width: 1400px) {
    .product {
        position: relative;
        width: 20%;
        margin: 0 2.5%;
    }
    .product-image {
        height: 320px;
        text-align: center;
    }
    .product-image img {
        width: auto;
        height: 100%;
    }
}

.product-rebate {
    position: absolute;
    top: 280px;
    left: 0;
    padding: .25rem 1rem;
    background: #d90d6a;
    border-radius: 1rem 1rem 1rem 0 ;
    color: #ffffff;
    font-weight: 300;
    font-size: 1rem;
}
.product-rebate p {
    margin: 0;
    padding: 0;
}
.product:hover img {
    /*opacity: .8;*/
    transform: scale(1);
}
.product .add-to-favorite {
    position: absolute;
    top: 1rem;
    right: 1rem;
    opacity: 1;
}

.product .Vintage {
    position: absolute;
    top: -1rem;
    left: 1rem;
    opacity: 1;
    width: 100%;
    text-align: center;
    font-size: 18px;
  
    /*
    position: absolute;
    top: 10px;
    width: 100%;
    left: auto;
    padding: 2px;
    height: 20px;
    color: black;
    font-size: 16px;
    display: block;
    text-align: center;
    z-index: 4;
    */
}

.products {
    padding-bottom: 2rem;
}

.amount a {
    color: var(--color-henrys);
}

.logo .LeftMenu {
    position: absolute;
    top: 0;
    left: 1.5rem;
    display: flex;
    gap: .75rem;
}

#FacebookImg {
    height: 21px;
    width: 21px;
}

#InstagramImg {
    height: 21px;
    width: 21px;
}

#MailImg {
    height: 21px;
    width: 21px;
}

#LangImg {
    height: 20px;
    width: 26px;
}

.logo .RightMenu {
    position: absolute;
    top: 0;
    right: 1.5rem;
    display: flex;
    gap: .75rem;
}
.logo .RightMenu a,
.logo .RightMenu a:hover {
    text-decoration: none;
    color: #d90d6a;
}
.logo .RightMenu img {
    width: 18px;
}
.logo .RightMenu span {
    font-size: .8rem;
    font-weight: 500;
    display: inline-block;
}

/* --------------------------------------------------- */
#MainMenu {
    width: 100%;
    background-color: black;
    border-radius: 15px;
}

#MainMenu a {
    padding: .5rem .75rem;
    display: inline-block;
    color: white;
}

#MainMenu a:hover {
    text-decoration: none;
}

#MainMenu span {
    font-size: .85em;
    display: block;
    padding: .75rem;
    font-weight: 700;
}

#MainMenu ul {
    position: relative;
    display: flex;
    margin: 0;
    padding: 0;
    list-style: none;
    flex-direction: row;
    font-weight: bolder;
}

#MainMenu > ul {
    display: flex;
    flex-direction: row;
    justify-content: center; /* <-- Zentriert alle Menüeinträge */
}

#MainMenu > ul > li {
    flex: 1;               /* Jeder Menüpunkt bekommt die gleiche Breite */
}

#MainMenu > ul > li > a {
    text-align: center;
}

#MainMenu > ul > li > a:hover {
    background: var(--color-henrys);
    border-radius: 15px;
}

#MainMenu > ul > li {
    flex: 1; 
    position: relative;
}

#MainMenu > ul > li > a {
    display: block;
    text-align: center;
}

#MainMenu > ul > li > a.Sel {
    color: var(--color-henrys);
}

#MainMenu > ul > li > a.Sel:hover {
    color: black;
}

/* --- UNTERMENÜ --- */
#MainMenu ul ul {
    position: absolute;
    top: 100%;           /* Dropdown direkt unter dem Hauptpunkt */
    left: 0;
    width: 100%;         /* 1:1 gleiche Breite wie der Haupt-Menüpunkt */
    margin-top: 1px;
    display: flex;
    flex-direction: column;

    opacity: 0;
    height: 0;
    overflow: hidden;
    transition: all 120ms ease-in;
    background: var(--color-henrys);
    z-index: 100;
    border-radius: 0 0 15px 15px;
}

/* Sichtbar bei Hover */
/*
#MainMenu > ul > li:hover > ul {
    opacity: 1;
    height: auto;
    box-shadow: var(--shadow-lg);
}
*/

/* Untermenü-Links */
#MainMenu ul ul li a {
    display: block;
    text-align: center;  /* Zentrierter Text */
    padding: .75rem;
}

@media (min-width: 768px) {
 #MainMenu > ul > li:hover ul {
     opacity: 1;
     height: auto;
     box-shadow: var(--shadow-lg);
 }
}

/* --- Dropdown bei Klick (per Klasse .open) --- */
#MainMenu > ul > li.open ul {
    opacity: 1;
    height: auto;
    box-shadow: var(--shadow-lg);
    margin-top: 40px;
}

/* --- Kleine Formatierung für den Toggle-Button --- */
.MainMenuSubMenuToggle {
    background-color: black;
    border: none;
    color: var(--color-white);
    font-size: 0.8rem;
    margin-top: 0.2rem;
    margin-left: 2px;
    margin-right: 0.2rem;
    cursor: pointer;
    display: none;
    border-right: 1px solid var(--color-white);
}

#MainMenu > ul ul a {
    font-size: .85em;
    /*opacity: .6;*/
    transition: all 120ms ease-in;
    margin-top: 1px;
    color: white;
}

#MainMenu > ul ul a:hover {
    font-size: .85em;
    background-color: rgba(255,255,255,0.1);
    color: var(--color-black);
    transition: all 120ms ease-in;
    margin-top: 1px;
    opacity: 1;
}

/* ========================================================================== */
#LoginLink {
    z-index: 401;
    position: relative;
    cursor: pointer;
}

#LoginDiv {
    z-index: 500;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 290px;
    padding: 10px;
    border: 2px solid black;
    background-color: var(--color-white);
    border-radius: 10px;
    font-size: 16px;
    display: none;
}

#LoginDiv a {
    color: #c90358;
}

.LoginBtn {
    background: #0d1321;
    border: 1px solid #0d1321;
    width: 120px;
    color: #fff;
    font-size: 1rem;
    font-weight: 500;
    cursor: pointer;
    text-transform: uppercase;
    transition: all 200ms ease;
    padding: 10px;
}
.LoginBtn:hover {
    background: #ffffff;
    border-color: #0d1321;
    color: #0d1321;
}
.LoginBtn.btn-ghost {
    background: #ffffff;
    border: 1px solid #546478;
    display: block;
    width: 100%;
    color: #546478;
    font-size: 1.2rem;
    font-weight: 500;
    cursor: pointer;
    text-transform: uppercase;
    transition: all 200ms ease;
    padding: 1.37rem 1rem;
    margin-top: 1rem;
}
.LoginBtn.btn-ghost:hover {
    background: #C3C5C7;
    border-color: #0d1321;
    color: #0d1321;
}

input:focus {
    outline: 2px solid hotpink;
    outline-offset: 0px;
}

.LoginInput {
    width: 160px;
    padding: 4px;
    border: 1px solid black;
}

#LoginOverlay {
    position: fixed;
    display: none;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 30;
    cursor: pointer;
}

/* --------------------------------- */
#LoginErrDiv {
    z-index: 300;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 20px;
    border: 2px solid black;
    color: black;
    background-color: #ffa0a0;
    border-radius: 10px;
    font-size: 16px;
    display: block;
    text-align: center;
    box-shadow: 10px 10px 15px silver;
}

.LoginErrBtn {
    width: 200px;
    padding: 4px;
    border: 1px solid black;
}

/* --------------------------------- */
#LoginSuccessDiv {
    z-index: 300;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 20px;
    border: 2px solid black;
    color: black;
    background-color: white;
    border-radius: 10px;
    font-size: 16px;
    display: block;
    text-align: center;
    box-shadow: 10px 10px 15px silver;
    visibility: visible;
}

#LoginSuccessMenuIcon {
    height: 40px;
}

.ListPagerPages {
    height: 25px;
    display: block;
    text-align: center;
}

.ListHits {
    position: absolute;
    font-size: 16px;
    color: black;
    margin-top: 2px;
    margin-right: 40px;
    width: 400px;
}

.ListPager {
    display: block;
    text-align: center;
}

.ListPagerPages ul {
    list-style: none;
    margin: auto;
    padding: 0;
    height: 30px;
    display: block;
    text-align: center;
}

.ListPagerPages li {
    List-style: none;
    margin: 0 0 0 0;
    padding: 0 40px 0 0;
    font-size: 18px;
    display: inline-block;
}

.ListPagerPages li.Sel {
    font-weight: bold;
}

/* -------------------------------------------------- */
#Alert {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.4);
    z-index: 999999;
}
#AlertDiv {
    background:white;
    color: black;
    width: 300px;
    margin: 100px auto;
    padding: 20px;
    border-radius: 10px;
    border: 2px solid black;
    text-align: left;
    font-family: 'Courier new';
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.3);
}
#AlertTxt {
    font-size: 16px;
    white-space: pre-wrap;
    text-align:left;
}
#AlertBtn {
    text-align: center;
}

.JSLnk {
    cursor: pointer;
}

#PosDel {
    clear: both;
    margin: 20px auto 0 auto;
    width: 50%;
    border: 1px solid red;
    padding: 4px;
    background-color: #F0F0F0;
    color: black;
    font-size: 12px;
    text-align: center;
}

.NotepadImg {
    width: 35px;
    height: 32px;
}

#PosId {
    font-size: 14px;
    color: black;
    margin-top: 20px;
    margin-bottom: 0;
}

#QualityTitleDiv {
    margin-top: 20px;
    margin-bottom: -10px;
    color: black;
    font-size: 18px;
    font-weight: bold;
}

#QualityDiv {
    margin-top: 20px;
    margin-bottom: -10px;
    color: black;
}

#QualityDiv a {
    color: #CB80AD;
}

.PosInventoryTxt {
    margin: 10px 0 10px 0;
    font-size: 14px;
    color: Black;
    height: 30px;
}

#PosInventoryTxtColor {
    float: left;
    margin: 0 0 10px 0;
    font-size: 14px;
    color: Black;
}

#PosInventoryTxtColorTitle {
    float: left;
}

#PosInventoryTxtColorDescr {
    float: left;
    margin-left: 10px;
}

#SelSize {
    width: 200px;
    visibility: hidden;
}

#PosSize {
    margin-top: 20px;
}

.PosSizeRB {
    margin: 0;
    padding: 0;
}

.PosSizeRB input[type="radio"] {
    display: none;
    margin: 0;
    padding: 0;
}

.PosSizeRBLabelOn {
    width: 60px;
    height: 20px;
    border: 1px solid white;
    margin: 0;
    padding: 10px;
    font-size: 16px;
    display: inline-table;
    text-align: center;
    vertical-align: middle;
    border: 1px solid silver;
}

.PosSizeRBLabelOff {
    width: 60px;
    height: 20px;
    border: 1px solid white;
    margin: 0;
    padding: 10px;
    font-size: 16px;
    display: inline-table;
    text-align: center;
    vertical-align: middle;
    border: 1px solid silver;
    text-decoration: line-through;
    color: black;
    display: none;
}

.PosSizeRB label:hover {
    border: 1px solid black;
}

.PosSizeRB input:checked + label {
    background-color: black;
    color: white;
}

.PosSizeRB input:disabled + label {
    background-color: gray;
    color: silver;
}

#SelColor {
    visibility: hidden;
}

#PosColor {
}

.PosColorRB {
    width: 100%;
}

.PosColorRB input[type="radio"] {
    display: none;
    width: 0;
    padding: 0;
    margin: 0;
}

.PosColorRB label {
    width: 100px;
    height: 100px;
    border: 1px solid white;
    margin: 0;
    padding: 4px;
    font-size: 14px;
    display: inline-table;
    text-align: center;
    vertical-align: middle;
    background-repeat: no-repeat;
    background-position: 4px 4px;
    background-size: 100px 100px;
}

.PosColorRB label:hover {
    border: 1px solid black;
}

.PosColorRB input:checked + label {
    border: 2px solid black;
}

#PosQuantity {
    padding: 0;
    margin-bottom: 20px;
    display: none;
}

#PosQuantityTxt {
    font-size: 14px;
    font-weight: bold;
}

#PosQuantitySel {
    padding-left: 25px;
}

#InstagramImg {
    height: 21px;
}

#LangCB {
    padding: 0;
    height: 21px;
    font-size: 12px;
    background-color: var(--color-gray-light);
    border-color:  var(--color-gray);
}

label[for="LangCB"] {
    margin: 2px 0;
    padding: 0;
    font-size: 12px;
}

.Notepad {
    margin: auto;
    max-width: 700px;
    padding-top: 2rem;
}

.Notepad .image img {
    width: 100%;
    height: auto;
}

.Notepad-item {
    display: flex;
    border-bottom: 1px solid #d4d7de;
}
.Notepad-item {
    display: flex;
    justify-content: space-between;
}

.Notepad-item .image {
    width: 20%;
}
.Notepad-item .description {
    padding-left: 50px;
    font-size: 1rem;
    flex: auto;
}
.Notepad-item .description h2 {
    margin: 10px 0;
    padding: 0;
    font-weight: 700;
    color: black;
}

.Notepad-item .amount {
    font-size: 1rem;
}

/* ------------------------------------------------ */
#tooltip {
    position: fixed;
    padding: 6px 10px;
    background: rgba(0,0,0,0.8);
    color: #fff;
    border-radius: 4px;
    font-size: 13px;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.15s ease-out;
    z-index: 9999;
}

.BasketBtn {
    float: left;
    margin: 0;
    padding: 10px;
    font-size: 16px;
    font-weight: bold;
    background-color: black;
    display: block;
    width: 100%;
    text-align: center;
    color: white;
}

.BasketBtn:hover {
    background-color: #505050;
    cursor: pointer;
}

#PosBasketBtn:disabled {
    background-color: silver;
    color: gray;
    cursor: not-allowed;
}

#Clicks {
    border: none;
    color: black;
    font-size: 14px;
    text-align: center;
}

/*-----------------------------------------*/
#CashAddr {
    margin: 20px auto 20px auto;
    /*border: 2px solid black;*/
    width: 100%;
}
#CashAddrInfo {
    padding: 10px;
    margin: 0;
    width: 100%;
    /* border: 1px solid black;*/
}
#CashAddrInfo p {
    margin: 0;
    padding: 0;
}

#CashAddrInvoice {
    float: left;
    padding: 4px;
}

#CashAddrShipping {
    float: left;
    padding: 4px;
}

#CashAddrShippingSave {
    text-align: center;
}

#CashAddrShippingSaveBtn {
    background-color: black;
    border-radius: 10px;
    color: white;
    padding: 6px;
    margin-bottom: 10px;
}
#CashAddrShippingSaveBtn:hover {
    background-color: gray;
}

input[type="text"] {
    font-size: 20px;
}
input[type="text"]::selection {
    background-color: var(--color-pink);
    color: black;
}

input[type="password"] {
    font-size: 20px;
}
input[type="password"]::selection {
    background-color: var(--color-pink);
    color: black;
}

input[type="radio"] {
    accent-color: black;
}

/* ------------- */
.CashStep {
    margin-top: 20px;
    text-align: center;
}

.CashStep .CashStepBtn {
    padding: 10px 20px 10px 20px;
    font-size: 14px;
    font-weight: bold;
    background-color: black;
    text-align: center;
    color: white;
    border-radius: 10px;
}

.CashStep .CashStepBtn:hover {
    background-color: #505050;
    color: white;
}

.CashStep .CashStepBtn:disabled {
    background-color: #a0a0a0;
    color: silver;
    cursor: crosshair;
}

#CashDiv {
    border: 4px solid lime;
}

.CashShippingTab {
    margin: auto;
    margin-top: 10px;
    margin-bottom: 10px;
    border-collapse: collapse;
    font-size: 17px;
}

.CashShippingTab th {
    height: 20px !important;
    color: black;
    text-align: left;
}

.CashShippingTab td {
    padding: 4px;
    color: black;
}

.CashShippingTab input[type=text] {
    width: 200px;
    font-size: 17px;
}

.CashShippingTab select {
    width: 200px;
    font-size: 17px;
}

/* ------------------------------------------ */
.cash-item {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    padding: 10px;
}

.cash-item input[type="radio"] {
    margin-top: 0.3rem;
}

/*-----------------------------------------*/
.StdTab {
    border: 2px inset brown;
    font-size: 14px;
    min-width: 300px;
    margin-left: auto;
    margin-right: auto;
}

.StdTab th {
    background-color: #f0f0f0;
    border: 1px solid silver;
    padding: 4px;
    color: black;
}
.StdTab td {
    background-color: #fdfdfd;
    border: 1px solid silver;
    padding: 4px;
    color: DarkSlateGray;
}

.StdTab input[type=text] {
    width: 240px;
}

.StdTab select {
    width: 240px;
}

.Center {
    text-align: center;
}

.Justify {
    text-align: justify;
}

.Revoke {
    text-align: center;
}

.Revoke label {
    display: inline-block;
    width: 200px;
    background-color: #f0f0f0;
}

.Register {
    /*text-align: center;*/
}

.Register label {
    display: inline-block;
    width: 300px;
    background-color: #f0f0f0;
}

.Impressum {
}

.Impressum span {
    display: inline-block;
    width: 300px;
    background-color: #f0f0f0;
}

iframe {
    width: 900px;
    height: 600px;
}

/* ---------------------------------- */
.MyLogFileTab {
    border: 1px solid silver;
}

.MyLogFileTab th {
    padding: 2px 10px 2px 10px;
    background-color: #d0d0d0;
    text-align: left;
}

.MyLogFileTab td {
    padding: 2px 10px 2px 10px;
    background-color: #fafafa;
    text-align: left;
}

.MyLogFileTab .right {
    text-align: right;
}

#AdminTextArea {
    width: 100%;
    height: 400px;
    overflow: scroll;
    border: 1px solid black;
    white-space: nowrap;
}

#AdminLogGrep {
    width: 400px;
}

.AdminInput {
    width: 300px;
}

/*-----------------------------------------*/
.MyTabContainer {
    width: 100%;            /* oder eine feste Breite, z. B. 600px */
    overflow-x: auto;       /* horizontales Scrollen aktivieren */
    overflow-y: hidden;     /* kein vertikales Scrollen */
}

.MyTab {
    border: 2px inset brown;
    font-size: 14px;
    max-width: 700px;
}

.MyTab th {
    background-color: #F8D2DD;
    border: 1px solid silver;
    padding: 4px;
    color: black;
    text-align: left;
}
.MyTab td {
    background-color: white;
    border: 1px solid silver;
    padding: 4px;
    color: black;
}

.TablePic {
    margin: auto;
    height: 100px;
    border: none;
}

/* ==========================================================================
   Message Boxes
   ========================================================================== */

.OkDiv,
.MessageDiv,
.ErrorDiv {
    padding: 0.4rem;
    border-radius: 1rem;
    border: 2px solid;
    text-align: center;
    margin-bottom: 10px;
}

.OkDiv {
    background: #F1F8E9;
    border-color: var(--color-green);
}

.MessageDiv {
    background: #E3F2FD;
    border-color: #1E88E5;
}

.ErrorDiv {
    background: #FFEBEE;
    border-color: #F44336;
}

.OkDiv h2,
.MessageDiv h2,
.ErrorDiv h2 {
    font-weight: 100;
}

.OkDiv > h2:first-child,
.MessageDiv > h2:first-child,
.ErrorDiv > h2:first-child {
    margin-top: 0;
}

.WarnDiv {
    margin-top: 2rem;
    padding: 1rem;
    background: #FFEBEE;
    color: #D32F2F;
    border-radius: 1rem;
    font-size: .85rem;
    box-shadow: inset 0 1px 2px rgba(0,0,0,0.2);
}

.WarnDiv a {
    padding: .125rem .75rem;
    background: #D32F2F;
    color: var(--color-white);
    border-radius: .25rem;
    font-weight: 500;
    white-space: nowrap;
}

.WarnDiv a:hover {
    background: #F44336;
    text-decoration: none;
}

#MsgError {
    width: 70%;
    margin: auto;
    margin-top: 10px;
    margin-bottom: 10px;
    border: 1px solid Red;
    color: rgb(170, 0, 0);
    background-color: rgb(255, 220, 220);
    font-size: 14px;
    text-align: center;
    padding: 10px;
    display: block;
}

#MsgWarning {
    font-size: 0.95rem;
    text-align: center;
}

#MsgSuccess {
    width: 70%;
    margin: auto;
    margin-top: 10px;
    margin-bottom: 10px;
    border: 1px solid Navy;
    color: Navy;
    background-color: #d0ffd0;
    font-size: 14px;
    text-align: center;
    padding: 10px;
    display: block;
}

/* --------------------------------------------- */
.logo #Search {
    width: 230px;
    position: absolute;
    top: 40px;
    right: 1.5rem;
    display: flex;
    gap: .75rem;
}

#Search #AucNoInput {
    width: 20px;
    padding: 4px;
    font-size: 16px;
}

#Search #CatNoInput {
    width: 40px;
    padding: 4px;
    font-size: 16px;
    border: 1px solid #CB80AD;
}

#Search #SearchTerm {
    width: 200px;
}

#Search img {
    max-height: 20px;
    max-width: 20px;
    margin-top: 4px;
}           

/* --------------------------------------- */
.JSNoJSInfo {
    background: #ffe9e9;
    color: #900;
    padding: 15px;
    text-align: center;
    font-weight: bold;
    border-bottom: 2px solid #c00;
}

/* ================================================================================== */
/* Responsive Design */
/* ================================================================================== */

@media (min-width: 768px) {

    html, body {
        font-size: 16px;
    }

    .flex {
        display: flex;
    }
    .flex > div {
        flex: 1;
        padding: 1rem;
    }
    #MainMenu ul {
        flex-direction: row;
        justify-content: center;
    }

    #MainMenu ul li {
        flex: 1;
        text-align: center;
        margin: 0 .25rem 0 0;
    }

    #MainMenu > ul > li > a {
        display: block;
    }

    .ListGridCell {
        width: 50%;
        padding: 0 0 2rem 0;
    }

    .ListGridCell:nth-child(odd) {
        padding: 0 2rem 2rem 0;
    }

    .ListGridImg {
        flex: 0 1 auto;
        display: flex;
        overflow: hidden;
        align-items: flex-start;
        justify-content: center;
    }

    .ListGridImg a {
        display: flex;
        flex: 1 1 auto;
    }

    .ListGridImg a img {
        flex: 1 1 auto;
        height: 360px;
        width: auto !important;
        max-width: 100%;
        object-fit: contain;
    }

    .ListTabPos {
        flex-direction: row;
    }

    .ListTabPosImg {
        width: 25%;
        max-width: 250px;
    }

    footer {
        text-align: left;
    }

    .ContentSectionCards.two,
    .ContentSectionCards.three,
    .ContentSectionCards.four {
        flex-direction: row;
    }

    .ContentSectionCards.two .ContentCard {
        flex: 1 1 calc(50% - 2rem);
    }

    .ContentSectionCards.three .ContentCard {
        flex: 1 1 calc(50% - 2rem);
    }

    .ContentSectionCards.four .ContentCard {
        flex: 1 1 calc(50% - 2rem);
    }

    .ContentSectionCards .ContentCard {
        display: flex;
    }

    .ContentSectionCards .ContentCard .CardImage {
        width: 200px;
    }

    .ContentSectionCards .ContentCard .CardImage img {
        height: 100%;
        object-fit: cover;
    }

    .ContentSectionCards .ContentCard .CardBody {
        flex: 1;
    }

    .ContentSectionCards.gallery {
        flex-direction: row;
    }

    .ContentSectionCards.gallery .CardImage {
        width: 100%;
    }

    .ContactPersons {
        flex-direction: row;
        flex-wrap: wrap;
    }

    .ContactPersons > div {
        flex: 1 1 calc(50% - 1rem);
    }

    .HomeTileDiv .HomeTile {
        flex: 1 1 calc(50% - 1rem);
    }

    .TopResultsPos {
        flex-direction: row;
    }

    .TopResultsPosLeft {
        width: 300px;
    }

    .custom-slider .slide-content h1 {
        font-size: 2rem;
    }

    .custom-slider .slide-content p {
        font-size: 1rem;
    }
}

@media (max-width: 1024px) {

    .logo {
        height: 400px;
    }
  
    header .logo {
        text-align: center;
        margin-top: 1rem;
    }
  
    header .logo #TopLogo img {
        margin-top: 40px;
        width: 100%;
        max-width: 300px;
    }
  
    .logo #Search {
        top: 0;
        left: 0;
        margin: 360px 0 0 0;
        width: 100%;
        text-align: center;
        justify-content: center;
        align-items: center;
    }
  
    #MainMenu {
        margin-top: 10px;
        border-radius: 0;
        background-color: white;
    }
  
    #MainMenu ul {
        flex-direction: column;
    }
  
    #MainMenu li {
        padding: 2px;
        margin: 1px;
        background-color: black;
    }
  
    #MainMenu li li {
        padding: 2px;
        margin: 1px;
        background-color: var(--color-henrys);
    }
  
    #MainMenu > ul > li {
        display: flex;
    }
    #MainMenu > ul > li > a {
        flex: 1;
    }
  
    .MainMenuSubMenuToggle {
        display: inline;
    }
    .MainMenuSubMenuToggle.Hidden {
        display: inline;
        visibility: hidden;
    }
  
    #main-navigation {
        margin-top: 60px;
    }
   
    #HeaderTop {
        display: block;
        margin: 0;
        padding: 0;
    }
    #HeaderTopLeft {
        margin-top: 10px;
        margin-left: 70px;
        height: 30px;
        text-align: center;
    }
   
    #HeaderTopRight ul {
        margin: 0;
        padding: 0;
        padding-bottom: 10px;
    }
  
    .custom-slider .slide-content h1 {
        font-size: 1.5rem;
    }
 
    .custom-slider .slide-content h2 {
        font-size: 1.1rem;
    }
 
    .custom-slider .slide-background {
        opacity: 0.7 !important;
    }
 
    .custom-slider .slide-content {
        padding: 12px;
    }
 
    .custom-slider .pagination {
        bottom: 5px;
    }
  
    .MoreOffer {
      font-size: 1.2rem;
      text-align: center;
    }
  
    h1 {
     font-size: 1.5rem;
    }
  
    .MoreOfferProducts {
      flex-wrap: wrap;
    }
}

@media (max-width: 480px) {
  
    .MoreOfferProducts {
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        gap: 2rem;
        align-items: stretch;
    }
  
    .MoreOfferProducts .MoreOfferProduct {
        margin: 0 2.5%;
    }
    .MoreOfferProducts .MoreOfferProduct-image {
        height: 320px;
        text-align: center;
    }
    .MoreOfferProducts .MoreOfferProduct-image img {
        width: auto;
        max-width: 100%;
        height: 100%;
    }
}

/* ------------------------------------------ */
.shipping-item {
    gap: 1rem; 
    margin: 6px;
    margin-bottom: 20px;
    padding: 6px;
}

.shipping-item input[type="radio"] {
    margin-top: 0.3rem;
    transform: scale(1.4);
    margin-right: 12px;
}

.shipping-item:has(input[type="radio"]:checked) {
    background: #eeeeee;
    border-radius: 10px;
}

/* ------------------------------------------ */
.paymtype-items {
    display: grid;
    gap: 1rem; /* Abstand zwischen den payment-items */
}

.paytype-item {
    gap: 1rem; 
    margin: 6px;
    padding: 6px;
    margin-bottom: 20px;
}

.paytype-item input[type="radio"] {
    margin-top: 0.3rem;
    transform: scale(1.4);
    margin-right: 12px;
}

.paytype-item:has(input[type="radio"]:checked) {
    background: #eeeeee;
    border-radius: 10px;
}

/* ------------------------------------------ */
#PrintReturnDeliveriesTab {
   border: 2px inset brown;
   font-size: 14px;
   min-width: 300px;
}

#PrintReturnDeliveriesTab th {
    background-color: #f0f0f0;
    border: 1px solid silver;
    padding: 4px;
    color: black;
    text-align: left;
}

#PrintReturnDeliveriesTab td {
    background-color: #fdfdfd;
    border: 1px solid silver;
    padding: 4px;
    color: black;
}

.Clr {
    clear: both;
    visibility: hidden;
    height: 0;
}

.FiftyPercent {
    width: 50%;
}

.TxtDecoNone {
    text-decoration: none;
}

.DisplayNone {
    display: none;
}

.Right {
    text-align: right;
}

.Left {
    text-align: left;
}

.Center {
    text-align: center;
}

#CenterDiv {
    text-align: center;
}

.NoWrap {
    white-space: nowrap;
}

#paypal-button-container {
    margin: auto;
    width: 300px;
}

.ListTitle {
    position: absolute;
    top: 375px;
    width: 100%;
    margin: 0;
    padding: 0;
    font-size: 16px;
    font-weight: bold;
    color: black;
    text-align: center;
}

.ListTitle a {
    color: black;
}

.MyPanel {
}

#PosId {
    font-size: 14px;
    color: black;
    margin-top: 20px;
    margin-bottom: 0;
}

/* --------------------------------------------------- */
#ReturnDeliveriesBody {
    margin: 50px;
    font-family: Arial;
    color: Black;
}

#ReturnDeliveriesTitle {
    font-size: 14px;
    /* border: 1px solid black; */
    font-weight: bold;
}

#ReturnDeliveriesDiv {
}

#ReturnDeliveriesAddress {
    float: left;
    font-size: 12px;
    width: 600px;
    /*border: 1px solid black;  */
}

#ReturnDeliveriesNumbers {
    float: right;
    font-size: 12px;
    width: 300px;
    /*border: 1px solid black;  */
}

#ReturnDeliveriesTab {
    font-size: 12px;
}

#ReturnDeliveriesTab th {
    font-size: 12px;
    border: 1px solid gray;
    background-color: #fdfdfd;
}

#ReturnDeliveriesTab td {
    font-size: 12px;
    border: 1px solid silver;
    background-color: white;
}

.Info {
    margin: auto;
    width: 940px;
}

.CookiesBlocked {
    position: absolute;
    margin: auto auto;
    top: 0;
    left: 0px;
    width: 100%;
    color: black;
    padding: 0;
    margin: 0;
    z-index: 100;
    padding: 4px;
    display: block;
    background-color: red;
    font-size: 16px;
    border: 4px solid black;
}

.FontLarger {
    font-size: large;
}

#TermsDiv {
    margin-top: 20px;
    /* border: 1px solid black;*/
}

.MyInvoiceReturnDeliveries {
    font-size: 20px;
}
.MyInvoiceReturnDeliveries a {
    margin-right: 20px;
    padding: 10px;
    font-size: 14px;
    color: #FFB6C1;
    background-color: black;
    border-radius: 5px;
}

.MyInvoiceReturnDeliveries input[type="button"] {
    margin-right: 20px;
    padding: 10px;
    font-size: 14px;
    color: #FFB6C1;
    background-color: black;
    border-radius: 5px;
}

.MyInvoiceReturnDeliveries input[type="button"]:disabled {
    color: gray;
    background-color: silver;
}

.RegisterBtnDiv {
    text-align: center;
    padding-top: 20px;
}

RoundBtn {
    margin: 0;
    padding: 10px;
    font-size: 26px;
    font-weight: bold;
    background-color: black!important;
    display: block;
    text-align: center;
    color: white!important;
    border-radius: 10px;
}

.RoundBtn:hover {
    background-color: #505050!important;
    cursor: pointer;
    color: white;
}

.Justify {
    text-align: justify;
}

.StdSubmit {
    padding: 10px 20px 10px 20px;
    font-size: 14px;
    font-weight: bold;
    background-color: black;
    text-align: center;
    color: white;
    border-radius: 10px;
}

#PasswordLimits {
    font-size: 12px;
}

#RegisterCheckTab {
    margin-bottom: 20px;
    margin: auto;
    color: black;
}

#RegisterCheckTab th {
    padding: 4px;
    text-align: left;
    border: 1px solid black;
    background-color: #d0d0d0
}
#RegisterCheckTab td {
    padding: 4px;
    border: 1px solid black;
    background-color: #e0e0e0
}

.MrktText {
    background-color: yellow;
    color: black;
}