@import "header.css";
@import "aside.css";
@import "footer.css";

/* Font Awesome */
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css);

:root {
  --dialog-z-index: 11;

  --header-z-index: 10;
  --nav-menu-z-index: 9;

  --carousel-nav-button-z-index: 8;
  --carousel-content-z-index: 7;
  --carousel-text-z-index: 6;
  --carousel-image-z-index: 5;
}

* {
  margin: 0 0 0 0;
  padding: 0 0 0 0;
}

html,
body {
  font-family: Arial, sans-serif;
  background-color: #236, 236, 236;
  color: #333333;
  scroll-behavior: smooth;
  overflow-x: hidden;
}

body {
  padding-top: 100px;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 16px;
}

main {
  max-width: 1024px;
  width: 100%;

  background-color: #e6e6e6;

  > section {
    width: 100%;
    box-sizing: border-box;

    > .title {
      width: 100%;
      color: white;
      background: linear-gradient(90deg, #000000, #894242);

      padding: 1rem 0;
      box-sizing: border-box;

      display: flex;
      flex-direction: row;
      align-items: center;
      text-align: center;
      justify-content: center;
      gap: 1rem;
      text-transform: uppercase;
      font-size: 1.875rem;
    }
  }
}