Stampa:Faqja kryesore/Hyrja/styles.css

/* Grid layout */
.mp-card-header {
	display: grid;
	font-family: 'Open Sans', Sans-serif;
	padding: 0.5rem;
}

/* Temporary animation nearing 100 000 articles mark */
.header-celebration {
	display: inline-block;
	animation: pulse 3s infinite;
}

@keyframes pulse {
	0% {
		transform: scale(1);
	}
	50% {
		transform: scale(0.8);
	}
	100% {
		transform: scale(1);
	}
}

/* Desktop size specific styles */
@media (min-width: 876px) {

	/* Further adjust header layout in desktop view */
	.mp-card-header {
		grid-template-columns: 1fr min-content;
	}

	/* Full-width column for the welcome part in header */
	.header-welcome {
		grid-column-start: 1;
		grid-column-end: -1;
		font-size: 180%;
	}
	
	/* Set font size for the intro part in header */
	.header-intro {
		font-size:120%;
	}
	
	/* Align articles' number in header to the right */
	.header-articles {
		text-align: right;
		font-size: 120%;
		white-space: nowrap;
		padding-left: 3rem;
	}
}

/* Non-desktop size specific styles */
@media (max-width: 875px) {
	
	/* Center and add space in header in mobile view */
	.mp-card-header {
		text-align: center;
		gap: 0.3rem;
	}
	
	/* Adjust font size for the welcome part in header in mobile view */
	.header-welcome {
		font-size: 150%;
	}

	/*  Adjust font size for the intro part in header in mobile view */
	.header-intro {
		font-size: 100%;
	}
	
	/* Adjust layout for the articles' number in header in mobile view */
	.header-articles {
		font-size: 90%;
		font-weight: bold;
		padding-top: 0.5rem;
	}
}