@import url("https://fonts.googleapis.com/css?family=Ubuntu:wght@100;200;300;400;500;600;700;800;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap");

body {
	background-color: #1d2538;
}

/* ------------------ FLOATING CONTAINER ------------------ */
.container-top-left {
	margin-top: 23px;
	margin-left: 23px;
	display: flex;
	flex-direction: row;
	gap: 30px;
}

/* ----------------------- for back button --------------------- */
.menu-container-back-button {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	gap: 5px;
	background-color: #d4f2f4;
	padding: 0px;
	border: 1px solid #189ab4;
	border-radius: 14.3734px;
	width: 46.99px;
	max-height: 64px;
	cursor: pointer;
	font-family: "Ubuntu";
	color: #189ab4;
	font-weight: 600;
}

.menu-container-back-button:hover {
	box-shadow: 0px 4px 4px #00000040;
}

/* ----------------------------------------------- PAGE NAME ----------------------------------------------- */
.page-name-container {
	padding: 18px 50px 18px 50px;
	background: #74e7d4;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	border-radius: 5px;
	height: fit-content;
}

@media (max-width: 1000px) {
	.page-name-container {
		display: none;
	}
}

.page-name-text {
	font-family: "Ubuntu";
	font-style: normal;
	font-weight: 700;
	font-size: 24px;
	line-height: 28px;
	text-align: center;
	color: #04445f;
}

/* -------------------------------------------------- PDF -------------------------------------------------- */
.pdf-content-container {
	/* display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	margin: 73px 23px 23px 23px;
	flex-wrap: wrap;
	gap: 60px; */
	display: grid;
	grid-template-columns: repeat(6, 1fr); /* 6 columns */
	gap: 16px;
	padding: 12px 23px;
}

.overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: transparent;
	cursor: pointer;
}

.pdf-background {
	padding: 15px;
	border: 1px solid #74e7d4;
	border-radius: 5px;
	background-color: rgba(255, 255, 255, 1);
	position: relative;
}

.pdf-card {
	/* width: 334px; */
	/* height: 482px; */
	width: calc(((100vw - 16px - 46px - (16px * 5) - (32px * 6)) / 6) - 1px);
	height: calc(((100vh - 87px - 48px - 120px - 71px) / 2) - 1px);
	overflow: hidden;
	position: relative;
	background-color: white;

	transform: translateX(-50%);
	left: 50%;
}

.pdf-card object {
	position: absolute;
	transform: translate(-50%, -50%);
	top: 50%;
	left: 50%;
	/* width: 374px; */
	/* height: 486px; */
	width: calc(
		((100vw - 62px - (16px * 5) - (32px * 6) + (40px * 6)) / 6) - 1px
	);
	height: calc(((100vh - 87px - 48px - 120px - 71px + 8px) / 2) - 1px);
}

.video-title {
	margin-top: 10px;
	font-family: "Ubuntu", sans-serif;
	text-align: center;
}

/* -------------------------------------------------- PDF POP UP -------------------------------------------------- */
.container-full-screen-pdf {
	position: fixed;
	z-index: 3;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	padding: 5% 7% 5% 7%;
	-webkit-backdrop-filter: blur(5px);
	backdrop-filter: blur(5px);

	display: none;
	-webkit-user-select: none;
	user-select: none;
}

.container-full-screen-pdf.active {
	display: block;
}

.pdf-pop-up-container {
	border: 10px solid var(--secondary-color-200, #ff7582);
	height: 100%;
	width: 100%;
}

/* ---------------------------------------------- PAGE FOOTER ---------------------------------------------- */
.bottom-center {
	text-align: center;
	margin: 16px 0;
}

.text-page {
	color: #fff;
	font-size: 1.5rem;
	font-weight: 350;
	margin: 0;
}
