/* line 8, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal {
  position: fixed;
  /* Stay in place */
  z-index: 1;
  /* Sit on top */
  padding-top: 80px;
  /* Location of the box */
  left: 0;
  top: 0;
  width: 100%;
  /* Full width */
  height: 100%;
  /* Full height */
  overflow: auto;
  /* Enable scroll if needed */
  background-color: black;
  /* Fallback color */
  background-color: rgba(0, 0, 0, 0.1);
  /* Black w/ opacity */
  height: 100vh;
  /* Modal Content */
}
/* line 31, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .modal-content {
  background-color: #2bced694;
  font-size: 20px;
  margin: auto;
  padding: 40px 60px 40px 60px;
  width: 50%;
  box-shadow: 3px 3px 9px #50474773;
}
/* line 41, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal body {
  font-family: "Poppins-Regular";
  font-size: 15em;
  color: #666;
  margin: 0;
}
/* line 48, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal :focus {
  outline: none;
}
/* line 52, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal textarea {
  resize: none;
}
/* line 56, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal input,
.preface-modal textarea,
.preface-modal select {
  font-family: "Poppins-Regular";
  font-size: 20px;
  color: #666;
}
/* line 65, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal p,
.preface-modal h1,
.preface-modal h2,
.preface-modal h3,
.preface-modal h4,
.preface-modal h5,
.preface-modal h6,
.preface-modal ul {
  margin: 0;
}
/* line 76, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal p {
  color: #005361;
  line-height: 30px;
  padding-top: 30px;
}
/* line 82, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal ul {
  padding: 0;
  margin: 0;
  list-style: none;
}
/* line 88, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal a {
  text-decoration: none;
  color: #e48f10;
}
/* line 93, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .accept {
  background: #055a05a8;
}
/* line 97, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .accept:hover {
  background: #055a05ed;
}
/* line 101, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .cancel {
  background: #808080a3;
}
/* line 105, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .cancel:hover {
  background: #808080;
}
/* line 110, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .wrapper {
  max-width: 1400px;
  min-height: 500px;
  margin: auto;
  display: flex;
  align-items: center;
}
/* line 119, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .wrapper .image-holder {
  width: 51%;
}
/* line 123, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .wrapper form {
  width: 100%;
  height: 70hv;
}
/* line 128, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .wizard > .steps .current-info,
.preface-modal .wizard > .steps .number {
  display: none;
}
/* line 133, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal #wizard,
.preface-modal #article {
  padding: 70px 75px 65px;
}
/* line 140, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .steps {
  margin-bottom: 30px;
}
/* line 144, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .steps ul {
  display: flex;
  position: relative;
}
/* line 148, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .steps ul li {
  width: 20.16%;
  margin-right: 10px;
}
/* line 152, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .steps ul li a {
  display: inline-block;
  width: 100%;
  height: 7px;
  background: #e6e6e6;
  border-radius: 3.5px;
}
/* line 160, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .steps ul li.current a {
  background: #005361;
  transition: all 0.5s ease;
}
/* line 165, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .steps ul:before {
  content: "Join Us";
  font-size: 22px;
  font-family: "Poppins-SemiBold";
  color: #333;
  top: -38px;
  position: absolute;
}
/* line 174, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .steps ul.step-2:before {
  content: "Activation and CEIP";
  font-weight: bold;
}
/* line 179, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .steps ul.step-3:before {
  content: "Information";
  font-weight: bold;
}
/* line 184, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .steps ul.step-4:before {
  content: "Network Checking";
  font-weight: bold;
}
/* line 189, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .steps ul.step-5:before {
  content: "Thank you";
}
/* line 193, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .form-row {
  margin-bottom: 12px;
}
/* line 197, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .form-row label {
  margin-bottom: 8px;
  display: block;
}
/* line 202, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .form-row.form-group {
  display: flex;
}
/* line 206, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .form-row.form-group .form-holder {
  width: 50%;
  margin-right: 21px;
}
/* line 211, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .form-row.form-group .form-holder:last-child {
  margin-right: 0;
}
/* line 215, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .form-holder {
  position: relative;
}
/* line 219, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .form-holder i {
  position: absolute;
  top: 11px;
  right: 19px;
  font-size: 17px;
  color: #999;
}
/* line 227, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .form-control {
  height: 42px;
  border: 1px solid #e6e6e6;
  width: 80%;
  padding: 0 18px;
  box-sizing: content-box;
  border-radius: 4px;
}
/* line 237, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .form-control:focus {
  border-color: #2bced694;
}
/* line 241, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .form-control::-webkit-input-placeholder {
  color: #999;
  font-size: 13px;
}
/* line 246, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .form-control::-moz-placeholder {
  color: #999;
  font-size: 13px;
}
/* line 251, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .form-control:-ms-input-placeholder {
  color: #999;
  font-size: 13px;
}
/* line 256, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .form-control:-moz-placeholder {
  color: #999;
  font-size: 13px;
}
/* line 261, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .form-control:focus {
  border-color: #2bced694;
}
/* line 265, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .form-control::-webkit-input-placeholder {
  color: #999;
  font-size: 13px;
}
/* line 270, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .form-control::-moz-placeholder {
  color: #999;
  font-size: 13px;
}
/* line 275, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .form-control:-ms-input-placeholder {
  color: #999;
  font-size: 13px;
}
/* line 280, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .form-control:-moz-placeholder {
  color: #999;
  font-size: 13px;
}
/* line 286, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .actions ul {
  display: flex;
  float: right;
  margin-top: 30px;
  justify-content: space-between;
}
/* line 293, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .actions ul.step-last {
  justify-content: flex-end;
}
/* line 297, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .actions ul.step-last li:first-child {
  display: none;
}
/* line 301, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .actions li {
  margin-left: 15px;
}
/* line 305, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .actions li a {
  padding: 0;
  border: none;
  display: inline-flex;
  height: 51px;
  align-items: center;
  background: #ffffffff;
  cursor: pointer;
  position: relative;
  padding-left: 30px;
  padding-right: 30px;
  color: #333;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  font-weight: 400;
  border-radius: 4px;
}
/* line 326, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .actions li a:hover {
  background: #dbfcff;
}
/* line 330, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .actions li a:hover:before {
  -webkit-animation-name: hvr-icon-wobble-horizontal;
  animation-name: hvr-icon-wobble-horizontal;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}
/* line 345, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .actions li:first-child a {
  background: #ffffff00;
  border-color: #ffffff;
  border-width: 1px;
  border-style: solid;
}
/* line 352, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .actions li:first-child a:before {
  left: 26px;
}
/* line 356, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .actions li:first-child a:hover {
  background: #ffffff;
}
/* line 360, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .actions li:last-child a {
  padding-left: 30px;
  font-weight: 400;
}
/* line 365, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .actions li:last-child a:before {
  right: 30px;
}
/* line 369, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .logo {
  width: 260px;
}
/* line 373, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .fail {
  font-size: 25px;
  color: red;
  font-weight: bold;
}
/* line 379, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal button {
  font-family: "Poppins-Regular";
  border: none;
  display: inline-flex;
  align-items: center;
  background: #f3d4b7;
  height: 51px;
  position: relative;
  padding-left: 30px;
  padding-right: 30px;
  color: #333;
  transition-duration: 0.3s;
  font-weight: 400;
  font-size: 20px;
}
/* line 395, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .bold {
  font-weight: bold;
  color: black;
}
/* line 404, /opt/genieacs-gui/app/assets/stylesheets/preface.css.scss */
.preface-modal .content {
  min-height: 423px;
}