/* ======================================================================================== */
/* ==  __  __          _____ ____   __      ___     _                _____  _____ _____  == */
/* == |  \/  |   /\   / ____/ __ \  \ \    / (_)   (_)              / ____|/ ____/ ____| == */
/* == | \  / |  /  \ | |   | |  | |  \ \  / / _ ___ _  ___  _ __   | |    | (___| (___   == */
/* == | |\/| | / /\ \| |   | |  | |   \ \/ / | / __| |/ _ \| '_ \  | |     \___ \\___ \  == */
/* == | |  | |/ ____ \ |___| |__| |    \  /  | \__ \ | (_) | | | | | |____ ____) |___) | == */
/* == |_|  |_/_/    \_\_____\____/      \/   |_|___/_|\___/|_| |_|  \_____|_____/_____/  == */
/* ======================================================================================== */

/* root */
:root {
    --hvg-color: #068F3E;
}

	.marquee {
		max-width: 100vw; /* iOS braucht das */
		white-space: nowrap;
		overflow: hidden;
		/* hier evtl. noch font-size, color usw. */
	}

	.marquee span {
		display: inline-block;
		padding-left: 105%; /* die zusätzlichen 5% erzeugen einen verzögerten Start und vermeiden so ein Ruckeln auf langsamen Seiten */
		animation: marquee 60s linear infinite;
	}

	/* Optional: mouseover (oder Tipp auf dem Touchscreen) pausiert die Laufschrift */
	.marquee span:hover {
		animation-play-state: paused 
	}

	/* Make it move */
	@keyframes marquee {
	    0%   {transform: translate3d(0,0,0);}
	    100% {transform: translate3d(-100%,0,0);}
	}

/* ALLGEMEINES */
h1, h2, h3, h4, h5 { font-family: 'Hanken Grotesk' !important; }
h1, h2 { color: var(--hvg-color) !important; }
h4 { font-size: 4vh !important; line-height: 50px !important; }
.mehrLink { font-size: 1rem;color: var(--hvg-color) !important; font-family: 'Hanken Grotesk'; font-weight: 600; }
.flexGrow1 { flex-grow: 1; flex-shrink: 4; }
.flexGrow2 { flex-grow: 2; flex-shrink: 1; }
.seitenabstand { padding: 0px 2%; }
#pfeilRechts2, #pfeilLinks2 { display: none !important; }


.slideTitel {
	text-align: left;
	color: white;
	font-size: 6.5rem;
	font-family: 'Hanken Grotesk';
	font-weight: 700;
	width: 100%;
	margin-left: -200px;
	padding-top: 150px;
}

/* HEADER / MENÜ / KOPFZEILE / TOPBAR */

.navFlex {
	display:flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	background-color: var(--hvg-color);
	color: white;
	max-width: 1920px;
	margin: 0 auto;
	padding: 10px 0px;
	font-size: min(1.2vw, 16px);
}

.naviItem {
	flex-basis: 10px;
	text-align: center;
}

.borderNavRight {
	border-right: 1px solid white;
}

.navMenuLogo {
	max-width: 250px !important;
}

#menuLogo {
	width: 23% !important;
}

#navMenu {
	max-width: 1920px;
	margin: 0 auto;
	padding: 0px 0px 0px 0px;
}

#navMenu2 {
	max-width: 1920px;
	margin: 0 auto;
	padding: 15px 0px 0px 0px;
}

#menu-hauptemenue-1 {
  	display: flex;
  	justify-content: space-between;
	font-size: min(1.5vw, 16px);
	color: #1E1E1D;
	font-weight: 800;
}

.mfn-header-menu > .mfn-menu-li {
  height: 100px !important;
}


#menu-hauptemenue-1 a { /*color: #1E1E1D;*/ font-family: 'Hanken Grotesk'; }
#menu-hauptemenue-1 a:active { color: #068F3E; text-decoration-line: underline; }
.menu-item:hover { color: #068F3E !important; border-bottom: 4px solid #068F3E; padding-top: 4px !important; }
.current_page_item { color: #068F3E !important; border-bottom: 4px solid #068F3E; padding-top: 4px !important; }

#menu-hauptemenue-1 li {  }
#menu-hauptemenue-1 li:last-child { border-right: 0px solid white; }

.menu-hauptemenue {
	width: 70% !important;
}

#meldung {
	width: 100%;
	color: var(--hvg-color);
	text-transform: uppercase;
	font-family: 'Hanken Grotesk';
	font-size: 30px;
	font-weight: 500;
	letter-spacing: 3px;
	background-color: #ededed;
	padding: 20px 40px;
}

/* ============ */
/* INFO SLIDER */
#StartseiteInfosMobil {display:none;}
#StartseiteInfos {}
.infosSlide {

}

.infoImage1 {}
.infoImage2 {}

.infoHolder {
  display:flex;
  flex-direction: column;
  width: 100%;
  margin: 0 auto;
  justify-content: flex-start;
  text-align:left;
  padding-right: 130px !important;
}

.infoIcon {
	width: 100px;
	height: auto;
  margin: 40px 0px 30px 0px;
}

.infoSubtitle {
  font-family: 'Hanken Grotesk';
  color: white;
  font-size: 1rem;
  font-weight: 600;
  letter-spacing: 1px;
  margin-bottom: 30px
}

.infoTitle {
  font-family: 'Hanken Grotesk';
  color: white;
  font-size: 2.0rem;
  font-weight: 600;
  margin-bottom: 15px
}

.infoText {
  font-family: 'Hanken Grotesk';
  color: white;
  margin-bottom: 30px;
  font-size: 0.8rem !important;
}

.infoLink {
  font-family: 'Hanken Grotesk';
  color: white;
  font-weight: 800;
  font-size: 1rem;
}


/* ============ */
/* TICKETS / ABOS */
.titleRow { 
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
	background-color: #EDEDED;
	width: 100%;
	padding: 20px 80px;
}

.titleLeft {
	display: flex;
	align-items: center;
	flex-grow: 1;
	flex-basis: 100px;	
	font-family: 'Hanken Grotesk';
	color: var(--hvg-color);
	font-weight: 600;
	font-size: 2.5rem;
	hyphens: auto;
}

.titleRight {
	align-items: center;	
	flex-grow: 1.5;
	flex-basis: 100px;
	font-family: 'Hanken Grotesk';
	font-size: 1rem;
}

.titleIcon {

}

.titleTitle {
	margin-left: 40px;
}


/* TARIFDARSTELLUNG */
.accord {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	background-color: #068F3E;
	padding: 15px 20px 15px 60px;
	color: white;
	font-family: 'Hanken Grotesk';
	font-size: 1.8rem;
	font-weight: 600;
	border-bottom: 3px solid white;
}

#kurzstreckeInhalt, #einzelfahrscheineInhalt, #mehrfahrkartenInhalt, #tageskarteInhalt, #zeitkartenInhalt { display: none; }

.accordContent {
	width: 100%;
	background-color: #EDEDED;
	border-bottom: 3px solid white;	
	padding: 40px;
	display: none;
}


.accordContent:first-of-type { display: none !important; }

#ticketInfos {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: stretch;
	gap: 30px;
}

#ticketRechts {
	background-color: #EDEDED;
}

#ticketLinks, #ticketRechts {
	flex-basis: 10px;
	flex-grow: 1;
}

.ticket {

}

.tarifHolder {
	font-family: 'Hanken Grotesk';
	font-size: 1rem;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: flex-start;
	gap: 20px;
	border-top: 1px solid black;
	margin-top: 20px;
	padding-top: 20px;
	margin-bottom: 70px;
}

.tarifZone {
	color: var(--hvg-color);
	font-weight: 600;
}

.tarifItem {
	flex-basis: 10px;
	flex-grow: 1;
	text-align: left;
}

.tarifArt {
	font-family: 'Hanken Grotesk';
	font-weight: 600;
	color: #1E1E1D;
	font-size: 1.3rem;
}

#ticketRechts {
	padding: 40px 60px;
}

.verkaufsstellen {
	display:flex;flex-direction:row;justify-content:space-between;align-items:stretch; gap:10px;flex-wrap:wrap;
}

.verkaufstellenItem { flex-grow:1;flex-basis:350px;margin-top:15px; }

/* ABOS */

#jugendfreizeitaboInhalt {
	display: none;
	flex-direction: row;
	justify-content: space-between;
	gap: 5px; 
}

#jugendfreizeitaboInhalt.accordContent, #harzaboInhalt.accordContent  { padding: 0px !important; background-color: white; }

.aboLinks {
	display:flex; flex-direction:row; align-items:stretch; justify-content: space-between; /*flex-basis:10px; flex-grow:0.9;*/ gap: 5px;
}

.aboRechts {
	display:flex; flex-direction:column; align-items:stretch; justify-content: space-between; flex-basis:10px; flex-grow:1.5;  background-color: #EDEDED;
}

#jugendfreizeitaboLinks { }
#jugendfreizeitaboRechts { }

.aboHolder {
	display:flex; flex-direction: row; justify-content: space-between; align-items: stretch; padding: 0px 80px; gap:10px;
}

.aboItem {
	background-color: var(--hvg-color);
	color: white !important;
	padding: 40px 50px;
	height: 100%;
}

.aboItem h3, .aboItem li { color: white !important; }

.aboNumber { height: 35px;
	color: var(--hvg-color);
	width: 35px;
	border: 2px solid var(--hvg-color);
	text-align: center;
	border-radius: 50%;
	font-size: 20px;
	line-height: 30px; 
}


/* FAHRPLÄNE */

#fahrplan { 
	display:flex !important;
	justify-content:space-between !important;
	align-items: stretch !important;
	flex-direction: row;
	gap:20px;
}

.fahrplan-sub {
	display:flex;
	flex-direction:column;
	justify-content:space-between;
	align-items: stretch;
	gap: 10px;
}

.fahrplan-sub-item {
	padding: 60px;
	background-color: #ededed;
	height:100%;
}



.abstand1 { padding-top: 40px; }
.abstand2 { padding-bottom: 40px; }

.fahrplanItem {
	display:flex;
	flex-direction:row;
	justify-content:space-between;
	align-items:center;
	gap:20px;
	margin-bottom:15px;
}


/* SONDERFAHRTEN */
#sonder1Inhalt, #sonder2Inhalt, #sonder3Inhalt, #sonder5Inhalt, #event1Inhalt, #event2Inhalt, #event3Inhalt, #event4Inhalt, #event5Inhalt, #event6Inhalt  { background-color: white !important; flex-direction:column; }
#sonder1Inhalt.accordContent, #sonder2Inhalt.accordContent, #sonder3Inhalt.accordContent, #sonder4Inhalt.accordContent, #sonder5Inhalt.accordContent, #sonder6Inhalt.accordContent  { padding:0px !important; }

#event1Inhalt, #event2Inhalt, #event3Inhalt, #event5Inhalt, #event1Inhalt, #event2Inhalt, #event3Inhalt, #event4Inhalt, #event5Inhalt, #event6Inhalt  { background-color: white !important; flex-direction:column; }
#event1Inhalt.accordContent, #event2Inhalt.accordContent, #event3Inhalt.accordContent, #event4Inhalt.accordContent, #event5Inhalt.accordContent, #event6Inhalt.accordContent, #deutschlandticketInhalt.accordContent   { padding:0px !important; }

.sonderItem075 {
	flex-basis:10px; 
	flex-grow:0.75;
	padding:80px;
}

.sonderItem125{
	flex-basis:10px; 
	flex-grow:1.25;
	padding:80px;
}

.sonderRow {
	display:flex; 
	flex-direction:row; 
	gap:5px; 
	justify-content:space-between; 
	align-items:stretch;
	margin-bottom: 5px;
}

/* UNTERNEHMEN */
#u1Row {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: stretch;
}

#u1ItemLeft {
	flex-basis: 10px;
	flex-grow: 3;
	background-image: url('/wp-content/uploads/2023/02/hvg-sonderfahrt-historische-strassenbahn.webp');
	background-size: cover;
	background-position: left 10px bottom -100px;
}

#u1ItemRight {
	flex-basis: 10px;
	flex-grow: 1;
	background-color: #068F3E;
	padding: 100px;
	color:white !important;
}

#u1ItemRight h2 { color:white !important; }

.historie {
	flex-grow:1;flex-basis:10px;display:flex;flex-direction:column;justify-content:space-between;gap:20px;
}

.histoTitel {
	color: #068F3E;
	font-weight: 700;
	font-size:18px;
	line-height:30px;
}

.histoText {
	color: #1E1E1D;
	font-size: 14px;
}

.fahrzeugSchild {
	background-color: #068F3E;
	color: white;
	font-size: 16px; 
	font-family: 'Hanken Grotesk';
	position:absolute;
	font-weight: 700;
	padding: 5px 10px;
}

.faktenLeft {
	flex-grow:3;flex-basis:10px;display:flex;flex-direction:row;justify-content:space-between;align-items:stretch;
}

.faktenRight {
	flex-grow:1;flex-basis:10px;display:flex;flex-direction:row;justify-content:space-between;align-items:stretch;
}
.faktenRight h3, .faktenLeft h3 { color: var(--hvg-color) !important; font-weight:600; }
#unternehmen3Inhalt h2, #unternehmen1Inhalt h2 { color: #1E1E1D !important; }
/* KONTAKT */
#kontakt .aboHolder { padding:0px;}
#anschrift h3, #anschrift p { color:white !important; }

/* JOBS */
#jobs h2 { color: #1E1E1D !important; }


/* NEUIGKEITEN */
.newsBack { width:100%;background-color:#ebebeb;padding:50px; }
.newsRechts { flex-grow:1.4;flex-basis:10px;background-color:white; }
.newsLinks { flex-grow:1;flex-basis:10px;background-color:#009640; display:flex;align-items:center;justify-content:center; }
.newsHolder { background-color:white;width:100%;margin:0 auto;display:flex;flex-direction:row;justify-content:space-between;align-items:stretch;margin-bottom:30px;min-height:400px;gap:30px; }
.paddingNews { padding:50px 90px; }

/* FOOTER */
.footFlex {
	display:flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: stretch;
	background-color: var(--hvg-color);
	color: white;

	margin: 30px auto;
	padding: 10px 0px;
	flex-wrap: wrap;
	font-weight: 400;
}

.footItem {
	flex-basis: 10px;
	text-align: left;
}

.footTitel {
	font-family: 'Hanken Grotesk';
	font-size: 1.2rem;
	font-weight: 600;
}

.footTitel:after {
    content:"\a";
    white-space: pre;
}

.flexThreesome {
  display:flex;
  flex-direction: row;
  gap: 30px;
  justify-content: space-between;
  align-items: stretch;
  width:100%;
}

.flexThreesomeItem {
  padding:40px 60px;
  flex-basis:10px;
  flex-grow: 1;
}


.flexOneTwo {
	display:flex;
  flex-direction: row;
  gap: 30px;
  justify-content: space-between;
  align-items: stretch;
  width:100%;
}

.flexOneTwo-1 {
  padding:80px 60px;
	flex-basis:10px;
  flex-grow: 1;
  width:33%;
}

.flexOneTwo-2 {
  padding:80px 60px;
  flex-basis:10px;
  flex-grow: 2.3;
  width:33%;
	background-image: url('/wp-content/uploads/2023/02/hvg-frage-image.webp');
	background-size: cover;
	background-repeat: no-repeat;
	background-position: right 20px bottom -80px;
}
.padding80 { padding: 80px; }



.neuigkeitenTitel {
	font-family: 'Hanken Grotesk';
	font-size: 25px;
	margin-bottom: 20px;
	hyphens: auto;
}

.neuigkeitenText {
	font-family: 'Hanken Grotesk';
	color: #1e1e1d;
	font-size: 16px;
}

.neuigkeitenButton {
	font-family: 'Hanken Grotesk' !important;
	color:white !important;
	background-color: #068F3E !important;
	text-align: center;
	width: 200px;
	border-radius: 0px !important;
}

hr.neuigkeiten {
  border-top: 1px solid black;
}

.aboButton {
	color: white;
border: 2px solid white !important;
border-radius: 0px !important;
background-color: var(--hvg-color) !important;
font-size: 18px;
padding: 15px 80px !important;
margin: 0 auto !important;
width: 100% !important;
}

/* ================================================================ */
/* __  __          _ _          ____                  _             */
/* |  \/  |        | (_)        / __ \                (_)           */
/* | \  / | ___  __| |_  __ _  | |  | |_   _  ___ _ __ _  ___  ___  */
/* | |\/| |/ _ \/ _` | |/ _` | | |  | | | | |/ _ \ '__| |/ _ \/ __| */
/* | |  | |  __/ (_| | | (_| | | |__| | |_| |  __/ |  | |  __/\__ \ */
/* |_|  |_|\___|\__,_|_|\__,_|  \___\_\\__,_|\___|_|  |_|\___||___/ */
/* ================================================================ */

@media only screen and (max-width: 1760px) {
	.flexOneTwo-2 { background-position: right 20px bottom 0px;	}
}
	
@media only screen and (max-width: 1700px) {
	.slideTitel { margin-left: -100px; }
	.titleTitle { font-size: 40px; line-height: 50px; }
	#u1ItemLeft { background-position: left 10px bottom -50px; }
}

@media only screen and (max-width: 1500px) {
	.footItem {
		flex-basis: 33%;
		margin-bottom: 50px;
	}

	.footFlex {
		max-width: 1200px;
		justify-content: space-between;
		padding: 10px 30px;
	}
	.slideTitel { margin-left: 0px; text-align: center !important; }
  .infoHolder { padding-right: 80px !important; }
	.padding80 { padding: 40px; }
	.columnImage {padding: 200px 0px !important;}
	.newsRechts { flex-grow:1;flex-basis:10px; }
	.newsLinks { flex-grow:1;flex-basis:10px; }
	#u1ItemLeft { background-position: left 10px bottom 0px; }
}

@media only screen and (max-width: 1440px) {
	.titleRow { padding: 20px; }
}

@media only screen and (max-width: 1300px) {
	.slideTitel { font-size: 5.5rem; }
  .infoHolder { padding-right: 50px !important; }
  .infoText { line-height: 20px !important; }
  .infoIcon { width: 50px !important; }
	.titleTitle {  font-size: 30px; }
	#fahrplan { flex-direction: column !important; }
	#rechts { flex-direction: row !important; }
	.sonderItemBild { padding: 500px 0px 100px 0px !important; }
	.sonderRow { flex-direction: column-reverse; }
	#u1ItemLeft { background-position: left -110px bottom 0px; }
}

@media only screen and (max-width: 1200px) {
	.aboHolder { padding: 0px 40px; }
	.aboItem { padding: 40px 30px; }
	.column1200 { flex-direction: column; }
	.faktenRight > div { flex-grow: 0.5 !important; }
	#u1ItemLeft { background-position: left -210px bottom 0px; }
}
	
@media only screen and (max-width: 1160px) {
	#menuLogo { width: 15% !important; }
	.menu-hauptemenue { width: 80% !important; }
	#navMenu { padding: 15px 15px; }
	.slideTitel { font-size: 4.5rem; line-height: 70px !important; padding-top: 80px; }
  .infoHolder { padding-right: 0px !important; }
  .infoTitle { font-size: 1.5rem !important; }
  h4 { font-size: 3vh !important; }
  .infoIcon { margin: 0px 0px 30px 0px; }
	#ticketInfos { flex-direction: column; }
	.aboHolder { padding: 0px 20px; }
	.titleRow { flex-direction: column; }
	.titleLeft {margin-bottom: 25px;}
	.flexThreesome {flex-direction:column;}
	#u1ItemLeft { background-position: left -300px bottom 0px; }
}

@media only screen and (max-width: 1000px) {
	.mfn-header-menu > .mfn-menu-li > .mfn-menu-link { padding: 8px 10px !important; }
  .infoIcon { display: none !important; }
  .infoSubtitle { margin-top: 20px !important; }
	.titleRow { padding: 20px 30px; }
	#u1Row { flex-direction: column-reverse; }
	#u1ItemRight { padding: 60px; }
	#u1ItemLeft { padding: 200px 0px; }
	.newsHolder { flex-direction: column !important; }
	#u1ItemLeft { background-position: left 0px bottom 0px; }
}

@media only screen and (max-width: 960px) {
  #infoImage1 { display: none !important; }
  #infoImage2 { left: 28px !important; }
  #infosSlide { width: 50% !important; left: 380px !important; padding-top: 10px !important; }
  .flexThreesome, .flexOneTwo { flex-direction: column; }
  .flexThreesomeItem, .flexOneTwo-1, .flexOneTwo-2 { width: 100% !important; }
	.flexOneTwo-2 { display: none; }
	.infoSubtitle { margin-top: 0px !important; }
	#harzaboInhalt, #jugendfreizeitaboInhalt { flex-direction: column; }
	.aboNumberHolder { display: none !important; }
	.aboZahlung { flex-grow: 1 !important; }
	#rechts { flex-direction: column !important; }
	.column960 { flex-direction: column !important; }
	.accordContent { padding: 10px !important; }
	#unternehmen1Inhalt, #unternehmen2Inhalt, #unternehmen3Inhalt { padding: 40px !important; }
	.aboLinks { flex-direction: column !important; }
}

@media only screen and (max-width: 900px) {
	
}

@media only screen and (max-width: 960px) {
 
}

@media only screen and (max-width: 870px) {
	.footItem {
		flex-basis: 49%;
		text-align: center;
	}
	.slideTitel { padding-top: 0px; }
}

@media only screen and (max-width: 823px) {
	#navMenu { padding: 15px 10px; }
	.mcb-section .mcb-wrap .mcb-item-xye8suakf .mfn-header-menu { font-size: 13px; }
  #infosSlide { width: 50% !important; left: 330px !important; padding-top: 10px !important; }
  #pfeilRechts2, #pfeilLinks2 { display: block !important; }
  #pfeilRechts, #pfeilLinks { display: none !important; }
}

@media only screen and (max-width: 767px) {
	#menu-hauptemenue {
		font-size: min(4.5vw, 28px);
	}
	.slideTitel { padding-top: 0px; }
  .flexThreesomeItem { padding:40px 30px; }
	.current_page_item { color: #068F3E !important; border-bottom: 0px solid #068F3E; padding-top: 0px !important; }
	.menu-item:hover { color: #068F3E !important; border-bottom: 0px solid #068F3E; padding-top: 0px !important; }
	.mfn-header-menu > .mfn-menu-li { height: 50px !important; }
	.aboButton { padding: 15px 10px !important; }
	.column767 { flex-direction:column !important; }
	p, li, .titleRight { font-size: 18px !important; line-height:28px !important; }
	#jobs div { padding-left:5px !important; padding-right:5px !important; }
}

@media only screen and (max-width: 767px) {
  #infoImage2 { left: 10px !important; width: 200px !important; }
  .infoImage2 { width: 200px !important; height: auto !important; }
  #infosSlide { width: 60% !important; left: 250px !important; }
}

@media only screen and (max-width: 660px) {
  #StartseiteInfosMobil { display:block; }
  #StartseiteInfos { display: none !important; }
	.paddingNews { padding:50px 40px; }
	.newsBack {padding:50px 20px; }
}

@media only screen and (max-width: 630px) {
	.slideTitel { font-size: 3.5rem; line-height: 50px !important; }
	.footItem {
		flex-basis: 99%;
		margin-bottom: 50px;
	}
	.titleLeft { flex-direction: column; }
}

@media only screen and (max-width: 580px) {
	.aboHolder { flex-direction: column !important; }
	.accord { font-size: 1.1rem; }
}

@media only screen and (max-width: 500px) {
	.aboZahlholder { flex-direction: column !important; align-items: flex-start !important; justify-content: flex-start !important; }
}
	
@media only screen and (max-width: 450px) {
	.slideTitel { font-size: 2.5rem; line-height: 40px !important; }
	.paddingNews { padding:50px 20px; }
}

@media only screen and (max-width: 350px) {
	.slideTitel { font-size: 2.0rem; line-height: 30px !important; }
  .infoSubtitle { line-height: : 0px !important; margin-bottom: 10px !important; margin-top: 10px !important; }
  .infoTitle { margin-bottom: 10px !important; }
}

@media only screen and (max-width: 300px) {
	.newsBack {padding:50px 5px; }
}

/* hanken-grotesk-100 - latin */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 100;
  src: url('../fonts/hanken-grotesk-v5-latin-100.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/hanken-grotesk-v5-latin-100.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/hanken-grotesk-v5-latin-100.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/hanken-grotesk-v5-latin-100.woff') format('woff'), /* Modern Browsers */
       url('../fonts/hanken-grotesk-v5-latin-100.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/hanken-grotesk-v5-latin-100.svg#HankenGrotesk') format('svg'); /* Legacy iOS */
}

/* hanken-grotesk-200 - latin */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 200;
  src: url('../fonts/hanken-grotesk-v5-latin-200.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/hanken-grotesk-v5-latin-200.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/hanken-grotesk-v5-latin-200.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/hanken-grotesk-v5-latin-200.woff') format('woff'), /* Modern Browsers */
       url('../fonts/hanken-grotesk-v5-latin-200.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/hanken-grotesk-v5-latin-200.svg#HankenGrotesk') format('svg'); /* Legacy iOS */
}

/* hanken-grotesk-300 - latin */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/hanken-grotesk-v5-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/hanken-grotesk-v5-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/hanken-grotesk-v5-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/hanken-grotesk-v5-latin-300.woff') format('woff'), /* Modern Browsers */
       url('../fonts/hanken-grotesk-v5-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/hanken-grotesk-v5-latin-300.svg#HankenGrotesk') format('svg'); /* Legacy iOS */
}

/* hanken-grotesk-regular - latin */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/hanken-grotesk-v5-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/hanken-grotesk-v5-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/hanken-grotesk-v5-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/hanken-grotesk-v5-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/hanken-grotesk-v5-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/hanken-grotesk-v5-latin-regular.svg#HankenGrotesk') format('svg'); /* Legacy iOS */
}

/* hanken-grotesk-500 - latin */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/hanken-grotesk-v5-latin-500.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/hanken-grotesk-v5-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/hanken-grotesk-v5-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/hanken-grotesk-v5-latin-500.woff') format('woff'), /* Modern Browsers */
       url('../fonts/hanken-grotesk-v5-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/hanken-grotesk-v5-latin-500.svg#HankenGrotesk') format('svg'); /* Legacy iOS */
}

/* hanken-grotesk-600 - latin */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/hanken-grotesk-v5-latin-600.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/hanken-grotesk-v5-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/hanken-grotesk-v5-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/hanken-grotesk-v5-latin-600.woff') format('woff'), /* Modern Browsers */
       url('../fonts/hanken-grotesk-v5-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/hanken-grotesk-v5-latin-600.svg#HankenGrotesk') format('svg'); /* Legacy iOS */
}

/* hanken-grotesk-700 - latin */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/hanken-grotesk-v5-latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/hanken-grotesk-v5-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/hanken-grotesk-v5-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/hanken-grotesk-v5-latin-700.woff') format('woff'), /* Modern Browsers */
       url('../fonts/hanken-grotesk-v5-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/hanken-grotesk-v5-latin-700.svg#HankenGrotesk') format('svg'); /* Legacy iOS */
}

/* hanken-grotesk-800 - latin */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 800;
  src: url('../fonts/hanken-grotesk-v5-latin-800.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/hanken-grotesk-v5-latin-800.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/hanken-grotesk-v5-latin-800.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/hanken-grotesk-v5-latin-800.woff') format('woff'), /* Modern Browsers */
       url('../fonts/hanken-grotesk-v5-latin-800.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/hanken-grotesk-v5-latin-800.svg#HankenGrotesk') format('svg'); /* Legacy iOS */
}

/* hanken-grotesk-900 - latin */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: normal;
  font-weight: 900;
  src: url('../fonts/hanken-grotesk-v5-latin-900.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/hanken-grotesk-v5-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/hanken-grotesk-v5-latin-900.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/hanken-grotesk-v5-latin-900.woff') format('woff'), /* Modern Browsers */
       url('../fonts/hanken-grotesk-v5-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/hanken-grotesk-v5-latin-900.svg#HankenGrotesk') format('svg'); /* Legacy iOS */
}

/* hanken-grotesk-100italic - latin */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: italic;
  font-weight: 100;
  src: url('../fonts/hanken-grotesk-v5-latin-100italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/hanken-grotesk-v5-latin-100italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/hanken-grotesk-v5-latin-100italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/hanken-grotesk-v5-latin-100italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/hanken-grotesk-v5-latin-100italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/hanken-grotesk-v5-latin-100italic.svg#HankenGrotesk') format('svg'); /* Legacy iOS */
}

/* hanken-grotesk-200italic - latin */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: italic;
  font-weight: 200;
  src: url('../fonts/hanken-grotesk-v5-latin-200italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/hanken-grotesk-v5-latin-200italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/hanken-grotesk-v5-latin-200italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/hanken-grotesk-v5-latin-200italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/hanken-grotesk-v5-latin-200italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/hanken-grotesk-v5-latin-200italic.svg#HankenGrotesk') format('svg'); /* Legacy iOS */
}

/* hanken-grotesk-300italic - latin */
@font-face {
  font-family: 'Hanken Grotesk';
  font-style: italic;
  font-weight: 300;
  src: url('../fonts/hanken-grotesk-v5-latin-300italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/hanken-grotesk-v5-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/hanken-grotesk-v5-latin-300italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/hanken-grotesk-v5-latin-300italic.woff') format('woff'), /* Modern Browsers */
       url('../fonts/hanken-grotesk-v5-latin-300italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/hanken-grotesk-v5-latin-300italic.svg#HankenGrotesk') format('svg'); /* Legacy iOS */
}