﻿/* General style */
a,
a:active,
a:visited {
  color: #0bafc2;
  text-decoration: none;
  cursor: pointer;
}

a:hover {
  color: #23c4d6;
}

a.Blue {
  padding: 10px;
  border-radius: 3px;
  background-color: #0bafc2;
  color: #fff !important;
  text-decoration: none !important;
}

a.Blue:hover {
  background-color: #23c4d6;
}

html,
input,
textarea,
select,
button {
  -webkit-font-smoothing: antialiased;
}

div {
  box-sizing: border-box;
}

body {
  margin: 0px;
  padding: 0px;
  color: #121922;
  font-family: "Signika", sans-serif;
  line-height: 1.5;
}

h1 {
  font-size: 32px;
  font-weight: normal;
  margin: 0 0 22px 0;
  border-bottom: 1px solid #cfd7e0;
  padding-bottom: 18px;
  text-transform: uppercase;
}

h2 {
  font-size: 150%;
  font-weight: normal;
}

h3 {
  font-size: 115%;
  margin-bottom: 15px;
  font-weight: normal;
}

.thintext {
  font-weight: 400 !important;
}

.normalText {
  font-weight: 500 !important;
}
/* Backgrounds */
.yellow {
  background-color: #f99e29 !important;
}

.blue {
  background-color: #0bafc2;
}

.grey {
  background-color: #7f7f7f;
}

.green {
  background-color: #15db72;
}

.red {
  background-color: #ee4545;
}

/* Forms */

input[type="button"]::-moz-focus-inner,
button::-moz-focus-inner {
  /* Reset pour FireFox */
  padding: 0;
  border: 0;
}

input:focus {
  outline: none;
}

input:not([type="button"]):focus {
  border-color: #13adb5 !important;
}

input::-webkit-input-placeholder {
  color: #72808e !important;
}

input:-moz-placeholder {
  color: #72808e !important;
  opacity: 1;
}

input::-moz-placeholder {
  color: #72808e !important;
  opacity: 1;
}

input:-ms-input-placeholder {
  color: #72808e !important;
}

.wsRegisterForm input[type="text"] {
  width: 100%;
  display: block;
}

.invalid {
  border: 2px solid #de4b39 !important;
}

fieldset {
  border: 1px solid #cfd7e0v;
  padding: 20px;
  padding-top: 10px;
  margin: 15px 0px;
  width: 100%;
  box-sizing: border-box;
}

fieldset > legend {
  font-size: 150%;
  padding: 0px 5px;
}

label {
  padding: 0 0 5px 5px;
  font-size: 14px;
}

input[type="button"] {
  display: inline-block;
  color: #fff;
  background-color: #121922;
  border-radius: 3px;
  margin-right: 8px;
  padding: 6px 12px;
  cursor: pointer;
  border: none;
  border-radius: 3px;
  -webkit-appearance: none;
}

textarea,
input[type="text"],
input[type="password"],
input[type="email"] {
  box-sizing: border-box;
  width: 100%;
  padding: 10px;
  margin-bottom: 20px;
  border-radius: 3px;
  font-family: "Signika", sans-serif;
  font-size: 14px;
  background-color: #cfd7e0;
  border: 1px solid #cfd7e0;
  color: #121922;
}

input[type="button"]:hover {
  background-color: #2a343f;
}

input[type="button"].Blue {
  background-color: #0bafc2;
}

input[type="button"].Blue:hover {
  background-color: #23c4d6;
}

input[type="button"].ClearBlue {
  background-color: #23c4d6;
}

input[type="button"].ClearBlue:hover {
  background-color: #57f2fa; /* TODO WL Add an editor design color??? */
}

input[type="button"].Grey {
  background-color: #7f7f7f;
}

input[type="button"].Grey:hover {
  background-color: #5b5b5b;
}

input[type="button"].DarkGrey {
  background-color: #121922;
}

input[type="button"].DarkGrey:hover {
  background-color: #000;
}

input[type="button"].Red {
  background-color: #de4b39;
}

input[type="button"].Red:hover {
  background-color: #db6152;
}

input[type="button"].Yellow {
  background-color: #f99e29;
}

input[type="button"].Yellow:hover {
  background-color: #f3a83a;
}

input[type="button"].Black {
  background-color: #1f1f1f;
}

input[type="button"].Black:hover {
  background-color: #333;
}

input[type="button"].Round {
  border-radius: 30px;
}

input[type="button"].GhostDarkGrey,
input[type="button"].GhostDarkGrey:focus {
  border-radius: 20px;
  border: 2px solid #121922;
  color: #121922;
  text-transform: uppercase;
  background-color: transparent;
}

input[type="button"].GhostDarkGrey:hover {
  background-color: #121922;
  color: #fff;
}

a.textTurquoise:active,
a.textTurquoise:visited,
a.textTurquoise:link {
  color: #0bafc2;
}

a.textTurquoise:hover {
  color: #23c4d6;
}

.textOrange {
  color: #f3a447;
}

.textMauve {
  color: #5a3cdb;
}

.textVert {
  color: #14d471;
}

a.GhostBlue,
input[type="button"].GhostBlue {
  border-radius: 20px;
  border: 2px solid #0bafc2;
  color: #0bafc2;
  text-transform: uppercase;
  background-color: transparent;
  display: inline-block;
  line-height: 1.3;
}

a.GhostBlue:hover,
input[type="button"].GhostBlue:hover {
  background-color: #0bafc2;
  color: #fff !important;
  text-decoration: none !important;
}

a.GhostWhite,
input[type="button"].GhostWhite,
input[type="button"].GhostWhite:focus {
  border-radius: 20px;
  border: 2px solid #fff;
  color: #fff !important;
  text-transform: uppercase;
  background-color: transparent;
  text-decoration: none;
}

a.GhostWhite:hover,
input[type="button"].GhostWhite:hover {
  background-color: #fff;
  color: #0bafc2 !important;
  text-decoration: none !important;
}

a.GhostGreen,
input[type="button"].GhostGreen,
input[type="button"].GhostGreen:focus {
  border-radius: 20px;
  border: 2px solid #15db72;
  color: #15db72;
  text-transform: uppercase;
  background-color: transparent;
}

a.GhostGreen:hover,
input[type="button"].GhostGreen:hover {
  background-color: #15db72;
  color: #fff;
}

a.Ghostyellow,
input[type="button"].GhostYellow,
input[type="button"].GhostYellow:focus {
  border-radius: 20px;
  border: 2px solid #f5aa53;
  color: #f5aa53;
  text-transform: uppercase;
  background-color: transparent;
}

a.GhostYellow:hover,
input[type="button"].GhostYellow:hover {
  background-color: #f5aa53;
  color: #fff;
}

a.GhostPurple,
input[type="button"].GhostPurple,
input[type="button"].GhostPurple:focus {
  border-radius: 20px;
  border: 2px solid #5a3cdb;
  color: #5a3cdb !important;
  text-transform: uppercase;
  background-color: transparent;
  display: inline-block;
}

a.GhostPurple:hover,
input[type="button"].GhostPurple:hover {
  background-color: #5a3cdb;
  color: #fff !important;
  text-decoration: none !important;
}

a.white-btn {
  border-radius: 50px;
  background-color: #fff;
  text-transform: uppercase;
  padding: 5px 20px;
  border: solid 2px #fff;
  text-decoration: none !important;
  color: #111 !important;
  display: inline-block;
}

a.white-btn:hover {
  background-color: transparent;
  color: #fff !important;
}

.Centered {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -moz-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.wsSmallFont {
  font-size: small;
}

/* Select */
.wsPanelSelect .wsScrollTrack {
  background: none repeat scroll 0 0 #cfd7e0;
}

.wsPanelSelect .wsScrollBar {
  background: none repeat scroll 0 0 #b0bdcb;
}

.wsPanelSelect .wsScrollBar:hover {
  background: none repeat scroll 0 0#72808e;
}

.wsPanelSelect .naSelectList,
.naSelectList.wsPanelSelect {
  border: 1px solid #cfd7e0;
  border-top: none;
}

.wsPanelSelect .naSelectBody,
.wsPanelSelect .naSelectOption {
  background-color: #fff;
  color: #000;
}

.wsPanelSelect .naSelectOpen {
  background-image: url(file/app/1/editor/icon/selector.svg?color1=r0g0b0);
}

.wsPanelSelect .naSelectOption:hover {
  background-color: #0bafc2;
}

.wsPanelSelect .naSelectBody {
  border: 1px solid #cfd7e0;
  height: 30px;
}

.wsPanelSelect.wsGrisSelect .naSelectBody,
.wsPanelSelect.wsGrisSelect .naSelectOption {
  background-color: #dedede;
  border-color: #ddd;
}

.wsPanelSelect.wsGrisSelect .naSelectOption {
  padding-left: 18px;
}

.wsPanelSelect.wsGrisSelect .naSelectBody {
  height: 40px;
  padding: 10px;
  line-height: 1;
}

.wsPanelSelect.wsGrisSelect .naSelectOption:hover {
  background-color: #0bafc2;
}

.Select .naSelectBody {
  border-radius: 4px;
}

.Select .naSelectOpen {
  background-image: url(file/app/1/editor/icon/selector.svg?color1=r255g255b255);
  width: 30px;
  background-color: #0bafc2;
}

/* Social */
input.facebook,
input.facebook:hover {
  background-color: #1777f1;
}

.socialWrapperFacebook:hover input.facebook {
  background: #1777f1;
  color: white;
}

.socialWrapperGoogle:hover input.google {
  background: #4285f4;
  color: white;
}

input.google,
input.google:hover {
  background-color: #4285f4;
}

a.twitter,
input.twitter,
.twitter {
  background-color: #00acee;
}

a.twitter:hover,
input.twitter:hover .twitter:hover {
  background-color: #22cfff;
}

/* ====================================== */
/* ================ Menu  =============== */
/* ====================================== */

.Menu {
  position: fixed;
  top: 0px;
  left: 0px;
  right: 0px;
  z-index: 2;
  background-color: #121922;
  max-height: 48px;
}

.Menu .pure-g {
  padding: 0px 10px;
}

.Menu .pure-g > div {
  padding: 0;
}

.Entete .wsHiddenSitesMenu a,
.Menu a {
  text-decoration: none;
  color: #fff;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 12px 20px;
  display: inline-block;
}

.Menu a {
  padding: 12px 18px;
}

.Menu a:not([href]) {
  cursor: default;
}

.Menu .wsLogoPanel {
  background-image: url(file/app/2/logo/logo.svg?color1=r255g255b255);
  background-repeat: no-repeat;
  background-size: 80px auto;
  display: inline-block;
  background-position: 10px center;
  padding: 0 40px 0 10px;
  color: transparent;
  height: 100%;
  vertical-align: top;
  max-height: 48px;
}

.Menu .MenuLeft {
  white-space: nowrap;
}

.Entete .wsHiddenSitesMenu .MenuSiteList .SiteListUrl,
.Menu .wsHiddenSitesMenu .MenuSiteList .SiteListUrl {
  display: none;
}

.Menu .wsReturnToSites {
  cursor: pointer;
}

.Entete .MenuSiteList span,
.Menu .MenuSiteList span {
  display: none;
}

.Menu .MenuCenter .activeLink:not(.wsLogoPanel) {
  pointer-events: none;
  cursor: default;
  color: #fff;
}

@media screen and (min-width: 1280px) {
  .Entete .MenuSiteList span,
  .Menu .MenuSiteList span {
    display: block;
  }

  .Menu a {
    color: #b0bdcb;
  }

  .Menu a:hover {
    color: #d2dfed;
  }

  .Menu .MenuDesktop.Help {
    padding-left: 40px;
    background-image: url(/file/app/2/general/Aide-Bulle.svg?color1=r204g204b204);
    background-repeat: no-repeat;
    background-size: 20px auto;
    background-position: 10px center;
  }

  .Menu .MenuRight a {
    color: #b0bdcb;
  }

  .Menu .MenuRight a:hover {
    color: #d2dfed;
  }

  .Menu .wsLogoPanel:hover {
    background-color: transparent;
    color: transparent;
  }

  .Menu .OpenHidden {
    position: relative;
  }

  .Menu .OpenHidden,
  .Menu .wsMenuMySites {
    display: inline-block;
  }

  .Menu a.MyAccountMenu {
    padding-left: 40px;
    background-image: url(/file/app/2/menu/avatar.png);
    background-repeat: no-repeat;
    background-size: 25px auto;
    background-position: 10px center;
    position: relative;
    padding-right: 30px;
  }

  .Menu a.MyAccountMenu:after {
    content: "";
    width: 7px;
    display: inline-block;
    margin-left: 10px;
    height: 7px;
    border-right: solid 2px #b0bdcb;
    border-bottom: solid 2px #b0bdcb;
    transform: rotate(45deg);
    position: absolute;
    top: 18px;
    transition: all 0.2s;
  }

  .OpenHidden.open a.MyAccountMenu:after {
    transform: rotate(-135deg);
    top: 21px;
  }

  .Menu a.MyAccountMenu:hover,
  .Menu a.wsMenuMySites:hover {
    color: #fff;
  }

  .Menu .wsMenuMySites:after {
    border-color: #72808e;
    border-style: solid;
    border-width: 0.15em 0.15em 0 0;
    content: "";
    display: inline-block;
    height: 0.2em;
    right: -0.6em;
    position: relative;
    top: 9px;
    -ms-transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
    vertical-align: top;
    width: 0.2em;
    transition: 0.1s all linear;
  }

  .Menu .OpenHidden.open .wsMenuMySites:after {
    border-style: solid;
    border-width: 0.15em 0.15em 0 0;
    content: "";
    display: inline-block;
    height: 0.3em;
    right: -0.6em;
    position: relative;
    position: relative;
    top: 10px;
    -ms-transform: rotate(315deg);
    -webkit-transform: rotate(315deg);
    transform: rotate(315deg);
    vertical-align: top;
    width: 0.3em;
    border-color: #72808e;
  }

  .Entete .wsHiddenSitesMenu,
  .Menu .wsHiddenSitesMenu {
    position: fixed;
    background-color: #2a343f;
    padding-bottom: 0;
    left: 103px;
    width: 480px;
    font-size: 13px;
    top: 48px;
    box-shadow: 0 6px 6px 1px rgba(0, 0, 0, 0.5);
    display: none;
    overflow: hidden;
    color: #fff;
    max-height: 1000px;
    max-height: 85vh;
  }

  .wsHiddenSitesMenu .HiddenMenuInner {
    width: 100%;
    height: 100%;
    overflow: hidden;
  }

  .Entete .wsHiddenSitesMenu .wsCreateSite,
  .Menu .wsHiddenSitesMenu .wsCreateSite {
    background-color: #121922;
    color: #72808e;
    padding: 15px 20px 15px 90px;
    position: relative;
    font-size: 18px;
  }

  .Entete .wsHiddenSitesMenu .wsCreateSite:before,
  .Menu .wsHiddenSitesMenu .wsCreateSite:before {
    color: #15db72;
    content: "+";
    font-size: 35px;
    position: absolute;
    left: 35px;
    top: 2px;
  }

  .Entete .wsHiddenSitesMenu div.wsAllSites,
  .Menu .wsHiddenSitesMenu div.wsAllSites {
    padding: 0 0 0 20px;
    color: #555;
  }

  /*.Entete .wsHiddenSitesMenu > div.wsAllSites span,
    .Menu .wsHiddenSitesMenu > div.wsAllSites span
    {
        display: inline-block;
    }*/

  .Entete .wsHiddenSitesMenu .MenuSiteList,
  .Menu .wsHiddenSitesMenu .MenuSiteList {
    border-bottom: 1px solid #cfd7e0;
    position: relative;
    height: 87px;
  }

  .Entete .wsHiddenSitesMenu .MenuSiteList > div,
  .Menu .wsHiddenSitesMenu .MenuSiteList > div {
    padding-right: 40px;
  }

  .Entete .wsHiddenSitesMenu .MenuSiteList:after,
  .Menu .wsHiddenSitesMenu .MenuSiteList:after {
    content: "gratuit";
    transform: rotate(90deg);
    transform-origin: left top 0;
    position: absolute;
    float: right;
    margin: 0 auto;
    line-height: 20px;
    text-align: center;
    width: 87px;
    color: #fff;
    text-transform: uppercase;
    font-size: 11px;
    background-color: #45525f;
  }

  .Entete .wsHiddenSitesMenu .MenuSiteList.En:after,
  .Menu .wsHiddenSitesMenu .MenuSiteList.En:after {
    content: "free";
  }

  .Entete .wsHiddenSitesMenu .MenuSiteList.Es:after,
  .Menu .wsHiddenSitesMenu .MenuSiteList.Es:after {
    content: "gratuito";
  }

  .Entete .wsHiddenSitesMenu .MenuSiteList.basic:after,
  .Menu .wsHiddenSitesMenu .MenuSiteList.basic:after {
    content: "basic";
    background-color: #15db72;
  }

  .Entete .wsHiddenSitesMenu .MenuSiteList.pro:after,
  .Menu .wsHiddenSitesMenu .MenuSiteList.pro:after {
    content: "pro";
    background-color: #15db72;
  }

  .Entete .wsHiddenSitesMenu .MenuSiteList.business:after,
  .Menu .wsHiddenSitesMenu .MenuSiteList.business:after {
    content: "business";
    background-color: #15db72;
  }

  .Entete .wsHiddenSitesMenu .MenuSiteList.ecommerce:after,
  .Menu .wsHiddenSitesMenu .MenuSiteList.ecommerce:after {
    content: "ecommerce";
    background-color: #15db72;
  }

  .Entete .wsHiddenSitesMenu .MenuSiteList.explore:after,
  .Menu .wsHiddenSitesMenu .MenuSiteList.explore:after {
    content: "explore";
    background-color: #15db72;
  }

  .Entete .wsHiddenSitesMenu .MenuSiteList.growth:after,
  .Menu .wsHiddenSitesMenu .MenuSiteList.growth:after {
    content: "growth";
    background-color: #15db72;
  }

  .Entete .wsHiddenSitesMenu .MenuSiteList.advanced:after,
  .Menu .wsHiddenSitesMenu .MenuSiteList.advanced:after {
    content: "advanced";
    background-color: #15db72;
  }

  .Entete .wsHiddenSitesMenu .MenuSiteList.vip:after,
  .Menu .wsHiddenSitesMenu .MenuSiteList.vip:after {
    content: "vip";
    background-color: #15db72;
  }

  .Entete .wsHiddenSitesMenu .MenuSiteList.explore.Fr:after,
  .Menu .wsHiddenSitesMenu .MenuSiteList.explore.Fr:after {
    content: "Découverte";
    background-color: #15db72;
  }

  .Entete .wsHiddenSitesMenu .MenuSiteList.growth.Fr:after,
  .Menu .wsHiddenSitesMenu .MenuSiteList.growth.Fr:after {
    content: "Croissance";
    background-color: #15db72;
  }

  .Entete .wsHiddenSitesMenu .MenuSiteList.advanced.Fr:after,
  .Menu .wsHiddenSitesMenu .MenuSiteList.advanced.Fr:after {
    content: "Avancé";
    background-color: #15db72;
  }

  .Entete .wsHiddenSitesMenu .MenuSiteList .SiteListUrl,
  .Menu .wsHiddenSitesMenu .MenuSiteList .SiteListUrl {
    display: block;
    color: #b0bdcb;
    padding: 0px 0px 0px 20px;
    font-size: 14px;
    padding-bottom: 4px;
  }

  .Entete .MenuSiteList a,
  .Menu .MenuSiteList a {
    line-height: 1.2;
    padding-top: 0;
    padding-bottom: 0;
  }

  .Entete .MenuSiteList div > span,
  .Menu .MenuSiteList div > span {
    display: inline-block;
    padding-left: 5px;
    color: #fff;
  }

  .Entete .MenuSiteList div > div,
  .Menu .MenuSiteList div > div {
    padding-left: 15px;
  }

  .Entete .MenuSiteList div > div > span > a,
  .Menu .MenuSiteList div > div > span > a {
    font-size: 13px;
    padding: 0;
    line-height: initial;
  }

  .Entete .wsHiddenSitesMenu .MenuSiteList > a,
  .Menu .wsHiddenSitesMenu .MenuSiteList > a {
    width: 25%;
    height: 61px;
    vertical-align: 8px;
    background-color: #cfd7e0;
    padding: 0;
  }

  .Entete .wsHiddenSitesMenu img,
  .Menu .wsHiddenSitesMenu img {
    width: 100%;
    height: 100%;
  }

  .Entete .wsHiddenSitesMenu .MenuSiteList > a,
  .Menu .wsHiddenSitesMenu .MenuSiteList > a {
    display: inline-block;
    margin-top: 12px;
  }

  .Entete .wsHiddenSitesMenu .MenuSiteList > div,
  .Menu .wsHiddenSitesMenu .MenuSiteList > div {
    width: 75%;
    display: inline-block;
    padding-top: 10px;
    vertical-align: 8px;
  }

  .Entete .wsHiddenSitesMenu a,
  .Menu .wsHiddenSitesMenu a {
    color: #fff;
    display: inline-block;
    font-size: 18px;
    padding-bottom: 0;
  }

  .Entete .wsHiddenSitesMenu a:hover,
  .Menu .wsHiddenSitesMenu a:hover {
    color: #555;
  }

  .Entete.wsActualSite,
  .Entete .wsActualSite:hover,
  .Menu .wsActualSite,
  .Menu .wsActualSite:hover {
    padding: 0 0 0 5px;
    height: auto;
    color: #72808e;
    max-width: 130px;
    cursor: pointer;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: inline-block;
    vertical-align: top;
  }

  .Entete .wsHiddenSitesMenu > div.wsAllSites a:hover,
  .Menu .wsHiddenSitesMenu > div.wsAllSites a:hover {
    color: #72808e;
  }

  .Entete .wsHiddenSitesMenu > div.wsReturnToSites:hover,
  .Entete .wsHiddenSitesMenu > div.wsCreateSite:hover,
  .Menu .wsHiddenSitesMenu > div.wsReturnToSites:hover,
  .Menu .wsHiddenSitesMenu > div.wsCreateSite:hover {
    cursor: pointer;
    background-color: #555;
    color: #fff;
  }

  .wsCreateSite {
    cursor: pointer;
  }

  .Entete .wsHiddenSitesMenu hr,
  .Menu .wsHiddenSitesMenu hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #cfd7e0;
    padding: 0;
    margin: 0 15px;
  }
}

.Menu .MyAccountHiddenMenu {
  display: none;
  position: absolute;
  background-color: #121922;
  z-index: 1;
  white-space: nowrap;
  margin-top: 0px;
  right: 0px;
}

.Entete .HiddenMenu a,
.Menu .HiddenMenu a {
  display: block;
}

.Entete .MenuSiteList a,
.Entete .MenuSiteList span,
.Menu .MenuSiteList a,
.Menu .MenuSiteList span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: pre;
}

.Entete.open,
.Menu.open {
  max-height: 48px;
}

.Entete .wsHiddenSitesMenu .MenuSiteList img,
.Menu .wsHiddenSitesMenu .MenuSiteList img {
  display: none;
}

.Entete .wsMenuMySites,
.Menu .wsMenuMySites {
  white-space: nowrap;
  overflow: hidden;
}

/* MOBILE menu */
@media screen and (max-width: 1279px) {
  .Menu .MenuDesktop {
    display: none !important;
  }

  .Menu .Logout {
    padding-left: 40px;
    background-image: url("");
    background-size: 20px auto;
    background-repeat: no-repeat;
  }

  .Menu a.SideMenuIcon {
    position: absolute;
    right: 20px;
    top: 12px;
    width: 20px;
    height: 20px;
    cursor: pointer;
    display: block;
    font-size: 0;
  }

  .custom-toggle .bar {
    background-color: #fff;
    display: block;
    width: 20px;
    height: 2px;
    border-radius: 100px;
    position: absolute;
    top: 9px;
    right: 0px;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -ms-transition: all 0.5s;
    transition: all 0.5s;
  }

  .custom-toggle .bar:nth-of-type(1) {
    -webkit-transform: translateY(-6px);
    -moz-transform: translateY(-6px);
    -ms-transform: translateY(-6px);
    transform: translateY(-6px);
  }

  .custom-toggle .bar:nth-of-type(3) {
    -webkit-transform: translateY(6px);
    -moz-transform: translateY(6px);
    -ms-transform: translateY(6px);
    transform: translateY(6px);
  }

  .custom-toggle.x .bar {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
  }

  .custom-toggle.x .bar:nth-of-type(1) {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }

  .custom-toggle.x .bar:nth-of-type(3) {
    opacity: 0;
    -webkit-transform: translateY(12px);
    -moz-transform: translateY(12px);
    -ms-transform: translateY(12px);
    transform: translateY(12px);
  }

  .Menu {
    max-height: 48px;
    overflow: hidden;
    transition: max-height 0.5s cubic-bezier(0, 0, 0.2, 1);
  }

  .Menu a {
    padding: 5px 20px;
    margin: 5px 0;
  }

  .Menu .wsActualSite.wsSiteOnly {
    max-width: 60%;
    display: inline-block;
    overflow: hidden;
    vertical-align: top;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .Menu .MenuSiteList > a {
    display: none;
  }

  .Menu .MenuSiteList > div > a {
    padding-top: 0;
    padding-bottom: 0;
  }

  .Menu .MenuSiteList a.active {
    color: #72808e;
    position: relative;
  }

  .Menu .MenuSiteList a.active:after {
    position: absolute;
    left: 0;
    top: 6px;
    content: "\2713";
  }

  .Menu .MenuRight.textRight,
  .Menu .MenuCenter.textCenter {
    text-align: left;
  }

  .Menu .MyAccountHiddenMenu {
    position: initial;
    display: block;
    padding-top: 10px;
  }

  .Menu .MyAccountHiddenMenu a:last-of-type {
    padding: 20px 60px;
    background-image: url(/file/app/2/general/Logout.svg?color1=r255g255b255);
    background-repeat: no-repeat;
    background-size: auto 25px;
    background-position: 20px center;
    border-top: 2px solid #72808e;
  }

  .Menu .wsWebSiteName {
    display: block !important;
  }

  .Menu.open {
    max-height: 100%;
    overflow-y: scroll;
  }

  .Menu .MyAccountHiddenMenu,
  .Menu > .pure-g > div,
  .Menu > .pure-g > div > * {
    display: block;
    width: 100%;
  }

  .Menu .wsMenuMySites {
    padding-top: 10px;
  }

  .Menu .wsMenuMySites,
  .Menu .MyAccountMenu,
  .Menu .WhiteLabelMenu {
    width: 100%;
    position: relative;
    cursor: pointer;
  }

  .Menu .WhiteLabelMenu:after,
  .Menu .wsMenuMySites:after {
    border-color: #72808e;
    border-style: solid;
    border-width: 0.15em 0.15em 0 0;
    content: "";
    display: inline-block;
    height: 0.6em;
    right: 23px;
    position: absolute;
    top: 9px;
    -ms-transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
    vertical-align: top;
    width: 0.6em;
  }

  .Menu .OpenHidden.open .WhiteLabelMenu:after,
  .Menu .OpenHidden.open .wsMenuMySites:after {
    border-style: solid;
    border-width: 0.15em 0.15em 0 0;
    content: "";
    display: inline-block;
    height: 0.6em;
    right: 23px;
    position: absolute;
    top: 12px;
    -ms-transform: rotate(315deg);
    -webkit-transform: rotate(315deg);
    transform: rotate(315deg);
    vertical-align: top;
    width: 0.6em;
    border-color: #72808e;
  }

  .Menu .pure-g {
    padding: 2px 0px;
  }

  .Menu .wsLogoPanel {
    margin: 10px;
    display: inline-block !important;
    width: 100px !important;
    height: 30px;
  }

  .Menu .OpenHidden {
    border-top: 1px solid #72808e;
  }

  .Menu .OpenHidden.open {
    background-color: #2a343f;
    transition: 0.1s all linear;
  }

  .Menu .wsHiddenSitesMenu {
    display: none;
    padding: 5px 20px 15px 30px;
  }

  .Menu .MenuCenter > a:last-of-type {
    padding-bottom: 15px;
  }
}

/* Full size menu */

@media screen and (min-width: 1280px) {
  .Menu a.SideMenuIcon,
  .Menu .MenuMobile {
    display: none !important;
  }

  .Menu .wsMenuMySites {
    width: 240px;
  }

  .Menu .open .MyAccountMenu,
  .Menu .open .wsMenuMySites {
    background-color: #2a343f;
  }

  .Entete .wsHiddenSitesMenu .MenuSiteList img,
  .Menu .wsHiddenSitesMenu .MenuSiteList img {
    display: initial;
  }

  .Menu .WhiteLabelHiddenMenu {
    display: none;
    position: absolute;
    background-color: #121922;
    z-index: 1;
    white-space: nowrap;
    margin-top: 0px;
    right: 0px;
  }

  .Menu .OpenHidden {
    display: inline-block;
  }
}

/* Menu WhiteLabel */

.MenuWhiteLabel .wsMenu {
  -webkit-flex: 0 0 195px;
  flex: 0 0 195px;
  -ms-flex: 0 0 195px;
  height: 100%;
  background-color: #2a343f;
  position: relative;
  color: #fff;
  overflow: auto;
  width: 195px;
  height: 100%;
  position: fixed;
  top: 59px;
  left: 0;
  z-index: 2;
}

.MenuWhiteLabel .wsMenu .wsMenuItem a,
.MenuWhiteLabel .wsMenu {
  color: #fff;
}

.MenuWhiteLabel .wsMenu .wsMenuItem {
  padding: 15px 10px 10px 30px;
}

.MenuWhiteLabel .wsMenu > div.wsChecked {
  background-color: #0bafc2;
}

.MenuWhiteLabel .mobileMenuClose {
  display: none;
}

.MenuWhiteLabel .mobileMenuTrigger {
  position: fixed;
  display: none;
  color: #fff;
  z-index: 2;
  text-transform: uppercase;
  right: 10px;
  top: 8px;
  cursor: pointer;
  background-image: url("file/app/1/editor/icon/menu.svg?color1=r255g255b255");
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: center;
  width: 18px;
  height: 18px;
}

@media screen and (max-width: 1000px) {
  .MenuWhiteLabel .wsMenu {
    position: absolute;
    z-index: 2;
    overflow-x: hidden;
    margin-right: -195px;
    width: 195px;
    left: auto;
    right: 0;
    top: 33px;
  }

  .MenuWhiteLabel .wsMenu * {
    overflow: hidden;
  }

  .MenuWhiteLabel .wsMenu.open {
    margin-right: 0;
    transition: all 0.1s linear;
  }

  .MenuWhiteLabel .mobileMenuClose {
    position: fixed;
    font-size: 30px;
    transform: rotate(45deg);
    right: 10px;
    top: -5px;
    cursor: pointer;
    z-index: 3;
    color: #fff;
    display: none;
  }

  .MenuWhiteLabel .mobileMenuClose.open {
    display: block;
  }

  .MenuWhiteLabel .mobileMenuClose:hover {
    background-color: transparent;
    color: #ef2626;
  }

  .MenuWhiteLabel .mobileMenuTrigger.open {
    display: block;
  }

  .MenuWhiteLabel .wsMenu .ChildWrapper .wsChecked {
    border: none;
  }

  .MenuWhiteLabel .wsMenu > div:not(wsChecked) > .wsMenuItem {
    border-bottom: 1px solid #121922;
  }

  .MenuWhiteLabel .wsMenu > div:not(.wsChecked) {
    border-bottom: 1px solid #2a343f;
  }
}

/*Content*/
.Container {
  background-color: White;
  overflow: auto;
}

.Container > .Content {
  position: fixed;
  top: 48px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  z-index: 0;
  overflow: auto;
  overflow-x: hidden;
}

.Container > .Content > .Section {
  padding: 45px 0px 45px 30px;
  position: relative;
  width: 975px;
}

.Container > .Content > .Section.Small {
  padding: 25px 0 25px 30px;
}

.Content a,
.Content a:active,
.Content a:hover,
.Content a:visited {
  color: #44ADFD;
  text-decoration: none;
}

.Content a:hover {
  text-decoration: underline;
}

/* Divisions du Content */
.wsRow p {
  color: #858688;
  font-size: 15px;
  margin: 5px 0 15px 0;
}

.wsRow .wsReference {
  font-size: 90%;
  color: #858688;
}

.wsRow a {
  font-size: 15px;
}

.wsRow .wsReference > a {
  font-size: 15px;
  color: #858688;
}

.wsRow .wsSecondTitle {
  font-size: 130%;
  margin-bottom: 15px;
  padding-top: 22px;
}

.wsPartenairesFullBorder,
.wsPartenairesBorder {
  padding: 1em 1.6em;
}

.wsPartenairesFullBorder > div,
.wsPartenairesBorder > div {
  border: 1px solid #cfd7e0;
  border-radius: 3px;
  box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.2);
  padding: 2em;
}

.wsPartenairesFullBorder .pure-u-1 {
  position: relative;
  margin-bottom: 4em;
}

.wsPartenairesFullBorder .pure-u-1:last-child {
  margin-bottom: 2em;
}

.wsPartenairesFullBorder.wsCommerciaux a {
  top: 180px !important;
}

.wsVisitSiteFull {
  position: absolute;
  top: 200px;
}

.wsSecondTitle {
  font-size: 130%;
  margin-bottom: 15px;
}

.wsSingleBorder {
  border: 1px solid #cfd7e0;
  border-radius: 3px;
  box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.2);
  padding: 2em;
  height: 318px;
}

.wsVisitSite {
  position: absolute;
  bottom: 40px;
}

.wsVisitSite.Booxi {
  top: 300px;
}

@media screen and (max-width: 63.9999em) {
  .wsVisitSiteFull,
  .wsVisitSite {
    position: relative;
    bottom: initial;
    top: initial;
  }

  .wsSingleBorder {
    height: auto;
  }

  .wsPartenairesContainer img {
    max-width: 100%;
    height: auto;
  }

  .wsVisitSite.Booxi {
    top: 0 !important;
  }

  .forfaitHeader .giantText,
  .forfaitHeader .symbol {
    font-size: 1.5em !important;
  }

  .forfaitHeader .bigText .thinText {
    font-size: 0.54em !important;
  }

  .forfaitHeader .bigText .nanoText {
    line-height: 1.3em !important;
    margin-top: 8px;
    display: block;
  }
}

/* Account Tabs */
.wsBillingTabs {
  background-color: #cfd7e0;
  padding: 5px 10px;
  font-size: 16px !important;
  margin-left: 5px;
  border-radius: 3px;
  text-decoration: none !important;
  color: #121922 !important;
  display: inline-block;
  margin-top: -10px;
  vertical-align: middle;
}

.wsBillingTabs:hover {
  background-color: #eee;
}

.wsBillingTabs:first-of-type {
  margin-left: 25px;
}

.wsBillingTabs.active {
  background-color: #eee;
}

#TooltipWrapper {
  position: fixed;
  top: 0px;
  left: 0px;
  right: 0px;
  height: 0px;
  z-index: 2;
  font-family: "Signika", sans-serif;
}

#TooltipWrapper .wsTooltip {
  display: none;
  position: absolute;
  background-color: #fff;
  color: #121922;
  z-index: 1;
  border-radius: 3px;
  max-width: 275px;
  padding: 12px;
  font-size: 9pt;
  box-shadow: 2px 2px 8px rgba(0, 0, 0, 0.5);
}

#TooltipWrapper .wsTooltip:after {
  content: "";
  position: absolute;
}

#TooltipWrapper .wsTooltipLeft:after {
  right: -8px;
  top: calc(50% - 8px);
  border-left: 8px solid #fff;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
}

#TooltipWrapper .wsTooltipTop:after {
  bottom: -8px;
  left: calc(50% - 8px);
  border-top: 8px solid #fff;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
}

#TooltipWrapper .wsTooltipRight:after {
  left: -8px;
  top: calc(50% - 8px);
  border-right: 8px solid #fff;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
}

#TooltipWrapper .wsTooltipBottom:after {
  top: -8px;
  left: calc(50% - 8px);
  border-bottom: 8px solid #fff;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
}

/* Offres */
.wsOffre .WSWrapper {
  max-width: 1100px;
}

.wsOffre h1 {
  border: none;
  text-align: center;
  text-transform: none;
  font-size: 40px;
  margin: 0px;
}

.wsOffre h2 {
  text-align: center;
  font-weight: 500;
}

.wsOffre .wsSecondTitle {
  text-align: center;
  padding-top: 0;
  margin-bottom: 50px;
}

p.creditCards {
  margin: 15px 0;
}

#changeCycle h2 {
  font-size: 32px;
  font-weight: 600;
  margin-bottom: 10px;
}

/* == Page Forfaits ==*/

.fondBlanc {
  background-color: #fff;
}

.fondGris {
  background-color: #f1f1f1;
}

.fondGrisMoyen {
  background-color: #e0e7ef;
}

.giantText {
  font-size: 3em;
  font-weight: 300;
}

.fondTurquoise {
  background-color: #0bafc2;
}

.fondNoir {
  background-color: #1f1f1f;
}

.fondGradiantTurquoise {
  background: #469dae; /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(
    #48ced9,
    #469dae
  ); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(#48ced9, #469dae); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(
    #48ced9,
    #469dae
  ); /* For Firefox 3.6 to 15 */
  background: linear-gradient(#48ced9, #469dae); /* Standard syntax */
}

.forfaits .forfait p {
  margin: 0;
}

.forfaitHeader > h3 {
  margin-bottom: 0em;
  margin-top: 0.5em;
  font-size: 1.4em !important;
  font-weight: 600;
}

.forfaits .wsPlanSelect {
  margin: 1em 0 0.5em;
}

.forfaitHeader span {
  line-height: 0.6;
}

.forfaitHeader input {
  margin: 0.8em 0 1.5em 0;
  padding: 0.8em 2.2em;
}

.forfaits .forfait .forfaitHeader p {
  margin: 0em;
}

.forfaitHeader .button-blanc {
  background-color: #fff;
  border-radius: 100px;
  text-transform: uppercase;
  color: #1f1f1f;
  font-size: 0.95em;
  padding: 0.4em 1.8em;
  -webkit-transition: all 200ms linear;
  transition: all 200ms linear;
  font-weight: 600;
  border: solid thin #ccc;
}

.forfaitHeader .button-blanc:hover {
  background-color: #eee;
  border: solid thin #ccc;
}

.forfaits .ActualPlan {
  font-size: 16.8px;
  margin: 1em 0 0.5em;
  border-radius: 3px;
  display: inline-block;
  padding: 0.25em 2.2em;
  background-color: #fff;
  border-radius: 30px;
  color: #121922;
  text-transform: uppercase;
}

.forfaitsFaq div {
  margin: 0;
}

.forfaitsFaq div > p,
.forfaitsFaq div > h3 {
  padding: 0 0 0 25px;
  margin: 8px 0;
  position: relative;
  cursor: pointer;
  font-size: 17px;
}

.forfaitsFaq div > h3 {
  font-weight: bold;
}

.forfaitsFaq div > h3:before {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 8px 6px 0 6px;
  border-color: #adadad transparent transparent transparent;
  position: absolute;
  left: 0px;
  top: 12px;
}

.forfaitsFaq div.open > h3:before {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 6px 8px 6px;
  border-color: transparent transparent #adadad transparent;
  position: absolute;
  left: 0px;
  top: 12px;
}

.forfaitsFaq div > p {
  display: none;
}

#wsForfaitsSitesListWrapper {
  display: none;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: rgba(255, 255, 255, 0.8);
  position: fixed;
  z-index: 2;
}

#wsForfaitsSitesListWrapper > div {
  background-color: #121922;
  margin: 0 auto;
  margin-top: 100px;
  max-width: 500px;
  color: #fff;
  position: relative;
  border-radius: 3px;
  box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.5);
}

#wsForfaitsSitesListWrapper .wsListSiteTitle {
  font-size: 14pt;
  padding: 10px 16px;
  border-bottom: 1px solid #000;
  box-shadow: 0 -1px 0 #333 inset;
}

#wsForfaitsSitesListWrapper .wsCloseListSite {
  font-weight: bolder;
  position: absolute;
  right: 16px;
  top: 10px;
  cursor: pointer;
  font-size: 14pt;
}

#wsForfaitsSitesListWrapper .wsCloseListSite:hover {
  color: #ff0000;
}

#wsForfaitsSitesListWrapper .wsSitesGallery {
  display: flex;
  display: -webkit-flex;
  justify-content: space-between;
  -webkit-justify-content: space-between;
  height: 285px;
}

#wsForfaitsSitesListWrapper .wsSitesGalleryLeft {
  flex: 1;
  -webkit-flex: 1;
  position: relative;
  cursor: pointer;
}

#wsForfaitsSitesListWrapper .wsSitesGalleryLeft:after {
  font-family: Verdana, sans-serif;
  content: "\2039";
  background-color: #666;
  border-radius: 50%;
  color: #2a343f;
  font-size: 3em;
  height: 40px;
  line-height: 0.72;
  padding-left: 8px;
  position: absolute;
  right: 0;
  top: 40%;
  width: 32px;
}

#wsForfaitsSitesListWrapper .wsSitesGalleryLeft:hover:after {
  font-family: Verdana, sans-serif;
  content: "\2039";
  background-color: #aaa;
  border-radius: 50%;
  color: #2a343f;
  font-size: 3em;
  height: 40px;
  line-height: 0.72;
  padding-left: 8px;
  position: absolute;
  top: 40%;
  right: 0;
  width: 32px;
}

#wsForfaitsSitesListWrapper .wsSitesGalleryRight {
  flex: 1;
  -webkit-flex: 1;
  position: relative;
  cursor: pointer;
}

#wsForfaitsSitesListWrapper .wsSitesGalleryRight:after {
  font-family: Verdana, sans-serif;
  content: "\203A";
  background-color: #666;
  border-radius: 50%;
  color: #2a343f;
  font-size: 3em;
  height: 40px;
  line-height: 0.72;
  padding-left: 10px;
  position: absolute;
  top: 40%;
  left: 0;
  width: 30px;
}

#wsForfaitsSitesListWrapper .wsSitesGalleryRight:hover:after {
  font-family: Verdana, sans-serif;
  content: "\203A";
  background-color: #aaa;
  border-radius: 50%;
  color: #2a343f;
  font-size: 3em;
  height: 40px;
  line-height: 0.72;
  padding-left: 10px;
  position: absolute;
  top: 40%;
  left: 0;
  width: 30px;
}

#wsForfaitsSitesListWrapper #wsForfaitsSitesList {
  padding: 2em 1.2em;
  flex: 6;
  -webkit-flex: 6;
  position: relative;
  max-width: 385px;
}

#wsForfaitsSitesListWrapper .wsForfaitSelectSite {
  max-width: 100%;
  text-align: center;
  position: relative;
}

#wsForfaitsSitesListWrapper .wsForfaitSelectSite a {
  color: #fff;
}

#wsForfaitsSitesListWrapper .wsForfaitSelectSite a:hover {
  color: #0bafc2;
}

#wsForfaitsSitesListWrapper .wsForfaitSelectSite > div {
  height: 188px;
  margin-bottom: 20px;
}

#wsForfaitsSitesListWrapper .wsForfaitSelectSite > div > div {
  display: inline-block;
  position: relative;
}

#wsForfaitsSitesListWrapper .wsForfaitSelectSite .wsImagesContainer {
  height: 188px;
}

#wsForfaitsSitesListWrapper .wsForfaitSelectSite .wsMainImage {
  z-index: 2;
}

#wsForfaitsSitesListWrapper .wsPrecImage,
#wsForfaitsSitesListWrapper .wsNextImage {
  position: absolute !important;
  width: 240px;
  height: 150px;
  top: 20px;
  left: 0;
  text-align: center;
  opacity: 0.3;
}

#wsForfaitsSitesListWrapper .wsNextImage {
  right: 0px;
  left: auto;
}

#wsForfaitsSitesListWrapper .wsPrecImage div,
#wsForfaitsSitesListWrapper .wsNextImage div {
  height: 100%;
  width: 100%;
  background-color: #2a343f;
}

#wsForfaitsSitesListWrapper .wsPrecImage img,
#wsForfaitsSitesListWrapper .wsNextImage img {
  height: 100%;
  width: auto;
}

#wsForfaitsSitesListWrapper .wsForfaitSelectImage {
  width: 301px;
  height: auto;
  max-height: 188px;
  margin: 0 auto;
  z-index: 2;
  background-color: #2a343f;
}

#wsForfaitsSitesListWrapper .wsWebSiteName {
  cursor: pointer;
  text-align: center;
}

#wsForfaitsSitesListWrapper .wsWebSiteName:hover {
  color: #0bafc2;
}

#wsForfaitsSitesListWrapper .wsListSitesFooter {
  padding: 16px;
  border-top: 1px solid #333;
  box-shadow: 0 2px 1px -1px #000 inset;
}

#wsForfaitsSitesListWrapper .wsListSitesFooter > input {
  width: 150px;
  font-size: 16px;
  padding: 8px 12px;
}

#wsForfaitsSitesListWrapper .wsListSitesFooter > input:first-of-type {
  background-color: #45525f;
}

#wsForfaitsSitesListWrapper .wsListSitesFooter > input:first-of-type:hover {
  background-color: #72808e;
}

#wsForfaitsSitesListWrapper .wsListSitesFooter > input:last-of-type {
  float: right;
}

.togglePrice {
  float: right;
  overflow: hidden;
  background-color: #fff;
  border-radius: 50px;
  padding: 3px;
  position: relative;
  width: 200px;
}

.togglePrice div {
  width: 50%;
  float: left;
  position: inherit;
}

.tablePrice {
  display: none;
}

.tablePrice.active {
  display: block;
}

.textLeft {
  text-align: left !important;
}

.togglePrice span {
  display: inline-block;
  padding: 8px 15px;
  text-align: center;
  cursor: pointer;
  transition: 0.3s ease-out;
}

.togglePrice span.active {
  color: #fff;
}

.togglePrice:before {
  content: "";
  width: 50%;
  height: 40px;
  background-color: #0bafc2;
  border-radius: 50px;
  position: absolute;
  right: 43px;
  transform: translateX(40px);
  transition: 0.3s;
}

.togglePrice.left:before {
  left: 43px;
  transform: translateX(-40px);
}

.togglePrice div:first-of-type span {
  text-align: right;
}

@media screen and (max-width: 450px) {
  #wsForfaitsSitesListWrapper {
    overflow-y: scroll;
  }

  #wsForfaitsSitesListWrapper > div {
    margin-top: 50px;
  }

  #wsForfaitsSitesListWrapper .wsSitesGallery {
    position: relative;
    display: block;
  }

  #wsForfaitsSitesListWrapper .wsSitesGalleryRight {
    position: absolute;
    display: block;
    right: 50px;
    top: 0;
    bottom: 0;
    z-index: 3;
  }

  #wsForfaitsSitesListWrapper .wsSitesGalleryLeft {
    position: absolute;
    display: block;
    left: 50px;
    top: 0;
    bottom: 0;
    z-index: 3;
  }
}

@media screen and (max-width: 350px) {
  #wsForfaitsSitesListWrapper .wsListSitesFooter > input {
    padding: 8px 6px;
    width: 100px;
  }
}

.creditCards img {
  margin: 0.8em 0.8em 0.6em 0;
}

.creditCards img:last-child {
  margin-right: 0;
}

.OffresTooltip {
  background-color: #1f1f1f;
  border-radius: 3px;
  z-index: 2;
  color: #fff;
  max-width: 200px;
  padding: 20px;
  text-align: left;
  pointer-events: none;
  font-family: "Signika";
}

.OffresTooltip::before {
  content: "";
  background-color: #1f1f1f;
  width: 15px;
  position: absolute;
  transform: rotate(45deg);
  margin-top: -25px !important;
  margin-left: 75px !important;
  height: 15px;
}

.forfaitPopulaire {
  box-sizing: border-box;
  color: #fff;
  font-size: 1.2em;
  height: 2em;
  padding: 0.35em;
}

.forfaitCommencer {
  display: none;
  margin: 1em 0 0.5em 0;
}

.nonPopulaire {
  display: none;
}

.blockLink {
  text-decoration: none;
  cursor: pointer;
  color: #7e7e7e;
}

.blockLink:hover {
  text-decoration: none;
  color: #333;
}

.blockLink:hover > div {
  background-color: #ddd;
}

.blockLink img {
  width: 14px;
  margin-left: 5px;
}

.forfaits .blockLink > div.fondGris {
  cursor: pointer;
}

.tooltipTitle {
  font-size: 14px;
  text-transform: uppercase;
  margin-bottom: 15px;
}

.helpCursor {
  cursor: help;
}

.tooltipText {
  font-size: 13px;
}

.forfaits a.pure-button {
  margin: 2em 0 1.5em 0;
}

.featuresList {
  text-align: center;
  padding: 20px;
  font-size: 0.95em;
}

.featuresList .featureDesc {
  padding: 1em;
}

.featuresList div p {
  padding: 8px 0px;
}

.featuresList div {
  margin-bottom: 0;
}

.featuresList input {
  margin-bottom: 20px;
}

.forfaitHeader {
  padding-top: 0.3em !important;
  margin-bottom: 5px;
}

.forfaitHeader .bigText {
  margin-top: 0.9em !important;
}

.forfaitHeader .giantText {
  font-size: 2.6em;
}

.forfaitHeader .giantText,
.forfaitHeader .symbol {
  font-weight: 600;
  font-size: 2em;
  letter-spacing: -1.5px;
}

.forfaitHeader > h3 {
  margin-bottom: 0em;
  margin-top: 0em;
  font-size: 2em;
}

.forfaitHeader .nanoText {
  font-size: 0.6em;
}

.forfait {
  padding: 0px 0px 0px 5px !important;
  position: relative;
  overflow: hidden;
}

.forfait:nth-child(1) .forfaitHeader {
  border-top: solid 6px #5a3cdb;
  margin-top: 95px;
}

.forfait:nth-child(2) .forfaitHeader {
  border-top: solid 6px #14d471;
  margin-top: 28px;
}

.forfait:nth-child(3) .forfaitHeader {
  border-top: solid 6px #0dacc2;
}

.forfait:nth-child(4) .forfaitHeader {
  border-top: solid 6px #f3a447;
  margin-top: 28px;
}

.forfait:nth-child(4) .forfaitHeader .bigText,
.forfait:nth-child(2) .forfaitHeader .bigText {
  font-size: 1em !important;
}

.forfait:nth-child(4) .forfaitHeader .bigText .nanoText,
.forfait:nth-child(2) .forfaitHeader .bigText .nanoText {
  font-size: 0.85em !important;
}

#VendorSpecialOffers .forfait:nth-child(1) .forfaitHeader {
  border-top: solid 6px #14d471;
  margin-top: 28px;
}

#VendorSpecialOffers .forfait:nth-child(2) .forfaitHeader {
  border-top: solid 6px #0dacc2;
  margin-top: 0px;
}

#VendorSpecialOffers .forfait:nth-child(3) .forfaitHeader {
  border-top: solid 6px #f3a447;
  margin-top: 28px;
}

#VendorSpecialOffers .forfait:nth-child(2) .forfaitHeader .bigText {
  font-size: 1.65em !important;
}

#VendorSpecialOffers .forfait:nth-child(1) .forfaitHeader .bigText,
#VendorSpecialOffers .forfait:nth-child(3) .forfaitHeader .bigText {
  font-size: 1em !important;
}

.forfaitPopulaire {
  box-sizing: border-box;
  color: #fff;
  font-size: 0.8em;
  height: 1.5em;
  z-index: 1;
  width: 170px;
  padding: 0.15em;
  transform: rotate(45deg);
  position: absolute;
  right: -50px;
  top: 25px;
  text-align: center;
  letter-spacing: 0.5px;
}

.padding-bottom-10 {
  padding-bottom: 10em;
}

.forfaits .featuresList ul {
  list-style: none;
  padding: 0px 0 10px 18px;
  margin: 0;
  text-indent: -5px;
}

.forfaitsCreditCards > p:first-of-type {
  font-size: 40px;
  line-height: 1.2em;
  margin-bottom: 30px;
}

.featuresList .noBorder {
  border: none !important;
  padding-bottom: 1em;
}

.forfaits .featuresList {
  color: #555;
}

.forfaits input {
  text-transform: uppercase;
}

.WrapperOffre {
  text-align: center;
}

.WrapperOffre .pure-u-lg-1-4 .giantText {
  font-size: 2em;
}

.forfaitHeader .bigText .thinText {
  font-weight: 400 !important;
  display: inline-block;
  font-size: 0.74em;
  line-height: 1em;
  color: #555;
  letter-spacing: 0px;
}
/* OLFPV */
.wsOffre .VendorTab.Tab1 {
  float: right;
}

.wsOffre .VendorTab.Tab2 {
  float: left;
}

.wsOffre .VendorTab.Tab1,
.wsOffre .VendorTab.Tab2 {
  color: #0bafc2;
  border-bottom: 3px solid #0bafc2;
  padding: 0 2em 0.5em 2em;
  cursor: pointer;
  text-transform: uppercase;
  font-size: 1.2em;
}

.wsOffre .VendorTab.Tab1.closed,
.wsOffre .VendorTab.Tab2.closed {
  color: #94e2e7;
  border-bottom: 3px solid #94e2e7;
}

.wsOffre .VendorTab.Tab1.closed:hover,
.wsOffre .VendorTab.Tab2.closed:hover {
  color: #0bafc2;
  border-bottom: 3px solid #0bafc2;
}

.tableDetails {
  width: 100%;
  text-align: left;
}

.tableDetails th,
.tableDetails td {
  width: 24%;
  padding: 10px 25px;
  color: #333;
}

.tableDetails tr {
  background-color: #fff;
}

.tableDetails tr:first-child {
  background-color: #fff !important;
  border-bottom: solid 1px #dadcde;
}

.tableDetails .fondBlanc {
  background-color: #fff !important;
}

.tableDetails h3,
.tableDetails p {
  margin: 0px;
}

.tableDetails p {
  font-weight: 400;
}

.tableDetails h3 {
  font-weight: 600 !important;
}

.tableDetails tr th .pure-button,
.tableDetails tr td .pure-button {
  border-radius: 100px;
  font-size: 0.9em;
  text-transform: uppercase;
  margin: 7px 0px;
  font-weight: 400;
  padding: 5px 9px;
  transition: all ease-in-out 0.2s;
  background-color: #fff;
  border: solid thin #ccc;
  color: #aaa;
}

.tableDetails tr td .pure-button {
  width: 100%;
  padding: 7px 9px;
}

.tableDetails tr th .turquoise-button {
  background-color: #0bafc2;
  border: solid thin #0bafc2;
  color: #fff;
}

.tableDetails tr th .turquoise-button:hover {
  background-color: #0a9cad;
  border: solid thin #0a9cad;
  color: #fff;
}

.tableDetails tr td .turquoise-button:hover,
.forfaits input.turquoise-button:hover {
  border: solid thin #0a9cad;
  color: #0a9cad;
  background-color: #fff;
}

.tableDetails tr th .orange-button:hover,
.tableDetails tr td .orange-button:hover,
.forfaits input.orange-button:hover {
  border: solid thin #e49b45;
  color: #e49b45;
  background-color: #fff;
}

.tableDetails tr th .green-button:hover,
.tableDetails tr td .green-button:hover,
.forfaits input.green-button:hover {
  border: solid thin #17ca6e;
  color: #17ca6e;
  background-color: #fff;
}

.tableDetails tr th .purple-button:hover,
.tableDetails tr td .purple-button:hover,
.forfaits a.purple-button:hover {
  border: solid thin #533abf;
  color: #533abf;
  background-color: #fff;
}

.tableDetails tr:nth-child(odd) {
  background-color: #f0f3f8;
}

.tableDetails tr th:nth-child(1),
.tableDetails tr td:nth-child(1) {
  width: 29%;
  padding: 10px 35px;
}

.tableDetails tr th:nth-child(2),
.tableDetails tr td:nth-child(2) {
  box-shadow: inset -14px 0px 12px -6px rgba(000, 000, 000, 0.1);
}

.tableDetails tr th:nth-child(4),
.tableDetails tr td:nth-child(4) {
  box-shadow: inset 14px 0px 12px -6px rgba(000, 000, 000, 0.1);
}

.tableDetails tr td.yes {
  background: url(/file/app/2/icons/check-vert.png) no-repeat;
  background-position: 25px center;
  background-size: 20px;
}

.tableDetails tr td.no {
  background: url(/file/app/2/icons/horizontal-line.png) no-repeat;
  background-position: 25px center;
  background-size: 18px;
}

.forfaitHeader span.readMore {
  display: none;
}

@media (max-width: 48em) {
  #VendorSpecialOffers .forfait:nth-child(1) .forfaitHeader {
    height: auto !important;
    padding: 0.3em !important;
  }

  .forfait {
    max-width: inherit;
  }

  .forfaitHeader {
    margin-top: 0 !important;
    height: auto;
    max-height: none !important;
    padding: 2em 1em !important;
  }

  .creditCards img {
    margin: 0.8em 0em 0.6em 0;
    width: 65px;
  }

  .featuresList {
    display: none;
  }

  .mobileScroll {
    width: 100%;
    overflow-x: scroll;
    border: solid thin #bbb;
  }

  .detailsComplets {
    display: none;
  }

  .forfaitHeader {
    margin-top: 0 !important;
  }

  .forfaitHeader .bigText {
    margin-top: 0.4em !important;
  }

  .forfaitHeader .button-blanc {
    margin: 0.5em 0em 0em 0em;
  }

  .WrapperOffre {
    padding: 0px 20px 0px 10px;
  }

  .forfait {
    padding: 0px 0px 0px 10px !important;
    margin-bottom: 5px !important;
  }

  .forfaits div [class*="pure-u-"]:last-child {
    margin-bottom: 2em;
  }

  .forfaitHeader span.readMore {
    display: block;
    cursor: pointer;
    padding: 25px 0px 5px 0px;
  }
}

.wsOffre .specialOLFPV {
  color: #555;
  background-color: #fff;
}

/* Page Référencement */

.wsReferencement {
  color: #858688;
}

.wsReferencement .wsRefMenu {
  position: fixed;
  right: 20px;
  top: 60px;
  z-index: 2;
}

.wsReferencement .wsRefMenuIcon {
  background-color: #0bafc2;
  background-image: url("file/app/1/editor/icon/menu.svg?color1=r255g255b255");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 60%;
  width: 32px;
  height: 35px;
  border-radius: 3px;
  cursor: pointer;
  position: absolute;
  right: 0;
  z-index: 2;
}

.wsReferencement .wsRefMenu .wsRefMenuHidden {
  margin-right: 40px;
  width: 260px;
  color: #fff;
  display: none;
  cursor: pointer;
  background-color: #fff;
  z-index: 3;
  border-radius: 3px;
}

.wsReferencement .wsRefMenu .wsRefMenuHidden .wsRefMenuItem {
  margin-top: 5px;
  background-color: #828282;
  border-radius: 3px;
  padding: 6px 10px;
}

.wsReferencement .wsRefMenu .wsRefMenuHidden .wsRefMenuItem:first-child {
  margin-top: 0;
}

.wsReferencement .wsRefMenu .wsRefMenuHidden .wsRefMenuItem:hover {
  background-color: #606060;
}

.wsReferencement .Section {
  padding: 45px 15px;
  position: relative;
  box-sizing: border-box;
  margin: 0 auto;
  max-width: 1048px;
  position: relative;
  width: 100%;
}

.wsReferencement .Section.wsRefHeader {
  text-align: center;
  color: #121922;
  padding-bottom: 0;
  text-align: center;
}

.wsReferencement .Section.wsRefHeader h1 {
  border: none;
  max-width: 600px;
  margin: 0 auto;
}

.wsReferencement .wsBgGris {
  padding: 30px 0;
  width: 100%;
  background-color: #f1f1f1;
}

.wsReferencement p {
  text-align: center;
}

.wsNumLine {
  position: relative;
}

.wsReferencement .wsNums {
  display: -webkit-flex;
  display: flex;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-align-items: center;
  align-items: center;
}

.wsReferencement .wsLine {
  height: 6px;
  width: 95%;
  position: absolute;
  background-color: #0bafc2;
  z-index: -1;
  margin-top: 25px;
}

.wsReferencement .wsNum {
  width: 55px;
  height: 55px;
  font-size: 30px;
  background-color: #fff;
  border: 6px solid #0bafc2;
  border-radius: 50%;
  color: #0bafc2;
  text-align: center;
  display: -webkit-flex;
  display: flex;
  -webkit-align-items: center;
  align-items: center;
  -webkit-justify-content: space-around;
  justify-content: space-around;
  z-index: -1;
}

.wsReferencement .wsNum.checked {
  color: #fff;
  background-color: #0bafc2;
}

.wsReferencement .wsPlusLoin .wsAccordeonTitleWrapper,
.wsReferencement .wsRefAccordeon .wsAccordeonTitleWrapper {
  counter-increment: SectionNum;
  width: 100%;
  color: #fff;
  margin-bottom: 20px;
}

.wsReferencement .wsRefAccordeon .wsAccordeonTitleWrapper:last-of-type {
  margin-bottom: 0;
}

.wsReferencement .wsPlusLoin .wsAccordeonTitleWrapper > div,
.wsReferencement .wsRefAccordeon .wsAccordeonTitleWrapper > div {
  background-color: #0bafc2;
  display: inline-block;
  padding: 4px 35px 4px 15px;
  width: calc(100% - 72px);
  border-radius: 3px;
  position: relative;
  border: 1px solid #0bafc2;
}

.wsReferencement .wsPlusLoin .wsAccordeonTitleWrapper > div {
  background-color: #cfd7e0;
  width: 100%;
  border: none;
}

.wsReferencement .wsRefAccordeon .wsAccordeonTitleWrapper:before {
  background-color: #fff;
  border: 4px solid #0bafc2;
  border-radius: 50%;
  color: #0bafc2;
  content: counter(SectionNum, decimal);
  display: inline-block;
  font-size: 26px;
  height: 40px;
  text-align: center;
  width: 40px;
  margin-right: 20px;
}

.wsReferencement .wsRefAccordeon .wsAccordeonTitleWrapper.checked:before {
  background-color: #0bafc2;
  border: 4px solid #0bafc2;
  border-radius: 50%;
  color: #fff;
  content: counter(SectionNum, decimal);
  display: inline-block;
  font-size: 26px;
  height: 40px;
  text-align: center;
  width: 40px;
  margin-right: 20px;
}

.wsReferencement .wsPlusLoin .wsAccordeonTitleWrapper h2,
.wsReferencement .wsRefAccordeon .wsAccordeonTitleWrapper h2 {
  display: inline;
  font-family: "Signika";
  font-size: 24px;
  font-weight: 300;
  margin-left: 50px;
}

.wsReferencement .wsPlusLoin .wsAccordeonTitleWrapper h2 {
  color: #121922;
  margin-left: 54px;
}

.wsReferencement .wsRefAccordeon .wsCaret,
.wsReferencement .wsPlusLoin .wsCaret {
  background-image: url("file/app/1/editor/icon/selector.svg?color1=r255g255b255");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 85% auto;
  display: inline-block;
  height: 17px;
  position: absolute;
  right: 15px;
  top: 14px;
  width: 17px;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  cursor: pointer;
}

.wsReferencement .wsPlusLoin .wsCaret {
  background-image: url("file/app/1/editor/icon/selector.svg?color1=r36g37b39");
}

.wsReferencement .wsPlusLoin .wsCaret.opened,
.wsReferencement .wsRefAccordeon .wsCaret.opened {
  -ms-transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

.wsReferencement .wsPlusLoin .wsAccordeonTitleWrapper > div,
.wsReferencement .wsRefAccordeon .wsAccordeonTitleWrapper > div {
  cursor: pointer;
}

.wsReferencement .wsPlusLoin .wsAccordeonTitleWrapper > div.wsAccordeonText,
.wsReferencement
  .wsRefAccordeon
  .wsAccordeonTitleWrapper
  > div.wsAccordeonText {
  background-color: #fff;
  color: #858688;
  margin-left: 71px;
  border: 1px solid #cfd7e0;
  border-top: none;
  border-bottom-left-radius: 3px;
  border-bottom-right-radius: 3px;
  padding: 25px 50px;
  margin-top: -2px;
  cursor: default;
}

.wsReferencement .wsPlusLoin .wsAccordeonTitleWrapper > div.wsAccordeonText {
  margin-left: 0;
  padding: 25px 70px;
}

.wsReferencement .wsPlusLoin .wsAccordeonTitleWrapper > div.wsAccordeonText p,
.wsReferencement
  .wsRefAccordeon
  .wsAccordeonTitleWrapper
  > div.wsAccordeonText
  p {
  text-align: left;
}

.wsReferencement .wsPlusLoin .wsAccordeonTitleWrapper > div.wsAccordeonText h3,
.wsReferencement
  .wsRefAccordeon
  .wsAccordeonTitleWrapper
  > div.wsAccordeonText
  h3 {
  margin-top: 5px;
  color: #121922;
}

.wsReferencement .wsRefAccordeon .wsAccordeonTitleWrapper .wsCocheWrapper {
  height: 45px;
  width: 50px;
  position: absolute;
  left: -1px;
  top: -1px;
}

.wsReferencement .wsRefAccordeon .wsAccordeonTitleWrapper .naCheckBox {
  position: absolute;
  top: 8px;
  left: 15px;
}

.wsReferencement .wsRefAccordeon .wsAccordeonTitleWrapper .naCheckBox > div {
  background-color: #fff;
  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.3) inset;
  border: none;
  width: 20px;
  height: 20px;
}

.wsReferencement .wsRefAccordeon .wsAccordeonTitleWrapper .naCheckBox label {
  display: none;
}

.wsReferencement .wsDoubleList > h2 {
  color: #121922;
  text-align: center;
  margin: 0;
}

.wsReferencement .wsDoubleList > ul {
  display: inline-block;
  margin-right: 10%;
  width: 40%;
}

.wsReferencement .wsDoubleList > ul:last-of-type {
  margin-right: 0;
}

.wsReferencement .wsFooterNote > p {
  padding: 0 30px;
}

@media screen and (max-width: 64em) {
  .wsLine {
    display: none;
  }

  .wsReferencement .wsNums {
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    align-items: flex-start;
    -webkit-jusitfy-content: flex-start;
    justify-content: flex-start;
  }

  .wsReferencement .wsNums > div {
    margin: 0.2em;
  }

  .wsReferencement .wsPlusLoin .wsAccordeonTitleWrapper h2,
  .wsReferencement .wsRefAccordeon .wsAccordeonTitleWrapper h2 {
    font-size: 20px;
  }

  .wsReferencement .wsRefAccordeon .wsAccordeonTitleWrapper::before {
    vertical-align: top;
  }

  .wsReferencement .wsPlusLoin .wsAccordeonTitleWrapper > div.wsAccordeonText {
    padding: 25px;
  }

  .wsReferencement .wsDoubleList > ul:first-of-type {
    margin-bottom: 0;
    width: 90%;
  }

  .wsReferencement .wsDoubleList > ul:last-of-type {
    margin-top: 0;
    width: 90%;
  }

  .wsReferencement .wsPlusLoin .wsAccordeonTitleWrapper h2 {
    margin-left: 0;
  }
}

/* Delete site Dialog */

@media screen and (max-width: 34em) {
  .wsDeleteSiteDialog .wsBody {
    overflow-y: scroll !important;
  }
}

@media screen and (max-width: 24em) {
  .wsDeleteSiteDialog {
    -ms-transform: scale(0.65, 0.65);
    -webkit-transform: scale(0.65, 0.65);
    transform: scale(0.65, 0.65);
  }
}

@media screen and (min-width: 24.01em) and (max-width: 30em) {
  .wsDeleteSiteDialog {
    -ms-transform: scale(0.8, 0.8);
    -webkit-transform: scale(0.8, 0.8);
    transform: scale(0.8, 0.8);
  }
}

.wsDeleteSiteDialog:focus {
  outline: none;
}

.wsDeleteSiteDialog .wsWindow {
  line-height: 1.45;
}

.wsDeleteSiteDialog .wsWindow .wsWrapper input[type="text"] {
  box-shadow: none;
}

.wsDeleteSiteDialog
  .wsWindow
  .wsWrapper.wsButtons
  input.wsConfirm[type="button"] {
  background-color: #ee4545;
  text-transform: uppercase;
}

.wsDeleteSiteDialog
  .wsWindow
  .wsWrapper.wsButtons
  input.wsConfirm[type="button"]:hover {
  background-color: #ff6b67;
}

.wsDeleteSiteDialog .wsWindow .wsWindowSection {
  padding: 0 0 16px 0;
}

.wsDeleteSiteDialog .wsWindow .wsWindowSection > div > div {
  margin-left: 16px;
  margin-right: 16px;
}

.wsDeleteSiteDialog .wsWindow .naCheckBox > label {
  padding: 0;
  font-size: 15px;
}

.wsDeleteSiteDialog .wsTitle {
  text-transform: uppercase;
  font-size: 12pt !important;
}

.WebsitesSection > * {
  width: 100%;
}

.WebsitesSection .wsEdDesignMain .wsBody {
  opacity: 0;
}

.WebsitesSection .wsEdDesignMain .wsBody.wsDesignOpened {
  opacity: 1;
  -webkit-transition: 0.05s opacity 1s;
  transition: 0.05s opacity 1s;
}

/* Responsive Thèmes */

.WebsitesSection.Section.ResponsTheme {
  width: auto;
  overflow: hidden;
  position: relative !important;
  background-color: #fff;
}

/* loading spinner */
/* Changer la font size pour changer la grandeur du spinner*/
/* exemple : mettre dans html : <div class=\"wsLoadingFlexContainer\"><div class=\"wsLoadingSpinner\" style=font-size:6px;margin-top:0;></div></div>*/
.wsLoadingFlexContainer {
  background-color: #ffffff;
  bottom: 0;
  height: 100%;
  display: flex;
  display: -webkit-flex;
  justify-content: space-around;
  -webkit-justify-content: space-around;
  align-items: center;
  -webkit-align-items: center;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  width: 100%;
  z-index: 10;
}

.wsLoadingSpinner {
  margin: 6em auto;
  font-size: 4px;
  position: relative;
  text-indent: -9999em;
  border-top: 1.1em solid rgba(0, 0, 0, 0.2);
  border-right: 1.1em solid rgba(0, 0, 0, 0.2);
  border-bottom: 1.1em solid rgba(0, 0, 0, 0.2);
  border-left: 1.1em solid #000;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: loadSpinner 1.1s infinite linear;
  animation: loadSpinner 1.1s infinite linear;
}

.wsLoadingSpinner,
.wsLoadingSpinner:after {
  border-radius: 50%;
  width: 10em;
  height: 10em;
  outline: 1px solid transparent;
}

@-webkit-keyframes loadSpinner {
  0% {
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes loadSpinner {
  0% {
    -ms-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -ms-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.wsError {
  display: none;
  border-left: 5px solid red;
  padding: 10px 0 10px 10px;
  background-color: rgba(175, 175, 175, 0.35);
}

/* Create site with mobile */

#CreateSiteWithMobile,
#EditSiteWithMobile {
  -webkit-overflow-scrolling: touch;
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-color: #0bafc2;
  color: #fff;
  text-align: center;
  padding: 60px 20px 20px;
  z-index: 3;
  overflow: scroll;
  width: 100%;
  height: 100%;
}

#CreateSiteWithMobile .MobileMessageContainer,
#EditSiteWithMobile .MobileMessageContainer {
  width: 100%;
}

#EditSiteWithMobile img,
#CreateSiteWithMobile img {
  width: 100%;
  max-width: 400px;
}

#EditSiteWithMobile h1,
#CreateSiteWithMobile h1 {
  border: none;
}

#EditSiteWithMobile a,
#CreateSiteWithMobile a {
  color: #23c4d6;
}

#EditSiteWithMobile a:hover,
#CreateSiteWithMobile a:hover {
  color: #57f2fa;
}

#EditSiteWithMobile h2,
#CreateSiteWithMobile h2 {
  font-size: 130%;
}

#EditSiteWithMobile input[type="button"],
#CreateSiteWithMobile input[type="button"] {
  font-size: 18px;
}

/* Tableaux mobiles */

.wsMobileTabHeader {
  display: none !important;
  text-transform: uppercase;
  font-size: 13px;
  line-height: 1;
  padding: 14px 16px 11px 16px;
  background-color: #e6e6e6;
  border-radius: 3px;
}

.wsMobileTabRow {
  background-color: #efefef;
  padding: 16px;
  line-height: 0.9;
}

.wsMobileTabTitle {
  display: inline !important;
  font-weight: bold;
  color: #121922 !important;
}

@media screen and (max-width: 54.999999em) {
  .wsMobileTabRow span {
    margin-bottom: 0.1em;
  }

  .wsMobileTabRow span:not(.wsMobileTabTitle):not(span[name="GearHiddenMenu"]) {
    display: block !important;
    width: 100% !important;
  }

  .wsMobileTabRow {
    margin-bottom: 1em !important;
    width: 100%;
  }

  .wsBillingTabs {
    margin: 0 !important;
  }

  .FacturationMobileTabs > span,
  .FacturationMobileTabs > a {
    display: block;
    margin-bottom: 10px !important;
  }
}

@media screen and (min-width: 1000px) {
  .wsMobileTabRow span:not(.wsMobileTabTitle) {
    display: inline-block;
  }

  .wsMobileTabHeader {
    display: block !important;
  }

  .wsMobileTabRow {
    background-color: #fff;
  }

  .wsMobileTabTitle {
    display: none !important;
  }
}

/* NovAxis controls override */

.naSelectOption:hover,
.naSelectOption.hover {
  background-color: #0bafc2 !important;
}

.naCheckBox > div.wsChecked {
  background-image: url("/manager/file/app/1/editor/icon/check.svg?color1=r255g255b255") !important;
  background-color: #0bafc2 !important;
}

.wsCaretFont {
  font-family: Verdana, sans-serif;
}

.FormGris .input[type="text"],
.FormGris input[type="password"],
.FormGris select {
  background-color: #dedede;
  border: 1px solid #dedede;
  border-radius: 3px;
  box-sizing: border-box;
  color: #000;
  margin-bottom: 0;
  padding: 10px;
  width: 100%;
}

.FormGris .naSelectBody,
.FormGris .naSelectOption {
  background-color: #dedede;
  border-color: #ddd;
}

.FormGris .naSelectOption {
  padding-left: 18px;
}

.FormGris .naSelectBody {
  height: 40px;
  line-height: 1;
  padding: 10px;
}

.FormGris .naSelectOption:hover {
  background-color: #0bafc2;
}

/* PUBS */

.PubWrapper {
  margin: 10px 0;
}

.PubWrapper .Pub {
  overflow: hidden;
  margin: 0 auto;
}

.PubWrapper .Pub .Opened {
  animation: FromRightToCenter 0.4s;
  -webkit-animation: FromRightToCenter 0.4s;
}

@-webkit-keyframes FromRightToCenter {
  0% {
    opacity: 0;
    transform: translateX(70%);
  }

  100% {
    opacity: 1;
    transform: translateX(0%);
  }
}

@keyframes FromRightToCenter {
  0% {
    opacity: 0;
    transform: translateX(70%);
  }

  100% {
    opacity: 1;
    transform: translateX(0%);
  }
}

.PubWrapper .Pub .Closed {
  animation: FromCenterToLeft 0.4s;
  -webkit-animation: FromCenterToLeft 0.4s;
}

@-webkit-keyframes FromCenterToLeft {
  0% {
    opacity: 1;
    transform: translateX(0%);
  }

  100% {
    opacity: 0;
    transform: translateX(-70%);
  }
}

@keyframes FromCenterToLeft {
  0% {
    opacity: 1;
    transform: translateX(0%);
  }

  100% {
    opacity: 0;
    transform: translateX(-70%);
  }
}

.PubWrapper .SelectPub {
  display: flex;
  display: -webkit-flex;
  justify-content: space-around;
  -webkit-justify-content: space-around;
  padding: 0 100px;
  margin: 5px auto 20px auto;
  max-width: 302px;
}

.PubWrapper .SelectPubDot {
  border-radius: 50%;
  background-color: #b1b1b1;
  border: 2px solid #b1b1b1;
  width: 10px;
  height: 10px;
  cursor: pointer;
}

.PubWrapper .SelectPubDot.Selected {
  background-color: #fff;
  transition: background-color 400ms linear;
}
/*Pass to year plan*/

#changeCycle {
  width: 100%;
  height: 164px;
  background: url(file/app/2/home/economisez-bg.jpg);
  background-size: cover;
  display: block;
  margin-bottom: 8px;
  overflow: hidden;
}

/* === Top line === */

.wsPanelTopLine .wsTopLine {
  background-color: #121922;
  display: flex;
  display: -webkit-flex;
  background-color: #2a343f;
  color: #fff;
  justify-content: space-between;
  -webkit-justify-content: space-between;
  text-transform: uppercase;
  align-items: center;
  -webkit-align-items: center;
  overflow: hidden;
  height: 59px;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 2;
}

.wsPanelTopLine .wsTopLine .wsRetourEditeur {
  padding: 0px 15px;
  color: #b0bdcb;
  font-size: 16px;
  cursor: pointer;
}

.wsPanelTopLine .wsTopLine .wsRetourEditeur a {
  color: #b0bdcb;
}

.wsPanelTopLine .wsTopLine .wsTitle {
  font-size: 22px;
  padding: 0px 15px;
  margin: auto;
}

.wsPanelTopLine .wsTopLine .wsCloseWindow {
  padding: 0 30px 5px 20px;
  box-sizing: border-box;
  font-size: 46px;
  padding: 0px 15px;
  cursor: pointer;
  color: #fff;
  width: 50px;
}

.wsPanelTopLine .wsTopLine .wsCloseWindowX {
  margin-top: -15px;
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  cursor: pointer;
  position: relative;
  top: 3px;
}

.wsPanelTopLine .wsTopLine .wsCloseWindowX a {
  color: #fff;
}

.wsPanelTopLine .wsTopLine .wsRetourEditeur img {
  margin-right: 5px;
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  width: 10px;
}

.wsPanelTopLine .wsTopLine .wsMenuItem a {
  color: #fff;
}

.wsBoxLabel {
  color: #72808e;
  font-size: 13px;
  text-transform: uppercase;
  font-weight: 600;
  margin-bottom: 6px;
}

@media screen and (max-width: 1000px) {
  .wsPanelTopLine .wsTopLine {
    height: auto;
  }

  .wsPanelTopLine .wsTopLine .wsCloseWindowX {
    display: none;
  }

  .wsPanelTopLine .wsTopLine .wsRetourEditeur img {
    width: 15px;
  }

  .wsPanelTopLine .wsTopLine .wsRetourEditeur {
    width: 10px;
    overflow: hidden;
    white-space: nowrap;
  }
}

/* === Popup Editor Choices === */

.ws-popup-editor-choices {
  position: fixed;
  width: 100%;
  background-color: #fff;
  display: block;
  z-index: 100;
  top: 0px;
  left: 0;
  right: 0;
  bottom: 0;
  overflow-y: scroll;
  overflow-x: hidden;
  padding: 70px 25px 50px 25px;
  display: none;
}

.ws-popup-editor-choices.visible {
  display: flex;
  justify-content: center;
  padding-top: 80px;
}

@media screen and (min-width: 48em) {
  .ws-popup-editor-choices {
    padding: 25px;
    overflow: hidden;
  }
}

@media screen and (min-width: 100em) {
  .ws-popup-editor-choices {
    overflow-y: hidden;
    padding: 25px;
  }
}

.ws-popup-editor-choices .ws-popup-editor-close {
  font-size: 70px;
  position: absolute;
  line-height: 30px;
  top: 20px;
  right: 20px;
  transform: rotate(45deg);
  cursor: pointer;
  color: white;
}

@media screen and (min-width: 48em) {
  .ws-popup-editor-choices .ws-popup-editor-close {
    top: 40px;
    right: 40px;
  }
}

.ws-popup-editor-choices .ws-popup-editor-choices-title {
  width: 100%;
  height: 15%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 30px;
}

@media screen and (min-width: 100em) {
  .ws-popup-editor-choices .ws-popup-editor-choices-title {
    height: 10%;
  }
}

.ws-popup-editor-choices .ws-popup-editor-beta {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1px;
  background-color: #00b6ee;
  padding: 6px 8px;
  vertical-align: middle;
  margin-left: 4px;
}

.ws-popup-editor-choices
  .ws-popup-editor-choices-title
  .ws-popup-editor-main-title {
  text-align: center;
  max-width: 575px;
  font-size: 30px;
  line-height: 40px;
  font-weight: 600;
  text-transform: uppercase;
  display: inline-block;
}

@media screen and (min-width: 48em) {
  .ws-popup-editor-choices
    .ws-popup-editor-choices-title
    .ws-popup-editor-main-title {
    font-size: 40px;
    line-height: 50px;
    max-width: 725px;
  }
}

@media screen and (min-width: 100em) {
  .ws-popup-editor-choices
    .ws-popup-editor-choices-title
    .ws-popup-editor-main-title {
    font-size: 50px;
    line-height: 60px;
  }
}

.ws-popup-editor-choices .ws-popup-editor-choices-column-container {
  width: 100%;
  height: 85%;
  max-width: 1050px;
  margin: 0 auto;
  gap: 0px;
}

/* @media screen and (min-width: 24em) {
  .ws-popup-editor-choices .ws-popup-editor-choices-column-container {
    gap: 150px;
  }
} */

@media screen and (min-width: 48em) {
  .ws-popup-editor-choices .ws-popup-editor-choices-column-container {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    gap: 150px;
  }
}

@media screen and (min-width: 100em) {
  .ws-popup-editor-choices .ws-popup-editor-choices-column-container {
    gap: 350px;
  }
}

.ws-popup-editor-choices
  .ws-popup-editor-choices-column-container
  .ws-popup-editor-choices-column {
  max-width: 500px;
  padding: 0 25px;
  margin: 0 auto;
  text-align: center;
  transition: all 0.4s;
  cursor: pointer;
}

.ws-popup-editor-choices
  .ws-popup-editor-choices-column-container
  .ws-popup-editor-choices-column:hover {
  transform: scale(1.1);
}

.ws-popup-editor-choices
  .ws-popup-editor-choices-column-container
  .ws-popup-editor-choices-column
  .ws-popup-editor-column-img {
  display: inline-block;
  width: 250px;
  height: 250px;
}

@media screen and (min-width: 48em) {
  .ws-popup-editor-choices
    .ws-popup-editor-choices-column-container
    .ws-popup-editor-choices-column
    .ws-popup-editor-column-img {
    width: 300px;
    height: 300px;
  }
}

@media screen and (min-width: 100em) {
  .ws-popup-editor-choices
    .ws-popup-editor-choices-column-container
    .ws-popup-editor-choices-column
    .ws-popup-editor-column-img {
    width: 400px;
    height: 400px;
  }
}

.ws-popup-editor-choices
  .ws-popup-editor-choices-column-container
  .ws-popup-editor-choices-column.classic-editor
  .ws-popup-editor-column-img {
  background-image: url(../Css/Img/editor-icon.png);
  background-size: contain;
  background-repeat: no-repeat;
}

.ws-popup-editor-choices
  .ws-popup-editor-choices-column-container
  .ws-popup-editor-choices-column.classic-editor
  .ws-popup-editor-column-btn {
  background-color: #060d14;
  color: #ffffff;
}

.ws-popup-editor-choices
.ws-popup-editor-choices-column-container
.ws-popup-editor-choices-column.wss-editor:last-child {
    padding-bottom: 60px;
}

@media screen and (min-width: 48em) {
    .ws-popup-editor-choices
    .ws-popup-editor-choices-column-container
    .ws-popup-editor-choices-column.wss-editor:last-child {
        padding-bottom: 0px;
    }
}

.ws-popup-editor-choices
  .ws-popup-editor-choices-column-container
  .ws-popup-editor-choices-column.wss-editor
  .ws-popup-editor-column-img {
  background-image: url(../Css/Img/wss-icon.png);
  background-size: contain;
  background-repeat: no-repeat;
}

.ws-popup-editor-choices
  .ws-popup-editor-choices-column-container
  .ws-popup-editor-choices-column
  .ws-popup-editor-column-title {
  display: inline-block;
  font-size: 22px;
  line-height: 32px;
  font-weight: 600;
  color: #060d14;
  margin: 10px 0px;
  letter-spacing: -0.4px;
  max-width: 370px;
}

@media screen and (min-width: 48em) {
  .ws-popup-editor-choices
    .ws-popup-editor-choices-column-container
    .ws-popup-editor-choices-column
    .ws-popup-editor-column-title {
    font-size: 30px;
    line-height: 40px;
  }
}

@media screen and (min-width: 100em) {
  .ws-popup-editor-choices
    .ws-popup-editor-choices-column-container
    .ws-popup-editor-choices-column
    .ws-popup-editor-column-title {
    font-size: 40px;
    line-height: 48px;
    margin: 15px 0px;
  }
}

.ws-popup-editor-choices
  .ws-popup-editor-choices-column-container
  .ws-popup-editor-choices-column
  .ws-popup-editor-column-text {
  display: inline-block;
  font-size: 16px;
  line-height: 26px;
  color: #060d14;
  margin-bottom: 32px;
}

.ws-popup-editor-choices
  .ws-popup-editor-choices-column-container
  .ws-popup-editor-choices-column
  .ws-popup-editor-column-btn {
  display: inline-block;
  background-color: #00b6ee;
  padding: 12px 32px;
  text-transform: uppercase;
  font-size: 14px;
  text-align: center;
  color: #060d14;
  border-radius: 5px;
  font-weight: 600;
  margin-bottom: 40px;
  cursor: pointer;
  transition: all 0.2s;
}

.ws-popup-editor-choices
  .ws-popup-editor-choices-column-container
  .ws-popup-editor-choices-column
  .ws-popup-editor-column-btn:hover {
  background-color: #24beed;
  box-shadow: 0px 5px 10px rgba(000, 000, 000, 0.3);
}

@media screen and (min-width: 48em) {
  .ws-popup-editor-choices
    .ws-popup-editor-choices-column-container
    .ws-popup-editor-choices-column
    .ws-popup-editor-column-btn {
    font-size: 15px;
    margin-bottom: 0;
  }
}

@media screen and (min-width: 100em) {
  .ws-popup-editor-choices
    .ws-popup-editor-choices-column-container
    .ws-popup-editor-choices-column
    .ws-popup-editor-column-btn {
    font-size: 16px;
    padding: 12px 25px;
  }
}

@media screen and (min-width: 48em) {
  .ws-popup-editor-choices-bg {
    background: url(../Css/Img/ws-background.png) no-repeat;
    background-size: cover;
    background-attachment: fixed;
    position: fixed;
    inset: 0;
    z-index: -1;
  }
}