/* 
 Theme Name:     CareToChange Wordpress Theme
 Author:         Irwo Kandziora
 Author URI:     http://www.irwo.nl
 Template:       Divi
 Version:        1.0 
*/

/* Add webfonts needed by the theme. Those will also be added to choose DIVI from the functions.php file */
/*** Lexend Deca ***/
@import url('https://fonts.googleapis.com/css2?family=Lexend+Deca:wght@200;400;700&display=swap');

/**************************/
/* Header top CTA Buttons */
/**************************/
a.ctc-cta-button {
	padding-top:4px;
	border-bottom-left-radius:5px;
	border-bottom-right-radius:5px;
	padding-bottom:6px;
	padding-left:10px;
	padding-right:10px;
	-webkit-transition-property: all!important;
	-webkit-transition-duration: .3s;
	-webkit-transitition-timing-function: ease;
	transisition-property: all!important;
	transisition-duration: .3s;
	transitition-timing-function: ease;
}
.ctc-cta-button-text {
	font-size:15px;
	line-height:19px;
	font-weight:700;
	color:#000;
}
.ctc-header-portal-icon, .ctc-header-phone-icon {
	font-size:14px;
	line-height:19px;
	color:#000;
}
#ctc-cta-tel-button {
	background-color:#BCCF00;
	margin-right:20px;
}
#ctc-cta-tel-button:hover {
	background-color:#008288;
}
#ctc-cta-portal-button {
	background-color:#FFE000;
}
#ctc-cta-portal-button:hover {
	background-color:#008288;
}
a.ctc-cta-button:hover .ctc-cta-button-text,
a.ctc-cta-button:hover .ctc-header-phone-icon,
a.ctc-cta-button:hover .ctc-header-portal-icon {
	color:#fff;
}
@media screen and (max-width: 1200px) {
	#ctc-cta-portal-button {
		margin-right:20px;
	}
	#ctc-cta-tel-button {
		padding-right:6px;
	}
	#ctc-top-navigation {
		margin-right:20px;
		margin-left:20px;
	}
}
@media screen and (max-width:600px) {
	#ctc-cta-button-text-tel {
		visibility: hidden;
		display: none;
	}
}

@media screen and (max-width: 479px) {
	#ctc-cta-tel-button, #ctc-cta-portal-button {
		margin-right:10px;
	}
	#ctc-top-navigation {
		margin-right:10px;
	}
}

/******************************/
/* Banner CTA circle + button */
/******************************/
p.ctc-cta-title {
	font-size:20px;
	line-height:22px;
	font-weight:bold;
	margin-top:50px;
}
a.ctc-cta-aanmeld-button {
	border-radius:5px;
	font-size:16px;
	line-height:40px;
	margin-top:90px;
	display:inline-block;
	font-weight:bold;
	color:#000;
	background-color:#FFE000;
	text-align:center;
	width:140px;
	-webkit-transition-property: all!important;
	-webkit-transition-duration: .3s;
	-webkit-transition-timing-function: ease;
	transisition-property: all!important;
	transisition-duration: .3s;
	transitition-timing-function: ease;
}
a.ctc-cta-aanmeld-button:hover {
	background-color:#008288;
	color:#fff;
}
@media screen and (max-width:979.99px) {
	p.ctc-cta-title {
		font-size:16px;
		line-height:18px;
		margin-top:37px;
	}
	a.ctc-cta-aanmeld-button {
		font-size:14px;
		line-height:28px;
		width:110px;
		margin-top:68px;
	}
}

/*************************************/
/* Menu styling 					 */
/*************************************/
@media screen and (min-width:980px) {
	#ctc-top-navigation .dd-menu-flex-item::after, #ctc-top-navigation .dd-active-url::after {
		content: "";
    	position: absolute;
    	bottom: 15px;
   		left: -5%;
    	width: 110%;
    	height: 5px;
    	background: rgb(255 224 0);
    	transition: transform .3s;
    	transitition-timing-function: ease;
		transform:scaleX(0);
    	z-index: -1;
	}
	#ctc-top-navigation .dd-menu-flex-item:hover::after, #ctc-top-navigation .dd-active-url::after {
		transform:scaleX(1);
	}
	#ctc-top-navigation .dd-menu-flex-sub {
		left: -30px!important;
		padding-top:20px!important;
		padding-bottom:20px!important;
		padding-left:20px!important;
		padding-right:20px!important;
		background-color:#ffffff!important;
		border-radius:10px!important;
		-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.45); 
		box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.45);
		transition:all .3s;
	}
}

@media screen and (max-width:979.99px) {
	#ctc-top-navigation .dd-menu-flex-sub {
		padding-top:10px!important;
		padding-bottom:10px!important;
		background-color:#ffffff!important;
		border-radius:10px!important;
		-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.45); 
		box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.45);
		margin-bottom:20px!important;
	}
}

/*************************************/
/* Green header section below banner */
/*************************************/
@media screen and (max-width:1300px) and (min-width:1055px) {
	.ctc-page-title-white {
		width:60%!important;
	}
}
@media screen and (max-width:1055px) and (min-width:980px) {
	.ctc-page-title-white {
		width:55%!important;
	}
}

/*************************************/
/* Aanmelden sectie homepage         */
/*************************************/
.ctc-underline-header h3 {
	position:relative;
	display:inline-block;
	padding-left:5px;
	padding-right:5px;
	color:#008288; 
}
.ctc-underline-header h3::after {
	content: "";
    position: absolute;
    bottom: 11px;
    left: 0;
    width: 100%;
    height: 7px;
    background: rgba(255, 224, 0, 0.5);
    transition: transform .3s;
	transitition-timing-function: ease;
	z-index:-1;
}

/*************************************/
/* Filialen sectie homepage          */
/*************************************/
.ctc-filiaal-home-container .ctc-filiaal-home-image::after {
	content:"";
	position:absolute;
	width:100%;
	height:100%;
	background-color:#ffe000;
	top:0;
	left:0;
	opacity:0;
	border-top-left-radius:5px;
	border-top-right-radius:5px;
	-webkit-transition-property: all!important;
	-webkit-transition-duration: .3s;
	-webkit-transitition-timing-function: ease;
	transisition-property: all!important;
	transisition-duration: .3s;
	transitition-timing-function: ease;
}
.ctc-filiaal-home-container:hover .ctc-filiaal-home-image::after {
	opacity:0.4;
}

/*************************************/
/* Behandelaar op filiaalpagina's    */
/*************************************/
@media screen and (min-width:981px) {
	.ctc-behandelaar-kolom {
		width:17.6%;
		margin-right:3%;
		float:left;
	}	
	.et_pb_row .ctc-behandelaar-kolom:nth-child(5n) {
		margin-right:0%;
	}
}
@media screen and (min-width:767px) and (max-width:980.999px) {
	.ctc-behandelaar-kolom {
		width:31.3333%;
		margin-right:3%;
		float:left;
	}
	.et_pb_row .ctc-behandelaar-kolom:nth-child(3n) {
		margin-right:0%;
	}
}
@media screen and (min-width:311px) and (max-width:768.999px) {
	.ctc-behandelaar-kolom {
		width:48.5%;
		margin-right:3%;
		float:left;
	}
	.et_pb_row .ctc-behandelaar-kolom:nth-child(2n) {
		margin-right:0%;
	}
}
@media screen and (max-width:310.999px) {
	.ctc-behandelaar-kolom {
		width:100%;
		float:left;
	}
}
.ctc-behandelaar-kolom {
	box-sizing:border-box;
	margin-bottom:30px;
}
.ctc-behandelaar-foto {
	margin-bottom: 5px!important;
    width: 100%;
    max-width: 100%!important;
    text-align: left;
    margin-left: 0;
	display:block;
	position:relative;
}
.ctc-behandelaar-foto img {
	border-radius:50%;
	border-width:8px;
	border-color:#ffe000;
	border-style:solid;
	display:block;
	position:relative;
	min-width:100%;
}
.ctc-behandelaar-kolom .ctc-behandelaar-foto::after {
	content:"";
	position:absolute;
	width:100%;
	height:100%;
	background-color:#ffe000;
	top:0;
	left:0;
	opacity:0;
	border-radius:50%;
	-webkit-transition-property: all!important;
	-webkit-transition-duration: .3s;
	-webkit-transitition-timing-function: ease;
	transisition-property: all!important;
	transisition-duration: .3s;
	transitition-timing-function: ease;
	display:block;
}
.ctc-behandelaar-kolom:hover .ctc-behandelaar-foto::after {
	opacity:0.4;
}
.ctc-behandelaar-naam h3 {
	margin-bottom:0;
	padding-bottom:0;
	font-weight: 700;
    font-size: 18px;
    color: #008288!important;
}
.ctc-behandelaar-kolom:hover .ctc-behandelaar-naam h3 {
	color:#000000!important;
}
.ctc-behandelaar-functie {
	font-size: 16px;
    line-height: 23px;
	color:#000000;
}
.ctc-behandelaar-kolom:hover .ctc-behandelaar-functie {
	color:#008288!important;
}
.ctc-behandelaar-naam, .ctc-behandelaar-functie {
	-webkit-transition-property: color!important;
	-webkit-transition-duration: .3s;
	-webkit-transition-timing-function: ease;
	transisition-property: color!important;
	transisition-duration: .3s;
	transitition-timing-function: ease;
}
/*************************************/
/* Vacature op filiaalpagina's    */
/*************************************/
.ctc-vacature-rij {
	padding-top:20px;
}
.ctc-vacature-rij .ctc-vacature-titel h3{
	font-size:18px;
	font-weight:700px;
	color: #444444!important;
}
.ctc-vacature-beschrijving p {
	margin-bottom:10px;
}
a.ctc-vacature-button {
	color: #000000!important;
    border-width: 1px!important;
    border-color: #000000;
    font-size: 16px;
    font-weight: 700!important;
    background-color: #FFFFFF;
	padding-right: 1em!important;
    padding-left: 1em!important;
	padding-top: .3em!important;
	padding-bottom: .3em!important;
	display: inline-block;
	background-size: cover;
    background-position: 50%;
    background-repeat: no-repeat;
    border: 2px solid;
    border-radius: 3px;
	-webkit-transition-property: all!important;
	-webkit-transition-duration: .3s;
	-webkit-transitition-timing-function: ease;
	transisition-property: all!important;
	transisition-duration: .3s;
	transitition-timing-function: ease;
}
a.ctc-vacature-button:hover {
	background-color:#008288!important;
	color:#ffffff!important;
	border-color:#008288!important;
}
/*************************************/
/* Formulier stijlen                 */
/*************************************/
.ctc-form-container {
	margin-bottom:30px;
	display:inline-block;
	width:100%;
}
.ctc-form-row {
	width:100%;
	position: relative;
    display: inline-block;
}
@media (max-width: 980px){
	.ctc-form-row .et_pb_column {
    	width: 100%;
    	margin-bottom: 10px;
	}	
}
.ctc-form-row .wpcf7-form-control {
	width:100%;
	font-size:18px;
	border-width:1px!important;
	border-radius:3px!important;
	padding-top:5px!important;
	padding-bottom:5px!important;
	padding-left:5px!important;
	padding-right:5px!important;
	margin-top:5px!important;
}
.ctc-form-row .wpcf7-form-control:focus {
	border-color:#008288!important;
	color:#000!important;
}
.ctc-form-row .wpcf7-list-item {
	margin-left:0px!important;
	margin-bottom:.5em;
}
.ctc-form-row .wpcf7-acceptance {
	padding-left:0px!important;
	padding-right:0px!important;
}
.ctc-form-button {
	color:#fff;
    border-width: 1px;
    border-color: #008288;
	border-style:solid;
	display: inline-block;
	line-height:1.7em;
    font-size: 18px;
    font-weight: 700!important;
    background-color: #008288;
	cursor:pointer;
	-webkit-transition-property: all!important;
	-webkit-transition-duration: .3s;
	-webkit-transitition-timing-function: ease;
	transisition-property: all!important;
	transisition-duration: .3s;
	transitition-timing-function: ease;
	border-radius:3px;
	padding:0.3em 1em;
}
.ctc-form-button:hover {
	color:#000;
	border-color:#000;
	background-color:#fff;
}
.ctc-form-button:disabled {
	opacity:.5!important;
}
.wpcf7-response-output {
	margin-left:0px!important;
	margin-right:0px!important;
	margin-top:1em!important;
	margin-bottom:0!important;
	border-radius:5px!important;
	border-color:#FFE000!important;
}
/*************************************/
/* Klant quote banners          	 */
/*************************************/
.ctc-referentie-banner:hover .ctc-klantquote-text h2,
.ctc-referentie-banner:hover .ctc-klantquote-text h3{
	/* color:#FFE000!important; */
	color:#FFFFFF!important; 
}
/*************************************/
/* Zorgkaart widget footer        	 */
/*************************************/
.et_pb_code_inner .zkn-widget-body .fractional_number sup {
	line-height:2.5em!important;
}