﻿/* Start Apeldoorn.css */

/* #region Font */

@font-face {
    font-family: "interstate";
    src: url("https://use.typekit.net/af/20ad3a/00000000000000003b9ae7f7/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3") format("woff2"), url("https://use.typekit.net/af/20ad3a/00000000000000003b9ae7f7/27/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3") format("woff"), url("https://use.typekit.net/af/20ad3a/00000000000000003b9ae7f7/27/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n5&v=3") format("opentype");
    font-display: auto;
    font-style: normal;
    font-weight: 500;
    font-stretch: normal;
}

/* #endregion Font*/

/* #region Root */

:root {
    --font-family: "interstate", sans-serif;
    --text-color: #5a5a5a;
    --h1-color: #007836;
    --h2-color: #007836;
    --h3-color: #007836;
    --h4-color: #007836;
    --h5-color: #007836;
    --link-color: #007836;
    --link-hover-color: #007836;
    --link-icon-color: #000;
    --button-text-color: #FFF;
    --button-font-weight: normal;
    --button-background-color: #EB5E17;
    --button-hover-background-color: #EB5E17;
    --button-outline-color: #EB5E17;
    --button-disabled-background-color: #EB5E17;
    --window-title-background-color: #EB5E17;
    --loader-animation-color: #EB5E17;
    --slider-track-background-color: #EB5E17;
    --slider-track-tracker-color: #EB5E17;
    --radio-button-color: #EB5E17;
    --menu-text-color: #EB5E17;
    --menu-background-color: #FFF;
    --footer-text-color: #FFF;
}

/* #endregion Root */

body {
    color: var(--text-color);
    background: #FFF;
}

    body,
    body * {
        font-family: var(--font-family);
    }

        body h1 {
            color: var(--h1-color);
            font-weight: normal;
        }

        body h2 {
            color: var(--h2-color);
            font-weight: normal;
        }

        body h3 {
            color: var(--h3-color);
            font-weight: normal;
        }

        body h4 {
            color: var(--h4-color);
            font-weight: normal;
        }

        body h5 {
            color: var(--h5-color);
            font-weight: normal;
        }

        body a,
        body a:link,
        body a:active,
        body a:hover,
        body a:focus {
            color: var(--link-color);
        }

            body a:hover,
            body a:active {
                color: var(--link-hover-color);
            }

            /* #region znControls override */

            /* #region znLink */

            body a.znLink,
            body a.znLink:link,
            body a.znLink:visited,
            body a.znLink:hover {
                color: var(--link-color);
            }

                body a.znLink:hover,
                body a.znLink:active {
                    color: var(--link-hover-color);
                }

                body a.znLink span.znLinkText {
                    font-weight: normal;
                }

                body a.znLink.znLinkIconOnly,
                body a.znLink.znLinkIconOnly:link,
                body a.znLink.znLinkIconOnly:visited,
                body a.znLink.znLinkIconOnly:hover {
                    color: var(--link-icon-color);
                }

        /* #endregion znLink */

        /* #region znButton */

        body .znButtonWrapper .znButton,
        body .znButtonWrapper .znButton:hover,
        body .znButtonWrapper .znButton:active,
        body .znButtonWrapper .znButton:focus {
            color: var(--button-text-color);
            background: var(--button-background-color);
        }

            body .znButtonWrapper .znButton:focus-visible {
                background: var(--button-background-color);
                outline: 2px dotted var(--button-outline-color);
            }

            body .znButtonWrapper .znButton:hover,
            body .znButtonWrapper .znButton:active {
                background: var(--button-hover-background-color);
                outline: 2px solid var(--button-outline-color);
            }

            body .znButtonWrapper .znButton.znDisabled:hover,
            body .znButtonWrapper .znButton.znDisabled:active {
                background: var(--button-disabled-background-color);
            }

            body .znButtonWrapper .znButton .znButtonText {
                font-weight: var(--button-font-weight);
            }

        /* #endregion znButton */

        /* #region znLinkButton */

        body .znButtonWrapper .znLinkButton,
        body .znButtonWrapper .znLinkButton:hover,
        body .znButtonWrapper .znLinkButton:active,
        body .znButtonWrapper .znLinkButton:focus {
            color: var(--link-color);
        }

            body .znButtonWrapper .znLinkButton:focus-visible {
                color: var(--link-hover-color);
                outline: 2px dotted;
                background: transparent;
            }

            body .znButtonWrapper .znLinkButton:hover,
            body .znButtonWrapper .znLinkButton:active {
                color: var(--link-hover-color);
                outline: 0px none;
                background: transparent;
            }

            body .znButtonWrapper .znLinkButton .znButtonText {
                font-weight: normal;
            }

        /* #endregion znLinkButton */

        /* #region znFileUpload */

        body .znFileUpload input::file-selector-button {
            color: var(--button-text-color);
            background: var(--button-background-color);
            font-family: var(--font-family);
            font-weight: var(--button-font-weight);
        }

            body .znFileUpload input::file-selector-button:focus-visible {
                background: var(--button-background-color);
                outline: 2px dotted var(--button-outline-color);
            }

            body .znFileUpload input::file-selector-button:hover,
            body .znFileUpload input::file-selector-button:active,
            body .znFileUpload input::file-selector-button:focus {
                background: var(--button-hover-background-color);
                outline: 2px solid var(--button-outline-color);
            }

        body .znFileUpload.znDisabled input::file-selector-button,
        body .znFileUpload.znDisabled input::file-selector-button:hover,
        body .znFileUpload.znDisabled input::file-selector-button:active,
        body .znFileUpload.znDisabled input::file-selector-button:focus {
            background: var(--button-disabled-background-color);
        }

        /* #endregion znFileUpload */

        /* #region znWindow */

        body .znWindowWrapper .znWindow .znWindowTitle {
            background: var(--window-title-background-color);
        }

        /* #endregion znWindow*/

        /* #region znLoader */

        body .znLoaderWrapper .znLoader .znLoaderAnimation {
            border-top-color: var(--loader-animation-color);
        }

        /* #endregion znLoader */

        /* #region znSlider */

        body .znSliderWrapper .znSlider .znSliderTrackWrapper .znSliderTracker {
            background: var(--slider-track-background-color);
        }

            body .znSliderWrapper .znSlider .znSliderTrackWrapper .znSliderTracker a {
                background: var(--slider-track-tracker-color);
                outline: 1px solid var(--slider-track-tracker-color);
            }

                body .znSliderWrapper .znSlider .znSliderTrackWrapper .znSliderTracker a:hover,
                body .znSliderWrapper .znSlider .znSliderTrackWrapper .znSliderTracker a:focus,
                body .znSliderWrapper .znSlider .znSliderTrackWrapper .znSliderTracker a:active {
                    box-shadow: 0px 0px 2px var(--slider-track-tracker-color);
                }

                body .znSliderWrapper .znSlider .znSliderTrackWrapper .znSliderTracker a:focus-visible {
                    outline: 2px solid var(--slider-track-tracker-color);
                }

        /* #endregion znSlider */

        /* #region znRadioButtonList*/
        /*body .znRadioButtonList .znRadioButtonListItem .znRadioButtonWrapper .znRadioButton[zn-checked="true"] .znIcon {
            color: var(--radio-button-color);
        }*/
        /* #endregion znRadioButtonList*/

        /* #endregion znControls override */

        /* #region Container */

        body .container {
        }

            /* #region Header */

            body .container .header {
            }

                body .container .header .headerinner .logo {
                    margin-top: 0px;
                }

            /* #endregion Header */

            /* #region Menu */

            body .container .menu {
                background: var(--menu-background-color);
            }

                body .container .menu .menuinner .hoofdmenu div.znMenu ul.znMenuItems li.znMenuItem a.znMenuLink {
                    color: var(--menu-text-color);
                    width: 120px;
                    border-radius: 10px;
                    border: 1px solid #e3e3e3;
                    padding: 10px;
                }

            /* #endregion Menu */

            /* #region Content */

            body .container .content {
                background: #FFF;
            }

                body .container .content .contentinner {
                    box-shadow: none;
                    padding: 20px 20px 5px 20px;
                    margin-bottom: 0px;
                    min-height: 40vh;
                }

                    /* #region Breadcrumb */

                    body .container .content .contentinner .breadcrumb {
                    }

            /* #endregion Breadcrumb*/

            /* #endregion Content*/

            /* #region Footer */

            body .container .footer {
                min-height: 550px;
                color: var(--footer-text-color);
                background: url('../images/apeldoorn-footer.svg') no-repeat center top/cover;
                padding: 0px;
                display: flex;
                align-items: flex-end;
            }

                body .container .footer .footerinner ul.footerlinks,
                body .container .footer .footerinner ul.footerrechts {
                    margin-bottom: 20px;
                }

                    body .container .footer .footerinner ul.footerrechts li a.znLink .znLinkIcon {
                        background: transparent;
                        color: var(--footer-text-color);
                        padding: 4px 0;
                    }

                        body .container .footer .footerinner ul.footerrechts li a.znLink .znLinkIcon:before {
                            font-size: 1.875rem; /*30px*/
                        }

                    body .container .footer .footerinner ul.footerrechts li a.znLink:hover .znLinkIcon {
                        outline: 0px none;
                        background: transparent;
                    }

                        body .container .footer .footerinner ul.footerrechts li a.znLink:hover .znLinkIcon:before {
                            font-size: 2rem; /* 32px */
                        }

                body .container .footer .footerinner ul li a:hover,
                body .container .footer .footerinner ul li a:active {
                    outline: 0px none;
                }

/* #endregion Footer */

/* #endregion Container */

/* #region Responsive */

@media(max-width: 1600px) {
    body .container .footer {
        min-height: 410px;
    }
}

@media(max-width: 1280px) {
    body .container .footer {
        min-height: 330px;
    }
}

@media(max-width: 960px) {
    body .container .footer {
        min-height: 310px;
    }
}

@media(max-width: 850px) {
    body div.znMenu ul.znMenuItems li.znMenuItem a.znMenuLink {
        width: 100%;
    }
}



@media(max-width: 768px) {
    body .container .footer {
        min-height: 270px;
    }
}

@media(max-width: 750px) {
    body .container .menu {
        background: #EB5E17;
    }

    body div.znMenu ul.znMenuItems li.znMenuItem a.znMenuLink {
        color: #FFF;
        width: auto;
        border-radius: 0px;
        border: 0px none;
    }
}

@media(max-width: 500px) {
    body .container .footer .footerinner ul.footerlinks {
        margin-top: 100px;
    }
}

/* #endregion Responsive */

/* Eind Apeldoorn.css */
