/**
* IMPORTANT
* To keep same graphic design (colors|fonts|variables)
* varaibles comme from cartridge app_custom_longchamp_revamp
*/
.clearfix::before, .clearfix::after {
  content: '';
  display: table; }

.clearfix::after {
  clear: both; }

html,
body {
  height: 100%; }

body {
  margin: 0;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  -ms-flex-pack: center;
      justify-content: center;
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/$white+0,ffffff+0$gray-iota+72$gray-iota+100 */
  background: #acacac;
  /* Old browsers */
  /* FF3.6-15 */
  /* Chrome10-25,Safari5.1-6 */
  background: radial-gradient(ellipse at center, #fff 0%, #fff 0%, #acacac 85%, #acacac 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:dximagetransform.microsoft.gradient( startColorstr='$white', endColorstr='$gray-iota', GradientType=1 );
  /* IE6-9 fallback on horizontal gradient */ }
  body .page {
    background-color: transparent; }

.instore-page--login .wrapper {
  -ms-flex-line-pack: justify;
      align-content: space-between;
  background: #fff;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  width: calc(100vw / 12 * 10);
  min-height: calc(100vh / 12 * 10); }

.instore-page--login .instore-login-header {
  text-align: center; }

.instore-page--login .instore-wrap-login {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: center;
      justify-content: center;
  margin: auto 0; }

.instore-page--login .instore-wrap-login-form {
  width: calc(100% / 12 * 10); }
  @media screen and (min-width: 768px) {
    .instore-page--login .instore-wrap-login-form {
      width: calc(100% / 3); } }

.instore-page--login .header__logo {
  border-bottom: 1px solid #cacaca; }
  @media screen and (max-width: 768px) {
    .instore-page--login .header__logo {
      display: block; } }