body {
	margin: 0px;
	font-family: 'Roboto', sans-serif;
	font-weight: 400;
	/*font-weight: 300;*/
	color:#535353;
}

a {
	cursor: pointer;
	color:#535353;
}


#bg img {
	position: fixed;
	height:100%;
	min-height: 700px;
}

#bg-train img {
	position: fixed;
	height:100%;
	min-height: 700px;
}


#fg-hide-train img {
	position: fixed;
	height:100%;
	min-height: 700px;
}

#loaded-content {
	display: none;
}

#loading-page {
	position: absolute;
	top: 10%;
	left: 10%;
}

@keyframes blink {
    0% {
      opacity: .2;
    }
    20% {
      opacity: 1;
    }
    100% {
      opacity: .2;
    }
}

.Loading span {
    animation-name: blink;
    animation-duration: 1.4s;
    animation-iteration-count: infinite;
	/*This makes sure that the starting style (opacity: .2) of the animation is applied before the animation starts.*/
    animation-fill-mode: both;
}

.Loading span:nth-child(2) {
	/*Starts the animation of the second dot with a delay of .2s*/
    animation-delay: .2s;
}

.Loading span:nth-child(3) {
	/*Starts the animation of the third dot with a delay of .4s*/
    animation-delay: .4s;
}

.FontLight {
	font-weight: 300;
}

.Source {
	font-family: 'Source Serif Pro', serif;
}

.Bold {
	font-weight: 700;
}

.Underline {
	text-decoration: underline;
}

.Italic {
	font-style: italic;
}

.ColorLight {
	color:#FFFFFF;
}

.FontSizeHeader {
	font-size: 7vh;
}

.FontSizeSubHeader {
	font-size: 4vh;
}

.FontSizeTitle {
	font-size: 2.5vh;
}

.FontSizeParagraph {
	font-size: 1.5vh;
}

.FontSizeFormIntro {
	font-size: 2vh;
}

.FontSizeFormFields {
	font-size: 2vh;
}

.FontSizeSubParagraph {
	font-size: 1.7vh;
}

.FontLegend {
	font-size: 1.3vh;
}

.TextWithIcon {
	display: inline-block;
	padding-left: 10px;
}

.IconWithText {
	vertical-align: middle;
}

.CenterIcon {
	vertical-align: top !important;
}

.DatePeriod {
	border-radius: 15px 0 0 15px;
	height: 100%;
	width: 5%;
	float: left;
}

.DatePeriod p {
	padding-bottom: 16px;
	width: 100%;
	margin-top: 16%;
	margin-left: 20%;
	writing-mode: vertical-rl;
	transform: rotate(180deg);
	text-align: right;
}

.DatePeriodEnlarged {
	width: 7%;
}

.SectionTitle {
	width: auto;
	max-width: 80%;
	margin: 5%;
}

.ContentBlock {
	height: 100%;
	margin-left: 5%;
}

.ContentBlockScroll {
	height: 58%;
	overflow-y: scroll;
}

.Description {
	width: 90%;
	margin-bottom: 3%;
	margin-left: auto;
	margin-right: auto;
}

.Description li {
	list-style: disc !important; 
}

.BackGroundLight {
	background-color:#E8FCFF;
	border:solid 1px #53535373;
}

.BackGroundDark {
	background-color:#494949;
}

.BackgroundRed {
	background-color:#EA5E48;
}

.BackgroundShadeRed {
	background-color:#EC5541;
}

.BackGroundBlue {
	background-color: #5E72DD;
}

.BackgroundShadeBlue {
	background-color:#1E3DB5;
}

.BackGroundPink {
	background-color: #DD5E8E;
}

.BackGroundPetrol {
	background-color: #069F9C;
}

.BackGroundOrange {
	background-color: #EB6016;
}

.BackGroundYellow {
	background-color: #EAB827;
}

.BackGroundGreen {
	background-color: #259037;
}

.ScrollSnap {
	max-height: 60vh;
	overflow-y: scroll;
  	scroll-snap-type: y mandatory;
}

.ScrollSnapChild {
	scroll-snap-align:start;
	margin-bottom: 5%;
}

.LastScrollSnapChild {
	scroll-snap-align:start;
}

.CenterText {
	text-align: center;
	margin-top: 5%;
}

.AlignRight {
	text-align: right;
}

h1 {
	text-align: center;
	margin: 0px;
}

h2 {
	margin:0px;
	text-align: center;
}

a {
	text-decoration: none;
	color:#535353;
}

li {
	list-style:none;
}

p {
	margin: 0px;
	line-height: 1.5;
}

label {
	font-weight: 300;
}

#container {
	position: absolute;
	width: 100%;
	min-width: 1360px;
	min-height: 700px;
}

#top-nav-bar {
	position: absolute;
	width:100%;
}

#top-nav-bar p {
	position: absolute;
	top:50%;
}

#contact {
	position: absolute;
	top:40%;
	left:150px;
}

#contact-text {
	font-size: 22px;
}

#language {
	position: absolute;
	top:40%;
	right:150px;
}

select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background-color: #11ffee00;
	border-style: none;
	font-family: 'Roboto', sans-serif;
	font-weight: 300;
}

#nav-menu {
	position: relative;
	min-width:1360px;
}

#right-nav-bar {
	position: absolute;
	top:50px;
	right:50px;
	margin-bottom: 150px;
}

#right-nav-bar li {
	margin-bottom: 10%;
}

#content-container {
	position: absolute;
	top: 10%;
	bottom:10%;
	width: 100%;
	margin: 0 auto;
}

#content {
	width: 80%;
    margin-left: auto;
    margin-right: auto;
}

#scroll-content {
	overflow: scroll;
	margin-top: 4%;
	height: 65vh;
}

@keyframes bounce { 
  0% { transform: translateY(0); }
  100% { transform: translateY(-30px); }
}

#scoll-down-img {
	width: 1%;
	margin-left: 47%;
	margin-right: auto;
	animation: bounce 0.8s;
	animation-direction: alternate;
	animation-iteration-count: infinite;
}




/*Specific to left nav bar*/

.FontSizeNavBar {
	font-size: 20px;
}

#left-nav-bar {
	position: relative;
	top:125px;
	left: 35px;
	margin-bottom: 8px;
}

.LeftNavBar {
	position: absolute;
	top: 120px;
	left: 35px;
	min-height: 432px;
}

.LeftNavBar img {
	height: 50px;
}

.NavMenuIcon {
	position: relative;
	z-index: 100;
}

.NavMenuExpand {
	display: none;
	border-radius: 190px;
	height: 50px;
	margin-bottom: 4px;
}

.NavMenuExpand p {
	padding-top: 10px;
	padding-right: 20px;
	padding-left: 60px;
}

.ExternalFixedHeight {
	height: 54px;
}





/*Specific to home page*/

.HomeGridWrapper {
	display: grid;
	grid-template-columns: repeat(2, 20%) repeat(4, 15%);
  	grid-template-rows: repeat(3, 100px); 
  	grid-row-gap: 10px;
  	justify-content: center;
}

.HomeGridElemOne {
	grid-column: 2 / span 2;
  	grid-row-start: 1;
  	justify-self:center;
  	align-self: center;
}

.HomeGridElemTwo {
	grid-column: 4 / span 2;
  	grid-row-start: 1;
  	justify-self:center;
  	align-self: center;
}

.HomeGridElemThree {
	grid-column: 1 / span 2;
  	grid-row-start: 2;
  	justify-self:start;
  	align-self: center;
}

.HomeGridElemFour {
	grid-column: 3 / span 2;
  	grid-row-start: 2;
  	justify-self:start;
  	align-self: center;
}

.HomeGridElemFive {
	grid-column: 5 / span 2;
  	grid-row-start: 2;
  	justify-self:start;
  	align-self: center;
}

.HomeGridElemSix {
	grid-column: 1 / span 2;
  	grid-row-start: 3;
  	justify-self:start;
  	align-self: center;
}

.HomeGridElemSeven {
	grid-column: 3 / span 2;
  	grid-row-start: 3;
  	justify-self:start;
  	align-self: center;
}

.HomeGridElemEight {
	grid-column: 5 / span 2;
	grid-row-start: 3;
  	justify-self:start;
  	align-self: center;
}

#navigation-container {
	margin-top: 7%;
	margin-left: auto;
    margin-right: auto;
	padding:1%;
	width: 70%;
	border-radius: 15px;
	filter: drop-shadow(0px 0px 25px rgba(0, 0, 0, 0.24));
}




/*Specific to Presentation page*/

.PresGridWrapper {
	display: grid;
	grid-template-columns: repeat(2, 45%);
  	grid-template-rows: repeat(6, 15%); 
  	grid-column-gap: 3%;
  	justify-content: center;
}

.PresGridElemOne {
	grid-column: 1;
  	grid-row-start: 1;
  	justify-self:start;
  	align-self: end;
}

.PresGridElemTwo {
	grid-column: 1;
  	grid-row-start: 2;
  	justify-self:stretch;
  	align-self: start;
}

.PresGridElemThree {
	grid-column: 1;
  	grid-row-start: 3;
  	justify-self:stretch;
  	align-self: end;
}

.PresGridElemFour {
	grid-column: 1;
  	grid-row-start: 4;
  	justify-self:stretch;
  	align-self: start;
}

.PresGridElemFive {
	grid-column: 1;
  	grid-row-start: 5;
  	justify-self:stretch;
  	align-self: end;
}

.PresGridElemSix {
	grid-column: 1;
  	grid-row-start: 6;
  	justify-self:stretch;
  	align-self: start;
}

.PresGridElemSeven {
	grid-column: 2;
  	grid-row-start: 1;
  	justify-self:stretch;
  	align-self: end;
}

.PresGridElemEight {
	grid-column: 2;
  	grid-row-start: 2;
  	justify-self:stretch;
  	align-self: start;
}

.PresGridElemNine {
	grid-column: 2;
  	grid-row-start: 3;
  	justify-self:stretch;
  	align-self: end;
}

.PresGridElemTen {
	grid-column: 2;
  	grid-row-start: 4;
  	/*grid-row-end: 8;*/
  	justify-self:stretch;
  	align-self: start;
}

.PresGridElemTenBis {
	grid-column: 2;
  	grid-row-start: 5;
  	/*justify-self:stretch;*/
  	align-self: end;
}


.QuoteLeft {
	justify-self:start;
  	align-self: start;
}

.QuoteRight {
	justify-self:end;
  	align-self: end;
}

#presentation-container {
	width: 100%
}

#photo-presentation {
	display: inline-block;
	margin-top: 10%;
	margin-left: 3%;
	width: 25%;
}

#photo-presentation img {
	width: 100%;
}

#presentation-text-container {
    float: right;
	margin-top: 4%;
    margin-right: 0%;
	width: 70%;
	border-radius: 15px;
	filter: drop-shadow(0px 0px 25px rgba(0, 0, 0, 0.24));
}



/*Specific to Form page*/

.Form {
	width: 90%;
	height: 100%;
	margin-top: 4%;
	margin-left: auto;
	margin-right: auto;
}

.FormField {
	display: inline-block;
	width: 100%;
	margin-top: 1%;
	margin-bottom: 1%;
}

.FormField p {
	float: left;
	width: 20%;
}

.FormField input {
	margin-right: 0;
	width: 75%;
	padding: 1%;
}

.FormFieldMessage {
	margin-top: 3%;
}

.Form textarea {
	width: 100%;
	height: 13vh;
	min-height: 70px;
	overflow: scroll;
}

#form-button {
	width: 18%;
	margin-top: 5%;
	margin-left: 0px;
	margin-right: auto;
}

#send-button {
    background-color: #494949;
    border-radius:7px;
    padding-top: 5%;
    padding-bottom: 5%;
    padding-left: 15%;
    padding-right: 15%;
    text-decoration: none;
    cursor: pointer;
    border: none;
}

#send-button:hover {
    background:#EB600D;
}

#form-fields {
	width: 90%;
	margin-right: auto;
	margin-left: auto;
}

#form-container {
	margin-top: 4%;
	margin-right: auto;
	margin-left: auto;
	padding-top:4%;
	padding-bottom: 2%;
	padding-left: 2%;
	padding-right: 2%;
	width: 65%;
	border-radius: 15px;
	filter: drop-shadow(0px 0px 25px rgba(0, 0, 0, 0.24));
}

#form-intro p {
	text-align: center;
	margin-right: auto;
	margin-left: auto;
	width:90%;
}

/*#attachment-input {
	display:none;
	cursor: pointer;
}

#form-attachment label {
	cursor: pointer;
	font-style: italic;
}

#form-attachment {
	margin-top: 1%;
	float: right;
}*/




/*Specific to Professional Experience page*/

.ProGridWrapper {
	display: grid;
	grid-template-columns: repeat(2, 45%);
  	grid-template-rows: repeat(3, 19vh); 
  	grid-column-gap: 2%;
  	grid-row-gap: 2%;
  	justify-content: center;
}

.ProGridElemOne {
	grid-column: 1;
  	grid-row-start: 1;
  	justify-self:end;
  	align-self: end;
}

.ProGridElemTwo {
	grid-column: 2;
  	grid-row-start: 1;
  	justify-self:end;
  	align-self: end;
}

.ProGridElemThree {
	grid-column: 1;
  	grid-row-start: 2;
  	justify-self:end;
  	align-self: end;
}

.ProGridElemFour {
	grid-column: 2;
  	grid-row-start: 2;
  	justify-self:end;
  	align-self: end;
}


.ProGridElemFive {
	grid-column: 1;
  	grid-row-start: 3;
  	justify-self:end;
  	align-self: end;
}

.ProGridElemSix {
	grid-column: 2;
  	grid-row-start: 3;
  	justify-self:end;
  	align-self: end;
}

/*.ProGridElemSix {
	grid-column: 1;
  	grid-row-start: 4;
  	justify-self:end;
  	align-self: end;
}

.ProGridElemSeven {
	grid-column: 2;
  	grid-row-start: 4;
  	justify-self:end;
  	align-self: end;
}*/

.ExpBlock {
	width: 100%;
	height: 100%;
	min-height: 100px;
	display: inline-block;
	border-radius: 15px;
}

.ExpTitle {
	width: 55%;
	margin-top: 2%;
	margin-bottom: 3%;
	margin-right: 2%;
	float: right;
}

.ExpLogo {
	width: 35%;
	float: left;
	margin-top: 5vh;
	margin-bottom: auto;
	margin-left: 3%;
}

.ExpLogoDefault img {
	margin-left: 25%;
	width: auto;
	height: auto;
}

.ExpLogoCompany img {
	margin-left: 8%;
	max-height: 12vh;
	width: 80%;
	height: 10%;
}

.ProExpGridWrapper {
    width: 55%;
    float: right;
    display: grid;
    grid-template-columns: 10% 80% 5%;
    grid-template-rows: repeat(3, 33%);
    grid-row-gap: 10%;
    grid-column-gap: 3%;
}

.ProExpGridWrapper a {
    display: inline-block;
}

.ProExpElemOne {
	grid-column-start: 1;
  	grid-row-start: 1;
  	justify-self:middle;
  	align-self: middle;
}

.ProExpElemTwo {
	grid-column-start: 2;
  	grid-row-start: 1;
  	justify-self:middle;
  	align-self: end;
}

.ProExpElemThree {
	grid-column-start: 3;
  	grid-row-start: 1;
  	justify-self:middle;
  	align-self: end;
}

.ProExpElemFour {
	grid-column-start: 1;
  	grid-row-start: 2;
  	justify-self:middle;
  	align-self: middle;
}

.ProExpElemFive {
	grid-column-start: 2;
  	grid-row-start: 2;
  	justify-self:middle;
  	align-self: end;
}

.ProExpElemSix {
	grid-column-start: 3;
  	grid-row-start: 2;
  	justify-self:middle;
  	align-self: end;
}

.ProExpElemSeven {
	grid-column-start: 1;
  	grid-row-start: 3;
  	justify-self:middle;
  	align-self: middle;
}

.ProExpElemEight {
	grid-column-start: 2;
  	grid-row-start: 3;
  	justify-self:middle;
  	align-self: end;
}

.ProExpGridWrapper img {
	max-width: 2.7vh;
	width: auto;
	height: auto;
}





/*Specific to Skills page*/

.CircleBlue {
	background-color: #035A91;
}

.CircleGreen {
	background-color: #249103;
}

.CircleYellow {
	background-color: #D8CF00;
}

.CircleOrange {
	background-color: #E59600;
}

.CircleRed {
	background-color: #D83403;
}

.CircleGrey {
	background-color: #535353;
}

.Circle {
    border-radius: 50%;
    width: 1.5vh;
    height: 1.5vh;
}

.SkillGridWrapper {
	display: grid;
	grid-template-columns: repeat(3, 30%);
  	grid-template-rows: repeat(2, 50%); 
  	grid-column-gap: 2%;
  	grid-row-gap: 2%;
  	justify-content: center;
  	margin-top: 2%;
}

.SkillGridElemOne {
	width: 100%;
	height: 90%;
	border-radius: 15px;
	grid-column: 1;
  	grid-row: 1 / span 2;
  	justify-self:start;
  	align-self: start;
}

.SkillGridElemTwo {
	width: 100%;
	height: 115%;
	position: relative;
	border-radius: 15px;
	grid-column: 2;
  	grid-row-start: 1;
  	justify-self:start;
  	align-self: start;
}

.SkillGridElemThree {
	width: 100%;
	height: 85%;
	position: relative;
	border-radius: 15px;
	grid-column: 2;
  	grid-row-start: 2;
  	justify-self:start;
  	align-self: end;
}

.SkillGridElemFour {
	width: 100%;
	height: 100%;
	position: relative;
	border-radius: 15px;
	grid-column: 3;
  	grid-row-start: 1;
  	justify-self:start;
  	align-self: start;
}

.SkillGridElemFive {
	width: 100%;
	height: 100%;
	position: relative;
	border-radius: 15px;
	grid-column: 3;
  	grid-row-start: 2;
  	justify-self:start;
  	align-self: start;
}

.SkillListGridWrapper {
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	display: grid;
	grid-template-columns: 3% 97%;
  	grid-template-rows: auto auto auto auto;
  	grid-gap: 4%;
}

.SkillListGridElemOne {
	border-radius: 15px;
	grid-column: 1;
  	grid-row: 1;
}

.SkillListGridElemTwo {
	grid-column: 2;
  	grid-row: 1;
  	justify-self:start;
  	align-self: start;
}

.SkillListGridElemThree {
	border-radius: 15px;
	grid-column: 1;
  	grid-row: 3;
}

.SkillListGridElemFour {
	grid-column: 2;
  	grid-row: 3;
  	justify-self:start;
  	align-self: start;
}

.SkillListGridElemFive {
	border-radius: 15px;
	grid-column: 1;
  	grid-row: 5;
}

.SkillListGridElemSix {
	grid-column: 2;
  	grid-row: 5;
  	justify-self:start;
  	align-self: start;
}

.SkillListGridElemSeven {
	border-radius: 15px;
	grid-column: 1;
  	grid-row: 7;
}

.SkillListGridElemEight {
	grid-column: 2;
  	grid-row: 7;
  	justify-self:start;
  	align-self: start;
}

.SkillContextImage {
	position: absolute;
	float: right;
	top: 5%;
	right: 5%;
}

#skill-level-legend {
	width: 100%;
	margin-top: 4%;
	margin-left: 10%;
	display: inline-block;
}

#skill-level-legend div {
	display: inline-block;
}

#skill-level-legend p {
	margin-right: 3%;
}

#icon-computer {
	position: relative;
	float: right;
	top: -25%;
	right: 5%;
}


/*Specific to Blur Overlay and Overlay Window*/

#overlay {
	display: none;
	position: fixed;
	height:100%;
	width: 100%;
}


.Blur {
	-webkit-backdrop-filter: blur(5px);
	backdrop-filter: blur(5px);
	position: fixed;
	height:100%;
	width: 100%;
}

.OverlayWindow {
	border-radius: 15px;
	position: absolute;
	width: auto;
	height: auto;
	/*min-height: 30vh;*/
	min-width: 30vh;
	max-width: 50vh;
	margin-right: auto;
	margin-left: 30%;
	margin-top: 15%;
	padding: 1%;
	filter: drop-shadow(0px 0px 25px rgba(0, 0, 0, 0.24));
}

.SectionContent {
	padding-top:2%;
	padding-bottom: 2%;
}

.SectionContent ul {
	margin-top:2%; 
	padding-left:8%;
}

.SectionContent li {
	list-style: disc !important; 
}

.Close {
	position: relative;
	z-index: 100;
	float: right;
}

.SectionQuoteLeft {
	position: absolute;
	top: 10%;
	z-index: 0;
}

.SectionQuoteRight {
	position: absolute;
	right: 5%;
	bottom: 10%;
	z-index: 0;
}




/*Specific to Achievements page*/

.AchieveGridWrapper {
	display: grid;
	grid-template-columns: repeat(2, 48%) ;
  	grid-template-rows: 60vh; 
  	grid-gap: 2%;
}

.AchieveGridElemOne {
	border-radius: 15px;
	width: 100%;
	height: 100%;
	grid-column: 1;
	grid-row:1;
  	justify-self:center;
  	align-self: center;
}

.AchieveGridElemTwo {
	border-radius: 15px;
	width: 100%;
	height: 100%;
	grid-column: 2;
	grid-row:1;
  	justify-self:center;
  	align-self: center;
}

.DescriptionBlock {
	border-radius: 15px;
	margin-top: 10%;
	width: 80%;
	height:40%; 
	max-height: 20vh;
	margin-right: auto;
	margin-left: auto;
	border:1px solid rgba(83, 83, 83, 0.5);
	padding:2%;
	overflow: scroll;
}

.DescriptionBlock li {
	list-style: disc !important;
}

.LinkedContentGridWrapper {
	display: grid;
	grid-template-columns: 15% 80%;
  	grid-template-rows: repeat(2, 50%); 
  	grid-column-gap: 2%;
  	grid-row-gap: 10%;
	margin-top: 5%;
	width: 80%;
	margin-right: auto;
	margin-left: auto;
}

.LinkedContentGridElemOne {
	grid-column: 1;
	grid-row: 1;
  	align-self: start;
}

.LinkedContentGridElemTwo {
	grid-column: 2;
	grid-row: 1;
  	align-self: start;
}

.LinkedContentGridElemThree {
	grid-column: 1;
	grid-row: 2;
  	align-self: start;
}

.LinkedContentGridElemFour {
	grid-column: 2;
	grid-row: 2;
  	align-self: start;
}

.LinkedContentTitle {
	border-radius: 5px;
	width: 100%;
	float: left;
	text-align: center;
}


/*Specific to Experiences personnelles page*/

.PersGridWrapper {
	margin-top: 3%;
	display: grid;
	grid-template-columns: repeat(2, 45%);
  	grid-template-rows: repeat(2, 50%);
  	grid-gap: 2%;
}

.PersGridElemOne {
	position: relative;
	border-radius: 15px;
	width: 100%;
	height: 100%;
	grid-column: 1;
	grid-row:1;
  	justify-self:center;
  	align-self: center;
}

.PersGridElemTwo {
	position: relative;
	border-radius: 15px;
	width: 100%;
	height: 100%;
	grid-column: 2;
	grid-row:1;
  	justify-self:center;
  	align-self: center;
}

.PersGridElemThree {
	position: relative;
	border-radius: 15px;
	width: 100%;
	height: 100%;
	grid-column: 1;
	grid-row:2;
  	justify-self:center;
  	align-self: center;
}

.PersGridElemFour {
	position: relative;
	border-radius: 15px;
	width: 100%;
	height: 100%;
	grid-column: 2;
	grid-row:2;
  	justify-self:center;
  	align-self: center;
}

.SectionBackgroundImage {
	position: absolute;
	float: right;
	bottom: 10%;
	right: 5%;
}


/*Specific to Education page*/

.EducGridWrapper {
	display: grid;
	grid-template-columns: repeat(2, 48%);
  	grid-template-rows: repeat(2, 29vh);
  	grid-gap: 2%;
}

.EducGridElemOne {
	border-radius: 15px;
	width: 100%;
	height: 100%;
	grid-column: 1;
	grid-row:1;
  	justify-self:center;
  	align-self: center;
}

.EducGridElemTwo {
	border-radius: 15px;
	width: 100%;
	height: 100%;
	grid-column: 2;
	grid-row:1;
  	justify-self:center;
  	align-self: center;
}

.EducGridElemThree {
	border-radius: 15px;
	width: 100%;
	height: 100%;
	grid-column: 1;
	grid-row:2;
  	justify-self:center;
  	align-self: center;
}

.EducGridElemFour {
	border-radius: 15px;
	width: 100%;
	height: 100%;
	grid-column: 2;
	grid-row:2;
  	justify-self:center;
  	align-self: center;
}

.DescriptionContainer {
	position: relative;
	margin-top: 5%;
	display: grid;
	grid-template-columns: repeat(2, 49%);
	grid-gap: 2%;
  	margin-left: 5%;
}

.DescriptionContainerElemOne {
	grid-column:1;
  	justify-self:top;
  	align-self: top;
}

.DescriptionContainerElemOne div {
	width: 75%;
}

.DescriptionContainerElemOneSpan {
	grid-column:1 / span 2;
  	justify-self:top;
  	align-self: top;
}

.DescriptionContainerElemTwo {
	grid-column: 2;
  	justify-self:top;
  	align-self: center;
}

.DescriptionContainerElemTwo div {
	width: 75%;
}

.DescriptionExpand a {
	display: inline-block;
	margin-right: 5%;
}



/*Specific to Temoignages page*/

.TemoignagesGridWrapper {
	display: grid;
	grid-template-columns: repeat(2, 48%);
  	grid-template-rows: repeat(2, 29vh);
  	grid-gap: 2%;
}

.TemoignagesGridElemOne {
	position: relative;
	border-radius: 15px;
	width: 100%;
	height: 100%;
	grid-column: 1;
	grid-row:1;
  	justify-self:center;
  	align-self: center;
}

.TemoignagesGridElemTwo {
	position: relative;
	border-radius: 15px;
	width: 100%;
	height: 100%;
	grid-column: 2;
	grid-row:1;
  	justify-self:center;
  	align-self: center;
}

.TemoignagesGridElemThree {
	position: relative;
	border-radius: 15px;
	width: 100%;
	height: 100%;
	grid-column: 1;
	grid-row:2;
  	justify-self:center;
  	align-self: center;
}

.TemoignagesGridElemFour {
	position: relative;
	border-radius: 15px;
	width: 100%;
	height: 100%;
	grid-column: 2;
	grid-row:2;
  	justify-self:center;
  	align-self: center;
}

.Temoignage {
	width: 95%;
	max-height: 10.5vh;
	margin-right: auto;
	margin-left: auto;
	overflow: scroll;
}

.TemoignageReference {
	float: right;
	position: absolute;
	bottom: 8%;
	right: 5%;
	z-index: 100;
}