Voeg je header hier toe

Welcome to our website! We are thrilled to share with you everything we are passionate about. From our exceptional products and services to our engaging and informative content, we strive to deliver a top-notch experience that isw both enriching and enjoyable. Our mission is to provide you with the tools, resources, and knowledge to help you achieve your goals and enhance your overall quality of life. Whether you are browsing for inspiration, seeking solutions to a specific challenge, or just looking to connect with like-minded individuals, we have something special in store for you. We invite you to explore our site and discover all that we have to offer. Thank you for choosing us as your go-to destination for inspiration and growth.

In de customizer kun je de headings & fonts aanpassen dus niet in de globalsettings!

Brand-Primair

Brand-Secondair

Tekst

Accent

Donkergrijs

Mediumgrijs

Lichtgrijs

Taupegrijs

Pas de Brand colors naar de klant aan, verder staan er diveren grijstinten voor backgrounds en basis kleuren mocht je wat willen proberen of gebruiken.

Container paddings & responsive

Door de onderstaande style te plakken in custom css kunnen we elke container dezelfde paddings geven maar ook de afstand in responsive dit omdat alles in percentage is opgebouwd. Met dank aan Rino van Living in pixels.

voor deze sectie heb ik dit gebruikt: c-box pad-tb-6

html, body {
overflow-x: hidden;
width: 100%;
}
/* Overige css*/

/* CONTAINER BOXED LAYOUT*/
/* Ultra wide */
@media (max-width: 3840px) {
.c-box {–content-width: 55%;}}
/* Desktop */
@media (max-width: 1920px) {
.c-box {–content-width: 65%;}}
/* Laptop big */
@media (max-width: 1600px) {
.c-box {–content-width: 74%;}}
/* Laptop small */
@media (max-width: 1366px) {
.c-box {–content-width: 77%;}}
/* Tablet portrait */
@media (max-width: 1200px) {
.c-box {–content-width: 80%;}}
/* Mobile */
@media (max-width: 767px) {
.c-box {–content-width: 85%;}}

/* Padding all sides */
.pad-1{padding: clamp(0.75rem, 0.6923rem + 0.2564vw, 1rem);}
.pad-2{padding: clamp(1.5rem, 1.3846rem + 0.5128vw, 2rem);}
.pad-3{padding: clamp(2rem, 1.7692rem + 1.0256vw, 3rem);}
.pad-4{padding: clamp(3rem, 2.7692rem + 1.0256vw, 4rem);}

/* Padding Top & Bottom */
.pad-tb-1{
padding-top: clamp(0.5rem, 0.38458rem + 0.513vw, 1rem);
padding-bottom: clamp(0.5rem, 0.38458rem + 0.513vw, 1rem);}
.pad-tb-2{
padding-top: clamp(1rem, 0.76915rem + 1.026vw, 2rem);
padding-bottom: clamp(1rem, 0.76915rem + 1.026vw, 2rem);}
.pad-tb-3{
padding-top: clamp(2rem, 1.76915rem + 1.026vw, 3rem);
padding-bottom: clamp(2rem, 1.76915rem + 1.026vw, 3rem);}
.pad-tb-4{
padding-top: clamp(3rem, 2.76915rem + 1.026vw, 4rem);
padding-bottom: clamp(3rem, 2.76915rem + 1.026vw, 4rem);}
.pad-tb-5{
padding-top: clamp(4rem, 3.76915rem + 1.026vw, 5rem);
padding-bottom: clamp(4rem, 3.76915rem + 1.026vw, 5rem);}
.pad-tb-6{
padding-top: clamp(5rem, 4.76915rem + 1.026vw, 6rem);
padding-bottom: clamp(5rem, 4.76915rem + 1.026vw, 6rem);}
.pad-tb-8{
padding-top: clamp(7rem, 6.76915rem + 1.026vw, 8rem);
padding-bottom: clamp(7rem, 6.76915rem + 1.026vw, 8rem);}
.pad-tb-10{
padding-top: clamp(9rem, 8.76915rem + 1.026vw, 10rem);
padding-bottom: clamp(9rem, 8.76915rem + 1.026vw, 10rem);}