div.topcontainer {
    width: 100%;
    clear: both;
}

    div.topcontainer.TOP-BORDER {
        border-top: 1px solid var(--IP_LightGray);
    }

div.IP-Content-Box{
    padding-top: calc(3.25rem * var(--T_ZOOM))
}

    div.IP-Content-Box.MeineAngebote {
        padding-top: calc(0.3rem * var(--T_ZOOM));
    }

    div.IP-Content-Box.MeineBookmarks {
        padding-top: calc(0.3rem * var(--T_ZOOM));
    }




.IP_BG_DETAIL_BOX {
    background-color: var(--IP_BG_DETAIL_BOX);
}

.IP_BG_DETAIL_BOX_LIGHT {
    background-color: var(--IP_BG_DETAIL_BOX_LIGHT);
}


/*#region STICKY_ROW {*/

div.IP_STICKY_ROW {
    background-color: var(--IP_STICKY_ROW_BG);
}

div.IP_STICKY_ROW_WITH_BORDER {
    background-color: var(--IP_STICKY_ROW_BG);
    box-shadow: var(--IP_STICKY_ROW_SHADOW);
    border-bottom: var(--IP_STICKY_ROW_BORDER_BOTTOM);
}



/*#endregion STICKY_ROW }*/

div.IP_HOVER_BOX {
    background-color: var(--IP_HOVER_BOX_BG);
    border: var(--IP_HOVER_BOX_BORDER);
    transition: background-color 0.9s ease-out;
}

    div.IP_HOVER_BOX:hover {
        background-color: var(--IP_HOVER_BOX_BG_hover); /*Standardbox */
        border: var(--IP_HOVER_BOX_BORDER_hover);
        transition: background-color 0.5s ease-out;
        box-shadow: var(--IP_HOVER_BOX_SHADOW_hover);
    }


div.IP_TOPCONTAINER_BG_BLACK {
    background-color: var(--IP_Control_Black);
}

div.IP_TOPCONTAINER_BG1 {
    background-color: var(--IP_TOPCONTAINER_BG1);
}

div.IP_TOPCONTAINER_BG2 {
    background-color: var(--IP_TOPCONTAINER_BG2);
}

div.IP_TOPCONTAINER_BG3 {
    background-color: var(--IP_TOPCONTAINER_BG3);
}


div.Section-Separator-1 {
    height: calc(0.2rem * var(--T_ZOOM));
    margin-bottom: 2rem;
    margin-top: 3rem;
    margin-left: 0rem;
    margin-right: 0rem;
    background-image: linear-gradient(to right, var(--IP_White) 0%, var(--IP_Control_Black_Focus) 15%, var(--IP_Black25) 85%, var(--IP_White) 100%);
}

div.Section-Separator-2 {
    height: calc(0.2rem * var(--T_ZOOM));
    margin-bottom: 2rem;
    margin-top: 1rem;
    margin-left: 0rem;
    margin-right: 0rem;
    background-image: linear-gradient(to right, var(--IP_White) 0%, var(--IP_Control_Black_Focus) 15%, var(--IP_Black25) 85%, var(--IP_White) 100%);
}

    div.Section-Separator-2.AG-Box {
        height: calc(0.2rem * var(--T_ZOOM));
        margin-bottom: 2rem;
        margin-top: 0rem;
        margin-left: -2rem;
        margin-right: -2rem;
        background-image: linear-gradient(to right, var(--IP_White) 0%, var(--IP_Control_Black_Focus) 30%, var(--IP_Black25) 85%, var(--IP_White) 100%);
    }

@media (min-width: 769px) {
        div.Section-Separator-2.AG-Box {
            height: calc(0.2rem * var(--T_ZOOM));
            margin-bottom: 2rem;
            margin-top: 0rem;
            margin-left: -2rem;
            margin-right: -2rem;
            background-image: linear-gradient(to right, var(--IP_Control_Black_Focus) 0%, var(--IP_Black25) 85%, var(--IP_White) 100%);
        }
}

@media (min-width: calc(1025px + 10rem)) {
    div.Section-Separator-1 {
        margin-bottom: 3rem;
        margin-top: 4rem;
        margin-left: -5rem;
        margin-right: -5rem;
        background-image: linear-gradient(to right, var(--IP_White) 0%, var(--IP_Control_Black_Focus) 30%, var(--IP_Black25) 70%, var(--IP_White) 100%);
    }

    div.Section-Separator-2 {
        height: 2px;
        margin-bottom: 3rem;
        margin-top: 1rem;
        margin-left: -5rem;
        margin-right: -5rem;
        background-image: linear-gradient(to right, var(--IP_White) 0%, var(--IP_Control_Black_Focus) 30%, var(--IP_Black25) 70%, var(--IP_White) 100%);
    }


}





div.Side-Box-Top {
    height: 2px;
    margin-bottom: calc(1rem * var(--T_ZOOM));
    margin-top: 0rem;
    margin-left: calc(-1.5rem * var(--T_ZOOM));
    margin-right: 0rem;
    background-image: linear-gradient(to right, var(--IP_Blue) 0%, var(--IP_Blue) 15%, var(--IP_Blue) 40%, var(--IP_White) 100%);
}

@media (min-width: 1280px) {
    div.Side-Box-Top {
        display:none;
        visibility:hidden;
    }
}



div.IP-FIXED-BUTTON-CONTAINER {
    position: fixed;
    bottom: 0px;
    z-index: 5001;
    background-color: var(--IP_FIXED_BUTTON_CONTAINER_BG);
    box-shadow: 0px -15px 25px white;
}


div.IP-STIKY-BUTTON-CONTAINER {
    position: sticky;
    bottom: 0px;
    z-index: 5001;
    background-color: var(--IP_FIXED_BUTTON_CONTAINER_BG);
    box-shadow: 0px -15px 25px white;
}

    div.IP-STIKY-BUTTON-CONTAINER.BG_Body {
        background-color: var(--IP_Body);
    }

    div.IP-STIKY-BUTTON-CONTAINER.BG_Transparent {
        background-color: transparent;
    }



.IP-Row {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    gap: 0px;
    padding-top: 0;
    padding-bottom: 0;


}

    .IP-Row.RowFadeOut {
        overflow: hidden; /* Hide the element content, while height = 0 */
        height: 0px;
        opacity: 0;
        transition: height 1200ms 0ms ease-out, opacity 1200ms 0ms ease-in;
    }



    .IP-Row.RowFadeIn {
        display: flex;
        opacity: 1;
        transition: height 1200ms 0ms ease-in, opacity 1200ms 300ms ease-in;
    }



.IP-Button-Row {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
    gap: 2rem;
    padding-top: 3rem;
    padding-bottom: 3rem;
}



    .IP-Button-Row.Fixed-Bottom {
        justify-content: flex-end;
        padding-top: calc(1.5rem * var(--T_ZOOM));
        padding-bottom: calc(1.5rem * var(--T_ZOOM));
    }

    .IP-Button-Row.Right {
        justify-content: flex-end;
    }

    .IP-Button-Row.Left {
        justify-content: flex-start;
    }

input.SizedField[type=number] {
    width: auto;
}

.IP-SEARCH-FIELD {
    border: 3px solid var(--IP_DarkGray);
    border-radius: 0;
    box-shadow: 1px 0px 4px 1px var(--IP_White) !important;
}

    .IP-SEARCH-FIELD:focus,
    .IP-SEARCH-FIELD:focus-visible {
        /*box-shadow: none;*/
        outline: 0px;
        border-color: var(--IP_Control_Black_Focus);
        /*box-shadow: 0 0 3px 0.2rem #9f9a9b85;*/
    }


@media (min-width: 426px) {
    .IP-SEARCH-FIELD {
        border: 4px solid var(--IP_DarkGray);
    }
}




/*#region ERROR {*/

    .IP-Error-Row {
    margin: 0px;
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    background-color: var(--IP_Error_BG);
    color: var(--IP_Error_TXT);
    font-weight: bold;
    font-size: var(--IP_XS);
    border-left: 1rem solid var(--IP_Error_TXT);
}

.Err-Label { /*unter Forms-Elementen z.B. Textboxen*/
    padding-left: 7px;
    padding-right: 5px;
    margin-top: 2px;
    margin-left: 2px;
    font-size: var(--IP_S);
    display: none;
    color: var(--IP_Error_TXT);
    background-color: var(--IP_Error_BG);
    width: calc(100% - 4px);
    max-width: 100%;
    border-left: 0.5rem solid var(--IP_Error_TXT);
}


/*#endregion ERROR }*/



/*#region ROW COL {*/

.IP-Col {
    width: 100%;
    display: block;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}



@media (min-width: 769px) {
    .IP-Row {
        flex-direction: row;
        gap: 4rem;
        align-items: flex-start;
    }

    .IP-Col {
        padding-top: 0.75rem;
        padding-bottom: 0.75rem;
    }

    .IP-Col-2 {
        width: 50%;
    }

    .IP-Col-3 {
        width: 33.333333333%;
    }


}


@media (min-width: 1921px) {

    .IP-Row {
        gap: 5rem;
    }



    .IP-Col {
        padding-top: 1.0rem;
        padding-bottom: 1.0rem;
    }


}



@media (min-width: 3073px) {

    .IP-Row {
        gap: 6rem;
    }

}

/*#endregion ROW COL }*/


/*#region AUTOFILL {*/

.IP-AutoFill {
    margin: 0px !important;
    background-color: var(--IP_White);
    border: var(--IP_Control_Black_Focus);
    border-width: 1px;
    border-style: solid;
    overflow: auto;
    height: 20rem;
    text-align: left;
    list-style: none;
    padding-left: 0px;
    font-size: var(--IP_L)
}

.IP-AutoFill_ListItem {
    background-color: none;
    color: var(--IP_Control_Black);
    padding: 0.1rem;
    padding-left: 1rem;
}

.IP-AutoFill_HighlightedListItem {
    background-color: var(--IP_Black10);
    /*color: var(--IP_White);*/
    padding: 0.1rem;
    padding-left: 1rem;
}

/*#endregion AUTOFILL }*/


/*#region BUTTONS {*/

.IP-button-pay {
    color: white;
    background-color: var(--IP_Red);
    border-color: #c74f67;
}

    .IP-button-pay:hover,
    .IP-button-pay:focus {
        background-color: #b70404;
        border-color: #b70404;
    }


.IP-BUTTON-RED {
    color: white;
    background-color: var(--IP_Red);
    border-color: #c74f67;
}

    .IP-BUTTON-RED:hover,
    .IP-BUTTON-RED:focus,
    .IP-BUTTON-RED:focus-visible,
    .IP-BUTTON-RED:active,
    .IP-BUTTON-RED:active:hover,
    .IP-BUTTON-RED:active:focus {
        background-color: #f50535;
        border-color: #db0303;
    }

        .IP-BUTTON-RED:focus,
        .IP-BUTTON-RED:active:hover,
        .IP-BUTTON-RED:focus-visible,
        .IP-BUTTON-RED:active:focus {
            box-shadow: 0 0 3px 0.2rem #c7193985;
        }

    .IP-BUTTON-RED:focus-visible {
        outline-color: transparent;
    }


.SEARCH-BTN {
    font-size: var(--IP_L);
    background-image: url(/Contentpages/Bilder/search_glass.svg);
    background-position-x: 1rem;
    background-position-y: center;
    background-repeat: no-repeat;
    padding-left: calc(4.5rem * var(--T_ZOOM));
    background-size: calc(3.2rem * var(--T_ZOOM));
}

.SEARCH-BTN:active {
    background-image: url(/Contentpages/Bilder/search_glass.svg);
}

/*#endregion BUTTONS }*/