


@font-face {
    font-family: 'playfair_displayitalic';
    src: url('../Fonts/playfairdisplay-italic-webfont.woff2') format('woff2'),
         url('../Fonts/playfairdisplay-italic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'playfair_displaybold_italic';
    src: url('../Fonts/playfairdisplay-bolditalic-webfont.woff2') format('woff2'),
         url('../Fonts/playfairdisplay-bolditalic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'arimoregular';
    src: url('../Fonts/arimo-regular-webfont.woff2') format('woff2'),
         url('../Fonts/arimo-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'oswaldregular';
    src: url('../Fonts/oswald-regular-webfont.woff2') format('woff2'),
         url('../Fonts/oswald-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@media screen {
	*
	{
		margin:0;
		padding:0;
		box-sizing:border-box;
		-moz-box-sizing:border-box;
		-webkit-box-sizing:border-box;
	}
	
	html, body {min-height: 100%;}
	
	body {		
		font-family: 'arimoregular'; 
		font-weight: normal;
		background:#fff;
	}

	body.mobile .toggleNav{display:block;}
	body.mobile nav[role=navigation] ul {display:none;}
	body.mobile #naviMain:target {display:block;}

	.container {
		max-width:970px !important;
		margin:0 auto;
		padding:0;
		position:relative;
	}
	body .container > .row {padding-top:calc(var(--bs-gutter-x) * .5)}
	header {		
		/*min-height:205px;	*/
		background:#fdc100;
		margin-bottom:0.9rem;
	}
	
	header .social {
		text-align:right;
		padding-top:20px;
	}
	header .row.swap {padding-top:5px;}
	header .social a {
		margin-right:10px;
		display:inline-block;
	}
	header .social a:last-child {margin-right:3px;}
	header .social a:hover img {
		filter: brightness(0.3);
      -webkit-filter: brightness(0.3); 
	}
	header .social a img {max-width:30px;}
	header .lead {
		font-family: 'playfair_displayitalic'; 
		color:#fff;
		font-size:76px;
		margin-bottom:0;
		max-height:107px;
	}

	#branding {
		display:block;
		border-right:1px solid #fff;
	}
	#branding img {
		max-width:200px;
	}

	nav {
		display:block;
		width:100%;
		height:auto;
	/*	position:absolute;
		top:85px;
		z-index:555;	*/	
	}
	nav ul,	ul.navi, #buLogin ul {
		list-style:none;
		/*background-image: -webkit-linear-gradient(top, #32363c 0%, #1b1d20 100%); 
		background-image: -moz-linear-gradient(top, #32363c 0%, #1b1d20 100%); 
		background-image: -o-linear-gradient(top, #32363c 0%, #1b1d20 100%); 
		background-image: linear-gradient(top, #32363c 0%, #1b1d20 100%);*/
	}
	nav a.toggleNav {
		text-indent:100%;
		white-space:nowrap;
		overflow:hidden;
		width:100%;
		display:block;
		height:40px;
		background: #e02e36 url(../Images/nav-icon.png) top right no-repeat;
		border-bottom:1px solid #d1d1d1; 
	}
		nav a.toggleNav.active {
			background-position:bottom right;
		}

	.nav {
		display: none;
		width:100%;
		height:auto;	
		padding-left:0 !important;		
	}
		.nav li {
			height:auto;	
			padding-top:63px;		
		}
		
			.nav li a {
				padding:0 0.5em 0 0 !important;
				font-size:0.73em;
				line-height:40px;
				text-align:center;
				text-decoration:none;
				color:#fff;
				font-family: 'arimoregular';
			}
			.nav li a.nav-link:after {
				content:'|';
				padding-left:0.5em;	
				color:#fff;					
			}
			.nav li:last-child a {padding-right:0 !important;}
			.nav li:last-child a.nav-link:after {
				content:'';	
				padding-left:0em;					
			}
			.nav li a:active, .nav li a:hover, .nav li a.active {
				color:#424242 !important;
			}
	
	h1, h2 {
		font-family: 'oswaldregular'; 
		color:#424242;		
		margin-top:.75em !important;
		margin-bottom:.75em !important;
	} 
	h1 {font-size:2.1rem !important;}
	h2 {
		font-size:1.4rem !important; 
		line-height:1.6 !important;
		text-decoration:none;
		margin-top:1em !important;
		margin-bottom:1em !important;
	}
	h2 small {margin-bottom:2px;}
	h1 small, h2 small, h2 small a, h3 {
		font-family: 'playfair_displaybold_italic'; 
		color:#fdc100; 
		font-size:1.3rem; 
		display:block;
		line-height:2.5rem;
	}
	h1 small {line-height:3rem;}
	a h2 {text-decoration:none;color:#424242;	}
	h2 a:hover, a:hover h2,
	.content a.teaserLinks:hover h2 {color:#c60000;}
	h3 {font-size:2.5rem !important; }
	h4 {font-family: 'oswaldregular';}
	ul, ol {list-style:none;padding-left:1rem !important;}
	.btn-primary {
		background-color:#001e99 !important;
		border-color:#001e99 !important;
	}
	.btn-primary:hover {
		background-color:#fdc100 !important;
		border-color:#fdc100 !important;
	}
	
	.content p {
		font-family: 'arimoregular'; 
		font-size:1rem !important; 
		color:#424242;
		line-height:1.7;
	} 
	.content p a, .accordion-body a {text-decoration:none; color:#000 !important; background: url('../Images/aUnderline.gif') 0 18px repeat-x;}
	.content p a:hover, .accordion-body a:hover {color:#c60000 !important;}
	a.teaserLinks, a.imgHeadline {text-decoration:none; display:block;}
	.content .row.align-items-start > div {margin-top:3rem;}
	.content .row.align-items-start:last-child {margin-bottom:3rem !important;}
	
	.content .accordion {margin-right:14%}
	.content .accordion-item {border:0px solid rgba(0, 0, 0, 0.125);margin-bottom:1em !important}
	.content .accordion h2.accordion-header {margin-top:0em !important;margin-bottom:0em !important}
	.content .accordion-item .accordion-body {padding:1rem 1.25rem 0.25rem;font-family:'arimoregular' !important;}
	.content .accordion-item .accordion-body ul {padding-left:0 !important;margin-bottom:0em}
	.content .accordion-item .accordion-body ul a {color:#424242;background:none;} 
	.content .accordion-button, 
	.content .accordion-button:not(.collapsed)	{
		background:#fdc100;
		color:#fff;
		font-family:'playfair_displayitalic';
		font-size:1.8em;
		box-shadow:none;
		padding:0.4rem 1.25rem;
	}
	.content .accordion-button:focus {box-shadow:none;}
	.content .accordion-button:after {
		border:2px solid #fff;
		border-radius:50%;
		padding:20px;
		background-size:1.5rem;
		background-position:center 10px;
		filter: brightness(100);
		backdrop-filter: brightness(100);
	}
	
	.sidebar > a .img-fluid {margin-bottom:calc(var(--bs-gutter-x) * 1);}
	.boxStorySidebar {
		margin-bottom:calc(var(--bs-gutter-x) * 1);
		position:relative;
		border:0px solid red;
	}
	.boxStorySidebar h4,
	.boxStorySidebar img:nth-child(2),
	.boxStories h4,	
	.boxStories img:nth-child(2) {position:absolute;z-index:10;}
	
	.boxStorySidebar img:first-child,
	.boxStories img:first-child	{opacity:0;}
	
	
	.boxStorySidebar h4,
	.boxStories h4 {	
		z-index:20;
		text-transform:uppercase;
		color:#fff;
		bottom:18px;
		left:18px;
		margin-bottom:0;
		font-size:30px;
	}
	.boxStorySidebar a.teaserLinks:hover h4,
	.boxStories a.teaserLinks:hover h4 {
		color:#fdc100;
	}
	.img-fluid {
		width:100%;
	}
	.stories {
		background:#fef3cc;		
	}
	.stories h3.text-center,
	.discoverTopics h3.text-center	{margin-top:calc(var(--bs-gutter-x) * .5);}
	.stories .col-md-3:nth-child(2n-1) .boxStories h4 {top:20px;}
	.boxStories {
		position:relative;
		margin-bottom:calc(var(--bs-gutter-x) * 1.5);
		/* cb- margin-top:calc(var(--bs-gutter-x) * .5); */
	}
	.boxStories a {display:block}
	.boxStories img {min-height:283px;}
	
	.discoverTopics {background:#afb5dc;}
	.discoverTopics .offset-md-2.text-center {
		padding:2% 0 4% 0;
	}
	.discoverTopics h3 {color:#fff;}
	.discoverTopics a {
		font-family:'oswaldregular';
		color:#fff;
		text-decoration:none;
		font-size:1.5rem;
		padding:10px 20px;
		display:inline-block;
	}
	.discoverTopics a:hover {color:#fdc100;}
	
	footer .container > .row, .container.ads > .row {padding-top:calc(var(--bs-gutter-x) * 1)}
	
	footer .container {font-size:11px;color:#6e6e6e;}
	footer .container .col-12 .row {
		margin-left:0;
		margin-right:0;
		background:#ececec;
		padding-top:20px;
		min-height:148px;
	}
	footer .container ul a {
		font-family: 'arimoregular';
		font-size:11px;
		line-height:1.5em;
		color:#6e6e6e;
		text-decoration:none;
	}
	footer .designatelier img {
		float:left;
		margin-right:5px;
		margin-top:3px;
	}
	footer .designatelier p {float:left; max-width:85%;}
	
}

/* mobile iPhone X portrait 480px */
@media only screen and (max-device-width: 480px) {
	#branding img {max-width:100%; border-bottom:0px solid red;}
	.container {
		max-width:100% !important;
	}
	header {margin-bottom:auto}
	header .col-lg-9 {padding-left:0}
	header .swap {display: flex;position:absolute; top:0;}
	header .swap > div:nth-child(1){order:2;}
	header .swap > div:nth-child(2){order:1;}
	header .nav li {padding-top:6px;}
	header .nav li a {font-size:0.6em;line-height:20px}
	header .lead {font-size:34px;}
	header .social {padding-right:15px;position:relative;z-index:30;}
	header .row.swap .col-lg-5 {border:0px solid red;}
	
	.boxStorySidebar, 
	.stories .boxStories,
	.sidebar > a .img-fluid {margin-bottom:calc(var(--bs-gutter-x) * .5)}
	.boxStorySidebar h4, .boxStories h4 {font-size:60px;}
	
	footer .container > .row, .container.ads > .row  {padding-top:calc(var(--bs-gutter-x) * .5)}
	footer .col-2, footer .col-5 {width:33%}
	footer .col-3 {width:100%}
}

/* iPad Media portrait */
@media only screen 
and (min-device-width: 768px) 
and (max-device-width: 1023px) 
and (orientation: portrait) {
	#branding img {max-width:100%; border-bottom:0px solid red;}
	header .lead {font-size:72px;}
	header .social a:last-child {margin-right:19px;}
	.nav li {padding-top:58px;}
	header .row.swap {padding-top:22px;}
}
	