first commit

public/frontend/scss/base/_base.scss

@@ -0,0 +1,2 @@
+::-moz-selection{ background:$primary;color:white }
+::selection{ background:$primary;color:white }

public/frontend/scss/base/_typography.scss

@@ -0,0 +1,145 @@
+.infos {
+    height: 100px;
+    padding-bottom: 20px;
+    color: $white;
+    @include flex;
+    opacity: .8;
+    align-items: flex-end;
+
+    * {
+        margin: 0;
+        padding: 0;
+    }
+
+    .title,
+    .socials {
+        flex-grow: 1;
+
+        .subtitle {
+            font-size: 14px;
+            opacity: .9;
+        }
+    }
+
+    .title  {
+
+        .font-small {
+            color: $white;
+            font-size: 13px;
+        }
+    }
+
+    .subtitle  {
+        margin: 2px;
+
+        i {
+            width: 20px;
+            display: inline-block;
+            position: relative;
+            top: 2px;
+        }
+
+    }
+
+    .social-links {
+        a {
+            font-size: 14px;
+            color: $white;
+
+            &:hover {
+                color: $primary;
+            }
+        }
+    }
+}
+
+
+/* contact section */
+.list {
+    list-style-type: none;
+    padding-left: 0;
+    padding: 0 30px;
+
+    .list-head {
+        border-bottom: 1px solid $gray-300;
+        padding-bottom: 6px;
+    }
+
+    .list-body {
+        padding-top: 6px;
+
+        p  {
+            margin-bottom: 5px;
+
+            i {
+                display: inline-block;
+                width: 20px;
+            }
+
+        }
+            
+
+        a {
+            display: block;
+            text-decoration: none;
+            margin-bottom: 4px;
+        }
+
+        .social-links {
+            margin-top: 15px;
+
+            a {
+                display: inline;
+                padding: 0 8px 0 0;
+            }
+        }
+
+            
+    }
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+    font-weight: 500;
+    font-family: 'Baloo Paaji', cursive;
+    color: $indigo;
+}
+.my-font {
+    font-family: 'Baloo Paaji', cursive;
+}
+p {
+    font-size: calc(13px + (15 - 13) * ((100vw - 300px) / (1300 - 300)));
+    font-weight: 100;
+    opacity: 1;
+    color: #111;
+    letter-spacing: .6px;
+} 
+
+.xs-font {
+    font-size: 13px;
+    opacity: .5;
+}
+
+.title {
+    font-size: calc(15px + (20 - 15) * ((100vw - 300px) / (1300 - 300)));
+
+    &.big {
+        font-size: calc(17px + (25 - 17) * ((100vw - 300px) / (1300 - 300)));       
+    }
+}
+
+.mb-6 {
+    margin-bottom: 4rem !important;
+}
+
+.img-responsive {
+    width: 100% !important;
+}
+
+.rounded {
+    border-radius: 4px;
+}