/*
Theme Name: Lejonloppet
Author: Fempunkter AB
Version: 0.0.1
*/

:root {
	/* Color */
	--surface: #3A2B1F;
	--surface-on: #F1EBDF;
	--primary: #BC531C;

	/* Font */
	--body3: 20px;
	--body2: 25px;
	--body1: 20px;
	--title3: 30px;
	--title2: 47px;
	--title: 130px;

	/* Margin, Padding, Width */
	--max-width: 1226px;
	--mt-body: 60px;
}

*, html { margin: 0; padding: 0; box-sizing: border-box; }

@font-face {
	font-family: "ElonSansBets";
	src:
		local("ElonSansBeta"),
		url("./fonts/ElonSansBeta.otf") format("opentype"),

}

body {
	//background: var(--surface);
	color: var(--surface-on);
	font-family: "Elon Sans", sans-serif;
}

main {
	margin-top: var(--mt-body);
}

img {
	width: 100%;
}


.card-order {

	:nth-child(2) {
		order: 1
	}

	:nth-child(2) {
		order: 1
	}
}


.wp-block-button {
	border-radius: 30px;
	font-weight: bold;

	&.is-style-primary a {
		background: var(--wp--preset--color--primary);
		color: var(--wp--preset--color--surface-on);
	}

	&.is-style-secondary a {
		background: var(--wp--preset--color--surface-on);
		color: var(--wp--preset--color--primary);
	}
}

.card {
	border-radius: 10px;
}


.block {
	max-width: 1226px;
	width: 100%;
	margin: 0 auto;
}

@media (max-width: 1227px) {
	.block {
		padding-inline: 30px;
	}
}

@media (max-width: 1000px) {
	.race-card .wp-block-group {
		padding: 0 !important;
	}

	.card h2 {
		font-size: var(--body2) !important;
	}
}

@media (max-width: 800px) {
	main {
		margin-top: 0;
	}

	.block {
		padding-inline: 30px;
	}

	.race-card .wp-block-group {
		padding: 16px !important;
	}

	.race-card img {
		max-height: 300px;
		max-width:  100%;
		object-fit: cover;
	}

	.card-order {

		:nth-child(1) {
			order: 2
		}

		:nth-child(2) {
			order: 1
		}
	}



}