From a93e4f7364d937a4905957e9204d4b83d85f6a26 Mon Sep 17 00:00:00 2001 From: dragos Date: Fri, 5 Mar 2021 10:58:41 +0200 Subject: [PATCH] feat: v1.0.1 --- CHANGELOG.md | 4 + README.md | 2 +- assets/css/soft-design-system.css | 2 +- assets/css/soft-design-system.css.map | 4 +- assets/css/soft-design-system.min.css | 2 +- assets/js/soft-design-system.js | 2 +- assets/scss/soft-design-system.scss | 2 +- assets/scss/soft-design-system/theme.scss | 2 +- index.html | 66 +- pages/about-us.html | 8 +- pages/author.html | 8 +- pages/contact-us.html | 10 +- pages/sign-in.html | 10 +- presentation.html | 10 +- sections/attention-catchers/alerts.html | 10 +- sections/attention-catchers/modals.html | 10 +- .../attention-catchers/notifications.html | 1007 ---- .../attention-catchers/tooltips-popovers.html | 10 +- sections/elements/avatars.html | 8 +- sections/elements/badges.html | 8 +- sections/elements/breadcrumbs.html | 10 +- sections/elements/button-groups.html | 1195 ----- sections/elements/buttons.html | 10 +- sections/elements/dropdowns.html | 12 +- sections/elements/progress-bars.html | 10 +- sections/elements/social-buttons.html | 1081 ----- sections/elements/tables.html | 2115 -------- sections/elements/toggles.html | 8 +- sections/elements/typography.html | 10 +- sections/input-areas/contact-sections.html | 2613 ---------- sections/input-areas/forms.html | 8 +- sections/input-areas/inputs.html | 10 +- sections/input-areas/newsletters.html | 993 ---- sections/navigation/nav-tabs.html | 10 +- sections/navigation/navbars.html | 10 +- sections/navigation/pagination.html | 10 +- sections/page-sections/applications.html | 2848 ----------- sections/page-sections/blog-posts.html | 3116 ------------ sections/page-sections/call-to-actions.html | 1599 ------ sections/page-sections/content-sections.html | 2267 --------- sections/page-sections/faq.html | 1023 ---- sections/page-sections/features.html | 10 +- sections/page-sections/footers.html | 3307 ------------- sections/page-sections/general-cards.html | 1791 ------- sections/page-sections/hero-sections.html | 10 +- sections/page-sections/logo-areas.html | 1405 ------ sections/page-sections/pricing.html | 4270 ----------------- sections/page-sections/stats.html | 1103 ----- sections/page-sections/teams.html | 2279 --------- sections/page-sections/testimonials.html | 3310 ------------- 50 files changed, 131 insertions(+), 37497 deletions(-) delete mode 100644 sections/attention-catchers/notifications.html delete mode 100644 sections/elements/button-groups.html delete mode 100644 sections/elements/social-buttons.html delete mode 100644 sections/elements/tables.html delete mode 100644 sections/input-areas/contact-sections.html delete mode 100644 sections/input-areas/newsletters.html delete mode 100644 sections/page-sections/applications.html delete mode 100644 sections/page-sections/blog-posts.html delete mode 100644 sections/page-sections/call-to-actions.html delete mode 100644 sections/page-sections/content-sections.html delete mode 100644 sections/page-sections/faq.html delete mode 100644 sections/page-sections/footers.html delete mode 100644 sections/page-sections/general-cards.html delete mode 100644 sections/page-sections/logo-areas.html delete mode 100644 sections/page-sections/pricing.html delete mode 100644 sections/page-sections/stats.html delete mode 100644 sections/page-sections/teams.html delete mode 100644 sections/page-sections/testimonials.html diff --git a/CHANGELOG.md b/CHANGELOG.md index 6724a49b..0e6af5b0 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,4 +1,8 @@ # Change Log +## [1.0.1] 2021-03-05 +### Improvements +- Changes on sections pages + ## [1.0.0] 2021-03-04 ### Original Release diff --git a/README.md b/README.md index b0395042..bd8277bc 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@ # [Soft UI Design System](http://demos.creative-tim.com/soft-ui-design-system/presentation.html?ref=readme-suds) -![version](https://img.shields.io/badge/version-1.0.0-blue.svg) [![GitHub issues open](https://img.shields.io/github/issues/creativetimofficial/soft-ui-design-system.svg?maxAge=2592000)](https://github.com/creativetimofficial/soft-ui-design-system/issues?q=is%3Aopen+is%3Aissue) [![GitHub issues closed](https://img.shields.io/github/issues-closed-raw/creativetimofficial/soft-ui-design-system.svg?maxAge=2592000)](https://github.com/creativetimofficial/soft-ui-design-system/issues?q=is%3Aissue+is%3Aclosed) +![version](https://img.shields.io/badge/version-1.0.1-blue.svg) [![GitHub issues open](https://img.shields.io/github/issues/creativetimofficial/soft-ui-design-system.svg?maxAge=2592000)](https://github.com/creativetimofficial/soft-ui-design-system/issues?q=is%3Aopen+is%3Aissue) [![GitHub issues closed](https://img.shields.io/github/issues-closed-raw/creativetimofficial/soft-ui-design-system.svg?maxAge=2592000)](https://github.com/creativetimofficial/soft-ui-design-system/issues?q=is%3Aissue+is%3Aclosed) ![Image](https://raw.githubusercontent.com/creativetimofficial/public-assets/master/soft-ui-design-system/opt_sds_free_thumbnail.jpg) diff --git a/assets/css/soft-design-system.css b/assets/css/soft-design-system.css index f34acfe6..68997ca0 100644 --- a/assets/css/soft-design-system.css +++ b/assets/css/soft-design-system.css @@ -12596,7 +12596,7 @@ fieldset:disabled .btn { /*! ========================================================= -* Soft UI Design System - v1.0.0 +* Soft UI Design System - v1.0.1 ========================================================= * Product Page: https://www.creative-tim.com/product/soft-ui-design-system diff --git a/assets/css/soft-design-system.css.map b/assets/css/soft-design-system.css.map index e5e845e8..94951e4f 100644 --- a/assets/css/soft-design-system.css.map +++ b/assets/css/soft-design-system.css.map @@ -132,7 +132,7 @@ "../scss/custom/_styles.scss" ], "sourcesContent": [ - "// =========================================================\n// * Soft UI Design System - v1.0.0\n// =========================================================\n//\n// * Product Page: https://www.creative-tim.com/product/soft-ui-design-system\n// * Copyright 2021 Creative Tim (https://www.creative-tim.com)\n//\n// Coded by www.creative-tim.com\n//\n// =========================================================\n//\n// * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n\n// Bootstrap Functions\n@import \"bootstrap/functions\";\n\n// Custom Variables\n@import \"custom/variables\";\n\n// Theme Variables\n@import \"variables\";\n\n// Bootstrap Core\n@import \"bootstrap/bootstrap\";\n\n// Theme Core\n@import \"theme\";\n\n// Custom Variables\n@import \"custom/styles\";\n", + "// =========================================================\n// * Soft UI Design System - v1.0.1\n// =========================================================\n//\n// * Product Page: https://www.creative-tim.com/product/soft-ui-design-system\n// * Copyright 2021 Creative Tim (https://www.creative-tim.com)\n//\n// Coded by www.creative-tim.com\n//\n// =========================================================\n//\n// * The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n\n// Bootstrap Functions\n@import \"bootstrap/functions\";\n\n// Custom Variables\n@import \"custom/variables\";\n\n// Theme Variables\n@import \"variables\";\n\n// Bootstrap Core\n@import \"bootstrap/bootstrap\";\n\n// Theme Core\n@import \"theme\";\n\n// Custom Variables\n@import \"custom/styles\";\n", "// Bootstrap functions\n//\n// Utility mixins and functions for evaluating source code across our variables, maps, and mixins.\n\n// Ascending\n// Used to evaluate Sass maps like our grid breakpoints.\n@mixin _assert-ascending($map, $map-name) {\n $prev-key: null;\n $prev-num: null;\n @each $key, $num in $map {\n @if $prev-num == null or unit($num) == \"%\" or unit($prev-num) == \"%\" {\n // Do nothing\n } @else if not comparable($prev-num, $num) {\n @warn \"Potentially invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} whose unit makes it incomparable to #{$prev-num}, the value of the previous key '#{$prev-key}' !\";\n } @else if $prev-num >= $num {\n @warn \"Invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} which isn't greater than #{$prev-num}, the value of the previous key '#{$prev-key}' !\";\n }\n $prev-key: $key;\n $prev-num: $num;\n }\n}\n\n// Starts at zero\n// Used to ensure the min-width of the lowest breakpoint starts at 0.\n@mixin _assert-starts-at-zero($map, $map-name: \"$grid-breakpoints\") {\n @if length($map) > 0 {\n $values: map-values($map);\n $first-value: nth($values, 1);\n @if $first-value != 0 {\n @warn \"First breakpoint in #{$map-name} must start at 0, but starts at #{$first-value}.\";\n }\n }\n}\n\n// Internal Bootstrap function to turn maps into its negative variant.\n// It prefixes the keys with `n` and makes the value negative.\n@function negativify-map($map) {\n $result: ();\n @each $key, $value in $map {\n @if $key != 0 {\n $result: map-merge($result, (\"n\" + $key: (-$value)));\n }\n }\n @return $result;\n}\n\n// Get multiple keys from a sass map\n@function map-get-multiple($map, $values) {\n $result: ();\n @each $key, $value in $map {\n @if (index($values, $key) != null) {\n $result: map-merge($result, ($key: $value));\n }\n }\n @return $result;\n}\n\n// Replace `$search` with `$replace` in `$string`\n// Used on our SVG icon backgrounds for custom forms.\n//\n// @author Hugo Giraudel\n// @param {String} $string - Initial string\n// @param {String} $search - Substring to replace\n// @param {String} $replace ('') - New value\n// @return {String} - Updated string\n@function str-replace($string, $search, $replace: \"\") {\n $index: str-index($string, $search);\n\n @if $index {\n @return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace);\n }\n\n @return $string;\n}\n\n// See https://codepen.io/kevinweber/pen/dXWoRw\n//\n// Requires the use of quotes around data URIs.\n\n@function escape-svg($string) {\n @if str-index($string, \"data:image/svg+xml\") {\n @each $char, $encoded in $escaped-characters {\n // Do not escape the url brackets\n @if str-index($string, \"url(\") == 1 {\n $string: url(\"#{str-replace(str-slice($string, 6, -3), $char, $encoded)}\");\n } @else {\n $string: str-replace($string, $char, $encoded);\n }\n }\n }\n\n @return $string;\n}\n\n// Color contrast\n// See https://github.com/twbs/bootstrap/pull/30168\n\n// A list of pre-calculated numbers of pow(($value / 255 + .055) / 1.055, 2.4). (from 0 to 255)\n// stylelint-disable-next-line scss/dollar-variable-default, scss/dollar-variable-pattern\n$_luminance-list: .0008 .001 .0011 .0013 .0015 .0017 .002 .0022 .0025 .0027 .003 .0033 .0037 .004 .0044 .0048 .0052 .0056 .006 .0065 .007 .0075 .008 .0086 .0091 .0097 .0103 .011 .0116 .0 .013 .0137 .0144 .0152 .016 .0168 .0176 .0185 .0194 .0203 .0212 .0222 .0232 .0242 .0252 .0262 .0273 .0284 .0296 .0307 .0319 .0331 .0343 .0356 .0369 .0382 .0395 .0409 .0423 .0437 .0452 .0467 .0482 .0497 .0513 .0529 .0545 .0561 .0578 .0595 .0612 .063 .0648 .0666 .0685 .0704 .0723 .0742 .0762 .0782 .0802 .0823 .0844 .0865 .0887 .0908 .0931 .0953 .0976 .0999 .1022 .1046 .107 .1095 .1119 .1144 .117 .1195 .1221 .1248 .1274 .1301 .1329 .1356 .1384 .1413 .1441 .147 .15 .1529 .1559 .159 .162 .1651 .1683 .1714 .1746 .1779 .1812 .1845 .1878 .1912 .1946 .1981 .2016 .2051 .2086 .2122 .2159 .2195 .2232 .227 .2307 .2346 .2384 .2423 .2462 .2502 .2542 .2582 .2623 .2664 .2705 .2747 .2789 .2831 .2874 .2918 .2961 .3005 .305 .3095 .314 .3185 .3231 .3278 .3325 .3372 .3419 .3467 .3515 .3564 .3613 .3663 .3712 .3763 .3813 .3864 .3916 .3968 .402 .4072 .4125 .4179 .4233 .4287 .4342 .4397 .4452 .4508 .4564 .4621 .4678 .4735 .4793 .4851 .491 .4969 .5029 .5089 .5149 .521 .5271 .5333 .5395 .5457 .552 .5583 .5647 .5711 .5776 .5841 .5906 .5972 .6038 .6105 .6172 .624 .6308 .6376 .6445 .6514 .6584 .6654 .6724 .6795 .6867 .6939 .7011 .7084 .7157 .7231 .7305 .7379 .7454 .7529 .7605 .7682 .7758 .7835 .7913 .7991 .807 .8148 .8228 .8308 .8388 .8469 .855 .8632 .8714 .8796 .8879 .8963 .9047 .9131 .9216 .9301 .9387 .9473 .956 .9647 .9734 .9823 .9911 1;\n\n@function color-contrast($background, $color-contrast-dark: $color-contrast-dark, $color-contrast-light: $color-contrast-light, $min-contrast-ratio: $min-contrast-ratio) {\n $foregrounds: $color-contrast-light, $color-contrast-dark, $white, $black;\n $max-ratio: 0;\n $max-ratio-color: null;\n\n @each $color in $foregrounds {\n $contrast-ratio: contrast-ratio($background, $color);\n @if $contrast-ratio > $min-contrast-ratio {\n @return $color;\n } @else if $contrast-ratio > $max-ratio {\n $max-ratio: $contrast-ratio;\n $max-ratio-color: $color;\n }\n }\n\n @warn \"Found no color leading to #{$min-contrast-ratio}:1 contrast ratio against #{$background}...\";\n\n @return $max-ratio-color;\n}\n\n@function contrast-ratio($background, $foreground: $color-contrast-light) {\n $l1: luminance($background);\n $l2: luminance(opaque($background, $foreground));\n\n @return if($l1 > $l2, ($l1 + .05) / ($l2 + .05), ($l2 + .05) / ($l1 + .05));\n}\n\n// Return WCAG2.0 relative luminance\n// See https://www.w3.org/WAI/GL/wiki/Relative_luminance\n// See https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-tests\n@function luminance($color) {\n $rgb: (\n \"r\": red($color),\n \"g\": green($color),\n \"b\": blue($color)\n );\n\n @each $name, $value in $rgb {\n $value: if($value / 255 < .03928, $value / 255 / 12.92, nth($_luminance-list, $value + 1));\n $rgb: map-merge($rgb, ($name: $value));\n }\n\n @return (map-get($rgb, \"r\") * .2126) + (map-get($rgb, \"g\") * .7152) + (map-get($rgb, \"b\") * .0722);\n}\n\n// Return opaque color\n// opaque(#fff, rgba(0, 0, 0, .5)) => #808080\n@function opaque($background, $foreground) {\n @return mix(rgba($foreground, 1), $background, opacity($foreground) * 100);\n}\n\n// scss-docs-start color-functions\n// Tint a color: mix a color with white\n@function tint-color($color, $weight) {\n @return mix(white, $color, $weight);\n}\n\n// Shade a color: mix a color with black\n@function shade-color($color, $weight) {\n @return mix(black, $color, $weight);\n}\n\n// Shade the color if the weight is positive, else tint it\n@function shift-color($color, $weight) {\n @return if($weight > 0, shade-color($color, $weight), tint-color($color, -$weight));\n}\n// scss-docs-end color-functions\n\n// Return valid calc\n@function add($value1, $value2, $return-calc: true) {\n @if $value1 == null {\n @return $value2;\n }\n\n @if $value2 == null {\n @return $value1;\n }\n\n @if type-of($value1) == number and type-of($value2) == number and comparable($value1, $value2) {\n @return $value1 + $value2;\n }\n\n @return if($return-calc == true, calc(#{$value1} + #{$value2}), $value1 + unquote(\" + \") + $value2);\n}\n\n@function subtract($value1, $value2, $return-calc: true) {\n @if $value1 == null and $value2 == null {\n @return null;\n }\n\n @if $value1 == null {\n @return -$value2;\n }\n\n @if $value2 == null {\n @return $value1;\n }\n\n @if type-of($value1) == number and type-of($value2) == number and comparable($value1, $value2) {\n @return $value1 - $value2;\n }\n\n @return if($return-calc == true, calc(#{$value1} - #{$value2}), $value1 + unquote(\" - \") + $value2);\n}\n", "", "// Variables\n//\n// Variables should follow the `$component-state-property-size` formula for\n// consistent naming. Ex: $nav-link-disabled-color and $modal-content-box-shadow-xs.\n\n// $soft-background-color: #fbfbfb !default;\n$soft-background-color: #ffffff !default; // Testing\n$font-color: #67748e !default;\n$h-color: #252f40 !default;\n\n// Color system\n\n$white: #fff !default;\n$gray-100: #f8f9fa !default;\n$gray-200: #e9ecef !default;\n$gray-300: #dee2e6 !default;\n$gray-400: #ced4da !default;\n$gray-500: #adb5bd !default;\n$gray-600: #6c757d !default;\n$gray-700: #495057 !default;\n$gray-800: #343a40 !default;\n$gray-900: #212529 !default;\n$black: #000 !default;\n\n// fusv-disable\n$grays: (\n \"100\": $gray-100,\n \"200\": $gray-200,\n \"300\": $gray-300,\n \"400\": $gray-400,\n \"500\": $gray-500,\n \"600\": $gray-600,\n \"700\": $gray-700,\n \"800\": $gray-800,\n \"900\": $gray-900\n) !default;\n// fusv-enable\n\n$blue: #63B3ED !default;\n$indigo: #596CFF !default;\n$purple: #6f42c1 !default;\n$pink: #d63384 !default;\n$red: #F56565 !default;\n$orange: #fd7e14 !default;\n$yellow: #FBD38D !default;\n$green: #81E6D9 !default;\n$teal: #20c997 !default;\n$cyan: #0dcaf0 !default;\n\n// scss-docs-start colors-map\n$colors: (\n \"blue\": $blue,\n \"indigo\": $indigo,\n \"purple\": $purple,\n \"pink\": $pink,\n \"red\": $red,\n \"orange\": $orange,\n \"yellow\": $yellow,\n \"green\": $green,\n \"teal\": $teal,\n \"cyan\": $cyan,\n \"white\": $white,\n \"gray\": $gray-600,\n \"gray-dark\": $gray-800,\n) !default;\n// scss-docs-end colors-map\n\n$primary: #cb0c9f !default;\n$secondary: #8392AB !default;\n$info: #17c1e8 !default;\n$success: #82d616 !default;\n$warning: #f53939 !default;\n$danger: #ea0606 !default;\n$light: $gray-200 !default;\n$dark: $h-color !default;\n\n// scss-docs-start theme-colors-map\n$theme-colors: (\n \"primary\": $primary,\n \"secondary\": $secondary,\n \"success\": $success,\n \"info\": $info,\n \"warning\": $warning,\n \"danger\": $danger,\n \"light\": $light,\n \"dark\": $dark,\n \"white\": $white\n) !default;\n// scss-docs-end theme-colors-map\n\n\n// Gradient colors\n$primary-gradient: #7928CA !default;\n$primary-gradient-state: #FF0080 !default;\n\n$secondary-gradient: #627594 !default;\n$secondary-gradient-state: #A8B8D8 !default;\n\n$info-gradient: #2152ff !default;\n$info-gradient-state: #21d4fd !default;\n\n$success-gradient: #17ad37 !default;\n$success-gradient-state: #98ec2d !default;\n\n$danger-gradient: #ea0606 !default;\n$danger-gradient-state: #ff667c !default;\n\n$warning-gradient: #f53939 !default;\n$warning-gradient-state: #fbcf33 !default;\n\n$dark-gradient: #141727 !default;\n$dark-gradient-state: #3A416F !default;\n\n$light-gradient: #CED4DA !default;\n$light-gradient-state: #EBEFF4 !default;\n\n// Gradient Colors map\n$theme-gradient-colors: (\n \"primary\": ($primary-gradient, $primary-gradient-state),\n \"secondary\": ($secondary-gradient, $secondary-gradient-state),\n \"success\": ($success-gradient, $success-gradient-state),\n \"info\": ($info-gradient, $info-gradient-state),\n \"warning\": ($warning-gradient, $warning-gradient-state),\n \"danger\": ($danger-gradient, $danger-gradient-state),\n \"light\": ($light-gradient, $light-gradient-state),\n \"dark\": ($dark-gradient, $dark-gradient-state)\n) !default;\n\n// Set a specific jump point for requesting color jumps\n$theme-color-interval: 8% !default;\n\n// The contrast ratio to reach against white, to determine if color changes from \"light\" to \"dark\". Acceptable values for WCAG 2.0 are 3, 4.5 and 7.\n// See https://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast\n$min-contrast-ratio: 4.5 !default;\n\n// Customize the light and dark text colors for use in our color contrast function.\n$color-contrast-dark: $black !default;\n$color-contrast-light: $white !default;\n\n// fusv-disable\n$blue-100: tint-color($blue, 8) !default;\n$blue-200: tint-color($blue, 6) !default;\n$blue-300: tint-color($blue, 4) !default;\n$blue-400: tint-color($blue, 2) !default;\n$blue-500: $blue !default;\n$blue-600: shade-color($blue, 2) !default;\n$blue-700: shade-color($blue, 4) !default;\n$blue-800: shade-color($blue, 6) !default;\n$blue-900: shade-color($blue, 8) !default;\n\n$indigo-100: tint-color($indigo, 8) !default;\n$indigo-200: tint-color($indigo, 6) !default;\n$indigo-300: tint-color($indigo, 4) !default;\n$indigo-400: tint-color($indigo, 2) !default;\n$indigo-500: $indigo !default;\n$indigo-600: shade-color($indigo, 2) !default;\n$indigo-700: shade-color($indigo, 4) !default;\n$indigo-800: shade-color($indigo, 6) !default;\n$indigo-900: shade-color($indigo, 8) !default;\n\n$purple-100: tint-color($purple, 8) !default;\n$purple-200: tint-color($purple, 6) !default;\n$purple-300: tint-color($purple, 4) !default;\n$purple-400: tint-color($purple, 2) !default;\n$purple-500: $purple !default;\n$purple-600: shade-color($purple, 2) !default;\n$purple-700: shade-color($purple, 4) !default;\n$purple-800: shade-color($purple, 6) !default;\n$purple-900: shade-color($purple, 8) !default;\n\n$pink-100: tint-color($pink, 8) !default;\n$pink-200: tint-color($pink, 6) !default;\n$pink-300: tint-color($pink, 4) !default;\n$pink-400: tint-color($pink, 2) !default;\n$pink-500: $pink !default;\n$pink-600: shade-color($pink, 2) !default;\n$pink-700: shade-color($pink, 4) !default;\n$pink-800: shade-color($pink, 6) !default;\n$pink-900: shade-color($pink, 8) !default;\n\n$red-100: tint-color($red, 8) !default;\n$red-200: tint-color($red, 6) !default;\n$red-300: tint-color($red, 4) !default;\n$red-400: tint-color($red, 2) !default;\n$red-500: $red !default;\n$red-600: shade-color($red, 2) !default;\n$red-700: shade-color($red, 4) !default;\n$red-800: shade-color($red, 6) !default;\n$red-900: shade-color($red, 8) !default;\n\n$orange-100: tint-color($orange, 8) !default;\n$orange-200: tint-color($orange, 6) !default;\n$orange-300: tint-color($orange, 4) !default;\n$orange-400: tint-color($orange, 2) !default;\n$orange-500: $orange !default;\n$orange-600: shade-color($orange, 2) !default;\n$orange-700: shade-color($orange, 4) !default;\n$orange-800: shade-color($orange, 6) !default;\n$orange-900: shade-color($orange, 8) !default;\n\n$yellow-100: tint-color($yellow, 8) !default;\n$yellow-200: tint-color($yellow, 6) !default;\n$yellow-300: tint-color($yellow, 4) !default;\n$yellow-400: tint-color($yellow, 2) !default;\n$yellow-500: $yellow !default;\n$yellow-600: shade-color($yellow, 2) !default;\n$yellow-700: shade-color($yellow, 4) !default;\n$yellow-800: shade-color($yellow, 6) !default;\n$yellow-900: shade-color($yellow, 8) !default;\n\n$green-100: tint-color($green, 8) !default;\n$green-200: tint-color($green, 6) !default;\n$green-300: tint-color($green, 4) !default;\n$green-400: tint-color($green, 2) !default;\n$green-500: $green !default;\n$green-600: shade-color($green, 2) !default;\n$green-700: shade-color($green, 4) !default;\n$green-800: shade-color($green, 6) !default;\n$green-900: shade-color($green, 8) !default;\n\n$teal-100: tint-color($teal, 8) !default;\n$teal-200: tint-color($teal, 6) !default;\n$teal-300: tint-color($teal, 4) !default;\n$teal-400: tint-color($teal, 2) !default;\n$teal-500: $teal !default;\n$teal-600: shade-color($teal, 2) !default;\n$teal-700: shade-color($teal, 4) !default;\n$teal-800: shade-color($teal, 6) !default;\n$teal-900: shade-color($teal, 8) !default;\n\n$cyan-100: tint-color($cyan, 8) !default;\n$cyan-200: tint-color($cyan, 6) !default;\n$cyan-300: tint-color($cyan, 4) !default;\n$cyan-400: tint-color($cyan, 2) !default;\n$cyan-500: $cyan !default;\n$cyan-600: shade-color($cyan, 2) !default;\n$cyan-700: shade-color($cyan, 4) !default;\n$cyan-800: shade-color($cyan, 6) !default;\n$cyan-900: shade-color($cyan, 8) !default;\n// fusv-enable\n\n// Characters which are escaped by the escape-svg function\n$escaped-characters: (\n (\"<\", \"%3c\"),\n (\">\", \"%3e\"),\n (\"#\", \"%23\"),\n (\"(\", \"%28\"),\n (\")\", \"%29\"),\n) !default;\n\n// Options\n//\n// Quickly modify global styling by enabling or disabling optional features.\n\n$enable-caret: true !default;\n$enable-rounded: true !default;\n$enable-shadows: false !default;\n$enable-gradients: false !default;\n$enable-transitions: true !default;\n$enable-reduced-motion: true !default;\n$enable-grid-classes: true !default;\n$enable-button-pointers: true !default;\n$enable-rfs: true !default;\n$enable-validation-icons: true !default;\n$enable-negative-margins: true !default;\n$enable-deprecation-messages: true !default;\n$enable-important-utilities: true !default;\n\n// Gradient\n//\n// The gradient which is added to components if `$enable-gradients` is `true`\n// This gradient is also added to elements with `.bg-gradient`\n$gradient: linear-gradient(180deg, rgba($white, .15), rgba($white, 0)) !default;\n\n// Spacing\n//\n// Control the default styling of most Bootstrap elements by modifying these\n// variables. Mostly focused on spacing.\n// You can add more entries to the $spacers map, should you need more variation.\n\n$spacer: 1rem !default;\n$spacers: (\n 0: 0,\n 1: $spacer / 4,\n 2: $spacer / 2,\n 3: $spacer,\n 4: $spacer * 1.5,\n 5: $spacer * 3,\n) !default;\n\n$negative-spacers: if($enable-negative-margins, negativify-map($spacers), null) !default;\n\n// Position\n//\n// Define the edge positioning anchors of the position utilities.\n\n$position-values: (\n 0: 0,\n 50: 50%,\n 100: 100%\n) !default;\n\n\n// Body\n//\n// Settings for the `` element.\n\n$body-bg: $white !default;\n$body-color: $font-color !default;\n$body-text-align: null !default;\n\n\n// Links\n//\n// Style anchor elements.\n\n$link-color: $primary !default;\n$link-decoration: none !default;\n$link-hover-color: darken($link-color, 15%) !default;\n$link-hover-decoration: none !default;\n// Darken percentage for links with `.text-*` class (e.g. `.text-success`)\n$emphasized-link-hover-darken-percentage: 15% !default;\n\n$stretched-link-pseudo-element: after !default;\n$stretched-link-z-index: 1 !default;\n\n// Paragraphs\n//\n// Style p element.\n\n$paragraph-margin-bottom: 1rem !default;\n\n\n// Grid breakpoints\n//\n// Define the minimum dimensions at which your layout will change,\n// adapting to different screen sizes, for use in media queries.\n\n// scss-docs-start grid-breakpoints\n$grid-breakpoints: (\n xs: 0,\n sm: 576px,\n md: 768px,\n lg: 992px,\n xl: 1200px,\n xxl: 1400px\n) !default;\n// scss-docs-end grid-breakpoints\n\n@include _assert-ascending($grid-breakpoints, \"$grid-breakpoints\");\n@include _assert-starts-at-zero($grid-breakpoints, \"$grid-breakpoints\");\n\n\n// Grid containers\n//\n// Define the maximum width of `.container` for different screen sizes.\n\n// scss-docs-start container-max-widths\n$container-max-widths: (\n sm: 540px,\n md: 720px,\n lg: 960px,\n xl: 1140px,\n xxl: 1320px\n) !default;\n// scss-docs-end container-max-widths\n\n@include _assert-ascending($container-max-widths, \"$container-max-widths\");\n\n\n// Grid columns\n//\n// Set the number of columns and specify the width of the gutters.\n\n$grid-columns: 12 !default;\n$grid-gutter-width: 1.5rem !default;\n$grid-row-columns: 6 !default;\n\n$gutters: $spacers !default;\n\n// Container padding\n\n$container-padding-x: $grid-gutter-width !default;\n\n\n// Components\n//\n// Define common padding and border radius sizes and more.\n\n$border-width: 1px !default;\n$border-color: $gray-300 !default;\n\n$border-radius-xs: .125rem !default;\n$border-radius-sm: .25rem !default;\n$border-radius-md: .5rem !default;\n$border-radius-lg: .75rem !default;\n$border-radius-xl: 1rem !default;\n$border-radius-2xl: 1.5rem !default;\n$border-radius-section: 10rem !default;\n\n$border-widths: (\n 0: 0,\n 1: 1px,\n 2: 2px,\n 3: 3px,\n 4: 4px,\n 5: 5px\n) !default;\n\n$rounded-pill: 50rem !default;\n\n$box-shadow-xs: 0 2px 9px -5px rgba($black, 0.15) !default;\n$box-shadow-sm: 0 .3125rem .625rem 0 rgba(0, 0, 0, 0.12) !default;\n$box-shadow: 0 .25rem .375rem -.0625rem rgba(20, 20, 20, .12), 0 .125rem .25rem -.0625rem rgba(20, 20, 20, .07) !default;\n$box-shadow-lg: 0 8px 26px -4px rgba(20, 20, 20, 0.15), 0 8px 9px -5px rgba(20, 20, 20, 0.06) !default;\n$box-shadow-xl: 0 23px 45px -11px rgba(20, 20, 20, .25) !default;\n$box-shadow-inset: inset 0 1px 2px rgba($black, .075) !default;\n\n$component-active-color: $white !default;\n$component-active-bg: $primary !default;\n\n$caret-width: .3em !default;\n$caret-vertical-align: $caret-width * .85 !default;\n$caret-spacing: $caret-width * .85 !default;\n\n$transition-base: all .2s ease-in-out !default;\n$transition-fade: opacity .15s linear !default;\n$transition-collapse: height .35s ease !default;\n\n// stylelint-disable function-disallowed-list\n// scss-docs-start aspect-ratios\n$aspect-ratios: (\n \"1x1\": 100%,\n \"4x3\": calc(3 / 4 * 100%),\n \"16x9\": calc(9 / 16 * 100%),\n \"21x9\": calc(9 / 21 * 100%)\n) !default;\n// scss-docs-end aspect-ratios\n// stylelint-enable function-disallowed-list\n\n// Typography\n//\n// Font, line-height, and color for body text, headings, and more.\n\n// stylelint-disable value-keyword-case\n$font-family-sans-serif: 'Open Sans' !default;\n$font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace !default;\n// stylelint-enable value-keyword-case\n$font-family-base: var(--bs-font-sans-serif) !default;\n$font-family-code: var(--bs-font-monospace) !default;\n\n// $font-size-root effects the value of `rem`, which is used for as well font sizes, paddings and margins\n// $font-size-base effects the font size of the body text\n$font-size-root: null !default;\n$font-size-base: 1rem !default; // Assumes the browser default, typically `16px`\n$font-size-xxs: $font-size-base * .65 !default;\n$font-size-xs: $font-size-base * .75 !default;\n$font-size-sm: $font-size-base * .875 !default;\n$font-size-lg: $font-size-base * 1.125 !default;\n$font-size-xl: $font-size-base * 1.25 !default;\n\n$font-weight-lighter: lighter !default;\n$font-weight-light: 300 !default;\n$font-weight-normal: 400 !default;\n$font-weight-bold: 600 !default;\n$font-weight-bolder: 700 !default;\n\n$font-weight-base: $font-weight-normal !default;\n\n$h1-font-weight: $font-weight-bold !default;\n$h2-font-weight: $font-weight-bold !default;\n$h3-font-weight: $font-weight-bold !default;\n$h4-font-weight: $font-weight-bold !default;\n$h5-font-weight: $font-weight-bold !default;\n$h6-font-weight: $font-weight-bold !default;\n$p-font-weight: $font-weight-normal !default;\n$lead-font-weight: $font-weight-normal !default;\n$text-sm-font-weight: $font-weight-normal !default;\n$text-xs-font-weight: $font-weight-normal !default;\n\n$line-height: 1.75rem !default;\n$line-height-base: 1.5 !default;\n$line-height-sm: 1.25 !default;\n$line-height-lg: 2 !default;\n\n$h1-line-height: 1.2 !default;\n$h2-line-height: 1.25 !default;\n$h3-line-height: 1.375 !default;\n$h4-line-height: 1.375 !default;\n$h5-line-height: 1.375 !default;\n$h6-line-height: 1.625 !default;\n$p-line-height: 1.6 !default;\n$lead-line-height: 1.625 !default;\n$text-sm-line-height: 1.5 !default;\n$text-xs-line-height: 1.25 !default;\n\n$font-size-base: 1rem !default; // Assumes the browser default, typically `16px`\n$h1-font-size: $font-size-base * 3 !default;\n$h2-font-size: $font-size-base * 2.25 !default;\n$h3-font-size: $font-size-base * 1.875 !default;\n$h4-font-size: $font-size-base * 1.5 !default;\n$h5-font-size: $font-size-base * 1.25 !default;\n$h6-font-size: $font-size-base !default;\n$lead-font-size: $font-size-base * 1.25 !default;\n\n\n$text-sm-font-size: .875rem !default;\n$text-xs-font-size: .75rem !default;\n$p-font-size: 1rem !default;\n\n$headings-margin-bottom: $spacer / 2 !default;\n$headings-font-family: null !default;\n$headings-font-style: null !default;\n$headings-font-weight: 400 !default;\n$headings-line-height: 1.2 !default;\n$headings-color: null !default;\n\n// scss-docs-start display-headings\n$display-font-sizes: (\n 1: 5rem,\n 2: 4.5rem,\n 3: 4rem,\n 4: 3.5rem,\n 5: 3rem,\n 6: 2.5rem\n) !default;\n\n$display-font-weight: 300 !default;\n$display-line-height: $headings-line-height !default;\n// scss-docs-end display-headings\n\n$lead-font-size: $font-size-base * 1.25 !default;\n$lead-font-weight: 300 !default;\n\n$small-font-size: .875em !default;\n\n$sub-sup-font-size: .75em !default;\n\n$text-secondary: $font-color !default;\n$text-muted: $gray-600 !default;\n\n// text gradient\n$text-gradient-bg-clip: text !default;\n$text-gradient-text-fill: transparent !default;\n$text-gradient-position: relative !default;\n$text-gradient-zindex: 1 !default;\n$text-gradient-bg-primary: linear-gradient(310deg, #7928CA, #FF0080) !default;\n$text-gradient-bg-info: linear-gradient(310deg, #2152FF, #21D4FD) !default;\n$text-gradient-bg-success: linear-gradient(310deg, #17AD37, #C1E823) !default;\n$text-gradient-bg-warning: linear-gradient(310deg, #F53939, #FBCF33) !default;\n$text-gradient-bg-danger: linear-gradient(310deg, #D60808, #FF6690) !default;\n$text-gradient-bg-dark: linear-gradient(310deg, #141727, #3A416F) !default;\n\n$initialism-font-size: $small-font-size !default;\n\n$blockquote-margin-y: $spacer !default;\n$blockquote-font-size: $font-size-base * 1.25 !default;\n$blockquote-footer-color: $gray-600 !default;\n$blockquote-footer-font-size: $small-font-size !default;\n\n$hr-margin-y: $spacer !default;\n$hr-color: inherit !default;\n$hr-height: $border-width !default;\n$hr-opacity: .25 !default;\n\n$legend-margin-bottom: .5rem !default;\n$legend-font-size: 1.5rem !default;\n$legend-font-weight: null !default;\n\n$mark-padding: .2em !default;\n\n$dt-font-weight: $font-weight-bold !default;\n\n$nested-kbd-font-weight: $font-weight-bold !default;\n\n$list-inline-padding: .5rem !default;\n\n$mark-bg: #fcf8e3 !default;\n\n// Letter Spacing\n$letter-wider: .05rem !default;\n$letter-normal: 0rem !default;\n$letter-tighter: -0.05rem !default;\n$h1-letter-spacing: 0.1rem !default;\n$a-letter-spacing: -0.025rem !default;\n\n// Tables\n//\n// Customizes the `.table` component with basic values, each used across all table variations.\n$table-head-spacer-y: .75rem !default;\n$table-head-spacer-x: 1rem !default;\n$table-head-font-size: .65rem !default;\n$table-head-font-weight: $font-weight-bold !default;\n$table-head-text-transform: capitalize !default;\n$table-head-letter-spacing: 0px !default;\n$table-head-bg: $gray-100 !default;\n$table-head-color: $gray-600 !default;\n\n$table-body-font-size: .8125rem !default;\n\n$table-border-width: $border-width !default;\n$table-border-color: $gray-200 !default;\n\n// scss-docs-start table-variables\n$table-cell-padding-y: .5rem !default;\n$table-cell-padding-x: .5rem !default;\n$table-cell-padding-y-sm: .25rem !default;\n$table-cell-padding-x-sm: .25rem !default;\n\n$table-cell-vertical-align: top !default;\n\n$table-color: $body-color !default;\n$table-bg: transparent !default;\n\n$table-th-font-weight: null !default;\n\n$table-striped-color: $table-color !default;\n$table-striped-bg-factor: .05 !default;\n$table-striped-bg: rgba($black, $table-striped-bg-factor) !default;\n\n$table-active-color: $table-color !default;\n$table-active-bg-factor: .1 !default;\n$table-active-bg: rgba($black, $table-active-bg-factor) !default;\n\n$table-hover-color: $table-color !default;\n$table-hover-bg-factor: .075 !default;\n$table-hover-bg: rgba($black, $table-hover-bg-factor) !default;\n\n$table-border-factor: .1 !default;\n$table-border-width: $border-width !default;\n$table-border-color: $border-color !default;\n\n$table-striped-order: odd !default;\n\n$table-group-separator-color: currentColor !default;\n\n$table-caption-color: $text-muted !default;\n\n$table-bg-level: -9 !default;\n$table-bg-scale: -80% !default;\n\n\n$table-variants: (\n \"primary\": shift-color($primary, $table-bg-scale),\n \"secondary\": shift-color($secondary, $table-bg-scale),\n \"success\": shift-color($success, $table-bg-scale),\n \"info\": shift-color($info, $table-bg-scale),\n \"warning\": shift-color($warning, $table-bg-scale),\n \"danger\": shift-color($danger, $table-bg-scale),\n \"light\": $light,\n \"dark\": $dark,\n) !default;\n// scss-docs-end table-variables\n\n\n// Buttons + Forms\n//\n// Shared variables that are reassigned to `$input-` and `$btn-` specific variables.\n\n$input-btn-padding-y: .5rem !default;\n$input-btn-padding-x: .75rem !default;\n$input-btn-font-family: null !default;\n$input-btn-font-size: 1rem !default;\n$input-btn-line-height: 1.4 !default;\n\n$input-btn-focus-width: .2rem !default;\n$input-btn-focus-color-opacity: .25 !default;\n$input-btn-focus-color: rgba($component-active-bg, $input-btn-focus-color-opacity) !default;\n$input-btn-focus-box-shadow: 0 0 0 $input-btn-focus-width $input-btn-focus-color !default;\n\n$input-btn-padding-y-sm: .25rem !default;\n$input-btn-padding-x-sm: .75rem !default;\n$input-btn-font-size-sm: .75rem !default;\n\n$input-btn-padding-y-lg: .75rem !default;\n$input-btn-padding-x-lg: .75rem !default;\n$input-btn-font-size-lg: .875rem !default;\n\n$input-btn-border-width: $border-width !default;\n\n\n// Buttons\n//\n// For each of Bootstrap's buttons, define text, background, and border color.\n\n$btn-padding-y: .75rem !default;\n$btn-padding-x: 1.5rem !default;\n$btn-font-family: $input-btn-font-family !default;\n$btn-font-size: $text-xs-font-size !default;\n$btn-line-height: $input-btn-line-height !default;\n$btn-white-space: null !default; // Set to `nowrap` to prevent text wrapping\n$btn-letter-spacing: -0.025rem !default; // Set to `nowrap` to prevent text wrapping\n\n$btn-margin-bottom: 1rem !default;\n$btn-padding-y-sm: .5rem !default;\n$btn-padding-x-sm: 2rem !default;\n$btn-font-size-sm: $input-btn-font-size-sm !default;\n\n$btn-padding-y-lg: .875rem !default;\n$btn-padding-x-lg: 4rem !default;\n$btn-font-size-lg: .875rem !default;\n\n$btn-border-width: $input-btn-border-width !default;\n\n$btn-font-weight: $font-weight-bolder !default;\n$btn-box-shadow: 0 4px 7px -1px rgba(0,0,0,.11), 0 2px 4px -1px rgba(0,0,0,.07) !default;\n$btn-box-shadow-values: 0 5px 8px 0 !default;\n$btn-box-shadow-hover-values: 0 8px 10px 0 !default;\n$btn-hover-box-shadow: 0 3px 5px -1px rgba(0,0,0,.09), 0 2px 3px -1px rgba(0,0,0,.07) !default;\n$btn-focus-box-shadow: $btn-hover-box-shadow !default;\n$btn-focus-width: $input-btn-focus-width !default;\n$btn-hover-opacity: .85 !default;\n$btn-disabled-opacity: .65 !default;\n$btn-active-box-shadow: none !default;\n$btn-background-size: 150% !default;\n$btn-hover-transform: scale(1.02) !default;\n$btn-active-hover-transform: scale(1) !default;\n$btn-background-position-x: 25% !default;\n\n$btn-link-color: $link-color !default;\n$btn-link-hover-color: $link-hover-color !default;\n$btn-link-disabled-color: $gray-600 !default;\n\n$btn-block-spacing-y: .5rem !default;\n\n// Allows for customizing button radius independently from global border radius\n$btn-border-radius: .5rem !default;\n$btn-border-radius-lg: .5rem !default;\n$btn-border-radius-sm: .5rem !default;\n$btn-border-rounded: 1.875rem !default;\n\n$btn-icon-transition: all .2s cubic-bezier(.34,1.61,.7,1.3) !default;\n$btn-icon-transform: translateX(5px) !default;\n// Allows for customizing button radius independently from global border radius\n$btn-border-radius: $border-radius-md !default;\n$btn-border-radius-sm: $border-radius-sm !default;\n$btn-border-radius-lg: $border-radius-lg !default;\n\n$btn-transition: all .15s ease-in !default;\n\n$btn-just-icon-width: 2.375rem !default;\n$btn-just-icon-height: $btn-just-icon-width !default;\n$btn-just-icon-width-sm: 2.1875rem !default;\n$btn-just-icon-height-sm: $btn-just-icon-width-sm !default;\n$btn-just-icon-sm-font-size: .5rem !default;\n$btn-just-icon-width-lg: 3.25rem !default;\n$btn-just-icon-height-lg: $btn-just-icon-width-lg !default;\n$btn-just-icon-lg-font-size: 1.2rem !default;\n$btn-just-icon-lg-position: relative !default;\n$btn-just-icon-lg-top: 2px !default;\n\n// we've overwritten the default Bootstrap function\n// for dynamically adding font color since the colors\n// added by that function were not correctly set\n$btn-primary-font-color: #fff !default;\n$btn-secondary-font-color: #fff !default;\n$btn-danger-font-color: #fff !default;\n$btn-info-font-color: #fff !default;\n$btn-success-font-color: #fff !default;\n$btn-warning-font-color: #fff !default;\n$btn-dark-font-color: #fff !default;\n$btn-light-font-color: #3A416F !default;\n\n$btn-font-colors: () !default;\n\n$btn-font-colors: map-merge(\n (\n \"primary\": $btn-primary-font-color,\n \"secondary\": $btn-secondary-font-color,\n \"danger\": $btn-danger-font-color,\n \"info\": $btn-info-font-color,\n \"success\": $btn-success-font-color,\n \"warning\": $btn-warning-font-color,\n \"dark\": $btn-dark-font-color,\n \"light\": $btn-light-font-color\n ),\n $btn-font-colors\n);\n\n// Forms\n\n$form-text-margin-top: .25rem !default;\n$form-text-font-size: $small-font-size !default;\n$form-text-font-style: null !default;\n$form-text-font-weight: null !default;\n$form-text-color: $text-muted !default;\n\n$form-label-margin-bottom: .5rem !default;\n$form-label-margin-left: .25rem !default;\n$form-label-font-size: .75rem !default;\n$form-label-font-style: null !default;\n$form-label-font-weight: 700 !default;\n$form-label-color: $dark !default;\n\n$input-padding-y: .5rem !default;\n$input-padding-x: .75rem !default;\n$input-font-family: $input-btn-font-family !default;\n$input-font-size: $font-size-sm !default;\n$input-font-weight: $font-weight-base !default;\n$input-line-height: 1.4rem !default;\n\n$input-padding-y-sm: $input-btn-padding-y-sm !default;\n$input-padding-x-sm: $input-btn-padding-x-sm !default;\n$input-font-size-sm: .75rem !default;\n\n$input-padding-y-lg: $input-btn-padding-y-lg !default;\n$input-padding-x-lg: $input-btn-padding-x-lg !default;\n$input-font-size-lg: .875rem !default;\n\n$input-bg: $white !default;\n$input-disabled-bg: $gray-200 !default;\n$input-disabled-border-color: null !default;\n\n$input-color: $gray-700 !default;\n$input-border-color: #d2d6da !default;\n$input-border-width: $input-btn-border-width !default;\n$input-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !default;\n\n$input-border-radius: $border-radius-md !default;\n$input-border-radius-sm: $border-radius-md !default;\n$input-border-radius-lg: $border-radius-md !default;\n\n$input-focus-bg: $white !default;\n$input-focus-border-color: #e293d3 !default;\n$input-focus-color: $input-color !default;\n$input-focus-width: 2px !default;\n$input-focus-box-shadow: 0 0 0 $input-focus-width #e9aede !default;\n\n$input-placeholder-color: $gray-500 !default;\n$input-plaintext-color: $dark !default;\n\n$input-height-border: $input-border-width * 2 !default;\n\n$input-height-inner: unset !default;\n$input-height-inner-half: 1rem !default;\n$input-height-inner-quarter: .75rem !default;\n\n$input-height: unset !default;\n$input-height-sm: unset !default;\n$input-height-lg: unset !default;\n\n$input-transition: box-shadow .15s ease, border-color .15s ease !default;\n\n\n$form-check-input-width: 1.23em !default;\n$form-check-min-height: $font-size-base * $line-height-base !default;\n$form-check-padding-left: $form-check-input-width + .45em !default;\n$form-check-margin-bottom: .125rem !default;\n$form-check-label-color: null !default;\n$form-check-label-cursor: null !default;\n$form-check-transition: background-color .25s ease, border-color .25s ease, background-position .15s ease-in-out, opacity .15s ease-out, box-shadow .15s ease-in-out !default;\n$form-check-transition-time: .25s !default;\n\n$form-check-input-active-filter: brightness(99%) !default;\n\n$form-check-input-bg: $white !default;\n$form-check-input-border: none !default;\n$form-check-input-border-radius: .35rem !default;\n$form-check-radio-border-radius: 50% !default;\n$form-check-input-focus-border: none !default;\n$form-check-input-focus-box-shadow: none !default;\n\n$form-check-input-checked-color: $white !default;\n$form-check-input-checked-bg-color: transparent !default;\n$form-check-input-checked-border-color: $form-check-input-checked-bg-color !default;\n$form-check-input-checked-bg-image: linear-gradient(310deg, $dark-gradient 0%, $dark-gradient-state 100%) !default;\n$form-check-radio-checked-bg-image: $form-check-input-checked-bg-image !default;\n$form-check-radio-after-width: .4375rem !default;\n\n$form-check-input-indeterminate-color: $component-active-color !default;\n$form-check-input-indeterminate-bg-color: $component-active-bg !default;\n$form-check-input-indeterminate-border-color: $form-check-input-indeterminate-bg-color !default;\n$form-check-input-indeterminate-bg-image: url(\"data:image/svg+xml,\") !default;\n\n$form-switch-color: rgba(0, 0, 0, 1) !default;\n$form-switch-height: 1.2em !default;\n$form-switch-width: 2.5rem !default;\n$form-switch-check-after-width: 1rem !default;\n$form-switch-padding-start: $form-switch-width + .5rem !default;\n$form-switch-bg-image: none !default;\n$form-switch-border-radius: $form-switch-width !default;\n$form-switch-translate-x-start: 1px !default;\n$form-switch-translate-x-end: 21px !default;\n$form-switch-round-box-shadow: $box-shadow !default;\n\n$form-switch-focus-color: $form-switch-color !default;\n$form-switch-focus-bg-image: $form-switch-bg-image !default;\n$form-switch-checked-color: $white !default;\n$form-switch-checked-bg-image: $form-switch-bg-image !default;\n$form-switch-checked-bg-position: right center !default;\n\n$form-check-inline-margin-right: 1rem !default;\n\n$input-group-addon-padding-y: $input-padding-y !default;\n$input-group-addon-padding-x: $input-padding-x !default;\n$input-group-addon-font-weight: $input-font-weight !default;\n$input-group-addon-color: $dark !default;\n$input-group-addon-bg: $white !default;\n$input-group-addon-border-color: $input-border-color !default;\n\n\n$form-select-padding-y: $input-padding-y !default;\n$form-select-padding-x: $input-padding-x !default;\n$form-select-font-family: $input-font-family !default;\n$form-select-font-size: $input-font-size !default;\n$form-select-height: $input-height !default;\n$form-select-indicator-padding: 1rem !default; // Extra padding to account for the presence of the background-image based indicator\n$form-select-font-weight: $input-font-weight !default;\n$form-select-line-height: $input-line-height !default;\n$form-select-color: $input-color !default;\n$form-select-disabled-color: $gray-600 !default;\n$form-select-bg: $input-bg !default;\n$form-select-disabled-bg: $gray-200 !default;\n$form-select-disabled-border-color: $input-disabled-border-color !default;\n$form-select-bg-position: right $form-select-padding-x center !default;\n$form-select-bg-size: 16px 12px !default; // In pixels because image dimensions\n$form-select-indicator-color: $gray-800 !default;\n$form-select-indicator: url(\"data:image/svg+xml,\") !default;\n\n$form-select-feedback-icon-padding-right: add(1em * .75, (2 * $form-select-padding-y * .75) + $form-select-padding-x + $form-select-indicator-padding) !default;\n$form-select-feedback-icon-position: center right ($form-select-padding-x + $form-select-indicator-padding) !default;\n$form-select-feedback-icon-size: $input-height-inner-half $input-height-inner-half !default;\n\n$form-select-border-width: $input-border-width !default;\n$form-select-border-color: $input-border-color !default;\n$form-select-border-radius: $border-radius-md !default;\n$form-select-box-shadow: $box-shadow-inset !default;\n\n$form-select-focus-border-color: $input-focus-border-color !default;\n$form-select-focus-width: $input-focus-width !default;\n$form-select-focus-box-shadow: $input-focus-box-shadow !default;\n\n$form-select-padding-y-sm: $input-padding-y-sm !default;\n$form-select-padding-x-sm: $input-padding-x-sm !default;\n$form-select-font-size-sm: $input-font-size-sm !default;\n$form-select-height-sm: $input-height-sm !default;\n\n$form-select-padding-y-lg: $input-padding-y-lg !default;\n$form-select-padding-x-lg: $input-padding-x-lg !default;\n$form-select-font-size-lg: $input-font-size-lg !default;\n$form-select-height-lg: $input-height-lg !default;\n\n$form-range-track-width: 100% !default;\n$form-range-track-height: .5rem !default;\n$form-range-track-cursor: pointer !default;\n$form-range-track-bg: $gray-300 !default;\n$form-range-track-border-radius: 1rem !default;\n$form-range-track-box-shadow: $box-shadow-inset !default;\n\n$form-range-thumb-width: 1rem !default;\n$form-range-thumb-height: $form-range-thumb-width !default;\n$form-range-thumb-bg: $component-active-bg !default;\n$form-range-thumb-border: 0 !default;\n$form-range-thumb-border-radius: 1rem !default;\n$form-range-thumb-box-shadow: 0 .1rem .25rem rgba($black, .1) !default;\n$form-range-thumb-focus-box-shadow: 0 0 0 1px $body-bg, $input-focus-box-shadow !default;\n$form-range-thumb-focus-box-shadow-width: $input-focus-width !default; // For focus box shadow issue in Edge\n$form-range-thumb-active-bg: lighten($component-active-bg, 35%) !default;\n$form-range-thumb-disabled-bg: $gray-500 !default;\n$form-range-thumb-transition: background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n\n$form-file-height: $input-height !default;\n$form-file-focus-border-color: $input-focus-border-color !default;\n$form-file-focus-box-shadow: $input-focus-box-shadow !default;\n$form-file-disabled-bg: $input-disabled-bg !default;\n$form-file-disabled-border-color: $input-disabled-border-color !default;\n\n$form-file-padding-y: $input-padding-y !default;\n$form-file-padding-x: $input-padding-x !default;\n$form-file-line-height: $input-line-height !default;\n$form-file-font-family: $input-font-family !default;\n$form-file-font-weight: $input-font-weight !default;\n$form-file-color: $input-color !default;\n$form-file-bg: $input-bg !default;\n$form-file-border-width: $input-border-width !default;\n$form-file-border-color: $input-border-color !default;\n$form-file-border-radius: $input-border-radius !default;\n$form-file-box-shadow: $input-box-shadow !default;\n$form-file-button-color: $form-file-color !default;\n$form-file-button-bg: $input-group-addon-bg !default;\n\n$form-file-padding-y-sm: $input-padding-y-sm !default;\n$form-file-padding-x-sm: $input-padding-x-sm !default;\n$form-file-font-size-sm: $input-font-size-sm !default;\n$form-file-height-sm: $input-height-sm !default;\n\n$form-file-padding-y-lg: $input-padding-y-lg !default;\n$form-file-padding-x-lg: $input-padding-x-lg !default;\n$form-file-font-size-lg: $input-font-size-lg !default;\n$form-file-height-lg: $input-height-lg !default;\n\n\n// Form validation\n\n$form-feedback-margin-top: $form-text-margin-top !default;\n$form-feedback-font-size: $form-text-font-size !default;\n$form-feedback-font-style: $form-text-font-style !default;\n$form-feedback-valid-color: #66d432 !default;\n$form-feedback-invalid-color: #fd5c70 !default;\n\n$form-feedback-icon-valid-color: $form-feedback-valid-color !default;\n$form-feedback-icon-valid: url(\"data:image/svg+xml,\") !default;\n$form-feedback-icon-invalid-color: $form-feedback-invalid-color !default;\n$form-feedback-icon-invalid: url(\"data:image/svg+xml,\") !default;\n\n// scss-docs-start form-validation-states\n$form-validation-states: (\n \"valid\": (\n \"color\": $form-feedback-valid-color,\n \"icon\": $form-feedback-icon-valid\n ),\n \"invalid\": (\n \"color\": $form-feedback-invalid-color,\n \"icon\": $form-feedback-icon-invalid\n )\n) !default;\n// scss-docs-end form-validation-states\n\n// Z-index master list\n//\n// Warning: Avoid customizing these values. They're used for a bird's eye view\n// of components dependent on the z-axis and are designed to all work together.\n\n// scss-docs-start zindex-stack\n$zindex-dropdown: 1000 !default;\n$zindex-sticky: 1020 !default;\n$zindex-fixed: 1030 !default;\n$zindex-modal-backdrop: 1040 !default;\n$zindex-modal: 1050 !default;\n$zindex-popover: 1060 !default;\n$zindex-tooltip: 1070 !default;\n// scss-docs-end zindex-stack\n\n\n// Navs\n\n$nav-link-padding-y: .5rem !default;\n$nav-link-padding-x: 1rem !default;\n$nav-link-font-size: null !default;\n$nav-link-font-weight: null !default;\n$nav-link-color: null !default;\n$nav-link-hover-color: null !default;\n$nav-link-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out !default;\n$nav-link-disabled-color: $gray-600 !default;\n$nav-link-footer-padding: .25rem !default;\n\n$nav-tabs-border-color: $gray-300 !default;\n$nav-tabs-border-width: $border-width !default;\n$nav-tabs-border-radius: $border-radius-md !default;\n$nav-tabs-link-hover-border-color: $gray-200 $gray-200 $nav-tabs-border-color !default;\n$nav-tabs-link-active-color: $gray-700 !default;\n$nav-tabs-link-active-bg: $body-bg !default;\n$nav-tabs-link-active-border-color: $gray-300 $gray-300 $nav-tabs-link-active-bg !default;\n\n$nav-pills-border-radius: 0.75rem !default;\n$nav-pills-link-active-color: $dark !default;\n$nav-pills-link-active-bg: $white !default;\n$nav-pills-link-transition: background-color .3s ease !default;\n$nav-pills-background: $gray-100 !default;\n$nav-pills-vertical-background: transparent !default;\n$nav-pills-vertical-radius: 1.1875rem !default;\n$nav-pills-vertical-link-radius: .875rem !default;\n\n\n// Navbar\n\n$navbar-padding-y: $spacer / 2 !default;\n$navbar-padding-x: null !default;\n$navbar-box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .16) !default;\n\n$navbar-nav-link-padding-x: .5rem !default;\n$navbar-nav-link-padding: $navbar-nav-link-padding-x 1rem !default;\n\n$navbar-brand-font-size: $font-size-lg !default;\n// Compute the navbar-brand padding-y so the navbar-brand will have the same height as navbar-text and nav-link\n$nav-link-height: $font-size-base * $line-height-base + $nav-link-padding-y * 2 !default;\n$navbar-brand-height: $navbar-brand-font-size * $line-height-base !default;\n$navbar-brand-padding-y: ($nav-link-height - $navbar-brand-height) / 2 !default;\n$navbar-brand-margin-right: 1rem !default;\n\n$navbar-toggler-padding-y: .25rem !default;\n$navbar-toggler-padding-x: .75rem !default;\n$navbar-toggler-font-size: $font-size-lg !default;\n$navbar-toggler-border-radius: $btn-border-radius !default;\n$navbar-toggler-focus-width: $btn-focus-width !default;\n$navbar-toggler-transition: box-shadow .15s ease-in-out !default;\n\n$navbar-blur-bg-color: rgba(255, 255, 255, .8) !default;\n$navbar-blur-dark-bg-color: rgba(2, 5, 22, .8) !default;\n\n$navbar-dark-color: rgba($white, .85) !default;\n$navbar-dark-hover-color: rgba($white, .75) !default;\n$navbar-dark-active-color: $white !default;\n$navbar-dark-disabled-color: rgba($white, .25) !default;\n$navbar-dark-toggler-icon-bg: url(\"data:image/svg+xml,\") !default;\n$navbar-dark-toggler-border-color: rgba($white, .1) !default;\n\n$navbar-light-color: $dark !default;\n$navbar-light-hover-color: rgba($dark, .7) !default;\n$navbar-light-active-color: rgba($dark, .9) !default;\n$navbar-light-disabled-color: rgba($dark, .3) !default;\n$navbar-light-toggler-icon-bg: url(\"data:image/svg+xml,\") !default;\n$navbar-light-toggler-border-color: rgba($dark, .1) !default;\n\n$navbar-light-brand-color: $navbar-light-active-color !default;\n$navbar-light-brand-hover-color: $navbar-light-active-color !default;\n$navbar-dark-brand-color: $navbar-dark-active-color !default;\n$navbar-dark-brand-hover-color: $navbar-dark-active-color !default;\n\n\n// Dropdowns\n//\n// Dropdown menu container and contents.\n\n$dropdown-min-width: 11rem !default;\n$dropdown-padding-x: 0 !default;\n$dropdown-padding-y: .5rem !default;\n$dropdown-spacer: 1.625rem !default;\n$dropdown-font-size: $font-size-sm !default;\n$dropdown-color: $body-color !default;\n$dropdown-bg: $white !default;\n$dropdown-border-color: transparent !default;\n$dropdown-border-radius: $border-radius-md !default;\n$dropdown-border-width: 0 !default;\n$dropdown-inner-border-radius: subtract($dropdown-border-radius, $dropdown-border-width) !default;\n$dropdown-transition-time: .3s ease !default;\n$dropdown-divider-bg: $dropdown-border-color !default;\n$dropdown-divider-margin-y: $spacer / 2 !default;\n$dropdown-box-shadow: $box-shadow-lg !default;\n\n$dropdown-link-color: $font-color !default;\n$dropdown-link-hover-color: $h-color !default;\n$dropdown-link-hover-bg: $gray-200 !default;\n\n$dropdown-link-active-color: $font-color !default;\n$dropdown-link-active-bg: transparent !default;\n\n$dropdown-link-disabled-color: $gray-600 !default;\n\n$dropdown-item-padding-y: .3rem !default;\n$dropdown-item-padding-x: $spacer !default;\n\n$dropdown-header-color: $gray-600 !default;\n$dropdown-header-padding: $dropdown-padding-y $dropdown-item-padding-x !default;\n\n$dropdown-dark-color: $gray-300 !default;\n$dropdown-dark-bg: $gray-800 !default;\n$dropdown-dark-border-color: $dropdown-border-color !default;\n$dropdown-dark-divider-bg: $dropdown-divider-bg !default;\n$dropdown-dark-box-shadow: null !default;\n$dropdown-dark-link-color: $dropdown-dark-color !default;\n$dropdown-dark-link-hover-color: $white !default;\n$dropdown-dark-link-hover-bg: rgba($white, .15) !default;\n$dropdown-dark-link-active-color: $dropdown-link-active-color !default;\n$dropdown-dark-link-active-bg: $dropdown-link-active-bg !default;\n$dropdown-dark-link-disabled-color: $gray-500 !default;\n$dropdown-dark-header-color: $gray-500 !default;\n\n\n// Pagination\n\n$pagination-padding-y: .375rem !default;\n$pagination-padding-x: .75rem !default;\n$pagination-padding-y-sm: .25rem !default;\n$pagination-padding-x-sm: .5rem !default;\n$pagination-padding-y-lg: .75rem !default;\n$pagination-padding-x-lg: 1.5rem !default;\n\n$pagination-color: $link-color !default;\n$pagination-bg: $white !default;\n$pagination-border-width: $border-width !default;\n$pagination-border-radius: $border-radius-md !default;\n$pagination-margin-left: -$pagination-border-width !default;\n$pagination-border-color: $gray-300 !default;\n\n$pagination-focus-color: $link-hover-color !default;\n$pagination-focus-bg: $gray-200 !default;\n$pagination-focus-box-shadow: $input-btn-focus-box-shadow !default;\n$pagination-focus-outline: 0 !default;\n\n$pagination-hover-color: $link-hover-color !default;\n$pagination-hover-bg: $gray-200 !default;\n$pagination-hover-border-color: $gray-300 !default;\n\n$pagination-active-color: $component-active-color !default;\n$pagination-active-bg: $component-active-bg !default;\n$pagination-active-border-color: $pagination-active-bg !default;\n\n$pagination-disabled-color: $gray-600 !default;\n$pagination-disabled-bg: $white !default;\n$pagination-disabled-border-color: $gray-300 !default;\n\n$pagination-transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;\n\n// Cards\n\n$card-spacer-y: $spacer !default;\n$card-spacer-x: $spacer !default;\n$card-title-spacer-y: $spacer / 2 !default;\n$card-border-width: 0 !default;\n$card-border-radius: 1rem !default;\n$card-border-color: rgba($black, .125) !default;\n$card-inner-border-radius: subtract($card-border-radius, $card-border-width) !default;\n$card-cap-padding-y: $card-spacer-y / 2 !default;\n$card-cap-padding-x: $card-spacer-x !default;\n$card-cap-bg: $white !default;\n$card-cap-color: null !default;\n$card-height: null !default;\n$card-color: null !default;\n$card-bg: $white !default;\n\n$card-img-overlay-padding: $spacer !default;\n\n$card-group-margin: $grid-gutter-width / 2 !default;\n\n\n// Accordion\n$accordion-padding-y: 1rem !default;\n$accordion-padding-x: 1rem !default;\n$accordion-color: $body-color !default;\n$accordion-bg: transparent !default;\n$accordion-border-width: 0 !default;\n$accordion-border-color: rgba($black, .125) !default;\n$accordion-border-radius: $border-radius-sm !default;\n\n$accordion-body-padding-y: $accordion-padding-y !default;\n$accordion-body-padding-x: $accordion-padding-x !default;\n\n$accordion-button-padding-y: $accordion-padding-y !default;\n$accordion-button-padding-x: $accordion-padding-x !default;\n$accordion-button-color: $accordion-color !default;\n$accordion-button-bg: $accordion-bg !default;\n$accordion-transition: $btn-transition, border-radius .15s ease !default;\n$accordion-button-active-bg: $accordion-bg !default;\n$accordion-button-active-color: $dark !default;\n\n$accordion-button-focus-border-color: $input-focus-border-color !default;\n$accordion-button-focus-box-shadow: none !default;\n\n$accordion-icon-width: 1rem !default;\n$accordion-icon-color: $accordion-color !default;\n$accordion-icon-active-color: $accordion-button-active-color !default;\n$accordion-icon-transition: transform .2s ease-in-out !default;\n$accordion-icon-transform: rotate(180deg) !default;\n\n$accordion-button-icon: none !default;\n$accordion-button-active-icon: none !default;\n\n\n// Tooltips\n\n$tooltip-font-size: $font-size-sm !default;\n$tooltip-max-width: 200px !default;\n$tooltip-color: $white !default;\n$tooltip-bg: $black !default;\n$tooltip-border-radius: $border-radius-md !default;\n$tooltip-opacity: .9 !default;\n$tooltip-padding-y: $spacer / 4 !default;\n$tooltip-padding-x: $spacer / 2 !default;\n$tooltip-margin: 0 !default;\n\n$tooltip-arrow-width: .8rem !default;\n$tooltip-arrow-height: .4rem !default;\n$tooltip-arrow-color: $tooltip-bg !default;\n\n// Form tooltips must come after regular tooltips\n$form-feedback-tooltip-padding-y: $tooltip-padding-y !default;\n$form-feedback-tooltip-padding-x: $tooltip-padding-x !default;\n$form-feedback-tooltip-font-size: $tooltip-font-size !default;\n$form-feedback-tooltip-line-height: null !default;\n$form-feedback-tooltip-opacity: $tooltip-opacity !default;\n$form-feedback-tooltip-border-radius: $tooltip-border-radius !default;\n\n\n// Popovers\n\n$popover-font-size: $font-size-xs !default;\n$popover-bg: $white !default;\n$popover-max-width: 276px !default;\n$popover-border-width: 0px !default;\n$popover-border-color: rgba($black, .2) !default;\n$popover-border-radius: $border-radius-lg !default;\n$popover-inner-border-radius: subtract($popover-border-radius, $popover-border-width) !default;\n$popover-box-shadow: $box-shadow-sm !default;\n\n$popover-header-bg: $gray-200 !default;\n$popover-header-color: $headings-color !default;\n$popover-header-padding-y: .5rem !default;\n$popover-header-padding-x: $spacer !default;\n\n$popover-body-color: $font-color !default;\n$popover-body-padding-y: $spacer !default;\n$popover-body-padding-x: $spacer !default;\n\n$popover-arrow-width: 1rem !default;\n$popover-arrow-height: .5rem !default;\n$popover-arrow-color: $popover-bg !default;\n\n$popover-arrow-outer-color: fade-in($popover-border-color, .05) !default;\n\n\n// Toasts\n\n$toast-max-width: 350px !default;\n$toast-padding-x: .75rem !default;\n$toast-padding-y: .75rem !default;\n$toast-font-size: .875rem !default;\n$toast-color: null !default;\n$toast-background-color: rgba($white, .85) !default;\n$toast-border-width: 0 !default;\n$toast-border-color: transparent !default;\n$toast-border-radius: $border-radius-md !default;\n$toast-box-shadow: $box-shadow !default;\n\n$toast-header-color: $h-color !default;\n$toast-header-background-color: rgba($white, .85) !default;\n$toast-header-border-color: rgba(0, 0, 0, .05) !default;\n\n\n// Badges\n\n$badge-font-size: .75em !default;\n$badge-font-weight: $font-weight-bolder !default;\n$badge-color: $white !default;\n$badge-padding-y: .55em !default;\n$badge-padding-x: .9em !default;\n$badge-border-radius-custom: .45rem !default;\n$badge-border-radius: $badge-border-radius-custom !default;\n\n\n// Modals\n\n// Padding applied to the modal body\n$modal-inner-padding: $spacer !default;\n\n// Margin between elements in footer, must be lower than or equal to 2 * $modal-inner-padding\n$modal-footer-margin-between: .5rem !default;\n\n$modal-dialog-margin: .5rem !default;\n$modal-dialog-margin-y-sm-up: 1.75rem !default;\n\n$modal-title-line-height: $line-height-base !default;\n\n$modal-content-color: null !default;\n$modal-content-bg: $white !default;\n$modal-content-border-color: rgba($black, .2) !default;\n$modal-content-border-width: $border-width !default;\n$modal-content-border-radius: $border-radius-lg !default;\n$modal-content-inner-border-radius: subtract($modal-content-border-radius, $modal-content-border-width) !default;\n$modal-content-box-shadow-xs: $box-shadow-sm !default;\n$modal-content-box-shadow-sm-up: $box-shadow !default;\n\n$modal-backdrop-bg: $black !default;\n$modal-backdrop-opacity: .5 !default;\n$modal-header-border-color: $border-color !default;\n$modal-footer-border-color: $modal-header-border-color !default;\n$modal-header-border-width: $modal-content-border-width !default;\n$modal-footer-border-width: $modal-header-border-width !default;\n$modal-header-padding-y: $modal-inner-padding !default;\n$modal-header-padding-x: $modal-inner-padding !default;\n$modal-header-padding: $modal-header-padding-y $modal-header-padding-x !default; // Keep this for backwards compatibility\n\n$modal-sm: 300px !default;\n$modal-md: 500px !default;\n$modal-lg: 800px !default;\n$modal-xl: 1140px !default;\n\n$modal-fade-transform: translate(0, -50px) !default;\n$modal-show-transform: none !default;\n$modal-transition: transform .3s ease-out !default;\n$modal-scale-transform: scale(1.02) !default;\n\n\n// Alerts\n//\n// Define alert colors, border radius, and padding.\n\n$alert-padding-y: $spacer !default;\n$alert-padding-x: $spacer !default;\n$alert-margin-bottom: 1rem !default;\n$alert-border-radius: $border-radius-md !default;\n$alert-link-font-weight: $font-weight-bold !default;\n$alert-border-width: $border-width !default;\n\n$alert-bg-level: -10 !default;\n$alert-border-level: -9 !default;\n$alert-color-level: 6 !default;\n\n$alert-dismissible-padding-r: $alert-padding-x * 3 !default; // 3x covers width of x plus default padding on either side\n\n\n// Progress bars\n\n$progress-height: 3px !default;\n$progress-bar-height: 6px !default;\n$progress-height-sm: 4px !default;\n$progress-height-lg: 20px !default;\n$progress-font-size: $font-size-base * .75 !default;\n$progress-bg: $gray-200 !default;\n$progress-border-radius: $border-radius-md !default;\n$progress-box-shadow: $box-shadow-inset !default;\n$progress-bar-color: $white !default;\n$progress-bar-bg: $primary !default;\n$progress-bar-animation-timing: 1s linear infinite !default;\n$progress-bar-transition: width .6s ease !default;\n\n\n// List group\n\n$list-group-color: null !default;\n$list-group-bg: $white !default;\n$list-group-border-color: rgba($black, .125) !default;\n$list-group-border-width: $border-width !default;\n$list-group-border-radius: $border-radius-md !default;\n\n$list-group-item-padding-y: $spacer / 2 !default;\n$list-group-item-padding-x: $spacer !default;\n$list-group-item-bg-level: -9 !default;\n$list-group-item-color-level: 6 !default;\n\n$list-group-hover-bg: $gray-100 !default;\n$list-group-active-color: $component-active-color !default;\n$list-group-active-bg: $component-active-bg !default;\n$list-group-active-border-color: $list-group-active-bg !default;\n\n$list-group-disabled-color: $gray-600 !default;\n$list-group-disabled-bg: $list-group-bg !default;\n\n$list-group-action-color: $gray-700 !default;\n$list-group-action-hover-color: $list-group-action-color !default;\n\n$list-group-action-active-color: $body-color !default;\n$list-group-action-active-bg: $gray-200 !default;\n\n\n// Image thumbnails\n\n$thumbnail-padding: .25rem !default;\n$thumbnail-bg: $body-bg !default;\n$thumbnail-border-width: $border-width !default;\n$thumbnail-border-color: $gray-300 !default;\n$thumbnail-border-radius: $border-radius-md !default;\n$thumbnail-box-shadow: $box-shadow-sm !default;\n\n\n// Figures\n\n$figure-caption-font-size: $small-font-size !default;\n$figure-caption-color: $gray-600 !default;\n\n\n// Breadcrumbs\n\n$breadcrumb-font-size: null !default;\n$breadcrumb-padding-y: $spacer / 2 !default;\n$breadcrumb-padding-x: $spacer !default;\n$breadcrumb-item-padding-x: .5rem !default;\n$breadcrumb-margin-bottom: 1rem !default;\n$breadcrumb-bg: $gray-200 !default;\n$breadcrumb-divider-color: $gray-600 !default;\n$breadcrumb-active-color: $gray-600 !default;\n$breadcrumb-divider: quote(\"/\") !default;\n$breadcrumb-border-radius: $border-radius-md !default;\n\n// Carousel\n\n$carousel-control-color: $white !default;\n$carousel-control-width: 15% !default;\n$carousel-control-opacity: .5 !default;\n$carousel-control-hover-opacity: .9 !default;\n$carousel-control-transition: opacity .15s ease !default;\n\n$carousel-indicator-width: 30px !default;\n$carousel-indicator-height: 3px !default;\n$carousel-indicator-hit-area-height: 10px !default;\n$carousel-indicator-spacer: 3px !default;\n$carousel-indicator-opacity: .5 !default;\n$carousel-indicator-active-bg: $white !default;\n$carousel-indicator-active-opacity: 1 !default;\n$carousel-indicator-transition: opacity .6s ease !default;\n\n$carousel-caption-width: 70% !default;\n$carousel-caption-color: $white !default;\n$carousel-caption-padding-y: 1.25rem !default;\n$carousel-caption-spacer: 1.25rem !default;\n\n$carousel-control-icon-width: 2rem !default;\n\n$carousel-control-prev-icon-bg: url(\"data:image/svg+xml,\") !default;\n$carousel-control-next-icon-bg: url(\"data:image/svg+xml,\") !default;\n\n$carousel-transition-duration: .6s !default;\n$carousel-transition: transform $carousel-transition-duration ease-in-out !default; // Define transform transition first if using multiple transitions (e.g., `transform 2s ease, opacity .5s ease-out`)\n\n$carousel-dark-indicator-active-bg: $black !default;\n$carousel-dark-caption-color: $black !default;\n$carousel-dark-control-icon-filter: invert(1) grayscale(100) !default;\n\n\n// Spinners\n\n$spinner-width: 2rem !default;\n$spinner-height: $spinner-width !default;\n$spinner-border-width: .25em !default;\n$spinner-animation-speed: .75s !default;\n\n$spinner-width-sm: 1rem !default;\n$spinner-height-sm: $spinner-width-sm !default;\n$spinner-border-width-sm: .2em !default;\n\n\n// Close\n\n$btn-close-width: 1em !default;\n$btn-close-height: $btn-close-width !default;\n$btn-close-padding-x: .25em !default;\n$btn-close-padding-y: $btn-close-padding-x !default;\n$btn-close-color: $white !default;\n$btn-close-bg: url(\"data:image/svg+xml,\") !default;\n$btn-close-focus-shadow: $input-btn-focus-box-shadow !default;\n$btn-close-opacity: .5 !default;\n$btn-close-hover-opacity: .75 !default;\n$btn-close-focus-opacity: 1 !default;\n$btn-close-disabled-opacity: .25 !default;\n$btn-close-white-filter: invert(1) grayscale(100%) brightness(200%) !default;\n\n// Code\n\n$code-font-size: $small-font-size !default;\n$code-color: $pink !default;\n\n$kbd-padding-y: .2rem !default;\n$kbd-padding-x: .4rem !default;\n$kbd-font-size: $code-font-size !default;\n$kbd-color: $white !default;\n$kbd-bg: $gray-900 !default;\n\n$pre-color: null !default;\n\n\n// Variables for Info areas\n\n@import \"variables/animations\";\n@import \"variables/avatars\";\n@import \"variables/cards\";\n@import \"variables/dropdowns\";\n@import 'variables/header';\n@import 'variables/info-areas';\n@import 'variables/navbar';\n@import 'variables/utilities';\n@import 'variables/misc';\n@import 'variables/form-switch';\n@import 'variables/pagination';\n@import \"variables/choices\";\n", @@ -224,7 +224,7 @@ "//\n// Stretched link\n//\n\n.stretched-link {\n &::#{$stretched-link-pseudo-element} {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: $stretched-link-z-index;\n content: \"\";\n }\n}\n", "//\n// Text truncation\n//\n\n.text-truncate {\n @include text-truncate();\n}\n", "// Loop over each breakpoint\n@each $breakpoint in map-keys($grid-breakpoints) {\n\n // Generate media query if needed\n @include media-breakpoint-up($breakpoint) {\n $infix: breakpoint-infix($breakpoint, $grid-breakpoints);\n\n // Loop over each utility property\n @each $key, $utility in $utilities {\n // The utility can be disabled with `false`, thus check if the utility is a map first\n // Only proceed if responsive media queries are enabled or if it's the base media query\n @if type-of($utility) == \"map\" and (map-get($utility, responsive) or $infix == \"\") {\n @include generate-utility($utility, $infix);\n }\n }\n }\n}\n\n// RFS rescaling\n@media (min-width: $rfs-mq-value) {\n @each $breakpoint in map-keys($grid-breakpoints) {\n $infix: breakpoint-infix($breakpoint, $grid-breakpoints);\n\n @if (map-get($grid-breakpoints, $breakpoint) < $rfs-breakpoint) {\n // Loop over each utility property\n @each $key, $utility in $utilities {\n // The utility can be disabled with `false`, thus check if the utility is a map first\n // Only proceed if responsive media queries are enabled or if it's the base media query\n @if type-of($utility) == \"map\" and map-get($utility, rfs) and (map-get($utility, responsive) or $infix == \"\") {\n @include generate-utility($utility, $infix, true);\n }\n }\n }\n }\n}\n\n\n// Print utilities\n@media print {\n @each $key, $utility in $utilities {\n // The utility can be disabled with `false`, thus check if the utility is a map first\n // Then check if the utility needs print styles\n @if type-of($utility) == \"map\" and map-get($utility, print) == true {\n @include generate-utility($utility, \"-print\");\n }\n }\n}\n", - "/*!\n\n=========================================================\n* Soft UI Design System - v1.0.0\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/soft-ui-design-system\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n* Licensed under MIT (site.license)\n\n* Coded by www.creative-tim.com\n\n=========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n\n*/\n\n// {{ site.product.name }} components\n\n// Mixin\n@import \"mixins/mixins\";\n\n// Core Components - extra styling\n@import \"alert\";\n@import \"avatars/avatar\";\n@import \"buttons\";\n@import \"cards\";\n@import \"dropdown\";\n@import \"forms/forms\";\n@import \"footer\";\n@import \"gradients\";\n@import \"header\";\n@import \"info-areas\";\n@import \"misc\";\n@import \"navbar\";\n@import \"nav\";\n@import \"pagination\";\n@import \"popovers\";\n@import \"progress\";\n@import \"typography\";\n@import \"tooltips\";\n@import \"utilities\";\n\n// Plugins\n@import \"vendor/plugins\";\n", + "/*!\n\n=========================================================\n* Soft UI Design System - v1.0.1\n=========================================================\n\n* Product Page: https://www.creative-tim.com/product/soft-ui-design-system\n* Copyright 2021 Creative Tim (https://www.creative-tim.com)\n* Licensed under MIT (site.license)\n\n* Coded by www.creative-tim.com\n\n=========================================================\n\n* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.\n\n*/\n\n// {{ site.product.name }} components\n\n// Mixin\n@import \"mixins/mixins\";\n\n// Core Components - extra styling\n@import \"alert\";\n@import \"avatars/avatar\";\n@import \"buttons\";\n@import \"cards\";\n@import \"dropdown\";\n@import \"forms/forms\";\n@import \"footer\";\n@import \"gradients\";\n@import \"header\";\n@import \"info-areas\";\n@import \"misc\";\n@import \"navbar\";\n@import \"nav\";\n@import \"pagination\";\n@import \"popovers\";\n@import \"progress\";\n@import \"typography\";\n@import \"tooltips\";\n@import \"utilities\";\n\n// Plugins\n@import \"vendor/plugins\";\n", "@import \"hover\";\n", "\n@mixin hover() {\n &:hover { @content; }\n}\n\n@mixin hover-focus() {\n &:hover,\n &:focus {\n @content;\n }\n}\n\n@mixin plain-hover-focus() {\n &,\n &:hover,\n &:focus {\n @content;\n }\n}\n\n@mixin hover-focus-active() {\n &:hover,\n &:focus,\n &:active {\n @content;\n }\n}\n", "@each $state, $value in $theme-gradient-colors {\n .alert-#{$state} {\n @include gradient-directional(nth($value, 1) 0%, darken(nth($value, -1), 8%) 100%, $deg: 310deg);\n }\n}\n", diff --git a/assets/css/soft-design-system.min.css b/assets/css/soft-design-system.min.css index 5ece904e..9c7ea815 100644 --- a/assets/css/soft-design-system.min.css +++ b/assets/css/soft-design-system.min.css @@ -8,7 +8,7 @@ /*! ========================================================= -* Soft UI Design System - v1.0.0 +* Soft UI Design System - v1.0.1 ========================================================= * Product Page: https://www.creative-tim.com/product/soft-ui-design-system diff --git a/assets/js/soft-design-system.js b/assets/js/soft-design-system.js index 6ca82a04..902a7074 100644 --- a/assets/js/soft-design-system.js +++ b/assets/js/soft-design-system.js @@ -1,7 +1,7 @@ /*! ========================================================= -* Soft UI Design System - v1.0.0 +* Soft UI Design System - v1.0.1 ========================================================= * Product Page: https://www.creative-tim.com/product/black-dashboard diff --git a/assets/scss/soft-design-system.scss b/assets/scss/soft-design-system.scss index c4373547..e082a911 100644 --- a/assets/scss/soft-design-system.scss +++ b/assets/scss/soft-design-system.scss @@ -1,5 +1,5 @@ // ========================================================= -// * Soft UI Design System - v1.0.0 +// * Soft UI Design System - v1.0.1 // ========================================================= // // * Product Page: https://www.creative-tim.com/product/soft-ui-design-system diff --git a/assets/scss/soft-design-system/theme.scss b/assets/scss/soft-design-system/theme.scss index daa4605b..f499ccaa 100644 --- a/assets/scss/soft-design-system/theme.scss +++ b/assets/scss/soft-design-system/theme.scss @@ -1,7 +1,7 @@ /*! ========================================================= -* Soft UI Design System - v1.0.0 +* Soft UI Design System - v1.0.1 ========================================================= * Product Page: https://www.creative-tim.com/product/soft-ui-design-system diff --git a/index.html b/index.html index 7ddd6670..bae63b95 100644 --- a/index.html +++ b/index.html @@ -1,6 +1,6 @@ - - - + @@ -43,7 +41,7 @@
- - - - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/sections/attention-catchers/tooltips-popovers.html b/sections/attention-catchers/tooltips-popovers.html index 1be843b5..2b7254bf 100644 --- a/sections/attention-catchers/tooltips-popovers.html +++ b/sections/attention-catchers/tooltips-popovers.html @@ -1,6 +1,6 @@ - - - + @@ -746,7 +744,7 @@

Tooltips & Popovers

-
-
-
- Copy - 
<section class="py-7 mt-3">
-  <div class="container">
-    <div class="row justify-space-between text-center py-2">
-      <div class="col-6 mx-auto">
-        <div class="btn-group" role="group" aria-label="Basic example">
-          <button type="button" class="btn btn-primary">Left</button>
-          <button type="button" class="btn btn-primary">Middle</button>
-          <button type="button" class="btn btn-primary">Right</button>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
- - -
-
-
-
-

Button Groups Outline

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-7 mt-3">
-  <div class="container">
-    <div class="row justify-space-between text-center py-2">
-      <div class="col-6 mx-auto">
-        <div class="btn-group" role="group" aria-label="Basic example">
-          <button type="button" class="btn btn-outline-dark">Left</button>
-          <button type="button" class="btn btn-outline-dark">Middle</button>
-          <button type="button" class="btn btn-outline-dark">Right</button>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Button Groups Checkbox

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-7 mt-3">
-  <div class="container">
-    <div class="row justify-space-between text-center py-2">
-      <div class="col-6 mx-auto">
-        <div class="btn-group" role="group" aria-label="Basic checkbox toggle button group">
-          <input type="checkbox" class="btn-check" id="btncheck1" autocomplete="off">
-          <label class="btn btn-outline-dark" for="btncheck1">Checkbox 1</label>
-
-          <input type="checkbox" class="btn-check" id="btncheck2" autocomplete="off">
-          <label class="btn btn-outline-dark" for="btncheck2">Checkbox 2</label>
-
-          <input type="checkbox" class="btn-check" id="btncheck3" autocomplete="off">
-          <label class="btn btn-outline-dark" for="btncheck3">Checkbox 3</label>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Button Groups Radio

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-7 mt-3">
-  <div class="container">
-    <div class="row justify-space-between text-center py-2">
-      <div class="col-6 mx-auto">
-        <div class="btn-group" role="group" aria-label="Basic radio toggle button group">
-          <input type="radio" class="btn-check" name="btnradio" id="btnradio1" autocomplete="off" checked>
-          <label class="btn btn-outline-dark" for="btnradio1">Radio 1</label>
-
-          <input type="radio" class="btn-check" name="btnradio" id="btnradio2" autocomplete="off">
-          <label class="btn btn-outline-dark" for="btnradio2">Radio 2</label>
-
-          <input type="radio" class="btn-check" name="btnradio" id="btnradio3" autocomplete="off">
-          <label class="btn btn-outline-dark" for="btnradio3">Radio 3</label>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Button Groups Sizing

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-6 mt-2">
-  <div class="container">
-    <div class="row justify-space-between py-2">
-      <div class="col-6 mx-auto">
-        <div class="btn-group btn-group-lg" role="group" aria-label="Basic example">
-          <button type="button" class="btn btn-primary">Left</button>
-          <button type="button" class="btn btn-primary">Middle</button>
-          <button type="button" class="btn btn-primary">Right</button>
-        </div>
-
-        <div class="btn-group" role="group" aria-label="Basic example">
-          <button type="button" class="btn btn-primary">Left</button>
-          <button type="button" class="btn btn-primary">Middle</button>
-          <button type="button" class="btn btn-primary">Right</button>
-        </div>
-
-        <div class="btn-group btn-group-sm" role="group" aria-label="Basic example">
-          <button type="button" class="btn btn-primary">Left</button>
-          <button type="button" class="btn btn-primary">Middle</button>
-          <button type="button" class="btn btn-primary">Right</button>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
- - - - - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/sections/elements/buttons.html b/sections/elements/buttons.html index 9115b999..30f2964b 100644 --- a/sections/elements/buttons.html +++ b/sections/elements/buttons.html @@ -1,6 +1,6 @@ - - - + @@ -749,7 +747,7 @@

Buttons

-
+
@@ -982,7 +980,7 @@

Buttons

- + \ No newline at end of file diff --git a/sections/elements/dropdowns.html b/sections/elements/dropdowns.html index f7ac22e6..d391fec1 100644 --- a/sections/elements/dropdowns.html +++ b/sections/elements/dropdowns.html @@ -1,6 +1,6 @@ - - - + @@ -749,7 +747,7 @@

Dropdowns

- + @@ -799,7 +797,7 @@

Dropdowns

- '> + '>
@@ -928,7 +926,7 @@

Dropdowns

- + \ No newline at end of file diff --git a/sections/elements/progress-bars.html b/sections/elements/progress-bars.html index 0bb16a38..2d74bb15 100644 --- a/sections/elements/progress-bars.html +++ b/sections/elements/progress-bars.html @@ -1,6 +1,6 @@ - - - + @@ -749,7 +747,7 @@

Progress Bars

-
+
@@ -945,7 +943,7 @@

Progress Bars

- + \ No newline at end of file diff --git a/sections/elements/social-buttons.html b/sections/elements/social-buttons.html deleted file mode 100644 index c80f569e..00000000 --- a/sections/elements/social-buttons.html +++ /dev/null @@ -1,1081 +0,0 @@ - - - - - - - - - - - Soft UI Design System by Creative Tim - - - - - - - - - - - - - - - - - - - -
-
-
-
- -

Social Buttons

-
-
-
-
-
-

Social Buttons

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-7">
-  <div class="container">
-    <div class="row justify-space-between text-center py-2">
-      <div class="col-12 mx-auto">
-        <button type="button" class="btn-icon btn btn-facebook">
-          <span class="btn-inner--icon mr-1"><i class="fab fa-facebook"></i></span>
-          <span class="btn-inner--text">Facebook</span>
-        </button>
-        <button type="button" class="btn-icon btn btn-twitter">
-          <span class="btn-inner--icon mr-1"><i class="fab fa-twitter"></i></span>
-          <span class="btn-inner--text">Twitter</span>
-        </button>
-        <button type="button" class="btn-instagram btn-icon btn">
-          <span class="btn-inner--icon mr-1"><i class="fab fa-instagram"></i></span>
-          <span class="btn-inner--text">Instagram</span>
-        </button>
-        <button type="button" class="btn-github btn-icon btn">
-          <span class="btn-inner--icon mr-1"><i class="fab fa-github"></i></span>
-          <span class="btn-inner--text">Github</span>
-        </button>
-        <button type="button" class="btn-icon btn btn-pinterest">
-          <span class="btn-inner--icon mr-1"><i class="fab fa-pinterest"></i></span>
-          <span class="btn-inner--text">Pinterest</span>
-        </button>
-        <button type="button" class="btn-icon btn btn-youtube">
-          <span class="btn-inner--icon"><i class="fab fa-youtube"></i></span>
-          <span class="btn-inner--text">Youtube</span>
-        </button>
-        <button type="button" class="btn btn-vimeo btn-icon">
-          <span class="btn-inner--icon mr-1"><i class="fab fa-vimeo-v"></i></span>
-          <span class="btn-inner--text">Vimeo</span>
-        </button>
-        <button type="button" class="btn-slack btn btn-icon">
-          <span class="btn-inner--icon mr-1"><i class="fab fa-slack"></i></span>
-          <span class="btn-inner--text">Slack</span>
-        </button>
-        <button type="button" class="btn-icon btn btn-dribbble">
-          <span class="btn-inner--icon mr-1"><i class="fab fa-dribbble"></i></span>
-          <span class="btn-inner--text">Dribbble</span>
-        </button>
-        <button type="button" class="btn-icon btn btn-reddit">
-          <span class="btn-inner--icon mr-1"><i class="fab fa-reddit"></i></span>
-          <span class="btn-inner--text">Reddit</span>
-        </button>
-        <button type="button" class="btn-icon btn btn-tumblr">
-          <span class="btn-inner--icon mr-1"><i class="fab fa-tumblr"></i></span>
-          <span class="btn-inner--text">Tumblr</span>
-        </button>
-        <button type="button" class="btn-icon btn btn-linkedin">
-          <span class="btn-inner--icon mr-1"><i class="fab fa-linkedin"></i></span>
-          <span class="btn-inner--text">LinkedIn</span>
-        </button>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Social Buttons Icon Only

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-7 mt-3">
-  <div class="container">
-    <div class="row justify-space-between text-center py-2">
-      <div class="col-12 mx-auto">
-        <button type="button" class="btn btn-icon-only btn-facebook">
-          <span class="btn-inner--icon mr-1"><i class="fab fa-facebook"></i></span>
-        </button>
-        <button type="button" class="btn btn-icon-only btn-twitter">
-          <span class="btn-inner--icon mr-1"><i class="fab fa-twitter"></i></span>
-        </button>
-        <button type="button" class="btn btn-icon-only btn-instagram">
-          <span class="btn-inner--icon mr-1"><i class="fab fa-instagram"></i></span>
-        </button>
-        <button type="button" class="btn btn-icon-only btn-github">
-          <span class="btn-inner--icon mr-1"><i class="fab fa-github"></i></span>
-        </button>
-        <button type="button" class="btn btn-icon-only btn-pinterest">
-          <span class="btn-inner--icon mr-1"><i class="fab fa-pinterest"></i></span>
-        </button>
-        <button type="button" class="btn btn-icon-only btn-youtube">
-          <span class="btn-inner--icon"><i class="fab fa-youtube"></i></span>
-        </button>
-        <button type="button" class="btn btn-icon-only btn-vimeo">
-          <span class="btn-inner--icon mr-1"><i class="fab fa-vimeo-v"></i></span>
-        </button>
-        <button type="button" class="btn btn-icon-only btn-slack">
-          <span class="btn-inner--icon mr-1"><i class="fab fa-slack"></i></span>
-        </button>
-        <button type="button" class="btn btn-icon-only btn-dribbble">
-          <span class="btn-inner--icon mr-1"><i class="fab fa-dribbble"></i></span>
-        </button>
-        <button type="button" class="btn btn-icon-only btn-reddit">
-          <span class="btn-inner--icon mr-1"><i class="fab fa-reddit"></i></span>
-        </button>
-        <button type="button" class="btn btn-icon-only btn-tumblr">
-          <span class="btn-inner--icon mr-1"><i class="fab fa-tumblr"></i></span>
-        </button>
-        <button type="button" class="btn btn-icon-only btn-linkedin">
-          <span class="btn-inner--icon mr-1"><i class="fab fa-linkedin"></i></span>
-        </button>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
- - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/sections/elements/tables.html b/sections/elements/tables.html deleted file mode 100644 index f51d3c6f..00000000 --- a/sections/elements/tables.html +++ /dev/null @@ -1,2115 +0,0 @@ - - - - - - - - - - - Soft UI Design System by Creative Tim - - - - - - - - - - - - - - - - - - - -
-
-
-
- -

Tables

-
-
-
-
-
-

Table 1

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="pt-5">
-  <div class="container">
-    <div class="row justify-content-center">
-      <div class="col-12 text-center">
-        <h2 class="text-gradient text-primary text-center">Compare Features</h2>
-        <p class="lead mb-5">Join the world&#39;s largest developer community</p>
-      </div>
-      <div class="col-lg-10">
-        <div class="table-responsive">
-          <table class="table table-pricing">
-            <thead class="text-light">
-              <tr>
-                <th class="ps-2">
-                  <h6 class="mb-0">Space individual</h6>
-                </th>
-                <th class="text-center">
-                  <h6 class="font-weight-bold">Team</h6>
-                  <h5 class="font-weight-bolder text-darker mb-0">$39</h5>
-                </th>
-                <th class="text-center">
-                  <h6 class="font-weight-bold">Growth</h6>
-                  <h5 class="font-weight-bolder text-darker mb-0">$79</h5>
-                </th>
-                <th class="text-center">
-                  <h6 class="font-weight-bold">Enterprise</h6>
-                  <h5 class="font-weight-bolder text-darker mb-0">$99</h5>
-                </th>
-              </tr>
-            </thead>
-            <tbody>
-              <tr>
-                <td class="py-3">
-                  <span class="text-xs">Community support</span>
-                </td>
-                <td class="text-center py-3">
-                  <i class="fas fa-check text-success text-xs"></i>
-                </td>
-                <td class="text-center py-3">
-                  <i class="fas fa-check text-success text-xs"></i>
-                </td>
-                <td class="text-center py-3">
-                  <i class="fas fa-check text-success text-xs"></i>
-                </td>
-              </tr>
-              <tr>
-                <td class="py-3">
-                    <span class="text-xs">100+ Example Pages</span>
-                </td>
-                <td class="text-center py-3">
-                  <i class="fas fa-check text-success text-xs"></i>
-                </td>
-                <td class="text-center py-3">
-                  <i class="fas fa-check text-success text-xs"></i>
-                </td>
-                <td class="text-center py-3">
-                  <i class="fas fa-check text-success text-xs"></i>
-                </td>
-              </tr>
-              <tr>
-                <td class="py-3">
-                  <span class="text-xs">50+ Section Examples</span>
-                </td>
-                <td class="text-center py-3">
-                  <i class="fas fa-check text-success text-xs"></i>
-                </td>
-                <td class="text-center py-3">
-                  <i class="fas fa-check text-success text-xs"></i>
-                </td>
-                <td class="text-center py-3">
-                  <i class="fas fa-check text-success text-xs"></i>
-                </td>
-              </tr>
-              <tr>
-                <td class="py-3">
-                  <span class="text-xs">Multiple use</span>
-                </td>
-                <td class="text-center py-3">
-
-                </td>
-                <td class="text-center py-3">
-                  <span class="text-xs">
-                    upon request
-                  </span>
-                </td>
-                <td class="text-center py-3">
-                  <span class="text-xs">
-                    upon request
-                  </span>
-                </td>
-              </tr>
-              <tr>
-                <th class="pt-4 pb-2 ps-2">
-                  <h6 class="mb-0">Developer tools</h6>
-                </th>
-                <th></th>
-                <th></th>
-                <th></th>
-              </tr>
-              <tr>
-                <td class="py-3">
-                  <span class="text-xs">Custom messages</span>
-                </td>
-                <td class="text-center py-3">
-                  <i class="fas fa-minus text-secondary text-xs"></i>
-                </td>
-                <td class="text-center py-3">
-                  <i class="fas fa-check text-success text-xs"></i>
-                </td>
-                <td class="text-center py-3">
-                  <i class="fas fa-check text-success text-xs"></i>
-                </td>
-              </tr>
-              <tr>
-                <td class="py-3">
-                  <span class="text-xs">Multiple requests</span>
-                </td>
-                <td class="text-center py-3">
-                  <i class="fas fa-minus text-secondary text-xs"></i>
-                </td>
-                <td class="text-center py-3">
-                  <i class="fas fa-minus text-secondary text-xs"></i>
-                </td>
-                <td class="text-center py-3">
-                  <i class="fas fa-check text-success text-xs"></i>
-                </td>
-              </tr>
-              <tr>
-                <th class="border-bottom-0"></th>
-                <th class="text-center align-items-center border-bottom-0">
-                  <a href="javascript:;" class="btn btn-dark mt-3">Choose Plan</a>
-                </th>
-                <th class="text-center align-items-center border-bottom-0">
-                  <a href="javascript:;" class="btn btn-dark mt-3">Choose Plan</a>
-                </th>
-                <th class="text-center align-items-center border-bottom-0">
-                  <a href="javascript:;" class="btn bg-gradient-primary mt-3">Choose Plan</a>
-                </th>
-              </tr>
-            </tbody>
-          </table>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Table 2

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="pt-5 mt-5">
-  <div class="container">
-    <div class="row justify-content-center">
-      <div class="col-lg-10">
-        <div class="card">
-          <div class="table-responsive">
-            <table class="table align-items-center mb-0">
-              <thead>
-                <tr>
-                  <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">Author</th>
-                  <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2">Function</th>
-                  <th class="text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">Technology</th>
-                  <th class="text-center text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">Employed</th>
-                  <th class="text-secondary opacity-7"></th>
-                </tr>
-              </thead>
-              <tbody>
-                <tr>
-                  <td>
-                    <div class="d-flex px-2 py-1">
-                      <div>
-                        <img src="../../assets/img/team-2.jpg" class="avatar avatar-sm me-3">
-                      </div>
-                      <div class="d-flex flex-column justify-content-center">
-                        <h6 class="mb-0 text-xs">John Michael</h6>
-                        <p class="text-xs text-secondary mb-0">john@creative-tim.com</p>
-                      </div>
-                    </div>
-                  </td>
-                  <td>
-                    <p class="text-xs font-weight-bold mb-0">Manager</p>
-                    <p class="text-xs text-secondary mb-0">Organization</p>
-                  </td>
-                  <td class="align-middle text-center text-sm">
-                    <span class="badge badge-sm badge-success">Online</span>
-                  </td>
-                  <td class="align-middle text-center">
-                    <span class="text-secondary text-xs font-weight-bold">23/04/18</span>
-                  </td>
-                  <td class="align-middle">
-                    <a href="javascript:;" class="text-secondary font-weight-bold text-xs" data-toggle="tooltip" data-original-title="Edit user">
-                      Edit
-                    </a>
-                  </td>
-                </tr>
-
-                <tr>
-                  <td>
-                    <div class="d-flex px-2 py-1">
-                      <div>
-                        <img src="../../assets/img/team-3.jpg" class="avatar avatar-sm me-3">
-                      </div>
-                      <div class="d-flex flex-column justify-content-center">
-                        <h6 class="mb-0 text-xs">Alexa Liras</h6>
-                        <p class="text-xs text-secondary mb-0">alexa@creative-tim.com</p>
-                      </div>
-                    </div>
-                  </td>
-                  <td>
-                    <p class="text-xs font-weight-bold mb-0">Programator</p>
-                    <p class="text-xs text-secondary mb-0">Developer</p>
-                  </td>
-                  <td class="align-middle text-center text-sm">
-                    <span class="badge badge-sm badge-secondary">Offline</span>
-                  </td>
-                  <td class="align-middle text-center">
-                    <span class="text-secondary text-xs font-weight-bold">11/01/19</span>
-                  </td>
-                  <td class="align-middle">
-                    <a href="#!" class="text-secondary font-weight-bold text-xs" data-toggle="tooltip" data-original-title="Edit user">
-                      Edit
-                    </a>
-                  </td>
-                </tr>
-
-                <tr>
-                  <td>
-                    <div class="d-flex px-2 py-1">
-                      <div>
-                        <img src="../../assets/img/team-4.jpg" class="avatar avatar-sm me-3">
-                      </div>
-                      <div class="d-flex flex-column justify-content-center">
-                        <h6 class="mb-0 text-xs">Laurent Perrier</h6>
-                        <p class="text-xs text-secondary mb-0">laurent@creative-tim.com</p>
-                      </div>
-                    </div>
-                  </td>
-                  <td>
-                    <p class="text-xs font-weight-bold mb-0">Executive</p>
-                    <p class="text-xs text-secondary mb-0">Projects</p>
-                  </td>
-                  <td class="align-middle text-center text-sm">
-                    <span class="badge badge-sm badge-success">Online</span>
-                  </td>
-                  <td class="align-middle text-center">
-                    <span class="text-secondary text-xs font-weight-bold">19/09/17</span>
-                  </td>
-                  <td class="align-middle">
-                    <a href="#!" class="text-secondary font-weight-bold text-xs" data-toggle="tooltip" data-original-title="Edit user">
-                      Edit
-                    </a>
-                  </td>
-                </tr>
-
-                <tr>
-                  <td>
-                    <div class="d-flex px-2 py-1">
-                      <div>
-                        <img src="../../assets/img/team-3.jpg" class="avatar avatar-sm me-3">
-                      </div>
-                      <div class="d-flex flex-column justify-content-center">
-                        <h6 class="mb-0 text-xs">Michael Levi</h6>
-                        <p class="text-xs text-secondary mb-0">michael@creative-tim.com</p>
-                      </div>
-                    </div>
-                  </td>
-                  <td>
-                    <p class="text-xs font-weight-bold mb-0">Programator</p>
-                    <p class="text-xs text-secondary mb-0">Developer</p>
-                  </td>
-                  <td class="align-middle text-center text-sm">
-                    <span class="badge badge-sm badge-success">Online</span>
-                  </td>
-                  <td class="align-middle text-center">
-                    <span class="text-secondary text-xs font-weight-bold">24/12/08</span>
-                  </td>
-                  <td class="align-middle">
-                    <a href="#!" class="text-secondary font-weight-bold text-xs" data-toggle="tooltip" data-original-title="Edit user">
-                      Edit
-                    </a>
-                  </td>
-                </tr>
-
-                <tr>
-                  <td>
-                    <div class="d-flex px-2 py-1">
-                      <div>
-                        <img src="../../assets/img/team-2.jpg" class="avatar avatar-sm me-3">
-                      </div>
-                      <div class="d-flex flex-column justify-content-center">
-                        <h6 class="mb-0 text-xs">Richard Gran</h6>
-                        <p class="text-xs text-secondary mb-0">richard@creative-tim.com</p>
-                      </div>
-                    </div>
-                  </td>
-                  <td>
-                    <p class="text-xs font-weight-bold mb-0">Manager</p>
-                    <p class="text-xs text-secondary mb-0">Executive</p>
-                  </td>
-                  <td class="align-middle text-center text-sm">
-                    <span class="badge badge-sm badge-secondary">Offline</span>
-                  </td>
-                  <td class="align-middle text-center">
-                    <span class="text-secondary text-xs font-weight-bold">04/10/21</span>
-                  </td>
-                  <td class="align-middle">
-                    <a href="#!" class="text-secondary font-weight-bold text-xs" data-toggle="tooltip" data-original-title="Edit user">
-                      Edit
-                    </a>
-                  </td>
-                </tr>
-
-                <tr>
-                  <td>
-                    <div class="d-flex px-2 py-1">
-                      <div>
-                        <img src="../../assets/img/team-4.jpg" class="avatar avatar-sm me-3">
-                      </div>
-                      <div class="d-flex flex-column justify-content-center">
-                        <h6 class="mb-0 text-xs">Miriam Eric</h6>
-                        <p class="text-xs text-secondary mb-0">miriam@creative-tim.com</p>
-                      </div>
-                    </div>
-                  </td>
-                  <td>
-                    <p class="text-xs font-weight-bold mb-0">Programtor</p>
-                    <p class="text-xs text-secondary mb-0">Developer</p>
-                  </td>
-                  <td class="align-middle text-center text-sm">
-                    <span class="badge badge-sm badge-secondary">Offline</span>
-                  </td>
-                  <td class="align-middle text-center">
-                    <span class="text-secondary text-xs font-weight-bold">14/09/20</span>
-                  </td>
-                  <td class="align-middle">
-                    <a href="#!" class="text-secondary font-weight-bold text-xs" data-toggle="tooltip" data-original-title="Edit user">
-                      Edit
-                    </a>
-                  </td>
-                </tr>
-              </tbody>
-            </table>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Table 3

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="pt-5 mt-5">
-  <div class="container">
-    <div class="row justify-content-center">
-      <div class="col-lg-10">
-        <div class="card">
-          <div class="table-responsive">
-            <table class="table align-items-center mb-0">
-              <thead>
-                <tr>
-                  <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7">Project</th>
-                  <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2">Budget</th>
-                  <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2">Status</th>
-                  <th class="text-uppercase text-secondary text-xxs font-weight-bolder opacity-7 ps-2">Completion</th>
-                  <th></th>
-                </tr>
-              </thead>
-              <tbody>
-                <tr>
-                  <td>
-                    <div class="d-flex px-2">
-                      <div>
-                        <img src="../../assets/img/logos/small-logos/logo-spotify.svg" class="avatar avatar-sm rounded-circle me-2">
-                      </div>
-                      <div class="my-auto">
-                        <h6 class="mb-0 text-xs">Spotify</h6>
-                      </div>
-                    </div>
-                  </td>
-                  <td>
-                    <p class="text-xs font-weight-bold mb-0">$2,500</p>
-                  </td>
-                  <td>
-                    <span class="badge badge-dot me-4">
-                      <i class="bg-info"></i>
-                      <span class="text-dark text-xs">working</span>
-                    </span>
-                  </td>
-                  <td class="align-middle text-center">
-                    <div class="d-flex align-items-center">
-                      <span class="me-2 text-xs">60%</span>
-                      <div>
-                        <div class="progress">
-                          <div class="progress-bar bg-info" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"></div>
-                        </div>
-                      </div>
-                    </div>
-                  </td>
-
-                  <td class="align-middle">
-                    <button class="btn btn-link text-secondary mb-0">
-                      <i class="fa fa-ellipsis-v text-xs"></i>
-                    </button>
-                  </td>
-                </tr>
-
-                <tr>
-                  <td>
-                    <div class="d-flex px-2">
-                      <div>
-                        <img src="../../assets/img/logos/small-logos/logo-invision.svg" class="avatar avatar-sm rounded-circle me-2">
-                      </div>
-                      <div class="my-auto">
-                        <h6 class="mb-0 text-xs">Invision</h6>
-                      </div>
-                    </div>
-                  </td>
-                  <td>
-                    <p class="text-xs font-weight-bold mb-0">$5,000</p>
-                  </td>
-                  <td>
-                    <span class="badge badge-dot me-4">
-                      <i class="bg-success"></i>
-                      <span class="text-dark text-xs">done</span>
-                    </span>
-                  </td>
-                  <td class="align-middle text-center">
-                    <div class="d-flex align-items-center">
-                      <span class="me-2 text-xs">100%</span>
-                      <div>
-                        <div class="progress">
-                          <div class="progress-bar bg-success" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: 100%;"></div>
-                        </div>
-                      </div>
-                    </div>
-                  </td>
-
-                  <td class="align-middle">
-                    <button class="btn btn-link text-secondary mb-0" aria-haspopup="true" aria-expanded="false">
-                      <i class="fa fa-ellipsis-v text-xs"></i>
-                    </button>
-                  </td>
-                </tr>
-
-                <tr>
-                  <td>
-                    <div class="d-flex px-2">
-                      <div>
-                        <img src="../../assets/img/logos/small-logos/logo-jira.svg" class="avatar avatar-sm rounded-circle me-2">
-                      </div>
-                      <div class="my-auto">
-                        <h6 class="mb-0 text-xs">Jira</h6>
-                      </div>
-                    </div>
-                  </td>
-                  <td>
-                    <p class="text-xs font-weight-bold mb-0">$3,400</p>
-                  </td>
-                  <td>
-                    <span class="badge badge-dot me-4">
-                      <i class="bg-danger"></i>
-                      <span class="text-dark text-xs">canceled</span>
-                    </span>
-                  </td>
-                  <td class="align-middle text-center">
-                    <div class="d-flex align-items-center">
-                      <span class="me-2 text-xs">30%</span>
-                      <div>
-                        <div class="progress">
-                          <div class="progress-bar bg-danger" role="progressbar" aria-valuenow="30" aria-valuemin="0" aria-valuemax="30" style="width: 30%;"></div>
-                        </div>
-                      </div>
-                    </div>
-                  </td>
-
-                  <td class="align-middle">
-                    <button class="btn btn-link text-secondary mb-0" aria-haspopup="true" aria-expanded="false">
-                      <i class="fa fa-ellipsis-v text-xs"></i>
-                    </button>
-                  </td>
-                </tr>
-
-                <tr>
-                  <td>
-                    <div class="d-flex px-2">
-                      <div>
-                        <img src="../../assets/img/logos/small-logos/logo-slack.svg" class="avatar avatar-sm rounded-circle me-2">
-                      </div>
-                      <div class="my-auto">
-                        <h6 class="mb-0 text-xs">Slack</h6>
-                      </div>
-                    </div>
-                  </td>
-                  <td>
-                    <p class="text-xs font-weight-bold mb-0">$1,000</p>
-                  </td>
-                  <td>
-                    <span class="badge badge-dot me-4">
-                      <i class="bg-danger"></i>
-                      <span class="text-dark text-xs">canceled</span>
-                    </span>
-                  </td>
-                  <td class="align-middle text-center">
-                    <div class="d-flex align-items-center">
-                      <span class="me-2 text-xs">0%</span>
-                      <div>
-                        <div class="progress">
-                          <div class="progress-bar bg-success" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="0" style="width: 0%;"></div>
-                        </div>
-                      </div>
-                    </div>
-                  </td>
-
-                  <td class="align-middle">
-                    <button class="btn btn-link text-secondary mb-0" aria-haspopup="true" aria-expanded="false">
-                      <i class="fa fa-ellipsis-v text-xs"></i>
-                    </button>
-                  </td>
-                </tr>
-
-                <tr>
-                  <td>
-                    <div class="d-flex px-2">
-                      <div>
-                        <img src="../../assets/img/logos/small-logos/logo-webdev.svg" class="avatar avatar-sm rounded-circle me-2">
-                      </div>
-                      <div class="my-auto">
-                        <h6 class="mb-0 text-xs">Webdev</h6>
-                      </div>
-                    </div>
-                  </td>
-                  <td>
-                    <p class="text-xs font-weight-bold mb-0">$14,000</p>
-                  </td>
-                  <td>
-                    <span class="badge badge-dot me-4">
-                      <i class="bg-info"></i>
-                      <span class="text-dark text-xs">working</span>
-                    </span>
-                  </td>
-                  <td class="align-middle text-center">
-                    <div class="d-flex align-items-center">
-                      <span class="me-2 text-xs">80%</span>
-                      <div>
-                        <div class="progress">
-                          <div class="progress-bar bg-info" role="progressbar" aria-valuenow="80" aria-valuemin="0" aria-valuemax="80" style="width: 80%;"></div>
-                        </div>
-                      </div>
-                    </div>
-                  </td>
-
-                  <td class="align-middle">
-                    <button class="btn btn-link text-secondary mb-0" aria-haspopup="true" aria-expanded="false">
-                      <i class="fa fa-ellipsis-v text-xs"></i>
-                    </button>
-                  </td>
-                </tr>
-
-                <tr>
-                  <td>
-                    <div class="d-flex px-2">
-                      <div>
-                        <img src="../../assets/img/logos/small-logos/logo-xd.svg" class="avatar avatar-sm rounded-circle me-2">
-                      </div>
-                      <div class="my-auto">
-                        <h6 class="mb-0 text-xs">Adobe XD</h6>
-                      </div>
-                    </div>
-                  </td>
-                  <td>
-                    <p class="text-xs font-weight-bold mb-0">$2,300</p>
-                  </td>
-                  <td>
-                    <span class="badge badge-dot me-4">
-                      <i class="bg-success"></i>
-                      <span class="text-dark text-xs">done</span>
-                    </span>
-                  </td>
-                  <td class="align-middle text-center">
-                    <div class="d-flex align-items-center">
-                      <span class="me-2 text-xs">100%</span>
-                      <div>
-                        <div class="progress">
-                          <div class="progress-bar bg-success" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: 100%;"></div>
-                        </div>
-                      </div>
-                    </div>
-                  </td>
-
-                  <td class="align-middle">
-                    <button class="btn btn-link text-secondary mb-0" aria-haspopup="true" aria-expanded="false">
-                      <i class="fa fa-ellipsis-v text-xs"></i>
-                    </button>
-                  </td>
-                </tr>
-
-              </tbody>
-            </table>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
- - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/sections/elements/toggles.html b/sections/elements/toggles.html index e7c71def..085bbfdc 100644 --- a/sections/elements/toggles.html +++ b/sections/elements/toggles.html @@ -1,6 +1,6 @@ - - - + @@ -919,7 +917,7 @@

Toggles

- + \ No newline at end of file diff --git a/sections/elements/typography.html b/sections/elements/typography.html index c96d0ae6..85187f8e 100644 --- a/sections/elements/typography.html +++ b/sections/elements/typography.html @@ -1,6 +1,6 @@ - - - + @@ -749,7 +747,7 @@

Typography

-
+

Typography - Font Family Serif @@ -1097,7 +1095,7 @@

H6 Soft Design System
- + \ No newline at end of file diff --git a/sections/input-areas/contact-sections.html b/sections/input-areas/contact-sections.html deleted file mode 100644 index 0feb52a8..00000000 --- a/sections/input-areas/contact-sections.html +++ /dev/null @@ -1,2613 +0,0 @@ - - - - - - - - - - - Soft UI Design System by Creative Tim - - - - - - - - - - - - - - - - - - - -
-
-
-
- -

Contact Sections

-
-
-
-
-
-

Contact us 1

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-5">
-  <div class="container">
-    <div class="row align-items-center">
-      <div class="col-lg-8 mx-auto text-center">
-        <div class="ms-3 mb-md-5">
-          <div class="icon icon-shape bg-gradient-info shadow text-center mb-4">
-            <i class="fas fa-user"></i>
-          </div>
-          <h3>Contact us</h3>
-          <p>
-            For further questions, including partnership opportunities, please email hello@creative-tim.com
-            or contact using our contact form.
-          </p>
-        </div>
-      </div>
-    </div>
-    <div class="row">
-      <div class="col-lg-8 mx-auto">
-        <div class="card card-plain">
-          <form role="form" id="contact-form" method="post" autocomplete="off">
-            <div class="card-body">
-              <div class="row">
-                <div class="col-md-6">
-                  <label>First Name</label>
-                  <div class="input-group mb-4">
-                    <input class="form-control" placeholder="eg. Michael" aria-label="First Name..." type="text">
-                  </div>
-                </div>
-                <div class="col-md-6 ps-2">
-                  <label>Last Name</label>
-                  <div class="input-group">
-                    <input type="text" class="form-control" placeholder="eg. Jordan" aria-label="Last Name...">
-                  </div>
-                </div>
-              </div>
-              <div class="mb-4">
-                <label>Company</label>
-                <div class="input-group">
-                  <input type="text" class="form-control" placeholder="eg. Apple Inc.">
-                </div>
-              </div>
-              <div class="mb-4">
-                <label>Email Address</label>
-                <div class="input-group">
-                  <input type="email" class="form-control" placeholder="eg. michael@creative-tim.com">
-                </div>
-              </div>
-              <div class="mb-4">
-                <label>Phone Number</label>
-                <div class="input-group mb-3">
-                  <select class="input-group-text" id="inputGroupSelect01">
-                    <option selected>RU</option>
-                    <option value="1">EN</option>
-                    <option value="2">US</option>
-                    <option value="3">AR</option>
-                  </select>
-                  <input type="number" class="form-control ps-3" aria-label="Phone Number" placeholder="+(1111) 32322 11">
-                </div>
-              </div>
-              <div class="form-group mb-4">
-                <label>Your message</label>
-                <textarea name="message" class="form-control" placeholder="Type here" id="message" rows="6"></textarea>
-              </div>
-              <div class="row">
-                <div class="col-md-6">
-                  <div class="form-check form-switch mb-4">
-                    <input class="form-check-input" type="checkbox" id="flexSwitchCheckDefault" checked="">
-                    <label class="form-check-label" for="flexSwitchCheckDefault">I agree to the <a href="javascript:;" class="text-dark"><u>Terms and Conditions</u></a>.</label>
-                  </div>
-                </div>
-                <div class="col-md-12">
-                  <button type="submit" class="btn bg-gradient-info w-100">Send Message</button>
-                </div>
-              </div>
-            </div>
-          </form>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Contact us 2

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-10 bg-gradient-dark position-relative overflow-hidden">
-  <img src="../../assets/img/shapes/waves-white.svg" alt="pattern-lines" class="position-absolute start-0 top-0 h-100 z-index-1 opacity-6">
-  <div class="position-absolute w-100 z-inde-1 top-0 mt-n3">
-    <svg width="100%" viewBox="0 -2 1920 157" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-        <title>wave-down</title>
-        <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-            <g id="Artboard" fill="#FFFFFF" fill-rule="nonzero">
-                <g id="wave-down">
-                    <path d="M0,60.8320331 C299.333333,115.127115 618.333333,111.165365 959,47.8320321 C1299.66667,-15.5013009 1620.66667,-15.2062179 1920,47.8320331 L1920,156.389409 L0,156.389409 L0,60.8320331 Z" id="Path-Copy-2" transform="translate(960.000000, 78.416017) rotate(180.000000) translate(-960.000000, -78.416017) "></path>
-                </g>
-            </g>
-        </g>
-    </svg>
-  </div>
-  <div class="container position-relative z-index-1">
-    <div class="row">
-      <div class="col-lg-6 col-md-12 d-flex justify-content-center flex-column">
-        <h2 class="text-white">Get in Touch</h2>
-        <p class="lead pe-5 text-white opacity-8 z-index-1">You need more information? Check what other persons are saying about our product. They are very happy with their purchase.</p>
-        <p class="mt-4 text-white opacity-8 z-index-1">730 Dyonisie Wolf <br> Bucharest, RO 010458</p>
-        <div class="d-flex p-2 text-white opacity-8">
-          <div>
-            <i class="fas fa-phone text-sm"></i>
-          </div>
-          <div class="ps-3">
-            <span class="text-sm">(+40) 772 100 200</span>
-          </div>
-        </div>
-        <div class="d-flex p-2 text-white opacity-8">
-          <div>
-            <i class="fas fa-envelope text-sm"></i>
-          </div>
-          <div class="ps-3">
-            <span class="text-sm">hello@creative-tim.com</span>
-          </div>
-        </div>
-        <div class="d-flex p-2 text-white opacity-8">
-          <div>
-            <i class="fas fa-ticket-alt text-sm"></i>
-          </div>
-          <div class="ps-3">
-            <span class="text-sm">Open Support Ticket</span>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-6">
-        <div class="card mt-5 mt-lg-0">
-          <form role="form" id="contact-form" method="post" autocomplete="off">
-            <div class="card-body">
-              <div class="row">
-                <div class="col-md-6">
-                  <label>First name</label>
-                  <div class="input-group mb-4">
-                    <input class="form-control" placeholder="eg. William" aria-label="First Name..." type="text">
-                  </div>
-                </div>
-                <div class="col-md-6 ps-2">
-                  <label>Last name</label>
-                  <div class="input-group mb-4">
-                    <input type="text" class="form-control" placeholder="eg. Smith" aria-label="Last Name...">
-                  </div>
-                </div>
-              </div>
-              <div>
-                <label>Email address</label>
-                <div class="input-group">
-                  <input type="email" class="form-control" placeholder="will@creative-tim.com">
-                </div>
-              </div>
-              <div class="form-group mt-4">
-                <label>Your message</label>
-                <textarea name="message" class="form-control" placeholder="Type here" id="message" rows="3"></textarea>
-              </div>
-              <div class="row">
-                <div class="col-md-8">
-                  <div class="form-check form-switch mb-2">
-                    <input class="form-check-input" type="checkbox" id="flexSwitchCheckDefault" checked="">
-                    <label class="form-check-label" for="flexSwitchCheckDefault">I agree to the <a href="javascript:;" class="text-dark text-underline">Terms and Conditions</a>.</label>
-                  </div>
-                </div>
-                <div class="col-md-12">
-                  <button type="submit" class="btn bg-gradient-info mt-3">Submit</button>
-                </div>
-              </div>
-            </div>
-          </form>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div class="position-absolute w-100 bottom-0">
-    <svg width="100%" viewBox="0 -1 1920 166" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-        <title>wave-up</title>
-        <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-            <g id="Artboard" transform="translate(0.000000, 5.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                <g id="wave-up" transform="translate(0.000000, -5.000000)">
-                    <path d="M0,70 C298.666667,105.333333 618.666667,95 960,39 C1301.33333,-17 1621.33333,-11.3333333 1920,56 L1920,165 L0,165 L0,70 Z" id="Path"></path>
-                </g>
-            </g>
-        </g>
-    </svg>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Contact us 3

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-7 bg-cover position-relative" style="background-image: url(&#39;../../assets/img/curved-images/curved1.jpg&#39;)">
-  <div class="mask bg-gradient-dark"></div>
-  <div class="container position-relative z-index-2">
-    <div class="row">
-      <div class="col-lg-5 my-auto">
-        <h2 class="text-white">Get in Touch</h2>
-        <p class="text-white text-lg mb-lg-5">You need more information? Check what other persons are saying about our product. They are very happy with their purchase.</p>
-        <div class="p-3 d-flex">
-          <div class="icon">
-            <svg width="30px" height="35px" viewBox="0 0 45 44" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-              <title>map-big</title>
-              <g id="Basic-Elements" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                <g id="Rounded-Icons" transform="translate(-2321.000000, -593.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                  <g id="Icons-with-opacity" transform="translate(1716.000000, 291.000000)">
-                    <g id="map-big" transform="translate(605.000000, 302.000000)">
-                      <polygon id="Path" points="31.875 0.71625 24.375 4.46625 24.375 40.53375 31.875 36.78375"></polygon>
-                      <polygon id="Path" points="20.625 4.46625 13.125 0.71625 13.125 36.78375 20.625 40.53375"></polygon>
-                      <path d="M9.375,0.81375 L0.909375,5.893125 C0.346875,6.230625 0,6.84 0,7.5 L0,43.125 L9.375,37.06125 L9.375,0.81375 Z" id="Path" opacity="0.70186942"></path>
-                      <path d="M44.090625,5.893125 L35.625,0.81375 L35.625,37.06125 L45,43.125 L45,7.5 C45,6.84 44.653125,6.230625 44.090625,5.893125 Z" id="Path" opacity="0.70186942"></path>
-                    </g>
-                  </g>
-                </g>
-              </g>
-            </svg>
-          </div>
-          <div class="ms-5">
-            <h5 class="text-white">Find us at the office</h5>
-            <p class="text-white text-sm"> Bld Mihail Kogalniceanu, nr. 8,<br>
-              7652 Bucharest,<br>
-              Romania
-            </p>
-          </div>
-        </div>
-        <div class="p-3 d-flex">
-          <div class="icon">
-            <?xml version="1.0" encoding="UTF-8"?>
-            <svg width="30px" height="35px" viewBox="0 0 42 44" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-              <title>time-alarm</title>
-              <g id="Basic-Elements" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                <g id="Rounded-Icons" transform="translate(-2319.000000, -440.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                  <g id="Icons-with-opacity" transform="translate(1716.000000, 291.000000)">
-                    <g id="time-alarm" transform="translate(603.000000, 149.000000)">
-                      <path
-                        d="M18.8086957,4.70034783 C15.3814926,0.343541521 9.0713063,-0.410050841 4.7145,3.01715217 C0.357693695,6.44435519 -0.395898667,12.7545415 3.03130435,17.1113478 C5.53738466,10.3360568 11.6337901,5.54042955 18.8086957,4.70034783 L18.8086957,4.70034783 Z"
-                        id="Path" opacity="0.6"></path>
-                      <path
-                        d="M38.9686957,17.1113478 C42.3958987,12.7545415 41.6423063,6.44435519 37.2855,3.01715217 C32.9286937,-0.410050841 26.6185074,0.343541521 23.1913043,4.70034783 C30.3662099,5.54042955 36.4626153,10.3360568 38.9686957,17.1113478 Z"
-                        id="Path" opacity="0.6"></path>
-                      <path
-                        d="M34.3815652,34.7668696 C40.2057958,27.7073059 39.5440671,17.3375603 32.869743,11.0755718 C26.1954189,4.81358341 15.8045811,4.81358341 9.13025701,11.0755718 C2.45593289,17.3375603 1.79420418,27.7073059 7.61843478,34.7668696 L3.9753913,40.0506522 C3.58549114,40.5871271 3.51710058,41.2928217 3.79673036,41.8941824 C4.07636014,42.4955431 4.66004722,42.8980248 5.32153275,42.9456105 C5.98301828,42.9931963 6.61830436,42.6784048 6.98113043,42.1232609 L10.2744783,37.3434783 C16.5555112,42.3298213 25.4444888,42.3298213 31.7255217,37.3434783 L35.0188696,42.1196087 C35.6014207,42.9211577 36.7169135,43.1118605 37.53266,42.5493622 C38.3484064,41.9868639 38.5667083,40.8764423 38.0246087,40.047 L34.3815652,34.7668696 Z M30.1304348,25.5652174 L21,25.5652174 C20.49574,25.5652174 20.0869565,25.1564339 20.0869565,24.6521739 L20.0869565,15.5217391 C20.0869565,15.0174791 20.49574,14.6086957 21,14.6086957 C21.50426,14.6086957 21.9130435,15.0174791 21.9130435,15.5217391 L21.9130435,23.7391304 L30.1304348,23.7391304 C30.6346948,23.7391304 31.0434783,24.1479139 31.0434783,24.6521739 C31.0434783,25.1564339 30.6346948,25.5652174 30.1304348,25.5652174 Z"
-                        id="Shape"></path>
-                    </g>
-                  </g>
-                </g>
-              </g>
-            </svg>
-          </div>
-          <div class="ms-5">
-            <h5 class="text-white">Give us a ring</h5>
-            <p class="text-white text-sm"> Michael Jordan<br>
-              +40 762 321 762<br>
-              Mon - Fri, 8:00-22:00
-            </p>
-          </div>
-        </div>
-
-      </div>
-      <div class="col-lg-5 m-auto">
-        <div class="card card-contact card-raised">
-          <form role="form" id="contact-form1" method="post">
-            <div class="card-header text-center pt-4">
-              <h5 class="card-title text-primary text-gradient">Contact Us</h5>
-            </div>
-            <div class="card-body">
-              <div class="row">
-                <div class="col-md-6 pe-2">
-                  <label>First name</label>
-                  <div class="input-group input-group-sm mb-4">
-                    <span class="input-group-text"><i class="fas fa-user text-secondary"></i></span>
-                    <input class="form-control" placeholder="First Name" type="text" >
-                  </div>
-                </div>
-                <div class="col-md-6 ps-2">
-                  <div class="form-group">
-                    <label>Last name</label>
-                    <div class="input-group input-group-sm mb-4">
-                      <span class="input-group-text"><i class="far fa-user text-secondary"></i></span>
-                      <input class="form-control" placeholder="Last Name" type="text" >
-                    </div>
-                  </div>
-                </div>
-              </div>
-              <div class="form-group">
-                <label>Email address</label>
-                <div class="input-group input-group-sm mb-4">
-                  <span class="input-group-text"><i class="ni ni-email-83 text-secondary"></i></span>
-                  <input class="form-control" placeholder="Email" type="email" >
-                </div>
-              </div>
-              <div class="form-group">
-                <label>Your message</label>
-                <textarea name="message" class="form-control form-control-sm" placeholder="Type here" id="message" rows="6"></textarea>
-              </div>
-
-              <div class="row">
-                <div class="col-md-6 text-right my-auto ms-auto">
-                  <button type="submit" class="btn btn-primary btn-round bg-gradient-primary mb-0">Send Message</button>
-                </div>
-              </div>
-            </div>
-          </form>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Contact us 4

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-7 bg-white position-relative">
-  <div class="page-header section-height-50 m-3 border-radius-xl" style="background-image: url(&#39;../../assets/img/curved-images/curved8.jpg&#39;);">
-    <span class="mask bg-gradient-dark opacity-4"></span>
-    <div class="container">
-      <div class="row justify-content-center">
-        <div class="col-lg-6 text-center mx-auto">
-          <h1 class="text-white mt-4 mb-1">Got a question?</h1>
-          <p class="lead text-white mb-6">We&#39;d like to talk more about what you need</p>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div class="container">
-    <div class="row mt-n7 blur border-radius-lg shadow-blur">
-      <div class="col-lg-3 col-md-6 col-6 position-relative my-auto">
-        <div class="p-3 text-center">
-          <div class="icon icon-shape bg-gradient-primary shadow text-center rounded-circle">
-            <svg class="mt-3" width="15px" height="15px" viewBox="0 0 45 44" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                <title>map-big</title>
-                <g id="Basic-Elements" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                    <g id="Rounded-Icons" transform="translate(-2321.000000, -593.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                        <g id="Icons-with-opacity" transform="translate(1716.000000, 291.000000)">
-                            <g id="map-big" transform="translate(605.000000, 302.000000)">
-                                <polygon id="Path" points="31.875 0.71625 24.375 4.46625 24.375 40.53375 31.875 36.78375"></polygon>
-                                <polygon id="Path" points="20.625 4.46625 13.125 0.71625 13.125 36.78375 20.625 40.53375"></polygon>
-                                <path d="M9.375,0.81375 L0.909375,5.893125 C0.346875,6.230625 0,6.84 0,7.5 L0,43.125 L9.375,37.06125 L9.375,0.81375 Z" id="Path" opacity="0.70186942"></path>
-                                <path d="M44.090625,5.893125 L35.625,0.81375 L35.625,37.06125 L45,43.125 L45,7.5 C45,6.84 44.653125,6.230625 44.090625,5.893125 Z" id="Path" opacity="0.70186942"></path>
-                            </g>
-                        </g>
-                    </g>
-                </g>
-            </svg>
-          </div>
-          <h5 class="mt-3 mb-1">Address</h5>
-          <p class="mb-0">12124 First Street, nr 54</p>
-          <hr class="vertical dark">
-        </div>
-      </div>
-      <div class="col-lg-3 col-md-6 col-6 position-relative my-auto">
-        <div class="p-3 text-center">
-          <div class="icon icon-shape bg-gradient-primary shadow text-center rounded-circle">
-            <svg class="mt-3" width="15px" height="15px" viewBox="0 0 40 44" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                <title>document</title>
-                <g id="Basic-Elements" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                    <g id="Rounded-Icons" transform="translate(-1870.000000, -591.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                        <g id="Icons-with-opacity" transform="translate(1716.000000, 291.000000)">
-                            <g id="document" transform="translate(154.000000, 300.000000)">
-                                <path d="M40,40 L36.3636364,40 L36.3636364,3.63636364 L5.45454545,3.63636364 L5.45454545,0 L38.1818182,0 C39.1854545,0 40,0.814545455 40,1.81818182 L40,40 Z" id="Path" opacity="0.603585379"></path>
-                                <path d="M30.9090909,7.27272727 L1.81818182,7.27272727 C0.814545455,7.27272727 0,8.08727273 0,9.09090909 L0,41.8181818 C0,42.8218182 0.814545455,43.6363636 1.81818182,43.6363636 L30.9090909,43.6363636 C31.9127273,43.6363636 32.7272727,42.8218182 32.7272727,41.8181818 L32.7272727,9.09090909 C32.7272727,8.08727273 31.9127273,7.27272727 30.9090909,7.27272727 Z M18.1818182,34.5454545 L7.27272727,34.5454545 L7.27272727,30.9090909 L18.1818182,30.9090909 L18.1818182,34.5454545 Z M25.4545455,27.2727273 L7.27272727,27.2727273 L7.27272727,23.6363636 L25.4545455,23.6363636 L25.4545455,27.2727273 Z M25.4545455,20 L7.27272727,20 L7.27272727,16.3636364 L25.4545455,16.3636364 L25.4545455,20 Z" id="Shape"></path>
-                            </g>
-                        </g>
-                    </g>
-                </g>
-            </svg>
-          </div>
-          <h5 class="mt-3 mb-1">Email</h5>
-          <p class="mb-0">hello@creative-tim.com</p>
-        </div>
-        <hr class="vertical dark">
-      </div>
-      <div class="col-lg-3 col-md-6 col-6 position-relative my-auto">
-        <div class="p-3 text-center">
-          <div class="icon icon-shape bg-gradient-primary shadow text-center rounded-circle">
-            <svg class="mt-3" width="15px" height="15px" viewBox="0 0 44 43" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                <title>megaphone</title>
-                <g id="Basic-Elements" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                    <g id="Rounded-Icons" transform="translate(-2168.000000, -591.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                        <g id="Icons-with-opacity" transform="translate(1716.000000, 291.000000)">
-                            <g id="megaphone" transform="translate(452.000000, 300.000000)">
-                              <path d="M35.7958333,0.273166667 C35.2558424,-0.0603712374 34.5817509,-0.0908856664 34.0138333,0.1925 L19.734,7.33333333 L9.16666667,7.33333333 C4.10405646,7.33333333 0,11.4373898 0,16.5 C0,21.5626102 4.10405646,25.6666667 9.16666667,25.6666667 L19.734,25.6666667 L34.0138333,32.8166667 C34.5837412,33.1014624 35.2606401,33.0699651 35.8016385,32.7334768 C36.3426368,32.3969885 36.6701539,31.8037627 36.6666942,31.1666667 L36.6666942,1.83333333 C36.6666942,1.19744715 36.3370375,0.607006911 35.7958333,0.273166667 Z" id="Path"></path>
-                              <path d="M38.5,11 L38.5,22 C41.5375661,22 44,19.5375661 44,16.5 C44,13.4624339 41.5375661,11 38.5,11 Z" id="Path" opacity="0.601050967"></path>
-                              <path d="M18.5936667,29.3333333 L10.6571667,29.3333333 L14.9361667,39.864 C15.7423448,41.6604248 17.8234451,42.4993948 19.6501416,41.764381 C21.4768381,41.0293672 22.3968823,38.982817 21.7341667,37.1286667 L18.5936667,29.3333333 Z" id="Path" opacity="0.601050967"></path>
-                            </g>
-                        </g>
-                    </g>
-                </g>
-            </svg>
-          </div>
-          <h5 class="mt-3 mb-1">Phone</h5>
-          <p class="mb-0">+1(424) 535 3523</p>
-        </div>
-        <hr class="vertical dark">
-      </div>
-      <div class="col-lg-3 col-md-6 col-6 position-relative my-auto">
-        <div class="p-3 text-center">
-          <div class="icon icon-shape bg-gradient-primary shadow text-center rounded-circle">
-            <svg class="mt-3" width="15px" height="15px" viewBox="0 0 40 40" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                <title>ungroup</title>
-                <g id="Basic-Elements" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                    <g id="Rounded-Icons" transform="translate(-2170.000000, -442.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                        <g id="Icons-with-opacity" transform="translate(1716.000000, 291.000000)">
-                            <g id="ungroup" transform="translate(454.000000, 151.000000)">
-                                <path d="M38.1818182,10.9090909 L32.7272727,10.9090909 L32.7272727,30.9090909 C32.7272727,31.9127273 31.9127273,32.7272727 30.9090909,32.7272727 L10.9090909,32.7272727 L10.9090909,38.1818182 C10.9090909,39.1854545 11.7236364,40 12.7272727,40 L38.1818182,40 C39.1854545,40 40,39.1854545 40,38.1818182 L40,12.7272727 C40,11.7236364 39.1854545,10.9090909 38.1818182,10.9090909 Z" id="Path" opacity="0.6"></path>
-                                <path d="M27.2727273,29.0909091 L1.81818182,29.0909091 C0.812727273,29.0909091 0,28.2781818 0,27.2727273 L0,1.81818182 C0,0.814545455 0.812727273,0 1.81818182,0 L27.2727273,0 C28.2781818,0 29.0909091,0.814545455 29.0909091,1.81818182 L29.0909091,27.2727273 C29.0909091,28.2781818 28.2781818,29.0909091 27.2727273,29.0909091 Z" id="Path"></path>
-                            </g>
-                        </g>
-                    </g>
-                </g>
-            </svg>
-          </div>
-          <h5 class="mt-3 mb-1">Contact</h5>
-          <p class="mb-0">Andrew Samian</p>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Contact us 5

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-7">
-  <div class="container">
-    <div class="row align-items-center">
-      <div class="col-lg-8 mx-auto text-center">
-        <div class="ms-3 mb-md-5">
-          <h3>Contact us</h3>
-          <p>
-            For further questions, including partnership opportunities, please email hello@creative-tim.com
-            or contact using our contact form.
-          </p>
-        </div>
-      </div>
-    </div>
-    <div class="row">
-      <div class="col-lg-8 mx-auto">
-        <div class="card card-plain">
-          <form role="form" id="contact-form" method="post" autocomplete="off">
-            <div class="card-body">
-              <div class="row">
-                <div class="col-md-6">
-                  <label>Full Name</label>
-                  <div class="input-group mb-4">
-                    <input class="form-control" placeholder="Full Name" aria-label="Full Name" type="text">
-                  </div>
-                </div>
-                <div class="col-md-6 ps-md-2">
-                  <label>Email</label>
-                  <div class="input-group">
-                    <input type="email" class="form-control" placeholder="hello@creative-tim.com">
-                  </div>
-                </div>
-              </div>
-              <div class="form-group mb-4 mt-md-0 mt-4">
-                <label>What can we help you?</label>
-                <textarea name="message" class="form-control" id="message" rows="6" placeholder="Describe your problem in at least 250 characters"></textarea>
-              </div>
-              <div class="row">
-                <div class="col-md-12 text-center">
-                  <button type="submit" class="btn bg-gradient-primary mt-4">Send Message</button>
-                </div>
-              </div>
-            </div>
-          </form>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Contact us 6

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-7 bg-gray-100 position-relative">
-  <div class="container">
-    <div class="row">
-      <div class="col-lg-6 mx-auto text-center">
-        <h2>Contact Us</h2>
-        <p class="lead">Amy questions or remarks? Just write us a messaage!</p>
-      </div>
-    </div>
-    <div class="row mt-5">
-      <div class="col-lg-10 mx-auto">
-        <div class="card">
-          <div class="row">
-            <div class="col-lg-5 d-flex">
-              <div class="bg-gradient-dark my-lg-3 ms-lg-3 border-radius-md">
-                <img src="../../assets/img/shapes/waves-white.svg" alt="pattern-lines" class="position-absolute start-0 top-0 h-100 opacity-6">
-                <div class="card-body p-5 position-relative">
-                  <h3 class="text-white">Contact Information</h3>
-                  <p class="text-white opacity-8 mb-4">Fill up the form and our Team will get back to you within 24 hours.</p>
-                  <div class="d-flex p-2 text-white">
-                    <div>
-                      <i class="fas fa-phone text-sm"></i>
-                    </div>
-                    <div class="ps-3">
-                      <span class="text-sm opacity-8">(+40) 772 100 200</span>
-                    </div>
-                  </div>
-                  <div class="d-flex p-2 text-white">
-                    <div>
-                      <i class="fas fa-envelope text-sm"></i>
-                    </div>
-                    <div class="ps-3">
-                      <span class="text-sm opacity-8">hello@creative-tim.com</span>
-                    </div>
-                  </div>
-                  <div class="d-flex p-2 text-white">
-                    <div>
-                      <i class="fas fa-map-marker-alt text-sm"></i>
-                    </div>
-                    <div class="ps-3">
-                      <span class="text-sm opacity-8">730 Dyonisie Wolf <br> Bucharest, RO 010458</span>
-                    </div>
-                  </div>
-                  <div class="mt-4">
-                    <button type="button" class="btn btn-icon-only btn-link text-white btn-lg mb-0" data-toggle="tooltip" data-placement="bottom" data-original-title="Log in with Facebook">
-                      <i class="fab fa-facebook"></i>
-                    </button>
-                    <button type="button" class="btn btn-icon-only btn-link text-white btn-lg mb-0" data-toggle="tooltip" data-placement="bottom" data-original-title="Log in with Twitter">
-                      <i class="fab fa-twitter"></i>
-                    </button>
-                    <button type="button" class="btn btn-icon-only btn-link text-white btn-lg mb-0" data-toggle="tooltip" data-placement="bottom" data-original-title="Log in with Dribbble">
-                      <i class="fab fa-dribbble"></i>
-                    </button>
-                    <button type="button" class="btn btn-icon-only btn-link text-white btn-lg mb-0" data-toggle="tooltip" data-placement="bottom" data-original-title="Log in with Instagram">
-                      <i class="fab fa-instagram"></i>
-                    </button>
-                  </div>
-                </div>
-              </div>
-            </div>
-            <div class="col-lg-7">
-              <form role="form" id="contact-form" method="post" autocomplete="off">
-                <div class="card-body position-relative p-3 ps-0">
-                  <div class="row mt-4">
-                    <div class="col-md-6">
-                      <label>First name</label>
-                      <div class="input-group mb-4">
-                        <input class="form-control" placeholder="eg. Lucas" aria-label="First Name..." type="text">
-                      </div>
-                    </div>
-                    <div class="col-md-6 ps-2">
-                      <label>Last name</label>
-                      <div class="input-group mb-4">
-                        <input type="text" class="form-control" placeholder="eg. Jones" aria-label="Last Name...">
-                      </div>
-                    </div>
-                  </div>
-                  <div>
-                    <label>Email address</label>
-                    <div class="input-group mb-4">
-                      <input type="email" class="form-control" placeholder="eg. lucas@creative-tim.com">
-                    </div>
-                  </div>
-                  <label>What are you interested on?</label>
-                  <div class="d-flex">
-                    <div>
-                      <div class="form-check me-3">
-                        <input class="form-check-input" type="radio" name="flexRadioDefault" id="flexRadioDefault1" checked>
-                        <label class="form-check-label" for="flexRadioDefault1">
-                          Design
-                        </label>
-                      </div>
-                    </div>
-                    <div>
-                      <div class="form-check me-3">
-                        <input class="form-check-input" type="radio" name="flexRadioDefault" id="flexRadioDefault2">
-                        <label class="form-check-label" for="flexRadioDefault2">
-                          Development
-                        </label>
-                      </div>
-                    </div>
-                    <div>
-                      <div class="form-check me-3">
-                        <input class="form-check-input" type="radio" name="flexRadioDefault" id="flexRadioDefault3">
-                        <label class="form-check-label" for="flexRadioDefault3">
-                          Support
-                        </label>
-                      </div>
-                    </div>
-                    <div>
-                      <div class="form-check">
-                        <input class="form-check-input" type="radio" name="flexRadioDefault" id="flexRadioDefault4">
-                        <label class="form-check-label" for="flexRadioDefault4">
-                          Other
-                        </label>
-                      </div>
-                    </div>
-                  </div>
-                  <div class="form-group mt-4">
-                    <label>Your message</label>
-                    <textarea name="message" class="form-control" id="message" rows="3"></textarea>
-                  </div>
-                  <div class="text-right">
-                    <button type="button" class="btn bg-gradient-dark mb-0">Send message</button>
-                  </div>
-                </div>
-              </form>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Contact us 7

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-7">
-  <div class="container">
-    <div class="row">
-      <div class="col">
-        <div class="card overflow-hidden">
-          <div class="row">
-            <div class="col-lg-7">
-              <form role="form" class="p-3" id="contact-form" method="post">
-                <div class="card-header px-4 py-sm-5 py-3">
-                  <h2>Say Hi!</h2>
-                  <p class="lead"> We&#39;d like to talk with you.</p>
-                </div>
-                <div class="card-body pt-1">
-                    <div class="row">
-                      <div class="col-md-12 pe-2 mb-3">
-                        <label>My name is</label>
-                        <input class="form-control" placeholder="Full Name" type="text" >
-                      </div>
-
-                      <div class="col-md-12 pe-2 mb-3">
-                        <label>I&#39;m looking for</label>
-                        <input class="form-control" placeholder="What you love" type="text" >
-                      </div>
-
-                      <div class="col-md-12 pe-2 mb-3">
-                        <div class="form-group mb-0">
-                            <label>Your message</label>
-                            <textarea name="message" class="form-control" id="message" rows="6" placeholder="I want to say that..."></textarea>
-                        </div>
-                      </div>
-                    </div>
-
-                    <div class="row">
-                      <div class="col-md-6 text-right ms-auto">
-                          <button type="submit" class="btn btn-primary btn-round bg-gradient-primary mb-0">Send Message</button>
-                      </div>
-                    </div>
-                </div>
-              </form>
-            </div>
-            <div class="col-lg-5 position-relative bg-cover px-0" style="background-image: url(&#39;../../assets/img/curved-images/curved5.jpg&#39;)">
-              <div class="position-absolute z-index-2 w-100 h-100 top-0 start-0 d-lg-block d-none">
-                <img src="../../assets/img/wave-1.svg" class="h-100 ms-n2">
-              </div>
-              <div class="z-index-2 text-center d-flex h-100 w-100 d-flex m-auto justify-content-center">
-                <div class="mask bg-gradient-primary opacity-9"></div>
-                <div class="p-5 ps-sm-8 position-relative text-left my-auto">
-                  <h3 class="text-white">Contact Information</h3>
-                  <p class="text-white opacity-8 mb-4">Fill up the form and our Team will get back to you within 24 hours.</p>
-                  <div class="d-flex p-2 text-white">
-                    <div>
-                      <i class="fas fa-phone text-sm"></i>
-                    </div>
-                    <div class="ps-3">
-                      <span class="text-sm opacity-8">(+40) 772 100 200</span>
-                    </div>
-                  </div>
-                  <div class="d-flex p-2 text-white">
-                    <div>
-                      <i class="fas fa-envelope text-sm"></i>
-                    </div>
-                    <div class="ps-3">
-                      <span class="text-sm opacity-8">hello@creative-tim.com</span>
-                    </div>
-                  </div>
-                  <div class="d-flex p-2 text-white">
-                    <div>
-                      <i class="fas fa-map-marker-alt text-sm"></i>
-                    </div>
-                    <div class="ps-3">
-                      <span class="text-sm opacity-8">Dyonisie Wolf Bucharest, RO 010458</span>
-                    </div>
-                  </div>
-                  <div class="mt-4">
-                    <button type="button" class="btn btn-icon-only btn-link text-white btn-lg mb-0" data-toggle="tooltip" data-placement="bottom" data-original-title="Log in with Facebook">
-                      <i class="fab fa-facebook"></i>
-                    </button>
-                    <button type="button" class="btn btn-icon-only btn-link text-white btn-lg mb-0" data-toggle="tooltip" data-placement="bottom" data-original-title="Log in with Twitter">
-                      <i class="fab fa-twitter"></i>
-                    </button>
-                    <button type="button" class="btn btn-icon-only btn-link text-white btn-lg mb-0" data-toggle="tooltip" data-placement="bottom" data-original-title="Log in with Dribbble">
-                      <i class="fab fa-dribbble"></i>
-                    </button>
-                    <button type="button" class="btn btn-icon-only btn-link text-white btn-lg mb-0" data-toggle="tooltip" data-placement="bottom" data-original-title="Log in with Instagram">
-                      <i class="fab fa-instagram"></i>
-                    </button>
-                  </div>
-                </div>
-              </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Contact us 8

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-7 bg-white position-relative">
-  <div class="container">
-    <div class="row">
-      <div class="col-lg-6 col-md-5 mb-5">
-        <div class="icon icon-shape bg-gradient-primary shadow text-center mb-4">
-          <i class="ni ni-single-02"></i>
-        </div>
-        <h2>Premium Support</h2>
-        <p class="pe-5">You need more information? Check what other persons are saying about our product. They are very happy with their purchase.</p>
-        <div class="d-flex p-2">
-          <div>
-            <i class="fas fa-map text-sm"></i>
-          </div>
-          <div class="ps-3">
-            <span>730 Dyonisie Wolf <br> Bucharest, RO 010458</span>
-          </div>
-        </div>
-        <div class="d-flex p-2">
-          <div>
-            <i class="fas fa-envelope text-sm"></i>
-          </div>
-          <div class="ps-3">
-            <span>hello@creative-tim.com</span>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-6 col-md-5">
-        <div class="icon icon-shape bg-gradient-primary shadow text-center mb-4">
-          <i class="ni ni-chart-pie-35"></i>
-        </div>
-        <h2>Free Updates</h2>
-        <p class="pe-5">You need more information? Check what other persons are saying about our product. They are very happy with their purchase.</p>
-        <div class="d-flex p-2">
-          <div>
-            <i class="fas fa-phone text-sm"></i>
-          </div>
-          <div class="ps-3">
-            <span>(+40) 772 100 200  <br> (+40) 763 310 190</span>
-          </div>
-        </div>
-        <div class="d-flex p-2">
-          <div>
-            <i class="fas fa-envelope text-sm"></i>
-          </div>
-          <div class="ps-3">
-            <span>hello@creative-tim.com</span>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
- - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/sections/input-areas/forms.html b/sections/input-areas/forms.html index 5c038e75..e970da1a 100644 --- a/sections/input-areas/forms.html +++ b/sections/input-areas/forms.html @@ -1,6 +1,6 @@ - - - + @@ -1218,7 +1216,7 @@

Contact us

- + \ No newline at end of file diff --git a/sections/input-areas/inputs.html b/sections/input-areas/inputs.html index 30a37bc4..8767ebb7 100644 --- a/sections/input-areas/inputs.html +++ b/sections/input-areas/inputs.html @@ -1,6 +1,6 @@ - - - + @@ -749,7 +747,7 @@

Inputs

-
+
@@ -946,7 +944,7 @@

Inputs

- + \ No newline at end of file diff --git a/sections/input-areas/newsletters.html b/sections/input-areas/newsletters.html deleted file mode 100644 index 22e2f5b9..00000000 --- a/sections/input-areas/newsletters.html +++ /dev/null @@ -1,993 +0,0 @@ - - - - - - - - - - - Soft UI Design System by Creative Tim - - - - - - - - - - - - - - - - - - - -
-
-
-
- -

Newsletters

-
-
-
-
-
-

Newsletter 1

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-7">
-  <div class="container">
-    <div class="row">
-      <div class="col-lg-5 me-auto">
-        <h4 class="title">Get Tips &amp; Tricks every Week!</h4>
-        <p class="description">
-          Join our newsletter and get news in your inbox every week!
-        </p>
-      </div>
-      <div class="col-lg-6 d-flex justify-content-center flex-column ms-auto">
-        <form method="" action="">
-          <div class="row">
-            <div class="col-sm-8">
-              <div class="input-group mb-4">
-                <span class="input-group-text"><i class="fas fa-envelope"></i></span>
-                <input class="form-control" placeholder="Your Email..." type="text">
-              </div>
-            </div>
-            <div class="col-sm-4">
-              <button type="button" class="btn bg-gradient-primary w-100">Subscribe</button>
-            </div>
-          </div>
-        </form>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Newsletter 2

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-9">
-  <div class="container">
-    <div class="row justify-content-center text-center">
-      <div class="col-lg-4">
-        <div class="icon icon-shape icon-sm rounded-circle bg-gradient-warning shadow text-center mb-4">
-          <i class="fas fa-user"></i>
-        </div>
-        <h3>Subscribe</h3>
-        <p>This is the paragraph where you can write more details about your product.</p>
-      </div>
-    </div>
-    <div class="row justify-content-center mt-4">
-      <div class="col-lg-6">
-        <form method="" action="">
-          <div class="row">
-            <div class="col-sm-8">
-              <div class="input-group mb-4">
-                <span class="input-group-text"><i class="fas fa-envelope"></i></span>
-                <input class="form-control" placeholder="Your Email..." type="text">
-              </div>
-            </div>
-            <div class="col-sm-4">
-              <button type="button" class="btn bg-gradient-warning w-100">Subscribe</button>
-            </div>
-          </div>
-        </form>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
- - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/sections/navigation/nav-tabs.html b/sections/navigation/nav-tabs.html index dbd89aa6..6d2ef442 100644 --- a/sections/navigation/nav-tabs.html +++ b/sections/navigation/nav-tabs.html @@ -1,6 +1,6 @@ - - - + @@ -745,7 +743,7 @@

Nav Tabs

-
-
-
- Copy - 
<!-- START Project section w/ 3 images & quote & text -->
-<section class="py-5">
-  <div class="container">
-    <div class="row mb-5">
-      <div class="col-lg-8 text-center mx-auto">
-        <p class="mb-1 text-success">Our Work</p>
-        <h3>Some of our awesome projects - 1</h3>
-      </div>
-    </div>
-    <div class="row">
-      <div class="col-md-6 position-relative">
-        <img class="image-left border-radius-lg img-fluid shadow position-relative top-0 end-0 ms-md-5 bg-cover" src="https://images.unsplash.com/photo-1593642632823-8f785ba67e45?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1920&q=80">
-
-        <p class="blockquote border border-primary rounded w-50 p-3 text-sm text-primary float-md-right mx-auto mt-4 me-md-n2">"Over the span of the satellite record, Arctic sea ice has been declining significantly, while sea ice in the Antarctichas increased very
-          slightly"
-          <br>
-          <br>
-          <small>-NOAA</small>
-        </p>
-
-      </div>
-      <div class="col-md-5">
-        <!-- First image on the right side, above the article -->
-        <img class="image-right border-radius-lg img-fluid shadow ms-md-n4 mb-4 mt-md-8 position-relative bg-cover" src="https://images.unsplash.com/photo-1593642702821-c8da6771f0c6?ixlib=rb-1.2.1&auto=format&fit=crop&w=1920&q=80">
-        <div class="px-4">
-          <p class="text-gradient text-primary">Design</p>
-          <h3 class="mb-4">Jeff Bezos</h3>
-          <p>
-            For a start, it does not automatically follow that a record amount of ice will melt this summer. More important for determining the size of the annual thaw is the state of the weather as the midnight sun approaches and temperatures rise.
-          </p>
-        </div>
-      </div>
-    </div>
-    <div class="row mt-5">
-      <div class="col-md-6 position-relative">
-        <img class="image-left border-radius-lg img-fluid shadow position-relative top-0 end-0 ms-md-5 bg-cover" src="https://images.unsplash.com/photo-1593642634402-b0eb5e2eebc9?ixlib=rb-1.2.1&auto=format&fit=crop&w=1920&q=80">
-
-        <p class="blockquote border border-info rounded w-50 p-3 text-sm text-info float-md-right mt-4 me-md-n2 mx-auto">"Over the span of the satellite record, Arctic sea ice has been declining significantly, while sea ice in the Antarctichas increased very
-          slightly"
-          <br>
-          <br>
-          <small>-NOAA</small>
-        </p>
-
-      </div>
-      <div class="col-md-5">
-        <!-- First image on the right side, above the article -->
-        <img class="image-right border-radius-lg img-fluid shadow ms-md-n4 mb-4 mt-md-8 position-relative bg-cover" src="https://images.unsplash.com/photo-1593642702909-dec73df255d7?ixlib=rb-1.2.1&auto=format&fit=crop&w=1920&q=80">
-        <div class="px-4">
-          <p class="text-gradient text-info">Development</p>
-          <h3 class="mb-4">Mike Alfonso</h3>
-          <p>
-            For a start, it does not automatically follow that a record amount of ice will melt this summer. More important for determining the size of the annual thaw is the state of the weather as the midnight sun approaches and temperatures rise.
-          </p>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-<!-- END Project section w/ 3 images & quote & text -->
-
-
-
-
-
-
-
-
-
-

Project 2

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-5">
-  <div class="container">
-    <div class="row">
-      <div class="col-md-8 ms-auto me-auto text-center">
-        <h3>Some of Our Awesome Projects</h3>
-        <p>This is the paragraph where you can write more details about your projects. Keep you user engaged by providing meaningful information.</p>
-      </div>
-    </div>
-    <div class="row mt-5">
-      <div class="col-md-5 ms-auto">
-        <div class="card bg-cover text-center" style="background-image: url(&#39;../../assets/img/curved-images/curved1.jpg&#39;)">
-          <div class="card-body z-index-2 py-9">
-            <h2 class="text-white">Social Analytics</h2>
-            <p class="text-white">
-              Insight to help you create, connect, and convert. Understand Your Audience&#39;s Interests, Influence, Interactions, and Intent. Discover emerging topics and influencers to reach new audiences.
-            </p>
-            <label class="badge badge-light text-dark">Analytics</label>
-          </div>
-          <div class="mask bg-gradient-primary border-radius-lg"></div>
-        </div>
-      </div>
-
-      <div class="col-md-5 me-auto my-auto mt-md-auto mt-5">
-        <div class="p-3 info-horizontal d-flex">
-          <div class="icon icon-md">
-            <div class="icon icon-shape text-center">
-            <svg class="text-primary" width="25px" height="25px" viewBox="0 0 46 42" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                <title>customer-support</title>
-                <g id="Basic-Elements" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                    <g id="Rounded-Icons" transform="translate(-1717.000000, -291.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                        <g id="Icons-with-opacity" transform="translate(1716.000000, 291.000000)">
-                            <g id="customer-support" transform="translate(1.000000, 0.000000)">
-                                <path class="color-background" d="M45,0 L26,0 C25.447,0 25,0.447 25,1 L25,20 C25,20.379 25.214,20.725 25.553,20.895 C25.694,20.965 25.848,21 26,21 C26.212,21 26.424,20.933 26.6,20.8 L34.333,15 L45,15 C45.553,15 46,14.553 46,14 L46,1 C46,0.447 45.553,0 45,0 Z" id="Path" opacity="0.59858631"></path>
-                                <path class="color-foreground" d="M22.883,32.86 C20.761,32.012 17.324,31 13,31 C8.676,31 5.239,32.012 3.116,32.86 C1.224,33.619 0,35.438 0,37.494 L0,41 C0,41.553 0.447,42 1,42 L25,42 C25.553,42 26,41.553 26,41 L26,37.494 C26,35.438 24.776,33.619 22.883,32.86 Z" id="Path"></path>
-                                <path class="color-foreground" d="M13,28 C17.432,28 21,22.529 21,18 C21,13.589 17.411,10 13,10 C8.589,10 5,13.589 5,18 C5,22.529 8.568,28 13,28 Z" id="Path"></path>
-                            </g>
-                        </g>
-                    </g>
-                </g>
-            </svg>
-          </div>
-          </div>
-          <div class="ms-4">
-            <h4>Listen to Social Conversations</h4>
-            <p>
-              Gain access to the demographics, psychographics, and location of unique people who talk about your brand.
-            </p>
-          </div>
-        </div>
-
-        <div class="p-3 info-horizontal d-flex">
-          <div class="icon me-4 mt-1">
-            <div class="icon icon-md">
-                <svg class="text-primary" width="25px" height="25px" viewBox="0 0 42 44" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                    <title>time-alarm</title>
-                    <g id="Basic-Elements" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                        <g id="Rounded-Icons" transform="translate(-2319.000000, -440.000000)" fill="#923DFA" fill-rule="nonzero">
-                            <g id="Icons-with-opacity" transform="translate(1716.000000, 291.000000)">
-                                <g id="time-alarm" transform="translate(603.000000, 149.000000)">
-                                    <path class="color-background" d="M18.8086957,4.70034783 C15.3814926,0.343541521 9.0713063,-0.410050841 4.7145,3.01715217 C0.357693695,6.44435519 -0.395898667,12.7545415 3.03130435,17.1113478 C5.53738466,10.3360568 11.6337901,5.54042955 18.8086957,4.70034783 L18.8086957,4.70034783 Z" id="Path" opacity="0.6"></path>
-                                    <path class="color-background" d="M38.9686957,17.1113478 C42.3958987,12.7545415 41.6423063,6.44435519 37.2855,3.01715217 C32.9286937,-0.410050841 26.6185074,0.343541521 23.1913043,4.70034783 C30.3662099,5.54042955 36.4626153,10.3360568 38.9686957,17.1113478 Z" id="Path" opacity="0.6"></path>
-                                    <path class="color-foreground" d="M34.3815652,34.7668696 C40.2057958,27.7073059 39.5440671,17.3375603 32.869743,11.0755718 C26.1954189,4.81358341 15.8045811,4.81358341 9.13025701,11.0755718 C2.45593289,17.3375603 1.79420418,27.7073059 7.61843478,34.7668696 L3.9753913,40.0506522 C3.58549114,40.5871271 3.51710058,41.2928217 3.79673036,41.8941824 C4.07636014,42.4955431 4.66004722,42.8980248 5.32153275,42.9456105 C5.98301828,42.9931963 6.61830436,42.6784048 6.98113043,42.1232609 L10.2744783,37.3434783 C16.5555112,42.3298213 25.4444888,42.3298213 31.7255217,37.3434783 L35.0188696,42.1196087 C35.6014207,42.9211577 36.7169135,43.1118605 37.53266,42.5493622 C38.3484064,41.9868639 38.5667083,40.8764423 38.0246087,40.047 L34.3815652,34.7668696 Z M30.1304348,25.5652174 L21,25.5652174 C20.49574,25.5652174 20.0869565,25.1564339 20.0869565,24.6521739 L20.0869565,15.5217391 C20.0869565,15.0174791 20.49574,14.6086957 21,14.6086957 C21.50426,14.6086957 21.9130435,15.0174791 21.9130435,15.5217391 L21.9130435,23.7391304 L30.1304348,23.7391304 C30.6346948,23.7391304 31.0434783,24.1479139 31.0434783,24.6521739 C31.0434783,25.1564339 30.6346948,25.5652174 30.1304348,25.5652174 Z" id="Shape"></path>
-                                </g>
-                            </g>
-                        </g>
-                    </g>
-                </svg>
-              </div>
-          </div>
-          <div class="ms-4">
-            <h4>Performance Analyze</h4>
-            <p>
-              Unify data from Facebook, Instagram, Twitter, LinkedIn, and Youtube to gain rich insights from easy-to-use reports.
-            </p>
-          </div>
-        </div>
-
-        <div class="p-3 info-horizontal d-flex">
-          <div class="icon me-4 mt-1">
-            <div class="icon icon-md">
-            <svg class="text-primary" width="25px" height="25px" viewBox="0 0 42 42" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                <title>box-3d-50</title>
-                <g id="Basic-Elements" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                    <g id="Rounded-Icons" transform="translate(-2319.000000, -291.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                        <g id="Icons-with-opacity" transform="translate(1716.000000, 291.000000)">
-                            <g id="box-3d-50" transform="translate(603.000000, 0.000000)">
-                                <path class="color-foreground" d="M22.7597136,19.3090182 L38.8987031,11.2395234 C39.3926816,10.9925342 39.592906,10.3918611 39.3459167,9.89788265 C39.249157,9.70436312 39.0922432,9.5474453 38.8987261,9.45068056 L20.2741875,0.1378125 L20.2741875,0.1378125 C19.905375,-0.04725 19.469625,-0.04725 19.0995,0.1378125 L3.1011696,8.13815822 C2.60720568,8.38517662 2.40701679,8.98586148 2.6540352,9.4798254 C2.75080129,9.67332903 2.90771305,9.83023153 3.10122239,9.9269862 L21.8652864,19.3090182 C22.1468139,19.4497819 22.4781861,19.4497819 22.7597136,19.3090182 Z" id="Path"></path>
-                                <path class="color-background" d="M23.625,22.429159 L23.625,39.8805372 C23.625,40.4328219 24.0727153,40.8805372 24.625,40.8805372 C24.7802551,40.8805372 24.9333778,40.8443874 25.0722402,40.7749511 L41.2741875,32.673375 L41.2741875,32.673375 C41.719125,32.4515625 42,31.9974375 42,31.5 L42,14.241659 C42,13.6893742 41.5522847,13.241659 41,13.241659 C40.8447549,13.241659 40.6916418,13.2778041 40.5527864,13.3472318 L24.1777864,21.5347318 C23.8390024,21.7041238 23.625,22.0503869 23.625,22.429159 Z" id="Path" opacity="0.7"></path>
-                                <path class="color-background" d="M20.4472136,21.5347318 L1.4472136,12.0347318 C0.953235098,11.7877425 0.352562058,11.9879669 0.105572809,12.4819454 C0.0361450918,12.6208008 6.47121774e-16,12.7739139 0,12.929159 L0,30.1875 L0,30.1875 C0,30.6849375 0.280875,31.1390625 0.7258125,31.3621875 L19.5528096,40.7750766 C20.0467945,41.0220531 20.6474623,40.8218132 20.8944388,40.3278283 C20.963859,40.1889789 21,40.0358742 21,39.8806379 L21,22.429159 C21,22.0503869 20.7859976,21.7041238 20.4472136,21.5347318 Z" id="Path" opacity="0.7"></path>
-                            </g>
-                        </g>
-                    </g>
-                </g>
-            </svg>
-          </div>
-          </div>
-          <div class="ms-4">
-            <h4>Social Conversions</h4>
-            <p>
-              Track actions taken on your website that originated from social, and understand the impact on your bottom line.
-            </p>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <hr class="horizontal dark my-6 mx-7">
-    <div class="row">
-      <div class="col-md-5 ms-auto my-auto">
-        <div class="p-3 info-horizontal d-flex">
-          <div class="icon me-4 mt-1">
-            <div class="icon icon-md">
-            <svg class="text-info" width="25px" height="25px" viewBox="0 0 43 36" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-              <title>credit-card</title>
-              <g id="Basic-Elements" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                <g id="Rounded-Icons" transform="translate(-2169.000000, -745.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                  <g id="Icons-with-opacity" transform="translate(1716.000000, 291.000000)">
-                    <g id="credit-card" transform="translate(453.000000, 454.000000)">
-                      <path class="color-background" d="M43,10.7482083 L43,3.58333333 C43,1.60354167 41.3964583,0 39.4166667,0 L3.58333333,0 C1.60354167,0 0,1.60354167 0,3.58333333 L0,10.7482083 L43,10.7482083 Z" id="Path" opacity="0.593633743">
-                      </path>
-                      <path class="color-foreground" d="M0,16.125 L0,32.25 C0,34.2297917 1.60354167,35.8333333 3.58333333,35.8333333 L39.4166667,35.8333333 C41.3964583,35.8333333 43,34.2297917 43,32.25 L43,16.125 L0,16.125 Z M19.7083333,26.875 L7.16666667,26.875 L7.16666667,23.2916667 L19.7083333,23.2916667 L19.7083333,26.875 Z M35.8333333,26.875 L28.6666667,26.875 L28.6666667,23.2916667 L35.8333333,23.2916667 L35.8333333,26.875 Z" id="Shape"></path>
-                    </g>
-                  </g>
-                </g>
-              </g>
-            </svg>
-          </div>
-          </div>
-          <div class="ms-4">
-            <h4>Always In Sync</h4>
-            <p>
-              No matter where you are, Trello stays in sync across all of your devices.
-            </p>
-          </div>
-        </div>
-
-        <div class="p-3 info-horizontal d-flex">
-          <div class="icon me-4 mt-1">
-            <div class="icon icon-md">
-            <svg class="text-info" width="25px" height="25px" viewBox="0 0 52 35" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                <title>sound-wave</title>
-                <g id="Basic-Elements" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                    <g id="Rounded-Icons" transform="translate(-2015.000000, -596.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                        <g id="Icons-with-opacity" transform="translate(1716.000000, 291.000000)">
-                            <g id="sound-wave" transform="translate(299.000000, 305.000000)">
-                                <path class="color-foreground" d="M15.2941176,30.5882353 C14.6024837,30.5882353 13.9754248,30.1667974 13.7154248,29.5210458 L8.11777778,15.5269281 L6.51189542,17.9366013 C6.19581699,18.4090196 5.66562092,18.6928105 5.09803922,18.6928105 L0,18.6928105 L0,15.2941176 L4.18888889,15.2941176 L7.08287582,10.9522876 C7.43294118,10.4288889 8.03281046,10.1467974 8.67346405,10.2045752 C9.30052288,10.2708497 9.84261438,10.6769935 10.0754248,11.263268 L15.0969935,23.8214379 L22.1696732,1.19294118 C22.3905882,0.482614379 23.0465359,0 23.7908497,0 C23.792549,0 23.792549,0 23.7942484,0 C24.5385621,0.00169934641 25.1962092,0.487712418 25.4154248,1.19973856 L31.2305882,20.1015686 L34.3267974,15.9738562 C34.6462745,15.5456209 35.1509804,15.2941176 35.6862745,15.2941176 L40.7843137,15.2941176 L40.7843137,18.6928105 L36.5359477,18.6928105 L31.9477124,24.8104575 C31.5653595,25.3202614 30.9298039,25.5717647 30.2959477,25.4647059 C29.6671895,25.3542484 29.1522876,24.9005229 28.9636601,24.2904575 L23.7772549,7.43803922 L16.9152941,29.3952941 C16.7011765,30.0818301 16.0792157,30.5593464 15.3603922,30.5865359 C15.3366013,30.5882353 15.3162092,30.5882353 15.2941176,30.5882353 Z" id="Path"></path>
-                                <path class="color-background" d="M26.5098039,34.6666667 C25.8181699,34.6666667 25.1911111,34.2452288 24.9311111,33.5994771 L19.3334641,19.6053595 L17.7275817,22.0150327 C17.4115033,22.487451 16.8813072,22.7712418 16.3137255,22.7712418 L11.2156863,22.7712418 L11.2156863,19.372549 L15.4045752,19.372549 L18.2985621,15.030719 C18.6486275,14.5073203 19.2484967,14.2252288 19.8891503,14.2830065 C20.5162092,14.349281 21.0583007,14.7554248 21.2911111,15.3416993 L26.3126797,27.8998693 L33.3853595,5.27137255 C33.6062745,4.56104575 34.2622222,4.07843137 35.0065359,4.07843137 C35.0082353,4.07843137 35.0082353,4.07843137 35.0099346,4.07843137 C35.7542484,4.08013072 36.4118954,4.56614379 36.6311111,5.27816993 L42.4462745,24.18 L45.5424837,20.0522876 C45.8619608,19.6240523 46.3666667,19.372549 46.9019608,19.372549 L52,19.372549 L52,22.7712418 L47.751634,22.7712418 L43.1633987,28.8888889 C42.7810458,29.3986928 42.1454902,29.6501961 41.511634,29.5431373 C40.8828758,29.4326797 40.3679739,28.9789542 40.1793464,28.3688889 L34.9929412,11.5164706 L28.1309804,33.4737255 C27.9168627,34.1602614 27.294902,34.6377778 26.5760784,34.6649673 C26.5522876,34.6666667 26.5318954,34.6666667 26.5098039,34.6666667 Z" id="Path-Copy" opacity="0.604957217"></path>
-                            </g>
-                        </g>
-                    </g>
-                </g>
-            </svg>
-          </div>
-          </div>
-          <div class="ms-4">
-            <h4>Work With Any Team</h4>
-            <p>
-              Whether it’s for work or even the next family vacation, Trello helps your team.
-            </p>
-          </div>
-        </div>
-
-        <div class="p-3 info-horizontal d-flex">
-          <div class="icon me-4 mt-1">
-            <div class="icon icon-md">
-              <svg class="text-info" width="25px" height="25px" viewBox="0 0 40 40" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                <title>spaceship</title>
-                <g id="Basic-Elements" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                  <g id="Rounded-Icons" transform="translate(-1720.000000, -592.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                    <g id="Icons-with-opacity" transform="translate(1716.000000, 291.000000)">
-                      <g id="spaceship" transform="translate(4.000000, 301.000000)">
-                        <path class="color-foreground" d="M39.3,0.706666667 C38.9660984,0.370464027 38.5048767,0.192278529 38.0316667,0.216666667 C14.6516667,1.43666667 6.015,22.2633333 5.93166667,22.4733333 C5.68236407,23.0926189 5.82664679,23.8009159 6.29833333,24.2733333 L15.7266667,33.7016667 C16.2013871,34.1756798 16.9140329,34.3188658 17.535,34.065 C17.7433333,33.98 38.4583333,25.2466667 39.7816667,1.97666667 C39.8087196,1.50414529 39.6335979,1.04240574 39.3,0.706666667 Z M25.69,19.0233333 C24.7367525,19.9768687 23.3029475,20.2622391 22.0572426,19.7463614 C20.8115377,19.2304837 19.9992882,18.0149658 19.9992882,16.6666667 C19.9992882,15.3183676 20.8115377,14.1028496 22.0572426,13.5869719 C23.3029475,13.0710943 24.7367525,13.3564646 25.69,14.31 C26.9912731,15.6116662 26.9912731,17.7216672 25.69,19.0233333 L25.69,19.0233333 Z" id="Shape"></path>
-                        <path class="color-foreground" d="M1.855,31.4066667 C3.05106558,30.2024182 4.79973884,29.7296005 6.43969145,30.1670277 C8.07964407,30.6044549 9.36054508,31.8853559 9.7979723,33.5253085 C10.2353995,35.1652612 9.76258177,36.9139344 8.55833333,38.11 C6.70666667,39.9616667 0,40 0,40 C0,40 0,33.2566667 1.855,31.4066667 Z" id="Path"></path>
-                        <path class="color-background" d="M17.2616667,3.90166667 C12.4943643,3.07192755 7.62174065,4.61673894 4.20333333,8.04166667 C3.31200265,8.94126033 2.53706177,9.94913142 1.89666667,11.0416667 C1.5109569,11.6966059 1.61721591,12.5295394 2.155,13.0666667 L5.47,16.3833333 C8.55036617,11.4946947 12.5559074,7.25476565 17.2616667,3.90166667 L17.2616667,3.90166667 Z" id="color-2" opacity="0.598539807"></path>
-                        <path class="color-background" d="M36.0983333,22.7383333 C36.9280725,27.5056357 35.3832611,32.3782594 31.9583333,35.7966667 C31.0587397,36.6879974 30.0508686,37.4629382 28.9583333,38.1033333 C28.3033941,38.4890431 27.4704606,38.3827841 26.9333333,37.845 L23.6166667,34.53 C28.5053053,31.4496338 32.7452344,27.4440926 36.0983333,22.7383333 L36.0983333,22.7383333 Z" id="color-3" opacity="0.598539807"></path>
-                      </g>
-                    </g>
-                  </g>
-                </g>
-              </svg>
-            </div>
-          </div>
-          <div class="ms-4">
-            <h4>A Productivity Platform</h4>
-            <p>
-              Integrate the apps your team already uses directly into your workflow.
-            </p>
-          </div>
-        </div>
-      </div>
-      <div class="col-md-5 me-auto">
-        <div class="card bg-cover text-center" style="background-image: url(&#39;../../assets/img/curved-images/curved2.jpg&#39;)">
-          <div class="card-body z-index-2 py-9">
-            <h2 class="text-white">Trello lets you work.</h2>
-            <p class="text-white">
-              Trello’s boards, lists, and cards enable you to organize and prioritize your projects in a fun, flexible and rewarding way.
-            </p>
-            <label class="badge badge-light text-dark">Trello</label>
-          </div>
-          <div class="mask bg-gradient-info border-radius-lg"></div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Project 3

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- START Project section w/ 3 tilt cards -->
-<section class="py-5">
-  <div class="container">
-    <div class="row mb-5">
-      <div class="col-lg-8 text-center mx-auto">
-        <p class="mb-1 text-gradient text-primary">Our Work</p>
-        <h3>Some of our awesome projects - 3</h3>
-      </div>
-    </div>
-    <div class="row">
-      <div class="col-lg-4 col-md-6">
-        <a href="javascript:;">
-          <div class="card card-background card-background-mask-primary tilt" data-tilt>
-            <div class="full-background" style="background-image: url(&#39;https://images.unsplash.com/photo-1579389083395-4507e98b5e67?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=934&q=80&#39;)"></div>
-            <div class="card-body pt-7 text-center">
-              <div class="icon icon-lg up mb-5">
-                <svg width="40px" height="40px" viewBox="0 0 40 40" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                  <title>chart-pie-35</title>
-                  <g id="Basic-Elements" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                    <g id="Rounded-Icons" transform="translate(-1720.000000, -742.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                      <g id="Icons-with-opacity" transform="translate(1716.000000, 291.000000)">
-                        <g id="chart-pie-35" transform="translate(4.000000, 451.000000)">
-                          <path d="M21.6666667,18.3333333 L39.915,18.3333333 C39.11,8.635 31.365,0.89 21.6666667,0.085 L21.6666667,18.3333333 Z" id="Path" opacity="0.602864583"></path>
-                          <path d="M20.69,21.6666667 L7.09833333,35.2583333 C10.585,38.21 15.085,40 20,40 C30.465,40 39.0633333,31.915 39.915,21.6666667 L20.69,21.6666667 Z" id="Path"></path>
-                          <path d="M18.3333333,19.31 L18.3333333,0.085 C8.085,0.936666667 0,9.535 0,20 C0,24.915 1.79,29.415 4.74166667,32.9016667 L18.3333333,19.31 Z" id="Path"></path>
-                        </g>
-                      </g>
-                    </g>
-                  </g>
-                </svg>
-              </div>
-              <h1 class="text-white up mb-0">Search and Discover!</h1>
-              <p class="lead up">Website visitors</p>
-              <button type="button" class="btn btn-outline-white btn-lg mt-3 up">Get Started</button>
-            </div>
-          </div>
-        </a>
-      </div>
-      <div class="col-lg-4 col-md-6">
-        <a href="javascript:;">
-          <div class="card card-background card-background-mask-primary tilt mt-md-0 mt-5" data-tilt>
-            <div class="full-background" style="background-image: url(&#39;https://images.unsplash.com/photo-1578961771886-97d51aee46bc?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1259&q=80&#39;)"></div>
-            <div class="card-body pt-7 text-center">
-              <div class="icon icon-lg up mb-5">
-                <svg width="40px" height="40px" viewBox="0 0 44 43" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                  <title>megaphone</title>
-                  <g id="Basic-Elements" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                    <g id="Rounded-Icons" transform="translate(-2168.000000, -591.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                      <g id="Icons-with-opacity" transform="translate(1716.000000, 291.000000)">
-                        <g id="megaphone" transform="translate(452.000000, 300.000000)">
-                          <path
-                            d="M35.7958333,0.273166667 C35.2558424,-0.0603712374 34.5817509,-0.0908856664 34.0138333,0.1925 L19.734,7.33333333 L9.16666667,7.33333333 C4.10405646,7.33333333 0,11.4373898 0,16.5 C0,21.5626102 4.10405646,25.6666667 9.16666667,25.6666667 L19.734,25.6666667 L34.0138333,32.8166667 C34.5837412,33.1014624 35.2606401,33.0699651 35.8016385,32.7334768 C36.3426368,32.3969885 36.6701539,31.8037627 36.6666942,31.1666667 L36.6666942,1.83333333 C36.6666942,1.19744715 36.3370375,0.607006911 35.7958333,0.273166667 Z"
-                            id="Path"></path>
-                          <path d="M38.5,11 L38.5,22 C41.5375661,22 44,19.5375661 44,16.5 C44,13.4624339 41.5375661,11 38.5,11 Z" id="Path" opacity="0.601050967"></path>
-                          <path
-                            d="M18.5936667,29.3333333 L10.6571667,29.3333333 L14.9361667,39.864 C15.7423448,41.6604248 17.8234451,42.4993948 19.6501416,41.764381 C21.4768381,41.0293672 22.3968823,38.982817 21.7341667,37.1286667 L18.5936667,29.3333333 Z"
-                            id="Path" opacity="0.601050967"></path>
-                        </g>
-                      </g>
-                    </g>
-                  </g>
-                </svg>
-              </div>
-              <h1 class="text-white up mb-0">Find music and play it!</h1>
-              <p class="lead up">Music search</p>
-              <button type="button" class="btn btn-outline-white btn-lg mt-3 up">Get Started</button>
-            </div>
-          </div>
-        </a>
-      </div>
-      <div class="col-lg-4 col-md-6 mx-md-auto">
-        <a href="javascript:;">
-          <div class="card card-background card-background-mask-primary tilt mt-lg-0 mt-5" data-tilt>
-            <div class="full-background" style="background-image: url(&#39;https://images.unsplash.com/photo-1555538284-0649b24e48ab?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=933&q=80&#39;)"></div>
-            <div class="card-body pt-7 text-center">
-              <div class="icon icon-lg up mb-5">
-                <svg width="40px" height="40px" viewBox="0 0 46 42" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                    <title>customer-support</title>
-                    <g id="Basic-Elements" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                        <g id="Rounded-Icons" transform="translate(-1717.000000, -291.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                            <g id="Icons-with-opacity" transform="translate(1716.000000, 291.000000)">
-                                <g id="customer-support" transform="translate(1.000000, 0.000000)">
-                                    <path d="M45,0 L26,0 C25.447,0 25,0.447 25,1 L25,20 C25,20.379 25.214,20.725 25.553,20.895 C25.694,20.965 25.848,21 26,21 C26.212,21 26.424,20.933 26.6,20.8 L34.333,15 L45,15 C45.553,15 46,14.553 46,14 L46,1 C46,0.447 45.553,0 45,0 Z" id="Path" opacity="0.59858631"></path>
-                                    <path d="M22.883,32.86 C20.761,32.012 17.324,31 13,31 C8.676,31 5.239,32.012 3.116,32.86 C1.224,33.619 0,35.438 0,37.494 L0,41 C0,41.553 0.447,42 1,42 L25,42 C25.553,42 26,41.553 26,41 L26,37.494 C26,35.438 24.776,33.619 22.883,32.86 Z" id="Path"></path>
-                                    <path d="M13,28 C17.432,28 21,22.529 21,18 C21,13.589 17.411,10 13,10 C8.589,10 5,13.589 5,18 C5,22.529 8.568,28 13,28 Z" id="Path"></path>
-                                </g>
-                            </g>
-                        </g>
-                    </g>
-                </svg>
-              </div>
-                <h1 class="text-white up mb-0">Check bugs and fix!</h1>
-                <p class="lead up">Support requests</p>
-                <button type="button" class="btn btn-outline-white btn-lg mt-3 up">Get Started</button>
-              </div>
-            </div>
-        </a>
-      </div>
-    </div>
-  </div>
-</section>
-<!-- END Project section w/ 3 images & quote & text -->
-
-
-
-
-
-
-
-
-
-

Project 4

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-5 bg-gray-200">
-  <div class="container">
-    <div class="row">
-      <div class="col-md-8 ms-auto me-auto text-center">
-        <h3>Some of Our Awesome Products</h3>
-        <p>You get rewarded for unique knowledge, not for effort. Effort is required to create unique knowledge.</p>
-      </div>
-    </div>
-    <div class="row mt-5">
-      <div class="col-lg-4 col-md-6 mb-5">
-        <div class="card">
-          <div class="card-body border-radius-lg position-relative overflow-hidden pb-4 px-5">
-            <img class="w-25 mb-3 ms-n2" src="../../assets/img/logos/small-logos/logo-slack.svg">
-            <h5 class="mt-2">Slack bot</h5>
-            <p class="mb-3">If everything I did failed - which it doesn&#39;t, it actually succeeds - just the fact that I&#39;m willing to fail is an inspiration. People are so scared to lose that they don&#39;t even try. And this is sad.</p>
-            <a href="javascript:;" class="font-weight-bold text-xs text-uppercase font-weight-bolder text-info icon-move-right">
-              Check more
-              <i class="fas fa-arrow-right text-xs ms-1"></i>
-            </a>
-          </div>
-        </div>
-      </div>
-
-      <div class="col-lg-4 col-md-6 mb-5">
-        <div class="card">
-          <div class="card-body border-radius-lg position-relative overflow-hidden pb-4 px-5">
-            <img class="w-25 mb-3 ms-n2" src="../../assets/img/logos/small-logos/logo-spotify.svg">
-            <h5 class="mt-2">Looking great</h5>
-            <p class="mb-3">You have the opportunity to play this game of life you need to appreciate every moment. A lot of people don’t appreciate the moment until it’s motivating the doers.</p>
-            <a href="javascript:;" class="font-weight-bold text-xs text-uppercase font-weight-bolder text-success icon-move-right">
-              See details
-              <i class="fas fa-arrow-right text-xs ms-1"></i>
-            </a>
-          </div>
-        </div>
-      </div>
-
-      <div class="col-lg-4 col-md-6 mb-5">
-        <div class="card">
-          <div class="card-body border-radius-lg position-relative overflow-hidden pb-4 px-5">
-            <img class="w-25 mb-3 ms-n2" src="../../assets/img/logos/small-logos/logo-asana.svg">
-            <h5 class="mt-2">Developer First</h5>
-            <p class="mb-3">For standing out. But the time is now to be okay to be the greatest you. Would you believe in what you believe in, if you were the only one who believed it? What do you think?</p>
-            <a href="javascript:;" class="font-weight-bold text-xs text-uppercase font-weight-bolder text-danger icon-move-right">
-              View journey
-              <i class="fas fa-arrow-right text-xs ms-1"></i>
-            </a>
-          </div>
-        </div>
-      </div>
-
-      <div class="col-lg-4 col-md-6 mb-5">
-        <div class="card">
-          <div class="card-body border-radius-lg position-relative overflow-hidden pb-4 px-5">
-            <img class="w-25 mb-3 ms-n2" src="../../assets/img/logos/small-logos/logo-invision.svg">
-            <h5 class="mt-2">Prepare launch</h5>
-            <p class="mb-3">Society has put up so many boundaries, so many limitations on what’s right and wrong that it’s almost impossible to get a pure thought out. It’s like a little kid, a little boy.</p>
-            <a href="javascript:;" class="font-weight-bold text-xs text-uppercase font-weight-bolder icon-move-right">
-              Check out more
-              <i class="fas fa-arrow-right text-xs ms-1"></i>
-            </a>
-          </div>
-        </div>
-      </div>
-
-      <div class="col-lg-4 col-md-6 mb-5">
-        <div class="card">
-          <div class="card-body border-radius-lg position-relative overflow-hidden pb-4 px-5">
-            <img class="w-25 mb-3 ms-n2" src="../../assets/img/logos/small-logos/logo-jira.svg">
-            <h5 class="mt-2">Premium support</h5>
-            <p class="mb-3">Pink is obviously a better color. Everyone’s born confident, and everything’s taken away from you matters is the people who are sparked by it follow their dreams, too.</p>
-            <a href="javascript:;" class="font-weight-bold text-xs text-uppercase font-weight-bolder text-info icon-move-right">
-              See all
-              <i class="fas fa-arrow-right text-xs ms-1"></i>
-            </a>
-          </div>
-        </div>
-      </div>
-
-      <div class="col-lg-4 col-md-6 mb-5">
-        <div class="card">
-          <div class="card-body border-radius-lg position-relative overflow-hidden pb-4 px-5">
-            <img class="w-25 mb-3 ms-n2" src="../../assets/img/logos/small-logos/logo-weave.svg">
-            <h5 class="mt-2">Design tools</h5>
-            <p class="mb-3">Constantly growing. We’re constantly making mistakes. We’re constantly trying to express ourselves and actualize our dreams the position that we want to be.</p>
-            <a href="javascript:;" class="font-weight-bold text-xs text-uppercase font-weight-bolder text-danger icon-move-right">
-              Find story
-              <i class="fas fa-arrow-right text-xs ms-1"></i>
-            </a>
-          </div>
-        </div>
-      </div>
-
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Project 5

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-5">
-  <div class="container">
-    <div class="row">
-      <div class="col-md-5 ms-auto me-auto text-center">
-        <div class="p-3 info-hover-warning">
-          <div class="icon icon-shape bg-gradient-primary shadow icon-shape-circle text-primary">
-            <i class="fa fa-cogs"></i>
-          </div>
-        </div>
-        <h3 class="text-gradient text-primary mb-0 mt-4">Beware The Components</h3>
-        <h3>How To Handle Them</h3>
-        <p>We’re constantly trying to express ourselves and actualize our dreams. Don&#39;t stop.</p>
-      </div>
-    </div>
-    <div class="row mt-5">
-      <div class="col-md-4 ms-auto my-auto">
-        <a href="javascript:;">
-          <div class="card card-background tilt" data-tilt="">
-            <div class="full-background" style="background-image: url(&#39;https://images.unsplash.com/photo-1579389083395-4507e98b5e67?ixlib=rb-1.2.1&amp;ixid=eyJhcHBfaWQiOjEyMDd9&amp;auto=format&amp;fit=crop&amp;w=934&amp;q=80&#39;)"></div>
-            <div class="card-body pt-7 text-center">
-              <div class="icon icon-lg up mb-3">
-                <svg width="40px" height="40px" viewBox="0 0 40 40" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                  <title>chart-pie-35</title>
-                  <g id="Basic-Elements" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                    <g id="Rounded-Icons" transform="translate(-1720.000000, -742.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                      <g id="Icons-with-opacity" transform="translate(1716.000000, 291.000000)">
-                        <g id="chart-pie-35" transform="translate(4.000000, 451.000000)">
-                          <path d="M21.6666667,18.3333333 L39.915,18.3333333 C39.11,8.635 31.365,0.89 21.6666667,0.085 L21.6666667,18.3333333 Z" id="Path" opacity="0.602864583"></path>
-                          <path d="M20.69,21.6666667 L7.09833333,35.2583333 C10.585,38.21 15.085,40 20,40 C30.465,40 39.0633333,31.915 39.915,21.6666667 L20.69,21.6666667 Z" id="Path"></path>
-                          <path d="M18.3333333,19.31 L18.3333333,0.085 C8.085,0.936666667 0,9.535 0,20 C0,24.915 1.79,29.415 4.74166667,32.9016667 L18.3333333,19.31 Z" id="Path"></path>
-                        </g>
-                      </g>
-                    </g>
-                  </g>
-                </svg>
-              </div>
-              <h1 class="text-white up mb-0">Search and Discover!</h1>
-              <p class="lead up">Website visitors</p>
-              <button type="button" class="btn btn-white btn-lg mt-3 up">Get Started</button>
-            </div>
-          </div>
-        </a>
-      </div>
-
-      <div class="col-md-5 me-auto my-auto ms-5">
-        <div class="p-3 info-horizontal d-flex">
-          <div>
-            <h5>1. Listen to Social Conversations</h5>
-            <p>
-              Gain access to the demographics, psychographics, and location of unique people who are interested and talk about your brand.
-            </p>
-          </div>
-        </div>
-
-        <div class="p-3 info-horizontal d-flex">
-          <div>
-            <h5>2. Performance Analyze</h5>
-            <p>
-              Unify data from Facebook, Instagram, Twitter, LinkedIn, and Youtube to gain rich insights from easy-to-use reports.
-            </p>
-          </div>
-        </div>
-
-        <div class="p-3 info-horizontal d-flex">
-          <div>
-            <h5>3. Social Conversions</h5>
-            <p>
-              Track actions taken on your website that originated from social, and understand the impact on your bottom line.
-            </p>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <hr class="dark my-6 mx-7">
-    <div class="row">
-      <div class="col-md-5 ms-auto my-auto">
-        <div class="p-3 info-horizontal d-flex">
-          <div>
-            <h5>1. Always In Sync</h5>
-            <p>
-              No matter where you are, Trello stays in sync across all of your devices.
-            </p>
-          </div>
-        </div>
-
-        <div class="p-3 info-horizontal d-flex">
-          <div>
-            <h5>2. Work With Any Team</h5>
-            <p>
-              Whether it’s for work or even the next family vacation, Trello helps your team.
-            </p>
-          </div>
-        </div>
-
-        <div class="p-3 info-horizontal d-flex">
-          <div>
-            <h5>3. A Productivity Platform</h5>
-            <p>
-              Integrate the apps your team already uses directly into your workflow.
-            </p>
-          </div>
-        </div>
-      </div>
-
-      <div class="col-md-4 me-auto my-auto ms-5">
-        <a href="javascript:;">
-          <div class="card card-background tilt" data-tilt="">
-            <div class="full-background" style="background-image: url(&#39;https://images.unsplash.com/photo-1523908511403-7fc7b25592f4?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=2100&q=80&#39;)"></div>
-            <div class="card-body pt-7 text-center">
-              <div class="icon icon-lg up mb-3">
-                <svg width="40px" height="40px" viewBox="0 0 46 42" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                    <title>customer-support</title>
-                    <g id="Basic-Elements" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                        <g id="Rounded-Icons" transform="translate(-1717.000000, -291.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                            <g id="Icons-with-opacity" transform="translate(1716.000000, 291.000000)">
-                                <g id="customer-support" transform="translate(1.000000, 0.000000)">
-                                    <path d="M45,0 L26,0 C25.447,0 25,0.447 25,1 L25,20 C25,20.379 25.214,20.725 25.553,20.895 C25.694,20.965 25.848,21 26,21 C26.212,21 26.424,20.933 26.6,20.8 L34.333,15 L45,15 C45.553,15 46,14.553 46,14 L46,1 C46,0.447 45.553,0 45,0 Z" id="Path" opacity="0.59858631"></path>
-                                    <path d="M22.883,32.86 C20.761,32.012 17.324,31 13,31 C8.676,31 5.239,32.012 3.116,32.86 C1.224,33.619 0,35.438 0,37.494 L0,41 C0,41.553 0.447,42 1,42 L25,42 C25.553,42 26,41.553 26,41 L26,37.494 C26,35.438 24.776,33.619 22.883,32.86 Z" id="Path"></path>
-                                    <path d="M13,28 C17.432,28 21,22.529 21,18 C21,13.589 17.411,10 13,10 C8.589,10 5,13.589 5,18 C5,22.529 8.568,28 13,28 Z" id="Path"></path>
-                                </g>
-                            </g>
-                        </g>
-                    </g>
-                </svg>
-              </div>
-              <h1 class="text-white up mb-0">Talk and Meet!</h1>
-              <p class="lead up">Social activities</p>
-              <button type="button" class="btn btn-white btn-lg mt-3 up">Get Started</button>
-            </div>
-          </div>
-        </a>
-      </div>
-
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Project 6

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-5 bg-gray-200">
-  <div class="container">
-    <div class="row">
-      <div class="col-md-8 me-auto text-left">
-        <h3>Projects</h3>
-        <p>See all our projects</p>
-      </div>
-    </div>
-    <div class="row mt-lg-4 mt-2">
-      <div class="col-lg-4 col-md-6 mb-4">
-        <div class="card">
-          <div class="card-body p-3">
-            <div class="d-flex">
-              <div class="avatar avatar-xl bg-gradient-dark border-radius-md p-2">
-                <img src="../../assets/img/logos/small-logos/logo-slack.svg">
-              </div>
-              <div class="ms-3 my-auto">
-                <h6>Slack Bot</h6>
-                <div class="avatar-group">
-                  <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-toggle="tooltip" data-original-title="Jessica Rowland">
-                    <img alt="Image placeholder" src="../../assets/img/team-3.jpg" class="">
-                  </a>
-                  <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-toggle="tooltip" data-original-title="Audrey Love">
-                    <img alt="Image placeholder" src="../../assets/img/team-4.jpg" class="rounded-circle">
-                  </a>
-                  <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-toggle="tooltip" data-original-title="Michael Lewis">
-                    <img alt="Image placeholder" src="../../assets/img/team-2.jpg" class="rounded-circle">
-                  </a>
-                  <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-toggle="tooltip" data-original-title="Jessica Rowland">
-                    <img alt="Image placeholder" src="../../assets/img/team-3.jpg" class="">
-                  </a>
-                  <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-toggle="tooltip" data-original-title="Audrey Love">
-                    <img alt="Image placeholder" src="../../assets/img/team-4.jpg" class="rounded-circle">
-                  </a>
-                </div>
-              </div>
-              <div class="ms-auto">
-                <div class="dropdown">
-                  <button class="btn btn-link text-secondary ps-0 pe-2" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-                    <i class="fa fa-ellipsis-v text-lg"></i>
-                  </button>
-                  <div class="dropdown-menu ms-n4" aria-labelledby="navbarDropdownMenuLink">
-                    <a class="dropdown-item" href="javascript:;">Action</a>
-                    <a class="dropdown-item" href="javascript:;">Another action</a>
-                    <a class="dropdown-item" href="javascript:;">Something else here</a>
-                  </div>
-                </div>
-              </div>
-            </div>
-            <p class="text-sm mt-3"> If everything I did failed - which it doesn&#39;t, it actually succeeds. </p>
-            <hr class="horizontal dark">
-            <div class="row">
-              <div class="col-6">
-                <h6 class="text-sm mb-0">5</h6>
-                <p class="text-secondary text-sm font-weight-bold mb-0">Participants</p>
-              </div>
-              <div class="col-6 text-right">
-                <h6 class="text-sm mb-0">02.03.22</h6>
-                <p class="text-secondary text-sm font-weight-bold mb-0">Due date</p>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <div class="col-lg-4 col-md-6 mb-4">
-        <div class="card">
-          <div class="card-body p-3">
-            <div class="d-flex">
-              <div class="avatar avatar-xl bg-gradient-dark border-radius-md p-2">
-                <img src="../../assets/img/logos/small-logos/logo-spotify.svg">
-              </div>
-              <div class="ms-3 my-auto">
-                <h6>Premium support</h6>
-                <div class="avatar-group">
-                  <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-toggle="tooltip" data-original-title="Audrey Love">
-                    <img alt="Image placeholder" src="../../assets/img/team-4.jpg" class="rounded-circle">
-                  </a>
-                  <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-toggle="tooltip" data-original-title="Jessica Rowland">
-                    <img alt="Image placeholder" src="../../assets/img/team-3.jpg" class="">
-                  </a>
-                  <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-toggle="tooltip" data-original-title="Michael Lewis">
-                    <img alt="Image placeholder" src="../../assets/img/team-2.jpg" class="rounded-circle">
-                  </a>
-                </div>
-              </div>
-              <div class="ms-auto">
-                <div class="dropdown">
-                  <button class="btn btn-link text-secondary ps-0 pe-2" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-                    <i class="fa fa-ellipsis-v text-lg"></i>
-                  </button>
-                  <div class="dropdown-menu ms-n4" aria-labelledby="navbarDropdownMenuLink">
-                    <a class="dropdown-item" href="javascript:;">Action</a>
-                    <a class="dropdown-item" href="javascript:;">Another action</a>
-                    <a class="dropdown-item" href="javascript:;">Something else here</a>
-                  </div>
-                </div>
-              </div>
-            </div>
-            <p class="text-sm mt-3"> Pink is obviously a better color. Everyone’s born confident, and everything’s taken away from you. </p>
-            <hr class="horizontal dark">
-            <div class="row">
-              <div class="col-6">
-                <h6 class="text-sm mb-0">3</h6>
-                <p class="text-secondary text-sm font-weight-bold mb-0">Participants</p>
-              </div>
-              <div class="col-6 text-right">
-                <h6 class="text-sm mb-0">22.11.21</h6>
-                <p class="text-secondary text-sm font-weight-bold mb-0">Due date</p>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <div class="col-lg-4 col-md-6 mb-4">
-        <div class="card">
-          <div class="card-body p-3">
-            <div class="d-flex">
-              <div class="avatar avatar-xl bg-gradient-dark border-radius-md p-2">
-                <img src="../../assets/img/logos/small-logos/logo-xd.svg">
-              </div>
-              <div class="ms-3 my-auto">
-                <h6>Design tools</h6>
-                <div class="avatar-group">
-                  <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-toggle="tooltip" data-original-title="Audrey Love">
-                    <img alt="Image placeholder" src="../../assets/img/team-4.jpg" class="rounded-circle">
-                  </a>
-                  <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-toggle="tooltip" data-original-title="Michael Lewis">
-                    <img alt="Image placeholder" src="../../assets/img/team-2.jpg" class="rounded-circle">
-                  </a>
-                  <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-toggle="tooltip" data-original-title="Jessica Rowland">
-                    <img alt="Image placeholder" src="../../assets/img/team-3.jpg" class="">
-                  </a>
-                  <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-toggle="tooltip" data-original-title="Jessica Rowland">
-                    <img alt="Image placeholder" src="../../assets/img/team-4.jpg" class="">
-                  </a>
-                </div>
-              </div>
-              <div class="ms-auto">
-                <div class="dropdown">
-                  <button class="btn btn-link text-secondary ps-0 pe-2" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-                    <i class="fa fa-ellipsis-v text-lg"></i>
-                  </button>
-                  <div class="dropdown-menu ms-n4" aria-labelledby="navbarDropdownMenuLink">
-                    <a class="dropdown-item" href="javascript:;">Action</a>
-                    <a class="dropdown-item" href="javascript:;">Another action</a>
-                    <a class="dropdown-item" href="javascript:;">Something else here</a>
-                  </div>
-                </div>
-              </div>
-            </div>
-            <p class="text-sm mt-3"> Constantly growing. We’re constantly making mistakes. </p>
-            <hr class="horizontal dark">
-            <div class="row">
-              <div class="col-6">
-                <h6 class="text-sm mb-0">4</h6>
-                <p class="text-secondary text-sm font-weight-bold mb-0">Participants</p>
-              </div>
-              <div class="col-6 text-right">
-                <h6 class="text-sm mb-0">06.03.20</h6>
-                <p class="text-secondary text-sm font-weight-bold mb-0">Due date</p>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <div class="col-lg-4 col-md-6 mb-4">
-        <div class="card">
-          <div class="card-body p-3">
-            <div class="d-flex">
-              <div class="avatar avatar-xl bg-gradient-dark border-radius-md p-2">
-                <img src="../../assets/img/logos/small-logos/logo-asana.svg">
-              </div>
-              <div class="ms-3 my-auto">
-                <h6>Looking great</h6>
-                <div class="avatar-group">
-                  <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-toggle="tooltip" data-original-title="Jessica Rowland">
-                    <img alt="Image placeholder" src="../../assets/img/team-3.jpg" class="">
-                  </a>
-                  <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-toggle="tooltip" data-original-title="Audrey Love">
-                    <img alt="Image placeholder" src="../../assets/img/team-4.jpg" class="rounded-circle">
-                  </a>
-                  <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-toggle="tooltip" data-original-title="Michael Lewis">
-                    <img alt="Image placeholder" src="../../assets/img/team-2.jpg" class="rounded-circle">
-                  </a>
-                  <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-toggle="tooltip" data-original-title="Jessica Rowland">
-                    <img alt="Image placeholder" src="../../assets/img/team-3.jpg" class="">
-                  </a>
-                  <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-toggle="tooltip" data-original-title="Audrey Love">
-                    <img alt="Image placeholder" src="../../assets/img/team-4.jpg" class="rounded-circle">
-                  </a>
-                  <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-toggle="tooltip" data-original-title="Michael Lewis">
-                    <img alt="Image placeholder" src="../../assets/img/team-2.jpg" class="rounded-circle">
-                  </a>
-                </div>
-              </div>
-              <div class="ms-auto">
-                <div class="dropdown">
-                  <button class="btn btn-link text-secondary ps-0 pe-2" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-                    <i class="fa fa-ellipsis-v text-lg"></i>
-                  </button>
-                  <div class="dropdown-menu ms-n4" aria-labelledby="navbarDropdownMenuLink">
-                    <a class="dropdown-item" href="javascript:;">Action</a>
-                    <a class="dropdown-item" href="javascript:;">Another action</a>
-                    <a class="dropdown-item" href="javascript:;">Something else here</a>
-                  </div>
-                </div>
-              </div>
-            </div>
-            <p class="text-sm mt-3"> You have the opportunity to play this game of life you need to appreciate every moment. </p>
-            <hr class="horizontal dark">
-            <div class="row">
-              <div class="col-6">
-                <h6 class="text-sm mb-0">6</h6>
-                <p class="text-secondary text-sm font-weight-bold mb-0">Participants</p>
-              </div>
-              <div class="col-6 text-right">
-                <h6 class="text-sm mb-0">14.03.24</h6>
-                <p class="text-secondary text-sm font-weight-bold mb-0">Due date</p>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <div class="col-lg-4 col-md-6 mb-4">
-        <div class="card">
-          <div class="card-body p-3">
-            <div class="d-flex">
-              <div class="avatar avatar-xl bg-gradient-dark border-radius-md p-2">
-                <img src="../../assets/img/logos/small-logos/logo-invision.svg">
-              </div>
-              <div class="ms-3 my-auto">
-                <h6>Developer First</h6>
-                <div class="avatar-group">
-                  <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-toggle="tooltip" data-original-title="Audrey Love">
-                    <img alt="Image placeholder" src="../../assets/img/team-4.jpg" class="rounded-circle">
-                  </a>
-                  <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-toggle="tooltip" data-original-title="Jessica Rowland">
-                    <img alt="Image placeholder" src="../../assets/img/team-3.jpg" class="">
-                  </a>
-                  <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-toggle="tooltip" data-original-title="Michael Lewis">
-                    <img alt="Image placeholder" src="../../assets/img/team-2.jpg" class="rounded-circle">
-                  </a>
-                  <a href="javascript:;" class="avatar avatar-xs rounded-circle" data-toggle="tooltip" data-original-title="Audrey Love">
-                    <img alt="Image placeholder" src="../../assets/img/team-4.jpg" class="rounded-circle">
-                  </a>
-                </div>
-              </div>
-              <div class="ms-auto">
-                <div class="dropdown">
-                  <button class="btn btn-link text-secondary ps-0 pe-2" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-                    <i class="fa fa-ellipsis-v text-lg"></i>
-                  </button>
-                  <div class="dropdown-menu ms-n4" aria-labelledby="navbarDropdownMenuLink">
-                    <a class="dropdown-item" href="javascript:;">Action</a>
-                    <a class="dropdown-item" href="javascript:;">Another action</a>
-                    <a class="dropdown-item" href="javascript:;">Something else here</a>
-                  </div>
-                </div>
-              </div>
-            </div>
-            <p class="text-sm mt-3"> For standing out. But the time is now to be okay to be the greatest you.  </p>
-            <hr class="horizontal dark">
-            <div class="row">
-              <div class="col-6">
-                <h6 class="text-sm mb-0">4</h6>
-                <p class="text-secondary text-sm font-weight-bold mb-0">Participants</p>
-              </div>
-              <div class="col-6 text-right">
-                <h6 class="text-sm mb-0">16.01.22</h6>
-                <p class="text-secondary text-sm font-weight-bold mb-0">Due date</p>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <div class="col-lg-4 col-md-6 mb-4">
-        <div class="card h-100">
-          <div class="card-body d-flex flex-column justify-content-center text-center">
-            <a href="javascript:;">
-              <i class="fa fa-plus text-secondary mb-3"></i>
-              <h5 class=" text-secondary"> New project </h5>
-            </a>
-          </div>
-        </div>
-      </div>
-
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
- - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/sections/page-sections/blog-posts.html b/sections/page-sections/blog-posts.html deleted file mode 100644 index 504251e4..00000000 --- a/sections/page-sections/blog-posts.html +++ /dev/null @@ -1,3116 +0,0 @@ - - - - - - - - - - - Soft UI Design System by Creative Tim - - - - - - - - - - - - - - - - - - - -
-
-
-
- -

Blog Posts

-
-
-
-
-
-

Blog 1

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-3">
-  <div class="container">
-    <div class="row">
-      <div class="col-lg-6 mx-auto">
-        <div class="p-3 text-center mb-5">
-          <div class="icon icon-shape icon-lg bg-gradient-primary shadow mx-auto">
-            <i class="fas fa-user"></i>
-          </div>
-          <h2 class="mt-3">Check out what&#39;s new</h2>
-          <p>We get insulted by others, lose trust for those others. We get back freezes every winter</p>
-        </div>
-      </div>
-    </div>
-    <div class="row mb-5">
-      <div class="col-lg-4 col-md-6">
-        <div class="card card-background align-items-start h-100">
-          <div class="full-background" style="background-image: url(https://images.unsplash.com/photo-1503188991764-408493f288b9?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&auto=format&fit=crop&w=932&q=80)"></div>
-          <div class="card-body z-index-3">
-            <div class="icon icon-md">
-              <svg width="30px" height="30px" viewBox="0 0 40 40" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                <title>spaceship</title>
-                <g id="Basic-Elements" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                  <g id="Rounded-Icons" transform="translate(-1720.000000, -592.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                    <g id="Icons-with-opacity" transform="translate(1716.000000, 291.000000)">
-                      <g id="spaceship" transform="translate(4.000000, 301.000000)">
-                        <path d="M39.3,0.706666667 C38.9660984,0.370464027 38.5048767,0.192278529 38.0316667,0.216666667 C14.6516667,1.43666667 6.015,22.2633333 5.93166667,22.4733333 C5.68236407,23.0926189 5.82664679,23.8009159 6.29833333,24.2733333 L15.7266667,33.7016667 C16.2013871,34.1756798 16.9140329,34.3188658 17.535,34.065 C17.7433333,33.98 38.4583333,25.2466667 39.7816667,1.97666667 C39.8087196,1.50414529 39.6335979,1.04240574 39.3,0.706666667 Z M25.69,19.0233333 C24.7367525,19.9768687 23.3029475,20.2622391 22.0572426,19.7463614 C20.8115377,19.2304837 19.9992882,18.0149658 19.9992882,16.6666667 C19.9992882,15.3183676 20.8115377,14.1028496 22.0572426,13.5869719 C23.3029475,13.0710943 24.7367525,13.3564646 25.69,14.31 C26.9912731,15.6116662 26.9912731,17.7216672 25.69,19.0233333 L25.69,19.0233333 Z" id="Shape"></path>
-                        <path d="M1.855,31.4066667 C3.05106558,30.2024182 4.79973884,29.7296005 6.43969145,30.1670277 C8.07964407,30.6044549 9.36054508,31.8853559 9.7979723,33.5253085 C10.2353995,35.1652612 9.76258177,36.9139344 8.55833333,38.11 C6.70666667,39.9616667 0,40 0,40 C0,40 0,33.2566667 1.855,31.4066667 Z" id="Path"></path>
-                        <path d="M17.2616667,3.90166667 C12.4943643,3.07192755 7.62174065,4.61673894 4.20333333,8.04166667 C3.31200265,8.94126033 2.53706177,9.94913142 1.89666667,11.0416667 C1.5109569,11.6966059 1.61721591,12.5295394 2.155,13.0666667 L5.47,16.3833333 C8.55036617,11.4946947 12.5559074,7.25476565 17.2616667,3.90166667 L17.2616667,3.90166667 Z" id="color-2" opacity="0.598539807"></path>
-                        <path d="M36.0983333,22.7383333 C36.9280725,27.5056357 35.3832611,32.3782594 31.9583333,35.7966667 C31.0587397,36.6879974 30.0508686,37.4629382 28.9583333,38.1033333 C28.3033941,38.4890431 27.4704606,38.3827841 26.9333333,37.845 L23.6166667,34.53 C28.5053053,31.4496338 32.7452344,27.4440926 36.0983333,22.7383333 L36.0983333,22.7383333 Z" id="color-3" opacity="0.598539807"></path>
-                      </g>
-                    </g>
-                  </g>
-                </g>
-              </svg>
-            </div>
-          </div>
-          <div class="card-footer pb-3 pt-2 z-index-3">
-            <h4 class="text-white mb-1">Nature&#39;s Light</h4>
-            <p class="text-white text-xs font-weight-bolder text-uppercase opacity-7">450 spots</p>
-          </div>
-          <span class="mask bg-gradient-primary border-radius-xl z-index-2 opacity-6"></span>
-        </div>
-      </div>
-      <div class="col-lg-4 col-md-6 d-flex flex-column">
-        <div class="card h-100 card-background align-items-start">
-          <div class="full-background" style="background-image: url(&#39;https://images.unsplash.com/photo-1530244534845-4a0c319f41e3?ixid=MXwxMjA3fDB8MHxzZWFyY2h8Mzl8fGN1bHR1cmFsfGVufDB8fDB8&ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=60&#39;)"></div>
-          <div class="card-body z-index-3">
-            <div class="icon icon-md">
-              <svg width="30px" height="30px" viewBox="0 0 44 43" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                <title>megaphone</title>
-                <g id="Basic-Elements" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                  <g id="Rounded-Icons" transform="translate(-2168.000000, -591.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                    <g id="Icons-with-opacity" transform="translate(1716.000000, 291.000000)">
-                      <g id="megaphone" transform="translate(452.000000, 300.000000)">
-                        <path d="M35.7958333,0.273166667 C35.2558424,-0.0603712374 34.5817509,-0.0908856664 34.0138333,0.1925 L19.734,7.33333333 L9.16666667,7.33333333 C4.10405646,7.33333333 0,11.4373898 0,16.5 C0,21.5626102 4.10405646,25.6666667 9.16666667,25.6666667 L19.734,25.6666667 L34.0138333,32.8166667 C34.5837412,33.1014624 35.2606401,33.0699651 35.8016385,32.7334768 C36.3426368,32.3969885 36.6701539,31.8037627 36.6666942,31.1666667 L36.6666942,1.83333333 C36.6666942,1.19744715 36.3370375,0.607006911 35.7958333,0.273166667 Z" id="Path"></path>
-                        <path d="M38.5,11 L38.5,22 C41.5375661,22 44,19.5375661 44,16.5 C44,13.4624339 41.5375661,11 38.5,11 Z" id="Path" opacity="0.601050967"></path>
-                        <path d="M18.5936667,29.3333333 L10.6571667,29.3333333 L14.9361667,39.864 C15.7423448,41.6604248 17.8234451,42.4993948 19.6501416,41.764381 C21.4768381,41.0293672 22.3968823,38.982817 21.7341667,37.1286667 L18.5936667,29.3333333 Z" id="Path" opacity="0.601050967"></path>
-                      </g>
-                    </g>
-                  </g>
-                </g>
-              </svg>
-            </div>
-          </div>
-          <div class="card-footer pb-3 pt-2 z-index-3">
-            <h4 class="text-white mb-1">Cultural</h4>
-            <p class="text-white text-xs font-weight-bolder text-uppercase opacity-7">257 spots</p>
-          </div>
-          <span class="mask bg-gradient-info border-radius-xl z-index-2 opacity-6"></span>
-        </div>
-        <div class="card h-100 card-background mt-4 align-items-start">
-          <div class="full-background" style="background-image: url(&#39;https://images.unsplash.com/photo-1572710948573-8382f931b3d0?ixid=MXwxMjA3fDB8MHxzZWFyY2h8MjN8fG15a29ub3N8ZW58MHx8MHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=60&#39;)"></div>
-          <div class="card-body z-index-3">
-            <div class="icon icon-md">
-              <svg width="30px" height="30px" viewBox="0 0 46 42" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                  <title>customer-support</title>
-                  <g id="Basic-Elements" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                      <g id="Rounded-Icons" transform="translate(-1717.000000, -291.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                          <g id="Icons-with-opacity" transform="translate(1716.000000, 291.000000)">
-                              <g id="customer-support" transform="translate(1.000000, 0.000000)">
-                                  <path d="M45,0 L26,0 C25.447,0 25,0.447 25,1 L25,20 C25,20.379 25.214,20.725 25.553,20.895 C25.694,20.965 25.848,21 26,21 C26.212,21 26.424,20.933 26.6,20.8 L34.333,15 L45,15 C45.553,15 46,14.553 46,14 L46,1 C46,0.447 45.553,0 45,0 Z" id="Path" opacity="0.59858631"></path>
-                                  <path d="M22.883,32.86 C20.761,32.012 17.324,31 13,31 C8.676,31 5.239,32.012 3.116,32.86 C1.224,33.619 0,35.438 0,37.494 L0,41 C0,41.553 0.447,42 1,42 L25,42 C25.553,42 26,41.553 26,41 L26,37.494 C26,35.438 24.776,33.619 22.883,32.86 Z" id="Path"></path>
-                                  <path d="M13,28 C17.432,28 21,22.529 21,18 C21,13.589 17.411,10 13,10 C8.589,10 5,13.589 5,18 C5,22.529 8.568,28 13,28 Z" id="Path"></path>
-                              </g>
-                          </g>
-                      </g>
-                  </g>
-              </svg>
-            </div>
-          </div>
-          <div class="card-footer pb-3 pt-2 z-index-3">
-            <h4 class="text-white mb-1">Popularity</h4>
-            <p class="text-white text-xs font-weight-bolder text-uppercase opacity-7">363 spots</p>
-          </div>
-          <span class="mask bg-gradient-primary border-radius-xl z-index-2 opacity-6"></span>
-        </div>
-      </div>
-      <div class="col-lg-4 col-md-6 d-flex flex-column">
-        <div class="card card-background align-items-start">
-          <div class="full-background" style="background-image: url(&#39;https://images.unsplash.com/photo-1542396817-804fa5be8ecf?ixid=MXwxMjA3fDB8MHxzZWFyY2h8MTB8fG5ldyUyMHlvcnJrfGVufDB8fDB8&ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=60&#39;)"></div>
-          <div class="card-body z-index-3">
-            <div class="icon icon-md">
-              <svg width="30px" height="30px" viewBox="0 0 52 35" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                <title>sound-wave</title>
-                <g id="Basic-Elements" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                    <g id="Rounded-Icons" transform="translate(-2015.000000, -596.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                        <g id="Icons-with-opacity" transform="translate(1716.000000, 291.000000)">
-                            <g id="sound-wave" transform="translate(299.000000, 305.000000)">
-                                <path d="M15.2941176,30.5882353 C14.6024837,30.5882353 13.9754248,30.1667974 13.7154248,29.5210458 L8.11777778,15.5269281 L6.51189542,17.9366013 C6.19581699,18.4090196 5.66562092,18.6928105 5.09803922,18.6928105 L0,18.6928105 L0,15.2941176 L4.18888889,15.2941176 L7.08287582,10.9522876 C7.43294118,10.4288889 8.03281046,10.1467974 8.67346405,10.2045752 C9.30052288,10.2708497 9.84261438,10.6769935 10.0754248,11.263268 L15.0969935,23.8214379 L22.1696732,1.19294118 C22.3905882,0.482614379 23.0465359,0 23.7908497,0 C23.792549,0 23.792549,0 23.7942484,0 C24.5385621,0.00169934641 25.1962092,0.487712418 25.4154248,1.19973856 L31.2305882,20.1015686 L34.3267974,15.9738562 C34.6462745,15.5456209 35.1509804,15.2941176 35.6862745,15.2941176 L40.7843137,15.2941176 L40.7843137,18.6928105 L36.5359477,18.6928105 L31.9477124,24.8104575 C31.5653595,25.3202614 30.9298039,25.5717647 30.2959477,25.4647059 C29.6671895,25.3542484 29.1522876,24.9005229 28.9636601,24.2904575 L23.7772549,7.43803922 L16.9152941,29.3952941 C16.7011765,30.0818301 16.0792157,30.5593464 15.3603922,30.5865359 C15.3366013,30.5882353 15.3162092,30.5882353 15.2941176,30.5882353 Z" id="Path"></path>
-                                <path d="M26.5098039,34.6666667 C25.8181699,34.6666667 25.1911111,34.2452288 24.9311111,33.5994771 L19.3334641,19.6053595 L17.7275817,22.0150327 C17.4115033,22.487451 16.8813072,22.7712418 16.3137255,22.7712418 L11.2156863,22.7712418 L11.2156863,19.372549 L15.4045752,19.372549 L18.2985621,15.030719 C18.6486275,14.5073203 19.2484967,14.2252288 19.8891503,14.2830065 C20.5162092,14.349281 21.0583007,14.7554248 21.2911111,15.3416993 L26.3126797,27.8998693 L33.3853595,5.27137255 C33.6062745,4.56104575 34.2622222,4.07843137 35.0065359,4.07843137 C35.0082353,4.07843137 35.0082353,4.07843137 35.0099346,4.07843137 C35.7542484,4.08013072 36.4118954,4.56614379 36.6311111,5.27816993 L42.4462745,24.18 L45.5424837,20.0522876 C45.8619608,19.6240523 46.3666667,19.372549 46.9019608,19.372549 L52,19.372549 L52,22.7712418 L47.751634,22.7712418 L43.1633987,28.8888889 C42.7810458,29.3986928 42.1454902,29.6501961 41.511634,29.5431373 C40.8828758,29.4326797 40.3679739,28.9789542 40.1793464,28.3688889 L34.9929412,11.5164706 L28.1309804,33.4737255 C27.9168627,34.1602614 27.294902,34.6377778 26.5760784,34.6649673 C26.5522876,34.6666667 26.5318954,34.6666667 26.5098039,34.6666667 Z" id="Path-Copy" opacity="0.604957217"></path>
-                            </g>
-                        </g>
-                    </g>
-                </g>
-              </svg>
-            </div>
-          </div>
-          <div class="card-footer pb-3 pt-5 z-index-3">
-            <h4 class="text-white mb-1">Modern Life</h4>
-            <p class="text-white text-xs font-weight-bolder text-uppercase opacity-7">117 spots</p>
-          </div>
-          <span class="mask bg-gradient-info border-radius-xl z-index-2 opacity-6"></span>
-        </div>
-        <div class="card card-background mt-4 align-items-start">
-          <div class="full-background" style="background-image: url(&#39;https://images.unsplash.com/photo-1491438590914-bc09fcaaf77a?ixid=MXwxMjA3fDB8MHxzZWFyY2h8Mnx8bGF1Z2h8ZW58MHx8MHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=60&#39;)"></div>
-          <div class="card-body z-index-3">
-            <div class="icon icon-md">
-              <svg width="30px" height="30px" viewBox="0 0 42 44" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                    <title>time-alarm</title>
-                    <g id="Basic-Elements" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                        <g id="Rounded-Icons" transform="translate(-2319.000000, -440.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                            <g id="Icons-with-opacity" transform="translate(1716.000000, 291.000000)">
-                                <g id="time-alarm" transform="translate(603.000000, 149.000000)">
-                                    <path d="M18.8086957,4.70034783 C15.3814926,0.343541521 9.0713063,-0.410050841 4.7145,3.01715217 C0.357693695,6.44435519 -0.395898667,12.7545415 3.03130435,17.1113478 C5.53738466,10.3360568 11.6337901,5.54042955 18.8086957,4.70034783 L18.8086957,4.70034783 Z" id="Path" opacity="0.6"></path>
-                                    <path d="M38.9686957,17.1113478 C42.3958987,12.7545415 41.6423063,6.44435519 37.2855,3.01715217 C32.9286937,-0.410050841 26.6185074,0.343541521 23.1913043,4.70034783 C30.3662099,5.54042955 36.4626153,10.3360568 38.9686957,17.1113478 Z" id="Path" opacity="0.6"></path>
-                                    <path d="M34.3815652,34.7668696 C40.2057958,27.7073059 39.5440671,17.3375603 32.869743,11.0755718 C26.1954189,4.81358341 15.8045811,4.81358341 9.13025701,11.0755718 C2.45593289,17.3375603 1.79420418,27.7073059 7.61843478,34.7668696 L3.9753913,40.0506522 C3.58549114,40.5871271 3.51710058,41.2928217 3.79673036,41.8941824 C4.07636014,42.4955431 4.66004722,42.8980248 5.32153275,42.9456105 C5.98301828,42.9931963 6.61830436,42.6784048 6.98113043,42.1232609 L10.2744783,37.3434783 C16.5555112,42.3298213 25.4444888,42.3298213 31.7255217,37.3434783 L35.0188696,42.1196087 C35.6014207,42.9211577 36.7169135,43.1118605 37.53266,42.5493622 C38.3484064,41.9868639 38.5667083,40.8764423 38.0246087,40.047 L34.3815652,34.7668696 Z M30.1304348,25.5652174 L21,25.5652174 C20.49574,25.5652174 20.0869565,25.1564339 20.0869565,24.6521739 L20.0869565,15.5217391 C20.0869565,15.0174791 20.49574,14.6086957 21,14.6086957 C21.50426,14.6086957 21.9130435,15.0174791 21.9130435,15.5217391 L21.9130435,23.7391304 L30.1304348,23.7391304 C30.6346948,23.7391304 31.0434783,24.1479139 31.0434783,24.6521739 C31.0434783,25.1564339 30.6346948,25.5652174 30.1304348,25.5652174 Z" id="Shape"></path>
-                                </g>
-                            </g>
-                        </g>
-                    </g>
-                </svg>
-            </div>
-          </div>
-          <div class="card-footer pb-3 pt-2 z-index-3">
-            <h4 class="text-white mb-1">Good Vibes</h4>
-            <p class="text-white text-xs font-weight-bolder text-uppercase opacity-7">215 spots</p>
-          </div>
-          <span class="mask bg-gradient-primary border-radius-xl z-index-2 opacity-6"></span>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Blog 2

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- START Blogs w/ 3 images & quote & text -->
-<section class="py-5">
-  <div class="container">
-    <div class="row">
-        <div class="col-md-6 position-relative">
-          <div class="position-relative ms-md-5 me-md-n5">
-            <div class="blur-shadow-image">
-              <img class="image-left rounded-3 img-fluid position-relative top-0 end-0 bg-cover" src="../../assets/img/curved-images/curved5-small.jpg">
-            </div>
-          </div>
-
-          <p class="blockquote border border-primary rounded w-50 p-3 text-sm text-primary float-md-right mt-4 me-md-n2 mx-auto">"Over the span of the satellite record, Arctic sea ice has been declining significantly, while sea ice in the Antarctichas increased very slightly"
-              <br>
-              <br>
-              <small>-NOAA</small>
-          </p>
-          <!-- Second image on the left side of the article -->
-          <div class="position-absolute bottom-0 mb-10 ms-n2 me-3 start-0 end-2 d-md-block d-none">
-            <div class="blur-shadow-image">
-              <img class="image-container rounded-3 img-fluid position-relative bg-cover" src="../../assets/img/curved-images/curved11-small.jpg">
-            </div>
-          </div>
-
-        </div>
-        <div class="col-md-5">
-            <!-- First image on the right side, above the article -->
-            <div class="position-relative ms-n4 mb-5 mt-8 d-md-block d-none">
-              <div class="blur-shadow-image">
-                <img class="image-right rounded-3 img-fluid position-relative bg-cover" src="../../assets/img/curved-images/curved6-small.jpg">
-              </div>
-            </div>
-            <h3 class="mb-4">So what does the new record for the lowest level of winter ice actually mean</h3>
-            <p>The Arctic Ocean freezes every winter and much of the sea-ice then thaws every summer, and that process will continue whatever happens with climate change. Even if the Arctic continues to be one of the fastest-warming regions of the world, it will always be plunged into bitterly cold polar dark every winter. And year-by-year, for all kinds of natural reasons, there’s huge variety of the state of the ice.
-            </p>
-            <p>
-                For a start, it does not automatically follow that a record amount of ice will melt this summer. More important for determining the size of the annual thaw is the state of the weather as the midnight sun approaches and temperatures rise. But over the more than 30 years of satellite records, scientists have observed a clear pattern of decline, decade-by-decade.
-            </p>
-            <p>The Arctic Ocean freezes every winter and much of the sea-ice then thaws every summer, and that process will continue whatever happens with climate change. Even if the Arctic continues to be one of the fastest-warming regions of the world, it will always be plunged into bitterly cold polar dark every winter. And year-by-year, for all kinds of natural reasons, there’s huge variety of the state of the ice.
-            </p>
-        </div>
-    </div>
-</div>
-</section>
-<!-- END Blogs w/ 3 images & quote & text -->
-
-
-
-
-
-
-
-
-
-

Blog 3

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-5">
-  <div class="container">
-    <div class="row">
-      <div class="col-lg-12">
-        <div class="row">
-          <div class="col-lg-6 justify-content-center d-flex flex-column">
-            <div class="card rounded-3">
-              <div class="d-block blur-shadow-image">
-                <img src="https://images.unsplash.com/photo-1497215728101-856f4ea42174?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&auto=format&fit=crop&w=2100&q=80" alt="img-blur-shadow-blog-2" class="img-fluid shadow rounded-3">
-              </div>
-            </div>
-          </div>
-          <div class="col-lg-6 justify-content-center d-flex flex-column ps-lg-5 pt-lg-0 pt-3">
-            <h6 class="category text-info mt-3">Coworking</h6>
-            <h3>
-              <a href="javascript:;" class="text-darker">Warner Music Group buys concert discovery service Songkick</a>
-            </h3>
-            <p>
-              Warner Music Group announced today it’s acquiring the selected assets of the music platform Songkick, including its app for finding concerts and the company’s trademark. Songkick has been involved in a lawsuit against the major… <a href="javascript:;" class="text-darker icon-move-right text-sm">Read More
-                <i class="fas fa-arrow-right text-xs ms-1"></i>
-              </a>
-            </p>
-            <p class="author">
-              by <a href="javascript:;" class="ms-1"><span class="font-weight-bold text-info">Sarah Perez</span></a>, 2 days ago
-            </p>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-12 mt-5">
-        <div class="row flex-row-reverse">
-          <div class="col-lg-6 justify-content-center d-flex flex-column">
-            <div class="card rounded-3">
-              <div class="blur-shadow-image">
-                <img src="https://images.unsplash.com/photo-1595446757331-795d866924a9?ixid=MXwxMjA3fDB8MHxzZWFyY2h8MTB8fGhvbWUlMjBkZXNpZ258ZW58MHx8MHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=800&q=60" alt="img-blur-shadow-blog-2" class="img-fluid shadow rounded-3">
-              </div>
-            </div>
-          </div>
-          <div class="col-lg-6 pe-lg-5 justify-content-center d-flex flex-column pt-lg-0 pt-3">
-            <h6 class="category text-info mt-3">House</h6>
-            <h3>
-              <a href="javascript:;" class="text-darker">Warner Music Group buys concert discovery service Songkick</a>
-            </h3>
-            <p>
-              Warner Music Group announced today it’s acquiring the selected assets of the music platform Songkick, including its app for finding concerts and the company’s trademark. Songkick has been involved in a lawsuit against the major… <a href="javascript:;" class="text-darker icon-move-right text-sm">Read More
-                <i class="fas fa-arrow-right text-xs ms-1"></i>
-              </a>
-            </p>
-            <p class="author">
-              by <a href="javascript:;" class="ms-1"><span class="font-weight-bold text-info">Millie Borough</span></a>, 10 days ago
-            </p>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Blog 4

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="pt-5 pb-0">
-  <div class="container">
-    <div class="row">
-      <div class="col-lg-4 col-md-6">
-        <div class="card card-blog card-plain">
-          <div class="position-relative">
-            <a class="d-block blur-shadow-image">
-              <img src="https://images.unsplash.com/photo-1494526585095-c41746248156?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=2250&q=80" alt="img-blur-shadow" class="img-fluid shadow border-radius-lg">
-            </a>
-          </div>
-          <div class="card-body px-1 pt-3">
-            <p class="text-gradient text-dark mb-2 text-sm">Entire Apartment • 3 Guests • 2 Beds</p>
-            <a href="javascript:;">
-              <h5>
-                Lovely and cosy apartment
-              </h5>
-            </a>
-            <p>
-              Siri&#39;s latest trick is offering a hands-free TV viewing experience, that will allow consumers to turn on or off their television, change inputs, fast forward.
-            </p>
-            <button type="button" class="btn btn-outline-primary btn-sm">From / Night</button>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-4 col-md-6">
-        <div class="card card-blog card-plain">
-          <div class="position-relative">
-            <a class="d-block blur-shadow-image">
-              <img src="https://images.unsplash.com/photo-1551882547-ff40c63fe5fa?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2100&q=80" alt="img-blur-shadow" class="img-fluid shadow border-radius-lg">
-            </a>
-          </div>
-          <div class="card-body px-1 pt-3">
-            <p class="text-gradient text-dark mb-2 text-sm">Private Room • 1 Guests • 1 Sofa</p>
-            <a href="javascript:;">
-              <h5>
-                Single room in the center of the city
-              </h5>
-            </a>
-            <p>
-              As Uber works through a huge amount of internal management turmoil, the company is also consolidating and rationalizing more of its international business.
-            </p>
-            <button type="button" class="btn btn-outline-primary btn-sm">From / Night</button>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-4 col-md-6">
-        <div class="card card-blog card-plain">
-          <div class="position-relative">
-            <a class="d-block blur-shadow-image">
-              <img src="https://images.unsplash.com/photo-1570544820979-6eb25385944d?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&auto=format&fit=crop&w=2250&q=80" alt="img-blur-shadow" class="img-fluid shadow border-radius-lg">
-            </a>
-          </div>
-          <div class="card-body px-1 pt-3">
-            <p class="text-gradient text-dark mb-2 text-sm">Entire Apartment • 4 Guests • 2 Beds</p>
-            <a href="javascript:;">
-              <h5>
-                Independent house bedroom kitchen
-              </h5>
-            </a>
-            <p>
-              Music is something that every person has his or her own specific opinion about. Different people have different taste, and various types of music.
-            </p>
-            <button type="button" class="btn btn-outline-primary btn-sm">From / Night</button>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-4 col-md-6">
-        <div class="card card-blog card-plain">
-          <div class="position-relative">
-            <a class="d-block blur-shadow-image">
-              <img src="https://images.unsplash.com/photo-1509600110300-21b9d5fedeb7?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&auto=format&fit=crop&w=2250&q=80" alt="img-blur-shadow" class="img-fluid shadow border-radius-lg">
-            </a>
-          </div>
-          <div class="card-body px-1 pt-3">
-            <p class="text-gradient text-dark mb-2 text-sm">Entire Apartment • 2 Guests • 1 Bed</p>
-            <a href="javascript:;">
-              <h5>
-                Zen Gateway with pool and garden
-              </h5>
-            </a>
-            <p>
-              Fast forward, rewind and more, without having to first invoke a specific skill, or even
-              press a button on their remote.
-            </p>
-            <button type="button" class="btn btn-outline-primary btn-sm">From / Night</button>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-4 col-md-6">
-        <div class="card card-blog card-plain">
-          <div class="position-relative">
-            <a class="d-block blur-shadow-image">
-              <img src="https://images.unsplash.com/photo-1512917774080-9991f1c4c750?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&auto=format&fit=crop&w=2250&q=80" alt="img-blur-shadow" class="img-fluid shadow border-radius-lg">
-            </a>
-          </div>
-          <div class="card-body px-1 pt-3">
-            <p class="text-gradient text-dark mb-2 text-sm">Entire Flat • 8 Guests • 3 Rooms</p>
-            <a href="javascript:;">
-              <h5>
-                Cheapest hotels for a luxury vacation
-              </h5>
-            </a>
-            <p>
-              Today, the company announced it will be combining its rides-on-demand business and UberEATS.
-            </p>
-            <button type="button" class="btn btn-outline-primary btn-sm">From / Night</button>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-4 col-md-6">
-        <div class="card card-blog card-plain">
-          <div class="position-relative">
-            <a class="d-block blur-shadow-image">
-              <img src="https://images.unsplash.com/photo-1506126279646-a697353d3166?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&auto=format&fit=crop&w=2250&q=80" alt="img-blur-shadow" class="img-fluid shadow border-radius-lg">
-            </a>
-          </div>
-          <div class="card-body px-1 pt-3">
-            <p class="text-gradient text-dark mb-2 text-sm">Entire Apartment • 2 Guests • 1 Bed</p>
-            <a href="javascript:;">
-              <h5>
-                Cozy Double Room Near Station
-              </h5>
-            </a>
-            <p>
-              Different people have different taste, and various types of music have many ways of leaving an impact on someone.
-            </p>
-            <button type="button" class="btn btn-outline-primary btn-sm">From / Night</button>
-          </div>
-        </div>
-      </div>
-      <div class="col-sm-7 ms-auto text-right">
-        <ul class="pagination pagination-primary mt-4">
-          <li class="page-item ms-auto">
-            <a class="page-link" href="javascript:;" aria-label="Previous">
-              <span aria-hidden="true"><i class="fa fa-angle-double-left" aria-hidden="true"></i></span>
-            </a>
-          </li>
-          <li class="page-item active">
-            <a class="page-link" href="javascript:;">1</a>
-          </li>
-          <li class="page-item">
-            <a class="page-link" href="javascript:;">2</a>
-          </li>
-          <li class="page-item">
-            <a class="page-link" href="javascript:;">3</a>
-          </li>
-          <li class="page-item">
-            <a class="page-link" href="javascript:;">4</a>
-          </li>
-          <li class="page-item">
-            <a class="page-link" href="javascript:;">5</a>
-          </li>
-          <li class="page-item">
-            <a class="page-link" href="javascript:;" aria-label="Next">
-              <span aria-hidden="true"><i class="fa fa-angle-double-right" aria-hidden="true"></i></span>
-            </a>
-          </li>
-        </ul>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Blog 5

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- START Blogs w/ 3 rows w/ image on left & title, text, author on end-->
-<section class="py-5">
-  <div class="container">
-    <div class="row">
-      <div class="col-md-10 ms-auto me-auto">
-        <div class="card card-plain card-blog mt-5">
-          <div class="row">
-            <div class="col-md-4">
-              <div class="card-image position-relative border-radius-lg">
-                <div class="blur-shadow-image">
-                  <img class="img border-radius-lg" src="https://images.unsplash.com/photo-1509664158680-07c5032b51e5?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&auto=format&fit=crop&w=2250&q=80">
-                </div>
-              </div>
-            </div>
-            <div class="col-md-7 my-auto ms-md-3 mt-md-auto mt-4">
-              <h3>
-                <a href="javascript:;" class="text-dark font-weight-normal">Miami raised $65 million for pet sitting</a>
-              </h3>
-              <p>
-                Finding temporary housing for your dog should be as easy as renting an Airbnb. That’s the idea behind Rover, which raised $65 million to expand its pet sitting and dog-walking businesses.. <a href="javascript:;" class="text-dark"> Read More </a>
-              </p>
-      				<div class="author">
-      				   <img src="../../assets/img/team-1.jpg" alt="..." class="avatar avatar-sm shadow me-2">
-      				   <p class="my-auto">Katie Roof</p>
-      				</div>
-            </div>
-          </div>
-        </div>
-
-        <div class="card card-plain card-blog mt-5">
-          <div class="row">
-            <div class="col-md-4">
-              <div class="card-image position-relative border-radius-lg">
-                <div class="blur-shadow-image">
-                  <img class="img border-radius-lg" src="https://images.unsplash.com/photo-1510631772931-d3246950c275?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&auto=format&fit=crop&w=2250&q=80">
-                </div>
-              </div>
-            </div>
-            <div class="col-md-7 my-auto ms-md-3 mt-md-auto mt-4">
-              <h3>
-                <a href="javascript:;" class="text-dark font-weight-normal">MateLabs mixes machine learning</a>
-              </h3>
-              <p>
-                If you’ve ever wanted to train a machine learning model and integrate it with IFTTT, a new offering from MateLabs. MateVerse, a platform where novices can spin out machine... <a href="javascript:;" class="text-dark"> Read More </a>
-              </p>
-              <div class="author">
-               <img src="../../assets/img/team-3.jpg" alt="..." class="avatar avatar-sm shadow me-2">
-               <p class="my-auto">John Mannes</p>
-              </div>
-            </div>
-          </div>
-        </div>
-
-        <div class="card card-plain card-blog mt-5">
-          <div class="row">
-            <div class="col-md-4">
-              <div class="card-image position-relative border-radius-lg">
-                <div class="blur-shadow-image">
-                  <img class="img border-radius-lg" src="https://images.unsplash.com/photo-1504309092620-4d0ec726efa4?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&auto=format&fit=crop&w=1920&q=80">
-                </div>
-              </div>
-            </div>
-            <div class="col-md-7 my-auto ms-md-3 mt-md-auto mt-4">
-              <h3>
-                  <a href="javascript:;" class="text-dark font-weight-normal">US venture investment ticks up</a>
-              </h3>
-              <p>
-                  Venture investment in U.S. startups rose sequentially in the second quarter of 2017, boosted by large, late-stage financings and a few outsized early-stage rounds in tech and healthcare.. <a href="javascript:;" class="text-dark"> Read More </a>
-              </p>
-              <div class="author">
-                 <img src="../../assets/img/team-4.jpg" alt="..." class="avatar avatar-sm shadow me-2">
-                 <p class="my-auto">Devin Coldewey</p>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-<!-- END Blogs w/ 3 rows w/ image on left & title, text, author on end-->
-
-
-
-
-
-
-
-
-
-

Blog 6

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-5 bg-gray-100">
-  <div class="container">
-    <div class="row">
-      <div class="col-lg-8 mx-auto text-center">
-        <div class="card card-blog card-plain">
-          <div class="position-relative">
-            <a class="d-block blur-shadow-image">
-              <img src="https://images.unsplash.com/photo-1584695369221-3d8a8ebfeef0?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&auto=format&fit=crop&w=1920&q=80" alt="img-blur-shadow" class="img-fluid shadow border-radius-lg">
-            </a>
-          </div>
-          <div class="card-body px-0 pt-4">
-            <p class="text-gradient text-primary text-gradient font-weight-bold text-sm text-uppercase">Enterprise</p>
-            <a href="javascript:;">
-              <h4>
-                Siri brings hands-free TV to more devices
-              </h4>
-            </a>
-            <p>
-              Siri&#39;s latest trick is offering a hands-free TV viewing experience, that will allow consumers to turn on or off their television, change inputs, fast forward, rewind and more, without having to first invoke a specific skill, or even
-              press a button on their remote.
-            </p>
-            <button type="button" class="btn bg-gradient-primary mt-3">Read more</button>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-8 mx-auto text-center mt-5">
-        <div class="card card-blog card-plain">
-          <div class="position-relative">
-            <a class="d-block blur-shadow-image">
-              <img src="https://images.unsplash.com/photo-1554446422-d05db23719d2?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=1920&q=80" alt="img-blur-shadow" class="img-fluid shadow border-radius-lg">
-            </a>
-          </div>
-          <div class="card-body px-0 pt-4">
-            <p class="text-gradient text-warning text-gradient font-weight-bold text-sm text-uppercase">Music</p>
-            <a href="javascript:;">
-              <h4>
-                Shark Week: How to Watch It Scientist
-              </h4>
-            </a>
-            <p>
-              As Uber works through a huge amount of internal management turmoil, the company is also consolidating and rationalizing more of its international business. Today, the company announced it will be combining its rides-on-demand business
-              and UberEATS.
-            </p>
-            <button type="button" class="btn bg-gradient-warning mt-3">Read more</button>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Blog 7

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-6 bg-gray-100">
-  <div class="container">
-    <div class="row">
-      <div class="col-lg-4 mb-lg-0 mb-4">
-        <div class="card">
-          <div class="card-header p-0 mx-3 mt-3 position-relative z-index-1">
-            <a href="javascript:;" class="d-block">
-              <img src="../../assets/img/blog7-1.jpg" class="img-fluid border-radius-lg">
-            </a>
-          </div>
-
-          <div class="card-body pt-3">
-            <span class="text-gradient text-warning text-uppercase text-xs font-weight-bold my-2">House</span>
-            <a href="javascript:;" class="card-title h5 d-block text-darker">
-              Shared Coworking
-            </a>
-            <p class="card-description mb-4">
-              Use border utilities to quickly style the border and border-radius of an element. Great for images, buttons.
-            </p>
-            <div class="author align-items-center">
-              <img src="../../assets/img/team-2.jpg" alt="..." class="avatar shadow">
-              <div class="name ps-3">
-                <span>Mathew Glock</span>
-                <div class="stats">
-                  <small>Posted on 28 February</small>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-4 mb-lg-0 mb-4">
-        <div class="card">
-          <div class="card-header p-0 mx-3 mt-3 position-relative z-index-1">
-            <a href="javascript:;" class="d-block">
-              <img src="../../assets/img/blog7-2.jpg" class="img-fluid border-radius-lg">
-            </a>
-          </div>
-
-          <div class="card-body pt-3">
-            <span class="text-gradient text-info text-uppercase text-xs font-weight-bold my-2">Office</span>
-            <a href="javascript:;" class="text-darker card-title h5 d-block">
-              Really Housekeeping
-            </a>
-            <p class="card-description mb-4">
-              Use border utilities to quickly style the border and border-radius of an element. Great for images, buttons.
-            </p>
-            <div class="author align-items-center">
-              <img src="../../assets/img/ivana-square.jpg" alt="..." class="avatar shadow">
-              <div class="name ps-3">
-                <span>Chriss Smahos</span>
-                <div class="stats">
-                  <small>Posted 2 min ago</small>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-4 mb-lg-0 mb-4">
-        <div class="card">
-          <div class="card-header p-0 mx-3 mt-3 position-relative z-index-1">
-            <a href="javascript:;" class="d-block">
-              <img src="../../assets/img/blog7-3.jpg" class="img-fluid border-radius-lg">
-            </a>
-          </div>
-
-          <div class="card-body pt-3">
-            <span class="text-gradient text-warning text-uppercase text-xs font-weight-bold my-2">Hub</span>
-            <a href="javascript:;" class="text-darker card-title h5 d-block">
-              Shared Coworking
-            </a>
-            <p class="card-description mb-4">
-              Use border utilities to quickly style the border and border-radius of an element. Great for images, buttons.
-            </p>
-            <div class="author align-items-center">
-              <img src="../../assets/img/marie.jpg" alt="..." class="avatar shadow">
-              <div class="name ps-3">
-                <span>Elijah Miller</span>
-                <div class="stats">
-                  <small>Posted now</small>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Blog 8

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- START Blogs w/ 4 cards w/ image & text & link -->
-<section class="py-5">
-  <div class="container">
-    <div class="row">
-      <div class="col-lg-3 col-sm-6">
-        <div class="card card-plain card-blog mt-4">
-          <div class="card-image border-radius-lg position-relative">
-            <a href="javascript:;">
-              <div class="blur-shadow-image">
-                <img class="img border-radius-lg move-on-hover" src="../../assets/img/curved-images/curved-8.jpg">
-              </div>
-            </a>
-          </div>
-          <div class="card-body px-0">
-            <h5>
-              <a href="javascript:;" class="text-dark font-weight-bold">Rover raised $65 million for pet sitting</a>
-            </h5>
-            <p>
-              Finding temporary housing for your dog should be as easy as
-              renting an Airbnb. That’s the idea behind Rover ...
-            </p>
-            <a href="javascript:;" class="text-info icon-move-right">Read More
-              <i class="fas fa-arrow-right text-sm"></i>
-            </a>
-          </div>
-        </div>
-      </div>
-
-      <div class="col-lg-3 col-sm-6">
-        <div class="card card-plain card-blog mt-4">
-          <div class="card-image border-radius-lg position-relative">
-            <a href="javascript:;">
-              <div class="blur-shadow-image">
-                <img class="img border-radius-lg move-on-hover" src="../../assets/img/curved-images/curved-10.jpg">
-              </div>
-            </a>
-          </div>
-          <div class="card-body px-0">
-            <h5>
-              <a href="javascript:;" class="text-dark font-weight-bold">MateLabs mixes machine learning with IFTTT</a>
-            </h5>
-            <p>
-              If you’ve ever wanted to train a machine learning model
-              and integrate it with IFTTT, you now can with ...
-            </p>
-            <a href="javascript:;" class="text-info icon-move-right">Read More
-              <i class="fas fa-arrow-right text-sm"></i>
-            </a>
-          </div>
-        </div>
-      </div>
-
-      <div class="col-lg-3 col-sm-6">
-        <div class="card card-plain card-blog mt-4">
-          <div class="card-image border-radius-lg position-relative">
-            <a href="javascript:;">
-              <div class="blur-shadow-image">
-                <img class="img border-radius-lg move-on-hover" src="../../assets/img/curved-images/curved-6.jpg">
-              </div>
-            </a>
-          </div>
-          <div class="card-body px-0">
-            <h5>
-              <a href="javascript:;" class="text-dark font-weight-bold">US venture investment ticks up</a>
-            </h5>
-            <p>
-              Venture investment in U.S. startups rose sequentially in
-              the second quarter of 2017, boosted by large, ate-stage financings
-            </p>
-            <a href="javascript:;" class="text-info icon-move-right">Read More
-              <i class="fas fa-arrow-right text-sm"></i>
-            </a>
-          </div>
-        </div>
-      </div>
-
-      <div class="col-lg-3 col-sm-6">
-        <div class="card card-plain card-blog mt-4">
-          <div class="card-image border-radius-lg position-relative">
-            <a href="javascript:;">
-              <div class="blur-shadow-image">
-                <img class="img border-radius-lg move-on-hover" src="../../assets/img/curved-images/curved-11.jpg">
-              </div>
-            </a>
-          </div>
-          <div class="card-body px-0">
-            <h5>
-              <a href="javascript:;" class="text-dark font-weight-bold"> Startup Insticator raises $5.2M</a>
-            </h5>
-            <p>
-              Insticator is announcing that it has raised $5.2 million in Series A funding.
-              The startup allows online publishers to add quizzes ...
-            </p>
-            <a href="javascript:;" class="text-info icon-move-right">Read More
-              <i class="fas fa-arrow-right text-sm"></i>
-            </a>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-<!-- END Blogs w/ 4 cards w/ image & text & link -->
-
-
-
-
-
-
-
-
-
-

Blog 9

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-8 bg-gradient-primary position-relative overflow-hidden">
-  <img src="../../assets/img/shapes/waves-white.svg" class="position-absolute top-0 d-lg-block d-none opacity-6" alt="">
-  <div class="position-absolute w-100 z-inde-1 top-0 mt-n3">
-    <svg width="100%" viewBox="0 -2 1920 157" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-        <title>wave-down</title>
-        <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-            <g id="Artboard" fill="#FFFFFF" fill-rule="nonzero">
-                <g id="wave-down">
-                    <path d="M0,60.8320331 C299.333333,115.127115 618.333333,111.165365 959,47.8320321 C1299.66667,-15.5013009 1620.66667,-15.2062179 1920,47.8320331 L1920,156.389409 L0,156.389409 L0,60.8320331 Z" id="Path-Copy-2" transform="translate(960.000000, 78.416017) rotate(180.000000) translate(-960.000000, -78.416017) "></path>
-                </g>
-            </g>
-        </g>
-    </svg>
-  </div>
-  <div class="container">
-    <div class="row mb-5">
-      <div class="col-lg-8 mx-auto text-center">
-        <h3 class="text-white">Latest Blog Posts</h3>
-        <p class="lead text-white">The time is now for it to be okay to be great. People in this world should.</p>
-      </div>
-    </div>
-    <div class="row d-flex align-items-center">
-      <div class="col-lg-3 col-md-6 text-center">
-        <div class="card card-blog card-plain">
-          <a href="javascript:;">
-            <img class="w-100 shadow border-radius-md" src="https://images.unsplash.com/photo-1593642634402-b0eb5e2eebc9?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1920&q=80">
-          </a>
-          <div class="card-body px-0">
-            <h4 class="text-white">Siri brings hands-free</h4>
-            <p class="text-white opacity-6">
-              Siri&#39;s latest trick is offering a hands-free TV viewing experience, that will allow consumers
-            </p>
-            <button type="button" class="btn btn-outline-white border-2 btn-rounded">Read more</button>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-3 col-md-6 text-center">
-        <div class="card card-blog card-plain">
-          <a href="javascript:;">
-            <img class="w-100 shadow border-radius-md" src="https://images.unsplash.com/photo-1434493789847-2f02dc6ca35d?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&auto=format&fit=crop&w=1920&q=80">
-          </a>
-          <div class="card-body px-0">
-            <h4 class="text-white">Soft UI Design System</h4>
-            <p class="text-white opacity-6">
-              Siri&#39;s latest trick is offering a hands-free TV viewing experience, that will allow consumers
-            </p>
-            <button type="button" class="btn btn-outline-white border-2 btn-rounded">Read more</button>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-3 col-md-6 text-center">
-        <div class="card card-blog card-plain">
-          <a href="javascript:;">
-            <img class="w-100 shadow border-radius-md" src="https://images.unsplash.com/photo-1593642634315-48f5414c3ad9?ixlib=rb-1.2.1&auto=format&fit=crop&w=1920&q=80">
-          </a>
-          <div class="card-body px-0">
-            <h4 class="text-white">Grow Your Business</h4>
-            <p class="text-white opacity-6">
-              Siri&#39;s latest trick is offering a hands-free TV viewing experience, that will allow consumers
-            </p>
-            <button type="button" class="btn btn-outline-white border-2 btn-rounded">Read more</button>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-3 col-md-6 text-center">
-        <div class="card card-blog card-plain">
-          <a href="javascript:;">
-            <img class="w-100 shadow border-radius-md" src="https://images.unsplash.com/photo-1593642532400-2682810df593?ixlib=rb-1.2.1&auto=format&fit=crop&w=1920&q=80">
-          </a>
-          <div class="card-body px-0">
-            <h4 class="text-white">Train Your Brain</h4>
-            <p class="text-white opacity-6">
-              Siri&#39;s latest trick is offering a hands-free TV viewing experience, that will allow consumers
-            </p>
-            <button type="button" class="btn btn-outline-white border-2 btn-rounded">Read more</button>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div class="position-absolute w-100 bottom-0">
-    <svg width="100%" viewBox="0 -1 1920 166" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-        <title>wave-up</title>
-        <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-            <g id="Artboard" transform="translate(0.000000, 5.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                <g id="wave-up" transform="translate(0.000000, -5.000000)">
-                    <path d="M0,70 C298.666667,105.333333 618.666667,95 960,39 C1301.33333,-17 1621.33333,-11.3333333 1920,56 L1920,165 L0,165 L0,70 Z" id="Path"></path>
-                </g>
-            </g>
-        </g>
-    </svg>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Blog 10

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-5">
-  <div class="container">
-    <div class="row text-center justify-content-center">
-      <div class="col-lg-6">
-        <h3 class="mt-4">
-          <span class="text-gradient text-info">Build something great</span>
-          <br><span> with our products</span>
-        </h3>
-        <p class="lead">We’re constantly trying to express ourselves and actualize our dreams. If you have the opportunity to play this game of life you need to appreciate every moment.</p>
-      </div>
-    </div>
-    <div class="row mt-5">
-      <div class="col-lg-4">
-        <!-- Start Card Blog Fullbackground - text centered -->
-        <a href="javascript:;">
-          <div class="card card-background move-on-hover">
-            <div class="full-background" style="background-image: url(&#39;https://images.unsplash.com/photo-1491652690933-aa04f6babbe1?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&auto=format&fit=crop&w=934&q=80&#39;)"></div>
-            <div class="card-body pt-12">
-              <h4 class="text-white">Search and Discovery</h4>
-              <p>Website visitors today demand a frictionless user expericence — especially when using search. Because of the hight standards.</p>
-            </div>
-          </div>
-        </a>
-        <!-- End Card Blog Fullbackground - text centered -->
-      </div>
-      <div class="col-lg-4">
-        <!-- Start Card Blog Fullbackground - text centered -->
-        <a href="javascript:;">
-          <div class="card card-background move-on-hover">
-            <div class="full-background" style="background-image: url(&#39;https://images.unsplash.com/photo-1521620112244-f1d36327c766?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&auto=format&fit=crop&w=1300&q=80&#39;)"></div>
-            <div class="card-body pt-12">
-              <h4 class="text-white">Search and Discovery</h4>
-              <p>Website visitors today demand a frictionless user expericence — especially when using search. Because of the hight standards.</p>
-            </div>
-          </div>
-        </a>
-        <!-- End Card Blog Fullbackground - text centered -->
-      </div>
-      <div class="col-lg-4">
-        <!-- Start Card Blog Fullbackground - text centered -->
-        <a href="javascript:;">
-          <div class="card card-background move-on-hover">
-            <div class="full-background" style="background-image: url(&#39;https://images.unsplash.com/photo-1541451378359-acdede43fdf4?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=934&q=80&#39;)"></div>
-            <div class="card-body pt-12">
-              <h4 class="text-white">Search and Discovery</h4>
-              <p>Website visitors today demand a frictionless user expericence — especially when using search. Because of the hight standards.</p>
-            </div>
-          </div>
-        </a>
-        <!-- End Card Blog Fullbackground - text centered -->
-      </div>
-
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Blog 11

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- START Blogs w/ big image on left -->
-<section class="py-5">
-  <div class="container-fluid">
-    <div class="row">
-      <div class="col-lg-5 col-6 mx-lg-0 mx-auto px-lg-0 px-md-0 my-auto">
-        <img class="w-100 border-radius-lg shadow" src="../../assets/img/toa-heftiba.jpg">
-      </div>
-      <div class="col-lg-4 col-10 d-flex justify-content-center flex-column mx-auto text-lg-left text-center">
-        <h2 class="mb-0 mt-lg-0 mt-4 text-gradient text-info">Read more about us</h2>
-        <h2 class="mb-4">And find some great partners</h2>
-        <p class="lead">It really matters and then like it really doesn’t matter. What matters is the people who are sparked by it. And the people who are like offended by it, it doesn’t matter. </p>
-        <ul class="m-lg-2 m-auto">
-          <li class="lead mb-2">People are so scared to lose their hope</li>
-          <li class="lead mb-2">That’s the main thing people </li>
-          <li class="lead mb-2">Thoughts- their perception of themselves!</li>
-        </ul>
-        <p class="lead">It really matters and then like it really doesn’t matter. What matters is the people who are sparked by it. And the people who are like offended by it, it doesn’t matter.</p>
-        <h3 class="mt-4">We will be with you forever</h3>
-        <p class="lead">It really matters and then like it really doesn’t matter. What matters is the people who are sparked by it. And the people who are like offended by it, it doesn’t matter.</p>
-        <p class="blockquote my-3 ps-2">
-          <span class="text-bold">“And thank you for turning my personal jean jacket into a couture piece.”</span>
-          <br>
-          <small class="blockquote-footer">
-            Kanye West, Producer.
-          </small>
-        </p>
-      </div>
-    </div>
-  </div>
-</section>
-<!-- END Blogs w/ big image on left -->
-
-
-
-
-
-
-
-
- - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/sections/page-sections/call-to-actions.html b/sections/page-sections/call-to-actions.html deleted file mode 100644 index 370740e5..00000000 --- a/sections/page-sections/call-to-actions.html +++ /dev/null @@ -1,1599 +0,0 @@ - - - - - - - - - - - Soft UI Design System by Creative Tim - - - - - - - - - - - - - - - - - - - -
-
-
-
- -

Call to Action

-
-
-
-
-
-

Prefooter 1

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- -------- START PRE-FOOTER 1 w/ SUBSCRIBE BUTTON AND IMAGE ------- -->
-<section class="py-7 mt-1">
-  <div class="container-fluid px-0">
-    <div class="row justify-content-center text-center">
-      <div class="col-12 position-relative">
-        <div class="row bg-warning-soft bottom-0 py-7">
-          <div class="col-xl-6 text-left ms-auto">
-            <h4>Be the first to see the news</h4>
-            <p class="mb-4">
-              Your company may not be in the software business,
-              but eventually, a software company will be in your business.
-            </p>
-            <div class="row">
-              <div class="col-sm-5">
-                <div class="input-group">
-                  <input type="text" class="form-control mb-sm-0 mb-2" placeholder="Email Here...">
-                </div>
-              </div>
-              <div class="col-sm-4">
-                <button type="button" class="btn bg-gradient-warning mb-0 h-100 position-relative z-index-2">Subscribe</button>
-              </div>
-            </div>
-          </div>
-
-          <div class="col-xl-4 position-relative">
-            <img class="w-100 border-radius-section border-top-end-radius-0 border-bottom-end-radius-0 end-0 position-absolute max-width-300 mt-n10 d-xl-block d-none" src="../../assets/img/curved-images/curved13.jpg" alt="image">
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-<!-- -------- END PRE-FOOTER 1 w/ SUBSCRIBE BUTTON AND IMAGE ------- -->
-
-
-
-
-
-
-
-
-
-

Prefooter 2

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- -------   START PRE-FOOTER 2 - simple social line w/ title & 3 buttons    -------- -->
-<div class="py-11">
-  <div class="container">
-    <div class="row">
-      <div class="col-lg-6">
-        <h4 class="mb-1">Thank you for your support!</h4>
-        <p class="lead mb-0">Delivering the best products</p>
-      </div>
-      <div class="col-lg-6 d-flex align-items-center">
-        <a href="javascript:;" class="btn btn-twitter mb-0 me-2">
-          <i class="fab fa-twitter me-1"></i> Twitter
-        </a>
-        <a href="javascript:;" class="btn btn-facebook mb-0 me-2">
-          <i class="fab fa-facebook-square me-1"></i> Facebook
-        </a>
-        <a href="javascript:;" class="btn btn-tumblr mb-0 me-2">
-          <i class="fab fa-tumblr me-1"></i> Tumblr
-        </a>
-        <a href="javascript:;" class="btn btn-dribbble mb-0">
-          <i class="fab fa-dribbble me-1"></i> Dribbble
-        </a>
-      </div>
-    </div>
-  </div>
-</div>
-<!-- -------   END PRE-FOOTER 2 - simple social line w/ title & 3 buttons    -------- -->
-
-
-
-
-
-
-
-
-
-

Prefooter 3

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- -------- START PRE-FOOTER 3 w/ SOCIAL BUTTONS ------- -->
-<section class="my-11">
-  <div class="container bg-gradient-dark border-radius-lg">
-    <div class="row py-4">
-      <div class="col-md-2 col-sm-4 col-6 text-center my-auto mb-md-0 mb-4 border-end-md">
-        <a href="javascript:;" class="btn btn-link btn-icon mb-0">
-          <i class="fab fa-twitter text-white text-lg"></i>
-        </a>
-      </div>
-      <div class="col-md-2 col-sm-4 col-6 text-center my-auto mb-md-0 mb-4 border-end-md">
-        <a href="javascript:;" class="btn btn-link btn-icon mb-0">
-          <i class="fab fa-facebook text-white text-lg"></i>
-        </a>
-      </div>
-      <div class="col-md-2 col-sm-4 col-6 text-center my-auto mb-md-0 mb-4 border-end-md">
-        <a href="javascript:;" class="btn btn-link btn-icon mb-0">
-          <i class="fab fa-pinterest text-white text-lg"></i>
-        </a>
-      </div>
-      <div class="col-md-2 col-sm-4 col-6 text-center my-auto border-end-md">
-        <a href="javascript:;" class="btn btn-link btn-icon mb-0">
-          <i class="fab fa-dribbble text-white text-lg"></i>
-        </a>
-      </div>
-      <div class="col-md-2 col-sm-4 col-6 text-center my-auto border-end-md">
-        <a href="javascript:;" class="btn btn-link btn-icon mb-0">
-          <i class="fab fa-youtube text-white text-lg"></i>
-        </a>
-      </div>
-      <div class="col-md-2 col-sm-4 col-6 text-center my-auto">
-        <a href="javascript:;" class="btn btn-link btn-icon mb-0">
-          <i class="fab fa-instagram text-white text-lg"></i>
-        </a>
-      </div>
-    </div>
-  </div>
-</section>
-<!-- -------- END PRE-FOOTER 3 w/ SOCIAL BUTTONS ------- -->
-
-
-
-
-
-
-
-
-
-

Prefooter 4

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- -------   START PRE-FOOTER 4 - title & description and input    -------- -->
-<div class="py-11">
-  <div class="container">
-    <div class="row">
-      <div class="col-lg-6 text-left">
-        <h4>Get tips & tricks every week</h4>
-        <p class="mb-0">The latest news, articles and resources sent to your inbox weekely.</p>
-      </div>
-      <div class="col-lg-5 ms-auto text-right mt-4 mt-lg-0">
-        <div class="row">
-          <div class="col-lg-8 col-md-4 col-7">
-            <div class="form-group mb-0">
-              <div class="input-group">
-                <div class="input-group">
-                  <span class="input-group-text"><i class="ni ni-email-83"></i></span>
-                  <input class="form-control" placeholder="Your Email" type="email" >
-                </div>
-              </div>
-            </div>
-          </div>
-          <div class="col-lg-4 col-md-4 col-5 text-left">
-            <button type="button" class="btn bg-gradient-primary mb-0 h-100">Subscribe</button>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</div>
-<!-- -------   END PRE-FOOTER 4 - title & description and input    -------- -->
-
-
-
-
-
-
-
-
-
-

Prefooter 5

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- -------- START PRE-FOOTER 5 w/ DARK BACKGROUND ------- -->
-<section class="my-9 py-5 bg-gradient-dark position-relative overflow-hidden">
-  <img src="../../assets/img/shapes/waves-white.svg" alt="pattern-lines" class="position-absolute start-0 top-0 w-100 opacity-6">
-  <div class="container position-relative z-index-2">
-    <div class="row">
-      <div class="col-lg-6 col-md-8 m-auto text-center">
-        <h5 class="text-white">Be the first to see the news</h5>
-        <p class="mb-5 text-white">
-          Your company may not be in the software business,
-          but eventually, a software company will be in your business.
-        </p>
-        <div class="row">
-					<div class="col-sm-8 pe-sm-0 mb-sm-0 mb-2">
-            <div class="input-group">
-              <span class="input-group-text border-end-0"><i class="ni ni-email-83"></i></span>
-              <input class="form-control" placeholder="Email Here..." type="email" >
-            </div>
-					</div>
-					<div class="col-sm-4 ps-sm-0">
-						<button type="button" class="btn bg-gradient-primary mb-0 ms-sm-3 me-auto h-100 w-100 d-block">Subscribe</button>
-					</div>
-				</div>
-      </div>
-    </div>
-  </div>
-</section>
-<!-- -------- END PRE-FOOTER 5 w/ DARK BACKGROUND ------- -->
-
-
-
-
-
-
-
-
-
-

Prefooter 6

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- -------   START PRE-FOOTER 6 - title & description and input    -------- -->
-<div class="py-8">
-  <div class="container">
-    <div class="row">
-      <div class="col-lg-6 mx-auto text-center">
-        <h3>Our products are built on top</h3>
-        <p class="lead">Very nice logos here on this page, you can check more on our social profiles.</p>
-      </div>
-    </div>
-    <div class="row mt-5">
-      <div class="col-lg-2 col-md-4 col-6 mb-4 ms-auto">
-        <img class="w-100 opacity-7" src="../../assets/img/logos/medium-logos/logo-apple.svg">
-      </div>
-      <div class="col-lg-2 col-md-4 col-6 mb-4">
-        <img class="w-100 opacity-7" src="../../assets/img/logos/medium-logos/logo-mailchimp.svg">
-      </div>
-      <div class="col-lg-2 col-md-4 col-6 mb-4">
-        <img class="w-100 opacity-7" src="../../assets/img/logos/medium-logos/logo-behance.svg">
-      </div>
-      <div class="col-lg-2 col-md-4 col-6 mb-4">
-        <img class="w-100 opacity-7" src="../../assets/img/logos/medium-logos/logo-mailchimp.svg">
-      </div>
-      <div class="col-lg-2 col-md-4 col-6 mb-4 me-auto">
-        <img class="w-100 opacity-7" src="../../assets/img/logos/medium-logos/logo-nasa.svg">
-      </div>
-    </div>
-  </div>
-</div>
-<!-- -------   END PRE-FOOTER 6 - title & description and input    -------- -->
-
-
-
-
-
-
-
-
-
-

Prefooter 7

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- -------- START PRE-FOOTER 7 w/ TEXT AND 2 BUTTONS ------- -->
-<section class="my-10 py-5 bg-gradient-dark position-relative overflow-hidden">
-  <img src="../../assets/img/shapes/waves-white.svg" alt="pattern-lines" class="position-absolute start-0 top-0 w-100 opacity-6">
-  <div class="container position-relative z-index-2">
-    <div class="row">
-      <div class="col-lg-5 col-md-8 m-auto text-left">
-        <h5 class="text-white mb-lg-0 mb-5">
-          Your company may not be in the software business,
-          but eventually, a software company will be in your business.
-        </h5>
-      </div>
-      <div class="col-lg-6 m-auto">
-        <div class="row">
-          <div class="col-sm-4 col-6 ps-sm-0 ms-auto">
-						<button type="button" class="btn bg-gradient-primary mb-0 ms-lg-3 ms-sm-2 mb-sm-0 mb-2 me-auto w-100 d-block">Start Now</button>
-					</div>
-					<div class="col-sm-4 col-6 ps-sm-0 me-lg-0 me-auto">
-						<button type="button" class="btn btn-white mb-0 ms-lg-3 ms-sm-2 mb-sm-0 mb-2 me-auto w-100 d-block">Our Story</button>
-					</div>
-				</div>
-      </div>
-    </div>
-  </div>
-</section>
-<!-- -------- END PRE-FOOTER 7 w/ TEXT AND 2 BUTTONS ------- -->
-
-
-
-
-
-
-
-
-
-

Prefooter 8

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- -------- START PRE-FOOTER 8 w/ TEXT, BG IMAGE AND 2 BUTTONS ------- -->
-<section class="my-10 py-5 bg-gradient-dark position-relative" style="background-image:url(../../assets/img/nastuh.jpg)">
-  <span class="mask bg-gradient-dark opacity-8"></span>
-  <div class="container position-relative z-index-2">
-    <div class="row">
-      <div class="col-lg-5 col-md-8 m-auto text-left">
-        <h5 class="text-white mb-lg-0 mb-5">
-          For being a bright color. For standing out. But the time is now to be okay to be the greatest you.
-        </h5>
-      </div>
-      <div class="col-lg-6 m-auto">
-        <div class="row">
-          <div class="col-sm-4 col-6 ps-sm-0 ms-auto">
-						<button type="button" class="btn bg-gradient-warning mb-0 ms-lg-3 ms-sm-2 mb-sm-0 mb-2 me-auto w-100 d-block">Start Now</button>
-					</div>
-				</div>
-      </div>
-    </div>
-  </div>
-</section>
-<!-- -------- END PRE-FOOTER 8 w/ TEXT, BG IMAGE AND 2 BUTTONS ------- -->
-
-
-
-
-
-
-
-
- - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/sections/page-sections/content-sections.html b/sections/page-sections/content-sections.html deleted file mode 100644 index 76e20c36..00000000 --- a/sections/page-sections/content-sections.html +++ /dev/null @@ -1,2267 +0,0 @@ - - - - - - - - - - - Soft UI Design System by Creative Tim - - - - - - - - - - - - - - - - - - - -
-
-
-
- -

Content Sections

-
-
-
-
-
-

Content 1

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- -------   START CONTENT 1 - title & description and 6 IMAGES   -------- -->
-<section class="py-5">
-  <div class="container">
-    <div class="row">
-      <div class="col-8 mx-auto text-center mb-5">
-        <span class="badge rounded-pill badge-primary mb-2">Co-working</span>
-        <h2>Explore our places in London </h2>
-        <p>
-          If you can’t decide, the answer is no. If two equally difficult paths,
-          choose the one more painful in the short term (pain avoidance
-          is creating an illusion of equality).
-        </p>
-      </div>
-    </div>
-    <div class="row section-height-25">
-      <div class="col-sm-4 col-5 mb-sm-0 mb-3">
-        <div style="background-image: url(&#39;../../assets/img/nastuh.jpg&#39;)" class="w-100 h-100 border-radius-lg bg-cover"></div>
-      </div>
-      <div class="col-sm-3 col-7 mb-sm-0 mb-3">
-        <div style="background-image: url(&#39;../../assets/img/card-3.jpg&#39;)" class="w-100 h-100 border-radius-lg bg-cover"></div>
-      </div>
-      <div class="col-sm-5 mb-sm-0 mb-3">
-        <div style="background-image: url(&#39;../../assets/img/card-2.jpg&#39;)" class="w-100 h-100 border-radius-lg bg-cover"></div>
-      </div>
-    </div>
-    <div class="row section-height-25 mt-4">
-      <div class="col-sm-3 col-7 mb-sm-0 mb-3">
-        <div style="background-image: url(&#39;../../assets/img/meeting.jpg&#39;)" class="w-100 h-100 border-radius-lg bg-cover"></div>
-      </div>
-      <div class="col-sm-5 col-5 mb-sm-0 mb-3">
-        <div style="background-image: url(&#39;../../assets/img/anastasia.jpg&#39;)" class="w-100 h-100 border-radius-lg bg-cover"></div>
-      </div>
-      <div class="col-sm-4 mb-sm-0 mb-3">
-        <div style="background-image: url(&#39;../../assets/img/annie-spratt.jpg&#39;)" class="w-100 h-100 border-radius-lg bg-cover"></div>
-      </div>
-    </div>
-  </div>
-</section>
-<!-- -------   END CONTENT 1 - title & description and 6 IMAGES   -------- -->
-
-
-
-
-
-
-
-
-
-

Content 2

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-5">
-  <div class="container-fluid">
-    <div class="row">
-      <div class="col-lg-5 col-6 mx-lg-0 mx-auto px-lg-0 px-md-0 my-auto">
-        <img class="w-100 border-radius-lg shadow" src="../../assets/img/toa-heftiba.jpg">
-      </div>
-      <div class="col-lg-4 col-10 d-flex justify-content-center flex-column mx-auto text-lg-left text-center">
-        <h2 class="mb-0 mt-lg-0 mt-4 text-gradient text-info">Read more about us</h2>
-        <h2 class="mb-4">And find some great partners</h2>
-        <p class="lead">It really matters and then like it really doesn’t matter. What matters is the people who are sparked by it. And the people who are like offended by it, it doesn’t matter. </p>
-        <ul class="m-lg-2 m-auto">
-          <li class="lead mb-2">People are so scared to lose their hope</li>
-          <li class="lead mb-2">That’s the main thing people </li>
-          <li class="lead mb-2">Thoughts- their perception of themselves!</li>
-        </ul>
-        <p class="lead">It really matters and then like it really doesn’t matter. What matters is the people who are sparked by it. And the people who are like offended by it, it doesn’t matter.</p>
-        <h3 class="mt-4">We will be with you forever</h3>
-        <p class="lead">It really matters and then like it really doesn’t matter. What matters is the people who are sparked by it. And the people who are like offended by it, it doesn’t matter.</p>
-        <p class="blockquote my-3 ps-2">
-          <span class="text-bold">“And thank you for turning my personal jean jacket into a couture piece.”</span>
-          <br>
-          <small class="blockquote-footer">
-            Kanye West, Producer.
-          </small>
-        </p>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Content 3

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section>
-  <div class="container">
-    <div class="row py-5 align-items-center">
-      <div class="col-lg-6">
-        <h5>Avesome Product</h5>
-        <h2>Beautiful mobile Apps -<br> The Ultimate Secret</h2>
-      </div>
-      <div class="col-lg-6">
-        <div class="row">
-          <div class="col-lg-6">
-            <img class="w-100 my-3" src="../../assets/img/logos/medium-logos/logo-google.svg">
-          </div>
-          <div class="col-lg-6">
-            <img class="w-100 my-3" src="../../assets/img/logos/medium-logos/logo-pinterest.svg">
-          </div>
-          <div class="col-lg-6">
-            <img class="w-100 my-3" src="../../assets/img/logos/medium-logos/logo-netflix.svg">
-          </div>
-          <div class="col-lg-6">
-            <img class="w-100 my-3" src="../../assets/img/logos/medium-logos/logo-coinbase.svg">
-          </div>
-          <div class="col-lg-6">
-            <img class="w-100 my-3" src="../../assets/img/logos/medium-logos/logo-facebook.svg">
-          </div>
-          <div class="col-lg-6">
-            <img class="w-100 my-3" src="../../assets/img/logos/medium-logos/logo-spotify.svg">
-          </div>
-        </div>
-      </div>
-    </div>
-    <div class="row pt-5">
-      <div class="col-md-4">
-        <div class="info">
-          <div class="icon icon-shape bg-gradient-warning shadow text-center mb-4">
-            <i class="fas fa-user"></i>
-          </div>
-          <h6>Social Conversations</h6>
-          <p>We get insulted by others, lose trust for those others. We get back stabbed by friends. It becomes harder for us to give others a hand.</p>
-          <a href="javascript:;" class="text-warning icon-move-right">More about us
-            <i class="fas fa-arrow-right text-sm ms-1"></i>
-          </a>
-        </div>
-      </div>
-      <div class="col-md-4">
-        <div class="info">
-          <div class="icon icon-shape bg-gradient-info shadow text-center mb-4">
-            <i class="fas fa-user"></i>
-          </div>
-          <h6>Social Conversations</h6>
-          <p>We get insulted by others, lose trust for those others. We get back stabbed by friends. It becomes harder for us to give others a hand.</p>
-          <a href="javascript:;" class="text-info icon-move-right">More about us
-            <i class="fas fa-arrow-right text-sm ms-1"></i>
-          </a>
-        </div>
-      </div>
-      <div class="col-md-4">
-        <div class="info">
-          <div class="icon icon-shape bg-gradient-danger shadow text-center mb-4">
-            <i class="fas fa-user"></i>
-          </div>
-          <h6>Social Conversations</h6>
-          <p>We get insulted by others, lose trust for those others. We get back stabbed by friends. It becomes harder for us to give others a hand.</p>
-          <a href="javascript:;" class="text-danger icon-move-right">More about us
-            <i class="fas fa-arrow-right text-sm ms-1"></i>
-          </a>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Content 4

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-10">
-  <div class="container">
-    <div class="row">
-      <div class="col-lg-8 ms-auto me-auto">
-
-          <div class="row">
-              <div class="col-md-6 my-auto">
-                  <div>
-                      <span class="badge badge-sm badge-primary">Photography</span>
-                      <span class="badge badge-sm badge-primary">Stories</span>
-                      <span class="badge badge-sm badge-primary">Castle</span>
-                  </div>
-              </div>
-              <div class="col-md-6">
-                  <a href="javascript:;" class="btn btn-pinterest btn-round mb-0 mx-1 mt-md-0 mt-4 float-md-right">
-                      <i class="fab fa-pinterest me-2"></i> 232
-                  </a>
-                  <a href="javascript:;" class="btn btn-twitter btn-round mb-0 mx-1 mt-md-0 mt-4 float-md-right">
-                      <i class="fab fa-twitter me-2"></i> 910
-                  </a>
-                  <a href="javascript:;" class="btn btn-facebook btn-round mb-0 mx-1 mt-md-0 mt-4 float-md-right">
-                      <i class="fab fa-facebook me-2"></i> 872
-                  </a>
-
-              </div>
-          </div>
-
-          <hr class="dark horizontal">
-
-          <div class="d-flex">
-            <div>
-              <a href="javascript:;">
-                <div class="position-relative">
-                  <div class="blur-shadow-avatar">
-                    <img class="avatar avatar-xxl rounded-circle" src="../../assets/img/team-2.jpg">
-                  </div>
-                </div>
-              </a>
-            </div>
-            <div class="ms-4 my-auto">
-              <h5>Alec Thompson</h5>
-              <p class="text-sm mb-0">I&#39;ve been trying to figure out the bed design for the master bedroom at our Hidden Hills compound...I like good music from Youtube.</p>
-            </div>
-            <div class="my-auto d-md-block d-none ms-2">
-                <button type="button" class="btn btn-dark pull-right btn-round mb-0">Follow</button>
-            </div>
-          </div>
-          <div class="my-auto d-md-none d-block ms-2">
-              <button type="button" class="btn btn-dark btn-round mt-3">Follow</button>
-          </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Content 5

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-7">
-  <div class="container">
-    <div class="row">
-      <div class="col-md-8 ms-auto me-auto">
-        <div>
-            <h4 class="text-center mb-5">3 Comments</h4>
-            <div class="d-flex">
-                <div>
-                  <a class="pull-left" href="javascript:;">
-                    <div class="position-relative">
-                      <div class="blur-shadow-avatar">
-                          <img class="avatar rounded-circle" src="../../assets/img/team-3.jpg" alt="...">
-                      </div>
-                    </div>
-                  </a>
-                </div>
-                <div class="ms-3">
-                    <h6>Tina Andrew <span class="text-muted text-xs">· 7 minutes ago</span></h6>
-
-                    <p>Chance too good. God level bars. I&#39;m so proud of @LifeOfDesiigner #1 song in the country. Panda! Don&#39;t be scared of the truth because we need to restart the human foundation in truth I stand with the most humility. We are so blessed!</p>
-                    <p>All praises and blessings to the families of people who never gave up on dreams. Don&#39;t forget, You&#39;re Awesome!</p>
-
-                    <div class="ms-auto text-right">
-                        <a href="javascript:;" class="btn text-dark px-2 btn-link" rel="tooltip" title="" data-original-title="Reply to Comment">
-                            <i class="fa fa-reply"></i> Reply
-                        </a>
-                        <a href="javascript:;" class="btn text-danger px-2 btn-link">
-                            <i class="fas fa-heart"></i> 243
-                        </a>
-                    </div>
-                </div>
-            </div>
-
-            <div class="d-flex">
-                <div>
-                  <a class="pull-left" href="javascript:;">
-                    <div class="position-relative">
-                      <div class="blur-shadow-avatar">
-                          <img class="avatar rounded-circle" src="../../assets/img/team-4.jpg" alt="...">
-                      </div>
-                    </div>
-                  </a>
-                </div>
-                <div class="ms-3">
-                    <h6>John Camber <span class="text-muted text-xs">· Yesterday</span></h6>
-
-                    <p>Hello guys, nice to have you on the platform! There will be a lot of great stuff coming soon. We will keep you posted for the latest news.</p>
-                    <p>Don&#39;t forget, You&#39;re awesome!</p>
-
-                    <div class="ms-auto text-right">
-                        <a href="javascript:;" class="btn text-dark px-2 btn-link" rel="tooltip" title="" data-original-title="Reply to Comment">
-                            <i class="fa fa-reply"></i> Reply
-                        </a>
-                        <a href="javascript:;" class="btn text-danger px-2 btn-link">
-                            <i class="fas fa-heart"></i> 25
-                        </a>
-                    </div>
-
-                    <div class="d-flex">
-                        <div>
-                          <a class="pull-left" href="javascript:;">
-                            <div class="position-relative">
-                              <div class="blur-shadow-avatar">
-                                  <img class="avatar rounded-circle" src="../../assets/img/team-2.jpg" alt="...">
-                              </div>
-                            </div>
-                          </a>
-                        </div>
-                        <div class="ms-3">
-                            <h6>Tina Andrew <span class="text-muted text-xs">· 2 minutes ago</span></h6>
-
-                            <p>Hello guys, nice to have you on the platform! There will be a lot of great stuff coming soon. We will keep you posted for the latest news.</p>
-                            <p>Don&#39;t forget, You&#39;re awesome!</p>
-
-                            <div class="ms-auto text-right">
-                                <a href="javascript:;" class="btn text-dark px-2 btn-link" rel="tooltip" title="" data-original-title="Reply to Comment">
-                                    <i class="fa fa-reply"></i> Reply
-                                </a>
-                                <a href="javascript:;" class="btn text-danger px-2 btn-link">
-                                    <i class="fas fa-heart"></i> 12
-                                </a>
-                            </div>
-                        </div>
-                    </div>
-
-                </div>
-
-            </div>
-
-
-        </div>
-          <h4 class="text-center mb-4 mt-5">Post your comment</h4>
-          <div class="d-flex">
-             <div>
-                <a class="pull-left author" href="javascript:;">
-                  <div class="position-relative">
-                    <div class="blur-shadow-avatar">
-                        <img class="avatar rounded-circle" alt="64x64" src="../../assets/img/team-2.jpg">
-                    </div>
-                  </div>
-                </a>
-              </div>
-              <div class="ms-3 w-100">
-                <textarea class="form-control" placeholder="Write a nice reply or go home..." rows="4"></textarea>
-                <div>
-                    <a href="javascript:;" class="btn bg-gradient-primary pull-right mt-2">
-                        <i class="fa fa-send me-2"></i> Reply
-                    </a>
-                </div>
-              </div>
-          </div> <!-- end media-post -->
-    </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Content 6

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- START Section Content W/ 2 images aside of icon title description -->
-<section class="py-7">
-  <div class="container">
-    <div class="row">
-      <div class="col-lg-6 col-md-8 order-2 order-md-2 order-lg-1">
-        <div class="position-relative ms-md-5 mb-0 mb-md-7 mb-lg-0 d-none d-md-block d-lg-block d-xl-block h-75">
-          <div class="bg-gradient-info w-100 h-100 border-radius-xl position-absolute" alt=""></div>
-          <img src="https://images.unsplash.com/photo-1548453251-6d13e53f0be0?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=1200&q=80" class="w-100 border-radius-xl mt-6 ms-5 position-absolute" alt="">
-        </div>
-      </div>
-      <div class="col-lg-5 col-md-12 ms-auto order-1 order-md-1 order-lg-1">
-        <div class="p-3 pt-0">
-            <div class="icon icon-shape bg-gradient-info rounded-circle shadow text-center mb-4">
-              <i class="ni ni-building"></i>
-            </div>
-            <h4 class="text-gradient text-info mb-0">Social Conversations</h4>
-            <h4 class="mb-4">Refreshing workspace atmosphere</h4>
-            <p>We’re not always in the position that we want to be at. We’re constantly growing. We’re constantly making mistakes. We’re constantly trying to express ourselves and actualize our dreams. <br><br> If you have the opportunity to play this game of life you need to appreciate every moment. A lot of people don’t appreciate the moment until it’s passed.</p>
-            <a href="javascript:;" class="text-dark icon-move-right">More about us
-              <i class="fas fa-arrow-right text-sm ms-1"></i>
-            </a>
-          </div>
-      </div>
-    </div>
-    <div class="row mt-0 mt-md-5 mt-lg-8">
-      <div class="col-lg-5 col-md-12 me-auto">
-        <div class="p-3 pt-0">
-            <div class="icon icon-shape bg-gradient-warning rounded-circle shadow text-center mb-4">
-              <i class="fas fa-trophy"></i>
-            </div>
-            <h4 class="text-gradient text-warning mb-0">Luxury Sensation</h4>
-            <h4 class="mb-4">Stand up for every move</h4>
-            <p>Society has put up so many boundaries, so many limitations on what’s right and wrong that it’s almost impossible to get a pure thought out.It’s like a little kid, a little boy, looking at colors. <br> <br> Before somebody tells you you shouldn’t like pink because that’s for girls, or you’d instantly become a gay two-year-old. Why would anyone pick blue over pink? Pink is obviously a better color.</p>
-            <a href="javascript:;" class="text-dark icon-move-right">More about us
-              <i class="fas fa-arrow-right text-sm ms-1"></i>
-            </a>
-          </div>
-      </div>
-      <div class="col-lg-6 col-md-8">
-        <div class="position-relative ms-md-5 d-none d-md-block d-lg-block d-xl-block h-75">
-          <div class="w-100 h-100 bg-gradient-warning border-radius-xl position-absolute" alt=""></div>
-          <img src="https://images.unsplash.com/photo-1579558449515-e0f596d7c5c4?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=1200&q=80" class="w-100 border-radius-xl mt-6 ms-n5 position-absolute" alt="">
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-<!-- END Section Content -->
-
-
-
-
-
-
-
-
-
-

Content 7

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- -------- START CONTENT 7 w/ card over right bg image ------- -->
-<div class="page-header section-height-85 my-5">
-  <div class="bg-gray-200 position-absolute fixed-bottom start-0 z-index-0 h-75 mb-n7 overflow-hidden opacity-8">
-    <div class="position-absolute w-100 z-inde-1 top-0 mt-n3">
-      <svg width="100%" viewBox="0 0 1920 157" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-          <title>Path Copy 2</title>
-          <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-              <g id="Artboard-Copy" transform="translate(0.000000, -416.000000)" fill="#FFFFFF">
-                  <path d="M-1,477.610914 C298.333333,531.905996 618.333333,527.38687 959,464.053537 C1299.66667,400.720204 1619.66667,400.572663 1919,463.610914 L1920,572.610914 L0,572.610914 L-1,477.610914 Z" id="Path-Copy-2" transform="translate(959.500000, 494.526769) scale(-1, -1) translate(-959.500000, -494.526769) "></path>
-              </g>
-          </g>
-      </svg>
-    </div>
-  </div>
-  <div class="position-absolute fixed-top ms-auto w-75 h-75 border-radius-xl z-index-1 d-none d-sm-none d-md-block me-n4" style="background-image: url(&#39;https://images.unsplash.com/photo-1495580847032-db0bac41d44b?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&auto=format&fit=crop&w=2400&q=80&#39;); background-size: cover;">
-  </div>
-  <div class="container">
-    <div class="row mt-7">
-      <div class="col-lg-6 d-flex justify-content-center flex-column">
-        <div class="card card-body d-flex justify-content-center shadow-lg border-radius-lg p-5 blur align-items-center z-index-2 shadow-blur">
-          <h2 class="text-gradient text-warning mb-4">Excluding the design complexity</h2>
-          <p class="text-lg-left text-center mb-0">We’re constantly trying to express ourselves and actualize our dreams. If you have the opportunity to play this game of life you need to appreciate every moment. A lot of people don’t appreciate the moment until it’s passed.</p>
-          <br>
-          <div class="buttons w-100">
-            <button type="button" class="btn bg-gradient-dark mb-0">Contact Us</button>
-            <button type="button" class="btn btn-outline-dark mb-0 ms-1">Read More</button>
-          </div>
-          <div class="row mt-5 justify-content-start">
-            <div class="col-md-3 col-6 p-0">
-              <img class="w-100 opacity-6" src="../../assets/img/logos/gray-logos/logo-pinterest.svg" alt="logo">
-            </div>
-            <div class="col-md-3 col-6 p-0">
-              <img class="w-100 opacity-6" src="../../assets/img/logos/gray-logos/logo-netflix.svg" alt="logo">
-            </div>
-            <div class="col-md-3 col-6 p-0">
-              <img class="w-100 opacity-6" src="../../assets/img/logos/gray-logos/logo-coinbase.svg" alt="logo">
-            </div>
-            <div class="col-md-3 col-6 p-0">
-              <img class="w-100 opacity-6" src="../../assets/img/logos/gray-logos/logo-nasa.svg" alt="logo">
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</div>
-
-<!-- -------- END CONTENT 10 w/ card over right bg image ------- -->
-
-
-
-
-
-
-
-
-
-

Content 8

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- -------- START CONTENT 11 w/ title and 4 images ------- -->
-<section class="py-5">
-  <div class="container">
-    <div class="row">
-      <div class="col-8 mx-auto text-center mb-5">
-        <span class="badge rounded-pill badge-info mb-2">Living</span>
-        <h2>A new way to buy your next home</h2>
-        <p>
-          If you can’t decide, the answer is no. If two equally difficult paths,
-          choose the one more painful in the short term (pain avoidance
-          is creating an illusion of equality).
-        </p>
-      </div>
-    </div>
-    <div class="row mb-4">
-      <div class="col-lg-3 col-md-6 position-relative mb-sm-0 mb-3">
-        <hr class="vertical dark d-md-block d-none">
-        <h3 class="mb-3">
-          <a href="javascript:;" class="text-darker">
-            Short Sentences Gives You the Liberty
-          </a>
-        </h3>
-        <p class="mb-3">
-          Paradoxically, using more short sentences gives you the liberty to write beautiful long sentences.
-        </p>
-        <p class="mb-3">
-          But in a way that&#39;s never been done before.
-        </p>
-        <div class="author">
-           <img src="https://images.unsplash.com/photo-1542909168-82c3e7fdca5c?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=1400&amp;q=80" alt="..." class="avatar shadow">
-           <div class="name ps-3 my-auto">
-            <p class="text-sm text-darker font-weight-bold mb-0">Mathew Glock</p>
-            <div class="stats">
-              <p class="text-xs text-secondary mb-0">Author</p>
-            </div>
-          </div>
-        </div>
-        <hr class="horizontal dark my-4">
-        <h3 class="mb-3">
-          <a href="javascript:;" class="text-darker">
-            5 Ways to Improve your Life.
-          </a>
-        </h3>
-        <p class="mb-3">
-          Create first, edit second. Never do them at the same time.
-        </p>
-      </div>
-      <div class="col-lg-4 col-md-6 position-relative mb-sm-0 mb-3">
-        <hr class="vertical dark d-lg-block d-none">
-        <div class="card card-plain">
-          <div class="card-header p-0 mx-lg-3 mt-3 position-relative z-index-1">
-            <a href="javascript:;" class="d-block">
-              <img src="https://images.unsplash.com/photo-1543357480-c60d40007a3f?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=2100&amp;q=80" class="img-fluid border-radius-lg">
-            </a>
-          </div>
-
-          <div class="card-body pt-3">
-            <h4 class="mb-3">
-              <a href="javascript:;" class="text-darker font-weight-bolder">
-                How to Build a $24 Billion Dollar Company in Just 2 Years.
-              </a>
-            </h4>
-            <p class="card-description mb-4">
-              I&#39;ve come to the conclusion that 50% of folks in this world don&#39;t even
-              spend enough time alone with their thoughts to have their own opinions.
-              They haven&#39;t done the work to decide what they think. And that isn&#39;t a rewarding way to live.
-            </p>
-            <div class="author">
-              <img src="https://images.unsplash.com/photo-1522075469751-3a6694fb2f61?ixid=MXwxMjA3fDB8MHxzZWFyY2h8M3x8cG9ydHJhaXR8ZW58MHwyfDB8&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=800&amp;q=60" alt="..." class="avatar shadow">
-              <div class="name ps-3 my-auto">
-                <p class="text-sm text-darker font-weight-bold mb-0">L&#39;orea Sirman</p>
-                <div class="stats">
-                  <p class="text-xs text-secondary mb-0">Redactor</p>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-3 col-md-6 position-relative mb-sm-0 mb-3">
-        <hr class="vertical dark d-md-block d-none">
-        <div class="card card-plain">
-          <div class="card-header p-0 mx-lg-3 mt-3 position-relative z-index-1">
-            <a href="javascript:;" class="d-block">
-              <img src="https://images.unsplash.com/photo-1579864795584-092b04e14e67?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=2134&amp;q=80" class="img-fluid border-radius-lg">
-            </a>
-          </div>
-
-          <div class="card-body pt-3">
-            <h4 class="mb-3">
-              <a href="javascript:;" class="text-darker font-weight-bolder">
-                8 Powerful Mental Models to Help You Win.
-              </a>
-            </h4>
-            <p class="text-sm mb-0">By Andrew Peterson</p>
-          </div>
-        </div>
-        <div class="card card-plain">
-          <div class="card-header p-0 mx-lg-3 position-relative z-index-1">
-            <a href="javascript:;" class="d-block">
-              <img src="https://images.unsplash.com/photo-1432889490240-84df33d47091?ixid=MXwxMjA3fDB8MHxzZWFyY2h8MTM2fHxjYWxpZm9ybmlhfGVufDB8MHwwfA%3D%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=800&amp;q=60" class="img-fluid border-radius-lg">
-            </a>
-          </div>
-          <div class="card-body pt-3">
-            <h4 class="mb-3">
-              <a href="javascript:;" class="text-darker font-weight-bolder">
-                High performers are like surfers.
-              </a>
-            </h4>
-            <p class="text-sm">By L&#39;orea Michael</p>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-2 col-md-6 position-relative mb-sm-0 mb-3">
-        <div class="card card-plain">
-          <div class="card-body pt-3">
-            <h6 class="font-weight-bolder opacit-5">
-              <i class="fa fa-microphone me-2"></i>Podcasts
-            </h6>
-            <h5 class="mb-2">
-
-            </h5>
-            <p>An interview with Tesla founder.</p>
-            <span class="text-xs">By Alexa Rossa</span>
-          </div>
-        </div>
-        <hr class="horizontal dark mt-0 mb-2">
-        <div class="card card-plain">
-          <div class="card-body pt-3">
-            <h6 class="font-weight-bolder">
-              <i class="fa fa-microphone me-2"></i>
-              Interviews
-            </h6>
-
-              <p hss="">
-              Make $500k through small biz or raise it from family.
-              </p>
-
-            <span class="text-xs">By Jonathan Silvia</span>
-          </div>
-        </div>
-        <hr class="horizontal dark mt-0 mb-2">
-        <div class="card card-plain">
-          <div class="card-body pt-3">
-            <h6 class="font-weight-bolder opacit-5">
-              <i class="fa fa-microphone me-2"></i>Podcasts
-            </h6>
-            <h5 class="mb-2">
-
-            </h5>
-            <p>Lengthen your time horizon.</p>
-            <span class="text-xs">By Andrew Joe</span>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-<!-- -------- END CONTENT 11 w/ title and 4 images ------- -->
-
-
-
-
-
-
-
-
- - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/sections/page-sections/faq.html b/sections/page-sections/faq.html deleted file mode 100644 index 669689d6..00000000 --- a/sections/page-sections/faq.html +++ /dev/null @@ -1,1023 +0,0 @@ - - - - - - - - - - - Soft UI Design System by Creative Tim - - - - - - - - - - - - - - - - - - - -
-
-
-
- -

FAQ

-
-
-
-
-
-

Faq

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-4">
-  <div class="container">
-    <div class="row my-5">
-      <div class="col-md-6 mx-auto text-center">
-        <h2>Frequently Asked Questions</h2>
-        <p>A lot of people don&#39;t appreciate the moment until it’s passed. I&#39;m not trying my hardest, and I&#39;m not trying to do </p>
-      </div>
-    </div>
-    <div class="row">
-      <div class="col-md-10 mx-auto">
-        <div class="accordion" id="accordionRental">
-          <div class="accordion-item mb-3">
-            <h5 class="accordion-header" id="headingOne">
-              <button class="accordion-button border-bottom font-weight-bold" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
-                How do I order?
-                <i class="collapse-close fa fa-plus text-xs pt-1 position-absolute end-0 me-3"></i>
-                <i class="collapse-open fa fa-minus text-xs pt-1 position-absolute end-0 me-3"></i>
-              </button>
-            </h5>
-            <div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionRental">
-              <div class="accordion-body text-sm opacity-8">
-                We’re not always in the position that we want to be at. We’re constantly growing. We’re constantly making mistakes. We’re constantly trying to express ourselves and actualize our dreams. If you have the opportunity to play this game
-                of life you need to appreciate every moment. A lot of people don’t appreciate the moment until it’s passed.
-              </div>
-            </div>
-          </div>
-          <div class="accordion-item mb-3">
-            <h5 class="accordion-header" id="headingTwo">
-              <button class="accordion-button border-bottom font-weight-bold" type="button" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
-                How can i make the payment?
-                <i class="collapse-close fa fa-plus text-xs pt-1 position-absolute end-0 me-3"></i>
-                <i class="collapse-open fa fa-minus text-xs pt-1 position-absolute end-0 me-3"></i>
-              </button>
-            </h5>
-            <div id="collapseTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo" data-bs-parent="#accordionRental">
-              <div class="accordion-body text-sm opacity-8">
-                It really matters and then like it really doesn’t matter. What matters is the people who are sparked by it. And the people who are like offended by it, it doesn’t matter. Because it&#39;s about motivating the doers. Because I’m here to follow my dreams and inspire other people to follow their dreams, too.
-                <br>
-                We’re not always in the position that we want to be at. We’re constantly growing. We’re constantly making mistakes. We’re constantly trying to express ourselves and actualize our dreams. If you have the opportunity to play this game of life you need to appreciate every moment. A lot of people don’t appreciate the moment until it’s passed.
-              </div>
-            </div>
-          </div>
-          <div class="accordion-item mb-3">
-            <h5 class="accordion-header" id="headingThree">
-              <button class="accordion-button border-bottom font-weight-bold" type="button" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
-                How much time does it take to receive the order?
-                <i class="collapse-close fa fa-plus text-xs pt-1 position-absolute end-0 me-3"></i>
-                <i class="collapse-open fa fa-minus text-xs pt-1 position-absolute end-0 me-3"></i>
-              </button>
-            </h5>
-            <div id="collapseThree" class="accordion-collapse collapse" aria-labelledby="headingThree" data-bs-parent="#accordionRental">
-              <div class="accordion-body text-sm opacity-8">
-                The time is now for it to be okay to be great. People in this world shun people for being great. For being a bright color. For standing out. But the time is now to be okay to be the greatest you. Would you believe in what you believe in, if you were the only one who believed it?
-                If everything I did failed - which it doesn&#39;t, it actually succeeds - just the fact that I&#39;m willing to fail is an inspiration. People are so scared to lose that they don&#39;t even try. Like, one thing people can&#39;t say is that I&#39;m not trying, and I&#39;m not trying my hardest, and I&#39;m not trying to do the best way I know how.
-              </div>
-            </div>
-          </div>
-          <div class="accordion-item mb-3">
-            <h5 class="accordion-header" id="headingFour">
-              <button class="accordion-button border-bottom font-weight-bold" type="button" data-bs-toggle="collapse" data-bs-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
-                Can I resell the products?
-                <i class="collapse-close fa fa-plus text-xs pt-1 position-absolute end-0 me-3"></i>
-                <i class="collapse-open fa fa-minus text-xs pt-1 position-absolute end-0 me-3"></i>
-              </button>
-            </h5>
-            <div id="collapseFour" class="accordion-collapse collapse" aria-labelledby="headingFour" data-bs-parent="#accordionRental">
-              <div class="accordion-body text-sm opacity-8">
-                I always felt like I could do anything. That’s the main thing people are controlled by! Thoughts- their perception of themselves! They&#39;re slowed down by their perception of themselves. If you&#39;re taught you can’t do anything, you won’t do anything. I was taught I could do everything.
-                <br><br>
-                If everything I did failed - which it doesn&#39;t, it actually succeeds - just the fact that I&#39;m willing to fail is an inspiration. People are so scared to lose that they don&#39;t even try. Like, one thing people can&#39;t say is that I&#39;m not trying, and I&#39;m not trying my hardest, and I&#39;m not trying to do the best way I know how.
-              </div>
-            </div>
-          </div>
-          <div class="accordion-item mb-3">
-            <h5 class="accordion-header" id="headingFifth">
-              <button class="accordion-button border-bottom font-weight-bold" type="button" data-bs-toggle="collapse" data-bs-target="#collapseFifth" aria-expanded="false" aria-controls="collapseFifth">
-                Where do I find the shipping details?
-                <i class="collapse-close fa fa-plus text-xs pt-1 position-absolute end-0 me-3"></i>
-                <i class="collapse-open fa fa-minus text-xs pt-1 position-absolute end-0 me-3"></i>
-              </button>
-            </h5>
-            <div id="collapseFifth" class="accordion-collapse collapse" aria-labelledby="headingFifth" data-bs-parent="#accordionRental">
-              <div class="accordion-body text-sm opacity-8">
-                There’s nothing I really wanted to do in life that I wasn’t able to get good at. That’s my skill. I’m not really specifically talented at anything except for the ability to learn. That’s what I do. That’s what I’m here for. Don’t be afraid to be wrong because you can’t learn anything from a compliment.
-                I always felt like I could do anything. That’s the main thing people are controlled by! Thoughts- their perception of themselves! They&#39;re slowed down by their perception of themselves. If you&#39;re taught you can’t do anything, you won’t do anything. I was taught I could do everything.
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
- - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/sections/page-sections/features.html b/sections/page-sections/features.html index a1f785a6..98472a79 100644 --- a/sections/page-sections/features.html +++ b/sections/page-sections/features.html @@ -1,6 +1,6 @@ - - - + @@ -749,7 +747,7 @@

Features

- +
@@ -1173,7 +1171,7 @@

The most important

- + \ No newline at end of file diff --git a/sections/page-sections/footers.html b/sections/page-sections/footers.html deleted file mode 100644 index cb78de97..00000000 --- a/sections/page-sections/footers.html +++ /dev/null @@ -1,3307 +0,0 @@ - - - - - - - - - - - Soft UI Design System by Creative Tim - - - - - - - - - - - - - - - - - - - -
-
-
-
- -

Footers

-
-
-
-
-
-

Footer 1

-
-
-
- -
-
-
-
-
- - -
-
-
-
-
-
-

Footer 2

-
-
-
- -
-
-
-
-
- - -
-
-
-
-
-
-

Footer 3

-
-
-
- -
-
-
-
-
- - -
-
-
-
-
-
-

Footer 4

-
-
-
- -
-
-
-
-
- - -
-
-
-
-
-
-

Footer 5

-
-
-
- -
-
-
-
-
- - -
-
-
-
-
-
-

Footer 6

-
-
-
- -
-
-
-
-
- - -
-
-
-
-
-
-

Footer 7

-
-
-
- -
-
-
-
-
- - -
-
-
-
-
-
-

Footer 8

-
-
-
- -
-
-
-
-
- - -
-
-
-
-
-
-

Footer 9

-
-
-
- -
-
-
-
-
- - -
-
-
-
-
-
-

Footer 10

-
-
-
- -
-
-
-
-
- - -
-
-
-
-
- - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/sections/page-sections/general-cards.html b/sections/page-sections/general-cards.html deleted file mode 100644 index 4e65d0aa..00000000 --- a/sections/page-sections/general-cards.html +++ /dev/null @@ -1,1791 +0,0 @@ - - - - - - - - - - - Soft UI Design System by Creative Tim - - - - - - - - - - - - - - - - - - - -
-
-
-
- -

General Cards

-
-
-
-
-
-

Card waves

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-4">
-  <div class="container">
-    <div class="row justify-space-between py-2">
-      <div class="col-6 mx-auto">
-        <div class="card">
-          <img class="card-img-top" src="https://images.unsplash.com/photo-1522202176988-66273c2fd55f?ixlib=rb-1.2.1&amp;ixid=eyJhcHBfaWQiOjEyMDd9&amp;auto=format&amp;fit=crop&amp;w=1651&amp;q=80">
-          <div class="position-relative" style="height: 50px;overflow: hidden;margin-top: -50px;z-index:2;position: relative;">
-            <div class="position-absolute w-100 top-0" style="z-index: 1;">
-                <svg class="waves waves-sm" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 24 150 40" preserveAspectRatio="none" shape-rendering="auto">
-                  <defs>
-                    <path id="card-wave" d="M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z"></path>
-                  </defs>
-                  <g class="moving-waves">
-                    <use xlink:href="#card-wave" x="48" y="-1" fill="rgba(255,255,255,0.30"></use>
-                    <use xlink:href="#card-wave" x="48" y="3" fill="rgba(255,255,255,0.35)"></use>
-                    <use xlink:href="#card-wave" x="48" y="5" fill="rgba(255,255,255,0.25)"></use>
-                    <use xlink:href="#card-wave" x="48" y="8" fill="rgba(255,255,255,0.20)"></use>
-                    <use xlink:href="#card-wave" x="48" y="13" fill="rgba(255,255,255,0.15)"></use>
-                    <use xlink:href="#card-wave" x="48" y="16" fill="rgba(255,255,255,0.99)"></use>
-                  </g>
-                </svg>
-              </div>
-          </div>
-          <div class="card-body">
-            <h4>
-              Soft UI Design System
-            </h4>
-            <p>
-              One of the most beautiful and complex UI Kits built by the team behind Creative Tim. That&#34;s pretty impressive.
-            </p>
-            <a href="javascript:;" class="text-primary icon-move-right">More about us
-              <i class="fas fa-arrow-right text-xs ms-1" aria-hidden="true"></i>
-            </a>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Card blog

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-4">
-  <div class="container">
-    <div class="row justify-space-between py-2">
-      <div class="col-6 mx-auto">
-        <div class="card card-blog card-plain">
-          <div class="position-relative">
-            <a class="d-block blur-shadow-image">
-              <img src="https://images.unsplash.com/photo-1551882547-ff40c63fe5fa?ixlib=rb-1.2.1&amp;ixid=eyJhcHBfaWQiOjEyMDd9&amp;auto=format&amp;fit=crop&amp;w=2100&amp;q=80" alt="img-blur-shadow" class="img-fluid shadow border-radius-lg">
-            </a>
-          <div class="colored-shadow" style="background-image: url(&quot;https://images.unsplash.com/photo-1551882547-ff40c63fe5fa?ixlib=rb-1.2.1&amp;ixid=eyJhcHBfaWQiOjEyMDd9&amp;auto=format&amp;fit=crop&amp;w=2100&amp;q=80&quot;);"></div></div>
-          <div class="card-body px-1 pt-3">
-            <p class="text-gradient text-primary mb-2 text-sm">Private Room • 1 Guests • 1 Sofa</p>
-            <a href="javascript:;">
-              <h5>
-                Single room in the center of the city
-              </h5>
-            </a>
-            <p>
-              As Uber works through a huge amount of internal management turmoil, the company is also consolidating and rationalizing more of its international business.
-            </p>
-            <button type="button" class="btn btn-outline-primary btn-sm">From / Night</button>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Card blog horizontal

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-8">
-  <div class="container">
-    <div class="row justify-space-between py-2">
-      <div class="card card-plain card-blog mt-5">
-        <div class="row">
-          <div class="col-md-4">
-            <div class="card-image position-relative border-radius-lg">
-              <div class="blur-shadow-image">
-                <img class="img border-radius-lg" src="https://images.unsplash.com/photo-1559526324-4b87b5e36e44?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=2102&amp;q=80">
-              </div>
-            <div class="colored-shadow" style="background-image: url(&quot;https://images.unsplash.com/photo-1559526324-4b87b5e36e44?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=2102&amp;q=80&quot;);"></div></div>
-          </div>
-          <div class="col-md-7 my-auto ms-md-3 mt-md-auto mt-4">
-            <h3>
-              <a href="javascript:;" class="text-dark font-weight-normal">Rover raised $65 million for pet sitting</a>
-            </h3>
-            <p>
-              Finding temporary housing for your dog should be as easy as renting an Airbnb. That’s the idea behind Rover, which raised $65 million to expand its pet sitting and dog-walking businesses.. <a href="javascript:;" class="text-dark"> Read More </a>
-            </p>
-    				<div class="author">
-    				   <img src="https://images.unsplash.com/photo-1542909168-82c3e7fdca5c?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=1400&amp;q=80" alt="..." class="avatar avatar-sm shadow me-2">
-    				   <p class="my-auto">Katie Roof</p>
-    				</div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Card image inside

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-4">
-  <div class="container">
-    <div class="row justify-space-between py-2">
-      <div class="col-6 mx-auto">
-        <div class="card shadow-lg">
-          <div class="card-header p-0 mx-3 mt-3 position-relative z-index-1">
-            <a href="javascript:;" class="d-block">
-              <img src="../../assets/img/annie-spratt.jpg" class="img-fluid border-radius-lg">
-            </a>
-          </div>
-
-          <div class="card-body pt-3">
-            <span class="text-gradient text-warning text-uppercase text-xs font-weight-bold my-2">Hub</span>
-            <a href="javascript:;" class="text-darker card-title h5 d-block">
-              Shared Coworking
-            </a>
-            <p class="card-description mb-4">
-              Use border utilities to quickly style the border and border-radius of an element. Great for images, buttons.
-            </p>
-            <div class="author align-items-center">
-              <img src="../../assets/img/marie.jpg" alt="..." class="avatar shadow">
-              <div class="name ps-3">
-                <span>Mathew Glock</span>
-                <div class="stats">
-                  <small>Posted on 28 February</small>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Card with blur on image

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-4">
-  <div class="container">
-    <div class="row justify-space-between py-2">
-      <div class="col-6 mx-auto">
-        <div class="card card-plain card-blog mt-4">
-          <div class="card-image border-radius-lg position-relative">
-            <a href="javascript:;">
-              <div class="blur-shadow-image">
-                <img class="img border-radius-lg move-on-hover" src="../../assets/img/curved-images/curved-8.jpg">
-              </div>
-            <div class="colored-shadow" style="background-image: url(&quot;../../assets/img/curved-images/curved8.jpg&quot;);"></div></a>
-          </div>
-          <div class="card-body px-0">
-            <h5>
-              <a href="javascript:;" class="text-dark font-weight-bold">MateLabs mixes machine learning with IFTTT</a>
-            </h5>
-            <p>
-              If you’ve ever wanted to train a machine learning model
-              and integrate it with IFTTT, you now can with ...
-            </p>
-            <a href="javascript:;" class="text-info icon-move-right">Read More
-              <i class="fas fa-arrow-right text-sm" aria-hidden="true"></i>
-            </a>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Card background

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-7">
-  <div class="container">
-    <div class="row justify-space-between py-2">
-      <div class="col-6 mx-auto">
-        <div class="card card-background move-on-hover">
-          <a href="javascript:;">
-            <div class="full-background" style="background-image: url(https://images.unsplash.com/photo-1521620112244-f1d36327c766?ixlib=rb-1.2.1&amp;ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;auto=format&amp;fit=crop&amp;w=1300&amp;q=80)"></div>
-            <div class="card-body pt-12">
-              <h4 class="text-white">Search and Discovery</h4>
-              <p>Website visitors today demand a frictionless user expericence — especially when using search. Because of the hight standards.</p>
-            </div>
-          </a>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Card profile

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-4">
-  <div class="container">
-    <div class="row justify-space-between py-2">
-      <div class="col-6 mx-auto">
-        <div class="card card-profile mt-md-0 mt-5 shadow-lg">
-          <a href="javascript:;">
-            <div class="p-3">
-              <img class="w-100 border-radius-md" src="../../assets/img/bruce-mars.jpg">
-            </div>
-          </a>
-          <div class="card-body blur justify-content-center text-center mt-n5 mx-4 mb-4 border-radius-md">
-            <h4 class="mb-0">Bruce Mars</h4>
-            <p>Atlanta, U.S.</p>
-            <div class="row justify-content-center text-center">
-              <div class="col-lg-4 col-4">
-                <h5 class="text-info mb-0">750</h5>
-                <small>Projects</small>
-              </div>
-              <div class="col-lg-4 col-4">
-                <h5 class="text-info mb-0">800+</h5>
-                <small>Hours</small>
-              </div>
-              <div class="col-lg-4 col-4">
-                <h5 class="text-info mb-0">24/7</h5>
-                <small>Support</small>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Card background tilt

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-4">
-  <div class="container">
-    <div class="row justify-space-between py-2">
-      <div class="col-6 mx-auto">
-        <div class="card card-background card-background-mask-primary tilt mt-md-0 mt-5" data-tilt="" style="will-change: transform; transform: perspective(1000px) rotateX(0deg) rotateY(0deg) scale3d(1, 1, 1);">
-            <div class="full-background" style="background-image: url(https://images.unsplash.com/photo-1578961771886-97d51aee46bc?ixlib=rb-1.2.1&amp;ixid=eyJhcHBfaWQiOjEyMDd9&amp;auto=format&amp;fit=crop&amp;w=1259&amp;q=80)"></div>
-            <div class="card-body pt-7 text-center">
-              <div class="icon icon-lg up mb-5">
-                <svg width="40px" height="40px" viewBox="0 0 44 43" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                  <title>megaphone</title>
-                  <g id="Basic-Elements" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                    <g id="Rounded-Icons" transform="translate(-2168.000000, -591.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                      <g id="Icons-with-opacity" transform="translate(1716.000000, 291.000000)">
-                        <g id="megaphone" transform="translate(452.000000, 300.000000)">
-                          <path d="M35.7958333,0.273166667 C35.2558424,-0.0603712374 34.5817509,-0.0908856664 34.0138333,0.1925 L19.734,7.33333333 L9.16666667,7.33333333 C4.10405646,7.33333333 0,11.4373898 0,16.5 C0,21.5626102 4.10405646,25.6666667 9.16666667,25.6666667 L19.734,25.6666667 L34.0138333,32.8166667 C34.5837412,33.1014624 35.2606401,33.0699651 35.8016385,32.7334768 C36.3426368,32.3969885 36.6701539,31.8037627 36.6666942,31.1666667 L36.6666942,1.83333333 C36.6666942,1.19744715 36.3370375,0.607006911 35.7958333,0.273166667 Z" id="Path"></path>
-                          <path d="M38.5,11 L38.5,22 C41.5375661,22 44,19.5375661 44,16.5 C44,13.4624339 41.5375661,11 38.5,11 Z" id="Path" opacity="0.601050967"></path>
-                          <path d="M18.5936667,29.3333333 L10.6571667,29.3333333 L14.9361667,39.864 C15.7423448,41.6604248 17.8234451,42.4993948 19.6501416,41.764381 C21.4768381,41.0293672 22.3968823,38.982817 21.7341667,37.1286667 L18.5936667,29.3333333 Z" id="Path" opacity="0.601050967"></path>
-                        </g>
-                      </g>
-                    </g>
-                  </g>
-                </svg>
-              </div>
-              <h1 class="text-white up mb-0">Find music and play it!</h1>
-              <p class="lead up">Music search</p>
-              <button type="button" class="btn btn-outline-white btn-lg mt-3 up">Get Started</button>
-            </div>
-          </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Card pricing

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-6">
-  <div class="container">
-    <div class="row justify-space-between py-2">
-      <div class="col-6 mx-auto">
-        <div class="card shadow-none border bg-gradient-dark h-100 overflow-hidden">
-          <img src="../../assets/img/shapes/pattern-lines.svg" alt="pattern-lines" class="position-absolute">
-          <div class="card-header bg-transparent text-sm-left text-center pt-4 pb-3 px-4">
-            <h5 class="mb-1 text-white">Premium</h5>
-            <p class="mb-3 text-sm text-white">Free access for 200 members</p>
-            <h3 class="font-weight-bolder mt-3 text-white">
-              $499 <small class="text-sm text-secondary font-weight-bold">/ year</small>
-            </h3>
-            <a href="javascript:;" class="btn btn-sm btn-white w-100 border-radius-md mt-4 mb-2">Buy now</a>
-          </div>
-          <hr class="horizontal light my-0">
-          <div class="card-body">
-            <div class="d-flex pb-3">
-              <div>
-                <i class="fas fa-check text-success text-sm" aria-hidden="true"></i>
-              </div>
-              <div class="ps-3">
-                <span class="text-sm text-white">Complete documentation</span>
-              </div>
-            </div>
-
-            <div class="d-flex pb-3">
-              <div>
-                <i class="fas fa-check text-success text-sm" aria-hidden="true"></i>
-              </div>
-              <div class="ps-3">
-                <span class="text-sm text-white">Working materials in Sketch</span>
-              </div>
-            </div>
-
-            <div class="d-flex pb-3">
-              <div>
-                <i class="fas fa-check text-success text-sm" aria-hidden="true"></i>
-              </div>
-              <div class="ps-3">
-                <span class="text-sm text-white">20GB cloud storage</span>
-              </div>
-            </div>
-
-            <div class="d-flex pb-3">
-              <div>
-                <i class="fas fa-check text-success text-sm" aria-hidden="true"></i>
-              </div>
-              <div class="ps-3">
-                <span class="text-sm text-white">100 team members</span>
-              </div>
-            </div>
-
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
- - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/sections/page-sections/hero-sections.html b/sections/page-sections/hero-sections.html index d4cbdcd3..d9cb9cb5 100644 --- a/sections/page-sections/hero-sections.html +++ b/sections/page-sections/hero-sections.html @@ -1,6 +1,6 @@ - - - + @@ -749,7 +747,7 @@

Page Headers

- +
@@ -1053,7 +1051,7 @@

Soft Design System

- + - - - - - - - - - - - -
-
-
-
- -

Logo Areas

-
-
-
-
-
-

Header Logo

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- -------- START HEADER 8 w/ card over right bg image ------- -->
-<header>
-  <div class="page-header section-height-85">
-    <div>
-      <img class="position-absolute fixed-top ms-auto w-50 h-100 z-index-0 d-none d-sm-none d-md-block border-radius-section border-top-end-radius-0 border-top-start-radius-0 border-bottom-end-radius-0" src="../../assets/img/curved-images/curved6.jpg">
-    </div>
-    <div class="container">
-      <div class="row">
-        <div class="col-lg-7 d-flex">
-          <div class="card card-body blur text-md-left text-center px-sm-5 shadow-lg mt-sm-5 py-sm-5">
-            <h2 class="text-gradient text-primary mb-0">Soft Design System.</h2>
-            <h2 class="text-dark mb-4">Choose the best</h2>
-
-            <p class="lead text-dark pe-md-5 me-md-5">
-              Find the story of Creative Tim&#39;s most complex design system and
-              all the work that make this design available.
-            </p>
-            <div class="buttons">
-              <button type="button" class="btn btn-rounded bg-gradient-primary mt-4">Contact Us</button>
-              <button type="button" class="btn btn-rounded btn-outline-secondary mt-4 ms-2">Read More</button>
-            </div>
-            <div class="row mt-2">
-              <div class="col-md-3 col-6 p-0">
-                <img class="w-100" src="../../assets/img/logos/gray-logos/logo-pinterest.svg" alt="logo">
-              </div>
-              <div class="col-md-3 col-6 p-0">
-                <img class="w-100" src="../../assets/img/logos/gray-logos/logo-netflix.svg" alt="logo">
-              </div>
-              <div class="col-md-3 col-6 p-0">
-                <img class="w-100" src="../../assets/img/logos/gray-logos/logo-coinbase.svg" alt="logo">
-              </div>
-              <div class="col-md-3 col-6 p-0">
-                <img class="w-100" src="../../assets/img/logos/gray-logos/logo-nasa.svg" alt="logo">
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</header>
-<!-- -------- END HEADER 8 w/ card over right bg image ------- -->
-
-
-
-
-
-
-
-
-
-

Logo Area

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- -------   START PRE-FOOTER 6 - title & description and input    -------- -->
-<div class="py-5">
-  <div class="container">
-    <div class="row">
-      <div class="col-8 mx-auto text-center">
-        <h6 class="opacity-5"> More than 50+ brands trust Soft</h6>
-      </div>
-    </div>
-    <div class="row mt-4">
-      <div class="col-lg-2 col-md-4 col-6 mb-4">
-        <img class="w-100 opacity-9" src="../../assets/img/logos/gray-logos/logo-coinbase.svg">
-      </div>
-      <div class="col-lg-2 col-md-4 col-6 mb-4">
-        <img class="w-100 opacity-9" src="../../assets/img/logos/gray-logos/logo-nasa.svg">
-      </div>
-      <div class="col-lg-2 col-md-4 col-6 mb-4">
-        <img class="w-100 opacity-9" src="../../assets/img/logos/gray-logos/logo-netflix.svg">
-      </div>
-      <div class="col-lg-2 col-md-4 col-6 mb-4">
-        <img class="w-100 opacity-9" src="../../assets/img/logos/gray-logos/logo-pinterest.svg">
-      </div>
-      <div class="col-lg-2 col-md-4 col-6 mb-4">
-        <img class="w-100 opacity-9" src="../../assets/img/logos/gray-logos/logo-spotify.svg">
-      </div>
-      <div class="col-lg-2 col-md-4 col-6 mb-4">
-        <img class="w-100 opacity-9" src="../../assets/img/logos/gray-logos/logo-vodafone.svg">
-      </div>
-    </div>
-  </div>
-</div>
-<!-- -------   END PRE-FOOTER 6 - title & description and input    -------- -->
-
-
-
-
-
-
-
-
-
-

Logos

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-5">
-  <div class="container">
-    <div class="row">
-      <div class="col-lg-6 mx-auto text-center">
-        <h2 class="text-gradient text-primary mb-0">What random people</h2>
-        <h2 class="mb-3">Think about us</h2>
-        <p>That’s the main thing people are controlled by! Thoughts- their perception of themselves! </p>
-      </div>
-    </div>
-    <div class="row mt-6">
-      <div class="col-lg-4 col-md-8">
-        <div class="card card-plain">
-          <div class="card-body">
-            <div class="author">
-              <img src="../../assets/img/team-3.jpg" alt="..." class="avatar shadow">
-              <div class="name ps-2">
-                <span>Mathew Glock</span>
-                <div class="stats">
-                  <small><i class="far fa-clock"></i> 5 min read</small>
-                </div>
-              </div>
-            </div>
-            <p class="mt-4">"If you have the opportunity to play this game of life you need to appreciate every moment."</p>
-            <div class="rating mt-3">
-              <i class="fas fa-star"></i>
-              <i class="fas fa-star"></i>
-              <i class="fas fa-star"></i>
-              <i class="fas fa-star"></i>
-              <i class="far fa-star"></i>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-4 col-md-8 ms-md-auto">
-        <div class="card bg-gradient-primary">
-          <div class="card-body">
-            <div class="author align-items-center">
-              <img src="../../assets/img/marie.jpg" alt="..." class="avatar shadow">
-              <div class="name ps-2">
-                <span class="text-white">Mathew Glock</span>
-                <div class="stats">
-                  <small class="text-white">Posted on 28 February</small>
-                </div>
-              </div>
-            </div>
-            <p class="mt-4 text-white">"If you have the opportunity to play this game of life you need to appreciate every moment."</p>
-            <div class="rating mt-3">
-              <i class="fas fa-star text-white"></i>
-              <i class="fas fa-star text-white"></i>
-              <i class="fas fa-star text-white"></i>
-              <i class="far fa-star text-white"></i>
-              <i class="far fa-star text-white"></i>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-4 col-md-8">
-        <div class="card card-plain">
-          <div class="card-body">
-            <div class="author">
-              <img src="../../assets/img/team-2.jpg" alt="..." class="avatar shadow">
-              <div class="name ps-2">
-                <span>Mathew Glock</span>
-                <div class="stats">
-                  <small><i class="far fa-clock"></i> 5 min read</small>
-                </div>
-              </div>
-            </div>
-            <p class="mt-4">"If you have the opportunity to play this game of life you need to appreciate every moment."</p>
-            <div class="rating mt-3">
-              <i class="fas fa-star"></i>
-              <i class="fas fa-star"></i>
-              <i class="fas fa-star"></i>
-              <i class="fas fa-star"></i>
-              <i class="fas fa-star"></i>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-    <hr class="horizontal dark my-5">
-    <div class="row">
-      <div class="col-lg-2 col-6">
-        <img class="w-100 opacity-6" src="../../assets/img/logos/gray-logos/logo-apple.svg" alt="Logo">
-      </div>
-      <div class="col-lg-2 col-6">
-        <img class="w-100 opacity-6" src="../../assets/img/logos/gray-logos/logo-facebook.svg" alt="Logo">
-      </div>
-      <div class="col-lg-2 col-6">
-        <img class="w-100 opacity-6" src="../../assets/img/logos/gray-logos/logo-behance.svg" alt="Logo">
-      </div>
-      <div class="col-lg-2 col-6">
-        <img class="w-100 opacity-6" src="../../assets/img/logos/gray-logos/logo-spotify.svg" alt="Logo">
-      </div>
-      <div class="col-lg-2 col-6">
-        <img class="w-100 opacity-6" src="../../assets/img/logos/gray-logos/logo-coinbase.svg" alt="Logo">
-      </div>
-      <div class="col-lg-2 col-6">
-        <img class="w-100 opacity-6" src="../../assets/img/logos/gray-logos/logo-pinterest.svg" alt="Logo">
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Logo Section

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- -------   START PRE-FOOTER 6 - title & description and input    -------- -->
-<div class="py-8">
-  <div class="container">
-    <div class="row">
-      <div class="col-lg-6 mx-auto text-center">
-        <h3>Our products are built on top</h3>
-        <p class="lead">Very nice logos here on this page, you can check more on our social profiles.</p>
-      </div>
-    </div>
-    <div class="row mt-5">
-      <div class="col-lg-2 col-md-4 col-6 mb-4 ms-auto">
-        <img class="w-100 opacity-7" src="../../assets/img/logos/medium-logos/logo-apple.svg">
-      </div>
-      <div class="col-lg-2 col-md-4 col-6 mb-4">
-        <img class="w-100 opacity-7" src="../../assets/img/logos/medium-logos/logo-mailchimp.svg">
-      </div>
-      <div class="col-lg-2 col-md-4 col-6 mb-4">
-        <img class="w-100 opacity-7" src="../../assets/img/logos/medium-logos/logo-behance.svg">
-      </div>
-      <div class="col-lg-2 col-md-4 col-6 mb-4">
-        <img class="w-100 opacity-7" src="../../assets/img/logos/medium-logos/logo-mailchimp.svg">
-      </div>
-      <div class="col-lg-2 col-md-4 col-6 mb-4 me-auto">
-        <img class="w-100 opacity-7" src="../../assets/img/logos/medium-logos/logo-nasa.svg">
-      </div>
-    </div>
-  </div>
-</div>
-<!-- -------   END PRE-FOOTER 6 - title & description and input    -------- -->
-
-
-
-
-
-
-
-
- - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/sections/page-sections/pricing.html b/sections/page-sections/pricing.html deleted file mode 100644 index e3608f09..00000000 --- a/sections/page-sections/pricing.html +++ /dev/null @@ -1,4270 +0,0 @@ - - - - - - - - - - - Soft UI Design System by Creative Tim - - - - - - - - - - - - - - - - - - - -
-
-
-
- -

Pricing

-
-
-
-
-
-

Pricing 1

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-3">
-  <div class="bg-gradient-primary position-relative m-3 border-radius-xl">
-    <img src="../../assets/img/shapes/waves-white.svg" alt="pattern-lines" class="position-absolute start-0 top-md-0 w-100 opacity-6">
-    <div class="container pb-lg-9 pb-7 pt-7 postion-relative z-index-2">
-      <div class="row">
-        <div class="col-md-8 mx-auto text-center">
-          <span class="badge bg-gradient-dark mb-2">Pricing</span>
-          <h3 class="text-white">See our pricing</h3>
-          <p class="text-white">You have Free Unlimited Updates and Premium Support on each package.</p>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div class="mt-n8">
-    <div class="container">
-      <div class="row">
-        <div class="col-lg-3 mb-lg-auto mb-4 my-auto p-md-0 ms-auto">
-          <div class="card border-radius-top-end-lg-0 border-radius-bottom-end-lg-0">
-            <div class="card-header text-center pt-4 pb-3">
-              <h6 class="text-dark opacity-8 mb-0">Starter</h6>
-              <h1 class="font-weight-bolder">
-                <small>$</small>199
-              </h1>
-            </div>
-            <div class="card-body mx-auto pt-0">
-              <div class="justify-content-left d-flex px-2 py-1">
-                <div>
-                  <i class="fas fa-check text-dark opacity-6 text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">Complete documentation</span>
-                </div>
-              </div>
-
-              <div class="justify-content-left d-flex px-2 py-1">
-                <div>
-                  <i class="fas fa-check text-dark opacity-6 text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">Working materials in Sketch</span>
-                </div>
-              </div>
-
-              <div class="justify-content-left d-flex px-2 py-1">
-                <div>
-                  <i class="fas fa-check text-dark opacity-6 text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">500MB cloud storage</span>
-                </div>
-              </div>
-
-              <div class="justify-content-left d-flex px-2 py-1">
-                <div>
-                  <i class="fas fa-check text-dark opacity-6 text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">Lite support</span>
-                </div>
-              </div>
-            </div>
-            <div class="card-footer pt-0">
-              <a href="javascript:;" class="btn w-100 bg-gradient-dark mb-0">
-                Buy now
-              </a>
-            </div>
-          </div>
-        </div>
-
-        <div class="col-lg-3 p-md-0 mb-lg-auto mb-4 z-index-2">
-          <div class="card">
-            <div class="card-header text-center pt-4 pb-3">
-              <h6 class="text-dark opacity-8 text mb-0 mt-2">Pro</h6>
-              <h1 class="font-weight-bolder">
-                <small>$</small>299
-              </h1>
-            </div>
-            <div class="card-body mx-auto pt-0">
-              <div class="justify-content-left d-flex px-2 py-1">
-                <div>
-                  <i class="fas fa-check text-dark opacity-6 text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">Complete documentation</span>
-                </div>
-              </div>
-
-              <div class="justify-content-left d-flex px-2 py-1">
-                <div>
-                  <i class="fas fa-check text-dark opacity-6 text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">Working materials in Sketch</span>
-                </div>
-              </div>
-
-              <div class="justify-content-left d-flex px-2 py-1">
-                <div>
-                  <i class="fas fa-check text-dark opacity-6 text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">100GB cloud storage</span>
-                </div>
-              </div>
-
-              <div class="justify-content-left d-flex px-2 py-1">
-                <div>
-                  <i class="fas fa-check text-dark opacity-6 text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">500 team members</span>
-                </div>
-              </div>
-
-              <div class="justify-content-left d-flex px-2 py-1">
-                <div>
-                  <i class="fas fa-check text-dark opacity-6 text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">Premium support</span>
-                </div>
-              </div>
-            </div>
-            <div class="card-footer pt-0">
-              <a href="javascript:;" class="btn btn-icon bg-gradient-primary d-block mb-0 icon-move-right">Try Pro
-                <i class="fas fa-arrow-right ms-2" aria-hidden="true"></i>
-              </a>
-            </div>
-          </div>
-        </div>
-
-        <div class="col-lg-3 mb-lg-auto mb-4 my-auto p-md-0 me-auto">
-          <div class="card border-radius-top-start-lg-0 border-radius-bottom-start-lg-0">
-            <div class="card-header text-center pt-4 pb-2">
-              <h6 class="text-dark opacity-8 text mb-0">Premium</h6>
-              <h1 class="font-weight-bolder">
-                <small>$</small>399
-              </h1>
-            </div>
-            <div class="card-body mx-auto pt-0">
-              <div class="justify-content-left d-flex px-2 py-1 py-1">
-                <div>
-                  <i class="fas fa-check text-dark opacity-6 text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">Complete documentation</span>
-                </div>
-              </div>
-              <div class="justify-content-left d-flex px-2 py-1 py-1">
-                <div>
-                  <i class="fas fa-check text-dark opacity-6 text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">Working materials in Sketch</span>
-                </div>
-              </div>
-              <div class="justify-content-left d-flex px-2 py-1 py-1">
-                <div>
-                  <i class="fas fa-check text-dark opacity-6 text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">2GB cloud storage</span>
-                </div>
-              </div>
-              <div class="justify-content-left d-flex px-2 py-1">
-                <div>
-                  <i class="fas fa-check text-dark opacity-6 text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">Premium support</span>
-                </div>
-              </div>
-            </div>
-            <div class="card-footer pt-0">
-              <a href="javascript:;" class="btn w-100 bg-gradient-dark mb-0">Buy now</a>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Pricing 2

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- START Pricing w/ 2 cards & nav tabs -->
-<section class="py-2 bg-light">
-  <div class="container pt-5">
-    <div class="row">
-      <div class="col-lg-4 col-md-10 d-flex justify-content-center flex-column">
-        <h3 class="mt-3">Choose a plan for your next project</h3>
-          <p class="lead">You have Free Unlimited Updates and Premium Support on each package. You also have 20 days to request a refund.</p>
-          <div class="nav-wrapper me-auto mt-4 mb-5 mb-lg-0">
-            <ul class="nav nav-pills nav-fill p-1" id="tabs-pricing" role="tablist">
-              <li class="nav-item">
-                <a class="nav-link mb-sm-3 mb-md-0 active" id="tabs-iconpricing-tab-1" data-bs-toggle="tab" href="#personal" role="tab" aria-controls="tabs-pricing-tab-1" aria-selected="true">
-                  Freelancer
-                </a>
-              </li>
-              <li class="nav-item">
-                <a class="nav-link mb-sm-3 mb-md-0" id="tabs-iconpricing-tab-2" data-bs-toggle="tab" href="#commercial" role="tab" aria-controls="tabs-pricing-tab-2" aria-selected="false">
-                  Startup
-                </a>
-              </li>
-            </ul>
-          </div>
-      </div>
-      <div class="col-lg-7 col-md-12 ms-lg-auto me-lg-auto">
-        <div class="tab-content tab-space">
-          <div class="tab-pane active" id="personal">
-            <div class="row">
-              <div class="col-md-6">
-                <div class="card card-pricing bg-white border-0 text-center mb-4">
-                  <div class="card-header bg-transparent">
-                    <h6 class="text-uppercase ls-1 py-3 mb-0">Standard</h6>
-                  </div>
-                  <div class="card-body text-dark">
-                    <p class="display-2 font-weight-bold mb-0">$25</p>
-                    <span>per month</span>
-                    <ul class="list-unstyled my-4">
-                      <li class="align-items-center">
-                        <b>20GB</b> <span>File Storage</span>
-                      </li>
-                      <li class="align-items-center my-2">
-                        <b>15</b> <span>Users</span>
-                      </li>
-                      <li class="align-items-center">
-                        <b>False</b> <span>Support</span>
-                      </li>
-                    </ul>
-                  </div>
-                  <div class="card-footer bg-transparent">
-                    <button class="btn btn-outline-primary">Request a demo</button>
-                  </div>
-                </div>
-              </div>
-              <div class="col-md-6">
-                <div class="card card-pricing bg-gradient-primary border-0 text-center mb-4 overflow-hidden">
-                  <img src="../../assets/img/shapes/waves-white.svg" alt="pattern-lines" class="position-absolute opacity-8">
-                  <div class="card-header bg-transparent">
-                    <h6 class="text-uppercase text-white ls-1 py-3 mb-0">Premium</h6>
-                  </div>
-                  <div class="card-body text-white position-relative">
-                    <p class="display-2 font-weight-bold mb-0">$59</p>
-                    <span>per month</span>
-                    <ul class="list-unstyled my-4">
-                      <li class="align-items-center">
-                        <b>50GB</b> <span>File Storage</span>
-                      </li>
-                      <li class="align-items-center my-2">
-                        <b>100</b> <span>Users</span>
-                      </li>
-                      <li class="align-items-center">
-                        <b>Premium</b> <span>Support</span>
-                      </li>
-                    </ul>
-                  </div>
-                  <div class="card-footer bg-transparent position-relative">
-                    <button class="btn btn-outline-white">Request a demo</button>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-          <div class="tab-pane" id="commercial">
-            <div class="row">
-              <div class="col-md-6">
-                <div class="card card-pricing bg-white border-0 text-center mb-4">
-                  <div class="card-header bg-transparent">
-                    <h6 class="text-uppercase ls-1 py-3 mb-0">Gold</h6>
-                  </div>
-                  <div class="card-body text-dark">
-                    <p class="display-2 font-weight-bold mb-0">$100</p>
-                    <span>per month</span>
-                    <ul class="list-unstyled my-4">
-                      <li class="align-items-center">
-                        <b>200GB</b> <span>File Storage</span>
-                      </li>
-                      <li class="align-items-center my-2">
-                        <b>Unlimited</b> <span>Users</span>
-                      </li>
-                      <li class="align-items-center">
-                        <b>Premium</b> <span>Support</span>
-                      </li>
-                    </ul>
-                  </div>
-                  <div class="card-footer bg-transparent">
-                    <button class="btn btn-outline-primary">Request a demo</button>
-                  </div>
-                </div>
-              </div>
-              <div class="col-md-6">
-                <div class="card card-pricing bg-gradient-primary border-0 text-center mb-4 overflow-hidden">
-                  <img src="../../assets/img/shapes/waves-white.svg" alt="pattern-lines" class="position-absolute opacity-8">
-                  <div class="card-header bg-transparent">
-                    <h6 class="text-uppercase text-white ls-1 py-3 mb-0">Platinum</h6>
-                  </div>
-                  <div class="card-body text-white position-relative">
-                    <p class="display-2 font-weight-bold mb-0">$135</p>
-                    <span>per month</span>
-                    <ul class="list-unstyled my-4">
-                      <li class="align-items-center">
-                        <b>500GB</b> <span>File Storage</span>
-                      </li>
-                      <li class="align-items-center my-2">
-                        <b>Unlimited</b> <span>Users</span>
-                      </li>
-                      <li class="align-items-center">
-                        <b>No time</b> <span>Tracking</span>
-                      </li>
-                    </ul>
-                  </div>
-                  <div class="card-footer bg-transparent position-relative">
-                    <button class="btn btn-outline-white">Request a demo</button>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-<!-- END Pricing w/ 2 cards & nav tabs -->
-
-
-
-
-
-
-
-
-
-

Pricing 3

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-3">
-  <div class="bg-gradient-primary position-relative m-3 border-radius-xl">
-    <img src="../../assets/img/shapes/waves-white.svg" alt="pattern-lines" class="position-absolute opacity-6 start-0 top-0 w-100">
-    <div class="container pb-lg-9 pb-10 pt-7 postion-relative z-index-2">
-      <div class="row">
-        <div class="col-md-6 mx-auto text-center">
-          <h3 class="text-white">See our pricing</h3>
-          <p class="text-white">You have Free Unlimited Updates and Premium Support on each package.</p>
-        </div>
-      </div>
-      <div class="row">
-        <div class="col-lg-4 col-md-6 col-7 mx-auto text-center">
-          <div class="nav-wrapper mt-5 position-relative z-index-2">
-            <ul class="nav nav-pills nav-fill flex-row p-1" id="tabs-pricing" role="tablist">
-              <li class="nav-item">
-                <a class="nav-link mb-0 active" id="tabs-iconpricing-tab-1" data-bs-toggle="tab" href="#monthly" role="tab" aria-controls="monthly" aria-selected="true">
-                  Monthly
-                </a>
-              </li>
-              <li class="nav-item">
-                <a class="nav-link mb-0" id="tabs-iconpricing-tab-2" data-bs-toggle="tab" href="#annual" role="tab" aria-controls="annual" aria-selected="false">
-                  Annual
-                </a>
-              </li>
-            </ul>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div class="mt-n8">
-    <div class="container">
-      <div class="tab-content tab-space">
-        <div class="tab-pane active" id="monthly">
-          <div class="row">
-            <div class="col-lg-4 mb-lg-0 mb-4">
-              <div class="card">
-                <div class="card-header text-center pt-4 pb-3">
-                  <span class="badge rounded-pill bg-light text-dark">Starter</span>
-                  <h1 class="font-weight-bold mt-2">
-                    <small>$</small>59
-                  </h1>
-                </div>
-                <div class="card-body text-lg-left text-center pt-0">
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-success shadow text-center">
-                      <i class="fas fa-check opacity-10"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">2 team members</span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-success shadow text-center">
-                      <i class="fas fa-check opacity-10"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">20GB Cloud storage </span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-secondary shadow text-center">
-                      <i class="fas fa-minus"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">Integration help </span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-secondary shadow text-center">
-                      <i class="fas fa-minus"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">Sketch Files </span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-secondary shadow text-center">
-                      <i class="fas fa-minus"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">API Access </span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-secondary shadow text-center">
-                      <i class="fas fa-minus"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">Complete documentation </span>
-                    </div>
-                  </div>
-
-                  <a href="javascript:;" class="btn btn-icon bg-gradient-dark d-lg-block mt-3 mb-0">
-                    Join
-                    <i class="fas fa-arrow-right ms-1"></i>
-                  </a>
-                </div>
-              </div>
-            </div>
-
-            <div class="col-lg-4 mb-lg-0 mb-4">
-              <div class="card">
-                <div class="card-header text-center pt-4 pb-3">
-                  <span class="badge rounded-pill bg-light text-dark">Premium</span>
-                  <h1 class="font-weight-bold mt-2">
-                    <small>$</small>89
-                  </h1>
-                </div>
-                <div class="card-body text-lg-left text-center pt-0">
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-success shadow text-center">
-                      <i class="fas fa-check opacity-10"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">10 team members</span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-success shadow text-center">
-                      <i class="fas fa-check opacity-10"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">40GB Cloud storage </span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-success shadow text-center">
-                      <i class="fas fa-check opacity-10"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">Integration help </span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-success shadow text-center">
-                      <i class="fas fa-check opacity-10"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">Sketch Files </span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-secondary shadow text-center">
-                      <i class="fas fa-minus"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">API Access </span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-secondary shadow text-center">
-                      <i class="fas fa-minus"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">Complete documentation </span>
-                    </div>
-                  </div>
-
-                  <a href="javascript:;" class="btn btn-icon bg-gradient-primary d-lg-block mt-3 mb-0">
-                    Try Premium
-                    <i class="fas fa-arrow-right ms-1"></i>
-                  </a>
-                </div>
-              </div>
-            </div>
-
-            <div class="col-lg-4 mb-lg-0 mb-4">
-              <div class="card">
-                <div class="card-header text-center pt-4 pb-3">
-                  <span class="badge rounded-pill bg-light text-dark">Enterprise</span>
-                  <h1 class="font-weight-bold mt-2">
-                    <small>$</small>99
-                  </h1>
-                </div>
-                <div class="card-body text-lg-left text-center pt-0">
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-success shadow text-center">
-                      <i class="fas fa-check opacity-10"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">Unlimited team members</span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-success shadow text-center">
-                      <i class="fas fa-check opacity-10"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">100GB Cloud storage </span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-success shadow text-center">
-                      <i class="fas fa-check opacity-10"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">Integration help </span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-success shadow text-center">
-                      <i class="fas fa-check opacity-10"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">Sketch Files </span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-success shadow text-center">
-                      <i class="fas fa-check opacity-10"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">API Access </span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-success shadow text-center">
-                      <i class="fas fa-check opacity-10"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">Complete documentation </span>
-                    </div>
-                  </div>
-
-                  <a href="javascript:;" class="btn btn-icon bg-gradient-dark d-lg-block mt-3 mb-0">
-                    Join
-                    <i class="fas fa-arrow-right ms-1"></i>
-                  </a>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-        <div class="tab-pane" id="annual">
-          <div class="row">
-            <div class="col-lg-4 mb-lg-0 mb-4">
-              <div class="card">
-                <div class="card-header text-center pt-4 pb-3">
-                  <span class="badge rounded-pill bg-light text-dark">Starter</span>
-                  <h1 class="font-weight-bold mt-2">
-                    <small>$</small>119
-                  </h1>
-                </div>
-                <div class="card-body text-lg-left text-center pt-0">
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-success shadow text-center">
-                      <i class="fas fa-check opacity-10"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">2 team members</span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-success shadow text-center">
-                      <i class="fas fa-check opacity-10"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">20GB Cloud storage </span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-secondary shadow text-center">
-                      <i class="fas fa-minus"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">Integration help </span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-secondary shadow text-center">
-                      <i class="fas fa-minus"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">Sketch Files </span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-secondary shadow text-center">
-                      <i class="fas fa-minus"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">API Access </span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-secondary shadow text-center">
-                      <i class="fas fa-minus"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">Complete documentation </span>
-                    </div>
-                  </div>
-
-                  <a href="javascript:;" class="btn btn-icon bg-gradient-dark d-lg-block mt-3 mb-0">
-                    Join
-                    <i class="fas fa-arrow-right ms-1"></i>
-                  </a>
-                </div>
-              </div>
-            </div>
-
-            <div class="col-lg-4 mb-lg-0 mb-4">
-              <div class="card">
-                <div class="card-header text-center pt-4 pb-3">
-                  <span class="badge rounded-pill bg-light text-dark">Premium</span>
-                  <h1 class="font-weight-bold mt-2">
-                    <small>$</small>159
-                  </h1>
-                </div>
-                <div class="card-body text-lg-left text-center pt-0">
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-success shadow text-center">
-                      <i class="fas fa-check opacity-10"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">10 team members</span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-success shadow text-center">
-                      <i class="fas fa-check opacity-10"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">40GB Cloud storage </span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-success shadow text-center">
-                      <i class="fas fa-check opacity-10"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">Integration help </span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-success shadow text-center">
-                      <i class="fas fa-check opacity-10"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">Sketch Files </span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-secondary shadow text-center">
-                      <i class="fas fa-minus"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">API Access </span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-secondary shadow text-center">
-                      <i class="fas fa-minus"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">Complete documentation </span>
-                    </div>
-                  </div>
-
-                  <a href="javascript:;" class="btn btn-icon bg-gradient-primary d-lg-block mt-3 mb-0">
-                    Try Premium
-                    <i class="fas fa-arrow-right ms-1"></i>
-                  </a>
-                </div>
-              </div>
-            </div>
-
-            <div class="col-lg-4 mb-lg-0 mb-4">
-              <div class="card">
-                <div class="card-header text-center pt-4 pb-3">
-                  <span class="badge rounded-pill bg-light text-dark">Enterprise</span>
-                  <h1 class="font-weight-bold mt-2">
-                    <small>$</small>399
-                  </h1>
-                </div>
-                <div class="card-body text-lg-left text-center pt-0">
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-success shadow text-center">
-                      <i class="fas fa-check opacity-10"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">Unlimited team members</span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-success shadow text-center">
-                      <i class="fas fa-check opacity-10"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">100GB Cloud storage </span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-success shadow text-center">
-                      <i class="fas fa-check opacity-10"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">Integration help </span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-success shadow text-center">
-                      <i class="fas fa-check opacity-10"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">Sketch Files </span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-success shadow text-center">
-                      <i class="fas fa-check opacity-10"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">API Access </span>
-                    </div>
-                  </div>
-
-                  <div class="d-flex justify-content-lg-start justify-content-center p-2">
-                    <div class="icon icon-shape icon-xs rounded-circle bg-gradient-success shadow text-center">
-                      <i class="fas fa-check opacity-10"></i>
-                    </div>
-                    <div>
-                      <span class="ps-3">Complete documentation </span>
-                    </div>
-                  </div>
-
-                  <a href="javascript:;" class="btn btn-icon bg-gradient-dark d-lg-block mt-3 mb-0">
-                    Join
-                    <i class="fas fa-arrow-right ms-1"></i>
-                  </a>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Pricing 4

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-5">
-  <div class="container">
-    <div class="row">
-      <div class="col-md-8 mx-auto text-center">
-        <h3>Pick the best plan for you</h3>
-        <p>You have Free Unlimited Updates and Premium Support on each package.</p>
-      </div>
-    </div>
-    <div class="row">
-      <div class="col-lg-8 col-md-10 col-12 mx-auto text-center">
-        <div class="nav-wrapper mt-5">
-          <ul class="nav nav-pills nav-fill flex-row p-1 position-relative" id="tabs-pricing-4" role="tablist">
-            <li class="nav-item">
-              <a class="nav-link mb-0 active" id="tabs-iconpricing-tab-1" data-bs-toggle="tab" href="#tabs-pricing-tab-1" role="tab" aria-controls="tabs-pricing-tab-1" aria-selected="true">
-                Monthly
-              </a>
-            </li>
-            <li class="nav-item">
-              <a class="nav-link mb-0" id="tabs-iconpricing-tab-2" data-bs-toggle="tab" href="#tabs-pricing-tab-2" role="tab" aria-controls="tabs-pricing-tab-2" aria-selected="false">
-                Quarterly
-              </a>
-            </li>
-            <li class="nav-item">
-              <a class="nav-link mb-0" id="tabs-iconpricing-tab-2" data-bs-toggle="tab" href="#tabs-pricing-tab-2" role="tab" aria-controls="tabs-pricing-tab-2" aria-selected="false">
-                Annual
-              </a>
-            </li>
-            <li class="nav-item">
-              <a class="nav-link mb-0" id="tabs-iconpricing-tab-2" data-bs-toggle="tab" href="#tabs-pricing-tab-2" role="tab" aria-controls="tabs-pricing-tab-2" aria-selected="false">
-                Lifetime access
-              </a>
-            </li>
-          </ul>
-        </div>
-      </div>
-    </div>
-    <div class="row mt-5">
-      <div class="col-lg-3 col-sm-6 mb-lg-0 mb-4">
-        <div class="card shadow-none border h-100">
-          <div class="card-header text-sm-left text-center pt-4 pb-3 px-4">
-            <h5 class="mb-1">Starter</h5>
-            <p class="mb-3 text-sm">Free access for 2 members</p>
-            <h3 class="font-weight-bolder mt-3">
-              $199 <small class="text-sm text-secondary font-weight-bold">/ year</small>
-            </h3>
-            <a href="javascript:;" class="btn btn-sm bg-gradient-dark w-100 border-radius-md mt-4 mb-2">Buy now</a>
-          </div>
-          <hr class="horizontal dark my-0">
-          <div class="card-body">
-            <div class="d-flex pb-3">
-              <div>
-                <i class="fas fa-check text-success text-sm"></i>
-              </div>
-              <div class="ps-3">
-                <span class="text-sm">Complete documentation</span>
-              </div>
-            </div>
-
-            <div class="d-flex pb-3">
-              <div>
-                <i class="fas fa-check text-success text-sm"></i>
-              </div>
-              <div class="ps-3">
-                <span class="text-sm">Working materials in Sketch</span>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <div class="col-lg-3 col-sm-6 mb-lg-0 mb-4">
-        <div class="card shadow-none border h-100">
-          <div class="card-header text-sm-left text-center pt-4 pb-3 px-4">
-            <h5 class="mb-1">Pro</h5>
-            <p class="mb-3 text-sm">Free access for 30 members</p>
-            <h3 class="font-weight-bolder mt-3">
-              $299 <small class="text-sm text-secondary font-weight-bold">/ year</small>
-            </h3>
-            <a href="javascript:;" class="btn btn-sm bg-gradient-dark w-100 border-radius-md mt-4 mb-2">Buy now</a>
-          </div>
-          <hr class="horizontal dark my-0">
-          <div class="card-body">
-            <div class="d-flex pb-3">
-              <div>
-                <i class="fas fa-check text-success text-sm"></i>
-              </div>
-              <div class="ps-3">
-                <span class="text-sm">Complete documentation</span>
-              </div>
-            </div>
-
-            <div class="d-flex pb-3">
-              <div>
-                <i class="fas fa-check text-success text-sm"></i>
-              </div>
-              <div class="ps-3">
-                <span class="text-sm">Working materials in Sketch</span>
-              </div>
-            </div>
-
-            <div class="d-flex pb-3">
-              <div>
-                <i class="fas fa-check text-success text-sm"></i>
-              </div>
-              <div class="ps-3">
-                <span class="text-sm">2GB cloud storage</span>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <div class="col-lg-3 col-sm-6 mb-lg-0 mb-4">
-        <div class="card shadow-none border bg-gradient-dark h-100 overflow-hidden">
-          <img src="../../assets/img/shapes/pattern-lines.svg" alt="pattern-lines" class="position-absolute">
-          <div class="card-header bg-transparent text-sm-left text-center pt-4 pb-3 px-4">
-            <h5 class="mb-1 text-white">Premium</h5>
-            <p class="mb-3 text-sm text-white">Free access for 200 members</p>
-            <h3 class="font-weight-bolder mt-3 text-white">
-              $499 <small class="text-sm text-secondary font-weight-bold">/ year</small>
-            </h3>
-            <a href="javascript:;" class="btn btn-sm btn-white w-100 border-radius-md mt-4 mb-2">Buy now</a>
-          </div>
-          <hr class="horizontal light my-0">
-          <div class="card-body">
-            <div class="d-flex pb-3">
-              <div>
-                <i class="fas fa-check text-success text-sm"></i>
-              </div>
-              <div class="ps-3">
-                <span class="text-sm text-white">Complete documentation</span>
-              </div>
-            </div>
-
-            <div class="d-flex pb-3">
-              <div>
-                <i class="fas fa-check text-success text-sm"></i>
-              </div>
-              <div class="ps-3">
-                <span class="text-sm text-white">Working materials in Sketch</span>
-              </div>
-            </div>
-
-            <div class="d-flex pb-3">
-              <div>
-                <i class="fas fa-check text-success text-sm"></i>
-              </div>
-              <div class="ps-3">
-                <span class="text-sm text-white">20GB cloud storage</span>
-              </div>
-            </div>
-
-            <div class="d-flex pb-3">
-              <div>
-                <i class="fas fa-check text-success text-sm"></i>
-              </div>
-              <div class="ps-3">
-                <span class="text-sm text-white">100 team members</span>
-              </div>
-            </div>
-
-          </div>
-        </div>
-      </div>
-
-      <div class="col-lg-3 col-sm-6 mb-lg-0 mb-4">
-        <div class="card shadow-none border h-100">
-          <div class="card-header text-sm-left text-center pt-4 pb-3 px-4">
-            <h5 class="mb-1">Enterprise</h5>
-            <p class="mb-3 text-sm">Free access for all members</p>
-            <h3 class="font-weight-bolder mt-3">
-              $899 <small class="text-sm text-secondary font-weight-bold">/ year</small>
-            </h3>
-            <a href="javascript:;" class="btn btn-sm bg-gradient-dark w-100 border-radius-md mt-4 mb-2">Buy now</a>
-          </div>
-          <hr class="horizontal dark my-0">
-          <div class="card-body">
-            <div class="d-flex pb-3">
-              <div>
-                <i class="fas fa-check text-success text-sm"></i>
-              </div>
-              <div class="ps-3">
-                <span class="text-sm">Complete documentation</span>
-              </div>
-            </div>
-
-            <div class="d-flex pb-3">
-              <div>
-                <i class="fas fa-check text-success text-sm"></i>
-              </div>
-              <div class="ps-3">
-                <span class="text-sm">Working materials in Sketch</span>
-              </div>
-            </div>
-
-            <div class="d-flex pb-3">
-              <div>
-                <i class="fas fa-check text-success text-sm"></i>
-              </div>
-              <div class="ps-3">
-                <span class="text-sm">100GB cloud storage</span>
-              </div>
-            </div>
-
-            <div class="d-flex pb-3">
-              <div>
-                <i class="fas fa-check text-success text-sm"></i>
-              </div>
-              <div class="ps-3">
-                <span class="text-sm">500 team members</span>
-              </div>
-            </div>
-
-            <div class="d-flex pb-3">
-              <div>
-                <i class="fas fa-check text-success text-sm"></i>
-              </div>
-              <div class="ps-3">
-                <span class="text-sm">Premium support</span>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Pricing 5

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-lg-5 bg-light">
-  <div class="container">
-    <div class="row">
-      <div class="col-md-6 mx-auto text-center mb-5">
-        <h2>Best no-tricks pricing</h2>
-        <p class="lead">If you&#39;re not satisfied, contact us within the first 30 days and we&#39;ll send you a full refund.</p>
-      </div>
-    </div>
-    <div class="row">
-      <div class="card">
-       <div class="row">
-          <div class="col-lg-8">
-             <div class="card-body">
-                <h3 class="text-gradient text-info">Lifetime Membership</h3>
-                <p>You have Free Unlimited Updates and Premium Support on each package. You also have 30 days to request a refund.</p>
-                <div class="row mt-5 mb-2">
-                   <div class="col-lg-3 col-12">
-                      <h6 class="text-dark tet-uppercase">What&#39;s included</h6>
-                   </div>
-                   <div class="col-6">
-                      <hr class="horizontal dark">
-                   </div>
-                </div>
-                <div class="row">
-                   <div class="col-lg-6 col-md-6 col-12 ps-0">
-                      <div class="info d-flex align-items-center p-2">
-                         <div class="icon icon-shape icon-xs rounded-circle bg-gradient-info opacity-6 shadow text-center">
-                            <i class="fas fa-check opacity-10"></i>
-                         </div>
-                         <div>
-                            <span class="ps-2">Private code access</span>
-                         </div>
-                      </div>
-                      <div class="info d-flex align-items-center p-2">
-                         <div class="icon icon-shape icon-xs rounded-circle bg-gradient-info opacity-6 shadow text-center">
-                            <i class="fas fa-check opacity-10"></i>
-                         </div>
-                         <div>
-                            <span class="ps-2">Free entry to all repositories</span>
-                         </div>
-                      </div>
-                   </div>
-                   <div class="col-lg-6 col-md-6 col-12">
-                      <div class="info d-flex align-items-center p-2">
-                         <div class="icon icon-shape icon-xs rounded-circle bg-gradient-info opacity-6 shadow text-center">
-                            <i class="fas fa-check opacity-10"></i>
-                         </div>
-                         <div>
-                            <span class="ps-2">Pro member accounts</span>
-                         </div>
-                      </div>
-                      <div class="info d-flex align-items-center p-2">
-                         <div class="icon icon-shape icon-xs rounded-circle bg-gradient-info opacity-6 shadow text-center">
-                            <i class="fas fa-check opacity-10"></i>
-                         </div>
-                         <div>
-                            <span class="ps-2">Support team full assist</span>
-                         </div>
-                      </div>
-                   </div>
-                </div>
-             </div>
-          </div>
-          <div class="col-lg-4 my-auto">
-             <div class="card-body text-center">
-                <h6 class="mt-4 mb-0">Pay once, own it forever</h6>
-                <h1 class="mt-0">
-                   <small>$</small>399
-                </h1>
-                <button type="button" class="btn bg-gradient-info btn-lg mt-2">Get Access</button>
-                <p class="text-sm">Get a free sample (20MB)</p>
-             </div>
-          </div>
-       </div>
-     </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Pricing 6

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-3">
-  <div class="bg-gradient-dark position-relative m-3 border-radius-xl">
-    <img src="../../assets/img/shapes/waves-white.svg" alt="pattern-lines" class="position-absolute start-0 top-md-0 w-100 opacity-6">
-    <div class="container pb-lg-9 pb-7 pt-7 postion-relative z-index-2">
-      <div class="row">
-        <div class="col-md-8 mx-auto text-center">
-          <span class="badge bg-gradient-info mb-2">Pricing</span>
-          <h3 class="text-white">See our pricing</h3>
-          <p class="text-white">You have Free Unlimited Updates and Premium Support on each package.</p>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div class="mt-n8">
-    <div class="container">
-      <div class="row">
-        <div class="col-lg-3 mb-lg-auto mb-4 my-auto p-md-0 ms-auto">
-          <div class="card border-radius-top-end-lg-0 border-radius-bottom-end-lg-0">
-            <div class="card-header text-center pt-4 pb-3">
-              <h6 class="text-dark opacity-8 text mb-0">Starter</h6>
-              <h1 class="font-weight-bolder">
-                <small>$</small>199
-              </h1>
-            </div>
-            <div class="card-body mx-auto pt-0">
-              <div class="justify-content-left d-flex px-2 py-1">
-                <div>
-                  <i class="fas fa-check text-info text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">Complete documentation</span>
-                </div>
-              </div>
-
-              <div class="justify-content-left d-flex px-2 py-1">
-                <div>
-                  <i class="fas fa-check text-info text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">Working materials in Sketch</span>
-                </div>
-              </div>
-
-              <div class="justify-content-left d-flex px-2 py-1">
-                <div>
-                  <i class="fas fa-check text-info text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">500MB cloud storage</span>
-                </div>
-              </div>
-
-              <div class="justify-content-left d-flex px-2 py-1">
-                <div>
-                  <i class="fas fa-check text-info text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">Lite support</span>
-                </div>
-              </div>
-            </div>
-            <div class="card-footer pt-0">
-              <a href="javascript:;" class="btn w-100 bg-gradient-dark mb-0">
-                Buy now
-              </a>
-            </div>
-          </div>
-        </div>
-
-        <div class="col-lg-3 p-md-0 mb-lg-auto mb-4 z-index-2">
-          <div class="card">
-            <div class="card-header text-center pt-4 pb-3">
-              <h6 class="text-dark opacity-8 text mb-0 mt-2">Pro</h6>
-              <h1 class="font-weight-bolder">
-                <small>$</small>299
-              </h1>
-            </div>
-            <div class="card-body mx-auto pt-0">
-              <div class="justify-content-left d-flex px-2 py-1">
-                <div>
-                  <i class="fas fa-check text-info text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">Complete documentation</span>
-                </div>
-              </div>
-
-              <div class="justify-content-left d-flex px-2 py-1">
-                <div>
-                  <i class="fas fa-check text-info text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">Working materials in Sketch</span>
-                </div>
-              </div>
-
-              <div class="justify-content-left d-flex px-2 py-1">
-                <div>
-                  <i class="fas fa-check text-info text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">100GB cloud storage</span>
-                </div>
-              </div>
-
-              <div class="justify-content-left d-flex px-2 py-1">
-                <div>
-                  <i class="fas fa-check text-info text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">500 team members</span>
-                </div>
-              </div>
-
-              <div class="justify-content-left d-flex px-2 py-1">
-                <div>
-                  <i class="fas fa-check text-info text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">Premium support</span>
-                </div>
-              </div>
-            </div>
-            <div class="card-footer pt-0">
-              <a href="javascript:;" class="btn btn-icon bg-gradient-info d-block mb-0">
-                Try Pro
-                <i class="fas fa-arrow-right ms-1"></i>
-              </a>
-            </div>
-          </div>
-        </div>
-
-        <div class="col-lg-3 mb-lg-auto mb-4 my-auto p-md-0 me-auto">
-          <div class="card border-radius-top-start-lg-0 border-radius-bottom-start-lg-0">
-            <div class="card-header text-center pt-4 pb-2">
-              <h6 class="text-dark opacity-8 text mb-0">Premium</h6>
-              <h1 class="font-weight-bolder">
-                <small>$</small>399
-              </h1>
-            </div>
-            <div class="card-body mx-auto pt-0">
-              <div class="justify-content-left d-flex px-2 py-1 py-1">
-                <div>
-                  <i class="fas fa-check text-info text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">Complete documentation</span>
-                </div>
-              </div>
-              <div class="justify-content-left d-flex px-2 py-1 py-1">
-                <div>
-                  <i class="fas fa-check text-info text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">Working materials in Sketch</span>
-                </div>
-              </div>
-              <div class="justify-content-left d-flex px-2 py-1 py-1">
-                <div>
-                  <i class="fas fa-check text-info text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">2GB cloud storage</span>
-                </div>
-              </div>
-              <div class="justify-content-left d-flex px-2 py-1">
-                <div>
-                  <i class="fas fa-check text-info text-sm"></i>
-                </div>
-                <div class="ps-2">
-                  <span class="text-sm">Premium support</span>
-                </div>
-              </div>
-            </div>
-            <div class="card-footer pt-0">
-              <a href="javascript:;" class="btn w-100 bg-gradient-dark mb-0">Buy now</a>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Pricing 7

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-5 bg-gradient-dark position-relative overflow-hidden">
-  <img src="../../assets/img/shapes/pattern-lines.svg" alt="pattern-lines" class="position-absolute start-0 top-0 w-100 h-100 opacity-6">
-  <div class="position-absolute w-100 z-inde-1 top-0 mt-n3">
-    <svg width="100%" viewBox="0 -2 1920 157" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-        <title>wave-down</title>
-        <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-            <g id="Artboard" fill="#FFFFFF" fill-rule="nonzero">
-                <g id="wave-down">
-                    <path d="M0,60.8320331 C299.333333,115.127115 618.333333,111.165365 959,47.8320321 C1299.66667,-15.5013009 1620.66667,-15.2062179 1920,47.8320331 L1920,156.389409 L0,156.389409 L0,60.8320331 Z" id="Path-Copy-2" transform="translate(960.000000, 78.416017) rotate(180.000000) translate(-960.000000, -78.416017) "></path>
-                </g>
-            </g>
-        </g>
-    </svg>
-  </div>
-  <div class="container py-7 postion-relative z-index-2">
-    <div class="col-lg-6 col-md-8 mx-auto text-center mb-5">
-      <h3 class="text-white">Pick the best plan for you</h3>
-      <p class="text-white opacity-6">You have Free Unlimited Updates and Premium Support on each package.</p>
-    </div>
-    <div class="row">
-      <div class="col-lg-4 col-md-6 ms-lg-auto mb-sm-0 mb-5">
-        <div class="card text-center">
-          <div class="card-header bg-transparent">
-            <h5 class="mt-4 mb-2">Freelancer</h5>
-            <h2>
-              $29 <small class="text-sm text-secondary font-weight-bold">/ month</small>
-            </h2>
-          </div>
-          <div class="card-body">
-            <ul class="list-unstyled max-width-200 mx-auto">
-              <li>
-                <b>10</b> Projects
-              </li>
-              <hr class="horizontal dark">
-              <li>
-                <b>1</b> Team Members
-              </li>
-              <hr class="horizontal dark">
-              <li>
-                <b>5</b> Personal Contacts
-              </li>
-              <hr class="horizontal dark">
-              <li>
-                <b>500</b> Messages
-              </li>
-            </ul>
-            <button type="button" class="btn bg-gradient-warning mt-4">Get Access</button>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-4 col-md-6 me-lg-auto">
-        <div class="card text-center bg-gradient-warning">
-          <div class="card-header bg-transparent">
-            <h5 class="mt-4 mb-2 text-white">Startup</h5>
-            <h2 class="text-white">
-              $49 <small class="text-sm">/ month</small>
-            </h2>
-          </div>
-          <div class="card-body">
-            <ul class="list-unstyled max-width-200 mx-auto text-white">
-              <li>
-                <b>100</b> Projects
-              </li>
-              <hr class="horizontal light">
-              <li>
-                <b>25</b> Team Members
-              </li>
-              <hr class="horizontal light">
-              <li>
-                <b>15</b> Personal Contacts
-              </li>
-              <hr class="horizontal light">
-              <li>
-                <b>5K</b> Messages
-              </li>
-            </ul>
-            <button type="button" class="btn btn-white mt-4">Get Access</button>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div class="position-absolute w-100 bottom-0">
-    <svg width="100%" viewBox="0 -1 1920 166" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-        <title>wave-up</title>
-        <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-            <g id="Artboard" transform="translate(0.000000, 5.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                <g id="wave-up" transform="translate(0.000000, -5.000000)">
-                    <path d="M0,70 C298.666667,105.333333 618.666667,95 960,39 C1301.33333,-17 1621.33333,-11.3333333 1920,56 L1920,165 L0,165 L0,70 Z" id="Path"></path>
-                </g>
-            </g>
-        </g>
-    </svg>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Pricing 8

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-4 bg-gray-100">
-  <div class="container">
-    <div class="row">
-      <div class="col-lg-6 col-md-8 mx-auto text-center">
-        <h3>Pick the best plan for you</h3>
-        <p>You have Free Unlimited Updates and Premium Support on each package.</p>
-      </div>
-    </div>
-    <div class="row">
-      <div class="col-lg-4 col-md-6 col-8 mx-auto mt-4 mb-3">
-        <div class="nav-wrapper">
-          <ul class="nav nav-pills nav-pills-info nav-fill p-1" id="tabs-pricing" role="tablist">
-            <li class="nav-item">
-              <a class="nav-link mb-sm-3 mb-md-0 active" id="tabs-iconpricing-tab-1" data-bs-toggle="tab" href="#tabs-pricing-tab-1" role="tab" aria-controls="tabs-pricing-tab-1" aria-selected="true">
-                Annual
-              </a>
-            </li>
-            <li class="nav-item">
-              <a class="nav-link mb-sm-3 mb-md-0" id="tabs-iconpricing-tab-2" data-bs-toggle="tab" href="#tabs-pricing-tab-2" role="tab" aria-controls="tabs-pricing-tab-2" aria-selected="false">
-                Monthly
-              </a>
-            </li>
-          </ul>
-        </div>
-      </div>
-    </div>
-    <div class="row">
-      <div class="col-lg-4 col-md-6">
-        <div class="card card-pricing">
-          <div class="card-header bg-gradient-dark text-center pt-4 pb-5 position-relative">
-            <div class="z-index-1 position-relative">
-              <h5 class="text-white">Freelancer</h5>
-              <h1 class="text-white mt-2 mb-0">
-                <small>$</small>199</h1>
-              <h6 class="text-white">per year</h6>
-            </div>
-          </div>
-          <div class="position-relative mt-n5" style="height: 50px;">
-            <div class="position-absolute w-100">
-                <svg class="waves waves-sm" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 24 150 40" preserveAspectRatio="none" shape-rendering="auto">
-                  <defs>
-                    <path id="card-wave" d="M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z"></path>
-                  </defs>
-                  <g class="moving-waves">
-                    <use xlink:href="#card-wave" x="48" y="-1" fill="rgba(255,255,255,0.30"></use>
-                    <use xlink:href="#card-wave" x="48" y="3" fill="rgba(255,255,255,0.35)"></use>
-                    <use xlink:href="#card-wave" x="48" y="5" fill="rgba(255,255,255,0.25)"></use>
-                    <use xlink:href="#card-wave" x="48" y="8" fill="rgba(255,255,255,0.20)"></use>
-                    <use xlink:href="#card-wave" x="48" y="13" fill="rgba(255,255,255,0.15)"></use>
-                    <use xlink:href="#card-wave" x="48" y="16" fill="rgba(255,255,255,0.99)"></use>
-                  </g>
-                </svg>
-              </div>
-          </div>
-          <div class="card-body text-center">
-            <ul class="list-unstyled max-width-200 mx-auto">
-              <li>
-                <b>10</b> Projects
-                <hr class="horizontal dark">
-              </li>
-              <li>
-                <b>1</b> Team Members
-                <hr class="horizontal dark">
-              </li>
-              <li>
-                <b>5</b> Personal Contacts
-                <hr class="horizontal dark">
-              </li>
-              <li>
-                <b>500</b> Messages
-              </li>
-            </ul>
-            <a href="javascript:;" class="btn bg-gradient-dark w-100 mt-4 mb-0">
-              Get started
-            </a>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-4 col-md-6 mt-5 mt-sm-0 ">
-        <div class="card card-pricing">
-          <div class="card-header text-center pt-4 pb-5 position-relative" style="background-image: url(&#39;../../assets/img/curved-images/curved6-small.jpg&#39;);background-size: cover;">
-            <span class="mask bg-gradient-dark opacity-4 border-radius-lg"></span>
-            <div class="z-index-1 position-relative">
-              <h5 class="text-white">Startup</h5>
-              <h1 class="text-white mt-2 mb-0">
-                <small>$</small>349</h1>
-              <h6 class="text-white">per year</h6>
-            </div>
-          </div>
-          <div class="position-relative mt-n5" style="height: 50px;">
-            <div class="position-absolute w-100">
-                <svg class="waves waves-sm" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 24 150 40" preserveAspectRatio="none" shape-rendering="auto">
-                  <defs>
-                    <path id="card-wave" d="M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z"></path>
-                  </defs>
-                  <g class="moving-waves">
-                    <use xlink:href="#card-wave" x="48" y="-1" fill="rgba(255,255,255,0.30"></use>
-                    <use xlink:href="#card-wave" x="48" y="3" fill="rgba(255,255,255,0.35)"></use>
-                    <use xlink:href="#card-wave" x="48" y="5" fill="rgba(255,255,255,0.25)"></use>
-                    <use xlink:href="#card-wave" x="48" y="8" fill="rgba(255,255,255,0.20)"></use>
-                    <use xlink:href="#card-wave" x="48" y="13" fill="rgba(255,255,255,0.15)"></use>
-                    <use xlink:href="#card-wave" x="48" y="16" fill="rgba(255,255,255,0.99)"></use>
-                  </g>
-                </svg>
-              </div>
-          </div>
-          <div class="card-body text-center">
-            <ul class="list-unstyled max-width-200 mx-auto">
-              <li>
-                <b>10</b> Projects
-                <hr class="horizontal dark">
-              </li>
-              <li>
-                <b>1</b> Team Members
-                <hr class="horizontal dark">
-              </li>
-              <li>
-                <b>5</b> Personal Contacts
-                <hr class="horizontal dark">
-              </li>
-              <li>
-                <b>500</b> Messages
-              </li>
-            </ul>
-            <a href="javascript:;" class="btn bg-gradient-primary w-100 mt-4 mb-0">
-              Get started
-            </a>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-4 col-md-6 mt-5 mt-lg-0 mx-md-auto">
-        <div class="card card-pricing">
-          <div class="card-header bg-gradient-dark text-center pt-4 pb-5 position-relative">
-            <div class="z-index-1 position-relative">
-              <h5 class="text-white">Company</h5>
-              <h1 class="text-white mt-2 mb-0">
-                <small>$</small>779</h1>
-              <h6 class="text-white">per year</h6>
-            </div>
-          </div>
-          <div class="position-relative mt-n5" style="height: 50px;">
-            <div class="position-absolute w-100">
-                <svg class="waves waves-sm" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 24 150 40" preserveAspectRatio="none" shape-rendering="auto">
-                  <defs>
-                    <path id="card-wave" d="M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z"></path>
-                  </defs>
-                  <g class="moving-waves">
-                    <use xlink:href="#card-wave" x="48" y="-1" fill="rgba(255,255,255,0.30"></use>
-                    <use xlink:href="#card-wave" x="48" y="3" fill="rgba(255,255,255,0.35)"></use>
-                    <use xlink:href="#card-wave" x="48" y="5" fill="rgba(255,255,255,0.25)"></use>
-                    <use xlink:href="#card-wave" x="48" y="8" fill="rgba(255,255,255,0.20)"></use>
-                    <use xlink:href="#card-wave" x="48" y="13" fill="rgba(255,255,255,0.15)"></use>
-                    <use xlink:href="#card-wave" x="48" y="16" fill="rgba(255,255,255,0.99)"></use>
-                  </g>
-                </svg>
-              </div>
-          </div>
-          <div class="card-body text-center">
-            <ul class="list-unstyled max-width-200 mx-auto">
-              <li>
-                <b>10</b> Projects
-                <hr class="horizontal dark">
-              </li>
-              <li>
-                <b>1</b> Team Members
-                <hr class="horizontal dark">
-              </li>
-              <li>
-                <b>5</b> Personal Contacts
-                <hr class="horizontal dark">
-              </li>
-              <li>
-                <b>500</b> Messages
-              </li>
-            </ul>
-            <a href="javascript:;" class="btn bg-gradient-dark w-100 mt-4 mb-0">
-              Get started
-            </a>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
- - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/sections/page-sections/stats.html b/sections/page-sections/stats.html deleted file mode 100644 index 18b14454..00000000 --- a/sections/page-sections/stats.html +++ /dev/null @@ -1,1103 +0,0 @@ - - - - - - - - - - - Soft UI Design System by Creative Tim - - - - - - - - - - - - - - - - - - - -
-
-
-
- -

Stats

-
-
-
-
-
-

Stats 1

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-10" id="count-stats">
-  <div class="container">
-    <div class="row justify-content-center text-center">
-      <div class="col-md-3">
-        <h1 class="text-gradient text-info" id="state1" countTo="300"></h1>
-        <h5 class="mt-3">Projects</h5>
-        <p>Of “high-performing” level are led by a certified project manager</p>
-      </div>
-      <div class="col-md-3">
-        <h1 class="text-gradient text-info" id="state2" countTo="70"></h1>
-        <h5 class="mt-3">Hours</h5>
-        <p>That meets quality standards required by our users</p>
-      </div>
-      <div class="col-md-3">
-        <h1 class="text-gradient text-info" id="state3" countTo="30"></h1>
-        <h5 class="mt-3">Support</h5>
-        <p>Actively engage team members that finishes on time</p>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-<!-- Mandatory scripts -->
-<script src="../../assets/js/plugins/countup.min.js"></script>
-<script src="https://demos.creative-tim.com/soft-ui-design-system-pro/assets/js/soft-design-system-pro.min.js?v=1.0.1" type="text/javascript"></script>
-<script type="text/javascript">
-  if (document.getElementById("state1")) {
-    const countUp = new CountUp("state1", document.getElementById("state1").getAttribute("countTo"));
-    if (!countUp.error) {
-      countUp.start();
-    } else {
-      console.error(countUp.error);
-    }
-  }
-  if (document.getElementById("state2")) {
-    const countUp1 = new CountUp("state2", document.getElementById("state2").getAttribute("countTo"));
-    if (!countUp1.error) {
-      countUp1.start();
-    } else {
-      console.error(countUp1.error);
-    }
-  }
-  if (document.getElementById("state3")) {
-    const countUp2 = new CountUp("state3", document.getElementById("state3").getAttribute("countTo"));
-    if (!countUp2.error) {
-      countUp2.start();
-    } else {
-      console.error(countUp2.error);
-    };
-  }
-</script>
-
-
-
-
-
-
-
-
-
-

Stats 2

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-10">
-  <div class="container">
-    <div class="row justify-content-center text-center">
-      <div class="col-md-3">
-        <h1 class="text-gradient text-primary">323</h1>
-        <h5 class="mt-3">Projects</h5>
-        <p>Of “high-performing” level are led by a certified project manager</p>
-      </div>
-      <div class="col-md-3">
-        <h1 class="text-gradient text-primary">500+</h1>
-        <h5 class="mt-3">Hours</h5>
-        <p>That meets quality standards required by our users</p>
-      </div>
-      <div class="col-md-3">
-        <h1 class="text-gradient text-primary">24/7</h1>
-        <h5 class="mt-3">Support</h5>
-        <p>Actively engage team members that finishes on time</p>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Stats 3

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-11">
-  <div class="container">
-    <div class="row justify-content-center text-center">
-      <div class="col-md-3">
-        <h1 class="text-gradient text-warning">700</h1>
-        <p>Of “high-performing” level are led by a certified project manager</p>
-      </div>
-      <div class="col-md-3">
-        <h1 class="text-gradient text-warning">1200+</h1>
-        <p>That meets quality standards required by our users</p>
-      </div>
-      <div class="col-md-3">
-        <h1 class="text-gradient text-warning">>300</h1>
-        <p>Actively engage team members that finishes on time</p>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
- - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/sections/page-sections/teams.html b/sections/page-sections/teams.html deleted file mode 100644 index 672f88e7..00000000 --- a/sections/page-sections/teams.html +++ /dev/null @@ -1,2279 +0,0 @@ - - - - - - - - - - - Soft UI Design System by Creative Tim - - - - - - - - - - - - - - - - - - - -
-
-
-
- -

Teams

-
-
-
-
-
-

Team 1

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-5">
-  <div class="container">
-    <div class="row">
-      <div class="col-md-7 mb-5">
-        <div class="icon icon-shape bg-gradient-primary shadow text-center mb-3">
-          <i class="fas fa-user"></i>
-        </div>
-        <h3>Our Awesome Team</h3>
-        <p>This is the paragraph where you can write more details about your team. Keep you user engaged by providing meaningful information.</p>
-      </div>
-    </div>
-    <div class="row mt-5">
-      <div class="col-lg-4 col-md-6 mt-md-0 mt-5">
-        <div class="card card-profile card-plain">
-          <div class="text-left mt-n5 z-index-1">
-            <div class="position-relative w-25">
-              <div class="blur-shadow-avatar">
-                <img class="avatar avatar-xxl shadow-lg" src="../../assets/img/bruce-mars.jpg">
-              </div>
-            </div>
-          </div>
-          <div class="card-body ps-0">
-            <h5 class="mb-0">Alec Thompson</h5>
-            <p class="text-muted">CEO / Co-Founder</p>
-            <p>
-              And I love you like Kanye loves Kanye. We need to restart the human foundation.
-            </p>
-            <button type="button" class="btn-icon-only btn-simple btn btn-lg btn-twitter" data-toggle="tooltip" data-placement="bottom" title="Follow me!">
-              <span class="btn-inner--icon"><i class="fab fa-twitter"></i></span>
-            </button>
-            <button type="button" class="btn-icon-only btn-simple btn btn-lg btn-dribbble" data-toggle="tooltip" data-placement="bottom" title="Follow me!">
-              <span class="btn-inner--icon"><i class="fab fa-dribbble"></i></span>
-            </button>
-            <button type="button" class="btn-icon-only btn-simple btn btn-lg btn-linkedin" data-toggle="tooltip" data-placement="bottom" title="Follow me!">
-              <span class="btn-inner--icon"><i class="fab fa-linkedin"></i></span>
-            </button>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-4 col-md-6 mt-md-0 mt-5">
-        <div class="card card-profile card-plain">
-          <div class="mt-n5 z-index-1">
-            <div class="position-relative w-25">
-              <div class="blur-shadow-avatar">
-                <img class="avatar avatar-xxl shadow-lg" src="../../assets/img/team-3.jpg">
-              </div>
-            </div>
-          </div>
-          <div class="card-body ps-0">
-            <h5 class="mb-0">Alec Thompson</h5>
-            <p class="text-muted">CEO / Co-Founder</p>
-            <p>
-              And I love you like Kanye loves Kanye. We need to restart the human foundation.
-            </p>
-            <button type="button" class="btn-icon-only btn-simple btn btn-lg btn-twitter" data-toggle="tooltip" data-placement="bottom" title="Follow me!">
-              <span class="btn-inner--icon"><i class="fab fa-twitter"></i></span>
-            </button>
-            <button type="button" class="btn-icon-only btn-simple btn btn-lg btn-dribbble" data-toggle="tooltip" data-placement="bottom" title="Follow me!">
-              <span class="btn-inner--icon"><i class="fab fa-dribbble"></i></span>
-            </button>
-            <button type="button" class="btn-icon-only btn-simple btn btn-lg btn-linkedin" data-toggle="tooltip" data-placement="bottom" title="Follow me!">
-              <span class="btn-inner--icon"><i class="fab fa-linkedin"></i></span>
-            </button>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-4 col-md-6 mx-md-auto mt-md-0 mt-5">
-        <div class="card card-profile card-plain">
-          <div class="mt-n5 z-index-1">
-            <div class="position-relative w-25">
-              <div class="blur-shadow-avatar">
-                <img class="avatar avatar-xxl shadow-lg" src="../../assets/img/team-4.jpg">
-              </div>
-            </div>
-          </div>
-          <div class="card-body ps-0">
-            <h5 class="mb-0">Alec Thompson</h5>
-            <p class="text-muted">CEO / Co-Founder</p>
-            <p>
-              And I love you like Kanye loves Kanye. We need to restart the human foundation.
-            </p>
-            <button type="button" class="btn-icon-only btn-simple btn btn-lg btn-twitter" data-toggle="tooltip" data-placement="bottom" title="Follow me!">
-              <span class="btn-inner--icon"><i class="fab fa-twitter"></i></span>
-            </button>
-            <button type="button" class="btn-icon-only btn-simple btn btn-lg btn-dribbble" data-toggle="tooltip" data-placement="bottom" title="Follow me!">
-              <span class="btn-inner--icon"><i class="fab fa-dribbble"></i></span>
-            </button>
-            <button type="button" class="btn-icon-only btn-simple btn btn-lg btn-linkedin" data-toggle="tooltip" data-placement="bottom" title="Follow me!">
-              <span class="btn-inner--icon"><i class="fab fa-linkedin"></i></span>
-            </button>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Team 2

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-5">
-  <div class="container">
-    <div class="row">
-      <div class="col-md-8 mx-auto text-center mb-5">
-        <h3 class="text-gradient text-info">The Executive Team</h3>
-        <p class="font-weight-normal">This is the paragraph where you can write more details about your team. Keep you user engaged by providing meaningful information.</p>
-      </div>
-    </div>
-    <div class="row mt-lg-5 mt-3">
-      <div class="col-md-6">
-        <div class="card card-profile card-plain">
-          <div class="row">
-            <div class="col-lg-5">
-              <a href="javascript:;">
-                <div class="position-relative">
-                  <div class="blur-shadow-image">
-                    <img class="w-100 rounded-3 shadow-lg" src="../../assets/img/kal-visuals.jpg">
-                  </div>
-                </div>
-              </a>
-            </div>
-            <div class="col-lg-7 ps-0 my-auto">
-              <div class="card-body text-left">
-                <div class="p-md-0 pt-3">
-                  <h5 class="font-weight-bolder mb-0">Ryan Samuel</h5>
-                  <p class="text-uppercase text-sm font-weight-bold mb-2">Financial Examiner</p>
-                </div>
-                <p class="mb-4">Today you are you! That is truer than true! There is no one alive who is you-er than you!</p>
-                <button type="button" class="btn btn-facebook btn-simple btn-lg mb-0 pe-3 ps-2">
-                  <i class="fab fa-facebook"></i>
-                </button>
-                <button type="button" class="btn btn-twitter btn-simple btn-lg mb-0 px-2">
-                  <i class="fab fa-twitter"></i>
-                </button>
-                <button type="button" class="btn btn-github btn-simple btn-lg mb-0 px-2">
-                  <i class="fab fa-github"></i>
-                </button>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="col-md-6">
-        <div class="card card-profile card-plain">
-          <div class="row">
-            <div class="col-lg-5">
-              <a href="javascript:;">
-                <div class="position-relative">
-                  <div class="blur-shadow-image">
-                    <img class="w-100 rounded-3 shadow-lg" src="../../assets/img/jordan.jpg">
-                  </div>
-                </div>
-              </a>
-            </div>
-            <div class="col-lg-7 ps-0 my-auto">
-              <div class="card-body text-left">
-                <div class="p-md-0 pt-3">
-                  <h5 class="font-weight-bolder mb-0">Jordan Michael</h5>
-                  <p class="text-uppercase text-sm font-weight-bold mb-2">UI Designer</p>
-                </div>
-                <p class="mb-4">Artist is a term applied to a person who engages in an activity deemed to be an art.</p>
-                <button type="button" class="btn btn-facebook btn-simple btn-lg mb-0 pe-3 ps-2">
-                  <i class="fab fa-facebook"></i>
-                </button>
-                <button type="button" class="btn btn-twitter btn-simple btn-lg mb-0 px-2">
-                  <i class="fab fa-twitter"></i>
-                </button>
-                <button type="button" class="btn btn-github btn-simple btn-lg mb-0 px-2">
-                  <i class="fab fa-github"></i>
-                </button>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div class="row mt-lg-5 mt-3">
-      <div class="col-md-6">
-        <div class="card card-profile card-plain">
-          <div class="row">
-            <div class="col-lg-5">
-              <a href="javascript:;">
-                <div class="position-relative">
-                  <div class="blur-shadow-image">
-                    <img class="w-100 rounded-3 shadow-lg" src="../../assets/img/ivana.jpg">
-                  </div>
-                </div>
-              </a>
-            </div>
-            <div class="col-lg-7 ps-0 my-auto">
-              <div class="card-body text-left">
-                <div class="p-md-0 pt-3">
-                  <h5 class="font-weight-bolder mb-0">Nora Hazel</h5>
-                  <p class="text-uppercase text-sm font-weight-bold mb-2">Legal Secretary</p>
-                </div>
-                <p class="mb-4">Do not dwell in the past, do not dream of the future, concentrate the mind...</p>
-                <button type="button" class="btn btn-facebook btn-simple btn-lg mb-0 pe-3 ps-2">
-                  <i class="fab fa-facebook"></i>
-                </button>
-                <button type="button" class="btn btn-twitter btn-simple btn-lg mb-0 px-2">
-                  <i class="fab fa-twitter"></i>
-                </button>
-                <button type="button" class="btn btn-github btn-simple btn-lg mb-0 px-2">
-                  <i class="fab fa-github"></i>
-                </button>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="col-md-6">
-        <div class="card card-profile card-plain">
-          <div class="row">
-            <div class="col-lg-5">
-              <a href="javascript:;">
-                <div class="position-relative">
-                  <div class="blur-shadow-image">
-                    <img class="w-100 rounded-3 shadow-lg" src="../../assets/img/brooke.jpg">
-                  </div>
-                </div>
-              </a>
-            </div>
-            <div class="col-lg-7 ps-0 my-auto">
-              <div class="card-body text-left">
-                <div class="p-md-0 pt-3">
-                  <h5 class="font-weight-bolder mb-0">Otto Gonzalez</h5>
-                  <p class="text-uppercase text-sm font-weight-bold mb-2">Landscape Architect</p>
-                </div>
-                <p class="mb-4">Success is not final, failure is not fatal: it is the courage to continue that counts...</p>
-                <button type="button" class="btn btn-facebook btn-simple btn-lg mb-0 pe-3 ps-2">
-                  <i class="fab fa-facebook"></i>
-                </button>
-                <button type="button" class="btn btn-twitter btn-simple btn-lg mb-0 px-2">
-                  <i class="fab fa-twitter"></i>
-                </button>
-                <button type="button" class="btn btn-github btn-simple btn-lg mb-0 px-2">
-                  <i class="fab fa-github"></i>
-                </button>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-<!-- END Teams w/ 4 cards w/ image on left & descriptio/social link on right -->
-
-
-
-
-
-
-
-
-
-

Team 3

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-7 position-relative" style="background-image: url(&#39;../../assets/img/curved-images/curved14.jpg&#39;); background-size:cover;">
-  <span class="mask bg-gradient-dark"></span>
-  <div class="container position-relative mb-4">
-    <div class="row">
-      <div class="col-md-8 mx-auto text-center mb-5">
-        <div class="icon icon-shape bg-gradient-info shadow text-center mb-3">
-          <i class="fas fa-users"></i>
-        </div>
-        <h3 class="text-white z-index-1 position-relative">The Executive Team</h3>
-        <p class="lead text-white opacity-6">There’s nothing I really wanted to do in life that I wasn’t able to get good at. That’s my skill.</p>
-      </div>
-    </div>
-    <div class="row">
-      <div class="col-lg-6 col-12">
-        <div class="card card-profile overflow-hidden">
-          <div class="row">
-            <div class="col-lg-4 col-md-6 col-12 pe-lg-0">
-              <a href="javascript:;">
-                <div class="p-3 pe-0">
-                  <img class="w-100 border-radius-md" src="../../assets/img/kal-visuals-square.jpg">
-                </div>
-              </a>
-            </div>
-            <div class="col-lg-8 col-md-6 col-12 ps-lg-0 my-auto">
-              <div class="card-body">
-                <h5 class="mb-0">Emma Roberts</h5>
-                <h6 class="text-info">UI Designer</h6>
-                <p class="mb-0">Artist is a term applied to a person who engages in an activity deemed to be an art.</p>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-6 col-12">
-        <div class="card card-profile mt-lg-0 mt-5 overflow-hidden">
-          <div class="row">
-            <div class="col-lg-4 col-md-6 col-12 pe-lg-0">
-              <a href="javascript:;">
-                <div class="p-3 pe-0">
-                <img class="w-100 border-radius-md" src="../../assets/img/bruce-mars.jpg">
-                </div>
-              </a>
-            </div>
-            <div class="col-lg-8 col-md-6 col-12 ps-lg-0 my-auto">
-              <div class="card-body">
-                <h5 class="mb-0">William Pearce</h5>
-                <h6 class="text-info">Boss</h6>
-                <p>Artist is a term applied to a person who engages in an activity deemed to be an art.</p>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-    <div class="row mt-5">
-      <div class="col-lg-6 col-12">
-        <div class="card card-profile overflow-hidden">
-          <div class="row">
-            <div class="col-lg-4 col-md-6 col-12 pe-lg-0">
-              <a href="javascript:;">
-                <div class="p-3 pe-0">
-
-                <img class="w-100 border-radius-md" src="../../assets/img/team-4.jpg">
-                </div>
-              </a>
-            </div>
-            <div class="col-lg-8 col-md-6 col-12 ps-lg-0 my-auto">
-              <div class="card-body">
-                <h5 class="mb-0">Ivana Flow</h5>
-                <h6 class="text-info">Athlete</h6>
-                <p>Artist is a term applied to a person who engages in an activity deemed to be an art.</p>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-6 col-12">
-        <div class="card card-profile mt-lg-0 mt-5 overflow-hidden">
-          <div class="row">
-            <div class="col-lg-4 col-md-6 col-12 pe-lg-0">
-              <a href="javascript:;">
-                <div class="p-3 pe-0">
-
-                <img class="w-100 border-radius-md" src="../../assets/img/ivana-square.jpg">
-                </div>
-              </a>
-            </div>
-            <div class="col-lg-8 col-md-6 col-12 ps-lg-0 my-auto">
-              <div class="card-body">
-                <h5 class="mb-0">Sophia Garcia</h5>
-                <h6 class="text-info">JS Developer</h6>
-                <p>Artist is a term applied to a person who engages in an activity deemed to be an art.</p>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div class="position-absolute w-100 z-index-1 bottom-0">
-    <svg class="waves" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 24 150 40" preserveAspectRatio="none" shape-rendering="auto">
-      <defs>
-        <path id="gentle-wave" d="M-160 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z"></path>
-      </defs>
-      <g class="moving-waves">
-        <use xlink:href="#gentle-wave" x="48" y="-1" fill="rgba(255,255,255,0.40"></use>
-        <use xlink:href="#gentle-wave" x="48" y="3" fill="rgba(255,255,255,0.35)"></use>
-        <use xlink:href="#gentle-wave" x="48" y="5" fill="rgba(255,255,255,0.25)"></use>
-        <use xlink:href="#gentle-wave" x="48" y="8" fill="rgba(255,255,255,0.20)"></use>
-        <use xlink:href="#gentle-wave" x="48" y="13" fill="rgba(255,255,255,0.15)"></use>
-        <use xlink:href="#gentle-wave" x="48" y="16" fill="rgba(255,255,255,0.95"></use>
-      </g>
-    </svg>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Team 4

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- START Teams w/ 4 cards in a row w/ image & name & function -->
-<section class="py-5">
-  <div class="container">
-    <div class="row">
-      <div class="col-md-8 mx-auto text-center">
-        <h6 class="text-gradient text-warning">The Executive Team</h6>
-        <h2>Building the future</h2>
-      </div>
-    </div>
-    <div class="row mt-md-5 mt-4">
-      <div class="col-lg-3 col-6 mb-lg-0 mb-4">
-        <div class="card card-profile card-plain">
-          <div class="card-body text-center bg-white shadow-lg border-radius-lg p-3">
-            <a href="javascript:;">
-              <img class="w-100 border-radius-md" src="../../assets/img/kal-visuals.jpg">
-            </a>
-            <h5 class="mt-3 mb-1 d-md-block d-none">Miriam Lendra</h5>
-            <p class="mb-1 d-md-none d-block text-sm font-weight-bold text-darker">Miriam Lendra</p>
-            <p class="mb-0 text-xs font-weight-bolder text-warning text-gradient text-uppercase">Desktop Publisher</p>
-          </div>
-        </div>
-      </div>
-
-      <div class="col-lg-3 col-6 mb-lg-0 mb-4">
-        <div class="card card-profile card-plain">
-          <div class="card-body text-center bg-white shadow-lg border-radius-lg p-3">
-            <a href="javascript:;">
-              <img class="w-100 border-radius-md" src="../../assets/img/brooke.jpg">
-            </a>
-            <h5 class="mt-3 mb-1 d-md-block d-none">Natalie Paisley</h5>
-            <p class="mb-1 d-md-none d-block text-sm font-weight-bold text-darker">Natalie Paisley</p>
-            <p class="mb-0 text-xs font-weight-bolder text-warning text-gradient text-uppercase">Credit Analyst</p>
-          </div>
-        </div>
-      </div>
-
-      <div class="col-lg-3 col-6 mb-lg-0 mb-4">
-        <div class="card card-profile card-plain">
-          <div class="card-body text-center bg-white shadow-lg border-radius-lg p-3">
-            <a href="javascript:;">
-              <img class="w-100 border-radius-md" src="../../assets/img/ivana.jpg">
-            </a>
-            <h5 class="mt-3 mb-1 d-md-block d-none">Bella Audrey</h5>
-            <p class="mb-1 d-md-none d-block text-sm font-weight-bold text-darker">Bella Audrey</p>
-            <p class="mb-0 text-xs font-weight-bolder text-warning text-gradient text-uppercase">Economist</p>
-          </div>
-        </div>
-      </div>
-
-      <div class="col-lg-3 col-6 mb-lg-0 mb-4">
-        <div class="card card-profile card-plain">
-          <div class="card-body text-center bg-white shadow-lg border-radius-lg p-3">
-            <a href="javascript:;">
-              <img class="w-100 border-radius-md" src="../../assets/img/jordan.jpg">
-            </a>
-            <h5 class="mt-3 mb-1 d-md-block d-none">Wesley Skylar</h5>
-            <p class="mb-1 d-md-none d-block text-sm font-weight-bold text-darker">Mila Skylar</p>
-            <p class="mb-0 text-xs font-weight-bolder text-warning text-gradient text-uppercase">Aviation Inspector</p>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <div class="row mt-5">
-      <div class="col-lg-6">
-        <h2>Get your own app</h2>
-        <p>The Arctic Ocean freezes every winter and much of the sea-ice then thaws every summer, and that process will continue whatever.</p>
-      </div>
-      <div class="col-lg-6 text-right d-flex flex-column justify-content-center">
-        <button type="button" class="btn bg-gradient-warning mb-0 ms-lg-auto me-lg-0 me-auto mt-lg-0 mt-2">Join Team</button>
-      </div>
-    </div>
-  </div>
-</section>
-<!-- END Teams w/ 4 cards w/ image on left & descriptio/social link on right -->
-
-
-
-
-
-
-
-
-
-

Team 5

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- START Teams w/ 4 cards in a row w/ avatar on bottom end-->
-<section class="py-8">
-  <div class="container">
-    <div class="row">
-      <div class="col-md-8 mx-auto text-center">
-        <h4 class="text-gradient text-primary">Join our awesome team</h4>
-
-      </div>
-    </div>
-    <div class="row mt-lg-5 mt-4">
-      <div class="col-lg-4 col-sm-6 mb-4">
-        <div class="card card-body">
-          <div class="row">
-            <div class="col-lg-7">
-              <h5 class="mb-2">Michael Frisen</h5>
-              <span class="badge badge-sm rounded-pill mb-3 text-dark">PHP Developer</span>
-              <br/>
-              <button type="button" class="btn btn-twitter btn-simple px-2 mb-0">
-                <i class="fab fa-twitter text-lg"></i>
-              </button>
-              <button type="button" class="btn btn-dribbble btn-simple px-2 mb-0">
-                <i class="fab fa-dribbble text-lg"></i>
-              </button>
-              <button type="button" class="btn btn-slack btn-simple px-2 mb-0">
-                <i class="fab fa-slack text-lg"></i>
-              </button>
-            </div>
-            <div class="col-lg-5 text-right my-auto">
-              <img class="avatar avatar-xxl" src="../../assets/img/team-2.jpg">
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <div class="col-lg-4 col-sm-6 mb-4">
-        <div class="card card-body">
-          <div class="row">
-            <div class="col-lg-7">
-              <h5 class="mb-2">Laurent Shaun</h5>
-              <span class="badge badge-sm rounded-pill mb-3 text-dark">Laravel Senior</span>
-              <br/>
-              <button type="button" class="btn btn-facebook btn-simple px-2 mb-0">
-                <i class="fab fa-facebook-f text-lg"></i>
-              </button>
-              <button type="button" class="btn btn-dribbble btn-simple px-2 mb-0">
-                <i class="fab fa-dribbble text-lg"></i>
-              </button>
-              <button type="button" class="btn btn-slack btn-simple px-2 mb-0">
-                <i class="fab fa-slack text-lg"></i>
-              </button>
-            </div>
-            <div class="col-lg-5 text-right my-auto">
-              <img class="avatar avatar-xxl" src="../../assets/img/team-3.jpg">
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <div class="col-lg-4 col-sm-6 mb-4">
-        <div class="card card-body">
-          <div class="row">
-            <div class="col-lg-7">
-              <h5 class="mb-2">Ramon Siente</h5>
-              <span class="badge badge-sm rounded-pill mb-3 text-dark">Vue.js Specialist</span>
-              <br/>
-              <button type="button" class="btn btn-twitter btn-simple px-2 mb-0">
-                <i class="fab fa-twitter text-lg"></i>
-              </button>
-              <button type="button" class="btn btn-dribbble btn-simple px-2 mb-0">
-                <i class="fab fa-dribbble text-lg"></i>
-              </button>
-              <button type="button" class="btn btn-github btn-simple px-2 mb-0">
-                <i class="fab fa-github text-lg"></i>
-              </button>
-            </div>
-            <div class="col-lg-5 text-right my-auto">
-              <img class="avatar avatar-xxl" src="../../assets/img/team-2.jpg">
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-<!-- END Teams w/ 4 cards in a row w/ avatar on bottom end-->
-
-
-
-
-
-
-
-
-
-

Team 6

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-5 bg-gray-100">
-  <div class="container">
-    <div class="row">
-      <div class="col-md-7 mx-auto text-center mb-5">
-        <h3 class="text-gradient text-info mb-0">Our Team</h3>
-        <h3>You are into a great company</h3>
-        <p>This is the paragraph where you can write more details about your team. Keep you user engaged by providing meaningful information.</p>
-      </div>
-    </div>
-    <div class="row">
-      <div class="col-lg-4 col-md-6">
-        <div class="card card-profile">
-          <a href="javascript:;">
-            <div class="p-3">
-              <img class="w-100 border-radius-md" src="../../assets/img/ivana-square.jpg">
-            </div>
-          </a>
-          <div class="card-body blur justify-content-center text-center mt-n5 mx-4 mb-4 border-radius-md">
-            <h4 class="mb-0">Hattie McKenzie</h4>
-            <p>Montreal, QC</p>
-            <div class="row justify-content-center text-center">
-              <div class="col-lg-4 col-4">
-                <h5 class="text-info mb-0">323</h5>
-                <small>Projects</small>
-              </div>
-              <div class="col-lg-4 col-4">
-                <h5 class="text-info mb-0">500+</h5>
-                <small>Hours</small>
-              </div>
-              <div class="col-lg-4 col-4">
-                <h5 class="text-info mb-0">24/7</h5>
-                <small>Support</small>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-4 col-md-6">
-        <div class="card card-profile mt-md-0 mt-5">
-          <a href="javascript:;">
-            <div class="p-3">
-              <img class="w-100 border-radius-md" src="../../assets/img/kal-visuals-square.jpg">
-            </div>
-          </a>
-          <div class="card-body blur justify-content-center text-center mt-n5 mx-4 mb-4 border-radius-md">
-            <h4 class="mb-0">Annie Spratt</h4>
-            <p>Bucharest, RO</p>
-            <div class="row justify-content-center text-center">
-              <div class="col-lg-4 col-4">
-                <h5 class="text-info mb-0">450</h5>
-                <small>Projects</small>
-              </div>
-              <div class="col-lg-4 col-4">
-                <h5 class="text-info mb-0">400+</h5>
-                <small>Hours</small>
-              </div>
-              <div class="col-lg-4 col-4">
-                <h5 class="text-info mb-0">24/7</h5>
-                <small>Support</small>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-4 col-md-6 mx-md-auto">
-        <div class="card card-profile mt-md-0 mt-5">
-          <a href="javascript:;">
-            <div class="p-3">
-              <img class="w-100 border-radius-md" src="../../assets/img/bruce-mars.jpg">
-            </div>
-          </a>
-          <div class="card-body blur justify-content-center text-center mt-n5 mx-4 mb-4 border-radius-md">
-            <h4 class="mb-0">Bruce Mars</h4>
-            <p>Atlanta, U.S.</p>
-            <div class="row justify-content-center text-center">
-              <div class="col-lg-4 col-4">
-                <h5 class="text-info mb-0">750</h5>
-                <small>Projects</small>
-              </div>
-              <div class="col-lg-4 col-4">
-                <h5 class="text-info mb-0">800+</h5>
-                <small>Hours</small>
-              </div>
-              <div class="col-lg-4 col-4">
-                <h5 class="text-info mb-0">24/7</h5>
-                <small>Support</small>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
- - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/sections/page-sections/testimonials.html b/sections/page-sections/testimonials.html deleted file mode 100644 index 4317f7ad..00000000 --- a/sections/page-sections/testimonials.html +++ /dev/null @@ -1,3310 +0,0 @@ - - - - - - - - - - - Soft UI Design System by Creative Tim - - - - - - - - - - - - - - - - - - - -
-
-
-
- -

Testimonials

-
-
-
-
-
-

Testimonials 1

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-5">
-  <div class="container">
-    <div class="row">
-      <div class="col-lg-6 mx-auto text-center">
-        <h2 class="text-gradient text-primary mb-0">What random people</h2>
-        <h2 class="mb-3">Think about us</h2>
-        <p>That’s the main thing people are controlled by! Thoughts- their perception of themselves! </p>
-      </div>
-    </div>
-    <div class="row mt-6">
-      <div class="col-lg-4 col-md-8">
-        <div class="card card-plain">
-          <div class="card-body">
-            <div class="author">
-              <img src="../../assets/img/team-3.jpg" alt="..." class="avatar shadow">
-              <div class="name ps-2">
-                <span>Mathew Glock</span>
-                <div class="stats">
-                  <small><i class="far fa-clock"></i> 5 min read</small>
-                </div>
-              </div>
-            </div>
-            <p class="mt-4">"If you have the opportunity to play this game of life you need to appreciate every moment."</p>
-            <div class="rating mt-3">
-              <i class="fas fa-star"></i>
-              <i class="fas fa-star"></i>
-              <i class="fas fa-star"></i>
-              <i class="fas fa-star"></i>
-              <i class="far fa-star"></i>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-4 col-md-8 ms-md-auto">
-        <div class="card bg-gradient-primary">
-          <div class="card-body">
-            <div class="author align-items-center">
-              <img src="../../assets/img/marie.jpg" alt="..." class="avatar shadow">
-              <div class="name ps-2">
-                <span class="text-white">Mathew Glock</span>
-                <div class="stats">
-                  <small class="text-white">Posted on 28 February</small>
-                </div>
-              </div>
-            </div>
-            <p class="mt-4 text-white">"If you have the opportunity to play this game of life you need to appreciate every moment."</p>
-            <div class="rating mt-3">
-              <i class="fas fa-star text-white"></i>
-              <i class="fas fa-star text-white"></i>
-              <i class="fas fa-star text-white"></i>
-              <i class="far fa-star text-white"></i>
-              <i class="far fa-star text-white"></i>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-4 col-md-8">
-        <div class="card card-plain">
-          <div class="card-body">
-            <div class="author">
-              <img src="../../assets/img/team-2.jpg" alt="..." class="avatar shadow">
-              <div class="name ps-2">
-                <span>Mathew Glock</span>
-                <div class="stats">
-                  <small><i class="far fa-clock"></i> 5 min read</small>
-                </div>
-              </div>
-            </div>
-            <p class="mt-4">"If you have the opportunity to play this game of life you need to appreciate every moment."</p>
-            <div class="rating mt-3">
-              <i class="fas fa-star"></i>
-              <i class="fas fa-star"></i>
-              <i class="fas fa-star"></i>
-              <i class="fas fa-star"></i>
-              <i class="fas fa-star"></i>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-    <hr class="horizontal dark my-5">
-    <div class="row">
-      <div class="col-lg-2 col-6">
-        <img class="w-100 opacity-6" src="../../assets/img/logos/gray-logos/logo-apple.svg" alt="Logo">
-      </div>
-      <div class="col-lg-2 col-6">
-        <img class="w-100 opacity-6" src="../../assets/img/logos/gray-logos/logo-facebook.svg" alt="Logo">
-      </div>
-      <div class="col-lg-2 col-6">
-        <img class="w-100 opacity-6" src="../../assets/img/logos/gray-logos/logo-behance.svg" alt="Logo">
-      </div>
-      <div class="col-lg-2 col-6">
-        <img class="w-100 opacity-6" src="../../assets/img/logos/gray-logos/logo-spotify.svg" alt="Logo">
-      </div>
-      <div class="col-lg-2 col-6">
-        <img class="w-100 opacity-6" src="../../assets/img/logos/gray-logos/logo-coinbase.svg" alt="Logo">
-      </div>
-      <div class="col-lg-2 col-6">
-        <img class="w-100 opacity-6" src="../../assets/img/logos/gray-logos/logo-pinterest.svg" alt="Logo">
-      </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Testimonials 2

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="bg-gradient-dark position-relative overflow-hidden py-4">
-  <div class="position-absolute w-100 z-inde-1 top-0 mt-n3">
-    <svg width="100%" viewBox="0 -2 1920 157" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-        <title>wave-down</title>
-        <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-            <g id="Artboard" fill="#FFFFFF" fill-rule="nonzero">
-                <g id="wave-down">
-                    <path d="M0,60.8320331 C299.333333,115.127115 618.333333,111.165365 959,47.8320321 C1299.66667,-15.5013009 1620.66667,-15.2062179 1920,47.8320331 L1920,156.389409 L0,156.389409 L0,60.8320331 Z" id="Path-Copy-2" transform="translate(960.000000, 78.416017) rotate(180.000000) translate(-960.000000, -78.416017) "></path>
-                </g>
-            </g>
-        </g>
-    </svg>
-  </div>
-  <div id="carouselExampleIndicators" class="carousel slide pt-7 pb-11" data-bs-ride="carousel">
-    <ol class="carousel-indicators pb-7">
-      <a class="active" href="javascript:;"><img src="../../assets/img/team-4.jpg" alt="..." class="avatar avatar-sm avatar-scale-up shadow" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="0"> <span class="text-white mx-2">&#124;</span></a>
-
-      <a href="javascript:;"><img src="../../assets/img/team-3.jpg" alt="..." class="avatar avatar-sm avatar-scale-up shadow" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="1"> <span class="text-white mx-2">&#124;</span></a>
-
-      <a href="javascript:;"><img src="../../assets/img/team-2.jpg" alt="..." class="avatar avatar-sm avatar-scale-up shadow" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="2"></a>
-    </ol>
-    <div class="carousel-inner">
-      <div class="carousel-item active">
-        <div class="container">
-          <div class="row">
-            <div class="col-lg-7 mx-auto text-center">
-              <img class="w-50 mb-4" src="../../assets/img/logos/medium-logos/logo-google.svg" alt="">
-              <p class="lead text-white">"We’re not always in the position that we want to be at. We’re constantly growing. We’re constantly making mistakes. We’re constantly trying to express ourselves and actualize our dreams." </p>
-              <div class="author justify-content-center">
-                <div class="name ps-2">
-                  <span class="text-white">John Down</span>
-                  <div class="stats">
-                    <small class="text-white opacity-6">Visionary, Google</small>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="carousel-item">
-        <div class="container">
-          <div class="row">
-            <div class="col-lg-7 mx-auto text-center">
-              <img class="w-50 mb-4" src="../../assets/img/logos/medium-logos/logo-spotify.svg" alt="">
-              <p class="lead text-white">"We’re not always in the position that we want to be at. We’re constantly growing. We’re constantly making mistakes. We’re constantly trying to express ourselves and actualize our dreams."</p>
-              <div class="author justify-content-center">
-                <div class="name ps-2">
-                  <span class="text-white">Marcell Glock</span>
-                  <div class="stats">
-                    <small class="text-white opacity-6">Chief Executive, Spotify</small>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="carousel-item">
-        <div class="container">
-          <div class="row">
-            <div class="col-lg-7 mx-auto text-center">
-              <img class="w-50 mb-4" src="../../assets/img/logos/medium-logos/logo-netflix.svg" alt="">
-              <p class="lead text-white">"We’re not always in the position that we want to be at. We’re constantly growing. We’re constantly making mistakes. We’re constantly trying to express ourselves and actualize our dreams." </p>
-              <div class="author justify-content-center">
-                <div class="name ps-2">
-                  <span class="text-white">Mathew Goat</span>
-                  <div class="stats">
-                    <small class="text-white opacity-6">Social Media Executive, Netflix</small>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div class="position-absolute w-100 bottom-0">
-    <svg width="100%" viewBox="0 -1 1920 166" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-        <title>wave-up</title>
-        <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-            <g id="Artboard" transform="translate(0.000000, 5.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                <g id="wave-up" transform="translate(0.000000, -5.000000)">
-                    <path d="M0,70 C298.666667,105.333333 618.666667,95 960,39 C1301.33333,-17 1621.33333,-11.3333333 1920,56 L1920,165 L0,165 L0,70 Z" id="Path"></path>
-                </g>
-            </g>
-        </g>
-    </svg>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Testimonials 3

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="py-4 position-relative">
-  <div id="carousel-testimonials" class="carousel slide carousel-team">
-    <div class="carousel-inner">
-      <div class="carousel-item active">
-        <div class="container">
-          <div class="row align-items-center">
-            <div class="col-md-5 p-5 ms-lg-auto">
-              <div class="p-3">
-                <img class="w-100 border-radius-md" src="../../assets/img/charles.jpg" alt="First slide">
-              </div>
-            </div>
-            <div class="col-md-5 me-lg-auto position-relative">
-              <p class="text-sm font-weight-bold mb-1">- Customer Story</p>
-              <h3 class="text-dark">Excelent payment service. You guys are the best!</h3>
-              <p class="my-4">
-                <i>"Let the brain, muscles, nerves, every part of your body, be full of that idea, and just leave every other idea alone.
-                This is the way to success."</i>
-              </p>
-              <div class="author align-items-center">
-                <div class="avatar shadow bg-gradient-dark">
-                  <img src="../../assets/img//logos/white-logos/logo-spotify-white.svg">
-                </div>
-                <div class="name ps-2">
-                  <span>Mathew Glock</span>
-                  <div>
-                    <small>Marketing Manager - Slack</small>
-                  </div>
-                </div>
-              </div>
-              <div class="w-25 ms-auto opacity-2 mt-n9">
-                <svg class="opacity-3" width="110px" height="110px" viewBox="0 0 270 270" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                    <title>quote-down</title>
-                    <g id="quote-down" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                        <path d="M107.000381,49.033238 C111.792099,48.01429 115.761022,48.6892564 116.625294,50.9407629 C117.72393,53.8028077 113.174473,58.3219079 107.017635,60.982801 C107.011653,60.9853863 107.00567,60.9879683 106.999688,60.990547 C106.939902,61.0219589 106.879913,61.0439426 106.820031,61.0659514 C106.355389,61.2618887 105.888177,61.4371549 105.421944,61.5929594 C88.3985192,68.1467602 80.3242628,76.9161885 70.3525495,90.6906738 C60.0774843,104.884196 54.9399518,119.643717 54.9399518,134.969238 C54.9399518,138.278158 55.4624127,140.716309 56.5073346,142.283691 C57.2039492,143.328613 57.9876406,143.851074 58.8584088,143.851074 C59.7291771,143.851074 61.0353294,143.241536 62.7768659,142.022461 C68.3497825,138.016927 75.4030052,136.01416 83.9365338,136.01416 C93.8632916,136.01416 102.658051,140.063232 110.320811,148.161377 C117.983572,156.259521 121.814952,165.88151 121.814952,177.027344 C121.814952,188.695638 117.417572,198.970703 108.622813,207.852539 C99.828054,216.734375 89.1611432,221.175293 76.6220807,221.175293 C61.9931745,221.175293 49.3670351,215.166992 38.7436627,203.150391 C28.1202903,191.133789 22.8086041,175.024577 22.8086041,154.822754 C22.8086041,131.312012 30.0359804,110.239421 44.490733,91.6049805 C58.2196377,73.906272 74.3541002,59.8074126 102.443135,50.4450748 C102.615406,50.3748509 102.790055,50.3058192 102.966282,50.2381719 C104.199241,49.7648833 105.420135,49.3936487 106.596148,49.1227802 L107,49 Z M233.000381,49.033238 C237.792099,48.01429 241.761022,48.6892564 242.625294,50.9407629 C243.72393,53.8028077 239.174473,58.3219079 233.017635,60.982801 C233.011653,60.9853863 233.00567,60.9879683 232.999688,60.990547 C232.939902,61.0219589 232.879913,61.0439426 232.820031,61.0659514 C232.355389,61.2618887 231.888177,61.4371549 231.421944,61.5929594 C214.398519,68.1467602 206.324263,76.9161885 196.352549,90.6906738 C186.077484,104.884196 180.939952,119.643717 180.939952,134.969238 C180.939952,138.278158 181.462413,140.716309 182.507335,142.283691 C183.203949,143.328613 183.987641,143.851074 184.858409,143.851074 C185.729177,143.851074 187.035329,143.241536 188.776866,142.022461 C194.349783,138.016927 201.403005,136.01416 209.936534,136.01416 C219.863292,136.01416 228.658051,140.063232 236.320811,148.161377 C243.983572,156.259521 247.814952,165.88151 247.814952,177.027344 C247.814952,188.695638 243.417572,198.970703 234.622813,207.852539 C225.828054,216.734375 215.161143,221.175293 202.622081,221.175293 C187.993174,221.175293 175.367035,215.166992 164.743663,203.150391 C154.12029,191.133789 148.808604,175.024577 148.808604,154.822754 C148.808604,131.312012 156.03598,110.239421 170.490733,91.6049805 C184.219638,73.906272 200.3541,59.8074126 228.443135,50.4450748 C228.615406,50.3748509 228.790055,50.3058192 228.966282,50.2381719 C230.199241,49.7648833 231.420135,49.3936487 232.596148,49.1227802 L233,49 Z" id="quote-up" fill="#48484A" fill-rule="nonzero" transform="translate(135.311778, 134.872794) scale(-1, -1) translate(-135.311778, -134.872794) "></path>
-                    </g>
-                </svg>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="carousel-item">
-        <div class="container">
-          <div class="row align-items-center">
-            <div class="col-md-5 p-5 ms-lg-auto">
-              <div class="p-3">
-                <img class="w-100 border-radius-md shadow" src="../../assets/img/ivana.jpg" alt="First slide">
-              </div>
-            </div>
-            <div class="col-md-5 me-lg-auto">
-              <p class="text-sm font-weight-bold mb-1">- Customer Story</p>
-              <h3 class="text-dark">Awesome services! Fast and secure.</h3>
-              <p class="my-4">
-                <i>"Wealth creation is an evolutionarily recent positive-sum game.
-                  Status is an old zero-sum game. Those attacking wealth creation
-                  are often just seeking status."</i>
-              </p>
-              <div class="author align-items-center">
-                <div class="avatar shadow bg-gradient-dark">
-                  <img src="../../assets/img//logos/white-logos/logo-google-white.svg">
-                </div>
-                <div class="name ps-2">
-                  <span>Ivana Gerge</span>
-                  <div>
-                    <small>CFO - Google</small>
-                  </div>
-                </div>
-              </div>
-              <div class="w-25 ms-auto opacity-2 mt-n9">
-                <svg class="opacity-3" width="110px" height="110px" viewBox="0 0 270 270" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                    <title>quote-down</title>
-                    <g id="quote-down" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                        <path d="M107.000381,49.033238 C111.792099,48.01429 115.761022,48.6892564 116.625294,50.9407629 C117.72393,53.8028077 113.174473,58.3219079 107.017635,60.982801 C107.011653,60.9853863 107.00567,60.9879683 106.999688,60.990547 C106.939902,61.0219589 106.879913,61.0439426 106.820031,61.0659514 C106.355389,61.2618887 105.888177,61.4371549 105.421944,61.5929594 C88.3985192,68.1467602 80.3242628,76.9161885 70.3525495,90.6906738 C60.0774843,104.884196 54.9399518,119.643717 54.9399518,134.969238 C54.9399518,138.278158 55.4624127,140.716309 56.5073346,142.283691 C57.2039492,143.328613 57.9876406,143.851074 58.8584088,143.851074 C59.7291771,143.851074 61.0353294,143.241536 62.7768659,142.022461 C68.3497825,138.016927 75.4030052,136.01416 83.9365338,136.01416 C93.8632916,136.01416 102.658051,140.063232 110.320811,148.161377 C117.983572,156.259521 121.814952,165.88151 121.814952,177.027344 C121.814952,188.695638 117.417572,198.970703 108.622813,207.852539 C99.828054,216.734375 89.1611432,221.175293 76.6220807,221.175293 C61.9931745,221.175293 49.3670351,215.166992 38.7436627,203.150391 C28.1202903,191.133789 22.8086041,175.024577 22.8086041,154.822754 C22.8086041,131.312012 30.0359804,110.239421 44.490733,91.6049805 C58.2196377,73.906272 74.3541002,59.8074126 102.443135,50.4450748 C102.615406,50.3748509 102.790055,50.3058192 102.966282,50.2381719 C104.199241,49.7648833 105.420135,49.3936487 106.596148,49.1227802 L107,49 Z M233.000381,49.033238 C237.792099,48.01429 241.761022,48.6892564 242.625294,50.9407629 C243.72393,53.8028077 239.174473,58.3219079 233.017635,60.982801 C233.011653,60.9853863 233.00567,60.9879683 232.999688,60.990547 C232.939902,61.0219589 232.879913,61.0439426 232.820031,61.0659514 C232.355389,61.2618887 231.888177,61.4371549 231.421944,61.5929594 C214.398519,68.1467602 206.324263,76.9161885 196.352549,90.6906738 C186.077484,104.884196 180.939952,119.643717 180.939952,134.969238 C180.939952,138.278158 181.462413,140.716309 182.507335,142.283691 C183.203949,143.328613 183.987641,143.851074 184.858409,143.851074 C185.729177,143.851074 187.035329,143.241536 188.776866,142.022461 C194.349783,138.016927 201.403005,136.01416 209.936534,136.01416 C219.863292,136.01416 228.658051,140.063232 236.320811,148.161377 C243.983572,156.259521 247.814952,165.88151 247.814952,177.027344 C247.814952,188.695638 243.417572,198.970703 234.622813,207.852539 C225.828054,216.734375 215.161143,221.175293 202.622081,221.175293 C187.993174,221.175293 175.367035,215.166992 164.743663,203.150391 C154.12029,191.133789 148.808604,175.024577 148.808604,154.822754 C148.808604,131.312012 156.03598,110.239421 170.490733,91.6049805 C184.219638,73.906272 200.3541,59.8074126 228.443135,50.4450748 C228.615406,50.3748509 228.790055,50.3058192 228.966282,50.2381719 C230.199241,49.7648833 231.420135,49.3936487 232.596148,49.1227802 L233,49 Z" id="quote-up" fill="#48484A" fill-rule="nonzero" transform="translate(135.311778, 134.872794) scale(-1, -1) translate(-135.311778, -134.872794) "></path>
-                    </g>
-                </svg>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-    <a class="carousel-control-prev text-darker" href="#carousel-testimonials" role="button" data-bs-slide="prev">
-      <i class="fas fa-chevron-left"></i>
-      <span class="sr-only">Previous</span>
-    </a>
-    <a class="carousel-control-next text-darker" href="#carousel-testimonials" role="button" data-bs-slide="next">
-      <i class="fas fa-chevron-right"></i>
-      <span class="sr-only">Next</span>
-    </a>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Testimonials 4

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- -------- START Testimonials w/ 3 cards  -------- -->
-<section class="py-5">
-  <div class="container">
-    <div class="row">
-      <div class="col-lg-6 mx-auto text-center pb-5">
-        <div class="icon icon-shape text-center mb-3">
-          <svg class="text-info" width="40px" height="40px" viewBox="0 0 46 42" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-              <title>customer-support</title>
-              <g id="Basic-Elements" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                  <g id="Rounded-Icons" transform="translate(-1717.000000, -291.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                      <g id="Icons-with-opacity" transform="translate(1716.000000, 291.000000)">
-                          <g id="customer-support" transform="translate(1.000000, 0.000000)">
-                              <path class="color-background" d="M45,0 L26,0 C25.447,0 25,0.447 25,1 L25,20 C25,20.379 25.214,20.725 25.553,20.895 C25.694,20.965 25.848,21 26,21 C26.212,21 26.424,20.933 26.6,20.8 L34.333,15 L45,15 C45.553,15 46,14.553 46,14 L46,1 C46,0.447 45.553,0 45,0 Z" id="Path" opacity="0.59858631"></path>
-                              <path class="color-foreground" d="M22.883,32.86 C20.761,32.012 17.324,31 13,31 C8.676,31 5.239,32.012 3.116,32.86 C1.224,33.619 0,35.438 0,37.494 L0,41 C0,41.553 0.447,42 1,42 L25,42 C25.553,42 26,41.553 26,41 L26,37.494 C26,35.438 24.776,33.619 22.883,32.86 Z" id="Path"></path>
-                              <path class="color-foreground" d="M13,28 C17.432,28 21,22.529 21,18 C21,13.589 17.411,10 13,10 C8.589,10 5,13.589 5,18 C5,22.529 8.568,28 13,28 Z" id="Path"></path>
-                          </g>
-                      </g>
-                  </g>
-              </g>
-          </svg>
-        </div>
-        <h3>What Clients Say</h3>
-        <p class="lead">We’re constantly trying to express ourselves and actualize our dreams. If you have the opportunity to play </p>
-      </div>
-    </div>
-    <div class="row">
-      <div class="col-md-4">
-        <div class="card card-plain text-center">
-          <a href="javascript:;">
-            <img class="avatar avatar-xl shadow" src="../../assets/img/team-1.jpg">
-          </a>
-
-          <div class="card-body">
-            <h4 class="card-title">Jessica Davis</h4>
-            <h6 class="category text-info text-gradient">Loan Counselor</h6>
-            <p class="card-description">
-              "Don&#39;t walk behind me; I may not lead. Don&#39;t walk in front of me; I may not follow. Just walk beside me and be my friend."
-            </p>
-          </div>
-        </div>
-      </div>
-      <div class="col-md-4">
-        <div class="card card-plain text-center">
-          <a href="javascript:;">
-            <img class="avatar avatar-xl shadow" src="../../assets/img/marie.jpg">
-          </a>
-
-          <div class="card-body">
-            <h4 class="card-title">Joshiah Luke</h4>
-            <h6 class="category text-info text-gradient">HR Specialist</h6>
-            <p class="card-description">
-              "The pessimist complains about the wind; the optimist expects it to change; the realist adjusts the sails."
-            </p>
-          </div>
-        </div>
-      </div>
-      <div class="col-md-4">
-        <div class="card card-plain text-center">
-          <a href="javascript:;">
-            <img class="avatar avatar-xl shadow" src="../../assets/img/team-4.jpg">
-          </a>
-
-          <div class="card-body">
-            <h4 class="card-title">Andrew John</h4>
-            <h6 class="category text-info text-gradient">Loan Counselor</h6>
-            <p class="card-description">
-              "Do not go where the path may lead, go instead where there is no path and leave a trail."
-            </p>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-<!-- -------- END Testimonials w/ 3 cards  -------- -->
-
-
-
-
-
-
-
-
-
-

Testimonials 5

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- START Testimonials w/ 3 cards & dark background -->
-<section class="py-5 bg-gradient-dark position-relative overflow-hidden">
-  <div class="position-absolute w-100 z-inde-1 top-0 mt-n3">
-    <svg width="100%" viewBox="0 -2 1920 157" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-        <title>wave-down</title>
-        <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-            <g id="Artboard" fill="#FFFFFF" fill-rule="nonzero">
-                <g id="wave-down">
-                    <path d="M0,60.8320331 C299.333333,115.127115 618.333333,111.165365 959,47.8320321 C1299.66667,-15.5013009 1620.66667,-15.2062179 1920,47.8320331 L1920,156.389409 L0,156.389409 L0,60.8320331 Z" id="Path-Copy-2" transform="translate(960.000000, 78.416017) rotate(180.000000) translate(-960.000000, -78.416017) "></path>
-                </g>
-            </g>
-        </g>
-    </svg>
-  </div>
-  <img src="../../assets/img/shapes/waves-white.svg" class="position-absolute opacity-6 h-100 top-0 d-md-block d-none" alt="">
-  <div class="container pt-6 pb-5 position-relative z-index-3">
-    <div class="row">
-      <div class="col-md-6 mx-auto text-center">
-        <span class="badge badge-white text-dark mb-2">Testimonials</span>
-        <h2 class="text-white mb-3">Some thoughts from our clients</h2>
-        <h5 class="text-white font-weight-light">
-          If you’re selected for them you’ll also get three tickets, opportunity to access Investor Office Hours and Mentor Hours and much more all for free.
-        </h5>
-      </div>
-    </div>
-    <div class="row mt-8">
-      <div class="col-md-4 mb-md-0 mb-7">
-        <div class="card">
-          <div class="text-center mt-n5 z-index-1">
-            <div class="position-relative">
-              <div class="blur-shadow-avatar">
-                <img class="avatar avatar-xxl shadow-lg" src="../../assets/img/team-2.jpg">
-              </div>
-            </div>
-          </div>
-          <div class="card-body text-center pb-0">
-            <h4 class="mb-0">Olivia Harper</h4>
-            <p>@oliviaharper</p>
-            <p class="mt-2">
-              The connections you make at Web Summit are unparalleled, we met users all over the world.
-            </p>
-          </div>
-          <div class="card-footer text-center pt-2">
-            <div class="mx-auto">
-              <svg class="opacity-2" width="60px" height="60px" viewBox="0 0 270 270" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                  <title>quote-down</title>
-                  <g id="quote-down" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                      <path d="M107.000381,49.033238 C111.792099,48.01429 115.761022,48.6892564 116.625294,50.9407629 C117.72393,53.8028077 113.174473,58.3219079 107.017635,60.982801 C107.011653,60.9853863 107.00567,60.9879683 106.999688,60.990547 C106.939902,61.0219589 106.879913,61.0439426 106.820031,61.0659514 C106.355389,61.2618887 105.888177,61.4371549 105.421944,61.5929594 C88.3985192,68.1467602 80.3242628,76.9161885 70.3525495,90.6906738 C60.0774843,104.884196 54.9399518,119.643717 54.9399518,134.969238 C54.9399518,138.278158 55.4624127,140.716309 56.5073346,142.283691 C57.2039492,143.328613 57.9876406,143.851074 58.8584088,143.851074 C59.7291771,143.851074 61.0353294,143.241536 62.7768659,142.022461 C68.3497825,138.016927 75.4030052,136.01416 83.9365338,136.01416 C93.8632916,136.01416 102.658051,140.063232 110.320811,148.161377 C117.983572,156.259521 121.814952,165.88151 121.814952,177.027344 C121.814952,188.695638 117.417572,198.970703 108.622813,207.852539 C99.828054,216.734375 89.1611432,221.175293 76.6220807,221.175293 C61.9931745,221.175293 49.3670351,215.166992 38.7436627,203.150391 C28.1202903,191.133789 22.8086041,175.024577 22.8086041,154.822754 C22.8086041,131.312012 30.0359804,110.239421 44.490733,91.6049805 C58.2196377,73.906272 74.3541002,59.8074126 102.443135,50.4450748 C102.615406,50.3748509 102.790055,50.3058192 102.966282,50.2381719 C104.199241,49.7648833 105.420135,49.3936487 106.596148,49.1227802 L107,49 Z M233.000381,49.033238 C237.792099,48.01429 241.761022,48.6892564 242.625294,50.9407629 C243.72393,53.8028077 239.174473,58.3219079 233.017635,60.982801 C233.011653,60.9853863 233.00567,60.9879683 232.999688,60.990547 C232.939902,61.0219589 232.879913,61.0439426 232.820031,61.0659514 C232.355389,61.2618887 231.888177,61.4371549 231.421944,61.5929594 C214.398519,68.1467602 206.324263,76.9161885 196.352549,90.6906738 C186.077484,104.884196 180.939952,119.643717 180.939952,134.969238 C180.939952,138.278158 181.462413,140.716309 182.507335,142.283691 C183.203949,143.328613 183.987641,143.851074 184.858409,143.851074 C185.729177,143.851074 187.035329,143.241536 188.776866,142.022461 C194.349783,138.016927 201.403005,136.01416 209.936534,136.01416 C219.863292,136.01416 228.658051,140.063232 236.320811,148.161377 C243.983572,156.259521 247.814952,165.88151 247.814952,177.027344 C247.814952,188.695638 243.417572,198.970703 234.622813,207.852539 C225.828054,216.734375 215.161143,221.175293 202.622081,221.175293 C187.993174,221.175293 175.367035,215.166992 164.743663,203.150391 C154.12029,191.133789 148.808604,175.024577 148.808604,154.822754 C148.808604,131.312012 156.03598,110.239421 170.490733,91.6049805 C184.219638,73.906272 200.3541,59.8074126 228.443135,50.4450748 C228.615406,50.3748509 228.790055,50.3058192 228.966282,50.2381719 C230.199241,49.7648833 231.420135,49.3936487 232.596148,49.1227802 L233,49 Z" id="quote-up" fill="#48484A" fill-rule="nonzero" transform="translate(135.311778, 134.872794) scale(-1, -1) translate(-135.311778, -134.872794) "></path>
-                  </g>
-              </svg>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="col-md-4 mb-md-0 mb-7">
-        <div class="card">
-          <div class="text-center mt-n5 z-index-1">
-            <div class="position-relative">
-              <div class="blur-shadow-avatar">
-                <img class="avatar avatar-xxl shadow-lg" src="../../assets/img/team-3.jpg">
-              </div>
-            </div>
-          </div>
-          <div class="card-body text-center pb-0">
-            <h4 class="mb-0">Simon Lauren</h4>
-            <p>@simonlaurent</p>
-              <p class="mt-2">
-                The networking at Web Summit is like no other European tech conference. Everything is amazing.
-              </p>
-          </div>
-          <div class="card-footer text-center pt-2">
-            <div class="mx-auto">
-              <svg class="opacity-2" width="60px" height="60px" viewBox="0 0 270 270" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                  <title>quote-down</title>
-                  <g id="quote-down" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                      <path d="M107.000381,49.033238 C111.792099,48.01429 115.761022,48.6892564 116.625294,50.9407629 C117.72393,53.8028077 113.174473,58.3219079 107.017635,60.982801 C107.011653,60.9853863 107.00567,60.9879683 106.999688,60.990547 C106.939902,61.0219589 106.879913,61.0439426 106.820031,61.0659514 C106.355389,61.2618887 105.888177,61.4371549 105.421944,61.5929594 C88.3985192,68.1467602 80.3242628,76.9161885 70.3525495,90.6906738 C60.0774843,104.884196 54.9399518,119.643717 54.9399518,134.969238 C54.9399518,138.278158 55.4624127,140.716309 56.5073346,142.283691 C57.2039492,143.328613 57.9876406,143.851074 58.8584088,143.851074 C59.7291771,143.851074 61.0353294,143.241536 62.7768659,142.022461 C68.3497825,138.016927 75.4030052,136.01416 83.9365338,136.01416 C93.8632916,136.01416 102.658051,140.063232 110.320811,148.161377 C117.983572,156.259521 121.814952,165.88151 121.814952,177.027344 C121.814952,188.695638 117.417572,198.970703 108.622813,207.852539 C99.828054,216.734375 89.1611432,221.175293 76.6220807,221.175293 C61.9931745,221.175293 49.3670351,215.166992 38.7436627,203.150391 C28.1202903,191.133789 22.8086041,175.024577 22.8086041,154.822754 C22.8086041,131.312012 30.0359804,110.239421 44.490733,91.6049805 C58.2196377,73.906272 74.3541002,59.8074126 102.443135,50.4450748 C102.615406,50.3748509 102.790055,50.3058192 102.966282,50.2381719 C104.199241,49.7648833 105.420135,49.3936487 106.596148,49.1227802 L107,49 Z M233.000381,49.033238 C237.792099,48.01429 241.761022,48.6892564 242.625294,50.9407629 C243.72393,53.8028077 239.174473,58.3219079 233.017635,60.982801 C233.011653,60.9853863 233.00567,60.9879683 232.999688,60.990547 C232.939902,61.0219589 232.879913,61.0439426 232.820031,61.0659514 C232.355389,61.2618887 231.888177,61.4371549 231.421944,61.5929594 C214.398519,68.1467602 206.324263,76.9161885 196.352549,90.6906738 C186.077484,104.884196 180.939952,119.643717 180.939952,134.969238 C180.939952,138.278158 181.462413,140.716309 182.507335,142.283691 C183.203949,143.328613 183.987641,143.851074 184.858409,143.851074 C185.729177,143.851074 187.035329,143.241536 188.776866,142.022461 C194.349783,138.016927 201.403005,136.01416 209.936534,136.01416 C219.863292,136.01416 228.658051,140.063232 236.320811,148.161377 C243.983572,156.259521 247.814952,165.88151 247.814952,177.027344 C247.814952,188.695638 243.417572,198.970703 234.622813,207.852539 C225.828054,216.734375 215.161143,221.175293 202.622081,221.175293 C187.993174,221.175293 175.367035,215.166992 164.743663,203.150391 C154.12029,191.133789 148.808604,175.024577 148.808604,154.822754 C148.808604,131.312012 156.03598,110.239421 170.490733,91.6049805 C184.219638,73.906272 200.3541,59.8074126 228.443135,50.4450748 C228.615406,50.3748509 228.790055,50.3058192 228.966282,50.2381719 C230.199241,49.7648833 231.420135,49.3936487 232.596148,49.1227802 L233,49 Z" id="quote-up" fill="#48484A" fill-rule="nonzero" transform="translate(135.311778, 134.872794) scale(-1, -1) translate(-135.311778, -134.872794) "></path>
-                  </g>
-              </svg>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="col-md-4 mb-md-0 mb-7">
-        <div class="card">
-          <div class="text-center mt-n5 z-index-1">
-            <div class="position-relative">
-              <div class="blur-shadow-avatar">
-                <img class="avatar avatar-xxl shadow-lg" src="../../assets/img/team-4.jpg">
-              </div>
-            </div>
-          </div>
-          <div class="card-body text-center pb-0">
-            <h4 class="mb-0">Lucian Eurel</h4>
-            <p>@luciaeurel</p>
-            <p class="mt-2">
-              Web Summit will increase your appetite, your inspiration, your motivation and your network.
-            </p>
-          </div>
-          <div class="card-footer text-center pt-2">
-            <div class="mx-auto">
-              <svg class="opacity-2" width="60px" height="60px" viewBox="0 0 270 270" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                  <title>quote-down</title>
-                  <g id="quote-down" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                      <path d="M107.000381,49.033238 C111.792099,48.01429 115.761022,48.6892564 116.625294,50.9407629 C117.72393,53.8028077 113.174473,58.3219079 107.017635,60.982801 C107.011653,60.9853863 107.00567,60.9879683 106.999688,60.990547 C106.939902,61.0219589 106.879913,61.0439426 106.820031,61.0659514 C106.355389,61.2618887 105.888177,61.4371549 105.421944,61.5929594 C88.3985192,68.1467602 80.3242628,76.9161885 70.3525495,90.6906738 C60.0774843,104.884196 54.9399518,119.643717 54.9399518,134.969238 C54.9399518,138.278158 55.4624127,140.716309 56.5073346,142.283691 C57.2039492,143.328613 57.9876406,143.851074 58.8584088,143.851074 C59.7291771,143.851074 61.0353294,143.241536 62.7768659,142.022461 C68.3497825,138.016927 75.4030052,136.01416 83.9365338,136.01416 C93.8632916,136.01416 102.658051,140.063232 110.320811,148.161377 C117.983572,156.259521 121.814952,165.88151 121.814952,177.027344 C121.814952,188.695638 117.417572,198.970703 108.622813,207.852539 C99.828054,216.734375 89.1611432,221.175293 76.6220807,221.175293 C61.9931745,221.175293 49.3670351,215.166992 38.7436627,203.150391 C28.1202903,191.133789 22.8086041,175.024577 22.8086041,154.822754 C22.8086041,131.312012 30.0359804,110.239421 44.490733,91.6049805 C58.2196377,73.906272 74.3541002,59.8074126 102.443135,50.4450748 C102.615406,50.3748509 102.790055,50.3058192 102.966282,50.2381719 C104.199241,49.7648833 105.420135,49.3936487 106.596148,49.1227802 L107,49 Z M233.000381,49.033238 C237.792099,48.01429 241.761022,48.6892564 242.625294,50.9407629 C243.72393,53.8028077 239.174473,58.3219079 233.017635,60.982801 C233.011653,60.9853863 233.00567,60.9879683 232.999688,60.990547 C232.939902,61.0219589 232.879913,61.0439426 232.820031,61.0659514 C232.355389,61.2618887 231.888177,61.4371549 231.421944,61.5929594 C214.398519,68.1467602 206.324263,76.9161885 196.352549,90.6906738 C186.077484,104.884196 180.939952,119.643717 180.939952,134.969238 C180.939952,138.278158 181.462413,140.716309 182.507335,142.283691 C183.203949,143.328613 183.987641,143.851074 184.858409,143.851074 C185.729177,143.851074 187.035329,143.241536 188.776866,142.022461 C194.349783,138.016927 201.403005,136.01416 209.936534,136.01416 C219.863292,136.01416 228.658051,140.063232 236.320811,148.161377 C243.983572,156.259521 247.814952,165.88151 247.814952,177.027344 C247.814952,188.695638 243.417572,198.970703 234.622813,207.852539 C225.828054,216.734375 215.161143,221.175293 202.622081,221.175293 C187.993174,221.175293 175.367035,215.166992 164.743663,203.150391 C154.12029,191.133789 148.808604,175.024577 148.808604,154.822754 C148.808604,131.312012 156.03598,110.239421 170.490733,91.6049805 C184.219638,73.906272 200.3541,59.8074126 228.443135,50.4450748 C228.615406,50.3748509 228.790055,50.3058192 228.966282,50.2381719 C230.199241,49.7648833 231.420135,49.3936487 232.596148,49.1227802 L233,49 Z" id="quote-up" fill="#48484A" fill-rule="nonzero" transform="translate(135.311778, 134.872794) scale(-1, -1) translate(-135.311778, -134.872794) "></path>
-                  </g>
-              </svg>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div class="position-absolute w-100 bottom-0">
-    <svg width="100%" viewBox="0 -1 1920 166" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-        <title>wave-up</title>
-        <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-            <g id="Artboard" transform="translate(0.000000, 5.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                <g id="wave-up" transform="translate(0.000000, -5.000000)">
-                    <path d="M0,70 C298.666667,105.333333 618.666667,95 960,39 C1301.33333,-17 1621.33333,-11.3333333 1920,56 L1920,165 L0,165 L0,70 Z" id="Path"></path>
-                </g>
-            </g>
-        </g>
-    </svg>
-  </div>
-</section>
-<!-- END Testimonials w/ 3 cards & dark background -->
-
-
-
-
-
-
-
-
-
-

Testimonials 6

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- -------- START Testimonials w/ 3 cards & brand logos  -------- -->
-<section class="py-5 bg-gray-100">
-  <div class="container">
-    <div class="row">
-      <div class="col-md-4 mb-md-0 mb-4">
-        <div class="card">
-          <div class="card-header p-0 mx-3 mt-3 position-relative z-index-1">
-            <a href="javascript:;" class="d-block blur-shadow-image">
-              <img src="https://images.unsplash.com/photo-1590649681928-4b179f773bd5?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=1920&q=80" class="img-fluid border-radius-lg">
-            </a>
-          </div>
-
-          <div class="card-body">
-            <div class="w-50 mx-auto">
-              <img src="../../assets/img/logos/medium-logos/logo-netflix.svg" alt="" class="img-fluid">
-            </div>
-            <p class="card-description mb-5 mt-3">
-              "Use border utilities to quickly style the border and border-radius of an element. Great for images, buttons."
-            </p>
-            <div class="pull-left">
-              <span>&#8213;</span>
-              Armand Traore
-            </div>
-            <a href="javascript:;" class="text-danger icon-move-right pull-right">Read More
-              <i class="fas fa-arrow-right text-sm ms-1"></i>
-            </a>
-          </div>
-        </div>
-      </div>
-      <div class="col-md-4 mb-md-0 mb-4">
-        <div class="card">
-          <div class="card-header p-0 mx-3 mt-3 position-relative z-index-1">
-            <a href="javascript:;" class="d-block blur-shadow-image">
-              <img src="../../assets/img/mimi-thian.jpg" class="img-fluid border-radius-lg">
-            </a>
-          </div>
-
-          <div class="card-body">
-            <div class="w-50 mx-auto">
-              <img src="../../assets/img/logos/medium-logos/logo-spotify.svg" alt="" class="img-fluid">
-            </div>
-            <p class="card-description mb-5 mt-3">
-              "Use border utilities to quickly style the border and border-radius of an element. Great for images, buttons."
-            </p>
-            <div class="pull-left">
-              <span>&#8213;</span>
-              Collin Marcus
-            </div>
-            <a href="javascript:;" class="text-success icon-move-right pull-right">Read More
-              <i class="fas fa-arrow-right text-sm ms-1"></i>
-            </a>
-          </div>
-        </div>
-      </div>
-      <div class="col-md-4 mb-md-0 mb-4">
-        <div class="card">
-          <div class="card-header p-0 mx-3 mt-3 position-relative z-index-1">
-            <a href="javascript:;" class="d-block blur-shadow-image">
-              <img src="../../assets/img/alesia.jpg" class="img-fluid border-radius-lg">
-            </a>
-          </div>
-
-          <div class="card-body">
-            <div class="w-50 mx-auto">
-              <img src="../../assets/img/logos/medium-logos/logo-behance.svg" alt="" class="img-fluid">
-            </div>
-            <p class="card-description mb-5 mt-3">
-              "Use border utilities to quickly style the border and border-radius of an element. Great for images, buttons."
-            </p>
-            <div class="pull-left">
-              <span>&#8213;</span>
-              Johhny Later
-            </div>
-            <a href="javascript:;" class="text-darker icon-move-right pull-right">Read More
-              <i class="fas fa-arrow-right text-sm ms-1"></i>
-            </a>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-<!-- -------- END Testimonials w/ 3 cards & brand logos  -------- -->
-
-
-
-
-
-
-
-
-
-

Testimonials 7

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- START Testimonials w/ 3 cards w/ stars -->
-<section class="py-5 position-relative">
-  <div class="container">
-    <div class="row">
-      <div class="col-md-6">
-        <h2 class="mb-3">Our Customers</h2>
-        <h5 class="font-weight-light">
-          You need more informations?
-          Read our customers reviews.
-        </h5>
-      </div>
-    </div>
-    <div class="row mt-lg-6 mt-4">
-      <div class="col-lg-3 col-md-6 mb-lg-0 mb-4 ms-auto">
-        <div class="card">
-          <div class="card-body text-center pb-0">
-            <div class="text-center">
-              <div class="rating">
-                <i class="fas fa-star text-warning"></i>
-                <i class="fas fa-star text-warning"></i>
-                <i class="fas fa-star text-warning"></i>
-                <i class="fas fa-star text-warning"></i>
-                <i class="far fa-star text-warning"></i>
-              </div>
-            </div>
-            <p class="mt-4">
-              "Web Summit will increase your appetite, your inspiration, your motivation and your network."
-            </p>
-          </div>
-          <div class="card-footer text-center pt-3 position-relative z-index-1">
-            <div class="position-relative">
-              <div class="blur-shadow-avatar">
-                <img class="avatar avatar-lg shadow-lg" src="../../assets/img/team-4.jpg">
-              </div>
-            </div>
-            <h6 class="mb-0 mt-2">Lucian Eurel</h6>
-            <p class="text-xs mb-0">CEO Creative Tim</p>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-3 col-md-6 mb-lg-0 mb-4">
-        <div class="card">
-          <div class="card-body text-center pb-0">
-            <div class="text-center">
-              <div class="rating">
-                <i class="fas fa-star text-warning"></i>
-                <i class="fas fa-star text-warning"></i>
-                <i class="fas fa-star text-warning"></i>
-                <i class="fas fa-star text-warning"></i>
-                <i class="far fa-star text-warning"></i>
-              </div>
-            </div>
-            <p class="mt-4">
-              "Do not go where the path may lead, go instead where there is no path and leave a trail."
-            </p>
-          </div>
-          <div class="card-footer text-center pt-3 position-relative z-index-1">
-            <div class="position-relative">
-              <div class="blur-shadow-avatar">
-                <img class="avatar avatar-lg shadow-lg" src="../../assets/img/team-2.jpg">
-              </div>
-            </div>
-            <h6 class="mb-0 mt-2">Linde Michel</h6>
-            <p class="text-xs mb-0">CFO Slack</p>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-3 mb-lg-0 mb-4 me-auto">
-        <div class="card">
-          <div class="card-body text-center pb-0">
-            <div class="text-center">
-              <div class="rating">
-                <i class="fas fa-star text-warning"></i>
-                <i class="fas fa-star text-warning"></i>
-                <i class="fas fa-star text-warning"></i>
-                <i class="fas fa-star text-warning"></i>
-                <i class="fas fa-star text-warning"></i>
-              </div>
-            </div>
-            <p class="mt-4">
-              "The pessimist complains about the wind; the optimist expects it to change; the realist adjusts the sails."
-            </p>
-          </div>
-          <div class="card-footer text-center pt-3 position-relative z-index-1">
-            <div class="position-relative">
-              <div class="blur-shadow-avatar">
-                <img class="avatar avatar-lg shadow-lg" src="../../assets/img/team-3.jpg">
-              </div>
-            </div>
-            <h6 class="mb-0 mt-2">Mark Stam</h6>
-            <p class="text-xs mb-0">COO Dribbble</p>
-          </div>
-        </div>
-      </div>
-      <div class="col-lg-3 mb-lg-0 mb-4 me-auto">
-        <div class="card h-100">
-          <div class="card-body d-flex flex-column justify-content-center text-center">
-            <a href="javascript:;">
-              <i class="fa fa-plus text-secondary mb-3"></i>
-              <h5 class=" text-secondary"> Add Testimonial </h5>
-            </a>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-<!-- END Testimonials w/ 3 cards w/ stars -->
-
-
-
-
-
-
-
-
-
-

Testimonials 8

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- START Testimonials w/ user image & text & info -->
-<section class="py-6 position-relative overflow-hidden">
-  <img src="../../assets/img/shapes/waves-white.svg" alt="pattern-lines" class="position-absolute opacity-6 top-0 w-100 z-index-1">
-  <div class="container-fluid">
-    <div class="row">
-      <div class="col-10 mx-auto bg-gradient-dark border-radius-lg">
-        <div class="row py-5">
-          <div class="col-xl-4 col-md-6 px-5 position-relative">
-            <img class="img border-radius-md max-width-300 w-100 position-relative z-index-2" src="https://images.unsplash.com/photo-1526413232644-8a40f03cc03b?ixlib=rb-1.2.1&ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&auto=format&fit=crop&w=934&q=80">
-          </div>
-          <div class="col-xl-4 col-md-5 z-index-2 position-relative px-md-3 px-5 my-auto">
-            <div>
-              <svg class="opacity-2" width="40px" height="40px" viewBox="0 0 270 270" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-                  <title>quote-down</title>
-                  <g id="quote-down" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-                      <path d="M107.000381,49.033238 C111.792099,48.01429 115.761022,48.6892564 116.625294,50.9407629 C117.72393,53.8028077 113.174473,58.3219079 107.017635,60.982801 C107.011653,60.9853863 107.00567,60.9879683 106.999688,60.990547 C106.939902,61.0219589 106.879913,61.0439426 106.820031,61.0659514 C106.355389,61.2618887 105.888177,61.4371549 105.421944,61.5929594 C88.3985192,68.1467602 80.3242628,76.9161885 70.3525495,90.6906738 C60.0774843,104.884196 54.9399518,119.643717 54.9399518,134.969238 C54.9399518,138.278158 55.4624127,140.716309 56.5073346,142.283691 C57.2039492,143.328613 57.9876406,143.851074 58.8584088,143.851074 C59.7291771,143.851074 61.0353294,143.241536 62.7768659,142.022461 C68.3497825,138.016927 75.4030052,136.01416 83.9365338,136.01416 C93.8632916,136.01416 102.658051,140.063232 110.320811,148.161377 C117.983572,156.259521 121.814952,165.88151 121.814952,177.027344 C121.814952,188.695638 117.417572,198.970703 108.622813,207.852539 C99.828054,216.734375 89.1611432,221.175293 76.6220807,221.175293 C61.9931745,221.175293 49.3670351,215.166992 38.7436627,203.150391 C28.1202903,191.133789 22.8086041,175.024577 22.8086041,154.822754 C22.8086041,131.312012 30.0359804,110.239421 44.490733,91.6049805 C58.2196377,73.906272 74.3541002,59.8074126 102.443135,50.4450748 C102.615406,50.3748509 102.790055,50.3058192 102.966282,50.2381719 C104.199241,49.7648833 105.420135,49.3936487 106.596148,49.1227802 L107,49 Z M233.000381,49.033238 C237.792099,48.01429 241.761022,48.6892564 242.625294,50.9407629 C243.72393,53.8028077 239.174473,58.3219079 233.017635,60.982801 C233.011653,60.9853863 233.00567,60.9879683 232.999688,60.990547 C232.939902,61.0219589 232.879913,61.0439426 232.820031,61.0659514 C232.355389,61.2618887 231.888177,61.4371549 231.421944,61.5929594 C214.398519,68.1467602 206.324263,76.9161885 196.352549,90.6906738 C186.077484,104.884196 180.939952,119.643717 180.939952,134.969238 C180.939952,138.278158 181.462413,140.716309 182.507335,142.283691 C183.203949,143.328613 183.987641,143.851074 184.858409,143.851074 C185.729177,143.851074 187.035329,143.241536 188.776866,142.022461 C194.349783,138.016927 201.403005,136.01416 209.936534,136.01416 C219.863292,136.01416 228.658051,140.063232 236.320811,148.161377 C243.983572,156.259521 247.814952,165.88151 247.814952,177.027344 C247.814952,188.695638 243.417572,198.970703 234.622813,207.852539 C225.828054,216.734375 215.161143,221.175293 202.622081,221.175293 C187.993174,221.175293 175.367035,215.166992 164.743663,203.150391 C154.12029,191.133789 148.808604,175.024577 148.808604,154.822754 C148.808604,131.312012 156.03598,110.239421 170.490733,91.6049805 C184.219638,73.906272 200.3541,59.8074126 228.443135,50.4450748 C228.615406,50.3748509 228.790055,50.3058192 228.966282,50.2381719 C230.199241,49.7648833 231.420135,49.3936487 232.596148,49.1227802 L233,49 Z" id="quote-up" fill="#FFFFFF" fill-rule="nonzero" transform="translate(135.311778, 134.872794) scale(-1, -1) translate(-135.311778, -134.872794) "></path>
-                  </g>
-              </svg>
-            </div>
-            <p class="text-lg text-white">
-                Decisions: If you can’t decide, the answer is no.
-                If two equally difficult paths, choose the one more
-                painful in the short term (pain avoidance is creating
-                an illusion of equality). Choose the path that leaves
-                you more equanimous in the long term.
-            </p>
-            <p class="text-white font-weight-bold text-sm">Michael  -  <span class="text-xs font-weight-normal">Writter</span></p>
-            <hr class="vertical start-100 ms-n5 d-xl-block d-none">
-          </div>
-          <div class="col-1"></div>
-          <div class="col-xl-2 col-12 px-xl-0 px-5 my-xl-auto position-relative z-index-1">
-            <h3 class="text-white mt-xl-0 mt-5">1,340,000 +</h3>
-            <p class="text-sm text-white opacity-8">Developers and Companies around the world using our products.</p>
-            <a href="javascript:;" class="text-primary icon-move-right text-sm">See all products
-                <i class="fas fa-arrow-right text-xs"></i>
-              </a>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</section>
-<!-- END Testimonials w/ user image & text & info -->
-
-
-
-
-
-
-
-
-
-

Testimonials 9

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="testimonial-2 py-9">
-  <div class="container">
-    <div class="row">
-      <div class="gliderrr">
-        <div data-glide-el="track" class="glide__track">
-          <ul class="glide__slides">
-            <li class="glide__slide">
-              <div class="glide__container">
-                <div class="card">
-                  <div class="card-body text-center pb-0 position-relative">
-                    <img class="w-75 end-0 start-0 mx-auto top-0 mt-n6 position-absolute" src="../../assets/img/automotive/amg-gt.png">
-                    <h6 class="mt-6">AMG GT</h6>
-                    <button type="button" class="btn btn-sm btn-rounded btn-outline-dark">Book Now</button>
-                  </div>
-                </div>
-              </div>
-            </li>
-            <li class="glide__slide">
-              <div class="glide__container">
-                <div class="card">
-                  <div class="card-body text-center pb-0 position-relative">
-                    <img class="w-75 end-0 start-0 mx-auto top-0 mt-n6 position-absolute" src="../../assets/img/automotive/g-amg.png">
-                    <h6 class="mt-6">G63 AMG</h6>
-                    <button type="button" class="btn btn-sm btn-rounded btn-outline-dark">Book Now</button>
-                  </div>
-                </div>
-              </div>
-            </li>
-            <li class="glide__slide">
-              <div class="glide__container">
-                <div class="card">
-                  <div class="card-body text-center pb-0 position-relative">
-                    <img class="w-75 end-0 start-0 mx-auto top-0 mt-n6 position-absolute" src="../../assets/img/automotive/s-maybach.png">
-                    <h6 class="mt-6">S Maybach</h6>
-                    <button type="button" class="btn btn-sm btn-rounded btn-outline-dark">Book Now</button>
-                  </div>
-                </div>
-              </div>
-            </li>
-            <li class="glide__slide">
-              <div class="glide__container">
-                <div class="card">
-                  <div class="card-body text-center pb-0 position-relative">
-                    <img class="w-75 end-0 start-0 mx-auto top-0 mt-n6 position-absolute" src="../../assets/img/automotive/glc.png">
-                    <h6 class="mt-6">GLC</h6>
-                    <button type="button" class="btn btn-sm btn-rounded btn-outline-dark">Book Now</button>
-                  </div>
-                </div>
-              </div>
-            </li>
-            <li class="glide__slide">
-              <div class="glide__container">
-                <div class="card">
-                  <div class="card-body text-center pb-0 position-relative">
-                    <img class="w-75 end-0 start-0 mx-auto top-0 mt-n4 position-absolute" src="../../assets/img/automotive/cls.png">
-                    <h6 class="mt-6">CLS</h6>
-                    <button type="button" class="btn btn-sm btn-rounded btn-outline-dark">Book Now</button>
-                  </div>
-                </div>
-              </div>
-            </li>
-          </ul>
-        </div>
-    </div>
-    </div>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Testimonials 10

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<section class="bg-gradient-primary position-relative overflow-hidden">
-  <img src="../../assets/img/shapes/waves-white.svg" alt="pattern-lines" class="position-absolute opacity-6">
-  <div class="position-absolute w-100 z-inde-1 top-0 mt-n3">
-    <svg width="100%" viewBox="0 -2 1920 157" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-        <title>wave-down</title>
-        <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-            <g id="Artboard" fill="#FFFFFF" fill-rule="nonzero">
-                <g id="wave-down">
-                    <path d="M0,60.8320331 C299.333333,115.127115 618.333333,111.165365 959,47.8320321 C1299.66667,-15.5013009 1620.66667,-15.2062179 1920,47.8320331 L1920,156.389409 L0,156.389409 L0,60.8320331 Z" id="Path-Copy-2" transform="translate(960.000000, 78.416017) rotate(180.000000) translate(-960.000000, -78.416017) "></path>
-                </g>
-            </g>
-        </g>
-    </svg>
-  </div>
-  <div class="container pt-5 pb-7">
-    <div class="row">
-      <div class="col-lg-6 d-flex justify-content-center flex-column">
-        <div id="carouselExampleIndicator" class="carousel slide py-7" data-bs-ride="carousel">
-          <ol class="carousel-indicators justify-content-start ms-0">
-            <a class="active" href="javascript:;"><img src="../../assets/img/team-4.jpg" alt="..." class="avatar avatar-sm avatar-scale-up shadow" data-bs-target="#carouselExampleIndicator" data-bs-slide-to="0">
-              <span class="text-white mx-2">&#124;</span>
-            </a>
-
-            <a href="javascript:;"><img src="../../assets/img/team-3.jpg" alt="..." class="avatar avatar-sm avatar-scale-up shadow" data-bs-target="#carouselExampleIndicator" data-bs-slide-to="1">  <span class="text-white mx-2">&#124;</span>
-            </a>
-
-            <a href="javascript:;"><img src="../../assets/img/team-2.jpg" alt="..." class="avatar avatar-sm avatar-scale-up shadow" data-bs-target="#carouselExampleIndicator" data-bs-slide-to="2">
-            </a>
-          </ol>
-          <div class="carousel-inner">
-            <h2 class="text-white mb-0">Work with us</h2>
-            <p class="text-white opacity-8 mb-1">Whatever your qualification is - we got you!</p>
-            <hr class="text-white horizontal opacity-6 mb-4 mt-2 w-25 text-left">
-            <div class="carousel-item active">
-              <h6 class="text-white opacity-8 pe-5">"Take up one idea. Make that one idea your life - think of it, dream of it, live on that idea.
-                Let the brain, muscles, nerves, every part of your body, be full of that idea, and just leave every other idea alone.
-                This is the way to success. A single rose can be my garden... a single friend, my world."</h6>
-              <div class="author mt-4">
-                <div class="name">
-                  <span class="text-white">Ludwig Siato</span>
-                  <div class="stats">
-                    <small class="text-white opacity-6">Project manager, Apple</small>
-                  </div>
-                </div>
-              </div>
-            </div>
-            <div class="carousel-item">
-              <h6 class="text-white opacity-8 pe-5">"Take up one idea. Make that one idea your life - think of it, dream of it, live on that idea.
-                Let the brain, muscles, nerves, every part of your body, be full of that idea, and just leave every other idea alone.
-                This is the way to success. A single rose can be my garden... a single friend, my world."</h6>
-              <div class="author mt-4">
-                <div class="name">
-                  <span class="text-white">John Down</span>
-                  <div class="stats">
-                    <small class="text-white opacity-6">CFO, Google</small>
-                  </div>
-                </div>
-              </div>
-            </div>
-            <div class="carousel-item">
-              <h6 class="text-white opacity-8 pe-5">"Take up one idea. Make that one idea your life - think of it, dream of it, live on that idea.
-                Let the brain, muscles, nerves, every part of your body, be full of that idea, and just leave every other idea alone.
-                This is the way to success. A single rose can be my garden... a single friend, my world."</h6>
-              <div class="author mt-4">
-                <div class="name">
-                  <span class="text-white">Mark Jojansen</span>
-                  <div class="stats">
-                    <small class="text-white opacity-6">Fullstack Developer, Atlassian</small>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="col-md-6 justify-content-center flex-column d-sm-none d-md-none d-lg-flex d-xl-flex">
-        <div class="row justify-content-center d-none d-md-flex">
-          <div class="col-3 mb-4">
-            <div class="d-block bg-white avatar avatar-lg rounded-circle p-3 mt-n4 ms-8 fadeIn2 fadeInBottom">
-              <img src="../../assets/img/logos/small-logos/logo-asana.svg" alt="Logo Image">
-            </div>
-          </div>
-          <div class="col-4 mb-4">
-            <div class="d-block bg-white avatar avatar-lg rounded-circle p-3 ms-8 mt-n6 fadeIn1 fadeInBottom">
-              <img src="../../assets/img/logos/small-logos/logo-slack.svg" alt="Logo Image">
-            </div>
-          </div>
-          <div class="col-4 mb-4">
-            <div class="d-block bg-white avatar avatar-lg rounded-circle p-3 ms-6 mt-2 fadeIn3 fadeInBottom">
-              <img src="../../assets/img/logos/small-logos/logo-google-drive.svg" alt="Logo Image">
-            </div>
-          </div>
-        </div>
-
-        <div class="row justify-content-end d-none d-md-flex">
-          <div class="col-4 my-4">
-            <div class="d-block bg-white avatar avatar-lg rounded-circle p-3 ms-4 fadeIn1 fadeInBottom">
-              <img class="avatar-img" src="../../assets/img/logos/small-logos/logo-shopify.svg" alt="Logo Image">
-            </div>
-          </div>
-          <div class="col-3 my-4">
-            <div class="d-block bg-white avatar avatar-lg rounded-circle p-3 me-auto fadeIn1 fadeInBottom">
-              <img class="avatar-img" src="../../assets/img/logos/small-logos/logo-apple.svg" alt="Logo Image">
-            </div>
-          </div>
-          <div class="col-3 my-4">
-            <div class="d-block bg-white avatar avatar-lg rounded-circle p-3 fadeIn3 fadeInBottom ms-3 mt-3">
-              <img class="avatar-img" src="../../assets/img/logos/small-logos/logo-invision.svg" alt="Logo Image">
-            </div>
-          </div>
-        </div>
-
-        <div class="row d-none d-md-flex">
-          <div class="col-6">
-            <!-- Logo -->
-            <div class="d-block bg-white avatar avatar-lg rounded-circle p-3 ms-auto mt-5 fadeIn2 fadeInBottom">
-              <img class="avatar-img" src="../../assets/img/logos/small-logos/logo-atlassian.svg" alt="Logo Image">
-            </div>
-            <!-- End Logo -->
-          </div>
-          <div class="col-6 mt-6">
-            <!-- Logo -->
-            <div class="d-block bg-white avatar avatar-lg rounded-circle p-3 mx-auto mt-n3 fadeIn3 fadeInBottom">
-              <img class="avatar-img" src="../../assets/img/logos/small-logos/logo-weave.svg" alt="Logo Image">
-            </div>
-            <!-- End Logo -->
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div class="position-absolute w-100 bottom-0">
-    <svg width="100%" viewBox="0 -1 1920 166" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-        <title>wave-up</title>
-        <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-            <g id="Artboard" transform="translate(0.000000, 5.000000)" fill="#FFFFFF" fill-rule="nonzero">
-                <g id="wave-up" transform="translate(0.000000, -5.000000)">
-                    <path d="M0,70 C298.666667,105.333333 618.666667,95 960,39 C1301.33333,-17 1621.33333,-11.3333333 1920,56 L1920,165 L0,165 L0,70 Z" id="Path"></path>
-                </g>
-            </g>
-        </g>
-    </svg>
-  </div>
-</section>
-
-
-
-
-
-
-
-
-
-

Testimonials 11

-
-
-
- -
-
-
-
-
-
- -
-
-
- Copy - 
<!-- START Testimonials w/ bg image & faded gradient & company logo -->
-<section class="py-5 position-relative">
-  <div class="container-fluid">
-    <div class="row">
-      <div class="col-10 mx-auto">
-        <div id="carouselExampleTestimonials-11" class="carousel carousel-fade slide shadow-lg" data-bs-ride="carousel">
-          <ol class="carousel-indicators z-index-2">
-            <li data-bs-target="#carouselExampleTestimonials-11" data-bs-slide-to="0" class="active"></li>
-            <li data-bs-target="#carouselExampleTestimonials-11" data-bs-slide-to="1"></li>
-          </ol>
-          <div class="carousel-inner rounded-3">
-            <div class="carousel-item bg-cover active" style="background-image: url(&#39;../../assets/img/office-1.jpeg&#39;)">
-              <div class="z-index-1 my-md-8 my-6 position-relative z-index-2">
-                <div class="row h-100">
-                  <div class="col-xl-6 my-auto px-6">
-                    <h5 class="text-white font-weight-normal mb-3">
-                      " Decisions: If you can’t decide, the answer is no. If two equally difficult paths,
-                      choose the one more painful in the short term(pain avoidance is creating an illusion."
-                    </h5>
-                    <p class="text-white font-weight-bold">Michael Lerson, <span class="text-xs font-weight-normal">Project Manager </span></p>
-                  </div>
-                  <div class="col-xl-6 my-auto px-7 mt-md-auto mt-4">
-                    <img src="../../assets/img/logos/white-logos/logo-google-white.svg" class="d-block w-100" alt="...">
-                  </div>
-                </div>
-              </div>
-              <span class="mask bg-gradient-faded-warning opacity-10 z-index-0 rounded-3"></span>
-            </div>
-            <div class="carousel-item bg-cover" style="background-image: url(&#39;../../assets/img/office-2.jpeg&#39;)">
-              <div class="z-index-1 my-md-8 my-6 position-relative z-index-2">
-                <div class="row h-100">
-                  <div class="col-xl-6 my-auto px-6">
-                    <h5 class="text-white font-weight-normal mb-3">
-                      " Knowledge is either from direct experience or from verifiable, falsifiable science.
-                      There is knowledge that is transmitted but not verifiable / falsifiable."
-                    </h5>
-                    <p class="text-white font-weight-bold">Louis Miriam, <span class="text-xs font-weight-normal">COO</span></p>
-                  </div>
-                  <div class="col-xl-6 my-auto px-7 mt-md-auto mt-4">
-                      <img src="../../assets/img/logos/white-logos/logo-spotify-white.svg" class="d-block w-100" alt="...">
-                  </div>
-                </div>
-              </div>
-              <span class="mask bg-gradient-faded-success opacity-10 z-index-0 rounded-3"></span>
-            </div>
-          </div>
-        </div>
-        <div class="row mt-5">
-          <div class="col-lg-2 col-4 ms-auto">
-            <a href="javascript:;" data-bs-target="#carouselExampleTestimonials-11" data-bs-slide-to="0" class="active">
-              <img src="../../assets/img/logos/medium-logos/logo-google.svg" class="d-block w-100" alt="...">
-            </a>
-          </div>
-          <div class="col-lg-2 col-4 me-auto">
-            <a href="javascript:;" data-bs-target="#carouselExampleTestimonials-11" data-bs-slide-to="1">
-              <img src="../../assets/img/logos/medium-logos/logo-spotify.svg" class="d-block w-100" alt="...">
-            </a>
-          </div>
-      </div>
-    </div>
-  </div>
-</section>
-<!-- END Testimonials w/ bg image & faded gradient & company logo -->
-
-
-
-
-
-
-
-
- - - - - - - - - - - - - - - - - \ No newline at end of file