diff options
29 files changed, 4826 insertions, 439 deletions
@@ -133,49 +133,104 @@ Use Netlify to deploy this theme. This theme contains a valid and tested `netlif ## Configuring Theme +**Logo** + +You can edit the logo from the `config.toml` + +```toml + # config.toml + + [params.logo] + mobile = "images/logo/logo-mobile.svg" + mobile_height = "36px" + desktop = "images/logo/logo.svg" + desktop_height = "36px" + alt = "Serif - A Hugo Business Theme" +``` + +**Fonts** + +This theme uses Google fonts. You can change the font snippet in `layouts/partials/google-fonts.html` and then update font variable in `scss/style.scss` + +```scss + // scss/style.scss + + // Fonts + $font-family-base: Helvetica, Arial, sans-serif, -apple-system; + $font-family-heading: 'Playfair Display', serif, -apple-system; +``` + +**Colors** + +You can edit the themes primary, secondary and neutral colors in `scss/style.scss`. To override the bootstrap colors simply edit `scss/_bootstrap-variables.scss` + +```scss + // scss/style.scss + + // Colors + $primary: #f24088; + $secondary: #f88379; + $black: #2f2f41; + $white: #ffffff; + $white-offset: #f6f7ff; + $steel: #5C5A5A; +``` + +**Hero Image** + +List pages such as the homepage, services and team can have a Hero image. + +```yml +# content/_index.md +--- +intro_image: "https://source.unsplash.com/wOGhHamMqLc" +intro_image_absolute: false +intro_image_hide_on_mobile: true +--- +``` + +While this themes default content uses illustrations, its easy to change the image to a photo and it will still look great. + +the front-matter field `intro_image_absolute: true` let's illustrations "break out" (in CSS terms, it uses `position: absolute`) of the grid and is an intended stylistic effect. When using photos or normal images it's recommended to set this to false and the photo will align with the grid. See `content/team/_index.md` for an example. + + ### Google Analytics -Copy your Google Analytics ID into the `config.toml` in the `google_analytics_id` field - Also supports Google Tag Manager. +Put your Google Analytics ID in the `google_analytics_id` field in the `config.toml` - Also supports Google Tag Manager. When your site is running locally using `hugo server` the GA tag is not injected. This prevents polluting your real data. ```toml # config.toml + [params] - google_analytics_id = "" + google_analytics_id = "UA-XXX-1" google_tag_manager_id = "" ``` -When your site is running locally using `hugo server` the GA tag is not injected. This prevents polluting your real data. + You can also set the Google Analytics ID using a [Netlify environment variable](https://docs.netlify.com/configure-builds/environment-variables/) `HUGO_GOOGLE_ANALYTICS_ID` -### Homepage meta tags +### Title, meta tags & OG meta data -Often a homepage requires special meta tags such as a meta description or og meta data for twitter, facebook etc. You can configure these values in the `config.toml` +A pages `title`, `description` and `image` front-matter fields are used to generate the pages title and meta tags. + +By default a pages `<title>` is generated from the front-matter `title` and site title set in `config.toml` -```toml -# config.toml - [params.homepage_meta_tags] - meta_description = "a description of your website." - meta_og_title = "My Theme" - meta_og_type = "website" - meta_og_url = "https://www.mywebsite.com" - meta_og_image = "https://www.mywebsite.com/images/tn.png" - meta_og_description = "a description of your website." - meta_twitter_card = "summary" - meta_twitter_site = "@mytwitterhandle" - meta_twitter_creator = "@mytwitterhandle" +``` + <title>{{ block "title" . }}{{ if .Params.meta_title }}{{ .Params.meta_title }}{{ else }}{{ .Title }} - {{ .Site.Title }}{{ end }}{{ end }}</title> ``` -### Override meta tags on a per layout basis +You can override the `<title>` on any page by using the `meta_title` field in the front-matter. See `content/_index.md` for an example. -You can set meta tags on a per template basis using a block. For example, you might want to write a custom meta description for the `/services` page. You can insert any valid HTML meta data inside the `{{ define "meta_tags }}` block at the top of a template. +Set your twitter info to ensure twitter social previews work correctly. -```html -// layouts/services/list.html +```toml + # config.toml -{{ define "meta_tags" }} - <meta name="description" content="We offer a variety of services in the finance industry" /> -{{ end }} + [params.seo] + meta_twitter_site = "@zerostaticio" + meta_twitter_creator = "@zerostaticio" ``` + ## License & Credits This theme is open source under the MIT license. diff --git a/assets/scss/pages/team/_team-summary.scss b/assets/scss/pages/team/_team-summary.scss index 44e19cc..32db480 100644 --- a/assets/scss/pages/team/_team-summary.scss +++ b/assets/scss/pages/team/_team-summary.scss @@ -10,6 +10,7 @@ overflow: hidden; img { width: 60px; + height: auto; } } .team-meta { @@ -45,6 +46,7 @@ overflow: hidden; img { width: 90px; + height: auto; } } }
\ No newline at end of file diff --git a/assets/scss/style.scss b/assets/scss/style.scss index d0323e3..3ad8405 100755 --- a/assets/scss/style.scss +++ b/assets/scss/style.scss @@ -6,16 +6,17 @@ $white: #ffffff; $white-offset: #f6f7ff; $steel: #5C5A5A; +// Fonts +// Google fonts are imported in `layouts/partials/google-fonts.html` +$font-family-base: Helvetica, Arial, sans-serif, -apple-system; +$font-family-heading: 'Playfair Display', serif, -apple-system; // uses a Google font + // Links $link-color: $primary; $link-decoration: none; $link-hover-color: lighten($primary, 20%); $link-hover-decoration: underline; -// Fonts -$font-family-base: Helvetica, Arial, sans-serif, -apple-system; -$font-family-heading: 'Playfair Display', serif, -apple-system; - // Footer $footer-background-color: $primary; $footer-text-color: $white; @@ -66,26 +67,3 @@ body { line-height: 1.3; } } - -// Display breakpoints for DEV -{{ if .Site.IsServer }} -body:after { - color: #000000; - font-size: 12px; - padding: 5px; - font-weight: bold; - right: 10px; - position: fixed; - text-align: center; - text-transform: uppercase; - bottom: 10px; - width: 200px; - z-index: 9999; - border: solid 1px #000000; - @each $name, $value in $grid-breakpoints { - @include media-breakpoint-up($name) { - content: '#{$name} - min-width: #{$value}'; - } - } -} -{{ end }} diff --git a/exampleSite/config.toml b/exampleSite/config.toml index d1e177f..91dbfea 100644 --- a/exampleSite/config.toml +++ b/exampleSite/config.toml @@ -20,14 +20,7 @@ theme = "hugo-serif-theme" desktop_height = "36px" alt = "Serif - A Hugo Business Theme" - [params.homepage_meta_tags] - meta_description = "Serif is a modern business theme for Hugo. It contains content types for the archetypical business website. The theme is fully responsive, blazing fast and artfully illustrated." - meta_og_title = "Hugo Serif Theme" - meta_og_type = "website" - meta_og_url = "https://hugo-serif.netlify.app" - meta_og_image = "https://raw.githubusercontent.com/JugglerX/hugo-serif-theme/master/images/tn.png" - meta_og_description = "Serif is a modern business theme for Hugo. It contains content types for the archetypical business website. The theme is fully responsive, blazing fast and artfully illustrated." - meta_twitter_card = "summary" + [params.seo] meta_twitter_site = "@zerostaticio" meta_twitter_creator = "@zerostaticio" diff --git a/exampleSite/content/_index.md b/exampleSite/content/_index.md index 6931e3a..aaeaa8c 100644 --- a/exampleSite/content/_index.md +++ b/exampleSite/content/_index.md @@ -1,5 +1,7 @@ --- -title: 'Home' +title: 'Homepage' +meta_title: 'Hugo Serif Theme' +description: "Serif is a modern business theme for Hugo. It contains content types for the archetypical business website. The theme is fully responsive, blazing fast and artfully illustrated." intro_image: "images/illustrations/pointing.svg" intro_image_absolute: true intro_image_hide_on_mobile: true diff --git a/exampleSite/content/_redirects b/exampleSite/content/_redirects new file mode 100644 index 0000000..eb70c84 --- /dev/null +++ b/exampleSite/content/_redirects @@ -0,0 +1 @@ +/* /404.html 404
\ No newline at end of file diff --git a/exampleSite/content/team/_index.md b/exampleSite/content/team/_index.md index ac4dcfa..2e5c735 100644 --- a/exampleSite/content/team/_index.md +++ b/exampleSite/content/team/_index.md @@ -1,7 +1,7 @@ --- title: 'Team' -intro_image: "" -intro_image_absolute: true +intro_image: "images/team/smartworks-coworking-cW4lLTavU80-unsplash.jpg" +intro_image_absolute: false intro_image_hide_on_mobile: false --- diff --git a/exampleSite/content/team/bill-mcdonald.md b/exampleSite/content/team/bill-mcdonald.md deleted file mode 100644 index 0d40228..0000000 --- a/exampleSite/content/team/bill-mcdonald.md +++ /dev/null @@ -1,13 +0,0 @@ ---- -title: "Bill McDonald" -date: 2018-11-19T10:47:58+10:00 -draft: false -image: "images/team/nonsap-visuals-kMJp7620W6U-unsplash.jpg" -jobtitle: "Graphic Designer" -linkedinurl: "" -weight: 7 ---- - -Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. - -Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. diff --git a/exampleSite/resources/_gen/assets/scss/scss/style.scss_bcb603c6c6d8658ecadd27900cde73da.content b/exampleSite/resources/_gen/assets/scss/scss/style.scss_bcb603c6c6d8658ecadd27900cde73da.content new file mode 100644 index 0000000..6c4a4f4 --- /dev/null +++ b/exampleSite/resources/_gen/assets/scss/scss/style.scss_bcb603c6c6d8658ecadd27900cde73da.content @@ -0,0 +1,4713 @@ +/*! + * Bootstrap Reboot v4.4.1 (https://getbootstrap.com/) + * Copyright 2011-2019 The Bootstrap Authors + * Copyright 2011-2019 Twitter, Inc. + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) + * Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md) + */ +*, +*::before, +*::after { + box-sizing: border-box; } + +html { + font-family: sans-serif; + line-height: 1.15; + -webkit-text-size-adjust: 100%; + -webkit-tap-highlight-color: rgba(47, 47, 65, 0); } + +article, aside, figcaption, figure, footer, header, hgroup, main, nav, section { + display: block; } + +body { + margin: 0; + font-family: Helvetica, Arial, sans-serif, -apple-system; + font-size: 1rem; + font-weight: 400; + line-height: 1.5; + color: #212529; + text-align: left; + background-color: #ffffff; } + +[tabindex="-1"]:focus:not(:focus-visible) { + outline: 0 !important; } + +hr { + box-sizing: content-box; + height: 0; + overflow: visible; } + +h1, h2, h3, h4, h5, h6 { + margin-top: 0; + margin-bottom: 0.5rem; } + +p { + margin-top: 0; + margin-bottom: 1rem; } + +abbr[title], +abbr[data-original-title] { + text-decoration: underline; + text-decoration: underline dotted; + cursor: help; + border-bottom: 0; + text-decoration-skip-ink: none; } + +address { + margin-bottom: 1rem; + font-style: normal; + line-height: inherit; } + +ol, +ul, +dl { + margin-top: 0; + margin-bottom: 1rem; } + +ol ol, +ul ul, +ol ul, +ul ol { + margin-bottom: 0; } + +dt { + font-weight: 700; } + +dd { + margin-bottom: .5rem; + margin-left: 0; } + +blockquote { + margin: 0 0 1rem; } + +b, +strong { + font-weight: bolder; } + +small { + font-size: 80%; } + +sub, +sup { + position: relative; + font-size: 75%; + line-height: 0; + vertical-align: baseline; } + +sub { + bottom: -.25em; } + +sup { + top: -.5em; } + +a { + color: #f24088; + text-decoration: none; + background-color: transparent; } + a:hover { + color: #f9a0c4; + text-decoration: underline; } + +a:not([href]) { + color: inherit; + text-decoration: none; } + a:not([href]):hover { + color: inherit; + text-decoration: none; } + +pre, +code, +kbd, +samp { + font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; + font-size: 1em; } + +pre { + margin-top: 0; + margin-bottom: 1rem; + overflow: auto; } + +figure { + margin: 0 0 1rem; } + +img { + vertical-align: middle; + border-style: none; } + +svg { + overflow: hidden; + vertical-align: middle; } + +table { + border-collapse: collapse; } + +caption { + padding-top: 0.75rem; + padding-bottom: 0.75rem; + color: #6c757d; + text-align: left; + caption-side: bottom; } + +th { + text-align: inherit; } + +label { + display: inline-block; + margin-bottom: 0.5rem; } + +button { + border-radius: 0; } + +button:focus { + outline: 1px dotted; + outline: 5px auto -webkit-focus-ring-color; } + +input, +button, +select, +optgroup, +textarea { + margin: 0; + font-family: inherit; + font-size: inherit; + line-height: inherit; } + +button, +input { + overflow: visible; } + +button, +select { + text-transform: none; } + +select { + word-wrap: normal; } + +button, +[type="button"], +[type="reset"], +[type="submit"] { + -webkit-appearance: button; } + +button:not(:disabled), +[type="button"]:not(:disabled), +[type="reset"]:not(:disabled), +[type="submit"]:not(:disabled) { + cursor: pointer; } + +button::-moz-focus-inner, +[type="button"]::-moz-focus-inner, +[type="reset"]::-moz-focus-inner, +[type="submit"]::-moz-focus-inner { + padding: 0; + border-style: none; } + +input[type="radio"], +input[type="checkbox"] { + box-sizing: border-box; + padding: 0; } + +input[type="date"], +input[type="time"], +input[type="datetime-local"], +input[type="month"] { + -webkit-appearance: listbox; } + +textarea { + overflow: auto; + resize: vertical; } + +fieldset { + min-width: 0; + padding: 0; + margin: 0; + border: 0; } + +legend { + display: block; + width: 100%; + max-width: 100%; + padding: 0; + margin-bottom: .5rem; + font-size: 1.5rem; + line-height: inherit; + color: inherit; + white-space: normal; } + +progress { + vertical-align: baseline; } + +[type="number"]::-webkit-inner-spin-button, +[type="number"]::-webkit-outer-spin-button { + height: auto; } + +[type="search"] { + outline-offset: -2px; + -webkit-appearance: none; } + +[type="search"]::-webkit-search-decoration { + -webkit-appearance: none; } + +::-webkit-file-upload-button { + font: inherit; + -webkit-appearance: button; } + +output { + display: inline-block; } + +summary { + display: list-item; + cursor: pointer; } + +template { + display: none; } + +[hidden] { + display: none !important; } + +/*! + * Bootstrap Grid v4.4.1 (https://getbootstrap.com/) + * Copyright 2011-2019 The Bootstrap Authors + * Copyright 2011-2019 Twitter, Inc. + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) + */ +html { + box-sizing: border-box; + -ms-overflow-style: scrollbar; } + +*, +*::before, +*::after { + box-sizing: inherit; } + +.container { + width: 100%; + padding-right: 15px; + padding-left: 15px; + margin-right: auto; + margin-left: auto; } + @media (min-width: 576px) { + .container { + max-width: 566px; } } + @media (min-width: 768px) { + .container { + max-width: 740px; } } + @media (min-width: 992px) { + .container { + max-width: 960px; } } + @media (min-width: 1300px) { + .container { + max-width: 1140px; } } +.container-fluid, .container-xl, .container-lg, .container-md, .container-sm { + width: 100%; + padding-right: 15px; + padding-left: 15px; + margin-right: auto; + margin-left: auto; } + +@media (min-width: 576px) { + .container-sm, .container { + max-width: 566px; } } + +@media (min-width: 768px) { + .container-md, .container-sm, .container { + max-width: 740px; } } + +@media (min-width: 992px) { + .container-lg, .container-md, .container-sm, .container { + max-width: 960px; } } + +@media (min-width: 1300px) { + .container-xl, .container-lg, .container-md, .container-sm, .container { + max-width: 1140px; } } + +.row { + display: flex; + flex-wrap: wrap; + margin-right: -15px; + margin-left: -15px; } + +.no-gutters { + margin-right: 0; + margin-left: 0; } + .no-gutters > .col, + .no-gutters > [class*="col-"] { + padding-right: 0; + padding-left: 0; } + +.col-xl, +.col-xl-auto, .col-xl-12, .col-xl-11, .col-xl-10, .col-xl-9, .col-xl-8, .col-xl-7, .col-xl-6, .col-xl-5, .col-xl-4, .col-xl-3, .col-xl-2, .col-xl-1, .col-lg, +.col-lg-auto, .col-lg-12, .col-lg-11, .col-lg-10, .col-lg-9, .col-lg-8, .col-lg-7, .col-lg-6, .col-lg-5, .col-lg-4, .col-lg-3, .col-lg-2, .col-lg-1, .col-md, +.col-md-auto, .col-md-12, .col-md-11, .col-md-10, .col-md-9, .col-md-8, .col-md-7, .col-md-6, .col-md-5, .col-md-4, .col-md-3, .col-md-2, .col-md-1, .col-sm, +.col-sm-auto, .col-sm-12, .col-sm-11, .col-sm-10, .col-sm-9, .col-sm-8, .col-sm-7, .col-sm-6, .col-sm-5, .col-sm-4, .col-sm-3, .col-sm-2, .col-sm-1, .col, +.col-auto, .col-12, .col-11, .col-10, .col-9, .col-8, .col-7, .col-6, .col-5, .col-4, .col-3, .col-2, .col-1 { + position: relative; + width: 100%; + padding-right: 15px; + padding-left: 15px; } + +.col { + flex-basis: 0; + flex-grow: 1; + max-width: 100%; } + +.row-cols-1 > * { + flex: 0 0 100%; + max-width: 100%; } + +.row-cols-2 > * { + flex: 0 0 50%; + max-width: 50%; } + +.row-cols-3 > * { + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } + +.row-cols-4 > * { + flex: 0 0 25%; + max-width: 25%; } + +.row-cols-5 > * { + flex: 0 0 20%; + max-width: 20%; } + +.row-cols-6 > * { + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } + +.col-auto { + flex: 0 0 auto; + width: auto; + max-width: 100%; } + +.col-1 { + flex: 0 0 8.33333333%; + max-width: 8.33333333%; } + +.col-2 { + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } + +.col-3 { + flex: 0 0 25%; + max-width: 25%; } + +.col-4 { + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } + +.col-5 { + flex: 0 0 41.66666667%; + max-width: 41.66666667%; } + +.col-6 { + flex: 0 0 50%; + max-width: 50%; } + +.col-7 { + flex: 0 0 58.33333333%; + max-width: 58.33333333%; } + +.col-8 { + flex: 0 0 66.66666667%; + max-width: 66.66666667%; } + +.col-9 { + flex: 0 0 75%; + max-width: 75%; } + +.col-10 { + flex: 0 0 83.33333333%; + max-width: 83.33333333%; } + +.col-11 { + flex: 0 0 91.66666667%; + max-width: 91.66666667%; } + +.col-12 { + flex: 0 0 100%; + max-width: 100%; } + +.order-first { + order: -1; } + +.order-last { + order: 13; } + +.order-0 { + order: 0; } + +.order-1 { + order: 1; } + +.order-2 { + order: 2; } + +.order-3 { + order: 3; } + +.order-4 { + order: 4; } + +.order-5 { + order: 5; } + +.order-6 { + order: 6; } + +.order-7 { + order: 7; } + +.order-8 { + order: 8; } + +.order-9 { + order: 9; } + +.order-10 { + order: 10; } + +.order-11 { + order: 11; } + +.order-12 { + order: 12; } + +.offset-1 { + margin-left: 8.33333333%; } + +.offset-2 { + margin-left: 16.66666667%; } + +.offset-3 { + margin-left: 25%; } + +.offset-4 { + margin-left: 33.33333333%; } + +.offset-5 { + margin-left: 41.66666667%; } + +.offset-6 { + margin-left: 50%; } + +.offset-7 { + margin-left: 58.33333333%; } + +.offset-8 { + margin-left: 66.66666667%; } + +.offset-9 { + margin-left: 75%; } + +.offset-10 { + margin-left: 83.33333333%; } + +.offset-11 { + margin-left: 91.66666667%; } + +@media (min-width: 576px) { + .col-sm { + flex-basis: 0; + flex-grow: 1; + max-width: 100%; } + .row-cols-sm-1 > * { + flex: 0 0 100%; + max-width: 100%; } + .row-cols-sm-2 > * { + flex: 0 0 50%; + max-width: 50%; } + .row-cols-sm-3 > * { + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } + .row-cols-sm-4 > * { + flex: 0 0 25%; + max-width: 25%; } + .row-cols-sm-5 > * { + flex: 0 0 20%; + max-width: 20%; } + .row-cols-sm-6 > * { + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } + .col-sm-auto { + flex: 0 0 auto; + width: auto; + max-width: 100%; } + .col-sm-1 { + flex: 0 0 8.33333333%; + max-width: 8.33333333%; } + .col-sm-2 { + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } + .col-sm-3 { + flex: 0 0 25%; + max-width: 25%; } + .col-sm-4 { + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } + .col-sm-5 { + flex: 0 0 41.66666667%; + max-width: 41.66666667%; } + .col-sm-6 { + flex: 0 0 50%; + max-width: 50%; } + .col-sm-7 { + flex: 0 0 58.33333333%; + max-width: 58.33333333%; } + .col-sm-8 { + flex: 0 0 66.66666667%; + max-width: 66.66666667%; } + .col-sm-9 { + flex: 0 0 75%; + max-width: 75%; } + .col-sm-10 { + flex: 0 0 83.33333333%; + max-width: 83.33333333%; } + .col-sm-11 { + flex: 0 0 91.66666667%; + max-width: 91.66666667%; } + .col-sm-12 { + flex: 0 0 100%; + max-width: 100%; } + .order-sm-first { + order: -1; } + .order-sm-last { + order: 13; } + .order-sm-0 { + order: 0; } + .order-sm-1 { + order: 1; } + .order-sm-2 { + order: 2; } + .order-sm-3 { + order: 3; } + .order-sm-4 { + order: 4; } + .order-sm-5 { + order: 5; } + .order-sm-6 { + order: 6; } + .order-sm-7 { + order: 7; } + .order-sm-8 { + order: 8; } + .order-sm-9 { + order: 9; } + .order-sm-10 { + order: 10; } + .order-sm-11 { + order: 11; } + .order-sm-12 { + order: 12; } + .offset-sm-0 { + margin-left: 0; } + .offset-sm-1 { + margin-left: 8.33333333%; } + .offset-sm-2 { + margin-left: 16.66666667%; } + .offset-sm-3 { + margin-left: 25%; } + .offset-sm-4 { + margin-left: 33.33333333%; } + .offset-sm-5 { + margin-left: 41.66666667%; } + .offset-sm-6 { + margin-left: 50%; } + .offset-sm-7 { + margin-left: 58.33333333%; } + .offset-sm-8 { + margin-left: 66.66666667%; } + .offset-sm-9 { + margin-left: 75%; } + .offset-sm-10 { + margin-left: 83.33333333%; } + .offset-sm-11 { + margin-left: 91.66666667%; } } + +@media (min-width: 768px) { + .col-md { + flex-basis: 0; + flex-grow: 1; + max-width: 100%; } + .row-cols-md-1 > * { + flex: 0 0 100%; + max-width: 100%; } + .row-cols-md-2 > * { + flex: 0 0 50%; + max-width: 50%; } + .row-cols-md-3 > * { + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } + .row-cols-md-4 > * { + flex: 0 0 25%; + max-width: 25%; } + .row-cols-md-5 > * { + flex: 0 0 20%; + max-width: 20%; } + .row-cols-md-6 > * { + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } + .col-md-auto { + flex: 0 0 auto; + width: auto; + max-width: 100%; } + .col-md-1 { + flex: 0 0 8.33333333%; + max-width: 8.33333333%; } + .col-md-2 { + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } + .col-md-3 { + flex: 0 0 25%; + max-width: 25%; } + .col-md-4 { + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } + .col-md-5 { + flex: 0 0 41.66666667%; + max-width: 41.66666667%; } + .col-md-6 { + flex: 0 0 50%; + max-width: 50%; } + .col-md-7 { + flex: 0 0 58.33333333%; + max-width: 58.33333333%; } + .col-md-8 { + flex: 0 0 66.66666667%; + max-width: 66.66666667%; } + .col-md-9 { + flex: 0 0 75%; + max-width: 75%; } + .col-md-10 { + flex: 0 0 83.33333333%; + max-width: 83.33333333%; } + .col-md-11 { + flex: 0 0 91.66666667%; + max-width: 91.66666667%; } + .col-md-12 { + flex: 0 0 100%; + max-width: 100%; } + .order-md-first { + order: -1; } + .order-md-last { + order: 13; } + .order-md-0 { + order: 0; } + .order-md-1 { + order: 1; } + .order-md-2 { + order: 2; } + .order-md-3 { + order: 3; } + .order-md-4 { + order: 4; } + .order-md-5 { + order: 5; } + .order-md-6 { + order: 6; } + .order-md-7 { + order: 7; } + .order-md-8 { + order: 8; } + .order-md-9 { + order: 9; } + .order-md-10 { + order: 10; } + .order-md-11 { + order: 11; } + .order-md-12 { + order: 12; } + .offset-md-0 { + margin-left: 0; } + .offset-md-1 { + margin-left: 8.33333333%; } + .offset-md-2 { + margin-left: 16.66666667%; } + .offset-md-3 { + margin-left: 25%; } + .offset-md-4 { + margin-left: 33.33333333%; } + .offset-md-5 { + margin-left: 41.66666667%; } + .offset-md-6 { + margin-left: 50%; } + .offset-md-7 { + margin-left: 58.33333333%; } + .offset-md-8 { + margin-left: 66.66666667%; } + .offset-md-9 { + margin-left: 75%; } + .offset-md-10 { + margin-left: 83.33333333%; } + .offset-md-11 { + margin-left: 91.66666667%; } } + +@media (min-width: 992px) { + .col-lg { + flex-basis: 0; + flex-grow: 1; + max-width: 100%; } + .row-cols-lg-1 > * { + flex: 0 0 100%; + max-width: 100%; } + .row-cols-lg-2 > * { + flex: 0 0 50%; + max-width: 50%; } + .row-cols-lg-3 > * { + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } + .row-cols-lg-4 > * { + flex: 0 0 25%; + max-width: 25%; } + .row-cols-lg-5 > * { + flex: 0 0 20%; + max-width: 20%; } + .row-cols-lg-6 > * { + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } + .col-lg-auto { + flex: 0 0 auto; + width: auto; + max-width: 100%; } + .col-lg-1 { + flex: 0 0 8.33333333%; + max-width: 8.33333333%; } + .col-lg-2 { + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } + .col-lg-3 { + flex: 0 0 25%; + max-width: 25%; } + .col-lg-4 { + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } + .col-lg-5 { + flex: 0 0 41.66666667%; + max-width: 41.66666667%; } + .col-lg-6 { + flex: 0 0 50%; + max-width: 50%; } + .col-lg-7 { + flex: 0 0 58.33333333%; + max-width: 58.33333333%; } + .col-lg-8 { + flex: 0 0 66.66666667%; + max-width: 66.66666667%; } + .col-lg-9 { + flex: 0 0 75%; + max-width: 75%; } + .col-lg-10 { + flex: 0 0 83.33333333%; + max-width: 83.33333333%; } + .col-lg-11 { + flex: 0 0 91.66666667%; + max-width: 91.66666667%; } + .col-lg-12 { + flex: 0 0 100%; + max-width: 100%; } + .order-lg-first { + order: -1; } + .order-lg-last { + order: 13; } + .order-lg-0 { + order: 0; } + .order-lg-1 { + order: 1; } + .order-lg-2 { + order: 2; } + .order-lg-3 { + order: 3; } + .order-lg-4 { + order: 4; } + .order-lg-5 { + order: 5; } + .order-lg-6 { + order: 6; } + .order-lg-7 { + order: 7; } + .order-lg-8 { + order: 8; } + .order-lg-9 { + order: 9; } + .order-lg-10 { + order: 10; } + .order-lg-11 { + order: 11; } + .order-lg-12 { + order: 12; } + .offset-lg-0 { + margin-left: 0; } + .offset-lg-1 { + margin-left: 8.33333333%; } + .offset-lg-2 { + margin-left: 16.66666667%; } + .offset-lg-3 { + margin-left: 25%; } + .offset-lg-4 { + margin-left: 33.33333333%; } + .offset-lg-5 { + margin-left: 41.66666667%; } + .offset-lg-6 { + margin-left: 50%; } + .offset-lg-7 { + margin-left: 58.33333333%; } + .offset-lg-8 { + margin-left: 66.66666667%; } + .offset-lg-9 { + margin-left: 75%; } + .offset-lg-10 { + margin-left: 83.33333333%; } + .offset-lg-11 { + margin-left: 91.66666667%; } } + +@media (min-width: 1300px) { + .col-xl { + flex-basis: 0; + flex-grow: 1; + max-width: 100%; } + .row-cols-xl-1 > * { + flex: 0 0 100%; + max-width: 100%; } + .row-cols-xl-2 > * { + flex: 0 0 50%; + max-width: 50%; } + .row-cols-xl-3 > * { + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } + .row-cols-xl-4 > * { + flex: 0 0 25%; + max-width: 25%; } + .row-cols-xl-5 > * { + flex: 0 0 20%; + max-width: 20%; } + .row-cols-xl-6 > * { + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } + .col-xl-auto { + flex: 0 0 auto; + width: auto; + max-width: 100%; } + .col-xl-1 { + flex: 0 0 8.33333333%; + max-width: 8.33333333%; } + .col-xl-2 { + flex: 0 0 16.66666667%; + max-width: 16.66666667%; } + .col-xl-3 { + flex: 0 0 25%; + max-width: 25%; } + .col-xl-4 { + flex: 0 0 33.33333333%; + max-width: 33.33333333%; } + .col-xl-5 { + flex: 0 0 41.66666667%; + max-width: 41.66666667%; } + .col-xl-6 { + flex: 0 0 50%; + max-width: 50%; } + .col-xl-7 { + flex: 0 0 58.33333333%; + max-width: 58.33333333%; } + .col-xl-8 { + flex: 0 0 66.66666667%; + max-width: 66.66666667%; } + .col-xl-9 { + flex: 0 0 75%; + max-width: 75%; } + .col-xl-10 { + flex: 0 0 83.33333333%; + max-width: 83.33333333%; } + .col-xl-11 { + flex: 0 0 91.66666667%; + max-width: 91.66666667%; } + .col-xl-12 { + flex: 0 0 100%; + max-width: 100%; } + .order-xl-first { + order: -1; } + .order-xl-last { + order: 13; } + .order-xl-0 { + order: 0; } + .order-xl-1 { + order: 1; } + .order-xl-2 { + order: 2; } + .order-xl-3 { + order: 3; } + .order-xl-4 { + order: 4; } + .order-xl-5 { + order: 5; } + .order-xl-6 { + order: 6; } + .order-xl-7 { + order: 7; } + .order-xl-8 { + order: 8; } + .order-xl-9 { + order: 9; } + .order-xl-10 { + order: 10; } + .order-xl-11 { + order: 11; } + .order-xl-12 { + order: 12; } + .offset-xl-0 { + margin-left: 0; } + .offset-xl-1 { + margin-left: 8.33333333%; } + .offset-xl-2 { + margin-left: 16.66666667%; } + .offset-xl-3 { + margin-left: 25%; } + .offset-xl-4 { + margin-left: 33.33333333%; } + .offset-xl-5 { + margin-left: 41.66666667%; } + .offset-xl-6 { + margin-left: 50%; } + .offset-xl-7 { + margin-left: 58.33333333%; } + .offset-xl-8 { + margin-left: 66.66666667%; } + .offset-xl-9 { + margin-left: 75%; } + .offset-xl-10 { + margin-left: 83.33333333%; } + .offset-xl-11 { + margin-left: 91.66666667%; } } + +.d-none { + display: none !important; } + +.d-inline { + display: inline !important; } + +.d-inline-block { + display: inline-block !important; } + +.d-block { + display: block !important; } + +.d-table { + display: table !important; } + +.d-table-row { + display: table-row !important; } + +.d-table-cell { + display: table-cell !important; } + +.d-flex { + display: flex !important; } + +.d-inline-flex { + display: inline-flex !important; } + +@media (min-width: 576px) { + .d-sm-none { + display: none !important; } + .d-sm-inline { + display: inline !important; } + .d-sm-inline-block { + display: inline-block !important; } + .d-sm-block { + display: block !important; } + .d-sm-table { + display: table !important; } + .d-sm-table-row { + display: table-row !important; } + .d-sm-table-cell { + display: table-cell !important; } + .d-sm-flex { + display: flex !important; } + .d-sm-inline-flex { + display: inline-flex !important; } } + +@media (min-width: 768px) { + .d-md-none { + display: none !important; } + .d-md-inline { + display: inline !important; } + .d-md-inline-block { + display: inline-block !important; } + .d-md-block { + display: block !important; } + .d-md-table { + display: table !important; } + .d-md-table-row { + display: table-row !important; } + .d-md-table-cell { + display: table-cell !important; } + .d-md-flex { + display: flex !important; } + .d-md-inline-flex { + display: inline-flex !important; } } + +@media (min-width: 992px) { + .d-lg-none { + display: none !important; } + .d-lg-inline { + display: inline !important; } + .d-lg-inline-block { + display: inline-block !important; } + .d-lg-block { + display: block !important; } + .d-lg-table { + display: table !important; } + .d-lg-table-row { + display: table-row !important; } + .d-lg-table-cell { + display: table-cell !important; } + .d-lg-flex { + display: flex !important; } + .d-lg-inline-flex { + display: inline-flex !important; } } + +@media (min-width: 1300px) { + .d-xl-none { + display: none !important; } + .d-xl-inline { + display: inline !important; } + .d-xl-inline-block { + display: inline-block !important; } + .d-xl-block { + display: block !important; } + .d-xl-table { + display: table !important; } + .d-xl-table-row { + display: table-row !important; } + .d-xl-table-cell { + display: table-cell !important; } + .d-xl-flex { + display: flex !important; } + .d-xl-inline-flex { + display: inline-flex !important; } } + +@media print { + .d-print-none { + display: none !important; } + .d-print-inline { + display: inline !important; } + .d-print-inline-block { + display: inline-block !important; } + .d-print-block { + display: block !important; } + .d-print-table { + display: table !important; } + .d-print-table-row { + display: table-row !important; } + .d-print-table-cell { + display: table-cell !important; } + .d-print-flex { + display: flex !important; } + .d-print-inline-flex { + display: inline-flex !important; } } + +.flex-row { + flex-direction: row !important; } + +.flex-column { + flex-direction: column !important; } + +.flex-row-reverse { + flex-direction: row-reverse !important; } + +.flex-column-reverse { + flex-direction: column-reverse !important; } + +.flex-wrap { + flex-wrap: wrap !important; } + +.flex-nowrap { + flex-wrap: nowrap !important; } + +.flex-wrap-reverse { + flex-wrap: wrap-reverse !important; } + +.flex-fill { + flex: 1 1 auto !important; } + +.flex-grow-0 { + flex-grow: 0 !important; } + +.flex-grow-1 { + flex-grow: 1 !important; } + +.flex-shrink-0 { + flex-shrink: 0 !important; } + +.flex-shrink-1 { + flex-shrink: 1 !important; } + +.justify-content-start { + justify-content: flex-start !important; } + +.justify-content-end { + justify-content: flex-end !important; } + +.justify-content-center { + justify-content: center !important; } + +.justify-content-between { + justify-content: space-between !important; } + +.justify-content-around { + justify-content: space-around !important; } + +.align-items-start { + align-items: flex-start !important; } + +.align-items-end { + align-items: flex-end !important; } + +.align-items-center { + align-items: center !important; } + +.align-items-baseline { + align-items: baseline !important; } + +.align-items-stretch { + align-items: stretch !important; } + +.align-content-start { + align-content: flex-start !important; } + +.align-content-end { + align-content: flex-end !important; } + +.align-content-center { + align-content: center !important; } + +.align-content-between { + align-content: space-between !important; } + +.align-content-around { + align-content: space-around !important; } + +.align-content-stretch { + align-content: stretch !important; } + +.align-self-auto { + align-self: auto !important; } + +.align-self-start { + align-self: flex-start !important; } + +.align-self-end { + align-self: flex-end !important; } + +.align-self-center { + align-self: center !important; } + +.align-self-baseline { + align-self: baseline !important; } + +.align-self-stretch { + align-self: stretch !important; } + +@media (min-width: 576px) { + .flex-sm-row { + flex-direction: row !important; } + .flex-sm-column { + flex-direction: column !important; } + .flex-sm-row-reverse { + flex-direction: row-reverse !important; } + .flex-sm-column-reverse { + flex-direction: column-reverse !important; } + .flex-sm-wrap { + flex-wrap: wrap !important; } + .flex-sm-nowrap { + flex-wrap: nowrap !important; } + .flex-sm-wrap-reverse { + flex-wrap: wrap-reverse !important; } + .flex-sm-fill { + flex: 1 1 auto !important; } + .flex-sm-grow-0 { + flex-grow: 0 !important; } + .flex-sm-grow-1 { + flex-grow: 1 !important; } + .flex-sm-shrink-0 { + flex-shrink: 0 !important; } + .flex-sm-shrink-1 { + flex-shrink: 1 !important; } + .justify-content-sm-start { + justify-content: flex-start !important; } + .justify-content-sm-end { + justify-content: flex-end !important; } + .justify-content-sm-center { + justify-content: center !important; } + .justify-content-sm-between { + justify-content: space-between !important; } + .justify-content-sm-around { + justify-content: space-around !important; } + .align-items-sm-start { + align-items: flex-start !important; } + .align-items-sm-end { + align-items: flex-end !important; } + .align-items-sm-center { + align-items: center !important; } + .align-items-sm-baseline { + align-items: baseline !important; } + .align-items-sm-stretch { + align-items: stretch !important; } + .align-content-sm-start { + align-content: flex-start !important; } + .align-content-sm-end { + align-content: flex-end !important; } + .align-content-sm-center { + align-content: center !important; } + .align-content-sm-between { + align-content: space-between !important; } + .align-content-sm-around { + align-content: space-around !important; } + .align-content-sm-stretch { + align-content: stretch !important; } + .align-self-sm-auto { + align-self: auto !important; } + .align-self-sm-start { + align-self: flex-start !important; } + .align-self-sm-end { + align-self: flex-end !important; } + .align-self-sm-center { + align-self: center !important; } + .align-self-sm-baseline { + align-self: baseline !important; } + .align-self-sm-stretch { + align-self: stretch !important; } } + +@media (min-width: 768px) { + .flex-md-row { + flex-direction: row !important; } + .flex-md-column { + flex-direction: column !important; } + .flex-md-row-reverse { + flex-direction: row-reverse !important; } + .flex-md-column-reverse { + flex-direction: column-reverse !important; } + .flex-md-wrap { + flex-wrap: wrap !important; } + .flex-md-nowrap { + flex-wrap: nowrap !important; } + .flex-md-wrap-reverse { + flex-wrap: wrap-reverse !important; } + .flex-md-fill { + flex: 1 1 auto !important; } + .flex-md-grow-0 { + flex-grow: 0 !important; } + .flex-md-grow-1 { + flex-grow: 1 !important; } + .flex-md-shrink-0 { + flex-shrink: 0 !important; } + .flex-md-shrink-1 { + flex-shrink: 1 !important; } + .justify-content-md-start { + justify-content: flex-start !important; } + .justify-content-md-end { + justify-content: flex-end !important; } + .justify-content-md-center { + justify-content: center !important; } + .justify-content-md-between { + justify-content: space-between !important; } + .justify-content-md-around { + justify-content: space-around !important; } + .align-items-md-start { + align-items: flex-start !important; } + .align-items-md-end { + align-items: flex-end !important; } + .align-items-md-center { + align-items: center !important; } + .align-items-md-baseline { + align-items: baseline !important; } + .align-items-md-stretch { + align-items: stretch !important; } + .align-content-md-start { + align-content: flex-start !important; } + .align-content-md-end { + align-content: flex-end !important; } + .align-content-md-center { + align-content: center !important; } + .align-content-md-between { + align-content: space-between !important; } + .align-content-md-around { + align-content: space-around !important; } + .align-content-md-stretch { + align-content: stretch !important; } + .align-self-md-auto { + align-self: auto !important; } + .align-self-md-start { + align-self: flex-start !important; } + .align-self-md-end { + align-self: flex-end !important; } + .align-self-md-center { + align-self: center !important; } + .align-self-md-baseline { + align-self: baseline !important; } + .align-self-md-stretch { + align-self: stretch !important; } } + +@media (min-width: 992px) { + .flex-lg-row { + flex-direction: row !important; } + .flex-lg-column { + flex-direction: column !important; } + .flex-lg-row-reverse { + flex-direction: row-reverse !important; } + .flex-lg-column-reverse { + flex-direction: column-reverse !important; } + .flex-lg-wrap { + flex-wrap: wrap !important; } + .flex-lg-nowrap { + flex-wrap: nowrap !important; } + .flex-lg-wrap-reverse { + flex-wrap: wrap-reverse !important; } + .flex-lg-fill { + flex: 1 1 auto !important; } + .flex-lg-grow-0 { + flex-grow: 0 !important; } + .flex-lg-grow-1 { + flex-grow: 1 !important; } + .flex-lg-shrink-0 { + flex-shrink: 0 !important; } + .flex-lg-shrink-1 { + flex-shrink: 1 !important; } + .justify-content-lg-start { + justify-content: flex-start !important; } + .justify-content-lg-end { + justify-content: flex-end !important; } + .justify-content-lg-center { + justify-content: center !important; } + .justify-content-lg-between { + justify-content: space-between !important; } + .justify-content-lg-around { + justify-content: space-around !important; } + .align-items-lg-start { + align-items: flex-start !important; } + .align-items-lg-end { + align-items: flex-end !important; } + .align-items-lg-center { + align-items: center !important; } + .align-items-lg-baseline { + align-items: baseline !important; } + .align-items-lg-stretch { + align-items: stretch !important; } + .align-content-lg-start { + align-content: flex-start !important; } + .align-content-lg-end { + align-content: flex-end !important; } + .align-content-lg-center { + align-content: center !important; } + .align-content-lg-between { + align-content: space-between !important; } + .align-content-lg-around { + align-content: space-around !important; } + .align-content-lg-stretch { + align-content: stretch !important; } + .align-self-lg-auto { + align-self: auto !important; } + .align-self-lg-start { + align-self: flex-start !important; } + .align-self-lg-end { + align-self: flex-end !important; } + .align-self-lg-center { + align-self: center !important; } + .align-self-lg-baseline { + align-self: baseline !important; } + .align-self-lg-stretch { + align-self: stretch !important; } } + +@media (min-width: 1300px) { + .flex-xl-row { + flex-direction: row !important; } + .flex-xl-column { + flex-direction: column !important; } + .flex-xl-row-reverse { + flex-direction: row-reverse !important; } + .flex-xl-column-reverse { + flex-direction: column-reverse !important; } + .flex-xl-wrap { + flex-wrap: wrap !important; } + .flex-xl-nowrap { + flex-wrap: nowrap !important; } + .flex-xl-wrap-reverse { + flex-wrap: wrap-reverse !important; } + .flex-xl-fill { + flex: 1 1 auto !important; } + .flex-xl-grow-0 { + flex-grow: 0 !important; } + .flex-xl-grow-1 { + flex-grow: 1 !important; } + .flex-xl-shrink-0 { + flex-shrink: 0 !important; } + .flex-xl-shrink-1 { + flex-shrink: 1 !important; } + .justify-content-xl-start { + justify-content: flex-start !important; } + .justify-content-xl-end { + justify-content: flex-end !important; } + .justify-content-xl-center { + justify-content: center !important; } + .justify-content-xl-between { + justify-content: space-between !important; } + .justify-content-xl-around { + justify-content: space-around !important; } + .align-items-xl-start { + align-items: flex-start !important; } + .align-items-xl-end { + align-items: flex-end !important; } + .align-items-xl-center { + align-items: center !important; } + .align-items-xl-baseline { + align-items: baseline !important; } + .align-items-xl-stretch { + align-items: stretch !important; } + .align-content-xl-start { + align-content: flex-start !important; } + .align-content-xl-end { + align-content: flex-end !important; } + .align-content-xl-center { + align-content: center !important; } + .align-content-xl-between { + align-content: space-between !important; } + .align-content-xl-around { + align-content: space-around !important; } + .align-content-xl-stretch { + align-content: stretch !important; } + .align-self-xl-auto { + align-self: auto !important; } + .align-self-xl-start { + align-self: flex-start !important; } + .align-self-xl-end { + align-self: flex-end !important; } + .align-self-xl-center { + align-self: center !important; } + .align-self-xl-baseline { + align-self: baseline !important; } + .align-self-xl-stretch { + align-self: stretch !important; } } + +.m-0 { + margin: 0 !important; } + +.mt-0, +.my-0 { + margin-top: 0 !important; } + +.mr-0, +.mx-0 { + margin-right: 0 !important; } + +.mb-0, +.my-0 { + margin-bottom: 0 !important; } + +.ml-0, +.mx-0 { + margin-left: 0 !important; } + +.m-1 { + margin: 10px !important; } + +.mt-1, +.my-1 { + margin-top: 10px !important; } + +.mr-1, +.mx-1 { + margin-right: 10px !important; } + +.mb-1, +.my-1 { + margin-bottom: 10px !important; } + +.ml-1, +.mx-1 { + margin-left: 10px !important; } + +.m-2 { + margin: 20px !important; } + +.mt-2, +.my-2 { + margin-top: 20px !important; } + +.mr-2, +.mx-2 { + margin-right: 20px !important; } + +.mb-2, +.my-2 { + margin-bottom: 20px !important; } + +.ml-2, +.mx-2 { + margin-left: 20px !important; } + +.m-3 { + margin: 30px !important; } + +.mt-3, +.my-3 { + margin-top: 30px !important; } + +.mr-3, +.mx-3 { + margin-right: 30px !important; } + +.mb-3, +.my-3 { + margin-bottom: 30px !important; } + +.ml-3, +.mx-3 { + margin-left: 30px !important; } + +.m-4 { + margin: 40px !important; } + +.mt-4, +.my-4 { + margin-top: 40px !important; } + +.mr-4, +.mx-4 { + margin-right: 40px !important; } + +.mb-4, +.my-4 { + margin-bottom: 40px !important; } + +.ml-4, +.mx-4 { + margin-left: 40px !important; } + +.m-5 { + margin: 50px !important; } + +.mt-5, +.my-5 { + margin-top: 50px !important; } + +.mr-5, +.mx-5 { + margin-right: 50px !important; } + +.mb-5, +.my-5 { + margin-bottom: 50px !important; } + +.ml-5, +.mx-5 { + margin-left: 50px !important; } + +.m-6 { + margin: 60px !important; } + +.mt-6, +.my-6 { + margin-top: 60px !important; } + +.mr-6, +.mx-6 { + margin-right: 60px !important; } + +.mb-6, +.my-6 { + margin-bottom: 60px !important; } + +.ml-6, +.mx-6 { + margin-left: 60px !important; } + +.m-7 { + margin: 70px !important; } + +.mt-7, +.my-7 { + margin-top: 70px !important; } + +.mr-7, +.mx-7 { + margin-right: 70px !important; } + +.mb-7, +.my-7 { + margin-bottom: 70px !important; } + +.ml-7, +.mx-7 { + margin-left: 70px !important; } + +.m-8 { + margin: 80px !important; } + +.mt-8, +.my-8 { + margin-top: 80px !important; } + +.mr-8, +.mx-8 { + margin-right: 80px !important; } + +.mb-8, +.my-8 { + margin-bottom: 80px !important; } + +.ml-8, +.mx-8 { + margin-left: 80px !important; } + +.m-9 { + margin: 90px !important; } + +.mt-9, +.my-9 { + margin-top: 90px !important; } + +.mr-9, +.mx-9 { + margin-right: 90px !important; } + +.mb-9, +.my-9 { + margin-bottom: 90px !important; } + +.ml-9, +.mx-9 { + margin-left: 90px !important; } + +.m-10 { + margin: 100px !important; } + +.mt-10, +.my-10 { + margin-top: 100px !important; } + +.mr-10, +.mx-10 { + margin-right: 100px !important; } + +.mb-10, +.my-10 { + margin-bottom: 100px !important; } + +.ml-10, +.mx-10 { + margin-left: 100px !important; } + +.p-0 { + padding: 0 !important; } + +.pt-0, +.py-0 { + padding-top: 0 !important; } + +.pr-0, +.px-0 { + padding-right: 0 !important; } + +.pb-0, +.py-0 { + padding-bottom: 0 !important; } + +.pl-0, +.px-0 { + padding-left: 0 !important; } + +.p-1 { + padding: 10px !important; } + +.pt-1, +.py-1 { + padding-top: 10px !important; } + +.pr-1, +.px-1 { + padding-right: 10px !important; } + +.pb-1, +.py-1 { + padding-bottom: 10px !important; } + +.pl-1, +.px-1 { + padding-left: 10px !important; } + +.p-2 { + padding: 20px !important; } + +.pt-2, +.py-2 { + padding-top: 20px !important; } + +.pr-2, +.px-2 { + padding-right: 20px !important; } + +.pb-2, +.py-2 { + padding-bottom: 20px !important; } + +.pl-2, +.px-2 { + padding-left: 20px !important; } + +.p-3 { + padding: 30px !important; } + +.pt-3, +.py-3 { + padding-top: 30px !important; } + +.pr-3, +.px-3 { + padding-right: 30px !important; } + +.pb-3, +.py-3 { + padding-bottom: 30px !important; } + +.pl-3, +.px-3 { + padding-left: 30px !important; } + +.p-4 { + padding: 40px !important; } + +.pt-4, +.py-4 { + padding-top: 40px !important; } + +.pr-4, +.px-4 { + padding-right: 40px !important; } + +.pb-4, +.py-4 { + padding-bottom: 40px !important; } + +.pl-4, +.px-4 { + padding-left: 40px !important; } + +.p-5 { + padding: 50px !important; } + +.pt-5, +.py-5 { + padding-top: 50px !important; } + +.pr-5, +.px-5 { + padding-right: 50px !important; } + +.pb-5, +.py-5 { + padding-bottom: 50px !important; } + +.pl-5, +.px-5 { + padding-left: 50px !important; } + +.p-6 { + padding: 60px !important; } + +.pt-6, +.py-6 { + padding-top: 60px !important; } + +.pr-6, +.px-6 { + padding-right: 60px !important; } + +.pb-6, +.py-6 { + padding-bottom: 60px !important; } + +.pl-6, +.px-6 { + padding-left: 60px !important; } + +.p-7 { + padding: 70px !important; } + +.pt-7, +.py-7 { + padding-top: 70px !important; } + +.pr-7, +.px-7 { + padding-right: 70px !important; } + +.pb-7, +.py-7 { + padding-bottom: 70px !important; } + +.pl-7, +.px-7 { + padding-left: 70px !important; } + +.p-8 { + padding: 80px !important; } + +.pt-8, +.py-8 { + padding-top: 80px !important; } + +.pr-8, +.px-8 { + padding-right: 80px !important; } + +.pb-8, +.py-8 { + padding-bottom: 80px !important; } + +.pl-8, +.px-8 { + padding-left: 80px !important; } + +.p-9 { + padding: 90px !important; } + +.pt-9, +.py-9 { + padding-top: 90px !important; } + +.pr-9, +.px-9 { + padding-right: 90px !important; } + +.pb-9, +.py-9 { + padding-bottom: 90px !important; } + +.pl-9, +.px-9 { + padding-left: 90px !important; } + +.p-10 { + padding: 100px !important; } + +.pt-10, +.py-10 { + padding-top: 100px !important; } + +.pr-10, +.px-10 { + padding-right: 100px !important; } + +.pb-10, +.py-10 { + padding-bottom: 100px !important; } + +.pl-10, +.px-10 { + padding-left: 100px !important; } + +.m-n1 { + margin: -10px !important; } + +.mt-n1, +.my-n1 { + margin-top: -10px !important; } + +.mr-n1, +.mx-n1 { + margin-right: -10px !important; } + +.mb-n1, +.my-n1 { + margin-bottom: -10px !important; } + +.ml-n1, +.mx-n1 { + margin-left: -10px !important; } + +.m-n2 { + margin: -20px !important; } + +.mt-n2, +.my-n2 { + margin-top: -20px !important; } + +.mr-n2, +.mx-n2 { + margin-right: -20px !important; } + +.mb-n2, +.my-n2 { + margin-bottom: -20px !important; } + +.ml-n2, +.mx-n2 { + margin-left: -20px !important; } + +.m-n3 { + margin: -30px !important; } + +.mt-n3, +.my-n3 { + margin-top: -30px !important; } + +.mr-n3, +.mx-n3 { + margin-right: -30px !important; } + +.mb-n3, +.my-n3 { + margin-bottom: -30px !important; } + +.ml-n3, +.mx-n3 { + margin-left: -30px !important; } + +.m-n4 { + margin: -40px !important; } + +.mt-n4, +.my-n4 { + margin-top: -40px !important; } + +.mr-n4, +.mx-n4 { + margin-right: -40px !important; } + +.mb-n4, +.my-n4 { + margin-bottom: -40px !important; } + +.ml-n4, +.mx-n4 { + margin-left: -40px !important; } + +.m-n5 { + margin: -50px !important; } + +.mt-n5, +.my-n5 { + margin-top: -50px !important; } + +.mr-n5, +.mx-n5 { + margin-right: -50px !important; } + +.mb-n5, +.my-n5 { + margin-bottom: -50px !important; } + +.ml-n5, +.mx-n5 { + margin-left: -50px !important; } + +.m-n6 { + margin: -60px !important; } + +.mt-n6, +.my-n6 { + margin-top: -60px !important; } + +.mr-n6, +.mx-n6 { + margin-right: -60px !important; } + +.mb-n6, +.my-n6 { + margin-bottom: -60px !important; } + +.ml-n6, +.mx-n6 { + margin-left: -60px !important; } + +.m-n7 { + margin: -70px !important; } + +.mt-n7, +.my-n7 { + margin-top: -70px !important; } + +.mr-n7, +.mx-n7 { + margin-right: -70px !important; } + +.mb-n7, +.my-n7 { + margin-bottom: -70px !important; } + +.ml-n7, +.mx-n7 { + margin-left: -70px !important; } + +.m-n8 { + margin: -80px !important; } + +.mt-n8, +.my-n8 { + margin-top: -80px !important; } + +.mr-n8, +.mx-n8 { + margin-right: -80px !important; } + +.mb-n8, +.my-n8 { + margin-bottom: -80px !important; } + +.ml-n8, +.mx-n8 { + margin-left: -80px !important; } + +.m-n9 { + margin: -90px !important; } + +.mt-n9, +.my-n9 { + margin-top: -90px !important; } + +.mr-n9, +.mx-n9 { + margin-right: -90px !important; } + +.mb-n9, +.my-n9 { + margin-bottom: -90px !important; } + +.ml-n9, +.mx-n9 { + margin-left: -90px !important; } + +.m-n10 { + margin: -100px !important; } + +.mt-n10, +.my-n10 { + margin-top: -100px !important; } + +.mr-n10, +.mx-n10 { + margin-right: -100px !important; } + +.mb-n10, +.my-n10 { + margin-bottom: -100px !important; } + +.ml-n10, +.mx-n10 { + margin-left: -100px !important; } + +.m-auto { + margin: auto !important; } + +.mt-auto, +.my-auto { + margin-top: auto !important; } + +.mr-auto, +.mx-auto { + margin-right: auto !important; } + +.mb-auto, +.my-auto { + margin-bottom: auto !important; } + +.ml-auto, +.mx-auto { + margin-left: auto !important; } + +@media (min-width: 576px) { + .m-sm-0 { + margin: 0 !important; } + .mt-sm-0, + .my-sm-0 { + margin-top: 0 !important; } + .mr-sm-0, + .mx-sm-0 { + margin-right: 0 !important; } + .mb-sm-0, + .my-sm-0 { + margin-bottom: 0 !important; } + .ml-sm-0, + .mx-sm-0 { + margin-left: 0 !important; } + .m-sm-1 { + margin: 10px !important; } + .mt-sm-1, + .my-sm-1 { + margin-top: 10px !important; } + .mr-sm-1, + .mx-sm-1 { + margin-right: 10px !important; } + .mb-sm-1, + .my-sm-1 { + margin-bottom: 10px !important; } + .ml-sm-1, + .mx-sm-1 { + margin-left: 10px !important; } + .m-sm-2 { + margin: 20px !important; } + .mt-sm-2, + .my-sm-2 { + margin-top: 20px !important; } + .mr-sm-2, + .mx-sm-2 { + margin-right: 20px !important; } + .mb-sm-2, + .my-sm-2 { + margin-bottom: 20px !important; } + .ml-sm-2, + .mx-sm-2 { + margin-left: 20px !important; } + .m-sm-3 { + margin: 30px !important; } + .mt-sm-3, + .my-sm-3 { + margin-top: 30px !important; } + .mr-sm-3, + .mx-sm-3 { + margin-right: 30px !important; } + .mb-sm-3, + .my-sm-3 { + margin-bottom: 30px !important; } + .ml-sm-3, + .mx-sm-3 { + margin-left: 30px !important; } + .m-sm-4 { + margin: 40px !important; } + .mt-sm-4, + .my-sm-4 { + margin-top: 40px !important; } + .mr-sm-4, + .mx-sm-4 { + margin-right: 40px !important; } + .mb-sm-4, + .my-sm-4 { + margin-bottom: 40px !important; } + .ml-sm-4, + .mx-sm-4 { + margin-left: 40px !important; } + .m-sm-5 { + margin: 50px !important; } + .mt-sm-5, + .my-sm-5 { + margin-top: 50px !important; } + .mr-sm-5, + .mx-sm-5 { + margin-right: 50px !important; } + .mb-sm-5, + .my-sm-5 { + margin-bottom: 50px !important; } + .ml-sm-5, + .mx-sm-5 { + margin-left: 50px !important; } + .m-sm-6 { + margin: 60px !important; } + .mt-sm-6, + .my-sm-6 { + margin-top: 60px !important; } + .mr-sm-6, + .mx-sm-6 { + margin-right: 60px !important; } + .mb-sm-6, + .my-sm-6 { + margin-bottom: 60px !important; } + .ml-sm-6, + .mx-sm-6 { + margin-left: 60px !important; } + .m-sm-7 { + margin: 70px !important; } + .mt-sm-7, + .my-sm-7 { + margin-top: 70px !important; } + .mr-sm-7, + .mx-sm-7 { + margin-right: 70px !important; } + .mb-sm-7, + .my-sm-7 { + margin-bottom: 70px !important; } + .ml-sm-7, + .mx-sm-7 { + margin-left: 70px !important; } + .m-sm-8 { + margin: 80px !important; } + .mt-sm-8, + .my-sm-8 { + margin-top: 80px !important; } + .mr-sm-8, + .mx-sm-8 { + margin-right: 80px !important; } + .mb-sm-8, + .my-sm-8 { + margin-bottom: 80px !important; } + .ml-sm-8, + .mx-sm-8 { + margin-left: 80px !important; } + .m-sm-9 { + margin: 90px !important; } + .mt-sm-9, + .my-sm-9 { + margin-top: 90px !important; } + .mr-sm-9, + .mx-sm-9 { + margin-right: 90px !important; } + .mb-sm-9, + .my-sm-9 { + margin-bottom: 90px !important; } + .ml-sm-9, + .mx-sm-9 { + margin-left: 90px !important; } + .m-sm-10 { + margin: 100px !important; } + .mt-sm-10, + .my-sm-10 { + margin-top: 100px !important; } + .mr-sm-10, + .mx-sm-10 { + margin-right: 100px !important; } + .mb-sm-10, + .my-sm-10 { + margin-bottom: 100px !important; } + .ml-sm-10, + .mx-sm-10 { + margin-left: 100px !important; } + .p-sm-0 { + padding: 0 !important; } + .pt-sm-0, + .py-sm-0 { + padding-top: 0 !important; } + .pr-sm-0, + .px-sm-0 { + padding-right: 0 !important; } + .pb-sm-0, + .py-sm-0 { + padding-bottom: 0 !important; } + .pl-sm-0, + .px-sm-0 { + padding-left: 0 !important; } + .p-sm-1 { + padding: 10px !important; } + .pt-sm-1, + .py-sm-1 { + padding-top: 10px !important; } + .pr-sm-1, + .px-sm-1 { + padding-right: 10px !important; } + .pb-sm-1, + .py-sm-1 { + padding-bottom: 10px !important; } + .pl-sm-1, + .px-sm-1 { + padding-left: 10px !important; } + .p-sm-2 { + padding: 20px !important; } + .pt-sm-2, + .py-sm-2 { + padding-top: 20px !important; } + .pr-sm-2, + .px-sm-2 { + padding-right: 20px !important; } + .pb-sm-2, + .py-sm-2 { + padding-bottom: 20px !important; } + .pl-sm-2, + .px-sm-2 { + padding-left: 20px !important; } + .p-sm-3 { + padding: 30px !important; } + .pt-sm-3, + .py-sm-3 { + padding-top: 30px !important; } + .pr-sm-3, + .px-sm-3 { + padding-right: 30px !important; } + .pb-sm-3, + .py-sm-3 { + padding-bottom: 30px !important; } + .pl-sm-3, + .px-sm-3 { + padding-left: 30px !important; } + .p-sm-4 { + padding: 40px !important; } + .pt-sm-4, + .py-sm-4 { + padding-top: 40px !important; } + .pr-sm-4, + .px-sm-4 { + padding-right: 40px !important; } + .pb-sm-4, + .py-sm-4 { + padding-bottom: 40px !important; } + .pl-sm-4, + .px-sm-4 { + padding-left: 40px !important; } + .p-sm-5 { + padding: 50px !important; } + .pt-sm-5, + .py-sm-5 { + padding-top: 50px !important; } + .pr-sm-5, + .px-sm-5 { + padding-right: 50px !important; } + .pb-sm-5, + .py-sm-5 { + padding-bottom: 50px !important; } + .pl-sm-5, + .px-sm-5 { + padding-left: 50px !important; } + .p-sm-6 { + padding: 60px !important; } + .pt-sm-6, + .py-sm-6 { + padding-top: 60px !important; } + .pr-sm-6, + .px-sm-6 { + padding-right: 60px !important; } + .pb-sm-6, + .py-sm-6 { + padding-bottom: 60px !important; } + .pl-sm-6, + .px-sm-6 { + padding-left: 60px !important; } + .p-sm-7 { + padding: 70px !important; } + .pt-sm-7, + .py-sm-7 { + padding-top: 70px !important; } + .pr-sm-7, + .px-sm-7 { + padding-right: 70px !important; } + .pb-sm-7, + .py-sm-7 { + padding-bottom: 70px !important; } + .pl-sm-7, + .px-sm-7 { + padding-left: 70px !important; } + .p-sm-8 { + padding: 80px !important; } + .pt-sm-8, + .py-sm-8 { + padding-top: 80px !important; } + .pr-sm-8, + .px-sm-8 { + padding-right: 80px !important; } + .pb-sm-8, + .py-sm-8 { + padding-bottom: 80px !important; } + .pl-sm-8, + .px-sm-8 { + padding-left: 80px !important; } + .p-sm-9 { + padding: 90px !important; } + .pt-sm-9, + .py-sm-9 { + padding-top: 90px !important; } + .pr-sm-9, + .px-sm-9 { + padding-right: 90px !important; } + .pb-sm-9, + .py-sm-9 { + padding-bottom: 90px !important; } + .pl-sm-9, + .px-sm-9 { + padding-left: 90px !important; } + .p-sm-10 { + padding: 100px !important; } + .pt-sm-10, + .py-sm-10 { + padding-top: 100px !important; } + .pr-sm-10, + .px-sm-10 { + padding-right: 100px !important; } + .pb-sm-10, + .py-sm-10 { + padding-bottom: 100px !important; } + .pl-sm-10, + .px-sm-10 { + padding-left: 100px !important; } + .m-sm-n1 { + margin: -10px !important; } + .mt-sm-n1, + .my-sm-n1 { + margin-top: -10px !important; } + .mr-sm-n1, + .mx-sm-n1 { + margin-right: -10px !important; } + .mb-sm-n1, + .my-sm-n1 { + margin-bottom: -10px !important; } + .ml-sm-n1, + .mx-sm-n1 { + margin-left: -10px !important; } + .m-sm-n2 { + margin: -20px !important; } + .mt-sm-n2, + .my-sm-n2 { + margin-top: -20px !important; } + .mr-sm-n2, + .mx-sm-n2 { + margin-right: -20px !important; } + .mb-sm-n2, + .my-sm-n2 { + margin-bottom: -20px !important; } + .ml-sm-n2, + .mx-sm-n2 { + margin-left: -20px !important; } + .m-sm-n3 { + margin: -30px !important; } + .mt-sm-n3, + .my-sm-n3 { + margin-top: -30px !important; } + .mr-sm-n3, + .mx-sm-n3 { + margin-right: -30px !important; } + .mb-sm-n3, + .my-sm-n3 { + margin-bottom: -30px !important; } + .ml-sm-n3, + .mx-sm-n3 { + margin-left: -30px !important; } + .m-sm-n4 { + margin: -40px !important; } + .mt-sm-n4, + .my-sm-n4 { + margin-top: -40px !important; } + .mr-sm-n4, + .mx-sm-n4 { + margin-right: -40px !important; } + .mb-sm-n4, + .my-sm-n4 { + margin-bottom: -40px !important; } + .ml-sm-n4, + .mx-sm-n4 { + margin-left: -40px !important; } + .m-sm-n5 { + margin: -50px !important; } + .mt-sm-n5, + .my-sm-n5 { + margin-top: -50px !important; } + .mr-sm-n5, + .mx-sm-n5 { + margin-right: -50px !important; } + .mb-sm-n5, + .my-sm-n5 { + margin-bottom: -50px !important; } + .ml-sm-n5, + .mx-sm-n5 { + margin-left: -50px !important; } + .m-sm-n6 { + margin: -60px !important; } + .mt-sm-n6, + .my-sm-n6 { + margin-top: -60px !important; } + .mr-sm-n6, + .mx-sm-n6 { + margin-right: -60px !important; } + .mb-sm-n6, + .my-sm-n6 { + margin-bottom: -60px !important; } + .ml-sm-n6, + .mx-sm-n6 { + margin-left: -60px !important; } + .m-sm-n7 { + margin: -70px !important; } + .mt-sm-n7, + .my-sm-n7 { + margin-top: -70px !important; } + .mr-sm-n7, + .mx-sm-n7 { + margin-right: -70px !important; } + .mb-sm-n7, + .my-sm-n7 { + margin-bottom: -70px !important; } + .ml-sm-n7, + .mx-sm-n7 { + margin-left: -70px !important; } + .m-sm-n8 { + margin: -80px !important; } + .mt-sm-n8, + .my-sm-n8 { + margin-top: -80px !important; } + .mr-sm-n8, + .mx-sm-n8 { + margin-right: -80px !important; } + .mb-sm-n8, + .my-sm-n8 { + margin-bottom: -80px !important; } + .ml-sm-n8, + .mx-sm-n8 { + margin-left: -80px !important; } + .m-sm-n9 { + margin: -90px !important; } + .mt-sm-n9, + .my-sm-n9 { + margin-top: -90px !important; } + .mr-sm-n9, + .mx-sm-n9 { + margin-right: -90px !important; } + .mb-sm-n9, + .my-sm-n9 { + margin-bottom: -90px !important; } + .ml-sm-n9, + .mx-sm-n9 { + margin-left: -90px !important; } + .m-sm-n10 { + margin: -100px !important; } + .mt-sm-n10, + .my-sm-n10 { + margin-top: -100px !important; } + .mr-sm-n10, + .mx-sm-n10 { + margin-right: -100px !important; } + .mb-sm-n10, + .my-sm-n10 { + margin-bottom: -100px !important; } + .ml-sm-n10, + .mx-sm-n10 { + margin-left: -100px !important; } + .m-sm-auto { + margin: auto !important; } + .mt-sm-auto, + .my-sm-auto { + margin-top: auto !important; } + .mr-sm-auto, + .mx-sm-auto { + margin-right: auto !important; } + .mb-sm-auto, + .my-sm-auto { + margin-bottom: auto !important; } + .ml-sm-auto, + .mx-sm-auto { + margin-left: auto !important; } } + +@media (min-width: 768px) { + .m-md-0 { + margin: 0 !important; } + .mt-md-0, + .my-md-0 { + margin-top: 0 !important; } + .mr-md-0, + .mx-md-0 { + margin-right: 0 !important; } + .mb-md-0, + .my-md-0 { + margin-bottom: 0 !important; } + .ml-md-0, + .mx-md-0 { + margin-left: 0 !important; } + .m-md-1 { + margin: 10px !important; } + .mt-md-1, + .my-md-1 { + margin-top: 10px !important; } + .mr-md-1, + .mx-md-1 { + margin-right: 10px !important; } + .mb-md-1, + .my-md-1 { + margin-bottom: 10px !important; } + .ml-md-1, + .mx-md-1 { + margin-left: 10px !important; } + .m-md-2 { + margin: 20px !important; } + .mt-md-2, + .my-md-2 { + margin-top: 20px !important; } + .mr-md-2, + .mx-md-2 { + margin-right: 20px !important; } + .mb-md-2, + .my-md-2 { + margin-bottom: 20px !important; } + .ml-md-2, + .mx-md-2 { + margin-left: 20px !important; } + .m-md-3 { + margin: 30px !important; } + .mt-md-3, + .my-md-3 { + margin-top: 30px !important; } + .mr-md-3, + .mx-md-3 { + margin-right: 30px !important; } + .mb-md-3, + .my-md-3 { + margin-bottom: 30px !important; } + .ml-md-3, + .mx-md-3 { + margin-left: 30px !important; } + .m-md-4 { + margin: 40px !important; } + .mt-md-4, + .my-md-4 { + margin-top: 40px !important; } + .mr-md-4, + .mx-md-4 { + margin-right: 40px !important; } + .mb-md-4, + .my-md-4 { + margin-bottom: 40px !important; } + .ml-md-4, + .mx-md-4 { + margin-left: 40px !important; } + .m-md-5 { + margin: 50px !important; } + .mt-md-5, + .my-md-5 { + margin-top: 50px !important; } + .mr-md-5, + .mx-md-5 { + margin-right: 50px !important; } + .mb-md-5, + .my-md-5 { + margin-bottom: 50px !important; } + .ml-md-5, + .mx-md-5 { + margin-left: 50px !important; } + .m-md-6 { + margin: 60px !important; } + .mt-md-6, + .my-md-6 { + margin-top: 60px !important; } + .mr-md-6, + .mx-md-6 { + margin-right: 60px !important; } + .mb-md-6, + .my-md-6 { + margin-bottom: 60px !important; } + .ml-md-6, + .mx-md-6 { + margin-left: 60px !important; } + .m-md-7 { + margin: 70px !important; } + .mt-md-7, + .my-md-7 { + margin-top: 70px !important; } + .mr-md-7, + .mx-md-7 { + margin-right: 70px !important; } + .mb-md-7, + .my-md-7 { + margin-bottom: 70px !important; } + .ml-md-7, + .mx-md-7 { + margin-left: 70px !important; } + .m-md-8 { + margin: 80px !important; } + .mt-md-8, + .my-md-8 { + margin-top: 80px !important; } + .mr-md-8, + .mx-md-8 { + margin-right: 80px !important; } + .mb-md-8, + .my-md-8 { + margin-bottom: 80px !important; } + .ml-md-8, + .mx-md-8 { + margin-left: 80px !important; } + .m-md-9 { + margin: 90px !important; } + .mt-md-9, + .my-md-9 { + margin-top: 90px !important; } + .mr-md-9, + .mx-md-9 { + margin-right: 90px !important; } + .mb-md-9, + .my-md-9 { + margin-bottom: 90px !important; } + .ml-md-9, + .mx-md-9 { + margin-left: 90px !important; } + .m-md-10 { + margin: 100px !important; } + .mt-md-10, + .my-md-10 { + margin-top: 100px !important; } + .mr-md-10, + .mx-md-10 { + margin-right: 100px !important; } + .mb-md-10, + .my-md-10 { + margin-bottom: 100px !important; } + .ml-md-10, + .mx-md-10 { + margin-left: 100px !important; } + .p-md-0 { + padding: 0 !important; } + .pt-md-0, + .py-md-0 { + padding-top: 0 !important; } + .pr-md-0, + .px-md-0 { + padding-right: 0 !important; } + .pb-md-0, + .py-md-0 { + padding-bottom: 0 !important; } + .pl-md-0, + .px-md-0 { + padding-left: 0 !important; } + .p-md-1 { + padding: 10px !important; } + .pt-md-1, + .py-md-1 { + padding-top: 10px !important; } + .pr-md-1, + .px-md-1 { + padding-right: 10px !important; } + .pb-md-1, + .py-md-1 { + padding-bottom: 10px !important; } + .pl-md-1, + .px-md-1 { + padding-left: 10px !important; } + .p-md-2 { + padding: 20px !important; } + .pt-md-2, + .py-md-2 { + padding-top: 20px !important; } + .pr-md-2, + .px-md-2 { + padding-right: 20px !important; } + .pb-md-2, + .py-md-2 { + padding-bottom: 20px !important; } + .pl-md-2, + .px-md-2 { + padding-left: 20px !important; } + .p-md-3 { + padding: 30px !important; } + .pt-md-3, + .py-md-3 { + padding-top: 30px !important; } + .pr-md-3, + .px-md-3 { + padding-right: 30px !important; } + .pb-md-3, + .py-md-3 { + padding-bottom: 30px !important; } + .pl-md-3, + .px-md-3 { + padding-left: 30px !important; } + .p-md-4 { + padding: 40px !important; } + .pt-md-4, + .py-md-4 { + padding-top: 40px !important; } + .pr-md-4, + .px-md-4 { + padding-right: 40px !important; } + .pb-md-4, + .py-md-4 { + padding-bottom: 40px !important; } + .pl-md-4, + .px-md-4 { + padding-left: 40px !important; } + .p-md-5 { + padding: 50px !important; } + .pt-md-5, + .py-md-5 { + padding-top: 50px !important; } + .pr-md-5, + .px-md-5 { + padding-right: 50px !important; } + .pb-md-5, + .py-md-5 { + padding-bottom: 50px !important; } + .pl-md-5, + .px-md-5 { + padding-left: 50px !important; } + .p-md-6 { + padding: 60px !important; } + .pt-md-6, + .py-md-6 { + padding-top: 60px !important; } + .pr-md-6, + .px-md-6 { + padding-right: 60px !important; } + .pb-md-6, + .py-md-6 { + padding-bottom: 60px !important; } + .pl-md-6, + .px-md-6 { + padding-left: 60px !important; } + .p-md-7 { + padding: 70px !important; } + .pt-md-7, + .py-md-7 { + padding-top: 70px !important; } + .pr-md-7, + .px-md-7 { + padding-right: 70px !important; } + .pb-md-7, + .py-md-7 { + padding-bottom: 70px !important; } + .pl-md-7, + .px-md-7 { + padding-left: 70px !important; } + .p-md-8 { + padding: 80px !important; } + .pt-md-8, + .py-md-8 { + padding-top: 80px !important; } + .pr-md-8, + .px-md-8 { + padding-right: 80px !important; } + .pb-md-8, + .py-md-8 { + padding-bottom: 80px !important; } + .pl-md-8, + .px-md-8 { + padding-left: 80px !important; } + .p-md-9 { + padding: 90px !important; } + .pt-md-9, + .py-md-9 { + padding-top: 90px !important; } + .pr-md-9, + .px-md-9 { + padding-right: 90px !important; } + .pb-md-9, + .py-md-9 { + padding-bottom: 90px !important; } + .pl-md-9, + .px-md-9 { + padding-left: 90px !important; } + .p-md-10 { + padding: 100px !important; } + .pt-md-10, + .py-md-10 { + padding-top: 100px !important; } + .pr-md-10, + .px-md-10 { + padding-right: 100px !important; } + .pb-md-10, + .py-md-10 { + padding-bottom: 100px !important; } + .pl-md-10, + .px-md-10 { + padding-left: 100px !important; } + .m-md-n1 { + margin: -10px !important; } + .mt-md-n1, + .my-md-n1 { + margin-top: -10px !important; } + .mr-md-n1, + .mx-md-n1 { + margin-right: -10px !important; } + .mb-md-n1, + .my-md-n1 { + margin-bottom: -10px !important; } + .ml-md-n1, + .mx-md-n1 { + margin-left: -10px !important; } + .m-md-n2 { + margin: -20px !important; } + .mt-md-n2, + .my-md-n2 { + margin-top: -20px !important; } + .mr-md-n2, + .mx-md-n2 { + margin-right: -20px !important; } + .mb-md-n2, + .my-md-n2 { + margin-bottom: -20px !important; } + .ml-md-n2, + .mx-md-n2 { + margin-left: -20px !important; } + .m-md-n3 { + margin: -30px !important; } + .mt-md-n3, + .my-md-n3 { + margin-top: -30px !important; } + .mr-md-n3, + .mx-md-n3 { + margin-right: -30px !important; } + .mb-md-n3, + .my-md-n3 { + margin-bottom: -30px !important; } + .ml-md-n3, + .mx-md-n3 { + margin-left: -30px !important; } + .m-md-n4 { + margin: -40px !important; } + .mt-md-n4, + .my-md-n4 { + margin-top: -40px !important; } + .mr-md-n4, + .mx-md-n4 { + margin-right: -40px !important; } + .mb-md-n4, + .my-md-n4 { + margin-bottom: -40px !important; } + .ml-md-n4, + .mx-md-n4 { + margin-left: -40px !important; } + .m-md-n5 { + margin: -50px !important; } + .mt-md-n5, + .my-md-n5 { + margin-top: -50px !important; } + .mr-md-n5, + .mx-md-n5 { + margin-right: -50px !important; } + .mb-md-n5, + .my-md-n5 { + margin-bottom: -50px !important; } + .ml-md-n5, + .mx-md-n5 { + margin-left: -50px !important; } + .m-md-n6 { + margin: -60px !important; } + .mt-md-n6, + .my-md-n6 { + margin-top: -60px !important; } + .mr-md-n6, + .mx-md-n6 { + margin-right: -60px !important; } + .mb-md-n6, + .my-md-n6 { + margin-bottom: -60px !important; } + .ml-md-n6, + .mx-md-n6 { + margin-left: -60px !important; } + .m-md-n7 { + margin: -70px !important; } + .mt-md-n7, + .my-md-n7 { + margin-top: -70px !important; } + .mr-md-n7, + .mx-md-n7 { + margin-right: -70px !important; } + .mb-md-n7, + .my-md-n7 { + margin-bottom: -70px !important; } + .ml-md-n7, + .mx-md-n7 { + margin-left: -70px !important; } + .m-md-n8 { + margin: -80px !important; } + .mt-md-n8, + .my-md-n8 { + margin-top: -80px !important; } + .mr-md-n8, + .mx-md-n8 { + margin-right: -80px !important; } + .mb-md-n8, + .my-md-n8 { + margin-bottom: -80px !important; } + .ml-md-n8, + .mx-md-n8 { + margin-left: -80px !important; } + .m-md-n9 { + margin: -90px !important; } + .mt-md-n9, + .my-md-n9 { + margin-top: -90px !important; } + .mr-md-n9, + .mx-md-n9 { + margin-right: -90px !important; } + .mb-md-n9, + .my-md-n9 { + margin-bottom: -90px !important; } + .ml-md-n9, + .mx-md-n9 { + margin-left: -90px !important; } + .m-md-n10 { + margin: -100px !important; } + .mt-md-n10, + .my-md-n10 { + margin-top: -100px !important; } + .mr-md-n10, + .mx-md-n10 { + margin-right: -100px !important; } + .mb-md-n10, + .my-md-n10 { + margin-bottom: -100px !important; } + .ml-md-n10, + .mx-md-n10 { + margin-left: -100px !important; } + .m-md-auto { + margin: auto !important; } + .mt-md-auto, + .my-md-auto { + margin-top: auto !important; } + .mr-md-auto, + .mx-md-auto { + margin-right: auto !important; } + .mb-md-auto, + .my-md-auto { + margin-bottom: auto !important; } + .ml-md-auto, + .mx-md-auto { + margin-left: auto !important; } } + +@media (min-width: 992px) { + .m-lg-0 { + margin: 0 !important; } + .mt-lg-0, + .my-lg-0 { + margin-top: 0 !important; } + .mr-lg-0, + .mx-lg-0 { + margin-right: 0 !important; } + .mb-lg-0, + .my-lg-0 { + margin-bottom: 0 !important; } + .ml-lg-0, + .mx-lg-0 { + margin-left: 0 !important; } + .m-lg-1 { + margin: 10px !important; } + .mt-lg-1, + .my-lg-1 { + margin-top: 10px !important; } + .mr-lg-1, + .mx-lg-1 { + margin-right: 10px !important; } + .mb-lg-1, + .my-lg-1 { + margin-bottom: 10px !important; } + .ml-lg-1, + .mx-lg-1 { + margin-left: 10px !important; } + .m-lg-2 { + margin: 20px !important; } + .mt-lg-2, + .my-lg-2 { + margin-top: 20px !important; } + .mr-lg-2, + .mx-lg-2 { + margin-right: 20px !important; } + .mb-lg-2, + .my-lg-2 { + margin-bottom: 20px !important; } + .ml-lg-2, + .mx-lg-2 { + margin-left: 20px !important; } + .m-lg-3 { + margin: 30px !important; } + .mt-lg-3, + .my-lg-3 { + margin-top: 30px !important; } + .mr-lg-3, + .mx-lg-3 { + margin-right: 30px !important; } + .mb-lg-3, + .my-lg-3 { + margin-bottom: 30px !important; } + .ml-lg-3, + .mx-lg-3 { + margin-left: 30px !important; } + .m-lg-4 { + margin: 40px !important; } + .mt-lg-4, + .my-lg-4 { + margin-top: 40px !important; } + .mr-lg-4, + .mx-lg-4 { + margin-right: 40px !important; } + .mb-lg-4, + .my-lg-4 { + margin-bottom: 40px !important; } + .ml-lg-4, + .mx-lg-4 { + margin-left: 40px !important; } + .m-lg-5 { + margin: 50px !important; } + .mt-lg-5, + .my-lg-5 { + margin-top: 50px !important; } + .mr-lg-5, + .mx-lg-5 { + margin-right: 50px !important; } + .mb-lg-5, + .my-lg-5 { + margin-bottom: 50px !important; } + .ml-lg-5, + .mx-lg-5 { + margin-left: 50px !important; } + .m-lg-6 { + margin: 60px !important; } + .mt-lg-6, + .my-lg-6 { + margin-top: 60px !important; } + .mr-lg-6, + .mx-lg-6 { + margin-right: 60px !important; } + .mb-lg-6, + .my-lg-6 { + margin-bottom: 60px !important; } + .ml-lg-6, + .mx-lg-6 { + margin-left: 60px !important; } + .m-lg-7 { + margin: 70px !important; } + .mt-lg-7, + .my-lg-7 { + margin-top: 70px !important; } + .mr-lg-7, + .mx-lg-7 { + margin-right: 70px !important; } + .mb-lg-7, + .my-lg-7 { + margin-bottom: 70px !important; } + .ml-lg-7, + .mx-lg-7 { + margin-left: 70px !important; } + .m-lg-8 { + margin: 80px !important; } + .mt-lg-8, + .my-lg-8 { + margin-top: 80px !important; } + .mr-lg-8, + .mx-lg-8 { + margin-right: 80px !important; } + .mb-lg-8, + .my-lg-8 { + margin-bottom: 80px !important; } + .ml-lg-8, + .mx-lg-8 { + margin-left: 80px !important; } + .m-lg-9 { + margin: 90px !important; } + .mt-lg-9, + .my-lg-9 { + margin-top: 90px !important; } + .mr-lg-9, + .mx-lg-9 { + margin-right: 90px !important; } + .mb-lg-9, + .my-lg-9 { + margin-bottom: 90px !important; } + .ml-lg-9, + .mx-lg-9 { + margin-left: 90px !important; } + .m-lg-10 { + margin: 100px !important; } + .mt-lg-10, + .my-lg-10 { + margin-top: 100px !important; } + .mr-lg-10, + .mx-lg-10 { + margin-right: 100px !important; } + .mb-lg-10, + .my-lg-10 { + margin-bottom: 100px !important; } + .ml-lg-10, + .mx-lg-10 { + margin-left: 100px !important; } + .p-lg-0 { + padding: 0 !important; } + .pt-lg-0, + .py-lg-0 { + padding-top: 0 !important; } + .pr-lg-0, + .px-lg-0 { + padding-right: 0 !important; } + .pb-lg-0, + .py-lg-0 { + padding-bottom: 0 !important; } + .pl-lg-0, + .px-lg-0 { + padding-left: 0 !important; } + .p-lg-1 { + padding: 10px !important; } + .pt-lg-1, + .py-lg-1 { + padding-top: 10px !important; } + .pr-lg-1, + .px-lg-1 { + padding-right: 10px !important; } + .pb-lg-1, + .py-lg-1 { + padding-bottom: 10px !important; } + .pl-lg-1, + .px-lg-1 { + padding-left: 10px !important; } + .p-lg-2 { + padding: 20px !important; } + .pt-lg-2, + .py-lg-2 { + padding-top: 20px !important; } + .pr-lg-2, + .px-lg-2 { + padding-right: 20px !important; } + .pb-lg-2, + .py-lg-2 { + padding-bottom: 20px !important; } + .pl-lg-2, + .px-lg-2 { + padding-left: 20px !important; } + .p-lg-3 { + padding: 30px !important; } + .pt-lg-3, + .py-lg-3 { + padding-top: 30px !important; } + .pr-lg-3, + .px-lg-3 { + padding-right: 30px !important; } + .pb-lg-3, + .py-lg-3 { + padding-bottom: 30px !important; } + .pl-lg-3, + .px-lg-3 { + padding-left: 30px !important; } + .p-lg-4 { + padding: 40px !important; } + .pt-lg-4, + .py-lg-4 { + padding-top: 40px !important; } + .pr-lg-4, + .px-lg-4 { + padding-right: 40px !important; } + .pb-lg-4, + .py-lg-4 { + padding-bottom: 40px !important; } + .pl-lg-4, + .px-lg-4 { + padding-left: 40px !important; } + .p-lg-5 { + padding: 50px !important; } + .pt-lg-5, + .py-lg-5 { + padding-top: 50px !important; } + .pr-lg-5, + .px-lg-5 { + padding-right: 50px !important; } + .pb-lg-5, + .py-lg-5 { + padding-bottom: 50px !important; } + .pl-lg-5, + .px-lg-5 { + padding-left: 50px !important; } + .p-lg-6 { + padding: 60px !important; } + .pt-lg-6, + .py-lg-6 { + padding-top: 60px !important; } + .pr-lg-6, + .px-lg-6 { + padding-right: 60px !important; } + .pb-lg-6, + .py-lg-6 { + padding-bottom: 60px !important; } + .pl-lg-6, + .px-lg-6 { + padding-left: 60px !important; } + .p-lg-7 { + padding: 70px !important; } + .pt-lg-7, + .py-lg-7 { + padding-top: 70px !important; } + .pr-lg-7, + .px-lg-7 { + padding-right: 70px !important; } + .pb-lg-7, + .py-lg-7 { + padding-bottom: 70px !important; } + .pl-lg-7, + .px-lg-7 { + padding-left: 70px !important; } + .p-lg-8 { + padding: 80px !important; } + .pt-lg-8, + .py-lg-8 { + padding-top: 80px !important; } + .pr-lg-8, + .px-lg-8 { + padding-right: 80px !important; } + .pb-lg-8, + .py-lg-8 { + padding-bottom: 80px !important; } + .pl-lg-8, + .px-lg-8 { + padding-left: 80px !important; } + .p-lg-9 { + padding: 90px !important; } + .pt-lg-9, + .py-lg-9 { + padding-top: 90px !important; } + .pr-lg-9, + .px-lg-9 { + padding-right: 90px !important; } + .pb-lg-9, + .py-lg-9 { + padding-bottom: 90px !important; } + .pl-lg-9, + .px-lg-9 { + padding-left: 90px !important; } + .p-lg-10 { + padding: 100px !important; } + .pt-lg-10, + .py-lg-10 { + padding-top: 100px !important; } + .pr-lg-10, + .px-lg-10 { + padding-right: 100px !important; } + .pb-lg-10, + .py-lg-10 { + padding-bottom: 100px !important; } + .pl-lg-10, + .px-lg-10 { + padding-left: 100px !important; } + .m-lg-n1 { + margin: -10px !important; } + .mt-lg-n1, + .my-lg-n1 { + margin-top: -10px !important; } + .mr-lg-n1, + .mx-lg-n1 { + margin-right: -10px !important; } + .mb-lg-n1, + .my-lg-n1 { + margin-bottom: -10px !important; } + .ml-lg-n1, + .mx-lg-n1 { + margin-left: -10px !important; } + .m-lg-n2 { + margin: -20px !important; } + .mt-lg-n2, + .my-lg-n2 { + margin-top: -20px !important; } + .mr-lg-n2, + .mx-lg-n2 { + margin-right: -20px !important; } + .mb-lg-n2, + .my-lg-n2 { + margin-bottom: -20px !important; } + .ml-lg-n2, + .mx-lg-n2 { + margin-left: -20px !important; } + .m-lg-n3 { + margin: -30px !important; } + .mt-lg-n3, + .my-lg-n3 { + margin-top: -30px !important; } + .mr-lg-n3, + .mx-lg-n3 { + margin-right: -30px !important; } + .mb-lg-n3, + .my-lg-n3 { + margin-bottom: -30px !important; } + .ml-lg-n3, + .mx-lg-n3 { + margin-left: -30px !important; } + .m-lg-n4 { + margin: -40px !important; } + .mt-lg-n4, + .my-lg-n4 { + margin-top: -40px !important; } + .mr-lg-n4, + .mx-lg-n4 { + margin-right: -40px !important; } + .mb-lg-n4, + .my-lg-n4 { + margin-bottom: -40px !important; } + .ml-lg-n4, + .mx-lg-n4 { + margin-left: -40px !important; } + .m-lg-n5 { + margin: -50px !important; } + .mt-lg-n5, + .my-lg-n5 { + margin-top: -50px !important; } + .mr-lg-n5, + .mx-lg-n5 { + margin-right: -50px !important; } + .mb-lg-n5, + .my-lg-n5 { + margin-bottom: -50px !important; } + .ml-lg-n5, + .mx-lg-n5 { + margin-left: -50px !important; } + .m-lg-n6 { + margin: -60px !important; } + .mt-lg-n6, + .my-lg-n6 { + margin-top: -60px !important; } + .mr-lg-n6, + .mx-lg-n6 { + margin-right: -60px !important; } + .mb-lg-n6, + .my-lg-n6 { + margin-bottom: -60px !important; } + .ml-lg-n6, + .mx-lg-n6 { + margin-left: -60px !important; } + .m-lg-n7 { + margin: -70px !important; } + .mt-lg-n7, + .my-lg-n7 { + margin-top: -70px !important; } + .mr-lg-n7, + .mx-lg-n7 { + margin-right: -70px !important; } + .mb-lg-n7, + .my-lg-n7 { + margin-bottom: -70px !important; } + .ml-lg-n7, + .mx-lg-n7 { + margin-left: -70px !important; } + .m-lg-n8 { + margin: -80px !important; } + .mt-lg-n8, + .my-lg-n8 { + margin-top: -80px !important; } + .mr-lg-n8, + .mx-lg-n8 { + margin-right: -80px !important; } + .mb-lg-n8, + .my-lg-n8 { + margin-bottom: -80px !important; } + .ml-lg-n8, + .mx-lg-n8 { + margin-left: -80px !important; } + .m-lg-n9 { + margin: -90px !important; } + .mt-lg-n9, + .my-lg-n9 { + margin-top: -90px !important; } + .mr-lg-n9, + .mx-lg-n9 { + margin-right: -90px !important; } + .mb-lg-n9, + .my-lg-n9 { + margin-bottom: -90px !important; } + .ml-lg-n9, + .mx-lg-n9 { + margin-left: -90px !important; } + .m-lg-n10 { + margin: -100px !important; } + .mt-lg-n10, + .my-lg-n10 { + margin-top: -100px !important; } + .mr-lg-n10, + .mx-lg-n10 { + margin-right: -100px !important; } + .mb-lg-n10, + .my-lg-n10 { + margin-bottom: -100px !important; } + .ml-lg-n10, + .mx-lg-n10 { + margin-left: -100px !important; } + .m-lg-auto { + margin: auto !important; } + .mt-lg-auto, + .my-lg-auto { + margin-top: auto !important; } + .mr-lg-auto, + .mx-lg-auto { + margin-right: auto !important; } + .mb-lg-auto, + .my-lg-auto { + margin-bottom: auto !important; } + .ml-lg-auto, + .mx-lg-auto { + margin-left: auto !important; } } + +@media (min-width: 1300px) { + .m-xl-0 { + margin: 0 !important; } + .mt-xl-0, + .my-xl-0 { + margin-top: 0 !important; } + .mr-xl-0, + .mx-xl-0 { + margin-right: 0 !important; } + .mb-xl-0, + .my-xl-0 { + margin-bottom: 0 !important; } + .ml-xl-0, + .mx-xl-0 { + margin-left: 0 !important; } + .m-xl-1 { + margin: 10px !important; } + .mt-xl-1, + .my-xl-1 { + margin-top: 10px !important; } + .mr-xl-1, + .mx-xl-1 { + margin-right: 10px !important; } + .mb-xl-1, + .my-xl-1 { + margin-bottom: 10px !important; } + .ml-xl-1, + .mx-xl-1 { + margin-left: 10px !important; } + .m-xl-2 { + margin: 20px !important; } + .mt-xl-2, + .my-xl-2 { + margin-top: 20px !important; } + .mr-xl-2, + .mx-xl-2 { + margin-right: 20px !important; } + .mb-xl-2, + .my-xl-2 { + margin-bottom: 20px !important; } + .ml-xl-2, + .mx-xl-2 { + margin-left: 20px !important; } + .m-xl-3 { + margin: 30px !important; } + .mt-xl-3, + .my-xl-3 { + margin-top: 30px !important; } + .mr-xl-3, + .mx-xl-3 { + margin-right: 30px !important; } + .mb-xl-3, + .my-xl-3 { + margin-bottom: 30px !important; } + .ml-xl-3, + .mx-xl-3 { + margin-left: 30px !important; } + .m-xl-4 { + margin: 40px !important; } + .mt-xl-4, + .my-xl-4 { + margin-top: 40px !important; } + .mr-xl-4, + .mx-xl-4 { + margin-right: 40px !important; } + .mb-xl-4, + .my-xl-4 { + margin-bottom: 40px !important; } + .ml-xl-4, + .mx-xl-4 { + margin-left: 40px !important; } + .m-xl-5 { + margin: 50px !important; } + .mt-xl-5, + .my-xl-5 { + margin-top: 50px !important; } + .mr-xl-5, + .mx-xl-5 { + margin-right: 50px !important; } + .mb-xl-5, + .my-xl-5 { + margin-bottom: 50px !important; } + .ml-xl-5, + .mx-xl-5 { + margin-left: 50px !important; } + .m-xl-6 { + margin: 60px !important; } + .mt-xl-6, + .my-xl-6 { + margin-top: 60px !important; } + .mr-xl-6, + .mx-xl-6 { + margin-right: 60px !important; } + .mb-xl-6, + .my-xl-6 { + margin-bottom: 60px !important; } + .ml-xl-6, + .mx-xl-6 { + margin-left: 60px !important; } + .m-xl-7 { + margin: 70px !important; } + .mt-xl-7, + .my-xl-7 { + margin-top: 70px !important; } + .mr-xl-7, + .mx-xl-7 { + margin-right: 70px !important; } + .mb-xl-7, + .my-xl-7 { + margin-bottom: 70px !important; } + .ml-xl-7, + .mx-xl-7 { + margin-left: 70px !important; } + .m-xl-8 { + margin: 80px !important; } + .mt-xl-8, + .my-xl-8 { + margin-top: 80px !important; } + .mr-xl-8, + .mx-xl-8 { + margin-right: 80px !important; } + .mb-xl-8, + .my-xl-8 { + margin-bottom: 80px !important; } + .ml-xl-8, + .mx-xl-8 { + margin-left: 80px !important; } + .m-xl-9 { + margin: 90px !important; } + .mt-xl-9, + .my-xl-9 { + margin-top: 90px !important; } + .mr-xl-9, + .mx-xl-9 { + margin-right: 90px !important; } + .mb-xl-9, + .my-xl-9 { + margin-bottom: 90px !important; } + .ml-xl-9, + .mx-xl-9 { + margin-left: 90px !important; } + .m-xl-10 { + margin: 100px !important; } + .mt-xl-10, + .my-xl-10 { + margin-top: 100px !important; } + .mr-xl-10, + .mx-xl-10 { + margin-right: 100px !important; } + .mb-xl-10, + .my-xl-10 { + margin-bottom: 100px !important; } + .ml-xl-10, + .mx-xl-10 { + margin-left: 100px !important; } + .p-xl-0 { + padding: 0 !important; } + .pt-xl-0, + .py-xl-0 { + padding-top: 0 !important; } + .pr-xl-0, + .px-xl-0 { + padding-right: 0 !important; } + .pb-xl-0, + .py-xl-0 { + padding-bottom: 0 !important; } + .pl-xl-0, + .px-xl-0 { + padding-left: 0 !important; } + .p-xl-1 { + padding: 10px !important; } + .pt-xl-1, + .py-xl-1 { + padding-top: 10px !important; } + .pr-xl-1, + .px-xl-1 { + padding-right: 10px !important; } + .pb-xl-1, + .py-xl-1 { + padding-bottom: 10px !important; } + .pl-xl-1, + .px-xl-1 { + padding-left: 10px !important; } + .p-xl-2 { + padding: 20px !important; } + .pt-xl-2, + .py-xl-2 { + padding-top: 20px !important; } + .pr-xl-2, + .px-xl-2 { + padding-right: 20px !important; } + .pb-xl-2, + .py-xl-2 { + padding-bottom: 20px !important; } + .pl-xl-2, + .px-xl-2 { + padding-left: 20px !important; } + .p-xl-3 { + padding: 30px !important; } + .pt-xl-3, + .py-xl-3 { + padding-top: 30px !important; } + .pr-xl-3, + .px-xl-3 { + padding-right: 30px !important; } + .pb-xl-3, + .py-xl-3 { + padding-bottom: 30px !important; } + .pl-xl-3, + .px-xl-3 { + padding-left: 30px !important; } + .p-xl-4 { + padding: 40px !important; } + .pt-xl-4, + .py-xl-4 { + padding-top: 40px !important; } + .pr-xl-4, + .px-xl-4 { + padding-right: 40px !important; } + .pb-xl-4, + .py-xl-4 { + padding-bottom: 40px !important; } + .pl-xl-4, + .px-xl-4 { + padding-left: 40px !important; } + .p-xl-5 { + padding: 50px !important; } + .pt-xl-5, + .py-xl-5 { + padding-top: 50px !important; } + .pr-xl-5, + .px-xl-5 { + padding-right: 50px !important; } + .pb-xl-5, + .py-xl-5 { + padding-bottom: 50px !important; } + .pl-xl-5, + .px-xl-5 { + padding-left: 50px !important; } + .p-xl-6 { + padding: 60px !important; } + .pt-xl-6, + .py-xl-6 { + padding-top: 60px !important; } + .pr-xl-6, + .px-xl-6 { + padding-right: 60px !important; } + .pb-xl-6, + .py-xl-6 { + padding-bottom: 60px !important; } + .pl-xl-6, + .px-xl-6 { + padding-left: 60px !important; } + .p-xl-7 { + padding: 70px !important; } + .pt-xl-7, + .py-xl-7 { + padding-top: 70px !important; } + .pr-xl-7, + .px-xl-7 { + padding-right: 70px !important; } + .pb-xl-7, + .py-xl-7 { + padding-bottom: 70px !important; } + .pl-xl-7, + .px-xl-7 { + padding-left: 70px !important; } + .p-xl-8 { + padding: 80px !important; } + .pt-xl-8, + .py-xl-8 { + padding-top: 80px !important; } + .pr-xl-8, + .px-xl-8 { + padding-right: 80px !important; } + .pb-xl-8, + .py-xl-8 { + padding-bottom: 80px !important; } + .pl-xl-8, + .px-xl-8 { + padding-left: 80px !important; } + .p-xl-9 { + padding: 90px !important; } + .pt-xl-9, + .py-xl-9 { + padding-top: 90px !important; } + .pr-xl-9, + .px-xl-9 { + padding-right: 90px !important; } + .pb-xl-9, + .py-xl-9 { + padding-bottom: 90px !important; } + .pl-xl-9, + .px-xl-9 { + padding-left: 90px !important; } + .p-xl-10 { + padding: 100px !important; } + .pt-xl-10, + .py-xl-10 { + padding-top: 100px !important; } + .pr-xl-10, + .px-xl-10 { + padding-right: 100px !important; } + .pb-xl-10, + .py-xl-10 { + padding-bottom: 100px !important; } + .pl-xl-10, + .px-xl-10 { + padding-left: 100px !important; } + .m-xl-n1 { + margin: -10px !important; } + .mt-xl-n1, + .my-xl-n1 { + margin-top: -10px !important; } + .mr-xl-n1, + .mx-xl-n1 { + margin-right: -10px !important; } + .mb-xl-n1, + .my-xl-n1 { + margin-bottom: -10px !important; } + .ml-xl-n1, + .mx-xl-n1 { + margin-left: -10px !important; } + .m-xl-n2 { + margin: -20px !important; } + .mt-xl-n2, + .my-xl-n2 { + margin-top: -20px !important; } + .mr-xl-n2, + .mx-xl-n2 { + margin-right: -20px !important; } + .mb-xl-n2, + .my-xl-n2 { + margin-bottom: -20px !important; } + .ml-xl-n2, + .mx-xl-n2 { + margin-left: -20px !important; } + .m-xl-n3 { + margin: -30px !important; } + .mt-xl-n3, + .my-xl-n3 { + margin-top: -30px !important; } + .mr-xl-n3, + .mx-xl-n3 { + margin-right: -30px !important; } + .mb-xl-n3, + .my-xl-n3 { + margin-bottom: -30px !important; } + .ml-xl-n3, + .mx-xl-n3 { + margin-left: -30px !important; } + .m-xl-n4 { + margin: -40px !important; } + .mt-xl-n4, + .my-xl-n4 { + margin-top: -40px !important; } + .mr-xl-n4, + .mx-xl-n4 { + margin-right: -40px !important; } + .mb-xl-n4, + .my-xl-n4 { + margin-bottom: -40px !important; } + .ml-xl-n4, + .mx-xl-n4 { + margin-left: -40px !important; } + .m-xl-n5 { + margin: -50px !important; } + .mt-xl-n5, + .my-xl-n5 { + margin-top: -50px !important; } + .mr-xl-n5, + .mx-xl-n5 { + margin-right: -50px !important; } + .mb-xl-n5, + .my-xl-n5 { + margin-bottom: -50px !important; } + .ml-xl-n5, + .mx-xl-n5 { + margin-left: -50px !important; } + .m-xl-n6 { + margin: -60px !important; } + .mt-xl-n6, + .my-xl-n6 { + margin-top: -60px !important; } + .mr-xl-n6, + .mx-xl-n6 { + margin-right: -60px !important; } + .mb-xl-n6, + .my-xl-n6 { + margin-bottom: -60px !important; } + .ml-xl-n6, + .mx-xl-n6 { + margin-left: -60px !important; } + .m-xl-n7 { + margin: -70px !important; } + .mt-xl-n7, + .my-xl-n7 { + margin-top: -70px !important; } + .mr-xl-n7, + .mx-xl-n7 { + margin-right: -70px !important; } + .mb-xl-n7, + .my-xl-n7 { + margin-bottom: -70px !important; } + .ml-xl-n7, + .mx-xl-n7 { + margin-left: -70px !important; } + .m-xl-n8 { + margin: -80px !important; } + .mt-xl-n8, + .my-xl-n8 { + margin-top: -80px !important; } + .mr-xl-n8, + .mx-xl-n8 { + margin-right: -80px !important; } + .mb-xl-n8, + .my-xl-n8 { + margin-bottom: -80px !important; } + .ml-xl-n8, + .mx-xl-n8 { + margin-left: -80px !important; } + .m-xl-n9 { + margin: -90px !important; } + .mt-xl-n9, + .my-xl-n9 { + margin-top: -90px !important; } + .mr-xl-n9, + .mx-xl-n9 { + margin-right: -90px !important; } + .mb-xl-n9, + .my-xl-n9 { + margin-bottom: -90px !important; } + .ml-xl-n9, + .mx-xl-n9 { + margin-left: -90px !important; } + .m-xl-n10 { + margin: -100px !important; } + .mt-xl-n10, + .my-xl-n10 { + margin-top: -100px !important; } + .mr-xl-n10, + .mx-xl-n10 { + margin-right: -100px !important; } + .mb-xl-n10, + .my-xl-n10 { + margin-bottom: -100px !important; } + .ml-xl-n10, + .mx-xl-n10 { + margin-left: -100px !important; } + .m-xl-auto { + margin: auto !important; } + .mt-xl-auto, + .my-xl-auto { + margin-top: auto !important; } + .mr-xl-auto, + .mx-xl-auto { + margin-right: auto !important; } + .mb-xl-auto, + .my-xl-auto { + margin-bottom: auto !important; } + .ml-xl-auto, + .mx-xl-auto { + margin-left: auto !important; } } + +/*! + * Hamburgers + * @description Tasty CSS-animated hamburgers + * @author Jonathan Suh @jonsuh + * @site https://jonsuh.com/hamburgers + * @link https://github.com/jonsuh/hamburgers + */ +.hamburger { + padding: 15px 15px; + display: inline-block; + cursor: pointer; + transition-property: opacity, filter; + transition-duration: 0.15s; + transition-timing-function: linear; + font: inherit; + color: inherit; + text-transform: none; + background-color: transparent; + border: 0; + margin: 0; + overflow: visible; } + .hamburger:hover { + opacity: 0.7; } + .hamburger.is-active:hover { + opacity: 0.7; } + .hamburger.is-active .hamburger-inner, + .hamburger.is-active .hamburger-inner::before, + .hamburger.is-active .hamburger-inner::after { + background-color: #fff; } + +.hamburger-box { + width: 36px; + height: 23px; + display: inline-block; + position: relative; } + +.hamburger-inner { + display: block; + top: 50%; + margin-top: -1.5px; } + .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after { + width: 36px; + height: 3px; + background-color: #f24088; + border-radius: 3px; + position: absolute; + transition-property: transform; + transition-duration: 0.15s; + transition-timing-function: ease; } + .hamburger-inner::before, .hamburger-inner::after { + content: ""; + display: block; } + .hamburger-inner::before { + top: -10px; } + .hamburger-inner::after { + bottom: -10px; } + +/* + * Slider + */ +.hamburger--slider .hamburger-inner { + top: 1.5px; } + .hamburger--slider .hamburger-inner::before { + top: 10px; + transition-property: transform, opacity; + transition-timing-function: ease; + transition-duration: 0.15s; } + .hamburger--slider .hamburger-inner::after { + top: 20px; } + +.hamburger--slider.is-active .hamburger-inner { + transform: translate3d(0, 10px, 0) rotate(45deg); } + .hamburger--slider.is-active .hamburger-inner::before { + transform: rotate(-45deg) translate3d(-5.14285714px, -7px, 0); + opacity: 0; } + .hamburger--slider.is-active .hamburger-inner::after { + transform: translate3d(0, -20px, 0) rotate(-90deg); } + +a { + color: #f24088; } + +p { + line-height: 26px; + color: #5C5A5A; + font-family: Helvetica, Arial, sans-serif, -apple-system; + margin-bottom: 20px; } + +h1 { + font-size: 20px; + font-family: "Playfair Display", serif, -apple-system; + line-height: 1.2; + margin-bottom: 20px; } + @media (min-width: 768px) { + h1 { + font-size: 32px; + line-height: 1.2; } } +h2 { + font-size: 24px; + font-family: "Playfair Display", serif, -apple-system; + line-height: 1.4; + margin-bottom: 10px; } + @media (min-width: 768px) { + h2 { + font-size: 26px; + line-height: 1.4; } } +h3 { + font-size: 16px; + line-height: 1.4; } + @media (min-width: 768px) { + h3 { + font-size: 20px; + line-height: 1.4; } } +ul, +ol { + margin: 0; + padding: 0; } + ul li, + ol li { + padding: 0; + margin: 0; } + +.page { + display: flex; + min-height: 100vh; + flex-direction: column; } + .page .wrapper { + flex: 1 0 0; } + +.header { + color: #f24088; + background-color: #ffffff; + display: flex; + justify-content: space-between; + align-items: center; + border-bottom: 1px solid #f6f7ff; + padding: 10px 0px; } + .header .container { + display: flex; + justify-content: space-between; + align-items: center; } + .header.header-absolute { + position: absolute; + z-index: 10; + width: 100%; } + +.lock-scroll .header.header-absolute { + position: static; } + +.footer { + background: #f24088; + padding-top: 15px; + padding-bottom: 15px; } + .footer .footer-inner { + display: flex; + justify-content: space-between; + flex-direction: column; + align-items: flex-start; } + @media (min-width: 576px) { + .footer .footer-inner { + justify-content: space-between; + flex-direction: row; + align-items: center; } } + .footer .footer-title { + color: #ffffff; + font-size: 1.3rem; + font-family: "Playfair Display", serif, -apple-system; + font-weight: bold; + margin-bottom: 10px; } + @media (min-width: 576px) { + .footer .footer-title { + margin: 0; } } + .footer ul { + list-style: none; + margin: 0; + padding: 0; } + .footer ul li { + color: #ffffff; + font-size: 1rem; } + .footer ul li a { + color: #ffffff; + text-decoration: none; + padding: 12px 14px 12px 0; + display: block; } + .footer ul li a:hover { + text-decoration: underline; } + @media (min-width: 576px) { + .footer ul { + height: inherit; + display: flex; + list-style: none; + margin: 0; + padding: 0; + align-items: center; + justify-content: flex-end; } + .footer ul li { + list-style: none; + margin-right: 10px; } + .footer ul li:last-of-type { + margin-right: 0; } + .footer ul li a { + display: inline-block; + height: 40px; + padding: 10px 8px 10px 8px; } } +.sub-footer { + background: #ef106a; + color: #ffffff; + padding-top: 15px; + padding-bottom: 15px; } + @media (min-width: 768px) { + .sub-footer { + padding-top: 10px; + padding-bottom: 10px; } } + .sub-footer .sub-footer-inner { + display: flex; + flex-direction: column; + justify-content: space-between; } + @media (min-width: 768px) { + .sub-footer .sub-footer-inner { + flex-direction: row; } } + .sub-footer .copyright { + margin-top: 10px; + font-size: 14px; } + .sub-footer .copyright a { + font-weight: bold; + color: inherit; } + .sub-footer .social a:first-of-type { + margin-left: -10px; } + +.logo { + display: none; } + @media (min-width: 576px) { + .logo { + display: block; } } + .logo a { + display: block; } + .logo img { + width: auto; } + +.logo-mobile { + display: block; } + @media (min-width: 576px) { + .logo-mobile { + display: none; } } + .logo-mobile a { + display: block; } + .logo-mobile img { + width: auto; } + +.main-menu { + display: none; } + @media (min-width: 768px) { + .main-menu { + display: block; } } + .main-menu > ul { + display: flex; + align-items: center; + justify-content: flex-start; } + .main-menu > ul > li { + list-style: none; + font-size: 1rem; } + .main-menu > ul > li > a { + padding: 10px 12px 10px 12px; + display: inline-block; + font-weight: normal; + text-decoration: none; + color: #f24088; } + .main-menu > ul > li > a:hover { + text-decoration: underline; } + .main-menu > ul > li.active > a { + font-weight: bold; + text-decoration: none; } + .main-menu > ul > li.active > a:hover { + text-decoration: none; + transition: all 225ms ease-in 0s; } + +.main-menu-mobile { + position: fixed; + background: #f24088; + top: 0; + left: 0; + width: 100%; + height: 100vh; + opacity: 0; + visibility: hidden; + transition: opacity 0.35s, visibility 0.35s, height 0.35s; + overflow: hidden; + display: flex; + justify-content: center; + align-items: center; + flex-direction: column; } + .main-menu-mobile.open { + opacity: 0.9; + visibility: visible; + height: 100%; + z-index: 20; } + .main-menu-mobile.open li { + animation: fadeInRight 0.5s ease forwards; + animation-delay: 0.35s; } + .main-menu-mobile.open li:nth-of-type(2) { + animation-delay: 0.4s; } + .main-menu-mobile.open li:nth-of-type(3) { + animation-delay: 0.45s; } + .main-menu-mobile.open li:nth-of-type(4) { + animation-delay: 0.5s; } + .main-menu-mobile.open li:nth-of-type(5) { + animation-delay: 0.55s; } + .main-menu-mobile.open li:nth-of-type(6) { + animation-delay: 0.6s; } + .main-menu-mobile ul { + font-size: 30px; + font-family: "Playfair Display", serif, -apple-system; + text-align: center; + list-style: none; + padding: 0; + margin: 0; + flex: 0; } + .main-menu-mobile ul li { + display: block; + position: relative; + opacity: 0; + padding: 10px; } + .main-menu-mobile ul li a { + display: block; + position: relative; + color: #ffffff; + text-decoration: none; + overflow: hidden; } + .main-menu-mobile ul li a:hover { + opacity: 0.8; } + +@keyframes fadeInRight { + 0% { + opacity: 0; + left: 20%; } + 100% { + opacity: 1; + left: 0; } } + +.lock-scroll { + overflow: hidden; } + +.hamburger { + padding: 10px 0 10px 10px; + outline: none; + z-index: 30; + cursor: pointer; } + @media (min-width: 768px) { + .hamburger { + display: none; } } + .hamburger:focus { + outline: none; } + .hamburger .hamburger-inner, + .hamburger .hamburger-inner::before, + .hamburger .hamburger-inner::after { + background: #f24088; } + .hamburger .hamburger-inner::after { + width: 18px; + right: 0; } + .hamburger.is-active .hamburger-inner::after { + width: inherit; + right: unset; } + +.button { + white-space: nowrap; + display: inline-block; + height: 40px; + line-height: 40px; + padding: 0 14px; + background: #f24088; + border-radius: 4px; + font-size: 14px; + font-weight: normal; + text-transform: uppercase; + letter-spacing: 0.025em; + color: #ffffff; + text-decoration: none; + -webkit-transition: all 0.15s ease; + transition: all 0.15s ease; } + .button:hover { + color: #ffffff; + background-color: #f570a6; + transform: translateY(-1px); + text-decoration: none; } + +.call { + position: relative; + overflow: hidden; + background-color: #f6f7ff; + border-radius: 4px; + width: 100%; + display: flex; + align-items: center; + flex-direction: row; + flex-wrap: wrap; + z-index: 2; } + @media (min-width: 576px) { + .call { + align-items: center; + flex-direction: row; + flex-wrap: wrap; } } + .call .call-box-top { + flex: 1 0 auto; + padding: 20px; } + .call .call-box-bottom { + flex: auto; + padding: 20px; + border-top: 1px solid #dde0ff; } + @media (min-width: 576px) { + .call .call-box-bottom { + flex: 0 0 auto; + border: none; } } + .call .call-name { + font-size: 1.1rem; + font-weight: bold; } + .call .call-phone { + margin-bottom: 5px; } + .call strong { + font-weight: bold; } + .call svg { + fill: white; + position: absolute; + bottom: -9px; + right: 0; + width: 100px; + height: 100px; } + @media (min-width: 576px) { + .call svg { + width: 120px; + height: 120px; } } +.title { + color: #2f2f41; + font-size: 48px; + line-height: 1.2; } + @media (min-width: 992px) { + .title { + font-size: 50px; } } +.content a { + text-decoration: underline; } + +.content img { + max-width: 100%; + height: auto; + margin-top: 20px; + margin-bottom: 20px; } + +.content strong { + font-width: bold; } + +.content em { + font-style: italic; } + +.content p { + font-family: Helvetica, Arial, sans-serif, -apple-system; + line-height: 1.56; + color: #5C5A5A; } + +.content h1 { + font-family: Helvetica, Arial, sans-serif, -apple-system; + font-size: 34px; + line-height: 1.26; + font-weight: normal; + margin-top: 30px; + margin-bottom: 20px; } + +.content h2 { + font-family: Helvetica, Arial, sans-serif, -apple-system; + font-size: 26px; + font-weight: normal; + line-height: 1.4; + margin-top: 30px; } + +.content h3 { + font-family: Helvetica, Arial, sans-serif, -apple-system; + font-size: 20px; + line-height: 1.4; + font-weight: normal; + margin-top: 30px; } + +.content ul, +.content ol { + margin-bottom: 20px; } + .content ul ul, + .content ul ol, + .content ol ul, + .content ol ol { + margin-bottom: 0; } + +.content ul { + list-style: disc; } + +.content ol { + list-style: decimal; } + +.content li { + margin-bottom: 5px; + line-height: 1.56; + margin-left: 20px; + color: #5C5A5A; } + +.content hr { + border: none; + border-bottom: 1px solid #f6f7ff; } + +.content table { + width: 100%; + margin-top: 30px; + margin-bottom: 30px; } + .content table th, + .content table td { + padding: 5px; + vertical-align: top; + border-top: 1px solid #f6f7ff; } + .content table thead th { + vertical-align: bottom; + border-bottom: 1px solid #f6f7ff; + text-align: left; + font-weight: bold; } + .content table tbody + tbody { + border-top: 1px solid #f6f7ff; } + +.content blockquote { + padding: 0 1em; + color: #5C5A5A; + border-left: 0.25em solid #f88379; } + +.intro { + display: flex; + justify-content: flex-start; + align-items: center; + padding-top: 60px; + padding-bottom: 60px; + overflow: hidden; } + @media (min-width: 768px) { + .intro { + padding-top: 140px; + padding-bottom: 140px; } } + .intro h1 { + color: #2f2f41; + font-size: 42px; + font-weight: bold; + line-height: 1.2; } + @media (min-width: 768px) { + .intro h1 { + width: 80%; + font-size: 48px; } } + @media (min-width: 992px) { + .intro h1 { + font-size: 50px; } } + .intro h2 { + width: 80%; + font-size: 1.2rem; + line-height: 1.4; + margin-bottom: 30px; + color: #2f2f41; + font-family: Helvetica, Arial, sans-serif, -apple-system; } + .intro p { + font-size: 1.2rem; + font-weight: light; + line-height: 1.5; + color: #5C5A5A; } + @media (min-width: 768px) { + .intro p { + width: 80%; } } +.intro-small { + padding-top: 100px; + padding-bottom: 30px; } + +.intro-image { + width: 100%; + height: auto; + margin-top: -40px; } + +.intro-image-absolute { + max-width: none; + padding: 0; + margin-bottom: 30px; } + @media (min-width: 768px) { + .intro-image-absolute { + position: absolute; + bottom: -50px; + left: -50px; + width: 700px; } } + @media (min-width: 992px) { + .intro-image-absolute { + bottom: -60px; + left: -60px; + width: 800px; } } + @media (min-width: 1300px) { + .intro-image-absolute { + bottom: -100px; + left: -70px; + width: 850px; } } +.intro-image-hide-mobile { + display: none; } + @media (min-width: 768px) { + .intro-image-hide-mobile { + display: block; } } +.strip { + background: white; + background-repeat: no-repeat; } + +.strip-white { + background-color: white; } + +.strip-grey { + background-color: #f6f7ff; } + +.strip-diagonal { + transform: skewY(5deg); + padding-bottom: 50px; + margin-bottom: 65px; } + .strip-diagonal > div { + transform: skewY(-5deg); } + +.strip-primary-gradient { + background-image: linear-gradient(to right, #f24088, #f88379); } + +.strip-primary-gradient-top-bottom { + background-image: linear-gradient(to bottom, #f24088, #f88379); } + +.strip-primary { + background-color: #f24088; } + +.strip-secondary { + background-color: #f88379; } + +.strip-diagonal-right { + margin-top: -100px; + transform: skewY(-5deg); + padding-bottom: 100px; } + .strip-diagonal-right > div { + transform: skewY(5deg); } + +.strip-diagonal-left { + margin-top: -100px; + transform: skewY(5deg); + padding-bottom: 100px; } + .strip-diagonal-left > div { + transform: skewY(-5deg); } + +.strip-bg-contain { + background-size: contain; } + +.strip-bg-cover { + background-size: cover; } + +.feature { + height: 100%; + border: 1px solid #f6f7ff; + border-radius: 3px; + padding: 20px; + background-color: #ffffff; + display: flex; + align-items: center; + flex-direction: column; + text-align: center; } + .feature .feature-image { + flex: 0 0 auto; + width: 80px; + height: 80px; + display: flex; + margin-bottom: 20px; + text-align: center; } + .feature img { + width: 100%; + height: auto; } + .feature .feature-content { + margin-bottom: 0; + margin-top: auto; } + +.social { + display: block; } + .social img { + width: 20px; + height: 20px; } + .social a { + padding: 10px; + display: inline-block; } + .social a:hover { + opacity: 0.8; } + +.team-summary { + display: flex; + flex-wrap: wrap; + flex-direction: row; } + .team-summary .team-image { + height: 60px; + width: 60px; + margin-right: 10px; + border-radius: 50%; + overflow: hidden; } + .team-summary .team-image img { + width: 60px; + height: auto; } + .team-summary .team-meta { + flex: 1; } + .team-summary .team-meta h2 { + margin: 0; + font-size: 22px; + font-weight: normal; } + .team-summary .team-meta p { + color: #2f2f41; + text-transform: uppercase; + margin: 0; + font-size: 12px; + font-weight: 500; } + .team-summary .team-content { + margin-top: 20px; + flex: 1 0 100%; } + +.team-summary-large { + background-color: #f6f7ff; + padding: 30px; + border-radius: 3px; } + .team-summary-large .team-image { + height: 90px; + width: 90px; + margin-right: 20px; + border-radius: 50%; + overflow: hidden; } + .team-summary-large .team-image img { + width: 90px; + height: auto; } + +.page-services-single .content > p:first-of-type { + font-size: 1.6rem; + line-height: 1.4; + margin-bottom: 40px; + font-weight: regular; + color: #686868; } + +body { + font-size: 16px; + line-height: 1.2; + font-family: Helvetica, Arial, sans-serif, -apple-system; } + @media (min-width: 768px) { + body { + font-size: 16px; + line-height: 1.3; } } + +/*# sourceMappingURL=style.css.map */
\ No newline at end of file diff --git a/exampleSite/resources/_gen/assets/scss/scss/style.scss_bcb603c6c6d8658ecadd27900cde73da.json b/exampleSite/resources/_gen/assets/scss/scss/style.scss_bcb603c6c6d8658ecadd27900cde73da.json new file mode 100644 index 0000000..28c014b --- /dev/null +++ b/exampleSite/resources/_gen/assets/scss/scss/style.scss_bcb603c6c6d8658ecadd27900cde73da.json @@ -0,0 +1 @@ +{"Target":"css/style.css","MediaType":"text/css","Data":{}}
\ No newline at end of file diff --git a/exampleSite/static/images/team/christina-wocintechchat-com-SJvDxw0azqw-unsplash.jpg b/exampleSite/static/images/team/christina-wocintechchat-com-SJvDxw0azqw-unsplash.jpg Binary files differdeleted file mode 100644 index 174d900..0000000 --- a/exampleSite/static/images/team/christina-wocintechchat-com-SJvDxw0azqw-unsplash.jpg +++ /dev/null diff --git a/exampleSite/static/images/team/christina-wocintechchat-com-z5SOVx-y3F4-unsplash.jpg b/exampleSite/static/images/team/christina-wocintechchat-com-z5SOVx-y3F4-unsplash.jpg Binary files differdeleted file mode 100644 index b725eb2..0000000 --- a/exampleSite/static/images/team/christina-wocintechchat-com-z5SOVx-y3F4-unsplash.jpg +++ /dev/null diff --git a/exampleSite/static/images/team/cristian-newman-94319-unsplash.jpg b/exampleSite/static/images/team/cristian-newman-94319-unsplash.jpg Binary files differindex ffee98f..c33c3b9 100644 --- a/exampleSite/static/images/team/cristian-newman-94319-unsplash.jpg +++ b/exampleSite/static/images/team/cristian-newman-94319-unsplash.jpg diff --git a/exampleSite/static/images/team/default.jpg b/exampleSite/static/images/team/default.jpg Binary files differdeleted file mode 100644 index 4d36876..0000000 --- a/exampleSite/static/images/team/default.jpg +++ /dev/null diff --git a/exampleSite/static/images/team/joseph-gonzalez-399972-unsplash.jpg b/exampleSite/static/images/team/joseph-gonzalez-399972-unsplash.jpg Binary files differindex be9a1d3..c47a257 100644 --- a/exampleSite/static/images/team/joseph-gonzalez-399972-unsplash.jpg +++ b/exampleSite/static/images/team/joseph-gonzalez-399972-unsplash.jpg diff --git a/exampleSite/static/images/team/lucas-sankey-378674-unsplash.jpg b/exampleSite/static/images/team/lucas-sankey-378674-unsplash.jpg Binary files differdeleted file mode 100644 index 4d36876..0000000 --- a/exampleSite/static/images/team/lucas-sankey-378674-unsplash.jpg +++ /dev/null diff --git a/exampleSite/static/images/team/michael-dam-258165-unsplash.jpg b/exampleSite/static/images/team/michael-dam-258165-unsplash.jpg Binary files differindex 666f910..fe55be5 100644 --- a/exampleSite/static/images/team/michael-dam-258165-unsplash.jpg +++ b/exampleSite/static/images/team/michael-dam-258165-unsplash.jpg diff --git a/exampleSite/static/images/team/nonsap-visuals-kMJp7620W6U-unsplash.jpg b/exampleSite/static/images/team/nonsap-visuals-kMJp7620W6U-unsplash.jpg Binary files differdeleted file mode 100644 index c686bbc..0000000 --- a/exampleSite/static/images/team/nonsap-visuals-kMJp7620W6U-unsplash.jpg +++ /dev/null diff --git a/exampleSite/static/images/team/rawpixel-330235-unsplash.jpg b/exampleSite/static/images/team/rawpixel-330235-unsplash.jpg Binary files differdeleted file mode 100644 index b82c98b..0000000 --- a/exampleSite/static/images/team/rawpixel-330235-unsplash.jpg +++ /dev/null diff --git a/exampleSite/static/images/team/smartworks-coworking-cW4lLTavU80-unsplash.jpg b/exampleSite/static/images/team/smartworks-coworking-cW4lLTavU80-unsplash.jpg Binary files differnew file mode 100644 index 0000000..e13f07f --- /dev/null +++ b/exampleSite/static/images/team/smartworks-coworking-cW4lLTavU80-unsplash.jpg diff --git a/exampleSite/static/images/team/sung-wang-g4DgCF90EM4-unsplash.jpg b/exampleSite/static/images/team/sung-wang-g4DgCF90EM4-unsplash.jpg Binary files differdeleted file mode 100644 index 560cdb5..0000000 --- a/exampleSite/static/images/team/sung-wang-g4DgCF90EM4-unsplash.jpg +++ /dev/null diff --git a/exampleSite/static/images/team/vince-fleming-613817-unsplash.jpg b/exampleSite/static/images/team/vince-fleming-613817-unsplash.jpg Binary files differindex a07ed54..8d130fc 100644 --- a/exampleSite/static/images/team/vince-fleming-613817-unsplash.jpg +++ b/exampleSite/static/images/team/vince-fleming-613817-unsplash.jpg diff --git a/layouts/404/404.html b/layouts/404.html index edd821d..edd821d 100644 --- a/layouts/404/404.html +++ b/layouts/404.html diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html index a6b7a4b..6c8cb08 100644 --- a/layouts/_default/baseof.html +++ b/layouts/_default/baseof.html @@ -4,11 +4,10 @@ <head> <meta charset="utf-8"> <meta http-equiv="x-ua-compatible" content="ie=edge"> - <title>{{ block "title" . }}{{ .Title }} - {{ .Site.Title }}{{ end }}</title> + <title>{{ block "title" . }}{{ if .Params.meta_title }}{{ .Params.meta_title }}{{ else }}{{ .Title }} - {{ .Site.Title }}{{ end }}{{ end }}</title> <meta name="viewport" content="width=device-width, initial-scale=1"> - {{ block "meta_tags" . }}{{end}} <link rel="icon" type="image/png" href="{{ "favicon-32x32.svg" | relURL }}"> - <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;700&display=swap" rel="stylesheet"> + {{ partial "google-fonts.html" . }} <!-- CSS--> {{ if .Site.IsServer }} @@ -21,6 +20,18 @@ {{ block "header_css" . }}{{ end }} + {{ block "meta_tags" . }} + {{ if .Params.description }}<meta name="description" content="{{ .Params.description }}"/>{{ end }} + {{ if .Params.meta_title }}<meta property="og:title" content="{{ .Params.meta_title }}"/>{{ else }}<meta property="og:title" content="{{ .Title }}"/>{{ end }} + <meta property="og:type" content="website"/> + <meta property="og:url" content="{{ .Permalink }}"/> + {{ if .Params.image }}<meta property="og:image" content="{{ .Params.image | absURL }}"/>{{ end }} + {{ if .Params.description }}<meta property="og:description" content="{{ .Params.description }}"/>{{ end }} + <meta name="twitter:card" content="summary"/> + {{ if .Site.Params.seo.meta_twitter_site }}<meta name="twitter:site" content="{{ .Site.Params.seo.meta_twitter_site }}"/>{{ end }} + {{ if .Site.Params.seo.meta_twitter_creator }}<meta name="twitter:creator" content="{{ .Site.Params.seo.meta_twitter_creator }}"/>{{ end }} + {{ end }} + </head> <body class='page {{ block "body_classes" . }}{{ end }}'> diff --git a/layouts/index.html b/layouts/index.html index 59fe69c..4a6f5ea 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -1,18 +1,6 @@ {{ define "title" }}{{ .Site.Title }}{{ end}} {{ define "body_classes" }}page-home{{ end }} -{{ define "meta_tags" }} -<meta name="description" content="{{ .Site.Params.homepage_meta_tags.meta_description }}" /> -<meta property="og:title" content="{{ .Site.Params.homepage_meta_tags.meta_og_title }}" /> -<meta property="og:type" content="{{ .Site.Params.homepage_meta_tags.meta_og_type }}" /> -<meta property="og:url" content="{{ .Site.Params.homepage_meta_tags.meta_og_url }}" /> -<meta property="og:image" content="{{ .Site.Params.homepage_meta_tags.meta_og_image }}" /> -<meta property="og:description" content="{{ .Site.Params.homepage_meta_tags.meta_og_description }}" /> -<meta name="twitter:card" content="{{ .Site.Params.homepage_meta_tags.meta_twitter_card }}" /> -<meta name="twitter:site" content="{{ .Site.Params.homepage_meta_tags.meta_twitter_site }}" /> -<meta name="twitter:creator" content="{{ .Site.Params.homepage_meta_tags.meta_twitter_creator }}" /> -{{ end }} - {{ define "main" }} <div class="intro"> <div class="container"> diff --git a/layouts/partials/google-fonts.html b/layouts/partials/google-fonts.html new file mode 100644 index 0000000..85a5c6b --- /dev/null +++ b/layouts/partials/google-fonts.html @@ -0,0 +1,3 @@ +<link rel="preconnect" href="https://fonts.googleapis.com"> +<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> +<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;700&display=swap" rel="stylesheet">
\ No newline at end of file diff --git a/layouts/team/summary-large.html b/layouts/team/summary-large.html index 52aca62..fb5ead8 100755 --- a/layouts/team/summary-large.html +++ b/layouts/team/summary-large.html @@ -1,7 +1,7 @@ <div class="team team-summary team-summary-large"> {{ if .Params.image }} <div class="team-image"> - <img alt="Photo of {{ .Title }}" class="img-fluid mb-2" src="{{ .Params.image | relURL }}" /> + <img width="360" height="360" alt="Photo of {{ .Title }}" class="img-fluid mb-2" src="{{ .Params.image | relURL }}" /> </div> {{ end }} <div class="team-meta"> diff --git a/layouts/team/summary.html b/layouts/team/summary.html index d913020..e1eadbf 100755 --- a/layouts/team/summary.html +++ b/layouts/team/summary.html @@ -1,7 +1,7 @@ <div class="team team-summary"> {{ if .Params.image }} <div class="team-image"> - <img alt="Photo of {{ .Title }}" class="img-fluid mb-2" src="{{ .Params.image | relURL }}" /> + <img width="360" height="360" alt="Photo of {{ .Title }}" class="img-fluid mb-2" src="{{ .Params.image | relURL }}" /> </div> {{ end }} <div class="team-meta"> diff --git a/stackbit.yaml b/stackbit.yaml deleted file mode 100644 index 5f1906b..0000000 --- a/stackbit.yaml +++ /dev/null @@ -1,347 +0,0 @@ -stackbitVersion: ~0.3.0 -ssgName: hugo -ssgVersion: '0.74.3' -buildCommand: hugo -publishDir: public -uploadDir: images -staticDir: static -pagesDir: content -dataDir: data -pageLayoutKey: null -logicFields: - - config.params.team.summary_large_truncate - - config.params.baseURL - - service.weight -models: - config: - type: config - label: Config - fields: - - type: string - name: title - label: Title - required: true - - type: string - name: baseURL - label: Base URL - description: Hostname (and path) to the root - hidden: true - - type: string - name: languageCode - label: Language Code - hidden: true - - type: string - name: themesDir - label: Themes Directory - hidden: true - - type: string - name: theme - label: Theme Name - hidden: true - - type: object - name: params - label: Params - description: Site parameters - required: true - fields: - - type: string - name: google_analytics_id - label: Google Analytics ID - - type: string - name: google_tag_manager_id - label: Google Tag Manager ID - - type: object - name: homepage - label: Homepage - fields: - - type: boolean - name: show_call_box - label: Show Callbox on Homepage? - - type: boolean - name: hide_view_all_services - label: Show View All Services button on Homepage? - - type: object - name: logo - label: Params Logo - fields: - - type: image - name: desktop - label: Logo Desktop - description: the path of the desktop logo image - required: true - - type: image - name: mobile - label: Logo Mobile - description: the path of the mobile logo image - - type: string - name: alt - label: Logo Alt Text - - type: string - name: desktop_height - label: Desktop Logo height in pixels - - type: string - name: mobile_height - label: Mobile Logo height in pixels - - type: object - name: homepage_meta_tags - label: Homepage Metatags - fields: - - type: string - name: meta_description - label: meta_description - - type: string - name: meta_og_title - label: meta_og_title - - type: string - name: meta_og_type - label: meta_og_type - - type: string - name: meta_og_url - label: meta_og_url - - type: string - name: meta_og_image - label: meta_og_image - - type: string - name: meta_og_description - label: meta_og_description - - type: string - name: meta_twitter_card - label: meta_twitter_card - - type: string - name: meta_twitter_site - label: meta_twitter_site - - type: string - name: meta_twitter_creator - label: meta_twitter_creator - - type: object - name: team - label: Team Page Params - fields: - - type: number - name: summary_large_truncate - label: Length (chars) of bio text - - type: object - name: footer - label: Footer - fields: - - type: string - name: copyright_text - label: Copyright Text - - type: model - name: menu - label: Menus - models: - - site_menus - site_menus: - type: object - label: Site Menus - description: >- - Site menus model, defines list of menus that can be specified from within - site configuration - fields: - - type: list - name: main - label: Main menu - description: List of items for Main menu - items: - type: model - models: - - site_menu_item - - type: list - name: footer - label: Footer menu - description: List of items for Footer menu - items: - type: model - models: - - site_menu_item - site_menu_item: - type: object - label: Site Menu Item - labelField: name - description: 'Site menu item model, defines fields for a single site menu item' - fields: - - type: string - name: identifier - label: Identifier - description: >- - The identifier of a menu item could be used as a parent menu of - another menu item - - type: string - name: name - label: Title - description: The title of the menu item - required: true - - type: string - name: url - label: URL - description: The URL the menu item links to - required: true - - type: number - name: weight - label: Weight - description: Position for sorting - - type: string - name: parent - label: Parent Menu Identifier - description: The parent of an entry should be the identifier of another entry. - home: - type: page - label: Home - file: _index.md - hideContent: false - singleInstance: true - fields: - - type: string - name: title - label: Title - description: The title of the page. - required: true - - type: image - name: intro_image - label: Intro Image - description: Image displayed at in the pages intro section - - type: boolean - name: intro_image_absolute - label: Overflow intro image - description: Should the image overflow or be contained - - type: boolean - name: intro_image_hide_on_mobile - label: Hide the intro image on mobile - description: Hide the intro image on mobile screen sizes - pagenotfound: - type: page - label: '404' - file: 404/_index.md - hideContent: true - singleInstance: true - fields: - - type: string - name: title - label: Title - description: The title of the page. - basicpage: - type: page - label: Basic Page - match: '*.md' - exclude: _index.md - fields: - - type: string - name: title - label: Title - description: The title of the page. - - type: date - name: date - label: Date - - type: string - name: layout - label: layout - - type: enum - name: menu - label: Menu - options: - - label: Main Menu - value: main - - label: Footer Menu - value: footer - service: - type: page - label: Service - folder: services - fields: - - type: string - name: title - label: Title - - type: date - name: date - label: Date - - type: boolean - name: draft - label: Draft - - type: boolean - name: featured - label: Featured - - type: number - name: weight - label: Weight - services: - type: page - label: Services Overview - file: services/_index.md - singleInstance: true - fields: - - type: string - name: title - label: Title - description: The title of the page. - required: true - - type: image - name: intro_image - label: Intro Image - description: Image displayed at in the pages intro section - - type: boolean - name: intro_image_absolute - label: Intro Image Position - description: Should the image overflow or be contained - - type: boolean - name: intro_image_hide_on_mobile - label: Intro Image Hide On Mobile - description: Hide the intro image on mobile screen sizes - team: - type: page - label: Team - folder: team - fields: - - type: string - name: title - label: Title - - type: date - name: date - label: Date - - type: image - name: image - label: Image - - type: string - name: jobtitle - label: Job Title - - type: string - name: linkedinurl - label: Linkedin URL - - type: string - name: Twitterhandle - label: Twitter handle - - type: boolean - name: draft - label: Draft - - type: boolean - name: featured - label: Featured - - type: number - name: weight - label: Weight - - type: boolean - name: promoted - label: Promoted - teams: - type: page - label: Team Overview - file: team/_index.md - singleInstance: true - fields: - - type: string - name: title - label: Title - description: The title of the page. - required: true - - type: image - name: intro_image - label: Intro Image - description: Image displayed at in the pages intro section - - type: boolean - name: intro_image_absolute - label: Intro Image Position - description: Should the image overflow or be contained - - type: boolean - name: intro_image_hide_on_mobile - label: Intro Image Hide On Mobile - description: Hide the intro image on mobile screen sizes |