/*

********************************************************************************

Hueber.de CSS 2015

Zusätzliche Stylesheets für Hueber.de LWS

Version:   1.5
Datum:     31.08.2018

Erfordert: -

Hinweise:  -

Historie:	

1.5 (31.08.2018)  - Erweiterung der Flexbox-Anzeige auf Bodys mit Listeneinträgen
				    (Grid-Ansicht)

1.01 (23.09.2016) - Anpassung für Hueber Forward Sans

1.0 (10.11.2015)  - erster Release

********************************************************************************

*/


/* Grundeinstellungen */



/* Seite */

body.zg.splash
{
	background-repeat: no-repeat;
	min-height: 100%;
	height: 100%;
	overflow: auto;
	width: 100%;
}

/* .zg.splash #bodycover,
.zg.splash #pagecontent */
.zg.splash #bodycover,
{
	height: 100%;
}

.zg.splash #bodycover
{
	background-color: rgba(255, 255, 255, .4);
	width: 100%;
}



/* Bereiche */



/* Drawer für Formulare */



/* Kopf- und Fußzeile, Breadcrumb, Infoheader (Top Level Navi) und Navigation */



/* Kopfzeile */

.zg.splash #globalheader
{
	height: 142px;
}

.zg.splash #globalheader img#hueberlogo
{
	background-image: url(/shared/images/relaunch2015/hueberdesplashsignet.svg);
	background-repeat: no-repeat;
	background-size: 100%;
	height: 106px;
	width: 229px;
}

.zg.splash #globalheader #searchboxcontainer
{
	bottom: 30px;
}


/* Fußzeile */

.zg.splash #globalfooter
{
	margin-left: 0;
	width: 100%;
}



/* Breadcrumb-Navi */

.zg:not(.search) #breadcrumb ul li:last-child,
.zg .breadcrumb ul li.active
{
	color: #d0232c;
}



/* Infoheader */

.zg.introscreen #toplevelnavi #navibar ul li#tointrobt,
.zg.infosection #toplevelnavi #navibar ul li#toinfobt,
.zg.lehrensection #toplevelnavi #navibar ul li#tolehrenbt,
.zg.lernensection #toplevelnavi #navibar ul li#tolernenbt,
.zg #toplevelnavi #navibar ul li.active,
.zg .tabnavi ul li.active,
.zg .body.hotspotbook .tocarea .containerbox ul.toc > li.selected 
{
	color: #d0232c;
	border-bottom: 2px solid #d0232c;
}

/* Navigation links */

.zg #navi li.selected
{
	color: #d0232c;
}

/* Content */

/* Sektionen */

/* BETA: Präsentation */

/* Slider */

.zg.splash .body.slider ul.bx-slider > li > .artikel
{
	margin-top: 0 !important;
}

.zg.splash .body.slider ul.bx-slider > li > .artikel .contentarea
{
	position: relative;
}

.zg.splash .body.slider ul.bx-slider > li > .artikel .contentarea header
{
	background-color: rgba(0, 0, 0, .27);
	/* border-radius: .5em; */
	bottom: 11%;
	left: 0;
	padding: .7em 1.3em 1em 1.6em;
	position: absolute;
}

.zg.splash .body.slider ul.bx-slider > li > .artikel.layout2 .contentarea header,
.zg.splash .body.slider ul.bx-slider > li > .artikel.layout3 .contentarea header
{
	bottom: auto;
	top: 11%;
	max-width: 27%;
}

.zg.splash .body.slider ul.bx-slider > li > .artikel.layout3 .contentarea header
{
	left: auto;
	right: 0;
}

.zg.splash .body.slider ul.bx-slider > li > .artikel .contentarea header .headarea
{
	display: inline-block;
	line-height: 1.4;
	margin: 0 !important;
}

.zg.splash .body.slider ul.bx-slider > li > .artikel .contentarea header .headarea .kategorie,
.zg.splash .body.slider ul.bx-slider > li > .artikel .contentarea header .headarea .head
{
	color: white;
	display: block;
	padding-bottom: 0;
	text-shadow: 0 1px 3px black, 0 0 1px black;
}

.zg.splash .body.slider ul.bx-slider > li > .artikel .contentarea header .headarea .kategorie
{
	font-size: 1.55rem;
	line-height: 1.2;
}

.zg.splash .body.slider ul.bx-slider > li > .artikel .contentarea header .headarea .head
{
	font-family: Helvetica, Arial, Verdana, sans-serif;
	font-size: .9rem;
	padding-top: .5em;
}

.zg.splash .body.slider ul.bx-slider > li > .artikel .contentarea header .headarea .subhead,
{
	display: none;
}

.zg.splash .body.slider ul.bx-slider > li > .artikel .contentarea .mehrindikator::after
{
	background-image: url(/assets/images/whitelinkmarker.svg);
	background-position: bottom center;
	background-repeat: no-repeat;
	background-size: 100%;
	bottom: -1px;
	content: "";
	display: inline-block;
	height: 13px;
	position: relative;
	width: 12px;
}

.zg.splash .body.slider ul.bx-slider > li > .artikel .copyrightnote
{
	text-align: right;
}


/* Suche */


/* Parameter Select Area (für Such- bzw. Filter-Formulare o.ä.) */


/* Optionen für Body-Objekte */

.zg.splash .flexbox.fourcolumns > .content > *
{
	-webkit-flex: 0 1 calc(24% - 1.2rem);
	flex: 0 1 calc(24% - 1.2rem);
	width: inherit;
}

/* Headlines in Sektionen, Artikeln und Listen */



/* Artikel */



/* verschiedene interne Artikel, z.B. für Mediathek-Formular, Responsebox und Listen-Navigation */



/* Artikel in News-Seiten */



/* Artikel-Typ: Livebook */



/* BETA: Artikel-Typ: Präsentation */



/* Artikel-Typ: Produktpräsentation */



/* Artikel-Typ (virtuell): Hotspot-Video */



/* Artikel-Typ: Hotspot-Buchseite */



/* BETA: Artikel-Typ: Tabelle */



/* Artikel-Typ: Audio, Video, Youtube-Video */



/* Artikel-Typ: Suchtreffer */



/* Sonderformate */



/* Listen */

.zg.splash ul.liste li.internallink,
.zg.splash ul.liste li.externallink
{
	padding: .5em 0 0 18px;
	text-indent: -18px;
}

/* Formulare */



/* Reiternavigation */



/* Bilder */



/* Buttons */



/* Dialogbox */



/* Tags */



/* Links */



/* weitere Textformatierung und -auszeichnungen */



/* sonstiges */



/* Sonderformate: Tabellen */



/* Frontend-Editing */



/* Clearfix */



/* DaF */

.zg.de #toplevelnavi #infoheader
{
	background-image: url(/shared/images/header/infoheader_daf.svg);
	background-size: auto 90%;
}

.zg.de.introscreen #toplevelnavi #navibar ul li#tointrobt,
.zg.de.infosection #toplevelnavi #navibar ul li#toinfobt,
.zg.de.lehrensection #toplevelnavi #navibar ul li#tolehrenbt,
.zg.de.lernensection #toplevelnavi #navibar ul li#tolernenbt,
.zg.de #toplevelnavi #navibar ul li.active,
.zg.de #breadcrumb ul li:last-child,
.zg.de .breadcrumb ul li.active,
.zg.de #navi li.selected,
.zg.de .tabnavi ul li.active
{
	color: #4e77af;
}

.zg.de.introscreen #toplevelnavi #navibar ul li#tointrobt,
.zg.de.infosection #toplevelnavi #navibar ul li#toinfobt,
.zg.de.lehrensection #toplevelnavi #navibar ul li#tolehrenbt,
.zg.de.lernensection #toplevelnavi #navibar ul li#tolernenbt,
.zg.de #toplevelnavi #navibar ul li.active,
.zg.de .tabnavi ul li.active,
.zg.de .body.hotspotbook .tocarea .containerbox ul.toc > li.selected 
{
	border-bottom-color: #4e77af;
}


/* DaZ Schule */

.zg.sch #toplevelnavi #infoheader
{
	background-image: url(/shared/images/header/infoheader_sch.svg);
	background-position: left center;
}


/* Englisch */

.zg.en #toplevelnavi #infoheader
{
	background-image: url(/shared/images/header/infoheader_eng.svg);
}

.zg.en.introscreen #toplevelnavi #navibar ul li#tointrobt,
.zg.en.infosection #toplevelnavi #navibar ul li#toinfobt,
.zg.en.lehrensection #toplevelnavi #navibar ul li#tolehrenbt,
.zg.en.lernensection #toplevelnavi #navibar ul li#tolernenbt,
.zg.en #toplevelnavi #navibar ul li.active,
.zg.en #breadcrumb ul li:last-child,
.zg.en .breadcrumb ul li.active,
.zg.en #navi li.selected,
.zg.en .tabnavi ul li.active
{
	color: #81b458;
}

.zg.en.introscreen #toplevelnavi #navibar ul li#tointrobt,
.zg.en.infosection #toplevelnavi #navibar ul li#toinfobt,
.zg.en.lehrensection #toplevelnavi #navibar ul li#tolehrenbt,
.zg.en.lernensection #toplevelnavi #navibar ul li#tolernenbt,
.zg.en #toplevelnavi #navibar ul li.active,
.zg.en .tabnavi ul li.active,
.zg.en .body.hotspotbook .tocarea .containerbox ul.toc > li.selected 
{
	border-bottom-color: #81b458;
}


/* Französisch */

.zg.fr #toplevelnavi #infoheader
{
	background-image: url(/shared/images/header/infoheader_fra.svg);
}

.zg.fr.introscreen #toplevelnavi #navibar ul li#tointrobt,
.zg.fr.infosection #toplevelnavi #navibar ul li#toinfobt,
.zg.fr.lehrensection #toplevelnavi #navibar ul li#tolehrenbt,
.zg.fr.lernensection #toplevelnavi #navibar ul li#tolernenbt,
.zg.fr #toplevelnavi #navibar ul li.active,
.zg.fr #breadcrumb ul li:last-child,
.zg.fr .breadcrumb ul li.active,
.zg.fr #navi li.selected,
.zg.fr .tabnavi ul li.active
{
	color: #3096c1;
}

.zg.fr.introscreen #toplevelnavi #navibar ul li#tointrobt,
.zg.fr.infosection #toplevelnavi #navibar ul li#toinfobt,
.zg.fr.lehrensection #toplevelnavi #navibar ul li#tolehrenbt,
.zg.fr.lernensection #toplevelnavi #navibar ul li#tolernenbt,
.zg.fr #toplevelnavi #navibar ul li.active,
.zg.fr .tabnavi ul li.active,
.zg.fr .body.hotspotbook .tocarea .containerbox ul.toc > li.selected 
{
	border-bottom-color: #3096c1;
}


/* Italienisch */

.zg.it #toplevelnavi #infoheader
{
	background-image: url(/shared/images/header/infoheader_ita.svg);
}

.zg.it.introscreen #toplevelnavi #navibar ul li#tointrobt,
.zg.it.infosection #toplevelnavi #navibar ul li#toinfobt,
.zg.it.lehrensection #toplevelnavi #navibar ul li#tolehrenbt,
.zg.it.lernensection #toplevelnavi #navibar ul li#tolernenbt,
.zg.it #toplevelnavi #navibar ul li.active,
.zg.it #breadcrumb ul li:last-child,
.zg.it .breadcrumb ul li.active,
.zg.it #navi li.selected,
.zg.it .tabnavi ul li.active
{
	color: #aec52e;
/*	color: #c6d532; */
}

.zg.it.introscreen #toplevelnavi #navibar ul li#tointrobt,
.zg.it.infosection #toplevelnavi #navibar ul li#toinfobt,
.zg.it.lehrensection #toplevelnavi #navibar ul li#tolehrenbt,
.zg.it.lernensection #toplevelnavi #navibar ul li#tolernenbt,
.zg.it #toplevelnavi #navibar ul li.active,
.zg.it .tabnavi ul li.active,
.zg.it .body.hotspotbook .tocarea .containerbox ul.toc > li.selected 
{
	border-bottom-color: #b2ca30;
/*	border-bottom-color: #c6d532; */
}


/* Spanisch */

.zg.es #toplevelnavi #infoheader
{
	background-image: url(/shared/images/header/infoheader_spa.svg);
}

.zg.es.introscreen #toplevelnavi #navibar ul li#tointrobt,
.zg.es.infosection #toplevelnavi #navibar ul li#toinfobt,
.zg.es.lehrensection #toplevelnavi #navibar ul li#tolehrenbt,
.zg.es.lernensection #toplevelnavi #navibar ul li#tolernenbt,
.zg.es #toplevelnavi #navibar ul li.active,
.zg.es #breadcrumb ul li:last-child,
.zg.es .breadcrumb ul li.active,
.zg.es #navi li.selected,
.zg.es .tabnavi ul li.active
{
	color: #e39d23;
/*	color: #e3a829; */
}

.zg.es.introscreen #toplevelnavi #navibar ul li#tointrobt,
.zg.es.infosection #toplevelnavi #navibar ul li#toinfobt,
.zg.es.lehrensection #toplevelnavi #navibar ul li#tolehrenbt,
.zg.es.lernensection #toplevelnavi #navibar ul li#tolernenbt,
.zg.es #toplevelnavi #navibar ul li.active,
.zg.es .tabnavi ul li.active,
.zg.es .body.hotspotbook .tocarea .containerbox ul.toc > li.selected 
{
	border-bottom-color: #e39d23;
/*	border-bottom-color: #e3a829; */
}


/* Weitere Sprachen */

.zg.otherlng #toplevelnavi #infoheader
{
	background-image: url(/shared/images/header/infoheader_otherlng.svg);
}

.zg.otherlng.introscreen #toplevelnavi #navibar ul li#tointrobt,
.zg.otherlng.infosection #toplevelnavi #navibar ul li#toinfobt,
.zg.otherlng.lehrensection #toplevelnavi #navibar ul li#tolehrenbt,
.zg.otherlng.lernensection #toplevelnavi #navibar ul li#tolernenbt,
.zg.otherlng #toplevelnavi #navibar ul li.active,
.zg.otherlng #breadcrumb ul li:last-child,
.zg.otherlng .breadcrumb ul li.active,
.zg.otherlng #navi li.selected,
.zg.otherlng .tabnavi ul li.active
{
/*	color: #6f2962; */
	color: #833074;
}

.zg.otherlng.introscreen #toplevelnavi #navibar ul li#tointrobt,
.zg.otherlng.infosection #toplevelnavi #navibar ul li#toinfobt,
.zg.otherlng.lehrensection #toplevelnavi #navibar ul li#tolehrenbt,
.zg.otherlng.lernensection #toplevelnavi #navibar ul li#tolernenbt,
.zg.otherlng #toplevelnavi #navibar ul li.active,
.zg.otherlng .tabnavi ul li.active,
.zg.otherlng .body.hotspotbook .tocarea .containerbox ul.toc > li.selected 
{
/*	border-bottom-color: #6f2962; */
	border-bottom-color: #833074;
}


/* Handel */

.zg.han #toplevelnavi #infoheader
{
	background-image: url(/shared/images/header/infoheader_han.svg);
}


/* Presse */

.zg.pre #toplevelnavi #infoheader
{
	background-image: url(/shared/images/header/infoheader_pre.svg);
}


/* Presse */

.zg.int #toplevelnavi #infoheader
{
	background-image: url(/shared/images/header/infoheader_int.svg);
}


/* Unternehmen (Über uns) */

.zg.utn #toplevelnavi #infoheader
{
	background-image: url(/shared/images/header/infoheader_utn.svg);
}

.zg.easteuropeifs #toplevelnavi #infoheader
{
	background-image: url(/shared/images/header/infoheader_easteur.svg);
}

/* Audioservice */

.zg.audioservice #toplevelnavi #infoheader
{
	background-image: url(/shared/images/header/infoheader_audioservice.png);
}

/* Hilfe-Center */

.zg.hlp #toplevelnavi #infoheader
{
	background-image: url(/shared/images/header/infoheader_hlp.svg);
}

.zg.hlp .topteaser .contentarea
{
	background-color: #f4f4f4;
	border-radius: .3rem;
	padding: .4rem .6rem;
	width: calc(100% - 1.2rem);
}

.zg.hlp .startview ul li .text
{
	font-size: .85em;
}

/* Hueber.com.br */

.zg.hueberbr #toplevelnavi #infoheader
{
	background-image: url(/shared/images/header/infoheader_br.svg);
	background-size: 100%;
}

/* Hueber.es */

.zg.hueberes #toplevelnavi #infoheader
{
	background-image: url(/shared/images/header/infoheader_es.svg);
	background-size: 100%;
}

/* Hueber.hu */

.zg.hueberhu #toplevelnavi #infoheader
{
	background-image: url(/shared/images/header/infoheader_hu.svg);
	background-size: 100%;
}

/* Hueber.it */

.zg.hueberit #toplevelnavi #infoheader
{
	background-image: url(/shared/images/header/infoheader_it.svg);
	background-size: 100%;
}

/* Responsive Design */

@media only screen and (min-width: 768px)
{
	.zg.splash #breadcrumb
	{
		display: none;
	}
}

@media only screen and (max-width: 767px) 
{
	body.zg.splash
	{
		background-position-y: -82px;
	}

	.zg #globalheader,
	.zg.splash #globalheader
	{
		background-color: rgba(255, 255, 255, .75);
		-webkit-backdrop-filter: blur(25px) saturate(150%);
		backdrop-filter: blur(25px) saturate(150%);
		border-bottom: 1px solid #bbb;
		height: 40px;
		position: fixed;
		top: 0;
		width: 100%;
		z-index: 10000;
	}

	.zg #globalheader img#hueberlogo,
	.zg.splash #globalheader img#hueberlogo
	{
		background-size: auto;
		height: 34px;
		margin-left: 8px;
		width: 120px;
	}

	.zg #globalheader img#hueberlogo,
	.zg.splash #globalheader img#hueberlogo
	{
/*		background-image: url(/shared/images/relaunch2015/hueberdesignet.png); */
		background-image: url(/shared/images/relaunch2015/hueberdesignet.svg);
		background-repeat: no-repeat;
	}

	.zg.splash #globalheader #searchboxcontainer
	{
		display: none;
	}

	.zg.splash #breadcrumb #searchbox
	{
		align-items: center;
		display: flex;
		-webkit-justify-content: space-between;
		justify-content: space-between;
		flex: 1 0 auto;
		padding-left: .8em;
		padding-right: .8em;
	}

	.zg.splash #breadcrumb #searchbox input.searchtext
	{
		flex: 1 0 auto;
		background-color: #fefefe;
		border: none;
		color: #666;
		font-size: 1.3em;
		margin-right: .5em;
	}

	.zg.splash #breadcrumb #searchbox input.submitbt
	{
		flex: 0 0 auto;
		float: none;
		margin: 1px 4px 0 4px;
		padding: 0;
	}

	.zg.splash #globalfooter
	{
		width: calc(100% - 16px);
	}

	.zg.splash .body.slider ul.bx-slider > li > .artikel .contentarea header
	{
		border-radius: .3em;
		left: 3%;
		padding: .6em .8em;
	}

	.zg.splash .body.slider ul.bx-slider > li > .artikel.layout2 .contentarea header,
	.zg.splash .body.slider ul.bx-slider > li > .artikel.layout3 .contentarea header
	{
		bottom: auto;
		top: 8%;
	}

	.zg.splash .body.slider ul.bx-slider > li > .artikel.layout3 .contentarea header
	{
		left: auto;
		right: 3%;
	}
}


@media only screen and (max-width: 767px) 
{
	.zg.splash #globalfooter
	{
		margin-left: 8px;
	}

	.zg.splash .flexbox.fourcolumns > .content > *
	{
		-webkit-flex: 0 1 calc(49% - 1.2rem);
		flex: 0 1 calc(49% - 1.2rem);
	}
}

@media only screen and (max-width: 568px) 
{
	.zg.splash .body.slider ul.bx-slider > li > .artikel .contentarea header .headarea .head
	{
		font-size: 1rem;
	}

	.zg.splash .body.slider ul.bx-slider > li > .artikel .bild .imagearea img
	{
		left: -20%;
		max-width: 140%;
		position: relative;
		width: 140% !important;
	}

	.zg.splash .body.slider ul.bx-slider > li > .artikel .bild .imagearea
	{
		line-height: .1
	}

	.zg.splash .body.slider ul.bx-slider > li > .artikel .contentarea header,
	.zg.splash .body.slider ul.bx-slider > li > .artikel.layout2 .contentarea header,
	.zg.splash .body.slider ul.bx-slider > li > .artikel.layout3 .contentarea header
	{
		background-color: #bcbcbc;
		border-radius: 0;
		bottom: auto;
		left: auto;
		padding-top: .2em;
		position: static;
		right: auto;
		top: auto;
		max-width: inherit;
	}

	.zg.splash .body.slider ul.bx-slider > li > .artikel .contentarea header .headarea .kategorie
	{
		font-size: .8em;
		font-size: 1.2rem;
	}

	.zg.splash .body.slider ul.bx-slider > li > .artikel .contentarea .copyrightnote
	{
		/* background-color: #bbb; */
	}

/*	.zg.splash .flexbox.fourcolumns > .content > *
	{
		-webkit-flex: 0 1 calc(49% - 1.2rem);
		flex: 0 1 calc(49% - 1.2rem);
	} */
}

@media only screen and (max-width: 419px) 
{
	.zg.splash .flexbox.fourcolumns > .content > *
	{
		-webkit-flex: 0 1 calc(100% - 1.2rem);
		flex: 0 1 calc(100% - 1.2rem);
	}
}