/* .graphicsBody {
	background: linear-gradient(
		210deg,
		rgba(27, 20, 100, 1) 7.72%,
		rgba(41, 171, 226, 1) 26.52%,
		rgba(0, 113, 188, 1) 44.04%,
		rgba(6, 121, 193, 1) 79.69%,
		rgba(0, 0, 255, 1) 94.81%,
		rgba(40, 59, 153, 1) 100%
	);
} */

.graphicsHeader {
	/* display: flex;
	justify-content: space-around;
	align-content: space-around;
	gap: 3rem; */
	background: rgb(26, 26, 25);
	width: 100vw;
	height: 20vh;
}
.animations-text-container {
	/* background: linear-gradient(
		210deg,
		rgba(27, 20, 100, 1) 7.72%,
		rgba(41, 171, 226, 1) 26.52%,
		rgba(0, 113, 188, 1) 44.04%,
		rgba(6, 121, 193, 1) 79.69%,
		rgba(0, 0, 255, 1) 94.81%,
		rgba(40, 59, 153, 1) 100%
	); */
	background: rgb(26, 26, 25);

	width: 100%;
	height: 30vh;
}
.iconContainer {
	visibility: hidden;
	display: flex;
	justify-content: space-around;
	align-content: space-around;
	gap: 3rem;
	top: 15%;
	/* position: absolute; */
	width: 100%;
}
.iconContainer p {
	text-align: center;
	/* position: absolute; */
}
.graphicsLogo {
	/* display: flex; */
	/* justify-content: center; */
	/* align-items: center; */
	/* position: absolute; */
	padding: 5% 0 0 5%;
	width: 20%;

	/* height: 200px; */
	/* padding-top: 5rem; */
	/* top: 25%; */
	/* left: 40%; */
}
.mtnIcon {
	/* position: relative; */
	width: 3%;
	padding-top: 5rem;
}
.cardIcon {
	width: 5%;
}
.flyerIcon {
	width: 4%;
	padding-top: 12rem;
}

.animations-text-container {
	visibility: hidden;

	/* border: solid 2px red; */
}
.animations-text-container {
	/* padding-top: 10%; */
}
#text-ani {
	top: 10%;

	width: 100%;
	/* text-align: center; */
	/* z-index: 100; */
	display: block;
}
#text-ani > svg {
	/* top: 100px; */
	left: 50%;
	width: 100%;

	/* z-index: 100; */
	display: block;
}
#text-ani .text {
	font-family: 'Rasa', serif;
	font-size: 1rem;
	font-weight: 600;
	letter-spacing: 0.75rem;
	fill: rgb(124, 9, 201);
}

/*   =*=*=*=*=*=*= MEDIA QURIES =*=*=*=*=*=*= =============   */

/* Small devices (landscape phones, 576px and up) */

@media screen and (max-width: 576px) {
	.graphicsLogo {
		width: 50%;
	}
	.mtnIcon {
		width: 15%;
		/* margin-top: 10%; */
	}
	.cardIcon {
		width: 19%;
		margin-top: 0.75rem;
	}
	.flyerIcon {
		width: 17%;
		/* margin-top: 25%;
		margin-right: 15%; */
	}
	.animations-text-container {
		height: 40vh;
		padding-top: 35%;
	}
	#text-ani .text {
		font-size: 3.25rem;
		fill: white;
	}
}

/* Medium devices (tablets, 768px and up) */

@media screen and (max-width: 768px) {
	.iconContainer {
		top: 25%;
	}
}

/*  Large devices (desktops, 992px and up) */

@media screen and (min-width: 992px) {
}

/* Extra large devices (large desktops, 1200px and up) */

@media screen and (min-width: 1200px) {
}
