.idcard {
	display: flex;
	position: relative;
	margin: auto;
	margin-top: 2em;
	box-shadow: rgb(0 0 0 / 70%) 0 2px 7px;
	border: 2px solid rgb(255 255 255 / 30%);
	border-radius: calc(var(--id_height) / 17);

	background-size: 100%;
	background-color: #e7eeff;
	aspect-ratio: 3.375 / 2.125;
	height: 90vh;
	max-height: var(--id_height);
	overflow: hidden;

	/* font-weight: bold; */
	color: black;
	font-size: calc(var(--id_height) * 0.0425);
	line-height: 0.8em;
	text-shadow: none;
}

.idcard__tree {
	position: absolute;
	bottom: 0;
	opacity: 0.5;
	/* z-index: 2; */
	mix-blend-mode: multiply;
	width: 100%;
	height: auto;
	object-fit: cover;
}

.idcard__left {
	z-index: 20;
	width: 40%;
}

.idcard__right {
	z-index: 20;
	margin: auto 4%;
	width: 60%;
}

.idcard__location {
	mix-blend-mode: multiply;
	border-radius: 0 0 1em;
	padding: 0 0 0 0.5em;
	color: black;
	font-weight: 600;
	font-size: 3em;
	line-height: 0.5em;
	font-family: "Jim Nightshade";
}

.zone2__cardtype,
.zone2__4d {
	color: rgb(43 64 168);
}

.zone2__cardtype {
	margin: 0;
	border-radius: 0.15em;
	background-color: rgb(43 64 168);
	padding: 0.35em;
	color: white;
	font-weight: 600;
	text-align: center;
}

.zone2 {
	margin: auto;
}

.zone2 p,
.zone2 table {
	margin: 0;
	border: solid grey 1px;
	border-radius: 0.5em;
	background-color: white;
	padding: 3.5%;
	font-weight: 600;
	font-family: Montserrat;
}

p.zone2__name {
	border-radius: 0.5em 0.5em 0 0;
	font-size: 1.5em;
}

p.zone2__gender {
	border-top: none;
	border-radius: 0 0 0.5em;
	font-size: 1.5em;
}

p.zone2__gender i {
	color: rgb(100, 100, 100);
	font-style: normal;
	font-weight: 400;
}

p.zone2__dob,
p.zone2__details {
	border: none;
	border-left: solid grey 1px;
	border-radius: 0;
	background: linear-gradient(to right, hsl(0deg 0% 100%) 15%, transparent);
	background-repeat: no-repeat;
	line-height: 1.1em;
	font-family: "JetBrains Mono";
}

p.zone2__dob {
	padding-bottom: 0;
	font-weight: 600;
}

p.zone2__details {
	/* filter: brightness(0); */
	color: grey;
	font-weight: 300;
}

.idcard table,
.zone1 table {
	border-top-left-radius: 0;
	padding: 0;
	padding-left: 0.5em;
	width: 100%;
	table-layout: fixed;
	color: grey;
	font-family: "JetBrains Mono";
}

.zone2 table.zone2__expiring {
	/* border-color: rgb(43, 64, 168); */
	margin-top: 0.6em;
	margin-bottom: 0;
	border-radius: 1em;
	height: 2em;
	color: rgb(43 64 168);
	font-weight: lighter;
	font-family: Roboto;
}

.zone3 {
	margin-left: auto;
}

.zone3__image {
	display: block;
	margin-left: 2em;
	box-shadow: #000 0 0 3px;
	border-radius: 5%;
	width: 80%;
}

.profileField {
	image-rendering: pixelated;
	width: 32px;
	height: 32px;
}

.profileBio {
	margin-left: 40px;
	width: 320px;
}

.profileLexieSpeech {
	color: #dbc0ff;
	font-size: 20px;
	text-shadow:
		-1px -1px 0 #881832,
		1px -1px 0 #881832,
		-1px 1px 0 #881832,
		1px 1px 0 #881832,
		2px 3px 0 black;
}

.profileHazelSpeech {
	color: #ffd8c0;
	font-size: 20px;
	text-shadow:
		-1px -1px 0 #a02222,
		1px -1px 0 #a02222,
		-1px 1px 0 #a02222,
		1px 1px 0 #a02222,
		2px 3px 0 black;
}

.flex-wrap {
	display: flex;
	justify-content: center;
}

.flag {
	margin: auto 6px 15px;
	box-shadow: 0 4px 7px black;
	border-width: 3px;
	border-radius: 10px;
	width: 120px;
}