/* #103B5F */
:root {
	--bg-color-1: #D1C5AA;
	--bg-color-2: #BFB49B;
	--accent-color: #103B5F;
}

body {
	box-sizing: border-box;
	font-family: 'Nunito', sans-serif;
	margin: 0;
	color: var(--accent-color);
	background-color: var(--bg-color-1);
}

a {
	color: #103B5F;
	text-decoration: none;
}

i {
	color: var(--accent-color);
}

.container {
	height: 100vh;
	width: 100vw;
	display: grid;
	grid-template-columns: 25fr 35fr 40fr;
	grid-template-rows: 1fr 98fr 1fr;
	gap: 0px 0px;
	grid-template-areas:
		"left navi navi-right"
		"left content right"
		"left content right";
}

.left {
	grid-area: left;
}

.right {
	grid-area: right;
	background-color: var(--bg-color-2);
	padding-top: 10em;
	padding-left: 5em;
}

.navi {
	grid-area: navi;
}

.navi-right {
	grid-area: navi-right;
	background-color: #BFB49B;
}

.content {
	grid-area: content;
	padding-top: 10em;
}

.p1 {
	font-size: 2.0em;
	font-weight: 400;
	margin-bottom: 0.3em;
}

.p2 {
	font-size: 1.7em;
	font-weight: 300;
	margin-top: 0;
}

.p3 {
	font-size: 1.5em;
	margin-bottom: -15px;
	font-weight: 200;
}