@import url("https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,400;0,700;1,400;1,700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Open+Sans:ital@0;1&display=swap");
@media (min-width: 375px) {
  .container {
    width: 100%; }
  nav {
    padding: 20px 50px; }
  .top {
    padding: 0px 50px;
    margin: 50px 0px;
    display: flex;
    flex-direction: column-reverse;
    text-align: center; }
    .top img {
      padding: 50px 0px 50px 0px;
      width: 100%;
      height: 90%; }
    .top .bold {
      color: #070439;
      font-weight: 700;
      font-size: 1.9rem;
      margin-bottom: 40px; }
    .top p {
      padding: 0px 20px 20px 20px;
      font-weight: 500;
      color: #070439; }
    .top .form {
      display: flex;
      flex-direction: column;
      margin-bottom: 100px; }
      .top .form input, .top .form button {
        height: 45px;
        margin: 10px 0px;
        border-radius: 5px;
        outline: none; }
      .top .form button {
        background: #3065f8;
        border: none;
        color: white;
        font-size: 1rem;
        font-weight: 500;
        box-shadow: 0px 5px 5px #d4cdcd; }
      .top .form input {
        padding: 0px 20px;
        border: 1px solid #070439; }
  .mid {
    display: flex;
    flex-direction: column-reverse;
    background-color: #f6f6fe;
    position: relative; }
    .mid .illusion {
      width: 100%;
      padding: 20px 20px; }
    .mid .heading {
      font-size: 1.2rem;
      text-align: center;
      font-weight: 700;
      color: #070439;
      padding: 50px 0px 20px 0px; }
    .mid p {
      font-size: 1.1rem;
      color: #070439;
      padding: 0px 50px; }
    .mid .link {
      padding: 30px;
      text-align: center; }
      .mid .link a {
        color: #3c9f8f;
        font-weight: 400;
        padding: 5px 0px;
        text-decoration: none;
        border-bottom: 1px solid #3c9f8f; }
    .mid .testimony {
      background: white;
      margin: 20px 20px 50px 50px;
      padding: 15px 20px;
      width: 80%;
      box-shadow: 0px 5px 10px #c5bebe; }
      .mid .testimony img {
        height: 30px;
        width: 30px;
        border-radius: 50%; }
      .mid .testimony p {
        padding: 0px;
        font-size: 0.9rem;
        word-spacing: 0.2em;
        color: #070439; }
      .mid .testimony .person {
        padding: 15px 0px;
        align-items: center;
        display: flex;
        height: 50px; }
        .mid .testimony .person div {
          padding: 5px;
          margin-left: 10px;
          font-size: 0.8rem; }
          .mid .testimony .person div span {
            font-size: 0.6rem;
            font-weight: 700; }
  .mid::before {
    content: '';
    position: absolute;
    top: -50px;
    left: 0px;
    width: 100%;
    height: 75px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url("../images/bg-curve-mobile.svg"); }
  .forms {
    background: #585989;
    color: white;
    padding: 50px 40px;
    text-align: center; }
    .forms .heading {
      font-size: 1.3rem;
      font-weight: 700;
      padding: 10px; }
    .forms p {
      font-size: 1rem;
      margin-bottom: 15px; }
    .forms input, .forms button {
      width: 75%;
      height: 35px;
      margin: 7px 0px; }
    .forms input {
      padding: 0px 15px; }
    .forms button {
      background: #3065f8;
      outline: none;
      border: none;
      color: white; }
  .container footer {
    background: #070439;
    padding: 50px 40px;
    color: white;
    display: flex;
    flex-direction: column; }
    .container footer .info {
      height: 60Vh;
      display: flex;
      flex-direction: column;
      justify-content: space-evenly; }
    .container footer .contact > div, .container footer .terms > div, .container footer .about > div {
      margin: 15px 0px; }
    .container footer .social {
      text-align: center; }
      .container footer .social i {
        margin: 0px 10px; } }

nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: 'Raleway', xsans-serif; }
  nav .navbar-brand .logo img {
    width: 50%; }
  nav .nav-links {
    font-weight: 400; }
    nav .nav-links a {
      text-decoration: none;
      margin: 5px;
      color: #070439; }

@media (min-width: 1440px) {
  .container {
    width: 100%;
    margin: 0 auto;
    display: flex;
    flex-direction: column; }
  nav {
    padding: 50px 100px; }
    nav .navbar-brand .logo img {
      width: 100%; }
    nav .nav-links {
      font-weight: 400; }
      nav .nav-links a {
        text-decoration: none;
        margin: 30px;
        color: #070439; }
  main {
    display: flex;
    flex-direction: column; }
    main .top {
      padding: 0px 100px;
      margin-bottom: 100px;
      display: flex;
      flex-direction: row;
      text-align: left; }
      main .top img {
        width: 100%; }
      main .top .bold {
        color: #070439;
        font-weight: 700;
        font-size: 3rem;
        margin-bottom: 10px; }
      main .top p {
        padding: 0px;
        width: 70%;
        text-align: left;
        font-weight: 500;
        color: #070439; }
      main .top .form {
        display: flex;
        flex-direction: row;
        margin-bottom: 100px; }
        main .top .form input,
        main .top .form button {
          height: 45px;
          margin: 10px 0px;
          border-radius: 5px;
          margin: 15px 20px 0px 0px; }
        main .top .form button {
          width: 30%;
          background: #3065f8;
          outline: none;
          border: none;
          color: white;
          font-size: 1rem;
          font-weight: 500;
          box-shadow: 0px 5px 5px #d4cdcd; }
        main .top .form input {
          width: 60%;
          padding: 0px 20px;
          border: 1px solid #070439; }
  .mid {
    padding: 0px 100px;
    margin-top: 50px;
    display: flex;
    flex-direction: row;
    position: relative; }
    .mid .illusion {
      width: 100%;
      padding: 50px; }
    .mid .heading {
      text-align: left;
      padding: 50px 0px 20px 0px;
      font-size: 2.3rem; }
    .mid p {
      padding: 0px;
      width: 80%; }
    .mid .link {
      padding: 10px 0px;
      text-align: left; }
    .mid .testimony {
      width: 60%;
      margin: 30px 0px;
      margin-bottom: 80px; }
      .mid .testimony p {
        width: 100%; }
  .mid::before {
    content: '';
    position: absolute;
    top: -80px;
    left: 0px;
    width: 100%;
    height: 100px;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url("../images/bg-curve-desktop.svg");
    z-index: -1; }
  .forms {
    padding: 50px 100px;
    text-align: left;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    height: 30vh;
    align-items: center; }
    .forms .heading {
      font-size: 1.8rem;
      padding: 0px; }
    .forms p {
      width: 70%;
      font-size: 1rem;
      margin: 15px 0px; }
    .forms input, .forms button {
      height: 35px;
      margin: 7px 0px; }
    .forms input {
      width: 75%; }
    .forms button {
      width: 30%; }
  .container footer {
    padding: 100px 100px;
    color: white;
    flex-direction: column;
    height: 50Vh; }
    .container footer .info {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      justify-content: space-between;
      align-content: flex-start;
      text-align: left; }
    .container footer .contact > div, .container footer .terms > div, .container footer .about > div {
      margin: 15px 0px;
      align-items: flex-start; }
    .container footer .social {
      text-align: left; }
      .container footer .social i {
        margin: 0px 15px; } }

* {
  margin: 0px;
  padding: 0px;
  box-sizing: border-box; }

body {
  font-family: 'Open Sans', sans-serif;
  font-weight: 400; }
