body {
	height: 100vh;
	display: grid;
	grid-template-rows: auto 1fr auto;
	text-align: center;
}

.header, .footer {
	padding: .5em;
	background-color: var(--color-main);
}

.header {
	display: grid;
    width: 100%;
    grid-template-columns: 1fr max-content 1fr;
	grid-gap: 15px;
	color: white;
}

.header-left, .header-right{
	align-content: center;
}
.header-left{
	text-align: left;
}
.header-right{
	text-align: right;
}
.header-center{
	align-content: end;
	font-size: 1.3em;
    font-weight: bold;
}

img.user-icon {
	border-radius: 100%;
}
.header .header-right img.user-icon {
    max-width: 65px;
    border-radius: 100%;
}

.main-container {
	align-content: center;
	padding: 0 15px;
	width: 100vw;
    overflow: auto;
}

.footer {
    display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	/*color: white;*/
    font-size: 2em;
}
.footer a, .footer .foo-btn {
    color: white;
	text-decoration: none;
	cursor: pointer;
}
.footer-left {
	text-align: left;
}
.footer-right {
	text-align: right;
}


#om-menu-principal {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: 100lvh;
	display: flex;
	flex-direction: column;
	background-color: white;
	padding: 1em;
}
#om-menu-principal img.user-icon {
    max-width: 65px;
}
#om-menu-principal .om-menu-principal-lignes {
    align-content: center;
	flex-grow: 1;
}
#om-menu-principal .om-menu-principal-lignes a {
    display: block;
	margin: .7em .2em;
    font-size: 1.5em;
}