:root {
--kleur-rood: #7f1714;
--kleur-rood-60: rgba(127, 23, 20, 0.6);
--kleur-geel: #ffdd53;
--kleur-geel-hover: #ddbc37;
--kleur-geel-30: rgba(255, 221, 83, 0.3);
--kleur-geel-60: rgba(255, 221, 83, 0.6);
--kleur-tekst-donker: #222222;
--kleur-tekst-licht: #ffffff;
--primary-font: "fira-sans", sans-serif;
--secondary-font: "futura-pt", sans-serif;
--secondary-font-bold: "futura-pt-bold", sans-serif;
}
@-webkit-keyframes animHeaderScrollArrow {
0% {
opacity: 0;
}
50% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@keyframes animHeaderScrollArrow {
0% {
opacity: 0;
}
50% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@-webkit-keyframes animTitle {
0% {
opacity: 0;
-webkit-transform: translateX(-50px);
transform: translateX(-50px);
}
20% {
opacity: 0;
-webkit-transform: translateX(-50px);
transform: translateX(-50px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0px);
transform: translateX(0px);
}
}
@keyframes animTitle {
0% {
opacity: 0;
-webkit-transform: translateX(-50px);
transform: translateX(-50px);
}
20% {
opacity: 0;
-webkit-transform: translateX(-50px);
transform: translateX(-50px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0px);
transform: translateX(0px);
}
}
@-webkit-keyframes animSubTitle {
0% {
opacity: 0;
-webkit-transform: translateX(50px);
transform: translateX(50px);
}
20% {
opacity: 0;
-webkit-transform: translateX(50px);
transform: translateX(50px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0px);
transform: translateX(0px);
}
}
@keyframes animSubTitle {
0% {
opacity: 0;
-webkit-transform: translateX(50px);
transform: translateX(50px);
}
20% {
opacity: 0;
-webkit-transform: translateX(50px);
transform: translateX(50px);
}
100% {
opacity: 1;
-webkit-transform: translateX(0px);
transform: translateX(0px);
}
} * {
font-family: var(--secondary-font);
color: var(--kleur-tekst-donker);
padding: 0;
margin: 0;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.logged-in .headerFullWidth {
top: 32px;
-webkit-transition: 0.3s;
transition: 0.3s;
}
.logged-in .headerFullWidthScrollDown {
top: -58px;
-webkit-transition: 0.3s;
transition: 0.3s;
}
.logged-in .headerFullWidthScrollUp {
top: 32px;
-webkit-transition: 0.3s;
transition: 0.3s;
}
h1 {
font-family: var(--primary-font);
font-weight: 700;
}
h2 {
font-family: var(--primary-font);
font-size: 36px;
font-weight: 700;
-webkit-text-decoration: underline var(--kleur-geel);
text-decoration: underline var(--kleur-geel);
text-transform: uppercase;
margin-bottom: 20px;
}
h3 {
font-family: var(--primary-font);
}
p {
margin-bottom: 20px;
font-size: 18px;
line-height: 26px;
}
img {
display: block;
margin: 0 auto;
max-width: 100%;
height: auto;
}
.losseFoto {
border-radius: 10px;
-webkit-box-shadow: 0px 2px 15px -10px #888;
box-shadow: 0px 2px 15px -10px #888;
}
.button {
display: block;
font-family: var(--secondary-font-bold);
font-size: 18px;
font-weight: 600;
text-align: center;
text-decoration: none;
text-transform: uppercase;
padding: 15px 20px;
border-radius: 25px;
width: 250px;
-webkit-transition: 0.3s;
transition: 0.3s;
}
.yellowButton {
background-color: var(--kleur-geel);
}
.yellowButton:hover {
background-color: var(--kleur-geel-hover);
-webkit-transition: 0.3s;
transition: 0.3s;
}
.vriendenHaarhoesButton {
width: 320px;
}
.fullWidthContainer {
width: 100%;
padding: 100px 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-pack: distribute;
justify-content: space-around;
}
.normalContainer {
width: 100%;
max-width: 1400px;
padding: 20px;
z-index: 5;
}
.kolomContainer {
display: grid;
}
.kolom-1-1 {
grid-template-columns: 1fr 1fr;
grid-gap: 150px;
}
.kolom-2-1 {
grid-template-columns: 2fr 1fr;
grid-gap: 50px;
}
.kolom-1-2 {
grid-template-columns: 1fr 2fr;
grid-gap: 50px;
}
.kolom-1-1-1 {
grid-template-columns: 1fr 1fr 1fr;
grid-gap: 50px;
}
.headerFullWidth {
position: fixed;
top: 0;
left: 0;
background-color: transparent;
padding: 20px;
z-index: 999;
}
.headerFullWidth .headerContainer {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: 0 20px;
}
.headerFullWidth .headerContainer .headerLogo {
width: 260px;
height: auto;
}
.headerFullWidth .headerContainer .menu-hoofdmenu-container .menu {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
list-style-type: none;
}
.headerFullWidth .headerContainer .menu-hoofdmenu-container .menu li {
margin: 0 20px;
}
.headerFullWidth .headerContainer .menu-hoofdmenu-container .menu li:first-child {
margin-left: 0 !important;
}
.headerFullWidth .headerContainer .menu-hoofdmenu-container .menu li:last-child {
margin-right: 0 !important;
}
.headerFullWidth .headerContainer .menu-hoofdmenu-container .menu li a {
text-decoration: none;
color: var(--kleur-tekst-licht);
font-size: 18px;
font-family: var(--primary-font);
letter-spacing: -1px;
text-transform: uppercase;
}
.headerFullWidth .headerContainer .menu-hoofdmenu-container .menu .current-menu-item {
position: relative;
}
.headerFullWidth .headerContainer .menu-hoofdmenu-container .menu .current-menu-item::before {
content: "";
position: absolute;
bottom: -3px;
left: 0;
width: 100%;
height: 3px;
border-radius: 2px;
background-color: var(--kleur-geel);
}
.headerFullWidth .headerNavMobielSwitch {
display: none;
}
.headerFullWidthScrollDown {
top: -90px;
-webkit-transition: 0.3s;
transition: 0.3s;
}
.headerFullWidthScrollUp {
top: 0;
background-color: var(--kleur-rood);
-webkit-transition: 0.3s;
transition: 0.3s;
}
.homeHeroFullWidth {
height: 100svh;
background-color: var(--kleur-rood);
position: relative;
}
.homeHeroFullWidth .homeHeroSliderContainer {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.homeHeroFullWidth .homeHeroSliderContainer .homeHeroSlide {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
opacity: 0;
-webkit-transition: 2.5s;
transition: 2.5s;
}
.homeHeroFullWidth .homeHeroSliderContainer .homeHeroSlideActief {
opacity: 1;
-webkit-transition: 2.5s;
transition: 2.5s;
}
.homeHeroFullWidth .homeHeroOverlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: var(--kleur-rood-60);
}
.homeHeroFullWidth .normalContainer {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-pack: distribute;
justify-content: space-around;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.homeHeroFullWidth .heroTextContainer .heroTitle {
font-size: 100px;
text-transform: uppercase;
color: var(--kleur-tekst-licht);
text-align: center;
position: relative;
opacity: 0;
-webkit-transform: translateX(-50px);
transform: translateX(-50px);
-webkit-animation: animTitle 2s 0.4s forwards;
animation: animTitle 2s 0.4s forwards;
-webkit-transition: 0.3s;
transition: 0.3s;
}
.homeHeroFullWidth .heroTextContainer .heroTitle:before {
content: "";
position: absolute;
left: 7px;
bottom: 15px;
width: 53%;
height: 4px;
background-color: var(--kleur-geel);
}
.homeHeroFullWidth .heroTextContainer .heroTitle:after {
content: "";
position: absolute;
right: 5px;
bottom: 15px;
width: 39%;
height: 4px;
background-color: var(--kleur-geel);
}
.homeHeroFullWidth .heroTextContainer .heroPayOff {
text-align: right;
color: var(--kleur-tekst-licht);
font-size: 22px;
text-decoration: none;
-webkit-transform: translateX(0);
transform: translateX(0);
-webkit-animation: animSubTitle 2s 0.7s forwards;
animation: animSubTitle 2s 0.7s forwards;
opacity: 0;
-webkit-transition: 0.3s;
transition: 0.3s;
}
.headerScrollDownButton {
position: absolute;
bottom: 100px;
left: calc(50% - 25px);
width: 50px;
height: 50px;
background-color: rgba(0, 0, 0, 0);
border: 4px solid var(--kleur-geel-60);
border-radius: 50%;
z-index: 9;
cursor: pointer;
-webkit-transition: 0.3s;
transition: 0.3s;
}
.headerScrollDownButton:hover {
border: 4px solid var(--kleur-geel);
-webkit-transform: translateY(10px);
transform: translateY(10px);
background-color: rgba(0, 0, 0, 0.4);
-webkit-transition: 0.3s;
transition: 0.3s;
}
.headerScrollDownButton .headerPointerDown {
position: absolute;
left: 9px;
-webkit-transition: 0.3s;
transition: 0.3s;
}
.headerScrollDownButton .headerPointerDown1 {
opacity: 0;
-webkit-animation: animHeaderScrollArrow 3s 1s infinite;
animation: animHeaderScrollArrow 3s 1s infinite;
top: 6px;
}
.headerScrollDownButton .headerPointerDown2 {
opacity: 0;
-webkit-animation: animHeaderScrollArrow 3s 1.5s infinite;
animation: animHeaderScrollArrow 3s 1.5s infinite;
top: 12px;
}
.headerScrollDownButton .headerPointerDown3 {
opacity: 0;
-webkit-animation: animHeaderScrollArrow 3s 2s infinite;
animation: animHeaderScrollArrow 3s 2s infinite;
top: 18px;
}
.socialFullWidth {
padding-bottom: 0;
}
.socialFullWidth .socialContainer .sb-item {
color: var(--kleur-tekst-donker) !important;
border-radius: 10px;
-webkit-transition: 0.6s;
transition: 0.6s;
}
.socialFullWidth .socialContainer .sb-item .sb-container {
background-color: transparent !important;
border-color: var(--kleur-geel) !important;
border: 1px solid var(--kleur-geel);
border-width: 1px !important;
border-radius: 10px !important;
}
.socialFullWidth .socialContainer .sb-item .sb-inner {
padding: 20px;
-webkit-transition: 0.6s;
transition: 0.6s;
background-color: transparent !important;
}
.socialFullWidth .socialContainer .sb-item a {
color: var(--kleur-rood);
height: 100%;
font-size: 18px !important;
line-height: 22px;
}
.socialFullWidth .socialContainer .sb-item .sb-thumb {
height: 250px !important;
border-radius: 10px 10px 0 0;
}
.socialFullWidth .socialContainer .sb-item .sb-thumb img {
-o-object-fit: cover !important;
object-fit: cover !important;
}
.socialFullWidth .socialContainer .sb-item .sb-text {
margin-bottom: 0;
font-size: 18px;
line-height: 26px;
}
.socialFullWidth .socialContainer .sb-item:hover > .sb-container .sb-inner {
background-color: var(--kleur-geel-30) !important;
-webkit-transition: 0.6s;
transition: 0.6s;
}
.homeVerenigingenFull {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
position: relative;
}
.homeVerenigingenFull .homeVerenigingenTop {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-pack: distribute;
justify-content: space-around;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.homeVerenigingenFull .homeVerenigingenGrid {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
grid-template-rows: 250px 250px 250px;
grid-template-areas: "verenigingGridItem1 verenigingGridItem2 verenigingGridItem3 verenigingGridItem3" "verenigingGridItem4 verenigingGridItem4 verenigingGridItem3 verenigingGridItem3" "verenigingGridItem4 verenigingGridItem4 verenigingGridItem5 verenigingGridItem6";
grid-gap: 20px;
padding: 20px;
}
.homeVerenigingenFull .homeVerenigingenGrid .homeVerenigingGridItemLink:nth-child(1) {
grid-area: verenigingGridItem1;
}
.homeVerenigingenFull .homeVerenigingenGrid .homeVerenigingGridItemLink:nth-child(2) {
grid-area: verenigingGridItem2;
}
.homeVerenigingenFull .homeVerenigingenGrid .homeVerenigingGridItemLink:nth-child(3) {
grid-area: verenigingGridItem3;
}
.homeVerenigingenFull .homeVerenigingenGrid .homeVerenigingGridItemLink:nth-child(4) {
grid-area: verenigingGridItem4;
}
.homeVerenigingenFull .homeVerenigingenGrid .homeVerenigingGridItemLink:nth-child(5) {
grid-area: verenigingGridItem5;
}
.homeVerenigingenFull .homeVerenigingenGrid .homeVerenigingGridItemLink:nth-child(6) {
grid-area: verenigingGridItem6;
}
.homeVerenigingenFull .homeVerenigingenGrid .homeVerenigingGridItemLink {
width: 100%;
height: 100%;
border-radius: 10px;
overflow: hidden;
position: relative;
}
.homeVerenigingenFull .homeVerenigingenGrid .homeVerenigingGridItemLink .homeVerenigingGridItem {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}
.homeVerenigingenFull .homeVerenigingenGrid .homeVerenigingGridItemLink .homeVerenigingGridItem .homeVerenigingGridItemOverlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.2);
-webkit-transition: 0.3s;
transition: 0.3s;
}
.homeVerenigingenFull .homeVerenigingenGrid .homeVerenigingGridItemLink .homeVerenigingGridItem h3 {
position: absolute;
bottom: 20px;
left: 20px;
color: var(--kleur-geel);
font-size: 24px;
text-shadow: 0 0 10px #333;
}
.homeVerenigingenFull .homeVerenigingenGrid .homeVerenigingGridItemLink .homeVerenigingGridItem:hover > .homeVerenigingGridItemOverlay {
background-color: rgba(0, 0, 0, 0);
-webkit-transition: 0.3s;
transition: 0.3s;
}
.homeVerenigingenFull .homeVerenigingenBottom {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-pack: distribute;
justify-content: space-around;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.homeBedrijvenFull {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
position: relative;
overflow: hidden;
}
.homeBedrijvenFull .homeBedrijvenTop {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-pack: distribute;
justify-content: space-around;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.homeBedrijvenFull .homeBedrijvenSlider {
padding: 0 20px;
}
.homeBedrijvenFull .owl-stage {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
}
.homeBedrijvenFull .owl-stage .owl-item .homeBedrijvenSlideItem {
position: relative;
min-height: 400px;
border-radius: 10px;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}
.homeBedrijvenFull .owl-stage .owl-item .homeBedrijvenSlideItem h3 {
position: absolute;
bottom: 20px;
left: 20px;
color: var(--kleur-geel);
font-size: 24px;
text-shadow: 0 0 10px #333;
}
.homeBedrijvenFull .owl-nav {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
margin: 40px auto 0 auto;
height: 50px;
max-width: 1400px;
}
.homeBedrijvenFull .owl-nav .owl-prev {
width: 60px;
height: 54px;
padding: 14px;
border-radius: 27px 0 0 27px;
background-color: var(--kleur-geel);
border: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-pack: distribute;
justify-content: space-around;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
cursor: pointer;
-webkit-transition: 0.3s;
transition: 0.3s;
}
.homeBedrijvenFull .owl-nav .owl-prev:hover {
background-color: var(--kleur-geel-hover);
-webkit-transition: 0.3s;
transition: 0.3s;
}
.homeBedrijvenFull .owl-nav .owl-next {
width: 60px;
height: 54px;
padding: 14px;
border-radius: 0 27px 27px 0;
background-color: var(--kleur-geel);
border: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-pack: distribute;
justify-content: space-around;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
cursor: pointer;
-webkit-transition: 0.3s;
transition: 0.3s;
}
.homeBedrijvenFull .owl-nav .owl-next:hover {
background-color: var(--kleur-geel-hover);
-webkit-transition: 0.3s;
transition: 0.3s;
}
.homeBedrijvenFull .homeVerenigingenBottom {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-pack: distribute;
justify-content: space-around;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.homeBedrijvenFull .homeVerenigingenBottom .normalContainer {
position: relative;
}
.homeBedrijvenFull .homeVerenigingenBottom .normalContainer .homeAlleBedrijvenButton {
position: absolute;
left: 180px;
top: -50px;
height: 54px !important;
}
.heroFullWidth {
position: relative;
height: 100svh;
background-color: var(--kleur-rood);
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}
.heroFullWidth .heroOverlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.3);
}
.heroFullWidth .normalContainer {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-pack: distribute;
justify-content: space-around;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.heroFullWidth .normalContainer .heroTextContainer .heroTitle {
font-size: 100px;
text-transform: uppercase;
color: var(--kleur-tekst-licht);
text-align: center;
position: relative;
opacity: 0;
-webkit-transform: translateX(-50px);
transform: translateX(-50px);
-webkit-animation: animTitle 2s 0.4s forwards;
animation: animTitle 2s 0.4s forwards;
-webkit-transition: 0.3s;
transition: 0.3s;
}
.mec-skin-list-container {
margin-bottom: 20px;
}
.mec-skin-list-container .mec-event-list-minimal .col-md-9 {
padding-left: 0;
width: 100%;
}
.mec-skin-list-container .mec-event-list-minimal .btn-wrapper {
display: none;
}
.mec-skin-list-container .mec-event-list-minimal .mec-event-article {
padding: 0 0 20px 0;
border-bottom: 0;
}
.mec-skin-list-container .mec-event-list-minimal .mec-event-article .mec-event-date {
padding: 2px 10px;
}
.mec-skin-list-container .mec-event-list-minimal .mec-event-article .mec-event-date span {
color: var(--kleur-tekst-licht);
margin-bottom: 0;
}
.mec-skin-list-container .mec-event-list-minimal .mec-event-article .mec-event-date::after {
background-color: transparent;
}
.mec-skin-list-container .mec-event-list-minimal .mec-event-article .mec-event-title {
margin-bottom: 0;
}
.mec-skin-list-container .mec-event-list-minimal .mec-event-article .mec-event-title a {
font-family: var(--primary-font);
}
.mec-skin-list-container .mec-event-list-minimal .mec-event-article .mec-event-detail {
display: none;
}
.haarhoesFirstFullWidth {
padding-bottom: 0;
}
.haarhoesLogo {
margin-bottom: 40px !important;
}
.haarhoesRuimtesFullWidth .haarhoesRuimtesContainer {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.haarhoesRuimtesFullWidth .haarhoesRuimtesContainer .haarhoesRuimteItem {
border: 1px solid var(--kleur-geel);
border-radius: 10px;
overflow: hidden;
}
.haarhoesRuimtesFullWidth .haarhoesRuimtesContainer .haarhoesRuimteItem .haarhoesRuimteItemTop {
background-size: cover;
min-height: 375px;
}
.haarhoesRuimtesFullWidth .haarhoesRuimtesContainer .haarhoesRuimteItem .haarhoesRuimteItemBottom {
padding: 40px 20px 20px 20px;
}
.haarhoesRuimtesFullWidth .haarhoesRuimtesContainer .haarhoesRuimteItem .haarhoesRuimteItemBottom h3 {
margin-bottom: 10px;
}
.haarhoesFotoFullWidth {
padding-top: 0;
}
.haarhoesFotoFullWidth .haarhoesFotoContainer {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.haarhoesTarievenFullWidth {
padding-top: 0;
}
.haarhoesTarievenFullWidth .haarhoesTarievenContainerBottom table {
width: 100%;
}
.haarhoesTarievenFullWidth .haarhoesTarievenContainerBottom th {
font-family: var(--primary-font);
font-size: 22px;
font-weight: 700;
text-align: left;
text-transform: uppercase;
}
.haarhoesTarievenFullWidth .haarhoesTarievenContainerBottom td {
font-size: 20px;
padding-bottom: 10px;
}
.haarhoesBestuurTabel {
width: 100%;
}
.haarhoesBestuurTabel th {
font-family: var(--primary-font);
font-size: 22px;
font-weight: 700;
text-align: left;
text-transform: uppercase;
}
.haarhoesBestuurTabel td {
font-size: 20px;
padding-bottom: 10px;
}
.haarhoesVriendenFullWidth {
padding-top: 0;
}
.verenigingGridContainer {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-gap: 50px;
}
.verenigingGridContainer .verenigingGridItem {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
border-radius: 10px;
border: 1px solid var(--kleur-geel);
overflow: hidden;
}
.verenigingGridContainer .verenigingGridItem .verenigingGridItemTop {
background-size: cover;
background-position: center;
background-repeat: no-repeat;
min-height: 240px;
}
.verenigingGridContainer .verenigingGridItem .verenigingGridItemBottom {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
height: 100%;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
padding: 40px 20px 20px 20px;
}
.verenigingGridContainer .verenigingGridItem .verenigingGridItemBottom .verenigingGridItemBottomInfo {
margin-bottom: 10px;
}
.verenigingGridContainer .verenigingGridItem .verenigingGridItemBottom .verenigingGridItemBottomInfo h3 {
margin-bottom: 10px;
}
.bedrijvenGridContainer {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-gap: 50px;
}
.bedrijvenGridContainer .bedrijfGridItem {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
border-radius: 10px;
border: 1px solid var(--kleur-geel);
overflow: hidden;
}
.bedrijvenGridContainer .bedrijfGridItem .bedrijfGridItemTop {
background-size: cover;
background-position: center;
background-repeat: no-repeat;
min-height: 240px;
}
.bedrijvenGridContainer .bedrijfGridItem .bedrijfGridItemBottom {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
height: 100%;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
padding: 40px 20px 20px 20px;
}
.bedrijvenGridContainer .bedrijfGridItem .bedrijfGridItemBottom .bedrijfGridItemBottomInfo {
margin-bottom: 10px;
}
.bedrijvenGridContainer .bedrijfGridItem .bedrijfGridItemBottom .bedrijfGridItemBottomInfo h3 {
margin-bottom: 10px;
}
.fotoFullWidth {
width: 100%;
height: 600px;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}
.fotoCollageOverNoordijk {
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: 200px 200px 200px;
grid-gap: 20px;
grid-template-areas: "fCollage1 fCollage2" "fCollage1 fCollage3" "fCollage4 fCollage4";
}
.fotoCollageOverNoordijk .fotoCollage {
background-size: cover;
background-position: center;
background-repeat: no-repeat;
border-radius: 10px;
overflow: hidden;
}
.fotoCollageOverNoordijk .fotoCollage1 {
grid-area: fCollage1;
}
.fotoCollageOverNoordijk .fotoCollage2 {
grid-area: fCollage2;
}
.fotoCollageOverNoordijk .fotoCollage3 {
grid-area: fCollage3;
}
.fotoCollageOverNoordijk .fotoCollage4 {
grid-area: fCollage4;
}
.contactFormulierContainer .nf-before-form-content {
display: none;
}
.contactFormulierContainer .nf-field-label {
width: 200px !important;
text-align: left !important;
margin-bottom: 5px;
}
.contactFormulierContainer .nf-field-element {
width: 100% !important;
}
.contactFormulierContainer .submit-container .nf-field-label {
width: 0 !important;
}
.contactFormulierContainer input,
.contactFormulierContainer textarea {
border: 1px solid var(--kleur-geel) !important;
color: var(--kleur-tekst-donker) !important;
}
.contactFormulierContainer .contactVerzendButton {
display: block !important;
background-color: var(--kleur-geel) !important;
font-family: var(--secondary-font-bold) !important;
font-size: 18px !important;
font-weight: 600 !important;
color: var(--kleur-tekst-donker) !important;
text-align: center !important;
text-decoration: none !important;
text-transform: uppercase !important;
padding: 15px 20px !important;
border: 0 !important;
border-radius: 25px !important;
width: 250px !important;
cursor: pointer !important;
-webkit-transition: 0.3s !important;
transition: 0.3s !important;
}
.contactFormulierContainer .contactVerzendButton:hover {
background-color: var(--kleur-geel-hover) !important;
-webkit-transition: 0.3s !important;
transition: 0.3s !important;
}
.contactMapsFullWidth {
padding: 0;
}
.nieuwsContainer {
padding-right: 300px;
}
.nieuwsContainer .nieuwsListItem .nieuwsListItemTop h3 {
margin-bottom: 0 !important;
}
.nieuwsContainer .nieuwsListItem .nieuwsListItemTop .nieuwsMeta {
opacity: 0.4;
font-size: 14px;
font-family: var(--primary-font);
font-weight: 700;
text-transform: uppercase;
}
.nieuwsContainer .nieuwsListItem .nieuwsListItemBottom .nieuwsListItemLeft {
width: 325px !important;
}
.singleNieuwsInhoudFullWidth .nieuwsMeta {
opacity: 0.4;
font-size: 14px;
font-family: var(--primary-font);
font-weight: 700;
text-transform: uppercase;
}
.singleNieuwsInhoudFullWidth .singleNieuwsFotoContainer {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
width: 100%;
}
.singleNieuwsInhoudFullWidth .singleNieuwsFotoContainer .singleNieuwsFotoContainerGroot {
margin-bottom: 20px;
}
.singleNieuwsInhoudFullWidth .singleNieuwsFotoContainer .singleNieuwsFotoContainerGroot img {
border-radius: 10px;
}
.singleNieuwsInhoudFullWidth .singleNieuwsFotoContainer .singleNieuwsFotoContainerNav {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
grid-gap: 20px;
}
.singleNieuwsInhoudFullWidth .singleNieuwsFotoContainer .singleNieuwsFotoContainerNav img {
border-radius: 10px;
}
.singleNieuwsInhoudFullWidth .singleNieuwsFotoContainer .singleNieuwsFotoContainerNav .singleFotoNav {
-webkit-filter: brightness(0.6);
filter: brightness(0.6);
cursor: pointer;
}
.singleNieuwsInhoudFullWidth .singleNieuwsFotoContainer .singleNieuwsFotoContainerNav .singleFotoNavActief {
-webkit-filter: brightness(1);
filter: brightness(1);
cursor: default;
}
.singleVerenigingInhoudFullWidth .verenigingContactContainer {
background-color: var(--kleur-geel-30);
border-radius: 10px;
padding: 20px;
margin-bottom: 20px;
}
.singleVerenigingInhoudFullWidth .verenigingContactContainer .verenigingContactTabel {
border: 0px;
}
.singleVerenigingInhoudFullWidth .verenigingContactContainer .verenigingContactTabel tr {
height: 34px;
}
.singleVerenigingInhoudFullWidth .verenigingContactContainer .verenigingContactTabel td {
height: 34px;
}
.singleVerenigingInhoudFullWidth .verenigingContactContainer .verenigingContactTabel tr td:first-child {
width: 160px;
font-weight: 700;
}
.singleVerenigingInhoudFullWidth .verenigingContactContainer .contactSocialCell {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.singleVerenigingInhoudFullWidth .verenigingContactContainer .contactSocialIcon {
width: 26px;
height: 26px;
margin-right: 20px;
}
.singleVerenigingInhoudFullWidth .singleVerenigingFotoContainer {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
width: 100%;
}
.singleVerenigingInhoudFullWidth .singleVerenigingFotoContainer .singleVerenigingFotoContainerGroot {
margin-bottom: 20px;
}
.singleVerenigingInhoudFullWidth .singleVerenigingFotoContainer .singleVerenigingFotoContainerGroot img {
border-radius: 10px;
-webkit-box-shadow: 0 5px 20px -14px #777;
box-shadow: 0 5px 20px -14px #777;
}
.singleVerenigingInhoudFullWidth .singleVerenigingFotoContainer .singleVerenigingFotoContainerNav {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
grid-gap: 20px;
}
.singleVerenigingInhoudFullWidth .singleVerenigingFotoContainer .singleVerenigingFotoContainerNav img {
border-radius: 10px;
}
.singleVerenigingInhoudFullWidth .singleVerenigingFotoContainer .singleVerenigingFotoContainerNav .singleFotoNav {
-webkit-filter: brightness(0.6);
filter: brightness(0.6);
cursor: pointer;
}
.singleVerenigingInhoudFullWidth .singleVerenigingFotoContainer .singleVerenigingFotoContainerNav .singleFotoNavActief {
-webkit-filter: brightness(1);
filter: brightness(1);
cursor: default;
}
.singleVerenigingInhoudFullWidth table {
width: 100%;
border-collapse: collapse;
border: 1px solid;
}
.singleVerenigingInhoudFullWidth table th {
background-color: var(--kleur-rood);
text-align: left;
color: var(--kleur-tekst-licht);
padding: 5px;
font-size: 18px;
}
.singleVerenigingInhoudFullWidth table td {
padding: 5px;
font-size: 18px;
}
.singleVerenigingInhoudFullWidth ul {
margin-left: 20px;
margin-bottom: 40px;
}
.singleVerenigingInhoudFullWidth ul li {
font-size: 18px;
margin-bottom: 5px;
}
.bestandenFullWidth {
padding-top: 0;
}
.bestandenContainerBottom {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
grid-gap: 50px;
}
.werktSamenFullWidth {
padding-top: 0;
}
.werktSamenFullWidth .werktSamenContainerTop {
margin-bottom: 40px;
}
.werktSamenFullWidth .werktSamenContainerTop h3 {
font-size: 36px;
font-weight: 700;
}
.werktSamenFullWidth .werktSamenContainerBottom {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-gap: 50px;
}
.werktSamenFullWidth .werktSamenContainerBottom .bedrijfGridItem {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
border-radius: 10px;
border: 1px solid var(--kleur-geel);
overflow: hidden;
}
.werktSamenFullWidth .werktSamenContainerBottom .bedrijfGridItem .bedrijfGridItemTop {
background-size: cover;
background-position: center;
background-repeat: no-repeat;
min-height: 240px;
}
.werktSamenFullWidth .werktSamenContainerBottom .bedrijfGridItem .bedrijfGridItemBottom {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
height: 100%;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
padding: 40px 20px 20px 20px;
}
.werktSamenFullWidth .werktSamenContainerBottom .bedrijfGridItem .bedrijfGridItemBottom .bedrijfGridItemBottomInfo {
margin-bottom: 10px;
}
.werktSamenFullWidth .werktSamenContainerBottom .bedrijfGridItem .bedrijfGridItemBottom .bedrijfGridItemBottomInfo h3 {
margin-bottom: 10px;
}
.werktSamenFullWidth .werktSamenContainerBottom .verenigingGridItem {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
border-radius: 10px;
border: 1px solid var(--kleur-geel);
overflow: hidden;
}
.werktSamenFullWidth .werktSamenContainerBottom .verenigingGridItem .verenigingGridItemTop {
background-size: cover;
background-position: center;
background-repeat: no-repeat;
min-height: 240px;
}
.werktSamenFullWidth .werktSamenContainerBottom .verenigingGridItem .verenigingGridItemBottom {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
height: 100%;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
padding: 40px 20px 20px 20px;
}
.werktSamenFullWidth .werktSamenContainerBottom .verenigingGridItem .verenigingGridItemBottom .verenigingGridItemBottomInfo {
margin-bottom: 10px;
}
.werktSamenFullWidth .werktSamenContainerBottom .verenigingGridItem .verenigingGridItemBottom .verenigingGridItemBottomInfo h3 {
margin-bottom: 10px;
}
.ruimteReserverenFrame {
border: 0;
}
.ruimteFotoContainer img {
border-radius: 20px;
margin-bottom: 40px;
}
.jeugdInhoudFullWidth {
padding-top: 0;
}
.jeugdOverzichtLogo {
border-radius: 10px;
-webkit-box-shadow: 0 5px 20px -14px #777;
box-shadow: 0 5px 20px -14px #777;
}
.footerFullWidth {
position: relative;
background-color: var(--kleur-rood);
padding: 100px 0 0 0;
}
.footerFullWidth .footerContainer {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.footerFullWidth .footerContainer .footerContainerTop {
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 40px;
padding-bottom: 40px;
}
.footerFullWidth .footerContainer .footerContainerTop h3,
.footerFullWidth .footerContainer .footerContainerTop p,
.footerFullWidth .footerContainer .footerContainerTop a {
font-family: var(--primary-font);
color: var(--kleur-tekst-licht);
}
.footerFullWidth .footerContainer .footerContainerTop h3 {
font-family: var(--primary-font);
font-size: 30px;
font-weight: 700;
-webkit-text-decoration: underline var(--kleur-geel);
text-decoration: underline var(--kleur-geel);
text-transform: uppercase;
margin-bottom: 20px;
}
.footerFullWidth .footerContainer .footerContainerTop .footerKolom1 {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
}
.footerFullWidth .footerContainer .footerContainerTop .footerKolom1 .footerLogo {
width: 100%;
height: auto;
max-width: 260px;
margin: 0 0 20px 0;
}
.footerFullWidth .footerContainer .footerContainerTop .footerKolom1 .socialMediaContainer {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.footerFullWidth .footerContainer .footerContainerTop .footerKolom1 .socialMediaContainer .socialMediaIcon {
width: 30px;
height: 30px;
margin: 0 10px;
}
.footerFullWidth .footerContainer .footerContainerTop .footerKolom1 .socialMediaContainer .socialMediaIconFacebook {
margin-left: 0;
}
.footerFullWidth .footerContainer .footerContainerTop .footerKolom1 .socialMediaContainer .socialMediaIconLinkedin {
margin-right: 0;
}
.footerFullWidth .footerContainer .footerContainerTop .footerNavContainer ul {
list-style-type: none;
}
.footerFullWidth .footerContainer .footerContainerTop .footerNavContainer ul li {
margin-bottom: 10px;
}
.footerFullWidth .footerContainer .footerContainerTop .footerNavContainer ul li a {
text-transform: uppercase;
text-decoration: none;
font-size: 18px;
font-weight: 700;
}
.footerFullWidth .footerContainer .footerContainerTop .footerNavContainer ul li a:hover {
-webkit-text-decoration: underline var(--kleur-geel);
text-decoration: underline var(--kleur-geel);
}
.footerFullWidth .footerContainer .footerContainerBottom {
border-top: 5px solid var(--kleur-geel);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
padding: 20px 0;
}
.footerFullWidth .footerContainer .footerContainerBottom p,
.footerFullWidth .footerContainer .footerContainerBottom a {
font-size: 12px;
color: var(--kleur-tekst-licht);
margin-bottom: 0;
}
.footerFullWidth .footerContainer .footerContainerBottom a {
text-decoration: none;
}
.footerFullWidth .footerContainer .footerContainerBottom a:hover {
-webkit-text-decoration: underline var(--kleur-geel);
text-decoration: underline var(--kleur-geel);
}
.yellowBox {
position: absolute;
height: 600px;
background-color: var(--kleur-geel-30);
z-index: -1;
-webkit-transition: 0.3s;
transition: 0.3s;
}
.yellowBox1 {
width: 560px;
border-radius: 20px 0 0 20px;
top: calc(100vh - 580px);
right: 0;
}
.yellowBox2 {
width: 540px;
border-radius: 20px 0 0 20px;
top: calc(100vh - 560px);
right: 0;
}
.yellowBox3 {
width: 360px;
border-radius: 0 20px 20px 0;
top: 140px;
left: 0;
}
.yellowBox4 {
width: 380px;
border-radius: 0 20px 20px 0;
top: 160px;
left: 0;
}
.yellowBox5 {
width: 360px;
border-radius: 20px 0 0 20px;
bottom: 130px;
right: 0;
}
.yellowBox6 {
width: 380px;
border-radius: 20px 0 0 20px;
bottom: 150px;
right: 0;
}
.yellowBox7 {
width: 360px;
height: 400px;
border-radius: 0 20px 20px 0;
top: 120px;
left: 0;
}
.yellowBox8 {
width: 380px;
height: 400px;
border-radius: 0 20px 20px 0;
top: 140px;
left: 0;
}
.yellowBox9 {
width: 360px;
height: 300px;
border-radius: 20px 0 0 20px;
top: -20px;
right: 0;
}
.yellowBox10 {
width: 340px;
height: 300px;
border-radius: 20px 0 0 20px;
top: -40px;
right: 0;
}
.hero404FullWidth {
background-color: var(--kleur-rood);
min-height: 200px;
}
@media (max-width: 1350px) {
.headerFullWidth .headerContainer {
padding: 0;
}
.headerFullWidth .headerContainer .menu-hoofdmenu-container .menu li {
margin: 0 15px;
}
.kolom-1-1 {
grid-gap: 40px;
}
.bestandenContainerBottom {
grid-template-columns: 1fr 1fr 1fr;
grid-gap: 20px;
}
}
@media (max-width: 1100px) {
.headerFullWidth {
background-color: var(--kleur-rood);
}
.headerNavContainer {
position: fixed;
top: 0;
right: -400px;
width: 400px;
padding: 20px 40px 40px 40px;
height: 100%;
background-color: var(--kleur-rood);
-webkit-transition: 0.5s;
transition: 0.5s;
}
.headerNavContainer .menu-hoofdmenu-container .menu {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
padding-top: 80px;
}
.headerNavContainer .menu-hoofdmenu-container .menu li {
margin: 0 0 20px 0 !important;
}
.headerNavContainer .menu-hoofdmenu-container .menu li a {
font-size: 26px !important;
}
.headerNavContainer .menu-hoofdmenu-container .menu .current-menu-item {
padding-left: 10px;
}
.headerNavContainer .menu-hoofdmenu-container .menu .current-menu-item::before {
top: 0;
left: 0 !important;
width: 5px !important;
bottom: auto !important;
height: 100% !important;
}
.headerNavContainerOpen {
right: 0 !important;
-webkit-transition: 0.5s;
transition: 0.5s;
}
.headerNavMobielSwitch {
display: block !important;
position: fixed;
right: 20px;
top: 30px;
width: 40px;
height: 30px;
z-index: 9999;
}
.headerNavMobielSwitch .navMobielBar {
position: absolute;
width: 40px;
height: 4px;
background-color: var(--kleur-tekst-licht);
border-radius: 2px;
-webkit-transition: 0.3s;
transition: 0.3s;
}
.headerNavMobielSwitch .navMobielBar1 {
top: 0px;
}
.headerNavMobielSwitch .navMobielBar2 {
top: 10px;
}
.headerNavMobielSwitch .navMobielBar3 {
top: 20px;
}
.headerNavMobielSwitchOpen .navMobielBar1 {
top: 10px;
-webkit-transform: rotate(-135deg);
transform: rotate(-135deg);
}
.headerNavMobielSwitchOpen .navMobielBar2 {
top: 10px;
opacity: 0;
}
.headerNavMobielSwitchOpen .navMobielBar3 {
top: 10px;
-webkit-transform: rotate(135deg);
transform: rotate(135deg);
}
.nieuwsListContainer .nieuwsListItem .nieuwsListItemBottom {
grid-template-columns: 1fr;
}
.nieuwsListContainer .nieuwsListItem .nieuwsListItemBottom .nieuwsListItemLeft {
width: 100% !important;
margin-bottom: 10px;
}
.nieuwsListContainer .nieuwsListItem .nieuwsListItemBottom .nieuwsListItemRight {
padding-left: 0;
}
.homeVerenigingenFull .homeVerenigingenTop h2 {
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
}
.homeVerenigingenFull .homeVerenigingenGrid {
grid-template-columns: 1fr 1fr;
grid-template-areas: "verenigingGridItem1 verenigingGridItem2" "verenigingGridItem3 verenigingGridItem4" "verenigingGridItem5 verenigingGridItem6";
grid-template-rows: 250px 250px 250px;
}
.homeVerenigingenFull .homeVerenigingenBottom .button {
-webkit-transform: translateY(40px);
transform: translateY(40px);
}
.homeBedrijvenFull .homeBedrijvenTop h2 {
-webkit-transform: translateY(-40px);
transform: translateY(-40px);
}
.homeBedrijvenFull .owl-stage .owl-item .homeBedrijvenSlideItem {
min-height: 275px;
}
.homeBedrijvenFull .yellowBox7 {
height: 260px;
}
.homeBedrijvenFull .yellowBox8 {
height: 260px;
}
.kolom-2-1 {
grid-template-columns: 1fr;
}
.kolom-1-2 {
grid-template-columns: 1fr;
}
.kolom-1-1-1 {
grid-template-columns: 1fr;
}
.mec-event-calendar-classic .mec-calendar-side .mec-calendar-table {
min-height: auto;
}
.haarhoesRuimtesContainer .haarhoesRuimteItem .haarhoesRuimteItemTop {
min-height: 360px;
}
.haarhoesBestuurTabel td {
font-size: 18px;
}
.verenigingGridContainer {
grid-template-columns: 1fr 1fr;
}
.bedrijvenGridContainer {
grid-template-columns: 1fr 1fr;
}
.werktSamenContainerBottom {
grid-template-columns: 1fr 1fr !important;
}
}
@media (max-width: 850px) {
.homeHeroFullWidth .heroTextContainer .heroTitle {
font-size: 70px !important;
}
.homeHeroFullWidth .heroTextContainer .heroTitle::before {
bottom: 8px;
}
.homeHeroFullWidth .heroTextContainer .heroTitle::after {
bottom: 8px;
}
.homeHeroFullWidth .heroTextContainer .heroPayOff {
font-size: 16px;
}
.heroFullWidth .heroTitle {
font-size: 70px !important;
}
.kolom-1-1 {
grid-template-columns: 1fr;
}
.kolom-1-1 .kolom1 {
margin-bottom: 50px;
}
.homeVerenigingenFull .homeVerenigingenGrid {
grid-template-rows: 200px 200px 200px;
}
.verenigingGridContainer {
grid-template-columns: 1fr 1fr;
grid-gap: 20px;
}
.verenigingGridContainer .verenigingGridItem .button {
width: 220px;
}
.werktSamenContainerBottom {
grid-template-columns: 1fr !important;
}
.bestandenContainerBottom {
grid-template-columns: 1fr 1fr;
}
.bedrijvenGridContainer {
grid-template-columns: 1fr 1fr;
grid-gap: 20px;
}
.bedrijvenGridContainer .bedrijfGridItem .button {
width: 220px;
}
.footerFullWidth .footerContainer .footerContainerTop {
grid-template-columns: 1fr 1fr;
grid-template-areas: "ftContact ftNav" "ftKalender ftKalender";
}
.footerFullWidth .footerContainer .footerContainerTop .footerKolom1 {
grid-area: ftContact;
}
.footerFullWidth .footerContainer .footerContainerTop .footerKolom2 {
grid-area: ftNav;
}
.footerFullWidth .footerContainer .footerContainerTop .footerKolom3 {
grid-area: ftKalender;
}
}
@media (max-width: 600px) {
.headerFullWidth {
padding: 10px 20px;
}
.headerFullWidth .headerLogoContainer {
padding-top: 4px;
}
.headerNavMobielSwitch {
top: 25px;
}
.headerNavContainer {
width: 300px;
right: -300px;
}
.homeHeroFullWidth .heroTextContainer .heroTitle {
font-size: 40px !important;
}
.homeHeroFullWidth .heroTextContainer .heroTitle::before {
bottom: 4px;
height: 3px;
left: 3px;
}
.homeHeroFullWidth .heroTextContainer .heroTitle::after {
bottom: 4px;
height: 3px;
right: 2px;
}
.homeHeroFullWidth .heroTextContainer .heroPayOff {
font-size: 12px;
}
.heroFullWidth .heroTitle {
font-size: 40px !important;
}
.homeVerenigingenFull .homeVerenigingenTop {
padding: 0 20px;
}
.homeVerenigingenFull .homeVerenigingenTop h2 {
-webkit-transform: translateY(-20px);
transform: translateY(-20px);
}
.homeVerenigingenFull .homeVerenigingenGrid {
grid-template-columns: 1fr;
grid-template-areas: "verenigingGridItem1" "verenigingGridItem2" "verenigingGridItem3" "verenigingGridItem4" "verenigingGridItem5" "verenigingGridItem6";
grid-template-rows: 250px 250px 250px 250px 250px 250px;
}
.homeVerenigingenFull .homeVerenigingenBottom .button {
-webkit-transform: translateY(40px);
transform: translateY(40px);
}
.homeVerenigingenFull .yellowBox3 {
width: 160px;
top: 200px;
}
.homeVerenigingenFull .yellowBox4 {
width: 140px;
top: 180px;
}
.homeVerenigingenFull .yellowBox5 {
width: 160px;
}
.homeVerenigingenFull .yellowBox6 {
width: 140px;
}
.homeBedrijvenFull .homeBedrijvenTop {
padding: 0 20px;
}
.homeBedrijvenFull .homeBedrijvenTop h2 {
-webkit-transform: translateY(-40px);
transform: translateY(-40px);
}
.homeBedrijvenFull .owl-stage .owl-item .homeBedrijvenSlideItem {
min-height: 250px;
}
.homeBedrijvenFull .yellowBox7 {
height: 200px;
width: 260px;
top: 170px;
}
.homeBedrijvenFull .yellowBox8 {
height: 200px;
width: 280px;
top: 190px;
}
.homeBedrijvenFull .homeAlleBedrijvenButton {
position: relative !important;
top: 0 !important;
left: 0 !important;
}
.haarhoesBestuurTabel tr {
display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: 30px;
grid-template-areas: "td1 td2" "td3 td3";
}
.haarhoesBestuurTabel tr td:nth-child(1) {
grid-area: td1;
font-weight: 700;
padding-bottom: 0;
}
.haarhoesBestuurTabel tr td:nth-child(2) {
grid-area: td2;
padding-bottom: 0;
}
.haarhoesBestuurTabel tr td:nth-child(3) {
grid-area: td3;
padding-bottom: 30px;
}
.haarhoesBestuurTabel tr:first-child {
display: none;
}
.verenigingGridContainer {
grid-template-columns: 1fr;
}
.verenigingGridContainer .verenigingGridItem {
margin-bottom: 40px;
}
.singleVerenigingInhoudFullWidth .verenigingContactContainer {
padding: 10px;
}
.singleVerenigingInhoudFullWidth .verenigingContactContainer .verenigingContactTabel {
border: 0px;
}
.singleVerenigingInhoudFullWidth .verenigingContactContainer .verenigingContactTabel tr {
height: 34px;
}
.singleVerenigingInhoudFullWidth .verenigingContactContainer .verenigingContactTabel td {
height: 34px;
font-size: 16px;
}
.singleVerenigingInhoudFullWidth .verenigingContactContainer .verenigingContactTabel tr td:first-child {
width: 160px;
font-weight: 700;
}
.bestandenContainerBottom {
grid-template-columns: 1fr;
}
.bedrijvenGridContainer {
grid-template-columns: 1fr;
}
.bedrijvenGridContainer .bedrijfGridItem {
margin-bottom: 40px;
}
.fotoCollageOverNoordijk {
grid-template-columns: 1fr;
grid-template-rows: 200px 200px 200px 200px;
grid-template-areas: none;
}
.fotoCollageOverNoordijk .fotoCollage1 {
grid-area: auto;
}
.fotoCollageOverNoordijk .fotoCollage2 {
grid-area: auto;
}
.fotoCollageOverNoordijk .fotoCollage3 {
grid-area: auto;
}
.fotoCollageOverNoordijk .fotoCollage4 {
grid-area: auto;
}
.footerFullWidth .footerContainer .footerContainerTop {
grid-template-columns: 1fr !important;
grid-template-areas: none !important;
}
.footerFullWidth .footerContainer .footerContainerTop .footerKolom1 {
grid-area: auto;
margin-bottom: 40px;
}
.footerFullWidth .footerContainer .footerContainerTop .footerKolom2 {
grid-area: auto;
margin-bottom: 40px;
}
.footerFullWidth .footerContainer .footerContainerTop .footerKolom3 {
grid-area: auto;
margin-bottom: 40px;
}
.footerFullWidth .footerContainer .footerContainerBottom {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.footerFullWidth .yellowBox9 {
width: 260px;
}
.footerFullWidth .yellowBox10 {
width: 240px;
}
}.owl-carousel,.owl-carousel .owl-item{-webkit-tap-highlight-color:transparent;position:relative}.owl-carousel{display:none;width:100%;z-index:1}.owl-carousel .owl-stage{position:relative;-ms-touch-action:pan-Y;touch-action:manipulation;-moz-backface-visibility:hidden}.owl-carousel .owl-stage:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}.owl-carousel .owl-stage-outer{position:relative;overflow:hidden;-webkit-transform:translate3d(0,0,0)}.owl-carousel .owl-item,.owl-carousel .owl-wrapper{-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0)}.owl-carousel .owl-item{min-height:1px;float:left;-webkit-backface-visibility:hidden;-webkit-touch-callout:none}.owl-carousel .owl-item img{display:block;width:100%}.owl-carousel .owl-dots.disabled,.owl-carousel .owl-nav.disabled{display:none}.no-js .owl-carousel,.owl-carousel.owl-loaded{display:block}.owl-carousel .owl-dot,.owl-carousel .owl-nav .owl-next,.owl-carousel .owl-nav .owl-prev{cursor:pointer;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel .owl-nav button.owl-next,.owl-carousel .owl-nav button.owl-prev,.owl-carousel button.owl-dot{background:0 0;color:inherit;border:none;padding:0!important;font:inherit}.owl-carousel.owl-loading{opacity:0;display:block}.owl-carousel.owl-hidden{opacity:0}.owl-carousel.owl-refresh .owl-item{visibility:hidden}.owl-carousel.owl-drag .owl-item{-ms-touch-action:pan-y;touch-action:pan-y;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-grab{cursor:move;cursor:grab}.owl-carousel.owl-rtl{direction:rtl}.owl-carousel.owl-rtl .owl-item{float:right}.owl-carousel .animated{animation-duration:1s;animation-fill-mode:both}.owl-carousel .owl-animated-in{z-index:0}.owl-carousel .owl-animated-out{z-index:1}.owl-carousel .fadeOut{animation-name:fadeOut}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.owl-height{transition:height .5s ease-in-out}.owl-carousel .owl-item .owl-lazy{opacity:0;transition:opacity .4s ease}.owl-carousel .owl-item .owl-lazy:not([src]),.owl-carousel .owl-item .owl-lazy[src^=""]{max-height:0}.owl-carousel .owl-item img.owl-lazy{transform-style:preserve-3d}.owl-carousel .owl-video-wrapper{position:relative;height:100%;background:#000}.owl-carousel .owl-video-play-icon{position:absolute;height:80px;width:80px;left:50%;top:50%;margin-left:-40px;margin-top:-40px;background:url(//noordijksite.nl/wp-content/themes/Noordijksite-theme/css/owl.video.play.png) no-repeat;cursor:pointer;z-index:1;-webkit-backface-visibility:hidden;transition:transform .1s ease}.owl-carousel .owl-video-play-icon:hover{-ms-transform:scale(1.3,1.3);transform:scale(1.3,1.3)}.owl-carousel .owl-video-playing .owl-video-play-icon,.owl-carousel .owl-video-playing .owl-video-tn{display:none}.owl-carousel .owl-video-tn{opacity:0;height:100%;background-position:center center;background-repeat:no-repeat;background-size:contain;transition:opacity .4s ease}.owl-carousel .owl-video-frame{position:relative;z-index:1;height:100%;width:100%}.owl-theme .owl-dots,.owl-theme .owl-nav{text-align:center;-webkit-tap-highlight-color:transparent}.owl-theme .owl-nav{margin-top:10px}.owl-theme .owl-nav [class*=owl-]{color:#FFF;font-size:14px;margin:5px;padding:4px 7px;background:#D6D6D6;display:inline-block;cursor:pointer;border-radius:3px}.owl-theme .owl-nav [class*=owl-]:hover{background:#869791;color:#FFF;text-decoration:none}.owl-theme .owl-nav .disabled{opacity:.5;cursor:default}.owl-theme .owl-nav.disabled+.owl-dots{margin-top:10px}.owl-theme .owl-dots .owl-dot{display:inline-block;zoom:1}.owl-theme .owl-dots .owl-dot span{width:10px;height:10px;margin:5px 7px;background:#D6D6D6;display:block;-webkit-backface-visibility:visible;transition:opacity .2s ease;border-radius:30px}.owl-theme .owl-dots .owl-dot.active span,.owl-theme .owl-dots .owl-dot:hover span{background:#869791}