/* ==========================================================================
   Remodal's default mobile first theme
   ========================================================================== */

/* Default theme styles for the background */

.remodal-bg.remodal-is-opening,
.remodal-bg.remodal-is-opened {
  filter: blur(6px);
}

/* Default theme styles of the overlay */

.remodal-overlay {
  background: rgba(44,52,58,.9);
}

.remodal-overlay.remodal-is-opening,
.remodal-overlay.remodal-is-closing {
  animation-duration: 0.3s;
  animation-fill-mode: forwards;
}

.remodal-overlay.remodal-is-opening {
  animation-name: remodal-olay-opening-keyframes;
}

.remodal-overlay.remodal-is-closing {
  animation-name: remodal-olay-closing-keyframes;
}

/* Default theme styles of the wrapper */


/* Default theme styles of the modal dialog */

.remodal {
  box-sizing: border-box;
  width: 100%;
  transform: translate3d(0, 0, 0);
  color: rgba(44,52,58,1);
  text-align: center;
}
.remodal *:focus { outline: unset; }

.remodal > div.container { background: rgba(255,255,255,1); box-shadow: 0 0 1rem rgba(0,0,0,.18); border-radius: 1rem; float: left; }

.remodal.remodal-is-opening,
.remodal.remodal-is-closing {
  animation-duration: 0.4s;
  animation-fill-mode: forwards;
}

.remodal.remodal-is-opening {
  animation-name: remodal-opening-keyframes;
}

.remodal.remodal-is-closing {
  animation-name: remodal-closing-keyframes;
}

/* Vertical align of the modal dialog */

.remodal,
.remodal-wrapper:after {
  vertical-align: middle;
}

/* Close button */

.close {
  position: fixed;
  top: 2rem;
  right: 2rem;

  display: block;
  overflow: visible;

  width: 4rem;
  height: 4rem;
  margin: 0;
  padding: 0;
  font-size: 2.4rem;

  cursor: pointer;
  transition: .2s;
  text-decoration: none;

  color: rgba(44,52,58,1);
  border: 0;
  outline: 0;
  background: transparent;
  z-index: 999;
}
.close > i {
  vertical-align: top;
}
.remodal > div.container {
  max-height: 80vh;
  overflow: hidden;
  min-height: 30rem;
}

.remodal > div.container > i {
  font-size: 5rem;
  padding-bottom: 2rem;
  color: rgba(200,200,200,1);
}

.remodal > div.container > div.content a {
  text-decoration: underline;
}
/* Dialog buttons */
.remodal > div.container > div.content > .button {
  font-family: house-script, sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 1.8rem;
  line-height: 3.8rem;
  transition: .2s;
  display: block;
}

.remodal > div.container > div.content > .restore-item {
  font-family: house-script, sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 1.8rem;
  line-height: 3.8rem;
  transition: .2s;
  display: block;
}

.remodal > div.container > div.content > .button:hover {
  color: rgba(200,200,200,1); transition: .2s;
}

.remodal > div.container > div.actions {
  margin: 2rem 0;
}
.remodal > div.container > div.actions > button.button {
  font-family: house-script, sans-serif;
  font-style: normal;
  font-weight: 400;
  font-size: 1.8rem;
  clear: both;
  display: inline-block;
  overflow: visible;
  min-width: 110px;
  margin: 0;
  cursor: pointer;
  transition: background 0.2s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  border: 0;
  outline: 0;
  background: rgba(240,240,240,1);
  transition: .2s;
}

/* Remove inner padding and border in Firefox 4+ for the button tag. */

.remodal > div.container > div.actions > button.button::-moz-focus-inner {
  padding: 0;
  border: 0;
}

/* REGISTER */
.remodal > div.container > div.content div.hidden { display: none; }
.remodal > div.container.register-modal > div.content { white-space: nowrap; transition: .2s; position: relative; }
.remodal > div.container.register-modal > div.content > div.six { display: inline-block; float: initial; vertical-align: middle; margin: 0; width: 50%; min-height: 30rem; white-space: normal; position: relative; }
.remodal > div.container.register-modal > div.content > div.image { position: relative; z-index: 2; max-height: 80vh; overflow: hidden; }
.remodal > div.container.register-modal > div.content > div.image > img { display: block; filter: grayscale(50%) brightness(.8); }
.remodal > div.container.register-modal > div.content > div.image > div.infotext { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); color: rgba(252,249,246,1); transition: .2s }
.remodal > div.container.register-modal > div.content > div.image > div.infotext > label > span.button { margin-top: 2rem; padding: 1rem 2rem; border: .1rem solid rgba(252,249,246,1); border-radius: 2rem; background: rgba(252,249,246,.3); }
.remodal > div.container.register-modal > div.content > div.image > div.infotext > label > span.button > i { display: inline-block; vertical-align: middle; padding-left: 1rem; transition: .2s }
.remodal > div.container.register-modal > div.content > div.image > div.infotext > label:hover > span.button > i { color: rgba(203,129,18,1); transition: .2s }
.remodal > div.container.register-modal > div.content > div.form p.title { font-family: Butler; font-size: 2rem; padding-bottom: 2rem; transition: .2s; }
.remodal > div.container.register-modal > div.content > div.form p { font-size: 1.3rem; }
.remodal > div.container.register-modal > div.content > div.form p.long { padding: 0 3rem; }
.remodal > div.container.register-modal > div.content > div.form p.alert { color: rgba(140,0,0,1); }
.remodal > div.container.register-modal > div.content > div.result { display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(252,249,246,.9); z-index: 9; }
.remodal > div.container.register-modal > div.content > div.result > div.message { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); color: rgba(44,52,58,1); text-align: center; transition: .2s }
.remodal > div.container.register-modal > div.content > div.result > div.message > span.icon { display: block; font-size: 9rem; }
.remodal > div.container.register-modal > div.content > div.result > div.message > p > span { display: inline-block; padding-left: 1rem; vertical-align: middle; }
.remodal > div.container.register-modal > div.content > div.result > div.message > button { background: rgba(44,52,58,1); color: rgba(255,255,255,1); transition: .2s; }
.remodal > div.container.register-modal > div.content > div.result > div.message > button:hover { background: rgba(203,129,18,1); transition: .2s }
.remodal > div.container.register-modal > div.content > div.form div.form { position: absolute; left: 50%; transform: translateX(-50%); }
.remodal > div.container.register-modal > div.content > div.form form { text-align: left; display: inline-block; margin: 0 auto; }
.remodal > div.container.register-modal > div.content > div.form form > label { font-size: 1.2rem; background: rgba(255,255,255,1); padding: .2rem; position: relative; display: inline-block; transform: translateY(.4rem); }
.remodal > div.container.register-modal > div.content > div.form form > label.lost { display: block; margin-top: 2rem; clear: both; cursor: pointer; transition: .2s }
.remodal > div.container.register-modal > div.content > div.form form > label.lost:hover { color: rgba(203,129,18,1); transition: .2s }
.remodal > div.container.register-modal > div.content > div.form form > label > span.required { font-size: 1rem; color: rgba(140,0,0,1); transform: translateX(-.2rem); }
.remodal > div.container.register-modal > div.content > div.form form > input { outline: .1rem solid rgba(44,52,58,1) !important; outline-offset: .4rem; display: block; margin-bottom: 2rem; border: 0; transition: .2s; }
.remodal > div.container.register-modal > div.content > div.form form > input:focus { outline: .1rem solid rgba(203,129,18,1); transition: .2s; }
.remodal > div.container.register-modal > div.content > div.form form > label.chk { width: 1rem; height: 1rem; outline-offset: .1rem; outline: .1rem solid rgba(44,52,58,1); position: relative; transition: .2s; }
.remodal > div.container.register-modal > div.content > div.form form > label + label { padding-left: 1rem; }
.remodal > div.container.register-modal > div.content > div.form form > label.chk:after { content: ""; width: .8rem; height: .8rem; background: rgba(44,52,58,0); position: absolute; left: .1rem; top: .1rem; transition: .2s; }
.remodal > div.container.register-modal > div.content > div.form form > input.myremember:checked + label.chk:after { background: rgba(44,52,58,1); transition: .2s; }
.remodal > div.container.register-modal > div.content > div.form form > button { float: right; background: rgba(44,52,58,1); color: rgba(255,255,255,1); transform: translateX(.5rem); transition: .2s; }
.remodal > div.container.register-modal > div.content > div.form form > button:hover { background: rgba(203,129,18,1); transition: .2s; }
.remodal > div.container.register-modal > div.content > div.form > div.form + div.form { transform: scaleY(0) translateX(-50%); opacity: 0; transition: .2s; }
.remodal > div.container.register-modal > div.content > div.form.log > input.lostchk:not(:checked) + div.form { transform: scaleY(1) translateX(-50%); opacity: 1; transition: .2s; }
.remodal > div.container.register-modal > div.content > div.form.log > input.lostchk:checked + div.form { transform: scaleY(0) translateX(-50%); opacity: 0; transition: .2s; }
.remodal > div.container.register-modal > div.content > div.form.log > input.lostchk:checked + div.form + div.form { transform: scaleY(1) translateX(-50%); opacity: 1; transition: .2s; }
.remodal > div.container.register-modal > input.regchk:not(:checked) + div.content { animation: Regform_Right .8s ease-in-out 1 0s; }
.remodal > div.container.register-modal > input.regchk:checked + div.content { animation: Regform_Left .8s ease-in-out 1 0s; }
.remodal > div.container.register-modal > input.regchk:not(:checked) + div.content > div.image { animation: Regform_ImgU .6s ease-in-out 1 .2s; }
.remodal > div.container.register-modal > input.regchk:checked + div.content > div.image { animation: Regform_ImgC .6s ease-in-out 1 .2s; }
.remodal > div.container.register-modal > input.regchk:not(:checked) + div.content > div.image > div.log { animation: Regform_TextC .8s ease-in-out 1 .0s; }
.remodal > div.container.register-modal > input.regchk:not(:checked) + div.content > div.image > div.reg { animation: Regform_TextU .8s ease-in-out 1 .0s; }
.remodal > div.container.register-modal > input.regchk:checked + div.content > div.image > div.reg { animation: Regform_TextC .8s ease-in-out 1 .0s; }
.remodal > div.container.register-modal > input.regchk:checked + div.content > div.image > div.log { animation: Regform_TextU .8s ease-in-out 1 .0s; }
.remodal > div.container.register-modal > input.regchk:checked + div.content > div.result { left: 50%; }

/* INFO */
.remodal > div.container.info > div.content { padding-top: 4rem; text-align: center; transition: .2s }
.remodal > div.container.info > div.content > span.icon { display: block; font-size: 9rem; }
.remodal > div.container.info > div.content > button { background: rgba(44,52,58,1); color: rgba(255,255,255,1); transition: .2s; }
.remodal > div.container.info > div.content > button:hover { background: rgba(203,129,18,1); transition: .2s }

/* ARTICLE */
.remodal[data-remodal-id="article"] { width: 100vw; height: 100%; }
.remodal > div.container.article { overflow-y: scroll; background: rgba(44,52,58,.8); color: rgba(255,255,255,1) !important; border-radius: unset; width: 100%; height: 100%; max-height: unset; }
.remodal > div.container.article div.content { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); max-width: 80rem; max-height: 80rem; }
.remodal > div.container.article .close { color: rgba(255,255,255,1); }
.remodal > div.container.article p.sign { display: none; }
.remodal > div.container.article div#arrows { padding-top: 4rem; }
.remodal > div.container.article div#arrows .slick-arrow { color: rgba(255,255,255,1); font-size: 4rem; min-width: 15rem; }
/* Keyframes
   ========================================================================== */

@keyframes remodal-opening-keyframes {
  from {transform: scale(.3); opacity: 0; }
  to {transform: scale(1); opacity: 1; }
}

@keyframes remodal-closing-keyframes {
  from {transform: translate3d(0, 0, 0); opacity: 1; }
  to {transform: translate3d(0, 30rem, 0); opacity: 0; }
}

@keyframes remodal-olay-opening-keyframes {
  from {opacity: 0; }
  to {opacity: 1;
  }
}

@keyframes remodal-olay-closing-keyframes {
  from {opacity: 1; }
  to {opacity: 0; }
}

/* Media queries
   ========================================================================== */

@media only screen and (min-width: 901px) {
  .remodal {
    width: auto; 
    width: 80rem;
  }
}

@media only screen and (min-width: 1368px) {
}

@media only screen and (max-width: 768px) {
  @keyframes remodal-opening-keyframes {
    from {transform: scale(1.05) translateY(100vh); opacity: 0; }
    to {transform: none; opacity: 1; }
  }
}

/* IE8
   ========================================================================== */

.lt-ie9 .remodal-overlay {
  background: #2b2e38;
}

.lt-ie9 .remodal {
  width: 700px;
}
