/* CSS Document */

/*
#tien-geboden .card{
    background: none; padding: 0px 0px; border: 0px solid #000000; border-radius: 0px;
}
#tien-geboden .card .card-header{
    background: #f0f0f0; border-radius: 0px; border: 0px solid #000000;
}
#tien-geboden .card .card-header h4{
    font-size: 1.2em; padding: 5px 0px 5px 45px; margin: 0px; position: relative;
}
#tien-geboden .card .card-header h4 a{
    font-family: headfont; text-decoration: none; color: #000000;
}

#tien-geboden .card .card-header h4 a::before{
    display: block;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    position:absolute;
    
    left: 0px; top: 50%;
	
    -webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease;
    
    width: 30px; height: 30px; border: 2px solid #191919;
    border-radius: 50%; margin-top: -15px;
    
    font: var(--fa-font-light);
    content: "\f061";
    font-size: 15px;
    line-height: 26px; text-align: center;
    
    color: #000000;
    transform: rotate(90deg);
}
#tien-geboden .card .card-header h4 a.collapsed::before{
    transform: rotate(0deg);
}
#tien-geboden .card .card-body{
    background: #e0e0e0; border-radius: 0px; border: 0px solid #000000;
}
*/



#filosofie.page-block.left{
    background: url("../img/gradient-2.jpg");
    background-size: cover;
    background-position: center center;
}

#meer-weten.page-block.cta-fixed{
    position: fixed;
    width: 140px; height: auto; left: auto; right: 0px; top: 30vh; overflow: hidden;
    max-height: 160px; height: 160px;
    width: 30px; overflow: hidden;
	
	-webkit-transition: width 0.4s ease-out;;
	-moz-transition: width 0.4s ease-out;;
	-o-transition: width 0.4s ease-out;;	
	transition: width 0.4s ease-out;;
	
	background: var(--basecolorMedium);
    background: url("../img/gradient-2.jpg");
    background-size: cover;
    background-position: center center;
	
	border: 0px;
}
#meer-weten.page-block.cta-fixed.showME{
    width: 140px!important;
}

#meer-weten.page-block.cta-fixed .page-block-caption{
	padding: 0px 0px 0px 30px; width: 140px; display: flex; flex-wrap: wrap;
}


#meer-weten.page-block.cta-fixed .page-block-caption-head{
	display: none;
}

#meer-weten.page-block .page-block-caption .page-block-ttl{
    width: 140px; height: auto; padding: 0px 5px 10px 5px;
	display: flex; justify-content: flex-start; align-content: flex-end; align-items: flex-end;
}
#meer-weten.page-block .page-block-caption .page-block-ttl h2,
#meer-weten.page-block .page-block-caption .page-block-ttl h2 a{
	font-size: 24px; padding: 0px; margin: 0px;
    color: #ffffff; height: 100%; display: flex; align-content: center; align-items: center;
}
#meer-weten.page-block .page-block-caption .page-block-link{
	position: absolute; top: auto;  bottom: 0px; left: 30px; width: 160px; height: 30px;
	transform: rotate(-90deg);
	transform-origin: bottom left;
	display: flex; justify-content: center;
    padding: 0px;    
}
#meer-weten.page-block .page-block-caption .page-block-txt{
	width: 100%; padding: 0px 5px;
	font-size: 12px; color: #ffffff;
}
#meer-weten.page-block .page-block-caption .page-block-txt p{
	font-size: 12px; color: #ffffff;
}

#meer-weten.page-block .page-block-caption .page-block-link .btn-primary{
    border: 0px!important; height: 30px; line-height: 30px; background: none!important; padding: 0px!important;
}
#meer-weten.page-block .page-block-caption .page-block-link .btn-primary span{
    text-transform: uppercase; color: #ffffff; font-size: 12px; letter-spacing: 0.1em;
}

#meer-weten.page-block .page-block-caption .page-block-link .btn-primary::before,
#meer-weten.page-block .page-block-caption .page-block-link .btn-primary::after{
    display: none;
}
#meer-weten.page-block.cta-fixed .page-block-caption::after {
    position: absolute;
    margin: 0px;
    text-align: left;
    left: auto;
    right: 5px;
    top: 5px;
    font-size: 20px;
    -webkit-transition: left 0.4s ease;
    -moz-transition: left 0.4s ease;
    -o-transition: left 0.4s ease;
    transition: left 0.4s ease;
    content: "+";
    width: 30px;
    height: 100%;
    display: flex;
	color: #ffffff;
    justify-content: center;
    align-content: flex-start;
    align-items: flex-start;
}


#contact-moment.page-block.cta-fixed{
    position: fixed;
    width: 140px; height: auto; left: auto; right: 0px; top: calc(30vh + 175px); overflow: hidden;
    max-height: 160px; height: 160px;
    width: 30px; overflow: hidden;
	
	-webkit-transition: width 0.4s ease-out;;
	-moz-transition: width 0.4s ease-out;;
	-o-transition: width 0.4s ease-out;;	
	transition: width 0.4s ease-out;;
	
	background: var(--basecolorMedium);
    background: url("../img/gradient-3.jpg");
    background-size: cover;
    background-position: center center;
	border: 0px;
}
#contact-moment.page-block.cta-fixed.showME{
    width: 140px!important;
}

#contact-moment.page-block.cta-fixed .page-block-caption{
	padding: 0px 0px 0px 30px; width: 140px; display: flex; flex-wrap: wrap;
}


#contact-moment.page-block.cta-fixed .page-block-caption-head{
	display: none;
}

#contact-moment.page-block .page-block-caption .page-block-ttl{
    width: 100%; height: auto; padding: 0px 5px 10px 5px;
	display: flex; justify-content: flex-start; align-content: flex-end; align-items: flex-end;
}
#contact-moment.page-block .page-block-caption .page-block-ttl h2,
#contact-moment.page-block .page-block-caption .page-block-ttl h2 a{
	font-size: 24px; padding: 0px; margin: 0px;
    color: #ffffff; height: 100%; display: flex; align-content: center; align-items: center;
}
#contact-moment.page-block .page-block-caption .page-block-link{
	position: absolute; top: auto;  bottom: 0px; left: 30px; width: 160px; height: 30px;
	transform: rotate(-90deg);
	transform-origin: bottom left;
	display: flex; justify-content: center;
    padding: 0px;    
}
#contact-moment.page-block .page-block-caption .page-block-txt{
	width: 100%; padding: 0px 5px;
	font-size: 12px; color: #ffffff;
}
#contact-moment.page-block .page-block-caption .page-block-txt p{
	font-size: 12px; color: #ffffff;
}

#contact-moment.page-block .page-block-caption .page-block-link .btn-primary{
    border: 0px!important; height: 30px; line-height: 30px; background: none!important; padding: 0px!important;
}
#contact-moment.page-block .page-block-caption .page-block-link .btn-primary span{
    text-transform: uppercase; color: #ffffff; font-size: 12px; letter-spacing: 0.1em;
}

#contact-moment.page-block .page-block-caption .page-block-link .btn-primary::before,
#contact-moment.page-block .page-block-caption .page-block-link .btn-primary::after{
    display: none;
}
#contact-moment.page-block.cta-fixed .page-block-caption::after {
    position: absolute;
    margin: 0px;
    text-align: left;
    left: auto;
    right: 5px;
    top: 5px;
    font-size: 20px;
    -webkit-transition: left 0.4s ease;
    -moz-transition: left 0.4s ease;
    -o-transition: left 0.4s ease;
    transition: left 0.4s ease;
    content: "+";
    width: 30px;
    height: 100%;
    display: flex;
	color: #ffffff;
    justify-content: center;
    align-content: flex-start;
    align-items: flex-start;
}



.block.highlights .block-caption .block-ttl h2{
    color:  var(--textcolor);
}
#stepbystep.page-block{
	padding-top: 30px;
}
#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block .block-caption .block-txt{
    color:  var(--highlightcolor);
}
#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block::after{
    color:  var(--textcolorSecondair);
}

#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block .block-caption .block-txt p{
    color:  var(--textcolorSecondair); font-size: 1.2em;
}

.page-block.fancyform{
	padding-top: 40px;
}

@media(min-width:991px) {
#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block{
    background: var(--basecolorMedium);
}
}




#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block::before{
	border-left: 1px solid var(--basecolorMedium);
}
#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block::after{
	color: var(--basecolorMedium);
}

#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block:hover::before{
	border-left: 3px solid var(--basecolorMedium);
}
#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block .block-caption::after,
#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block:hover::after{
	color: var(--basecolorMedium);
}

#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block .block-caption::after{
	color: var(--textcolor);
}

#stepbystep.page-block .page-block-link{
    text-align:left; margin-top: 30px;
}


@media (min-width: 991px) {
	#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block::before{
		border-left: 0px solid var(--basecolorMedium);
		border-top: 1px solid var(--basecolorMedium);
	}

	#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block:hover::before{
		border-left: 0px solid var(--basecolorMedium);
		border-top: 1px solid var(--basecolorMedium);
	}
}





#stepbystep.page-block .page-block-caption{
	padding-top: 60px;
}
    


#stepbystep.page-block .page-block-caption .page-block-module .block-listing{
	grid-gap: 5px; padding-left: 18px;
    grid-template-columns: repeat(1, 1fr);
}
#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block.highlights{
    border: 0px; padding: 15px 15px 15px 75px;
    
}
#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block.highlights .block-caption{
	align-content: flex-start;
	margin: 15px 0px 15px 0px;
}
#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block.highlights .block-caption .block-ttl{
	order: 1;
}
#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block.highlights .block-caption .block-ttl h3{
    color: var(--basecolorMedium); font-size: 40px; margin-left: -85px;  position: absolute; margin-top: 5px;
}
#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block.highlights .block-caption .block-txt{
	order: 2;
}
#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block.highlights .block-caption .block-ttl h2,
#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block.highlights .block-caption .block-txt{
	text-align: left;
}

#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block::before{
	position: absolute; display: block; content: '';
	text-align: left; top: 0px; left: 55px; height: 100%; z-index: 1;
    -webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease; width:30px; justify-content: flex-end;
}
#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block:nth-last-of-type(1)::after{
    
}

#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block::after{
	position: absolute; margin: 0px; line-height: 40px; height: 23px;
	text-align: left; top: auto; bottom: 0px; left: 41.5px; z-index: 1;
	font: var(--fa-font-thin);
	content: "\f078"; font-size: 30px;
    -webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	transition: all 0.4s ease;
}

@media (min-width: 991px) {
    
	#stepbystep.page-block .page-block-caption .page-block-module .block-listing{
		grid-gap: 5px; padding-left: 0px;
    grid-template-columns: repeat(4, 1fr);
	}
    
    #stepbystep.page-block .page-block-caption .page-block-module .block-listing .block.highlights{
		background: none; padding:  90px 0px 15px 0px;
    }
    
	#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block::after{
		line-height: 40px; height: 23px;
		text-align: right; top: 90px; bottom: auto; left: auto; right: -1px;
		content: "\f054"; width:30px; justify-content: flex-end;
	}
	#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block::before{
		position: absolute; display: block; content: '';
		text-align: left; top: 109.9px; left: 0px; width: 100%; z-index: 1; height: 0px;
	}
	#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block:hover::after{
        color:var(--textcolor)!important;
	}
	.block.highlights .block-caption .block-ttl h2{
		font-size: 1.6em;
	}

    #stepbystep.page-block .page-block-caption .page-block-module .block-listing .block.highlights .block-caption .block-ttl h3{
        font-size: 50px; margin-left: 0px;  margin-top: -90px; 
    }

    #stepbystep.page-block .page-block-caption .page-block-module .block-listing .block .block-caption .block-txt p{
        font-size: 1.0em; padding-right: 15px; margin-bottom: 0px; padding-bottom:0px;
    }
    
    #stepbystep.page-block .page-block-caption .page-block-module .block-listing .block .block-caption::after{
        position: absolute; margin: 0px;
        text-align: left; left: 0px; z-index: 1;
        font: var(--fa-font-thin);
        font-size: 30px;
        -webkit-transition: left 0.4s ease;
        -moz-transition: left 0.4s ease;
        -o-transition: left 0.4s ease;
        transition: left 0.4s ease;

        line-height: 40px; height: 23px;
        text-align: right; top: -15px; bottom: auto; 
        content: "\f054"; width:30px; justify-content: flex-end;

        opacity: 0;
    }
    
    #stepbystep.page-block .page-block-caption .page-block-module .block-listing .block:hover .block-caption::after{
        left: calc(100% - 28px);

        opacity: 1;
    }
    
    #stepbystep.page-block .page-block-link{
        margin-top: 0px; padding-top: 0px; text-align: right;
    }
	
	

	#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block:nth-last-of-type(1) .block-caption::before{


		position: absolute; display: block; content: '';
		text-align: left; top: 5px; left: 100%; height: 100%; z-index: 1;
		-webkit-transition: all 0.4s ease;
		-moz-transition: all 0.4s ease;
		-o-transition: all 0.4s ease;
		transition: all 0.4s ease; width:0px; justify-content: flex-end;
		border-right: 1px solid var(--basecolorMedium);

	}

	#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block:nth-last-of-type(1)::after{
		top: 100%; right: -15.1px; margin-top: -53px;
		content: "\f078";
	}
	
    #stepbystep.page-block .page-block-caption .page-block-module .block-listing .block:nth-last-of-type(1) .block-caption::after{
        left: 100%; margin-left: -14.5px;
        content: "\f078";
        -webkit-transition: top 0.4s ease;
        -moz-transition: top 0.4s ease;
        -o-transition: top 0.4s ease;
        transition: top 0.4s ease;
    }
    #stepbystep.page-block .page-block-caption .page-block-module .block-listing .block:nth-last-of-type(1):hover .block-caption::after{
        top: calc(100% - 23px);
    }
	
	
	
	
	#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block:hover::before,
	#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block:nth-last-of-type(1):hover .block-caption::before{
        border-color:var(--textcolor)!important;
	}
	
	
#stepbystep.page-block .page-block-caption .page-block-module .block-listing .block.highlights .block-caption{
	min-height: 160px;
}
	
	#stepbystep.page-block .page-block-link .btn-primary{
		transform: translate(10%, -25%) 
	}
}


@media (min-width: 1280px) {
	#stepbystep.page-block .page-block-link .btn-primary{
		transform: translate(25%, -25%) 
	}
}

@media (min-width: 1440px) {
	#stepbystep.page-block .page-block-link .btn-primary{
		transform: translate(50%, -25%) 
	}
}

.btn-primary.scrolldown{
	display: none!important;
}

@media (min-width: 768px) {
#theBody.boutique-salons #pageBlock1.page-block.center.default .page-block-name{
	padding-right: 35%;
}
}
@media (min-width: 1280px) {
#theBody.boutique-salons #pageBlock1.page-block.center.default .page-block-name{
	padding-right: calc(25% - 90px);
}
}



#reviews.page-block.list-click-detail.slideshow{
}


#reviews.page-block.list-click-detail.slideshow .carousel .carousel-item .block{
	border: 0px; padding: 30px!important; height: 350px; display: flex; justify-content: center; align-content: center; align-items: content: '';
}
#reviews.page-block.slideshow .page-block-module .carousel-indicators .active{
	background: var(--basecolor);
}

#reviews.page-block.list-click-detail.slideshow .carousel .carousel-control-prev,
#reviews.page-block.list-click-detail.slideshow .carousel .carousel-control-next,
#reviews.page-block.list-click-detail.slideshow .carousel .carouselState{
	display: none;
}
#reviews.page-block.list-click-detail.slideshow .carousel .carousel-item .block .block-caption{
	height: auto; margin: 0px; padding:0px; max-width: 500px;
}
#reviews.page-block.list-click-detail.slideshow .carousel .carousel-item .block .block-caption .block-ttl h2,
#reviews.page-block.list-click-detail.slideshow .carousel .carousel-item .block .block-caption .block-ttl h3,
#reviews.page-block.list-click-detail.slideshow .carousel .carousel-item .block .block-caption .block-ttl h4{
	text-align: center; display: block; width: 100%; padding: 0px; margin: 0px;
}
#reviews.page-block.list-click-detail.slideshow .carousel .carousel-item .block .block-caption .block-ttl h2{
	color: var(--basecolorMedium);
	color: var(--basecolor);
}
#reviews.page-block.list-click-detail.slideshow .carousel .carousel-item .block .block-caption .block-txt p{
	text-align: center; display: block; width: 100%; padding: 0px; margin: 15px 0px;
}

#reviews.page-block.list-click-detail.slideshow .carousel .carousel-item .block .block-caption .block-ttl h3,
#reviews.page-block.list-click-detail.slideshow .carousel .carousel-item .block .block-caption .block-ttl h4{
	color: var(--basecolorMedium); 
}
#reviews.page-block.list-click-detail.slideshow .carousel .carousel-item .block .block-caption .block-ttl h4 span{
	display: inline-block; text-transform: uppercase;
	color: var(--basecolorMedium); padding-right: 5px;
	color: var(--basecolor);
}

#reviews.page-block.list-click-detail.slideshow .carousel .carousel-item .block{
	
}


#reviews.page-block.list-click-detail.slideshow .carousel .carousel-item .block .block-caption .block-txt p{
	font-size: 1.3em; line-height: 1em;
}
#reviews.page-block.list-click-detail.slideshow .carousel .carousel-item .block .block-caption .block-ttl h3{
	font-size: 1em;
}
