@media only screen and (min-width: 1024px) {
	body {
		font-size: 12px !important;
	}
	.grid-container {
		grid-template-areas: 
			'info skill skill'
			'parcour skill skill'
			'other-skill other-skill other-skill';
		grid-gap: 5px;
	}
	.card {
		width: calc(33.33vw - 3px);
	}
	.calendar-container {
		display: flex;
	}
	.calendar-container .calendar {
		margin-right: 25px;
	}
	.calendar-container .calendar:last-child {
		margin-right: 0;
	}
	.calendar div img {
		margin-top: 0;
	}
	.skill {
		width: calc(((100vw / 3) * 2) - 3px);
	}
	.other-skill {
		width: 100vw;
	}
	.other-skill-body {
		display: flex;
		flex-wrap: nowrap;
	}
	.other-skill-side {
		width: calc(50% - 10px);
		padding-left: 15px;
		border-left: 2px dotted #008B8B;
	}
	.other-skill-side:first-child {
		padding-left: 0;
		padding-right: 15px;
		border: none;
	}
	.other-skill-container {
		display: flex;
		justify-content: space-around;
		flex-wrap: nowrap;
	}
	.other-skill-container div.content-container {
		padding: 0 15px;
		width: calc(100% / 3);
		border: 1px solid #D5D6D7;
		border-top: none;
		border-bottom: none;
	}
	.other-skill-container div.content-container:first-child {
		padding-left: 0;
		border-left: none;
	}
	.other-skill-container div.content-container:last-child {
		padding-right: 0;
		border-right: none;
	}
}

@media only screen and (min-width: 1050px) {
	body {
		font-size: 13px !important;
	}
}

@media only screen and (min-width: 1080px) {
	body {
		font-size: 14px !important;
	}
}

@media only screen and (min-width: 1300px) {
	main {
		width: 1300px;
		margin-left: auto;
		margin-right: auto;
	}
	.grid-container {
		grid-gap: 10px;
	}
	.card {
		width: calc((1300px / 3) - 7px);
	}
	.skill {
		width: calc(((1300px / 3) * 2) - 3px);
	}
	.other-skill {
		width: 1300px;
	}
}