@charset "UTF-8";
/*
Theme Name: Zahnarzt Weideli
Theme URI: https://zahnarzt-weideli.ch
Description: Theme im Kundenauftrag erstellt für Zahnarzt Dr. Weideli, Romanshorn
Author: Juan Hoffmann (Lightstone Media Anstalt)
Author URI: https://www.lightstone.li/
License:
License URI:
Tags:
Template: headstarter
Text-domain: za-weideli
Version: 0.0.4a

*/
/*
Common media query breakpoints:
20em:		320px
30em:		480px
48em:		768px
61.25em:	980px
*/
/* Farben */
#farbinfos {
	color: #004987; /* hauptblau (final) */
	color: #333E48; /* Kontrastgrau (final) */
}

/* Fonts */
/* play-regular - latin */
@font-face {
	font-family: 'Play';
	font-style: normal;
	font-weight: 400;
	src: url('fonts/play-v17-latin-regular.woff2') format('woff2'),
	url('fonts/play-v17-latin-regular.woff') format('woff');
}
@font-face {
	font-family: 'Ubuntu';
	font-style: normal;
	font-weight: 300;
	src: url('fonts/ubuntu-v20-latin-300.woff2') format('woff2'),
	url('fonts/ubuntu-v20-latin-300.woff') format('woff');
}

/* Container width */
#main-navigation > div,
#page-main > div,
.page-template-one-page-layout .section article > *,
#site-footer .widget-area {
	width: 100%;
	max-width: 1100px;
	margin: auto;
}
.page-template-one-page-layout #page-main > div {
	max-width: none;
}

/* Fonts */
body {
	font-family: 'Ubuntu', sans-serif;
	font-weight: 300;
	color: #333E48;
}
h1, h2, h3 {
	font-family: 'Average Sans', sans-serif;
	font-family: 'Play', sans-serif;
	font-variant: small-caps;
}
#menu-main-container {
	font-family: 'Play', sans-serif;
}
h1 {
}
#menu-item-9 {
	display: none !important;
}

@media only screen and (min-width: 48em) {
	.headstarter-columns {
		width: 104%;
		margin-left: -2%;
		margin-right: -2%;
	}
	.headstarter-columns > * {
		padding-left: 1.9231%;
		padding-right: 1.9231%;
	}
}

#main-navigation {
	z-index: 100;
	border-bottom: 1px solid #004B87;
	background-color: #FFFFFF;
	padding: 2px 1.25em 0;
}
#main-navigation .custom-logo-link-main-navigation {
	position: absolute;
	z-index: 1500;
}
#main-navigation .logo {
	height: 53px;
	width: auto;
}
.js #main-navigation .menu-toggle {
	display: flex;
	justify-content: flex-end;
	line-height: 53px;
	height: 53px;
	cursor: pointer;
}
.js #main-navigation .menu-toggle > span:first-child {
	order: 2;
}
.js #main-navigation .menu-toggle > span:first-child {
	vertical-align: middle;
}
.js #main-navigation .menu-toggle svg {
	position: relative;
	top: 0.25em;
	margin-right: 0.3em;
	vertical-align: baseline;
	stroke: #004B87;
}
@media only screen and (min-width: 48em) {
	#main-navigation > div {
		display: flex;
		flex-direction: row;
	}
	#main-navigation > div > * {
		/*display: table-cell;*/
	}
	#main-navigation .custom-logo-link-main-navigation {
		position: relative;
	}
	.js #main-navigation .menu-toggle {
		display: none;
	}
}
@media only screen and (min-width: 61.25em) {
	#main-navigation {
		padding: 2px 2.5em 0;
	}
}
#menu-main-container {
    vertical-align: middle;
    font-size: 1.2em;
	line-height: 2.3em;
	text-align: right;
	color: #004B87;
	text-transform: uppercase;
	flex: 1 0 auto;
}
.js #menu-main-container .menu {
	display: none;
}
.menu-toggled #menu-main-container .menu {
	display: block;
}
#menu-main-container .menu a {
	display: block;
	padding: 0.3em 0.4em 0.1em;
	color: inherit;
	text-decoration: none;
	text-align: center;
}
#menu-main-container .menu a:hover,
#menu-main-container .menu .current-menu-item a {
	border-color: inherit;
}
#menu-main-container .menu a:focus {
	outline: none;
}
@media only screen and (min-width: 48em) {
	#main-navigation-indicator,
	#main-navigation {
		width: 100%;
		position: fixed;
	}
	.js #menu-main-container .menu {
		display: flex;
		flex-direction: row;
		justify-content: center;
	}
	#menu-main-container .menu a {
		border-bottom: 0.2em solid rgba(255,255,255,0);
	}
}
@media only screen and (min-width: 61.25em) {
	#menu-main-container .menu a {
		padding: 0.3em 1.2em 0.1em;
	}
}

.site-title {
	width: 400px;
	max-width: 85%;
	margin: auto;
	padding: 3% 1%;
}
@media only screen and (min-width: 48em) {
	.site-header {
		/*padding-top: 55px;*/
	}
}
.site-header #_banner-image {
    display: block;
    position: relative;
    width: 100%;
    height: auto;
    min-width: 0;
    min-height: 0;
    max-width: 100%;
}

#primary {
	margin: 2.5em 0;
}
.page-template-one-page-layout #primary {
	margin: 0;
}
#primary h1 {
	position: relative;
	margin-bottom: 1.2em;
	text-align: center;
	color: #004B87;
}
#primary h1:after {
	content: "";
	position: absolute;
	right: 50%;
	bottom: -0.5em;
	margin-right: -1.5em;
	width: 3em;
	height: 1px;
	background-color: #004B87;
}
#primary h2, #primary h3 {
	color: #004B87;
}

.page-content p,
.entry-content p {
	text-align: justify;
}

.section > article {
	padding: 2.5em 3.5%;
}
.section:nth-of-type(2n+1) {
	background-color: #004B87;
	color: #FFFFFF;
}
#primary .section:nth-of-type(2n+1) h1,
#primary .section:nth-of-type(2n+1) h2,
#primary .section:nth-of-type(2n+1) h3,
#primary .section:nth-of-type(2n+1) a {
	color: #FFFFFF;
}
#primary .section:nth-of-type(2n+1) h1:after {
	background-color: #FFFFFF;
}

#primary .section::after {
	content: "";
	display: none;
	position: relative;
	width: 100%;
	padding-bottom: 18%;
	background-size: cover;
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-position: center center;
}
@media only screen and (orientation: portrait) {
	#primary .section::after {
		padding-bottom: 30%;
	}
}

/* expanbox.js */
.expanbox {
	cursor: pointer;
}
.expanbox:after {
	content: attr(data-after);
	font-size: 0.9em;
	color: #004B87;
}
.expander {
	overflow: hidden;
}

#site-footer {
	border-top: 1px solid #004B87;
	background-color: #004B87;
	color: #FFFFFF;
}
#site-footer .widget {
	padding: 1.5em 2% 0;
	font-size: 0.8em;
	text-align: center;
}
@media only screen and (min-width: 48em) {
	#site-footer .widget-area {
		display: table;
	}
	#site-footer .widget {
		display: table-cell;
		width: 30%;
		vertical-align: top;
	}
	#site-footer .widget:nth-of-type(2) {
		width: 40%;
	}
}
#site-footer .widget h2,
#site-footer .widget h3 {
	color: #FFFFFF;
}
#site-footer .widget a {
	color: inherit;
}
#site-footer .google-maps-builder {
	min-height: 0;
	max-height: 240px;
	color: #004B87;
}
#site-footer .wpgmza_widget {
	color: #004B87;
}
#site-footer a[title='Google falsche Straßenkarte oder Bilder melden'] {
	display: none;
}

#svg-lsma-poweredby-logo g {
	fill: #FFFFFF;
}

/* Section: Home */
#home > article {
	padding: 0;
}
/* Section: Praxis (post-90) */
#post-90 .entry-content .hs-columns {
	align-items: center;
}
#post-90 .entry-content .headstarter-columns > div {
	vertical-align: middle;
}
#post-90 .entry-content .headstarter-columns > div:nth-child(1) {
	margin-bottom: 1em;
}
#post-90 .entry-content .hs-columns > div:nth-child(2),
#post-90 .entry-content .headstarter-columns > div:nth-child(2) {
	background-color: #004987;
	color: rgb(255, 255, 255);
	padding-top: 1em;
	padding-bottom: 1em;
	border-radius: 10px;
}
#post-90 .entry-content .hs-columns > div:nth-child(2) {
	padding: 1em;
}
#post-90 .entry-content .hs-columns > div:nth-child(2) h2,
#post-90 .entry-content .hs-columns > div:nth-child(2) h3,
#post-90 .entry-content .headstarter-columns > div:nth-child(2) h2,
#post-90 .entry-content .headstarter-columns > div:nth-child(2) h3 {
	margin-bottom: 0.35em;
}
#post-90 .entry-content .hs-columns > div:nth-child(2) p,
#post-90 .entry-content .headstarter-columns > div:nth-child(2) p {
	margin-top: 0.2em;
}
#post-90 .entry-content .hs-columns > div:nth-child(2) a,
#post-90 .entry-content .headstarter-columns > div:nth-child(2) a {
	color: rgb(255, 255, 255);
}

#primary #zahnarztpraxis::after {
}

#primary .section:nth-child(2)::after {
	display: block;
	background-image: url("img/bg/section-bg-01-750.jpg");
}
#primary .section:nth-child(4)::after {
	display: block;
	background-image: url("img/bg/section-bg-02-750.jpg");
}
#primary .section:nth-child(5)::after {
	display: block;
	background-image: url("img/bg/section-bg-03-750.jpg");
}
#primary .section:nth-child(6)::after {
	display: block;
	background-image: url("img/bg/section-bg-04-750.jpg");
}
@media only screen and (min-width: 48em) {
	#primary .section:nth-child(2)::after {
		background-image: url("img/bg/section-bg-01.jpg");
	}
	#primary .section:nth-child(4)::after {
		background-image: url("img/bg/section-bg-02.jpg");
	}
	#primary .section:nth-child(5)::after {
		background-image: url("img/bg/section-bg-03.jpg");
	}
	#primary .section:nth-child(6)::after {
		background-image: url("img/bg/section-bg-04.jpg");
	}
}

	/* Section Philosophie (post-13) */
#post-13 .entry-content .headstarter-columns > div:nth-child(1) p {
	text-align: center;
	margin-bottom: 1em;
}

/* Section: Behandlungen (post-15) */
#post-15 .entry-content {
}
.weideli-behandlungen {
	font-size: 0.9em;
}
@media only screen and (min-width: 48em) {
	.weideli-behandlungen > .headstarter-columns {
		width: 100%;
		margin: 1.2em 0;
	}
}
.weideli-behandlungen > .headstarter-columns > div {
	position: relative;
	padding: 0.8em 0 0.8em 90px;
}
.weideli-behandlungen > .headstarter-columns h2 {
	margin-bottom: 0.4em;
	font-size: 1.4em;
}
.weideli-behandlungen > .headstarter-columns > div h2 img {
	position: absolute;
	left: 5px;
	width: 70px;
	border-radius: 9px;
	border: 2px solid rgb(255, 255, 255);
	box-shadow: 0px 0px 0px 3px rgb(0, 73, 135);
}
@media only screen and (min-width: 48em) {
	.weideli-behandlungen > .headstarter-columns > div {
		padding-left: 120px;
	}
	.weideli-behandlungen > .headstarter-columns > div:nth-child(2n+1) {
		text-align: right;
		padding-right: 120px;
		padding-left: 0;
	}
	.weideli-behandlungen > .headstarter-columns > div h2 img {
		left: 15px;
		width: 80px;
		border-radius: 10px;
	}
	.weideli-behandlungen > .headstarter-columns > div:nth-child(2n+1) h2 img {
		left: initial;
		right: 15px;
	}
}

/* Section Team */
.weideli-team-gallery {
	list-style-type: none;
	padding: 0;
}
.weideli-team-gallery > li {
	position: relative;
	display: inline-block;
	width: 50%;
	padding-bottom: 50%;
	vertical-align: middle;
}
@media only screen and (min-width: 48em) {
	.weideli-team-gallery > li {
		width: 33.333%;
		padding-bottom: 33.333%;
	}
}
@media only screen and (min-width: 61.25em) {
	.weideli-team-gallery > li {
		width: 25%;
		padding-bottom: 25%;
	}
}
.weideli-team-gallery > li > * {
	position: absolute;
	top: 5%;
	left: 5%;
	width: 90%;
	height: 90%;
	transition: -webkit-transform 0.75s;
	transition: 0.75s;
}
.weideli-team-gallery > li > .front {
	z-index: 1;
	-webkit-transform: rotateY(0deg) translateZ(-1000px);
	transform: rotateY(0deg) translateZ(-1000px);
}
.weideli-team-gallery > li > .back {
	-webkit-transform: rotateY(90deg);
	transform: rotateY(90deg);
	-webkit-perspective: 1000px;
	perspective: 1000px;
	opacity: 0;
	z-index: 3;
}
.weideli-team-gallery > li:hover > .back {
	-webkit-transform: rotateY(0deg);
	transform: rotateY(0deg);
	opacity: 1;
}

.weideli-team-gallery > li figcaption {
	display: flex;
	flex-direction: column;
	justify-content: center;

	position: absolute;
	bottom: 0;
	width: 100%;
	min-height: 33.35%;
	padding: 0.8em;
	background-color: #FFFFFF;
	color: #004987;
	font-size: 0.55em;
}
@media only screen and (min-width: 30em) {
	.weideli-team-gallery > li figcaption {
		font-size: 0.7em;
	}
}
#primary .section .weideli-team-gallery > li figcaption > h2,
#primary .section .weideli-team-gallery > li figcaption > h3 {
	color: #004987;
	margin-top: 0;
	line-height: 1.1;
}
#primary .section .weideli-team-gallery > li figcaption > h2 {
	margin-bottom: 0.2em;
}
#primary .section .weideli-team-gallery > li figcaption > h3 {
	font-family: "Ubuntu",sans-serif;
	font-weight: normal;
	font-variant: normal;
}

/* Section Galerie */
.gallery-size-thumbnail .gallery-icon {
	border: 0;
	padding: 0;
}
.gallery-size-thumbnail .gallery-icon a::after {
	border-radius: 0.15em;
}
.gallery-size-thumbnail .gallery-icon:hover a::after {
	background-color: rgba(0, 73, 135, 0.6);
}