:root {
  --white-color: #fff;
  --black-color: #000;
  --grey-color: #c0c0c0;
  --dark-grey: #878787;
  --gold: #be8f3f;
  --lightGold: #d4a759;
  --darkBlue-color: #022332;
  --lightDarkBlue-color: #063d56;
  --blueHover: #215166;
}

.main {
  position: absolute;
  width: calc(100% - 200px);
  left: 200px;
  min-height: 100vh;
  background: var(--white-color);
  transition: 0.5s;
}

.main .topbar {
  width: 100%;
  background: var(--grey-color);
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

/* Start Search bar */
.main .topbar .search-bar-large-screens {
  display: inline;
}

.main .topbar .search-bar-icon-small-screens {
  display: none;
  margin-right: 15px;
  cursor: pointer;
}

.main .search-bar-small-screens {
  display: none;
  padding: 10px;
}

.main .search-bar-small-screens.active {
  display: flex;
  justify-content: center;
  align-items: center;
}

/* End Search bar */

/* Start Social */

/* Social in index */
.main .social {
  font-size: 40px;
  display: none;
}

/* End Social */

.main .topbar .hamburger {
  display: none;
}

.welcome-section {
  margin: 0;
  padding: 0;
  background-image: url("../home-page2.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif, Tahoma, Geneva, Verdana, sans-serif;
}

.welcome-section .welcome {
  color: var(--darkBlue-color);
  font-size: 95px;
  font-weight: 100;
  height: 100vh;
}

.discover {
  font-size: 26px;
  color: var(--dark-grey);
}

#btn-players {
  color: var(--white-color);
  background: var(--darkBlue-color);
}

#btn-players:hover {
  background: var(--lightDarkBlue-color);
}

#btn-agents {
  color: var(--white-color);
  background: var(--gold);
}

#btn-agents:hover {
  color: var(--white-color);
  background: var(--lightGold);
}

/* Start Info Section */
.info-section {
  color: var(--darkBlue-color);
}
.info-section span {
  font-size: 30px;
  font-weight: bold;
}
/* Start Info Section */

/* 992px and down */
@media (max-width: 992px) {
  .main {
    position: absolute;
    left: 0;
    width: 100%;
  }

  .main .topbar .hamburger {
    display: inline;
  }

  .main .social {
    display: inline;
  }

}

/* 768px and down */
@media (max-width: 768px) {

  .main .topbar .search-bar-large-screens {
    display: none;
  }

  .main .topbar .search-bar-icon-small-screens {
    display: inline;
  }

  .welcome-section .welcome {
    font-size: 75px;
    height: 70vh;
  }

  .discover {
    font-size: 22px;
  }
}

/* 576px and down */
@media (max-width: 576px) {

  .welcome-section .welcome .welcome-title {
    font-size: 60px;
    font-weight: bold;
  }

  .welcome-section .welcome .discover {
    font-size: 18px;
    font-weight: 400;
  }

  #text-info {
    font-weight: 400;
  }

}