body {
    line-height: 1.5em;
}

a, a:visited, a:hover {
    color: #00bbe4;
}

/* normalize font-size */
html, body, #header, .button {
    font-size: 1.1rem !important;
    font-weight: normal !important;
}

h1 {}
h2 {font-size: 1.5rem;}
h3, h4, h5, h6 {
    font-size: 1rem;
}

h3:first-child, h2:first-child {margin-top:0px;}

ul li {margin-top:0px;}
.bg-gray {
    background-color: #f0f0f0 !important;
}

/* pagina layout */

/* altijd 1 rem padding links en rechts */

.container {
    padding-left: 0;
    padding-right: 0;
}

.modularpage .section, .modularpage .verzameling, .verzameling h2, section.section, .hero .container.grid-lg, .carousel-wrapper, .modularpage form, h2.form {
    padding-left:1rem;
    padding-right:1rem;
}

.modular-text {
    max-width: 40rem;
    margin-right: auto;
}

.container.grid-lg, section#start, section.container h1, section.container h2, section.container p {
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
}

.columns {
    margin: 0px;
}

/* mobiel menu */

.overlay {
    background: #FFF;
}

.treemenu li {
    background: rgba(255,255,255,0.5);
    margin: 0 ;
    color: #00bbe4;
}

.treemenu li a.active, .treemenu li a:focus, .treemenu li a:hover {
    color: #007792 !important;
}

/* body */

.header-fixed #body-wrapper {
    padding-top: 5rem;
}

section#start {
    margin-top:7rem;
}

.column {
    padding-right: 0px;
    padding-left: 0px;
}

/* secties naast elkaar */

.col2, .col3, .col4, .col1-2, .col2-1 {
    display: grid;
    grid-gap: 1rem;
    grid-template-columns: 1fr;
}

.locatie iframe, .col2 iframe {
    width: 100%;
}

@media (min-width:768px) {
    .col2-1 {grid-template-columns: 2fr 1fr;}
    .col1-2 {grid-template-columns: 1fr 2fr;}
    .col3 {grid-template-columns: 1fr 1fr 1fr;}
    .col4 {grid-template-columns: 1fr 1fr 1fr 1fr;}
    #locaties, .col2 {grid-template-columns: 1fr 1fr;}
}

/* gemarkeerde blokken met informatie */

section.accent {
    background-color: #EEE;
    padding: 1rem;
}

/* header */

.button-fm {
    background-color: #00bbe4;
    border-radius: 5px;
}

#header li.button-fm a:hover {
    color: #FFF !important;
}

#header .button a {
    padding: 0.3em 0.7em;
    color: #FFF;
    letter-spacing: 1px;
}

#header, #header .navbar-section {
    height: 5rem;
}

#header .logo img {
    height: 60px;
object-fit: scale-down;}

#header, #header .logo img, #header .logo svg, #header .navbar-section, .default-animation, .modular-features .feature-icon, .modular-features.small .feature-icon i {
    transition: none;
}

.dropmenu ul li a.active, 
.dropmenu ul li a:focus, 
.dropmenu ul li a:hover{
    color: #00bbe4 !important;
}

#header ul li li a.active, 
#header ul li li a:focus, 
#header ul li li a:hover {
    background-color: #00bbe4;
    color: #FFF !important;
}

#page-wrapper .mobile-menu .button_container span {
    background: #00bbe4 !important;
}

/* hero - pagina afbeelding onder header */ 

section.hero {
    padding: 10rem 0;
    top: 5rem;
    height:10rem;
}

.hero .container.grid-lg {
    text-align: left;
    background-color: rgba(000, 000, 000, 0.2);
    max-width: none;
    padding-top: 4rem;
    padding-bottom: 4rem;
}

.hero, .hero h1, .hero h2 {
    color: #FFF;
    margin: 0px;
}

.hero p {
    font-style: italic; 
    letter-spacing: 1px;
    font-family: serif;
    font-size: 1.5em
}

.modular-hero #to-start {
    display:none;
}

/* Kolommen layout in contentpagina - modularpage*/

@media (min-width:768px){
    section#start .modularpage {
        display: grid;
        grid-template-columns: 2fr 1fr;
        column-gap: 10px;
    }
}

.modular-side, .modular-text {
    padding: 0px;
}

/* modular pagina zonder kolommen en home */

body.wide .modular-text {
    max-width: none;
    margin-right: 0;
}

body.wide section#start .modularpage, .home .modularpage {
    grid-template-columns: 1fr !important; 
}

/* home pagina */

/* hero met slogan en buttons */

.home .hero h1 {
    font-size: 2rem;
}
.home .hero h2 {
    font-size:1.3rem;
    font-style: italic;
    font-weight: normal;
    letter-spacing: 1px;
}

.home .hero .button {
    margin-top: 2rem;
    font-style: normal;
    font-family: sans-serif;
}

/* home - verzameling specialisaties en beweegprogrammas */

.home .verzameling {
    display: grid;
    margin-bottom: 2rem;
}

.home h2.verzameling {
    margin-bottom: 2rem;
    text-align: center;
}

.home .item h3 {
    color: #00bbe4;
    margin-bottom: 0.2rem;
}

.home .item a {
    color: inherit;
}

.home .item a:hover {
    text-decoration: none;
}
/* features - kernkwaliteiten */

.modular-features.small .column .feature-icon i, 
.modular-features.small .column .feature-icon h6, .modular-features.small .column:hover .feature-icon i {
    color:#00bbe4;
}

.modular-features .feature-icon h6 {background: none;}

.modular-features .feature-content {
    color: inherit;
}

.modular-features .frame-box {
    padding: 0px;
    background-color: #f0f0f0;
}

.col-3 {
    width: 100%;
}

@media (min-width:768px){
    .modular-features .frame-box .columns {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr;    }
}

.verzameling section {
    margin-bottom:2rem;
}

.verzameling section .item {
    padding-top:0.5em;
    border-top: 1px solid #EEE;
}

.verzameling section .item:hover {
    border-top: 1px solid #00bbe4;
}
.verzameling p {
    margin: 0rem;
}

.home section.specialisaties section.title {
    background-image: url("../images/specialisaties.jpg");
    background-position: center; /* Center the image */
    background-repeat: no-repeat; /* Do not repeat the image */
    background-size: cover; /* Resize the background image to cover the entire container */
}

.title h2 {
    text-align: center;
    left: 50%;
    color: #FFF;
    background-color: rgba(000, 000, 000, 0.2);
    padding: 1em 0;
}

/* iframe praktijkvideo */
.iframe {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding-top: 56.25%; /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */
    margin-bottom: 2rem;
}

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

/* Overzichtspagina's */

.collection section#start {
    display: block;
}

.collection section.modular-text {
    max-width: none;
}

#verzameling {
    display: grid;
    grid-gap: 1rem;
    grid-template-columns: 1fr;
}

@media (min-width:400px){
    #verzameling {
        grid-template-columns: 1fr 1fr;
    }
}

@media (min-width:900px){
    #verzameling {
        grid-template-columns: 1fr 1fr 1fr;
    }
}

@media (min-width:1050px){
    #verzameling {
        grid-template-columns: 1fr 1fr 1fr 1fr;
    }
}

#verzameling h2 {
    font-size: 1.2em;
    color: #00bbe4;
    margin: 0.5em 0;
    text-decoration: none;
}

#verzameling div a p {
    color: #50596c;
}

body .modular-text #verzameling div a:hover p {
    text-decoration:none;
    color:red;
}

/* overview pagina */

.blog-listing .card {
    box-shadow: none !important;
    margin:0px;
    text-align: left;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.1), 0 10px 10px 0 rgba(0, 0, 0, 0.1);
}

.blog-listing .card:hover {
    background-color: #EFEFEF;
}

.blog-listing .card-image:hover {
    opacity: 0.8;
}

.card .card-body, .card .card-footer, .card .card-header {
    padding: 0px;
}

.card .card-image img {
    width: 100%;
}

.card .card-body:last-child, .card .card-footer:last-child, .card .card-header:last-child {
    padding: 0px;
}
/* footer */

#footer {
    padding: 1rem;
    margin-top:1rem;
}

#footer section {
    display: grid;
    grid-template-columns: 1fr;
    text-align: left;
    grid-gap: 1rem;
}

#footer section.kwaliteitspartner {
    text-align: center;
    display:none;
}

@media (min-width:600px){
    #footer section {
        grid-template-columns: 1fr 1fr;
    }
}

@media (min-width:900px){
    #footer section {
        grid-template-columns: 1fr 1fr 1fr;
    }
    #footer section.kwaliteitspartner {
        display:block;
    }
}

#footer section section {
    display:block;
    padding: 1rem; 
    background-color: #DEDEDE;
}

#footer section img {
    max-height: 200px;
}

#footer h3, #footer h4, #footer li {
    font-weight: normal;
    margin: 0px;
}


#footer li, #footer h4, #footer a, #footer a:hover, #footer a:visited {
    color: #454d5d;
}

#footer h3, #footer h4 {
    font-weight: bold;
    font-size: 1rem;
}

#footer h3 {
    margin-bottom: 0.8rem;
    color: #00bbe4;
}

#footer section ul {
    margin: 0 0 0.8rem 0;
}

#footer section ul li {
    list-style-type: none;
    margin: 0px;
}

#footer ul li img {
    width: 20px;
    margin-right: 10px;
    vertical-align: middle;
}

#footer ul li a {
    display: inline-block;
    vertical-align: middle;
}

/* buttons */

.button, .button:hover,  .button:visited {
    color: #FFF;
    text-decoration: none;
    background-color: #00bbe4;
    border: none;
    border-radius: 5px;
    padding: 10px 40px 10px 20px;
    height: auto;
    letter-spacing: 2px;
    font-weight: 500;
    background-image: url(../images/icons/right-arrow-white.svg);
    background-repeat: no-repeat;
    background-position: right 10px bottom 50%;
    background-size: 1rem;
    margin-right: 20px;
}

.button:hover {
    background-color: #007792;
}

.button p, .button h3 {
    margin:0px;
    color: #FFF;
    font-size:0.8rem;
}
/* Nieuws - overzicht */

.card-body h1 {
    font-size: 1rem !important;
    margin: 0;
}

/* Tabel in de text */

.modular-text table {
    table-layout: fixed;
    width: 100%;
    border-collapse:collapse;
}

.modular-text td, .modular-text th {
    padding: 5px 10px;
    border: 1px solid #BBB;
}

.modular-text th {
    background-color:#00bbe4;
    color:#FFF;
}

.modular-text td:empty {
    background-color: #DDD;
}

/* zonder teveel opmaak */
.clean  {padding: 1rem; background-color: #EEE;}
.clean th {background-color: initial; color: #50596c;text-align: left;font-weight: normal;border:none;padding:0px;}
.clean td {border:none;padding: 0px;text-align: right;}
.accent p:last-child {margin:0px;}

/* Carousel op homepagina */

.carousel-wrapper {
    height: 650px;
    width: 260px;
    position: relative;
    overflow: hidden;
    margin: 0 auto;
}

.carousel-wrapper h2 {
    text-align: center;
}

@media (min-width:650px) {
.carousel-wrapper {
    width: 540px;
}
}

@media (min-width:850px) {
.carousel-wrapper {
    width: 820px;
}
}

@media (min-width:1100px) {
.carousel-wrapper {
    width: 1100px;
}
}

.carousel {
  margin: 0;
  padding: 0;
  list-style: none;
  width: 100%;
  display: flex;
  position: absolute;
  left: 0;
  transition: all 1s ease;
}

.carousel-item {
  background: black;
  min-width: 260px;
  height: 200px;
  margin-right: 20px;
  display: inline-block;
}

.carousel img {
    max-width: none;
    width: 260px;
}

.carousel .card-title h2, .carousel p, .carousel li {
    margin: 0px !important;
    text-align: left;
    font-size: 1em;
}

.carousel .card-description {
    padding: 1rem;
}

.carousel ul {
    list-style-position: inside;
    margin-left: 0;
}

.carousel a:hover {
    text-decoration: none;
}
