:root {
  --primary: #93c132;
  --secondary: #114862;
  --bg: #F7F7F4;
  --text: #222222;
  --sol: #00A3C0;
  --services: #E15D22;
  --experiences: #CB3D5F;
  --radius: 6px;
  --max-width: 1200px;
  --font-text: "Inter";
  --font-title: "Playfair";
  --font-subtitle: "Quicksand";
  --wave-height:85px;
  --header-height: 85px;

}


/************** RESET *************/

html, body, div, span,
h1, h2, h3, h4, p,
a, img, ol, ul, li, form, label,
table, tbody, tfoot, thead, tr, th, td,
article {
	margin: 0;
	padding: 0;
	border: 0;
}

html, body{height:100%; }

/************** GENERAL *************/

html{
  box-sizing: border-box;
  scroll-behavior: smooth;
  font-family: var(--font-text), sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
  font-size:62.5%;
} /*Correspond à 1rem=10pt*/

*, *:before, *:after {
  box-sizing: inherit;
}

body{
  font-size:1.6rem;
  background-color: var(--bg);
  margin: 0 auto;
  padding: 0;
  color: var(--text);
}

ol {
  list-style: decimal;
  list-style-position: inside;
  padding: 0;
  margin: 0;
}

ul {
  padding: 0;
  margin: 0;
  list-style: none;
  list-style-position: inside;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

a {
  text-decoration: none;
  color: inherit;

}

img{
  max-width: 100%;
  display: block;
  height: auto;
  border: none;
  outline: none;
}

h1, h2, h3, h4{
  font-weight: 600;
  line-height: 1.2;
  margin-bottom: 0.5rem;
}

p {
  margin: 0;
  padding: 0.5rem 0;
}

strong{
  font-weight: bold;

}

a {
  color: var(--primary);
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

button {
  padding: 0.6em 1.2em;
  border: none;
  border-radius: var(--radius);
  background: var(--primary);
  color: white;
  cursor: pointer;
  font-size: 1rem;
}

button:hover {
  opacity: 0.9;
}

/** police **/

h1 {
  font-family: var(--font-title), serif;
  font-optical-sizing: auto;
  font-weight: bold;
  font-style: normal;
  font-variation-settings: "wdth" 100;
}

h2, h3, h4, strong {
  font-family: var(--font-subtitle), sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}



/*** liste ***/

.sfContentBlock li::before {
    content: '';
    display: inline-block;
    width: 17px;
    height: 17px;
    margin: 0 0.8rem 0;
    background-repeat: no-repeat;
    background-position: center;
    -webkit-mask: url(../Images/IconesSite/validate-list.svg) no-repeat center;
    mask: url(../Images/IconesSite/validate-list.svg) no-repeat center;
    background-color: var(--primary);
}


.sfContentBlock  li {
    line-height: 2rem;
    margin: 0.8rem 0;
    font-weight: 640;
    font-family: var(--font-subtitle), sans-serif;
}


/**/


.mainContentExtranet,
.mainContentPublic {
  background: var(--bg);
  padding: 2rem 1rem 1rem;
  margin: 0 auto;
}

.mainContentExtranet {
  min-height: calc(100vh - 200px);
}

.mainContentPublic {
  min-height: calc(100vh - 200px);
  padding: 0rem 1rem 1rem;
}

/*.mainContentPublic > .sf_colsOut {
  max-width: 1080px;
  margin: 0 auto;
  padding: 5rem 1rem 3rem;
}*/


.mainContentExtranet > .sf_colsOut {
  max-width: 1440px;
  margin: 0 auto;
  padding: 1rem;
}

.sfimageWrp {
    text-align: center;
}

/*---------------------------------BOUTON TOP----------------------------------*/
#hautpage
{
position: fixed;
bottom: 15px;
right: 15px;
background: rgba(154, 154, 154, 0.5);
width: 36px;
height: 35px;
border-radius: 50%;
padding: 5px;

}

#hautpage:hover{
  background: rgba(154, 154, 154, 0.7);
}


#hautpage #btntop{
  width: 15px;
  height: 15px;
  border-top: 4px solid #fff;
  border-right: 4px solid #fff;
    -webkit-transform: translate(38%, 61%) rotate(-45deg);
            transform: translate(38%, 61%) rotate(-45deg);
  -webkit-transition: 0.2s ease;
  transition: 0.2s ease;
}



/*** fond bandeau ****/

.accueilBandeau img, .bandeauImg img {
    height: 200px;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
}

.accueilBandeau.sf_cols > .sf_colsOut, .bandeauImg > .sf_colsOut{
    max-width: 100%;
}



/**/

.sfPageEditorWrp header {
  position: relative!important;
}