#theBody.home #pageBlock1{ display: flex; flex-wrap: wrap; align-content: stretch; } #theBody.home #gedelegeerd-ontwikkelaar{ display: flex; flex-wrap: wrap; align-content: stretch; } #theBody.home #pageBlock1 .page-block-caption, #theBody.home #gedelegeerd-ontwikkelaar .page-block-caption{ order: 2; } #theBody.home #pageBlock1 .page-block-image, #theBody.home #gedelegeerd-ontwikkelaar .page-block-image{ order: 1; width: 100%; height: 300px; } #theBody.home #pageBlock1 .page-block-image img, #theBody.home #gedelegeerd-ontwikkelaar .page-block-image img{ width: 100%; height: 100%; object-fit: cover; } #theBody.home #pageBlock1 .page-block-caption-head, #theBody.home #gedelegeerd-ontwikkelaar .page-block-caption-head{ display: none; } .navbar-toggle .icon-bar-2{ width: 20px; margin-left: 20px; } #welcome .block-btns{ display: block; } #welcome .block-btns{ display: block; } #welcome .block-btns .btn-default{ padding: 0px; color: #ffffff!important; border: 0px!important; text-transform: none!important; position: relative; padding: 8px 45px 0px 0px; font-style: italic; } #welcome .block-btns .btn-default:hover{ color: #F7AB59!important; mix-blend-mode: difference; } #welcome .block-btns .btn-default::before{ position:absolute; display:block; width: 45px; height:100%; content: ' '; left: auto; right: 5px; top: 0px; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; z-index: 1; background:url("../img/btns/arrow-right-white.svg"); background-repeat: no-repeat; background-position: right center; background-size: 24px; } #welcome .block-btns .btn-default:hover::before{ right: 0px; } @media (min-width: 768px) { #theBody.home #pageBlockPage{ display: flex; justify-content: center; align-content: stretch; flex-wrap: wrap; } #theBody.home #pageBlock1, #theBody.home #gedelegeerd-ontwikkelaar{ width: 50%; margin-top: 30px; } #theBody.home #pageBlock1 .page-block-caption, #theBody.home #gedelegeerd-ontwikkelaar .page-block-caption, #theBody.home #pageBlock1 .page-block-image, #theBody.home #gedelegeerd-ontwikkelaar .page-block-image{ width: 100%; margin: 0px; } .home #pageBlock1 .page-block-caption .page-block-name h1, #theBody.home #gedelegeerd-ontwikkelaar .page-block-caption .page-block-subttl h3 p{ font-size: 24px; } } @media (min-width: 1280px) { #theBody.home #pageBlock1{ padding-right: 30px } #theBody.home #gedelegeerd-ontwikkelaar{ padding-left: 30px } } #theBody.gedelegeerd-ontwikkelaar-en-adviseur .page-block{ margin-bottom: 0px; margin-top: 0px; padding-top: 0px; padding-bottom: 0px; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur #pageBlock1{ margin-top: -60px; margin-bottom: -15px; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur .page-block .page-block-caption{ background: #3c3f40; padding-bottom: 0px; -webkit-box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.1); box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.1); } #theBody.gedelegeerd-ontwikkelaar-en-adviseur #pageBlock1 .page-block-caption .page-block-name h1, #theBody.gedelegeerd-ontwikkelaar-en-adviseur #pageBlock1 .page-block-caption .page-block-txt p, #theBody.gedelegeerd-ontwikkelaar-en-adviseur .page-block .page-block-caption .page-block-txt p, #theBody.gedelegeerd-ontwikkelaar-en-adviseur .page-block .page-block-caption .page-block-txt p a{ color: #ffffff; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur .page-block .page-block-intro h2{ padding: 0px; margin: 0px; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur .page-block .page-block-intro h2 p{ text-transform: uppercase!important; font-size: 14px; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur #pageBlock1 .page-block-caption .page-block-name{ display: none; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur #pageBlock1 .page-block-caption .page-block-txt p{ font-size: 18px; font-weight: 700; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur #pageBlock0.page-block .page-block-header-caption{ display: block; position: absolute; top: 0px; bottom: 0px; width: 100%; height: 100%; background: none; display: flex; align-content:center; flex-wrap: wrap; padding: 0px 30px; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur #pageBlock0 .page-block-header-caption .page-block-name h1{ color: #ffffff; font-weight: 800; font-size: 26px; text-align: right; text-transform: uppercase; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur #pageBlock0 .page-block-header-caption.page-block-caption .page-block-txt p{ display: none; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur .page-block.two-column-text .page-block-caption-head{ display: none!important; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur .page-block.two-column-text .page-block-caption .page-block-txt h2{ color: #F7AB59; font-size: 14px; margin-bottom: 0px; padding-bottom: 0px; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur #gedelegeerdeprojecten.page-block .page-block-caption-head{ display: none; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur #gedelegeerdeprojecten.page-block .page-block-ttl.ttl-only h2{ text-transform: uppercase!important; font-size: 14px; padding: 0px; width: 100%; font-weight: 700; color: #F7AB59; font-size: 14px; text-align: left; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur .block.projects{ width: 100%; margin-bottom: 30px; } @media (min-width: 650px) { #theBody.gedelegeerd-ontwikkelaar-en-adviseur .page-block-module{ display: flex; align-content: stretch; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur .block.projects{ width: calc(50% - 15px); margin-bottom: 30px; display: flex; align-content: stretch; flex-wrap: wrap; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur .block.projects .block-caption{ padding-bottom: 60px; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur .block.projects .block-caption .block-btns{ position: absolute; top: auto; bottom: 0px; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur .block.projects:nth-of-type(1){ margin-right: 30px; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur .block.projects:nth-of-type(3){ display: none; } } @media (min-width: 768px) { #theBody.gedelegeerd-ontwikkelaar-en-adviseur #pageBlock0 .page-block-header-caption .page-block-name h1{ color: #ffffff; font-weight: 800; font-size: 26px; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur #pageBlock0 .page-block-header-caption .page-block-name h1{ font-size: 36px; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur #pageBlock0 .page-block-header-caption.page-block-caption .page-block-txt p{ font-size: 20px; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur #pageBlock1 .page-block-caption .page-block-txt p{ font-size:22px; } } @media (min-width: 991px) { #theBody.gedelegeerd-ontwikkelaar-en-adviseur #pageBlock0.page-block .page-block-header-caption{ padding: 0px 45px; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur #pageBlock0 .page-block-header-caption .page-block-name h1{ font-size: 44px; word-break:normal; float: right; width: 270px; text-align: left; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur #pageBlock0 .page-block-header-caption.page-block-caption .page-block-txt p{ font-size: 20px; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur #pageBlock1 .page-block-caption .page-block-txt p{ font-size:28px; line-height: 34px; margin: 30px 0px; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur .page-block.two-column-text .page-block-caption{ display: flex; column-gap: 60px; align-content: flex-start; padding-bottom: 45px; padding-top: 15px; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur .page-block.two-column-text .page-block-caption .page-block-txt h2{ font-size: 16px; margin-top: 25px; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur #gedelegeerdeprojecten.page-block .page-block-ttl.ttl-only h2, #theBody.gedelegeerd-ontwikkelaar-en-adviseur .page-block .page-block-intro h2 p{ text-transform: uppercase!important; font-size: 18px; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur .block.projects{ width: calc(33.33% - 15px); margin-bottom: 90px; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur .block.projects:nth-of-type(1){ margin-right: 30px; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur .block.projects:nth-of-type(2){ margin-right: 30px; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur .block.projects:nth-of-type(3){ display: flex; } } @media (min-width: 1280px) { #theBody.gedelegeerd-ontwikkelaar-en-adviseur #pageBlock0.page-block .page-block-header-caption{ } #theBody.gedelegeerd-ontwikkelaar-en-adviseur #pageBlock0 .page-block-header-caption .page-block-name h1{ font-size: 60px; width: 350px; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur #pageBlock0 .page-block-header-caption.page-block-caption .page-block-txt p{ font-size: 24px; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur #pageBlock1 .page-block-caption .page-block-txt p{ font-size:34px; line-height: 38px; margin: 30px 0px; } #theBody.gedelegeerd-ontwikkelaar-en-adviseur .page-block{ padding-left: calc(50% - 610px); padding-right: calc(50% - 610px); } } .mainmenu ul li a.menu-link{ text-align: left; } .shrink.home #header .logo{ height: 60px; overflow: hidden; } .shrink.home.menuactive #header .logo{ overflow: visible } @media (min-width: 991px){ .shrink.home #header .logo{ height: 82px; } .navbar-toggle .icon-bar{ background: #1D1D1B!important; } #theBody .mainmenu { position: absolute; height: 0px; margin-top: 0px; padding: 0px; overflow: hidden!important; min-height: 0px; } #theBody.home .mainmenu{ margin: 0px!important; } #theBody .mainmenu::after{ position: absolute; top: auto; bottom: 0px; width: 100%; height: 100%; background-image: url("../img/frame/bgmenu.svg"); background-repeat: no-repeat; background-position: bottom center; background-size: 100%; display: block; content:""; opacity: 0; pointer-events: none; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; z-index: 0; } #theBody.menuactive .mainmenu{ min-height: 800px; background: #eef1f0; } #theBody.menuactive .mainmenu::after{ opacity:1; } #theBody.menuactive .logo .logo_st0{ fill: #000000; fill-opacity: 1; } #theBody.home.menuactive .logo{ width: 165px; padding: 30px 25px 0px 45px; } .navbar-toggle { display: block; } #theBody #header.menu-default .mainmenu .navbar{ position: absolute; left: 0px; width: 50%; height: 100%; display: flex; justify-content: flex-start; align-content: center; align-items: center; padding-left: 45px!important; z-index: 1; } #theBody #header.menu-default .mainmenu .navbar-nav{ flex-wrap: wrap; } #theBody #header.menu-default .mainmenu ul li{ width: 100%; } #theBody #header.menu-default .mainmenu ul li a{ text-align: left; font-size: 18px; margin: 15px 0px; } #theBody.home .mainmenu ul li a{ color: #1D1D1B; } #theBody.home .mainmenu ul li.active a{ color: #F7AB59; } #theBody.menuactive .menu-default #afterprojecten.afterMenu{ height: auto; display: flex; flex-wrap: wrap; pointer-events: all; max-height: none; } #theBody.menuactive .menu-default #afterprojecten.afterMenu ul.after-menu{ width: 100%; margin: 0px; display: flex; flex-wrap: wrap; } #theBody.menuactive .menu-default #afterprojecten.afterMenu ul.after-menu{ width: 100%; margin: 0px; display: flex; flex-wrap: wrap; } #theBody #header.menu-default .mainmenu ul .afterMenu ul li a{ font-size: 12px; margin: 5px 0px; padding-left: 30px!important; } #theBody #header.menu-default .mainmenu ul .afterMenu ul li a::before{ width: 10px; height: 10px; background: #F7AB59; display: block; content: ''; position: absolute; left: 0px; top: 2px; opacity: 1; } #theBody.menuactive.home .logo .logo_st1{ fill: #4B8AA9; } #theBody.menuactive.home .logo .logo_st2{ fill: #F7AB59; } #theBody.menuactive.home .logo .logo_st3{ fill: #D5D3CC; } } @media (min-width: 991px){ #theBody #header.menu-default .mainmenu ul li a{ padding-left: 0px!important; } #theBody.projecten .menu-default .afterMenu{ position: relative!important; top: 0px!important; left: 0px!important; padding: 0px!important; } .projecten #header{ height: 90px; } .menuactive.projecten #header{ height: 100vh; } } @media (min-width: 1440px){ #theBody #header.menu-default .mainmenu .navbar{ padding-left: 105px!important; } #theBody.home.menuactive .logo{ padding:30px 25px 0px 105px; width: 225px; } } #theBody #header.menu-default .mainmenu{ min-width: 100%!important; } #theBody #header.menu-default .mainmenu #menu-social{ position: absolute; top: auto; bottom: 15px; left: auto; right: 15px; width: 160px; padding: 0px; margin: 0px; display: flex; } #theBody #header.menu-default .mainmenu #menu-social .social-icons{ display: flex; justify-content: flex-end; } #theBody #header.menu-default .mainmenu #menu-social .social-label{ padding: 5px 0px 0px 0px; margin: 0px; } #theBody #header.menu-default .mainmenu #menu-social .social-icon{ float: right; padding: 0px; margin: 0px 0px 0px 10px; } @media (min-width: 768px){ .shrink.menuactive #header, .shrink.home.menuactive #header, .menuactive #header{ background: rgba(255, 255, 255, 0)!important; z-index: 100000; } #theBody #header.menu-default .mainmenu{ position: fixed; z-index: 100001; } #theBody #header.menu-default .mainmenu .navbar-nav{ margin: 0px!important; padding: 210px 30px 30px!important; } #theBody #header.menu-default .mainmenu{ max-width: 50%!important; min-width: 700px!important; } } @media (min-width: 768px){ #theBody #header.menu-default .mainmenu #menu-social .social-label{ padding: 0px 0px 0px 0px; margin: 0px; } } @media (min-width: 991px){ #theBody #header.menu-default .mainmenu{ box-shadow: 3px 0 5px -2px #000000; } #theBody #header.menu-default .mainmenu .navbar{ padding-top: 115px!important; width: 100%; } #theBody #header.menu-default .mainmenu .navbar-nav{ margin: 0px!important; padding: 30px 30px 30px 0px!important; } #theBody #header.menu-default .mainmenu{ min-width: 50%!important; max-width: 600px!important; } } @media (min-width: 1440px){ #theBody #header.menu-default .mainmenu .navbar{ padding-left: calc(50vw - 615px)!important; } }