@charset "UTF-8";
:root {
--header-height: 100px;
--background-body: #e6e0d5;
--main-color: #c98b48;
--second-color: #bc3641;
--hover-color: #bc3641;
--cta-color: #d5973c;
--text-color: #272727;
--second-text-color: #ffffff;
--font-size: 18px;
--line-height: 30.6px;
--font-size-mobile: 16px;
--line-height-mobile: 27.2px;
--padding-vertical: 85px;
--padding-horizontal: 40px;
}
.logo {
width: 475px !important;
}
 html, body {
line-height: var(--line-height-mobile);
font-family: "Open Sans", sans-serif;
color: #1a171b;
font-weight: 300;
font-size: var(--font-size) !important;
overflow-x: hidden;
scroll-behavior: smooth;
font-display: auto; }
header {
position: relative;
width: 100%;
padding: 0px;
z-index: 12;
background: #e6e0d5;
}
header .container {
position: initial;
}
header .logo {
position: relative;
display: block;
z-index: 9999;
height: 100px;
max-width: 100%;
margin-bottom: 0px;
margin-top: -9px;
}
header .logo-negativ {
display: none;
}
header .ml-right {
position: relative;
z-index: 100;
}
header:after {
content: "";
position: absolute;
bottom: -85px;
left: 0px;
background: #e6e0d5;
background: linear-gradient(0deg, rgba(230, 224, 213, 0) 2%, #e6e0d5 100%);
width: 100%;
height: 85px;
}
.navline {
position: relative;
width: 100%;
max-width: 1600px;
margin-right: auto;
margin-left: auto;
}
.navline::after {
content: "";
position: absolute;
display: block;
background: #000;
height: 3px;
top: 89px;
width: 75%;
right: -30px;
}
.navline::before {
content: "";
position: absolute;
display: block;
background: #000;
height: 3px;
top: 89px;
width: 40px;
left: -100px;
}
.invert {
-webkit-filter: grayscale(1) invert(1) contrast(8);
filter: grayscale(1) invert(1) contrast(8);
}
.searchicon {
height: 21px;
margin-top: -2px;
margin-right: 8px;
}
.topical {
padding: 9px 0;
margin: 35px 0;
font-weight: bold;
color: #0b131a;
border-top: 1px #F4F4F4 solid;
border-bottom: 1px #F4F4F4 solid;
transition: 0.2s ease-in-out all;
}
.topical i {
margin-left: 0;
opacity: 0;
color: var(--cta-color);
transition: 0.2s ease-in-out all;
}
.topical:hover {
color: var(--cta-color);
transition: 0.2s ease-in-out all;
}
.topical:hover i {
margin-left: 15px;
opacity: 1;
transition: 0.2s ease-in-out all;
}
h1, h2, h3, h4, h5, h6 {
font-family: "Vollkorn", serif;
}
h2, h3, h4, h5, h6 {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
h4 {
font-weight: 500 !important;
}
.connectyou {
color: #eb2b40;
font-size: 20px;
font-family: "Vollkorn", serif;
}
.phone {
font-family: "Vollkorn", serif;
font-weight: bold;
font-size: 19px;
}
.themelight .logo {
display: none;
}
.themelight .logo-negativ {
display: block;
}
.themelight .navbar .navbar-nav .nav-link {
color: var(--second-text-color);
}
.themelight .bel {
color: var(--second-text-color);
}
.themelight .bel strong {
color: var(--second-text-color);
}
.themelight .bg .caption h1 {
color: var(--second-text-color);
}
.themelight .bg .caption p {
color: var(--second-text-color);
}
.themelight .bg::after {
content: "";
position: absolute;
bottom: 0;
height: 550px;
width: 100%; background: -moz-linear-gradient(top, rgba(68, 71, 101, 0) 0%, rgba(68, 71, 101, 0.7) 100%); background: -webkit-linear-gradient(top, rgba(68, 71, 101, 0) 0%, rgba(68, 71, 101, 0.7) 100%); background: linear-gradient(to bottom, rgba(68, 71, 101, 0) 0%, rgba(68, 71, 101, 0.7) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00081033", endColorstr="#f20c2e49", GradientType=0); opacity: 0.75 !important;
}
.themelight .no-shadow {
background-blend-mode: inherit;
}
.themelight .no-shadow::before {
background: rgba(0, 0, 0, 0.1);
}
.orange-overlay::after {
content: "";
background: #e49413;
background: linear-gradient(105deg, #e49413 0%, #e77129 45%, #e95e31 73%, #eb2b40 100%);
width: 100%;
height: 100% !important;
position: absolute;
opacity: 0.8 !important;
top: 0;
left: 0;
}
.certificaat {
display: inline-block;
padding: 6px;
margin-left: 15px;
}
.certificaat img {
width: 175px;
filter: grayscale(100%);
}
.reversed {
background: #fff;
}
a {
color: inherit;
}
a:hover {
color: inherit;
text-decoration: none;
transition: 0.2s ease-in-out all;
}
p a {
font-weight: 500;
}
p a:hover {
color: var(--cta-color);
text-decoration: underline;
}
.sidebar {
list-style: none;
padding: 0;
}
.sidebar li {
margin: 7px 0;
width: 100%;
}
.sidebar a {
display: block;
padding: 15px 25px;
border-radius: 4px;
text-decoration: none;
width: 100%;
transition: 0.2s ease-in-out all;
}
.sidebar a:hover {
color: #fff !important;
text-decoration: none !important;
padding-left: 30px;
}
.sidebar .light {
background: #f8f3f0 !important;
}
.sidebar .light:hover {
color: var(--text-color) !important;
}
.sidebar .orange {
background: #272727;
color: #fff;
}
.sidebar .blue {
background: var(--second-color);
color: #fff;
}
.numbers span {
display: block;
font-size: 45px;
margin-bottom: 15px;
font-weight: bold;
}
.blocks-gallery-item {
margin: 15px 0;
}
.blocks-gallery-item img {
border-radius: 6px;
}
.highlight {
border-left: 2px #E5E4E2 solid;
padding-left: 30px;
}
.highlight img {
height: 160px;
border-radius: 6px;
margin-bottom: 15px;
width: 100%;
object-fit: cover;
object-position: center;
}
.infoblock {
display: block;
position: relative;
color: #fff;
height: 375px;
border-radius: 7px;
align-items: end;
overflow: hidden;
}
.infoblock .photo-container {
position: relative;
height: 100%;
width: 100%;
border-radius: 7px;
background-size: cover !important;
background-position: center center;
}
.infoblock .photo-container .figure {
position: absolute;
top: 0;
height: 100%;
width: 100%;
background-size: cover !important;
background-position: center center !important;
margin: 0;
transition: 0.2s ease-in-out all;
}
.infoblock .infoblock-inner {
position: absolute;
padding: 30px 110px 30px 35px;
bottom: 0;
z-index: 3;
}
.infoblock:before {
content: "";
position: absolute;
width: 100%;
height: 100%;
z-index: 2;
bottom: 0;
left: 0;
border-radius: 7px;
background-image: linear-gradient(219deg, rgba(0, 0, 0, 0) 5%, rgba(0, 0, 0, 0.6) 100%);
opacity: 0.95;
}
.infoblock:hover {
color: #fff;
}
.infoblock:hover .figure {
transform: scale(1.05);
transition: 0.2s ease-in-out all;
}
.infoblock:hover .btn-block {
opacity: 1;
transition: 0.2s ease-in-out all;
}
.infoblock h4 {
color: #fff;
}
.overlay {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.8);
z-index: 9;
display: none;
}
.btn-block {
height: 49px;
width: 49px;
border-radius: 3px;
background: #fff;
position: absolute;
right: 20px;
bottom: 20px;
padding: 10px;
padding-left: 14px;
opacity: 0;
transition: 0.2s ease-in-out all;
}
.btn-block img {
height: 16px;
transition: 0.2s ease-in-out all;
}
.mainblog_container {
position: relative;
margin-bottom: 30px;
min-height: 350px;
}
.mainblog {
position: absolute !important;
width: 100%;
}
.mainblog .blog-content {
padding: 15px !important;
padding-top: 50px !important;
}
.mainblog .blog-photo {
height: 100%;
background-size: cover !important;
background-position: center center !important;
}
.readmore {
font-weight: bold;
color: var(--cta-color);
}
.video-container {
border-radius: 10px;
overflow: hidden;
}
.video-container .video {
position: relative;
height: 375px;
width: 100%;
background-size: cover !important;
background-position: center center !important;
}
.cta-small-img {
position: absolute;
top: -115px;
max-height: 250px;
}
.blog-container {
margin-bottom: 30px;
}
.blog {
position: relative;
background: #fff;
height: 100%;
display: block;
box-shadow: -5px 5px 15px rgba(0, 0, 0, 0.06);
text-decoration: none;
color: var(--text-color);
}
.blog .blog-content {
padding: 35px 30px;
padding-bottom: 50px;
}
.blog .btn-block {
opacity: 1;
}
.blog .blog-photo {
overflow: hidden;
width: 100%;
}
.blog .blog-photo img {
transition: all 0.21s;
width: 100%;
}
.blog:hover img {
transform: scale(1.1);
transition: all 0.21s;
}
.blog:hover h4 {
color: var(--cta-color);
}
.blog:hover .btn-block {
background: var(--cta-color);
transition: 0.2s ease-in-out all;
}
.blog:hover .btn-block img {
transform: scale(1);
transition: 0.2s ease-in-out all;
-webkit-filter: grayscale(1) invert(1) contrast(0) brightness(200);
filter: grayscale(1) invert(1) contrast(0) brightness(200);
}
.wp-block-separator {
border-color: #eee !important;
}
.photo-container figure {
height: 40vh;
background-size: cover !important;
background-position: center center !important;
margin: 0px;
}
.photob {
background-size: cover !important;
background-position: center center !important;
border-radius: 6px;
margin-top: 60px;
}
.uitgelicht {
height: 360px;
margin-bottom: 60px;
}
.uitgelicht .block {
position: relative;
margin-top: 60px;
border-radius: 6px;
z-index: 4;
}
.uitgelicht .bg-orange {
background: var(--main-color);
}
.uitgelicht .infoblock h4 {
color: #fff;
}
.bel {
color: var(--text-color);
display: inline-block;
line-height: 28px;
margin: 0px auto;
}
.bel strong {
color: var(--text-color);
display: block;
font-weight: bold;
line-height: 30px;
font-size: 0.9rem;
}
.z3 {
position: relative;
padding-left: 2px;
z-index: 3;
}
.whitepaper-wrapper .whitepaper {
padding: var(--padding-vertical) var(--padding-horizontal);
}
.diensten .dienst-wrapper {
margin-bottom: 30px;
}
.diensten .dienst-wrapper .photo {
position: relative;
}
.diensten .dienst-wrapper .photo::after {
content: "";
position: absolute;
bottom: 0px;
height: 250px;
width: 100%; background: -moz-linear-gradient(top, rgba(56, 65, 133, 0) 0%, rgba(56, 65, 133, 0.7) 100%); background: -webkit-linear-gradient(top, rgba(56, 65, 133, 0) 0%, rgba(56, 65, 133, 0.7) 100%); background: linear-gradient(to bottom, rgba(56, 65, 133, 0) 0%, rgba(56, 65, 133, 0.7) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00081033", endColorstr="#f20c2e49", GradientType=0); opacity: 0.5;
}
.diensten .dienst-wrapper .dienst {
display: block;
height: 100%;
padding: var(--padding-vertical) var(--padding-horizontal);
transition: 0.3s ease-in-out all;
}
.diensten .dienst-wrapper .dienst ul {
list-style: none;
margin: 0px;
margin-top: 25px;
padding: 0px;
}
.diensten .dienst-wrapper .dienst ul li {
font-size: 1.2rem;
color: #7F888A;
margin-bottom: 10px;
}
.diensten .dienst-wrapper:hover .dienst {
background: var(--cta-color);
transition: 0.3s ease-in-out all;
}
.diensten .dienst-wrapper:hover .dienst h3 {
color: var(--second-text-color);
}
.diensten .dienst-wrapper:hover .dienst ul li {
color: var(--second-text-color);
}
.videobtn {
display: none !important;
color: #fff;
}
.videobtn i {
color: #fff;
display: inline-block;
height: 75px;
width: 75px;
margin-right: 25px;
border-radius: 50%;
border: 3px #fff solid;
padding: 25px 26px;
margin-bottom: 15px;
}
.container {
width: 100%;
max-width: 1432px;
}
video {
background: black;
}
.animationstep span {
display: block;
color: var(--cta-color);
font-size: 1.1rem;
margin-bottom: 5px;
}
.animationprocess {
background-repeat: no-repeat !important;
background-position: center center !important;
}
.orange-title {
color: var(--text-color);
}
#cn-accept-cookie {
border-radius: 0px !important;
background: var(--cta-color) !important;
float: right !important;
}
#cn-notice-text {
width: calc(100% - 180px);
text-align: left;
}
.cn-close-icon {
top: 29px !important;
}
.impress figure {
margin-bottom: 20px;
}
#cookie-notice {
background: var(--main-color);
z-index: 9999999999 !important;
font-family: inherit !important;
font-size: 17px !important;
line-height: 26px !important;
}
#cookie-notice .cn-button {
margin: 0 0 0 15px !important;
padding: 15px 30px !important;
font-size: 17px !important;
}
#cookie-notice #cn-notice-text {
padding-right: 100px;
}
#cookie-notice #cn-accept-cookie {
margin-top: 15px !important;
text-transform: uppercase;
padding: 15px 60px !important;
margin-bottom: 0 !important;
}
[type=button], [type=reset], [type=submit], button {
-webkit-appearance: none !important;
}
.cn-buttons-container, .cn-text-container {
margin: 0 !important;
}
.cookie-notice-container {
margin: 0 auto;
width: 100%;
max-width: 1500px;
}
#cn-refuse-cookie {
background: transparent;
}
.container-large {
width: 100%;
max-width: 1600px;
}
.container-100 {
max-width: 100%;
padding: 0px 15px;
}
.inhoud a {
color: var(--cta-color);
font-weight: 700;
text-decoration: underline;
}
.inhoud a:hover {
color: var(--main-color);
}
.inhoud p {
margin-bottom: 20px !important;
}
.inhoud .intro p {
margin-bottom: 0px !important;
}
.inhoud .btn {
text-decoration: none;
}
.intro {
font-size: 1.2rem;
line-height: 1.85rem;
color: var(--text-color);
}
strong {
font-size: 1rem;
color: var(--text-color);
}
.height {
height: 100%;
}
.bg-cta {
background: var(--cta-color) !important;
color: var(--second-text-color) !important;
}
.bg-cta h3 {
color: var(--second-text-color) !important;
}
.no-shadow::after {
display: none;
}
.banner {
position: relative;
height: 80vh;
background-color: var(--main-color);
background-size: cover !important;
background-position: center center !important;
}
.banner:before {
position: absolute;
content: "";
height: 100% !important;
bottom: 0px;
width: 100% !important;
background: rgba(39, 39, 39, 0.6) !important;
opacity: 0.4 !important;
}
.banner:after {
content: "";
position: absolute;
bottom: 0px;
left: 0px;
width: 100%;
background: #272727;
background: linear-gradient(0deg, #272727 0%, rgba(39, 39, 39, 0) 69%);
height: 300px;
}
.banner .btn-cta {
color: #fff !important;
}
.banner .btn-cta:hover {
color: var(--cta-color) !important;
}
.banner h1 {
color: #fff;
}
.banner .banner-content {
position: relative;
z-index: 9;
color: #fff;
}
.banner .banner-content span {
font-size: 48px;
display: block;
font-weight: 700;
}
.banner .banner-content .cijfer {
margin-bottom: 8px;
}
.cijfer {
font-size: 40px;
font-weight: bold;
}
.banner-small {
height: 60vh;
}
.banner-small .banner-content {
margin-left: 100px;
}
.bg-grey {
position: relative;
background-color: #9A9393;
}
.bg-grey h1, .bg-grey h2, .bg-grey h3, .bg-grey h4 {
color: #FFF1D8;
}
.bg-grey .photo {
height: 215px;
}
.bg-grey .diensten .dienst {
padding: 30px 35px 75px 35px;
}
.bg-grey .diensten .dienst h1, .bg-grey .diensten .dienst h2, .bg-grey .diensten .dienst h3, .bg-grey .diensten .dienst h4 {
color: #272727;
font-family: "Open Sans", sans-serif;
}
.bg-grey .borderrad {
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}
.bg-countries {
background-image: url(//horseservice.com/wp-content/themes/landingspage/images/wordlwide_image.png);
background-repeat: no-repeat;
background-size: cover !important;
background-position: center center !important;
}
.bg-countries .btnzwart {
background: #272727 !important;
padding: 15px 50px !important;
margin-left: 15px;
font-weight: 500;
}
.bg-countries .btnzwart i {
margin-right: 8px;
}
.bg-countries .diensten .dienst-wrapper:hover .dienst {
border-bottom-left-radius: 5px !important;
border-bottom-right-radius: 5px !important;
}
.bg-countries .btnlicht {
background: #E6E0D5 !important;
padding: 15px 50px !important;
border: 0px;
margin-left: 15px;
color: #272727;
font-weight: 500;
}
.bg-countries .btnlicht i {
margin-right: 8px;
}
.bg-yellow {
background: #FFF1D8;
}
.bg-dark {
position: relative;
background-color: #272727 !important;
color: var(--second-text-color) !important;
}
.bg-dark .intro {
color: var(--second-text-color) !important;
font-family: "Vollkorn", serif;
}
.bg-dark::before {
position: absolute;
bottom: 0px;
height: 50%;
width: 100%;
content: "";
left: 0px;
opacity: 0.4; background: -moz-linear-gradient(top, rgba(32, 32, 32, 0) 0%, rgba(32, 32, 32, 0.7) 100%); background: -webkit-linear-gradient(top, rgba(32, 32, 32, 0) 0%, rgba(32, 32, 32, 0.7) 100%); background: linear-gradient(to bottom, rgba(32, 32, 32, 0) 0%, rgba(32, 32, 32, 0.7) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00081033", endColorstr="#f20c2e49", GradientType=0); }
.bg-dark h1, .bg-dark h2, .bg-dark h3 {
color: #FFF1D8 !important;
}
.bg-dark h4 {
color: #fff;
}
.bg-dark strong {
color: #fff;
}
.bg-dark .breadcrumb a {
color: #fff;
}
@keyframes fadeInDown {
0% {
height: 0;
}
100% {
height: 100vh;
}
}
@keyframes fadeInContainer {
0% {
opacity: 0;
}
50% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.dienstenmenu {
display: none;
position: fixed;
top: 0px;
left: 0px;
height: 100%;
width: 100%;
z-index: 10;
background: #cec2ac;
-webkit-animation: fadeInDown 0.5s ease-in-out;
animation: fadeInDown 0.5s ease-in-out;
}
.dienstenmenu .container {
-webkit-animation: fadeInContainer 1s ease-in-out;
animation: fadeInContainer 1s ease-in-out;
}
.dienstenmenu:after {
position: absolute;
bottom: 0px;
content: "";
height: 50%;
width: 100%;
opacity: 0.3;
background: -moz-linear-gradient(top, rgba(32, 32, 32, 0) 0%, rgba(32, 32, 32, 0.7) 100%); background: -webkit-linear-gradient(top, rgba(32, 32, 32, 0) 0%, rgba(32, 32, 32, 0.7) 100%); background: linear-gradient(to bottom, rgba(32, 32, 32, 0) 0%, rgba(32, 32, 32, 0.7) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00081033", endColorstr="#f20c2e49", GradientType=0); }
.dienstenmenu .navbar-nav {
z-index: 3;
position: relative;
}
.dienstenmenu .nav-link {
color: #272727;
font-size: 2.8rem;
font-weight: bold;
line-height: 3.5rem;
cursor: pointer;
transition: 0.3s ease-in-out all;
}
.dienstenmenu .nav-link:hover {
color: var(--second-color) !important;
transition: 0.3s ease-in-out all;
}
.dienstenmenu .active .nav-link {
color: var(--cta-color) !important;
}
.dienstenmenu .contactinfo {
color: var(--second-text-color);
border-left: 1px rgba(0, 0, 0, 0.25) solid;
padding: var(--padding-horizontal);
line-height: 38px;
}
.dienstenmenu .contactinfo p {
opacity: 0.9;
color: #272727;
}
.dienstenmenu .contactinfo strong {
color: #272727;
}
.division .blog-photo {
overflow: hidden;
border-top-left-radius: 8px;
border-top-right-radius: 8px;
height: 255px;
background-size: cover !important;
background-position: center center !important;
}
.division .logo {
padding: 20px;
}
.icon-hsi {
height: 150px;
max-width: 135px;
margin-bottom: 40px;
}
.numbers .hsicontainer {
margin-bottom: 30px;
}
.keus {
position: relative;
display: block;
padding: 40px 50px;
padding-right: var(--padding-vertical);
border-radius: 6px;
text-decoration: none;
box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 15px;
}
.keus p {
margin: 0px;
}
.keus strong {
display: block;
margin-bottom: 5px;
}
.keus:hover .btn-block {
opacity: 1;
transition: 0.2s ease-in-out all;
}
.supplier {
display: block;
position: relative;
margin-bottom: 30px;
border-radius: 10px;
border: 1px #F0F4F8 solid;
height: calc(100% - 30px);
}
.supplier .photo-container {
overflow: hidden;
width: 100%;
height: 325px;
display: block;
border-top-right-radius: 10px;
}
.supplier figure {
position: relative;
display: block;
padding: 0px;
margin: 0px;
width: 100%;
background-size: cover !important;
height: 100%;
margin-bottom: 25px;
transition: 0.3s ease-in-out all;
}
.supplier figure::before {
content: "";
position: absolute;
width: 100%;
height: 100%;
bottom: 0;
left: 0;
border-radius: 0px;
background-image: linear-gradient(219deg, rgba(9, 50, 66, 0) 5%, #093242 100%);
opacity: 0.4;
}
.supplier .supplier-image-wrapper {
height: 90px;
display: flex;
margin-bottom: 25px;
align-items: center;
justify-content: center;
}
.supplier .inner {
position: relative;
z-index: 2;
padding: 30px 30px 50px 30px;
}
.supplier .btn-block {
background: transparent;
bottom: 10px;
opacity: 0;
}
.supplier .btn-block img {
padding: 0;
}
.supplier h4 {
font-size: 35px;
}
.supplier::before {
opacity: 0;
content: "";
width: 100%;
height: 60%;
position: absolute;
bottom: 0;
left: 0;
transition: 0.3s ease-in-out all; background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 100%); background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 100%); background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.9) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00081033", endColorstr="#f20c2e49", GradientType=0); }
.supplier:hover::before {
opacity: 1;
transition: 0.2s ease-in-out all;
}
.supplier:hover figure {
transform: scale(1.1);
transition: 0.3s ease-in-out all;
}
.supplier:hover .btn-block {
opacity: 1;
}
.alert {
margin: 0px;
}
.supp-logo {
height: 110px;
max-width: 280px;
margin-bottom: 14px;
object-position: center;
object-fit: contain;
}
.keusbig {
padding: 50px 45px;
padding-right: 60px;
}
.klantLogo {
position: relative;
display: block;
background: #fff;
width: calc(50% - 1px);
height: 0px;
padding-bottom: calc(50% - 1px);
float: left;
transition: 0.3s ease-in-out all;
}
.klantLogo img {
position: relative;
display: block;
margin: 0px auto;
margin-top: 44%;
transform: translate(0%, -50%);
opacity: 0.55;
max-height: 110px;
max-width: 195px;
filter: grayscale(100%) brightness(1.2);
transition: 0.3s ease-in-out all;
}
.klantLogo:hover {
transition: 0.3s ease-in-out all;
}
.klantLogo:hover img {
opacity: 1;
filter: grayscale(0%) brightness(1);
transition: 0.2s ease-in-out all;
}
.overflow-h {
position: relative;
overflow-x: hidden;
height: 100%;
width: 100%;
}
.screen_container {
position: relative;
height: 100%;
width: 100%;
}
.screen_container:after {
position: absolute;
background: url(//horseservice.com/wp-content/themes/landingspage/images/screen_container.svg);
height: 100%;
width: 100%;
top: 0px;
left: 0px;
background-repeat: no-repeat;
}
.screen_container .screen {
position: absolute;
margin-top: 15px;
height: 100%;
min-height: 350px;
top: 0px;
left: 5px;
margin-left: 0px;
border: 17px #0b131a solid;
border-radius: 20px;
width: 100%;
background-size: cover !important;
background-position: top center !important;
}
.bigscreen {
width: 130%;
height: 100%;
}
.screenbig {
display: block;
height: 90vh;
min-height: 650px;
}
.visible-mobile {
display: block;
}
.visible-desktop {
display: none;
}
.z-index {
position: relative;
z-index: 9;
}
.titel {
color: var(--second-color) !important;
font-weight: bold;
}
.bgphoto {
height: 500px;
background-position: center center;
background-size: cover !important;
}
.wp-block-file {
text-align: center;
padding: 30px var(--padding-vertical);
margin: 0px auto;
background: #f6f5f1 !important;
}
.wp-block-file a {
display: block;
}
.wp-block-file .wp-block-file__button {
margin-top: 15px;
background: var(--cta-color) !important;
color: var(--second-text-color) !important;
font-weight: 600;
text-decoration: none;
}
.wp-block-file .wp-block-file__button:hover {
background: var(--main-color) !important;
color: var(--second-text-color) !important;
}
.firstsection {
padding-top: 200px;
}
main .inhoud, #main .inhoud {
padding-right: 60px;
}
main .inhoud strong, #main .inhoud strong {
font-weight: 800;
display: inline;
color: var(--main-color);
}
a.cta {
position: relative;
display: block;
padding: 60px 75px;
margin-bottom: 25px;
font-size: 23px;
color: var(--text-color);
line-height: 35px;
}
a.cta .speech {
max-height: 75px;
}
a.cta .btn-block {
bottom: 0px;
right: 0px;
}
a.cta .btn-block .btn-block {
bottom: 20px !important;
right: 30px !important;
}
a.cta:hover {
background-color: #f8f3f0 !important;
}
a.cta:hover .btn-block {
bottom: 0px;
right: 0px;
background: transparent;
}
a.cta:hover .btn-block {
opacity: 1;
transition: 0.2s ease-in-out all;
}
a.cta:hover .btn-block .btn-block {
bottom: 20px;
right: 30px;
background: var(--cta-color);
}
.totop {
margin-top: var(--padding-vertical);
}
.office .totop {
margin-top: -200px;
}
.office .photo-container {
height: 335px;
overflow: hidden;
border-radius: 6px;
margin-bottom: 20px;
}
.top {
padding: 10px 30px;
position: absolute;
top: 0px;
right: 0px;
width: 40%;
font-size: 17px;
border-bottom-left-radius: 8px;
}
.top a {
margin-right: 15px;
}
.top a:hover {
color: var(--cta-color);
}
.top .icon {
height: 24px;
margin-top: 2px;
display: inline-block;
margin-right: 6px;
margin-left: 15px;
}
.top .icon-webshop {
height: 26px;
margin-right: 2px;
margin-top: 0px;
}
.block {
position: relative;
padding: 30px;
}
.block .icoon {
max-height: 125px;
margin-top: 30px;
}
.block .icon-groot {
display: block;
padding: 30px;
max-height: 150px;
margin: 0px auto;
}
.block ul {
list-style: none;
padding: 0px;
}
.block ul li {
padding: 7px 0px;
font-weight: bold;
font-size: 1.1rem;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.block ul li:before {
content: "";
font-family: "Font Awesome 5 Pro";
font-weight: 400;
margin-right: 15px;
margin-top: 2px;
font-size: 17px;
display: block;
float: left;
}
.block ul li a {
font-weight: 500;
transition: 0.2s ease-in-out all;
}
.block ul li:hover a {
margin-left: 7px;
transition: 0.2s ease-in-out all;
}
.block-xl {
padding: 45px 35px;
}
.toright {
position: relative;
margin-right: -200px !important;
margin-left: 200px !important;
z-index: 5;
}
.inline {
display: inline-block;
}
.hamburger {
position: absolute;
right: 20px;
top: 74px;
font-size: 32px;
background: transparent !important;
-webkit-box-shadow: none !important;
-moz-box-shadow: none !important;
box-shadow: none !important;
}
.hamburger:before {
display: none !important;
-webkit-box-shadow: none !important;
-moz-box-shadow: none !important;
box-shadow: none !important;
}
.hamburger:after {
display: none !important;
-webkit-box-shadow: none !important;
-moz-box-shadow: none !important;
box-shadow: none !important;
}
.navbar-default {
-webkit-box-shadow: none !important;
-moz-box-shadow: none !important;
box-shadow: none !important;
}
.subnav-container {
padding-right: 50px;
margin-top: 15px;
margin-bottom: 20px;
}
.subnav-container h3 {
color: var(--cta-color);
font-size: 1.6rem;
font-weight: 500;
}
.subnav-container h4 {
font-size: 24px;
font-weight: 500;
}
.contact-txt {
color: #fff;
font-weight: 600;
}
.txt-request {
color: #FFF1D8;
font-size: 1.05rem;
font-weight: 600;
}
.countries-white {
color: #fff;
font-size: 1.05rem;
padding: 15px;
}
.countries-white i {
margin-right: 8px;
font-weight: 600;
}
.medewerker {
position: relative;
max-width: 1300px !important;
}
.medewerker .blog-photo {
height: 320px;
}
.medewerker .blog-photo img {
margin-top: -50px;
}
.medewerker .photo-medewerker {
display: block;
height: 400px;
width: 95%;
background-size: cover !important;
background-position: center center !important;
border-radius: 6px !important;
}
.medewerker h4 {
color: var(--cta-color);
font-size: 1.5rem;
font-weight: 500;
}
.medewerker .inner {
margin-left: 15px;
max-width: 780px;
color: #161615;
padding: 20px 0px;
border-radius: 6px !important;
}
.medewerker .cta {
margin-top: 75px;
padding: 30px 35px 35px 35px;
}
.medewerker strong {
display: block;
text-transform: uppercase;
color: var(--second-text-color);
font-weight: 500;
font-size: 1.7rem;
margin-top: 35px;
}
.medewerker .contact {
font-size: 1.2rem;
line-height: 2rem;
margin-top: 0px;
}
.medewerker .contact .custom-whatsapp {
margin-top: 10px;
font-weight: 500;
color: var(--main-color);
font-size: 1rem;
cursor: pointer;
line-height: 1.1rem;
}
.medewerker .contact .custom-whatsapp:hover {
text-decoration: underline;
}
.medewerker .contact .custom-whatsapp svg {
display: inline-block;
float: left;
margin-top: 4px;
margin-right: 10px;
height: 36px !important;
width: 36px !important;
}
.medewerker .contact a {
color: var(--text-color);
font-weight: bold;
}
.medewerker_img {
height: 130px;
width: 130px;
border-radius: 50%;
background-size: 125% !important;
background-position: 20% 15% !important;
}
.navbar-modal {
float: left;
}
.pageform {
margin-top: calc(var(--padding-vertical) / 2);
}
.pageform .block {
padding: var(--padding-vertical) var(--padding-horizontal);
max-width: 1100px !important;
margin: 0px auto;
}
.navbar {
padding: 0px;
position: inherit;
}
.navbar .navbar-nav .nav-link {
color: var(--text-color);
font-weight: 600;
padding: 0px 10px;
}
.navbar .navbar-nav .nav-link:hover {
color: var(--second-color);
}
.navbar .navbar-nav .dropdown {
position: inherit;
}
.navbar .navbar-nav .dropdown-menu {
width: 100%;
margin: 0px auto;
left: 0px;
right: 0px;
border-radius: 0px;
background: #fff;
padding: 60px 30px;
border: 0px;
border-top: 0px;
}
.navbar .navbar-nav .dropdown-menu a:before {
content: "";
margin-top: 7px;
margin-right: 6px;
height: 14px;
display: inline-block;
float: left;
background-size: 100%;
width: 20px;
background: url(//horseservice.com/wp-content/themes/landingspage/images/arrow.svg);
background-repeat: no-repeat;
}
.navbar .navbar-nav .dropdown-menu .dropdown-item {
padding: 0.35rem 0px;
transition: 0.2s ease-in-out all;
}
.navbar .navbar-nav .dropdown-menu .dropdown-item:hover {
background: #f8f3f0 !important;
padding: 0.35rem 10px;
border-radius: 5px;
transition: 0.2s ease-in-out all;
}
.navbar .navbar-nav .active .nav-link {
color: var(--second-color) !important;
}
.inherit {
position: inherit;
}
.inspringen {
padding-left: 50px;
padding-top: 15px;
}
.bg-white {
background: #fff;
}
.bg-orange {
background-color: var(--cta-color);
color: #fff;
}
.bg-orange h1, .bg-orange h2, .bg-orange h3, .bg-orange h4 {
color: #fff !important;
}
.bg-orange strong {
color: #fff !important;
margin-bottom: 5px;
}
.bg-orange a {
color: #fff;
}
.bg-orange:hover {
color: #fff;
}
a.bg-orange {
color: #fff !important;
}
a.bg-orange:hover {
background: var(--cta-color) !important;
}
a.bg-orange:hover span.btn-block {
background: #fff !important;
}
a.bg-request {
color: #fff !important;
background: var(--second-color);
}
a.bg-request h4 {
color: #fff;
}
a.bg-request:hover {
background: var(--second-color);
}
a.bg-request:hover span.btn-block {
background: #fff !important;
}
.photo-block {
background-size: cover !important;
background-position: center center !important;
}
.continue {
position: relative;
}
.continue:before {
content: "";
position: absolute;
height: 100%;
width: 50%;
top: 0px;
margin-left: 85%;
background: #f8f3f0;
}
.bellen {
margin-bottom: 5px;
}
.bellen i {
margin-right: 11px;
margin-left: 3px;
margin-top: 3px;
font-size: 22px;
display: inline-block;
color: var(--cta-color);
float: left;
}
.mailen i {
margin-right: 8px;
margin-top: 4px;
display: inline-block;
font-size: 20px;
color: var(--cta-color);
float: left;
}
.bg {
position: relative;
overflow: hidden;
height: 50vh;
min-height: 475px;
width: 100%;
background-size: 100% !important;
background-position: center center;
background-repeat: no-repeat;
}
.bg:before {
content: "";
position: absolute;
width: 100%;
height: 100%;
bottom: 0;
left: 0;
border-radius: 0px !important;
background-image: linear-gradient(219deg, rgba(39, 39, 39, 0) 5%, #272727 100%);
opacity: 0.4;
}
.bg:after {
content: "";
position: absolute;
bottom: 0px;
left: 0px;
width: 100%;
background: #272727;
background: linear-gradient(0deg, #272727 0%, rgba(39, 39, 39, 0) 69%);
height: 200px;
}
.bg .caption {
position: relative;
color: var(--second-text-color);
z-index: 7;
margin-left: 34px;
}
.bg .caption span {
color: var(--second-color) !important;
font-weight: bold;
}
.bg .caption .h1 {
color: #fff !important;
}
.bg .caption h1, .bg .caption h2 {
color: var(--second-text-color);
font-size: 2rem;
line-height: 45px;
text-shadow: rgba(0, 0, 0, 0.25) 0px 0px 7px;
}
.bg-medewerker {
background-size: 100% !important;
background-position: bottom center !important;
}
.bg-medewerker:before {
display: none;
}
.choose-us {
margin-top: var(--padding-horizontal);
}
.choose-us li {
padding: 17px 0px;
font-weight: bold;
list-style: none;
text-indent: -40px;
padding-left: 40px;
font-size: 1.1rem;
color: var(--text-color);
}
.choose-us li:before {
content: "";
font-family: "Font Awesome 5 Pro";
font-size: 0.75rem;
color: var(--cta-color);
margin-right: 25px;
}
.choose-us li a {
color: var(--cta-color);
text-decoration: underline;
}
.ml-right {
width: 275px;
margin-right: 0;
margin-left: auto;
}
.bg-light {
background: #f8f3f0 !important;
}
.bg-light .medewerker .inner {
background: #fff !important;
}
.wp-block-quote {
background: #f8f3f0 !important;
padding: 20px;
}
.wp-block-quote p {
font-weight: 600;
}
.wp-block-quote cite {
font-size: 0.9rem;
}
.btn-category {
display: block;
background-color: #fff;
margin-top: 0.5rem;
padding: 15px 25px;
border-radius: 4px;
margin-right: 0.5rem;
font-weight: bold;
color: var(--text-color);
}
.btn-category:hover {
background: var(--main-color);
color: #fff;
}
.btn-category:hover:after {
opacity: 1;
}
.btn-category:after {
content: "";
display: inline-block;
float: right;
width: 11px;
height: var(--line-height);
background-image: url(//horseservice.com/wp-content/themes/landingspage/images/arrow.svg);
background-size: contain;
background-position: center;
background-repeat: no-repeat;
filter: brightness(0) invert(1);
opacity: 0;
transition: all 0.4s ease;
}
.wp-block-table {
margin-bottom: 30px;
}
.wp-block-table td {
padding: 6px 15px;
}
.wp-block-table figcaption {
padding: 6px 15px;
}
.findproducts {
position: relative;
padding-bottom: 75px;
}
.findproducts .container {
padding: 0 49px;
position: relative;
z-index: 2;
}
.findproducts .productcategory-container {
margin-bottom: 10px;
}
.findproducts .productcategory {
display: block;
cursor: pointer;
background: #fff;
padding: 24px 15px;
border-radius: 6px;
height: 100%;
text-align: center;
margin-right: 10px;
padding-bottom: 34px;
font-weight: bold;
color: var(--text-color);
}
.findproducts .productcategory .icon {
max-height: 50px;
width: 75px;
display: block;
margin: 0px auto;
margin-bottom: 15px;
filter: contrast(0) brightness(1.3);
margin-top: 15px;
transition: 0.2s ease-in-out all;
}
.findproducts .productcategory:hover {
color: var(--main-color);
transition: 0.2s ease-in-out all;
}
.findproducts .productcategory:hover .icon {
transform: scale(1.06);
transition: 0.1s ease-in-out all;
filter: none;
}
.naarboven {
margin-top: -30px;
}
.nobefore:before {
display: none !important;
}
.bg-small {
min-height: 475px !important;
height: auto;
background-size: cover !important;
background-position: center center;
}
.bg-small #scrollDown {
display: none;
}
.bg-small .caption h1, .bg-small .caption h2 {
font-size: 2.5rem;
}
.bg-extra-small {
min-height: 345px !important;
height: 345px !important;
}
.blogbread .breadcrumb {
position: absolute;
bottom: -45px;
}
.aanbieding {
display: block;
font-size: 1.1rem;
}
.aanbieding strong {
color: #856404;
font-size: 1.15rem;
}
.text-cta {
color: var(--cta-color) !important;
font-weight: bold;
display: block;
margin-bottom: 15px;
}
.text-cta strong {
color: var(--cta-color) !important;
}
.product span {
color: var(--cta-color);
font-weight: bold;
display: block;
margin-bottom: 15px;
}
.product .price {
font-weight: bold;
color: var(--cta-color);
font-size: 1.75rem;
}
.footer-cta .btn {
margin-top: 15px;
}
.footer-cta ul {
list-style: none;
margin: 0px;
padding: 0px;
}
.footer-cta ul li {
padding: 5px 0px;
padding-left: 35px;
}
.footer-cta ul li:before {
content: "";
background: url(//horseservice.com/wp-content/themes/landingspage/images/check_icon.svg);
margin-right: 0px;
height: 24px;
float: left;
margin-left: -35px;
margin-top: 0px;
width: 24px;
display: inline-block;
background-position: center center;
background-repeat: no-repeat;
}
.bg-blog {
min-height: 375px !important;
height: 575px !important;
background-size: cover;
background-position: center;
}
.team {
background: transparent;
box-shadow: none;
margin-bottom: 30px;
}
.team .blog-photo {
height: 300px;
}
.team .blog-photo img {
max-width: none;
width: 100% !important;
}
.team .blog-content {
background: transparent;
padding: 15px 25px 15px 0px;
}
.team .blog-content h5 {
margin-bottom: 0px;
font-size: 19.5px;
}
.sidebar {
list-style: none;
margin: 10px 0px 0px 0px;
display: inline-block;
}
.sidebar img {
height: 23px;
margin-right: 13px;
}
.sidebar .speechicon {
height: 21px;
-webkit-filter: grayscale(1) invert(1) contrast(0) brightness(200);
filter: grayscale(1) invert(1) contrast(0) brightness(200);
}
.sidebar .searchicon {
height: 22px;
margin-left: 3px;
-webkit-filter: grayscale(1) invert(1) contrast(0) brightness(200);
filter: grayscale(1) invert(1) contrast(0) brightness(200);
}
.sidebar li {
margin-right: 40px;
display: list-item;
float: left;
}
.sidebar li a {
color: var(--text-color);
font-weight: 400 !important;
font-size: 1.05rem;
}
.sidebar li a:hover {
color: var(--cta-color);
text-decoration: underline;
}
.sidebar li a i {
margin-top: 4px;
color: var(--cta-color);
float: left;
margin-right: 13px;
font-size: 1.4rem;
}
.sidebar li .all {
color: var(--cta-color);
text-decoration: underline;
}
.bg-tiny {
height: 120px !important;
}
h1, h2, h3, h4, h5, h6 {
color: var(--text-color);
font-weight: 700;
}
h1 {
font-size: 2rem;
margin-bottom: 20px;
}
h2 {
font-size: 2rem;
margin-bottom: 15px;
}
h3 {
font-weight: 600;
font-size: 1.9rem;
}
.pr-6 {
padding-right: var(--padding-vertical);
}
.btn {
padding: 16px 30px !important;
border-radius: 35px !important;
margin-top: 25px;
font-size: 19px !important;
border: 0px;
line-height: 28px !important;
}
.btn:hover {
color: #fff !important;
background: var(--hover-color) !important;
}
.btn:hover .searchicon {
-webkit-filter: grayscale(1) invert(1) contrast(8);
filter: grayscale(1) invert(1) contrast(8);
}
.btn-search {
margin-left: 10px;
}
.btn-primary {
background: var(--cta-color) !important;
color: var(--second-text-color) !important;
font-weight: 400;
text-decoration: none;
}
.btn-primary:hover {
background: var(--text-color) !important;
color: var(--second-text-color) !important;
}
.btn-active {
display: block;
background: var(--main-color) !important;
}
.hide-popup {
display: none !important;
}
.cta-popup {
position: fixed;
display: none;
right: 30px;
bottom: 108px;
max-width: 400px;
width: calc(100% - 30px);
z-index: 999;
}
.cta-popup:hover p {
color: var(--cta-color) !important;
}
.cta-popup .inner {
position: relative;
padding: 20px 18px;
border-radius: 8px !important;
}
.cta-popup .inner img {
position: absolute;
bottom: -38px;
left: -95px;
width: 168px;
}
.cta-popup .inner .medewerker::after {
content: "";
display: none !important;
}
.cta-popup .inner .medewerker .contact {
margin-top: 0px !important;
}
.cta-popup .inner .medewerker .contact .custom-whatsapp {
margin-top: 5px !important;
}
.cta-popup .inner span {
position: absolute;
display: block;
cursor: pointer;
right: 13px;
top: 4px;
font-size: 16px;
opacity: 0.6;
color: #7f888a;
}
.cta-popup .inner span:hover {
opacity: 1;
}
.cta-popup .inner p {
font-size: 1.1rem !important;
margin-bottom: 0px;
line-height: 30px;
color: var(--text-color);
font-weight: 700 !important;
}
.contactsidebar .sidebar {
margin-bottom: 50px;
}
.contactsidebar .certificaat {
padding: 0px;
margin: 0px;
}
.stappen {
margin: 0px;
list-style: none;
padding: 0px;
}
.stappen span {
display: inline-block;
background: var(--cta-color);
padding: 10px 15px;
width: 50px;
margin-bottom: 5px;
margin-right: 15px;
text-align: center;
height: 75px;
border-radius: 35px;
font-family: "Vollkorn", serif;
font-size: 35px;
color: #fff;
float: left;
line-height: 3rem;
}
.stappen li {
line-height: 1.5rem;
margin: 15px 0px;
display: inline-block;
clear: both;
}
.fa-star, .fa-star-half {
color: #F2A446;
font-size: 21px;
margin-bottom: 10px;
}
.btn-cta {
cursor: pointer;
color: var(--text-color) !important;
font-weight: 600;
text-decoration: none;
padding: 0px !important;
}
.btn-cta .btn-block {
position: relative;
opacity: 1 !important;
display: inline-block !important;
border-radius: 50px !important;
padding: 10px !important;
background: var(--cta-color);
right: inherit;
bottom: inherit;
margin-top: -3px;
margin-right: 10px;
transition: 0.2s ease-in-out all;
}
.btn-cta .btn-block img {
-webkit-filter: grayscale(1) invert(1) contrast(0) brightness(250);
filter: grayscale(1) invert(1) contrast(0) brightness(250);
transition: 0.2s ease-in-out all;
}
.btn-cta:hover {
background: transparent !important;
color: var(--cta-color) !important;
}
.btn-red {
width: 100%;
max-width: 500px;
background: var(--second-color);
padding: 25px 30px !important;
text-align: left;
border-radius: 5px !important;
color: #fff;
}
.btn-red h4 {
margin-bottom: 5px;
}
.btn-red p {
margin: 0px !important;
}
.btn-light {
width: 100%;
max-width: 500px;
background: #f8f3f0;
padding: 25px 30px !important;
text-align: left;
border-radius: 5px !important;
}
.btn-light h4 {
color: #212529;
}
.btn-light p {
margin: 0px !important;
}
.btn-light:hover {
background: var(--cta-color) !important;
color: #fff !important;
}
.btn-light:hover h4 {
color: #fff !important;
}
.btn-default {
padding: 12px 30px !important;
border: 3px var(--second-color) solid;
background: #fff;
color: var(--second-color);
font-weight: 600;
}
.btn-default:hover {
background: var(--second-color) !important;
}
.btn-default i {
margin-right: 12px;
margin-top: 5px;
display: inline-block;
float: left;
}
main a {
color: var(--cta-color);
text-decoration: underline;
font-weight: bold;
}
main a:hover {
color: var(--hover-color);
}
main h3 {
margin-bottom: 25px;
}
.contactgegevens a {
color: #fff;
font-weight: bold;
text-decoration: none;
}
section {
padding: var(--padding-vertical) 0px;
}
.section-small {
padding: calc(var(--padding-vertical) / 1.5);
}
#scrollDown span {
position: absolute;
bottom: 60px;
left: calc(50% - 13px);
width: 26px;
height: 40px;
border: 2px solid #fff;
border-radius: 40px;
box-sizing: border-box;
z-index: 8;
}
#scrollDown span:before {
position: absolute;
top: 7px;
left: 50%;
content: "";
width: 4px;
height: 8px;
margin-left: -2px;
background-color: #fff;
border-radius: 2px;
-webkit-animation: scrolldown 2s infinite;
animation: scrolldown 2s infinite;
box-sizing: border-box;
}
.copyright a {
text-decoration: underline !important;
}
.copyright a:hover {
color: #fff !important;
text-decoration: none;
}
.copyright strong {
font-weight: bold;
}
.cb a {
display: block;
}
.footer-head {
padding-bottom: 30px;
}
.footer-head .footertitel {
font-size: 2.4rem;
margin-bottom: 10px;
line-height: 38px;
font-family: "Vollkorn", serif;
color: #FFF1D8;
font-weight: 600;
}
.footer-head strong {
font-size: 1.3rem;
font-weight: 400;
color: #FFF1D8;
font-family: "Vollkorn", serif;
opacity: 0.8;
}
.logo-klein img {
max-width: 220px;
}
.contactblok {
padding: 40px 0px;
}
.contactblok .fas {
background: #fff;
border-radius: 50%;
height: 43px;
width: 43px;
display: inline-block;
float: left;
margin-top: -6px;
color: var(--text-color);
padding-top: 12px;
text-align: center;
margin-right: 10px;
}
.footer-nav {
list-style: none;
margin: 0px;
padding: 10px 0px 30px 0px;
margin-bottom: 15px;
}
.footer-nav li {
padding: 3px 0px;
}
.btn-important {
position: relative;
opacity: 1 !important;
display: inline-block !important;
padding: 19px 30px !important;
background: var(--second-color);
right: inherit;
bottom: inherit;
margin-top: 0px;
margin-right: 10px;
font-size: 19px !important;
line-height: 17px !important;
font-weight: 400 !important;
transition: 0.2s ease-in-out all;
color: #fff;
}
.btn-important img {
-webkit-filter: grayscale(1) invert(1) contrast(0) brightness(250);
filter: grayscale(1) invert(1) contrast(0) brightness(250);
transition: 0.2s ease-in-out all;
}
footer {
padding-top: var(--padding-vertical);
background-position: center right;
background-repeat: no-repeat;
}
footer strong {
font-size: 1.25rem;
color: #FFF1D8;
font-family: "Vollkorn", serif;
}
footer .btn-social {
padding: 13px;
font-size: 23px;
color: var(--cta-color);
}
footer .btn-social:hover {
color: var(--hover-color);
}
footer .contactgegevens a {
color: #fff !important;
}
footer .contactgegevens .contactinfo {
padding: var(--padding-horizontal);
}
footer .contactgegevens .contactinfo:first-of-type {
border-bottom: 1px rgba(244, 244, 244, 0.6) solid;
}
.form-control {
height: 56px;
padding: 10px 30px;
}
.searchbar {
margin-bottom: 15px;
}
.searchbar .form-control {
border-radius: 60px;
}
.searchbar .btn {
margin-top: 0px;
}
.footer_link {
font-weight: bold;
color: var(--cta-color);
}
.footer_link:hover {
color: var(--hover-color) !important;
}
.copyright {
padding-bottom: var(--padding-vertical);
font-size: 0.9rem;
line-height: 1.5rem;
border-top: 1px rgba(255, 255, 255, 0.35) solid;
padding-top: 40px;
opacity: 0.8;
}
.copyright a, .copyright span {
margin-right: 30px;
}
.copyright .contactgegevens a, .copyright .contactgegevens span {
margin-right: 0px;
}
.copyright .txt {
opacity: 0.4;
}
.nieuwsbrief {
padding: var(--padding-horizontal) var(--padding-vertical);
margin-top: 30px;
margin-bottom: -20px;
border-radius: 0px;
}
@keyframes scrolldown {
0% {
transform: translate(0, 0);
opacity: 0;
}
40% {
opacity: 1;
}
80% {
transform: translate(0, 15px);
opacity: 0;
}
100% {
opacity: 0;
}
}
@media (min-width: 768px) {
.d-md-visible {
display: inline-block !important;
}
}
@media (min-width: 992px) {
html, body {
font-size: var(--font-size);
line-height: var(--line-height);
}
h1, h2 {
font-size: 2.75rem;
}
.screen_container .screen {
border: 20px #0b131a solid;
}
.socials {
float: right;
}
.totop {
margin-top: -100px;
}
.klantLogo {
width: 70%;
padding-bottom: 61%;
}
.bg-small {
height: 45vh;
}
.bg {
background-size: cover;
background-position: right center;
height: 65vh;
}
.bg .caption h1, .bg .caption h2 {
font-size: 2.5rem;
}
.case .photo-container .highlight {
max-width: 55%;
}
footer .contactgegevens .contactinfo {
padding: var(--padding-vertical) var(--padding-horizontal);
}
footer .contactgegevens .contactinfo:first-of-type {
border-bottom: 0px #eee solid;
}
}
@media (min-width: 1115px) {
h1, h2 {
font-size: 2.3rem;
}
.screen_container .screen {
border: 29px #0b131a solid;
}
.casehead {
height: 135vh;
}
.casehead .caption {
padding-bottom: calc(var(--padding-vertical) * 3);
}
.casehead .highlight {
bottom: -100px;
max-width: 65%;
}
.visible-mobile {
display: none;
}
.visible-desktop {
display: block;
}
.related .case {
height: 50vh;
}
.case-small .photo-container {
height: 55vh !important;
}
.case-small .photo-container .highlight {
max-width: 65% !important;
}
.case .mobile-content {
display: none;
}
.case .photo-container {
height: 68vh;
}
.case .photo-container .highlight {
max-width: 45%;
}
.case .photo-container .caption {
display: block;
}
.bg {
background-position: center right;
}
.bg .caption {
padding-right: 5vw;
max-width: 850px;
}
.bg .caption h1, .bg .caption h2 {
font-size: 3rem;
padding-right: 0vw;
line-height: 70px;
}
.bg-small {
height: 35vh;
}
}
@media (min-width: 1200px) {
.d-md-visible {
display: none !important;
}
}
@media (min-width: 1400px) {
.navbar .navbar-nav .nav-link {
font-size: 1.05rem;
}
.case-small .photo-container .caption h1 {
font-size: 2.4rem;
}
.case-small .photo-container .highlight {
max-width: 45% !important;
}
.container-100 {
padding: 0px 3vw;
}
.bel strong {
font-size: 1rem;
}
}
@media (min-width: 1580px) {
.case .photo-container {
height: 78vh;
}
.navbar .navbar-nav .nav-link {
padding-right: 1rem;
padding-left: 1rem;
}
}
@media (min-width: 1980px) {
.case .photo-container {
height: 95vh;
}
.bg {
height: 60vh;
min-height: 600px;
background-position: right center;
background-size: 100%;
}
.bg-personal {
height: 120vh;
}
.container-large {
width: 100%;
max-width: 1700px;
}
.bg-small {
height: 40vh;
}
#scrollDown span {
bottom: 75px;
}
}
@media (max-width: 1500px) {
.top {
width: 50%;
}
}
@media (max-width: 1440px) {
html, body {
font-size: 17px;
}
.container {
max-width: 1390px;
}
h2 {
font-size: 2.3rem;
}
h3 {
font-size: 2rem;
}
h4 {
font-size: 1.4rem;
}
.container-100 {
padding: 0px 15px;
}
.bg .caption h1 {
font-size: 2.75rem;
line-height: 60px;
}
.bg .caption h2 {
font-size: 2.3rem;
line-height: 55px;
}
}
@media (max-width: 1300px) {
.navbar .navbar-nav .nav-link {
padding-right: 0.65rem;
padding-left: 0.65rem;
}
.bg {
background-size: cover !important;
}
}
@media (max-width: 1200px) {
.keuzes .keus {
padding-right: 30px;
margin-bottom: 30px;
}
.toright {
margin-left: 140px !important;
}
.case .photo-container {
min-height: 400px;
}
.dienstenmenu .nav-link {
font-size: 2.5rem;
line-height: 2.5rem;
}
}
@media (max-width: 1280px) {
h2 {
font-size: 2.2rem;
margin-bottom: 5px;
}
.dienstenmenu .nav-link {
font-size: 2.8rem;
line-height: 2.8rem;
}
.medewerker .contact {
margin-top: 15px;
}
.bg .caption h1 {
font-size: 2.5rem;
line-height: 60px;
}
}
@media (max-width: 1200px) {
.top {
width: 57%;
}
main {
padding: 15px;
}
main .inhoud {
padding-right: 0px;
}
}
@media (max-width: 992px) {
.first-single-section {
padding-top: 100px !important;
}
.animationprocess {
height: 300px;
max-width: 80%;
margin: 0px auto;
}
.bg-small {
min-height: 325px !important;
}
.aanbieding {
font-size: 1rem;
}
.klantLogo {
padding-bottom: calc(50% - 1px) !important;
}
.klantLogo img {
max-width: 100%;
}
.banner {
height: auto;
}
.producten img {
padding: 40px 30px;
}
.erkenning {
padding: 75px;
}
.productcategory {
margin-right: 5px !important;
margin-left: 5px !important;
}
.totop {
margin-top: 40px;
}
.office .totop {
margin-top: 30px;
}
main .inhoud, #main .inhoud {
padding-right: 15px;
}
.cta-small-img {
position: relative;
top: 15px;
}
a.cta {
padding: 40px 35px;
}
.cta-popup .inner img {
left: -65px;
}
.blog-container {
padding: 0px 15px !important;
}
.naarboven {
margin-top: 0px;
padding-top: 35px;
}
.logo-klein {
display: block;
margin-bottom: 25px;
}
.cta-popup {
right: 15px;
}
.contactblok .cb {
padding: 15px 0px;
}
main, #main {
padding: 0px;
}
.toright {
margin-left: 0px !important;
}
.inleiding {
margin-bottom: 30px;
}
.photob {
margin-left: 0px;
}
.uitgelicht {
height: auto;
margin-bottom: 0px;
}
.uitgelicht .block {
margin-top: 15px;
}
.infoblock {
margin-bottom: 15px;
height: 275px;
}
.infoblock .infoblock-inner {
padding: 30px 30px;
padding-right: 55px;
}
.keus {
padding: 30px;
padding-right: 50px;
}
.findproducts .container {
padding: 0px 15px;
}
.hamburger {
top: 38px;
}
.top {
width: 70%;
}
.photob {
margin-right: 0px;
}
.klantLogo {
float: inherit;
margin: 0px auto;
}
#cn-notice-text {
padding-right: 0px !important;
}
.bg-medewerker {
height: auto !important;
max-width: 700px;
margin: 0px auto;
min-height: 700px !important;
}
#cn-notice-text {
width: 100%;
text-align: center !important;
}
.casehead {
height: 80vh;
}
.projecten {
padding: 15px;
}
.single-container {
padding: 15px;
padding-bottom: var(--padding-vertical);
}
.ml-right {
width: auto;
}
.bg .caption a {
margin-top: 0px;
}
.bg .caption h1 {
font-size: 2.4rem;
line-height: 50px;
padding-right: 15px !important;
}
h2 {
font-size: 2rem;
margin-bottom: 5px;
}
h3 {
font-size: 1.8rem;
}
.bigscreen {
margin-top: 30px;
width: 115%;
}
.bigscreen .screen {
position: relative;
height: 550px;
border: 20px #0b131a solid;
}
.case-small .inner {
padding: 0px;
}
.home .bg .caption h1 {
padding-right: 15vw;
}
.logo {
width: 290px !important;
}
.section-small {
padding: 15px;
}
.medewerker .inner {
padding: var(--padding-horizontal);
margin-left: 0px;
padding-left: 30px;
}
.medewerker .photo-medewerker {
width: 100%;
}
.medewerker_img {
max-height: none !important;
}
.navbar-modal {
position: absolute;
height: 64px;
width: 64px;
margin-right: 0px;
right: 20px;
text-align: center;
top: 30px;
z-index: 200;
}
.bg {
height: 45vh;
background-position: 56% center;
}
.bg .caption {
padding-bottom: 0px;
}
#scrollDown span {
bottom: 40px;
}
.navbar-toggler {
position: relative;
z-index: 200;
background: #272727;
width: 59px;
height: 59px !important;
font-size: 26px !important;
padding: 17px !important;
}
#cn-accept-cookie {
float: inherit !important;
}
#cookie-notice {
font-size: 16px !important;
line-height: 23px !important;
}
.nieuwsbrief {
padding: 15px 30px;
}
.nieuwsbrief input {
margin-bottom: 15px !important;
}
.dienstenmenu .nav-link {
font-size: 2rem;
line-height: 2.5rem;
}
}
@media (max-width: 768px) {
html, body {
font-size: 16px;
}
.navbar-modal {
right: 0px;
}
.searchbar input {
margin-top: 5px;
margin-bottom: 5px;
}
.hamburger {
margin-right: 0px !important;
}
.top {
width: 90%;
padding: 10px 15px;
}
.keus {
padding: 20px 25px;
margin-bottom: 15px;
}
.keus h4 {
font-size: 1.2rem !important;
}
.sidebar {
display: block;
margin: 0px !important;
padding: 0px;
text-align: left !important;
}
.sidebar li {
display: block;
float: inherit;
border-bottom: 1px #c4c4c4 solid;
}
.sidebar li:last-child {
border-bottom: 0px;
}
.sidebar li:last-child a {
margin-top: 10px;
}
.sidebar li a {
display: block;
}
.bg-medewerker {
min-height: 650px !important;
}
.dienstenmenu .navbar-nav .nav-link {
padding: 1rem 0px;
border-bottom: 1px rgba(0, 0, 0, 0.25) solid;
}
.dienstenmenu .navbar-nav li:last-child a {
border-bottom: 0px;
}
.section-small {
padding: calc(var(--padding-vertical) / 2) 0px;
}
.choose-us {
padding: 0px;
}
.screen_container .screen {
left: 0px;
}
.martin-popup {
right: 15px;
}
.martin-popup .inner {
padding: 13px 15px;
}
.martin-popup .inner img {
left: -45px;
bottom: -31px;
}
.martin-popup .inner p {
font-size: 0.9rem !important;
line-height: 26px !important;
}
.martin-popup .inner .medewerker .contact .custom-whatsapp {
font-size: 0.9rem !important;
}
.martin-popup .inner .medewerker .contact .custom-whatsapp svg {
height: 33px !important;
width: 33px !important;
}
.medewerker:after {
display: none;
}
.bigscreen {
width: 125%;
}
.bigscreen .screen {
height: 300px;
min-height: 265px;
border: 15px #0b131a solid !important;
}
.bg .caption {
margin-left: 15px;
}
.klantLogo {
width: calc(80% - 1px) !important;
padding-bottom: calc(80% - 1px) !important;
}
}
@media (max-height: 678px) {
.caption p {
display: none;
}
.dienstenmenu .nav-link {
font-size: 2rem;
line-height: 2.2rem;
}
}
@media (max-width: 500px) {
.bg-medewerker {
min-height: 450px !important;
}
.dienstenmenu .nav-link {
font-size: 1.8rem;
line-height: 2rem;
}
.navbar-nav {
margin-top: 70px;
}
}
.nf-form-content .listselect-wrap .nf-field-element div, .nf-form-content input.ninja-forms-field, .nf-form-content select.ninja-forms-field:not([multiple]) {
height: 56px !important;
line-height: 55px;
}
.email {
border-radius: 0px !important;
height: 58px !important;
line-height: 58px;
font-size: 1rem !important;
padding: 0px 0px 0px 20px !important;
border: 0px !important;
}
.shadow {
box-shadow: 0 10px 30px 0 rgba(72, 72, 72, 0.16) !important;
}
.wp-block-image img {
height: auto;
}
.nf-form-content .list-select-wrap > div select {
line-height: 40px !important;
}
.ht_ctc_padding {
margin: 15px;
padding: 15px !important;
}
.ht_ctc_padding svg {
height: 36px !important;
width: 36px !important;
}
#mc_embed_signup form {
text-align: left !important;
}
#mc_embed_signup input.email {
width: auto;
}
#mc_embed_signup .btn {
margin-top: 0px !important;
}
h1, h2, h3, h4, h5, h6 {
line-height: 1.1;
}
.nieuwsbrief i {
color: var(--text-color);
line-height: 55px;
}
.nieuwsbrief .btn {
margin: 0px auto;
}
.nf-error.field-wrap .nf-field-element:after {
height: 54px !important;
line-height: 55px !important;
}
.nf-form-fields-required {
display: none;
}
.nf-form-content label {
font-size: 1rem !important;
}
#wpadminbar {
background: #3e4a53 !important;
}
#wp-admin-bar-search {
display: none !important;
}
.nf-multi-cell .nf-cell {
padding: 0px 10px 0px 0px !important;
}
.nf-form-content {
max-width: 100% !important;
}
#wpadminbar #wp-admin-bar-my-account.with-avatar > .ab-empty-item img, #wpadminbar #wp-admin-bar-my-account.with-avatar > a img {
width: auto;
height: 16px;
padding: 0;
border: 1px solid #82878c !important;
background: #eee !important;
line-height: 1.84615384;
vertical-align: middle;
margin: -4px 0 0 6px;
float: none;
display: inline;
}
.nf-form-content {
padding: 0px !important;
}
.nf-form-content .list-select-wrap .nf-field-element > div, .nf-form-content input:not([type=button]), .nf-form-content textarea {
background: #fff !important;
}
#wpadminbar #wp-admin-bar-my-account.with-avatar > .ab-empty-item img, #wpadminbar #wp-admin-bar-my-account.with-avatar > a img {
border: 0px;
border-radius: 50px !important;
}
.space {
height: 430px;
}
.breadcrumb {
background: transparent;
padding: 0px;
margin-top: -30px;
margin-bottom: 30px;
color: inherit;
}
.breadcrumb a {
color: var(--main-color);
}
@media (min-width: 770px) {
.nieuwsbrief .btn {
float: right;
}
}
@media (max-width: 768px) {
#mc_embed_signup input.email {
width: calc(100% - 30px) !important;
}
}