body {
  font-weight: 300;
  color: white;
  text-align: center;
  font-family: "Roboto Condensed";
  background: #456271;
  background: radial-gradient(circle, #456271 0%, #202131 100%); }

@media (min-width: 768px) {
  .h-md-100 {
    height: 100%; } }

.profile {
  width: 28%; }
  @media (min-width: 768px) {
    .profile {
      width: 20%; } }

.logo {
  width: 45%; }
  @media (min-width: 768px) {
    .logo {
      width: 28%; } }

.fs-7 {
  font-size: 0.8em; }

@media (min-width: 768px) {
  .big-border {
    border: 1em solid white; } }

.middle .carousel-control-next {
  width: 10%; }
  @media (min-width: 768px) {
    .middle .carousel-control-next {
      right: -100px;
      width: 15%; } }
  @media (max-width: 768px) {
    .middle .carousel-control-next span {
      width: 1em;
      height: 1em; } }
.middle .carousel-item {
  transition: transform 0.4s ease-in-out; }
.middle .carousel-control-prev {
  width: 10%; }
  @media (min-width: 768px) {
    .middle .carousel-control-prev {
      left: -100px;
      width: 15%; } }
  @media (max-width: 768px) {
    .middle .carousel-control-prev span {
      width: 1em;
      height: 1em; } }
.middle .carousel {
  box-shadow: 15px 18px 30px #23253540; }

.bottom {
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(2, min-content);
  grid-gap: 1.7em;
  width: min-content; }
  @media (min-width: 768px) {
    .bottom {
      grid-template-columns: repeat(2, 1fr);
      grid-template-rows: repeat(3, min-content); } }
  .bottom a {
    height: 50px; }
    .bottom a:nth-child(1) img {
      border-color: #a97ec8; }
    .bottom a:nth-child(2) img {
      border-color: #305260; }
    .bottom a:nth-child(3) img {
      border-color: #82bce0; }
    .bottom a:nth-child(4) img {
      border-color: #dc2e43; }
    .bottom a:nth-child(5) img {
      border-color: #526eaa; }
    .bottom a:nth-child(6) img {
      border-color: #348e61; }
  .bottom img {
    width: 50px;
    border-width: 1px;
    border-style: solid;
    transition: transform 0.2s;
    box-shadow: 3px 3px 5px #2325359e; }
    .bottom img:hover {
      transform: scale(1.2);
      border-width: 2px; }