.auth-wrapper{display:flex;flex-basis:100%;min-height:100vh;min-height:calc(var(--vh, 1vh)*100);width:100%}.auth-wrapper .auth-inner{width:100%}.auth-wrapper.auth-basic{align-items:center;justify-content:center;overflow:hidden}.auth-wrapper.auth-basic .auth-inner{position:relative}.auth-wrapper.auth-basic .auth-inner:before{background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAPQAAADzCAMAAACG9Mt0AAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAA9KADAAQAAAABAAAA8wAAAADhQHfUAAAAyVBMVEUAAAD///+AgP+AgP9mZv+AgNWAgP9tbf9gYP+AgP9xcf9mZv+AZuaAgP9dXf90dOhiYv92dv9mZu5mZv93d+53d/9paf94afCAcfFrXvJra/9mZvJzZvJzc/JoaP96b/Rqav91aupsYvV2bOt2bPVxaPZ7cfZqavZyau1waPd4aO9xafBxafh4afB1bfh4avFuZ/F2afJzZvJzZ/N0aPN0bvN3bPR0ae5yZ/R3be93bfR1au9zafBxbPVzavV0a/F0a/ZyafFwaPKZm3nTAAAAQ3RSTlMAAQIEBQYGBwgICQoKCgsLDQ0PDw8PERESExMUFBQWFxgYGhoaGxsdHSAgIiIiIyQlJygqLCwtLi8vLzAzNDU3Nzg7h9vbHgAAA9RJREFUeNrt3ftS2kAUx/Fc1gSyWsErtuJdRDQiiteolb7/QzUoTm07k4AzObuu3/MCez45yWbzT36eZ6b8erO1e1B97baadd+zocJWmg0HaXe/+uqmg2GWtkLT5Lle1m9LdhG2+1lvzuiUO1knEF81yFc1N+35m15kZOGodz1vyLx+v2Lseq/erxtZd/NuweCTtfiwaWLOD5FnsqI7+VnP3y8afnEs3Es/1+H1qvETwuq18B7e6VlwLup1ZM8kWWQBOsrmHL7GVtxvYRZYgQ4ywae61ffsqH5Lbq20bQm6ncp9P2ehJegwE/u+rl95ttSwLrVSc2ANetAU28dSa9Cp2E623bUG3d2VWmn/wBq0XCugQYMGLdVKoOJaoiuok1NdXSW1WAUfRPtRUllflaJf5ZE/O9pXVbZUPTov5c+IDqvtRwStdTgLutoxy6GnGfYb2o+1I2gd+1OiqzfLocvVE7TSDqG1mgodaqfQZbvZC9rXjqG1X45WzqFVKVpk0LLo4lGP0ZGD6KgMnTiITkrQgXYQrYNitHISrYrRsZPouBhdcxJdK0YnTqKTYrR2Eq1BgwYNGjRo0KBBgwYNGjRo0KBBgwYNGjRo0KBBgwYNGjRo0KBBgwYNGjRo0KBBgwYNGjRo0KBBgwYNGjRo0KBBgwYNGjRo0KBBgwYNGjRoh9DH59ag86ACoSYOL61B55EUQk1s3VqDzsNHhJpYe7QGncfMSHUxaliCHgcKSXVxeWQJehwdJdXF4dAS9DgkTKqLxuibFeiXODixNi7OrEC/BP+JtbE0WrYA/RrxKNfH2YUF6NegSbk+Gk87xtErN6EsWm88fzeMXpwE9EruLns/l42io4dJFLPo2/Po1w+D6IW7t9Bt2SPx3vOOMfS7eHVZtN54ulg2go56138Ct4XRunE2Ovsmjg46WeddUoUWr6WL0fCoIYgO2/2s91fstDZQjcPL0ePt5flpdXUwqW46uMrS1j95JNpQrW0dHp9UV/uT2m416/8HVGg3qzhpBjRo0KBBgwYNGjRo0KBBgwYNGjRo0KBBgwYNGjRo0KBBgwYNGjRo0KBBgwYNGjRo0KBBgwYNGjRo0KBBgwYNGjRo0KBBgwYNGjRo0KBBgwYNGjRo0KC/FDpx0pwUo2tOomvF6NhJdFyMVk6iVTE6cBIdeF9vJyvZx/I/AzuIjsrQvoNovwzt4FamSs0Ojrp80PmvoB0zh940pb7azf1yg7t0LIt978uppzbnalfucDW92ZndLPRmKweGPduYJ+zoM5/Dk+gD5NdvLhXXPp88qcUqmEH5G5JZRs6cuxwIAAAAAElFTkSuQmCC");content:" ";height:243px;left:-46px;position:absolute;top:-54px;width:244px}@media(max-width:575.98px){.auth-wrapper.auth-basic .auth-inner:before{display:none}}.auth-wrapper.auth-basic .auth-inner:after{background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAARAAAAEQCAMAAABP1NsnAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAABEKADAAQAAAABAAABEAAAAAAQWxS2AAAAwFBMVEUAAAD///+AgICAgP9VVaqqVf+qqv+AgL+AgP9mZsxmZv+ZZv+AgNWAgP9tbdttbf+Sbf+AYN+AgN+AgP9xceNmZv+AZuaAZv90dOh0dP9qav+AauqAav+AgP92dv9tbf+Abe2Abf93Zu53d+6AcO94afCAcfF5a+R5a/JzZuaAZvKAc/J5bed5bfOAaPN6b/R1auqAavR6ZvV6cPV2bOuAbPV7aPZ2be2AbfZ7au17avZ3Zu53b+57a+97a/d4aO9J6CoeAAAAQHRSTlMAAQICAwMDBAQFBQUGBgcHBwgICAkKCgoLCwwMDAwNDg4ODw8QERITExQUFBUVFhcYGBkZGhobHBwdHR4eHx8gJ5uMWwAAA/FJREFUeNrt2G1XEkEYxvHZNk2xHGzdbKFl0cTwgdSkCKzu7/+t4pw6sAjtjIueE/f8r3fMO35nZnbuy5gVGcvfzJe0rnTfGI+MggGJRUZnbpPIhJKt88nU53JnFULvyISY6KAv8vPj0vr2rYwiE2Z2B9J+uNYcyyQxwWZvaeGH3G4bMjsvI/kcwTC/V+7kLoahlITzQojP3ZFgsJCh7IJQzpX0QFj4uMiY18eDMZ9bZCF9OQahnK6cm/Y7js0sh/LF3Auv1PlQd3MxbdXYIQspV44EEEAAAWTNDAYYkKdJbNMsLzYueZbaZ2iM46RVbHBaiZ9Js+nHEdli42N9XuSen5hGp1CQTuOJQDRsD99N4gMSpYWapNH6IJo83CIeILZQFesEaber79NCWRoukOpNEnW0gXQqD81w6ACxhbrYde7VuFCYeA2QRCNIsgZISyNIqz6IyhPjOjNVIFYniK3dmKU6QdLaJUimEySrDZLrBMlrgxRKU7sxCw/EMe0CAggggADySJCqxixIkKpNEh6IozELD8RxjQACCCCAAPJIkKrGLEgQXqqAAEJjxrQLCCCAAEJjRmNGY8a0CwgggABCYwYIfQgggNCYMe0CAggggNCY0ZjRmDHtAgIIIIAAQmNGHwIIIDRmTLuAAAIIIDRmNGY0Zky7gAACCCCA0JjRhwACCI0Z0y4ggAACCI0ZjRmNGdMuIIAAAgggNGb0IYAAQmPGtAsIIIAAQmNGY0ZjxrQLCCCAAAIIjRl9CCCA0Jgx7QICCCCA0JjRmNGYMe0CAggggABCY0YfAgggNGZMu4AAAgggNGY0ZjRmTLuAAAIIIIDQmNGHAAIIjRnTLiCAAAIIjRmNGY0ZIEy7gAACCCA0ZvQhgABCY8a0CwgggABCY0ZjBgiNGdMuIIAAAgiN2f/Sh+Q6PfLaIJlOkKw2SKoTJK3dmFmdILb2tBvrBIlrg5iWRo+WqQ+SaARJ1gCJAzsxThCN16p1vNurGjNjoo42j07kAHFskoY2kEbl33U0ZgoPjXW+Rl0gkarnahqtDaJKxMPDDWIiNafGenh4gExvVhXfmk7Da6L1AVGxSby2h6MxK79Zk42ea1pJbJ48sU2zDezQ8iy1z6BBwoyjMQsvXp8YQAAhgADilRfyy+wf8WqZZUfGZihvgZiB3FybC+kCUU5XLkAo50C+gbBQdUzkAIVyejIAYfFTI1solHP2HgNCnHn5AYNy4jvpoVB6fVzL91cwzLJ9Lfd7S0jhehxO5H5/yePr1W6gHonI7fJ5ORSR/n6Q2yQanq763zuXU5LJZRKiyD/W9/pjkdPZz0/yJ8fqVyry+qQZDMjJKoDfy8bRVhHhQTwAAAAASUVORK5CYII=");bottom:-55px;content:" ";height:272px;position:absolute;right:-75px;width:272px;z-index:-1}@media(max-width:575.98px){.auth-wrapper.auth-basic .auth-inner:after{display:none}}.auth-wrapper.auth-cover{align-items:flex-start}.auth-wrapper.auth-cover .auth-inner{height:100vh;height:calc(var(--vh, 1vh)*100);overflow-y:auto}.auth-wrapper.auth-cover .brand-logo{justify-content:unset;left:2rem;margin:0;position:absolute;top:2rem;z-index:1}.auth-wrapper.auth-basic .auth-inner{max-width:400px}.auth-wrapper .brand-logo{display:flex;justify-content:center;margin:1rem 0 2rem}.auth-wrapper .brand-logo .brand-text{font-weight:600}.auth-wrapper .auth-footer-btn .btn{padding:.6rem!important}.auth-wrapper .auth-footer-btn .btn:not(:last-child){margin-right:1rem}.auth-wrapper .auth-footer-btn .btn:focus{box-shadow:none}.auth-wrapper .auth-input{max-width:50px;padding-left:.571rem;padding-right:.571rem}.auth-wrapper .custom-options-checkable .plan-price .pricing-value{font-size:3rem}.auth-wrapper .custom-options-checkable .plan-price sup{left:.2rem;top:-1.5rem}.auth-wrapper .custom-options-checkable .plan-price sub{bottom:0;right:.14rem}@media(min-width:1200px){.auth-wrapper.auth-cover .auth-card{width:400px}}@media(max-width:575.98px){.auth-wrapper.auth-cover .brand-logo{left:1.5rem;padding-left:0}}.auth-wrapper .auth-bg{background-color:#fff}.dark-layout .auth-wrapper .auth-bg{background-color:#283046}@media(max-height:825px)and (max-width:991.98px){.dark-layout .auth-wrapper .auth-inner{background-color:#283046}.auth-wrapper .auth-bg{margin:auto 0;padding-top:3rem}.auth-wrapper .auth-inner{background-color:#fff}.auth-wrapper.auth-cover .auth-inner{display:flex;flex-direction:column;flex-wrap:nowrap;padding-bottom:1rem}.auth-wrapper.auth-cover .brand-logo{left:0;padding-left:1.5rem;position:relative}}


@import url("https://fonts.googleapis.com/css?family=Montserrat:400,700");
*, *::after, *::before {
  margin: 0;
  padding: 0;
  box-sizing: inherit;
}

html {
  height: 100%;
  font-size: 65.2%;
  box-sizing: border-box;
  font-family: Montserrat, sans-serif;
  -webkit-font-smoothing: antialiased;
  font-weight: 400;
}

body {
  height: 100%;
  background: #e9ebee;
  background-image: url("../../../images/backgrounds/bg.png");

  color: #1d2129;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  perspective: 1500px;
}

h1 {
  font-weight: 700;
  font-size: 3.5em;
  text-align: center;
}

.version {
  position: absolute;
  bottom: 1em;
  right: 2em;
  border-radius: 40px;
  background: #ff4b2b;
  color: #fff;
  font-size: 1em;
  font-weight: bold;
  padding: 0.8em 2em;
  letter-spacing: 1px;
  transition: transform 80ms ease-in;
}

form input {
  background: #eee;
  border: none;
  padding: 12px 15px;
  margin: 8px 0;
  width: 100%;
  font-size: 1.4em;
}

span {
  color: #333;
  font-size: 1.4em;
  display: inline-block;
  margin: 15px auto;
  font-weight: 100;
}

span.remember {
  float: left;
}


span.forget {
  float: right;
}

span.clearfix {
  clear: both;
  display: table;
}

span.loginwith {
  display: block;
  width: 100%;
  margin-top: 1em;
  white-space: nowrap;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}
span.loginwith::before {
  content: "";
  display: inline-block;
  width: 42%;
  height: 1px;
  background: #aaa;
  vertical-align: middle;
  margin-right: 5%;
}
span.loginwith::after {
  content: "";
  display: inline-block;
  width: 45%;
  height: 1px;
  background: #aaa;
  vertical-align: middle;
  margin-left: 5%;
}

span.copy {
  display: block;
  position: absolute;
  bottom: 0;
  font-size: 1em;
}

button {
  display: block;
  margin: 1em auto;
  border-radius: 40px;
  border: 1px solid #28c76f ;
  background: #28c76f ;
  color: #fff;
  font-size: 1.2em;
  font-weight: bold;
  padding: 0.8em 2em;
  letter-spacing: 1px;
  text-transform: uppercase;
  transition: transform 80ms ease-in;
}
button svg {
  vertical-align: middle;
}

button:hover {
  cursor: pointer;
}

button:active {
  transform: scale(0.95);
}

button:focus {
  outline: none;
}

#container {
  width: 95%;
  max-width: 800px;
  height: 500px;
  position: relative;
  border-radius: 20px;
  box-shadow: 0 14px 28px -10px rgba(0, 0, 0, 0.1), 0 10px 10px -10px rgba(0, 0, 0, 0.02);
  transform-style: preserve-3d;
}
#container > div {
  position: absolute;
  width: 50%;
  min-width: 350px;
  height: 120%;
  top: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.clearfix::after {
    content: "";
    display: table;
    clear: both;
}

.input-wrapper {
    position: relative;
}

[type='file'],
[type='checkbox'],
[type='radio'] {
  margin: 0 0 1rem; }

[type='checkbox'] + label,
[type='radio'] + label {
  display: inline-block;
  vertical-align: baseline;
  margin-left: 0.5rem;
  margin-right: 1rem;
  margin-bottom: 0; }
  [type='checkbox'] + label[for],
  [type='radio'] + label[for] {
    cursor: pointer; }

label > [type='checkbox'],
label > [type='radio'] {
  margin-right: 0.5rem; }
.content {
  width: 100%;
  padding: 2em 4em;
  text-align: center;
}
.content p {
  font-size: 1.4em;
}

.login {
  left: 0;
  background: #FAFAFA;
  border-radius: 20px 0 0 20px;
}
.login button {
  border-radius: 0px;
  width: 100%;
}
.login svg {
  margin: 1em;
  stroke: #999;
}

.register {
  right: 0;
  z-index: 1;
  border-radius: 0 20px 20px 0;
  background: #FAFAFA;
}
.register button {
  border-radius: 0px;
  width: 100%;
}
.register svg {
  margin: 1em;
  stroke: #999;
}

/* Style for the error message container */
.alert {
  padding: 0.75rem 1.25rem;
  margin-bottom: 1rem;
  border: 1px solid transparent;
  border-radius: 0.25rem;
}

/* Style for the error message text */
.alert-danger {
  color: #721c24;
  background-color: #f8d7da;
  border-color: #f5c6cb;
}

/* Style for the Feather icon */
.alert-body i {
  color: #721c24; /* Adjust icon color */
  margin-right: 0.5rem; /* Add some spacing between icon and text */
}

/* Style for the error message container */
.alert-validation-msg {
  padding: 0.75rem;
  margin-top: 0.5rem; /* Adjust margin top */
  border: 1px solid #dc3545; /* Adjust border color */
  border-radius: 0.25rem;
  background-color: #f8d7da; /* Adjust background color */
}

/* Style for the error message text */
.alert-validation-msg span {
  color: #721c24; /* Adjust text color */
}

/* Style for the Feather icon */
.alert-validation-msg i {
  color: #721c24; /* Adjust icon color */
}




.page {
  right: 0;
  color: #fff;
  border-radius: 0 20px 20px 0;
  transform-origin: left center;
  transition: -webkit-animation 1s linear;
  transition: animation 1s linear;
  transition: animation 1s linear, -webkit-animation 1s linear;
}
.page button {
  border-color: #fff;
  background: transparent;
}
.page p {
  margin: 2em auto;
}

.front {
    background: linear-gradient(-45deg, #28c76f  0%, #12a589 100%) no-repeat 0 0/200%;  z-index: 3;
}

.back {
    background: linear-gradient(-45deg, #28c76f  0%, #12a589 100%) no-repeat 0 0/200%;  z-index: 2;
}
.back .content {
  transform: rotateY(180deg);
}

.active .front {
  -webkit-animation: rot-front 0.6s ease-in-out normal forwards;
          animation: rot-front 0.6s ease-in-out normal forwards;
}

.active .back {
  -webkit-animation: rot-back 0.6s ease-in-out normal forwards;
          animation: rot-back 0.6s ease-in-out normal forwards;
}

.close .front {
  -webkit-animation: close-rot-front 0.6s ease-in-out normal forwards;
          animation: close-rot-front 0.6s ease-in-out normal forwards;
}

.close .back {
  -webkit-animation: close-rot-back 0.6s ease-in-out normal forwards;
          animation: close-rot-back 0.6s ease-in-out normal forwards;
}

@-webkit-keyframes rot-front {
  from {
    transform: translateZ(2px) rotateY(0deg);
  }
  to {
    transform: translateZ(1px) rotateY(-180deg);
  }
}

@keyframes rot-front {
  from {
    transform: translateZ(2px) rotateY(0deg);
  }
  to {
    transform: translateZ(1px) rotateY(-180deg);
  }
}
@-webkit-keyframes close-rot-front {
  from {
    transform: translateZ(1px) rotateY(-180deg);
  }
  to {
    transform: translateZ(2px) rotateY(0deg);
  }
}
@keyframes close-rot-front {
  from {
    transform: translateZ(1px) rotateY(-180deg);
  }
  to {
    transform: translateZ(2px) rotateY(0deg);
  }
}
@-webkit-keyframes rot-back {
  from {
    transform: translateZ(1px) rotateY(0deg);
  }
  to {
    transform: translateZ(2px) rotateY(-180deg);
  }
}
@keyframes rot-back {
  from {
    transform: translateZ(1px) rotateY(0deg);
  }
  to {
    transform: translateZ(2px) rotateY(-180deg);
  }
}
@-webkit-keyframes close-rot-back {
  from {
    transform: translateZ(2px) rotateY(-180deg);
  }
  to {
    transform: translateZ(1px) rotateY(0deg);
  }
}
@keyframes close-rot-back {
  from {
    transform: translateZ(2px) rotateY(-180deg);
  }
  to {
    transform: translateZ(1px) rotateY(0deg);
  }
}
.active .register .content {
  -webkit-animation: show 0.7s ease-in-out normal forwards;
          animation: show 0.7s ease-in-out normal forwards;
}

.close .register .content {
  -webkit-animation: hide 0.7s ease-in-out normal forwards;
          animation: hide 0.7s ease-in-out normal forwards;
}

.active .login .content {
  -webkit-animation: hide 0.7s ease-in-out normal forwards;
          animation: hide 0.7s ease-in-out normal forwards;
}

.close .login .content {
  -webkit-animation: show 0.7s ease-in-out normal forwards;
          animation: show 0.7s ease-in-out normal forwards;
}

@-webkit-keyframes show {
  from {
    opacity: 0;
    transform: scale(0.8);
  }
  to {
    opacity: 0.99;
    transform: scale(0.99);
  }
}

@keyframes show {
  from {
    opacity: 0;
    transform: scale(0.8);
  }
  to {
    opacity: 0.99;
    transform: scale(0.99);
  }
}
@-webkit-keyframes hide {
  from {
    opacity: 0.99;
    transform: scale(0.99);
  }
  to {
    opacity: 0;
    transform: scale(0.8);
  }
}
@keyframes hide {
  from {
    opacity: 0.99;
    transform: scale(0.99);
  }
  to {
    opacity: 0;
    transform: scale(0.8);
  }
}