first commit

2026-05-04 17:16:03 +01:00
commit 2de4723bb7
181 changed files with 317767 additions and 0 deletions
@@ -0,0 +1,94 @@
+/*----------------------------------------*/
+/*  20. Newsletter CSS
+/*----------------------------------------*/
+
+.newsletter-content{
+    // Responsive
+    @media #{$tablet-device, $large-mobile}{
+        text-align: center;
+        margin-bottom: 20px;
+    }
+    & h2{
+        font-size: 36px;
+        line-height: 1;
+        font-weight: 700;
+        margin-bottom: 10px;
+        // Responsive
+        @media #{$desktop-device}{
+            font-size: 34px;
+        }
+        @media #{$large-mobile}{
+            font-size: 24px;
+        }
+    }
+    & p{
+        max-width: 300px;
+         // Responsive
+        @media #{$tablet-device, $large-mobile}{
+           margin: auto;
+        }
+    }
+}
+
+.newsletter-form{   
+    position: relative;
+    border: 2px solid $heading-color;
+    width: 620px;
+    max-width: 100%;
+    margin: 0 auto;
+
+    input{
+        width: 100%;
+        border: none;
+        padding: 10px 20px;
+        padding-right: 200px;
+        line-height: 30px;
+        height: 55px;
+        color: $heading-color;
+        font-size: 15px;
+        background-color: transparent;
+
+        @media #{$desktop-device}{
+            padding-right: 160px;
+        }
+        @media #{$large-mobile}{
+            height: 40px;
+            padding-right: 150px;
+        }
+
+        @media #{$extra-small-mobile}{
+            padding-right: 128px;
+            font-size: 11px;
+        }
+    }
+
+    button{
+        position: absolute;
+        top: 50%;
+        transform: translateY(-50%);
+        right: 0;   
+        background: none;
+        border: none;
+        width: 200px;
+        border-left: 2px solid $heading-color;
+        font-size: 13px;
+        font-weight: 600;
+        color: $heading-color;
+        // Responsive
+        @media #{$desktop-device}{
+            width: 150px;
+        }
+        @media #{$large-mobile}{
+            width: 150px;
+        }
+
+        @media #{$extra-small-mobile}{
+            width: 100px;
+            font-size: 11px;
+        }
+
+        &:hover{
+            color: $theme-color;
+        }
+    }
+}