/**
Theme Name: ST55 Child theme
Author: Martijn Kerkdijk
Author URI: https://www.studio55.nl
Description: Child theme door studio55
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: st55-child-theme
Template: astra
*/

/********** Custom Css **********/
img.fl-photo-img.wp-image-2792.size-full:hover{
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
}

span.fake_link {
    color: #000000;
    text-decoration: underline;
}

.div_fake_link {
    display: flex;
    flex-direction: row;
    height: calc(50vh - 100px);
}

.titel-op-foto {
    position: absolute;
    width: 100%!important;
}

.project_div .fl-html {
    height: 100%;
}

span.nobreak {
    display: inline-block;
}

.stepper-block:hover {
    background: #f7f1e1;
}

span.goud {
    color: #d39700!important;
}

.fl-col-group.fl-node-607df343f1328 {
    margin-top: 40px;
    padding-top: -40px;
}

/* pinterest */
a.pinit-button.default [class*=" jpibfi-icon-"], a.pinit-button.default [class^=jpibfi-icon-] {
    color: #000!important;
}


a.pinit-button span {
    font-size: 52px !important;
}


a.pinit-button {
    height: 25px !important;
    width: 25px !important;	
}
a.pinit-button span::before {
    margin-top: -27px!important;
    margin-left: -22px!important;
}

a.pinit-button.default {
    display: block;
    overflow: inherit!important;
    text-decoration: none;
    color: #fff;
    background-color: #fff!important;
}

.hover-pinterest {
	display:none;
}

.hover-pinterest {
    position: relative;
    left: -70px;
    top: 20px;
}

/* team grid */

.team-content-inner {
    text-shadow: 1px 1px 2px black;
}

.box {
    position: absolute;
    bottom: 0;
    width: 100vw!important;
     backdrop-filter: grayscale(100%);
    background-image: radial-gradient(at center center, rgba(0,0,0,0.85) 60%, #000000 100%);
    z-index: 999;
}

.boxabove {
    position: absolute;
    top: 0;
    width: 100vw!important;
    backdrop-filter: grayscale(100%);
    background-image: radial-gradient(at center center, rgba(0,0,0,0.85) 60%, #000000 100%);
    z-index: 31;
    height: 210px!important;
}

#masthead .ast-container, .site-header-focus-item + .ast-breadcrumbs-wrapper {
    max-width: 100%;
    padding-left: 0px;
    padding-right: 0px;
}

@keyframes fadeInOpacity {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

.bovenbalk-tekst {
    z-index: 9999;
    padding-top: 150px;
    padding-left: 6%;
    color: #d39700;
    font-weight: 300;
    font-size: 3.5vw;
    letter-spacing: 5px;
	  text-shadow: 2px 2px 6px #000000;
    opacity: 1;
    animation-name: fadeInOpacity;
    animation-iteration-count: 1;
    animation-timing-function: ease-in;
    animation-duration: 2s;
}

.box2 {
    position: absolute;
    top: 0;
    backdrop-filter: grayscale(100%);
}




/* menu */
.uabb-creative-menu.uabb-menu-default .menu > li > .uabb-has-submenu-container > a {
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 5px!important;
    padding-right: 5px!important;
}

.uabb-creative-menu .menu > li {
    margin-top: 5px;
    margin-bottom: 5px;
    margin-left: 5px!important;
    margin-right: 5px!important;
}

.menu > li > a > span::after {
    content: "|";
	  padding-left:20px;
	  color:#d39700;
}

.menu > li > div > a > span::after {
    content: "|";
	  padding-left:20px;
	  color:#d39700;
}


.menu > li:last-of-type > a > span::after {
    content: ""!important;
	  padding-left:20px;
	  color:#d39700;
}

.menu > li:last-of-type > div > a > span::after {
    content: ""!important;
	  padding-left:20px;
	  color:#d39700;
}





/* elementen */

#ast-scroll-top {
    background-color: transparent;
    font-size: 32px;
    /* font-size: 2rem; */
    border: solid 2px #fff;
    border-radius: 35px;
    box-shadow: 1px #222;
    -webkit-box-shadow: 0px 0px 2px 0px #000000;
    box-shadow: 0px 0px 2px 0px #000000;
    text-shadow: 0px 0px 2px #000000;
}

.anchorlink {
    height: 0px!important;
    position: absolute;
}

.scrolldown {
    position: fixed;
	  bottom: 25px;
    left: 50vw;
    width: 50px;
    height: 50px;
    z-index: 99999;
    text-shadow: 0px 0px 2px #000000;
	  -webkit-animation:bounce 1s infinite;
	
}

@-webkit-keyframes bounce {
        0%   { transform: translateY(0); }
        30%  { transform: translateY(-5px); }
        50%  { transform: translateY(0); }
        100% { transform: translateY(0); }
    }




/* normale stijlen */

.verloop {
    height: 3px;
    background: #d39700;
    background: -moz-linear-gradient(left, #d39700 0%, rgb(255 255 255 / 0%) 60%);
    background: -webkit-linear-gradient(left, #d39700 0%,rgb(255 255 255 / 0%) 60%);
    background: linear-gradient(to right, #d39700 0%,rgb(255 255 255 / 0%) 60%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d39700', endColorstr='#ffffff',GradientType=1 );
}

.stepper-section {
    padding: 50px 0;
    min-height: 100vh;
}

/* projecten */

.lijst-mobiel {
	display:none;
}

.grote-afbeelding.fl-row-full-height .fl-row-content-wrap {
    min-height: 0px!important;
}

.hover_titel_wrap, .hover_titel_wrap .fl-module-content, .hover_titel_wrap .fl-module-content .fl-post-grid, .hover_titel_wrap .fl-module-content .fl-post-grid .fl-post-column, .hover_titel_wrap .fl-module-content .fl-post-grid .fl-post-column .fl-post-grid-post {
    height: 100%!important;
}

.title_div {
    height: 100%;
}

.hover_titel_wrap .fl-post-column {
    width: 100%!important;
}

.hover_title_div {
    background-color: rgb(0 0 0 /0%);
    -webkit-transition: background-color 0.5s ease-out;
    -moz-transition: background-color 1s ease-out;
    -o-transition: background-color 0.5s ease-out;
    transition: background-color 0.5s ease-out;
	height:100%;
}

.hover_title_div:hover {
    background-color: rgb(0 0 0 / 55%);
}

.hover_title_div a {
    opacity: 0%;
	  color:#fff!important;
    width: 100%;
    height: 100%;
    display: inline-flex;
    justify-items: center;
    justify-content: center;
    align-items: center;
    align-content: center;
    position: relative;
    clear: none;
	  font-size:20px;
}

.hover_title_div a:hover {
    opacity: 100%;
} 

span.icon_projecten {
    margin-right: 10px;
}

.fl-post-grid-post {
    background: none;!important;
	border: 0px solid #e6e6e6;
}



.ls-bg {
opacity: 1 !important;
}
.uabb-testimonial-author-description.uabb-text-editor {
	  font-size:16px;
    font-size: 1em!important;
}


/* blog */

.blog1 .fl-post-grid-post {
    max-height: 740px;
}

.lees_meer_link a {
    font-variant: all-petite-caps;
    font-size: 16px;
	  color: #d39700;
}

.blog1 .fl-post-grid-post {
    box-shadow: 2px 2px 11px 1px rgba(0,0,0,0.24);
}

.blog1 .fl-post-grid-post {
    background-color: #f6f6f6;
}

h4.blog-titel {
    min-height: 52px;
}

.ast-post-format- a {
    color: #d39700;
}

.nav-links a {
    color: #d39700!important;
}


.blog-titel a {
	color:#000;
	font-weight:600;
}

.blog-titel-blok {
	padding:20px;
}

.blog-tekst-blok {
    padding: 20px;
    font-size: 18px;
}

span.fl-post-grid-date{
color: #d39700;
}

.subtekst p {
    font-size: 1.2vw;
    font-weight: 300;
    padding-right: 3vw;
}

.koptekst h3 {
    font-size: 2.0em;
    font-weight: 300;
}

.koptekst h2 {
    font-size: 2.2em;
    font-weight: 300;
}

.brochure-bar {
    position: absolute;
    width: 43vw;
}

/* brochure */
.brochure-inner {
    top: -2vh;
    position: relative;
    max-width: 32vw;
    margin: auto;
}
.subtekst a 
{
		color: #000!important;
    border-bottom: solid 1px;
}

.aanvraagbalk a, .balkcontact a {
    color: #000!important;
    border-bottom: solid 1px;
	  font-weight: 400!important;
}

.aanvraagbalk p, .balkcontact p {
    font-weight: 400!important;
}

.brochure-inner a {
    border: none!important;
}



/* projecten grid */
.ast-col-sm-6.proj-rechts {
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: scroll;
    background-size: cover;
    height: 25vh;
    padding: 0px;
}

.ast-col-sm-6.proj-links {
    height: 25vh;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0px;
}

.ast-col-sm-6.proj-rechts img {
    width: 25vw;
    height: 25vh;
    object-fit: cover!important;
}

.ast-col-sm-6.proj-links img {
    width: 25vw;
    height: 25vh;
    object-fit: cover!important;
}

h3.proj-heading a {
    color: #000;
	  font-weight:600;
	  font-size: 1.2rem;
}

h3.proj-heading a:hover {
    color: #d39700;
}

.link-pijl a {
    font-size: 2em;
    color: #d39700;
}

.link-pijl a:hover {
    color: #000;
}

.proj-titel {
    text-align: left;
    line-height: 1;
}


/* formulieren */
body .gform_wrapper ul li.gfield {
    margin-top: 10px!important;
    padding-top: 0;
}

body .gform_wrapper .top_label div.ginput_container {
	margin-top: 5px!important;}
	
	.fl-node-5f4ff68dee5df .uabb-gf-style input[type=text] {
		    margin-top: 0px !important;
    margin-bottom: 0px !important;
}

.bottom-slider-tekst h2 {
	line-height: 1.4rem;}

.balkcontact {
background-image: radial-gradient(at center center, #d6a700 10%, #a87500 79%);
text-align:center;
	padding: 30px 10px 10px 10px;
	color:#fff;
	font-size:20px;
}


.contact-foto {
    margin-left: 20px;
    margin-right: 20px;
}

@media all and (min-width: 1024px) {
.contact-foto {
    margin-left: 25%;
    margin-right: 25%;
}
}

@media all and (min-width: 1280px) and (max-width: 1422px) {
	.uabb-creative-menu .menu > li > a, .uabb-creative-menu .menu > li > .uabb-has-submenu-container > a {
    font-size: 1em!important;
	}

.bottom-slider-tekst h2 {
	font-size: 0.7rem!important;}
	.bovenbalk-tekst {
    padding-top: 120px;
    font-size: 26px;
   }
	.boxabove {
    height: 165px!important;
}
h3.proj-heading a {
    color: #000;
	  font-weight:600;
	  font-size: 1.1rem;
}
}


@media all and (min-width: 1024px) and (max-width: 1280px) {
		.uabb-creative-menu .menu > li > a, .uabb-creative-menu .menu > li > .uabb-has-submenu-container > a {
    font-size: 1.0em!important;
	}
	.bottom-slider-tekst h2 {
		font-size: 0.6rem!important;}
	
		.boxabove {
    height: 165px!important;
}
	
	.bovenbalk-tekst {
    padding-top: 120px;
    font-size: 26px;
   }

	.subtekst p {
	font-size:1.0em;
  font-weight:300;}
	
	.koptekst h2 {
    font-size: 2.2em;
    font-weight: 300;
}
	

	.blog-titel a {
    font-size: 0.8em;
		line-height: 1.0em;
}
	
	.blog-tekst-blok {
    font-size: 17px;
}
	
	h4.blog-titel {
    min-height: 90px;
}
h3.proj-heading a {
    color: #000;
	  font-weight:600;
	  font-size: 0.9rem;
}
}


 
@media all and (min-width: 768px) and (max-width: 1024px) { 
	
			.boxabove {
    height: 130px!important;
}
	
	.bovenbalk-tekst {
    padding-top: 90px;
    font-size: 18px;
   }
	.subtekst p {
	font-size:1.0em;
  font-weight:300;}
	
	.koptekst h2 {
    font-size: 1.5em;
    font-weight: 300;
}
		a.menu-link {
    font-size: 20px!important;
}
		.main-navigation ul .menu-item .menu-link, .ast-header-break-point .main-navigation ul .menu-item .menu-link, .ast-header-break-point li.ast-masthead-custom-menu-items, li.ast-masthead-custom-menu-items {
    padding-top: 0px;
    padding-right: 30px;
    padding-bottom: 0px;
    padding-left: 20px;
}
	ul#primary-menu {
    padding: 0px 20px 0px 20px;
}

h3.proj-heading a {
    color: #000;
	  font-weight:600;
	  font-size: 0.8rem;
}
}
 
@media all and (min-width: 480px) and (max-width: 768px) {
	.ast-col-sm-6.proj-rechts {
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: scroll;
    background-size: cover;
    height: 35vh;
}
	
	.lijst-desktop {display:none;}
		.lijst-mobiel {display:block;}
	
	.fl-module.fl-module-rich-text.aanvraagbalk {
    min-height: 320px;
}
	
	.subtekst p {
	font-size:1.2em;
  font-weight:300;}

.koptekst h2 {
    font-size: 2.0em;
    font-weight: 300;
}
.bovenbalk-tekst {
    padding-top: 120px;
    font-size: 18px;
}
	
				.boxabove {
    height: 150px!important;
}
		.brochure-bar {
    width: 70vw;
}
	
	.brochure-inner {
    top: -2vh;
       max-width: 100vw;
 }
	
		a.menu-link {
    font-size: 20px!important;
}
		.main-navigation ul .menu-item .menu-link, .ast-header-break-point .main-navigation ul .menu-item .menu-link, .ast-header-break-point li.ast-masthead-custom-menu-items, li.ast-masthead-custom-menu-items {
    padding-top: 0px;
    padding-right: 30px;
    padding-bottom: 0px;
    padding-left: 20px;
}
	ul#primary-menu {
    padding: 0px 20px 0px 20px;
}
		.main-navigation ul .menu-item .menu-link, .ast-header-break-point .main-navigation ul .menu-item .menu-link, .ast-header-break-point li.ast-masthead-custom-menu-items, li.ast-masthead-custom-menu-items {
    padding-top: 0px;
    padding-right: 30px;
    padding-bottom: 0px;
    padding-left: 20px;
}
	ul#primary-menu {
    padding: 0px 20px 0px 20px;
}
	
.blog1 .fl-post-grid-post {
    max-height: 820px!important;
}
}
 
@media all and (max-width: 480px) {	
	.ast-col-sm-6.proj-rechts {
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: scroll;
    background-size: cover;
    height: 35vh;
}
	
	.lijst-desktop {display:none;}
		.lijst-mobiel {display:block;}

	h3.proj-heading-mobiel a {
		font-size:0.7em;
    color: #000;
	  font-weight:600
}

h3.proj-heading-mobiel a:hover {
    color: #d39700;
}

	
	.link-pijl-mobiel a {
    font-size: 2em;
    color: #d39700;
}

.link-pijl-mobiel a:hover {
    color: #000;
}
	
	.fl-module.fl-module-rich-text.aanvraagbalk {
    min-height: 320px;
}
	
	.subtekst p {
	font-size:1.0em;
  font-weight:300;} 
	
	.koptekst h2 {
    font-size: 2.0em;
    font-weight: 300;
}
	.bovenbalk-tekst {
    padding-top: 80px;
    font-size: 2.5vw;
}
	
	span.site-logo-img {
    max-width: 75%;
}
	
	.boxabove {
		height:110px!important;
	}
	
	.brochure-bar {
    width: 70vw;
}
	
	.brochure-inner {
    top: -2vh;
       max-width: 100vw;
 }
	
		a.menu-link {
    font-size: 20px!important;
}

	.main-navigation ul .menu-item .menu-link, .ast-header-break-point .main-navigation ul .menu-item .menu-link, .ast-header-break-point li.ast-masthead-custom-menu-items, li.ast-masthead-custom-menu-items {
    padding-top: 0px;
    padding-right: 30px;
    padding-bottom: 0px;
    padding-left: 20px;
}
	ul#primary-menu {
    padding: 0px 20px 0px 20px;
}
	
	.blog1 .fl-post-grid-post {
    max-height: 820px!important;
}	
}

@media all and (min-width: 1423px) {
.ctabuttonhome {
    width: 360px;
    position: absolute;
    z-index: 32;
    top: 94px;
    right: 0;
	}
	
	.ctabuttonstappen {
    width: 360px;
    position: absolute;
    z-index: 32;
    top: 94px;
    right: 0;
	}
}

@media all and (min-width: 1026px) and (max-width: 1422px) {
.ctabuttonhome {
    width: 300px;
    position: absolute;
    z-index: 32;
    top: 71px;
    right: 0;
	}
	
.ctabuttonstappen {
    width: 300px;
    position: absolute;
    z-index: 32;
    top: 71px;
    right: 0;
	}
}

@media all and (max-width: 1025px){
.ctabuttonhome {
    position: absolute;
    width: 300px;
    z-index: 32;
    bottom: 80px;
    left: 0;
}
	.ctabuttonstappen {
    position: absolute;
    width: 300px;
    z-index: 32;
    bottom: 80px;
    left: 0;
}
	.ctabuttonhome .fl-photo-content.fl-photo-img-png {
    background: rgb(8 8 8 / 70%);
    border-radius: 5px;
}
		.ctabuttonstappen .fl-photo-content.fl-photo-img-png {
    background: rgb(8 8 8 / 70%);
    border-radius: 5px;
}
.fl-builder-content.fl-builder-content-2798 {
    position: relative;
}
}
@media all and (max-width: 480px){
.ctabuttonhome {
    position: absolute;
    width: 250px;
    z-index: 100;
    bottom: 90px;
    left: -5px;
	}
	
.ctabuttonstappen {
    position: absolute;
    width: 250px;
    z-index: 31;
    top: 60vh;
    left: -5px;}
}
@media all and (max-width: 992px){
	.team-modal-descrition {
    font-size: 12px!important;
		padding: 0px 0px!important;
}	
}


@import url('https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap');
body {
    background: #fff;
    margin: 0px;
    padding: 0px;
    color: #000;
    font-family: 'Ubuntu', sans-serif;
    font-size: 16px;
    line-height: 28px;
    word-wrap: break-word; 
}
a {
    text-decoration: none;
    transition: all 0.6s;
}
a:hover, a:focus {
    text-decoration: none;
    outline: none; 
    box-shadow: none !important;
    color: inherit;
}
h1, h2, h3, h4, h5, h6 {
    color: #000;
    margin: 0 0 10px;
    font-family: 'Ubuntu', sans-serif;
    line-height: 1;
}
/****** Team ******/
.team-section {
    padding: 0px;
}
.team-wrapper {
    max-width: 100vw;
    padding: 0px;
    margin: 0 auto;
}
.team-row {
    display: flex;
    flex-wrap: wrap;
    position: relative;
    flex-direction: row;
}
.team-column-12 {
    max-width: 100%;
    position: relative;
    flex: 100%;
}
.team-column-6 {
    max-width: 50%;
    position: relative;
    flex: 50%;
}
.team-column-3 {
    position: relative;
    flex: 25%;
    max-width: 25%;
}
.img-max {
    max-width: 100%;
    height: auto;
}
.team-block {
    position: relative;
    overflow: hidden;
    filter: gray;
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
    transition: all 0.4s ease;
}
.team-block:hover {
    filter: gray;
    -webkit-filter: grayscale(0);
    filter: grayscale(0);
}
.team-block .team-background-box {
    background: #808080;
    width: 100%;
    min-height: 25vh;
}
.team-block .team-image {
    height: 25vh;
}
.team-block .team-image img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}


.team-block .team-content {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    text-align: center;
    color: #fff;
    display: block;
    width: 100%;
    height: 100%;
    line-height: 20px;
    font-size: 13px;
}
.team-block .team-content .team-content-inner {
    display: block;
    position: absolute;
    bottom: 0;
    width: 100%;
}

.team-content-inner h3, .team-content-inner span {
    background: rgb(209 150 0 / 55%);
    display: block;
}

.team-block .team-content .team-content-inner h3 {
    font-size: 18px;
    margin-bottom: 0;
    color: #fff;
    font-weight: 400;
}

.team-modal {
    background: #ccc;
    text-align: center;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
   /* height: calc(100% - -158px); */
	height: 200%;
    z-index: 1050;
    color: #a78451;
    font-size: 14px;
    line-height: 20px;
    transition: all 0.5s ease;
    transform: scale(0);
    opacity: 0;
    visibility: hidden;
}
.team-modal.active{
    transform: scale(1);
    opacity: 1;
    visibility: visible;
}
.team-modal .bg-image {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}
.team-modal [class*="team-column-"] {
    position: initial;
}
.team-modal .team-row,
.team-modal .team-modal-inner {
    height: 100%;
}
.team-modal .team-modal-content {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding: 10px;
    align-items: center;
    height: 100%;
}

.team-modal-descrition {
    font-size: 1.2vw;
    line-height: 1.2;
    font-weight: 200;
	padding: 0px 40px;
	    color: #6d5127;
}

.team-modal .author-name {
    margin-bottom: 3px;
    color: #6d5127;
}

h4.author-name {
    font-weight: 600;
	font-size: 1.2vw;
}

@media(max-width: 991px){
    .team-column-3 {
        flex: 50%;
        max-width: 50%;
    }
    .team-block .team-image {
        height: 150px;
    }
    .team-block .team-background-box {
        min-height: 150px;
    }
    .team-modal .team-row {
        height: 250px;
        background: #ccc;
        max-width: 70%;
        margin: 0 auto;
    }
    .team-modal {
        position: fixed;
        left: 0;
        right: 0;
        top: 0;
        height: 100%;
        padding: 0px 20px;
        background: rgb(0 0 0 / 0.85);
        overflow: auto;
        display: table;
    }
    .team-modal-inner{
        display: table-cell;
        vertical-align: middle;
    }
    .team-modal .close_btn {
        display: block !important;
        max-width: 70%;
        margin-left: calc(100% - 19%);
        width: 40px;
        height: 40px;
        background: #a78451;
        color: #fff;
        text-align: center;
        font-size: 25px;
        border-radius: 50px;
        margin-bottom: 12px;
        line-height: 36px;
        outline: 0;
    }
    .team-modal .team-row .team-column-6 {
        flex: 50%;
        max-width: 50%;
    }
}
@media(max-width: 767px){
    .team-modal .author-name {
        font-size: 15px;
        line-height: 1;
    }
    .team-modal .position {
        font-size: 13px;
    }
    .team-row .team-column-6:not(.team-modal .team-column-6) {
        max-width: 100%;
        flex: 100%;
    }
    .team-column-3 {
        margin-bottom: 10px;
    }
    .team-modal .team-row {
        max-width: 100%;
    }
    .team-modal .close_btn {
        margin-left: auto;
    }
}

/****** Steppen ******/
.stepper-section{
    position: relative;
}
.stepper-section:before {
    width: 50%;
    position: absolute;
    left: 0;
    right: 0;
    top: calc(100% - 85.8%);
    content: "";
    height: 50px;
    background: #e3e3e3;
}
*, ::after, ::before {
    box-sizing: border-box;
}
.stepper-section {
    padding: 50px 0;
}
.stepper-wrapper {
    max-width: 100vw;
    padding: 0 100px;
    margin: 0 auto;
}
.stepper-row {
    display: flex;
    flex-direction: row;
    margin: 0 -49px;
    position: relative;
    flex-wrap: wrap;
    justify-content: center;
}
.stepper-column-4 {
    max-width: 33.33%;
    position: relative;
    flex: 33.33%;
    padding: 25px 49px;
}

.img-max {
    max-width: 100%;
    height: auto;
}
.stepper-block {
    background: #fff;
    border: solid 3px #e3e3e3;
    padding: 12px;
    cursor: pointer;
    z-index: 99;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    min-height: 108px;
}
.stepper-block .stepper-content {
    max-width: 65%;
    flex: 65%;
    align-self: center;
}
.stepper-block .stepper-content .stepper-content-inner {
    padding-left: 15px;
}
.stepper-block .stepper-content h3 {
    color: #949494;
    font-weight: 400;
    margin-bottom: 0;
    line-height: 1.2;
    font-size: 17px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.stepper-block .stepper-icon {
    max-width: 35%;
    flex: 35%;
    text-align: right;
}
.stepper-block .stepper-icon img {
    max-width: 100px;
    width: 100%;
}
.stepper-block .stepper-content .stepper-number {
    text-align: center;
    width: 50px;
    height: 50px;
    display: inline-block;
    position: absolute;
    left: -25px;
    border: solid 3px #cacaca;
    top: 5px;
    line-height: 43px;
    font-size: 28px;
    color: #000;
    border-radius: 50px;
    background: #fff;
}
.stepper-row:before {
    content: "";
    border-bottom: solid 50px #e3e3e3;
    width: 100%;
    position: absolute;
    left: 0;
    right: 0;
    top: calc(50% - 25px);
}
.stepper-row.cornerright:after, .stepper-row.cornerleft:after {
    content: "";
    width: 50px;
    position: absolute;
    left: 0;
    right: 0;
    height: 72%;
    background-color: #e3e3e3;
    display: block;
    top: -54px;
    margin-left: auto;
}
.stepper-row.cornerright .stepper-column-4:first-child {
    order: 2;
}
.stepper-row.cornerleft:after {
    margin-left: 0;
    top: 111px;
}
.stepper-row:first-child.cornerleft:after {
    width: 0;
}
.stepper-row:last-child.cornerright:before {
    width: 75%;
    margin-left: auto;
}
.stepper-row.cornerleft:after {
    margin-left: 0;
    top: -54px;
}
.stepper-row.cornerleft:before {
    border-top-right-radius: 30px;
    border-bottom-left-radius: 30px;
}
.stepper-row.cornerright:before {
    border-bottom-right-radius: 30px;
    border-top-left-radius: 30px;
}
.stepper-row.cornerleft:first-child:before {
    border-bottom-left-radius: 0;
}
.stepper-popup {
    background: #f2f2f2;
    max-width: 35vw;
    margin: 0 auto;
}
.stepper-popup .stepper-popup-inner {
    position: relative;
}
.stepper-popup .stepper-popup-title-bar {
    display: flex;
    flex-wrap: wrap;
    padding: 10px 20px;
    align-items: center;
}
.stepper-popup .stepper-popup-title-bar .stepper-popup-content {
    max-width: 70%;
    flex: 70%;
    padding: 0 10px;
}
.stepper-popup .stepper-popup-title-bar .stepper-popup-icon {
    max-width: 30%;
    flex: 30%;
    padding: 0 10px;
}
.stepper-popup .stepper-popup-title-bar .stepper-popup-icon img {
    max-width: 80px;
    margin: 0 auto;
}
.stepper-popup .stepper-popup-title-bar .stepper-popup-number {
    text-align: center;
    width: 35px;
    height: 35px;
    display: inline-block;
    position: absolute;
    left: -20px;
    border: solid 2px #e3e3e3;
    top: 5px;
    line-height: 30px;
    font-size: 16px;
    color: #5d4a25;
    border-radius: 50px;
    background: #f5e4c6;
}
.stepper-popup .stepper-popup-content h3 {
    color: #5d4a25;
    margin-bottom: 0;
    font-size: 22px;
    line-height: 1.2;
}
.stepper-popup .stepper-popup-image {
    height: 60vh;
    line-height: 0;
    overflow: hidden;
}
.stepper-popup .stepper-popup-image img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: top;
}
.stepper-popup .stepper-popup-description {
    padding: 15px 20px;
    font-size: 15px;
    line-height: 24px;
    color: #5d4a25;
}
.stepper-popup .stepper-popup-description p {
    margin: 0;
}
.stepper-popup .stepper-popup-description a {
    color: #d69d0f;
    font-weight: 500;
}
.stepper-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999999;
    background: rgba(0,0,0,.9);
    display: block;
    overflow: auto;
}
.stepper-modal .close_btn {
    float: right;
    font-size: 40px;
    font-weight: 400;
    color: #d49904;
    line-height: 15px;
    height: 26px;
    margin: 35px 30px 0px 0px;
    position: relative;
    z-index: 2;
    text-decoration: none;
}
body.bio_overlay {
    overflow: hidden;
}
.stepper-modal .item {
    padding: 60px 50px;
}
#stepper-detail .owl-nav [class*="owl-"] {
    position: absolute;
    top: 42%;
    z-index: 2;
    color: #ffffff;
    font-size: 40px;
    background-color: #000;
    width: 40px;
    height: 80px;
    outline: 0;
    margin: 0;
}
#stepper-detail .owl-nav .owl-next {
    right: 0;
}
#stepper-detail .owl-nav .owl-prev {
    left: 0;
}
#stepper-detail {
    clear: both;
}
/**** Media Query ****/
@media(max-width: 991px){
	
	.stepper-popup {
    background: #f2f2f2;
    max-width: 400px;
    margin: 0 auto;
}

.stepper-popup .stepper-popup-image {
    height: 230px;
    line-height: 0;
    overflow: hidden;
}
	
    .stepper-column-4 {
        padding: 25px 20px;
    }
    .stepper-row{
        margin: 0 -20px;
    }
    .stepper-column-4 {
        max-width: 100%;
        flex: 100%;
    }
    .stepper-column-4 {
        padding: 0px 20px 25px;
    }
    .stepper-wrapper {
        padding: 0 20px 0 50px;
    }
    .stepper-row:before {
        width: 3px !important;
        height: 100%;
        left: -22px;
        top: 0;
        right: auto;
        background: #e3e3e3;
        border-radius: 0 !important;
    }
    .stepper-row:after {
        width: 0 !important;
    }
    .stepper-block:before {
        content: "";
        width: 30px;
        height: 3px;
        background: #e3e3e3;
        position: absolute;
        left: -42px;
        top: 30%;
    }
    .stepper-section:before {
        width: 0;
    }
    .team-wrapper > .team-row:nth-child(odd) .team-column-3:nth-child(odd), 
    .team-wrapper > .team-row:nth-child(even) .team-column-3:nth-child(even) {
        display: none;
    }
	.stepper-row.cornerright {
    flex-direction: column-reverse;
}
}
@media(max-width: 767px){
    .team-row .team-column-6 {
        max-width: 100%;
        flex: 100%;
    }
    .team-row .team-column-3{
        margin-bottom: 0 !important;
    }
}
@media(max-width: 480px){
    #stepper-detail .stepper-popup .stepper-popup-title-bar .stepper-popup-content, 
    #stepper-detail .stepper-popup .stepper-popup-title-bar .stepper-popup-icon {
        max-width: 100% ;
        flex: 100% ;
        text-align: center;
    }
    #stepper-detail .stepper-popup .stepper-popup-title-bar .stepper-popup-content {
        order: 2;
        padding: 10px 0;
    }
}