

/* #### ../../../../frontend/kunden/app.schnabel-gyn.at/css/importer.css #### */
@import url("../fonts/MaterialIcons/materialicons.css");
@import url("../fonts/RobotoCondensed/robotocondensed.css");
@import url("../fonts/Anton/anton.css");


/* #### ../../../../frontend/kunden/app.schnabel-gyn.at/css/common.css #### */
/* CSS Document */

html {
	height:auto;
	box-sizing:border-box;
}

body {
 	box-sizing:border-box;
	font-size:1em;
    padding:0px;
    margin:0px;
	min-height:100%;
	
	font-weight:300;
    line-height:1.5em;
    text-rendering:optimizelegibility;
	color:var(--common-font-color);
	background-color:var(--common-hg-color);
}
body, form * {
	font-family:"Roboto Condensed", Verdana, Arial, sans-serif;
	font-size:1.0em;
}

h1, h2, h3, h4, h5, h6 {
	font-family:"Roboto Condensed", Verdana, Arial, sans-serif;
	font-weight:normal;
	line-height:1em;
	margin-top:0.5em;
	margin-bottom:0.2em;
	text-transform:uppercase;
}
main h1 {
	font-size:2.5rem;
	line-height:1.2em;
	font-weight:normal;
	text-align:left;
	text-transform:uppercase;
	font-family:"Anton","Roboto Condensed", Verdana, Arial, sans-serif;
	line-height:1;
}
main h2 {
	font-size:1.2rem;
	border-bottom:none;
    line-height:1;
}
/*
main h2:first-line {
    font-size:3rem;
    line-height:1.2em;
}
*/

h3, main h3 {
	font-size:1.1em;
}
h4 {
	font-size:1em;
}

main a,
footer a {
    padding:0em 0.5em;
    border-radius:0.2em;
    background-color:var(--common-a-background);
    border:1px solid var(--common-a-background);
    transition:background 0.5s, color 0.2s, border-color 0.2s;
	/* line-height:1.5; */
}
main a:hover,
footer a:hover {
    border-color:var(--common-a-color-hover);
    background:none;
    color:var(--common-a-color-hover);
}

address {
	font-style:normal;
}

a.std {
    display:inline-block;
    margin-bottom:0.5em;
    background:none;
    padding:0px;
    border:none;
}
a.std:hover {
    text-decoration:underline;
}

#CLogoJPr {
	background-color:white;
	border-radius:0.5rem;
}
.qrcode {
	max-width:15rem;
	margin:auto;
	border-radius:0.5rem;
}
#Impressum figure {
	width:fit-content;
	margin:auto;
}
#Impressum figcaption {
	margin-top:0.5em;
}

ol, ul, dl dd, dl dl {
    margin-left: 0;
}
/* ---- globale Variablen: ---- */
:root {
	--blue1:hsl(200,100%,43%);
	
	--common-font-color:#333;
	--common-font-color-bright:#444;
	--common-font-color-lower:#222;
	--common-font-color-hover:#666;
	--common-font-color-inverted:#fff;

	--common-label-color:#aaa;
	
	--common-hg-color:#fff;
	--common-hg-color-darker:#eee;
	--common-hg-color-lighter:#111;
	--common-hg-color-inverted:var(--blue1);
	
	--common-nav-hg-color:var(--blue1);
	--common-nav-font-color:#f9f9f6;
	--common-nav-font-color-hover:orange;
	
	--common-status-color:#333;
	--common-info-color:#666;
	
	--common-border-color:#eee;
	--common-border-color-bright:var(--common-font-color);
	--common-border-color-inverted:#999;
		
	--common-a-color:var(--blue1);
	--common-a-color-hover:hsl(14,67%,30%);
	--common-a-color-inverted:black;
	--common-a-color-inverted-hover:var(--blue1);
	--common-a-background:rgba(255,255,255,0.1);
    
    --common-ok-color:hsl(120,100%,30%);
    --common-notok-color:hsl(0,100%,30%);
    --common-add-color:hsl(210,100%,56%);
    --common-details-color:hsl(0,0%,80%);
    --common-inverted-color:white;
    --common-inverted-dark-color:hsl(0,0%,20%);
    
    --stdWidth:100rem;
    --font:"Roboto Condensed", Verdana, Arial, sans-serif;
	--font-heading:"Anton","Roboto Condensed", Verdana, Arial, sans-serif;
}


.inverted {
	color:var(--common-font-color-inverted);
	background-color:var(--common-hg-color-inverted);
}

.inverted a {
	color:var(--common-a-color-inverted);
	border-color:var(--common-a-color-inverted);
}
.inverted a:hover {
	color:var(--common-a-color);
	background-color:var(--common-a-color-inverted);
}
/* ENDE globale Variablen: ---- */

.btnStore {
	color:var(--common-ok-color);
	border-color:var(--common-ok-color);
	transition:color 0.5s, border 0.2s, background-color 0.2s;
}
.btnStore:hover {
	background-color:var(--common-ok-color);
	border-color:var(--common-ok-color);
	color:var(--ommon-inverted-color);
}
.info {
	margin:0.5em 0;
	color:var(--common-font-color-lower);
}


/* #### ../../../../frontend/kunden/app.schnabel-gyn.at/css/content.css #### */
.overlay {
	background-color:var(--blue1);
}

main section{
    padding:4em 0px;
}

em.az1 {
    font-style: normal;
}

#CErrors {
    display:none;
}


.synegrid h2 {
    padding-bottom:0px;
}
#CUeberUns .synegrid > * {
    margin-bottom:3em;
}


#F1 address {
    font-size:80%;
    color:var(--common-font-color);
    text-align:center;
    font-style:normal;
}

img.halfheight {
    height:50vh;
    width:100%;
    display:block;
    object-fit: cover;
    object-position: center;
    border-top:1px solid var(--common-border-color);
    border-bottom:1px solid var(--common-border-color);
}



/* ---- Startseite: ---- */
#CIndex {
    display:flex;
    flex-direction:column;
    gap:2rem;
    height:100%;
    justify-content:center;
    align-items:center;
    align-content:center;
    padding:1em;
}
#CIndex button {
    margin:0;
    /*
    height:100%;
    */
    aspect-ratio: 1;
    border:1px solid var(--common-border-color);
    border-radius:0.5em;
    background:none;
    /* color:var(--common-font-color); */
    color:inherit;
}

#CIndex .flex {
    width:20em;
}
#CIndex #btnMedien {
    flex-basis:100%;
}

#CIndex .flex {
    display:flex;
    gap:2rem;
    flex-direction:row;
    justify-content: center;
    align-items:center;
    height:auto;
    flex-wrap:wrap;
}
#CIndex .flex > * {
    flex-grow:1;
    flex-shrink:0;
    flex-basis:0;
}
#CIndex figure {
    width:100%;
    height:100%;
    margin:0;
    padding:0;
}
#CIndex img {
    width:80%;
    aspect-ratio: 1;
    margin:auto;
}
#CIndex figcaption {
    font-style: normal;
    text-transform: uppercase;
    text-align:center;
    margin-top:0.5em;
}

#CIndex h1::first-line {
    font-size:1.5rem;
}

@media screen and (orientation:landscape) {
    #CIndex .flex {
        flex-direction:row;
        width:auto;
        height:10em;
    }
    #CIndex #btnMedien {
        flex-basis:0;
    }
    #CIndex .flex > * {
        height:100%;
    }
}
/* ENDE Startseite: ---- */


/* ---- Schwangerschaftsrechner: ---- */
.GebT {
    background-color:rgba(255,255,255,0.1);
    margin:1em 0;
    border-radius:0.2em;
    border-collapse:separate;
    padding:0.2em;
    max-width:100%;

}
.GebT th, td {
    padding:0.2em 0.5em;
    border-bottom:1px solid var(--common-font-color);
}
.GebT th {
    border-bottom-width:2px;
}
.GebT tbody tr td:last-of-type {
    font-size:0.8em;
    color:var(--common-font-color-lower);
}
.GebT tbody tr:last-of-type td {
    border-bottom:none;
}
/* ENDE Schwangerschaftsrechner: ---- */


/* ---- Medien: ---- */
#Fotos .fancybox,
#Fotos .videos {
    margin:auto;
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-start;
    gap:1px;
    width:fit-content;
    background-color:var(--common-hg-color-darker);
    border-radius:0.2rem;
    padding:0.2rem;
}
#Fotos .fancybox picture,
#Fotos .fancybox img {
    width:100%;
}

#Fotos .fancybox picture,
#Fotos .fancybox img,
#Fotos video {
    aspect-ratio:1;
    object-fit:cover;
    object-position:center;
    border-radius:0.2rem;
}
#Fotos .fancybox > *,
#Fotos .videos > * {
    border-radius:0.2rem;
    width:calc(25% - 1px);
    aspect-ratio:1;
    margin:0;
}

#Fotos video {
    transition:width 0.5s;
}
#Fotos video.big {
    width:100%;
    height:auto;
    aspect-ratio: auto;
}
/* ENDE Medien: ---- */


/* ---- Schwangerschaftsrechner: ---- */
#CSchwangerschaftsrechner fieldset,
#CSchwangerschaftsrechner fieldset legend {
    background-color:var(--common-hg-color-darker);
}
/* ENDE Schwangerschaftsrechner: ---- */


.headerpic {
    height:20vh;
}
.headerpic img {
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
}
.headerpic.bottom img {
    object-position:center bottom;
}

.profilbild {
    width:10em;
    aspect-ratio:1;
    display:block;
    margin:1em auto;
    border-radius:50%;
	border: 1px solid #673b16;
	padding:2px;
	background-color:white;

}

.card {
    background-color:var(--common-hg-color-darker);
    padding:0.5em;
    border-radius:0.2em;
}


/* #### ../../../../frontend/kunden/app.schnabel-gyn.at/css/design.css #### */
.stdWidth {
	max-width:80rem;
	margin:auto;
}
.synegrid {
    --width:80rem;
}

.maingrid {
	display:grid;
	grid-template-rows:1fr 3rem;
	height:100vh;
    /*
    padding-top:env(safe-area-inset-top);
    padding-left:env(safe-area-inset-left);
    padding-right:env(safe-area-inset-left);
    */
}
.maingrid > footer {
    padding-top:0;
    padding-bottom:env(safe-area-inset-bottom);
}

#COverlay > img {
    width:50vw;
}

#H0 {
    display:none;
}

#C1 {
    overflow:auto;
}
#C1 > :not(.headerpic) {
    padding:1em;
}


#CIndex {
}
#CUeberUns {
	padding-top:0px;
}
#C1 #Impressum {
    margin-top:1em;
    background-color:var(--common-hg-color-darker);
    padding:0.5em;
}

#F2 {
    background-color:var(--blue1);
}
/*
#CIndex {
    background-color:var(--blue);
    color:var(--common-font-color);
}
*/


/* #### ../../../../frontend/kunden/app.schnabel-gyn.at/css/navigation.css #### */
#btnNav {
	margin:auto;
	width:1em;
	height:1em;
	border-radius:0.1em;
	box-sizing:content-box;
	margin-top:0.2em;
	margin-right:0.2em;
	padding:0.3em;
	background-color:var(--common-nav-hg-color);
	box-shadow:0px 0px 0.5em black;
	
	cursor:pointer;
    display:none;
}

#F2 {
	display:flex;
	justify-content:center;
	align-items:center;
	column-gap:0rem;
}

#F2 {
	height:100%;
	border-top:1px dotted var(--common-font-color);
}
#F2 ul,
#F2 li {
	display:block;
	margin:0;
	padding:0;
}
#F2 ul {
	display:flex;
	column-gap: 1em;
	justify-content: center;
	align-items:center;
	height:100%;
}
#F2 li {
	height:100%;
	height:2rem;
	aspect-ratio:1;
}
#F2 a {
	margin:0;
	padding:0;
	border-radius: 0;
	border:none;
	background:none;
}

#F2 li .atext,
#F2 li .atext i {
	display:block;
	width:100%;
	height:100%;
}

#F2 .notext {
	background-size:cover;
	background-position: center;
	background-repeat:no-repeat;
}
#F2 .notext .atext {
	font-size:0;
}
#F2 .notext .a_addtext {
	display:none;
}
.home {
	background-image:url(../../../svg/icons/home.svg);
}
.infos {
	background-image:url(../../../svg/icons/info.svg);
}
.btnSchwangerschaft {
	background-image:url(../svg/schwangerschaft.svg);
}
.btnSchwangerschaftsrechner {
	background-image:url(../svg/rechner.svg);
}
.btnFotos {
	background-image:url(../svg/medien.svg);
}
.bluetooth {
	background-image:url(../svg/bluetooth.svg);
}
.timer {
	background-image:url(../svg/timer.svg);
}
.monitoring {
	background-image:url(../svg/monitoring.svg);
}

#F2 .active {
	color:white !important;
}


/* #### ../../../../frontend/kunden/app.schnabel-gyn.at/css/fonts.css #### */



/* #### ../../../../frontend/kunden/app.schnabel-gyn.at/css/form.css #### */
form {
	--border-color:#ccc;
}

form * {
	font-size:inherit;
}

label {
	display:block;
	margin-top:0.5em;
	margin-bottom:0.1em;
	line-height:1em;
}
input,
textarea,
select,
button {
	display:block;
	width:100%;
	border:1px solid var(--border-color);
	padding:0.5rem 1rem;
	border-radius:0.2rem;
	line-height:1rem;
	box-sizing:border-box;
	margin-bottom:0.2rem;
	background-color:rgba(255,255,255,0.8);
}
::placeholder {
	padding-top:1rem;
	font-size:0.7em;
}
/*
::placeholder:focus,
select:focus {
	font-size:inherit;
	padding-top:0.5rem;
	line-height:inherit;
}
*/
form :focus {
}

input[type=date],
input[type=time] {
	width:auto;
}
input[type=number] {
	min-width:8em;
	text-align:right;
}

textarea {
	min-height:15em;
}

input[type=checkbox],
input[type=radio] {
	display:inline-block;
}

fieldset {
	padding:1em;
	margin-top:2em;
	border-radius:0.5em;
	border:1px solid var(--common-border-color);
}

form p {
	line-height:1.2em;
}

legend {
	font-weight:bold;
	font-size:1.1em;
	padding:0.2em 0.5em;
	border-radius:0.5em;
	border:1px solid var(--common-border-color);
}

label[required]::after,
label[data-required]::after {
	content: "*";
}
.req {
	margin:0.5em 0px;
	font-size:1rem;
	font-weight:bold;
	font-style:italic;
}

input[type=button],
input[type=submit],
input[type=reset],
button {
	margin:1em auto;
	width:auto;
	cursor:pointer;
	border:1px solid var(--common-a-color);
	background-color:rgba(255,255,255,0);
	color:var(--common-a-color);
	transition:border-color 0.5s, color 0.2s;
}
input[type=button]:hover,
input[type=submit]:hover,
input[type=reset]:hover,
button:hover {
	border-color:var(--common-a-color-hover);
	color:var(--common-a-color-hover);
}

label > :is(input, textarea, select, button) {
	margin-top:0.5em;
}

button .material-symbols {
	vertical-align:text-bottom;
}


/* #### not existing or no file: ../../../../ #### */


/* #### not existing or no file: ../../../../ #### */
