/*! tailwindcss v3.1.8 | MIT License | https://tailwindcss.com*/

*, :after, :before {
    border: 0 solid #e5e7eb;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

:after, :before {
    --tw-content: ""
}

html {
    -webkit-text-size-adjust: 100%;
    font-family: ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;
    line-height: 1.5;
    -moz-tab-size: 4;
    -o-tab-size: 4;
    tab-size: 4
}

body {
    line-height: inherit;
    margin: 0
}

hr {
    border-top-width: 1px;
    color: inherit;
    height: 0
}

abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted
}

h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit
}

a {
    color: inherit;
    text-decoration: inherit
}

b, strong {
    font-weight: bolder
}

code, kbd, pre, samp {
    font-family: ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;
    font-size: 1em
}

small {
    font-size: 80%
}

sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

table {
    border-collapse: collapse;
    border-color: inherit;
    text-indent: 0
}

button, input, optgroup, select, textarea {
    color: inherit;
    font-family: inherit;
    font-size: 100%;
    font-weight: inherit;
    line-height: inherit;
    margin: 0;
    padding: 0
}

button, select {
    text-transform: none
}

[type=button], [type=reset], [type=submit], button {
    -webkit-appearance: button;
    background-color: transparent;
    background-image: none
}

:-moz-focusring {
    outline: auto
}

:-moz-ui-invalid {
    box-shadow: none
}

progress {
    vertical-align: baseline
}

::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
    height: auto
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

summary {
    display: list-item
}

blockquote, dd, dl, figure, h1, h2, h3, h4, h5, h6, hr, p, pre {
    margin: 0
}

fieldset {
    margin: 0
}

fieldset, legend {
    padding: 0
}

menu, ol, ul {
    list-style: none;
    margin: 0;
    padding: 0
}

textarea {
    resize: vertical
}

    input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
        color: #9ca3af;
        opacity: 1
    }

    input::-moz-placeholder, textarea::-moz-placeholder {
        color: #9ca3af;
        opacity: 1
    }

    input:-ms-input-placeholder, textarea:-ms-input-placeholder {
        color: #9ca3af;
        opacity: 1
    }

    input::-ms-input-placeholder, textarea::-ms-input-placeholder {
        color: #9ca3af;
        opacity: 1
    }

    input::placeholder, textarea::placeholder {
        color: #9ca3af;
        opacity: 1
    }

[role=button], button {
    cursor: pointer
}

:disabled {
    cursor: default
}

audio, canvas, embed, iframe, img, object, svg, video {
    display: block;
    vertical-align: middle
}

img, video {
    height: auto;
    max-width: 100%
}

.container {
    margin-left: auto;
    margin-right: auto;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    width: 100%
}

@media (min-width:640px) {
    .container {
        max-width: 640px
    }
}

@media (min-width:768px) {
    .container {
        max-width: 768px
    }
}

@media (min-width:1024px) {
    .container {
        max-width: 1024px
    }
}

@media (min-width:1280px) {
    .container {
        max-width: 1280px
    }
}

@media (min-width:1536px) {
    .container {
        max-width: 1536px
    }
}

.relative {
    position: relative
}

.col-span-2 {
    -ms-grid-column-span: 2;
    grid-column: span 2/span 2
}

.m-auto {
    margin: auto
}

.mb-3 {
    margin-bottom: .75rem
}

.mb-5 {
    margin-bottom: 1.25rem
}

.mb-10 {
    margin-bottom: 2.5rem
}

.mb-8 {
    margin-bottom: 2rem
}

.block {
    display: block
}

.inline-block {
    display: inline-block
}

.table {
    display: table
}

.grid {
    display: -ms-grid;
    display: grid
}

.hidden {
    display: none
}

.h-full {
    height: 100%
}

.border-collapse {
    border-collapse: collapse
}

.list-disc {
    list-style-type: disc
}

.gap-5 {
    gap: 1.25rem
}

.overflow-hidden {
    overflow: hidden
}

.overflow-y-auto {
    overflow-y: auto
}

.border {
    border-width: 1px
}

.p-5 {
    padding: 1.25rem
}

.py-5 {
    padding-bottom: 1.25rem;
    padding-top: 1.25rem
}

.pl-4 {
    padding-left: 1rem
}

.pt-10 {
    padding-top: 2.5rem
}

.text-center {
    text-align: center
}

.text-xl {
    font-size: 1.25rem;
    line-height: 1.75rem
}

.text-xs {
    font-size: .75rem;
    line-height: 1rem
}

.text-3xl {
    font-size: 1.875rem;
    line-height: 2.25rem
}

.text-8xl {
    font-size: 6rem;
    line-height: 1
}

.text-2xl {
    font-size: 1.5rem;
    line-height: 2rem
}

.font-bold {
    font-weight: 700
}

.uppercase {
    text-transform: uppercase
}

.text-white {
    color: #fff
}

.text-black {
    color: #000
}

.outline {
    outline-style: solid
}

body {
    color: #666;
    font-size: 14px;
    line-height: 1.4rem;
    min-width: 320px
}

p {
    margin-bottom: .75rem
}

a {
    color: #3aaea9
}

    a:hover {
        text-decoration: underline
    }

.p-col {
    padding-bottom: 5rem;
    padding-top: 5rem
}

.c-default {
    color: #3aaea9
}

.btn {
    background: #3aaea9;
    border-radius: 2px;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    padding: 10px 30px;
    text-decoration: none !important
}

    .btn:hover {
        opacity: .8
    }

.button_back {
    background: #666;
    border-radius: 2px;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    padding: 6px 20px;
    text-decoration: none !important
}

    .button_back:hover {
        opacity: .8
    }

#page-container {
    min-height: 100vh;
    position: relative
}

#content-wrap {
    padding-bottom: 63px
}

#header {
    background-color: #3aaea9;
    background-image: url(/images/cebin/header_afbeelding_2100x447.png);
    background-position: 50%;
    background-size: cover;
    height: 120px;
    overflow: hidden;
    position: relative
}

    #header, #header .header-back {
        background-repeat: no-repeat;
        width: 100%
    }

        #header .header-back {
            background-image: url(/images/cebin/header-back.svg);
            background-position: 0 100%;
            background-size: 500px;
            bottom: 0;
            display: block;
            height: 100%;
            left: 0;
            position: absolute
        }

@media (min-width:1024px) {
    #header .header-back {
        background-size: auto 140px
    }
}

#header .header-back-filler {
    background: #fff;
    bottom: 0;
    height: 100px;
    left: -100%;
    margin-left: 5px;
    position: absolute;
    width: 100%
}

@media (min-width:1024px) {
    #header .header-back-filler {
        height: 140px
    }
}

#header .logo {
    bottom: 0;
    height: 60px;
    position: absolute;
    z-index: 2
}

@media (min-width:1024px) {
    #header .logo {
        height: 80px
    }

    #header {
        height: 300px
    }
}

#footer {
    bottom: 0;
    height: 63px;
    position: absolute;
    width: 100%
}

.formField {
    margin-bottom: 10px
}

    .formField .password, .formField .text, .formField select {
        background: #fff;
        border: 1px solid #ccc;
        padding: 10px;
        width: 100%
    }

    .formField .radio-input {
        margin-right: 10px
    }

        .formField .radio-input label {
            margin-left: 5px
        }

    .formField .form-error {
        border-color: red
    }

.error_message {
    background-color: #fffaf0;
    border-color: #ed8936;
    border-left-width: 4px;
    border-radius: 4px;
    color: #ed8936;
    margin-bottom: 1rem;
    padding: 1rem
}

    .error_message a {
        color: #ed8936;
        text-decoration: underline
    }

        .error_message a:hover {
            text-decoration: none
        }

#sidebar {
    background: transparent;
    display: block;
    height: 100vh;
    max-width: 630px;
    position: fixed;
    right: calc(-100% + 30px);
    top: 0;
    -webkit-transition: right .5s ease-in-out;
    transition: right .5s ease-in-out;
    width: 100%;
    z-index: 999
}

@media (min-width:640px) {
    #sidebar {
        right: -600px;
        width: 630px
    }
}

#sidebar .sidebar-container {
    background: #fff;
    -webkit-box-shadow: 0 50px 50px rgba(0,0,0,.35);
    box-shadow: 0 50px 50px rgba(0,0,0,.35);
    height: 100vh;
    margin-left: 30px
}

#sidebar .sidebar-btn {
    background: #3aaea9;
    border-bottom-left-radius: 3px;
    border-top-left-radius: 3px;
    content: "";
    display: block;
    font-weight: 700;
    height: 66px;
    left: 0;
    margin-top: -33px;
    position: absolute;
    top: 50vh;
    width: 30px;
	font-family:Font Awesome 6 Free;
	font-weight:900;	
}

    #sidebar .sidebar-btn:after {
        color: #fff;
        content: "\f104";
        display: block
    }

#sidebar.open {
    right: 0
}

    #sidebar.open .sidebar-btn:after {
        content: "\f105"
    }

.links-list li {
    margin-bottom: .5rem
}

    .links-list li a {
        color: #000;
        text-decoration: underline
    }

        .links-list li a:hover {
            text-decoration: none
        }

@media (min-width:640px) {
    .sm\:grid-cols-3 {
        -ms-grid-columns: (minmax(0,1fr))[3];
        grid-template-columns: repeat(3,minmax(0,1fr))
    }
}

@media (min-width:1024px) {
    .lg\:flex {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

    .lg\:max-w-sm {
        max-width: 24rem
    }

    .lg\:grid-cols-2 {
        -ms-grid-columns: (minmax(0,1fr))[2];
        grid-template-columns: repeat(2,minmax(0,1fr))
    }

    .lg\:grid-cols-3 {
        -ms-grid-columns: (minmax(0,1fr))[3];
        grid-template-columns: repeat(3,minmax(0,1fr))
    }

    .lg\:border-l {
        border-left-width: 1px
    }

    .lg\:py-5 {
        padding-bottom: 1.25rem;
        padding-top: 1.25rem
    }

    .lg\:px-10 {
        padding-left: 2.5rem
    }

    .lg\:pr-10, .lg\:px-10 {
        padding-right: 2.5rem
    }

    .lg\:pl-10 {
        padding-left: 2.5rem
    }
}