@font-face {
  font-family: 'gothamr';
  src: url('font/Luciole-Regular.woff2') format('woff2'),
       url('font/Luciole-Regular.woff') format('woff'),
       url('font/Luciole-Regular.otf') format('opentype');
  font-weight: normal;
  font-style: normal;
}

*
{
	font-family: 'gothamr', fallback, sans-serif;
}

#mainnav a {
  position: relative;
  color: #000;
  text-decoration: none;
  font-size: 24px;
  display: inline-block;
  overflow: hidden;
  transition: color 0.3s;
}

#mainnav a:hover {
  color: #777;
}

#mainnav a::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 2px;
  bottom: 0;
  left: 0;
  background-color: #FFF;
  visibility: hidden;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s;
}

#mainnav a:hover::before {
  visibility: visible;
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}

#writer {
    border-right: 2px solid;
    width: fit-content;
    white-space: pre;
    overflow: hidden;
    animation: cursor 1s infinite;
	min-height: 2em;
}

@keyframes cursor {
    50% {
        border-color: transparent;
    }
}

.glisse {
  transform: translateX(-50px);
  opacity: 0;
  transition: transform 0.2s, opacity 0.2s;
}

.glisse.active {
  transform: translateX(0);
  opacity: 1;
}

#cursor {
  width: 50px; /* adjust as needed */
  height: 50px; /* adjust as needed */
  position: fixed;
  background: none;
  border: 1px dashed #50C878;
  border-radius: 50%;
  pointer-events: none;
  transform: translate(-50%, -50%); /* this centers the cursor */
  transition: all 0.2s ease;
  z-index: 10000;
  animation: rotate 2s linear infinite; /* here we add the rotation animation */
}

#cursor .dot {
  width: 6px;
  height: 6px;
  background: #FFCC66;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

@keyframes rotate {
  from {
	transform: translate(-50%, -50%) rotate(0deg);
  }

  to {
	transform: translate(-50%, -50%) rotate(360deg);
  }
}
.hamburger {
    display: none;
    cursor: pointer;
    font-size: 4em;
    color: #FFF;
	text-align:center;
}

.rslogo
{
	width:15%;
}

.rslogo,
.footcopyright
{
	display:inline-block;
}

.rslogo .rselem
{
	width:50px;
	height:auto;
	display:inline-block;
}

footer#page-footer.py-3.py-lg-5.mt-md-5
{
	width:100%;
	height:auto;
	margin:0 auto;
	margin-top:0rem !important;
	background-color: #224269 !important;
	padding-left:5%;
	padding-right:5%;
}

footer#page-footer.py-3.py-lg-5.mt-md-5 svg
{
	fill:white;
}

footer#page-footer.py-3.py-lg-5.mt-md-5 .rselem
{
	margin:0 2%;
}

body.path-node div.d-flex header
{
	position:relative;
	background: #1f4068;
}

.linkfoot a
{
	color:white;
}

	#offres .view-expertise .views-row 
	{
	  width: 100%;
	  height: auto;
	  display: inline-block;
	  position: relative;
	  padding:5px;
	}
	
	#offres .view-expertise .views-row .views-field-title
	{
		font-size:3em;
		text-transform:uppercase;
		border: 1px solid #5074a6;
		border-radius: 15px;
		width: 69%;
		height: auto;
		margin: 0 auto;
		margin-bottom: 0px;
		margin-bottom: 3px;
	}
	
	#offres .view-expertise .views-row .views-field-title:hover
	{
		background:#5074a6;
		color:white;
		cursor : pointer;
	}
	
	#offres .view-expertise .views-row p
	{
		font-size:1.2em;
	}
	
.view-expertise .item-list ul {
  list-style-type: none; /* Cela retire les points uniquement pour les listes dans votre vue d'expertise */
}

.item-list {
    max-width: 600px; /* Ou toute autre largeur appropriée */
    margin-left: auto;
    margin-right: auto; /* Centre la liste si la largeur de la page est plus large */
}


.item-list ul {
    list-style-type: none; /* Retire les puces */
    padding: 0; /* Retire tout padding par défaut pour aligner proprement les éléments à gauche */
}

.item-list ul li {
    position: relative; /* Positionne le pseudo-élément par rapport à cet élément */
    display: block; /* Assure que chaque élément li s'affiche sur sa propre ligne */
    margin-bottom: 5px; /* Espacement entre les éléments de la liste */
    padding-left: 0; /* Assure que le texte est aligné à gauche */
}

.item-list ul li:before {
    content: ''; /* Nécessaire pour générer le pseudo-élément */
    position: absolute;
    bottom: 0; /* Positionne le trait au bas de l'élément */
    left: 0; /* Démarre à gauche de l'élément li */
    width: 0; /* Commence avec une largeur de 0 pour être invisible initialement */
    height: 2px; /* Épaisseur du trait */
    background-color: #000; /* Couleur du trait */
    transition: width 0.3s ease; /* Transition douce pour l'animation du trait */
}

.item-list ul li:hover:before {
    width: 100%; /* Étend le trait sur toute la largeur du texte */
}




/* PHONE MOBILE */
@media screen and (max-width:480px)
{
	#mainnav 
	{
		display: none;
	}
	body, html 
	{
		height: 100%;
		margin: 0;
		font: 400 15px/1.8 "Lato", sans-serif;
		color: #777;
	}
	
	body
	{
		margin: 0;
		overflow-y: scroll; /* Enable vertical scrolling */
		scroll-snap-type: y mandatory; /* y axis, mandatory snap */
		height: 100vh;
		width: 100%;
	}
	
	header 
	{
		position: relative;
		width: 100%;
		color: white;
		z-index: 100;
		scroll-snap-align: start;
		background: #1f4068;
	}
	
	#logo
	{
		position:relative;
		z-index:100;
		width:69%;
		height:auto;
		display:inline-block;
		vertical-align:middle;
	}
	
	#logo svg
	{
		width:100%;
		height:auto;
		margin-left:5%;
	}
	
	#logo svg path
	{
		fill: #FFF;
		stroke:black;
		stroke-width:3;
	}
	
	.hamburger
	{
		display:inline-block;
		width:100%;
		height:auto;
	}

	nav#mainnav
	{
		width:100%;
		height:auto;
		margin:0 auto;
		position:relative;
		z-index:100;
		margin-top:2%;
		float:right;
	}

	nav#mainnav ul
	{
		width:100%;
		height:auto;
		margin:0 auto;
		display: flex;
		flex-direction: row;
	}

	nav#mainnav ul li
	{
		margin-right:2%;
	}

	nav#mainnav ul li a
	{
		color:white;
		font-weight:700;
	}
	
	.section 
	{
		scroll-snap-align: start; /* Align to the top of the parent container */
		/* height: 100vh; */
		width: 100%;
		/* display: flex; */
		align-items: center;
		justify-content: center;
		font-size: 3em;
    }
	
	#offres.section
	{
		scroll-snap-align: start; /* Align to the top of the parent container */
		min-height: 100vh;
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 1em;
		text-align:center;
		padding:2em 0;
		height:auto;
    }
	
#offres.section {
    font-family: 'Roboto', sans-serif;
    background-color: #f9f9f9;
    color: #333;
    padding: 50px 0;
}



@keyframes rings {
    0% { transform: rotate(45deg); }
    100% { transform: rotate(405deg); }
}

#offres.section .modal-title {
    font-size: 3em;
    font-weight: bold;
    z-index: 1;
    position: relative;
    animation: glow 2s infinite alternate;
}

@keyframes glow {
    0% { text-shadow: 0 0 5px #4460a0, 0 0 10px #4460a0, 0 0 15px #4460a0, 0 0 20px #1f4068; }
    100% { text-shadow: 0 0 10px #4460a0, 0 0 20px #4460a0, 0 0 30px #4460a0, 0 0 40px #1f4068; }
}

#offres.section .modal-body {
    font-size: 1.5em;
    margin: 20px 0;
}

#offres.section .modal-footer {
    border: none;
}

#offres.section .btn-close {
    color: #ffffff;
}

#offres.section .btn-secondary {
    background: #1f4068;
    border: none;
    color: #ffffff;
    font-size: 1.2em;
    transition: background 0.5s;
}

#offres.section .btn-secondary:hover {
    background: #4460a0;
}




#offres.section .modal-title {
    font-size: 24px;
    color: #333;
}

#offres.section .modal-footer .btn {
    background-color: #888;
    border-color: #888;
    color: white;
    transition: all 0.3s ease;
}

#offres.section .modal-footer .btn:hover {
    background-color: #666;
    border-color: #666;
}




	
	.section:nth-child(odd) 
	{
      background-color: #5074A6;
      color: white;
    }

    .section:nth-child(even) 
	{
      background-color: #fff;
      color: #333;
    }
	
	#conteneurUne
	{
		position: relative;
		width: 100%;
		height: 40vh;
		z-index: -100;
		scroll-snap-align: start;
		background-image: url('bg-min.png');
		background-color:#1f4068;
	}
	
	#conteneurUne .unewrap
	{
		position: relative;
		padding-left:3%;
		font-size:0.8em;
		font-weight:900;
		z-index:10;
	}
	
	#conteneurUne .unetxt
	{
		font-size:0.8em;
	}
	
	#conteneurUne .imgunewrap
	{
		width:100%;
		height:auto;
		position: absolute;
		right: 12%;
		transform: rotate(-30deg);
		top: 42%;
		z-index: 1;
	}
	
	#conteneurUne .logoune
	{
		width: 43%;
		height: 70%;
		position: absolute;
		right: 19%;
	}
	
	#conteneurUne .logoune svg
	{
		width: 100%;
		height: 100%;
	}
	
	#conteneurUne .logoune svg path
	{
		fill:#ADD8E6;
		fill-opacity:0.05;
	}
	
	#conteneurUne .imgunewrap img
	{
		width:31%;
		height:auto;
	}
	
	#frontelem
	{
		scroll-snap-type: y mandatory;
	}
	
	#frontelem section
	{
		scroll-snap-align: start;
		/* height: 100vh; */
		width: 100%;
		/* display: flex; */
		align-items: center;
		justify-content: center;
		font-size: 3em;
		border-bottom:1px solid black;
	}
	
	#frontelem #about
	{
		scroll-snap-align: start;
		/* height: 100vh; */
		width: 100%;
		/* display: flex; */
		align-items: center;
		justify-content: center;
		font-size: 2.5em;
		border-bottom:1px solid black;
	}
	
	#frontelem section .aboutelem:nth-child(1),
	#frontelem section .aboutbiselem:nth-child(2)
	{
		border-right:1px solid black;
		padding:5%;
		background:white;
		color:black;
	}
	
	#frontelem #about .aboutelem .headabout,
	#frontelem #about .aboutelem .view-intro .views-field-title,
	#frontelem #contact .contactelem h3
	{
		font-family: 'gothamr', fallback, sans-serif;
	}
	
	#frontelem #about .aboutelem .footabout,
	#frontelem #about .aboutelem .view-intro .views-field-body
	{
		font-size:0.69em;
	}
	
	#frontelem #about .aboutelem:nth-child(2),
	#frontelem #about .aboutbiselem:nth-child(1)
	{
		background: #5074A6;
	}
	
	#frontelem #about .aboutelem svg
	{
		width:100%;
		height:100%;
		padding:31%;
	}
	
	#frontelem #about .aboutelem svg path
	{
		fill : #FFF;
	}
	
	section#contact.section
	{
		height:auto;
		padding:5%;
	}
	
	section#contact.section #webform-submission-contact-add-form,
	section#contact.section #webform-submission-contact-add-form .js-form-item
	{
		font-size:1rem;
	}
	
	section#contact.section
	{
		background-image: url('bg-min.png');
	}
	
	section#contact.section .contactelem
	{
		background:rgba(255,255,255,0.8);
	}
	
	#offres .view-expertise .views-row .views-field-title
	{
		font-size:2em;
	}
}

/* TABLETTE */
@media screen and (min-width:481px) and (max-width:960px)
{
#mainnav {
    display: none;
}
	
	body, html 
	{
		height: 100%;
		margin: 0;
		font: 400 15px/1.8 "Lato", sans-serif;
		color: #777;
	}
	
	body
	{
		margin: 0;
		overflow-y: scroll; /* Enable vertical scrolling */
		scroll-snap-type: y mandatory; /* y axis, mandatory snap */
		height: 100vh;
		width: 100%;
	}
	
	header 
	{
		position: relative;
		width: 100%;
		color: white;
		z-index: 100;
		scroll-snap-align: start;
		background: #1f4068;
	}
	
	#logo
	{
		position:relative;
		z-index:100;
		width:69%;
		height:auto;
		display:inline-block;
		vertical-align:middle;
	}
	
	#logo svg
	{
		width:100%;
		height:auto;
		margin-left:5%;
	}
	
	#logo svg path
	{
		fill: #FFF;
		stroke:black;
		stroke-width:3;
	}
	
	.hamburger
	{
		display:inline-block;
		width:30%;
		height:auto;
	}

	nav#mainnav
	{
		width:100%;
		height:auto;
		margin:0 auto;
		position:relative;
		z-index:100;
		margin-top:2%;
		float:right;
	}

	nav#mainnav ul
	{
		width:100%;
		height:auto;
		margin:0 auto;
		display: flex;
		flex-direction: row;
	}

	nav#mainnav ul li
	{
		margin-right:2%;
	}

	nav#mainnav ul li a
	{
		color:white;
		font-weight:700;
	}
	
	.section 
	{
		scroll-snap-align: start; /* Align to the top of the parent container */
		/* height: 100vh; */
		width: 100%;
		/* display: flex; */
		align-items: center;
		justify-content: center;
		font-size: 3em;
    }
	
	#offres.section
	{
		scroll-snap-align: start; /* Align to the top of the parent container */
		min-height: 100vh;
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 1em;
		text-align:center;
		padding:2em 0;
		height:auto;
    }
	
#offres.section {
    font-family: 'Roboto', sans-serif;
    background-color: #f9f9f9;
    color: #333;
    padding: 50px 0;
}



@keyframes rings {
    0% { transform: rotate(45deg); }
    100% { transform: rotate(405deg); }
}

#offres.section .modal-title {
    font-size: 3em;
    font-weight: bold;
    z-index: 1;
    position: relative;
    animation: glow 2s infinite alternate;
}

@keyframes glow {
    0% { text-shadow: 0 0 5px #4460a0, 0 0 10px #4460a0, 0 0 15px #4460a0, 0 0 20px #1f4068; }
    100% { text-shadow: 0 0 10px #4460a0, 0 0 20px #4460a0, 0 0 30px #4460a0, 0 0 40px #1f4068; }
}

#offres.section .modal-body {
    font-size: 1.5em;
    margin: 20px 0;
}

#offres.section .modal-footer {
    border: none;
}

#offres.section .btn-close {
    color: #ffffff;
}

#offres.section .btn-secondary {
    background: #1f4068;
    border: none;
    color: #ffffff;
    font-size: 1.2em;
    transition: background 0.5s;
}

#offres.section .btn-secondary:hover {
    background: #4460a0;
}




#offres.section .modal-title {
    font-size: 24px;
    color: #333;
}

#offres.section .modal-footer .btn {
    background-color: #888;
    border-color: #888;
    color: white;
    transition: all 0.3s ease;
}

#offres.section .modal-footer .btn:hover {
    background-color: #666;
    border-color: #666;
}




	
	.section:nth-child(odd) 
	{
      background-color: #5074A6;
      color: white;
    }

    .section:nth-child(even) 
	{
      background-color: #fff;
      color: #333;
    }
	
	#conteneurUne
	{
		position: relative;
		width: 100%;
		height: 100vh;
		z-index: -100;
		scroll-snap-align: start;
		background-image: url('bg-min.png');
		background-color:#1f4068;
	}
	
	#conteneurUne .unewrap
	{
		position: relative;
		padding-left:3%;
		top:34%;
		font-size:1em;
		font-weight:900;
		z-index:10;
	}
	
	#conteneurUne .imgunewrap
	{
		width:60%;
		height:auto;
		position: absolute;
		right: 12%;
		transform: rotate(-30deg);
		top: 42%;
		z-index: 1;
	}
	
	#conteneurUne .logoune
	{
		width: 43%;
		height: 70%;
		position: absolute;
		right: 19%;
	}
	
	#conteneurUne .logoune svg
	{
		width: 100%;
		height: 100%;
	}
	
	#conteneurUne .logoune svg path
	{
		fill:#ADD8E6;
		fill-opacity:0.05;
	}
	
	#conteneurUne .imgunewrap img
	{
		width:31%;
		height:auto;
	}
	
	#frontelem
	{
		scroll-snap-type: y mandatory;
	}
	
	#frontelem section
	{
		scroll-snap-align: start;
		/* height: 100vh; */
		width: 100%;
		/* display: flex; */
		align-items: center;
		justify-content: center;
		font-size: 3em;
		border-bottom:1px solid black;
	}
	
	#frontelem #about
	{
		scroll-snap-align: start;
		/* height: 100vh; */
		width: 100%;
		/* display: flex; */
		align-items: center;
		justify-content: center;
		font-size: 2.5em;
		border-bottom:1px solid black;
	}
	
	#frontelem section .aboutelem:nth-child(1),
	#frontelem section .aboutbiselem:nth-child(2)
	{
		border-right:1px solid black;
		padding:5%;
		background:white;
		color:black;
	}
	
	#frontelem #about .aboutelem .headabout,
	#frontelem #about .aboutelem .view-intro .views-field-title,
	#frontelem #contact .contactelem h3
	{
		font-family: 'gothamr', fallback, sans-serif;
	}
		
	#frontelem #about .aboutelem .footabout,
	#frontelem #about .aboutelem .view-intro .views-field-body
	{
		font-size:0.69em;
	}
	
	#frontelem #about .aboutelem:nth-child(2),
	#frontelem #about .aboutbiselem:nth-child(1)
	{
		background: #5074A6;
	}
	
	#frontelem #about .aboutelem svg
	{
		width:100%;
		height:100%;
		padding:31%;
	}
	
	#frontelem #about .aboutelem svg path
	{
		fill : #FFF;
	}
		
	section#contact.section
	{
		height:auto;
		padding:5%;
	}
	
	section#contact.section #webform-submission-contact-add-form,
	section#contact.section #webform-submission-contact-add-form .js-form-item
	{
		font-size:1rem;
	}
	
	section#contact.section
	{
		background-image: url('bg-min.png');
	}
	
	section#contact.section .contactelem
	{
		background:rgba(255,255,255,0.8);
	}



}

/* PC ORDI */
@media screen and (min-width:961px)
{
	
	body, html 
	{
		height: 100%;
		margin: 0;
		font: 400 15px/1.8 "Lato", sans-serif;
		color: #777;
	}
	
	body
	{
		margin: 0;
		overflow-y: scroll; /* Enable vertical scrolling */
		scroll-snap-type: y mandatory; /* y axis, mandatory snap */
		height: 100vh;
		width: 100%;
	}
	
	header 
	{
		position: absolute;
		width: 100%;
		background-color: transparent;
		color: white;
		z-index: 100;
		scroll-snap-align: start;
	}
	
	#logo
	{
		position:relative;
		z-index:100;
		width:20%;
		height:auto;
		display:inline-block;
	}
	
	#logo svg
	{
		width:68%;
		height:auto;
		margin-left:5%;
	}
	
	#logo svg path
	{
		fill: #FFF;
		stroke:black;
		stroke-width:3;
	}

	nav#mainnav
	{
		width:68%;
		height:auto;
		margin:0 auto;
		position:relative;
		z-index:100;
		margin-top:2%;
		float:right;
	}

	nav#mainnav ul
	{
		width:69%;
		height:auto;
		margin:0 auto;
		display: flex;
		flex-direction: row;
	}

	nav#mainnav ul li
	{
		margin-right:2%;
	}

	nav#mainnav ul li a
	{
		color:white;
		font-weight:700;
	}
	
	.section 
	{
		scroll-snap-align: start; /* Align to the top of the parent container */
		height: 100vh;
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 3em;
    }
	
	#offres.section
	{
		scroll-snap-align: start; /* Align to the top of the parent container */
		min-height: 100vh;
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 1em;
		text-align:center;
		padding:2em 0;
		height:auto;
    }
	

	
#offres.section {
    font-family: 'Roboto', sans-serif;
    background-color: #f9f9f9;
    color: #333;
    padding: 50px 0;
}



@keyframes rings {
    0% { transform: rotate(45deg); }
    100% { transform: rotate(405deg); }
}

#offres.section .modal-title {
    font-size: 3em;
    font-weight: bold;
    z-index: 1;
    position: relative;
    animation: glow 2s infinite alternate;
}

@keyframes glow {
    0% { text-shadow: 0 0 5px #4460a0, 0 0 10px #4460a0, 0 0 15px #4460a0, 0 0 20px #1f4068; }
    100% { text-shadow: 0 0 10px #4460a0, 0 0 20px #4460a0, 0 0 30px #4460a0, 0 0 40px #1f4068; }
}

#offres.section .modal-body {
    font-size: 1.5em;
    margin: 20px 0;
}

#offres.section .modal-footer {
    border: none;
}

#offres.section .btn-close {
    color: #ffffff;
}

#offres.section .btn-secondary {
    background: #1f4068;
    border: none;
    color: #ffffff;
    font-size: 1.2em;
    transition: background 0.5s;
}

#offres.section .btn-secondary:hover {
    background: #4460a0;
}




#offres.section .modal-title {
    font-size: 24px;
    color: #333;
}

#offres.section .modal-footer .btn {
    background-color: #888;
    border-color: #888;
    color: white;
    transition: all 0.3s ease;
}

#offres.section .modal-footer .btn:hover {
    background-color: #666;
    border-color: #666;
}




	
	.section:nth-child(odd) 
	{
      background-color: #5074A6;
      color: white;
    }

    .section:nth-child(even) 
	{
      background-color: #fff;
      color: #333;
    }
	
	#conteneurUne
	{
		position: relative;
		width: 100%;
		height: 100vh;
		z-index: -100;
		scroll-snap-align: start;
		background-image: url('bg-min.png');
		background-color:#1f4068;
	}
	
	#conteneurUne .unewrap
	{
		position: absolute;
		left:12%;
		font-size:1.5em;
		font-weight:900;
		z-index:10;
	}
	
	#conteneurUne .imgunewrap
	{
		width:60%;
		height:auto;
		position: absolute;
		right: 12%;
		transform: rotate(-30deg);
		top: 42%;
		z-index: 1;
	}
	
	#conteneurUne .logoune
	{
		width: 43%;
		height: 70%;
		position: absolute;
		right: 19%;
	}
	
	#conteneurUne .logoune svg
	{
		width: 100%;
		height: 100%;
	}
	
	#conteneurUne .logoune svg path
	{
		fill:#ADD8E6;
		fill-opacity:0.05;
	}
	
	#conteneurUne .imgunewrap img
	{
		width:31%;
		height:auto;
	}
	
	#frontelem
	{
		scroll-snap-type: y mandatory;
	}
	
	#frontelem section
	{
		scroll-snap-align: start;
		height: 100vh;
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 3em;
		border-bottom:1px solid black;
	}
	
	#frontelem #about
	{
		scroll-snap-align: start;
		height: 100vh;
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 2.5em;
		border-bottom:1px solid black;
	}
	
	#frontelem section .aboutelem,
	#frontelem section .aboutbiselem
	{
		width:50%;
		height:110vh;
	}
	
	#frontelem section .aboutelem:nth-child(1),
	#frontelem section .aboutbiselem:nth-child(2)
	{
		border-right:1px solid black;
		padding:5%;
		background:white;
		color:black;
	}
	
	#frontelem #about .aboutelem .headabout,
	#frontelem #about .aboutelem .view-intro .views-field-title,
	#frontelem #contact .contactelem h3
	{
		font-family: 'gothamr', fallback, sans-serif;
	}
	
	#frontelem #about .aboutelem .footabout,
	#frontelem #about .aboutelem .view-intro .views-field-body
	{
		font-size:0.69em;
	}
	
	#frontelem #about .aboutelem:nth-child(2),
	#frontelem #about .aboutbiselem:nth-child(1)
	{
		background: #5074A6;
	}
	
	#frontelem #about .aboutelem svg
	{
		width:100%;
		height:100%;
		padding:31%;
	}
	
	#frontelem #about .aboutelem svg path
	{
		fill : #FFF;
	}
	

	
	section#contact.section
	{
		height:auto;
		padding:5%;
	}
	
	section#contact.section #webform-submission-contact-add-form,
	section#contact.section #webform-submission-contact-add-form .js-form-item
	{
		font-size:1rem;
	}
	
	section#contact.section
	{
		background-image: url('bg-min.png');
	}
	
	section#contact.section .contactelem
	{
		background:rgba(255,255,255,0.8);
	}

}