/*
Theme Name: Amedi Theme
Author: Toeps
Author URI: http://toepsmedia.nl/
Description: MOOI HE.
Version: 1.0.0
Text Domain: ameditheme
*/

@import url('https://fonts.googleapis.com/css2?family=Muli:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap');

/* TAGS */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, td, tr, th, td {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}

html {
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}

a {
    color: #393F50;
    text-decoration: none;
}

a:visited {
}

a:hover {
}

.content-area a:hover {
    color: #393F50;
}

a:active {
}

p {
    margin-top: 10px;
    margin-bottom: 10px;
    overflow:visible;
}

ul:last-child {
    margin-bottom: 0px;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

img, figure {
    padding: 0px;
    margin: 0px;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Muli', sans-serif;
    font-weight: bold;
    hyphens: none;
}

h1, h2 {
    font-size: 50px;
    margin-top: 50px;
}

h3 {
    margin-top: 20px;
}

em {
    font-style: italic;
}

b, strong {
    font-weight: 700;
}

ul {
    list-style-type: none;
    list-style-position: inside;
    -webkit-margin-before: 0px;
    -webkit-margin-after: 0px;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    -webkit-padding-start: 0px;
    padding: 0px;
}

.blog-post-content ul li::before {
    content: "•";
    position: absolute;
    left: 0;
}

.blog-post-content ul li {
    padding-left: 20px;
    position: relative;
}

ol {
  list-style: none;
  counter-reset: my-awesome-counter;
  padding-left: 25px;
    margin-bottom: 20px;
}
ol li {
  margin: 0;
  counter-increment: my-awesome-counter;
  position: relative;
}
ol li::before {
  content: counter(my-awesome-counter) ".";
  font-weight: 600;
  position: absolute;
    left: -25px;
    font-size: 12px;
    margin-top: 2px;
}

blockquote {
    margin-left: 20px;
    margin-right: 20px;
    font-size: 15px;
    position: relative;
    z-index: 1;
    quotes: "“" "”";
}

blockquote::before {
    content: open-quote;
    position: absolute;
    left: -13px;
    top: 27px;
    line-height: 0;
    font-size: 100px;
    color: #D9E9EE;
    z-index: -1;
}

input {
    padding: 5px;
    margin: 0px 8px 0 0!important;
}

button, .button, .search-filter-reset {
    border: none;
    border-radius: 6px;
    padding: 7px 10px 9px;
    font-family: 'Muli', sans-serif;
    background-color: #393F50;
    color: inherit;
    font-size: 16px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    line-height: normal;
}

button a, .button a, .buttons a, .jeshitpost a.button, a.button, .buttons a:hover, a.search-filter-reset, a.search-filter-reset:hover, .site-header .nav-menu .doneerbutton a {
    color: #fff;
}

button:hover, .button:hover {
    background-color:#D8DFDC;
}

button a:hover {
    color: #FFF!important;
}

button i {
    font-size: 13px;
    vertical-align: middle;
}

.doneerbutton.button {
    line-height: normal;
}

hr {
    border-top: 2px dashed #D8DFDC;
    border-bottom: 0;
    border-left: 0;
    border-radius: 0;
}

/* SITE */

body {
    margin: 0px;
    padding: 0px;
    width: 100%;
    height: 100%;
    min-height: 100vh;
    overflow-y: auto;
    overflow-x: hidden;
    display: flex;
    justify-content: center;
    font-family: 'Muli', sans-serif;
    font-size: 16px;
    font-smooth: antialiased;
    -webkit-font-smoothing: antialiased;
    font-weight: 400;
    line-height: 1.7;
    color: #393F50;
    background-color: #E4EAE7;
    background-attachment: fixed;
    overscroll-behavior: none;
}

.site {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: inherit;
}

.site-main {
    flex: 1;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 2;
}

.main-content {
    width: 100%;
    flex-grow: 1;
}

/* HEADER & MENU */

.headerlogo {
    z-index: 99999;
    padding-right: 15px;
    width: 200px;
}

.site-header {
    height: auto;
    width: 100%;
    display: flex; 
    justify-content: flex-start;
    padding: 0 26px;
    z-index: 1001;
    overflow: hidden;
    background-color: white;
}

.site-header.red {
}

.site-header a {
    display: block;
    text-decoration: none;
    color: inherit;
}

.headerwrapper {
    width: 100%;
    display: flex; 
    justify-content: space-between;
    align-items: center;
}

.sticky_header {
    position: -webkit-sticky;
    position: sticky;
    top: 0px;
    transform: translateY(0);
    transition: transform .5s ease;
}

.sticky_header-hidden {
    transform: translateY(-100%);
    transition: transform .5s ease;
}

.header-main {
    width: 100%;
    font-size: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.mobilemenu {
    display: none;
}

.toggle-nav {
    display: none;
}

.primary-navigation {
    display: flex;
    font-weight: 500;
    line-height: normal;
}

.primary-navigation ul {
    display: flex;
    align-items: center;
    margin-bottom: 0px;
}

.primary-navigation li {
    line-height: 100px;
    margin: 0 15px;
}

.nav-menu, .footer-menu {
    list-style-type: none!important;
    list-style-position: outside!important;
}

.site-header .nav-menu a {
    color: #454449;
    font-size: 16px;
}


.site-header .nav-menu a:hover {
}

.site-header .current-menu-item a, .site-header .current_page_parent a {
    font-weight: 700;
}

.menu-item-has-children .sub-menu {
    display: none;
    position: absolute;
    background-color: #FFF;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-left: -10px;
}

.menu-item-has-children a::after {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f0d7";
    font-size: 10px;
    line-height: 0;
    margin-left: 4px; 
    margin-right: -11px;
}

.menu-item-has-children .sub-menu a:after {
    content: "";
    margin-right: 0px;
}

.menu-item-has-children .sub-menu li {
    padding: 0px;
    margin-bottom: 0px;
    border-bottom: none;
}

.menu-item-has-children .sub-menu li a {
    line-height: 30px;
}

.menu-item-has-children:hover > .sub-menu {
    display: block;
}

/* CONTENT */

.content-area {
    padding: 0 50px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-bottom: 50px;
}

.site-content {
    max-width: 100%;
}

.blogarea {
    width: 950px;
    max-width: 100%;
}

/* SLIDER */

.slidercontainer {
    overflow: hidden;
    padding: 40px 20px 0;
    width: 100%;
    max-width: 1280px;
    height: auto;
    margin: 20px 0;
}

.slider {
    width: 100%;
}

.slick-prev, .slick-next {
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: 50%;
    transform: translate(0, -50%);
    z-index: 9999;
    margin: 0 10px;
    cursor: pointer;
    background: transparent!important;
    border: none!important;
}

.slick-prev {
    left: 0px;
}

.slick-next {
    right: 0px;
}

.slick-prev:before,
.slick-next:before {
    font-weight: 600;
    font-size: 20px;
    line-height: 1;
    opacity: 1!important;
    color: white!important;  
}

.slick-prev:before {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f359";
}

.slick-next:before {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f35a";
}

.babyslide .tekstvak {
    padding: 15px 20px;
    font-size: 14px;
    width: 400px;
    max-width: 100%;
    background-color: white;
    position: absolute;
    bottom: 25px;
    right: 25px;
    border-radius: 10px;
}

.babyslide .sliderbuttoncontainer {
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    margin-top: 10px;
}

.babyslide .sliderbuttoncontainer .button a:hover {
    color: #fff;
}

.achtergrondafbeelding_tekst_rechts {
    width: 100%;
    padding-top: 56.25%;
    position: relative;
    text-align: left;
    overflow: hidden;
    background-size: cover;
    border-radius: 10px;
}

.achtergrondafbeelding_tekst_rechts .rechts {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    margin-left: 0px;
}

.slidemob {
    display: none;
}

/* SINGLE */

.blog-page, .blog-post {
    max-width: 100%;
    margin: 0px auto;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.blog-post-boven {
    width: 570px;
    max-width: 100%;
    margin: 20px 13px;
    display: flex;
    align-items: center;
    flex-direction: column;
}

.blog-post-titelenmeta {
    margin-bottom: 0px;
}

.page-post-title, .blog-post-title {
    text-align: center;
    line-height: 1.2;
}


.tekstblok p, .tekst p {
    margin-bottom: 20px;
    margin-top: 20px;
    word-break: break-word;
}

.tekstblok a, .tekst a, .onderschrift a {
    color: #4167AD;
    border-bottom: 1px solid #4167AD;
    font-weight: 600;
}

.tekstblok a:hover, .tekst a:hover, .onderschrift a:hover {
    color: #39BA87;
    border-bottom: 1px solid #39BA87;
}

.koptekst h3 {
    margin-top: 7px;
    margin-bottom: 7px;
    font-size: 20px;
}

.tussenkop {
    margin-bottom: 5px;
}

.tekstblok, .archivedesc {
    width: 570px;
    max-width: 100%;
    margin: 20px;
}

.tekstblok.wit {
    width: 600px;
    max-width: 100%;
    padding: 25px 25px;
    background-color: white;
    border-radius: 13px;
}

.bodytekst p:first-child, .tekst_en_foto .tekst .inhoud p:first-child {
    margin-top: 0px;
}

.bodytekst p:last-child, .tekst_en_foto .tekst .inhoud p:last-child {
    margin-bottom: 0px;
}

.tekst_en_foto {
    display: flex;
    justify-content: center;
    margin: 0px auto;
    max-width: 100%;
}

.tekst_en_foto.rechts {
    flex-direction: row-reverse;
}

.fotoscontainer {
    margin: 0px auto;
    display: flex;
    align-items: baseline;
}

.fotoscontainer .foto {
    margin: 20px;
}

.tekst_en_foto .tekst {
    width: 464px;
    max-width: 100%;
    margin: 20px;
    height: 100%;
    background-color: white;
    padding: 15px 25px 25px;
    border-radius: 13px;
}

.tekst_en_foto .foto {
    width: 300px;
    max-width: 100%;
    margin: 20px;
    height: 100%;
}

.tekst_en_foto .foto img {
    border-radius: 13px;
}

.onderschrift {
    font-size: 13px;
    line-height: 1.5;
    padding: 7px 10px;
    background-color: #fff;
}

.videotitel {
    text-align: center;
}

.videocontainer {
    width: 790px;
    max-width: 100%;
    margin: 25px auto;
    overflow: hidden;
}

.filmpie {
    width: 100%;
    padding-top: 56.25%;
    position: relative;
    text-align: center;
    overflow: hidden;
}

.filmpie iframe {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    margin-left: 0px;
}

.buttons {
    display: flex;
    justify-content: center;
    align-items: center;
}

.buttons .button {
    margin: 20px 10px;
}

.buttons .downloadbutton:after {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f56d";
    font-size: 11px;
    margin-left: 7px;
}

.morebuttoncontainer {
    margin: 0px 20px 20px;
}

.morebuttoncontainer .button {
    background-color: #D8DFDC;
}

.morebuttoncontainer .button:hover {
    background-color: #393F50;
}

.morebuttoncontainer .button a {
    color: #393F50;
}

.morebuttoncontainer .button:hover > a {
    color: #FFF;
}

.screen-reader-text {
    display: none;
}

.post-navigation {
    width: 950px;
    max-width: 100%;
    margin-top: 75px;
}

.nav-previous, .nav-next {
    margin: 13px;
    display: inline-block;
    padding: 3px 10px;
    flex-basis: 48%;
    flex-grow: 2;
    flex-shrink: 0;
    height: 100%;
}

.nav-previous a, .nav-next a {
    color: inherit;
}

.nav-links {
    display: flex;
    justify-content: space-between;
}

.nav-previous .fas {
    margin-right: 5px;
    font-size: 12px;
}

.nav-next {
    padding-left: 10px;
    text-align: end;
}

.nav-next .fas {
    margin-left: 5px;
    font-size: 12px;
}

.nav-previous {
    padding-right: 10px;
}

.blog_related {
    width: 950px;
    max-width: 100%;
}

.blog_related .titeltje {
    text-align: center;
    margin-bottom: -20px;
}

.loginveld {
    background-color: white;
    padding: 20px 25px;
}

/* BLOGBLOK */

.uitgelichtcontainer {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: 20px auto 20px;
    width: 1280px;
    max-width: 100%;
    padding: 0;
}

.ms-container {
    width: 950px;
    max-width: 100%;
    padding: 0;
    margin: 20px auto;
}

.ms-item {
    width: calc(calc(100% / 2) - 40px);
    margin: 20px;
    line-height: 1.5;
    word-wrap: break-word;
    display: flex;
    flex-direction: column;
}

.uitgelichtcontainer .ms-item {
    width: calc(calc(100% / 3) - 40px);
}

.uitgelichtcontainer .ms-item .blokcontent {
    flex-grow: 1;
}

.jeshitpost {
    padding-top: 15px;
    padding-right: 20px;
    padding-bottom: 15px;
    padding-left: 25px;
    max-width: 600px;
    background-color: #fff;
    border-radius: 13px;
    display: flex;
    flex-direction: column;
}

.uitgelichtcontainer .jeshitpost {
    height: 100%;
}

.jeshitpost .blogpostboven {
    display: flex;
    justify-content: space-between;
}

.jeshitpost a {
    color: inherit;
}

.jeshitpost .blogpostboven {
    display: flex;
    justify-content: space-between;
}

.jeshitpost .post-title {
    margin: 10px 0px 0px;
    font-size: 21px;
    line-height: 1.2;
}

.jeshitpost .buttoncontainer {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 5px;
    margin-top: 20px;
}

.postcat {
    font-size: 11px;
    margin-top: 5px;
    margin-bottom: 10px;
}

.postcat a {
    color: inherit;
}

/* PAGINATION */

.pagination {
    display: flex;
    justify-content: center;
    margin: 13px;
}

.wp-pagenavi a {
    color: #39BA87!important;
}

.wp-pagenavi a:hover {
    color: #4167AD!important;
}

.wp-pagenavi span {
    border-radius: 3px;
}

.wp-pagenavi a, .wp-pagenavi span {
    border: none!important;
    background-color: white!important;
    padding: 4px 6px!important;
}

.wp-pagenavi a:hover, .wp-pagenavi span.current {
    border: none!important;
}

/* FOOTER */

.site-footer {
    width: 100%;
    position: relative;
    background-color: #D8DFDC;
}

.footeronder {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-end;
    padding: 40px 50px 50px;
}

.footercredentials, .footeronder .socialmediaknoppies, .footer-menu {
    text-align: right;
    display: flex;
    flex-direction: column;
}

.footeronder .socialmediaknoppies, .footer-menu {
    margin: 10px 0;
}

.footercredentials a, .footeronder .socialmediaknoppies a, .footer-menu a {
    color: inherit;
}
.footercredentials a:hover, .footeronder .socialmediaknoppies a:hover, .footer-menu a:hover {
color: #39BA87;
}


@media only screen and (max-width: 1115px) {
    .page-template-page-homepage .site-main, .single .site-main {
        overflow-x: hidden;
    }
    
    h1, h2, h3 {
        hyphens: auto;
        word-break: break-word;
    }

    .mobilemenu {
        display: flex;
        justify-content: space-between;
        z-index: 2;
        align-self: stretch;
    }

    .headerlogomob img {
        height: 50px;
        width: auto;
    }

    .toggle-nav {
        display: block;
        font-size: 30px;
        line-height: 50px;
        padding-top: 0px;
        width: 50px;
        height: auto;
        text-align: center;
    }

    .primary-navigation {
        margin: 0px auto 50px auto;
        flex-direction: column;
    }
    
    .nav-menu {
        align-items: center;
        flex-direction: column;
    }

    .site-header .nav-menu a {
        font-size: 24px;
        line-height: 1.7;
    }

    .site-header {
        flex-direction: column;
        padding: 10px;
        align-items: center;
        justify-content: flex-start;
    }
    
    .site-header.active {
        background-color: inherit;
    }
    
    .sticky_header-hidden.active {
        transform: translateY(0);
      }

      .header-main {
        display: none;
    }

    .header-main.active {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;
        z-index: 2;
        height: 100vh;
    }

    .headerlogo {
        display: none;
    }
    
    .primary-navigation li {
        text-align: center;
        margin: 15px;
    }

     /* CONTENT */

     .content-area {
        padding: 0;
    }

    .blog-page, .blog-post-nieuw {
        margin-top: 0px;
    }

    /* HOMEPAGE */

    .achtergrondafbeelding_tekst_rechts.desktop {
        display: none;
    }

    .slidercontainer {
        padding: 20px;
        margin: 0;
    }

    .slidemob {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .babyslide .tekstvak {
        position: relative;
        bottom: 0;
        right: 0;
        margin: 20px 0;
        width: 500px;
        font-size: 16px;
    }

    .uitgelichtcontainer .ms-item {
        width: calc(100% - 40px);
        margin: 10px 20px;
        align-items: center;
    }

    .tekstblok, .archivedesc {
        padding: 0 20px;
    }

}