_mailchimp.scss 2.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495
  1. .mailchimp-one {
  2. padding-top: 110px;
  3. padding-bottom: 120px;
  4. background-image: linear-gradient(40deg, #ff43c0 0%, #ffa95c 100%);
  5. .block-title__title {
  6. color: #fff;
  7. }
  8. &__mc-form {
  9. width: 100%;
  10. max-width: 692px;
  11. height: 91px;
  12. background-color: #fff;
  13. border-radius: 5px;
  14. margin-left: auto;
  15. margin-right: auto;
  16. position: relative;
  17. input[type="email"] {
  18. border: none;
  19. outline: none;
  20. background-color: transparent;
  21. display: block;
  22. width: 100%;
  23. height: 100%;
  24. padding-left: 40px;
  25. font-size: 16px;
  26. color: #74727a;
  27. font-weight: 400;
  28. @include placeholder {
  29. color: #74727a;
  30. }
  31. }
  32. button[type=submit] {
  33. border: none;
  34. outline: none;
  35. width: 61px;
  36. height: 61px;
  37. background-image: linear-gradient(to right, rgb(255, 78, 181) 0%, rgb(255, 160, 101) 51%, rgb(255, 78, 181) 100%);
  38. background-size: 200% auto;
  39. border-radius: 50%;
  40. font-size: 22px;
  41. color: #fff;
  42. display: flex;
  43. align-items: center;
  44. justify-content: center;
  45. text-align: center;
  46. position: absolute;
  47. top: 50%;
  48. right: 15px;
  49. transform: translateY(-50%);
  50. transition: all .4s ease;
  51. &:hover {
  52. background-position: right center;
  53. }
  54. }
  55. &.errored {
  56. input {
  57. background-color: red;
  58. color: #fff;
  59. @include placeholder() {
  60. color: #fff;
  61. }
  62. }
  63. }
  64. }
  65. }
  66. .mc-form__response {
  67. p {
  68. background-color: #fff;
  69. font-size: 11px;
  70. margin: 0;
  71. color: $thm-black;
  72. padding-left: 10px;
  73. padding-right: 10px;
  74. text-align: center;
  75. }
  76. }
  77. .mc-form__response.successed {
  78. p {
  79. background-color: green;
  80. }
  81. }