/*---------------------
General
---------------------*/
a { font-weight: normal; color: #333; text-decoration: underline; }
	a:hover { text-decoration: none; }

h1, h2, h3 { color: #000; line-height: 1em; font-weight: 500; }
h1 { font-size: 76px; margin: 0 0 30px 0; }
h2 { font-size: 54px; margin: 15px 0 15px 0; }
h3 { font-size: 38px; margin: 15px 0 15px 0; }
h4 { margin: 25px 0 5px 0; line-height: 1.5; }
p { margin: 0 0 10px 0; font-weight: lighter; }

::selection { background: #d0e8ff; }
::-moz-selection { background: #d0e8ff; }

table,
table tr,
table tr td { font: normal 12px/1.5 Arial, Verdana, Sans-serif; }

img, table { border: 0; }
html { margin: 0; padding: 0; }
body { margin: 0; padding: 0; COLOR: #000; font-size: 22px; font-family: "field-gothic-compact", Sans-serif; line-height: 1.5; background-color: #fff; }

/*---------------------
Body layout
---------------------*/
.sitewrapper { margin: 0 auto; }
.inner { max-width: 1767px; margin: 0 auto; padding: 0 13px; box-sizing: border-box; }

#logo { flex-basis: 86px; }
	#logo img { display: block; height: 100%; }

.header { }
	.header .inner { min-height: 106px; position: relative; display: flex; justify-content: space-between; align-items: center; transition: none; }
.loginDiv { display: flex; justify-content: center; align-items: center; gap: 10px; }
.langLink {display:inline-block;}
.langLink img {display:block;}
@keyframes slideOutIn { 0% { transform: translateY(0); opacity: 1; }
	25% { transform: translateY(-60%); opacity: 0.7; }
	50% { transform: translateY(-100%); opacity: 0; }
	75% { transform: translateY(-60%); opacity: 0.7; }
	100% { transform: translateY(0); opacity: 1; }
}

.header.sticky .inner { min-height: 0; padding: 10px 13px; }
.header.animate .inner { animation: slideOutIn 1s ease-in-out; }
.header.animate-reverse .inner { animation: slideOutIn 1s ease-in-out reverse; }
.header.start { position: fixed; top: 0; left: 0; right: 0; width: 100%; z-index: 3; background: #fff; }

.header #contact { position: absolute; right: 20px; top: 10px; }
.header #responsive-menu-btn { display: none; }

.topmenu { width: 100%; flex-basis: 80%; }

	.topmenu ul { margin: 0; padding: 0; display: flex; justify-content: space-between; align-items: center; }
		.topmenu ul li { position: relative; list-style: none; margin: 0 0 -5px 0; padding: 0 20px; }
			.topmenu ul li i { margin: 0 0 0 10px; display: inline-block; }
			.topmenu ul li span.fakeLink { cursor: default; }
			.topmenu ul li a,
			.topmenu ul li span.fakeLink,
			#loginLink { display: block; font-size: 20px; color: #000; text-decoration: none; font-weight: 300; padding: 10px 0; }
				.topmenu ul li a:hover { text-decoration: none; }
				.topmenu ul li a.haschild::after { margin-left: 5px; font-size: 12px; }
			.topmenu ul li ul { display: none; position: absolute; top: 100%; left: 0; background: #fff; border: 1px solid #000; width: auto; min-width: 100%; white-space: nowrap; z-index: 1000; }
			.topmenu ul li:hover > ul { display: block; }
			.topmenu ul li:hover a i { transform: rotate(180deg); }
			.topmenu ul li ul li { margin: 0; padding: 5px 10px; }
				.topmenu ul li ul li a { display: block; padding: 5px 0; }
				.topmenu ul li ul li:hover { background: #000; }
					.topmenu ul li ul li:hover > a { color: #fff; }
				.topmenu ul li ul li ul { display: none; position: absolute; top: 0; left: 100%; white-space: nowrap; background: #fff; padding: 10px 0; box-shadow: 0 2px 5px rgba(0,0,0,0.2); z-index: 100; }
				.topmenu ul li ul li:hover > ul { display: block; }
				.topmenu ul li ul li ul li a { display: block; padding: 8px 20px; color: #000; text-decoration: none; white-space: nowrap; }
					.topmenu ul li ul li ul li a:hover { background: #000; color: #fff; }
			.topmenu ul li:hover > a i { transform: rotate(180deg); }
			.topmenu ul li:hover ul li:hover a i { transform: rotate(0deg); }
			.topmenu ul li:hover > a:after { opacity: 1; }
.header.sticky .topmenu ul li a { font-size: 16px; }

#loginLink { padding: 8px 20px 8px 15px; border: 1px solid #000; line-height: 1em; display: inline-flex; gap: 10px; flex-shrink: 0; }
	#loginLink:hover { background: #000; color: #fff; }
		#loginLink:hover img { filter: invert(100%); }

.header #nav ul#responsive { display: none; }
.header .contactPuffs { position: absolute; right: 0; }
/*---------------------
Page layout
---------------------*/
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
* html .clearfix { height: 1%; }

.content { background-color: #fff; margin: 106px 0 0 0; }
	.content .inner { min-height: 450px; overflow: hidden; padding: 100px 13px 40px 13px; }
.contentright { width: 100%; margin: 0; padding: 0; }
.breadcrumbs { width: 100%; text-align: center; font-size: 18px; gap: 10px; }
	.breadcrumbs a { text-decoration: none; }
		.breadcrumbs a:hover { text-decoration: underline; }
	.breadcrumbs .divider { display: inline-block; margin: 0 5px; }


#newsletterWrapper { background: #F8F8F8; width: 100%; max-width: 1735px; display: flex; justify-content: center; align-items: center; gap: 290px; padding: 130px 0; margin: 0 auto 100px auto; }
	#newsletterWrapper .text { width: 560px; text-align: center; }
		#newsletterWrapper .text h3 { font-size: 38px; margin: 0 0 30px 0; line-height: 1.5em; }
		#newsletterWrapper .text p { font-weight: lighter; margin: 0; }
	#newsletterWrapper .form { width: 514px; }
		#newsletterWrapper .form p,
		#newsletterWrapper .form label { margin: 0; font-size: 18px; color: #212529; }
		#newsletterWrapper .form input[type=text],
		#newsletterWrapper .form input[type=email] { display: block; padding: 20px 15px; font-size: 19px; width: 100%; box-sizing: border-box; }
	#newsletterWrapper .confirmDiv { display: flex; justify-content: flex-start; gap: 10px; align-items: flex-start; margin: 20px 0 0 0; }
		#newsletterWrapper .confirmDiv input[type=checkbox] { margin: 5px 0; }
	#newsletterWrapper input[type=submit],
	#newsletterWrapper .sendBtn { background: #000; color: #fff; padding: 20px 0; width: 100%; display: block; border: none; text-align: center; font-size: 19px; margin: 35px 0 0 0; cursor: pointer; border: 1px solid #000; box-sizing: border-box; }
		#newsletterWrapper input[type=submit]:hover,
		#newsletterWrapper .sendBtn:hover { background: #fff; color: #000; }
	#newsletterWrapper .form p.success { margin: 10px 0 0 0; color: #07b700; }
	#newsletterWrapper .form p.error { margin: 10px 0 0 0; color: #b70000; }
/*---------------------
Footer layout
---------------------*/

#footerLogos { margin: 45px 0 0 0; padding: 80px 0;}
#footerLogos .inner {display:flex; justify-content:center; align-items:center; gap: 5%;}
#footerLogos img {width: 20%; max-height: 75px; object-fit:contain;}

#footer { background: #000; padding: 90px 0px 60px 0; }
	#footer .footerColumns { display: flex; justify-content: space-between; align-items: flex-start; gap: 55px; border-bottom: 1px solid #fff; padding: 0 0 50px 0; }
		#footer .footerColumns .column:first-child { flex-basis: 575px; }
		#footer .footerColumns .column { flex-basis: 265px; }
			#footer .footerColumns .column:last-child { flex-basis: 200px; }
	#footer h4 { margin: 0 0 22px 0; color: #fff; font-size: 26px; font-weight: 500; }
	#footer p,
	#footer p a { font-size: 18px; color: #fff; font-weight: 300; text-decoration: none; }
		#footer p a:hover { text-decoration: underline; }
	#footer .socialMedia a { width: 100%; font-size: 22px; border: 1px solid #fff; padding: 16px 20px 12px 20px; display: inline-flex; justify-content: space-between; align-items: center; margin: 0 0 18px 0; text-decoration: none; color: #fff; line-height: 1em; box-sizing: border-box; }
		#footer .socialMedia a::after { content: url('/gfx/icons/arrow-right-short.svg'); display: block; margin-left: 0.5em; }
		#footer .socialMedia a:hover { color: #000; background: #fff; text-decoration: none; }
			#footer .socialMedia a:hover::after { filter: invert(100%); }

	#footer .footerLogo { padding: 40px 0 65px 0; border-bottom: 1px solid #fff; }
		#footer .footerLogo img { display: block; width: 100%; height: auto !important; }

	#footer .footerBottom p { padding: 45px 0 0 0; margin: 0; font-size: 16px; font-weight: 300; color: #fff; }

@media screen and (max-width: 1400px) {
	#newsletterWrapper {gap: 100px;}
}

@media screen and (max-width: 1220px) {
	#newsletterWrapper { gap: 50px; }
		#newsletterWrapper .form { width: 400px; }
		#newsletterWrapper .text { width: 500px; }
}

	@media screen and (max-width: 1050px) {
		body { font-size: 20px; }
		h1 { font-size: 56px; }
		h2 { font-size: 42px; }
		h3,
		.puffList .columnPuffs .startPuff .text h3 { font-size: 26px; }

		.topmenu { display: none; }
		.header .inner { min-height: 70px; }
		.header #responsive-menu-btn { position: relative; display: block; padding: 0; z-index: 999; color: #000; font-size: 30px; font-weight: bold; text-transform: uppercase; line-height: 50px; text-decoration: none; cursor: pointer; }
		.header .loginDiv { display: flex; justify-content: flex-end; gap: 20px; align-items: center; }
		.content { margin: 70px 0 0 0; }
			.content .inner { padding: 50px 13px 50px 13px; }


		#newsletterWrapper { gap: 25px; flex-direction: column; padding: 40px 20px; align-items: flex-start; box-sizing:border-box; }
			#newsletterWrapper .text h3{font-size: 32px; margin: 0 0 15px 0; line-height:1em;}
			#newsletterWrapper .form { width: 100%; max-width: 514px; }
			#newsletterWrapper .text { width: 100%; text-align:left; }
			#newsletterWrapper .form input[type="text"], #newsletterWrapper .form input[type="email"] {padding: 10px 7.5px;}
			#newsletterWrapper .form p, #newsletterWrapper .form label{font-size: 16px;}
			#newsletterWrapper input[type="submit"], #newsletterWrapper .sendBtn{margin: 20px 0 0 0;padding: 10px 0;}
			#footer .footerColumns { gap: 20px; flex-direction: column; }
			#footer .footerColumns .column:first-child,
			#footer .footerColumns .column, #footer .footerColumns .column:last-child { flex-basis: auto; }
	}

@media screen and (max-width:860px) {
	body { font-size: 18px; }
	h1 { font-size: 42px; }
	h2 { font-size: 32px; }
	h3,
	.puffList .columnPuffs .startPuff .text h3,
	#newsletterWrapper .text h3 { font-size: 22px; }

	#footerLogos { margin: 5px 0 0 0; padding: 40px 0; }
	#footerLogos .inner {flex-wrap:wrap; gap: 20px 5%;}
	#footerLogos img {width: 45%;}
		#footer { }
		#footer { padding: 40px 0 20px 0; }
			#footer h4 { margin: 0 0 10px 0; }
			#footer .footerColumns { padding: 0 0 20px 0; }
	}

@media screen and (max-width:600px) {
	body { font-size: 16px; }
	h1 { font-size: 36px; }
	h2 { font-size: 28px; }
	h3,
	#newsletterWrapper .text h3 { font-size: 20px; }
	.puffList .columnPuffs .startPuff .text h3 {font-size: 24px;}
	#newsletterWrapper input[type="submit"], #newsletterWrapper .sendBtn { font-size: 16px; }
	.inner { padding: 0 7px; }
		.content .inner { padding: 15px 7px; }
		.header #responsive-menu-btn { top: 3px; }
		#loginLink { font-size: 14px; padding: 5px 10px; display: flex; justify-content: space-between; align-items: center; }
		.breadcrumbs { font-size: 14px; }
	}

	@media screen and (max-width:480px) {
		h1 { font-size: 32px; }
		h2 { font-size: 24px; }
		h3 { font-size: 18px; }
		#newsletterWrapper .form p, #newsletterWrapper .form label{font-size: 14px;}
		#footer .socialMedia a { font-size: 16px; padding: 8px 10px 6px 10px; }
			#footer .socialMedia a::after { content: url('/gfx/icons/arrow-right-short-small.svg'); }
		#footer p,
		#footer p a { font-size: 16px; }

	}