/*
	Stylesheet Hand Coded by JAM Studios (https://jamstudios.co) on August 12, 2024
	Font:					Hanken Grotesk
	Version:				2.41
	Release:				September 12, 2019
	Category:			Sans-serif
	Language Support:	Baltic, Basic Latin, Central European, Euro, Pinyin, Romanian, Turkish, Western European
	Partial Support:	Afrikaans (97%), Catalan (91%), Dutch (96%)
	License:				SIL Open Font License
	Author:				Hanken Design Co
	Acquired From:		Fonts Arena (https://fontsarena.com)
*/

*, *:before, *:after { box-sizing:border-box; }
* { margin:0; padding:0; }
::selection { background-color:transparent; }
h1, h2, h3, h4, h5, h6 { text-wrap:balance; }
a { transition:color 0.3s ease; }

html { overscroll-behavior:none; cursor:default; user-select:none; }
html, body { height:100%; font-family:'HKG-Regular',sans-serif; }
body { color:#fff; margin:0 auto; padding:0; background-color:#161616; display:flex; flex-direction:column; align-items:center; /*justify-content:center;*/ overflow:auto; }
a { font-family:'HKG-Light',sans-serif; text-decoration:underline solid rgba(255,255,255,0.3); color:rgba(255,255,255,0.8); text-shadow:0 0 12px rgba(22,22,22,0.2); }
a:hover { color:#ccc; }

.boxpad { padding:15px 30px 0; }

.hero { z-index:1; display:block; position:absolute; top:0; overflow:hidden; height:70vh; width:100%; }
.hero::before { z-index:1; content:''; display:block; position:absolute; top:0; right:0; bottom:0; left:0; background:linear-gradient(0deg, rgba(22,22,22,1) 0%, rgba(22,22,22,0) 30%, rgba(22,22,22,0.6) 100%); }
.hero picture > img { position:absolute; z-index:0; min-width:100%; min-height:100%; bottom:15%; left:50%; transform:translate(-50%, 15%); }
.hero .details { position:absolute; z-index:1; bottom:0; left:0; right:0; display:flex; align-items:flex-end; justify-content:space-between; }

.wrapper { position:absolute; top:72vh; left:0; right:0; display:flex; flex-direction:column; align-items:center; }

.container { width:100%; flex:1; position:relative; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:space-between; padding:30px 0; text-align:center; }
.container > div { flex:1; }

header { position:absolute; z-index:2; top:0; left:0; right:0; display:flex; align-items:center; justify-content:space-between; }
header a { font-size:16px; text-transform:uppercase; color:#fff; font-family:'HKG-Semi-Bold'; text-decoration:none; text-shadow:0 0 12px rgba(22,22,22,0.2);  }
header a:hover { color:#ccc; }
header a.brand { width:90px; margin:0; position:relative; left:-7px; }
header a.brand img { width:100%; height:auto; }
.landing a.brand { width:256px; }
.landing a.brand img { width:100%; height:auto; }
a.brand { display:block; height:auto; margin:0 auto; }
a.brand > img { max-width:100%; }

h1,h2,h3 { margin:0; padding:0; }
h1 { font-size:42px; line-height:44px; }
h2 { font-size:26px; line-height:28px; }
h3 { font-size:20px; line-height:22px; }
h2.margin { margin-top:18px; }
.uc { text-transform:uppercase; }

.hk-bold { font-family:'HKG-Bold',sans-serif; }
.hk-semi { font-family:'HKG-Semi-Bold',sans-serif; }
.hk-reg { font-family:'HKG-Regular',sans-serif; }
.hk-light { font-family:'HKG-Light',sans-serif; }

@media screen and (max-width:1282px) /*and (orientation:portrait), (max-width:1441px) and (orientation:landscape)*/ {
	.landing a.brand { width:190px; }
	h1 { font-size:32px; line-height:normal; }
	h2 { font-size:24px; line-height:normal;}
	h2.margin { margin-top:8px; }
}
@media screen and (max-width:901px) /*and (orientation:portrait), (max-height:1023px) and (orientation:landscape) /*(max-height:1281px) and (orientation:landscape)*/ {
	.landing a.brand { width:144px; }
	h1 { font-size:28px; line-height:normal; }
	h2 { font-size:18px; line-height:normal; }
	h2.margin { margin-top:8px; }
}
@media screen and (max-width:381px) /*and (orientation:portrait), (max-height:801px) and (orientation:landscape)*/ {
	.landing a.brand { width:128px; }
	h1 { font-size:24px; line-height:normal; }
	h2 { font-size:16px; line-height:normal; }
	h2.margin { margin-top:8px; }
}
