.formFloat
  // display: none!important
  width: 100%
  background: transparent
  position: fixed
  z-index: 3
  top: 0
  right: -100%
  overflow-y: scroll
  display: grid
  place-items: center
  padding: 0rem
  transition: right .2s ease
  &::-webkit-scrollbar
    width: 3px
    background-color: rgba(0, 0, 0, .1)
  &::-webkit-scrollbar-thumb
    background-color: $yellow
    border-radius: 5px
  @media (min-width: 768px)
    width: 50%
  @media (min-width: 1024px)
    width: 35%
  @media (min-width: 1280px)
    width: 30%
  @media (min-width: 1900px)
    width: 26%
  .black
    display: none
    @media (min-width: 1280px)
      display: block
      position: fixed
      top: 0
      right: -100%
      // left: 50%
      // transform: translateX(-50%)
      background: rgba(0, 0, 0, .8)
      height: 100vh
      width: 100%
      z-index: 0
      transition: right .15s ease
  .black.show
    right: 0
  .content
    width: 100%
    align-items: flex-start
    justify-content: center
    background: rgba(255, 255, 255, .9)
    padding: 3rem
    height: 100dvh
    @media (max-width: 980px)
      height: 100vh
      overflow: auto
      padding-top: 60%
    .formClose
      position: absolute
      top: 5%
      right: 5%
      width: 30px
      @media (max-width: 980px)
        top: 5%
        right: 5%
      @media (min-width: 1280px)
        cursor: pointer
    h2, p, span
      color: $textColor
    h2,p
      text-align: left
    h2
      //text-transform: uppercase
      margin-bottom: 1rem
      @media (min-width: 1024px)
        font-size: 24px
      @media (min-width: 1440px)
        font-size: 26px
      @media (min-width: 1600px)
        font-size: 28px
    p
      margin-bottom: 2rem
    a
      color: $yellow
    @media (min-width: 768px)
      align-items: flex-start
      h2, p
        text-align: left
      p
        width: 85%
  .content form  
    width: 100%
    gap: 1.2rem 0
    input:not([type=checkbox]), textarea
      border: 1px solid $yellow
      background-color: $textBackColor
      border-radius: 20px
      color: $textColor
      width: 100%
      &::placeholder
        color: $textColor
    input:not([type=checkbox])
      height: 2.5rem
      padding: 0 1rem
    textarea
      width: 100%
      resize: none
      padding: .5rem 1rem
  .policy
    gap: 1rem
    align-items: center
    .text
      gap: 0 5px
      grid-template-columns: 1rem 1fr
      place-items: start
      span
        color: $textColor
        font-size: 10px
      span a 
        color: $yellow
        font-size: 10px
    // @media (min-width: 1024px)
    //   flex-direction: row
    //   justify-content: space-between
    //   .text
    //     width: 75%
    @media (min-width: 1366px)
      .text
        span, span a
          font-size: 11px
    .btnFormModal
      // display: grid
      // place-items: center
      background: $yellow
      border-radius: 20px
      padding: .6rem 1rem
      font-size: 14px
      font-weight: $font-bold
      color: $textColor
      @media (min-width: 1280px)
        cursor: pointer
.formFloat.show
  right: 0





// .scale-up-center
//   display: block
//   -webkit-animation: scale-up-center 0.3s cubic-bezier(0.39, 0.575, 0.565, 1) both
//   animation: scale-up-center 0.3s cubic-bezier(0.39, 0.575, 0.565, 1) both

// @-webkit-keyframes scale-up-center
//   0%
//     -webkit-transform: scale(0)
//     transform: scale(0)

//   100%
//     -webkit-transform: scale(1)
//     transform: scale(1)

// @keyframes scale-up-center
//   0%
//     -webkit-transform: scale(0)
//     transform: scale(0)

//   100%
//     -webkit-transform: scale(1)
//     transform: scale(1)

// .scale-down-center
//   -webkit-animation: scale-down-center 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) both
//   animation: scale-down-center 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) both

// @-webkit-keyframes scale-down-center
//   0%
//     -webkit-transform: scale(1)
//     transform: scale(1)

//   100%
//     -webkit-transform: scale(0)
//     transform: scale(0)

// @keyframes scale-down-center
//   0%
//     -webkit-transform: scale(1)
//     transform: scale(1)

//   100%
//     -webkit-transform: scale(0)
//     transform: scale(0)
