full

template-parts/la-components/blocks/form-block/form-block.css

@@ -1,91 +1,89 @@
 
-.form-block-wrapper .ff-el-group {
-    margin-bottom: 24px;
+#fluentform_3 {
+
 }
 
-.form-block-wrapper .ff-el-input--label label {
-    display: block;
-    margin-bottom: 8px;
-    font-weight: 600;
-    color: #374151;
-    font-size: 14px;
-}
-
-.form-block-wrapper .ff-el-form-control {
-    width: 100%;
-    padding: 12px 16px;
-    border: 2px solid #e5e7eb;
-    border-radius: 8px;
-    font-size: 16px;
-    transition: all 0.2s ease;
-    background: #ffffff;
-    box-sizing: border-box;
-}
-
-.form-block-wrapper .ff-el-form-control:focus {
-    outline: none;
-    border-color: #3b82f6;
-    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
-}
-
-.form-block-wrapper .ff-btn-submit {
-    width: 100%;
-    padding: 14px 24px;
-    background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);
-    color: white;
+#fluentform_3 .ff-el-form-control {
     border: none;
-    border-radius: 8px;
+    box-shadow: 0 2px 32px 0 rgba(16, 15, 15, 0.03);
+    background: #fff;
+    border-radius: 90px;
+    height: 77px;
+    padding-left: 32px;
+    padding-right: 32px;
+    outline: 1px solid transparent;
+
+    font-weight: 500;
     font-size: 16px;
+    line-height: 130%;
+    color: #6c6b6b;
+}
+
+#fluentform_3 .ff-btn-submit {
+    height: 75px;
+    background: linear-gradient(90deg, #e21e24 39.42%, #ff2f35 92.9%);
+    border-radius: 90px;
     font-weight: 600;
+    font-size: 18px;
+    line-height: 195%;
+    color: #f8f8f8;
+    display: grid;
+    place-content: center;
+    width: 100%;
     cursor: pointer;
-    transition: all 0.3s ease;
-    text-transform: none;
+    transition: 180ms ease-in;
 }
 
-.form-block-wrapper .ff-btn-submit:hover {
-    transform: translateY(-1px);
-    box-shadow: 0 8px 25px rgba(59, 130, 246, 0.3);
+#fluentform_3 .ff-btn-submit:hover {
+    font-weight: 700;
+    transition: 180ms ease-in;
 }
 
-.form-block-wrapper .ff-btn-submit:active {
-    transform: translateY(0);
+#fluentform_3 .ff_submit_btn_wrapper {
+    margin-bottom: 0!important;
 }
 
-.form-block-wrapper .asterisk-right label::after {
-    content: ' *';
-    color: #ef4444;
-    font-weight: bold;
+#fluentform_3 .error.text-danger {
+    position: absolute;
+    margin-top: 0;
+    bottom: -18px;
+    left: 0;
+    width: 100%;
+    text-align: center;
 }
 
-.form-block-wrapper .ff-message-success,
-.form-block-wrapper .ff-message-container {
-    display: none !important;
+#fluentform_3 .ff-el-group {
+    position: relative;
+    margin-bottom: 18px;
 }
 
-.form-block-wrapper.form-loading .ff-btn-submit {
-    opacity: 0.7;
+#fluentform_3_success {
+    display: none!important;
+}
+
+
+
+#fluentform_3 .ff-el-input--label {
+    position: absolute;
+    top: 50%;
+    left: 32px;
+    transform: translateY(-50%);
     pointer-events: none;
+    z-index: 2;
+    margin: 0;
+    transition: 180ms ease-in-out;
+
+    font-weight: 500;
+    font-size: 16px;
+    line-height: 130%;
+    color: #6c6b6b;
 }
 
-@media (max-width: 768px) {
-    .form-block-wrapper {
-        margin: 20px;
-        padding: 20px;
-    }
 
-    .form-block-wrapper .ff-el-form-control {
-        font-size: 16px;
-        padding: 10px 14px;
-    }
-
-    .form-block-wrapper .ff-btn-submit {
-        font-size: 16px;
-        padding: 12px 20px;
-    }
-}
-
-@media (max-width: 1024px) and (min-width: 769px) {
-    .form-block-wrapper {
-        padding: 25px;
-    }
+#fluentform_3 .ff-el-group.focused .ff-el-input--label,
+#fluentform_3 .ff-el-group.has-value .ff-el-input--label {
+    top: 6px;
+    transform: translateY(0);
+    transition: 180ms ease-in-out;
+    font-size: 14px;
 }