*,
*::after,
*::before {
  margin: 0;
  padding: 0;
  box-sizing: border-box; }

:root {
  --primary-1: hsl(213, 96%, 18%);
  --primary-2: hsl(243, 100%, 62%);
  --primary-3: hsl(228, 100%, 84%);
  --primary-4: hsl(206, 94%, 87%);
  --primary-5: hsl(354, 84%, 57%);
  --neutral-1: hsl(231, 11%, 63%);
  --neutral-2: hsl(229, 24%, 87%);
  --neutral-3: hsl(217, 100%, 97%);
  --neutral-4: hsl(231, 100%, 99%);
  --neutral-5: hsl(0, 0%, 100%);
  --font-fam: "Ubuntu", sans-serif;
  --font-w-1: 400;
  --font-w-2: 500;
  --font-w-3: 700; }

html {
  font-size: 62.5%; }

body {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-direction: column;
  font-size: 1.6rem; }

.hidden {
  display: none; }

main {
  display: flex;
  padding: 2rem;
  border: 2px solid red;
  width: 100rem;
  aspect-ratio: 1.75; }
  main .container__sidebar {
    padding: 2rem;
    background-image: url(../assets/images/bg-sidebar-desktop.svg);
    background-size: contain;
    background-repeat: no-repeat; }
    main .container__sidebar ol li {
      position: relative;
      z-index: 1; }
      main .container__sidebar ol li::before {
        z-index: 0;
        position: absolute;
        top: 0;
        left: -40%;
        content: " ";
        height: 2rem;
        aspect-ratio: 1;
        border-radius: 100%;
        border: 0.4rem solid var(--primary-4); }
      main .container__sidebar ol li:hover {
        z-index: -1;
        position: absolute;
        top: 0;
        left: -40%;
        content: " ";
        height: 2rem;
        aspect-ratio: 1;
        border-radius: 100%;
        color: red;
        background-color: var(--primary-4); }
  main .container__content {
    padding: 6rem; }
    main .container__content .page__1 .form__1 {
      display: inline-flex;
      flex-direction: column; }

.attribution {
  font-size: 11px;
  text-align: center; }
  .attribution a {
    color: #3e52a3; }
