/**
 * ---------------------------------------------------------------------------------------------------- #
 *
 * Allgemein     
 *
 */
 
@font-face {
  font-family: 'EB Garamond';
  font-style: normal;
  font-weight: 400;
  src: local('EB Garamond'), local('EBGaramond'), url(https://fonts.gstatic.com/s/ebgaramond/v7/kYZt1bJ8UsGAPRGnkXPeFYgp9Q8gbYrhqGlRav_IXfk.woff2) format('woff2'), url(https://fonts.gstatic.com/s/ebgaramond/v7/kYZt1bJ8UsGAPRGnkXPeFbrIa-7acMAeDBVuclsi6Gc.woff) format('woff');
}
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 400;
  src: local('Raleway'), url(https://fonts.gstatic.com/s/raleway/v9/QAUlVt1jXOgQavlW5wEfxQLUuEpTyoUstqEm5AMlJo4.woff2) format('woff2'), url(https://fonts.gstatic.com/s/raleway/v9/cIFypx4yrWPDz3zOxk7hIQLUuEpTyoUstqEm5AMlJo4.woff) format('woff');
}
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 600;
  src: local('Raleway SemiBold'), local('Raleway-SemiBold'), url(https://fonts.gstatic.com/s/raleway/v9/xkvoNo9fC8O2RDydKj12bwzyDMXhdD8sAj6OAJTFsBI.woff2) format('woff2'), url(https://fonts.gstatic.com/s/raleway/v9/xkvoNo9fC8O2RDydKj12b73hpw3pgy2gAi-Ip7WPMi0.woff) format('woff');
}
@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 700;
  src: local('Raleway Bold'), local('Raleway-Bold'), url(https://fonts.gstatic.com/s/raleway/v9/JbtMzqLaYbbbCL9X6EvaIwzyDMXhdD8sAj6OAJTFsBI.woff2) format('woff2'), url(https://fonts.gstatic.com/s/raleway/v9/JbtMzqLaYbbbCL9X6EvaI73hpw3pgy2gAi-Ip7WPMi0.woff) format('woff');
}


body {
	position: relative;
	font-family: 'EB Garamond', serif;
    font-size: 19px;
	line-height: 27px;
	font-weight: 400;
	background-color: #fff;
    color: #4f4f4e;
    cursor: default;
    margin: 0;
    padding: 0;
}

a {
	text-decoration: underline;
	color: #4f4f4e;
}

.article_overons a {
	text-decoration: none !important;
}

a:hover {
	text-decoration: underline;
	cursor: pointer;
}

h1, h2, h3, h4, p, ul, li, a {
	margin: 0;
	padding: 0;
}

h1, h2, h3, h4, h5, .primary_nav li a {
	font-family: 'Raleway', sans-serif;    
}

::-moz-selection { 
    background-color: #4f4f4e; 
    color: #fff;
}

::selection { 
    background-color: #4f4f4e; 
    color: #fff; 
}

a, a:hover, ul#tabs li:hover, ul#tabs li h3 {
	-moz-transition: all 0.1s ease-in-out 0s;
    -webkit-transition: all 0.1s ease-in-out 0s;
    -o-transition: all 0.1s ease-in-out 0s;
    transition: all 0.1s ease-in-out 0s;
}

strong {
    font-weight: 600;
}

.article_huis .content > p,
.article_afspraak .content > p,
#afspraak_informatie > p,
.article_informatie #tab li p,
.article_contact .content > p,
.imprint p {
	-moz-hyphens: auto;
    -webkit-hyphens: auto;
    -o-hyphens: auto;
    hyphens: auto;
}

.textbox {
    bottom: 50px;
    left: 50%;
    position: absolute;
    text-align: center;
}

.logo {  
    display: block;
    margin: 0 0 15px;
    z-index: 11;
    background-color: #fff;
}

.logo_content {
    display: block;
    width: 260px;
}

.quote {
    border: 5px solid #eee;
    font-size: 21px;
    line-height: 25px;
    padding: 12px 20px;
    background-color: #fff;
    color: #333;
    display: inline-block;
    font-weight: 600;
    text-transform: uppercase;
    -moz-transform: translate(-50%,0);
    -webkit-transform: translate(-50%,0);
    -o-transform: translate(-50%,0);
    transform: translate(-50%,0);
}

.button {
    border: 2px solid #999;
    color: #777;
    display: inline-block;
    font-family: "Raleway",sans-serif;
    font-weight: 600;
    margin: 20px 0;
    padding: 7px 14px 9px;
    position: relative;
    border-radius: 4px;
    text-decoration: none;
}

.button:hover {
	top: 1px;
    border: 2px solid #666;
    color: #444;
    text-decoration: none;
}

.scroll_up,
.scroll_down {
	position: fixed;
	right: 3%;
	display: block;
	width: 40px;
	height: 40px;
	cursor: pointer;
	z-index: 11;
	border: none;
}

.scroll_up {
	top: 0;
	background: #333 url(../images/arrow_up.svg) no-repeat scroll 0 0;
	/* background: rgba(0,141,209,0.6) url(../images/arrow_up.svg) no-repeat scroll 0 0; */
}

.scroll_down {
	top: 41px;
	background: #333 url(../images/arrow_down.svg) no-repeat scroll 0 0;
}

/* Slide-Menü */

.wrapper_logo {
    display: block;
    height: 200px;
}

.wrapper_logo:hover {
	background: #282828;
}

.logo_nav {
	display: block;
}

.main_nav {
    background-color: #333;
    color: #FFFFFF;
    height: 100%;
    left: -200px;
    position: fixed;
    top: 0;
    width: 200px;
    z-index: 13;
    font-size: 14px;
}

.toggle_nav {
	display: block;
	position: fixed;
	top: 0;
	left: 3%;
	width: 40px;
	height: 40px;
	background: #333 url(../images/menu.svg) no-repeat scroll 0 0;
	cursor: pointer;
	z-index: 11;
}

/* Toggle */

.main_nav,
.toggle_nav,
.main_nav.active,
.main_nav.active .toggle_nav,
.page_content,
.page_content.active {
	-moz-transition-duration: 0.3s;
    -webkit-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

.main_nav.active {
	left: 0;
}

.main_nav.active .toggle_nav {
	left: 200px;
}

.page_content.active {
	left: 200px;
}

/* Menü-Styling */

.main_nav ul li {
    border-bottom: 1px solid #282828;
    text-align: center;
}

.main_nav ul li:first-child {
    border-top: 1px solid #282828;
}

.main_nav ul li:hover {
    background-color: #282828;
}

.main_nav ul li a {
    color: #fff;
    display: block;
    font-size: 13px;
    letter-spacing: 0.07em;
    padding: 8px 10px;
    text-transform: uppercase;
}

.main_nav ul li a:hover {
    text-decoration: none;
}

.meta_info {
    bottom: 0;
    left: 0;
    padding: 20px;
    position: absolute;
}


/* Content */

.page {
	overflow: hidden;
}

.page_content {
	position: relative;
	top: 0;
	left: 0;
	min-height: 1000px;
}

.wrapper_map {
	display: block;
}

.maps {
	display: none;
}

.img_maps {
	width: 100%;
    margin: 0 0 -8px;
}

.slider_wrap {
    background-color: #eee;
    padding: 3%;
    width: 94%;
}


/* Artikel */


.img_swiper {
	display: block;
    width: 100%;
    height: auto;
}

.content {
    float: left;
    padding: 5% 10% 7%;
    width: 80%;
}

h2 {
    font-size: 30px;
    font-weight: 700;
    line-height: 40px;
    margin: 0 0 40px;
    text-transform: uppercase;
}

article {
	position: relative;
	min-height: 370px;
	overflow: hidden;
}

.logo_icon_box {
	display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.logo_icon_box img {
	display: flex;
}

.logo_icon {
	width: 28px;
}

/* HOME */

.article_huis .content {
    text-align: center;
    padding: 6% 10% 7%;
}

.article_huis .content > p {
    padding: 0 25%;
    margin: -15px 0 20px 0;
}


/* OVER ONS */

.persoon_wrapper {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
}

.persoon_afbeelding_envelop {
	position: relative;
    width: 150px;
    height: 200px;
    margin: 0 auto 30px;
}

.persoon_afbeelding_doos {
	display: inline-block;
    width: 150px;
    height: 200px;
    overflow: hidden;
    border: 5px solid #eee;
}

.persoon {
    text-align: center;
    margin-bottom: 40px;
}

.img_fullsize {
	display: block;
    width: 94%;
    height: auto;
    background-color: #eee;
    padding: 3%;
}

.img_persoon {
    display: block;
    height: auto;
    
    /*width: auto;*/
    /*max-height: 220px;*/
    margin: 0 auto;
    
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.persoon h4 {
    font-size: 14px;
    font-weight: 600;
    line-height: 15px;
    margin: 20px 0 10px;
}

.persoon p {
    color: #888;
    font-size: 15px;
    line-height: 20px;
}

/* AFSPRAAK */


#afspraak_informatie {
	display: none;
	padding: 40px 0 10px 0;
}

.article_afspraak .content > p {
    width: 48%;
}

#afspraak_informatie > p {
    width: 48%;
}

.article_afspraak .button {
    margin: 10px 0px 20px 0px;
}

.opening {
    border: 5px solid #eee;
    float: right;
    padding: 17px 25px;
    width: 40%;
}

.opening_col1 {
    border-right: 1px solid #eee;
    float: left;
    padding: 0 4% 0 3%;
    width: 46%;
}

.opening_col2 {
    float: right;
    margin: 0;
    width: 35%;
}

h3 {
    font-weight: 600;
    margin: 10px 0;
}

.more {
	display: block;
    color: #999;
    font-weight: 700;
    margin: 25px 0 0;
}

.more.active {
    display: none;
}


/* INFORMATIE */

.article_informatie .content > ul {
    margin: 0 0 35px;
    overflow: hidden;
    padding: 0 0 20px;
}

.article_informatie .content #tabs li {
    display: inline-block;
    float: left;
    margin: 0 50px 0 0;
    position: relative;
}

.article_informatie .downloads > li {
    margin: 0 30px 10px 0;
    padding: 0 0 0 28px;
    width: 140px;
}

.article_informatie .downloads > li:before {
    background: url("../images/pdf.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    content: ".";
    left: 0;
    position: absolute;
    text-indent: -9999px;
    width: 31px;
}

.article_informatie #tab li p {
    width: 48%;
}

.article_informatie #tab #Behandelingen p {
    -moz-columns: 1 auto;
    -webkit-columns: 1 auto;
    -o-columns: 1 auto;
    columns: 1 auto;
    width: 100%;
    float: left;
}

.downloads {
    position: relative;
}

/* Tabnavi */

ul#tabs {
    list-style-type: none;
    padding: 0;
    text-align: center;
    border-bottom: 1px solid #eee;
}

ul#tab {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

ul#tab > li {
    display: none;
}

ul#tab > li.active {
    display: block;
}

ul#tabs li {
	color: #999;
	cursor: pointer;
}

ul#tabs li:hover h3,
ul#tabs li.active h3 {
	color: #333;
	cursor: pointer;
}

.gm-style-iw p {
    height: 20px;
}

/* Footer */

.page_footer {
    padding: 4% 10% 2% 10%;
    background-color: #111;
    overflow: hidden;
}

.wrapper_footerbox {
    overflow: hidden;
}

.footerbox {
    overflow: hidden;
	font-family: 'Raleway', sans-serif;
}

.footerbox .overview {
	float: right;
}

.footerbox .social {
	float: right;
}

.footerbox .social li {
	float: left;
}

.footerbox .social li a {
	display: block;
	text-align: center;
	width: 80px;
}

.footerbox > span {
    color: #aaa;
    float: left;
    font-size: 12px;
    font-weight: 600;
    margin: 2px 40px 0 0;
}

.footerbox .overview li:last-child,
.footerbox .social li:last-child {
    margin: 0 0 0 0;
}

.img_social {
    width: 38px;
}

.img_social:hover {
    opacity: 0.8;
}

/* Popup */

#popupDialog {
	display: none;
    position: fixed;
    top: 0;
    z-index: 10000;
    width: 100%;
    height: 100%;
    overflow: scroll;
    box-sizing: border-box;
    left: 0;
    text-align: center;
    background: rgba(0, 0, 0, 0.1);
    padding: 50px 20px 20px;
}

#popupDialogOverlay {
    display: none;
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color: rgba(222, 222, 222, 0.85);
    z-index: 9999;
}

#popupDialogClose {
	position: absolute;
    width: 40px;
    height: 40px;
    right: 3%;
    top: 0;
    align-items: center;
    font-size: 19px;
    justify-content: center;
    display: flex;
    color: #ce4c4c;
    background-color: #ffffff;
    cursor: pointer;
    z-index: 9999;
}

#popupDialogClose:hover {
	cursor: pointer;
}

#popupDialogInhalt {
    height: 100%;
}

#online-afspraak {
	width: 100%;
    max-width: 550px;
    height: 100%;
    max-height: 650px;
    border: none;
}

.btn_label {
    font-style: italic;
    color: #999;
    white-space: nowrap;
}

/* Impressum */

.article_contact .content > p {
    width: 48%;
}

.imprint {
	display: none;
	color: #999;
	padding: 30px 0;
}

.imprint.active {
	display: block;
	padding: 15px 0 40px 0;
}

.imprint p {
    color: #bbb;
    font-family: Raleway;
    font-size: 13px;
    line-height: 23px;
    margin: 0 0 10px;
    width: 48%;
}

.imprint h3 {
    margin: 0 0 10px 0;
    font-weight: 400;
    text-transform: uppercase;
}

.imp > a {
    color: #999;
    font-size: 16px;
}

.pagination-header, .pagination-team {
    background-color: #eee;
    bottom: 0;
    cursor: default;
    padding: 0 5px 1px 13px;
    position: absolute;
    right: 50%;
    transform: translate(50%, 0px);
    z-index: 20;
}

.last {
	margin: 0 0 0 0 !important;
}


@media screen and (min-width: 901px) and (max-width: 1015px) {

	.logo {
		margin: 0 0 7px 0;
	}
	
	.slogan h3 {
		font-size: 20px;
	}


	.content {
		padding: 7% 10% 9% 10%;
	}
	
	.content p,
	.imprint p {
		-moz-columns: 1;
		-webkit-columns: 1;
		-o-columns: 1;
		columns: 1;
	}
	
	.page_footer {
		margin: : 5% 10% 3% 10%;
	}
	
	
}


@media screen and (min-width: 501px) and (max-width: 899px) {

	ul#tabs {
		padding: 0 0 20px 0;
	}
	
	ul#tabs > li {
	    width: 40%;
	    margin: 0 10% 0 0;
	    text-align: left;
	}
	
}

@media screen and (min-width: 771px) and (max-width: 900px) {


}


@media screen and (max-width: 770px) {

	.textbox {
		bottom: 16%;
	}
	
	.quote {
	    font-size: 18px;
	    line-height: 24px;
	    padding: 7px 11px;
	}
	
	.article_huis .content > p {
	    margin: -15px 0 20px;
	    padding: 0 5%;
	}
	
	
	#afspraak_informatie > p,
	.article_informatie #tab li p,
	.imprint p {
		width: 100%;
	}
	
}


@media screen and (min-width: 671px) and (max-width: 770px) {

	.img_social {
	    width: 33px;
	}
	
	.footerbox .overview li {
	    margin: 0 0 10px 0;
	}
	
	.scroll_down, .scroll_up {
		display: none;
	}
	
	.footerbox > span {
	    color: #aaa;
	    font-size: 13px;
	    margin: 0;
	}
	
}

@media screen and (max-width: 670px) {

	
	.content,
	.article_huis .content {
	    padding: 10%;
	}

	.pagination {
		display: none;
	}
	
	.opening {
	    border: 5px solid #eee;
	    float: left;
	    margin: 0 0 40px;
	    padding: 4% 5%;
	    width: 90%;
	}
	
	ul#tabs {
		text-align: left;
	}
	
	.article_contact .content > p,
	.article_afspraak .content > p,
	.imprint p,
	.article_informatie #tab li p {
		width: 100%;
	}
	
	.article_informatie #tab li p {
	    -moz-columns: 1 auto;
	    -webkit-columns: 1 auto;
	    -o-columns: 1 auto;
	    columns: 1 auto;
	}
	
	.article_informatie ul#tabs li {
	    width: 100%;
	    margin: 0 0 5px;
	}
	
	.article_informatie ul#tabs {
	    padding: 0 0 20px;
	}
	
	.article_huis .content h2 {
	    font-size: 24px;
	    line-height: 32px;
	}
		
	.wrapper_map {
		display: none;
	}
	
	.maps {
		display: block;
	}

	
}

@media screen and (min-width: 501px) and (max-width: 670px) {

	.slogan {
		display: none;
	}
	
	.logo_content {
	    width: 230px;
	}


}

@media screen and (min-width: 401px) and (max-width: 500px) {

	body {
		font-size: 17px;
		line-height: 27px;
	}
	
	.logo_content {
	    width: 200px;
	}
	
	.main_nav ul li a {
	    font-size: 17px;
	    padding: 13px 20px;
	    border-left: 3px solid #111111;
	}
	
	.main_nav ul li a:hover {
	    border-left: 3px solid #eee;
	}
	
	.content {
	    padding: 9% 10% 14% 10%;
	}
	
	.content > p,
	.imprint > p {
	    line-height: 25px;
	}
	
	.diagrams {
	    width: 100%;
	    height: auto;
	}
	
	.page_footer {
	    padding: 9% 10% 6% 10%;
	}
	
	.imprint.active {
	    margin: 30px 0 0 0;
	}
	
	.footerbox .social {
	    width: 100%;
	    margin: 0 0 15px 0;
	}
	
	.footerbox .social li {
	    width: 33%;
	    text-align: center;
	}
	
	.footerbox .social li a {
		width: 100%;
	}

	
	.footerbox .overview {
	    text-align: center;
	}
	
	.footerbox > span {
	    text-align: center;
	}
	
	.quote {
	    font-size: 14px;
	    line-height: 22px;
	    padding: 7px 9px;
	}
	
	.footerbox .overview {
	    float: left;
	}

}

@media screen and (max-width: 400px) {
	
	.textbox {
	    display: none;
	}
	
	.adress {
	    float: left;
	    margin: 0 0 12px;
	    width: 100%;
	}
	
	.adress > strong {
	    margin: 0 5px 0 0;
	}
	h2 {
	    font-size: 28px;
	    line-height: 37px;
	    margin: 10px 0 36px;
	}
	
	.article_huis .content > p {
	    line-height: 24px;
	    margin: -15px 0 15px;
	    padding: 0;
	}
	
	.persoon h4 {
	    font-size: 17px;
	    margin: 25px 0 6px;
	}
	
	.toggle_nav {
		display: block;
		background: rgba(0, 0, 0, 0.7) url(../images/menu.svg) no-repeat scroll 0 0;
	}
	
	.content {
	    padding: 10% 10% 18% 10%;
	}
	
	.page_footer {
	    padding: 10% 10% 10% 10%;
	}
	
	.wrapper_footerbox {
    	margin: 0 0 0 0;
	}
	
	.footerbox .overview li {
	    margin: 0 0 15px 0;
	}
	
	.article_informatie .content li {
		margin: 0;
	}
	
	.footerbox .overview {
	    float: left;
	    margin: 6px 0 0;
	}
	
}