:root {
	--umk-red: #c4262e;
	--umk-lightblue: #0073b8;
	--umk-blue: #00498a;
	--umk-green: #00673b;
	--umk-lightgreen: #00914c;
	--umk-magenta: #a0065b;
	--umk-purple: #942c8b;
	--umk-orange: #f4592c;
	--umk-gray: #4d4d4d;

	--umk-content-theme-color: var(--umk-blue);
	--umk-content-banner-color: #fff;

	--bs-body-font-family: "Lato-Regular";
	--bs-body-bg: #dee9ee;
	--bs-body-color: #004492;

	--bs-link-color-rgb: "rgb(153, 170, 187)"
}

body {
	width: 100vw;
	min-height: 100vh;
	word-wrap: break-word;
	overflow-x: hidden;
	display: flex;
	flex-direction: column;
}

main {
	flex-grow: 1;
	background: #fff;
}

@font-face {
  font-family: 'UMKOnboard';
  src:  url('fonts/UMKOnboard.eot?rcirfw');
  src:  url('fonts/UMKOnboard.eot?rcirfw#iefix') format('embedded-opentype'),
    url('fonts/UMKOnboard.ttf?rcirfw') format('truetype'),
    url('fonts/UMKOnboard.woff?rcirfw') format('woff'),
    url('fonts/UMKOnboard.svg?rcirfw#UMKOnboard') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

.icon-xl {
	font-size: 3em !important;
}

.icon-lg {
	font-size: 2em !important;
}

.icon {
	/* use !important to prevent issues with browser extensions that change fonts */
	font-family: 'UMKOnboard' !important;
	speak: never;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1.2;

	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.umk-support:before {
  content: "\e90b";
}
.umk-empty:before {
  content: "\e90a";
}
.umk-arrow:before {
  content: "\e909";
}
.umk-legal_matters:before {
  content: "\e900";
}
.umk-student_affairs:before {
  content: "\e901";
}
.umk-before_you_arrive:before {
  content: "\e902";
}
.umk-savoir_vivre:before {
  content: "\e903";
}
.umk-erasmus:before {
  content: "\e905";
}
.umk-hr_office:before {
  content: "\e906";
}
.umk-doctoral_schools:before {
  content: "\e907";
}
.umk-during_your_stay:before {
  content: "\e908";
}

body[data-mobile-view="false"] {
	.tile {
		background-color: var(--umk-blue);
	}
}

.tile {
	height: auto;
	aspect-ratio: 4/3 auto;
	color: #fff;
	background-color: var(--umk-content-theme-color);
	-webkit-clip-path: polygon(100% 0, 100% 80%, 80% 100%, 0 100%, 0 0);
	clip-path: polygon(100% 0, 100% 80%, 80% 100%, 0 100%, 0 0);
}
.tile-icon > i {
	font-size: 2rem;
}
.tile-title {
	font-size: 1.2rem;
}
.tile > .tile-title {
	text-transform: uppercase;
	a {
		text-decoration: none !important;
		color: inherit;
	}
	a:hover {
		color: inherit;
	}
}

.umk-textbg-red {
	background-color: var(--umk-red) !important;
	color: #fff !important;
}

.umk-textbg-lightblue {
	background-color: var(--umk-lightblue) !important;
	color: #fff !important;
}

.umk-textbg-green {
	background-color: var(--umk-green) !important;
	color: #fff !important;
}
.umk-textbg-blue {
	background-color: var(--umk-blue) !important;
	color: #fff !important;
}
.umk-textbg-purple {
	background-color: var(--umk-purple) !important;
	color: #fff !important;
}
.umk-textbg-orange {
	background-color: var(--umk-orange) !important;
	color: #fff !important;
}
.umk-textbg-magenta {
	background-color: var(--umk-magenta) !important;
	color: #fff !important;
}
.umk-textbg-lightgreen {
	background-color: var(--umk-lightgreen) !important;
	color: #fff !important;
}
.umk-textbg-gray {
	background-color: var(--umk-gray) !important;
	color: #fff !important;
}

.content-banner {
	background: var(--umk-content-theme-color);
	color: var(--umk-content-banner-color);
}

body[data-mobile-view="true"] {
	main {
		.h1, .h2, h1, h2 {
			text-transform: uppercase;
			color: var(--umk-content-theme-color);
			font-weight: bold;
		}

		.h3, h3 {
			border-bottom: 2px solid var(--umk-content-theme-color);
			padding-bottom: .5rem;
			margin-bottom: 1rem;
		}
	}
}
#onBoardTiles {
	gap: .5rem !important;
}
#onBoardTiles > * {
	flex: 0 0 auto;
	width: calc(100% - 0.5rem);
	height: auto;
	aspect-ratio: 1;
	@media (min-width: 320px) {
		width: calc(50% - 0.5rem);
	}
	@media (min-width: 500px) {
		width: calc(33.3% - 0.5rem);
	}
	@media (min-width: 768px) {
		width: calc(25% - 0.5rem);
	}
	@media (min-width: 992px) {
		width: calc(20% - 0.5rem);
	}
}

#onBoardTiles .tile-icon > i {
	font-size: 3rem;
	@media (min-width: 320px) {
		font-size: 3rem;
	}
	@media (min-width: 576px) {
	}
	@media (min-width: 768px) {
	}
	@media (min-width: 992px) {
	}
}

#onBoardTiles .tile-title {
	font-size: 1.5rem;
	@media (min-width: 320px) {
		font-size: 1.2rem;
	}
	@media (min-width: 576px) {
	}
	@media (min-width: 768px) {
	}
	@media (min-width: 992px) {
	}
}

.sponsors-banner {
	background-color: #fff;
	color: #111111;
}

.list-arrows {
	a {
		text-decoration: none;
		text-transform: uppercase;
		font-size: 1.2em;
	}
	li {
		padding-left: .5rem !important;
		margin: initial!important;
		vertical-align: middle;
		display: list-item !important;
		background: unset !important;
	}
	li::marker {
		/* use !important to prevent issues with browser extensions that change fonts */
		font-family: 'UMKOnboard' !important;
		speak: never;
		font-style: normal;
		font-weight: normal;
		font-variant: normal;
		text-transform: none;
		line-height: 1.2;

		/* Better Font Rendering =========== */
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;

		content: '\e909';
		font-size: 1.2em;
		color: var(--umk-content-theme-color)
	}
}
body[data-mobile-view="false"] .list-arrows li::marker {
	color: var(--umk-blue) !important;
}