:root{
  --grid-gap:1rem;
  --grid-container-max-width:100%;
}
@media screen and (min-width:360px){
  :root{
    --grid-container-max-width:360px;
  }
}
@media screen and (min-width:425px){
  :root{
    --grid-container-max-width:425px;
  }
}
@media screen and (min-width:576px){
  :root{
    --grid-container-max-width:576px;
  }
}
@media screen and (min-width:768px){
  :root{
    --grid-container-max-width:768px;
  }
}
@media screen and (min-width:992px){
  :root{
    --grid-container-max-width:992px;
  }
}
@media screen and (min-width:1200px){
  :root{
    --grid-container-max-width:1200px;
  }
}
@media screen and (min-width:1400px){
  :root{
    --grid-container-max-width:1400px;
  }
}

.dialog-off-canvas-main-canvas{
  display:flex;
  flex-direction:column;
  height:100%;
  min-height:100vh;
}

.wrapper{
  display:grid;
  grid-template-areas:"header" "content" "footer";
  grid-template-columns:100%;
  grid-template-rows:auto 1fr auto;
  min-height:100vh;
}

.wrapper__content{
  margin:0 auto;
  max-width:var(--grid-container-max-width);
  padding:0 .5rem;
}
@media screen and (min-width:576px){
  .wrapper__content{
    padding:0 1rem;
  }
}
@media screen and (min-width:1400px){
  .wrapper__content{
    padding:0;
  }
}

.wrapper__content-narrow{
  max-width:1004px !important;
}

#linline-spinner{
  align-items:center;
  background:#fff;
  color:#666;
  display:flex;
  height:100%;
  justify-content:center;
  left:0;
  opacity:.8;
  position:fixed;
  top:0;
  width:100%;
  z-index:5000;
}

.linline-spinner__item{
  animation:rotation .6s linear infinite !important;
  border:8px solid rgba(0,174,239,.15);
  border-radius:100%;
  border-top-color:#15a8f1;
  height:80px;
  left:auto;
  margin:0;
  position:relative;
  top:auto;
  transform:translateZ(0);
  width:80px;
}

@keyframes ani{
  0%{
    transform:translateX(-150%);
  }
  to{
    transform:translateY(0);
  }
}
@keyframes rotation{
  0%{
    transform:rotate(0deg);
  }
  to{
    transform:rotate(359deg);
  }
}