#captcha-wrapper { position: relative; display: block; clear: both; background-color: $color-primary-light-04; background-color: var(--theme-color-primary-dimmed-04, $color-primary-light-04); padding: 25px 15px 35px; margin: calc(30px + 2.5%) 0; @media (max-width: 567px) { padding: 20px 3px 26px; } h4 { margin-top: 0; margin-bottom: 12px; float: left; } .input-wrapper { clear: both; float: none; } input[type="text"] { max-width: 280px; } #tabs { > ul { float: right; margin: 4px 0 0; padding: 0; font-size: 18px; li { display: inline-block; margin-left: 8px; a { transition: 0.3s ease; } &.active > a { color: $color-secondary-dark; color: var(--theme-color-secondary-intensed, $color-secondary-dark); text-decoration: none; } &:hover > a { color: $color-secondary-dark; color: var(--theme-color-secondary-intensed, $color-secondary-dark); } } } .tab-wrapper { position: relative; display: block; clear: both; > div { position: absolute; top: 0; width: 100%; display: block; clear: both; border-top: 1px solid $color-primary-light-03; border-top: 1px solid var(--theme-color-primary-dimmed-03, $color-primary-light-03); padding-top: 24px; @include hide(); &.active { position: relative; @include show(0.3s); } } } .clearformrow { font-size: 18px; margin: 16px 0; @media(max-width: 767px) { font-size: 16px; } } #captcha-code-barrier-free { background-color: $color-primary; background-color: var(--theme-color-primary, $color-primary); color: white; height: 60px; display: flex; align-items: center; padding: 0 15px; } .pos-rel { height: 60px; overflow: hidden; display: flex; img#captcha-code { position: relative; margin: -10px 0; display: block; } .captcha-reset { position: relative; display: block; width: 60px; height: 60px; @extend .icon-laden; padding: 0; border: 0; text-align: center; font-size: 30px; line-height: 1; padding: 16px 0 14px; background-color: $color-secondary; background-color: var(--theme-color-secondary, $color-secondary); color: white; margin-left: 1px; cursor: pointer; &:before { font-family: "Icons"; } } } } }