/* ========= Global additions ========= */
::-webkit-scrollbar { display: none; }
body { font-family: 'Inter', Arial, Helvetica, sans-serif; }

/* ========= base.css (merged) ========= */
body {
	margin: 0 auto;
	padding: 0 auto;
	font-family: Arial, Helvetica, sans-serif;
	background-color: #f8f5ea;
}

#baseBody {
	height: 55vh;
	margin: 0 .5%;
	background-color: white;
	border-bottom-left-radius: 7rem;
	border-bottom-right-radius: 7rem;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

#baseHeader {
	height: 75vh;
	background-image: linear-gradient(to right top, #24318b, #1f4da5, #1e68bd, #2683d3, #389fe7);
	border-bottom-left-radius: 7rem;
	border-bottom-right-radius: 7rem;
}

#headerContainer {
	height: calc(12 * 1vh);
	display: flex;
	justify-content: space-between;
	align-items: center;
}

#headerLogoText {
	color: white;
	font-size: calc(2 * 1vw);
	font-weight: bold;
}

#headerBody {
	display: flex;
	flex-direction: row;
}

#headerDescriptionContainer {
	width: 50%;
	margin: auto;
}

#headerDescription {
	width: calc(25 * 1vw);
	margin: auto;
}

#thumbnailContainer {
	width: 50%;
	display: flex;
	flex-direction: column-reverse;
}

#thumbnailIcon {
	width: 46%;
	position: relative;
	top: -3vh;
}

.baseButton {
	text-decoration: none;
	cursor: pointer;
	background-image: linear-gradient(to top, #f06622, #f5791c, #f88b17, #fa9d15, #fbaf18);
	width: 60%;
	text-align: center;
	padding: 2% 5%;
	font-size: calc(1.33 * 1vw);
	font-weight: bold;
	border-radius: 0.3rem;
	color: white;
	display: block;
	margin: auto;
	-webkit-box-shadow: 0px 1px 3px 0px #6DAC15;
	box-shadow: 0px 1px 3px 0px #6DAC15;
}

.contactButton {
	padding: 3% 10%;
	margin: auto;
	border-radius: 2rem;
}

.baseButton:hover {
	background-image: linear-gradient(to top, #e16324, #dc6f1c, #d77916, #d18312, #cb8d12);
}

#headerDescriptionTitle {
	font-size: calc(1.9 * 1vw);
	color: white;
	font-weight: bold;
}

#headerDescriptionText {
	text-align: justify;
	font-size: calc(1.13 * 1vw);
	color: white;
	padding: 6% 0;
	font-weight: bold;
	height: auto;
	min-height: calc(6.1 * 1vw);
	width: 400px;
}

#detailContainer {
	display: flex;
	width: 90%;
	height: 19vh;
	margin: 0 auto;
	justify-content: space-between;
}

.detailItemContainer {
	width: 40%;
	margin: auto;
	display: flex;
}

.contactButtonContainer { width: 20%; }

.detailItem {
	cursor: pointer;
	width: 45%;
	height: 13vh;
	text-align: center;
	margin: auto;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
}

.detailItemContainerRightMargin {
	width: 0.3%;
	background-color: #a7a8ab;
}

.detaileItemTitle {
	font-size: calc(1.01 * 1vw);
	font-weight: bold;
}

.detailItemDescription {
	font-size: calc(0.93 * 1vw);
	color: #a7a8ab;
	padding-top: calc(1 * 1vh);
	width: 84%;
	text-align: justify;
}

#footerContainer {
	margin: 0 .5%;
	font-size: calc(0.93 * 1vw);
	color: #a7a8ab;
	height: 6vh;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.footerContact {
	width: 10%;
	text-align: end;
	margin-right: 7.1%;
}

.footerContact a {
	color: #a7a8ab;
	text-decoration: none;
	cursor: pointer;
}

#aaktaLogoContainer {
	display: flex;
	justify-content: center;
	align-items: center;
	padding-left: 5%;
}

.buttonWithOrangeOutline, .detailItemFullDescription { display: none; }

@media only screen and (max-width: 1700px) { #thumbnailIcon { width: 55%; top: -3vh; position: relative; } }
@media only screen and (max-width: 1550px) { #thumbnailIcon { width: 50%; top: -3vh; position: relative; } }
@media only screen and (max-width: 1250px) { #thumbnailIcon { width: 60%; top: -3vh; position: relative; } }
@media only screen and (max-width: 1150px) { #thumbnailIcon { width: 65%; top: -3vh; position: relative; } }
@media only screen and (max-width: 1100px) { #thumbnailIcon { width: 70%; top: -3vh; position: relative; } }

/* ========= mobilebaseview.css (merged) ========= */
:root {
	--startButtonFontForScreen992px: calc(2.5 * 1vw);
	--contactButtonFontForScreen992px: calc(2.2 * 1vw);
	--startButtonFontForScreen780px: calc(2.8 * 1vw);
	--contactButtonFontForScreen780px: calc(2.5 * 1vw);
	--startButtonFontForScreen400px: calc(3.5 * 1vw);
	--contactButtonFontForScreen400px: calc(3.5 * 1vw);
	--titleFontForScreen992px: calc(3.5 * 1vw);
	--subTitleFontForScreen992px: calc(3.2 * 1vw);
	--titleFontForScreen780px: calc(4.59 * 1vw);
	--subTitleFontForScreen780px: calc(3.96 * 1vw);
	--titleFontForScreen400px: calc(5.6 * 1vw);
	--subTitleFontForScreen400px: calc(5.3 * 1vw);
	--descriptionFontForScreen992px: 15.5pt;
	--descriptionFontForScreen918px: 13.5pt;
	--descriptionFontForScreen700px: 11.5pt;
}

@media screen and (max-width: 992px) {
	.footerContact { width: fit-content; text-align: center; margin-right: 0; }
	.baseButton { font-size: var(--startButtonFontForScreen992px); padding: 3.7% 5%; width: 90%; }
	#headerLogoText { font-size: 20pt; position: relative; top: calc(1 * 1vw); }
	#baseBody { height: fit-content; margin: 0 .5% 5% 0.5%; }
	#headerDescriptionContainer { width: fit-content; }
	.buttonWithOrangeOutline {
		text-decoration: none; display: block; font-weight: bold; cursor: pointer; color: white; padding: 3.7%; margin: 3%; width: 97%; border-radius: 0.3rem; font-size: var(--contactButtonFontForScreen992px); border: calc(0.2 * 1vh) solid white; outline: calc(0.2 * 1vh) solid #f5791c; background-image: linear-gradient(to top, #f06622, #f5791c, #f88b17, #fa9d15, #fbaf18);
	}
	#baseHeader { height: fit-content; margin-bottom: 3vh; border-bottom-left-radius: 4rem; border-bottom-right-radius: 4rem; }
	#headerBody { flex-direction: column-reverse; }
	#headerContainer { height: calc(4 * 1vh); align-items: end; }
	#aaktaLogoContainer { padding-left: 4%; }
	#headerDescriptionText { font-size: var(--descriptionFontForScreen992px); font-weight: normal; height: fit-content; padding: 5% 0 6% 0; }
	#thumbnailContainer { width: 100%; justify-content: center; align-items: center; }
	#headerDescriptionTitle { font-size: var(--titleFontForScreen992px); }
	#headerDescription { width: calc(46 * 1vw); padding-bottom: calc(3 * 1vh); }
	#thumbnailIcon { padding-right: calc(5 * 1vw); width: 24%; padding-bottom: calc(2 * 1vh); position: relative; top: -3vh; }
	#detailContainer { flex-direction: column; height: fit-content; }
	.detailItemContainer { flex-direction: column; height: fit-content; width: 54%; }
	.detailItemContainerRightMargin, .contactButtonContainer { display: none; }
	.detaileItemTitle { cursor: auto; font-size: var(--subTitleFontForScreen992px); }
	.detailItemDescription { font-size: var(--descriptionFontForScreen992px); font-weight: normal; text-align: justify; width: 105%; }
	.detailItem { width: auto; height: fit-content; margin-bottom: calc(3 * 1vh); }
	#footerContainer { height: fit-content; font-size: calc(2.5 * 1vw); flex-direction: column-reverse; }
	#footerContainer #copyright { margin: 1% auto; }
}

@media screen and (max-width: 918px) { #thumbnailIcon { width: 30%; position: relative; top: -3vh; } #headerDescriptionText, .detailItemDescription { font-size: var(--descriptionFontForScreen918px); } }
@media screen and (max-width: 855px) { .detailItem { margin-bottom: calc(7 * 1vh); } #headerLogoText { top: calc(4 * 1vw); } }
@media screen and (max-width: 840px) { .detailItem { margin-bottom: calc(6 * 1vh); } #thumbnailIcon { width: 33%; padding-bottom: calc(1.2 * 1vh); position: relative; top: -3vh; } }
@media screen and (max-width: 780px) { #headerLogoText { top: calc(2.5 * 1vw); } .detailItem { margin-bottom: calc(5 * 1vh); } #headerDescriptionTitle { font-size: var(--titleFontForScreen780px); } .detaileItemTitle { font-size: var(--subTitleFontForScreen780px); } #thumbnailIcon { width: 40%; position: relative; top: -3vh; } #headerDescription { width: calc(60 * 1vw); } #baseHeader { border-bottom-left-radius: 3rem; border-bottom-right-radius: 3rem; } .baseButton { font-size: var(--startButtonFontForScreen780px); } .buttonWithOrangeOutline { font-size: var(--contactButtonFontForScreen780px); } }
@media screen and (max-width: 700px) { .detailItemDescription { width: 130%; } .buttonWithOrangeOutline { width: 120%; } #headerDescriptionText, .detailItemDescription { font-size: var(--descriptionFontForScreen700px); } #thumbnailIcon { position: relative; top: -3vh; } }
@media screen and (max-width: 480px) { .detailItem { margin-bottom: calc(3.5 * 1vh); } .baseButton, .buttonWithOrangeOutline { border-radius: 0.2rem; } #baseHeader { border-bottom-left-radius: 2rem; border-bottom-right-radius: 2rem; } #headerLogoText { font-size: 15pt; } #thumbnailIcon { position: relative; top: -3vh; } }
@media screen and (max-width: 400px) { .baseButton { font-size: var(--startButtonFontForScreen400px); } .buttonWithOrangeOutline { font-size: var(--contactButtonFontForScreen400px); } .detailItem { margin-bottom: calc(3 * 1vh); } #headerDescription { width: calc(74 * 1vw); } #headerDescriptionTitle { font-size: var(--titleFontForScreen400px); } .detaileItemTitle { font-size: var(--subTitleFontForScreen400px); } #thumbnailIcon { position: relative; top: -3vh; } }
@media screen and (max-width: 280px) { .detailItemDescription { width: 155%; } .buttonWithOrangeOutline { width: 145%; } #headerLogoText { font-size: 12pt; } #thumbnailIcon { position: relative; top: -3vh; } }

/* ========= popup.css (merged) ========= */
#popupView { top: 0; right: 0; display: flex; position: fixed; align-items: center; width: calc(100 * 1vw); height: calc(100 * 1vh); justify-content: center; background-color: rgba(249, 245, 245, 0.63); }
#popupContainer { display: flex; overflow: auto; position: fixed; max-height: inherit; box-shadow: 0px 0px 6px 1px rgb(0 0 0 / 63%); -webkit-box-shadow: 0px 0px 6px 1px rgb(0 0 0 / 63%); }
#popupBody { flex: 1; display: flex; overflow: auto; max-height: inherit; flex-direction: column; background-color: transparent; }
#popupCrossButton { color: red; border: none; cursor: pointer; background: none; width: fit-content; align-self: flex-end; padding: calc(0.3 * 1vw); font-size: calc(1.2 * 1vw); }
#popupBottomSpace { padding: calc(0.3 * 1vw); }
#popupContentItem { overflow: auto; max-height: inherit; padding-right: calc(0.3 * 1vw); }
#popupHeader { display: flex; margin: 1% 0; justify-content: space-between; }
#popupTitle { display: flex; color: #6b5f59; font-weight: bold; align-items: center; justify-content: center; font-size: calc(1.4 * 1vw); width: -webkit-fill-available; }

/* ========= subdetail.css (merged) ========= */
.subDetailView { width: 50vw; display: none; padding: 1.5vh; min-height: fit-content; max-height: 90vh; border-radius: 5pt; background-color: white; }
.subDetailContainer { flex-direction: column; display: flex; justify-content: center; align-items: center; }
.subDetailTitle { font-size: calc(1.2 * 1vw); margin-bottom: calc(2 * 1vh); }
.subDetailIntro { width: 85%; text-align: justify; font-size: calc(1.1 * 1vw); }
.subDetailOverview { margin-bottom: 3%; display: flex; justify-content: space-between; }
.overviewDialogContainer { width: 70%; font-size: calc(.95 * 1vw); }
.subDetailReference { font-size: calc(.85 * 1vw); margin-left: calc(2 * 1vw); margin-top: calc(1 * 1vw); }
.profilePicture { width: calc(10 * 1vw); }
.profilePicture .profileImage { aspect-ratio: 1; width: 98%; border-radius: 6rem; background-color: white; border: calc(0.1 * 1vw) solid #b5afaf; }
.profilePicture .doubleColon { aspect-ratio: 1; position: relative; width: calc(2.5 * 1vw); top: calc(5 * 1vh); right: calc(-6.5 * 1vw); margin-top: calc(-5 * 1vh); }

@media screen and (max-width: 992px) {
	.subDetailContainer { color: #a7a8ab; margin: 3% 0 2% 0; }
	.subDetailIntro { width: 160%; font-weight: normal; font-size: var(--descriptionFontForScreen992px); }
	.subDetailTitle { font-weight: normal; font-size: var(--descriptionFontForScreen992px); }
	.subDetailOverview { align-items: center; }
	.overviewDialogContainer { width: 75%; font-weight: normal; font-size: var(--descriptionFontForScreen992px); }
	.subDetailReference { font-weight: normal; font-size: var(--descriptionFontForScreen992px); }
	.profilePicture { width: calc(16 * 1vw); margin-bottom: 10%; }
	.profilePicture .doubleColon { top: calc(2.2 * 1vh); right: calc(-11.2 * 1vw); width: calc(3 * 1vw); }
}
@media screen and (max-width: 918px) { .subDetailIntro, .subDetailTitle, .overviewDialogContainer, .subDetailReference { font-size: var(--descriptionFontForScreen918px); } }
@media screen and (max-width: 700px) { .subDetailIntro, .subDetailTitle, .overviewDialogContainer, .subDetailReference { font-size: var(--descriptionFontForScreen700px); } }