/* Tablet CSS-Datei */
@media(min-width: 960px) {

	/* 1.1 Grundgeruest */
	
	main {
		margin-top: 100px;
	}
	
	/* 1.2 Kopfzeile */
	
	header.kopfzeile {
		height: 100px;
	}
	
	/* 1.2.2 Navigation */
	.menu-knopf {
		top: 20px;
    	left: 20px;
        width: 60px;
        height: 60px;	
    }
	
	.menu-knopf__burger::before { transform: translateY(-10px);}
	.menu-knopf__burger::after { transform: translateY(10px);}
	
	/* 1.3 Sektionen */
	/* Sektionen definieren */
	
	.sektion{
		padding-right: 25px;
		padding-left: 25px;
	}
	
	.sektion.vollbild{
		height: calc(100vh - 100px);
	}
	
	
	
	.jom-video video.video-desktop{
		display: block;
	}

	.jom-video video.video-mobile{
		display: none;
	}
	
	/* 1.4 Footer */

	.sektion.footer-inhalt .inhalt{
		flex-direction: row;
	}

	.sektion.footer-inhalt .inhalt .spalte{
		position: relative;
		display: flex;
		flex-direction: column;
		justify-content: flex-end;
		width: 33.333%;
		margin-top: 0;
	}

  	.sektion.footer-inhalt .inhalt .spalte.links{ order: 1}
	.sektion.footer-inhalt .inhalt .spalte.mitte{ order: 2}
	.sektion.footer-inhalt .inhalt .spalte.rechts{ order: 3}

	.sektion.footer-inhalt .inhalt .spalte.links address{
		text-align: left;
	}

	.sektion.footer-inhalt .inhalt .spalte.mitte p.copyright{
		font-size: 1.2em;
	}

	.sektion.footer-inhalt .inhalt .spalte.mitte p.copyright br{
		display: inline;
	}

	.sektion.footer-inhalt .inhalt .spalte.rechts li{
		text-align: right;
	}

	.sektion.footer-inhalt .inhalt .spalte.rechts li a{
		text-align: right;
	}
	
	
	/* 1.9 Headlines */

	h1, h2, h3, h4{}

	h1{}

	h2{
		font-size: 3.5em;
	}

	h3{
		font-size: 2.5em;
	}

	h4{
		font-size: 1.4em;
	}
	
	.sehr-kleiner-text p{ font-size: 0.77em!important; color: inherit;}
	.kleiner-text p{ font-size: 1em!important; color: inherit;}
	.standard-text p{ font-size: 1.2em; color: inherit;} 
	.mittlerer-text p{ font-size: 1.4em; color: inherit;}
	.grosser-text p{ font-size: 1.6em; color: inherit;}
	
	.hero h2{font-size: 4.5em;}
	.hero h3{font-size: 3.5em;}
	.hero p{font-size: 1.8em;}

	.mega-hero h2{font-size: 6em;}
	.mega-hero h3{font-size: 5em;}
	.mega-hero p{font-size: 3em;}

	.jom-text .bulletpoints li.sehr-kleiner-text { font-size: 0.77em!important; }
	.jom-text .bulletpoints li.kleiner-text { font-size: 1em!important; }
	.jom-text .bulletpoints li.standard-text { font-size: 1.2em; } 
	.jom-text .bulletpoints li.mittlerer-text { font-size: 1.4em; }
	.jom-text .bulletpoints li.grosser-text { font-size: 1.6em; }
	
	
	/* 3.2 Werbemittel-Preview Kacheln */
	
	/* Wird erst ab Tablet/Desktop sichtbar */
	.werbemittel-preview-deckblatt-desktop{
		display: flex;
		width: 40%;
	}
	
	#werbemittel-preview{ 
		width: 60%!important; 
  	}
	
	.werbemittel-preview-deckblatt-desktop h2{
		font-size: 2.5em;
	}
	
	.werbemittel-preview-deckblatt-desktop p{
		font-size: 1em;
	}
	
	.werbemittel-preview-deckblatt-desktop li{
		font-size: 1em;
		list-style: none;
	}

	.werbemittel-preview-deckblatt-desktop ul{
		border: 0px solid yellow;
		padding: 0 0 0 20px;
		margin-top:10px;
	}

	.werbemittel-preview-deckblatt-desktop li{
		margin-left: 70px;
		margin-bottom: 30px;
		font-weight: 300;
		min-height: 50px;
	}

	.werbemittel-preview-deckblatt-desktop li:before{
		position: absolute;
		margin: -5px 0 0 -90px;
		font-size: 1.8em;
		color: var(--jom-pri-farbe-w);
		background: var(--jom-sek-farbe-1);
		border-radius: 40px;
		padding: 10px;
		transform: rotate(0deg)
	}
	
	.werbemittel-preview-deckblatt,
	.werbemittel-preview-deckblatt-2{ 
		display: none;
	}
	
	.werbemittel-preview-caption { 
		width: 66.666%;
		bottom: 5%; 
		font-size: 2em;
	}
	/*
	.werbemittel-preview-deckblatt,
	.werbemittel-preview-deckblatt-2{
		max-width: 600px;
	}
	
	.werbemittel-preview-deckblatt h2{
		font-size: 2.5em;
	}	
	
	.werbemittel-preview-deckblatt p,
	.werbemittel-preview-deckblatt li,
	.werbemittel-preview-deckblatt-2 p,
	.werbemittel-preview-deckblatt-2 li{
		font-size: 1.4em;
	}*/
	
	.werbemittel-preview-caption { 
		width: 60%;
	}
	
	
	#jom-lightbox-close {
		width: 70px;
		height: 70px;
	}

	#jom-lightbox-close:before{
		font-size: 40px;
	}
	
}