/** -- Begin of listWithImages ------------------------------------------------------------------------------------- **/

/** -- Begin of listWithImages specific --------------------------------------------------------------------------- **/
/** -- End of listWithImages --------------------------------------------------------------------------------------- **/

/** -- Begin of products2 ------------------------------------------------------------------------------------------ **/
#products2 ul {
    gap: 20px;
}

#products2 li {
    min-width: calc(50% - 10px);
    max-width: calc(50% - 10px);
}

/** -- Begin of products2 specific -------------------------------------------------------------------------------- **/
/** -- End of products2 -------------------------------------------------------------------------------------------- **/

/** -- Begin of textWithImageOnLeft -------------------------------------------------------------------------------- **/
#textWithImageOnLeft .row > div {
    flex-direction: row;
    column-gap: 30px;
}

#textWithImageOnLeftDivText {
    padding-bottom: 0;
}
/** -- End of textWithImageOnLeft ---------------------------------------------------------------------------------- **/

/** -- Begin of bootstrap ------------------------------------------------------------------------------------------ **/
/** ---- Header ---------------------------------------------------------------------------------------------------- **/
#toggleHamburger {
    display: none;
}

header nav {
    display: block;
    max-height: revert;
    width: fit-content;
    position: revert;
    top: revert;
    right: revert;
}

header li,
header li:last-child {
    display: inline-block;
    border: none;
}

/** ---- footer ---------------------------------------------------------------------------------------------------- **/
footer ul.topLevel {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-around;
    align-items: flex-start;
}

footer ul.topLevel > li,
footer ul.topLevel > li > div,
footer ul.secondLevel {
    width: fit-content;
}
/** -- End of bootstrap -------------------------------------------------------------------------------------------- **/

/** -- Begin of textWithImageOnRight ------------------------------------------------------------------------------- **/
#textWithImageOnRight .row > div {
    flex-direction: row;
    column-gap: 30px;
}

#textWithImageOnRightDivText {
    padding-bottom: 0;
}
/** -- End of textWithImageOnRight --------------------------------------------------------------------------------- **/

#toggleHamburger {
    display: inline;
}

header nav {
    max-height: 0;
    width: 100vw;
    position: absolute;
    top: 85px;
    right: 0;
}

header li,
header li:last-child {
    display: block;
    border-top: 1px solid var(--color-primary-light);
}

footer ul.secondLevel {
    width: 100%;
}