body {
   color: #3b3b3b;
   background: #292929;
   min-height: 100%;
   word-wrap: break-word;
   font-family: "poppins","Helvetica Neue",Helvetica,Arial,sans-serif;
   font-size: 1rem;
   font-weight: 400;
   line-height: 1.5;
}

a {
   color: #734F45;
}
a:hover {
   color: #BE9185;
}
.site {
   display: -webkit-box;
   display: -moz-box;
   display: -ms-flexbox;
   display: flex;
   flex-direction: column;
   position: relative;
   min-height: 100vh;
}

.site-header {
	padding: 0;
   width: 100%;
   font-family: 'Roboto Condensed', sans-serif;
}
.site-header > .header-fixed {
   display: none;
}

.site-main {
   background: #ffffff;
   background: -moz-linear-gradient(top,#fff 0px,#ffd4cc 1200px);
   background: -webkit-linear-gradient(top,#fff 0px,#ffd4cc 1200px);
   background: -o-linear-gradient(top,#fff 0px,#ffd4cc 1200px);
   background: linear-gradient(to bottom,#fff 0px,#ffd4cc 1200px);
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff',endColorstr=#ffd4cc,GradientType=0);
}
.site-main > .main-header {
   display: -webkit-box;
   display: -moz-box;
   display: -ms-flexbox;
   display: flex;
   -ms-flex-wrap: wrap;
   flex-wrap: wrap;
   -ms-flex-align: center;
   align-items: center;
   justify-content: space-between;
   background-attachment: fixed;
   background-position: center;
   width: 100%;
   padding-right: 15px;
   padding-left: 15px;
   margin-right: auto;
   margin-left: auto;
}
.site-main > .main-header > .header-brand {
   display: -webkit-box;
   display: -moz-box;
   display: -ms-flexbox;
   display: flex;
   flex-direction: column;
   padding: 1rem;
}
.site-main > .main-header > .header-brand > .header-text {
   color: #BE9185;
   font-size: 1.13rem;
   margin-top: .5rem;
   margin-bottom: 0;
}
.site-main > .main-header > .header-join {
   display: none;
   flex-direction: column;
   justify-content: center;
}
.site-main > .main-header > .header-overlay {
   position: fixed;
   left: 0;
   right: 0;
   top: 0;
   height: 0;
   z-index: 999;
   background: rgba(190,190,190,0.9);
   -webkit-transition: opacity .3s ease,height 0s ease 0.3s;
   -o-transition: opacity .3s ease,height 0s ease 0.3s;
   transition: opacity .3s ease,height 0s ease 0.3s;
   will-change: opacity;
   opacity: 0;
}
.site-main > .main-header > .header-toggler {
   color: #b3906a;
   padding: 0;
   font-size: 1.5rem;
   width: 60px;
   line-height: 60px;
   background: none;
   border: none;
   outline: none;
   -webkit-transition: color .3s;
   -o-transition: color .3s;
   transition: color .3s;
}
.site-main > .main-header > .header-toggler:hover,
.site-main > .main-header > .header-toggler:not(.collapsed) {
   color: #222;
   cursor: pointer;
   background: none;
}
.site-main > .main-header > .header-toggler:not(.collapsed) + .header-overlay {
   opacity: 1;
   height: 100%;
   -webkit-transition: opacity .3s ease;
   -o-transition: opacity .3s ease;
   transition: opacity .3s ease;
   pointer-events: auto;
}

.site-main > .main-header > .header-menu {
   position: fixed;
   top: 0;
   right: 0;
   width: 300px;
   height: 100% !important;
   z-index: 1000;
   overflow-y: auto;
   transition: none;
   overflow: inherit;
   background: #fff;
}
.site-main > .main-header > .header-menu.collapse:not(.show) {
   display: none;
}
.site-main > .main-header > .header-menu > ul {
   display: -webkit-box;
   display: -moz-box;
   display: -ms-flexbox;
   display: flex;
   -ms-flex-direction: column;
   flex-direction: column;
   -ms-flex-wrap: wrap;
   flex-wrap: wrap;
   flex-grow: 1;
   padding-left: 0;
   margin-bottom: 0;
   list-style: none;
}
.site-main > .main-header > .header-menu > ul > li {
   padding: 1rem;
   font-size: 1rem;
}
.site-main > .main-header > .header-menu > ul > li > a {
   transition: none;
   color: #222;
}
.site-main > .main-header > .header-menu > ul > li > a:focus,
.site-main > .main-header > .header-menu > ul > li > a:hover,
.site-main > .main-header > .header-menu > ul > li > a.active {
   color: #b3906a;
   outline: 0;
   text-decoration: none;
}

.site-main > .main-content {
   width: 100%;
   padding-right: 15px;
   padding-left: 15px;
   margin-right: auto;
   margin-left: auto;
}

@media (min-width: 992px) {
   .site-header > .header-fixed {
      display: -webkit-box;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      flex-direction: row;
      justify-content: flex-end;
      background: #e0e8ea;
      width: 100%;
      position: fixed;
      top: 0;
      height: 46px;
      z-index: 2000;
   }
   .site-header > .header-fixed > .container {
      display: -webkit-box;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-align: center;
      align-items: center;
      justify-content: space-between;
   }
   .site-header > .header-fixed a {
      line-height: 30px;
      color: #666;
      text-decoration: none;
      align-self: center;
      padding: 0 1rem;
      text-transform: uppercase;
   }
   .site-header > .header-fixed a:hover {
      color: #b3906a;
   }
   .site-header + .site-main {
      margin-top: 46px;
   }

   .site-main > .main-header {
      max-width: 960px;
   }
   .site-main > .main-header > .header-join {
      display: flex;
   }
   .site-main > .main-header > .header-toggler {
       display: none;
   }
   .site-main > .main-header > .header-toggler:not(.collapsed) + .header-overlay {
      display: none;
   }

   .site-main > .main-header > .header-menu {
      -ms-flex-align: center;
      align-items: center;
      justify-content: space-between;
      position: inherit;
      width: 100%;
      background: none;
   }
   .site-main > .main-header > .header-menu.collapse:not(.show) {
      display: -webkit-box;
      display: -moz-box;
      display: -ms-flexbox;
      display: flex;
   }
   .site-main > .main-header > .header-menu > ul {
      -ms-flex-direction: row;
      flex-direction: row;
      justify-content: space-around;
      background: none;
      margin: 1.5rem 0;
      border-bottom: 1px solid #d0d0d0;
   }
   .site-main > .main-header > .header-menu > ul > li {
      padding: 0;
   }
   .site-main > .main-header > .header-menu > ul > li > a {
      position: relative;
      display: inline-block;
      margin: 5px 12px 0;
      padding-bottom: 12px;
      text-decoration: none;
      text-transform: uppercase;
      color: #888;
      font-size: 1rem;
	}
   .site-main > .main-header > .header-menu > ul > li > a:focus,
   .site-main > .main-header > .header-menu > ul > li > a:hover {
      color: #222;
   }
   .site-main > .main-header > .header-menu > ul > li > a:after {
      content: "";
      position: absolute;
      left: 0;
      bottom: -1px;
      width: 0;
      height: 1px;
      background-color: currentColor;
      -webkit-transition: width .3s;
      -o-transition: width .3s;
      transition: width .3s;
   }
   .site-main > .main-header > .header-menu > ul > li > a:hover:after {
      width: 100%;
   }

   .site-main > .main-content {
      max-width: 960px;
      flex-direction: column;
      align-items: inherit;
   }
}
@media (min-width: 1200px) {
   .site-main > .main-header,
   .site-main > .main-content {
      max-width: 1140px;
   }
}

.site-main {
   flex-grow: 1;
}

.site-footer {
   padding: 1rem 0;
   background: #222;
   color: #eee;
   min-height: 50px;
}
.site-footer a {
   color: #eee;
}
.site-footer a:hover {
   text-decoration: none;
   color: #ffd7cc;
}
.site-footer a.fa-stack:hover > .fa-stack-2x {
   color: #ffd7cc;
}

.btn.btn-primary {
   background: #734f45;
   border: none;
}
.btn.btn-primary:focus,
.btn.btn-primary:hover {
   background: #be9185;
   border: none;
   box-shadow: none;
}

.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active:focus,
.btn-primary:not(:disabled):not(.disabled):active:focus {
   background: #be9185;
   border: none;
   box-shadow: 0 0 0 0.2rem rgb(115 79 69 / 50%);
}

.themed-color-white {
   color: #fff;
}

.themed-color-1 {
   color: #ffd7cc;
}
.themed-color-1-hover:hover {
   color: #fff4f1;
}
.themed-color-2 {
   color: #734f45;
}
.themed-color-2-hover:hover {
   color: #be9185;
}
.themed-color-3 {
   color: #be9185;
}
.themed-color-2-hover:hover {
   color: #734f45;
}
.themed-color-4 {
   color: #fff4f1;
}
.themed-color-2-hover:hover {
   color: #ffd7cc;
}

.themed-background-1 {
   background: #ffd7cc;
}
.themed-background-2 {
   background: #734f45;
}
.themed-background-3 {
   background: #be9185;
}
.themed-background-4 {
   background: #fff4f1;
}
.themed-background-white {
   background: #fff;
}
.themed-background-green {
   background: #60c0bd;
}


.slider-container {
   position: relative;
   -webkit-box-shadow: 0 155px 50px -145px rgb(145 133 119 / 45%), 0 195px 22px -186px rgb(145 133 119 / 20%);
   box-shadow: 0 155px 50px -145px rgb(145 133 119 / 45%), 0 195px 22px -186px rgb(145 133 119 / 20%);
}
.slider-side {
   color: #734f45;
   background-color: #fff;
   font-size: 16px;
}
.slider-side:after {
   -webkit-backface-visibility: hidden;
   -moz-backface-visibility: hidden;
   -ms-backface-visibility: hidden;
   backface-visibility: hidden;
   -webkit-perspective: 1000px;
   -moz-perspective: 1000px;
   -ms-perspective: 1000px;
   perspective: 1000px;
   content: "";
   position: absolute;
   top: 0;
   right: 0;
   height: 100%;
   width: 30px;
   background-color: #fff;
   -webkit-transform: skew(3deg,0) translateZ(0);
   transform: skew(3deg,0) translateZ(0);
   -webkit-transform-origin: top right;
   -ms-transform-origin: top right;
   transform-origin: top right;
   outline: 1px solid transparent;
   z-index: 2000;
}
.slider-side-texte {
   padding: 40px;
   font-size: 18px;
}
.slider-carousel {
   display: none;
}
@media (min-width: 992px) {
   .slider-side-texte {
      height: 400px;
      padding: 65px 20px 20px 20px;
   }
   .slider-carousel {
      display: block;
   }
}
@media (min-width: 1200px) {
   .slider-side-texte {
      padding: 65px 40px 20px 45px;
   }
}

.carousel-cell > img {
   height: 400px;
}

.steps-list {
   margin-top: 2rem;
   margin-bottom: 2rem;
   flex-direction: column;
   padding: 0 2rem;
}
.steps-list > .step {
   position: relative;
   height: 100%;
   font-size: 12px;
   line-height: 1.25;
   padding: 0;
   margin-bottom: 2rem;
   font-size: 14px;
   z-index: 10;
}
.steps-list > .step > img {
   display: inline-block;
   width: 50px;
   vertical-align: middle;
}
.steps-list > .step::after {
   content: "";
   position: absolute;
   top: 0;
   left: 0;
   right: 0px;
   bottom: 0;
   background: url(/themes/spin/img/fleche-pointe.png) no-repeat top right;
   background-size: auto 100%;
}
.steps-list > .step > .step-content {
   padding-top: .5rem;
   padding-bottom: .5rem;
   padding-left: .5rem;
   padding-right: .25rem;
   margin-right: 20px;
   background: #fff;
   margin-left: 5px;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
}
.steps-list > .step > .step-content > .step-index {
   position: absolute;
   top: -12px;
   left: -6px;
   width: 24px;
   height: 24px;
   line-height: 24px;
   background-color: #734f45;
   border-radius: 50%;
   color: #fff;
   text-align: center;
   -webkit-box-shadow: 0 0 0 3px #fff;
   box-shadow: 0 0 0 3px #fff;
   z-index: 2;
}
.steps-list > .step > .step-content > img {
   display: inline-block;
   width: 50px;
   vertical-align: middle;
}
@media (min-width: 992px) {
   .steps-list {
      flex-direction: row;
      padding: 0;
   }
   .steps-list > .step {
      margin-bottom: 0;
   }
   .steps-list > .step:not(:first-child)::before {
      content: "";
      position: absolute;
      top: 0;
      left: -16px;
      right: 0;
      bottom: 0;
      background: url(/themes/spin/img/fleche-queue.png) no-repeat top left;
      background-size: auto 100%;
   }
   .steps-list > .step:not(:last-child)::after {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      right: 0px;
      bottom: 0;
      background: url(/themes/spin/img/fleche-pointe.png) no-repeat top right;
      background-size: auto 100%;
   }
   .steps-list > .step:not(:last-child) > .step-content {
      margin-right: 20px;
   }
}

@font-face {
   font-family: 'poppins';
   src: url('/themes/spin/fonts/poppins-bold-webfont.woff2') format('woff2'),
      url('/themes/spin/fonts/poppins-bold-webfont.woff') format('woff');
   font-weight: bold;
   font-style: normal;
}
@font-face {
   font-family: 'poppins';
   src: url('/themes/spin/fonts/poppins-regular-webfont.woff2') format('woff2'),
      url('/themes/spin/fonts/poppins-regular-webfont.woff') format('woff');
   font-weight: normal;
   font-style: normal;
}