.faq { width: 100vw; max-width: 1250px; margin: 0px auto; padding: 0px 10px; direction: rtl; min-height: calc(100vh - 288px); padding-top: 70px; &__header { margin-top: 30px; width: 600px; h1 { letter-spacing: -2px; font-family: numeralMedium; font-size: calc(100vw / 25); color: #424246; } &--search { margin-top: 20px; width: 100%; border: 2px solid rgb(197, 197, 197); border-radius: 10px; padding: 5px; justify-content: space-between; input { border: 0px; flex: 1; border: 0px; font-size: calc(100vw / 90); color: green; padding: 0px 10px 0px; font-size: 16px; font-family: numeralMedium; &::placeholder { color: #d8dce5; font-size: 16px; } &:focus { outline: 0px !important; } } button { font-family: numeralMedium; border: 0px; background-color: #7dc241; color: white; border-radius: 10px; padding: 7px 50px; } } } &__list { width: 100%; max-width: 1000px; margin: 30px 0px; } } .mobile-faq { width: 100vw; max-width: 650px; margin: 0px auto; padding: 0px 10px; direction: rtl; overflow-x: hidden; padding-top: 70px; &__header { margin-top: 30px; width: 100%; h1 { letter-spacing: -2px; font-family: numeralMedium; color: #424246; } input { border: 0px; flex: 1; border: 0px; color: green; padding: 0px 10px 0px; font-size: 16px; font-family: numeralMedium; border: 1px solid #afafaf; border-radius: 10px; width: 100%; padding: 8px 5px; margin: 15px 0px; max-width: 400px; &::placeholder { color: #d8dce5; font-size: 16px; } &:focus { outline: 0px !important; } } button { font-family: numeralMedium; border: 0px; background-color: #7dc241; color: white; border-radius: 10px; padding: 7px 50px; } } &__list { width: 100%; max-width: 1000px; margin: 30px 0px; } }