/*
Theme Name: Theodoor Kampen
Template: typisch22
Author: Comceptum
Author URI: http://comceptum.nl
Version: 1.0
License: GNU General Public License
License URI: licence/GPL.txt
Version: 1.0.0
*/

@font-face {
    font-family: 'Vogun Med';
    src: url('fonts/Vogun-Medium.eot');
    src: url('fonts/Vogun-Medium.eot?#iefix') format('embedded-opentype'),
        url('fonts/Vogun-Medium.woff2') format('woff2'),
        url('fonts/Vogun-Medium.woff') format('woff'),
        url('fonts/Vogun-Medium.ttf') format('truetype'),
        url('fonts/Vogun-Medium.svg#Vogun-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Satoshi';
    src: url('fonts/Satoshi-Bold.eot');
    src: url('fonts/Satoshi-Bold.eot?#iefix') format('embedded-opentype'),
        url('fonts/Satoshi-Bold.woff2') format('woff2'),
        url('fonts/Satoshi-Bold.woff') format('woff'),
        url('fonts/Satoshi-Bold.ttf') format('truetype'),
        url('fonts/Satoshi-Bold.svg#Satoshi-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Satoshi';
    src: url('fonts/Satoshi-Light.eot');
    src: url('fonts/Satoshi-Light.eot?#iefix') format('embedded-opentype'),
        url('fonts/Satoshi-Light.woff2') format('woff2'),
        url('fonts/Satoshi-Light.woff') format('woff'),
        url('fonts/Satoshi-Light.ttf') format('truetype'),
        url('fonts/Satoshi-Light.svg#Satoshi-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Satoshi';
    src: url('fonts/Satoshi-Medium.eot');
    src: url('fonts/Satoshi-Medium.eot?#iefix') format('embedded-opentype'),
        url('fonts/Satoshi-Medium.woff2') format('woff2'),
        url('fonts/Satoshi-Medium.woff') format('woff'),
        url('fonts/Satoshi-Medium.ttf') format('truetype'),
        url('fonts/Satoshi-Medium.svg#Satoshi-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Satoshi';
    src: url('fonts/Satoshi-Regular.eot');
    src: url('fonts/Satoshi-Regular.eot?#iefix') format('embedded-opentype'),
        url('fonts/Satoshi-Regular.woff2') format('woff2'),
        url('fonts/Satoshi-Regular.woff') format('woff'),
        url('fonts/Satoshi-Regular.ttf') format('truetype'),
        url('fonts/Satoshi-Regular.svg#Satoshi-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gyst';
    src: url('fonts/Gyst-Bold.ttf');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}


h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    font-family: 'Gyst';
    font-weight: bold;
    text-transform: inherit;
}
h3, .h3{
    color: var(--color2);
}

body {
    font-family: 'Satoshi';
}

.btn {
    font-family: 'Gyst';
    color: var(--color3);
    overflow: visible;
    border-radius: 0;
    padding: 17.5px;
    margin-left: 7px;
}
.btn + .btn{
    margin-left: 0px;
}
/* .btn:not(.btn--simple):after{
    content: '';
    font-family: 'Font Awesome 6 Pro Solid';
} */
.btn:not(.btn--simple)::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    border-radius: 0;
    width: 7px;

    aspect-ratio: unset;
    background-color: var(--color2);

    -webkit-mask: url('images/button-before.svg') no-repeat center / contain;
    mask: url('images/button-before.svg') no-repeat center / contain;

    transform: translateX(-100%);
}
.btn:not(.btn--simple)::after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    border-radius: 0;
    width: 7px;

    aspect-ratio: unset;
    background-color: var(--color2);

    -webkit-mask: url('images/button-after.svg') no-repeat center / contain;
    mask: url('images/button-after.svg') no-repeat center / contain;

    left: auto;
    right: 0;
    transform: translateX(100%);
}.btn:not(.btn--simple):hover::after {
right: 0;
}
.btn.btn--outline {
    background: var(--color3);
    color: var(--color2);
    box-shadow: none;
}
.btn.btn--outline::after, .btn.btn--outline::before {
background-color: var(--color3);
}
article.article .article-sidebar{
    border-radius: 0;
}
article.article .article-sidebar ul{
    padding-left: 0px;
}
article.article .article-sidebar ul li {
list-style: none;
}
article.article .article-sidebar ul li:before {
content: '+';
color: var(--color2);
margin-right: 10px;
font-weight: bold;
}
article.article .article-sidebar::before {
    content: url('images/sidebar-before.svg');
    position: absolute;
    left: 0;
    right: 0;
    bottom: calc(100% - 1px);
    display: block;
    line-height: 0;
}
article.article .article-sidebar::after{
    content: url('images/sidebar-after.svg');
    position: absolute;
    top: calc(100% - 1px);
    left: 0;
    right: 0;
    bottom: 0;
    display: block;
    
}

section.header h1 i,
section.header h1 em {
    color: var(--color3);
    font-size: 75px;
}
section.header .header-content{
    text-shadow: 0px 0px 17px #000000;
}
article.article .article-sidebar {
color: black;
}
article.article:not([data-background="color1"]):not([data-background="color2"]) p{
    color: black;
}
article.article.article--background[data-background="color2"] em{
color: var(--color1);
}
article.article.article--background[data-background="color2"] :is(h1,h2,h3,h4,h5,h6){
    color: var(--color3);
}
article.article.article--background[data-background="color2"] ul:not(.specs) li:before {
color: var(--color1);
font-weight: bold;
}
article.article.article--background:not([data-background="color3"]):not(:has(.article-content--background)){
   color: white;
}
article.article.article--background[data-background="color2"]:not(:has(.article-content--background)) .btn{
background-color: var(--color1);
}
article.article.article--background[data-background="color2"]:not(:has(.article-content--background)) .btn::before, article.article.article--background[data-background="color2"]:not(:has(.article-content--background)) .btn::after{
background-color: var(--color1);
}

section.cards .card-image__label[data-status="Verkocht onder voorbehoud"]{
background: red;
color: var(--color3);

}
section.cards .card-image__label[data-status="Beschikbaar"]{
background: green;
color: var(--color3);

}
section.cards .card-image__label[data-status="Onder optie"]{
background: yellow;
color: var(--color2);

}

section.cards#woningtypes .container-lg .cards-header .btn{
    background-color: var(--color1);
    color: var(--color3);
}
section.cards#woningtypes .container-lg .cards-header .btn::before, section.cards#woningtypes .container-lg .cards-header .btn::after{
background-color: var(--color1);
}    
section.cards .cards-header.cards-header--background:before {
background: var(--color2);
}
article.article.article--background[data-background="color2"]:not(:has(.article-content--background)) .btn.btn--outline{
background-color: transparent;
color: var(--color3);
}
section.cards .cards-header.cards-header--background{
    color: var(--color3);
}
section.downloads.downloads--background{
    background: white;
}
section.downloads.downloads--background .downloads-header{
    color: var(--color2);
}
section.downloads .downloads-header{
    color: var(--color3);
}
section.downloads .downloads-header.downloads-header--background:before{
    background-color: var(--color2);
}
section.object .object-content table tr :is(th, td) {
color: var(--color2);
}
.accordion .accordion-item .accordion-item__content {
color: black;
}
/* section.header:before {
    content: '';
    background: linear-gradient(0deg, rgba(48, 52, 45, 1) 0%, rgba(48, 52, 45, 0) 100%);
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: calc(var(--largehuge) * 2);
    z-index: 1;
}


section.header:has(+ section.downloads):before {
    background: linear-gradient(0deg, rgba(245, 233, 217, 1) 0%, rgba(245, 233, 217, 0) 100%);
} */


/* 
section.cards .card .card-image:before {
    content: '';
    background: linear-gradient(0deg, rgba(245, 233, 217, 1) 0%, rgba(245, 233, 217, 0) 100%);
    background: linear-gradient(0deg, rgba(48, 52, 45, 1) 0%, rgba(48, 52, 45, 0) 100%);
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: calc(var(--largehuge) * 2);
    z-index: 1;
} */
.single-realworks_nb_nummer section.object .object-content p{
    color: black;
}
section.cards .card .card-content {
    padding-top: var(--small);
}
footer{
    color: var(--color2);
    background-color: white;
}
.page-id-144 article.article .article-content:not(.article-content--background) :is(h3, h4, h5, h6) {
color: white;
}
@media (max-width: 992px) {

    section.header:after {
        width: 120px;
        position: absolute;
        right: var(--small);
        top: var(--small);
    }
    article.article .article-sidebar::before {
        display: none;
    }
    article.article .article-sidebar::after {
        display: none;
    }
}