@import url('https://fonts.googleapis.com/css2?family=Overpass&display=swap');

    :root {
      --Orange: #fb7413;
      --White: #ffffff;
      --Light-Grey: hsl(217, 12%, 63%);
      --Medium-Grey: #7c8798;
      --Dark-Blue: hsl(213, 20%, 18%);
      --Very-Dark-Blue: hsl(216, 12%, 8%);
      --box-bgrd-color: linear-gradient(180deg, rgba(31, 38, 48, 1) 0%, rgba(23, 30, 40, 1) 0%);
      --Family: 'Overpass', sans-serif;
    }

    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }
    .orbody{
        height: 100vh;
      background: whitesmoke;
      font-family: var(--Family);
    }
    .mymain {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100%;
    color: var(--White);
    }

    form.main-container {
      width: 90%;
      max-width: 500px;
      background: var(--box-bgrd-color);
      border-radius: 1rem;
      padding: 2rem;
    }

    .image1 {
      width: 40px;
      height: 40px;
      background-color: rgba(251, 116, 19, 0.1);
      display: flex;
      justify-content: center;
      align-items: center;
      border-radius: 50%;
      margin-bottom: 1rem;
    }

    h2.para {
      font-size: 22px;
      margin-bottom: 1rem;
    }

    p.para-2 {
      font-size: 14px;
      margin-bottom: 1.5rem;
      color: var(--Light-Grey);
    }

    .form-section {
      margin-bottom: 1.5rem;
    }

     .form-section select,  .form-section input[type="text"] {
      width: 100%;
      padding: 0.6rem;
      border-radius: 10px;
      border: none;
      background-color: #7c879833;
      color: white;
      margin-top: 0.5rem;
    }

     .form-section select option {
      background-color: var(--Dark-Blue);
    }

    ul.rating {
      display: flex;
      justify-content: space-between;
      list-style: none;
      padding: 0;
      margin: 1.5rem 0;
    }

    .circle {
      width: 50px;
      height: 50px;
      background-color: #7c879833;
      border-radius: 50%;
      border: none;
      color: white;
      font-weight: bold;
      cursor: pointer;
    }

    .circle:hover,
    .circle.selected {
      background-color: var(--Orange);
    }

    .submit {
      text-align: center;
      margin-top: 1.5rem;
    }

    .submit button {
      width: 100%;
      height: 2.5rem;
      border-radius: 15px;
      border: none;
      background-color: var(--Medium-Grey);
      color: white;
      font-weight: bold;
      letter-spacing: 1px;
      cursor: pointer;
    }