/* KLEUREN ORANJE #ef7c4d GRIJS #5a5a59 /* GLOBAL *************************************************************************************************/ #icon-sprite-kets { display: none !important; visibility: hidden !important; } nav ul.sf-menu ul { box-shadow: 3px 3px 0 rgba(41,40,40,0.35); padding: 1px; } nav ul.sf-menu ul li + li { padding-top: 1px; } .nice-table th { text-align: center; } .nice-table th:not(:first-child) { border-left: 1px dotted #ccc; } ul.buttons { font-size: 0; line-height: 0; list-style: none; margin-left: 0 !important; margin-top: 1rem !important; width: 100% !important; } ul.buttons:before, ul.buttons:after { content: '\0020'; display: block; height: 0; visibility: hidden; } ul.buttons:after { clear: both; } ul.buttons li { display: block; float: left; vertical-align: top; } ul.buttons li + li { padding-left: 5px; } ul.buttons li:first-child:nth-last-child(1) { float: none !important; width: 100%; } ul.buttons li:first-child:nth-last-child(2), ul.buttons li:first-child:nth-last-child(2) ~ li { width: 50%; } ul.buttons li:first-child:nth-last-child(3), ul.buttons li:first-child:nth-last-child(3) ~ li { width: 33.3333%; } ul.buttons li:first-child:nth-last-child(4), ul.buttons li:first-child:nth-last-child(4) ~ li { width: 25%; } ul.buttons a { font-size: 1rem; line-height: 1.333rem; width: 100%; } /* HEADER *************************************************************************************************/ #header { max-width: 100%; } #header .content { padding: 0; transition: padding 0.35s; } #logo { display: inline-block; float: none; vertical-align: top; width: auto; } #logo a { padding: 5px 40px; } #logo svg { max-height: 100px; max-width: 180px; } #logo svg .house0 { fill: #cccccc; } #logo svg .house1 { fill: #a2a1a1; } #logo svg .house2 { fill: #aeaead; } #logo svg .house3 { fill: #858484; } #logo svg .ribbon { fill: #ef7c4d; } #logo svg .kets { fill: #fff; } #logo svg .woningbouw { fill: #aeaead; } #nav-main { display: inline-block; float: none; vertical-align: top; width: auto; } #nav-main > ul > li + li { padding-left: 1px; position: relative; } #nav-main > ul > li + li::before { background: rgba(255,255,255,0.5); content: ''; display: block; height: 80px; left: 0; margin-top: -40px; position: absolute; top: 50%; width: 1px; } #nav-main > ul > li > a { display: table-cell; font-size: 18px; height: 110px; line-height: 24px; margin: 0; max-width: 180px; min-width: 120px; padding: 5px 20px; text-align: center; text-transform: uppercase; vertical-align: middle; } #nav-main > ul > li > a > span { color: currentColor; display: inline-block; transition: all 0.35s; } #nav-main > ul > li > a::before, #nav-main > ul > li > a::after { background: transparent; bottom: 0; content: ''; display: block; position: absolute; top: 0; transition: background 0.35s; width: 1px; z-index: 999; } #nav-main > ul > li > a::before { left: -1px; } #nav-main > ul > li > a::after { right: -1px; } #nav-main > ul > li > a:hover > span { color: #ef7c4d; -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } #nav-main > ul > li.current-menu-item > a::before, #nav-main > ul > li.current-menu-parent > a::before, #nav-main > ul > li.current-menu-ancestor > a::before, #nav-main > ul > li.current-menu-item > a::after, #nav-main > ul > li.current-menu-parent > a::after, #nav-main > ul > li.current-menu-ancestor > a::after { background-color: #ef7c4d; } #nav-main > ul > li.current-menu-item > a > span, #nav-main > ul > li.current-menu-parent > a > span, #nav-main > ul > li.current-menu-ancestor > a > span, #nav-main > ul > li.current-menu-item > a > span, #nav-main > ul > li.current-menu-parent > a > span, #nav-main > ul > li.current-menu-ancestor > a > span { color: #fff !important; } #nav-sub { background: #ef7c4d; float: right; width: auto; } #nav-sub > ul > li + li { padding-left: 1px; position: relative; } #nav-sub > ul > li + li::before { background: rgba(255,255,255,0.5); content: ''; display: block; height: 80px; left: 0; margin-top: -40px; position: absolute; top: 50%; width: 1px; } #nav-sub > ul > li > a { color: #fff; display: table-cell; font-size: 18px; height: 110px; line-height: 24px; margin: 0; /*max-width: 140px;*/ min-width: 120px; padding: 10px 20px; text-align: center; text-transform: uppercase; vertical-align: middle; } #nav-sub > ul > li > a > span { color: #fff; display: inline-block; transition: all 0.35s; } #nav-sub > ul > li > a:hover, #nav-sub > ul > li.sfHover > a, #nav-sub > ul > li.current-menu-item > a, #nav-sub > ul > li.current-menu-parent > a, #nav-sub > ul > li.current-menu-child > a { color: #2a292a; } #nav-sub > ul > li > a:hover > span, #nav-sub > ul > li.sfHover > a > span, #nav-sub > ul > li.current-menu-item > a > span, #nav-sub > ul > li.current-menu-parent > a > span, #nav-sub > ul > li.current-menu-child > a > span { color: #2a292a; } #nav-sub > ul > li > a::before, #nav-sub > ul > li > a::after { background: transparent; bottom: 0; content: ''; display: block; position: absolute; top: 0; transition: background 0.35s; width: 1px; z-index: 999; } #nav-sub > ul > li > a::before { left: -1px; } #nav-sub > ul > li > a::after { right: -1px; } #nav-sub > ul > li > a:hover > span { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } /* SLIDESHOW *************************************************************************************************/ /* SLIDESHOW > placeholder */ .slider-placeholder { min-height: 20px; } /* SLIDESHOW > overlay */ .slider-wrap .overlay-wrap.lt, .slider-wrap .overlay-wrap.lc, .slider-wrap .overlay-wrap.lb { left: 0; max-width: 60%; padding: 0; width: 55%; } .slider-wrap .overlay-wrap.lb { bottom: calc( 5% + 140px ); } .slider-wrap .overlay-wrap.lt .overlay, .slider-wrap .overlay-wrap.lc .overlay, .slider-wrap .overlay-wrap.lb .overlay { padding: 30px 30px 30px 90px; text-align: center; } .slider-wrap .overlay-wrap .overlay h1 { font-family: inherit; font-size: 2.5em; font-weight: inherit; line-height: 1.379em; text-transform: uppercase; } /* SLIDESHOW > dots */ .slider-wrap.block-0 .slick-slider.dots .slick-dots { left: auto; right: 10px; width: auto; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } .slider-wrap.block-0 .slick-slider.dots .slick-dots button::after { box-shadow: 0 0 5px rgba(0,0,0,0.5); } .slick-slider.dots .slick-dots button::after { border-radius: 50%; } /* SLIDESHOW > arrow navigation */ .slick-slider.arrows .slick-arrow { border-radius: 50%; } /* SLIDESHOW > scroll to */ a.scroll-to.double::after, a.scroll-to.double::before { border-bottom-color: #ef7c4d; border-right-color: #ef7c4d; } a.scroll-to.double span { transition: color 0.35s; } a.scroll-to.double:not(:hover) span { color: rgba(255,255,255,0); } /* TITLE *************************************************************************************************/ body:not(.home) .content-wrap .entry-title { font-size: 2.222em; line-height: 1.2; margin-top: 0 !important; text-align: center; } body:not(.home) .content-wrap .entry-title + h2 { font-family: inherit; font-size: 1.222em; font-style: italic; font-weight: inherit; margin-top: 0.5em !important; padding-top: 0.5em; position: relative; text-align: center; } body:not(.home) .content-wrap .entry-title + h2::before { background: #ef7c4d; content: ''; display: block; height: 1px; left: 50%; margin-left: -120px; position: absolute; top: 0; width: 240px; } .column-wrap { margin-top: 2em !important; } .column > * + * { margin-top: 1em; } /* FOOTER *************************************************************************************************/ #footer-wrap { border-top: 3px solid #ef7c4d; position: relative; } #footer { padding-top: 10px; position: relative; z-index: 10; } #footer .content { padding-bottom: 0; padding-top: 0; } #footer-widget-area { display: grid; margin-bottom: 0; position: relative; grid-gap: 20px; grid-template-columns: repeat( 10, 1fr ); } .widget { padding: 1em 0; } .widget.widget-kets-phone { grid-column: 1 / span 3; grid-row: 1; } .widget.widget-kets-hcard { grid-column: 4 / span 4; grid-row: 1; } .widget.widget-kets-email { grid-column: 8 / span 3; grid-row: 1; } .widget .icon > svg { fill: #fff; } .widget h3 { color: #fff; font: inherit; text-align: center; } .widget hr { border-color: #ef7c4d; border-width: 2px; margin: 0.75em auto; max-width: 100px; } .widget p { margin-top: 0.75em; text-align: center; } .widget a { text-decoration: none; } .widget > .icon { height: 2.5em; margin: 3.5em auto 2.5em; width: 2.5em; } .widget-kets-hcard .vcard { box-shadow: 2px 2px 5px rgba(0,0,0,0.5); padding: 10px 10px 20px; text-align: center; } .widget-kets-hcard .vcard svg { height: 100px; width: 180px; } .widget-kets-hcard .vcard svg .house0 { fill: #cccccc; } .widget-kets-hcard .vcard svg .house1 { fill: #a2a1a1; } .widget-kets-hcard .vcard svg .house2 { fill: #aeaead; } .widget-kets-hcard .vcard svg .house3 { fill: #858484; } .widget-kets-hcard .vcard svg .ribbon { fill: #ef7c4d; } .widget-kets-hcard .vcard svg .kets { fill: #fff; } .widget-kets-hcard .vcard svg .woningbouw { fill: #aeaead; } .widget-kets-hcard .vcard p.tel + p.tel { margin-top: 0 !important; } /*.widget-kets-hcard .vcard p.tel > span { display: inline-block; margin-right: 5px; min-width: 95px; text-align: left; }*/ .widget-kets-hcard .vcard p.tel { margin-left: auto; margin-right: auto; max-width: 400px; display: grid; grid-gap: 10px; grid-template-columns: repeat(3,1fr); } .widget-kets-hcard .vcard p.tel > span { text-align: left; } .widget-kets-hcard .vcard p.tel > a { display: inline-block; min-width: 105px; } .widget-kets-hcard .social { margin-top: 1em; text-align: center; } .widget-kets-hcard .social p { display: inline-block; font-size: 0; line-height: 0; vertical-align: top; } .widget-kets-hcard .social a { background-color: #858484; border-radius: 50%; color: #fff; display: block; height: 40px; margin: 0 10px; padding: 10px; transition: background 0.35s; width: 40px; } .widget-kets-hcard .social a:hover { background-color: #ef7c4d; } /* HOME *************************************************************************************************/ .home .content-wrap.block-1 .content { padding: 5% 2.5%; } .home .content-wrap.block-1 .entry-title { display: none; } /* HOME > title */ .home .content-wrap .entry-title + h1 { font-size: 2.222em; line-height: 1.2; margin-top: 0 !important; text-align: center; } .home .content-wrap .entry-title + h1 + h2 { font-family: inherit; font-size: 1.222em; font-style: italic; font-weight: inherit; margin-top: 0.5em !important; padding-top: 0.5em; position: relative; text-align: center; } .home .content-wrap .entry-title + h1 + h2::before { background: #ef7c4d; content: ''; display: block; height: 1px; left: 50%; margin-left: -120px; position: absolute; top: 0; width: 240px; } .home .content-wrap .entry-title + h1 + h2 + * { margin-top: 2em; } .home .content-wrap .content > p { text-align: center; } /* HOME > excerpt */ .home .excerpt-wrap .content h1 { font-size: 2.222em; line-height: 1.2; margin-top: 0 !important; position: relative; text-align: center; } .home .excerpt-wrap .content h1::after { background: #ef7c4d; bottom: -0.333em; content: ''; display: block; height: 1px; left: 50%; margin-left: -120px; position: absolute; width: 240px; } .home .excerpt-wrap .content h1 + * { margin-top: 2em !important; } .home .excerpt-wrap .content > p { text-align: center; } /* HOME > Bouwgaranties */ #content-bouwgaranties { background-color: #eee; max-width: 100%; } #content-bouwgaranties .content { margin: 0 auto; max-width: 1200px; padding: 60px 30px; width: 100%; } #content-bouwgaranties h1 { color: #5a5a59; font-size: 2.222em; font-weight: inherit; line-height: 1.25; position: relative; text-align: center; z-index: 0; } #content-bouwgaranties h1::after { background: #5a5a59; content: ''; display: block; height: 1px; left: 0; position: absolute; right: 0; top: 50%; z-index: 1; } #content-bouwgaranties h1 > span { background: #eee; display: inline-block; padding: 0 0.5em; position: relative; z-index: 2; } #content-bouwgaranties ul { list-style: none; margin: 3em 0 0 !important; padding: 0; display: grid; grid-gap: 30px; grid-template-columns: repeat( 3, 1fr ); } #content-bouwgaranties li a { background: #5a5a59 center center no-repeat; background-size: cover; color: #fff !important; display: block; height: 0; margin: 0 auto; overflow: hidden; padding: 0 0 70%; position: relative; text-align: center; text-decoration: none; width: 100%; z-index: 0; } #content-bouwgaranties #block-bouwgarantie-0 a { background-image: url(../images/kets-bouwgaranties-131213105253.jpg); } #content-bouwgaranties #block-bouwgarantie-1 a { background-image: url(../images/kets-bouwgaranties-energiezuining-duurzaam.jpg); } #content-bouwgaranties #block-bouwgarantie-2 a { background-image: url(../images/kets-bouwgaranties-1067020710.jpg); } #content-bouwgaranties #block-bouwgarantie-3 a { background-image: url(../images/kets-bouwgaranties-915462464.jpg); } #content-bouwgaranties #block-bouwgarantie-4 a { background-image: url(../images/kets-bouwgaranties-1006696920.jpg); } #content-bouwgaranties #block-bouwgarantie-5 a { background-image: url(../images/kets-bouwgaranties-1129841739.jpg); } #content-bouwgaranties li a::before { background: rgba(132,133,135,0.85); bottom: 0; content: ''; display: block; height: 100%; left: 0; position: absolute; top: 0; transition: background 0.35s; width: 100%; z-index: 1; } #content-bouwgaranties svg { fill: currentColor; height: 75px; left: 50%; position: absolute; text-align: center; top: 20%; transition: top 0.35s; width: 75px; z-index: 2; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } #content-bouwgaranties h3 { color: inherit; display: block; font-size: 1.667em; font-weight: inherit; line-height: 1.2; padding: 0 12.5%; position: absolute; text-shadow: 1px 1px 1px rgba(0,0,0,1); top: 70%; transition: top 0.35s, text-shadow 0.35s; width: 100%; z-index: 2; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } #content-bouwgaranties li a:hover::before { background: rgba(132,133,135,0); } #content-bouwgaranties li a:hover svg { top: -50%; } #content-bouwgaranties li a:hover h3 { text-shadow: 2px 2px 2px rgba(0,0,0,1); top: 50%; } #content-bouwgaranties .readmore { font-size: 1.333em; margin-top: 2em !important; text-align: center; } #content-bouwgaranties .readmore > a { min-width: 31.58%; } /* HOME > Bouwgaranties > Anchors */ .content a[id^=garantie-] { display: block; position: relative; top: -225px; visibility: hidden; } /* HOME > Carousel Portfolio */ /* .carousel-portfolio-wrap { background: #fff; padding: 1em 0; } .carousel-portfolio-wrap header .content { text-align: center; } .carousel-portfolio-wrap header .content h2 { font-size: 2.222em; line-height: 1.25; } .carousel-portfolio-wrap header .content h2 + p { margin-top: 0.5em !important; padding-top: 0.5em; position: relative; } .carousel-portfolio-wrap header .content h2 + p::before { background: #ef7c4d; content: ''; display: block; height: 1px; left: 50%; margin-left: -120px; position: absolute; top: 0; width: 240px; } .carousel-portfolio-wrap header .content * + * { margin-top: 0.5em !important; } */ .carousel-portfolio-wrap { background: #fff; padding: 1em 0; } .carousel-portfolio-wrap header .content { text-align: center; } .carousel-portfolio-wrap header .content h2 { font-size: 2.222em; line-height: 1.25; padding-bottom: 0.5rem; position: relative; } .carousel-portfolio-wrap header .content h2::after { background: #ef7c4d; bottom: 0; content: ''; display: block; height: 1px; left: 50%; margin-left: -120px; position: absolute; width: 240px; } .carousel-portfolio-wrap header .content * + * { margin-top: 0.5em !important; } .carousel-portfolio-wrap .carousel { overflow: visible; } .carousel-portfolio-wrap .carousel .slick-slide { padding: 10px !important; } .carousel-portfolio-wrap .carousel:not(.carousel-content) > ul:not(.border-0) a { border: none !important; box-shadow: none !important; max-width: 100%; overflow: hidden; position: relative; z-index: 0; } .carousel-portfolio-wrap .carousel:not(.carousel-testimonials) figure { padding-bottom: 80%; position: relative; transition: all 0.35s; z-index: 1; } .carousel-portfolio-wrap .post a::before { background: rgba(0,0,0,0.5); bottom: 0; content: ''; display: block; left: 0; opacity: 0; position: absolute; right: 0; top: 0; transition: opacity 0.35s; z-index: 2; } .carousel-portfolio-wrap .post .content { background: transparent; min-height: 0; opacity: 0; padding: 0; position: absolute; text-align: center; top: 50%; transition: opacity 0.35s; width: 100%; z-index: 3; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .carousel-portfolio-wrap .post .content h3 { color: #fff; font-weight: inherit; margin: 0 !important; } .carousel-portfolio-wrap .carousel:not(.carousel-testimonials) a:hover figure { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .carousel-portfolio-wrap .post a:hover::before, .carousel-portfolio-wrap .post a:hover .content { opacity: 0.99; } .carousel-portfolio-wrap .slick-slider.arrows .slick-prev { left: -50px; } .carousel-portfolio-wrap .slick-slider.arrows .slick-next { right: -50px; } /* CTA NEWSLETTER *************************************************************************************************/ .cta-wrap.newsletter { background-color: #eee; background-size: cover; position: relative; } /*.cta-wrap.newsletter::before { background: rgba(238,238,238,0.85); bottom: 0; content: ''; display: block; left: 0; position: absolute; right: 0; top: 0; z-index: 1; }*/ .cta-wrap.newsletter .cta { color: #5a5a59; position: relative; z-index: 2; } .cta-wrap.newsletter .content { color: #5a5a59; padding: 5% 2.5%; text-align: center; } .cta-wrap.newsletter .cta header { margin: 0 auto; max-width: 900px; width: 100%; } .cta-wrap.newsletter .cta header h2 { color: #5a5a59; font-size: 2.222em; line-height: 1.25; margin-top: 0.5em; } .cta-wrap.newsletter .cta header h2 + p { margin-top: 0.5em !important; } .cta-wrap.newsletter .form-wrap { margin: 0 auto; max-width: 640px; position: relative; width: 100%; } .cta-wrap.newsletter .form-wrap fieldset { background: none; padding: 20px 0; position: relative; z-index: 0; } .cta-wrap.newsletter .form-wrap fieldset p { padding: 0; } .cta-wrap.newsletter .form-wrap fieldset p.large { width: 75%; } .cta-wrap.newsletter .form-wrap fieldset p.large label { display: none; } .cta-wrap.newsletter .form-wrap fieldset p.large input:not(.button):not(.ghost):not([type=radio]):not([type=checkbox]) { background: #fff !important; border-color: #ddd; color: #5a5a59 !important; font-size: 15px; line-height: 20px; padding: 10px 20px; } .cta-wrap.newsletter .form-wrap fieldset p.large input:focus { border-color: #fff !important; box-shadow: 0 0 5px rgba(0,0,0,0.75); } .cta-wrap.newsletter .form-wrap > p { position: absolute; right: 0; top: 18px; width: 25%; z-index: 1; } .cta-wrap.newsletter .form-wrap > p .button { font-size: 15px; line-height: 20px; padding: 10px; text-transform: uppercase; width: 100%; } .cta-wrap.newsletter .form-wrap fieldset p.gdpr { margin-top: 2em !important; text-align: center; } .cta-wrap.newsletter .form-wrap fieldset p.gdpr a { color: #5a5a59 !important; } .cta-wrap.newsletter .form-wrap fieldset ::-webkit-input-placeholder { color: #999 !important; font-style: italic; } .cta-wrap.newsletter .form-wrap fieldset :-ms-input-placeholder { color: #999 !important; font-style: italic; } .cta-wrap.newsletter .form-wrap fieldset ::placeholder { color: #999 !important; font-style: italic; } /* LATEST NEWS - CTA NEWSLETTER *************************************************************************************************/ .news-cta-subscribe-wrap { background: #eee; } .news-cta-subscribe { margin: 0 auto; max-width: 1440px; display: grid; grid-gap: 20px; grid-template-columns: repeat( 2, 1fr ); } .news-cta-subscribe .latest-posts { padding: 5% 2.5%; } .news-cta-subscribe .latest-posts header h2 { color: #5a5a59; font-size: 2.222em; line-height: 1.25; margin: 0.5em auto 0; max-width: 640px; text-align: center; } .news-cta-subscribe .latest-posts header h2 > a { color: inherit; display: block; text-decoration: none; } .news-cta-subscribe .latest-posts ul { list-style: none; margin: 1em auto 0 !important; max-width: 640px; padding: 0 !important; } .news-cta-subscribe .latest-posts li { list-style: none; margin: 0; padding: 0; } .news-cta-subscribe .latest-posts li + li { margin-top: 0.5em; } .news-cta-subscribe .latest-posts ul a { color: #5a5a59; display: block; padding: 0.25em 1.5em; position: relative; text-decoration: none; } .news-cta-subscribe .latest-posts ul a::before { background: #ef7c4d; content: ''; display: block; height: 8px; left: 0.5em; margin-top: -4px; position: absolute; top: 1.111em; width: 8px; } .news-cta-subscribe .latest-posts ul a > h3 { color: #5a5a59; } .news-cta-subscribe .latest-posts ul a > .published-on { font-size: 0.778em; } .news-cta-subscribe .latest-posts a { transition: background 0.35s; } .news-cta-subscribe .latest-posts a:hover { background: rgba(255,255,255,0.5); } /* POSTS ARCHIVE *************************************************************************************************/ .blog .content-wrap.posts-archive > .content > .entry-title { } .blog .content-wrap .post .entry-content, .blog .content-wrap .post header { padding-top: 1em; text-align: left; } .blog .content-wrap .post header .entry-title { font-size: 1.5rem; margin-bottom: 0 !important; text-align: left; } .blog .content-wrap .post header .entry-author, .blog .content-wrap .post header .entry-date { color: #5a5a59; margin-top: 0; } /* PORTFOLIO ARCHIVE *************************************************************************************************/ .blog.post-type-archive-portfolio .content-wrap.posts-archive { max-width: 1440px; } .blog.post-type-archive-portfolio .content-wrap .post { margin-bottom: 0; padding: 10px; } .blog.post-type-archive-portfolio .content-wrap .post a { background: #fff !important; box-shadow: none !important; overflow: hidden; padding: 0; position: relative; } .blog.post-type-archive-portfolio .content-wrap .post a::before { background: rgba(0,0,0,0.5); bottom: 0; content: ''; display: block; height: auto; left: 0; opacity: 0; position: absolute; right: 0; top: 0; transition: opacity 0.35s; visibility: visible; z-index: 2; } .blog.post-type-archive-portfolio .content-wrap .post figure { margin: 0 !important; padding-bottom: 80%; position: relative; transition: all 0.35s; z-index: 1; } .blog.post-type-archive-portfolio .content-wrap .post header { background: transparent; min-height: 0; opacity: 0; padding: 0 1em; position: absolute; text-align: center; top: 50%; transition: opacity 0.35s; width: 100%; z-index: 3; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .blog.post-type-archive-portfolio .content-wrap .post header .entry-title { color: #fff; font-size: inherit; font-weight: inherit; line-height: inherit; margin: 0 !important; text-align: center !important; } .blog.post-type-archive-portfolio .content-wrap .post a:hover figure { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .blog.post-type-archive-portfolio .content-wrap .post a:hover::before, .blog.post-type-archive-portfolio .content-wrap .post a:hover header { opacity: 0.99; } .blog.post-type-archive-portfolio .content-wrap.portfolio .content > .entry-title { display: none; } /* Pagination */ .pagination { margin-top: 2.5% !important; } .pagination .page-numbers { border: none !important; } .pagination .page-numbers:not(.prev):not(.next) { color: #2a292a !important; } .pagination .page-numbers:not(.prev):not(.next).current { color: #ef7c4d !important; } .single-post .single-pagination a > h3, .single-post .single-pagination a > p { transition: color: 0.35s; } .single-post .single-pagination a:hover { background-color: transparent !important; color: #ef7c4d !important; } .single-post .single-pagination a:hover::before, .single-post .single-pagination a:hover::after { background-color: #ef7c4d !important; } .single-post .single-pagination a:hover h3, .single-post .single-pagination a:hover p { color: #ef7c4d !important; } /* PORTFOLIO CATEGORY *************************************************************************************************/ .portfolio-category-wrap { background: #fff; padding: 1em 0; } .portfolio-category-wrap header .content { text-align: center; } .portfolio-category-wrap header .content h2 { font-size: 2.222em; line-height: 1.25; } .portfolio-category-wrap header .content h2 + p { margin-top: 0.5em !important; padding-top: 0.5em; position: relative; } .portfolio-category-wrap header .content h2 + p::before { background: #ef7c4d; content: ''; display: block; height: 1px; left: 50%; margin-left: -120px; position: absolute; top: 0; width: 240px; } .portfolio-category-wrap header .content * + * { margin-top: 0.5em !important; } .portfolio-category { margin: 0 auto 1rem; max-width: 1160px; } .portfolio-category ul { list-style: none !important; margin: 0 !important; padding: 0 !important; } .portfolio-category li { list-style: none; margin: 0; padding: 0; } .portfolio-category li + li { margin-top: 20px; } .portfolio-category a { color: #5a5a59; padding: 10px; text-decoration: none; transition: background 0.35s; display: grid; grid-template-columns: 45% 10% 45%; } .portfolio-category a > figure { margin: 0 !important; overflow: hidden; padding-bottom: 66%; position: relative; z-index: 1; grid-row: 1; } .portfolio-category a > figure > img { height: 100%; left: 0; object-fit: cover; position: absolute; top: 0; transition: all 0.35s; width: 100%; } .portfolio-category a > .content { padding: 20px; text-align: center; align-self: center; grid-row: 1; } .portfolio-category a > .content > h3 { color: #5a5a59; } .portfolio-category a > .content > h3 + p { margin-top: 0.5em !important; } .portfolio-category a:hover { background-color: #eee; } .portfolio-category a:hover figure > img { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .portfolio-category li:nth-child(odd) > a > figure { grid-column: 1; } .portfolio-category li:nth-child(odd) > a > .content { grid-column: 2 / span 2; } .portfolio-category li:nth-child(even) > a > figure { grid-column: 3; } .portfolio-category li:nth-child(even) > a > .content { grid-column: 1 / span 2; } /* PORTFOLIO SINGLE *************************************************************************************************/ .js .single-portfolio .toc-list { float: none; text-align: center; width: 100%; } .js .single-portfolio .toc-list > li { display: inline-block; margin: 0.25em !important; vertical-align: top; } .js .single-portfolio .toc-list a { padding: 0; } .js .single-portfolio .toc-list a > span { background-color: #5a5a59; color: #fff; display: inline-block; padding: 0.5em 1em; position: relative; transition: background 0.35s; } .js .single-portfolio .toc-list a > span::after { border-top: 10px solid #5a5a59; border-left: 10px solid transparent; border-right: 10px solid transparent; bottom: -10px; content: ''; display: block; left: 50%; margin-left: -10px; position: absolute; transition: border-color 0.35s; } .js .single-portfolio .toc-list a.active > span { background-color: #ef7c4d; } .js .single-portfolio .toc-list a.active > span::after { border-top-color: #ef7c4d; } .js .single-portfolio .toc-list a::before, .js .single-portfolio .toc-list a::after { display: none; } .js .single-portfolio .toc { clear: both; float: none; margin-top: 2em; width: 100%; } .js .single-portfolio .toc-title { display: none; } /* GALLERY *************************************************************************************************/ #container .content > .gallery-wrap + .gallery-wrap { margin-top: 0 !important; } /* SECTION SCROLLABLE *************************************************************************************************/ .section-scrollable-wrap { counter-reset: scrollable; margin-top: 5% !important; } .section-scrollable { background: #eee; overflow: hidden; padding: 5em 5% 5em 7.5%; position: relative; width: 100%; z-index: 0; } .section-scrollable + .section-scrollable { margin-top: 1em; } .section-scrollable .scrollable-header { font-size: 1.5em; font-weight: inherit; position: relative; text-transform: uppercase; z-index: 10; } .section-scrollable .scrollable-content { font-size: 1.111em; margin-top: 1em; position: relative; z-index: 10; } .section-scrollable .scrollable-content > * + * { margin-top: 1em; } .section-scrollable .anchor { position: absolute; top: -5em; } /* Numbering */ .section-scrollable-wrap.numbers { counter-reset: scrollable; } .section-scrollable-wrap.numbers .section-scrollable::before { color: #f6f6f6; content: counter(scrollable); counter-increment: scrollable; font-size: 15em; font-weight: bold; left: 2.5%; line-height: 1; position: absolute; top: 50%; z-index: 1; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } /* TIMELINE *************************************************************************************************/ .section-timeline-wrap.js { margin-top: 30px !important; padding-top: 60px; position: relative; } /* TIMELINE NAV */ .timeline-nav-wrap { display: none; } .js .timeline-nav-wrap { background: #fff; display: block; font-size: 0; height: 30px; left: 50%; line-height: 0; margin: 0 auto; max-width: 1000px; position: absolute; text-align: center; top: 10px; width: 90%; z-index: 999; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .js .timeline-nav-wrap::before, .js .timeline-nav-wrap::after { background: #fff; border-radius: 15px; content: ''; display: block; height: 30px; position: absolute; top: 0; width: 40px; z-index: -1; } .js .timeline-nav-wrap::before { left: -20px; } .js .timeline-nav-wrap::after { right: -20px; } .js .timeline-nav-wrap > ul { list-style: none; margin: 0 !important; padding: 0; position: relative; white-space: nowrap; width: 100%; z-index: 2; background: pink; } .js .timeline-nav-wrap > ul > li { cursor: help; display: block; height: 30px; margin-left: -15px; position: absolute; vertical-align: top; width: 30px; } .js .timeline-nav-wrap > ul > li::before { background: #fff; border: 2px solid #222; border-radius: 50%; content: ''; display: block; height: 14px; left: 50%; margin: -7px 0 0 -7px; position: absolute; top: 50%; width: 14px; } .js .timeline-nav-wrap > ul > li.active::before { background: #ef7c4d; border-color: #ef7c4d; } .js .timeline-nav-wrap > ul > li > span { background: #222; color: #fff; display: none; font-size: 0.889rem; left: 50%; line-height: 1.222; max-width: 200px; min-width: 120px; padding: 8px 15px; position: absolute; text-align: center; text-transform: uppercase; top: 35px; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .js .timeline-nav-wrap > ul > li.hover > span { display: block; white-space: normal; } .js .timeline-nav-wrap > ul > li.hover > span::before { border-bottom: 10px solid #222; border-left: 10px solid transparent; border-right: 10px solid transparent; content: ''; display: block; font-size: 0; line-height: 0; left: 50%; margin-left: -10px; position: absolute; top: -10px; } .js .timeline-nav-wrap .timeline-progress { background: #222; content: ''; display: block; height: 4px; left: 0; position: absolute; right: 0; top: 13px; z-index: 1; } .js .timeline-nav-wrap .timeline-progress-ribbon { background: #ef7c4d; height: 4px; left: 0; position: absolute; top: 0; width: 0%; } /* TIMELINE ITEMS */ .section-timeline { background: #eee; padding: 5em 5% 5em 7.5%; } .section-timeline + .section-timeline { margin-top: 2em !important; } .section-timeline > h3 { font-size: 1.5em; font-weight: inherit; position: relative; text-transform: uppercase; z-index: 10; } .section-timeline > div { font-size: 1.111em; margin-top: 1em; position: relative; z-index: 10; } .section-timeline > div > * + * { margin-top: 1em; } /* WAYPOINTS *************************************************************************************************/ .waypoints-wrap { position: relative; } .waypoints-nav { display: none; } .waypoint + .waypoint { margin-top: 10em !important; } .waypoint > h3 { font-size: 1.5em; font-weight: inherit; position: relative; text-transform: uppercase; z-index: 30; } .waypoint > div { font-size: 1.111em; margin-top: 1em; position: relative; z-index: 10; } .waypoint > div > * + * { margin-top: 1em; } .js .waypoint { position: relative; } .js .waypoint .overlay { background: #fff; bottom: 0; height: 100%; display: block; left: 0; margin-top: 0 !important; position: absolute; right: 0; transition: height 1s; z-index: 20; } .js .waypoint.in-view .overlay { height: 0; } .js .waypoints-wrap { padding-left: 25%; position: relative; } .js .waypoints-nav { display: block; left: 50%; list-style: none !important; margin: 0 0 0 -570px !important; padding: 0 !important; position: absolute; width: 240px; } .js .waypoints-nav li { cursor: pointer; padding: 2px 10px; position: relative; text-align: center; } .js .waypoints-nav li + li { margin-top: 20px; } .js .waypoints-nav li + li::before { background: #222; content: ''; display: block; height: 20px; left: 50%; position: absolute; top: -20px; width: 1px; } .js .waypoints-nav li.active { } .js .waypoints-nav li.current { color: #ef7c4d; font-weight: bold; } /* TEAM *************************************************************************************************/ .team-wrap .content { padding: 2.5% 0; } .team-wrap .team-member { background: #fff; border-radius: 50%; float: left; font-size: 0; height: 100%; line-height: 0; overflow: hidden; position: relative; } .team-wrap .team-member figure, .team-wrap .team-member .placeholder { border-radius: 50%; display: block; height: 0; overflow: hidden; padding: 0 0 100%; position: relative; top: 0 !important; z-index: 0; } .team-wrap .team-member figure::before { background: rgba(0,0,0,0); border-radius: 50%; bottom: 0; content: ''; display: block; left: 0; position: absolute; right: 0; top: 0 !important; transition: background 0.35s; z-index: 1; } .team-wrap .team-member figure img { height: 100%; left: 0; object-fit: cover !important; position: absolute; top: 0 !important; transition: all 0.35s; width: 100%; } .team-wrap .team-member figcaption { display: none; } .team-wrap .team-member .overlay-wrap { color: #fff; font-size: 18px; height: 100%; line-height: 24px; opacity: 0; position: absolute; text-align: center; top: 0; transition: opacity 0.35s, top 0.35s; width: 100%; z-index: 2; } .team-wrap .team-member .overlay-wrap .overlay { color: #fff; position: absolute; top: 50%; width: 100%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .team-wrap .team-member .overlay-wrap .overlay h3 { color: #fff; font-weight: bold; } .team-wrap .team-member .overlay-wrap .overlay p { margin: 0 !important; } .team-wrap .team-member .overlay-wrap .overlay p.bio { margin-top: 0.75em !important; } .team-wrap .team-member .overlay-wrap .overlay a { color: #fff !important; display: inline-block; padding: 2px 5px; text-decoration: none; } .team-wrap .team-member .overlay-wrap .overlay a:hover { color: #ef7c4d !important; } .team-wrap .team-member .overlay-wrap .overlay a.readmore { background: #fff; color: #000 !important; padding: 2px 10px; text-transform: uppercase; } .team-wrap .team-member .overlay-wrap .overlay a.readmore:hover { background-color: #2f3338 !important; color: #fff !important; } .team-wrap .team-member:hover, .team-wrap .team-member.hover .overlay-wrap { opacity: 1; } .team-wrap .team-member:hover figure::before, .team-wrap .team-member.hover figure::before { background: rgba(0,0,0,0.5); } .team-wrap .team-member:hover figure img, .team-wrap .team-member.hover figure img { -webkit-transform: scale(1.25); -ms-transform: scale(1.25); transform: scale(1.25); -webkit-filter: blur(5px); filter: blur(5px); } .team-content-wrap { display: none; } .team-content { max-width: 480px; width: 90%; } .team-content * + * { margin-top: 1em; } .team-content p { text-align: justify; } /* CONTACT *************************************************************************************************/ .vcard .geo { display: none; } /* MOBILE NAVIGATION *************************************************************************************************/ #nav-mobile { border-bottom: 0; max-width: 320px; padding: 0; right: 0; } #nav-mobile .menu { padding: 2%; } #nav-mobile .menu.subnav { background-color: #ef7c4d; } #nav-mobile .menu + .menu { margin-top: 2%; } #nav-mobile .menu li { border-top: none; opacity: 0; transition: all 0.35s; transform: translateX(40px); } #nav-mobile .menu a { text-transform: uppercase; } #nav-mobile .menu a:hover, #nav-mobile .menu a:focus { background: #ef7c4d; color: #fff; -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05); } #nav-mobile .menu.subnav a:hover, #nav-mobile .menu.subnav a:focus { background: #858484; } #nav-mobile.nav-active .menu li { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } #nav-mobile .menu li:first-child { transition-delay: 0; } #nav-mobile .menu li:nth-child(2) { transition-delay: 0.050s; } #nav-mobile .menu li:nth-child(3) { transition-delay: 0.100s; } #nav-mobile .menu li:nth-child(4) { transition-delay: 0.150s; } #nav-mobile .menu li:nth-child(5) { transition-delay: 0.200s; } #nav-mobile .menu li:nth-child(6) { transition-delay: 0.250s; } #nav-mobile .menu li:nth-child(7) { transition-delay: 0.300s; } #nav-mobile .menu li:nth-child(8) { transition-delay: 0.350s; } #nav-mobile .menu li:nth-child(9) { transition-delay: 0.400s; } #nav-mobile .menu li:nth-child(10) { transition-delay: 0.450s; } /* #nav-mobile .menu li:first-child { -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px); } #nav-mobile .menu li:nth-child(2) { -webkit-transform: translateY(-60px); -ms-transform: translateY(-60px); transform: translateY(-60px); } #nav-mobile .menu li:nth-child(3) { -webkit-transform: translateY(-90px); -ms-transform: translateY(-90px); transform: translateY(-90px); } #nav-mobile .menu li:nth-child(4) { -webkit-transform: translateY(-120px); -ms-transform: translateY(-120px); transform: translateY(-120px); } #nav-mobile .menu li:nth-child(5) { -webkit-transform: translateY(-150px); -ms-transform: translateY(-150px); transform: translateY(-150px); } #nav-mobile .menu li:nth-child(6) { -webkit-transform: translateY(-180px); -ms-transform: translateY(-180px); transform: translateY(-180px); } #nav-mobile .menu li:nth-child(7) { -webkit-transform: translateY(-210px); -ms-transform: translateY(-210px); transform: translateY(-210px); } #nav-mobile .menu li:nth-child(8) { -webkit-transform: translateY(-240px); -ms-transform: translateY(-240px); transform: translateY(-240px); } #nav-mobile .menu li:nth-child(9) { -webkit-transform: translateY(-270px); -ms-transform: translateY(-270px); transform: translateY(-270px); } #nav-mobile .menu li:nth-child(10) { -webkit-transform: translateY(-300px); -ms-transform: translateY(-300px); transform: translateY(-300px); } #nav-mobile.nav-active .menu li { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } */ .mobile-blur #container, .mobile-blur #footer-wrap, .mobile-blur #footer { filter: blur(1rem); } /* MOBILE NAVIGATION TOGGLE *************************************************************************************************/ #kets-mobile-toggle { color: #fff; cursor: pointer; display: none; font-size: 18px !important; height: 40px; line-height: 30px !important; margin: -20px 0 0; outline: none; padding: 5px 40px 5px 0; position: absolute; right: 2.5%; text-align: center; text-decoration: none; text-transform: uppercase; top: 50%; transition: all .35s; width: 130px; z-index: 20; } #kets-mobile-toggle span { background: currentColor; border-radius: 2px; display: block; font-size: 0; height: 4px; line-height: 0; position: absolute; right: 10px; transition: all .35s; width: 30px; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transform: rotate( 0deg ); -ms-transform: rotate( 0deg ); transform: rotate( 0deg ); } #kets-mobile-toggle span:nth-child(1) { top: 8px; } #kets-mobile-toggle span:nth-child(2), #kets-mobile-toggle span:nth-child(3) { top: 18px; } #kets-mobile-toggle span:nth-child(4) { top: 28px; } #kets-mobile-toggle.active { background-color: #ef7c4d; } #kets-mobile-toggle.active span { background: currentColor; } #kets-mobile-toggle.active span:nth-child(1), #kets-mobile-toggle.active span:nth-child(4) { right: 25px; top: 18px; width: 0; } #kets-mobile-toggle.active span:nth-child(2) { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } #kets-mobile-toggle.active span:nth-child(3) { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } /* MEDIA QUERIES *************************************************************************************************/ @media only screen and ( min-width: 1920px ) { .slider-wrap .overlay-wrap .overlay { font-size: 20px; line-height: 26px; } } @media only screen and ( min-width: 1000px ) { .blog .content-wrap .post.grid { margin-left: 0 !important; width: 33.33%; } #container .carousel-portfolio-wrap .carousel.carousel-showed-3 { max-width: calc( 100vw - ( 2 * 70px ) ); /*max-width: 1160px;*/ } .team-wrap .team-member { margin: 2% !important; width: 29.333%; } .team-wrap .team-member:nth-child(3n+1) { clear: both; } } @media only screen and ( min-width: 640px ) { .content .column-wrap { display: -webit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-align-content: space-between; align-content: space-between; -webkit-justify-content: space-between; justify-content: space-between; -webkit-flex-wrap: wrap; flex-wrap: wrap; } .content .column-wrap + .column-wrap { margin-top: 2em !important; } .content .column-wrap .column { width: 50%; } .content .column-wrap .col-l { padding-right: 2.5%; } .content .column-wrap .col-r { padding-left: 2.5%; } .content .column-wrap.columns-2 .col-l, .content .column-wrap.columns-3 .col-r { width: 55%; } .content .column-wrap.columns-2 .col-r, .content .column-wrap.columns-3 .col-l { width: 45%; } .content .column-wrap.columns-reverse { -webkit-flex-direction: row-reverse; flex-direction: row-reverse; } .content .column-wrap.columns-reverse .col-l { padding-left: 2.5%; padding-right: 0; } .content .column-wrap.columns-reverse .col-r { padding-left: 0; padding-right: 2.5%; } .blog .content-wrap .post:not(.grid) aside { width: 32.5%; } .blog .content-wrap .post:not(.grid):not(.no-post-thumbnail) .entry-content, .blog .content-wrap .post:not(.grid):not(.no-post-thumbnail) header { width: 65%; } /* .blog.post-type-archive-portfolio .content-wrap .post:not(.grid) aside { width: 40%; } .blog.post-type-archive-portfolio .content-wrap .post:not(.grid):not(.no-post-thumbnail) header { width: 60%; } .blog.post-type-archive-portfolio .content-wrap .post a { position: relative; align-items: center; display: grid; grid-template-columns: 40% 20% 40%; } .blog.post-type-archive-portfolio .content-wrap .post a > aside { grid-row: 1; float: none !important; width: 100% !important; } .blog.post-type-archive-portfolio .content-wrap .post a > header { grid-row: 1; float: none !important; width: 100% !important; } .blog.post-type-archive-portfolio .content-wrap .post:nth-child(even) a aside { grid-column: 1; } .blog.post-type-archive-portfolio .content-wrap .post:nth-child(even) a header { grid-column: 2 / span 2; } .blog.post-type-archive-portfolio .content-wrap .post:nth-child(odd) a aside { grid-column: 3; } .blog.post-type-archive-portfolio .content-wrap .post:nth-child(odd) a header { grid-column: 1 / span 2; } */ } @media only screen and ( max-width: 1920px ) { .slider-wrap .overlay-wrap .overlay { font-size: 1.042vw; line-height: 1.333; } } @media only screen and ( max-width: 1680px ) { #logo a { padding: 5px 2.381vw; } } @media only screen and ( max-width: 1440px ) { #nav-main > ul > li > a, #nav-sub > ul > li > a { font-size: 16px; max-width: 140px; min-width: 110px; padding: 5px; } /*#nav-main > ul > li > a, #nav-sub > ul > li > a { max-width: 120px; min-width: 100px; padding: 10px;*/ } @media only screen and ( max-width: 1280px ) { .carousel-portfolio-wrap .carousel:not(.carousel-content) > ul:not(.border-0) { padding: 0 0 80px; } .carousel-portfolio-wrap .slick-slider.arrows .slick-prev, .carousel-portfolio-wrap .slick-slider.arrows .slick-next { bottom: 20px; margin-top: 0; top: auto; } .carousel-portfolio-wrap .slick-slider.arrows .slick-prev { left: 50%; margin-left: -50px; } .carousel-portfolio-wrap .slick-slider.arrows .slick-next { left: 50%; margin-left: 10px; right: auto; } } @media only screen and ( max-width: 1200px ) { #header { padding: 0; } #nav-main, #nav-sub { display: none; } #kets-mobile-toggle { display: block; } #content-bouwgaranties .content { padding: 5% 2.5%; } .blog .content-wrap .post.grid { margin-left: 0 !important; width: 50%; } .blog .content-wrap .post.grid:nth-child(3n+1) { clear: none !important; } .js .waypoints-nav { left: 2.5%; margin: 0 !important; width: 20%; } } @media only screen and ( max-width: 1000px ) { #content-bouwgaranties ul { grid-gap: 15px; } #content-bouwgaranties h3 { font-size: 3vw; } #content-bouwgaranties li > a { max-width: 28vw; } .team-wrap .team-member { margin: 3% !important; width: 44%; } .team-wrap .team-member:nth-child(2n+1) { clear: both; } .team-wrap .team-member:last-child:nth-child(odd) { float: none; margin: 3% auto !important; background: pink !important; } .news-cta-subscribe { display: block; } #footer-widget-area { margin: 0 auto; max-width: 640px; width: 100%; } .widget > .icon { margin: 1.5em auto; } .widget.widget-kets-phone { grid-column: 1 / span 5; grid-row: 1; } .widget.widget-kets-hcard { grid-column: 1 / span 10; grid-row: 2; } .widget.widget-kets-hcard > * { margin-left: auto; margin-right: auto; max-width: 400px; } .widget.widget-kets-email { grid-column: 6 / span 5; grid-row: 1; } } @media only screen and ( max-width: 768px ) { .home .slider-wrap figure { height: auto !important; } .home .content-wrap.block-1 .entry-title + h1 { font-size: 1.778em; } .home .content-wrap.block-1 .entry-title + h1 + h2 { font-size: 1.111em; } a.scroll-to.double { bottom: 20px; height: 50px; margin-left: -25px; padding-top: 40px; width: 50px; } a.scroll-to.double::after, a.scroll-to.double::before { border-width: 3px; height: 30px; width: 30px; } a.scroll-to.double::after { top: -8px; } a.scroll-to.double::before { top: -18px; } a.scroll-to.double:hover::after { top: 0; } a.scroll-to.double:hover::before { top: -14px; } a.scroll-to.double span { display: none; } #content-bouwgaranties h1 { font-size: 1.667em; } #content-bouwgaranties ul { grid-template-columns: repeat( 2, 1fr ); } #content-bouwgaranties li > a { max-width: 33vw; } #content-bouwgaranties svg { height: 60px; width: 60px; } .team-wrap .team-member .overlay-wrap { font-size: 16px; line-height: 20px; } .blog.post-type-archive-portfolio .content-wrap .post header { padding: 14px 60px 14px 15px; } .blog.post-type-archive-portfolio .content-wrap .post header::after { background-size: 22px 22px !important; height: 30px; margin-top: -15px !important; right: 15px; width: 30px; } .portfolio-category a { display: block; } .cta-wrap.newsletter .form-wrap { padding-bottom: 10px; } .cta-wrap.newsletter .form-wrap fieldset p.small { width: 50%; } .cta-wrap.newsletter .form-wrap > p { bottom: 0; left: 15%; right: 15%; top: auto; width: auto; } .form-wrap fieldset { margin-top: 0; } #nav-footer, #about-the-author { text-align: center; } #nav-footer a { font-size: 14px; } } @media only screen and ( max-width: 640px ) { .home .content-wrap.block-1 .entry-title + h1 { font-size: 1.333em; } .home .content-wrap.block-1 .entry-title + h1 + h2 { font-size: 1em; } .kets-portfolio ul { display: block; } .column-wrap .column > *, .column-wrap .column + .column, .column-wrap p + .column { margin-top: 1em; } .blog .content-wrap .post.grid { border-top: 0px none !important; clear: both !important; float: none !important; padding-top: 0 !important; width: 100% !important; } #footer-widget-area { display: block; } .widget > .icon { margin: 0.5em auto; } .js .waypoints-wrap { padding-left: 2.5% !important; } .js .waypoint { min-height: 0; } .js .waypoints-nav { display: none !important; } } @media only screen and ( max-width: 480px ) { #logo { width: 50%; } .team-wrap .team-member { clear: both; float: none; margin: 5% !important; width: 90%; } .widget-kets-hcard .vcard p.tel { row-gap: 2px; grid-template-columns: repeat(2,1fr); } .widget-kets-hcard .vcard p.tel + p.tel { border-top: 1px solid #414040; margin-top: 0.75em !important; padding-top: 0.75em; } .widget-kets-hcard .vcard p.tel > span { text-align: left; } .widget-kets-hcard .vcard p.tel > span.name { font-weight: bold; } .widget-kets-hcard .vcard p.tel > a { text-align: left; grid-column: 1 / span 2; } }