
* { -webkit-text-size-adjust:none !important; }
input[type="submit"] {-webkit-appearance:none;appearance:none;}


*, html, body { margin:0; padding:0; font-family:roboto, sans-serif; }


.ctr { text-align:center; }
.tx_lgt { font-weight:300; }
.op0 { opacity:0; }
.op1 { opacity:1; }
.red-bullet { color:#f8b334; }
.noshrink { flex-shrink:0; }
.nogrow { flex-grow:0; }
.doshrink { flex-shrink:1; }
.dogrow { flex-grow:1; }


h1, h2, h3, h4 { padding:0.6em 10px 0.3em; }
p { padding:0.5em 10px 0.8em; }
ul li { margin:10px 10px 10px 26px; }
a { color:#575756; text-decoration:none; }
hr { border:none; height:0; width:100%; border-bottom:solid 3px #fff; border-top:solid 3px #f8b334; }
h1 { font-size:1.6em; line-height:1.2em; }
h2 { font-size:1.5em; line-height:1.4em; }
p { line-height:1.3em; }

html {
	background-color:#505053;
	overflow-y:scroll;
	color:#575756;
	line-height:1.2em;
}

body {
	margin:0 auto;
	padding:0;
	width:420px;
	height:inherit;
	min-height:100vh;
	position:relative;
}

.outer {
	margin:0;
	width:420px;
	height:inherit;
	min-height:500px;
	padding:124px 0 42px; /*header, subheader & footer*/
	position:relative;
	background-color:#fff;
}

#container { position:relative; }
#container.root { margin-top:-54px; }
/*#container > p:first-of-type, #container > h1:first-of-type { margin-top:4px; }*/

.header {
	position:fixed;
	top:0;
	z-index:100;
	width:400px;
	height:50px;
	padding:10px;
	background:#fff;
	box-shadow:0 0 5px #ccc;
	display:flex;
	justify-content:space-between;
	align-items:center;
	opacity:0;
	transition:opacity 400ms;
}

.applogo {
	background:url(/img/logo_EVK_Mettmann_MeinBaby.png) top center no-repeat; background-size:contain;
	height:40px;
	width:200px;
}


.footer {
	position:absolute;
	bottom:0;
	left:0;
	right:0;
	background:#505053;
	height:40px;
	display:flex;
	flex-direction:row;
	align-items:stretch;
	color:#fff;
}
.footer a { color:#fff; flex-grow:1; text-align:center; padding:5px 10px; }
.footer img { height:30px; }
.bg_fb { background:#5c81d1; }
.bg_yt { background:#bd0000; }
.bg_in { background:#125687; }

.splash {
	margin-top:-124px;
	background:url(../img/splash.jpg) top center no-repeat; height:505px; width:420px;
	display:flex; justify-content:space-around; align-items:flex-end;
}
.splash span { padding-bottom:20px; }
.splashlogo {
	background:url(../img/logo_wtypo_EVK_Mettmann.svg) center center no-repeat; height:110px; background-size:contain;
	position:relative;
	margin:30px 0 20px;
}

.app_alert { position:fixed; top:10vh; z-index:100; background:rgba(255, 255, 255, 0.8); left:4vw; right:4vw; border:#fff; border-radius:5px; box-shadow:0 0 5px #aaa; padding:5px; color:#000; }


.circle {
	border-radius:50%;
	display:flex;
	justify-content:center;
	align-items:center;
	height:60px;
	width:60px;
	font-size:35px;
	line-height:60px;
	text-align:center;
}
.circle img, .circle svg { max-height:42px; max-width:42px; }
.circleYBG { background:#f8b334; color:#fff; }
.circleYBG svg { fill:#fff; }
.circleWBG { background:#fff; color:#f8b334; }
.circleWBG svg { fill:#f8b334; }



.subheader {
	background:#eceae9; border-bottom:solid 3px #f8b334;
	display:flex; flex-direction:row; align-content:center; align-items:center;
	height:35px; padding:8px 10px;
	position:fixed; top:70px; width:400px;
}
.subheader span { flex-grow:1; font-size:1.1em; line-height:1.1em; }
.subheader a > img { width:35px; height:35px; padding-right:10px; }
.subheader a, .subheader i { flex-shrink:0; }
.subheader .circle { line-height:24px; width:40px; height:40px; }
.subheader .circle img, .subheader .circle svg { max-height:24px; max-width:24px; }




img.mainmenu { color:#d4d4d4; height:40px; width:40px; }
.header .circle { height:58px; padding:1px 0; }
.header .circle img { max-height:60px; max-width:60px; }


div.mainmenu { position:fixed; width:0; top:70px; /*left:0;*/ transition:width 400ms ease; overflow-x:hidden; box-shadow:2px 2px 6px #666; z-index:90; max-height:calc(100vh - 70px - 54px); }
.mainmenu.open, .mainmenu > ul { width:420px; }
.mainmenu li { background:#fff; color:#575756; border-bottom:solid 5px #eceae9; list-style:none; font-weight:bold; font-size:16px; padding:12px 5px; line-height:1.2em; margin:0; }


.menu li, .basicmenu li { background:#d4d3d3; color:#575756; border-bottom:solid 3px #fff; list-style:none; font-weight:bold; font-size:20px; padding:10px; line-height:1.2em; height:100px; display:flex; flex-direction:row; align-content:center; align-items:center; margin:0; }
.menu li span, .basicmenu li span { flex-grow:2; }
.menu li i, .basicmenu li i { flex-shrink:0; }

.basicmenu li, .mainmenu li { text-transform:uppercase; }
.menu li { height:40px; }
.menu .circle { line-height:24px; width:35px; height:24px; padding:7px 0 9px 5px; }
.menu .circle img, .menu .circle svg { max-height:24px; max-width:24px; }


.navlink { color:#575756; border-bottom:solid 3px #fff; padding:10px; display:flex; flex-direction:row; align-content:center; align-items:center; justify-content:space-between; background:#d4d3d3; font-weight:bold; line-height:1.1em; }
.navlink_bold { font-size:30px; font-weight:bold; }
.navlink_bigger { background:#eceae9; font-weight:normal; font-size:20px; line-height:1.2em; }
a.navlink { text-decoration:none; }

.navlink::after { content:' '; flex-shrink:0; flex-grow:0; background:#f8b334 url(/img/icons/arrow.svg) 7px center no-repeat; background-size:24px 24px; display:inline-block; float:right; border-radius:50%; height:35px; width:35px; margin:0 8px; }
.nav_noicon::after { display:none; }

.nav_map::after { background:#f8b334 url(/img/icons/map-marked-solid.svg) center center no-repeat; background-size:20px 20px; }

.nav_lnk::after { background:#fff url(/img/icons/link-solid.svg) center center no-repeat; background-size:20px 20px; }
.nav_www::after { background:#fff url(/img/icons/www.svg) center center no-repeat; background-size:20px 20px; }
.nav_doc::after { background:#fff url(/img/icons/user-md-solid.svg) center center no-repeat; background-size:20px 20px; }
.nav_mail::after { background:#fff url(/img/icons/env.svg) center center no-repeat; background-size:20px 20px; }
.nav_phone::after { background:#fff url(/img/icons/phone-solid.svg) center center no-repeat; background-size:20px 20px; }

.nav_notfall { background:#e30613; color:#fff; }
.nav_phone_big { font-size:30px; border-top:6px; }
.nav_phone_big::after { background:#f8b334 url(/img/icons/tel.svg) center center no-repeat; background-size:55px 55px; height:55px; width:55px; }
.nav_notfall::after { background-color:inherit; border:solid 3px #fff; }


.nav_team > img { width:125px; }


.navtype_textbox { background:#eceae9; border-bottom:solid 3px #fff; padding:10px; }
.navtype_textbox > p { padding:0.2em 0 0.6em; }



iframe, #chatbot-container { height:calc(100vh - 70px - 54px); width:100%; border:0; }

.navlink > p { padding:0 8px; }
.navlink_bigger > .gmap { width:125px; height:100px; }


.toggleall { height:auto; transition:height 300ms; overflow:hidden; }
.togglehide { height:0; }





.slider {
	width:100%;
	overflow:hidden;
	position:relative;
	touch-action:pan-y;
	border-bottom:solid 3px #fff;
}
.ichier_imgrot_stage { height:280px; }

/* caroussel - slide */
.ichier_imgrot_stage { position:relative; width:100%; }
.ichier_imgrot_stage > div { width:100%; position:absolute; top:0; }
.ichier_imgrot_stage > div.imgrot_rgt { left:100%; }
.ichier_imgrot_stage > div.imgrot_mid { left:0; }
.ichier_imgrot_stage > div.imgrot_lft { left:-100%; }
.ichier_imgrot_stage > div.imgrot_cur, .ichier_imgrot_stage > div.imgrot_prv { transition:left 600ms ease; }
.ichier_imgrot_stage div img { margin:auto; max-width:100%; max-height:100%; }

.ichier_imgrot_thumbs { position:absolute; bottom:15px; width:100%; display:flex; justify-content:center; opacity:0.8; z-index:8; }
/*.ichier_imgrot_thumbs:hover { opacity:1; }*/
.ichier_imgrot_thumbs div { margin:0 10px; width:15px; height:15px; overflow:hidden; cursor:pointer; border-radius:10px; background-color:#f2fcfd; box-shadow:0 0 6px 0 #222; }
.ichier_imgrot_thumbs div.imgrot_cur { background-color:#f8b334; }
.ichier_imgrot_thumbs img { display:none; }

.ichier_imgrot_prv, .ichier_imgrot_nxt { position:absolute; top:0; bottom:0; width:50%; font-size:70px; opacity:0.1; z-index:10; color:#f2fcfd; cursor:pointer; transition:opacity 200ms ease-in, opacity 50ms ease-out; height:100%; display:flex; flex-direction:column; justify-content:center; user-select:none; -webkit-tap-highlight-color:transparent; }
/*.ichier_imgrot_prv:hover, .ichier_imgrot_nxt:hover, .ichier_imgrot_prv.imgrot_inv:hover, .ichier_imgrot_nxt.imgrot_inv:hover { opacity:1 !important; text-shadow:0 0 5px #f2fcfd; }*/
.ichier_imgrot_nxt::before { background:url('/img/icons/angle-right-solid.svg') center center no-repeat; padding-right:20px; }
.ichier_imgrot_prv::before { background:url('/img/icons/angle-left-solid.svg') center center no-repeat; padding-left:20px; }
.ichier_imgrot_nxt::before, .ichier_imgrot_prv::before { display:inline-block; content:' '; background-size:70px 70px; height:70px; width:70px; }
.ichier_imgrot_nxt { left:50%; text-align:right; background:linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0.7) 100%); align-items:flex-end; }
.ichier_imgrot_prv { right:50%; text-align:left; background:linear-gradient(to left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0.7) 100%); }
/* caroussel */





/** loading **/
@keyframes eff_loading_ani {
	0% {text-shadow:0 0 0 #fff; color:rgba(255,255,255,0.4); }
	100% {text-shadow:0 0 3px #fff, 0 0 8px #fff; color:rgba(255,255,255,1); }
}
@-webkit-keyframes eff_loading_ani {
	0% {text-shadow:0 0 0 #fff; color:rgba(255,255,255,0.4); }
	100% {text-shadow:0 0 3px #fff, 0 0 8px #fff; color:rgba(255,255,255,1); }
}

.eff_loading { animation: eff_loading_ani 1600ms linear 0s infinite alternate; -webkit-animation: eff_loading_ani 1600ms linear 0s infinite alternate;}



.eff_fadeout { opacity:0; transition:opacity ease 500ms; }
.eff_fadein { opacity:1; transition:opacity ease 500ms; }





/* nav/content specific */

.notfallversorgung img { width:100%; }
.kindeaerzte iframe { height:calc(100vh - 70px - 54px - 42px); }