.hebergement-WP-page {
   font-size: 16px;
   overflow: hidden;
}
.hebergement-WP-page main {
   position: relative;
}
.hebergement-WP-page .title-block {
   color: #336178;
   font-size: 2em;
   font-weight: 700;
}
.hebergement-WP-banner .text-wrapper {
   line-height: 1.2;
   max-width: 35em;
}
.hebergement-WP-banner h1 {
   font-size: 3em;
   font-weight: 700;
   text-shadow: none;
   margin-bottom: 0.3em;
}
.hebergement-WP-banner .description {
   color: #ecc14e;
   font-size: 1.5em;
   font-weight: 600;
   text-align: center;
   margin-bottom: 30px;
}
.hwp-specification-block {
   display: flex;
   align-items: center;
   width: 90%;
   max-width: 62.5em;
   margin: -3.5em auto 0;
   padding: 4.3em 2em 6.3em;
   border-radius: 1.5em;
   background-color: #ffffff;
   box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.15);
   position: relative;
}
.hwp-specification-block::before {
   content: '';
   position: absolute;
   display: block;
   background: url(img/corner.png) center center no-repeat;
   background-size: contain;
   width: 9em;
   height: 9em;
   top: -0.41em;
   left: -0.5em;
}
.hwp-specification-block > .left-column {
   width: 53.5%;
   padding: 0 2em 0 6.6em;
}
.hwp-specification-block > .left-column-dns {
   width: 53.5%;
   padding: 0 2em 0 6.6em;
}
.hwp-specification-block > .right-column {
   width: 46.5%;
   display: flex;
   align-items: center;
   height: 22em;
   background: url(img/wp-logo.png) left center no-repeat;
   background-size: contain;
}
.hwp-specification-block > .right-column-dns {
   width: 46.5%;
   align-items: center;
   height: 22em;
   margin-top: 45px;
}
.hwp-specification-block .title-block {
   text-align: left;
   line-height: 1.3;
   margin: 0;
}
.hwp-specification-block .subtitle {
   color: #df5a49;
   font-size: 1.125em;
   font-weight: 800;
   text-align: left;
   display: flex;
   align-items: center;
   margin: 1.8em 0 0.6em;
}
.hwp-specification-block .subtitle-dns {
   color: #df5a49;
   font-size: 1.125em;
   font-weight: 800;
   text-align: left;
   display: flex;
   align-items: center;
   margin: 1.8em 0 0.6em;
}
.hwp-specification-block .subtitle::before {
   content: '';
   position: relative;
   display: block;
   background-color: #df5a49;
   width: 3em;
   height: 1px;
   margin-right: 0.75em;
}
.hwp-specification-block ul {
   color: #df5a49;
   font-size: 0.875em;
   font-weight: 700;
   line-height: 1.8em;
   padding-left: 5.75em;
}
.hwp-specification-block ul span {
   color: #656565;
}
.hwp-specification-block .new-price {
   display: flex;
   align-items: center;
   margin-left: 5em;
}
.hwp-specification-block .new-price .left-column {
   color: #DF5A49;
   font-size: 7.5em;
   font-weight: 700;
   line-height: 1;
}
.hwp-specification-block .new-price .right-column .top-text {
   color: #DF5A49;
   font-size: 1.625em;
   font-weight: 800;
   line-height: 1.1;
}
.hwp-specification-block .new-price .right-column .center-text {
   color: #656565;
   font-size: 1.5em;
   font-weight: 800;
   line-height: 1.1;
}
.hwp-specification-block .new-price .right-column .bottom-text {
   color: #666666;
   font-size: 1em;
   font-weight: 500;
   font-style: italic;
   line-height: 1.4;
}
.hwp-specification-block .old-price {
   position: absolute;
   top: 3.4em;
   right: 7.44em;
}
.hwp-specification-block .old-price p {
   color: #334d5c;
   font-size: 2em;
   font-weight: 700;
   background-color: #e8e8e8;
   border-radius: 50%;
   margin: 0;
   position: relative;
   display: flex;
   justify-content: center;
   align-items: center;
   width: 4.125em;
   height: 4.125em;
}
.hwp-specification-block .old-price p::before,
.hwp-specification-block .old-price p::after {
   content: '';
   position: absolute;
   display: block;
   background-color: #334d5c;
   width: 130%;
   height: 2px;
}
.hwp-specification-block .old-price p::before {
   transform: rotate(45deg);
}
.hwp-specification-block .old-price p::after {
   transform: rotate(-45deg);
}
.hwp-specification-block .old-price sup {
   font-size: 0.5625em;
   position: relative;
   margin-top: 0.5em;
}
.hebergement-WP-page .button-page-wrapper {
   text-align: center;
   position: relative;
   z-index: 10;
   /* transform: translate(0, -1.8em); */
   top: -1.8em;
   transition: 1.5s;
}
.hebergement-WP-page .button-page {
   color: #ffffff;
   font-size: 1.125em;
   font-weight: 700;
   line-height: 1;
   text-decoration: none;
   display: inline-block;
   background-color: #559de8;
   border-radius: 2em;
   box-shadow: 0px 3px 4px rgba(0, 0, 0, 0.25);
   padding: 1.1em 2.3em;
   transition: 0.5s;
   position: relative;
   top: 0;
   z-index: 15;
}
.hebergement-WP-page .button-page:hover {
   color: #559de8;
   background-color: #ffffff;
}
.hebergement-WP-page .button-page.sticky-elem {
   position: fixed;
   top: 90vh;
   left: calc(50% - 9.9em);
}
.hebergement-WP-page .button-page-wrapper.stop {
   position: static;
}
/* .hebergement-WP-page .button-page.sticky-elem */
.definition-block {
   width: 90%;
   max-width: 62.5em;
   margin: 0 auto;
   padding: 1em 0;
   display: flex;
   flex-direction: column;
   align-items: center;
   position: relative;
}
.curvature {
   position: relative;
}
.curvature::before {
   content: '';
   position: absolute;
   display: block;
   background-color: #ffffff;
   width: 130vw;
   height: 18em;
   border-radius: 50%;
   bottom: -4.5em;
   z-index: 1;
}
.curvature::after {
   content: '';
   position: absolute;
   display: block;
   background-color: #ffffff;
   width: 100vw;
   height: 100%;
   top: 0;
}
.definition-block::before {
   box-shadow: 0px 6px 8px rgba(102, 102, 102, 0.15);
}
.definition-block::after {
   display: none;
} 
.definition-block .title-block {
   margin: 0.3em 0 1.1em;
   position: relative;
   z-index: 2;
}
.definition-block .description {
   font-size: 1em;
   font-weight: 500;
   position: relative;
   z-index: 2;
}
.definition-block p {
   color: #555555;
   text-align: left;
   line-height: 1.5;
   margin-bottom: 1.8em;
}


.full-desc-block .title-block {
   background-color: #f5fcff;
   margin: 0;
   padding: 4.1em 2em 0.45em;
}
.full-desc-block .title-section {
   color: #336178;
   font-size: 1.125em;
   font-weight: 800;
   line-height: 2.3;
   letter-spacing: 0.03em;
   text-align: left;
   text-transform: uppercase;
   width: 90%;
   max-width: 64.7em;
   margin: 0 auto;
   border-bottom: 1px solid #336178;
}
.full-desc-section {
   padding: 6.5em 0 0;
}
.full-desc-section.installation {
   background-color: #f5fcff;
   padding: 0;
}
.full-desc-elem-wrapper {
   display: flex;
   flex-direction: column;
   align-items: center;
}
.full-desc-elem {
   display: flex;
   align-items: center;
   width: 90%;
   max-width: 72.8em;
   margin: 0 auto;
   padding: 6.5em 0 0;
   min-height: 18em;
}
.full-desc-elem-wrapper:nth-child(2) .full-desc-elem {
   padding: 3em 0 0;
}
.full-desc-elem-wrapper:nth-child(odd) .full-desc-elem {
   flex-direction: row-reverse;
}
.full-desc-elem .image-column {
   display: flex;
   justify-content: center;
   align-items: center;
   width: 35%;
   position: relative;
   z-index: 1;
}
.full-desc-elem .image-wrapper {
   max-width: 80%;
}
.full-desc-elem-wrapper .text-column {
   width: 65%;
   position: relative;
   z-index: 1;
}
.full-desc-elem h3 {
   color: #559DE8;
   font-size: 1.5em;
   font-weight: 700;
   margin: 0;
   padding: 0.5em 0;
   text-align: left;
}
.full-desc-elem p {
   color: #555555;
   font-size: 1.125em;
   font-weight: 500;
   text-align: left;
   line-height: 1.5;
   margin: 1.1em 0;
}
.full-desc-elem ul {
   color: #555555;
   font-size: 1.125em;
   font-weight: 500;
   text-align: left;
   list-style: none;
   padding-left: 0;
   line-height: 1.5;
}
.full-desc-elem li {
   margin: 1.1em 0;
}

.full-desc-section.installation .full-desc-elem-wrapper:nth-child(2)::before,
.full-desc-section.installation .full-desc-elem-wrapper:nth-child(2)::after {
   background-color: #f5fcff;
}
.full-desc-section.installation .full-desc-elem-wrapper:nth-child(3)::before,
.full-desc-section.installation .full-desc-elem-wrapper:nth-child(3)::after {
   background-color: #e7f2f7;
}
.full-desc-section.securite .full-desc-elem-wrapper:nth-child(2)::before,
.full-desc-section.securite .full-desc-elem-wrapper:nth-child(2)::after {
   background-color: #ffffff;
}
.full-desc-section.securite .full-desc-elem-wrapper:nth-child(3)::before,
.full-desc-section.securite .full-desc-elem-wrapper:nth-child(3)::after {
   background-color: #f5fcff;
}
.full-desc-section.securite .full-desc-elem-wrapper:nth-child(4)::before,
.full-desc-section.securite .full-desc-elem-wrapper:nth-child(4)::after {
   background-color: #e7f2f7;
}
.full-desc-section.securite .full-desc-elem-wrapper:nth-child(5)::before,
.full-desc-section.securite .full-desc-elem-wrapper:nth-child(5)::after {
   background-color: #f5fcff;
}
.full-desc-section.ressources .full-desc-elem-wrapper:nth-child(2)::before,
.full-desc-section.ressources .full-desc-elem-wrapper:nth-child(2)::after {
   background-color: #ffffff;
}
.full-desc-section.ressources .full-desc-elem-wrapper:nth-child(3)::before,
.full-desc-section.ressources .full-desc-elem-wrapper:nth-child(3)::after {
   background-color: #f5fcff;
}
.full-desc-section.ressources .full-desc-elem-wrapper:nth-child(4)::before,
.full-desc-section.ressources .full-desc-elem-wrapper:nth-child(4)::after {
   background-color: #e7f2f7;
}
.full-desc-section.ressources .full-desc-elem-wrapper:nth-child(5)::before,
.full-desc-section.ressources .full-desc-elem-wrapper:nth-child(5)::after {
   background-color: #ffffff;
}
.full-desc-section.ressources .full-desc-elem-wrapper:nth-child(6)::before,
.full-desc-section.ressources .full-desc-elem-wrapper:nth-child(6)::after {
   background-color: #f5fcff;
}
.full-desc-section.ressources .full-desc-elem-wrapper:nth-child(7)::before,
.full-desc-section.ressources .full-desc-elem-wrapper:nth-child(7)::after {
   background-color: #e7f2f7;
}
.back_to_top {
   position: fixed;
   bottom: 100px;
   right: 20px;
   width: 60px;
   height: 60px;
   background: url(img/arrow_up_2.png) center center no-repeat;
   background-size: contain;
   cursor: pointer;
   transition: 0.5s;
   z-index: 15;
}
.back_to_top:hover {
   transform: scale(1.3);
}

/* --------- HEBERGEMENT PAGE --------- */
.hebergement-wrapper-page {
   font-size: 16px;
}
.hebergement-banner {
   position: relative;
   padding: 4em 2em;
}
.page-banner.hebergement-banner h1 {
   color: #444444;
   font-size: 2.8125em;
   font-weight: 700;
   text-shadow: none;
   margin: 0 0 0.7em;
}
.hebergement-banner .description {
   color: #ffffff;
   font-size: 1.5em;
   font-weight: 700;
   text-align: center;
   line-height: 1.2;
}
.hebergement-banner .footnote {
   color: #ffffff;
   font-size: 1.125em;
   font-weight: 800;
   position: absolute;
   bottom: 20px;
   width: calc(100% - 4em);
   text-align: center;
}
.hosting-simulator-block {
   /*height: 400px;*/
}
.bg-light-cian {
   background-color: #ecf4ff;
}
.bg-sky-blue {
   background-color: #b7e4f7;
}
.bg-light-blue {
   background-color: #d0f1ff;
}
.bg-white {
   background-color: #ffffff;
}
.tide-light-cian,
.tide-sky-blue,
.tide-light-blue,
.tide-white {
   position: relative;
}
.tide-light-cian::before,
.tide-sky-blue::before,
.tide-light-blue::before,
.tide-white::before {
   content: '';
   position: absolute;
   display: block;
   background-position: center top;
   background-repeat: no-repeat;
   /* background-size: contain; */
   background-size: 100% 100%;
   width: 100%;
   height: 6.1vw;
   top: calc(100% - 2px);
   left: 0;
   z-index: 1;
}
.tide-light-cian::before {
   background-image: url(img/tide-light-cian.png);
}
.tide-sky-blue::before {
   background-image: url(img/tide-sky-blue.png);
}
.tide-light-blue::before {
   background-image: url(img/tide-light-blue.png);
}
.tide-white::before {
   background-image: url(img/tide-white.png);
}
.hosting-doc-section .title-section-wrapper {
   padding: 4em 2em 2em;
}
.details-section .title-section-wrapper {
   padding: 9.5vw 2em 2em;
}
.hosting-doc-section .title-section,
.other-types-block-title {
   color: #336178;
   font-size: 1.125em;
   font-weight: 800;
   text-align: left;
   border-bottom: 1px solid #336178;
   max-width: 1165px;
   margin: 0 auto;
   padding-bottom: 0.2em;
}
.hosting-doc-row {
   padding: 7vw 2em 2em;
}
.hosting-doc-section.general-section .hosting-doc-row:nth-child(2),
.hosting-doc-section.details-section .hosting-doc-row:nth-child(2) {
   padding: 0 2em 2em;
}
.hosting-doc-row-wrapper {
   display: flex;
   max-width: 1165px;
   margin: 0 auto;
}
.general-section .hosting-doc-row:nth-child(even) .hosting-doc-row-wrapper {
   flex-direction: row-reverse;
}
.details-section .hosting-doc-row:nth-child(odd) .hosting-doc-row-wrapper {
   flex-direction: row-reverse;
}
.hosting-doc-row .image-column {
   width: 35%;
   display: flex;
   justify-content: center;
   align-items: center;
}
.hosting-doc-row .text-column {
   width: 65%;
}
.general-section .hosting-doc-row .text-column {
   padding: 0 5em 0 1em;
}
.general-section .hosting-doc-row:nth-child(even) .text-column {
   padding: 0 1em 0 5em;
}
.details-section .hosting-doc-row .text-column {
   padding: 0 1em 0 5em;
}
.details-section .hosting-doc-row:nth-child(even) .text-column {
   padding: 0 5em 0 1em;
}
.hosting-doc-row .item-title {
   color: #336178;
   font-size: 2em;
   font-weight: 700;
   line-height: 1.2;
   margin: 0.9em 0;
}
.hosting-doc-row p {
   color: #555555;
   font-size: 1em;
   font-weight: 500;
   line-height: 1.5;
   text-align: left;
   margin: 0 0 1.5em;
}
.hosting-doc-row ul {
   list-style: none;
   padding: 0;
   margin-bottom: 1.5em;
    color: #555555;
}
.hosting-doc-row strong {
   color: #334d5c;
   font-weight: 800;
}
.hosting-doc-row .footnote {
   font-style: italic;
   font-size: 0.8em;
}
.other-types-block {
   padding: 10vw 2em 0;
}
.other-types-wrapper {
   display: flex;
   justify-content: space-between;
   max-width: 1165px;
   margin: 0 auto;
   padding: 3.8em 0 7.5em;
}
.other-type-column {
   width: 32%;
   border-radius: 1.25em;
   padding: 3em 2em 4em;
   position: relative;
   box-shadow: 0px 5px 6px rgba(87, 87, 87, 0.2);
}
.other-type-column .item-title {
   color: #559de8;
   font-size: 1.5em;
   font-weight: 700;
   line-height: 1.2;
   max-width: 8em;
   margin: 0 auto;
}
.other-type-column .image-wrapper {
   display: flex;
   justify-content: center;
   align-items: center;
   min-height: 12em;
}
.other-type-column img {
   display: block;
}
.other-type-column p {
   color: #336178;
   font-size: 1.125em;
   font-weight: 500;
   text-align: left;
   line-height: 1.3;
   margin: 0 0 1.5em;
}
.other-type-column .link {
   color: #559de8;
   font-size: 0.9em;
   font-style: italic;
   text-decoration: none;
   position: absolute;
   bottom: 3em;
}
.other-type-column .link::before {
   content: '';
   position: relative;
   display: inline-block;
   background: url(img/arrow-to-right.png) center center no-repeat;
   background-size: contain;
   width: 1.5em;
   height: 1.5em;
   top: 0.35em;
   margin-right: 0.5em;
   left: 0;
   transition: 0.3s;
}
.other-type-column .link:hover::before {
   left: 0.4em;
}

@media screen and (max-width: 1060px) {
   .hwp-specification-block > .left-column {
      padding: 0 2em 0 7vw;
   }
   .hwp-specification-block .new-price {
      margin-left: 6.5vw;
   }
   .hwp-specification-block .old-price {
      right: 8vw;
   }
   .hosting-doc-row .text-column {
      padding: 0 2em 0 1em;
   }
   .hosting-doc-row:nth-child(even) .text-column {
      padding: 0 1em 0 2em;
   }
   .other-types-wrapper {
      flex-direction: column;
      padding: 1.5em 0 2.5em;
   }
   .other-type-column {
      width: 100%;
      max-width: 600px;
      margin: 1em auto;
   }
   .other-type-column .link {
      position: static;
   }
}


@media screen and (max-width: 767px) {
   .hebergement-WP-page {
      font-size: 14px;
   }
   .hebergement-wrapper-page {
      font-size: 14px;
   }
   .hwp-specification-block {
      flex-direction: column;
      padding: 4.3em 2em 3.3em;
   }
   .hwp-specification-block > .left-column {
      width: 100%;
      max-width: 22em;
      padding: 0 0 1em;
   }
   .hwp-specification-block > .right-column {
      position: relative;
      width: 100%;
      max-width: 22em;
      justify-content: center;
   }
   .hwp-specification-block .new-price {
      margin: 0;
   }
   .hwp-specification-block .old-price {
      right: 0;
      top: 0;
   }
   .hebergement-WP-page .button-page.sticky-elem {
      top: calc(100vh - 4.7em);
   }
   .full-desc-elem {
      flex-direction: column;
   }
   .full-desc-elem-wrapper:nth-child(2n+1) .full-desc-elem {
      flex-direction: column;
   }
   .full-desc-elem .image-column {
      width: 100%;
      margin-bottom: 2em;
   }
   .full-desc-elem-wrapper .text-column {
      width: 100%;
   }
   
   .back_to_top {
      right: 30px;
      bottom: 95px;
   }
   .back_to_top:hover {
      transform: none;
   }
   .hosting-doc-row-wrapper {
      flex-direction: column;
      align-items: center;
   }
   .general-section .hosting-doc-row:nth-child(2n) .hosting-doc-row-wrapper {
      flex-direction: column;
   }
   .details-section .hosting-doc-row:nth-child(2n+1) .hosting-doc-row-wrapper {
      flex-direction: column;
   }
   .hosting-doc-row .image-column {
      width: 100%;
   }
   .hosting-doc-row .text-column {
      width: 100%;
      padding: 0 1em !important;
   }
   .hosting-doc-row {
      padding: 9vw 2em 1em;
   }
   .hosting-doc-section.general-section .hosting-doc-row:nth-child(2),
   .hosting-doc-section.details-section .hosting-doc-row:nth-child(2) {
      padding: 1em 2em 1em;
   }
   .hosting-doc-section .title-section-wrapper {
      padding: 3em 2em 2em;
   }
}

@media screen and (max-width: 400px) {
   .hwp-specification-block > .right-column {
      height: 75vw;
   }
   .hwp-specification-block {
      padding: 4.3em 2em 3.3em;
   }
   .hwp-specification-block .old-price {
      top: -15px;
   }
   .hwp-specification-block .old-price p {
      font-size: 1.7em;
   }
   .other-types-block {
      padding: 12vw 1em 0;
   }
   .hosting-doc-row {
      padding: 15vw 1em 1em;
   }
   .hosting-doc-row p {
      font-size: 1.15em;
   }
}