@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400&display=swap");
::-webkit-scrollbar {
  width: 0px;
  background: transparent;
}

html {
  scroll-behavior: smooth;
}

body {
  overflow-x: hidden;
}

a {
  cursor: pointer;
}
a:hover {
  text-decoration: none;
}

h1 {
  margin-bottom: 0;
}

p {
  margin-bottom: 0;
}

@media only screen and (max-width: 768px) {
  section .row {
    padding-bottom: 50px;
  }
}

.banner {
  width: 100%;
  background-color: transparent;
  z-index: 2;
}
.banner .row {
  top: 0;
  left: 0;
  height: 100px;
}
.banner .banner__block {
  position: relative;
  background: inherit;
}
.banner .banner__open-menu {
  position: inherit;
  height: inherit;
  width: 100%;
}
@media only screen and (max-width: 768px) {
  .banner .banner__open-menu {
    position: absolute;
    height: 60vh;
    background: white;
    width: 100%;
    z-index: 99;
    top: 0;
    left: 0;
  }
}
.banner a {
  padding-right: 30px;
  font-size: 14px;
  color: white;
  font-family: "Poppins", sans-serif;
  font-weight: 200;
}
@media only screen and (max-width: 768px) {
  .banner a {
    font-size: 12px;
  }
}
@media only screen and (max-width: 1200px) {
  .banner a {
    padding-right: 15px;
    font-size: 12px;
  }
}
@media only screen and (max-width: 768px) {
  .banner a {
    padding-right: 0px;
    color: #577D3D;
    font-size: 18px;
    padding-bottom: 15px;
  }
}
.banner a:last-child {
  padding-left: 0px;
}
.banner .banner__close {
  font-size: 22px;
}
.banner .banner__logo {
  position: relative;
  height: 100%;
}
@media only screen and (max-width: 768px) {
  .banner .banner__logo {
    height: 80px;
    width: auto;
  }
}
.banner .banner__menu {
  position: relative;
  height: 100%;
}
.banner svg {
  width: 200px;
}
@media only screen and (max-width: 992px) {
  .banner svg {
    width: 160px;
  }
}
.banner .fa-bars {
  font-size: 24px;
  color: white;
  padding-top: 15px;
  cursor: pointer;
}
.banner .fa-times {
  font-size: 28px;
  cursor: pointer;
  color: #577D3D;
  margin-top: 40px;
}
.banner .fa-arrow-left {
  color: #577D3D;
  font-size: 14px;
}
.banner .fa-sign-in-alt, .banner .fa-sign-out-alt {
  color: #fff;
  font-size: 14px;
  padding-left: 2px;
}
@media only screen and (max-width: 768px) {
  .banner .fa-sign-in-alt, .banner .fa-sign-out-alt {
    display: none;
  }
}
.banner .auth {
  display: none;
}

.banner_withoutBg a {
  color: #577D3D;
}
.banner_withoutBg .fa-bars {
  color: #577D3D;
}

@media only screen and (min-width: 768px) {
  .information:after {
    content: "";
    position: absolute;
    width: 50%;
    height: 1px;
    background-color: #777777;
    left: 0;
    margin-top: 10px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 768px) {
  .information:after {
    left: 0;
    right: 0;
    margin: auto;
    width: 70%;
  }
}
@media only screen and (max-width: 768px) {
  .information .information__block:first-child {
    margin: 0 auto;
  }
}
.information .information__block:first-child img {
  width: 10%;
  height: 90%;
}
.information .information__block:first-child h1 {
  font-size: 50px;
  color: #A1C440;
}
@media only screen and (max-width: 992px) {
  .information .information__block:first-child h1 {
    font-size: 30px;
  }
}
@media only screen and (max-width: 768px) {
  .information .information__block:first-child h1 {
    font-size: 50px;
    color: #343a40;
  }
}
@media only screen and (max-width: 768px) and (max-width: 992px) {
  .information .information__block:first-child h1 {
    font-size: 30px;
  }
}
.information .information__block:first-child p {
  font-size: 14px;
  color: #212121;
  font-family: "Poppins", sans-serif;
  font-weight: 200;
}
@media only screen and (max-width: 768px) {
  .information .information__block:first-child p {
    font-size: 12px;
  }
}
.information .information__block:first-child a {
  background-color: #577D3D;
  color: white;
  padding: 25px 70px;
  text-align: center;
  border-radius: 50px;
  display: block;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  margin-top: 50px;
  font-size: 14px;
  color: white;
  font-family: "Poppins", sans-serif;
  font-weight: 200;
}
@media only screen and (max-width: 768px) {
  .information .information__block:first-child a {
    font-size: 12px;
  }
}
@media only screen and (max-width: 992px) {
  .information .information__block:first-child a {
    padding: 20px 50px;
  }
}
@media only screen and (max-width: 768px) {
  .information .information__block:first-child a {
    margin: 0 auto;
    margin-top: 30px;
  }
}
.information .information__block:first-child .information__text {
  margin-top: 30%;
}
@media only screen and (max-width: 768px) {
  .information .information__block:first-child .information__text {
    background: rgba(255, 255, 255, 0.9);
    padding: 20px;
    border-radius: 30px;
    margin-bottom: 30%;
  }
}
@media only screen and (max-width: 576px) {
  .information .information__block:first-child .information__text {
    margin-top: 20%;
  }
}
.information .information__block:last-child {
  overflow-y: hidden;
}
.information .information__block:last-child img {
  width: 100%;
  height: auto;
}
@media only screen and (max-width: 768px) {
  .information .information__block:last-child img {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
  }
}
@media only screen and (max-width: 768px) {
  .information .information__block:last-child {
    position: absolute;
    background-color: #a1c440;
    z-index: -1;
  }
}
.information .information__shadow {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: white;
  opacity: 0.1;
}
.information .information__transparent-block {
  min-height: 450px;
}

.platform:after {
  content: "";
  position: absolute;
  width: 50%;
  height: 1px;
  background-color: #777777;
  left: 0;
  margin-top: 10px;
}
@media only screen and (max-width: 768px) {
  .platform:after {
    left: 0;
    right: 0;
    margin: auto;
    width: 70%;
  }
}
.platform h1 {
  font-size: 50px;
  color: #343a40;
}
@media only screen and (max-width: 992px) {
  .platform h1 {
    font-size: 30px;
  }
}
.platform h1:last-of-type {
  padding-bottom: 30px;
}
.platform p {
  font-size: 14px;
  color: #212121;
  font-family: "Poppins", sans-serif;
  font-weight: 200;
}
@media only screen and (max-width: 768px) {
  .platform p {
    font-size: 12px;
  }
}
.platform span {
  color: #A1C440;
}
.platform a {
  background-color: #577D3D;
  color: white;
  padding: 25px 70px;
  text-align: center;
  border-radius: 50px;
  display: block;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  margin-top: 50px;
  font-size: 14px;
  color: white;
  font-family: "Poppins", sans-serif;
  font-weight: 200;
}
@media only screen and (max-width: 768px) {
  .platform a {
    font-size: 12px;
  }
}
@media only screen and (max-width: 992px) {
  .platform a {
    padding: 20px 50px;
  }
}
@media only screen and (max-width: 768px) {
  .platform a {
    margin: 0 auto;
    margin-top: 30px;
  }
}
.platform img {
  width: 100%;
}
.platform svg {
  height: 100px;
}
@media only screen and (max-width: 768px) {
  .platform svg {
    display: none;
  }
}

.work {
  position: relative;
  padding-bottom: 40px;
  padding-top: 50px;
}
@media only screen and (max-width: 768px) {
  .work {
    padding-bottom: 0;
  }
}
.work:after {
  content: "";
  position: absolute;
  width: 50%;
  height: 1px;
  background-color: #777777;
  left: 0;
  margin-top: 10px;
  left: auto;
  right: 0;
}
@media only screen and (max-width: 768px) {
  .work:after {
    left: 0;
    right: 0;
    margin: auto;
    width: 70%;
  }
}
@media only screen and (max-width: 768px) {
  .work:after {
    left: 0;
    right: 0;
    margin: auto;
    width: 70%;
  }
}
.work .information__block {
  text-align: center;
}
.work h1 {
  font-size: 50px;
  color: #212121;
  padding-bottom: 50px;
}
@media only screen and (max-width: 992px) {
  .work h1 {
    font-size: 30px;
  }
}
.work p {
  font-size: 14px;
  color: #212121;
  font-family: "Poppins", sans-serif;
  font-weight: 200;
}
@media only screen and (max-width: 768px) {
  .work p {
    font-size: 12px;
  }
}
.work p:first-of-type {
  padding-bottom: 30px;
}
.work p:last-of-type {
  padding-bottom: 50px;
}
.work img:first-child {
  width: 80%;
}
@media only screen and (max-width: 768px) {
  .work img:first-child {
    width: 120%;
    position: absolute;
    top: -10%;
  }
}
.work .work__circle img {
  width: 70%;
  position: absolute;
  top: -20%;
  right: -5%;
}
.work a {
  background-color: #577D3D;
  color: white;
  padding: 25px 70px;
  text-align: center;
  border-radius: 50px;
  display: block;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  margin-top: 50px;
  font-size: 14px;
  color: white;
  font-family: "Poppins", sans-serif;
  font-weight: 200;
  margin: 0 auto;
  margin-top: 20px;
  margin-bottom: 40px;
}
@media only screen and (max-width: 768px) {
  .work a {
    font-size: 12px;
  }
}
@media only screen and (max-width: 992px) {
  .work a {
    padding: 20px 50px;
  }
}
@media only screen and (max-width: 768px) {
  .work a {
    margin: 0 auto;
    margin-top: 30px;
  }
}

@media only screen and (max-width: 768px) {
  .information__text {
    text-align: center;
  }
}

.arrow {
  position: fixed;
  width: 85px;
  bottom: 15%;
  right: 10%;
  cursor: pointer;
  display: none;
}
.registration, .signIn {
  min-height: 70vh;
}
.registration h1, .signIn h1 {
  font-size: 50px;
  color: #343a40;
  font-size: 30px;
}
@media only screen and (max-width: 992px) {
  .registration h1, .signIn h1 {
    font-size: 30px;
  }
}
.registration p, .signIn p {
  font-size: 14px;
  color: #343a40;
  font-family: "Poppins", sans-serif;
  font-weight: 200;
  padding-top: 15px;
  margin-top: 0;
}
@media only screen and (max-width: 768px) {
  .registration p, .signIn p {
    font-size: 12px;
  }
}
.registration p a, .signIn p a {
  color: #577D3D;
}
.registration img, .signIn img {
  width: auto;
  max-height: 550px;
}
@media only screen and (max-width: 1200px) {
  .registration img, .signIn img {
    max-height: 90%;
  }
}
.registration input, .signIn input {
  width: 100%;
  border-radius: 4px;
  height: 40px;
  border: 1px solid #343a40;
  background-color: #fafafa;
}
.registration input:focus, .signIn input:focus {
  border: 1px solid #A1C440;
  outline: none;
}
.registration input[type=submit], .signIn input[type=submit] {
  color: #fff;
  background: #577D3D;
  margin-top: 20px;
  border: none;
  border-radius: 4px;
  padding: 0px 10px;
  height: 40px;
}
.registration input[type=submit]:hover, .signIn input[type=submit]:hover {
  background: #a1c440;
  transition: 0.2s;
}
.registration .error_value, .signIn .error_value {
  border: 1px solid #EF002A;
}
.registration .error, .signIn .error {
  padding-top: 2px;
}
.registration .error_true p, .signIn .error_true p {
  padding: 0 0 0 5px;
  font-size: 14px;
  color: #EF002A;
  font-family: "Poppins", sans-serif;
  font-weight: 200;
}
@media only screen and (max-width: 768px) {
  .registration .error_true p, .signIn .error_true p {
    font-size: 12px;
  }
}
.registration .error_true .fa-exclamation, .signIn .error_true .fa-exclamation {
  color: #EF002A;
  font-size: 14px;
}
.registration .error_false, .signIn .error_false {
  display: none;
}
.registration .facebook, .signIn .facebook {
  width: 100%;
  border-radius: 4px;
  height: 40px;
  background-color: #0059a5;
  padding: 15px 10px;
}
.registration .google, .signIn .google {
  background-color: #dc4e41;
  width: 100%;
  border-radius: 4px;
  height: 40px;
  padding: 15px 10px;
  margin-bottom: 15px;
  margin-top: 15px;
}
.registration .facebook p, .registration .google p, .signIn .facebook span, .signIn .google span {
  font-size: 14px;
  color: #fff;
  font-family: "Poppins", sans-serif;
  font-weight: 200;
  padding-top: 0;
  font-weight: bold;
  font-size: 15px;
}
.registration .facebook:hover, .registration .google:hover {
  color: white;
  opacity: 0.9;
  transition: 0.2s;
}

@media only screen and (max-width: 768px) {
  .registration .facebook p, .registration .google p, .signIn .facebook span, .signIn .google span {
    font-size: 12px;
  }
}
.registration i, .signIn i {
  color: #fff;
  font-size: 21px;
}

.footer {
  background-color: #577D3D;
  width: 100%;
}
.footer .row {
  height: 90px;
}
@media only screen and (max-width: 768px) {
  .footer .row {
    padding-bottom: 0;
    height: 70px;
  }
}
.footer p {
  font-size: 14px;
  color: white;
  font-family: "Poppins", sans-serif;
  font-weight: 200;
}
@media only screen and (max-width: 768px) {
  .footer p {
    font-size: 12px;
  }
}

.footer_fixed {
  position: fixed;
  bottom: 0;
}