@import url("reset.css");
/* - - - - - - - - - - - - - - - - - - - - VARIABLES - - - - - - - - - - - - - - - - - - - - */
/* - - - - - - - - - - - - - - - - - - - - BASE STYLES - - - - - - - - - - - - - - - - - - - - */
* {
  box-sizing: border-box; }

body {
  font-family: 'Lato', sans-serif;
  line-height: 21px;
  color: #555555;
  font-size: 12px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }
  @media (max-width: 1199px) {
    body > section {
      overflow-x: hidden; } }

a, input[type="submit"] {
  cursor: pointer;
  color: #FFFFFF;
  transition: all 0.3s ease-in-out;
  text-decoration: none; }
  a:hover, a:focus, a:active, input[type="submit"]:hover, input[type="submit"]:focus, input[type="submit"]:active {
    text-decoration: none;
    color: #ffc05c; }

i {
  color: #20b2bf; }

img {
  max-width: 100%; }

.full-page {
  width: 100%;
  height: 100vh; }

.flexize {
  display: flex;
  flex: 1; }

h1, h2, h3, h4, h5, h6 {
  text-transform: uppercase;
  font-weight: 700; }

.section-padding {
  padding: 80px 40px;
  background-color: #FFFFFF; }

.section-description {
  color: #FFFFFF;
  line-height: 28px;
  letter-spacing: 1px;
  width: 60%;
  margin: 0 auto;
  text-align: center; }

p {
  font-size: 13px;
  font-weight: 300; }

hr.light {
  display: block;
  width: 100%;
  height: 1px;
  background-color: rgba(255, 255, 255, 0.5);
  border: 0;
  outline: 0;
  margin: 30px 0; }

hr.dark {
  display: block;
  width: 100%;
  height: 1px;
  background-color: rgba(0, 0, 0, 0.1);
  border: 0;
  outline: 0;
  margin: 30px 0; }

.header-container {
  padding: 80px 0; }

/* - - - - - - - - - - - - - - - - - - - - COLUMNS - - - - - - - - - - - - - - - - - - - - */
.row {
  margin: 0 -30px; }
  .row .col-half {
    width: 50%;
    float: left;
    padding: 0 30px; }
  .row .col-1-4 {
    width: 25%;
    float: left;
    padding: 0 30px; }
  .row .col-1-3 {
    width: calc(100% / 3);
    float: left;
    padding: 0 30px; }
  .row .col-2-3 {
    width: calc((100% / 3) * 2);
    float: left;
    padding: 0 30px; }
  .row:after {
    content: '';
    display: block;
    clear: both; }

/* - - - - - - - - - - - - - - - - - - - - ROUNDED TRIANGLE HEADING - - - - - - - - - - - - - - - - - - - - */
h1.rounded-triangle-heading, h2.rounded-triangle-heading, h3.rounded-triangle-heading, h4.rounded-triangle-heading, h5.rounded-triangle-heading, h6.rounded-triangle-heading {
  width: 100%;
  height: 50px;
  line-height: 50px;
  text-align: center;
  font-weight: 300;
  letter-spacing: 2px;
  font-size: 12px;
  text-transform: uppercase;
  position: relative;
  border-radius: 4px 4px 0 0; }
  h1.rounded-triangle-heading.rounded-triangle-primary, h2.rounded-triangle-heading.rounded-triangle-primary, h3.rounded-triangle-heading.rounded-triangle-primary, h4.rounded-triangle-heading.rounded-triangle-primary, h5.rounded-triangle-heading.rounded-triangle-primary, h6.rounded-triangle-heading.rounded-triangle-primary {
    background-color: #20b2bf;
    color: #FFFFFF; }
    h1.rounded-triangle-heading.rounded-triangle-primary:after, h2.rounded-triangle-heading.rounded-triangle-primary:after, h3.rounded-triangle-heading.rounded-triangle-primary:after, h4.rounded-triangle-heading.rounded-triangle-primary:after, h5.rounded-triangle-heading.rounded-triangle-primary:after, h6.rounded-triangle-heading.rounded-triangle-primary:after {
      border-top: 10px solid #20b2bf; }
  h1.rounded-triangle-heading.rounded-triangle-secondary, h2.rounded-triangle-heading.rounded-triangle-secondary, h3.rounded-triangle-heading.rounded-triangle-secondary, h4.rounded-triangle-heading.rounded-triangle-secondary, h5.rounded-triangle-heading.rounded-triangle-secondary, h6.rounded-triangle-heading.rounded-triangle-secondary {
    background-color: #ffc05c;
    color: #FFFFFF; }
    h1.rounded-triangle-heading.rounded-triangle-secondary:after, h2.rounded-triangle-heading.rounded-triangle-secondary:after, h3.rounded-triangle-heading.rounded-triangle-secondary:after, h4.rounded-triangle-heading.rounded-triangle-secondary:after, h5.rounded-triangle-heading.rounded-triangle-secondary:after, h6.rounded-triangle-heading.rounded-triangle-secondary:after {
      border-top: 10px solid #ffc05c; }
  h1.rounded-triangle-heading:after, h2.rounded-triangle-heading:after, h3.rounded-triangle-heading:after, h4.rounded-triangle-heading:after, h5.rounded-triangle-heading:after, h6.rounded-triangle-heading:after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    position: absolute;
    left: calc(50% - 10px);
    top: 46px; }

/* - - - - - - - - - - - - - - - - - - - - BUTTONS - - - - - - - - - - - - - - - - - - - - */
.button, input[type="submit"] {
  border-radius: 4px;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 300;
  display: inline-block; }
  .button.button-small, input[type="submit"].button-small {
    padding: 8px 30px; }
  .button.button-large, input[type="submit"].button-large {
    padding: 15px 40px; }
  .button.button-primary, input[type="submit"].button-primary {
    background-color: #ffc05c;
    border: 1px solid #ffc05c; }
    .button.button-primary:hover, .button.button-primary:focus, .button.button-primary:active, input[type="submit"].button-primary:hover, input[type="submit"].button-primary:focus, input[type="submit"].button-primary:active {
      background-color: #FFFFFF;
      color: #ffc05c; }
  .button.button-secondary, input[type="submit"].button-secondary {
    background-color: rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(255, 192, 92, 0.5); }
    .button.button-secondary:hover, .button.button-secondary:focus, .button.button-secondary:active, input[type="submit"].button-secondary:hover, input[type="submit"].button-secondary:focus, input[type="submit"].button-secondary:active {
      background-color: rgba(0, 0, 0, 0.5);
      border: 1px solid #ffc05c; }

/* - - - - - - - - - - - - - - - - - - - - SECTION TITLE LIGHT (CHANGES COLOR) - - - - - - - - - - - - - - - - - - - - */
.section-title-light {
  text-align: center;
  margin: 0;
  font-size: 28px;
  font-weight: 500;
  line-height: 42px; }
  .section-title-light:after {
    content: '';
    display: block;
    width: 100px;
    height: 2px;
    background-color: #ffc05c;
    margin: 26px auto 20px auto; }

.section-title-light > span {
  position: relative;
  display: inline-block;
  color: #ffffff;
  letter-spacing: 2px; }

.section-title-light > span:before, .section-title-light > span:after {
  content: '';
  position: absolute;
  top: calc(50% - 5px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
  border-top: 1px solid rgba(255, 255, 255, 0.3);
  width: 200px;
  height: 5px;
  margin: 0 20px; }

.section-title-light > span:before {
  right: 100%; }

.section-title-light > span:after {
  left: 100%; }

.section-subtitle-light {
  text-align: center;
  font-size: 14px;
  color: rgba(255, 255, 255, 0.9);
  font-weight: 200;
  line-height: 32px;
  width: 80%;
  margin: 0 auto; }

/* - - - - - - - - - - - - - - - - - - - - SECTION TITLE DARK (CHANGES COLOR) - - - - - - - - - - - - - - - - - - - - */
.section-title-dark {
  text-align: center;
  margin: 0;
  font-size: 28px;
  font-weight: 500;
  line-height: 42px; }
  .section-title-dark:after {
    content: '';
    display: block;
    width: 100px;
    height: 2px;
    background-color: #ffc05c;
    margin: 26px auto 20px auto; }

.section-title-dark > span {
  position: relative;
  display: inline-block;
  color: #555555; }

.section-title-dark > span:before, .section-title-dark > span:after {
  content: '';
  position: absolute;
  top: calc(50% - 5px);
  border-bottom: 1px solid rgba(0, 0, 0, 0.3);
  border-top: 1px solid rgba(0, 0, 0, 0.3);
  width: 200px;
  height: 5px;
  margin: 0 20px; }

.section-title-dark > span:before {
  right: 100%; }

.section-title-dark > span:after {
  left: 100%; }

.section-subtitle-dark {
  text-align: center;
  font-size: 14px;
  color: rgba(0, 0, 0, 0.9);
  font-weight: 200;
  line-height: 32px;
  width: 80%;
  margin: 0 auto; }

/* - - - - - - - - - - - - - - - - - - - - HEADER - - - - - - - - - - - - - - - - - - - - */
header.main-header {
  position: fixed;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.3);
  width: 100%;
  height: 100px;
  z-index: 990;
  padding-left: 40px;
  padding-right: 40px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: 0.3s ease-in-out;
  box-shadow: 0px 5px 5px -5px rgba(0, 0, 0, 0);
  transition-property: height, line-height, background-color, box-shadow; }
  header.main-header.scrolled {
    background-color: white;
    box-shadow: 0px 5px 5px -5px rgba(0, 0, 0, 0.5);
    height: 60px; }
  header.main-header h1.logo {
    font-size: 32px;
    line-height: 100px;
    font-weight: 100;
    color: #FFFFFF;
    text-transform: uppercase;
    transition: 0.3s ease-in-out;
    transition-property: line-height, color; }
    header.main-header h1.logo.scrolled {
      line-height: 60px;
      color: #555555; }
    header.main-header h1.logo span {
      font-weight: 500; }
  header.main-header nav ul {
    display: flex;
    align-items: center; }
    header.main-header nav ul li {
      display: inline-block; }
      header.main-header nav ul li.menu-item {
        line-height: 100px; }
        header.main-header nav ul li.menu-item a {
          position: relative;
          font-size: 12px;
          font-weight: 300;
          text-transform: uppercase;
          padding: 0 20px;
          display: block;
          transition: 0.3s ease-in-out;
          transition-property: line-height, color; }
          header.main-header nav ul li.menu-item a:after {
            content: '';
            display: block;
            width: 0%;
            height: 3px;
            position: absolute;
            left: 0;
            bottom: 0;
            background-color: #ffc05c;
            transition: 0.3s ease-in-out;
            transition-property: width, color; }
          header.main-header nav ul li.menu-item a:hover, header.main-header nav ul li.menu-item a:focus, header.main-header nav ul li.menu-item a:active {
            background-color: rgba(0, 0, 0, 0.1); }
          header.main-header nav ul li.menu-item a:hover:after, header.main-header nav ul li.menu-item a:focus:after, header.main-header nav ul li.menu-item a:active:after {
            width: 100%; }
        header.main-header nav ul li.menu-item.scrolled {
          line-height: 60px; }
          header.main-header nav ul li.menu-item.scrolled a {
            color: #555555 !important; }
      header.main-header nav ul li #responsive-menu-trigger {
        display: none; }
      header.main-header nav ul li .button {
        margin-left: 10px; }
  @media (max-width: 1199px) {
    header.main-header #responsive-menu-trigger {
      display: block !important; }
    header.main-header .menu-item {
      display: none; } }
  @media (max-width: 767px) {
    header.main-header .menu-button {
      display: none !important; }
    header.main-header h1.logo {
      font-size: 24px; } }

/* - - - - - - - - - - - - - - - - - - - - SECTION HOME - - - - - - - - - - - - - - - - - - - - */
#home {
  background: linear-gradient(rgba(60, 60, 60, 0.6), rgba(60, 60, 60, 0.6)), url("../img/background-home.jpg");
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  display: flex;
  justify-content: center;
  align-items: center; }
  #home .welcome-message {
    text-align: center;
    padding-top: 100px;
    padding-bottom: 20px;
    max-width: 90%; }
    #home .welcome-message h1.title {
      font-size: 36px;
      line-height: 54px;
      color: #FFFFFF;
      letter-spacing: 1px; }
      #home .welcome-message h1.title:after {
        content: '';
        display: block;
        width: 30%;
        height: 2px;
        margin: 30px auto;
        background-color: #ffc05c; }
    #home .welcome-message h2.sub-title {
      font-size: 14px;
      line-height: 32px;
      font-weight: 300;
      color: #FFFFFF;
      text-transform: none;
      letter-spacing: 1px;
      margin-bottom: 30px; }
    #home .welcome-message a {
      margin: 10px; }
    #home .welcome-message i {
      display: block;
      text-align: center;
      margin: 40px 0 0 0;
      font-size: 32px;
      color: rgba(255, 255, 255, 0.5); }
  @media (max-width: 1023px) {
    #home.full-page {
      height: auto !important; }
      #home.full-page .welcome-message {
        padding-top: 160px !important;
        padding-bottom: 50px !important; }
      #home.full-page .scroll-down {
        display: none !important; } }

/* - - - - - - - - - - - - - - - - - - - - SECTION SUBSCRIPTION TYPES - - - - - - - - - - - - - - - - - - - - */
#subscription-types {
  background: linear-gradient(white, rgba(0, 0, 0, 0.15)); }
  #subscription-types.section-padding {
    padding: 40px; }
  #subscription-types header h1 {
    display: none; }
  #subscription-types .row {
    margin-top: -100px; }
  @media (max-width: 1199px) {
    #subscription-types .row {
      margin: 0 -15px 0 -15px;
      flex-wrap: wrap; }
    #subscription-types .col-1-3 {
      padding: 0 15px;
      display: flex; }
    #subscription-types.section-padding {
      padding: 30px; } }
  @media (max-width: 767px) {
    #subscription-types .col-1-3 {
      width: 100% !important;
      margin-top: 30px; }
      #subscription-types .col-1-3:first-child {
        margin-top: 0; } }

.subscription-type {
  box-shadow: 0 -10px 10px -10px rgba(0, 0, 0, 0.3);
  display: flex;
  flex-direction: column;
  height: 100%; }
  .subscription-type .content {
    background: #FFFFFF;
    padding: 30px;
    flex: 1;
    z-index: 999; }
  .subscription-type ul {
    background: #FFFFFF;
    padding: 30px;
    flex: 1;
    z-index: 999; }
    .subscription-type ul li {
      margin-top: 10px;
      font-weight: 300;
      line-height: 2rem; }
      .subscription-type ul li:first-child {
        margin-top: 0; }
      .subscription-type ul li i {
        margin-right: 10px; }
  .subscription-type .subscription-footer {
    padding: 10px 0;
    text-align: center;
    background-color: #F9F9F9; }

/* - - - - - - - - - - - - - - - - - - - - SECTION ABOUT TALENTIFICATION - - - - - - - - - - - - - - - - - - - - */
#about .header-container {
  background: linear-gradient(rgba(60, 60, 60, 0.8), rgba(60, 60, 60, 0.8)), url("../img/background-about.jpg");
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  padding-bottom: 160px; }
#about .section-padding {
  padding: 40px; }
  #about .section-padding .row {
    margin-top: -160px; }
    #about .section-padding .row .col-1-4:nth-child(1) .function-image {
      background: url("../img/function1.jpg");
      background-size: cover;
      background-position: center; }
    #about .section-padding .row .col-1-4:nth-child(2) .function-image {
      background: url("../img/function2.jpg");
      background-size: cover;
      background-position: center; }
    #about .section-padding .row .col-1-4:nth-child(3) .function-image {
      background: url("../img/function3.jpg");
      background-size: cover;
      background-position: center; }
    #about .section-padding .row .col-1-4:nth-child(4) .function-image {
      background: url("../img/function4.jpg");
      background-size: cover;
      background-position: center; }
  #about .section-padding .sub-heading h2 {
    display: block;
    text-transform: none;
    font-size: 21px;
    padding-bottom: 15px;
    margin-bottom: 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
  #about .section-padding .function {
    box-shadow: 0 -10px 10px -10px rgba(0, 0, 0, 0.3);
    display: flex;
    flex-direction: column;
    height: 100%; }
    #about .section-padding .function .function-image {
      margin: 0 auto;
      width: 100%; }
    #about .section-padding .function .function-content {
      background-color: #FFFFFF;
      padding: 30px 0;
      height: 100%; }
      #about .section-padding .function .function-content h3 {
        font-size: 16px;
        margin-bottom: 15px; }
      #about .section-padding .function .function-content p {
        text-align: left; }
  #about .section-padding .cta-section {
    text-align: center; }
    #about .section-padding .cta-section h2 {
      margin-bottom: 15px;
      font-weight: 300;
      font-size: 16px;
      text-transform: none; }
@media (max-width: 1199px) {
  #about .header-container {
    padding-bottom: 80px; }
  #about .row {
    margin: 0 -15px 0 -15px !important;
    flex-wrap: wrap; }
  #about .col-1-4 {
    width: 50% !important;
    padding: 0 15px;
    margin-top: 30px; }
    #about .col-1-4:nth-child(1), #about .col-1-4:nth-child(2) {
      margin-top: 0; }
  #about .section-padding {
    padding: 30px; } }
@media (max-width: 1023px) {
  #about .section-description {
    width: 90%; } }
@media (max-width: 767px) {
  #about .col-1-4 {
    width: 100% !important;
    margin-top: 30px !important; }
    #about .col-1-4:nth-child(1) {
      margin-top: 0 !important; } }

/* - - - - - - - - - - - - - - - - - - - - SECTION PRICING - - - - - - - - - - - - - - - - - - - - */
#pricing .section-padding {
  padding: 40px;
  background: linear-gradient(white, rgba(0, 0, 0, 0.15)); }
  #pricing .section-padding .row {
    margin-top: -160px; }
#pricing .header-container {
  background: linear-gradient(rgba(60, 60, 60, 0.8), rgba(60, 60, 60, 0.8)), url("../img/background-pricing.jpg");
  background-size: cover;
  background-position: center top;
  background-attachment: fixed;
  padding-bottom: 160px; }
@media (max-width: 1199px) {
  #pricing .header-container {
    padding-bottom: 80px; }
  #pricing .col-1-3 {
    padding: 0 15px;
    display: flex; }
  #pricing .section-padding {
    padding: 30px; }
    #pricing .section-padding .row {
      margin: 0 -15px 0 -15px; } }
@media (max-width: 1023px) {
  #pricing .section-description {
    width: 90%; } }
@media (max-width: 767px) {
  #pricing .row {
    flex-wrap: wrap; }
  #pricing .col-1-3, #pricing .subscription-type {
    width: 100%; }
  #pricing .col-1-3 {
    margin-top: 30px; }
    #pricing .col-1-3:first-child {
      margin-top: 0; } }

/* - - - - - - - - - - - - - - - - - - - - SECTION CONTACT - - - - - - - - - - - - - - - - - - - - */
#contact .header-container {
  background: linear-gradient(rgba(60, 60, 60, 0.8), rgba(60, 60, 60, 0.8)), url("../img/background-home.jpg");
  background-size: cover;
  background-position: center bottom;
  background-attachment: fixed; }
#contact .footer-container-fixed .section-padding {
  background-color: #222222;
  padding: 40px; }
  #contact .footer-container-fixed .section-padding form {
    margin-top: 30px; }
    #contact .footer-container-fixed .section-padding form .form-container {
      display: flex; }
      #contact .footer-container-fixed .section-padding form .form-container > div {
        flex: 1; }
      #contact .footer-container-fixed .section-padding form .form-container textarea {
        height: 100%;
        width: calc(100% - 20px);
        margin-left: 20px;
        padding: 10px; }
    #contact .footer-container-fixed .section-padding form .btn-submit {
      margin-top: 20px;
      float: right; }
#contact .footer-container-fixed .copyright {
  background: #1B1B1B;
  text-align: center;
  padding: 20px 0; }
  #contact .footer-container-fixed .copyright span {
    color: #FFFFFF;
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 10px; }
@media (max-width: 1199px) {
  #contact .col-1-3, #contact .col-2-3 {
    padding: 0 15px; }
  #contact .section-padding {
    padding: 30px !important; }
    #contact .section-padding .row {
      margin: 0 -15px 0 -15px; } }
@media (max-width: 1023px) {
  #contact .section-description {
    width: 90%; } }
@media (max-width: 767px) {
  #contact .col-1-3, #contact .col-2-3 {
    width: 100% !important;
    margin-top: 30px; }
    #contact .col-1-3:nth-child(1), #contact .col-2-3:nth-child(1) {
      margin-top: 0; }
    #contact .col-1-3:nth-child(1), #contact .col-2-3:nth-child(1) {
      margin-top: 0 !important; } }
@media (max-width: 467px) {
  #contact .form-container {
    flex-direction: column; }
  #contact textarea {
    margin: 20px 0 0 0 !important;
    width: 100% !important;
    height: 150px !important; } }

input[type="text"], input[type="email"], input[type="password"], textarea, select {
  width: 100%;
  height: 40px;
  border-radius: 8px;
  outline: 0;
  border: 2px solid #FFFFFF;
  background-color: white;
  padding: 0 10px;
  transition: all 500ms ease-in-out;
  color: #555555;
  margin-bottom: 10px; }
  input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus, textarea:focus, select:focus {
    border: 2px solid #ffc05c; }
  input[type="text"]:last-child, input[type="email"]:last-child, input[type="password"]:last-child, textarea:last-child, select:last-child {
    margin-bottom: 0; }

ul.footer-list {
  margin-top: 30px; }
  ul.footer-list li {
    height: 40px;
    line-height: 40px;
    padding: 0 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.1); }
    ul.footer-list li:last-child {
      border-bottom: 1px solid rgba(255, 255, 255, 0.1); }

label {
  display: inline-block;
  padding: 6px 15px;
  font-size: 1.2em;
  font-weight: bold; }

/* - - - - - - - - - - - - - - - - - - - - MODAL - - - - - - - - - - - - - - - - - - - - */
.video-modal-container .row {
  display: flex; }
  .video-modal-container .row .video {
    width: 100%;
    height: 100%;
    background-image: url("../img/placeholder.jpg");
    background-size: cover;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer; }
    .video-modal-container .row .video iframe {
      height: 100%; }
    .video-modal-container .row .video:hover i, .video-modal-container .row .video:focus i, .video-modal-container .row .video:active i {
      transform: scale(0.8);
      color: white; }
    .video-modal-container .row .video i {
      font-size: 100px;
      color: rgba(255, 255, 255, 0.5);
      transition: all 0.3s ease-in-out; }
  .video-modal-container .row .content h2 {
    font-size: 18px;
    margin-bottom: 15px; }
@media (max-width: 767px) {
  .video-modal-container .row {
    flex-direction: column; }
  .video-modal-container .video {
    margin-bottom: 30px;
    height: 150px !important; }
  .video-modal-container .col-half {
    width: 100%; } }

.login-container .login-image {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 4px;
  background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.2)), url("../img/placeholder.jpg");
  background-size: cover;
  background-position: center;
  z-index: -1; }
.login-container .login-content {
  background-color: rgba(255, 255, 255, 0.7);
  padding: 30px; }

.uk-modal-body {
  border-radius: 4px; }

/* - - - - - - - - - - - - - - - - - - - - LOGIN PAGE - - - - - - - - - - - - - - - - - - - - */
#login-page {
  background: linear-gradient(rgba(60, 60, 60, 0.6), rgba(60, 60, 60, 0.6)), url("../img/background-home.jpg");
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  display: flex;
  justify-content: center;
  align-items: center; }
  #login-page header.main-header {
    justify-content: center; }
  #login-page .login-container {
    padding-top: 100px;
    width: 50%; }
    @media (max-width: 767px) {
      #login-page .login-container {
        width: 100%; } }
    #login-page .login-container .header-container {
      padding: 0 0 30px 0; }
    #login-page .login-container .login-content {
      border-radius: 4px;
      margin: 0 auto;
      border: 1px solid #FFFFFF;
      box-shadow: 0 -10px 10px -10px rgba(0, 0, 0, 0.3);
      width: 90%; }

/* other annoying stuff ... ... */
.darklink {
  color: #555555; }

.darklink:hover {
  color: #000000; }

/* - - - - - - - - - - - - - - - - - - - - RESPONSIVE MENU - - - - - - - - - - - - - - - - - - - - */
#responsive-menu-trigger {
  width: 25px;
  height: 20px;
  position: relative;
  margin: 0 0 0 30px;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer; }
  #responsive-menu-trigger.scrolled span {
    background-color: #555555; }

#responsive-menu-trigger span {
  display: block;
  position: absolute;
  height: 2px;
  width: 100%;
  background: #FFFFFF;
  border-radius: 4px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out; }

#responsive-menu-trigger span:nth-child(1) {
  top: 0px; }

#responsive-menu-trigger span:nth-child(2), #responsive-menu-trigger span:nth-child(3) {
  top: 9px; }

#responsive-menu-trigger span:nth-child(4) {
  bottom: 0px; }

#responsive-menu-trigger.open span:nth-child(1) {
  top: 9px;
  width: 0%;
  left: 50%; }

#responsive-menu-trigger.open span:nth-child(2) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg); }

#responsive-menu-trigger.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg); }

#responsive-menu-trigger.open span:nth-child(4) {
  top: 18px;
  width: 0%;
  left: 50%; }

/*# sourceMappingURL=styles.css.map */