From 56f934968d4291473583c4e7b685dc99c058ee87 Mon Sep 17 00:00:00 2001 From: Drew Varner Date: Mon, 2 Dec 2019 12:06:23 -0500 Subject: [PATCH 1/3] Port to Boostrap 4 --- exampleSite/config.toml | 19 +- layouts/_default/list.html | 25 +- layouts/partials/carousel.html | 36 +- layouts/partials/clients.html | 46 +- layouts/partials/contact.html | 2 +- layouts/partials/features.html | 4 +- layouts/partials/footer.html | 134 +- layouts/partials/head.html | 9 +- layouts/partials/map.html | 10 +- layouts/partials/nav.html | 113 +- layouts/partials/recent_posts.html | 54 +- layouts/partials/scripts.html | 20 +- layouts/partials/see_more.html | 7 +- layouts/partials/top.html | 20 +- layouts/partials/widgets/categories.html | 8 +- layouts/partials/widgets/tags.html | 6 +- static/css/animate.css | 3158 ----------- static/css/custom.css | 11 +- static/css/owl.carousel.css | 70 - static/css/owl.theme.css | 69 - static/css/style.blue.css | 6078 ++++++++++----------- static/css/style.default.css | 6132 +++++++++++----------- static/css/style.green.css | 6078 ++++++++++----------- static/css/style.lightblue.css | 3702 +++++++++++++ static/css/style.marsala.css | 6078 ++++++++++----------- static/css/style.pink.css | 6078 ++++++++++----------- static/css/style.red.css | 6078 ++++++++++----------- static/css/style.turquoise.css | 3566 ------------- static/css/style.violet.css | 6078 ++++++++++----------- static/js/front.js | 592 +-- static/js/owl.carousel.min.js | 1 - static/js/owl.carousel2.thumbs.min.js | 2 + static/js/respond.min.js | 6 - 33 files changed, 25947 insertions(+), 28343 deletions(-) delete mode 100644 static/css/animate.css delete mode 100644 static/css/owl.carousel.css delete mode 100644 static/css/owl.theme.css create mode 100644 static/css/style.lightblue.css delete mode 100644 static/css/style.turquoise.css delete mode 100644 static/js/owl.carousel.min.js create mode 100644 static/js/owl.carousel2.thumbs.min.js delete mode 100644 static/js/respond.min.js diff --git a/exampleSite/config.toml b/exampleSite/config.toml index e91ddb2c6..e3692d7e5 100644 --- a/exampleSite/config.toml +++ b/exampleSite/config.toml @@ -127,11 +127,8 @@ paginate = 10 # Enable or disable top bar with social icons [params.topbar] enable = true - text = """ - - """ + text = """

Contact us on +420 777 555 333 or hello@universal.com.

+ """ # Enable and disable widgets for the right sidebar [params.widgets] @@ -143,35 +140,35 @@ paginate = 10 enable = true # All carousel items are defined in their own files. You can find example items # at 'exampleSite/data/carousel'. - # For more informtion take a look at the README. + # For more information take a look at the README. [params.features] enable = true # All features are defined in their own files. You can find example items # at 'exampleSite/data/features'. - # For more informtion take a look at the README. + # For more information take a look at the README. [params.testimonials] enable = true # All testimonials are defined in their own files. You can find example items # at 'exampleSite/data/testimonials'. - # For more informtion take a look at the README. + # For more information take a look at the README. title = "Testimonials" subtitle = "We have worked with many clients and we always like to hear they come out from the cooperation happy and satisfied. Have a look what our clients said about us." [params.see_more] enable = true - icon = "far fa-file-alt" + icon = "far fa-file-code" title = "Do you want to see more?" subtitle = "We have prepared for you more than 40 different HTML pages, including 5 variations of homepage." link_url = "#" - link_text = "Check other homepages" + link_text = "See another homepage" [params.clients] enable = true # All clients are defined in their own files. You can find example items # at 'exampleSite/data/clients'. - # For more informtion take a look at the README. + # For more information take a look at the README. title = "Our Clients" subtitle = "" diff --git a/layouts/_default/list.html b/layouts/_default/list.html index 647dddce4..7aec0738f 100644 --- a/layouts/_default/list.html +++ b/layouts/_default/list.html @@ -17,7 +17,7 @@
-
+
-

{{ .Title }}

-
+

{{ .Title }}

+

{{ if isset .Params "author" }} {{ i18n "authorBy" }} {{ .Params.author }} {{ end }} {{ if isset .Params "categories" }} {{ if gt (len .Params.categories) 0 }} - in {{ index .Params.categories 0 }} + in {{ index .Params.categories 0 }} {{ end }} {{ end }} @@ -56,24 +55,24 @@

{{ .Title }}

{{ .Summary }}

-

{{ i18n "continueReading" }} +

{{ i18n "continueReading" }}

{{ end }} -
diff --git a/layouts/partials/carousel.html b/layouts/partials/carousel.html index e61477358..80a47a337 100644 --- a/layouts/partials/carousel.html +++ b/layouts/partials/carousel.html @@ -1,29 +1,33 @@ {{ if isset .Site.Params "carousel" }} {{ if .Site.Params.carousel.enable }} {{ if gt (len .Site.Data.carousel) 0 }} -
-
-
-
-
- {{ range sort .Site.Data.carousel "weight" }} -
-
-
-

{{ .title }}

- {{ .description | safeHTML }} -
-
- + +
+
+
+
+
+
+ {{ range sort .Site.Data.carousel "weight" }} +
+
+
+

{{ .title }}

+ {{ .description | safeHTML }} +
+
+ +
+ {{ end }}
- {{ end }} +
-
+ {{ end }} {{ end }} {{ end }} diff --git a/layouts/partials/clients.html b/layouts/partials/clients.html index fd68aeb44..adaf2c362 100644 --- a/layouts/partials/clients.html +++ b/layouts/partials/clients.html @@ -1,34 +1,30 @@ {{ if isset .Site.Params "clients" }} {{ if .Site.Params.clients.enable }} {{ if gt (len .Site.Data.clients) 0 }} -
+
-
-
-
-

{{ .Site.Params.clients.title | markdownify }}

-
+
+

{{ .Site.Params.clients.title | markdownify }}

+
-

- {{ .Site.Params.clients.subtitle | markdownify }} -

+

+ {{ .Site.Params.clients.subtitle | markdownify }} +

-
    - {{ range .Site.Data.clients }} -
  • - {{ if .url }} - - {{ .name }} - - {{ else }} - {{ .name }} - {{ end }} -
    • - {{ end }} -
- -
-
+
    + {{ range .Site.Data.clients }} +
  • + {{ if .url }} + + {{ .name }} + + {{ else }} + {{ .name }} + {{ end }} +
    • + {{ end }} +
+
{{ end }} diff --git a/layouts/partials/contact.html b/layouts/partials/contact.html index 738cfa9e9..ed1f852b0 100644 --- a/layouts/partials/contact.html +++ b/layouts/partials/contact.html @@ -3,7 +3,7 @@
-
+
{{ .Content }} diff --git a/layouts/partials/features.html b/layouts/partials/features.html index f41f2a14c..9008610e5 100644 --- a/layouts/partials/features.html +++ b/layouts/partials/features.html @@ -13,13 +13,13 @@ {{ with $element.url }} {{ end }} -
+
{{ with $element.url }} {{ end }} -

{{ $element.name | markdownify }}

+

{{ $element.name | markdownify }}

{{ $element.description | markdownify }}

diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html index f037eb41e..1ce43e113 100644 --- a/layouts/partials/footer.html +++ b/layouts/partials/footer.html @@ -1,89 +1,71 @@ -
+
+
+ {{ if isset .Site.Params "about_us" }} +
+

{{ i18n "aboutUs" }}

- {{ if isset .Site.Params "about_us" }} -
-

{{ i18n "aboutUs" }}

- - {{ .Site.Params.about_us | markdownify }} + {{ .Site.Params.about_us | markdownify }} +
+
+ + {{ end }} - +
+ {{ if isset .Site.Params "recent_posts" }} {{ if .Site.Params.recent_posts.enable }} +

{{ i18n "recentPosts" }}

+
    + {{ range first 3 (where .Site.RegularPages "Type" "in" .Site.Params.mainSections) }} +
  • +
    + {{ if isset .Params "banner" }} + {{ .Title }} + {{ else }} + {{ .Title }} + {{ end }} +
    +
    +
    {{ .Title }}
    +
    +
    • + {{ end }} + +
    + {{ end }} {{ end }} +
    + + {{ if isset .Site.Params "address" }} +
    +

    {{ i18n "contactTitle" }}

    + {{ .Site.Params.address | markdownify }} + {{ i18n "contactGoTo" }} +
    + + {{ end }}
    - - {{ end }} - -
    - - {{ if isset .Site.Params "recent_posts" }} {{ if .Site.Params.recent_posts.enable }} -

    {{ i18n "recentPosts" }}

    +
    + -
    - {{ range first 3 (where .Site.RegularPages "Type" "in" .Site.Params.mainSections) }} -
    -
    - - {{ if isset .Params "banner" }} - {{ .Title }} - {{ else }} - {{ .Title }} - {{ end }} - -
    -
    -
    {{ .Title }}
    -
    +
    +
    +
    +
    + {{ if isset .Site.Params "copyright" }} +

    {{ .Site.Params.copyright | safeHTML }}

    + {{ end }}
    - {{ end }} +
    +

    {{ i18n "templateBy" | markdownify }} Bootstrapious & Fity

    + + {{ i18n "portedBy" | markdownify }} DevCows. +

    +
    - - - {{ end }} {{ end }} - -
    - - - {{ if isset .Site.Params "address" }} -
    - -

    {{ i18n "contactTitle" }}

    - - {{ .Site.Params.address | markdownify }} - - {{ i18n "contactGoTo" }} - - -
    - - {{ end }} -
    - -
    + +
    - - - - - - - - diff --git a/layouts/partials/head.html b/layouts/partials/head.html index 8b7d655af..325ad0f8e 100644 --- a/layouts/partials/head.html +++ b/layouts/partials/head.html @@ -22,10 +22,9 @@ - + + - - {{ with .Site.Params.style }} @@ -50,8 +49,8 @@ - - + + diff --git a/layouts/partials/map.html b/layouts/partials/map.html index 8df6c234e..d684a62c0 100644 --- a/layouts/partials/map.html +++ b/layouts/partials/map.html @@ -1,13 +1,13 @@ {{ if isset .Site.Params "latitude" }} {{ if isset .Site.Params "longitude" }}
    diff --git a/layouts/partials/nav.html b/layouts/partials/nav.html index 83e7ab346..aa2007f49 100644 --- a/layouts/partials/nav.html +++ b/layouts/partials/nav.html @@ -1,65 +1,56 @@ -
    - - + diff --git a/layouts/partials/recent_posts.html b/layouts/partials/recent_posts.html index b48296699..2320b3675 100644 --- a/layouts/partials/recent_posts.html +++ b/layouts/partials/recent_posts.html @@ -1,8 +1,7 @@ {{ if isset .Site.Params "recent_posts" }} {{ if .Site.Params.recent_posts.enable }} -
    +
    -

    {{ .Site.Params.recent_posts.title | markdownify }}

    @@ -17,36 +16,31 @@

    {{ .Site.Params.recent_posts.title | markdownify }}

    {{ $posts := .Paginate (where site.RegularPages "Type" "in" site.Params.mainSections) }} {{ range first 4 $posts.Pages }} -
    -
    -
    -
    - {{ if isset .Params "banner" }} - - {{ else }} - - {{ end }} -
    -
    -
    -

    - {{ i18n "readMore" }} -

    +
    +
    +
    + {{ if isset .Params "banner" }} + + {{ else }} + + {{ end }} +
    + + + {{ i18n "readMore" }} +
    - -
    -

    {{ .Title }}

    -

    - {{ with .Params.author }} - {{ i18n "authorBy" }} {{ . }} - {{ end }} - {{ i18n "publishedOn" }} {{ .Date.Format .Site.Params.date_format }} -

    -

    {{ .Summary }}

    -

    - {{ i18n "continueReading" }} -

    +
    +

    {{ .Title }}

    +

    + {{ with .Params.author }} + {{ i18n "authorBy" }} {{ . }} + {{ end }} + {{ i18n "publishedOn" }} {{ .Date.Format .Site.Params.date_format }} +

    +

    {{ .Summary }}

    + {{ i18n "continueReading" }}
    diff --git a/layouts/partials/scripts.html b/layouts/partials/scripts.html index 5b064fbc8..0b65f498e 100644 --- a/layouts/partials/scripts.html +++ b/layouts/partials/scripts.html @@ -1,20 +1,26 @@ {{ template "_internal/google_analytics.html" . }} - - + + + + + + + + {{ if .Site.Params.googleMapsApiKey }} {{ else }} {{ end }} - - - + + + + - - + diff --git a/layouts/partials/see_more.html b/layouts/partials/see_more.html index 437d9d859..a727c098e 100644 --- a/layouts/partials/see_more.html +++ b/layouts/partials/see_more.html @@ -1,17 +1,16 @@ {{ if isset .Site.Params "see_more" }} {{ if .Site.Params.see_more.enable }} -
    +
    -
    -
    +

    {{ .Site.Params.see_more.title | markdownify }}

    {{ .Site.Params.see_more.subtitle | markdownify }}

    {{ with .Site.Params.see_more.link_url }} - + {{ end }} {{ with .Site.Params.see_more.link_text }} {{ . | markdownify }} diff --git a/layouts/partials/top.html b/layouts/partials/top.html index 441944b1e..72920bfcb 100644 --- a/layouts/partials/top.html +++ b/layouts/partials/top.html @@ -1,18 +1,22 @@ {{ if .Site.Params.topbar.enable }} -

    + +
    -
    -
    +
    +
    {{ .Site.Params.topbar.text | safeHTML }}
    -
    -
    + {{ end }} diff --git a/layouts/partials/widgets/categories.html b/layouts/partials/widgets/categories.html index 52fed98cd..ed60c936d 100644 --- a/layouts/partials/widgets/categories.html +++ b/layouts/partials/widgets/categories.html @@ -4,15 +4,15 @@
    -

    {{ i18n "categoriesTitle" }}

    +

    {{ i18n "categoriesTitle" }}

    -
      + diff --git a/layouts/partials/widgets/tags.html b/layouts/partials/widgets/tags.html index d6aa383b8..838c15f6c 100644 --- a/layouts/partials/widgets/tags.html +++ b/layouts/partials/widgets/tags.html @@ -8,11 +8,11 @@

      {{ i18n "tagsTitle" }}

    -
      +
        {{ $current := . }} {{ range $name, $items := .Site.Taxonomies.tags }} - - {{ $name }} +
      • + {{ $name }}
        • {{ end }}
      diff --git a/static/css/animate.css b/static/css/animate.css deleted file mode 100644 index f784ce8f6..000000000 --- a/static/css/animate.css +++ /dev/null @@ -1,3158 +0,0 @@ -@charset "UTF-8"; -/*! -Animate.css - http://daneden.me/animate -Licensed under the MIT license - http://opensource.org/licenses/MIT - -Copyright (c) 2014 Daniel Eden -*/ - -.animated { - -webkit-animation-duration: 1s; - animation-duration: 1s; - -webkit-animation-fill-mode: both; - animation-fill-mode: both; -} - -.animated.infinite { - -webkit-animation-iteration-count: infinite; - animation-iteration-count: infinite; -} - -.animated.hinge { - -webkit-animation-duration: 2s; - animation-duration: 2s; -} - -@-webkit-keyframes bounce { - 0%, 20%, 53%, 80%, 100% { - -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); - transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); - -webkit-transform: translate3d(0,0,0); - transform: translate3d(0,0,0); - } - - 40%, 43% { - -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); - transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); - -webkit-transform: translate3d(0, -30px, 0); - transform: translate3d(0, -30px, 0); - } - - 70% { - -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); - transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); - -webkit-transform: translate3d(0, -15px, 0); - transform: translate3d(0, -15px, 0); - } - - 90% { - -webkit-transform: translate3d(0,-4px,0); - transform: translate3d(0,-4px,0); - } -} - -@keyframes bounce { - 0%, 20%, 53%, 80%, 100% { - -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); - transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); - -webkit-transform: translate3d(0,0,0); - transform: translate3d(0,0,0); - } - - 40%, 43% { - -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); - transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); - -webkit-transform: translate3d(0, -30px, 0); - transform: translate3d(0, -30px, 0); - } - - 70% { - -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); - transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); - -webkit-transform: translate3d(0, -15px, 0); - transform: translate3d(0, -15px, 0); - } - - 90% { - -webkit-transform: translate3d(0,-4px,0); - transform: translate3d(0,-4px,0); - } -} - -.bounce { - -webkit-animation-name: bounce; - animation-name: bounce; - -webkit-transform-origin: center bottom; - -ms-transform-origin: center bottom; - transform-origin: center bottom; -} - -@-webkit-keyframes flash { - 0%, 50%, 100% { - opacity: 1; - } - - 25%, 75% { - opacity: 0; - } -} - -@keyframes flash { - 0%, 50%, 100% { - opacity: 1; - } - - 25%, 75% { - opacity: 0; - } -} - -.flash { - -webkit-animation-name: flash; - animation-name: flash; -} - -/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ - -@-webkit-keyframes pulse { - 0% { - -webkit-transform: scale3d(1, 1, 1); - transform: scale3d(1, 1, 1); - } - - 50% { - -webkit-transform: scale3d(1.05, 1.05, 1.05); - transform: scale3d(1.05, 1.05, 1.05); - } - - 100% { - -webkit-transform: scale3d(1, 1, 1); - transform: scale3d(1, 1, 1); - } -} - -@keyframes pulse { - 0% { - -webkit-transform: scale3d(1, 1, 1); - transform: scale3d(1, 1, 1); - } - - 50% { - -webkit-transform: scale3d(1.05, 1.05, 1.05); - transform: scale3d(1.05, 1.05, 1.05); - } - - 100% { - -webkit-transform: scale3d(1, 1, 1); - transform: scale3d(1, 1, 1); - } -} - -.pulse { - -webkit-animation-name: pulse; - animation-name: pulse; -} - -@-webkit-keyframes rubberBand { - 0% { - -webkit-transform: scale3d(1, 1, 1); - transform: scale3d(1, 1, 1); - } - - 30% { - -webkit-transform: scale3d(1.25, 0.75, 1); - transform: scale3d(1.25, 0.75, 1); - } - - 40% { - -webkit-transform: scale3d(0.75, 1.25, 1); - transform: scale3d(0.75, 1.25, 1); - } - - 50% { - -webkit-transform: scale3d(1.15, 0.85, 1); - transform: scale3d(1.15, 0.85, 1); - } - - 65% { - -webkit-transform: scale3d(.95, 1.05, 1); - transform: scale3d(.95, 1.05, 1); - } - - 75% { - -webkit-transform: scale3d(1.05, .95, 1); - transform: scale3d(1.05, .95, 1); - } - - 100% { - -webkit-transform: scale3d(1, 1, 1); - transform: scale3d(1, 1, 1); - } -} - -@keyframes rubberBand { - 0% { - -webkit-transform: scale3d(1, 1, 1); - transform: scale3d(1, 1, 1); - } - - 30% { - -webkit-transform: scale3d(1.25, 0.75, 1); - transform: scale3d(1.25, 0.75, 1); - } - - 40% { - -webkit-transform: scale3d(0.75, 1.25, 1); - transform: scale3d(0.75, 1.25, 1); - } - - 50% { - -webkit-transform: scale3d(1.15, 0.85, 1); - transform: scale3d(1.15, 0.85, 1); - } - - 65% { - -webkit-transform: scale3d(.95, 1.05, 1); - transform: scale3d(.95, 1.05, 1); - } - - 75% { - -webkit-transform: scale3d(1.05, .95, 1); - transform: scale3d(1.05, .95, 1); - } - - 100% { - -webkit-transform: scale3d(1, 1, 1); - transform: scale3d(1, 1, 1); - } -} - -.rubberBand { - -webkit-animation-name: rubberBand; - animation-name: rubberBand; -} - -@-webkit-keyframes shake { - 0%, 100% { - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); - } - - 10%, 30%, 50%, 70%, 90% { - -webkit-transform: translate3d(-10px, 0, 0); - transform: translate3d(-10px, 0, 0); - } - - 20%, 40%, 60%, 80% { - -webkit-transform: translate3d(10px, 0, 0); - transform: translate3d(10px, 0, 0); - } -} - -@keyframes shake { - 0%, 100% { - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); - } - - 10%, 30%, 50%, 70%, 90% { - -webkit-transform: translate3d(-10px, 0, 0); - transform: translate3d(-10px, 0, 0); - } - - 20%, 40%, 60%, 80% { - -webkit-transform: translate3d(10px, 0, 0); - transform: translate3d(10px, 0, 0); - } -} - -.shake { - -webkit-animation-name: shake; - animation-name: shake; -} - -@-webkit-keyframes swing { - 20% { - -webkit-transform: rotate3d(0, 0, 1, 15deg); - transform: rotate3d(0, 0, 1, 15deg); - } - - 40% { - -webkit-transform: rotate3d(0, 0, 1, -10deg); - transform: rotate3d(0, 0, 1, -10deg); - } - - 60% { - -webkit-transform: rotate3d(0, 0, 1, 5deg); - transform: rotate3d(0, 0, 1, 5deg); - } - - 80% { - -webkit-transform: rotate3d(0, 0, 1, -5deg); - transform: rotate3d(0, 0, 1, -5deg); - } - - 100% { - -webkit-transform: rotate3d(0, 0, 1, 0deg); - transform: rotate3d(0, 0, 1, 0deg); - } -} - -@keyframes swing { - 20% { - -webkit-transform: rotate3d(0, 0, 1, 15deg); - transform: rotate3d(0, 0, 1, 15deg); - } - - 40% { - -webkit-transform: rotate3d(0, 0, 1, -10deg); - transform: rotate3d(0, 0, 1, -10deg); - } - - 60% { - -webkit-transform: rotate3d(0, 0, 1, 5deg); - transform: rotate3d(0, 0, 1, 5deg); - } - - 80% { - -webkit-transform: rotate3d(0, 0, 1, -5deg); - transform: rotate3d(0, 0, 1, -5deg); - } - - 100% { - -webkit-transform: rotate3d(0, 0, 1, 0deg); - transform: rotate3d(0, 0, 1, 0deg); - } -} - -.swing { - -webkit-transform-origin: top center; - -ms-transform-origin: top center; - transform-origin: top center; - -webkit-animation-name: swing; - animation-name: swing; -} - -@-webkit-keyframes tada { - 0% { - -webkit-transform: scale3d(1, 1, 1); - transform: scale3d(1, 1, 1); - } - - 10%, 20% { - -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); - transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); - } - - 30%, 50%, 70%, 90% { - -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); - transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); - } - - 40%, 60%, 80% { - -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); - transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); - } - - 100% { - -webkit-transform: scale3d(1, 1, 1); - transform: scale3d(1, 1, 1); - } -} - -@keyframes tada { - 0% { - -webkit-transform: scale3d(1, 1, 1); - transform: scale3d(1, 1, 1); - } - - 10%, 20% { - -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); - transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); - } - - 30%, 50%, 70%, 90% { - -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); - transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); - } - - 40%, 60%, 80% { - -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); - transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); - } - - 100% { - -webkit-transform: scale3d(1, 1, 1); - transform: scale3d(1, 1, 1); - } -} - -.tada { - -webkit-animation-name: tada; - animation-name: tada; -} - -/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ - -@-webkit-keyframes wobble { - 0% { - -webkit-transform: none; - transform: none; - } - - 15% { - -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); - transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); - } - - 30% { - -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); - transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); - } - - 45% { - -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); - transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); - } - - 60% { - -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); - transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); - } - - 75% { - -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); - transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); - } - - 100% { - -webkit-transform: none; - transform: none; - } -} - -@keyframes wobble { - 0% { - -webkit-transform: none; - transform: none; - } - - 15% { - -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); - transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); - } - - 30% { - -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); - transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); - } - - 45% { - -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); - transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); - } - - 60% { - -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); - transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); - } - - 75% { - -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); - transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); - } - - 100% { - -webkit-transform: none; - transform: none; - } -} - -.wobble { - -webkit-animation-name: wobble; - animation-name: wobble; -} - -@-webkit-keyframes bounceIn { - 0%, 20%, 40%, 60%, 80%, 100% { - -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); - transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); - } - - 0% { - opacity: 0; - -webkit-transform: scale3d(.3, .3, .3); - transform: scale3d(.3, .3, .3); - } - - 20% { - -webkit-transform: scale3d(1.1, 1.1, 1.1); - transform: scale3d(1.1, 1.1, 1.1); - } - - 40% { - -webkit-transform: scale3d(.9, .9, .9); - transform: scale3d(.9, .9, .9); - } - - 60% { - opacity: 1; - -webkit-transform: scale3d(1.03, 1.03, 1.03); - transform: scale3d(1.03, 1.03, 1.03); - } - - 80% { - -webkit-transform: scale3d(.97, .97, .97); - transform: scale3d(.97, .97, .97); - } - - 100% { - opacity: 1; - -webkit-transform: scale3d(1, 1, 1); - transform: scale3d(1, 1, 1); - } -} - -@keyframes bounceIn { - 0%, 20%, 40%, 60%, 80%, 100% { - -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); - transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); - } - - 0% { - opacity: 0; - -webkit-transform: scale3d(.3, .3, .3); - transform: scale3d(.3, .3, .3); - } - - 20% { - -webkit-transform: scale3d(1.1, 1.1, 1.1); - transform: scale3d(1.1, 1.1, 1.1); - } - - 40% { - -webkit-transform: scale3d(.9, .9, .9); - transform: scale3d(.9, .9, .9); - } - - 60% { - opacity: 1; - -webkit-transform: scale3d(1.03, 1.03, 1.03); - transform: scale3d(1.03, 1.03, 1.03); - } - - 80% { - -webkit-transform: scale3d(.97, .97, .97); - transform: scale3d(.97, .97, .97); - } - - 100% { - opacity: 1; - -webkit-transform: scale3d(1, 1, 1); - transform: scale3d(1, 1, 1); - } -} - -.bounceIn { - -webkit-animation-name: bounceIn; - animation-name: bounceIn; - -webkit-animation-duration: .75s; - animation-duration: .75s; -} - -@-webkit-keyframes bounceInDown { - 0%, 60%, 75%, 90%, 100% { - -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); - transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); - } - - 0% { - opacity: 0; - -webkit-transform: translate3d(0, -3000px, 0); - transform: translate3d(0, -3000px, 0); - } - - 60% { - opacity: 1; - -webkit-transform: translate3d(0, 25px, 0); - transform: translate3d(0, 25px, 0); - } - - 75% { - -webkit-transform: translate3d(0, -10px, 0); - transform: translate3d(0, -10px, 0); - } - - 90% { - -webkit-transform: translate3d(0, 5px, 0); - transform: translate3d(0, 5px, 0); - } - - 100% { - -webkit-transform: none; - transform: none; - } -} - -@keyframes bounceInDown { - 0%, 60%, 75%, 90%, 100% { - -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); - transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); - } - - 0% { - opacity: 0; - -webkit-transform: translate3d(0, -3000px, 0); - transform: translate3d(0, -3000px, 0); - } - - 60% { - opacity: 1; - -webkit-transform: translate3d(0, 25px, 0); - transform: translate3d(0, 25px, 0); - } - - 75% { - -webkit-transform: translate3d(0, -10px, 0); - transform: translate3d(0, -10px, 0); - } - - 90% { - -webkit-transform: translate3d(0, 5px, 0); - transform: translate3d(0, 5px, 0); - } - - 100% { - -webkit-transform: none; - transform: none; - } -} - -.bounceInDown { - -webkit-animation-name: bounceInDown; - animation-name: bounceInDown; -} - -@-webkit-keyframes bounceInLeft { - 0%, 60%, 75%, 90%, 100% { - -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); - transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); - } - - 0% { - opacity: 0; - -webkit-transform: translate3d(-3000px, 0, 0); - transform: translate3d(-3000px, 0, 0); - } - - 60% { - opacity: 1; - -webkit-transform: translate3d(25px, 0, 0); - transform: translate3d(25px, 0, 0); - } - - 75% { - -webkit-transform: translate3d(-10px, 0, 0); - transform: translate3d(-10px, 0, 0); - } - - 90% { - -webkit-transform: translate3d(5px, 0, 0); - transform: translate3d(5px, 0, 0); - } - - 100% { - -webkit-transform: none; - transform: none; - } -} - -@keyframes bounceInLeft { - 0%, 60%, 75%, 90%, 100% { - -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); - transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); - } - - 0% { - opacity: 0; - -webkit-transform: translate3d(-3000px, 0, 0); - transform: translate3d(-3000px, 0, 0); - } - - 60% { - opacity: 1; - -webkit-transform: translate3d(25px, 0, 0); - transform: translate3d(25px, 0, 0); - } - - 75% { - -webkit-transform: translate3d(-10px, 0, 0); - transform: translate3d(-10px, 0, 0); - } - - 90% { - -webkit-transform: translate3d(5px, 0, 0); - transform: translate3d(5px, 0, 0); - } - - 100% { - -webkit-transform: none; - transform: none; - } -} - -.bounceInLeft { - -webkit-animation-name: bounceInLeft; - animation-name: bounceInLeft; -} - -@-webkit-keyframes bounceInRight { - 0%, 60%, 75%, 90%, 100% { - -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); - transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); - } - - 0% { - opacity: 0; - -webkit-transform: translate3d(3000px, 0, 0); - transform: translate3d(3000px, 0, 0); - } - - 60% { - opacity: 1; - -webkit-transform: translate3d(-25px, 0, 0); - transform: translate3d(-25px, 0, 0); - } - - 75% { - -webkit-transform: translate3d(10px, 0, 0); - transform: translate3d(10px, 0, 0); - } - - 90% { - -webkit-transform: translate3d(-5px, 0, 0); - transform: translate3d(-5px, 0, 0); - } - - 100% { - -webkit-transform: none; - transform: none; - } -} - -@keyframes bounceInRight { - 0%, 60%, 75%, 90%, 100% { - -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); - transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); - } - - 0% { - opacity: 0; - -webkit-transform: translate3d(3000px, 0, 0); - transform: translate3d(3000px, 0, 0); - } - - 60% { - opacity: 1; - -webkit-transform: translate3d(-25px, 0, 0); - transform: translate3d(-25px, 0, 0); - } - - 75% { - -webkit-transform: translate3d(10px, 0, 0); - transform: translate3d(10px, 0, 0); - } - - 90% { - -webkit-transform: translate3d(-5px, 0, 0); - transform: translate3d(-5px, 0, 0); - } - - 100% { - -webkit-transform: none; - transform: none; - } -} - -.bounceInRight { - -webkit-animation-name: bounceInRight; - animation-name: bounceInRight; -} - -@-webkit-keyframes bounceInUp { - 0%, 60%, 75%, 90%, 100% { - -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); - transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); - } - - 0% { - opacity: 0; - -webkit-transform: translate3d(0, 3000px, 0); - transform: translate3d(0, 3000px, 0); - } - - 60% { - opacity: 1; - -webkit-transform: translate3d(0, -20px, 0); - transform: translate3d(0, -20px, 0); - } - - 75% { - -webkit-transform: translate3d(0, 10px, 0); - transform: translate3d(0, 10px, 0); - } - - 90% { - -webkit-transform: translate3d(0, -5px, 0); - transform: translate3d(0, -5px, 0); - } - - 100% { - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); - } -} - -@keyframes bounceInUp { - 0%, 60%, 75%, 90%, 100% { - -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); - transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); - } - - 0% { - opacity: 0; - -webkit-transform: translate3d(0, 3000px, 0); - transform: translate3d(0, 3000px, 0); - } - - 60% { - opacity: 1; - -webkit-transform: translate3d(0, -20px, 0); - transform: translate3d(0, -20px, 0); - } - - 75% { - -webkit-transform: translate3d(0, 10px, 0); - transform: translate3d(0, 10px, 0); - } - - 90% { - -webkit-transform: translate3d(0, -5px, 0); - transform: translate3d(0, -5px, 0); - } - - 100% { - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); - } -} - -.bounceInUp { - -webkit-animation-name: bounceInUp; - animation-name: bounceInUp; -} - -@-webkit-keyframes bounceOut { - 20% { - -webkit-transform: scale3d(.9, .9, .9); - transform: scale3d(.9, .9, .9); - } - - 50%, 55% { - opacity: 1; - -webkit-transform: scale3d(1.1, 1.1, 1.1); - transform: scale3d(1.1, 1.1, 1.1); - } - - 100% { - opacity: 0; - -webkit-transform: scale3d(.3, .3, .3); - transform: scale3d(.3, .3, .3); - } -} - -@keyframes bounceOut { - 20% { - -webkit-transform: scale3d(.9, .9, .9); - transform: scale3d(.9, .9, .9); - } - - 50%, 55% { - opacity: 1; - -webkit-transform: scale3d(1.1, 1.1, 1.1); - transform: scale3d(1.1, 1.1, 1.1); - } - - 100% { - opacity: 0; - -webkit-transform: scale3d(.3, .3, .3); - transform: scale3d(.3, .3, .3); - } -} - -.bounceOut { - -webkit-animation-name: bounceOut; - animation-name: bounceOut; - -webkit-animation-duration: .75s; - animation-duration: .75s; -} - -@-webkit-keyframes bounceOutDown { - 20% { - -webkit-transform: translate3d(0, 10px, 0); - transform: translate3d(0, 10px, 0); - } - - 40%, 45% { - opacity: 1; - -webkit-transform: translate3d(0, -20px, 0); - transform: translate3d(0, -20px, 0); - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(0, 2000px, 0); - transform: translate3d(0, 2000px, 0); - } -} - -@keyframes bounceOutDown { - 20% { - -webkit-transform: translate3d(0, 10px, 0); - transform: translate3d(0, 10px, 0); - } - - 40%, 45% { - opacity: 1; - -webkit-transform: translate3d(0, -20px, 0); - transform: translate3d(0, -20px, 0); - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(0, 2000px, 0); - transform: translate3d(0, 2000px, 0); - } -} - -.bounceOutDown { - -webkit-animation-name: bounceOutDown; - animation-name: bounceOutDown; -} - -@-webkit-keyframes bounceOutLeft { - 20% { - opacity: 1; - -webkit-transform: translate3d(20px, 0, 0); - transform: translate3d(20px, 0, 0); - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(-2000px, 0, 0); - transform: translate3d(-2000px, 0, 0); - } -} - -@keyframes bounceOutLeft { - 20% { - opacity: 1; - -webkit-transform: translate3d(20px, 0, 0); - transform: translate3d(20px, 0, 0); - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(-2000px, 0, 0); - transform: translate3d(-2000px, 0, 0); - } -} - -.bounceOutLeft { - -webkit-animation-name: bounceOutLeft; - animation-name: bounceOutLeft; -} - -@-webkit-keyframes bounceOutRight { - 20% { - opacity: 1; - -webkit-transform: translate3d(-20px, 0, 0); - transform: translate3d(-20px, 0, 0); - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(2000px, 0, 0); - transform: translate3d(2000px, 0, 0); - } -} - -@keyframes bounceOutRight { - 20% { - opacity: 1; - -webkit-transform: translate3d(-20px, 0, 0); - transform: translate3d(-20px, 0, 0); - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(2000px, 0, 0); - transform: translate3d(2000px, 0, 0); - } -} - -.bounceOutRight { - -webkit-animation-name: bounceOutRight; - animation-name: bounceOutRight; -} - -@-webkit-keyframes bounceOutUp { - 20% { - -webkit-transform: translate3d(0, -10px, 0); - transform: translate3d(0, -10px, 0); - } - - 40%, 45% { - opacity: 1; - -webkit-transform: translate3d(0, 20px, 0); - transform: translate3d(0, 20px, 0); - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(0, -2000px, 0); - transform: translate3d(0, -2000px, 0); - } -} - -@keyframes bounceOutUp { - 20% { - -webkit-transform: translate3d(0, -10px, 0); - transform: translate3d(0, -10px, 0); - } - - 40%, 45% { - opacity: 1; - -webkit-transform: translate3d(0, 20px, 0); - transform: translate3d(0, 20px, 0); - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(0, -2000px, 0); - transform: translate3d(0, -2000px, 0); - } -} - -.bounceOutUp { - -webkit-animation-name: bounceOutUp; - animation-name: bounceOutUp; -} - -@-webkit-keyframes fadeIn { - 0% {opacity: 0;} - 100% {opacity: 1;} -} - -@keyframes fadeIn { - 0% {opacity: 0;} - 100% {opacity: 1;} -} - -.fadeIn { - -webkit-animation-name: fadeIn; - animation-name: fadeIn; -} - -@-webkit-keyframes fadeInDown { - 0% { - opacity: 0; - -webkit-transform: translate3d(0, -100%, 0); - transform: translate3d(0, -100%, 0); - } - - 100% { - opacity: 1; - -webkit-transform: none; - transform: none; - } -} - -@keyframes fadeInDown { - 0% { - opacity: 0; - -webkit-transform: translate3d(0, -100%, 0); - transform: translate3d(0, -100%, 0); - } - - 100% { - opacity: 1; - -webkit-transform: none; - transform: none; - } -} - -.fadeInDown { - -webkit-animation-name: fadeInDown; - animation-name: fadeInDown; -} - -@-webkit-keyframes fadeInDownBig { - 0% { - opacity: 0; - -webkit-transform: translate3d(0, -2000px, 0); - transform: translate3d(0, -2000px, 0); - } - - 100% { - opacity: 1; - -webkit-transform: none; - transform: none; - } -} - -@keyframes fadeInDownBig { - 0% { - opacity: 0; - -webkit-transform: translate3d(0, -2000px, 0); - transform: translate3d(0, -2000px, 0); - } - - 100% { - opacity: 1; - -webkit-transform: none; - transform: none; - } -} - -.fadeInDownBig { - -webkit-animation-name: fadeInDownBig; - animation-name: fadeInDownBig; -} - -@-webkit-keyframes fadeInLeft { - 0% { - opacity: 0; - -webkit-transform: translate3d(-100%, 0, 0); - transform: translate3d(-100%, 0, 0); - } - - 100% { - opacity: 1; - -webkit-transform: none; - transform: none; - } -} - -@keyframes fadeInLeft { - 0% { - opacity: 0; - -webkit-transform: translate3d(-100%, 0, 0); - transform: translate3d(-100%, 0, 0); - } - - 100% { - opacity: 1; - -webkit-transform: none; - transform: none; - } -} - -.fadeInLeft { - -webkit-animation-name: fadeInLeft; - animation-name: fadeInLeft; -} - -@-webkit-keyframes fadeInLeftBig { - 0% { - opacity: 0; - -webkit-transform: translate3d(-2000px, 0, 0); - transform: translate3d(-2000px, 0, 0); - } - - 100% { - opacity: 1; - -webkit-transform: none; - transform: none; - } -} - -@keyframes fadeInLeftBig { - 0% { - opacity: 0; - -webkit-transform: translate3d(-2000px, 0, 0); - transform: translate3d(-2000px, 0, 0); - } - - 100% { - opacity: 1; - -webkit-transform: none; - transform: none; - } -} - -.fadeInLeftBig { - -webkit-animation-name: fadeInLeftBig; - animation-name: fadeInLeftBig; -} - -@-webkit-keyframes fadeInRight { - 0% { - opacity: 0; - -webkit-transform: translate3d(100%, 0, 0); - transform: translate3d(100%, 0, 0); - } - - 100% { - opacity: 1; - -webkit-transform: none; - transform: none; - } -} - -@keyframes fadeInRight { - 0% { - opacity: 0; - -webkit-transform: translate3d(100%, 0, 0); - transform: translate3d(100%, 0, 0); - } - - 100% { - opacity: 1; - -webkit-transform: none; - transform: none; - } -} - -.fadeInRight { - -webkit-animation-name: fadeInRight; - animation-name: fadeInRight; -} - -@-webkit-keyframes fadeInRightBig { - 0% { - opacity: 0; - -webkit-transform: translate3d(2000px, 0, 0); - transform: translate3d(2000px, 0, 0); - } - - 100% { - opacity: 1; - -webkit-transform: none; - transform: none; - } -} - -@keyframes fadeInRightBig { - 0% { - opacity: 0; - -webkit-transform: translate3d(2000px, 0, 0); - transform: translate3d(2000px, 0, 0); - } - - 100% { - opacity: 1; - -webkit-transform: none; - transform: none; - } -} - -.fadeInRightBig { - -webkit-animation-name: fadeInRightBig; - animation-name: fadeInRightBig; -} - -@-webkit-keyframes fadeInUp { - 0% { - opacity: 0; - -webkit-transform: translate3d(0, 100%, 0); - transform: translate3d(0, 100%, 0); - } - - 100% { - opacity: 1; - -webkit-transform: none; - transform: none; - } -} - -@keyframes fadeInUp { - 0% { - opacity: 0; - -webkit-transform: translate3d(0, 100%, 0); - transform: translate3d(0, 100%, 0); - } - - 100% { - opacity: 1; - -webkit-transform: none; - transform: none; - } -} - -.fadeInUp { - -webkit-animation-name: fadeInUp; - animation-name: fadeInUp; -} - -@-webkit-keyframes fadeInUpBig { - 0% { - opacity: 0; - -webkit-transform: translate3d(0, 2000px, 0); - transform: translate3d(0, 2000px, 0); - } - - 100% { - opacity: 1; - -webkit-transform: none; - transform: none; - } -} - -@keyframes fadeInUpBig { - 0% { - opacity: 0; - -webkit-transform: translate3d(0, 2000px, 0); - transform: translate3d(0, 2000px, 0); - } - - 100% { - opacity: 1; - -webkit-transform: none; - transform: none; - } -} - -.fadeInUpBig { - -webkit-animation-name: fadeInUpBig; - animation-name: fadeInUpBig; -} - -@-webkit-keyframes fadeOut { - 0% {opacity: 1;} - 100% {opacity: 0;} -} - -@keyframes fadeOut { - 0% {opacity: 1;} - 100% {opacity: 0;} -} - -.fadeOut { - -webkit-animation-name: fadeOut; - animation-name: fadeOut; -} - -@-webkit-keyframes fadeOutDown { - 0% { - opacity: 1; - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(0, 100%, 0); - transform: translate3d(0, 100%, 0); - } -} - -@keyframes fadeOutDown { - 0% { - opacity: 1; - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(0, 100%, 0); - transform: translate3d(0, 100%, 0); - } -} - -.fadeOutDown { - -webkit-animation-name: fadeOutDown; - animation-name: fadeOutDown; -} - -@-webkit-keyframes fadeOutDownBig { - 0% { - opacity: 1; - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(0, 2000px, 0); - transform: translate3d(0, 2000px, 0); - } -} - -@keyframes fadeOutDownBig { - 0% { - opacity: 1; - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(0, 2000px, 0); - transform: translate3d(0, 2000px, 0); - } -} - -.fadeOutDownBig { - -webkit-animation-name: fadeOutDownBig; - animation-name: fadeOutDownBig; -} - -@-webkit-keyframes fadeOutLeft { - 0% { - opacity: 1; - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(-100%, 0, 0); - transform: translate3d(-100%, 0, 0); - } -} - -@keyframes fadeOutLeft { - 0% { - opacity: 1; - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(-100%, 0, 0); - transform: translate3d(-100%, 0, 0); - } -} - -.fadeOutLeft { - -webkit-animation-name: fadeOutLeft; - animation-name: fadeOutLeft; -} - -@-webkit-keyframes fadeOutLeftBig { - 0% { - opacity: 1; - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(-2000px, 0, 0); - transform: translate3d(-2000px, 0, 0); - } -} - -@keyframes fadeOutLeftBig { - 0% { - opacity: 1; - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(-2000px, 0, 0); - transform: translate3d(-2000px, 0, 0); - } -} - -.fadeOutLeftBig { - -webkit-animation-name: fadeOutLeftBig; - animation-name: fadeOutLeftBig; -} - -@-webkit-keyframes fadeOutRight { - 0% { - opacity: 1; - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(100%, 0, 0); - transform: translate3d(100%, 0, 0); - } -} - -@keyframes fadeOutRight { - 0% { - opacity: 1; - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(100%, 0, 0); - transform: translate3d(100%, 0, 0); - } -} - -.fadeOutRight { - -webkit-animation-name: fadeOutRight; - animation-name: fadeOutRight; -} - -@-webkit-keyframes fadeOutRightBig { - 0% { - opacity: 1; - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(2000px, 0, 0); - transform: translate3d(2000px, 0, 0); - } -} - -@keyframes fadeOutRightBig { - 0% { - opacity: 1; - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(2000px, 0, 0); - transform: translate3d(2000px, 0, 0); - } -} - -.fadeOutRightBig { - -webkit-animation-name: fadeOutRightBig; - animation-name: fadeOutRightBig; -} - -@-webkit-keyframes fadeOutUp { - 0% { - opacity: 1; - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(0, -100%, 0); - transform: translate3d(0, -100%, 0); - } -} - -@keyframes fadeOutUp { - 0% { - opacity: 1; - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(0, -100%, 0); - transform: translate3d(0, -100%, 0); - } -} - -.fadeOutUp { - -webkit-animation-name: fadeOutUp; - animation-name: fadeOutUp; -} - -@-webkit-keyframes fadeOutUpBig { - 0% { - opacity: 1; - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(0, -2000px, 0); - transform: translate3d(0, -2000px, 0); - } -} - -@keyframes fadeOutUpBig { - 0% { - opacity: 1; - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(0, -2000px, 0); - transform: translate3d(0, -2000px, 0); - } -} - -.fadeOutUpBig { - -webkit-animation-name: fadeOutUpBig; - animation-name: fadeOutUpBig; -} - -@-webkit-keyframes flip { - 0% { - -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg); - transform: perspective(400px) rotate3d(0, 1, 0, -360deg); - -webkit-animation-timing-function: ease-out; - animation-timing-function: ease-out; - } - - 40% { - -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); - transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); - -webkit-animation-timing-function: ease-out; - animation-timing-function: ease-out; - } - - 50% { - -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); - transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); - -webkit-animation-timing-function: ease-in; - animation-timing-function: ease-in; - } - - 80% { - -webkit-transform: perspective(400px) scale3d(.95, .95, .95); - transform: perspective(400px) scale3d(.95, .95, .95); - -webkit-animation-timing-function: ease-in; - animation-timing-function: ease-in; - } - - 100% { - -webkit-transform: perspective(400px); - transform: perspective(400px); - -webkit-animation-timing-function: ease-in; - animation-timing-function: ease-in; - } -} - -@keyframes flip { - 0% { - -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg); - transform: perspective(400px) rotate3d(0, 1, 0, -360deg); - -webkit-animation-timing-function: ease-out; - animation-timing-function: ease-out; - } - - 40% { - -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); - transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); - -webkit-animation-timing-function: ease-out; - animation-timing-function: ease-out; - } - - 50% { - -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); - transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); - -webkit-animation-timing-function: ease-in; - animation-timing-function: ease-in; - } - - 80% { - -webkit-transform: perspective(400px) scale3d(.95, .95, .95); - transform: perspective(400px) scale3d(.95, .95, .95); - -webkit-animation-timing-function: ease-in; - animation-timing-function: ease-in; - } - - 100% { - -webkit-transform: perspective(400px); - transform: perspective(400px); - -webkit-animation-timing-function: ease-in; - animation-timing-function: ease-in; - } -} - -.animated.flip { - -webkit-backface-visibility: visible; - backface-visibility: visible; - -webkit-animation-name: flip; - animation-name: flip; -} - -@-webkit-keyframes flipInX { - 0% { - -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); - transform: perspective(400px) rotate3d(1, 0, 0, 90deg); - -webkit-transition-timing-function: ease-in; - transition-timing-function: ease-in; - opacity: 0; - } - - 40% { - -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); - transform: perspective(400px) rotate3d(1, 0, 0, -20deg); - -webkit-transition-timing-function: ease-in; - transition-timing-function: ease-in; - } - - 60% { - -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); - transform: perspective(400px) rotate3d(1, 0, 0, 10deg); - opacity: 1; - } - - 80% { - -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg); - transform: perspective(400px) rotate3d(1, 0, 0, -5deg); - } - - 100% { - -webkit-transform: perspective(400px); - transform: perspective(400px); - } -} - -@keyframes flipInX { - 0% { - -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); - transform: perspective(400px) rotate3d(1, 0, 0, 90deg); - -webkit-transition-timing-function: ease-in; - transition-timing-function: ease-in; - opacity: 0; - } - - 40% { - -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); - transform: perspective(400px) rotate3d(1, 0, 0, -20deg); - -webkit-transition-timing-function: ease-in; - transition-timing-function: ease-in; - } - - 60% { - -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); - transform: perspective(400px) rotate3d(1, 0, 0, 10deg); - opacity: 1; - } - - 80% { - -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg); - transform: perspective(400px) rotate3d(1, 0, 0, -5deg); - } - - 100% { - -webkit-transform: perspective(400px); - transform: perspective(400px); - } -} - -.flipInX { - -webkit-backface-visibility: visible !important; - backface-visibility: visible !important; - -webkit-animation-name: flipInX; - animation-name: flipInX; -} - -@-webkit-keyframes flipInY { - 0% { - -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); - transform: perspective(400px) rotate3d(0, 1, 0, 90deg); - -webkit-transition-timing-function: ease-in; - transition-timing-function: ease-in; - opacity: 0; - } - - 40% { - -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); - transform: perspective(400px) rotate3d(0, 1, 0, -20deg); - -webkit-transition-timing-function: ease-in; - transition-timing-function: ease-in; - } - - 60% { - -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); - transform: perspective(400px) rotate3d(0, 1, 0, 10deg); - opacity: 1; - } - - 80% { - -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg); - transform: perspective(400px) rotate3d(0, 1, 0, -5deg); - } - - 100% { - -webkit-transform: perspective(400px); - transform: perspective(400px); - } -} - -@keyframes flipInY { - 0% { - -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); - transform: perspective(400px) rotate3d(0, 1, 0, 90deg); - -webkit-transition-timing-function: ease-in; - transition-timing-function: ease-in; - opacity: 0; - } - - 40% { - -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); - transform: perspective(400px) rotate3d(0, 1, 0, -20deg); - -webkit-transition-timing-function: ease-in; - transition-timing-function: ease-in; - } - - 60% { - -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); - transform: perspective(400px) rotate3d(0, 1, 0, 10deg); - opacity: 1; - } - - 80% { - -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg); - transform: perspective(400px) rotate3d(0, 1, 0, -5deg); - } - - 100% { - -webkit-transform: perspective(400px); - transform: perspective(400px); - } -} - -.flipInY { - -webkit-backface-visibility: visible !important; - backface-visibility: visible !important; - -webkit-animation-name: flipInY; - animation-name: flipInY; -} - -@-webkit-keyframes flipOutX { - 0% { - -webkit-transform: perspective(400px); - transform: perspective(400px); - } - - 30% { - -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); - transform: perspective(400px) rotate3d(1, 0, 0, -20deg); - opacity: 1; - } - - 100% { - -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); - transform: perspective(400px) rotate3d(1, 0, 0, 90deg); - opacity: 0; - } -} - -@keyframes flipOutX { - 0% { - -webkit-transform: perspective(400px); - transform: perspective(400px); - } - - 30% { - -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); - transform: perspective(400px) rotate3d(1, 0, 0, -20deg); - opacity: 1; - } - - 100% { - -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); - transform: perspective(400px) rotate3d(1, 0, 0, 90deg); - opacity: 0; - } -} - -.flipOutX { - -webkit-animation-name: flipOutX; - animation-name: flipOutX; - -webkit-animation-duration: .75s; - animation-duration: .75s; - -webkit-backface-visibility: visible !important; - backface-visibility: visible !important; -} - -@-webkit-keyframes flipOutY { - 0% { - -webkit-transform: perspective(400px); - transform: perspective(400px); - } - - 30% { - -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); - transform: perspective(400px) rotate3d(0, 1, 0, -15deg); - opacity: 1; - } - - 100% { - -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); - transform: perspective(400px) rotate3d(0, 1, 0, 90deg); - opacity: 0; - } -} - -@keyframes flipOutY { - 0% { - -webkit-transform: perspective(400px); - transform: perspective(400px); - } - - 30% { - -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); - transform: perspective(400px) rotate3d(0, 1, 0, -15deg); - opacity: 1; - } - - 100% { - -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); - transform: perspective(400px) rotate3d(0, 1, 0, 90deg); - opacity: 0; - } -} - -.flipOutY { - -webkit-backface-visibility: visible !important; - backface-visibility: visible !important; - -webkit-animation-name: flipOutY; - animation-name: flipOutY; - -webkit-animation-duration: .75s; - animation-duration: .75s; -} - -@-webkit-keyframes lightSpeedIn { - 0% { - -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); - transform: translate3d(100%, 0, 0) skewX(-30deg); - opacity: 0; - } - - 60% { - -webkit-transform: skewX(20deg); - transform: skewX(20deg); - opacity: 1; - } - - 80% { - -webkit-transform: skewX(-5deg); - transform: skewX(-5deg); - opacity: 1; - } - - 100% { - -webkit-transform: none; - transform: none; - opacity: 1; - } -} - -@keyframes lightSpeedIn { - 0% { - -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); - transform: translate3d(100%, 0, 0) skewX(-30deg); - opacity: 0; - } - - 60% { - -webkit-transform: skewX(20deg); - transform: skewX(20deg); - opacity: 1; - } - - 80% { - -webkit-transform: skewX(-5deg); - transform: skewX(-5deg); - opacity: 1; - } - - 100% { - -webkit-transform: none; - transform: none; - opacity: 1; - } -} - -.lightSpeedIn { - -webkit-animation-name: lightSpeedIn; - animation-name: lightSpeedIn; - -webkit-animation-timing-function: ease-out; - animation-timing-function: ease-out; -} - -@-webkit-keyframes lightSpeedOut { - 0% { - opacity: 1; - } - - 100% { - -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); - transform: translate3d(100%, 0, 0) skewX(30deg); - opacity: 0; - } -} - -@keyframes lightSpeedOut { - 0% { - opacity: 1; - } - - 100% { - -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); - transform: translate3d(100%, 0, 0) skewX(30deg); - opacity: 0; - } -} - -.lightSpeedOut { - -webkit-animation-name: lightSpeedOut; - animation-name: lightSpeedOut; - -webkit-animation-timing-function: ease-in; - animation-timing-function: ease-in; -} - -@-webkit-keyframes rotateIn { - 0% { - -webkit-transform-origin: center; - transform-origin: center; - -webkit-transform: rotate3d(0, 0, 1, -200deg); - transform: rotate3d(0, 0, 1, -200deg); - opacity: 0; - } - - 100% { - -webkit-transform-origin: center; - transform-origin: center; - -webkit-transform: none; - transform: none; - opacity: 1; - } -} - -@keyframes rotateIn { - 0% { - -webkit-transform-origin: center; - transform-origin: center; - -webkit-transform: rotate3d(0, 0, 1, -200deg); - transform: rotate3d(0, 0, 1, -200deg); - opacity: 0; - } - - 100% { - -webkit-transform-origin: center; - transform-origin: center; - -webkit-transform: none; - transform: none; - opacity: 1; - } -} - -.rotateIn { - -webkit-animation-name: rotateIn; - animation-name: rotateIn; -} - -@-webkit-keyframes rotateInDownLeft { - 0% { - -webkit-transform-origin: left bottom; - transform-origin: left bottom; - -webkit-transform: rotate3d(0, 0, 1, -45deg); - transform: rotate3d(0, 0, 1, -45deg); - opacity: 0; - } - - 100% { - -webkit-transform-origin: left bottom; - transform-origin: left bottom; - -webkit-transform: none; - transform: none; - opacity: 1; - } -} - -@keyframes rotateInDownLeft { - 0% { - -webkit-transform-origin: left bottom; - transform-origin: left bottom; - -webkit-transform: rotate3d(0, 0, 1, -45deg); - transform: rotate3d(0, 0, 1, -45deg); - opacity: 0; - } - - 100% { - -webkit-transform-origin: left bottom; - transform-origin: left bottom; - -webkit-transform: none; - transform: none; - opacity: 1; - } -} - -.rotateInDownLeft { - -webkit-animation-name: rotateInDownLeft; - animation-name: rotateInDownLeft; -} - -@-webkit-keyframes rotateInDownRight { - 0% { - -webkit-transform-origin: right bottom; - transform-origin: right bottom; - -webkit-transform: rotate3d(0, 0, 1, 45deg); - transform: rotate3d(0, 0, 1, 45deg); - opacity: 0; - } - - 100% { - -webkit-transform-origin: right bottom; - transform-origin: right bottom; - -webkit-transform: none; - transform: none; - opacity: 1; - } -} - -@keyframes rotateInDownRight { - 0% { - -webkit-transform-origin: right bottom; - transform-origin: right bottom; - -webkit-transform: rotate3d(0, 0, 1, 45deg); - transform: rotate3d(0, 0, 1, 45deg); - opacity: 0; - } - - 100% { - -webkit-transform-origin: right bottom; - transform-origin: right bottom; - -webkit-transform: none; - transform: none; - opacity: 1; - } -} - -.rotateInDownRight { - -webkit-animation-name: rotateInDownRight; - animation-name: rotateInDownRight; -} - -@-webkit-keyframes rotateInUpLeft { - 0% { - -webkit-transform-origin: left bottom; - transform-origin: left bottom; - -webkit-transform: rotate3d(0, 0, 1, 45deg); - transform: rotate3d(0, 0, 1, 45deg); - opacity: 0; - } - - 100% { - -webkit-transform-origin: left bottom; - transform-origin: left bottom; - -webkit-transform: none; - transform: none; - opacity: 1; - } -} - -@keyframes rotateInUpLeft { - 0% { - -webkit-transform-origin: left bottom; - transform-origin: left bottom; - -webkit-transform: rotate3d(0, 0, 1, 45deg); - transform: rotate3d(0, 0, 1, 45deg); - opacity: 0; - } - - 100% { - -webkit-transform-origin: left bottom; - transform-origin: left bottom; - -webkit-transform: none; - transform: none; - opacity: 1; - } -} - -.rotateInUpLeft { - -webkit-animation-name: rotateInUpLeft; - animation-name: rotateInUpLeft; -} - -@-webkit-keyframes rotateInUpRight { - 0% { - -webkit-transform-origin: right bottom; - transform-origin: right bottom; - -webkit-transform: rotate3d(0, 0, 1, -90deg); - transform: rotate3d(0, 0, 1, -90deg); - opacity: 0; - } - - 100% { - -webkit-transform-origin: right bottom; - transform-origin: right bottom; - -webkit-transform: none; - transform: none; - opacity: 1; - } -} - -@keyframes rotateInUpRight { - 0% { - -webkit-transform-origin: right bottom; - transform-origin: right bottom; - -webkit-transform: rotate3d(0, 0, 1, -90deg); - transform: rotate3d(0, 0, 1, -90deg); - opacity: 0; - } - - 100% { - -webkit-transform-origin: right bottom; - transform-origin: right bottom; - -webkit-transform: none; - transform: none; - opacity: 1; - } -} - -.rotateInUpRight { - -webkit-animation-name: rotateInUpRight; - animation-name: rotateInUpRight; -} - -@-webkit-keyframes rotateOut { - 0% { - -webkit-transform-origin: center; - transform-origin: center; - opacity: 1; - } - - 100% { - -webkit-transform-origin: center; - transform-origin: center; - -webkit-transform: rotate3d(0, 0, 1, 200deg); - transform: rotate3d(0, 0, 1, 200deg); - opacity: 0; - } -} - -@keyframes rotateOut { - 0% { - -webkit-transform-origin: center; - transform-origin: center; - opacity: 1; - } - - 100% { - -webkit-transform-origin: center; - transform-origin: center; - -webkit-transform: rotate3d(0, 0, 1, 200deg); - transform: rotate3d(0, 0, 1, 200deg); - opacity: 0; - } -} - -.rotateOut { - -webkit-animation-name: rotateOut; - animation-name: rotateOut; -} - -@-webkit-keyframes rotateOutDownLeft { - 0% { - -webkit-transform-origin: left bottom; - transform-origin: left bottom; - opacity: 1; - } - - 100% { - -webkit-transform-origin: left bottom; - transform-origin: left bottom; - -webkit-transform: rotate3d(0, 0, 1, 45deg); - transform: rotate3d(0, 0, 1, 45deg); - opacity: 0; - } -} - -@keyframes rotateOutDownLeft { - 0% { - -webkit-transform-origin: left bottom; - transform-origin: left bottom; - opacity: 1; - } - - 100% { - -webkit-transform-origin: left bottom; - transform-origin: left bottom; - -webkit-transform: rotate3d(0, 0, 1, 45deg); - transform: rotate3d(0, 0, 1, 45deg); - opacity: 0; - } -} - -.rotateOutDownLeft { - -webkit-animation-name: rotateOutDownLeft; - animation-name: rotateOutDownLeft; -} - -@-webkit-keyframes rotateOutDownRight { - 0% { - -webkit-transform-origin: right bottom; - transform-origin: right bottom; - opacity: 1; - } - - 100% { - -webkit-transform-origin: right bottom; - transform-origin: right bottom; - -webkit-transform: rotate3d(0, 0, 1, -45deg); - transform: rotate3d(0, 0, 1, -45deg); - opacity: 0; - } -} - -@keyframes rotateOutDownRight { - 0% { - -webkit-transform-origin: right bottom; - transform-origin: right bottom; - opacity: 1; - } - - 100% { - -webkit-transform-origin: right bottom; - transform-origin: right bottom; - -webkit-transform: rotate3d(0, 0, 1, -45deg); - transform: rotate3d(0, 0, 1, -45deg); - opacity: 0; - } -} - -.rotateOutDownRight { - -webkit-animation-name: rotateOutDownRight; - animation-name: rotateOutDownRight; -} - -@-webkit-keyframes rotateOutUpLeft { - 0% { - -webkit-transform-origin: left bottom; - transform-origin: left bottom; - opacity: 1; - } - - 100% { - -webkit-transform-origin: left bottom; - transform-origin: left bottom; - -webkit-transform: rotate3d(0, 0, 1, -45deg); - transform: rotate3d(0, 0, 1, -45deg); - opacity: 0; - } -} - -@keyframes rotateOutUpLeft { - 0% { - -webkit-transform-origin: left bottom; - transform-origin: left bottom; - opacity: 1; - } - - 100% { - -webkit-transform-origin: left bottom; - transform-origin: left bottom; - -webkit-transform: rotate3d(0, 0, 1, -45deg); - transform: rotate3d(0, 0, 1, -45deg); - opacity: 0; - } -} - -.rotateOutUpLeft { - -webkit-animation-name: rotateOutUpLeft; - animation-name: rotateOutUpLeft; -} - -@-webkit-keyframes rotateOutUpRight { - 0% { - -webkit-transform-origin: right bottom; - transform-origin: right bottom; - opacity: 1; - } - - 100% { - -webkit-transform-origin: right bottom; - transform-origin: right bottom; - -webkit-transform: rotate3d(0, 0, 1, 90deg); - transform: rotate3d(0, 0, 1, 90deg); - opacity: 0; - } -} - -@keyframes rotateOutUpRight { - 0% { - -webkit-transform-origin: right bottom; - transform-origin: right bottom; - opacity: 1; - } - - 100% { - -webkit-transform-origin: right bottom; - transform-origin: right bottom; - -webkit-transform: rotate3d(0, 0, 1, 90deg); - transform: rotate3d(0, 0, 1, 90deg); - opacity: 0; - } -} - -.rotateOutUpRight { - -webkit-animation-name: rotateOutUpRight; - animation-name: rotateOutUpRight; -} - -@-webkit-keyframes hinge { - 0% { - -webkit-transform-origin: top left; - transform-origin: top left; - -webkit-animation-timing-function: ease-in-out; - animation-timing-function: ease-in-out; - } - - 20%, 60% { - -webkit-transform: rotate3d(0, 0, 1, 80deg); - transform: rotate3d(0, 0, 1, 80deg); - -webkit-transform-origin: top left; - transform-origin: top left; - -webkit-animation-timing-function: ease-in-out; - animation-timing-function: ease-in-out; - } - - 40%, 80% { - -webkit-transform: rotate3d(0, 0, 1, 60deg); - transform: rotate3d(0, 0, 1, 60deg); - -webkit-transform-origin: top left; - transform-origin: top left; - -webkit-animation-timing-function: ease-in-out; - animation-timing-function: ease-in-out; - opacity: 1; - } - - 100% { - -webkit-transform: translate3d(0, 700px, 0); - transform: translate3d(0, 700px, 0); - opacity: 0; - } -} - -@keyframes hinge { - 0% { - -webkit-transform-origin: top left; - transform-origin: top left; - -webkit-animation-timing-function: ease-in-out; - animation-timing-function: ease-in-out; - } - - 20%, 60% { - -webkit-transform: rotate3d(0, 0, 1, 80deg); - transform: rotate3d(0, 0, 1, 80deg); - -webkit-transform-origin: top left; - transform-origin: top left; - -webkit-animation-timing-function: ease-in-out; - animation-timing-function: ease-in-out; - } - - 40%, 80% { - -webkit-transform: rotate3d(0, 0, 1, 60deg); - transform: rotate3d(0, 0, 1, 60deg); - -webkit-transform-origin: top left; - transform-origin: top left; - -webkit-animation-timing-function: ease-in-out; - animation-timing-function: ease-in-out; - opacity: 1; - } - - 100% { - -webkit-transform: translate3d(0, 700px, 0); - transform: translate3d(0, 700px, 0); - opacity: 0; - } -} - -.hinge { - -webkit-animation-name: hinge; - animation-name: hinge; -} - -/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ - -@-webkit-keyframes rollIn { - 0% { - opacity: 0; - -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); - transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); - } - - 100% { - opacity: 1; - -webkit-transform: none; - transform: none; - } -} - -@keyframes rollIn { - 0% { - opacity: 0; - -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); - transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); - } - - 100% { - opacity: 1; - -webkit-transform: none; - transform: none; - } -} - -.rollIn { - -webkit-animation-name: rollIn; - animation-name: rollIn; -} - -/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ - -@-webkit-keyframes rollOut { - 0% { - opacity: 1; - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); - transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); - } -} - -@keyframes rollOut { - 0% { - opacity: 1; - } - - 100% { - opacity: 0; - -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); - transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); - } -} - -.rollOut { - -webkit-animation-name: rollOut; - animation-name: rollOut; -} - -@-webkit-keyframes zoomIn { - 0% { - opacity: 0; - -webkit-transform: scale3d(.3, .3, .3); - transform: scale3d(.3, .3, .3); - } - - 50% { - opacity: 1; - } -} - -@keyframes zoomIn { - 0% { - opacity: 0; - -webkit-transform: scale3d(.3, .3, .3); - transform: scale3d(.3, .3, .3); - } - - 50% { - opacity: 1; - } -} - -.zoomIn { - -webkit-animation-name: zoomIn; - animation-name: zoomIn; -} - -@-webkit-keyframes zoomInDown { - 0% { - opacity: 0; - -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); - transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); - -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); - animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); - } - - 60% { - opacity: 1; - -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); - transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); - -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); - animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); - } -} - -@keyframes zoomInDown { - 0% { - opacity: 0; - -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); - transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); - -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); - animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); - } - - 60% { - opacity: 1; - -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); - transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); - -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); - animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); - } -} - -.zoomInDown { - -webkit-animation-name: zoomInDown; - animation-name: zoomInDown; -} - -@-webkit-keyframes zoomInLeft { - 0% { - opacity: 0; - -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); - transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); - -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); - animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); - } - - 60% { - opacity: 1; - -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); - transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); - -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); - animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); - } -} - -@keyframes zoomInLeft { - 0% { - opacity: 0; - -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); - transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); - -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); - animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); - } - - 60% { - opacity: 1; - -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); - transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); - -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); - animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); - } -} - -.zoomInLeft { - -webkit-animation-name: zoomInLeft; - animation-name: zoomInLeft; -} - -@-webkit-keyframes zoomInRight { - 0% { - opacity: 0; - -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); - transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); - -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); - animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); - } - - 60% { - opacity: 1; - -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); - transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); - -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); - animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); - } -} - -@keyframes zoomInRight { - 0% { - opacity: 0; - -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); - transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); - -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); - animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); - } - - 60% { - opacity: 1; - -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); - transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); - -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); - animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); - } -} - -.zoomInRight { - -webkit-animation-name: zoomInRight; - animation-name: zoomInRight; -} - -@-webkit-keyframes zoomInUp { - 0% { - opacity: 0; - -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); - transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); - -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); - animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); - } - - 60% { - opacity: 1; - -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); - transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); - -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); - animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); - } -} - -@keyframes zoomInUp { - 0% { - opacity: 0; - -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); - transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); - -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); - animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); - } - - 60% { - opacity: 1; - -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); - transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); - -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); - animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); - } -} - -.zoomInUp { - -webkit-animation-name: zoomInUp; - animation-name: zoomInUp; -} - -@-webkit-keyframes zoomOut { - 0% { - opacity: 1; - } - - 50% { - opacity: 0; - -webkit-transform: scale3d(.3, .3, .3); - transform: scale3d(.3, .3, .3); - } - - 100% { - opacity: 0; - } -} - -@keyframes zoomOut { - 0% { - opacity: 1; - } - - 50% { - opacity: 0; - -webkit-transform: scale3d(.3, .3, .3); - transform: scale3d(.3, .3, .3); - } - - 100% { - opacity: 0; - } -} - -.zoomOut { - -webkit-animation-name: zoomOut; - animation-name: zoomOut; -} - -@-webkit-keyframes zoomOutDown { - 40% { - opacity: 1; - -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); - transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); - -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); - animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); - } - - 100% { - opacity: 0; - -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); - transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); - -webkit-transform-origin: center bottom; - transform-origin: center bottom; - -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); - animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); - } -} - -@keyframes zoomOutDown { - 40% { - opacity: 1; - -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); - transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); - -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); - animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); - } - - 100% { - opacity: 0; - -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); - transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); - -webkit-transform-origin: center bottom; - transform-origin: center bottom; - -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); - animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); - } -} - -.zoomOutDown { - -webkit-animation-name: zoomOutDown; - animation-name: zoomOutDown; -} - -@-webkit-keyframes zoomOutLeft { - 40% { - opacity: 1; - -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); - transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); - } - - 100% { - opacity: 0; - -webkit-transform: scale(.1) translate3d(-2000px, 0, 0); - transform: scale(.1) translate3d(-2000px, 0, 0); - -webkit-transform-origin: left center; - transform-origin: left center; - } -} - -@keyframes zoomOutLeft { - 40% { - opacity: 1; - -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); - transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); - } - - 100% { - opacity: 0; - -webkit-transform: scale(.1) translate3d(-2000px, 0, 0); - transform: scale(.1) translate3d(-2000px, 0, 0); - -webkit-transform-origin: left center; - transform-origin: left center; - } -} - -.zoomOutLeft { - -webkit-animation-name: zoomOutLeft; - animation-name: zoomOutLeft; -} - -@-webkit-keyframes zoomOutRight { - 40% { - opacity: 1; - -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); - transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); - } - - 100% { - opacity: 0; - -webkit-transform: scale(.1) translate3d(2000px, 0, 0); - transform: scale(.1) translate3d(2000px, 0, 0); - -webkit-transform-origin: right center; - transform-origin: right center; - } -} - -@keyframes zoomOutRight { - 40% { - opacity: 1; - -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); - transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); - } - - 100% { - opacity: 0; - -webkit-transform: scale(.1) translate3d(2000px, 0, 0); - transform: scale(.1) translate3d(2000px, 0, 0); - -webkit-transform-origin: right center; - transform-origin: right center; - } -} - -.zoomOutRight { - -webkit-animation-name: zoomOutRight; - animation-name: zoomOutRight; -} - -@-webkit-keyframes zoomOutUp { - 40% { - opacity: 1; - -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); - transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); - -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); - animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); - } - - 100% { - opacity: 0; - -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); - transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); - -webkit-transform-origin: center bottom; - transform-origin: center bottom; - -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); - animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); - } -} - -@keyframes zoomOutUp { - 40% { - opacity: 1; - -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); - transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); - -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); - animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); - } - - 100% { - opacity: 0; - -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); - transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); - -webkit-transform-origin: center bottom; - transform-origin: center bottom; - -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); - animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); - } -} - -.zoomOutUp { - -webkit-animation-name: zoomOutUp; - animation-name: zoomOutUp; -} - -@-webkit-keyframes slideInDown { - 0% { - -webkit-transform: translateY(-100%); - transform: translateY(-100%); - visibility: visible; - } - - 100% { - -webkit-transform: translateY(0); - transform: translateY(0); - } -} - -@keyframes slideInDown { - 0% { - -webkit-transform: translateY(-100%); - transform: translateY(-100%); - visibility: visible; - } - - 100% { - -webkit-transform: translateY(0); - transform: translateY(0); - } -} - -.slideInDown { - -webkit-animation-name: slideInDown; - animation-name: slideInDown; -} - -@-webkit-keyframes slideInLeft { - 0% { - -webkit-transform: translateX(-100%); - transform: translateX(-100%); - visibility: visible; - } - - 100% { - -webkit-transform: translateX(0); - transform: translateX(0); - } -} - -@keyframes slideInLeft { - 0% { - -webkit-transform: translateX(-100%); - transform: translateX(-100%); - visibility: visible; - } - - 100% { - -webkit-transform: translateX(0); - transform: translateX(0); - } -} - -.slideInLeft { - -webkit-animation-name: slideInLeft; - animation-name: slideInLeft; -} - -@-webkit-keyframes slideInRight { - 0% { - -webkit-transform: translateX(100%); - transform: translateX(100%); - visibility: visible; - } - - 100% { - -webkit-transform: translateX(0); - transform: translateX(0); - } -} - -@keyframes slideInRight { - 0% { - -webkit-transform: translateX(100%); - transform: translateX(100%); - visibility: visible; - } - - 100% { - -webkit-transform: translateX(0); - transform: translateX(0); - } -} - -.slideInRight { - -webkit-animation-name: slideInRight; - animation-name: slideInRight; -} - -@-webkit-keyframes slideInUp { - 0% { - -webkit-transform: translateY(100%); - transform: translateY(100%); - visibility: visible; - } - - 100% { - -webkit-transform: translateY(0); - transform: translateY(0); - } -} - -@keyframes slideInUp { - 0% { - -webkit-transform: translateY(100%); - transform: translateY(100%); - visibility: visible; - } - - 100% { - -webkit-transform: translateY(0); - transform: translateY(0); - } -} - -.slideInUp { - -webkit-animation-name: slideInUp; - animation-name: slideInUp; -} - -@-webkit-keyframes slideOutDown { - 0% { - -webkit-transform: translateY(0); - transform: translateY(0); - } - - 100% { - visibility: hidden; - -webkit-transform: translateY(100%); - transform: translateY(100%); - } -} - -@keyframes slideOutDown { - 0% { - -webkit-transform: translateY(0); - transform: translateY(0); - } - - 100% { - visibility: hidden; - -webkit-transform: translateY(100%); - transform: translateY(100%); - } -} - -.slideOutDown { - -webkit-animation-name: slideOutDown; - animation-name: slideOutDown; -} - -@-webkit-keyframes slideOutLeft { - 0% { - -webkit-transform: translateX(0); - transform: translateX(0); - } - - 100% { - visibility: hidden; - -webkit-transform: translateX(-100%); - transform: translateX(-100%); - } -} - -@keyframes slideOutLeft { - 0% { - -webkit-transform: translateX(0); - transform: translateX(0); - } - - 100% { - visibility: hidden; - -webkit-transform: translateX(-100%); - transform: translateX(-100%); - } -} - -.slideOutLeft { - -webkit-animation-name: slideOutLeft; - animation-name: slideOutLeft; -} - -@-webkit-keyframes slideOutRight { - 0% { - -webkit-transform: translateX(0); - transform: translateX(0); - } - - 100% { - visibility: hidden; - -webkit-transform: translateX(100%); - transform: translateX(100%); - } -} - -@keyframes slideOutRight { - 0% { - -webkit-transform: translateX(0); - transform: translateX(0); - } - - 100% { - visibility: hidden; - -webkit-transform: translateX(100%); - transform: translateX(100%); - } -} - -.slideOutRight { - -webkit-animation-name: slideOutRight; - animation-name: slideOutRight; -} - -@-webkit-keyframes slideOutUp { - 0% { - -webkit-transform: translateY(0); - transform: translateY(0); - } - - 100% { - visibility: hidden; - -webkit-transform: translateY(-100%); - transform: translateY(-100%); - } -} - -@keyframes slideOutUp { - 0% { - -webkit-transform: translateY(0); - transform: translateY(0); - } - - 100% { - visibility: hidden; - -webkit-transform: translateY(-100%); - transform: translateY(-100%); - } -} - -.slideOutUp { - -webkit-animation-name: slideOutUp; - animation-name: slideOutUp; -} diff --git a/static/css/custom.css b/static/css/custom.css index 95c30970a..a4b557642 100644 --- a/static/css/custom.css +++ b/static/css/custom.css @@ -1,10 +1 @@ -/* your styles go here */ - -.box-image-text .image { - min-height: 200px; - max-height: 200px; -} - -.box-simple { - min-height: 230px; -} +/* your styles go here */ \ No newline at end of file diff --git a/static/css/owl.carousel.css b/static/css/owl.carousel.css deleted file mode 100644 index 10c9276b0..000000000 --- a/static/css/owl.carousel.css +++ /dev/null @@ -1,70 +0,0 @@ -/* - * Core Owl Carousel CSS File - * v1.3.2 - */ - -/* clearfix */ -.owl-carousel .owl-wrapper:after { - content: "."; - display: block; - clear: both; - visibility: hidden; - line-height: 0; - height: 0; -} -/* display none until init */ -.owl-carousel{ - display: none; - position: relative; - width: 100%; - -ms-touch-action: pan-y; -} -.owl-carousel .owl-wrapper{ - display: none; - position: relative; - -webkit-transform: translate3d(0px, 0px, 0px); -} -.owl-carousel .owl-wrapper-outer{ - overflow: hidden; - position: relative; - width: 100%; -} -.owl-carousel .owl-wrapper-outer.autoHeight{ - -webkit-transition: height 500ms ease-in-out; - -moz-transition: height 500ms ease-in-out; - -ms-transition: height 500ms ease-in-out; - -o-transition: height 500ms ease-in-out; - transition: height 500ms ease-in-out; -} - -.owl-carousel .owl-item{ - float: left; -} -.owl-controls .owl-page, -.owl-controls .owl-buttons div{ - cursor: pointer; -} -.owl-controls { - -webkit-user-select: none; - -khtml-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - user-select: none; - -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -} - -/* mouse grab icon */ -.grabbing { - cursor:url(/img/grabbing.png) 8 8, move; -} - -/* fix */ -.owl-carousel .owl-wrapper, -.owl-carousel .owl-item{ - -webkit-backface-visibility: hidden; - -moz-backface-visibility: hidden; - -ms-backface-visibility: hidden; - -webkit-transform: translate3d(0,0,0); - -moz-transform: translate3d(0,0,0); - -ms-transform: translate3d(0,0,0); -} diff --git a/static/css/owl.theme.css b/static/css/owl.theme.css deleted file mode 100644 index b3c430e3b..000000000 --- a/static/css/owl.theme.css +++ /dev/null @@ -1,69 +0,0 @@ -/* -* Owl Carousel Owl Demo Theme -* v1.3.2 -*/ - -.owl-theme .owl-controls{ - margin-top: 10px; - text-align: center; -} - -/* Styling Next and Prev buttons */ - -.owl-theme .owl-controls .owl-buttons div{ - display: inline-block; - zoom: 1; - *display: inline;/*IE7 life-saver */ -} -/* Clickable class fix problem with hover on touch devices */ -/* Use it for non-touch hover action */ -.owl-theme .owl-controls.clickable .owl-buttons div:hover{ - filter: Alpha(Opacity=100);/*IE7 fix*/ - opacity: 1; - text-decoration: none; -} - -/* Styling Pagination*/ - -.owl-theme .owl-controls .owl-page{ - display: inline-block; - zoom: 1; - *display: inline;/*IE7 life-saver */ -} -.owl-theme .owl-controls .owl-page span{ - display: block; - width: 12px; - height: 12px; - margin: 5px 7px; - filter: Alpha(Opacity=50);/*IE7 fix*/ - opacity: 0.5; - -webkit-border-radius: 20px; - -moz-border-radius: 20px; - border-radius: 20px; - background: #869791; -} - -.owl-theme .owl-controls .owl-page.active span, -.owl-theme .owl-controls.clickable .owl-page:hover span{ - filter: Alpha(Opacity=100);/*IE7 fix*/ - opacity: 1; -} - -/* If PaginationNumbers is true */ - -.owl-theme .owl-controls .owl-page span.owl-numbers{ - height: auto; - width: auto; - color: #FFF; - padding: 2px 10px; - font-size: 12px; - -webkit-border-radius: 30px; - -moz-border-radius: 30px; - border-radius: 30px; -} - -/* preloading images */ -.owl-item.loading{ - min-height: 150px; - background: url(AjaxLoader.gif) no-repeat center center -} \ No newline at end of file diff --git a/static/css/style.blue.css b/static/css/style.blue.css index 697579b4a..56ba9eadf 100644 --- a/static/css/style.blue.css +++ b/static/css/style.blue.css @@ -1,3566 +1,3702 @@ -.clearfix:before, -.clearfix:after, -.navbar:before, -.navbar:after, -.navbar-header:before, -.navbar-header:after { - content: " "; - display: table; +/* + +================================================================================== +================================================================================== + +Universal Template + +https://bootstrapious.com/p/universal-business-e-commerce-template + +================================================================================== +================================================================================== + +*/ +/* +* +* ===================== +* GENERAL +* ===================== +* +*/ +.boxed { + background: url("../img/boxed-pattern.png"); +} + +.boxed #all { + max-width: 1200px; + margin: 0 auto; + background: #fff; + -webkit-box-shadow: 0 0 5px #ccc; + box-shadow: 0 0 5px #ccc; +} + +a { + -webkit-transition: all 0.3s !important; + transition: all 0.3s !important; + display: inline-block; +} + +button { + cursor: pointer; +} + +strong { + font-weight: 700; +} + +p.lead { + margin-bottom: 40px; +} + +.accent { + color: #467fbf; } -.clearfix:after, -.navbar:after, -.navbar-header:after { - clear: both; + +.tooltip { + font-family: "Roboto", Helvetica, Arial, sans-serif; } -.center-block { + +.bs-select .dropdown-menu .dropdown-menu { + min-height: 20px; display: block; - margin-left: auto; - margin-right: auto; } -.pull-right { - float: right !important; + +.bs-select .dropdown-menu .dropdown-menu a { + padding: 6px 10px; + color: #666; + font-weight: 700; + text-decoration: none !important; + display: block; + font-size: .8rem; + text-transform: uppercase; + letter-spacing: 0.1em; + font-family: "Roboto", Helvetica, Arial, sans-serif; + outline: none; } -.pull-left { - float: left !important; + +.heading-light { + font-weight: 300 !important; } -.hide { - display: none !important; + +.text-bold { + font-weight: 700; } -.show { - display: block !important; + +.text-small { + font-size: 0.9rem; } -.invisible { - visibility: hidden; + +.text-uppercase { + text-transform: uppercase; + letter-spacing: 0.1em; } -.text-hide { - font: 0/0 a; - color: transparent; - text-shadow: none; - background-color: transparent; - border: 0; + +.no-letter-spacing { + letter-spacing: 0 !important; } -.hidden { - display: none !important; - visibility: hidden !important; + +.bar { + padding: 60px 0; } -.affix { - position: fixed; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); + +.bar.padding-big { + padding: 50px 0; } -/* general styles */ -a, -button { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.pagination { + margin-top: 20px; } -a i[class^="fa"], -button i[class^="fa"] { - margin: 0 5px; + +#pagination .pagination { + margin-bottom: 40px; } -.clickable { - cursor: pointer !important; + +.text-sm, .form-group label, #blog-listing-big .date-comments a, #blog-listing-medium .date-comments a, #blog-listing-big p.intro, #blog-listing-medium p.intro { + font-size: 0.9rem; } -.required { - color: #467fbf; + +.text-xs { + font-size: 0.9rem; } -.accent { - color: #467fbf; + +.text-xs * { + font-size: 0.9rem; } -.text-uppercase { - text-transform: uppercase; - letter-spacing: 0.08em; + +@media (max-width: 767px) { + .text-sm-center { + text-align: center !important; + } } + @media (max-width: 991px) { + .text-md-center { + text-align: center !important; + } +} + +@media (max-width: 1199px) { + .text-lg-center { + text-align: center !important; + } +} + +@media (max-width: 767px) { .text-center-sm { - text-align: center; + text-align: center !important; } } -p.lead { - margin-bottom: 40px; + +@media (max-width: 991px) { + .text-center-md { + text-align: center !important; + } } -section, -div.section { - margin-bottom: 40px; + +@media (max-width: 1199px) { + .text-center-sm, .text-center-xs { + text-align: center !important; + } } + +.bg-gray { + background: #e9ecef !important; +} + +.bg-gray-dark { + background: #555 !important; +} + +.bg-primary { + background: #467fbf !important; +} + +.color-white { + color: #fff !important; +} + +.color-white * { + color: #fff !important; +} + +.bg-white { + background: #fff !important; +} + +.bg-fixed { + background-attachment: fixed !important; +} + +.light-gray { + background: #eee; +} + .no-mb { margin-bottom: 0 !important; } + +.no-mt { + margin-top: 0 !important; +} + +.no-horizontal-padding { + padding-left: 0 !important; + padding-right: 0 !important; +} + .mb-small { margin-bottom: 20px !important; } -.heading { - margin-bottom: 40px; + +.no-padding-top { + padding-top: 0 !important; } -.heading h1, -.heading h2, -.heading h3, -.heading h4, -.heading h5 { - display: inline-block; - border-bottom: solid 5px #467fbf; + +.no-padding-bottom { + padding-bottom: 0 !important; +} + +.padding-horizontal { + padding-left: 30px !important; + padding-right: 30px !important; +} + +.relative-positioned { + position: relative; + z-index: 1; +} + +.jumbotron { + margin: 0; +} + +.owl-carousel.equal-height .owl-stage { + display: -webkit-box !important; + display: -ms-flexbox !important; + display: flex !important; + -webkit-box-align: stretch !important; + -ms-flex-align: stretch !important; + align-items: stretch !important; +} + +.background-pentagon, #heading-breadcrumbs { + background: url("../img/texture-bw.png") center center repeat; + border-top: 1px solid #999; + border-bottom: 1px solid #999; +} + +.heading, .panel-heading { + margin-bottom: 1rem; +} + +.heading h1, .panel-heading h1, .heading h2, .panel-heading h2, .heading h3, .panel-heading h3, .heading h4, .panel-heading h4, .heading h5, .panel-heading h5, .heading h6, .panel-heading h6 { line-height: 1.1; + display: inline-block; margin-bottom: 0; padding-bottom: 10px; - vertical-align: middle; text-transform: uppercase; - letter-spacing: 0.06em; + letter-spacing: 0.1em; } -.heading h1 i[class^="fa"], -.heading h2 i[class^="fa"], -.heading h3 i[class^="fa"], -.heading h4 i[class^="fa"], -.heading h5 i[class^="fa"] { - display: inline-block; + +.heading h1:after, .panel-heading h1:after, .heading h2:after, .panel-heading h2:after, .heading h3:after, .panel-heading h3:after, .heading h4:after, .panel-heading h4:after, .heading h5:after, .panel-heading h5:after, .heading h6:after, .panel-heading h6:after { + content: " "; + display: block; + width: 100px; + height: 2px; + margin-top: .6rem; background: #467fbf; - width: 30px; - height: 30px; - vertical-align: middle; - text-align: center; - color: #fff; - font-size: 12px; - line-height: 30px; - border-radius: 15px; } -.icon { - display: inline-block; - width: 80px; - height: 80px; - color: #fff; - line-height: 80px; - border-radius: 40px; - border: solid 1px #fff; - font-size: 20px; + +.heading.text-center h1:after, .text-center.panel-heading h1:after, .heading.text-center h2:after, .text-center.panel-heading h2:after, .heading.text-center h3:after, .text-center.panel-heading h3:after, .heading.text-center h4:after, .text-center.panel-heading h4:after, .heading.text-center h5:after, .text-center.panel-heading h5:after, .heading.text-center h6:after, .text-center.panel-heading h6:after { + margin-left: auto; + margin-right: auto; } -.icon.icon-lg { - font-size: 30px; - border-width: 2px; + +.buttons a { + margin: 0 3px; } -.ul-icons { - padding-left: 10px; + +.dropdown-item.active, .dropdown-item:active { + background: #92b3d9; } -.ul-icons li { - list-style-type: none; - line-height: 20px; - margin-bottom: 20px; + +.card { + border-radius: 0; + margin-bottom: 10px; } -.ul-icons li i { - width: 20px; - height: 20px; - background: #467fbf; - color: #fff; - text-align: center; - border-radius: 10px; - line-height: 20px; - margin-right: 10px; + +.card-header { + border-radius: 0; + padding: 20px; } -ul.list-style-none { - list-style: none; + +.card-header h1, .card-header h2, .card-header h3, .card-header h4, .card-header h5, .card-header h6 { + text-transform: uppercase; + letter-spacing: 0.1em; + font-size: 0.935rem; + margin: 0 !important; } -#text-page h1, -#text-page h2, -#text-page h3 { - font-weight: 700; + +.card-header a { + color: #333; } -#error-page { - text-align: center; - margin-top: 40px; - margin-bottom: 100px; + +.card-body p { + font-size: 0.9rem; + color: #333; } -#error-page h4 { - margin-bottom: 40px; + +.alert { + border-radius: 0; } -#error-page p.buttons { - margin-top: 40px; + +#heading-breadcrumbs { + padding: 2rem 0; + border-top: none !important; + border-bottom: none !important; } -.pages-listing .item { - text-align: center; + +#heading-breadcrumbs .breadcrumb { + margin-bottom: 0; + background: none; + font-size: 0.9rem; } -.pages-listing .item h3 { - font-size: 18px; + +#heading-breadcrumbs h1 { text-transform: uppercase; - margin-bottom: 20px; - letter-spacing: 0.08em; + letter-spacing: 0.1em; + margin-bottom: 0; } -.pages-listing .item h3 a { - color: #555555; + +#heading-breadcrumbs li { + text-transform: uppercase; + letter-spacing: 0.1em; } -.pages-listing .item .text { - margin-bottom: 20px; + +.row.no-space { + margin-left: 0; + margin-right: 0; } -.pages-listing .item .text p { - color: #999999; - font-size: 12px; - margin-bottom: 20px; + +.row.no-space div[class*="col-"] { + padding: 0; } -.banner { - margin-bottom: 30px; + +.row.no-space .box-image { + margin: 0; +} + +.owl-carousel .owl-dots { + margin-top: 20px; text-align: center; } -.banner img { - margin: 0 auto; + +.owl-carousel .owl-dots .owl-dot { + display: inline-block; + margin: 0 5px; } -.banner a:hover img { - opacity: 0.8; - filter: alpha(opacity=80); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.owl-carousel .owl-dots .owl-dot.active span { + background: #fff; } -.pages { - text-align: center; + +.owl-carousel .owl-dots .owl-dot span { + display: block; + width: 12px; + height: 12px; + border-radius: 50%; + background: #aaa; +} + +.dark-mask { + background: rgba(0, 0, 0, 0.3); + width: 100%; + height: 100%; + position: absolute; + top: 0; + left: 0; + z-index: -1; } -.pages .loadMore { - text-align: center; + +.dark-mask.mask-primary { + background: rgba(70, 127, 191, 0.9); } -.pages .pagination { + +.icon-outlined { + width: 80px; + height: 80px; + line-height: 80px; text-align: center; -} -.features-buttons button { + display: inline-block; + font-size: 1.4rem; + border-radius: 50%; + border: 2px solid #fff; margin-bottom: 20px; } -@media (min-width: 1300px) { - body.boxed { - background: url(https://www.toptal.com/designers/subtlepatterns/patterns/subtle_zebra_3d.png); - } - body.boxed #all { - position: relative; - background: #fff; - width: 1200px; - margin: 0 auto; - overflow: hidden; - -webkit-box-shadow: 0 0 5px #cccccc; - box-shadow: 0 0 5px #cccccc; - } -} -#top { - background: #555555; - color: #eeeeee; - padding: 10px 0; + +.icon-outlined.icon-lg { + font-size: 2rem; } -#top p { - margin: 0; - font-size: 12px; + +.icon-outlined.icon-sm { + width: 55px; + height: 55px; + line-height: 55px; + text-align: center; + font-size: 1.15rem; } -#top .social { - float: right; - text-align: right; + +.icon-outlined.icon-thin { + border-width: 1px; } -#top .social a { - color: #999999; - display: inline-block; + +.icon-filled { width: 24px; height: 24px; - border-radius: 12px; line-height: 24px; - font-size: 12px; + background: #467fbf; + color: #fff; text-align: center; + border-radius: 50%; + font-size: 0.75rem; +} + +.ul-icons .icon-filled { + display: inline-block; + margin-right: 10px; +} + +.ul-icons li { + margin-bottom: 20px; + color: #555; + font-size: 0.9rem; +} + +.ul-icons a { + display: inline; +} + +ul.social { + margin: 15px 0; } -#top .social a:hover { + +ul.social a { + width: 28px; + height: 28px; + line-height: 28px; + background: #555; color: #fff; - background: #467fbf; + text-align: center; + border-radius: 50%; + margin: 0 2px; + font-size: 0.8rem; +} + +ul.social a:hover { -webkit-transform: scale(1.1); transform: scale(1.1); } -#top .social a:hover.facebook { - background-color: #4460ae; + +ul.social a.facebook { + background: #4561ae; } -#top .social a:hover.gplus { - background-color: #c21f25; + +ul.social a.gplus { + background: #c22026; } -#top .social a:hover.twitter { - background-color: #3cf; + +ul.social a.twitter { + background: #34ccff; } -#top .social a:hover.instagram { - background-color: #cd4378; + +ul.social a.email { + background: #4b8046; } -#top .social a:hover.email { - background-color: #4a7f45; + +.showcase { + color: #555; } -#top .login { - float: right; + +.showcase .icon-outlined { + border-color: #555; } -#top .login a { - font-size: 12px; - color: #eeeeee; - margin-right: 15px; - text-decoration: none; + +.showcase .counter { + margin-bottom: 20px; + display: inline-block; + margin-top: 0; +} + +.showcase h4 { text-transform: uppercase; - font-weight: 700; - letter-spacing: 0.10em; + letter-spacing: 0.1em; + font-size: 0.935rem; + margin-top: 0; } -@media (max-width: 767px) { - #top .login { - float: left; - } + +.form-control { + border-radius: 0; } -#top.light { - background: #fff; - color: #999999; - border-bottom: solid 1px #eeeeee; + +.form-control:focus { + border-color: #467fbf; + -webkit-box-shadow: 0 0 0 0.2rem rgba(70, 127, 191, 0.25); + box-shadow: 0 0 0 0.2rem rgba(70, 127, 191, 0.25); } -#top.light .login a { - color: #555555; + +.form-group label { + color: #555; } -.navbar { + +.card-primary { + border-radius: 0; + border-color: #467fbf; +} + +.card-primary .card-header { + background: #467fbf; + color: #fff; border: none; + border-radius: 0; } -.navbar ul.nav > li > a { + +.card-primary .card-header a { + color: #fff; text-transform: uppercase; - text-decoration: underline; - font-weight: bold; - letter-spacing: 0.08em; - border-top: solid 5px transparent; -} -.navbar ul.nav > li > a:hover { - border-top: solid 5px #467fbf; + font-weight: 300; + letter-spacing: 0.05em; } -.navbar ul.nav > li.active > a, -.navbar ul.nav > li.open > a { - text-decoration: none !important; - border-top: solid 5px #294d76; + +.card-primary .card-body { + border-color: #467fbf; } -@media (max-width: 768px) { - .navbar ul.nav > li.active > a, - .navbar ul.nav > li.open > a { - border-top-color: transparent; - } - .navbar ul.nav > li > a:hover { - border-top-color: transparent; - } + +.card-body li { + font-size: 0.9rem; } -.navbar.navbar-light ul.nav > li.active > a { - border-top: solid 5px #294d76; - background: #fff !important; - color: #555555 !important; + +table { + font-size: 0.9rem; } -.navbar.navbar-light ul.nav > li.active > a:hover { - border-top: solid 5px #294d76; + +table img { + min-width: 50px !important; + max-width: 50px !important; + height: 50px; } -.navbar.navbar-light ul.nav > li > a:hover, -.navbar.navbar-light ul.nav > li.open > a:hover, -.navbar.navbar-light ul.nav > li > a:focus, -.navbar.navbar-light ul.nav > li.open > a:focus { - border-top: solid 5px #467fbf; - background: #fff !important; - color: #555555 !important; + +table input[type="number"] { + max-width: 50px; } -.navbar ul.dropdown-menu { - margin: 0; - padding: 0; + +.nav-tabs { + border-bottom: none; } -.navbar ul.dropdown-menu li { - list-style-type: none; - border-bottom: solid 1px #eeeeee; - text-transform: uppercase; - letter-spacing: 0.08em; - padding: 4px 0; + +.nav-tabs a.nav-link { + border-radius: 0 !important; + font-size: 0.9rem; } -.navbar ul.dropdown-menu li a { - position: relative; - color: #999999; - font-size: 12px; - display: block; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - left: 0; + +.tab-content { + padding: 20px; + border: 1px solid #ddd; + font-size: 0.9rem; } -.navbar ul.dropdown-menu li a:hover { - color: #467fbf; - text-decoration: none; - background: none; - left: 2px; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.top-bar { + background: #555; + color: #fff; + font-size: 0.9rem; + padding: 10px 0; } -@media (max-width: 767px) { - .navbar ul.dropdown-menu li a:hover { - left: 0; - } + +.top-bar.top-bar-light { + background: #fff; + color: #555; + border-bottom: 1px solid #ddd; } -.navbar .yamm-content h3 { - font-size: 18px; - text-transform: uppercase; - padding-bottom: 10px; - margin-top: 5px; - border-bottom: dotted 1px #555555; - letter-spacing: 0.08em; + +.top-bar.top-bar-light a.login-btn, .top-bar.top-bar-light a.signup-btn { + color: #555 !important; } -@media (max-width: 767px) { - .navbar .yamm-content h3 { - font-size: 14px; - } + +.top-bar.top-bar-light a.login-btn span, .top-bar.top-bar-light a.signup-btn span { + display: inline-block; } -.navbar .yamm-content h5 { - text-transform: uppercase; - padding-bottom: 10px; - border-bottom: dotted 1px #555555; - letter-spacing: 0.08em; + +.top-bar p { + margin-bottom: 0; + font-size: 0.75rem; } -.navbar .yamm-content ul { - margin: 0; - padding: 0; + +.top-bar ul { + margin-bottom: 0; } -.navbar .yamm-content ul li { - list-style-type: none; - border-bottom: solid 1px #eeeeee; + +.top-bar a.login-btn, .top-bar a.signup-btn { + color: #eee; text-transform: uppercase; - padding: 4px 0; -} -.navbar .yamm-content ul li a { - position: relative; - color: #999999; - font-size: 12px; - display: block; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + letter-spacing: 0.1em; + text-decoration: none !important; + font-size: 0.75rem; + font-weight: 700; + margin-right: 10px; } -.navbar .yamm-content ul li a:hover { - color: #467fbf; - text-decoration: none; - padding-left: 2px; + +.top-bar a.login-btn i, .top-bar a.signup-btn i { + margin-right: 10px; } -.navbar .yamm-content .banner { - margin-bottom: 10px; + +.top-bar ul.social-custom { + margin-left: 20px; } -.navbar .yamm-fw .dropdown-menu { + +.top-bar ul.social-custom li { padding: 0; + margin: 0; } -.navbar .navbar-buttons { - float: right; + +.top-bar ul.social-custom a { + text-decoration: none !important; + font-size: 0.7rem; + width: 26px; + height: 26px; + line-height: 26px; + color: #999; + text-align: center; + border-radius: 50%; + margin: 0; } -.navbar .navbar-buttons button, -.navbar .navbar-buttons a.btn, -.navbar .navbar-buttons .btn-default.navbar-toggle { - margin-top: 11px; - margin-bottom: 11px; - margin-left: 0; - margin-right: 5px; -} -.navbar .btn-default, -.navbar .btn-default.navbar-toggle { - color: #999999; - background-color: #fff; - margin-left: 7px; - margin-right: 0; -} -.navbar .btn-default:hover, -.navbar .btn-default.navbar-toggle:hover, -.navbar .btn-default:focus, -.navbar .btn-default.navbar-toggle:focus { - background-color: #fff; - border-color: #467fbf; - color: #467fbf; + +.top-bar ul.social-custom a:hover { + background: #467fbf; + color: #fff; } -.navbar #search { - clear: both; - border-top: solid 1px #467fbf; - text-align: right; + +.top-bar .contact-info { + margin-right: 20px; } -.navbar #search form { - float: right; + +.top-bar .contact-info a { + font-size: 0.8rem; } -.navbar #search form .input-group { - width: 500px; + +.modal .modal-header h4 { + text-transform: uppercase; + letter-spacing: 0.1em; } -@media (max-width: 768px) { - .navbar #search form .input-group { - width: 100%; - } + +.modal input::-moz-placeholder { + font-size: 0.85rem; } -.navbar #basket-overview a { - margin-left: 7px; + +.modal input::-webkit-input-placeholder { + font-size: 0.85rem; } -.navbar-affixed-top { - top: -32px; + +.modal input:-ms-input-placeholder { + font-size: 0.85rem; } -.navbar-affixed-top.affix-top { - -webkit-transition: all 0.5s ease-out; - -moz-transition: all 0.5s ease-out; - transition: all 0.5s ease-out; + +.modal p { + font-size: 0.85rem; } -.navbar-affixed-top.affix { + +header.nav-holder.sticky { position: fixed; - width: 100%; top: 0; - z-index: 1000; - -webkit-box-shadow: 0 0 5px #cccccc; - box-shadow: 0 0 5px #cccccc; - -webkit-transition: all 0.5s ease-out; - -moz-transition: all 0.5s ease-out; - transition: all 0.5s ease-out; + left: 0; + width: 100%; + background: #fff; + z-index: 999; + -webkit-box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); + box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); } -body.boxed .navbar-affixed-top.affix { - position: static; + +#navbar { + background: #fff; + padding-top: 0; + padding-bottom: 0; } -#login-modal { - overflow: hidden; + +#navbar .navbar-toggler { + font-size: 0.9rem; + padding: 10px 15px; + border-color: #ddd; } -#login-modal .modal-header h4 { - text-transform: uppercase; + +#navbar ul ul a { + padding-left: 0 !important; } -#login-modal form { - margin-bottom: 20px; + +#navbar .dropdown-menu { + border-radius: 0; + -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); + box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); + margin-top: 0; + padding-top: 0; + padding-bottom: 0; +} + +#navbar .dropdown-menu .dropdown-item { + padding: 0; } -#login-modal a { + +#navbar .dropdown-menu h5 { + text-transform: uppercase; + letter-spacing: 0.1em; + padding-bottom: 5px; + border-bottom: 1px dotted #ccc; + margin-top: .7rem; + margin-bottom: .5rem; +} + +#navbar .dropdown-menu a.nav-link { + font-size: 0.75rem; + letter-spacing: 0.1em; + text-transform: uppercase !important; + border-bottom: 1px solid #eee; + padding: 15px 20px !important; +} + +#navbar .dropdown-menu a.nav-link:hover { + -webkit-transform: translateX(5px); + transform: translateX(5px); color: #467fbf; } -#login-modal p { - font-weight: 300; - margin-bottom: 20px; - font-size: 13px; + +#navbar .dropdown-submenu { + position: relative; } -/* buttons */ -.btn { - font-weight: 700; - font-family: "Roboto", Helvetica, Arial, sans-serif; - text-transform: uppercase; - letter-spacing: 0.08em; - padding: 6px 12px; - font-size: 13px; - line-height: 1.42857143; - border-radius: 0; + +#navbar .dropdown-submenu > .dropdown-menu { + top: 0; + left: 100%; + margin-top: -2px; + font-size: 1em; } -.input-group .btn { - font-size: 14px; + +#navbar .menu-large { + position: static !important; } -.btn-lg { - padding: 10px 16px; - font-size: 14px; - line-height: 1.33; - border-radius: 0; + +#navbar .menu-large .megamenu { + padding: 20px; + width: 100%; + max-width: 1140px; + left: 50%; + -webkit-transform: translateX(-50%); + transform: translateX(-50%); + margin-top: -1px; +} + +#navbar .menu-large a.nav-link { + padding: 7px !important; + padding-left: 0 !important; +} + +#navbar .navbar-nav > li.active > a { + background: #467fbf !important; + color: #fff !important; + text-decoration: none !important; + border-color: #36669c !important; } -.btn-sm { - padding: 5px 10px; - font-size: 12px; - line-height: 1.5; - border-radius: 0; + +#navbar .navbar-nav > li > a { + margin: 0; + padding: 1.4rem 1rem 1.6rem; + color: #555; + font-weight: 600; + text-transform: uppercase; + letter-spacing: 0.1em; + font-size: 0.9rem; + text-decoration: none; + border-top: .3rem solid transparent; } -.btn-xs { - padding: 1px 5px; - font-size: 12px; - line-height: 1.5; - border-radius: 0; + +#navbar .navbar-nav > li > a:hover { + background: rgba(70, 127, 191, 0.5); + border-color: rgba(70, 127, 191, 0.8); +} + +#navbar .navbar-nav > li > a:focus { + background: #467fbf !important; + color: #fff !important; + text-decoration: none !important; + border-color: #36669c !important; +} + +#navbar.nav-light .navbar-nav > li.active a.dropdown-toggle, +#navbar.nav-light .navbar-nav > li.active a.dropdown-toggle:hover { + background: none !important; + color: #555 !important; + text-decoration: underline !important; + border-color: #467fbf !important; +} + +#navbar.nav-light .navbar-nav > li > a:hover { + background: none !important; + border-color: #7fa6d3 !important; +} + +#navbar.nav-light .navbar-nav > li > a:focus { + background: none !important; + color: #555 !important; + text-decoration: underline !important; + border-color: #467fbf !important; +} + +@media (max-width: 991px) { + #navbar { + padding-top: 1rem; + padding-bottom: 1rem; + } + #navbar .menu-large .megamenu { + width: 100%; + left: 0 !important; + -webkit-transform: none !important; + transform: none !important; + } + #navbar .navbar-collapse { + max-height: 600px; + overflow-y: auto; + margin-top: 1rem; + } + #navbar .navbar-nav > li > a { + padding: 0 10px; + height: 45px; + line-height: 45px; + border-top: 0; + font-size: 0.85rem; + width: 100%; + } + #navbar .navbar-nav > li > a:hover { + background: rgba(70, 127, 191, 0.5); + border-color: rgba(70, 127, 191, 0.8); + } + #navbar .dropdown-menu { + border: none; + -webkit-box-shadow: none; + box-shadow: none; + } } + +.btn { + text-transform: uppercase; + letter-spacing: 0.1em; +} + .btn-template-main { - color: #467fbf; - background-color: #ffffff; - border-color: #467fbf; + background: #467fbf; + border: 1px solid #467fbf !important; + color: #fff !important; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-main:hover, -.btn-template-main:focus, -.btn-template-main:active, -.btn-template-main.active, -.open > .dropdown-toggle.btn-template-main { - color: #467fbf; - background-color: #e6e6e6; - border-color: #336194; + +.btn-template-main:hover, .btn-template-main:focus { + background: #3d72af; + color: #fff !important; + border-color: #3d72af !important; } -.btn-template-main:active, -.btn-template-main.active, -.open > .dropdown-toggle.btn-template-main { - background-image: none; + +.btn-template-white { + background: #fff; + color: #467fbf !important; + border: 1px solid #467fbf !important; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-main.disabled, -.btn-template-main[disabled], -fieldset[disabled] .btn-template-main, -.btn-template-main.disabled:hover, -.btn-template-main[disabled]:hover, -fieldset[disabled] .btn-template-main:hover, -.btn-template-main.disabled:focus, -.btn-template-main[disabled]:focus, -fieldset[disabled] .btn-template-main:focus, -.btn-template-main.disabled:active, -.btn-template-main[disabled]:active, -fieldset[disabled] .btn-template-main:active, -.btn-template-main.disabled.active, -.btn-template-main[disabled].active, -fieldset[disabled] .btn-template-main.active { - background-color: #ffffff; - border-color: #467fbf; + +.btn-template-white:hover, .btn-template-white:focus { + background: #467fbf !important; + color: #fff !important; } -.btn-template-main .badge { - color: #ffffff; - background-color: #467fbf; + +.btn-template-outlined { + background: none; + border: 1px solid #467fbf !important; + color: #467fbf; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-main:hover, -.btn-template-main:focus, -.btn-template-main:active, -.btn-template-main.active { + +.btn-template-outlined:hover, .btn-template-outlined:focus { background: #467fbf; - color: #ffffff; - border-color: #467fbf; + color: #fff !important; } -.btn-template-transparent-primary { - color: #ffffff; - background-color: transparent; - border-color: #ffffff; -} -.btn-template-transparent-primary:hover, -.btn-template-transparent-primary:focus, -.btn-template-transparent-primary:active, -.btn-template-transparent-primary.active, -.open > .dropdown-toggle.btn-template-transparent-primary { - color: #ffffff; - background-color: rgba(0, 0, 0, 0); - border-color: #e0e0e0; -} -.btn-template-transparent-primary:active, -.btn-template-transparent-primary.active, -.open > .dropdown-toggle.btn-template-transparent-primary { - background-image: none; + +.btn-template-outlined-white { + background: none; + border: 1px solid #fff !important; + color: #fff; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-transparent-primary.disabled, -.btn-template-transparent-primary[disabled], -fieldset[disabled] .btn-template-transparent-primary, -.btn-template-transparent-primary.disabled:hover, -.btn-template-transparent-primary[disabled]:hover, -fieldset[disabled] .btn-template-transparent-primary:hover, -.btn-template-transparent-primary.disabled:focus, -.btn-template-transparent-primary[disabled]:focus, -fieldset[disabled] .btn-template-transparent-primary:focus, -.btn-template-transparent-primary.disabled:active, -.btn-template-transparent-primary[disabled]:active, -fieldset[disabled] .btn-template-transparent-primary:active, -.btn-template-transparent-primary.disabled.active, -.btn-template-transparent-primary[disabled].active, -fieldset[disabled] .btn-template-transparent-primary.active { - background-color: transparent; - border-color: #ffffff; + +.btn-template-outlined-white:hover, .btn-template-outlined-white:focus { + background: #fff; + color: #467fbf !important; } -.btn-template-transparent-primary .badge { - color: transparent; - background-color: #ffffff; + +.btn-template-outlined-black { + background: none; + border: 1px solid #333 !important; + color: #333; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-transparent-primary:hover, -.btn-template-transparent-primary:focus, -.btn-template-transparent-primary:active, -.btn-template-transparent-primary.active { - background: #fff; - color: #467fbf; - border-color: #fff; + +.btn-template-outlined-black:hover, .btn-template-outlined-black:focus { + background: #333 !important; + color: #fff !important; } -.btn-template-transparent-black { - color: #ffffff; - background-color: transparent; - border-color: #ffffff; -} -.btn-template-transparent-black:hover, -.btn-template-transparent-black:focus, -.btn-template-transparent-black:active, -.btn-template-transparent-black.active, -.open > .dropdown-toggle.btn-template-transparent-black { - color: #ffffff; - background-color: rgba(0, 0, 0, 0); - border-color: #e0e0e0; -} -.btn-template-transparent-black:active, -.btn-template-transparent-black.active, -.open > .dropdown-toggle.btn-template-transparent-black { - background-image: none; + +.features-buttons button { + margin-bottom: 20px; } -.btn-template-transparent-black.disabled, -.btn-template-transparent-black[disabled], -fieldset[disabled] .btn-template-transparent-black, -.btn-template-transparent-black.disabled:hover, -.btn-template-transparent-black[disabled]:hover, -fieldset[disabled] .btn-template-transparent-black:hover, -.btn-template-transparent-black.disabled:focus, -.btn-template-transparent-black[disabled]:focus, -fieldset[disabled] .btn-template-transparent-black:focus, -.btn-template-transparent-black.disabled:active, -.btn-template-transparent-black[disabled]:active, -fieldset[disabled] .btn-template-transparent-black:active, -.btn-template-transparent-black.disabled.active, -.btn-template-transparent-black[disabled].active, -fieldset[disabled] .btn-template-transparent-black.active { - background-color: transparent; - border-color: #ffffff; + +.customers { + margin-bottom: 40px; +} + +.customers .item { + margin: 0 20px; +} + +.customers .item img { + -webkit-filter: grayscale(100%); + filter: grayscale(100%); + -webkit-transition: all 0.3s; + transition: all 0.3s; +} + +.customers .item img:hover { + -webkit-filter: grayscale(0%); + filter: grayscale(0%); } -.btn-template-transparent-black .badge { - color: transparent; - background-color: #ffffff; + +.testimonials .item { + margin: 0 5px; + height: 100%; } -.btn-template-transparent-black:hover, -.btn-template-transparent-black:focus, -.btn-template-transparent-black:active, -.btn-template-transparent-black.active { + +.testimonials .testimonial { + padding: 20px; background: #fff; - color: #000; - border-color: #fff; + height: 100%; } -.btn-template-primary { - color: #ffffff; - background-color: #467fbf; - border-color: #467fbf; + +.testimonials .text { + font-size: 0.85rem; +} + +.testimonials .text p { + color: #999; +} + +.testimonials .avatar { + min-width: 60px; + max-width: 60px; + min-height: 60px; + max-height: 60px; + border-radius: 50%; + overflow: hidden; + margin-left: 10px; } -.btn-template-primary:hover, -.btn-template-primary:focus, -.btn-template-primary:active, -.btn-template-primary.active, -.open > .dropdown-toggle.btn-template-primary { - color: #ffffff; - background-color: #36669c; - border-color: #336194; + +.testimonials .bottom { + width: 100%; } -.btn-template-primary:active, -.btn-template-primary.active, -.open > .dropdown-toggle.btn-template-primary { - background-image: none; + +.testimonials .bottom .testimonial-info { + text-align: right; } -.btn-template-primary.disabled, -.btn-template-primary[disabled], -fieldset[disabled] .btn-template-primary, -.btn-template-primary.disabled:hover, -.btn-template-primary[disabled]:hover, -fieldset[disabled] .btn-template-primary:hover, -.btn-template-primary.disabled:focus, -.btn-template-primary[disabled]:focus, -fieldset[disabled] .btn-template-primary:focus, -.btn-template-primary.disabled:active, -.btn-template-primary[disabled]:active, -fieldset[disabled] .btn-template-primary:active, -.btn-template-primary.disabled.active, -.btn-template-primary[disabled].active, -fieldset[disabled] .btn-template-primary.active { - background-color: #467fbf; - border-color: #467fbf; + +.testimonials .bottom h5 { + text-transform: uppercase; + letter-spacing: 0.1em; + margin-bottom: 5px; } -.btn-template-primary .badge { + +.testimonials .bottom p { + font-size: 0.75rem; + color: #999; + margin-bottom: 0; +} + +.testimonials .icon { color: #467fbf; - background-color: #ffffff; + font-size: 2rem; + margin-right: 20px; } -#intro { - background: url('../img/home.jpg') no-repeat center top; - -webkit-background-size: cover; - -moz-background-size: cover; - -o-background-size: cover; - background-size: cover; + +.testimonials .owl-carousel .owl-stage { + display: -webkit-box !important; + display: -ms-flexbox !important; + display: flex !important; + -webkit-box-align: stretch !important; + -ms-flex-align: stretch !important; + align-items: stretch !important; } -#intro .item { - font-family: "Roboto", Helvetica, Arial, sans-serif; - height: 100%; + +.testimonials .owl-dot.active span { + background: #467fbf !important; } -#intro .item h1 { - text-transform: uppercase; - font-size: 50px; + +.home-carousel { color: #fff; - margin-bottom: 40px; - letter-spacing: 0.08em; } -@media (max-width: 991px) { - #intro .item h1 { - font-size: 40px; - } + +.home-carousel .owl-carousel { + padding-top: 60px; + padding-bottom: 20px; } -@media (max-width: 767px) { - #intro .item h1 { - font-size: 25px; - } + +.home-carousel h1, .home-carousel h2 { + text-transform: uppercase; + letter-spacing: 0.1em; +} + +.home-carousel li, .home-carousel p { + text-transform: uppercase; + letter-spacing: 0.1em; + font-weight: 700; + font-size: 1.1rem; + margin-bottom: 10px; +} + +.home-carousel p img { + max-width: 200px; +} + +.project .owl-dot.active span { + background: #467fbf !important; +} + +.project .owl-nav { + position: absolute; + top: 0; + right: 0; + left: auto; + bottom: auto; + width: 100%; + padding: 20px; + text-align: right; +} + +.project .owl-nav .owl-prev, .project .owl-nav .owl-next { + width: 30px; + height: 30px; + line-height: 30px; + background: #fff; + color: #467fbf; + text-align: center; + border-radius: 50%; + display: inline-block; + margin: 0 5px; + -webkit-transition: all 0.3s; + transition: all 0.3s; } -#intro .item h3 { + +.project .owl-nav .owl-prev:hover, .project .owl-nav .owl-next:hover { + background: #467fbf; color: #fff; - margin-bottom: 40px; } + @media (max-width: 767px) { - #intro .item h3 { - font-size: 15px; - margin-bottom: 20px; + .home-carousel { + text-align: center !important; } -} -#intro .item .btn { - text-transform: none; -} -@media (max-width: 991px) { - #intro .item .btn { - font-size: 14px; + .home-carousel p, .home-carousel h1, .home-carousel ul { + text-align: center !important; } -} -@media (max-width: 991px) { - #intro .item .carousel-caption { - left: 10%; - right: 10%; + .home-carousel img { + margin: 10px auto; } } -#intro .container, -#intro .row { - height: 100%; - position: relative; + +.owl-thumbs { + display: -webkit-box; + display: -ms-flexbox; + display: flex; } -.jumbotron { - padding: 30px; - margin-bottom: 0; + +.owl-thumbs button { + background: none; + border: none; + margin: 5px; + outline: none; +} + +.home-blog-post { + margin: 15px 0; +} + +.home-blog-post .image { position: relative; - background: url('../img/photogrid.jpg') center center repeat; - background-size: cover; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + margin-bottom: 15px; } -.jumbotron .dark-mask { - position: absolute; - top: 0; - left: 0; + +.home-blog-post .overlay { width: 100%; height: 100%; - background: #467fbf; - opacity: 0.9; - filter: alpha(opacity=90); + background: rgba(70, 127, 191, 0.6); + position: absolute; + top: 0; + opacity: 0; + -webkit-transition: all 0.5s; + transition: all 0.5s; } -.jumbotron h1, -.jumbotron h2, -.jumbotron h3, -.jumbotron p, -.jumbotron ul { - color: #fff; + +.home-blog-post .overlay a { + -webkit-transform: translateY(30px); + transform: translateY(30px); + opacity: 0; } -.jumbotron h1, -.jumbotron h2, -.jumbotron h3 { - color: #ffffff; - text-transform: uppercase; - letter-spacing: 0.08em; + +.home-blog-post .overlay i { + margin-right: 5px; } -.jumbotron p { + +.home-blog-post .text { + text-align: center; +} + +.home-blog-post .text .intro { + text-align: left; margin-bottom: 20px; - font-size: 21px; - font-weight: 400; + color: #888; + font-size: 0.9rem; } -.jumbotron p.text-uppercase { - font-weight: 700; + +.home-blog-post h4 { + margin: 10px 0; + text-transform: uppercase; + letter-spacing: 0.1em; } -.jumbotron > hr { - border-top-color: #d5d5d5; + +.home-blog-post .author-category { + font-size: 0.75rem; + color: #999; + text-transform: uppercase; + letter-spacing: 0.1em; } -.container .jumbotron { - border-radius: 0; + +.home-blog-post .author-category a { + font-weight: 500; } -.jumbotron .container { - max-width: 100%; - z-index: 2; + +.home-blog-post:hover .overlay { + opacity: 1; } -@media screen and (min-width: 768px) { - .jumbotron { - padding-top: 48px; - padding-bottom: 48px; - } - .container .jumbotron { - padding-left: 60px; - padding-right: 60px; - } - .jumbotron h1, - .jumbotron .h1 { - font-size: 46px; - } + +.home-blog-post:hover .overlay a { + -webkit-transform: none; + transform: none; + opacity: 1; } -#categoryMenu h3 { - padding: 20px; - background: #f7f7f7; - margin: 0; - border-bottom: solid 1px #eeeeee; - text-transform: uppercase; - letter-spacing: 0.08em; + +#blog-listing-big .post, #blog-listing-medium .post { + margin-bottom: 60px; } -.panel.sidebar-menu h3 { - padding: 5px 0; - margin: 0; + +#blog-listing-big .image, #blog-listing-medium .image { + margin-bottom: 15px; } -.panel.sidebar-menu { - background: #fff; - margin: 0 0 20px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; + +#blog-listing-big h2 a, #blog-listing-medium h2 a { + color: #555; + text-transform: uppercase; + letter-spacing: 0.1em; } -.panel.sidebar-menu .panel-heading { + +#blog-listing-big .author-category, #blog-listing-medium .author-category { + color: #999; text-transform: uppercase; + letter-spacing: 0.1em; + font-weight: 300; margin-bottom: 10px; - background: none; - padding: 0; - letter-spacing: 0.08em; - border-bottom: none; + font-size: .9rem; } -.panel.sidebar-menu .panel-heading h1, -.panel.sidebar-menu .panel-heading h2, -.panel.sidebar-menu .panel-heading h3, -.panel.sidebar-menu .panel-heading h4, -.panel.sidebar-menu .panel-heading h5 { - display: inline-block; - border-bottom: solid 5px #467fbf; - line-height: 1.1; + +#blog-listing-big .author-category a, #blog-listing-medium .author-category a { + font-weight: 500; margin-bottom: 0; - padding-bottom: 10px; } -.panel.sidebar-menu .panel-heading .btn.btn-danger { - color: #fff; - margin-top: 5px; + +#blog-listing-big .date-comments, #blog-listing-medium .date-comments { + margin-bottom: 0; } -.panel.sidebar-menu .panel-body { - padding: 0; + +#blog-listing-big .date-comments a, #blog-listing-medium .date-comments a { + color: #999; + margin-left: 25px; } -.panel.sidebar-menu .panel-body span.colour { - display: inline-block; - width: 15px; - height: 15px; - border: solid 1px #555555; - vertical-align: top; - margin-top: 2px; - margin-left: 5px; + +#blog-listing-big .date-comments i, #blog-listing-medium .date-comments i { + margin-right: 5px; } -.panel.sidebar-menu .panel-body span.colour.white { - background: #fff; + +#blog-listing-big p.intro, #blog-listing-medium p.intro { + margin-top: 10px; + color: #777; } -.panel.sidebar-menu .panel-body span.colour.red { - background: red; + +.pager { + padding: 20px 0; + margin-top: 20px; + border-top: 1px solid #e6e6e6; } -.panel.sidebar-menu .panel-body span.colour.green { - background: green; + +.disabled a, .disabled a:hover { + border-color: #999 !important; + color: #999 !important; + background: none !important; + cursor: not-allowed; } -.panel.sidebar-menu .panel-body span.colour.blue { - background: blue; + +#blog-post #post-content { + margin-bottom: 20px; } -.panel.sidebar-menu .panel-body span.colour.yellow { - background: yellow; + +#blog-post .comment { + margin-bottom: 25px; } -.panel.sidebar-menu .panel-body label { - color: #999999; - font-size: 12px; + +#blog-post .comment .posted { + color: #999; + font-size: 0.8rem; + margin-bottom: 10px; } -.panel.sidebar-menu .panel-body label:hover { - color: #555555; + +#blog-post .comment.last { + margin-bottom: 0; } -.panel.sidebar-menu ul.nav.category-menu { - margin-bottom: 20px; - text-transform: uppercase; - font-weight: 700; - letter-spacing: 0.08em; + +#blog-post .comment p { + font-size: 0.9rem; } -.panel.sidebar-menu ul.nav.category-menu li a { - font-family: "Roboto", Helvetica, Arial, sans-serif; + +#blog-post #comments, #blog-post #comment-form { + padding: 20px 0; + margin-top: 20px; + border-top: solid 1px #eee; } -.panel.sidebar-menu ul.nav ul { - list-style: none; - padding-left: 0; + +#blog-post #comments h4, #blog-post #comment-form h4 { + margin-bottom: 1.5rem; } -.panel.sidebar-menu ul.nav ul li { - display: block; -} -.panel.sidebar-menu ul.nav ul li a { - position: relative; - font-family: "Times New Roman", Times, serif; - font-weight: normal; - text-transform: none !important; - display: block; - padding: 10px 15px; - padding-left: 30px; - font-size: 12px; - color: #999999; -} -.panel.sidebar-menu ul.nav ul li a:hover, -.panel.sidebar-menu ul.nav ul li a:focus { - text-decoration: none; - background-color: #eeeeee; -} -.panel.sidebar-menu ul.tag-cloud { - list-style: none; - padding-left: 0; -} -.panel.sidebar-menu ul.tag-cloud li { - display: inline-block; -} -.panel.sidebar-menu ul.tag-cloud li a { - display: inline-block; - padding: 5px; - border: solid 1px #eeeeee; - border-radius: 0; - color: #467fbf; - margin: 5px 5px 5px 0; - text-transform: uppercase; - letter-spacing: 0.08em; - font-weight: 700; - font-size: 12px; - text-decoration: none; -} -.panel.sidebar-menu ul.tag-cloud li a:hover { - color: #467fbf; - border-color: #467fbf; -} -.panel.sidebar-menu ul.tag-cloud li.active a { - color: #FFFFFF; - background-color: #467fbf; -} -.panel.sidebar-menu ul.tag-cloud li.active a:hover { - color: #FFFFFF; -} -.panel.sidebar-menu ul.popular, -.panel.sidebar-menu ul.recent { - list-style: none; - padding-left: 0; - padding: 20px 0; -} -.panel.sidebar-menu ul.popular li, -.panel.sidebar-menu ul.recent li { - margin-bottom: 10px; - padding: 5px 0; - border-bottom: dotted 1px #eeeeee; -} -.panel.sidebar-menu ul.popular li:before, -.panel.sidebar-menu ul.recent li:before, -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - content: " "; - display: table; -} -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - clear: both; -} -.panel.sidebar-menu ul.popular li:before, -.panel.sidebar-menu ul.recent li:before, -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - content: " "; - display: table; -} -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - clear: both; -} -.panel.sidebar-menu ul.popular li img, -.panel.sidebar-menu ul.recent li img { - width: 50px; - margin-right: 10px; -} -.panel.sidebar-menu ul.popular li h5, -.panel.sidebar-menu ul.recent li h5 { - margin: 0 0 10px; -} -.panel.sidebar-menu ul.popular li h5 a, -.panel.sidebar-menu ul.recent li h5 a { - font-weight: normal; -} -.panel.sidebar-menu ul.popular li p.date, -.panel.sidebar-menu ul.recent li p.date { - float: right; - font-size: 12px; - color: #999999; -} -.panel.sidebar-menu ul.popular li:last-child, -.panel.sidebar-menu ul.recent li:last-child { - border-bottom: none; -} -.panel.sidebar-menu .text-widget { - font-size: 12px; -} -.panel.sidebar-menu.with-icons ul.nav li a:after { - font-family: 'FontAwesome'; - content: "\f105"; - position: relative; - top: 0; - float: right; -} -/* ribbons for product sales etc. */ -.ribbon { - position: absolute; - top: 50px; - padding-left: 51px; - font-weight: 700; - letter-spacing: 0.08em; -} -.ribbon .ribbon-background { - position: absolute; - top: 0; - right: 0; -} -.ribbon .theribbon { - position: relative; - width: 80px; - padding: 6px 20px 6px 20px; - margin: 30px 10px 10px -71px; - color: #fff; - background-color: #467fbf; - font-family: "Roboto", Helvetica, Arial, sans-serif; -} -.ribbon .theribbon:before, -.ribbon .theribbon:after { - content: ' '; - position: absolute; - width: 0; - height: 0; -} -.ribbon .theribbon:after { - left: 0px; - top: 100%; - border-width: 5px 10px; - border-style: solid; - border-color: #000000 #000000 transparent transparent; -} -.ribbon.sale { - top: 0; -} -.ribbon.new { - top: 50px; -} -.ribbon.new .theribbon { - background-color: #5bc0de; - text-shadow: 0px 1px 2px #bbb; -} -.ribbon.new .theribbon:after { - border-color: #2390b0 #2390b0 transparent transparent; -} -.ribbon.gift { - top: 100px; -} -.ribbon.gift .theribbon { - background-color: #5cb85c; - text-shadow: 0px 1px 2px #bbb; -} -.ribbon.gift .theribbon:after { - border-color: #357935 #357935 transparent transparent; -} -.owl-carousel .owl-controls .owl-page.active span, -.owl-theme .owl-controls .owl-page.active span, -.owl-carousel .owl-controls.clickable .owl-page:hover span, -.owl-theme .owl-controls.clickable .owl-page:hover span { - background: #467fbf; -} -.owl-carousel .owl-controls .owl-buttons, -.owl-theme .owl-controls .owl-buttons { - position: absolute; - top: 5px; - right: 0; -} -.owl-carousel .owl-controls .owl-buttons div, -.owl-theme .owl-controls .owl-buttons div { - width: 26px; - height: 26px; - line-height: 25px; - margin: 0 5px 0 0; - font-size: 18px; - color: #467fbf; - padding: 0; - background: #fff; - border-radius: 13px; - vertical-align: middle; - text-align: center; - opacity: 1; - filter: alpha(opacity=100); -} -.home-carousel { - position: relative; - background: url('../img/photogrid.jpg') center center repeat; - background-size: cover; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -.home-carousel .dark-mask { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: #467fbf; - opacity: 0.9; - filter: alpha(opacity=90); -} -.home-carousel .owl-carousel { - padding-top: 60px; - padding-bottom: 20px; -} -.home-carousel .owl-theme .owl-controls .owl-page span { - background: #666; -} -.home-carousel .owl-theme .owl-controls .owl-page.active span { - background: #fff; -} -.home-carousel .owl-theme .owl-controls .owl-page:hover span { - background: #fff; -} -@media (max-width: 767px) { - .home-carousel { - text-align: center !important; - } -} -@media (min-width: 992px) { - .home-carousel .right { - text-align: right; - } -} -.home-carousel h1, -.home-carousel h2, -.home-carousel h3, -.home-carousel p, -.home-carousel ul { - color: #fff; -} -.home-carousel h1 { - font-weight: 700; - text-transform: uppercase; - font-size: 46px; - letter-spacing: 0.08em; -} -@media (max-width: 991px) { - .home-carousel h1 { - font-size: 36px; - } -} -.home-carousel h2 { - font-weight: 700; - text-transform: uppercase; - font-size: 40px; - letter-spacing: 0.08em; -} -.home-carousel ul, -.home-carousel p { - font-size: 18px; - font-weight: 700; - padding: 0; - text-transform: uppercase; - letter-spacing: 0.10em; -} -@media (max-width: 991px) { - .home-carousel ul, - .home-carousel p { - font-size: 14px; - } -} -.home-carousel ul li { - margin-bottom: 10px; -} -.customers { - padding: 0; - margin-bottom: 40px; -} -.customers .item { - list-style-type: none; - text-align: center; - margin: 0 20px; -} -.customers .item img { - display: inline-block; - filter: url("data:image/svg+xml;utf8,#grayscale"); - /* Firefox 10+, Firefox on Android */ - filter: gray; - /* IE6-9 */ - -webkit-filter: grayscale(100%); - /* Chrome 19+, Safari 6+, Safari 6+ iOS */ - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -.customers .item img:hover { - max-width: auto; - filter: none; - -webkit-filter: none; -} -.testimonials { - padding: 0; - margin-bottom: 40px; -} -.testimonials .item { - list-style-type: none; - margin: 0 5px; - background: #fff; - padding-bottom: 60px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; -} -.testimonials .item .testimonial { - position: relative; - padding: 20px; -} -.testimonials .item .testimonial:before, -.testimonials .item .testimonial:after { - content: " "; - display: table; -} -.testimonials .item .testimonial:after { - clear: both; -} -.testimonials .item .testimonial:before, -.testimonials .item .testimonial:after { - content: " "; - display: table; -} -.testimonials .item .testimonial:after { - clear: both; -} -.testimonials .item .testimonial .text { - color: #999999; - margin-bottom: 40px; -} -.testimonials .item .testimonial .bottom { - position: absolute; - left: 0; - bottom: 0; - width: 100%; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - padding: 20px; - height: 50px; -} -.testimonials .item .testimonial .bottom .icon { - color: #467fbf; - font-size: 30px; - float: left; - width: 20%; -} -.testimonials .item .testimonial .name-picture { - float: right; - width: 80%; - text-align: right; -} -.testimonials .item .testimonial .name-picture h5 { - font-size: 14px; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.testimonials .item .testimonial .name-picture p { - color: #999999; - margin: 0; - font-size: 12px; -} -.testimonials .item .testimonial .name-picture img { - float: right; - width: 60px; - border-radius: 30px; - margin-left: 10px; -} -.team-member { - text-align: center; - margin-bottom: 40px; -} -.team-member h3 { - font-size: 18px; - text-transform: uppercase; - margin-bottom: 5px; - letter-spacing: 0.08em; -} -.team-member h3 a { - color: #555555; -} -.team-member p.role { - color: #999999; - font-size: 12px; - text-transform: uppercase; - letter-spacing: 0.06em; -} -.team-member .social { - margin-bottom: 20px; -} -.team-member .social a { - margin: 0 10px 0 0; - color: #fff; - display: inline-block; - width: 26px; - height: 26px; - border-radius: 13px; - line-height: 26px; - font-size: 15px; - text-align: center; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - vertical-align: bottom; -} -.team-member .social a i { - vertical-align: bottom; - line-height: 26px; -} -.team-member .social a.facebook { - background-color: #4460ae; -} -.team-member .social a.gplus { - background-color: #c21f25; -} -.team-member .social a.twitter { - background-color: #3cf; -} -.team-member .social a.instagram { - background-color: #cd4378; -} -.team-member .social a.email { - background-color: #4a7f45; -} -.team-member .text p { - color: #999999; - font-size: 12px; -} -.team-member .social, -.team-member-detail .social { + +#blog-post #comment-form { margin-bottom: 20px; } -.team-member .social a, -.team-member-detail .social a { - margin: 0 10px 0 0; - color: #fff; - display: inline-block; - width: 26px; - height: 26px; - border-radius: 13px; - line-height: 26px; - font-size: 15px; - text-align: center; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - vertical-align: bottom; -} -.team-member .social a i, -.team-member-detail .social a i { - vertical-align: bottom; - line-height: 26px; -} -.team-member .social a.facebook, -.team-member-detail .social a.facebook { - background-color: #4460ae; -} -.team-member .social a.gplus, -.team-member-detail .social a.gplus { - background-color: #c21f25; -} -.team-member .social a.twitter, -.team-member-detail .social a.twitter { - background-color: #3cf; -} -.team-member .social a.instagram, -.team-member-detail .social a.instagram { - background-color: #cd4378; -} -.team-member .social a.email, -.team-member-detail .social a.email { - background-color: #4a7f45; + +#blog-post .reply i { + margin-right: 5px; } + .box-simple { - text-align: center; margin-bottom: 40px; + text-align: center; +} + +.box-simple:hover .icon-outlined { + -webkit-transform: scale(1.1); + transform: scale(1.1); } -.box-simple .icon { + +.box-simple .icon-outlined { color: #467fbf; - border-color: #467fbf; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + border: 1px solid #467fbf; + -webkit-transition: all 0.3s; + transition: all 0.3s; } + .box-simple h3 { - font-weight: normal; - font-size: 18px; text-transform: uppercase; - line-height: 1.5; - color: #555555; - font-weight: 800; - letter-spacing: 0.08em; -} -.box-simple h3 a { - color: #555555; + letter-spacing: 0.1em; } + .box-simple p { - color: #999999; -} -.box-simple:hover .icon { - -webkit-transform: scale(1.1, 1.1); - -ms-transform: scale(1.1, 1.1); - -o-transform: scale(1.1, 1.1); - transform: scale(1.1, 1.1); -} -.box-simple:hover .icon i { - -webkit-transform: scale(1, 1); - -ms-transform: scale(1, 1); - -o-transform: scale(1, 1); - transform: scale(1, 1); + color: #999; + margin: 20px 0; + font-size: 0.9rem; } + .box-simple.box-white { - padding: 20px; - border: dotted 1px #999999; + border: dotted 1px #999; + padding: 15px 20px; + margin-bottom: 0; } + .box-simple.box-white .icon { - color: #555555; - border-color: transparent; - font-size: 70px; + font-size: 2rem; + margin-bottom: 1rem; +} + +.box-simple.box-white p { + color: #999; + margin-bottom: 5px; } + .box-simple.box-dark { - padding: 20px; - border: dotted 1px #999999; - background: #555555; + border: dotted 1px #999; + padding: 15px 20px; + margin-bottom: 0; color: #fff; + background: #555; } + .box-simple.box-dark .icon { - color: #f7f7f7; - border-color: transparent; - font-size: 70px; -} -.box-simple.box-dark h3 { - color: #fff; -} -.box-simple.box-dark h3 a { - color: #fff; + font-size: 2rem; + margin-bottom: 1rem; } + .box-simple.box-dark p { + margin-bottom: 5px; color: #fff; } -.box-image { - position: relative; - overflow: hidden; - text-align: center; - margin: 15px 0; + +.same-height div[class*="col-"] { + margin-bottom: 30px; } -.box-image .bg { - position: absolute; - top: auto; - bottom: 0; - width: 100%; + +.same-height .box-white, .same-height.box-dark { height: 100%; - opacity: 0; - filter: alpha(opacity=0); - background: #467fbf; } -.box-image .name { - position: absolute; - width: 100%; - height: 50%; - bottom: 0; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image .name h3 { - color: #fff; - text-transform: uppercase; - font-size: 18px; - letter-spacing: 0.08em; -} -.box-image .name h3 a { - color: #fff; - text-decoration: none; -} -.box-image .text { - position: absolute; - width: 100%; - height: 50%; - top: 0; - -webkit-transform: translate(0, -150%); - -ms-transform: translate(0, -150%); - -o-transform: translate(0, -150%); - transform: translate(0, -150%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image:hover .bg { - opacity: 0.7; - filter: alpha(opacity=70); -} -.box-image:hover .name { - position: absolute; - -webkit-transform: translate(0, -75%); - -ms-transform: translate(0, -75%); - -o-transform: translate(0, -75%); - transform: translate(0, -75%); -} -.box-image:hover .text { - position: absolute; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); -} -.box-image-text { - position: relative; - overflow: hidden; - text-align: center; - margin: 15px 0; -} -.box-image-text .top { + +.box-image { position: relative; - margin-bottom: 10px; -} -.box-image-text .top .bg { - position: absolute; - top: auto; - bottom: 0; - width: 100%; - height: 100%; - opacity: 0; - filter: alpha(opacity=0); - background: #467fbf; -} -.box-image-text .top .name { - position: absolute; - width: 100%; - height: 50%; - bottom: 0; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image-text .top .name h3 { - color: #fff; - text-transform: uppercase; - font-size: 18px; - letter-spacing: 0.08em; -} -.box-image-text .top .name h3 a { - color: #fff; - text-decoration: none; -} -.box-image-text .top .text { - position: absolute; - width: 100%; - height: 50%; - top: 0; - -webkit-transform: translate(0, -150%); - -ms-transform: translate(0, -150%); - -o-transform: translate(0, -150%); - transform: translate(0, -150%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image-text .content h3, -.box-image-text .content h4 { - text-transform: uppercase; - line-height: 1.5; - color: #555555; - font-weight: 800; - letter-spacing: 0.08em; -} -.box-image-text .content p { - color: #999999; -} -.box-image-text:hover .bg { - opacity: 0.7; - filter: alpha(opacity=70); -} -.box-image-text:hover .name { - position: absolute; - -webkit-transform: translate(0, -75%); - -ms-transform: translate(0, -75%); - -o-transform: translate(0, -75%); - transform: translate(0, -75%); -} -.box-image-text:hover .text { - position: absolute; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); -} -/* universal box */ -.box { - background: #fff; - margin: 0 0 30px; - border: solid 1px #ccc; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - padding: 20px 0; - border-left: none; - border-right: none; -} -.box .box-header { - background: #f7f7f7; - margin: -20px 0 20px; - padding: 20px; - border-bottom: solid 1px #eeeeee; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.box .box-header:before, -.box .box-header:after { - content: " "; - display: table; -} -.box .box-header:after { - clear: both; -} -.box .box-header:before, -.box .box-header:after { - content: " "; - display: table; -} -.box .box-header:after { - clear: both; -} -.box .box-footer { - background: #f7f7f7; - margin: 30px 0 -20px; - padding: 20px; - border-top: solid 1px #eeeeee; -} -.box .box-footer:before, -.box .box-footer:after { - content: " "; - display: table; -} -.box .box-footer:after { - clear: both; + margin: 20px 0; } -.box .box-footer:before, -.box .box-footer:after { - content: " "; - display: table; + +.box-image:hover .overlay { + opacity: 1; } -.box .box-footer:after { - clear: both; + +.box-image:hover h3, .box-image:hover p, .box-image:hover .buttons { + opacity: 1; + -webkit-transform: none; + transform: none; } -@media (max-width: 991px) { - .box .box-footer .btn { - margin-bottom: 20px; - } + +.box-image:hover p { + -webkit-transition-delay: 0.1s; + transition-delay: 0.1s; } -.box.no-border { - border: none; + +.box-image:hover .buttons { + -webkit-transition-delay: 0.2s; + transition-delay: 0.2s; } -#heading-breadcrumbs { - background: url('../img/texture-bw.png') center center repeat; - padding: 20px 0; - margin-bottom: 40px; + +.box-image .name { + margin-bottom: 20px; } -#heading-breadcrumbs.no-mb { - margin-bottom: 0; + +.box-image a { + text-decoration: none !important; } -#heading-breadcrumbs h1 { - color: #333333; + +.box-image h3 { + font-size: 1.125rem; text-transform: uppercase; - font-size: 30px; - font-weight: 700; - letter-spacing: 0.08em; -} -@media (max-width: 991px) { - #heading-breadcrumbs h1 { - text-align: center; - } -} -#heading-breadcrumbs ul.breadcrumb { - margin-top: 5px; - margin-bottom: 0; -} -.bar { - position: relative; - background: #467fbf; - padding: 60px 0; -} -.bar.background-pentagon { - background: url('../img/texture-bw.png') center center repeat; - border-top: solid 1px #999999; - border-bottom: solid 1px #999999; -} -.bar.background-gray { - background: #eeeeee; -} -.bar.background-gray-dark { - background: #555555; -} -.bar.background-white { - background: #fff; -} -.bar.background-image-fixed-1 { - background: url('../img/fixed-background-1.jpg') center top no-repeat; - background-attachment: fixed; - background-size: cover; -} -.bar.background-image-fixed-2 { - background: url('../img/fixed-background-2.jpg') center top no-repeat; - background-attachment: fixed; - background-size: cover; -} -.bar.color-white h1, -.bar.color-white h2, -.bar.color-white h3, -.bar.color-white h4, -.bar.color-white h5, -.bar.color-white h6, -.bar.color-white p { - color: #fff; -} -.bar.padding-big { - padding: 50px 0; -} -.bar.padding-horizontal { - padding-left: 30px; - padding-right: 30px; -} -.bar.margin-vertical { - margin-top: 20px; - margin-bottom: 20px; + letter-spacing: 0.1em; + -webkit-transition: all 0.3s; + transition: all 0.3s; + opacity: 0; + -webkit-transform: translateY(-50px); + transform: translateY(-50px); } -.bar .dark-mask { + +.box-image .overlay { + width: 100%; + height: 100%; position: absolute; top: 0; left: 0; - width: 100%; - height: 100%; - background: #000; - opacity: 0.3; - filter: alpha(opacity=30); -} -.portfolio.no-space { - padding: 0 15px; -} -.portfolio.no-space .box-image { - margin: 0 -15px; -} -.portfolio-project .project-more h4 { - color: #555555; - text-transform: uppercase; - margin-bottom: 0; - text-align: left; - font-size: 14px; - letter-spacing: 0.08em; -} -.portfolio-project .project-more p { - color: #999999; - padding: 10px 0; - margin-bottom: 20px; - text-align: left; -} -.portfolio-showcase { - margin: 15px 0 60px; -} -.portfolio-showcase h3 a { - text-transform: uppercase; - line-height: 1.5; - letter-spacing: 0.08em; + background: rgba(70, 127, 191, 0.6); + padding: 20px; + -webkit-transition: all 0.3s; + transition: all 0.3s; + opacity: 0; } -.portfolio-showcase p.lead { - color: #555555; - margin-bottom: 20px; + +.box-image .buttons { + opacity: 0; + -webkit-transition: all 0.3s; + transition: all 0.3s; + -webkit-transform: translateY(20px); + transform: translateY(20px); +} + +.box-image .buttons a { + margin: 0 3px; +} + +.box-image p { + -webkit-transition: all 0.3s; + transition: all 0.3s; + opacity: 0; + -webkit-transform: translateY(20px); + transform: translateY(20px); } -.portfolio-showcase p { - color: #999999; + +.box-image-text .content { + text-align: center; } -.portfolio-showcase p.buttons { - margin-top: 40px; + +.box-image-text p { + color: #777; + font-size: 0.9rem; } + .see-more { - text-align: center; - margin-top: 20px; - padding-top: 20px; + margin-top: 40px; } + .see-more p { - font-size: 28px; + font-size: 1.8rem; font-weight: 100; - margin-bottom: 20px; -} -.showcase .item { - text-align: center; } -.showcase .item .icon { - display: inline-block; - width: 50px; - height: 50px; - color: #555555; - line-height: 50px; - border-radius: 25px; - border: solid 1px #555555; -} -.showcase .item h4 { - color: #555555; - text-transform: uppercase; - letter-spacing: 0.08em; - line-height: 1.5; - font-size: 16px; -} -.showcase .item h4 span { - font-weight: bold; - font-size: 51px; + +.box { + margin: 80px 0; + border-top: 1px solid #ddd; + border-bottom: 1px solid #ddd; + padding: 20px; } -.packages .package { - background: #fff; + +.box a.btn { margin-top: 25px; - margin-bottom: 20px; - padding-bottom: 15px; - text-align: center; - border: solid 1px #467fbf; - overflow: hidden; -} -.packages .package .package-header { - height: 57px; - color: #fff; - line-height: 57px; - background: #467fbf; -} -.packages .package .package-header h5 { - color: #fff; - text-transform: uppercase; - font-weight: bold; - line-height: 57px; - margin: 0; - letter-spacing: 0.08em; -} -.packages .package .package-header.light-gray { - background: #eeeeee; -} -.packages .package .package-header.light-gray h5 { - color: #555555; -} -.packages .package .price { - line-height: 120px; - height: 100px; - color: #fff; - font-weight: 400; -} -.packages .package .price h4 { - display: inline; - font-size: 50px; - line-height: normal; - margin-bottom: 0; -} -.packages .package .price .period { - line-height: normal; - color: #999999; -} -.packages .package ul { - padding: 0; -} -.packages .package ul li { - list-style-type: none; - padding-top: 10px; - padding-bottom: 10px; - width: 80%; - margin: auto; - border-bottom: 1px dotted #ccc; -} -.packages .package ul li:last-child { - border-bottom: 0; -} -.packages .package ul li i { - font-size: 13px; - margin-right: 5px; -} -.packages .best-value .package { - margin-top: 0; - padding-bottom: 40px; -} -.packages .best-value .package .package-header { - height: 72px; - padding-top: 17px; - height: 82px !important; -} -.packages .best-value .package .package-header h5 { - font-weight: bold; - line-height: 29px; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.packages .best-value .package .package-header .meta-text { - font-size: 13px; - line-height: 15px; -} -#map { - height: 300px; -} -#map.with-border { - border-top: solid 1px #467fbf; - border-bottom: solid 1px #467fbf; -} -#blog-listing-big .post, -#blog-homepage .post { - margin-bottom: 60px; } -#blog-listing-big .post h2, -#blog-homepage .post h2, -#blog-listing-big .post h4, -#blog-homepage .post h4 { - text-transform: uppercase; - letter-spacing: 0.08em; -} -#blog-listing-big .post h2 a, -#blog-homepage .post h2 a, -#blog-listing-big .post h4 a, -#blog-homepage .post h4 a { - color: #555555; -} -#blog-listing-big .post h2 a:hover, -#blog-homepage .post h2 a:hover, -#blog-listing-big .post h4 a:hover, -#blog-homepage .post h4 a:hover { - color: #467fbf; -} -#blog-listing-big .post .author-category, -#blog-homepage .post .author-category { - color: #999999; + +.box .box-header { + background: #f7f7f7; + margin: 20px 0 20px; + padding: 20px; + border-top: 1px solid #eee; text-transform: uppercase; - font-weight: 300; - letter-spacing: 0.08em; -} -#blog-listing-big .post .author-category a, -#blog-homepage .post .author-category a { - font-weight: 500; -} -#blog-listing-big .post .date-comments a, -#blog-homepage .post .date-comments a { - color: #999999; - margin-right: 20px; + letter-spacing: 0.1em; } -#blog-listing-big .post .date-comments a:hover, -#blog-homepage .post .date-comments a:hover { - color: #467fbf; + +.box .box-footer { + background: #f7f7f7; + margin-top: 30px; + padding: 20px; + border-top: 1px solid #eee; } -@media (min-width: 768px) { - #blog-listing-big .post .date-comments, - #blog-homepage .post .date-comments { - text-align: right; - } + +.box.shipping-method, .box.payment-method { + margin: 0; + margin-bottom: 20px; } -#blog-listing-big .post .intro, -#blog-homepage .post .intro { - text-align: left; + +.box.shipping-method h4, .box.payment-method h4 { + text-transform: uppercase; + letter-spacing: 0.1em; + margin-bottom: 5px; } -#blog-listing-big .post .image, -#blog-homepage .post .image { - margin-bottom: 10px; - overflow: hidden; + +.box.shipping-method p, .box.payment-method p { + font-size: 0.9rem; + color: #555; } -#blog-listing-big .post .image img, -#blog-homepage .post .image img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.box-image-text { + margin: 15px 0; } -@media (max-width: 767px) { - #blog-listing-big .post .image img.img-responsive, - #blog-homepage .post .image img.img-responsive { - min-width: 100%; - } + +.box-image-text .image { + position: relative; + margin-bottom: 15px; } -#blog-listing-big .post .video, -#blog-homepage .post .video { - margin-bottom: 10px; + +.box-image-text .overlay { + width: 100%; + height: 100%; + background: rgba(70, 127, 191, 0.6); + position: absolute; + top: 0; + opacity: 0; + -webkit-transition: all 0.5s; + transition: all 0.5s; } -#blog-listing-big .post .read-more, -#blog-homepage .post .read-more { - text-align: right; + +.box-image-text .overlay a { + -webkit-transform: translateY(30px); + transform: translateY(30px); + opacity: 0; } -#blog-listing-medium .post { - margin-bottom: 60px; + +.box-image-text .overlay i { + margin-right: 5px; } -#blog-listing-medium .post h2 { - text-transform: uppercase; - margin: 0 0 10px; - font-size: 24px; - letter-spacing: 0.08em; + +.box-image-text .text { + text-align: center; } -#blog-listing-medium .post h2 a { - color: #555555; + +.box-image-text .text .intro { + text-align: left; + margin-bottom: 20px; + color: #888; + font-size: 0.9rem; } -#blog-listing-medium .post h2 a:hover { - color: #467fbf; + +.box-image-text h4 { + margin: 10px 0; + text-transform: uppercase; + letter-spacing: 0.1em; } -#blog-listing-medium .post .author-category { - float: left; - color: #999999; + +.box-image-text .author-category { + font-size: 0.75rem; + color: #999; text-transform: uppercase; - font-weight: 300; - font-size: 12px; - letter-spacing: 0.08em; + letter-spacing: 0.1em; } -#blog-listing-medium .post .author-category a { + +.box-image-text .author-category a { font-weight: 500; } -#blog-listing-medium .post .date-comments { - float: right; - font-size: 12px; -} -#blog-listing-medium .post .date-comments a { - color: #999999; - margin-right: 20px; -} -#blog-listing-medium .post .date-comments a:hover { - color: #467fbf; -} -@media (min-width: 768px) { - #blog-listing-medium .post .date-comments { - text-align: right; - } -} -#blog-listing-medium .post .intro { - text-align: left; + +.box-image-text:hover .overlay { + opacity: 1; } -#blog-listing-medium .post .clearfix:before, -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:before, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:before, -#blog-listing-medium .post .navbar-header:after { - content: " "; - display: table; -} -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:after { - clear: both; -} -#blog-listing-medium .post .clearfix:before, -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:before, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:before, -#blog-listing-medium .post .navbar-header:after { - content: " "; - display: table; + +.box-image-text:hover .overlay a { + -webkit-transform: none; + transform: none; + opacity: 1; } -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:after { - clear: both; + +.box-footer a { + margin: 0 !important; } -#blog-listing-medium .post .image { - margin-bottom: 10px; - overflow: hidden; + +.box-footer .right-col i { + margin-left: 5px; } -#blog-listing-medium .post .image img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.box-footer .left-col i { + margin-right: 5px; } + @media (max-width: 767px) { - #blog-listing-medium .post .image img.img-responsive { - min-width: 100%; + .box-footer { + -webkit-box-pack: center !important; + -ms-flex-pack: center !important; + justify-content: center !important; + } + .box-footer a { + margin-bottom: 10px !important; } } -#blog-listing-medium .post .video { - margin-bottom: 10px; + +.jumbotron h1, .jumbotron h2 { + letter-spacing: 0.1em; } -#blog-listing-medium .post .read-more { - text-align: right; + +.jumbotron p { + letter-spacing: 0.1em; + font-size: 1.3rem; +} + +.package { + text-align: center; + border: 1px solid #467fbf; + margin-top: 25px; + margin-bottom: 20px; + padding-bottom: 15px; + overflow: hidden; } -.box-image-text.blog .author-category { - color: #999999; + +.package .package-header { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + height: 55px; +} + +.package .package-header h5 { + margin: 0; text-transform: uppercase; - letter-spacing: 0.08em; - font-weight: 300; - font-size: 12px; + letter-spacing: 0.1em; + display: inline-block; + color: #555; } -.box-image-text.blog .author-category a { - font-weight: 500; + +.package .package-header .meta-text { + font-size: 0.8rem; } -.box-image-text.blog .intro { - text-align: left; + +.package h4 { + margin-top: 1rem; + margin-bottom: 0; + color: #333; +} + +.package .price-container { margin-bottom: 20px; } -#blog-homepage .post { - margin-bottom: 30px; + +.package .price-container span.period { + color: #777; + font-size: 0.9rem; + margin-left: 10px; } -#blog-homepage .post h2, -#blog-homepage .post h4, -#blog-homepage .post .author-category, -#blog-homepage .post .read-more { - text-align: center; + +.package ul { + padding: 0 30px; } -#blog-homepage .post .read-more { - margin-top: 20px; + +.package ul li { + padding: 10px; + border-bottom: 1px solid #eee; + color: #555; + font-size: 0.9rem; } -#blog-post #post-content { - margin-bottom: 20px; + +.package ul i { + margin-right: 10px; } -#blog-post .comment { - margin-bottom: 25px; + +.best-value .package { + margin-top: 0; + padding-bottom: 40px; + border: 1px solid #467fbf; } -#blog-post .comment:before, -#blog-post .comment:after { - content: " "; - display: table; + +.best-value .package .package-header { + height: 85px; } -#blog-post .comment:after { - clear: both; + +.best-value .package .package-header h5 { + color: #fff; } -#blog-post .comment:before, -#blog-post .comment:after { - content: " "; - display: table; + +.team-member { + margin-bottom: 40px; } -#blog-post .comment:after { - clear: both; + +.team-member .image { + margin-bottom: 1rem; } -#blog-post .comment .posted { - color: #999999; - font-size: 12px; + +.team-member a { + color: #333; } -#blog-post .comment .reply { - font-family: "Roboto", Helvetica, Arial, sans-serif; + +.team-member a:hover { + color: #333; } -#blog-post .comment.last { + +.team-member h3 { + font-size: 1.125rem; + text-transform: uppercase; + letter-spacing: 0.1em; + margin-bottom: 5px; +} + +.team-member p.role { + font-size: 0.8rem; + text-transform: uppercase; + color: #999; margin-bottom: 0; } -#blog-post #comments, -#blog-post #comment-form { - padding: 20px 0; - margin-top: 20px; - border-top: solid 1px #eeeeee; + +.team-member p { + color: #999; + font-size: 0.8rem; } -#blog-post #comments:before, -#blog-post #comment-form:before, -#blog-post #comments:after, -#blog-post #comment-form:after { - content: " "; - display: table; + +.team-member-detail p:not(.lead) { + color: #555; + font-size: 0.9rem; } -#blog-post #comments:after, -#blog-post #comment-form:after { - clear: both; + +.portfolio p { + color: #fff; } -#blog-post #comments:before, -#blog-post #comment-form:before, -#blog-post #comments:after, -#blog-post #comment-form:after { - content: " "; - display: table; + +.portfolio-project p { + font-size: 0.9rem; + color: #888; } -#blog-post #comments:after, -#blog-post #comment-form:after { - clear: both; + +.portfolio-project .project-more p { + padding: 5px 0; + font-size: 0.85rem; } -#blog-post #comments h4, -#blog-post #comment-form h4 { - margin-bottom: 20px; + +.portfolio-project .project-more h4 { + margin-bottom: 5px; + text-transform: uppercase; + letter-spacing: 0.1em; + font-size: 0.88rem; + color: #555; } -#blog-post #comment-form { - margin-bottom: 20px; + +.portfolio-showcase { + margin-bottom: 60px; +} + +.portfolio-showcase h3 { + text-transform: uppercase; + -webkit-transition-property: 0.1rem; + transition-property: 0.1rem; +} + +.portfolio-showcase .buttons { + margin-top: 40px; +} + +.portfolio-showcase p:not(.lead) { + color: #999; + font-size: 0.9rem; } + +.portfolio-showcase p.lead { + color: #666; +} + .product { - background: #fff; - border-bottom: solid 1px #e6e6e6; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - margin-bottom: 60px; - overflow: hidden; text-align: center; + position: relative; + margin-bottom: 40px; } + .product .image { overflow: hidden; + max-height: 190px; } -.product .image img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -@media (max-width: 767px) { - .product .image img.img-responsive { - min-width: 100%; - } + +.product .image a { + margin: 0; } + .product .text { padding: 10px; + border-bottom: 1px solid #ddd; } + .product .text h3 { - font-size: 14px; - font-weight: 700; - height: 39.6px; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.product .text h3 a { - color: #555555; -} -.product .text h3 a:hover { - text-decoration: none; + min-height: 63px; } -.product .text p.price { - font-size: 18px; + +.product .price { + font-size: 1.1rem; } -.product .text p.price del { - color: #999999; + +.product .price del { + color: #999; + display: inline-block; + margin-right: 5px; } -.product .buttons { - clear: both; - position: absolute; - display: none; - bottom: 0; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - width: 100%; - border: solid 1px transparent; - padding: 20px; - background: rgba(255, 255, 255, 0.9); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - text-align: center; + +.product img { + -webkit-transition: all 0.3s; + transition: all 0.3s; } -.product .buttons .btn { - margin-bottom: 20px; + +.product:hover img { + -webkit-transform: scale(1.1); + transform: scale(1.1); } -.product:hover { - border-bottom: solid 1px #808080; - top: 0; + +.product:hover .text { + border-color: #555; } -.product:hover .buttons { - clear: both; - position: absolute; - top: 0; - background: rgba(255, 255, 255, 0.5); + +.product a { + text-transform: uppercase; + letter-spacing: 0.1em; + color: #333; + text-decoration: none !important; + margin-top: 15px; } -.product:hover .image img { - -webkit-transform: scale(1.1, 1.1); - -ms-transform: scale(1.1, 1.1); - -o-transform: scale(1.1, 1.1); - transform: scale(1.1, 1.1); + +.products-big .image { + min-height: 250px; + max-height: 250px; } + .goToDescription { - font-size: 12px; text-align: center; + font-size: 0.8rem; margin-bottom: 40px; } + .goToDescription a { - color: #999999; + color: #999; text-decoration: underline; } -#productMain { - margin-bottom: 30px; + +table tr td { + vertical-align: middle !important; +} + +#customer-orders a.btn { + margin-top: 0; +} + +#customer-orders table { + font-size: 0.9rem; +} + +#customer-orders th { + border-top: 0; +} + +#customer-order img { + width: 50px; +} + +#customer-order tfoot th { + font-size: 1.2rem; + font-weight: 300; +} + +#customer-order p { + font-size: 1.2rem; + font-weight: 300; +} + +#productMain #thumbs { + margin-top: 30px; +} + +#productMain input { + display: none; } + #productMain .sizes { text-align: center; } -#productMain .sizes h3 { - font-weight: 700; - letter-spacing: 0.08em; - text-transform: uppercase; - margin-bottom: 40px; -} + #productMain .sizes a { - display: inline-block; - width: 40px; - height: 40px; - border-radius: 40px; - background: #ccc; - line-height: 40px; - color: #555555; - text-align: center; - text-decoration: none; - font-family: "Roboto", Helvetica, Arial, sans-serif; + text-decoration: none !important; } -#productMain .sizes a.active, + #productMain .sizes a:hover { background: #467fbf; color: #fff; } -#productMain .sizes input { - display: none; -} + #productMain .price { - font-size: 40px; text-align: center; - margin-top: 40px; - margin-bottom: 40px; + font-size: 2.5rem; + margin: 30px 0; + color: #555; } -#thumbs a { - display: block; - border: solid 1px transparent; + +#basket thead th { + border-top: none; } -#thumbs a.active { - border-color: #467fbf; + +#basket tfoot th { + font-size: 1.25rem; + color: #555; } -#product-social { - text-align: center; + +#order-summary tr td { + color: #999; } -#product-social h4 { - font-weight: 300; + +#order-summary tr.total { + font-size: 1.25rem; + color: #555; + font-weight: 700; +} + +#order-summary tr.total td { + color: #555; +} + +#checkout .nav-pills { + margin-bottom: 30px; + border-bottom: 1px solid #467fbf; +} + +#checkout .nav-pills a { + font-size: 0.9rem; + border-bottom: none !important; +} + +#checkout .nav-pills a.disabled { + cursor: not-allowed; +} + +#checkout form label { + margin-bottom: 5px; +} + +#checkout .payment-method:hover, #checkout .shipping-method:hover { + cursor: pointer; +} + +@media (max-width: 767px) { + .nav-pills { + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + } +} + +.sidebar-menu .badge { + font-weight: 700; + margin: 0; +} + +.sidebar-menu.with-icons a.nav-link { + position: relative; +} + +.sidebar-menu.with-icons a.nav-link::before { + content: '\f105'; + display: inline-block; + position: absolute; + top: 50%; + right: 15px; + -webkit-transform: translateY(-50%); + transform: translateY(-50%); + font-family: 'FontAwesome'; +} + +.panel-heading { margin-bottom: 10px; } -#product-social p { - line-height: 26px; + +.panel-heading h3 { + margin-top: 5px; } -#product-social p a { - margin: 0 10px 0 0; + +.panel-heading .btn { color: #fff; + text-decoration: none !important; +} + +.panel-heading .btn i { + margin-right: 7px; +} + +.panel-body p { + font-size: .9rem; + color: #555; +} + +.panel-body label { + font-size: 0.8rem; + font-weight: 400 !important; + color: #777; + opacity: 0.9; display: inline-block; - width: 26px; - height: 26px; - border-radius: 13px; - line-height: 26px; - font-size: 15px; - text-align: center; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - vertical-align: bottom; + cursor: pointer; } -#product-social p a i { - vertical-align: bottom; - line-height: 26px; + +.panel-body label input { + margin-right: 5px; } -#product-social p a.facebook { - background-color: #4460ae; + +.panel-body label:hover { + opacity: 1; } -#product-social p a.gplus { - background-color: #c21f25; + +.panel-body span.colour { + display: inline-block; + width: 14px; + height: 14px; + margin-top: 10px; + margin-left: 5px; + border: 1px solid #555; } -#product-social p a.twitter { - background-color: #3cf; + +.panel-body span.colour.white { + background: #fff; } -#product-social p a.instagram { - background-color: #cd4378; + +.panel-body span.colour.blue { + background: #007bff; } -#product-social p a.email { - background-color: #4a7f45; + +.panel-body span.colour.green { + background: #28a745; } -@media (max-width: 991px) { - #product-social { - text-align: center; - } + +.panel-body span.colour.red { + background: #dc3545; } -#checkout .nav { - margin-bottom: 20px; - border-bottom: solid 1px #467fbf; + +.panel-body span.colour.yellow { + background: #ffc107; } -#checkout .nav li { - height: 100%; + +.nav-pills .nav-link { + border-radius: 0; } -#checkout .nav li a { - display: block; - height: 100%; + +.nav-pills .nav-link:hover { + background: #eee; } -#order-summary table { - margin-top: 20px; + +.nav-pills .nav-link.active { + background: #467fbf; } -#order-summary table td { - color: #999999; + +.panel { + margin-bottom: 20px; } -#order-summary table tr.total td, -#order-summary table tr.total th { - font-size: 18px; - color: #555555; + +.category-menu a.nav-link { + text-transform: uppercase; + letter-spacing: 0.1em; font-weight: 700; } -#checkout .table tbody tr td, -#basket .table tbody tr td, -#customer-order .table tbody tr td { - vertical-align: middle; + +ul ul a.nav-link { + padding-left: 30px !important; + font-size: 0.85rem; + text-transform: none !important; + font-weight: 400 !important; + color: #777; } -#checkout .table tbody tr td input, -#basket .table tbody tr td input, -#customer-order .table tbody tr td input { - width: 50px; - text-align: right; + +.tag-cloud a { + font-size: 0.8rem; + border: 1px solid #eee; + text-transform: uppercase; + letter-spacing: 0.1em; + font-weight: 600; + padding: 5px 10px; + text-transform: uppercase; + margin: 3px 0; + text-decoration: none !important; } -#checkout .table tbody tr td img, -#basket .table tbody tr td img, -#customer-order .table tbody tr td img { - width: 50px; + +.tag-cloud a:hover { + border-color: #467fbf; } -#checkout .table tfoot, -#basket .table tfoot, -#customer-order .table tfoot { - font-size: 18px; + +.tag-cloud i { + margin-right: 5px; } -.shipping-method h4, -.payment-method h4 { + +.ribbon { + width: 80px; + height: 32px; + line-height: 32px; + background: #467fbf; + color: #fff; text-transform: uppercase; - letter-spacing: 0.08em; + letter-spacing: 0.1em; + font-weight: 700; + font-size: 0.9rem; + margin-bottom: 20px; + position: absolute; + top: 30px; + left: -15px; + text-align: center; } -#customer-orders table tr th, -#customer-orders table tr td { - vertical-align: baseline; + +.ribbon.sale { + background: #467fbf; } -#customer-order .table tfoot th { - font-size: 18px; - font-weight: 300; + +.ribbon.new { + background: #5bc0de; } -#customer-order .addresses { - text-align: right; - margin-bottom: 30px; + +.ribbon.new::after { + content: ''; + border-top: 15px solid #1f7e9a; } -#customer-order .addresses p { - font-size: 18px; - font-weight: 300; + +.ribbon.sold { + background: #f0ad4e; } -#customer-account { - margin-bottom: 30px; + +.ribbon.sold::after { + content: ''; + border-top: 15px solid #b06d0f; } -#get-it { - background: #467fbf; - padding: 50px 0 30px; - color: #fff; - text-align: center; + +.ribbon.gift { + background: #5cb85c; +} + +.ribbon.gift::after { + content: ''; + border-top: 15px solid #2d672d; +} + +.ribbon:nth-of-type(2) { + top: 82px; +} + +.ribbon::after { + content: ''; + border-top: 15px solid #2b527e; + border-left: 15px solid transparent; + border-right: 0 solid transparent; + position: absolute; + bottom: -15px; + left: 0; + display: block; } -#get-it h1, -#get-it h2, -#get-it h3, -#get-it h4, -#get-it h5, -#get-it h6 { - color: #fff; + +.badge { + font-weight: 400; text-transform: uppercase; - letter-spacing: 0.08em; - margin: 0 0 20px; + letter-spacing: 0.1em; + padding: 3px 5px; } -#get-it p { - margin: 0 0 20px; + +#map { + border-top: 1px solid #467fbf; + border-bottom: 1px solid #467fbf; + height: 300px; } -#footer { - background: #555555; + +.get-it { + background: #467fbf; + color: #fff; padding: 50px 0; - color: #999999; -} -#footer h1, -#footer h2, -#footer h3, -#footer h4, -#footer h5, -#footer h6 { - color: #eeeeee; -} -#footer h4 { - font-size: 14px; - font-weight: 800; - text-transform: uppercase; - letter-spacing: 0.08em; } -#footer ul { - padding-left: 0; - list-style: none; -} -#footer ul a { - color: #999999; + +.get-it h3 { + text-transform: uppercase; + letter-spacing: 0.1em; + margin: 0; } -#footer ul a:hover { - color: #467fbf; - text-decoration: none; + +footer.main-footer { + padding: 60px 0; + padding-bottom: 0; + background: #555; + color: #fff; } -#footer .photostream div { - float: left; - display: block; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - width: 33%; - padding: 7.5px; - overflow: hidden; + +footer.main-footer a { + color: inherit; + color: #eee; } -#footer .photostream div a { - border: solid 1 px #eeeeee; + +footer.main-footer h4 { + color: #eee; + margin: 10px 0; + text-transform: uppercase; + letter-spacing: 0.1em; } -#footer .photostream div img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +footer.main-footer p { + font-size: 0.9rem; + color: #aaa; } -#footer .photostream div:hover img { - -webkit-transform: scale(1.1, 1.1); - -ms-transform: scale(1.1, 1.1); - -o-transform: scale(1.1, 1.1); - transform: scale(1.1, 1.1); + +footer.main-footer hr { + border: none; + border-top: 1px solid #ddd; + background: none; } -#footer .blog-entries .item { - clear: both; - padding: 5px 0; - margin-bottom: 10px; - border-bottom: solid 1px #555555; + +footer.main-footer .footer-blog-list li { + margin-bottom: 20px; } -#footer .blog-entries .item .image { - float: left; - width: 15%; + +footer.main-footer .image { + width: 40px; + height: 40px; margin-right: 10px; + -ms-flex-negative: 0; + flex-shrink: 0; } -#footer .blog-entries .item .name { - width: 75%; - margin-left: 10px; - display: table-cell; - vertical-align: middle; -} -#footer .blog-entries .item .name h5 { - margin: 0; + +footer.main-footer .text { text-transform: uppercase; - letter-spacing: 0.08em; - font-size: 12px; -} -#footer .blog-entries .item .name h5 a { - color: #eeeeee; -} -#footer .blog-entries .item .text { - width: 100%; - clear: both; + letter-spacing: 0.1em; } -#footer .blog-entries .item:last-child { - border-bottom: none; - margin-bottom: 0; + +footer.main-footer .text a { + font-size: 0.8rem; } -#footer .social a { - color: #555555; - font-size: 25px; - margin: 0 10px 0 0; + +footer.main-footer .photo-stream li { + margin: 0; } -#footer .social a:hover { - color: #467fbf; + +footer.main-footer .photo-stream a { + width: 80px; + height: 80px; + padding: 5px; + display: block; } -#copyright { + +footer.main-footer .copyrights { + padding: 50px 0; background: #333; color: #ccc; - padding: 50px 0; - font-size: 12px; - line-height: 28px; + margin-top: 50px; } -#copyright p { - margin: 0; + +footer.main-footer .copyrights a { + color: #467fbf; +} + +footer.main-footer .copyrights p { + color: inherit; + font-size: 0.8rem; + margin-bottom: 0; } + @media (max-width: 991px) { - #copyright p { - float: none !important; - text-align: center; - margin-bottom: 10px; + footer.main-footer .photo-stream a { + width: 120px; + height: 120px; } } -[data-animate] { - opacity: 0; - filter: alpha(opacity=0); + +@media (max-width: 767px) { + footer.main-footer .photo-stream li { + width: 32%; + margin-bottom: 10px; + } + footer.main-footer .photo-stream a { + width: 100%; + height: auto; + } } + +/* + +===================== +STYLE SWITCHER FOR DEMO +===================== + +*/ #style-switch-button { position: fixed; - top: 100px; + top: 120px; left: 0px; border-radius: 0; + z-index: 2; } + #style-switch { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; width: 300px; padding: 20px; position: fixed; - top: 140px; + top: 160px; left: 0; background: #fff; - border: solid 1px #eeeeee; + border: solid 1px #ced4da; + z-index: 2000; } -@media (max-width: 991px) { - #style-switch-button { - display: none; - } - #style-switch { - display: none; - } + +#style-switch h4 { + color: #495057; } -/* Original Boostrap template overwrite */ -/* breadcrumbs */ -.breadcrumb { - font-family: "Roboto", Helvetica, Arial, sans-serif; - text-transform: uppercase; - background-color: none; - letter-spacing: 0.08em; + +/* + * 1. NAVBAR + */ +.navbar { + padding: 0.5rem 1rem; } -/* nav */ -.nav > li > a { - padding: 10px 15px; + +.navbar-brand { + display: inline-block; + padding-top: 0.3125rem; + padding-bottom: 0.3125rem; + margin-right: 1rem; + font-size: 1.25rem; +} + +.navbar-toggler { + padding: 0.25rem 0.75rem; + font-size: 1.25rem; + line-height: 1; + border: 1px solid transparent; + border-radius: 0; } -.nav > li > a:hover, -.nav > li > a:focus { - background-color: #eeeeee; + +.navbar-light .navbar-brand { + color: rgba(0, 0, 0, 0.9); } -.nav > li.disabled > a { - color: #999999; + +.navbar-light .navbar-brand:focus, .navbar-light .navbar-brand:hover { + color: rgba(0, 0, 0, 0.9); } -.nav > li.disabled > a:hover, -.nav > li.disabled > a:focus { - color: #999999; + +.navbar-light .navbar-nav .nav-link { + color: rgba(0, 0, 0, 0.5); } -.nav .open > a, -.nav .open > a:hover, -.nav .open > a:focus { - background-color: #eeeeee; - border-color: #467fbf; + +.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover { + color: rgba(0, 0, 0, 0.7); } -.nav-tabs { - border-bottom: 1px solid #467fbf; + +.navbar-light .navbar-nav .nav-link.disabled { + color: rgba(0, 0, 0, 0.3); } -.nav-tabs > li { - float: left; - margin-bottom: -1px; + +.navbar-light .navbar-nav .show > .nav-link, +.navbar-light .navbar-nav .active > .nav-link, +.navbar-light .navbar-nav .nav-link.show, +.navbar-light .navbar-nav .nav-link.active { + color: rgba(0, 0, 0, 0.9); } -.nav-tabs > li > a { - margin-right: 2px; - line-height: 1.42857143; - border: 1px solid transparent; - border-radius: 0 0 0 0; + +.navbar-light .navbar-toggler { + color: rgba(0, 0, 0, 0.5); + border-color: rgba(0, 0, 0, 0.1); } -.nav-tabs > li > a:hover { - border-color: #eeeeee #eeeeee #467fbf; + +.navbar-light .navbar-toggler-icon { + background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); } -.nav-tabs > li.active > a, -.nav-tabs > li.active > a:hover, -.nav-tabs > li.active > a:focus { - color: #555555; - background-color: #ffffff; - border: 1px solid #467fbf; - border-bottom-color: transparent; - cursor: default; + +.navbar-light .navbar-text { + color: rgba(0, 0, 0, 0.5); } -.nav-tabs.nav-justified { - width: 100%; - border-bottom: solid 1px #467fbf; - border-bottom: 0; + +.navbar-dark .navbar-brand { + color: #fff; } -.nav-tabs.nav-justified > li { - float: none; + +.navbar-dark .navbar-brand:focus, .navbar-dark .navbar-brand:hover { + color: #fff; } -.nav-tabs.nav-justified > li > a { - text-align: center; - /*margin-bottom: 5px;*/ + +.navbar-dark .navbar-nav .nav-link { + color: rgba(255, 255, 255, 0.5); } -.nav-tabs.nav-justified > .dropdown .dropdown-menu { - top: auto; - left: auto; + +.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover { + color: rgba(255, 255, 255, 0.75); } -.nav-tabs.nav-justified > li > a { - margin-right: 0; - border-radius: 0; + +.navbar-dark .navbar-nav .nav-link.disabled { + color: rgba(255, 255, 255, 0.25); } -.nav-tabs.nav-justified > .active > a, -.nav-tabs.nav-justified > .active > a:hover, -.nav-tabs.nav-justified > .active > a:focus { - border: 1px solid #467fbf; + +.navbar-dark .navbar-nav .show > .nav-link, +.navbar-dark .navbar-nav .active > .nav-link, +.navbar-dark .navbar-nav .nav-link.show, +.navbar-dark .navbar-nav .nav-link.active { + color: #fff; } -@media (min-width: 768px) { - .nav-tabs.nav-justified > li > a { - border-bottom: 1px solid #467fbf; - border-radius: 0 0 0 0; - } - .nav-tabs.nav-justified > .active > a, - .nav-tabs.nav-justified > .active > a:hover, - .nav-tabs.nav-justified > .active > a:focus { - border-bottom-color: #ffffff; - } + +.navbar-dark .navbar-toggler { + color: rgba(255, 255, 255, 0.5); + border-color: rgba(255, 255, 255, 0.1); } -.nav-pills > li { - float: left; + +.navbar-dark .navbar-toggler-icon { + background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); } -.nav-pills > li > a { + +.navbar-dark .navbar-text { + color: rgba(255, 255, 255, 0.5); +} + +/* + * 2. BUTTONS + */ +.btn { + font-weight: 700; + border: 1px solid transparent; + padding: 0.5rem 0.75rem; + font-size: 0.8rem; + line-height: 1.5; border-radius: 0; + -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; } -.nav-pills > li + li { - margin-left: 2px; + +.btn:focus, .btn.focus { + outline: 0; + -webkit-box-shadow: 0 0 0 0.2rem rgba(70, 127, 191, 0.25); + box-shadow: 0 0 0 0.2rem rgba(70, 127, 191, 0.25); +} + +.btn.disabled, .btn:disabled { + opacity: .65; +} + +.btn:not([disabled]):not(.disabled):active, .btn:not([disabled]):not(.disabled).active { + background-image: none; } -.nav-pills > li.active > a, -.nav-pills > li.active > a:hover, -.nav-pills > li.active > a:focus { - color: #ffffff; + +.btn-primary { + color: color-yiq(#467fbf); background-color: #467fbf; + border-color: #467fbf; } -.nav-stacked > li { - float: none; + +.btn-primary:hover { + color: color-yiq(#396ca5); + background-color: #36669c; + border-color: #36669c; } -.nav-stacked > li + li { - margin-top: 2px; - margin-left: 0; + +.btn-primary:focus, .btn-primary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(70, 127, 191, 0.5); + box-shadow: 0 0 0 0.2rem rgba(70, 127, 191, 0.5); } -.nav-justified { - width: 100%; - border-bottom: solid 1px #467fbf; + +.btn-primary.disabled, .btn-primary:disabled { + color: color-yiq(#467fbf); + background-color: #467fbf; + border-color: #467fbf; } -.nav-justified > li { - float: none; + +.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active, +.show > .btn-primary.dropdown-toggle { + color: color-yiq(#36669c); + background-color: #36669c; + border-color: #336093; +} + +.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, +.show > .btn-primary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(70, 127, 191, 0.5); + box-shadow: 0 0 0 0.2rem rgba(70, 127, 191, 0.5); +} + +.btn-secondary { + color: color-yiq(#868e96); + background-color: #868e96; + border-color: #868e96; +} + +.btn-secondary:hover { + color: color-yiq(#727b84); + background-color: #6c757d; + border-color: #6c757d; +} + +.btn-secondary:focus, .btn-secondary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); +} + +.btn-secondary.disabled, .btn-secondary:disabled { + color: color-yiq(#868e96); + background-color: #868e96; + border-color: #868e96; +} + +.btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active, +.show > .btn-secondary.dropdown-toggle { + color: color-yiq(#6c757d); + background-color: #6c757d; + border-color: #666e76; +} + +.btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus, +.show > .btn-secondary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); +} + +.btn-success { + color: color-yiq(#28a745); + background-color: #28a745; + border-color: #28a745; +} + +.btn-success:hover { + color: color-yiq(#218838); + background-color: #1e7e34; + border-color: #1e7e34; +} + +.btn-success:focus, .btn-success.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); +} + +.btn-success.disabled, .btn-success:disabled { + color: color-yiq(#28a745); + background-color: #28a745; + border-color: #28a745; +} + +.btn-success:not(:disabled):not(.disabled):active, .btn-success:not(:disabled):not(.disabled).active, +.show > .btn-success.dropdown-toggle { + color: color-yiq(#1e7e34); + background-color: #1e7e34; + border-color: #1c7430; +} + +.btn-success:not(:disabled):not(.disabled):active:focus, .btn-success:not(:disabled):not(.disabled).active:focus, +.show > .btn-success.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); +} + +.btn-info { + color: color-yiq(#17a2b8); + background-color: #17a2b8; + border-color: #17a2b8; +} + +.btn-info:hover { + color: color-yiq(#138496); + background-color: #117a8b; + border-color: #117a8b; +} + +.btn-info:focus, .btn-info.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); +} + +.btn-info.disabled, .btn-info:disabled { + color: color-yiq(#17a2b8); + background-color: #17a2b8; + border-color: #17a2b8; +} + +.btn-info:not(:disabled):not(.disabled):active, .btn-info:not(:disabled):not(.disabled).active, +.show > .btn-info.dropdown-toggle { + color: color-yiq(#117a8b); + background-color: #117a8b; + border-color: #10707f; +} + +.btn-info:not(:disabled):not(.disabled):active:focus, .btn-info:not(:disabled):not(.disabled).active:focus, +.show > .btn-info.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); +} + +.btn-warning { + color: color-yiq(#ffc107); + background-color: #ffc107; + border-color: #ffc107; +} + +.btn-warning:hover { + color: color-yiq(#e0a800); + background-color: #d39e00; + border-color: #d39e00; +} + +.btn-warning:focus, .btn-warning.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-warning.disabled, .btn-warning:disabled { + color: color-yiq(#ffc107); + background-color: #ffc107; + border-color: #ffc107; +} + +.btn-warning:not(:disabled):not(.disabled):active, .btn-warning:not(:disabled):not(.disabled).active, +.show > .btn-warning.dropdown-toggle { + color: color-yiq(#d39e00); + background-color: #d39e00; + border-color: #c69500; +} + +.btn-warning:not(:disabled):not(.disabled):active:focus, .btn-warning:not(:disabled):not(.disabled).active:focus, +.show > .btn-warning.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-danger { + color: color-yiq(#dc3545); + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-danger:hover { + color: color-yiq(#c82333); + background-color: #bd2130; + border-color: #bd2130; +} + +.btn-danger:focus, .btn-danger.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-danger.disabled, .btn-danger:disabled { + color: color-yiq(#dc3545); + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-danger:not(:disabled):not(.disabled):active, .btn-danger:not(:disabled):not(.disabled).active, +.show > .btn-danger.dropdown-toggle { + color: color-yiq(#bd2130); + background-color: #bd2130; + border-color: #b21f2d; +} + +.btn-danger:not(:disabled):not(.disabled):active:focus, .btn-danger:not(:disabled):not(.disabled).active:focus, +.show > .btn-danger.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-light { + color: color-yiq(#f8f9fa); + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-light:hover { + color: color-yiq(#e2e6ea); + background-color: #dae0e5; + border-color: #dae0e5; +} + +.btn-light:focus, .btn-light.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-light.disabled, .btn-light:disabled { + color: color-yiq(#f8f9fa); + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-light:not(:disabled):not(.disabled):active, .btn-light:not(:disabled):not(.disabled).active, +.show > .btn-light.dropdown-toggle { + color: color-yiq(#dae0e5); + background-color: #dae0e5; + border-color: #d3d9df; +} + +.btn-light:not(:disabled):not(.disabled):active:focus, .btn-light:not(:disabled):not(.disabled).active:focus, +.show > .btn-light.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-dark { + color: color-yiq(#343a40); + background-color: #343a40; + border-color: #343a40; +} + +.btn-dark:hover { + color: color-yiq(#23272b); + background-color: #1d2124; + border-color: #1d2124; +} + +.btn-dark:focus, .btn-dark.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-dark.disabled, .btn-dark:disabled { + color: color-yiq(#343a40); + background-color: #343a40; + border-color: #343a40; +} + +.btn-dark:not(:disabled):not(.disabled):active, .btn-dark:not(:disabled):not(.disabled).active, +.show > .btn-dark.dropdown-toggle { + color: color-yiq(#1d2124); + background-color: #1d2124; + border-color: #171a1d; +} + +.btn-dark:not(:disabled):not(.disabled):active:focus, .btn-dark:not(:disabled):not(.disabled).active:focus, +.show > .btn-dark.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-default { + color: color-yiq(#ced4da); + background-color: #ced4da; + border-color: #ced4da; +} + +.btn-default:hover { + color: color-yiq(#b8c1ca); + background-color: #b1bbc4; + border-color: #b1bbc4; +} + +.btn-default:focus, .btn-default.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); + box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); +} + +.btn-default.disabled, .btn-default:disabled { + color: color-yiq(#ced4da); + background-color: #ced4da; + border-color: #ced4da; +} + +.btn-default:not(:disabled):not(.disabled):active, .btn-default:not(:disabled):not(.disabled).active, +.show > .btn-default.dropdown-toggle { + color: color-yiq(#b1bbc4); + background-color: #b1bbc4; + border-color: #aab4bf; +} + +.btn-default:not(:disabled):not(.disabled):active:focus, .btn-default:not(:disabled):not(.disabled).active:focus, +.show > .btn-default.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); + box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); +} + +.btn-outline-primary { + color: #467fbf; + background-color: transparent; + background-image: none; + border-color: #467fbf; } -.nav-justified > li > a { - text-align: center; - /*margin-bottom: 5px;*/ + +.btn-outline-primary:hover { + color: #fff; + background-color: #467fbf; + border-color: #467fbf; } -.nav-justified > .dropdown .dropdown-menu { - top: auto; - left: auto; + +.btn-outline-primary:focus, .btn-outline-primary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(70, 127, 191, 0.5); + box-shadow: 0 0 0 0.2rem rgba(70, 127, 191, 0.5); } -.nav-tabs-justified { - border-bottom: 0; + +.btn-outline-primary.disabled, .btn-outline-primary:disabled { + color: #467fbf; + background-color: transparent; } -.nav-tabs-justified > li > a { - margin-right: 0; - border-radius: 0; + +.btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active, +.show > .btn-outline-primary.dropdown-toggle { + color: color-yiq(#467fbf); + background-color: #467fbf; + border-color: #467fbf; } -.nav-tabs-justified > .active > a, -.nav-tabs-justified > .active > a:hover, -.nav-tabs-justified > .active > a:focus { - border: 1px solid #467fbf; + +.btn-outline-primary:not(:disabled):not(.disabled):active:focus, .btn-outline-primary:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-primary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(70, 127, 191, 0.5); + box-shadow: 0 0 0 0.2rem rgba(70, 127, 191, 0.5); } -@media (min-width: 768px) { - .nav-tabs-justified > li > a { - border-bottom: 1px solid #467fbf; - border-radius: 0 0 0 0; - } - .nav-tabs-justified > .active > a, - .nav-tabs-justified > .active > a:hover, - .nav-tabs-justified > .active > a:focus { - border-bottom-color: #ffffff; - } + +.btn-outline-secondary { + color: #868e96; + background-color: transparent; + background-image: none; + border-color: #868e96; } -.tab-content { - padding: 15px; - border: solid 1px #ddd; - border-top: none; + +.btn-outline-secondary:hover { + color: #fff; + background-color: #868e96; + border-color: #868e96; } -/* navbar */ -.navbar { - position: relative; - min-height: 62px; - margin-bottom: 0; - border-bottom: 1px solid transparent; + +.btn-outline-secondary:focus, .btn-outline-secondary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); } -@media (min-width: 768px) { - .navbar { - border-radius: 0px; - } + +.btn-outline-secondary.disabled, .btn-outline-secondary:disabled { + color: #868e96; + background-color: transparent; } -@media (min-width: 768px) { - .navbar-header { - float: left; - } + +.btn-outline-secondary:not(:disabled):not(.disabled):active, .btn-outline-secondary:not(:disabled):not(.disabled).active, +.show > .btn-outline-secondary.dropdown-toggle { + color: color-yiq(#868e96); + background-color: #868e96; + border-color: #868e96; +} + +.btn-outline-secondary:not(:disabled):not(.disabled):active:focus, .btn-outline-secondary:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-secondary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); +} + +.btn-outline-success { + color: #28a745; + background-color: transparent; + background-image: none; + border-color: #28a745; } -.navbar-collapse { - overflow-x: visible; - padding-right: 15px; - padding-left: 15px; + +.btn-outline-success:hover { + color: #fff; + background-color: #28a745; + border-color: #28a745; } -.navbar-collapse.in { - overflow-y: auto; + +.btn-outline-success:focus, .btn-outline-success.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); } -@media (min-width: 768px) { - .navbar-collapse { - width: auto; - border-top: 0; - box-shadow: none; - } - .navbar-collapse.collapse { - display: block !important; - height: auto !important; - padding-bottom: 0; - overflow: visible !important; - } - .navbar-collapse.in { - overflow-y: visible; - } - .navbar-fixed-top .navbar-collapse, - .navbar-static-top .navbar-collapse, - .navbar-fixed-bottom .navbar-collapse { - padding-left: 0; - padding-right: 0; - } + +.btn-outline-success.disabled, .btn-outline-success:disabled { + color: #28a745; + background-color: transparent; } -.navbar-fixed-top .navbar-collapse, -.navbar-affixed-top .navbar-collapse, -.navbar-fixed-bottom .navbar-collapse { - max-height: 340px; + +.btn-outline-success:not(:disabled):not(.disabled):active, .btn-outline-success:not(:disabled):not(.disabled).active, +.show > .btn-outline-success.dropdown-toggle { + color: color-yiq(#28a745); + background-color: #28a745; + border-color: #28a745; +} + +.btn-outline-success:not(:disabled):not(.disabled):active:focus, .btn-outline-success:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-success.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); +} + +.btn-outline-info { + color: #17a2b8; + background-color: transparent; + background-image: none; + border-color: #17a2b8; } -@media (max-width: 480px) and (orientation: landscape) { - .navbar-fixed-top .navbar-collapse, - .navbar-affixed-top .navbar-collapse, - .navbar-fixed-bottom .navbar-collapse { - max-height: 200px; - } + +.btn-outline-info:hover { + color: #fff; + background-color: #17a2b8; + border-color: #17a2b8; } -.container > .navbar-header, -.container-fluid > .navbar-header, -.container > .navbar-collapse, -.container-fluid > .navbar-collapse { - margin-right: -15px; - margin-left: -15px; -} -@media (min-width: 768px) { - .container > .navbar-header, - .container-fluid > .navbar-header, - .container > .navbar-collapse, - .container-fluid > .navbar-collapse { - margin-right: 0; - margin-left: 0; - } + +.btn-outline-info:focus, .btn-outline-info.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); } -.navbar-static-top { - z-index: 1000; - border-width: 0 0 1px; + +.btn-outline-info.disabled, .btn-outline-info:disabled { + color: #17a2b8; + background-color: transparent; } -@media (min-width: 768px) { - .navbar-static-top { - border-radius: 0; - } + +.btn-outline-info:not(:disabled):not(.disabled):active, .btn-outline-info:not(:disabled):not(.disabled).active, +.show > .btn-outline-info.dropdown-toggle { + color: color-yiq(#17a2b8); + background-color: #17a2b8; + border-color: #17a2b8; +} + +.btn-outline-info:not(:disabled):not(.disabled):active:focus, .btn-outline-info:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-info.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); +} + +.btn-outline-warning { + color: #ffc107; + background-color: transparent; + background-image: none; + border-color: #ffc107; } -.navbar-fixed-top, -.navbar-fixed-bottom { - position: fixed; - right: 0; - left: 0; - z-index: 1030; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); -} -@media (min-width: 768px) { - .navbar-fixed-top, - .navbar-fixed-bottom { - border-radius: 0; - } + +.btn-outline-warning:hover { + color: #fff; + background-color: #ffc107; + border-color: #ffc107; } -.navbar-fixed-top { - top: 0; - border-width: 0 0 1px; + +.btn-outline-warning:focus, .btn-outline-warning.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); } -.navbar-fixed-bottom { - bottom: 0; - margin-bottom: 0; - border-width: 1px 0 0; + +.btn-outline-warning.disabled, .btn-outline-warning:disabled { + color: #ffc107; + background-color: transparent; } -.navbar-brand { - float: left; - padding: 10px 15px; - font-size: 18px; - line-height: 20px; - height: 62px; + +.btn-outline-warning:not(:disabled):not(.disabled):active, .btn-outline-warning:not(:disabled):not(.disabled).active, +.show > .btn-outline-warning.dropdown-toggle { + color: color-yiq(#ffc107); + background-color: #ffc107; + border-color: #ffc107; +} + +.btn-outline-warning:not(:disabled):not(.disabled):active:focus, .btn-outline-warning:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-warning.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-outline-danger { + color: #dc3545; + background-color: transparent; + background-image: none; + border-color: #dc3545; } -.navbar-brand:hover, -.navbar-brand:focus { - text-decoration: none; + +.btn-outline-danger:hover { + color: #fff; + background-color: #dc3545; + border-color: #dc3545; } -@media (min-width: 768px) { - .navbar > .container .navbar-brand, - .navbar > .container-fluid .navbar-brand { - margin-left: -15px; - } + +.btn-outline-danger:focus, .btn-outline-danger.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); } -.navbar-toggle { - position: relative; - float: right; - margin-right: 15px; - padding: 9px 10px; - margin-top: 14px; - margin-bottom: 14px; + +.btn-outline-danger.disabled, .btn-outline-danger:disabled { + color: #dc3545; + background-color: transparent; +} + +.btn-outline-danger:not(:disabled):not(.disabled):active, .btn-outline-danger:not(:disabled):not(.disabled).active, +.show > .btn-outline-danger.dropdown-toggle { + color: color-yiq(#dc3545); + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-outline-danger:not(:disabled):not(.disabled):active:focus, .btn-outline-danger:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-danger.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-outline-light { + color: #f8f9fa; background-color: transparent; background-image: none; - border: 1px solid transparent; + border-color: #f8f9fa; +} + +.btn-outline-light:hover { + color: #fff; + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-outline-light:focus, .btn-outline-light.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-outline-light.disabled, .btn-outline-light:disabled { + color: #f8f9fa; + background-color: transparent; +} + +.btn-outline-light:not(:disabled):not(.disabled):active, .btn-outline-light:not(:disabled):not(.disabled).active, +.show > .btn-outline-light.dropdown-toggle { + color: color-yiq(#f8f9fa); + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-outline-light:not(:disabled):not(.disabled):active:focus, .btn-outline-light:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-light.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-outline-dark { + color: #343a40; + background-color: transparent; + background-image: none; + border-color: #343a40; +} + +.btn-outline-dark:hover { + color: #fff; + background-color: #343a40; + border-color: #343a40; +} + +.btn-outline-dark:focus, .btn-outline-dark.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-outline-dark.disabled, .btn-outline-dark:disabled { + color: #343a40; + background-color: transparent; +} + +.btn-outline-dark:not(:disabled):not(.disabled):active, .btn-outline-dark:not(:disabled):not(.disabled).active, +.show > .btn-outline-dark.dropdown-toggle { + color: color-yiq(#343a40); + background-color: #343a40; + border-color: #343a40; +} + +.btn-outline-dark:not(:disabled):not(.disabled):active:focus, .btn-outline-dark:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-dark.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-lg { + padding: 0.5rem 1rem; + font-size: 1.25rem; + line-height: 1.5; + border-radius: 0; +} + +.btn-sm { + padding: 0.25rem 0.5rem; + font-size: 0.7rem; + line-height: 1.5; border-radius: 0; } -.navbar-toggle:focus { - outline: 0; + +/* + * 3. TYPE + */ +body { + font-family: "Roboto", Helvetica, Arial, sans-serif; + font-size: 1rem; + font-weight: 400; + line-height: 1.5; + color: #212529; + background-color: #fff; +} + +a { + color: #467fbf; + text-decoration: none; +} + +a:focus, a:hover { + color: #2f5a89; + text-decoration: underline; +} + +h1, +h2, +h3, +h4, +h5, +h6, +.h1, +.h2, +.h3, +.h4, +.h5, +.h6 { + margin-bottom: 1rem; + font-family: inherit; + font-weight: 700; + line-height: 1.1; + color: inherit; +} + +h1, +.h1 { + font-size: 2.2rem; +} + +h2, +.h2 { + font-size: 1.8rem; +} + +h3, +.h3 { + font-size: 1.5rem; +} + +h4, +.h4 { + font-size: 1.1rem; +} + +h5, +.h5 { + font-size: 1rem; +} + +h6, +.h6 { + font-size: 0.8rem; +} + +.lead { + font-size: 1.25rem; + font-weight: 300; +} + +.display-1 { + font-size: 6rem; + font-weight: 300; + line-height: 1.1; +} + +.display-2 { + font-size: 5.5rem; + font-weight: 300; + line-height: 1.1; } -.navbar-nav { - margin: 10.5px -15px; + +.display-3 { + font-size: 4.5rem; + font-weight: 300; + line-height: 1.1; } -.navbar-nav > li > a { - padding-top: 10px; - padding-bottom: 10px; - line-height: 20px; + +.display-4 { + font-size: 3.5rem; + font-weight: 300; + line-height: 1.1; } -@media (max-width: 767px) { - .navbar-nav .open .dropdown-menu > li > a, - .navbar-nav .open .dropdown-menu .dropdown-header { - padding: 5px 15px 5px 25px; - } - .navbar-nav .open .dropdown-menu > li > a { - line-height: 20px; - } - .navbar-nav .open .dropdown-menu > li > a:hover, - .navbar-nav .open .dropdown-menu > li > a:focus { - background-image: none; - } + +hr { + border-top: 1px solid rgba(0, 0, 0, 0.1); } -@media (min-width: 768px) { - .navbar-nav { - float: left; - margin: 0; - } - .navbar-nav > li { - float: left; - } - .navbar-nav > li > a { - padding-top: 21px; - padding-bottom: 21px; - } - .navbar-nav.navbar-right:last-child { - margin-right: -15px; - } + +small, +.small { + font-size: 80%; + font-weight: 400; } -@media (min-width: 768px) { - .navbar-left { - float: left !important; - } - .navbar-right { - float: right !important; - } + +mark, +.mark { + padding: 0.2em; + background-color: #fcf8e3; +} + +.blockquote { + padding: 0.5rem 1rem; + margin-bottom: 2rem; + font-size: 1rem; + border-left: 5px solid #467fbf; } -.navbar-form { - margin-left: -15px; - margin-right: -15px; - padding: 10px 15px; - border-top: 1px solid transparent; - border-bottom: 1px solid transparent; - -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); - margin-top: 14px; - margin-bottom: 14px; + +.blockquote-footer { + color: #868e96; } -@media (max-width: 767px) { - .navbar-form .form-group { - margin-bottom: 5px; - } + +.blockquote-footer::before { + content: "\2014 \00A0"; } -@media (min-width: 768px) { - .navbar-form { - width: auto; - border: 0; - margin-left: 0; - margin-right: 0; - padding-top: 0; - padding-bottom: 0; - -webkit-box-shadow: none; - box-shadow: none; - } - .navbar-form.navbar-right:last-child { - margin-right: -15px; - } + +.text-primary { + color: #467fbf !important; } -.navbar-nav > li > .dropdown-menu { - margin-top: 0; - border-top-right-radius: 0; - border-top-left-radius: 0; + +a.text-primary:focus, a.text-primary:hover { + color: #36669c !important; } -.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu { - border-bottom-right-radius: 0; + +/* + * 4. PAGINATION + */ +.page-item:first-child .page-link { + border-top-left-radius: 0; border-bottom-left-radius: 0; } -.navbar-btn { - margin-top: 14px; - margin-bottom: 14px; + +.page-item:last-child .page-link { + border-top-right-radius: 0; + border-bottom-right-radius: 0; } -.navbar-btn.btn-sm { - margin-top: 16px; - margin-bottom: 16px; + +.page-item.active .page-link { + color: #fff; + background-color: #467fbf; + border-color: #467fbf; } -.navbar-btn.btn-xs { - margin-top: 20px; - margin-bottom: 20px; + +.page-item.disabled .page-link { + color: #868e96; + background-color: #fff; + border-color: #dee2e6; } -.navbar-text { - margin-top: 21px; - margin-bottom: 21px; + +.page-link { + padding: 0.5rem 0.75rem; + line-height: 1.25; + color: #467fbf; + background-color: #fff; + border: 1px solid #dee2e6; } -@media (min-width: 768px) { - .navbar-text { - float: left; - margin-left: 15px; - margin-right: 15px; - } - .navbar-text.navbar-right:last-child { - margin-right: 0; - } + +.page-link:focus, .page-link:hover { + color: #2f5a89; + text-decoration: none; + background-color: #e9ecef; + border-color: #dee2e6; + outline: 0; } -.navbar-default { - background-color: #ffffff; - border-color: #cccccc; - border-bottom: none; + +.pagination-lg .page-link { + padding: 0.75rem 1.5rem; + font-size: 1.25rem; + line-height: 1.5; } -.navbar-default .navbar-brand { - color: #555555; + +.pagination-lg .page-item:first-child .page-link { + border-top-left-radius: 0; + border-bottom-left-radius: 0; } -.navbar-default .navbar-brand:hover, -.navbar-default .navbar-brand:focus { - color: #3b3b3b; - background-color: transparent; + +.pagination-lg .page-item:last-child .page-link { + border-top-right-radius: 0; + border-bottom-right-radius: 0; } -.navbar-default .navbar-text { - color: #777777; + +.pagination-sm .page-link { + padding: 0.25rem 0.5rem; + font-size: 0.7rem; + line-height: 1.5; } -.navbar-default .navbar-nav > li > a { - color: #555555; + +.pagination-sm .page-item:first-child .page-link { + border-top-left-radius: 0; + border-bottom-left-radius: 0; } -.navbar-default .navbar-nav > li > a:hover, -.navbar-default .navbar-nav > li > a:focus { - color: #555555; - background-color: #92b3d9; + +.pagination-sm .page-item:last-child .page-link { + border-top-right-radius: 0; + border-bottom-right-radius: 0; } -.navbar-default .navbar-nav > .active > a, -.navbar-default .navbar-nav > .active > a:hover, -.navbar-default .navbar-nav > .active > a:focus { - color: #ffffff; - background-color: #467fbf; + +/* +* 5. DROPDOWNS +*/ +.dropdown-menu { + z-index: 1000; + min-width: 10rem; + padding: 0.5rem 0; + margin: 0.125rem 0 0; + font-size: 1rem; + color: #212529; + background-color: #fff; + border: 1px solid rgba(0, 0, 0, 0.15); + border-radius: 0; } -.navbar-default .navbar-nav > .disabled > a, -.navbar-default .navbar-nav > .disabled > a:hover, -.navbar-default .navbar-nav > .disabled > a:focus { - color: #cccccc; - background-color: transparent; + +.dropdown-item { + padding: 0.25rem 1.5rem; + color: #212529; } -.navbar-default .navbar-toggle { - border-color: #dddddd; + +.dropdown-item:focus, .dropdown-item:hover { + color: #16181b; + background-color: #f8f9fa; } -.navbar-default .navbar-toggle:hover, -.navbar-default .navbar-toggle:focus { + +.dropdown-item.active, .dropdown-item:active { + color: #fff; background-color: #467fbf; } -.navbar-default .navbar-toggle .icon-bar { - background-color: #888888; + +.dropdown-item.disabled, .dropdown-item:disabled { + color: #868e96; } -.navbar-default .navbar-collapse, -.navbar-default .navbar-form { - border-color: #cccccc; + +.dropdown-header { + padding: 0.5rem 1.5rem; + font-size: 0.7rem; + color: #868e96; } -.navbar-default .navbar-nav > .open > a, -.navbar-default .navbar-nav > .open > a:hover, -.navbar-default .navbar-nav > .open > a:focus { - background-color: #467fbf; - color: #ffffff; + +/* +* 6. UTILITIES +*/ +.bg-primary { + background-color: #467fbf !important; } -@media (max-width: 767px) { - .navbar-default .navbar-nav .open .dropdown-menu > li > a { - color: #555555; - } - .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, - .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus { - color: #467fbf; - } - .navbar-default .navbar-nav .open .dropdown-menu > .active > a, - .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, - .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus { - color: #ffffff; - background-color: #467fbf; - } - .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a, - .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover, - .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus { - color: #cccccc; - background-color: transparent; - } + +a.bg-primary:focus, a.bg-primary:hover { + background-color: #36669c !important; } -.navbar-default .navbar-link { - color: #555555; + +.bg-secondary { + background-color: #868e96 !important; } -.navbar-default .navbar-link:hover { - color: #555555; + +a.bg-secondary:focus, a.bg-secondary:hover { + background-color: #6c757d !important; } -.navbar-default .btn-link { - color: #555555; + +.bg-success { + background-color: #28a745 !important; } -.navbar-default .btn-link:hover, -.navbar-default .btn-link:focus { - color: #555555; + +a.bg-success:focus, a.bg-success:hover { + background-color: #1e7e34 !important; } -.navbar-default .btn-link[disabled]:hover, -fieldset[disabled] .navbar-default .btn-link:hover, -.navbar-default .btn-link[disabled]:focus, -fieldset[disabled] .navbar-default .btn-link:focus { - color: #cccccc; + +.bg-info { + background-color: #17a2b8 !important; } -/* scaffolding */ -body { - font-family: "Roboto", Helvetica, Arial, sans-serif; - font-size: 14px; - line-height: 1.42857143; - color: #555555; + +a.bg-info:focus, a.bg-info:hover { + background-color: #117a8b !important; } -a { - color: #467fbf; - text-decoration: none; + +.bg-warning { + background-color: #ffc107 !important; } -a:hover, -a:focus { - color: #2f5a89; - text-decoration: underline; + +a.bg-warning:focus, a.bg-warning:hover { + background-color: #d39e00 !important; } -a:focus { - outline: thin dotted; - outline: 5px auto -webkit-focus-ring-color; - outline-offset: -2px; + +.bg-danger { + background-color: #dc3545 !important; } -.img-rounded { - border-radius: 0; + +a.bg-danger:focus, a.bg-danger:hover { + background-color: #bd2130 !important; } -hr { - margin-top: 20px; - margin-bottom: 20px; - border: 0; - border-top: 1px solid #eeeeee; + +.bg-light { + background-color: #f8f9fa !important; } -/* breadcrumbs */ -.breadcrumb { - padding: 20px 0; - margin-bottom: 20px; - background-color: transparent; - border-radius: 0; - text-align: right; + +a.bg-light:focus, a.bg-light:hover { + background-color: #dae0e5 !important; } -.breadcrumb > li + li:before { - content: ">\00a0"; - color: #555555; + +.bg-dark { + background-color: #343a40 !important; } -.breadcrumb > .active { - color: #999999; + +a.bg-dark:focus, a.bg-dark:hover { + background-color: #1d2124 !important; } -@media (max-width: 991px) { - .breadcrumb { - padding: 20px 0; - text-align: center; - } + +.border-primary { + border-color: #467fbf !important; } -/* dropdowns */ -.dropdown-menu { - z-index: 1000; - font-size: 14px; - background-color: #ffffff; - border: 1px solid #cccccc; - border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 0; - -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); - box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); + +.border-secondary { + border-color: #868e96 !important; } -.dropdown-menu.pull-right { - right: 0; - left: auto; + +.border-success { + border-color: #28a745 !important; } -.dropdown-menu .divider { - height: 1px; - margin: 9px 0; - overflow: hidden; - background-color: #e5e5e5; + +.border-info { + border-color: #17a2b8 !important; } -.dropdown-menu > li > a { - padding: 5px 20px; - line-height: 1.42857143; - color: #333333; - white-space: nowrap; + +.border-warning { + border-color: #ffc107 !important; } -/* labels */ -.label { - font-family: "Roboto", Helvetica, Arial, sans-serif; - font-weight: normal; - text-transform: uppercase; - letter-spacing: 0.08em; + +.border-danger { + border-color: #dc3545 !important; } -/* forms.less */ -label { - font-weight: normal; + +.border-light { + border-color: #f8f9fa !important; } -.form-control { - -webkit-box-shadow: none; - box-shadow: none; - border-radius: 0; + +.border-dark { + border-color: #343a40 !important; } -.form-control:focus { - border-color: #467fbf; - outline: 0; - -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(70, 127, 191, 0.6); - box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(70, 127, 191, 0.6); + +.text-primary { + color: #467fbf !important; } -.form-group { - margin-bottom: 20px; + +a.text-primary:focus, a.text-primary:hover { + color: #36669c !important; } -/* pager*/ -.pager { - margin: 20px 0; - border-top: solid 1px #eeeeee; - padding-top: 20px; - text-transform: uppercase; - letter-spacing: 0.08em; - font-family: "Roboto", Helvetica, Arial, sans-serif; + +.text-secondary { + color: #868e96 !important; } -.pager li { - display: inline; + +a.text-secondary:focus, a.text-secondary:hover { + color: #6c757d !important; } -.pager li > a, -.pager li > span { - background-color: #ffffff; - border: 1px solid #467fbf; - border-radius: 0; + +.text-success { + color: #28a745 !important; } -.pager li > a:hover, -.pager li > a:focus { - text-decoration: none; - color: #fff; - background-color: #467fbf; + +a.text-success:focus, a.text-success:hover { + color: #1e7e34 !important; } -.pager .disabled > a, -.pager .disabled > a:hover, -.pager .disabled > a:focus, -.pager .disabled > span { - color: #999999; - background-color: #ffffff; - border-color: #ddd; + +.text-info { + color: #17a2b8 !important; } -/* pagination */ -.pagination { - margin: 20px 0; - font-family: "Roboto", Helvetica, Arial, sans-serif; - border-radius: 0; + +a.text-info:focus, a.text-info:hover { + color: #117a8b !important; } -.pagination > li > a, -.pagination > li > span { - padding: 6px 12px; - line-height: 1.42857143; - text-decoration: none; - color: #467fbf; - background-color: #ffffff; - border: 1px solid #dddddd; + +.text-warning { + color: #ffc107 !important; } -.pagination > li > a:hover, -.pagination > li > span:hover, -.pagination > li > a:focus, -.pagination > li > span:focus { - color: #467fbf; - background-color: #b8cee6; - border-color: #dddddd; -} -.pagination > .active > a, -.pagination > .active > span, -.pagination > .active > a:hover, -.pagination > .active > span:hover, -.pagination > .active > a:focus, -.pagination > .active > span:focus { - z-index: 2; - color: #ffffff; - background-color: #467fbf; - border-color: #467fbf; + +a.text-warning:focus, a.text-warning:hover { + color: #d39e00 !important; } -.pagination > .disabled > span, -.pagination > .disabled > span:hover, -.pagination > .disabled > span:focus, -.pagination > .disabled > a, -.pagination > .disabled > a:hover, -.pagination > .disabled > a:focus { - color: #999999; - background-color: #ffffff; - border-color: #dddddd; -} -/* responsive utilities */ -@media (max-width: 767px) { - .text-center-xs { - text-align: center !important; - } - .text-center-xs img { - display: block; - margin-left: auto; - margin-right: auto; - } + +.text-danger { + color: #dc3545 !important; } -@media (min-width: 768px) and (max-width: 991px) { - .text-center-sm { - text-align: center !important; - } - .text-center-sm img { - display: block; - margin-left: auto; - margin-right: auto; - } + +a.text-danger:focus, a.text-danger:hover { + color: #bd2130 !important; } -/* type */ -h1, -h2, -h3, -h4, -h5, -h6, -.h1, -.h2, -.h3, -.h4, -.h5, -.h6 { - font-family: "Roboto", Helvetica, Arial, sans-serif; - font-weight: 900; - line-height: 1.1; - color: #333333; + +.text-light { + color: #f8f9fa !important; } -h1, -.h1, -h2, -.h2, -h3, -.h3 { - margin-top: 20px; - margin-bottom: 20px; + +a.text-light:focus, a.text-light:hover { + color: #dae0e5 !important; } -p { - margin: 0 0 10px; + +.text-dark { + color: #343a40 !important; } -.lead { - margin-bottom: 20px; - font-size: 18px; + +a.text-dark:focus, a.text-dark:hover { + color: #1d2124 !important; } -@media (min-width: 768px) { - .lead { - font-size: 21px; - } + +.badge-primary { + color: #fff; + background-color: #467fbf; } -.text-small { - font-size: 12px; + +.badge-primary[href]:focus, .badge-primary[href]:hover { + color: #fff; + text-decoration: none; + background-color: #36669c; } -.text-large { - font-size: 18px; + +.badge-secondary { + color: #fff; + background-color: #868e96; } -.text-italic { - font-style: italic; + +.badge-secondary[href]:focus, .badge-secondary[href]:hover { + color: #fff; + text-decoration: none; + background-color: #6c757d; } -.text-primary { - color: #467fbf; + +.badge-success { + color: #fff; + background-color: #28a745; } -a.text-primary:hover { - color: #36669c; + +.badge-success[href]:focus, .badge-success[href]:hover { + color: #fff; + text-decoration: none; + background-color: #1e7e34; } -.bg-primary { + +.badge-info { color: #fff; - background-color: #467fbf; + background-color: #17a2b8; } -a.bg-primary:hover { - background-color: #36669c; + +.badge-info[href]:focus, .badge-info[href]:hover { + color: #fff; + text-decoration: none; + background-color: #117a8b; } -abbr[title], -abbr[data-original-title] { - border-bottom: 1px dotted #999999; + +.badge-warning { + color: #111; + background-color: #ffc107; } -blockquote { - padding: 10px 20px; - margin: 0 0 20px; - font-size: 14px; - border-left: 5px solid #467fbf; + +.badge-warning[href]:focus, .badge-warning[href]:hover { + color: #111; + text-decoration: none; + background-color: #d39e00; } -blockquote footer, -blockquote small, -blockquote .small { - display: block; - font-size: 80%; - line-height: 1.42857143; - color: #999999; + +.badge-danger { + color: #fff; + background-color: #dc3545; } -blockquote footer:before, -blockquote small:before, -blockquote .small:before { - content: '\2014 \00A0'; + +.badge-danger[href]:focus, .badge-danger[href]:hover { + color: #fff; + text-decoration: none; + background-color: #bd2130; } -.blockquote-reverse, -blockquote.pull-right { - border-right: 5px solid #467fbf; + +.badge-light { + color: #111; + background-color: #f8f9fa; } -address { - margin-bottom: 20px; - line-height: 1.42857143; + +.badge-light[href]:focus, .badge-light[href]:hover { + color: #111; + text-decoration: none; + background-color: #dae0e5; } -.panel { - margin-bottom: 20px; - background-color: #ffffff; - border: 1px solid transparent; + +.badge-dark { + color: #fff; + background-color: #343a40; +} + +.badge-dark[href]:focus, .badge-dark[href]:hover { + color: #fff; + text-decoration: none; + background-color: #1d2124; +} + +/* +* 7.CODE +*/ +code { + font-size: 87.5%; + color: #e83e8c; border-radius: 0; - -webkit-box-shadow: 0 0 0; - box-shadow: 0 0 0; } -.panel-heading { - border-top-right-radius: 0; + +a > code { + padding: 0; + color: inherit; + background-color: inherit; +} + +/* +* 8. NAV +*/ +.nav-link { + padding: 0.5rem 1rem; +} + +.nav-link.disabled { + color: #868e96; +} + +.nav-tabs .nav-item { + margin-bottom: -1px; +} + +.nav-tabs .nav-link { + border: 1px solid transparent; border-top-left-radius: 0; - text-transform: uppercase; - letter-spacing: 0.08em; - padding: 15px 15px; + border-top-right-radius: 0; } -.progress { - overflow: hidden; - height: 20px; - margin-bottom: 20px; - background-color: #f5f5f5; - border-radius: 0; - -webkit-box-shadow: none; - box-shadow: none; + +.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover { + border-color: #e9ecef #e9ecef #dee2e6; } -.panel-group { - margin-bottom: 20px; + +.nav-tabs .nav-link.disabled { + color: #868e96; } -.panel-group .panel { - margin-bottom: 0; + +.nav-tabs .nav-link.active, +.nav-tabs .nav-item.show .nav-link { + color: #495057; + background-color: #fff; +} + +.nav-tabs .dropdown-menu { + margin-top: -1px; +} + +.nav-pills .nav-link { border-radius: 0; - overflow: hidden; } -.panel-group .panel + .panel { - margin-top: 5px; + +.nav-pills .nav-link.active, +.nav-pills .show > .nav-link { + color: #fff; + background-color: #467fbf; } -.panel-group.accordion .panel { - border-color: #ccc; + +/* +* 9. CARD +*/ +.card { + background-color: #fff; + border: 1px solid rgba(0, 0, 0, 0.125); + border-radius: 0; } -.panel-primary { - border-color: #467fbf; + +.card > .list-group:first-child .list-group-item:first-child { + border-top-left-radius: 0; + border-top-right-radius: 0; } -.panel-primary > .panel-heading { - color: #ffffff; - background-color: #467fbf; - border-color: #467fbf; + +.card > .list-group:last-child .list-group-item:last-child { + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; } -.panel-primary > .panel-heading + .panel-collapse > .panel-body { - border-top-color: #467fbf; + +.card-body { + padding: 1.25rem; } -.panel-primary > .panel-heading .badge { - color: #467fbf; - background-color: #ffffff; + +.card-title { + margin-bottom: 0.75rem; } -.panel-primary > .panel-footer + .panel-collapse > .panel-body { - border-bottom-color: #467fbf; + +.card-subtitle { + margin-top: -0.375rem; } -.panel-primary .panel-title { - font-weight: 300; + +.card-link + .card-link { + margin-left: 1.25rem; } -.panel-primary .panel-title a:hover { - color: #fff; - text-decoration: none; + +.card-header { + padding: 0.75rem 1.25rem; + background-color: rgba(0, 0, 0, 0.03); + border-bottom: 1px solid rgba(0, 0, 0, 0.125); } -a.badge:hover, -a.badge:focus { - color: #ffffff; - text-decoration: none; - cursor: pointer; + +.card-header:first-child { + border-radius: calc(0 - 1px) calc(0 - 1px) 0 0; } -a.list-group-item.active > .badge, -.nav-pills > .active > a > .badge { - color: #467fbf; - background-color: #ffffff; + +.card-header-transparent { + background-color: rgba(0, 0, 0, 0.3); + border-bottom: none; } -.nav-pills > li > a > .badge { - margin-left: 3px; + +.card-footer { + padding: 0.75rem 1.25rem; + background-color: #f8f9fa; + border-top: 1px solid rgba(0, 0, 0, 0.125); +} + +.card-footer:last-child { + border-radius: 0 0 calc(0 - 1px) calc(0 - 1px); +} + +.card-header-tabs { + margin-right: -0.625rem; + margin-bottom: -0.75rem; + margin-left: -0.625rem; + border-bottom: 0; } -.progress-bar-primary { - background-color: #467fbf; + +.card-header-pills { + margin-right: -0.625rem; + margin-left: -0.625rem; } -.progress-striped .progress-bar-primary { - background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); - background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); - background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); + +.card-img-overlay { + padding: 1.25rem; } -/*! - * Yamm!3 - Yet another megamenu for Bootstrap 3 - * http://geedmo.github.com/yamm3 - * - * @geedmo - Licensed under the MIT license - */ -.yamm .nav, -.yamm .collapse, -.yamm .dropup.use-yamm, -.yamm .dropdown.use-yamm { - position: static; + +.card-img-overlay-opacity { + background: rgba(0, 0, 0, 0.2); } -.yamm .container { - position: relative; + +.card-img { + border-radius: calc(0 - 1px); } -.yamm .dropdown-menu { - left: auto; + +.card-img-top { + border-top-left-radius: calc(0 - 1px); + border-top-right-radius: calc(0 - 1px); } -.yamm .nav.navbar-right .dropdown-menu { - left: auto; - right: 0; + +.card-img-bottom { + border-bottom-right-radius: calc(0 - 1px); + border-bottom-left-radius: calc(0 - 1px); } -.yamm .yamm-content { - padding: 20px 30px; + +.card-deck .card { + margin-bottom: 15px; } -.yamm .dropdown.yamm-fw .dropdown-menu { - left: 15px; - right: 15px; + +@media (min-width: 576px) { + .card-deck { + margin-right: -15px; + margin-left: -15px; + } + .card-deck .card { + margin-right: 15px; + margin-left: 15px; + } } diff --git a/static/css/style.default.css b/static/css/style.default.css index 0c72d1bbd..777a38528 100644 --- a/static/css/style.default.css +++ b/static/css/style.default.css @@ -1,3566 +1,3702 @@ -.clearfix:before, -.clearfix:after, -.navbar:before, -.navbar:after, -.navbar-header:before, -.navbar-header:after { - content: " "; - display: table; +/* + +================================================================================== +================================================================================== + +Universal Template + +https://bootstrapious.com/p/universal-business-e-commerce-template + +================================================================================== +================================================================================== + +*/ +/* +* +* ===================== +* GENERAL +* ===================== +* +*/ +.boxed { + background: url("../img/boxed-pattern.png"); +} + +.boxed #all { + max-width: 1200px; + margin: 0 auto; + background: #fff; + -webkit-box-shadow: 0 0 5px #ccc; + box-shadow: 0 0 5px #ccc; +} + +a { + -webkit-transition: all 0.3s !important; + transition: all 0.3s !important; + display: inline-block; +} + +button { + cursor: pointer; +} + +strong { + font-weight: 700; +} + +p.lead { + margin-bottom: 40px; +} + +.accent { + color: #4fbfa8; } -.clearfix:after, -.navbar:after, -.navbar-header:after { - clear: both; + +.tooltip { + font-family: "Roboto", Helvetica, Arial, sans-serif; } -.center-block { + +.bs-select .dropdown-menu .dropdown-menu { + min-height: 20px; display: block; - margin-left: auto; - margin-right: auto; } -.pull-right { - float: right !important; + +.bs-select .dropdown-menu .dropdown-menu a { + padding: 6px 10px; + color: #666; + font-weight: 700; + text-decoration: none !important; + display: block; + font-size: .8rem; + text-transform: uppercase; + letter-spacing: 0.1em; + font-family: "Roboto", Helvetica, Arial, sans-serif; + outline: none; } -.pull-left { - float: left !important; + +.heading-light { + font-weight: 300 !important; } -.hide { - display: none !important; + +.text-bold { + font-weight: 700; } -.show { - display: block !important; + +.text-small { + font-size: 0.9rem; } -.invisible { - visibility: hidden; + +.text-uppercase { + text-transform: uppercase; + letter-spacing: 0.1em; } -.text-hide { - font: 0/0 a; - color: transparent; - text-shadow: none; - background-color: transparent; - border: 0; + +.no-letter-spacing { + letter-spacing: 0 !important; } -.hidden { - display: none !important; - visibility: hidden !important; + +.bar { + padding: 60px 0; } -.affix { - position: fixed; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); + +.bar.padding-big { + padding: 50px 0; } -/* general styles */ -a, -button { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.pagination { + margin-top: 20px; } -a i[class^="fa"], -button i[class^="fa"] { - margin: 0 5px; + +#pagination .pagination { + margin-bottom: 40px; } -.clickable { - cursor: pointer !important; + +.text-sm, .form-group label, #blog-listing-big .date-comments a, #blog-listing-medium .date-comments a, #blog-listing-big p.intro, #blog-listing-medium p.intro { + font-size: 0.9rem; } -.required { - color: #38a7bb; + +.text-xs { + font-size: 0.9rem; } -.accent { - color: #38a7bb; + +.text-xs * { + font-size: 0.9rem; } -.text-uppercase { - text-transform: uppercase; - letter-spacing: 0.08em; + +@media (max-width: 767px) { + .text-sm-center { + text-align: center !important; + } } + @media (max-width: 991px) { + .text-md-center { + text-align: center !important; + } +} + +@media (max-width: 1199px) { + .text-lg-center { + text-align: center !important; + } +} + +@media (max-width: 767px) { .text-center-sm { - text-align: center; + text-align: center !important; } } -p.lead { - margin-bottom: 40px; + +@media (max-width: 991px) { + .text-center-md { + text-align: center !important; + } } -section, -div.section { - margin-bottom: 40px; + +@media (max-width: 1199px) { + .text-center-sm, .text-center-xs { + text-align: center !important; + } +} + +.bg-gray { + background: #e9ecef !important; +} + +.bg-gray-dark { + background: #555 !important; +} + +.bg-primary { + background: #4fbfa8 !important; +} + +.color-white { + color: #fff !important; +} + +.color-white * { + color: #fff !important; +} + +.bg-white { + background: #fff !important; +} + +.bg-fixed { + background-attachment: fixed !important; } + +.light-gray { + background: #eee; +} + .no-mb { margin-bottom: 0 !important; } + +.no-mt { + margin-top: 0 !important; +} + +.no-horizontal-padding { + padding-left: 0 !important; + padding-right: 0 !important; +} + .mb-small { margin-bottom: 20px !important; } -.heading { - margin-bottom: 40px; + +.no-padding-top { + padding-top: 0 !important; } -.heading h1, -.heading h2, -.heading h3, -.heading h4, -.heading h5 { - display: inline-block; - border-bottom: solid 5px #38a7bb; + +.no-padding-bottom { + padding-bottom: 0 !important; +} + +.padding-horizontal { + padding-left: 30px !important; + padding-right: 30px !important; +} + +.relative-positioned { + position: relative; + z-index: 1; +} + +.jumbotron { + margin: 0; +} + +.owl-carousel.equal-height .owl-stage { + display: -webkit-box !important; + display: -ms-flexbox !important; + display: flex !important; + -webkit-box-align: stretch !important; + -ms-flex-align: stretch !important; + align-items: stretch !important; +} + +.background-pentagon, #heading-breadcrumbs { + background: url("../img/texture-bw.png") center center repeat; + border-top: 1px solid #999; + border-bottom: 1px solid #999; +} + +.heading, .panel-heading { + margin-bottom: 1rem; +} + +.heading h1, .panel-heading h1, .heading h2, .panel-heading h2, .heading h3, .panel-heading h3, .heading h4, .panel-heading h4, .heading h5, .panel-heading h5, .heading h6, .panel-heading h6 { line-height: 1.1; + display: inline-block; margin-bottom: 0; padding-bottom: 10px; - vertical-align: middle; text-transform: uppercase; - letter-spacing: 0.06em; + letter-spacing: 0.1em; } -.heading h1 i[class^="fa"], -.heading h2 i[class^="fa"], -.heading h3 i[class^="fa"], -.heading h4 i[class^="fa"], -.heading h5 i[class^="fa"] { - display: inline-block; - background: #38a7bb; - width: 30px; - height: 30px; - vertical-align: middle; - text-align: center; - color: #fff; - font-size: 12px; - line-height: 30px; - border-radius: 15px; + +.heading h1:after, .panel-heading h1:after, .heading h2:after, .panel-heading h2:after, .heading h3:after, .panel-heading h3:after, .heading h4:after, .panel-heading h4:after, .heading h5:after, .panel-heading h5:after, .heading h6:after, .panel-heading h6:after { + content: " "; + display: block; + width: 100px; + height: 2px; + margin-top: .6rem; + background: #4fbfa8; } -.icon { - display: inline-block; - width: 80px; - height: 80px; - color: #fff; - line-height: 80px; - border-radius: 40px; - border: solid 1px #fff; - font-size: 20px; + +.heading.text-center h1:after, .text-center.panel-heading h1:after, .heading.text-center h2:after, .text-center.panel-heading h2:after, .heading.text-center h3:after, .text-center.panel-heading h3:after, .heading.text-center h4:after, .text-center.panel-heading h4:after, .heading.text-center h5:after, .text-center.panel-heading h5:after, .heading.text-center h6:after, .text-center.panel-heading h6:after { + margin-left: auto; + margin-right: auto; } -.icon.icon-lg { - font-size: 30px; - border-width: 2px; + +.buttons a { + margin: 0 3px; } -.ul-icons { - padding-left: 10px; + +.dropdown-item.active, .dropdown-item:active { + background: #9adacd; } -.ul-icons li { - list-style-type: none; - line-height: 20px; - margin-bottom: 20px; + +.card { + border-radius: 0; + margin-bottom: 10px; } -.ul-icons li i { - width: 20px; - height: 20px; - background: #38a7bb; - color: #fff; - text-align: center; - border-radius: 10px; - line-height: 20px; - margin-right: 10px; + +.card-header { + border-radius: 0; + padding: 20px; } -ul.list-style-none { - list-style: none; + +.card-header h1, .card-header h2, .card-header h3, .card-header h4, .card-header h5, .card-header h6 { + text-transform: uppercase; + letter-spacing: 0.1em; + font-size: 0.935rem; + margin: 0 !important; } -#text-page h1, -#text-page h2, -#text-page h3 { - font-weight: 700; + +.card-header a { + color: #333; } -#error-page { - text-align: center; - margin-top: 40px; - margin-bottom: 100px; + +.card-body p { + font-size: 0.9rem; + color: #333; } -#error-page h4 { - margin-bottom: 40px; + +.alert { + border-radius: 0; } -#error-page p.buttons { - margin-top: 40px; + +#heading-breadcrumbs { + padding: 2rem 0; + border-top: none !important; + border-bottom: none !important; } -.pages-listing .item { - text-align: center; + +#heading-breadcrumbs .breadcrumb { + margin-bottom: 0; + background: none; + font-size: 0.9rem; } -.pages-listing .item h3 { - font-size: 18px; + +#heading-breadcrumbs h1 { text-transform: uppercase; - margin-bottom: 20px; - letter-spacing: 0.08em; + letter-spacing: 0.1em; + margin-bottom: 0; } -.pages-listing .item h3 a { - color: #555555; + +#heading-breadcrumbs li { + text-transform: uppercase; + letter-spacing: 0.1em; } -.pages-listing .item .text { - margin-bottom: 20px; + +.row.no-space { + margin-left: 0; + margin-right: 0; } -.pages-listing .item .text p { - color: #999999; - font-size: 12px; - margin-bottom: 20px; + +.row.no-space div[class*="col-"] { + padding: 0; } -.banner { - margin-bottom: 30px; + +.row.no-space .box-image { + margin: 0; +} + +.owl-carousel .owl-dots { + margin-top: 20px; text-align: center; } -.banner img { - margin: 0 auto; + +.owl-carousel .owl-dots .owl-dot { + display: inline-block; + margin: 0 5px; } -.banner a:hover img { - opacity: 0.8; - filter: alpha(opacity=80); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.owl-carousel .owl-dots .owl-dot.active span { + background: #fff; } -.pages { - text-align: center; + +.owl-carousel .owl-dots .owl-dot span { + display: block; + width: 12px; + height: 12px; + border-radius: 50%; + background: #aaa; +} + +.dark-mask { + background: rgba(0, 0, 0, 0.3); + width: 100%; + height: 100%; + position: absolute; + top: 0; + left: 0; + z-index: -1; } -.pages .loadMore { - text-align: center; + +.dark-mask.mask-primary { + background: rgba(79, 191, 168, 0.9); } -.pages .pagination { + +.icon-outlined { + width: 80px; + height: 80px; + line-height: 80px; text-align: center; -} -.features-buttons button { + display: inline-block; + font-size: 1.4rem; + border-radius: 50%; + border: 2px solid #fff; margin-bottom: 20px; } -@media (min-width: 1300px) { - body.boxed { - background: url(https://www.toptal.com/designers/subtlepatterns/patterns/subtle_zebra_3d.png); - } - body.boxed #all { - position: relative; - background: #fff; - width: 1200px; - margin: 0 auto; - overflow: hidden; - -webkit-box-shadow: 0 0 5px #cccccc; - box-shadow: 0 0 5px #cccccc; - } -} -#top { - background: #555555; - color: #eeeeee; - padding: 10px 0; + +.icon-outlined.icon-lg { + font-size: 2rem; } -#top p { - margin: 0; - font-size: 12px; + +.icon-outlined.icon-sm { + width: 55px; + height: 55px; + line-height: 55px; + text-align: center; + font-size: 1.15rem; } -#top .social { - float: right; - text-align: right; + +.icon-outlined.icon-thin { + border-width: 1px; } -#top .social a { - color: #999999; - display: inline-block; + +.icon-filled { width: 24px; height: 24px; - border-radius: 12px; line-height: 24px; - font-size: 12px; + background: #4fbfa8; + color: #fff; text-align: center; + border-radius: 50%; + font-size: 0.75rem; } -#top .social a:hover { + +.ul-icons .icon-filled { + display: inline-block; + margin-right: 10px; +} + +.ul-icons li { + margin-bottom: 20px; + color: #555; + font-size: 0.9rem; +} + +.ul-icons a { + display: inline; +} + +ul.social { + margin: 15px 0; +} + +ul.social a { + width: 28px; + height: 28px; + line-height: 28px; + background: #555; color: #fff; - background: #4fbfa8; + text-align: center; + border-radius: 50%; + margin: 0 2px; + font-size: 0.8rem; +} + +ul.social a:hover { -webkit-transform: scale(1.1); transform: scale(1.1); } -#top .social a:hover.facebook { - background-color: #4460ae; + +ul.social a.facebook { + background: #4561ae; } -#top .social a:hover.gplus { - background-color: #c21f25; + +ul.social a.gplus { + background: #c22026; } -#top .social a:hover.twitter { - background-color: #3cf; + +ul.social a.twitter { + background: #34ccff; } -#top .social a:hover.instagram { - background-color: #cd4378; + +ul.social a.email { + background: #4b8046; } -#top .social a:hover.email { - background-color: #4a7f45; + +.showcase { + color: #555; } -#top .login { - float: right; + +.showcase .icon-outlined { + border-color: #555; } -#top .login a { - font-size: 12px; - color: #eeeeee; - margin-right: 15px; - text-decoration: none; + +.showcase .counter { + margin-bottom: 20px; + display: inline-block; + margin-top: 0; +} + +.showcase h4 { text-transform: uppercase; - font-weight: 700; - letter-spacing: 0.10em; + letter-spacing: 0.1em; + font-size: 0.935rem; + margin-top: 0; } -@media (max-width: 767px) { - #top .login { - float: left; - } + +.form-control { + border-radius: 0; } -#top.light { - background: #fff; - color: #999999; - border-bottom: solid 1px #eeeeee; + +.form-control:focus { + border-color: #4fbfa8; + -webkit-box-shadow: 0 0 0 0.2rem rgba(79, 191, 168, 0.25); + box-shadow: 0 0 0 0.2rem rgba(79, 191, 168, 0.25); } -#top.light .login a { - color: #555555; + +.form-group label { + color: #555; } -.navbar { + +.card-primary { + border-radius: 0; + border-color: #4fbfa8; +} + +.card-primary .card-header { + background: #4fbfa8; + color: #fff; border: none; + border-radius: 0; } -.navbar ul.nav > li > a { + +.card-primary .card-header a { + color: #fff; text-transform: uppercase; - text-decoration: underline; - font-weight: bold; - letter-spacing: 0.08em; - border-top: solid 5px transparent; -} -.navbar ul.nav > li > a:hover { - border-top: solid 5px #38a7bb; + font-weight: 300; + letter-spacing: 0.05em; } -.navbar ul.nav > li.active > a, -.navbar ul.nav > li.open > a { - text-decoration: none !important; - border-top: solid 5px #20616d; + +.card-primary .card-body { + border-color: #4fbfa8; } -@media (max-width: 768px) { - .navbar ul.nav > li.active > a, - .navbar ul.nav > li.open > a { - border-top-color: transparent; - } - .navbar ul.nav > li > a:hover { - border-top-color: transparent; - } + +.card-body li { + font-size: 0.9rem; } -.navbar.navbar-light ul.nav > li.active > a { - border-top: solid 5px #20616d; - background: #fff !important; - color: #555555 !important; + +table { + font-size: 0.9rem; } -.navbar.navbar-light ul.nav > li.active > a:hover { - border-top: solid 5px #20616d; + +table img { + min-width: 50px !important; + max-width: 50px !important; + height: 50px; } -.navbar.navbar-light ul.nav > li > a:hover, -.navbar.navbar-light ul.nav > li.open > a:hover, -.navbar.navbar-light ul.nav > li > a:focus, -.navbar.navbar-light ul.nav > li.open > a:focus { - border-top: solid 5px #38a7bb; - background: #fff !important; - color: #555555 !important; + +table input[type="number"] { + max-width: 50px; } -.navbar ul.dropdown-menu { - margin: 0; - padding: 0; + +.nav-tabs { + border-bottom: none; } -.navbar ul.dropdown-menu li { - list-style-type: none; - border-bottom: solid 1px #eeeeee; - text-transform: uppercase; - letter-spacing: 0.08em; - padding: 4px 0; + +.nav-tabs a.nav-link { + border-radius: 0 !important; + font-size: 0.9rem; } -.navbar ul.dropdown-menu li a { - position: relative; - color: #999999; - font-size: 12px; - display: block; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - left: 0; + +.tab-content { + padding: 20px; + border: 1px solid #ddd; + font-size: 0.9rem; } -.navbar ul.dropdown-menu li a:hover { - color: #38a7bb; - text-decoration: none; - background: none; - left: 2px; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.top-bar { + background: #555; + color: #fff; + font-size: 0.9rem; + padding: 10px 0; } -@media (max-width: 767px) { - .navbar ul.dropdown-menu li a:hover { - left: 0; - } + +.top-bar.top-bar-light { + background: #fff; + color: #555; + border-bottom: 1px solid #ddd; } -.navbar .yamm-content h3 { - font-size: 18px; - text-transform: uppercase; - padding-bottom: 10px; - margin-top: 5px; - border-bottom: dotted 1px #555555; - letter-spacing: 0.08em; + +.top-bar.top-bar-light a.login-btn, .top-bar.top-bar-light a.signup-btn { + color: #555 !important; } -@media (max-width: 767px) { - .navbar .yamm-content h3 { - font-size: 14px; - } + +.top-bar.top-bar-light a.login-btn span, .top-bar.top-bar-light a.signup-btn span { + display: inline-block; } -.navbar .yamm-content h5 { - text-transform: uppercase; - padding-bottom: 10px; - border-bottom: dotted 1px #555555; - letter-spacing: 0.08em; + +.top-bar p { + margin-bottom: 0; + font-size: 0.75rem; } -.navbar .yamm-content ul { - margin: 0; - padding: 0; + +.top-bar ul { + margin-bottom: 0; } -.navbar .yamm-content ul li { - list-style-type: none; - border-bottom: solid 1px #eeeeee; + +.top-bar a.login-btn, .top-bar a.signup-btn { + color: #eee; text-transform: uppercase; - padding: 4px 0; -} -.navbar .yamm-content ul li a { - position: relative; - color: #999999; - font-size: 12px; - display: block; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + letter-spacing: 0.1em; + text-decoration: none !important; + font-size: 0.75rem; + font-weight: 700; + margin-right: 10px; } -.navbar .yamm-content ul li a:hover { - color: #38a7bb; - text-decoration: none; - padding-left: 2px; + +.top-bar a.login-btn i, .top-bar a.signup-btn i { + margin-right: 10px; } -.navbar .yamm-content .banner { - margin-bottom: 10px; + +.top-bar ul.social-custom { + margin-left: 20px; } -.navbar .yamm-fw .dropdown-menu { + +.top-bar ul.social-custom li { padding: 0; + margin: 0; } -.navbar .navbar-buttons { - float: right; + +.top-bar ul.social-custom a { + text-decoration: none !important; + font-size: 0.7rem; + width: 26px; + height: 26px; + line-height: 26px; + color: #999; + text-align: center; + border-radius: 50%; + margin: 0; } -.navbar .navbar-buttons button, -.navbar .navbar-buttons a.btn, -.navbar .navbar-buttons .btn-default.navbar-toggle { - margin-top: 11px; - margin-bottom: 11px; - margin-left: 0; - margin-right: 5px; + +.top-bar ul.social-custom a:hover { + background: #4fbfa8; + color: #fff; } -.navbar .btn-default, -.navbar .btn-default.navbar-toggle { - color: #999999; - background-color: #fff; - margin-left: 7px; - margin-right: 0; + +.top-bar .contact-info { + margin-right: 20px; } -.navbar .btn-default:hover, -.navbar .btn-default.navbar-toggle:hover, -.navbar .btn-default:focus, -.navbar .btn-default.navbar-toggle:focus { - background-color: #fff; - border-color: #38a7bb; - color: #38a7bb; + +.top-bar .contact-info a { + font-size: 0.8rem; } -.navbar #search { - clear: both; - border-top: solid 1px #38a7bb; - text-align: right; -} -.navbar #search form { - float: right; -} -.navbar #search form .input-group { - width: 500px; + +.modal .modal-header h4 { + text-transform: uppercase; + letter-spacing: 0.1em; } -@media (max-width: 768px) { - .navbar #search form .input-group { - width: 100%; - } + +.modal input::-moz-placeholder { + font-size: 0.85rem; } -.navbar #basket-overview a { - margin-left: 7px; + +.modal input::-webkit-input-placeholder { + font-size: 0.85rem; } -.navbar-affixed-top { - top: -32px; + +.modal input:-ms-input-placeholder { + font-size: 0.85rem; } -.navbar-affixed-top.affix-top { - -webkit-transition: all 0.5s ease-out; - -moz-transition: all 0.5s ease-out; - transition: all 0.5s ease-out; + +.modal p { + font-size: 0.85rem; } -.navbar-affixed-top.affix { + +header.nav-holder.sticky { position: fixed; - width: 100%; top: 0; - z-index: 1000; - -webkit-box-shadow: 0 0 5px #cccccc; - box-shadow: 0 0 5px #cccccc; - -webkit-transition: all 0.5s ease-out; - -moz-transition: all 0.5s ease-out; - transition: all 0.5s ease-out; -} -body.boxed .navbar-affixed-top.affix { - position: static; + left: 0; + width: 100%; + background: #fff; + z-index: 999; + -webkit-box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); + box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); } -#login-modal { - overflow: hidden; + +#navbar { + background: #fff; + padding-top: 0; + padding-bottom: 0; } -#login-modal .modal-header h4 { - text-transform: uppercase; + +#navbar .navbar-toggler { + font-size: 0.9rem; + padding: 10px 15px; + border-color: #ddd; } -#login-modal form { - margin-bottom: 20px; + +#navbar ul ul a { + padding-left: 0 !important; } -#login-modal a { - color: #38a7bb; + +#navbar .dropdown-menu { + border-radius: 0; + -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); + box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); + margin-top: 0; + padding-top: 0; + padding-bottom: 0; } -#login-modal p { - font-weight: 300; - margin-bottom: 20px; - font-size: 13px; + +#navbar .dropdown-menu .dropdown-item { + padding: 0; } -/* buttons */ -.btn { - font-weight: 700; - font-family: "Roboto", Helvetica, Arial, sans-serif; + +#navbar .dropdown-menu h5 { text-transform: uppercase; - letter-spacing: 0.08em; - padding: 6px 12px; - font-size: 13px; - line-height: 1.42857143; - border-radius: 0; + letter-spacing: 0.1em; + padding-bottom: 5px; + border-bottom: 1px dotted #ccc; + margin-top: .7rem; + margin-bottom: .5rem; +} + +#navbar .dropdown-menu a.nav-link { + font-size: 0.75rem; + letter-spacing: 0.1em; + text-transform: uppercase !important; + border-bottom: 1px solid #eee; + padding: 15px 20px !important; +} + +#navbar .dropdown-menu a.nav-link:hover { + -webkit-transform: translateX(5px); + transform: translateX(5px); + color: #4fbfa8; +} + +#navbar .dropdown-submenu { + position: relative; } -.input-group .btn { - font-size: 14px; + +#navbar .dropdown-submenu > .dropdown-menu { + top: 0; + left: 100%; + margin-top: -2px; + font-size: 1em; } -.btn-lg { - padding: 10px 16px; - font-size: 14px; - line-height: 1.33; - border-radius: 0; + +#navbar .menu-large { + position: static !important; } -.btn-sm { - padding: 5px 10px; - font-size: 12px; - line-height: 1.5; - border-radius: 0; + +#navbar .menu-large .megamenu { + padding: 20px; + width: 100%; + max-width: 1140px; + left: 50%; + -webkit-transform: translateX(-50%); + transform: translateX(-50%); + margin-top: -1px; +} + +#navbar .menu-large a.nav-link { + padding: 7px !important; + padding-left: 0 !important; +} + +#navbar .navbar-nav > li.active > a { + background: #4fbfa8 !important; + color: #fff !important; + text-decoration: none !important; + border-color: #3aa18c !important; } -.btn-xs { - padding: 1px 5px; - font-size: 12px; - line-height: 1.5; - border-radius: 0; + +#navbar .navbar-nav > li > a { + margin: 0; + padding: 1.4rem 1rem 1.6rem; + color: #555; + font-weight: 600; + text-transform: uppercase; + letter-spacing: 0.1em; + font-size: 0.9rem; + text-decoration: none; + border-top: .3rem solid transparent; } -.btn-template-main { - color: #38a7bb; - background-color: #ffffff; - border-color: #38a7bb; -} -.btn-template-main:hover, -.btn-template-main:focus, -.btn-template-main:active, -.btn-template-main.active, -.open > .dropdown-toggle.btn-template-main { - color: #38a7bb; - background-color: #e6e6e6; - border-color: #2a7d8c; -} -.btn-template-main:active, -.btn-template-main.active, -.open > .dropdown-toggle.btn-template-main { - background-image: none; + +#navbar .navbar-nav > li > a:hover { + background: rgba(79, 191, 168, 0.5); + border-color: rgba(79, 191, 168, 0.8); } -.btn-template-main.disabled, -.btn-template-main[disabled], -fieldset[disabled] .btn-template-main, -.btn-template-main.disabled:hover, -.btn-template-main[disabled]:hover, -fieldset[disabled] .btn-template-main:hover, -.btn-template-main.disabled:focus, -.btn-template-main[disabled]:focus, -fieldset[disabled] .btn-template-main:focus, -.btn-template-main.disabled:active, -.btn-template-main[disabled]:active, -fieldset[disabled] .btn-template-main:active, -.btn-template-main.disabled.active, -.btn-template-main[disabled].active, -fieldset[disabled] .btn-template-main.active { - background-color: #ffffff; - border-color: #38a7bb; -} -.btn-template-main .badge { - color: #ffffff; - background-color: #38a7bb; -} -.btn-template-main:hover, -.btn-template-main:focus, -.btn-template-main:active, -.btn-template-main.active { - background: #38a7bb; - color: #ffffff; - border-color: #38a7bb; -} -.btn-template-transparent-primary { - color: #ffffff; - background-color: transparent; - border-color: #ffffff; -} -.btn-template-transparent-primary:hover, -.btn-template-transparent-primary:focus, -.btn-template-transparent-primary:active, -.btn-template-transparent-primary.active, -.open > .dropdown-toggle.btn-template-transparent-primary { - color: #ffffff; - background-color: rgba(0, 0, 0, 0); - border-color: #e0e0e0; -} -.btn-template-transparent-primary:active, -.btn-template-transparent-primary.active, -.open > .dropdown-toggle.btn-template-transparent-primary { - background-image: none; + +#navbar .navbar-nav > li > a:focus { + background: #4fbfa8 !important; + color: #fff !important; + text-decoration: none !important; + border-color: #3aa18c !important; +} + +#navbar.nav-light .navbar-nav > li.active a.dropdown-toggle, +#navbar.nav-light .navbar-nav > li.active a.dropdown-toggle:hover { + background: none !important; + color: #555 !important; + text-decoration: underline !important; + border-color: #4fbfa8 !important; +} + +#navbar.nav-light .navbar-nav > li > a:hover { + background: none !important; + border-color: #87d3c4 !important; +} + +#navbar.nav-light .navbar-nav > li > a:focus { + background: none !important; + color: #555 !important; + text-decoration: underline !important; + border-color: #4fbfa8 !important; +} + +@media (max-width: 991px) { + #navbar { + padding-top: 1rem; + padding-bottom: 1rem; + } + #navbar .menu-large .megamenu { + width: 100%; + left: 0 !important; + -webkit-transform: none !important; + transform: none !important; + } + #navbar .navbar-collapse { + max-height: 600px; + overflow-y: auto; + margin-top: 1rem; + } + #navbar .navbar-nav > li > a { + padding: 0 10px; + height: 45px; + line-height: 45px; + border-top: 0; + font-size: 0.85rem; + width: 100%; + } + #navbar .navbar-nav > li > a:hover { + background: rgba(79, 191, 168, 0.5); + border-color: rgba(79, 191, 168, 0.8); + } + #navbar .dropdown-menu { + border: none; + -webkit-box-shadow: none; + box-shadow: none; + } } -.btn-template-transparent-primary.disabled, -.btn-template-transparent-primary[disabled], -fieldset[disabled] .btn-template-transparent-primary, -.btn-template-transparent-primary.disabled:hover, -.btn-template-transparent-primary[disabled]:hover, -fieldset[disabled] .btn-template-transparent-primary:hover, -.btn-template-transparent-primary.disabled:focus, -.btn-template-transparent-primary[disabled]:focus, -fieldset[disabled] .btn-template-transparent-primary:focus, -.btn-template-transparent-primary.disabled:active, -.btn-template-transparent-primary[disabled]:active, -fieldset[disabled] .btn-template-transparent-primary:active, -.btn-template-transparent-primary.disabled.active, -.btn-template-transparent-primary[disabled].active, -fieldset[disabled] .btn-template-transparent-primary.active { - background-color: transparent; - border-color: #ffffff; + +.btn { + text-transform: uppercase; + letter-spacing: 0.1em; +} + +.btn-template-main { + background: #4fbfa8; + border: 1px solid #4fbfa8 !important; + color: #fff !important; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-transparent-primary .badge { - color: transparent; - background-color: #ffffff; + +.btn-template-main:hover, .btn-template-main:focus { + background: #41b39c; + color: #fff !important; + border-color: #41b39c !important; } -.btn-template-transparent-primary:hover, -.btn-template-transparent-primary:focus, -.btn-template-transparent-primary:active, -.btn-template-transparent-primary.active { + +.btn-template-white { background: #fff; - color: #38a7bb; - border-color: #fff; + color: #4fbfa8 !important; + border: 1px solid #4fbfa8 !important; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-transparent-black { - color: #ffffff; - background-color: transparent; - border-color: #ffffff; -} -.btn-template-transparent-black:hover, -.btn-template-transparent-black:focus, -.btn-template-transparent-black:active, -.btn-template-transparent-black.active, -.open > .dropdown-toggle.btn-template-transparent-black { - color: #ffffff; - background-color: rgba(0, 0, 0, 0); - border-color: #e0e0e0; -} -.btn-template-transparent-black:active, -.btn-template-transparent-black.active, -.open > .dropdown-toggle.btn-template-transparent-black { - background-image: none; + +.btn-template-white:hover, .btn-template-white:focus { + background: #4fbfa8 !important; + color: #fff !important; } -.btn-template-transparent-black.disabled, -.btn-template-transparent-black[disabled], -fieldset[disabled] .btn-template-transparent-black, -.btn-template-transparent-black.disabled:hover, -.btn-template-transparent-black[disabled]:hover, -fieldset[disabled] .btn-template-transparent-black:hover, -.btn-template-transparent-black.disabled:focus, -.btn-template-transparent-black[disabled]:focus, -fieldset[disabled] .btn-template-transparent-black:focus, -.btn-template-transparent-black.disabled:active, -.btn-template-transparent-black[disabled]:active, -fieldset[disabled] .btn-template-transparent-black:active, -.btn-template-transparent-black.disabled.active, -.btn-template-transparent-black[disabled].active, -fieldset[disabled] .btn-template-transparent-black.active { - background-color: transparent; - border-color: #ffffff; + +.btn-template-outlined { + background: none; + border: 1px solid #4fbfa8 !important; + color: #4fbfa8; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-transparent-black .badge { - color: transparent; - background-color: #ffffff; + +.btn-template-outlined:hover, .btn-template-outlined:focus { + background: #4fbfa8; + color: #fff !important; } -.btn-template-transparent-black:hover, -.btn-template-transparent-black:focus, -.btn-template-transparent-black:active, -.btn-template-transparent-black.active { - background: #fff; - color: #000; - border-color: #fff; -} -.btn-template-primary { - color: #ffffff; - background-color: #38a7bb; - border-color: #38a7bb; -} -.btn-template-primary:hover, -.btn-template-primary:focus, -.btn-template-primary:active, -.btn-template-primary.active, -.open > .dropdown-toggle.btn-template-primary { - color: #ffffff; - background-color: #2c8494; - border-color: #2a7d8c; -} -.btn-template-primary:active, -.btn-template-primary.active, -.open > .dropdown-toggle.btn-template-primary { - background-image: none; + +.btn-template-outlined-white { + background: none; + border: 1px solid #fff !important; + color: #fff; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-primary.disabled, -.btn-template-primary[disabled], -fieldset[disabled] .btn-template-primary, -.btn-template-primary.disabled:hover, -.btn-template-primary[disabled]:hover, -fieldset[disabled] .btn-template-primary:hover, -.btn-template-primary.disabled:focus, -.btn-template-primary[disabled]:focus, -fieldset[disabled] .btn-template-primary:focus, -.btn-template-primary.disabled:active, -.btn-template-primary[disabled]:active, -fieldset[disabled] .btn-template-primary:active, -.btn-template-primary.disabled.active, -.btn-template-primary[disabled].active, -fieldset[disabled] .btn-template-primary.active { - background-color: #38a7bb; - border-color: #38a7bb; -} -.btn-template-primary .badge { - color: #38a7bb; - background-color: #ffffff; -} -#intro { - background: url('../img/home.jpg') no-repeat center top; - -webkit-background-size: cover; - -moz-background-size: cover; - -o-background-size: cover; - background-size: cover; -} -#intro .item { - font-family: "Roboto", Helvetica, Arial, sans-serif; - height: 100%; + +.btn-template-outlined-white:hover, .btn-template-outlined-white:focus { + background: #fff; + color: #4fbfa8 !important; } -#intro .item h1 { - text-transform: uppercase; - font-size: 50px; - color: #fff; - margin-bottom: 40px; - letter-spacing: 0.08em; + +.btn-template-outlined-black { + background: none; + border: 1px solid #333 !important; + color: #333; + border-radius: 0 !important; + text-decoration: none; } -@media (max-width: 991px) { - #intro .item h1 { - font-size: 40px; - } + +.btn-template-outlined-black:hover, .btn-template-outlined-black:focus { + background: #333 !important; + color: #fff !important; } -@media (max-width: 767px) { - #intro .item h1 { - font-size: 25px; - } + +.features-buttons button { + margin-bottom: 20px; } -#intro .item h3 { - color: #fff; + +.customers { margin-bottom: 40px; } -@media (max-width: 767px) { - #intro .item h3 { - font-size: 15px; - margin-bottom: 20px; - } + +.customers .item { + margin: 0 20px; } -#intro .item .btn { - text-transform: none; + +.customers .item img { + -webkit-filter: grayscale(100%); + filter: grayscale(100%); + -webkit-transition: all 0.3s; + transition: all 0.3s; } -@media (max-width: 991px) { - #intro .item .btn { - font-size: 14px; - } + +.customers .item img:hover { + -webkit-filter: grayscale(0%); + filter: grayscale(0%); } -@media (max-width: 991px) { - #intro .item .carousel-caption { - left: 10%; - right: 10%; - } + +.testimonials .item { + margin: 0 5px; + height: 100%; } -#intro .container, -#intro .row { + +.testimonials .testimonial { + padding: 20px; + background: #fff; height: 100%; - position: relative; } -.jumbotron { - padding: 30px; - margin-bottom: 0; - position: relative; - background: url('../img/photogrid.jpg') center center repeat; - background-size: cover; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.testimonials .text { + font-size: 0.85rem; +} + +.testimonials .text p { + color: #999; +} + +.testimonials .avatar { + min-width: 60px; + max-width: 60px; + min-height: 60px; + max-height: 60px; + border-radius: 50%; + overflow: hidden; + margin-left: 10px; } -.jumbotron .dark-mask { - position: absolute; - top: 0; - left: 0; + +.testimonials .bottom { width: 100%; - height: 100%; - background: #38a7bb; - opacity: 0.9; - filter: alpha(opacity=90); } -.jumbotron h1, -.jumbotron h2, -.jumbotron h3, -.jumbotron p, -.jumbotron ul { - color: #fff; + +.testimonials .bottom .testimonial-info { + text-align: right; } -.jumbotron h1, -.jumbotron h2, -.jumbotron h3 { - color: #ffffff; + +.testimonials .bottom h5 { text-transform: uppercase; - letter-spacing: 0.08em; + letter-spacing: 0.1em; + margin-bottom: 5px; } -.jumbotron p { - margin-bottom: 20px; - font-size: 21px; - font-weight: 400; + +.testimonials .bottom p { + font-size: 0.75rem; + color: #999; + margin-bottom: 0; } -.jumbotron p.text-uppercase { - font-weight: 700; + +.testimonials .icon { + color: #4fbfa8; + font-size: 2rem; + margin-right: 20px; } -.jumbotron > hr { - border-top-color: #d5d5d5; + +.testimonials .owl-carousel .owl-stage { + display: -webkit-box !important; + display: -ms-flexbox !important; + display: flex !important; + -webkit-box-align: stretch !important; + -ms-flex-align: stretch !important; + align-items: stretch !important; } -.container .jumbotron { - border-radius: 0; + +.testimonials .owl-dot.active span { + background: #4fbfa8 !important; } -.jumbotron .container { - max-width: 100%; - z-index: 2; + +.home-carousel { + color: #fff; } -@media screen and (min-width: 768px) { - .jumbotron { - padding-top: 48px; - padding-bottom: 48px; - } - .container .jumbotron { - padding-left: 60px; - padding-right: 60px; - } - .jumbotron h1, - .jumbotron .h1 { - font-size: 46px; - } + +.home-carousel .owl-carousel { + padding-top: 60px; + padding-bottom: 20px; } -#categoryMenu h3 { - padding: 20px; - background: #f7f7f7; - margin: 0; - border-bottom: solid 1px #eeeeee; + +.home-carousel h1, .home-carousel h2 { text-transform: uppercase; - letter-spacing: 0.08em; -} -.panel.sidebar-menu h3 { - padding: 5px 0; - margin: 0; -} -.panel.sidebar-menu { - background: #fff; - margin: 0 0 20px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; + letter-spacing: 0.1em; } -.panel.sidebar-menu .panel-heading { + +.home-carousel li, .home-carousel p { text-transform: uppercase; + letter-spacing: 0.1em; + font-weight: 700; + font-size: 1.1rem; margin-bottom: 10px; - background: none; - padding: 0; - letter-spacing: 0.08em; - border-bottom: none; } -.panel.sidebar-menu .panel-heading h1, -.panel.sidebar-menu .panel-heading h2, -.panel.sidebar-menu .panel-heading h3, -.panel.sidebar-menu .panel-heading h4, -.panel.sidebar-menu .panel-heading h5 { + +.home-carousel p img { + max-width: 200px; +} + +.project .owl-dot.active span { + background: #4fbfa8 !important; +} + +.project .owl-nav { + position: absolute; + top: 0; + right: 0; + left: auto; + bottom: auto; + width: 100%; + padding: 20px; + text-align: right; +} + +.project .owl-nav .owl-prev, .project .owl-nav .owl-next { + width: 30px; + height: 30px; + line-height: 30px; + background: #fff; + color: #4fbfa8; + text-align: center; + border-radius: 50%; display: inline-block; - border-bottom: solid 5px #38a7bb; - line-height: 1.1; - margin-bottom: 0; - padding-bottom: 10px; + margin: 0 5px; + -webkit-transition: all 0.3s; + transition: all 0.3s; } -.panel.sidebar-menu .panel-heading .btn.btn-danger { + +.project .owl-nav .owl-prev:hover, .project .owl-nav .owl-next:hover { + background: #4fbfa8; color: #fff; - margin-top: 5px; } -.panel.sidebar-menu .panel-body { - padding: 0; + +@media (max-width: 767px) { + .home-carousel { + text-align: center !important; + } + .home-carousel p, .home-carousel h1, .home-carousel ul { + text-align: center !important; + } + .home-carousel img { + margin: 10px auto; + } } -.panel.sidebar-menu .panel-body span.colour { - display: inline-block; - width: 15px; - height: 15px; - border: solid 1px #555555; - vertical-align: top; - margin-top: 2px; - margin-left: 5px; + +.owl-thumbs { + display: -webkit-box; + display: -ms-flexbox; + display: flex; } -.panel.sidebar-menu .panel-body span.colour.white { - background: #fff; + +.owl-thumbs button { + background: none; + border: none; + margin: 5px; + outline: none; } -.panel.sidebar-menu .panel-body span.colour.red { - background: red; + +.home-blog-post { + margin: 15px 0; } -.panel.sidebar-menu .panel-body span.colour.green { - background: green; + +.home-blog-post .image { + position: relative; + margin-bottom: 15px; } -.panel.sidebar-menu .panel-body span.colour.blue { - background: blue; + +.home-blog-post .overlay { + width: 100%; + height: 100%; + background: rgba(79, 191, 168, 0.6); + position: absolute; + top: 0; + opacity: 0; + -webkit-transition: all 0.5s; + transition: all 0.5s; } -.panel.sidebar-menu .panel-body span.colour.yellow { - background: yellow; + +.home-blog-post .overlay a { + -webkit-transform: translateY(30px); + transform: translateY(30px); + opacity: 0; } -.panel.sidebar-menu .panel-body label { - color: #999999; - font-size: 12px; + +.home-blog-post .overlay i { + margin-right: 5px; } -.panel.sidebar-menu .panel-body label:hover { - color: #555555; + +.home-blog-post .text { + text-align: center; } -.panel.sidebar-menu ul.nav.category-menu { + +.home-blog-post .text .intro { + text-align: left; margin-bottom: 20px; + color: #888; + font-size: 0.9rem; +} + +.home-blog-post h4 { + margin: 10px 0; text-transform: uppercase; - font-weight: 700; - letter-spacing: 0.08em; + letter-spacing: 0.1em; } -.panel.sidebar-menu ul.nav.category-menu li a { - font-family: "Roboto", Helvetica, Arial, sans-serif; + +.home-blog-post .author-category { + font-size: 0.75rem; + color: #999; + text-transform: uppercase; + letter-spacing: 0.1em; } -.panel.sidebar-menu ul.nav ul { - list-style: none; - padding-left: 0; + +.home-blog-post .author-category a { + font-weight: 500; } -.panel.sidebar-menu ul.nav ul li { - display: block; + +.home-blog-post:hover .overlay { + opacity: 1; } -.panel.sidebar-menu ul.nav ul li a { - position: relative; - font-family: "Times New Roman", Times, serif; - font-weight: normal; - text-transform: none !important; - display: block; - padding: 10px 15px; - padding-left: 30px; - font-size: 12px; - color: #999999; + +.home-blog-post:hover .overlay a { + -webkit-transform: none; + transform: none; + opacity: 1; } -.panel.sidebar-menu ul.nav ul li a:hover, -.panel.sidebar-menu ul.nav ul li a:focus { - text-decoration: none; - background-color: #eeeeee; + +#blog-listing-big .post, #blog-listing-medium .post { + margin-bottom: 60px; } -.panel.sidebar-menu ul.tag-cloud { - list-style: none; - padding-left: 0; + +#blog-listing-big .image, #blog-listing-medium .image { + margin-bottom: 15px; } -.panel.sidebar-menu ul.tag-cloud li { - display: inline-block; + +#blog-listing-big h2 a, #blog-listing-medium h2 a { + color: #555; + text-transform: uppercase; + letter-spacing: 0.1em; } -.panel.sidebar-menu ul.tag-cloud li a { - display: inline-block; - padding: 5px; - border: solid 1px #eeeeee; - border-radius: 0; - color: #38a7bb; - margin: 5px 5px 5px 0; + +#blog-listing-big .author-category, #blog-listing-medium .author-category { + color: #999; text-transform: uppercase; - letter-spacing: 0.08em; - font-weight: 700; - font-size: 12px; - text-decoration: none; + letter-spacing: 0.1em; + font-weight: 300; + margin-bottom: 10px; + font-size: .9rem; +} + +#blog-listing-big .author-category a, #blog-listing-medium .author-category a { + font-weight: 500; + margin-bottom: 0; +} + +#blog-listing-big .date-comments, #blog-listing-medium .date-comments { + margin-bottom: 0; } -.panel.sidebar-menu ul.tag-cloud li a:hover { - color: #38a7bb; - border-color: #38a7bb; + +#blog-listing-big .date-comments a, #blog-listing-medium .date-comments a { + color: #999; + margin-left: 25px; } -.panel.sidebar-menu ul.tag-cloud li.active a { - color: #FFFFFF; - background-color: #38a7bb; + +#blog-listing-big .date-comments i, #blog-listing-medium .date-comments i { + margin-right: 5px; } -.panel.sidebar-menu ul.tag-cloud li.active a:hover { - color: #FFFFFF; + +#blog-listing-big p.intro, #blog-listing-medium p.intro { + margin-top: 10px; + color: #777; } -.panel.sidebar-menu ul.popular, -.panel.sidebar-menu ul.recent { - list-style: none; - padding-left: 0; + +.pager { padding: 20px 0; + margin-top: 20px; + border-top: 1px solid #e6e6e6; } -.panel.sidebar-menu ul.popular li, -.panel.sidebar-menu ul.recent li { - margin-bottom: 10px; - padding: 5px 0; - border-bottom: dotted 1px #eeeeee; + +.disabled a, .disabled a:hover { + border-color: #999 !important; + color: #999 !important; + background: none !important; + cursor: not-allowed; } -.panel.sidebar-menu ul.popular li:before, -.panel.sidebar-menu ul.recent li:before, -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - content: " "; - display: table; + +#blog-post #post-content { + margin-bottom: 20px; } -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - clear: both; + +#blog-post .comment { + margin-bottom: 25px; } -.panel.sidebar-menu ul.popular li:before, -.panel.sidebar-menu ul.recent li:before, -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - content: " "; - display: table; + +#blog-post .comment .posted { + color: #999; + font-size: 0.8rem; + margin-bottom: 10px; } -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - clear: both; + +#blog-post .comment.last { + margin-bottom: 0; } -.panel.sidebar-menu ul.popular li img, -.panel.sidebar-menu ul.recent li img { - width: 50px; - margin-right: 10px; + +#blog-post .comment p { + font-size: 0.9rem; } -.panel.sidebar-menu ul.popular li h5, -.panel.sidebar-menu ul.recent li h5 { - margin: 0 0 10px; + +#blog-post #comments, #blog-post #comment-form { + padding: 20px 0; + margin-top: 20px; + border-top: solid 1px #eee; } -.panel.sidebar-menu ul.popular li h5 a, -.panel.sidebar-menu ul.recent li h5 a { - font-weight: normal; + +#blog-post #comments h4, #blog-post #comment-form h4 { + margin-bottom: 1.5rem; } -.panel.sidebar-menu ul.popular li p.date, -.panel.sidebar-menu ul.recent li p.date { - float: right; - font-size: 12px; - color: #999999; + +#blog-post #comment-form { + margin-bottom: 20px; } -.panel.sidebar-menu ul.popular li:last-child, -.panel.sidebar-menu ul.recent li:last-child { - border-bottom: none; + +#blog-post .reply i { + margin-right: 5px; } -.panel.sidebar-menu .text-widget { - font-size: 12px; + +.box-simple { + margin-bottom: 40px; + text-align: center; } -.panel.sidebar-menu.with-icons ul.nav li a:after { - font-family: 'FontAwesome'; - content: "\f105"; - position: relative; - top: 0; - float: right; + +.box-simple:hover .icon-outlined { + -webkit-transform: scale(1.1); + transform: scale(1.1); } -/* ribbons for product sales etc. */ -.ribbon { - position: absolute; - top: 50px; - padding-left: 51px; - font-weight: 700; - letter-spacing: 0.08em; -} -.ribbon .ribbon-background { - position: absolute; - top: 0; - right: 0; -} -.ribbon .theribbon { - position: relative; - width: 80px; - padding: 6px 20px 6px 20px; - margin: 30px 10px 10px -71px; - color: #fff; - background-color: #38a7bb; - font-family: "Roboto", Helvetica, Arial, sans-serif; -} -.ribbon .theribbon:before, -.ribbon .theribbon:after { - content: ' '; - position: absolute; - width: 0; - height: 0; -} -.ribbon .theribbon:after { - left: 0px; - top: 100%; - border-width: 5px 10px; - border-style: solid; - border-color: #000000 #000000 transparent transparent; -} -.ribbon.sale { - top: 0; -} -.ribbon.new { - top: 50px; -} -.ribbon.new .theribbon { - background-color: #5bc0de; - text-shadow: 0px 1px 2px #bbb; -} -.ribbon.new .theribbon:after { - border-color: #2390b0 #2390b0 transparent transparent; -} -.ribbon.gift { - top: 100px; -} -.ribbon.gift .theribbon { - background-color: #5cb85c; - text-shadow: 0px 1px 2px #bbb; -} -.ribbon.gift .theribbon:after { - border-color: #357935 #357935 transparent transparent; -} -.owl-carousel .owl-controls .owl-page.active span, -.owl-theme .owl-controls .owl-page.active span, -.owl-carousel .owl-controls.clickable .owl-page:hover span, -.owl-theme .owl-controls.clickable .owl-page:hover span { - background: #38a7bb; -} -.owl-carousel .owl-controls .owl-buttons, -.owl-theme .owl-controls .owl-buttons { - position: absolute; - top: 5px; - right: 0; -} -.owl-carousel .owl-controls .owl-buttons div, -.owl-theme .owl-controls .owl-buttons div { - width: 26px; - height: 26px; - line-height: 25px; - margin: 0 5px 0 0; - font-size: 18px; - color: #38a7bb; - padding: 0; - background: #fff; - border-radius: 13px; - vertical-align: middle; - text-align: center; - opacity: 1; - filter: alpha(opacity=100); -} -.home-carousel { - position: relative; - background: url('../img/photogrid.jpg') center center repeat; - background-size: cover; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -.home-carousel .dark-mask { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: #38a7bb; - opacity: 0.9; - filter: alpha(opacity=90); -} -.home-carousel .owl-carousel { - padding-top: 60px; - padding-bottom: 20px; -} -.home-carousel .owl-theme .owl-controls .owl-page span { - background: #666; -} -.home-carousel .owl-theme .owl-controls .owl-page.active span { - background: #fff; -} -.home-carousel .owl-theme .owl-controls .owl-page:hover span { - background: #fff; -} -@media (max-width: 767px) { - .home-carousel { - text-align: center !important; - } -} -@media (min-width: 992px) { - .home-carousel .right { - text-align: right; - } -} -.home-carousel h1, -.home-carousel h2, -.home-carousel h3, -.home-carousel p, -.home-carousel ul { - color: #fff; -} -.home-carousel h1 { - font-weight: 700; - text-transform: uppercase; - font-size: 46px; - letter-spacing: 0.08em; -} -@media (max-width: 991px) { - .home-carousel h1 { - font-size: 36px; - } -} -.home-carousel h2 { - font-weight: 700; - text-transform: uppercase; - font-size: 40px; - letter-spacing: 0.08em; -} -.home-carousel ul, -.home-carousel p { - font-size: 18px; - font-weight: 700; - padding: 0; - text-transform: uppercase; - letter-spacing: 0.10em; -} -@media (max-width: 991px) { - .home-carousel ul, - .home-carousel p { - font-size: 14px; - } -} -.home-carousel ul li { - margin-bottom: 10px; -} -.customers { - padding: 0; - margin-bottom: 40px; -} -.customers .item { - list-style-type: none; - text-align: center; - margin: 0 20px; -} -.customers .item img { - display: inline-block; - filter: url("data:image/svg+xml;utf8,#grayscale"); - /* Firefox 10+, Firefox on Android */ - filter: gray; - /* IE6-9 */ - -webkit-filter: grayscale(100%); - /* Chrome 19+, Safari 6+, Safari 6+ iOS */ - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -.customers .item img:hover { - max-width: auto; - filter: none; - -webkit-filter: none; -} -.testimonials { - padding: 0; - margin-bottom: 40px; -} -.testimonials .item { - list-style-type: none; - margin: 0 5px; - background: #fff; - padding-bottom: 60px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; -} -.testimonials .item .testimonial { - position: relative; - padding: 20px; -} -.testimonials .item .testimonial:before, -.testimonials .item .testimonial:after { - content: " "; - display: table; -} -.testimonials .item .testimonial:after { - clear: both; -} -.testimonials .item .testimonial:before, -.testimonials .item .testimonial:after { - content: " "; - display: table; -} -.testimonials .item .testimonial:after { - clear: both; -} -.testimonials .item .testimonial .text { - color: #999999; - margin-bottom: 40px; -} -.testimonials .item .testimonial .bottom { - position: absolute; - left: 0; - bottom: 0; - width: 100%; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - padding: 20px; - height: 50px; -} -.testimonials .item .testimonial .bottom .icon { - color: #38a7bb; - font-size: 30px; - float: left; - width: 20%; -} -.testimonials .item .testimonial .name-picture { - float: right; - width: 80%; - text-align: right; -} -.testimonials .item .testimonial .name-picture h5 { - font-size: 14px; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.testimonials .item .testimonial .name-picture p { - color: #999999; - margin: 0; - font-size: 12px; -} -.testimonials .item .testimonial .name-picture img { - float: right; - width: 60px; - border-radius: 30px; - margin-left: 10px; -} -.team-member { - text-align: center; - margin-bottom: 40px; -} -.team-member h3 { - font-size: 18px; - text-transform: uppercase; - margin-bottom: 5px; - letter-spacing: 0.08em; -} -.team-member h3 a { - color: #555555; -} -.team-member p.role { - color: #999999; - font-size: 12px; - text-transform: uppercase; - letter-spacing: 0.06em; -} -.team-member .social { - margin-bottom: 20px; -} -.team-member .social a { - margin: 0 10px 0 0; - color: #fff; - display: inline-block; - width: 26px; - height: 26px; - border-radius: 13px; - line-height: 26px; - font-size: 15px; - text-align: center; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - vertical-align: bottom; -} -.team-member .social a i { - vertical-align: bottom; - line-height: 26px; -} -.team-member .social a.facebook { - background-color: #4460ae; -} -.team-member .social a.gplus { - background-color: #c21f25; -} -.team-member .social a.twitter { - background-color: #3cf; -} -.team-member .social a.instagram { - background-color: #cd4378; -} -.team-member .social a.email { - background-color: #4a7f45; -} -.team-member .text p { - color: #999999; - font-size: 12px; -} -.team-member .social, -.team-member-detail .social { - margin-bottom: 20px; -} -.team-member .social a, -.team-member-detail .social a { - margin: 0 10px 0 0; - color: #fff; - display: inline-block; - width: 26px; - height: 26px; - border-radius: 13px; - line-height: 26px; - font-size: 15px; - text-align: center; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - vertical-align: bottom; -} -.team-member .social a i, -.team-member-detail .social a i { - vertical-align: bottom; - line-height: 26px; -} -.team-member .social a.facebook, -.team-member-detail .social a.facebook { - background-color: #4460ae; -} -.team-member .social a.gplus, -.team-member-detail .social a.gplus { - background-color: #c21f25; -} -.team-member .social a.twitter, -.team-member-detail .social a.twitter { - background-color: #3cf; -} -.team-member .social a.instagram, -.team-member-detail .social a.instagram { - background-color: #cd4378; -} -.team-member .social a.email, -.team-member-detail .social a.email { - background-color: #4a7f45; -} -.box-simple { - text-align: center; - margin-bottom: 40px; -} -.box-simple .icon { - color: #38a7bb; - border-color: #38a7bb; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.box-simple .icon-outlined { + color: #4fbfa8; + border: 1px solid #4fbfa8; + -webkit-transition: all 0.3s; + transition: all 0.3s; } + .box-simple h3 { - font-weight: normal; - font-size: 18px; text-transform: uppercase; - line-height: 1.5; - color: #555555; - font-weight: 800; - letter-spacing: 0.08em; -} -.box-simple h3 a { - color: #555555; + letter-spacing: 0.1em; } + .box-simple p { - color: #999999; -} -.box-simple:hover .icon { - -webkit-transform: scale(1.1, 1.1); - -ms-transform: scale(1.1, 1.1); - -o-transform: scale(1.1, 1.1); - transform: scale(1.1, 1.1); -} -.box-simple:hover .icon i { - -webkit-transform: scale(1, 1); - -ms-transform: scale(1, 1); - -o-transform: scale(1, 1); - transform: scale(1, 1); -} -.box-simple.box-white { - padding: 20px; - border: dotted 1px #999999; -} -.box-simple.box-white .icon { - color: #555555; - border-color: transparent; - font-size: 70px; -} -.box-simple.box-dark { - padding: 20px; - border: dotted 1px #999999; - background: #555555; - color: #fff; -} -.box-simple.box-dark .icon { - color: #f7f7f7; - border-color: transparent; - font-size: 70px; -} -.box-simple.box-dark h3 { - color: #fff; -} -.box-simple.box-dark h3 a { - color: #fff; -} -.box-simple.box-dark p { - color: #fff; -} -.box-image { - position: relative; - overflow: hidden; - text-align: center; - margin: 15px 0; -} -.box-image .bg { - position: absolute; - top: auto; - bottom: 0; - width: 100%; - height: 100%; - opacity: 0; - filter: alpha(opacity=0); - background: #38a7bb; -} -.box-image .name { - position: absolute; - width: 100%; - height: 50%; - bottom: 0; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image .name h3 { - color: #fff; - text-transform: uppercase; - font-size: 18px; - letter-spacing: 0.08em; -} -.box-image .name h3 a { - color: #fff; - text-decoration: none; -} -.box-image .text { - position: absolute; - width: 100%; - height: 50%; - top: 0; - -webkit-transform: translate(0, -150%); - -ms-transform: translate(0, -150%); - -o-transform: translate(0, -150%); - transform: translate(0, -150%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image:hover .bg { - opacity: 0.7; - filter: alpha(opacity=70); -} -.box-image:hover .name { - position: absolute; - -webkit-transform: translate(0, -75%); - -ms-transform: translate(0, -75%); - -o-transform: translate(0, -75%); - transform: translate(0, -75%); -} -.box-image:hover .text { - position: absolute; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); -} -.box-image-text { - position: relative; - overflow: hidden; - text-align: center; - margin: 15px 0; -} -.box-image-text .top { - position: relative; - margin-bottom: 10px; -} -.box-image-text .top .bg { - position: absolute; - top: auto; - bottom: 0; - width: 100%; - height: 100%; - opacity: 0; - filter: alpha(opacity=0); - background: #38a7bb; -} -.box-image-text .top .name { - position: absolute; - width: 100%; - height: 50%; - bottom: 0; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image-text .top .name h3 { - color: #fff; - text-transform: uppercase; - font-size: 18px; - letter-spacing: 0.08em; -} -.box-image-text .top .name h3 a { - color: #fff; - text-decoration: none; -} -.box-image-text .top .text { - position: absolute; - width: 100%; - height: 50%; - top: 0; - -webkit-transform: translate(0, -150%); - -ms-transform: translate(0, -150%); - -o-transform: translate(0, -150%); - transform: translate(0, -150%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image-text .content h3, -.box-image-text .content h4 { - text-transform: uppercase; - line-height: 1.5; - color: #555555; - font-weight: 800; - letter-spacing: 0.08em; -} -.box-image-text .content p { - color: #999999; -} -.box-image-text:hover .bg { - opacity: 0.7; - filter: alpha(opacity=70); -} -.box-image-text:hover .name { - position: absolute; - -webkit-transform: translate(0, -75%); - -ms-transform: translate(0, -75%); - -o-transform: translate(0, -75%); - transform: translate(0, -75%); -} -.box-image-text:hover .text { - position: absolute; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); -} -/* universal box */ -.box { - background: #fff; - margin: 0 0 30px; - border: solid 1px #ccc; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - padding: 20px 0; - border-left: none; - border-right: none; -} -.box .box-header { - background: #f7f7f7; - margin: -20px 0 20px; - padding: 20px; - border-bottom: solid 1px #eeeeee; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.box .box-header:before, -.box .box-header:after { - content: " "; - display: table; -} -.box .box-header:after { - clear: both; -} -.box .box-header:before, -.box .box-header:after { - content: " "; - display: table; -} -.box .box-header:after { - clear: both; -} -.box .box-footer { - background: #f7f7f7; - margin: 30px 0 -20px; - padding: 20px; - border-top: solid 1px #eeeeee; -} -.box .box-footer:before, -.box .box-footer:after { - content: " "; - display: table; -} -.box .box-footer:after { - clear: both; -} -.box .box-footer:before, -.box .box-footer:after { - content: " "; - display: table; -} -.box .box-footer:after { - clear: both; -} -@media (max-width: 991px) { - .box .box-footer .btn { - margin-bottom: 20px; - } -} -.box.no-border { - border: none; -} -#heading-breadcrumbs { - background: url('../img/texture-bw.png') center center repeat; - padding: 20px 0; - margin-bottom: 40px; -} -#heading-breadcrumbs.no-mb { - margin-bottom: 0; -} -#heading-breadcrumbs h1 { - color: #333333; - text-transform: uppercase; - font-size: 30px; - font-weight: 700; - letter-spacing: 0.08em; -} -@media (max-width: 991px) { - #heading-breadcrumbs h1 { - text-align: center; - } -} -#heading-breadcrumbs ul.breadcrumb { - margin-top: 5px; - margin-bottom: 0; -} -.bar { - position: relative; - background: #38a7bb; - padding: 60px 0; -} -.bar.background-pentagon { - background: url('../img/texture-bw.png') center center repeat; - border-top: solid 1px #999999; - border-bottom: solid 1px #999999; -} -.bar.background-gray { - background: #eeeeee; -} -.bar.background-gray-dark { - background: #555555; -} -.bar.background-white { - background: #fff; -} -.bar.background-image-fixed-1 { - background: url('../img/fixed-background-1.jpg') center top no-repeat; - background-attachment: fixed; - background-size: cover; -} -.bar.background-image-fixed-2 { - background: url('../img/fixed-background-2.jpg') center top no-repeat; - background-attachment: fixed; - background-size: cover; -} -.bar.color-white h1, -.bar.color-white h2, -.bar.color-white h3, -.bar.color-white h4, -.bar.color-white h5, -.bar.color-white h6, -.bar.color-white p { - color: #fff; -} -.bar.padding-big { - padding: 50px 0; -} -.bar.padding-horizontal { - padding-left: 30px; - padding-right: 30px; -} -.bar.margin-vertical { - margin-top: 20px; - margin-bottom: 20px; -} -.bar .dark-mask { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: #000; - opacity: 0.3; - filter: alpha(opacity=30); -} -.portfolio.no-space { - padding: 0 15px; -} -.portfolio.no-space .box-image { - margin: 0 -15px; -} -.portfolio-project .project-more h4 { - color: #555555; - text-transform: uppercase; - margin-bottom: 0; - text-align: left; - font-size: 14px; - letter-spacing: 0.08em; -} -.portfolio-project .project-more p { - color: #999999; - padding: 10px 0; - margin-bottom: 20px; - text-align: left; -} -.portfolio-showcase { - margin: 15px 0 60px; -} -.portfolio-showcase h3 a { - text-transform: uppercase; - line-height: 1.5; - letter-spacing: 0.08em; -} -.portfolio-showcase p.lead { - color: #555555; - margin-bottom: 20px; -} -.portfolio-showcase p { - color: #999999; -} -.portfolio-showcase p.buttons { - margin-top: 40px; -} -.see-more { - text-align: center; - margin-top: 20px; - padding-top: 20px; -} -.see-more p { - font-size: 28px; - font-weight: 100; - margin-bottom: 20px; -} -.showcase .item { - text-align: center; -} -.showcase .item .icon { - display: inline-block; - width: 50px; - height: 50px; - color: #555555; - line-height: 50px; - border-radius: 25px; - border: solid 1px #555555; -} -.showcase .item h4 { - color: #555555; - text-transform: uppercase; - letter-spacing: 0.08em; - line-height: 1.5; - font-size: 16px; -} -.showcase .item h4 span { - font-weight: bold; - font-size: 51px; -} -.packages .package { - background: #fff; - margin-top: 25px; - margin-bottom: 20px; - padding-bottom: 15px; - text-align: center; - border: solid 1px #38a7bb; - overflow: hidden; -} -.packages .package .package-header { - height: 57px; - color: #fff; - line-height: 57px; - background: #38a7bb; -} -.packages .package .package-header h5 { - color: #fff; - text-transform: uppercase; - font-weight: bold; - line-height: 57px; - margin: 0; - letter-spacing: 0.08em; + color: #999; + margin: 20px 0; + font-size: 0.9rem; } -.packages .package .package-header.light-gray { - background: #eeeeee; + +.box-simple.box-white { + border: dotted 1px #999; + padding: 15px 20px; + margin-bottom: 0; } -.packages .package .package-header.light-gray h5 { - color: #555555; + +.box-simple.box-white .icon { + font-size: 2rem; + margin-bottom: 1rem; } -.packages .package .price { - line-height: 120px; - height: 100px; - color: #fff; - font-weight: 400; + +.box-simple.box-white p { + color: #999; + margin-bottom: 5px; } -.packages .package .price h4 { - display: inline; - font-size: 50px; - line-height: normal; + +.box-simple.box-dark { + border: dotted 1px #999; + padding: 15px 20px; margin-bottom: 0; + color: #fff; + background: #555; } -.packages .package .price .period { - line-height: normal; - color: #999999; -} -.packages .package ul { - padding: 0; + +.box-simple.box-dark .icon { + font-size: 2rem; + margin-bottom: 1rem; } -.packages .package ul li { - list-style-type: none; - padding-top: 10px; - padding-bottom: 10px; - width: 80%; - margin: auto; - border-bottom: 1px dotted #ccc; + +.box-simple.box-dark p { + margin-bottom: 5px; + color: #fff; } -.packages .package ul li:last-child { - border-bottom: 0; + +.same-height div[class*="col-"] { + margin-bottom: 30px; } -.packages .package ul li i { - font-size: 13px; - margin-right: 5px; + +.same-height .box-white, .same-height.box-dark { + height: 100%; } -.packages .best-value .package { - margin-top: 0; - padding-bottom: 40px; + +.box-image { + position: relative; + margin: 20px 0; } -.packages .best-value .package .package-header { - height: 72px; - padding-top: 17px; - height: 82px !important; + +.box-image:hover .overlay { + opacity: 1; } -.packages .best-value .package .package-header h5 { - font-weight: bold; - line-height: 29px; - text-transform: uppercase; - letter-spacing: 0.08em; + +.box-image:hover h3, .box-image:hover p, .box-image:hover .buttons { + opacity: 1; + -webkit-transform: none; + transform: none; } -.packages .best-value .package .package-header .meta-text { - font-size: 13px; - line-height: 15px; + +.box-image:hover p { + -webkit-transition-delay: 0.1s; + transition-delay: 0.1s; } -#map { - height: 300px; + +.box-image:hover .buttons { + -webkit-transition-delay: 0.2s; + transition-delay: 0.2s; } -#map.with-border { - border-top: solid 1px #38a7bb; - border-bottom: solid 1px #38a7bb; + +.box-image .name { + margin-bottom: 20px; } -#blog-listing-big .post, -#blog-homepage .post { - margin-bottom: 60px; + +.box-image a { + text-decoration: none !important; } -#blog-listing-big .post h2, -#blog-homepage .post h2, -#blog-listing-big .post h4, -#blog-homepage .post h4 { + +.box-image h3 { + font-size: 1.125rem; text-transform: uppercase; - letter-spacing: 0.08em; -} -#blog-listing-big .post h2 a, -#blog-homepage .post h2 a, -#blog-listing-big .post h4 a, -#blog-homepage .post h4 a { - color: #555555; -} -#blog-listing-big .post h2 a:hover, -#blog-homepage .post h2 a:hover, -#blog-listing-big .post h4 a:hover, -#blog-homepage .post h4 a:hover { - color: #38a7bb; -} -#blog-listing-big .post .author-category, -#blog-homepage .post .author-category { - color: #999999; - text-transform: uppercase; - font-weight: 300; - letter-spacing: 0.08em; + letter-spacing: 0.1em; + -webkit-transition: all 0.3s; + transition: all 0.3s; + opacity: 0; + -webkit-transform: translateY(-50px); + transform: translateY(-50px); } -#blog-listing-big .post .author-category a, -#blog-homepage .post .author-category a { - font-weight: 500; + +.box-image .overlay { + width: 100%; + height: 100%; + position: absolute; + top: 0; + left: 0; + background: rgba(79, 191, 168, 0.6); + padding: 20px; + -webkit-transition: all 0.3s; + transition: all 0.3s; + opacity: 0; } -#blog-listing-big .post .date-comments a, -#blog-homepage .post .date-comments a { - color: #999999; - margin-right: 20px; + +.box-image .buttons { + opacity: 0; + -webkit-transition: all 0.3s; + transition: all 0.3s; + -webkit-transform: translateY(20px); + transform: translateY(20px); +} + +.box-image .buttons a { + margin: 0 3px; +} + +.box-image p { + -webkit-transition: all 0.3s; + transition: all 0.3s; + opacity: 0; + -webkit-transform: translateY(20px); + transform: translateY(20px); } -#blog-listing-big .post .date-comments a:hover, -#blog-homepage .post .date-comments a:hover { - color: #38a7bb; + +.box-image-text .content { + text-align: center; } -@media (min-width: 768px) { - #blog-listing-big .post .date-comments, - #blog-homepage .post .date-comments { - text-align: right; - } + +.box-image-text p { + color: #777; + font-size: 0.9rem; } -#blog-listing-big .post .intro, -#blog-homepage .post .intro { - text-align: left; + +.see-more { + margin-top: 40px; } -#blog-listing-big .post .image, -#blog-homepage .post .image { - margin-bottom: 10px; - overflow: hidden; + +.see-more p { + font-size: 1.8rem; + font-weight: 100; } -#blog-listing-big .post .image img, -#blog-homepage .post .image img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.box { + margin: 80px 0; + border-top: 1px solid #ddd; + border-bottom: 1px solid #ddd; + padding: 20px; } -@media (max-width: 767px) { - #blog-listing-big .post .image img.img-responsive, - #blog-homepage .post .image img.img-responsive { - min-width: 100%; - } + +.box a.btn { + margin-top: 25px; } -#blog-listing-big .post .video, -#blog-homepage .post .video { - margin-bottom: 10px; + +.box .box-header { + background: #f7f7f7; + margin: 20px 0 20px; + padding: 20px; + border-top: 1px solid #eee; + text-transform: uppercase; + letter-spacing: 0.1em; } -#blog-listing-big .post .read-more, -#blog-homepage .post .read-more { - text-align: right; + +.box .box-footer { + background: #f7f7f7; + margin-top: 30px; + padding: 20px; + border-top: 1px solid #eee; } -#blog-listing-medium .post { - margin-bottom: 60px; + +.box.shipping-method, .box.payment-method { + margin: 0; + margin-bottom: 20px; } -#blog-listing-medium .post h2 { + +.box.shipping-method h4, .box.payment-method h4 { text-transform: uppercase; - margin: 0 0 10px; - font-size: 24px; - letter-spacing: 0.08em; -} -#blog-listing-medium .post h2 a { - color: #555555; + letter-spacing: 0.1em; + margin-bottom: 5px; } -#blog-listing-medium .post h2 a:hover { - color: #38a7bb; + +.box.shipping-method p, .box.payment-method p { + font-size: 0.9rem; + color: #555; } -#blog-listing-medium .post .author-category { - float: left; - color: #999999; - text-transform: uppercase; - font-weight: 300; - font-size: 12px; - letter-spacing: 0.08em; + +.box-image-text { + margin: 15px 0; } -#blog-listing-medium .post .author-category a { - font-weight: 500; + +.box-image-text .image { + position: relative; + margin-bottom: 15px; } -#blog-listing-medium .post .date-comments { - float: right; - font-size: 12px; + +.box-image-text .overlay { + width: 100%; + height: 100%; + background: rgba(79, 191, 168, 0.6); + position: absolute; + top: 0; + opacity: 0; + -webkit-transition: all 0.5s; + transition: all 0.5s; } -#blog-listing-medium .post .date-comments a { - color: #999999; - margin-right: 20px; + +.box-image-text .overlay a { + -webkit-transform: translateY(30px); + transform: translateY(30px); + opacity: 0; } -#blog-listing-medium .post .date-comments a:hover { - color: #38a7bb; + +.box-image-text .overlay i { + margin-right: 5px; } -@media (min-width: 768px) { - #blog-listing-medium .post .date-comments { - text-align: right; - } + +.box-image-text .text { + text-align: center; } -#blog-listing-medium .post .intro { + +.box-image-text .text .intro { text-align: left; + margin-bottom: 20px; + color: #888; + font-size: 0.9rem; } -#blog-listing-medium .post .clearfix:before, -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:before, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:before, -#blog-listing-medium .post .navbar-header:after { - content: " "; - display: table; -} -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:after { - clear: both; -} -#blog-listing-medium .post .clearfix:before, -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:before, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:before, -#blog-listing-medium .post .navbar-header:after { - content: " "; - display: table; + +.box-image-text h4 { + margin: 10px 0; + text-transform: uppercase; + letter-spacing: 0.1em; } -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:after { - clear: both; + +.box-image-text .author-category { + font-size: 0.75rem; + color: #999; + text-transform: uppercase; + letter-spacing: 0.1em; } -#blog-listing-medium .post .image { - margin-bottom: 10px; - overflow: hidden; + +.box-image-text .author-category a { + font-weight: 500; +} + +.box-image-text:hover .overlay { + opacity: 1; } -#blog-listing-medium .post .image img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.box-image-text:hover .overlay a { + -webkit-transform: none; + transform: none; + opacity: 1; +} + +.box-footer a { + margin: 0 !important; +} + +.box-footer .right-col i { + margin-left: 5px; } + +.box-footer .left-col i { + margin-right: 5px; +} + @media (max-width: 767px) { - #blog-listing-medium .post .image img.img-responsive { - min-width: 100%; + .box-footer { + -webkit-box-pack: center !important; + -ms-flex-pack: center !important; + justify-content: center !important; + } + .box-footer a { + margin-bottom: 10px !important; } } -#blog-listing-medium .post .video { - margin-bottom: 10px; + +.jumbotron h1, .jumbotron h2 { + letter-spacing: 0.1em; } -#blog-listing-medium .post .read-more { - text-align: right; + +.jumbotron p { + letter-spacing: 0.1em; + font-size: 1.3rem; +} + +.package { + text-align: center; + border: 1px solid #4fbfa8; + margin-top: 25px; + margin-bottom: 20px; + padding-bottom: 15px; + overflow: hidden; } -.box-image-text.blog .author-category { - color: #999999; + +.package .package-header { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + height: 55px; +} + +.package .package-header h5 { + margin: 0; text-transform: uppercase; - letter-spacing: 0.08em; - font-weight: 300; - font-size: 12px; + letter-spacing: 0.1em; + display: inline-block; + color: #555; } -.box-image-text.blog .author-category a { - font-weight: 500; + +.package .package-header .meta-text { + font-size: 0.8rem; } -.box-image-text.blog .intro { - text-align: left; + +.package h4 { + margin-top: 1rem; + margin-bottom: 0; + color: #333; +} + +.package .price-container { margin-bottom: 20px; } -#blog-homepage .post { - margin-bottom: 30px; + +.package .price-container span.period { + color: #777; + font-size: 0.9rem; + margin-left: 10px; } -#blog-homepage .post h2, -#blog-homepage .post h4, -#blog-homepage .post .author-category, -#blog-homepage .post .read-more { - text-align: center; + +.package ul { + padding: 0 30px; } -#blog-homepage .post .read-more { - margin-top: 20px; + +.package ul li { + padding: 10px; + border-bottom: 1px solid #eee; + color: #555; + font-size: 0.9rem; } -#blog-post #post-content { - margin-bottom: 20px; + +.package ul i { + margin-right: 10px; } -#blog-post .comment { - margin-bottom: 25px; + +.best-value .package { + margin-top: 0; + padding-bottom: 40px; + border: 1px solid #4fbfa8; } -#blog-post .comment:before, -#blog-post .comment:after { - content: " "; - display: table; + +.best-value .package .package-header { + height: 85px; } -#blog-post .comment:after { - clear: both; + +.best-value .package .package-header h5 { + color: #fff; } -#blog-post .comment:before, -#blog-post .comment:after { - content: " "; - display: table; + +.team-member { + margin-bottom: 40px; } -#blog-post .comment:after { - clear: both; + +.team-member .image { + margin-bottom: 1rem; } -#blog-post .comment .posted { - color: #999999; - font-size: 12px; + +.team-member a { + color: #333; } -#blog-post .comment .reply { - font-family: "Roboto", Helvetica, Arial, sans-serif; + +.team-member a:hover { + color: #333; } -#blog-post .comment.last { + +.team-member h3 { + font-size: 1.125rem; + text-transform: uppercase; + letter-spacing: 0.1em; + margin-bottom: 5px; +} + +.team-member p.role { + font-size: 0.8rem; + text-transform: uppercase; + color: #999; margin-bottom: 0; } -#blog-post #comments, -#blog-post #comment-form { - padding: 20px 0; - margin-top: 20px; - border-top: solid 1px #eeeeee; + +.team-member p { + color: #999; + font-size: 0.8rem; } -#blog-post #comments:before, -#blog-post #comment-form:before, -#blog-post #comments:after, -#blog-post #comment-form:after { - content: " "; - display: table; + +.team-member-detail p:not(.lead) { + color: #555; + font-size: 0.9rem; +} + +.portfolio p { + color: #fff; } -#blog-post #comments:after, -#blog-post #comment-form:after { - clear: both; + +.portfolio-project p { + font-size: 0.9rem; + color: #888; } -#blog-post #comments:before, -#blog-post #comment-form:before, -#blog-post #comments:after, -#blog-post #comment-form:after { - content: " "; - display: table; + +.portfolio-project .project-more p { + padding: 5px 0; + font-size: 0.85rem; } -#blog-post #comments:after, -#blog-post #comment-form:after { - clear: both; + +.portfolio-project .project-more h4 { + margin-bottom: 5px; + text-transform: uppercase; + letter-spacing: 0.1em; + font-size: 0.88rem; + color: #555; } -#blog-post #comments h4, -#blog-post #comment-form h4 { - margin-bottom: 20px; + +.portfolio-showcase { + margin-bottom: 60px; } -#blog-post #comment-form { - margin-bottom: 20px; + +.portfolio-showcase h3 { + text-transform: uppercase; + -webkit-transition-property: 0.1rem; + transition-property: 0.1rem; +} + +.portfolio-showcase .buttons { + margin-top: 40px; +} + +.portfolio-showcase p:not(.lead) { + color: #999; + font-size: 0.9rem; +} + +.portfolio-showcase p.lead { + color: #666; } + .product { - background: #fff; - border-bottom: solid 1px #e6e6e6; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - margin-bottom: 60px; - overflow: hidden; text-align: center; + position: relative; + margin-bottom: 40px; } + .product .image { overflow: hidden; + max-height: 190px; } -.product .image img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -@media (max-width: 767px) { - .product .image img.img-responsive { - min-width: 100%; - } + +.product .image a { + margin: 0; } + .product .text { padding: 10px; + border-bottom: 1px solid #ddd; } + .product .text h3 { - font-size: 14px; - font-weight: 700; - height: 39.6px; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.product .text h3 a { - color: #555555; + min-height: 63px; } -.product .text h3 a:hover { - text-decoration: none; -} -.product .text p.price { - font-size: 18px; + +.product .price { + font-size: 1.1rem; } -.product .text p.price del { - color: #999999; + +.product .price del { + color: #999; + display: inline-block; + margin-right: 5px; } -.product .buttons { - clear: both; - position: absolute; - display: none; - bottom: 0; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - width: 100%; - border: solid 1px transparent; - padding: 20px; - background: rgba(255, 255, 255, 0.9); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - text-align: center; + +.product img { + -webkit-transition: all 0.3s; + transition: all 0.3s; } -.product .buttons .btn { - margin-bottom: 20px; + +.product:hover img { + -webkit-transform: scale(1.1); + transform: scale(1.1); } -.product:hover { - border-bottom: solid 1px #808080; - top: 0; + +.product:hover .text { + border-color: #555; } -.product:hover .buttons { - clear: both; - position: absolute; - top: 0; - background: rgba(255, 255, 255, 0.5); + +.product a { + text-transform: uppercase; + letter-spacing: 0.1em; + color: #333; + text-decoration: none !important; + margin-top: 15px; } -.product:hover .image img { - -webkit-transform: scale(1.1, 1.1); - -ms-transform: scale(1.1, 1.1); - -o-transform: scale(1.1, 1.1); - transform: scale(1.1, 1.1); + +.products-big .image { + min-height: 250px; + max-height: 250px; } + .goToDescription { - font-size: 12px; text-align: center; + font-size: 0.8rem; margin-bottom: 40px; } + .goToDescription a { - color: #999999; + color: #999; text-decoration: underline; } -#productMain { - margin-bottom: 30px; + +table tr td { + vertical-align: middle !important; +} + +#customer-orders a.btn { + margin-top: 0; } + +#customer-orders table { + font-size: 0.9rem; +} + +#customer-orders th { + border-top: 0; +} + +#customer-order img { + width: 50px; +} + +#customer-order tfoot th { + font-size: 1.2rem; + font-weight: 300; +} + +#customer-order p { + font-size: 1.2rem; + font-weight: 300; +} + +#productMain #thumbs { + margin-top: 30px; +} + +#productMain input { + display: none; +} + #productMain .sizes { text-align: center; } -#productMain .sizes h3 { - font-weight: 700; - letter-spacing: 0.08em; - text-transform: uppercase; - margin-bottom: 40px; -} + #productMain .sizes a { - display: inline-block; - width: 40px; - height: 40px; - border-radius: 40px; - background: #ccc; - line-height: 40px; - color: #555555; - text-align: center; - text-decoration: none; - font-family: "Roboto", Helvetica, Arial, sans-serif; + text-decoration: none !important; } -#productMain .sizes a.active, + #productMain .sizes a:hover { - background: #38a7bb; + background: #4fbfa8; color: #fff; } -#productMain .sizes input { - display: none; -} + #productMain .price { - font-size: 40px; text-align: center; - margin-top: 40px; - margin-bottom: 40px; + font-size: 2.5rem; + margin: 30px 0; + color: #555; } -#thumbs a { - display: block; - border: solid 1px transparent; + +#basket thead th { + border-top: none; +} + +#basket tfoot th { + font-size: 1.25rem; + color: #555; +} + +#order-summary tr td { + color: #999; +} + +#order-summary tr.total { + font-size: 1.25rem; + color: #555; + font-weight: 700; +} + +#order-summary tr.total td { + color: #555; +} + +#checkout .nav-pills { + margin-bottom: 30px; + border-bottom: 1px solid #4fbfa8; +} + +#checkout .nav-pills a { + font-size: 0.9rem; + border-bottom: none !important; +} + +#checkout .nav-pills a.disabled { + cursor: not-allowed; +} + +#checkout form label { + margin-bottom: 5px; +} + +#checkout .payment-method:hover, #checkout .shipping-method:hover { + cursor: pointer; +} + +@media (max-width: 767px) { + .nav-pills { + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + } +} + +.sidebar-menu .badge { + font-weight: 700; + margin: 0; } -#thumbs a.active { - border-color: #38a7bb; + +.sidebar-menu.with-icons a.nav-link { + position: relative; } -#product-social { - text-align: center; + +.sidebar-menu.with-icons a.nav-link::before { + content: '\f105'; + display: inline-block; + position: absolute; + top: 50%; + right: 15px; + -webkit-transform: translateY(-50%); + transform: translateY(-50%); + font-family: 'FontAwesome'; } -#product-social h4 { - font-weight: 300; + +.panel-heading { margin-bottom: 10px; } -#product-social p { - line-height: 26px; + +.panel-heading h3 { + margin-top: 5px; } -#product-social p a { - margin: 0 10px 0 0; + +.panel-heading .btn { color: #fff; + text-decoration: none !important; +} + +.panel-heading .btn i { + margin-right: 7px; +} + +.panel-body p { + font-size: .9rem; + color: #555; +} + +.panel-body label { + font-size: 0.8rem; + font-weight: 400 !important; + color: #777; + opacity: 0.9; display: inline-block; - width: 26px; - height: 26px; - border-radius: 13px; - line-height: 26px; - font-size: 15px; - text-align: center; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - vertical-align: bottom; + cursor: pointer; } -#product-social p a i { - vertical-align: bottom; - line-height: 26px; + +.panel-body label input { + margin-right: 5px; } -#product-social p a.facebook { - background-color: #4460ae; + +.panel-body label:hover { + opacity: 1; } -#product-social p a.gplus { - background-color: #c21f25; + +.panel-body span.colour { + display: inline-block; + width: 14px; + height: 14px; + margin-top: 10px; + margin-left: 5px; + border: 1px solid #555; } -#product-social p a.twitter { - background-color: #3cf; + +.panel-body span.colour.white { + background: #fff; } -#product-social p a.instagram { - background-color: #cd4378; + +.panel-body span.colour.blue { + background: #007bff; } -#product-social p a.email { - background-color: #4a7f45; + +.panel-body span.colour.green { + background: #28a745; } -@media (max-width: 991px) { - #product-social { - text-align: center; - } + +.panel-body span.colour.red { + background: #dc3545; } -#checkout .nav { - margin-bottom: 20px; - border-bottom: solid 1px #38a7bb; + +.panel-body span.colour.yellow { + background: #ffc107; } -#checkout .nav li { - height: 100%; + +.nav-pills .nav-link { + border-radius: 0; } -#checkout .nav li a { - display: block; - height: 100%; + +.nav-pills .nav-link:hover { + background: #eee; } -#order-summary table { - margin-top: 20px; + +.nav-pills .nav-link.active { + background: #4fbfa8; } -#order-summary table td { - color: #999999; + +.panel { + margin-bottom: 20px; } -#order-summary table tr.total td, -#order-summary table tr.total th { - font-size: 18px; - color: #555555; + +.category-menu a.nav-link { + text-transform: uppercase; + letter-spacing: 0.1em; font-weight: 700; } -#checkout .table tbody tr td, -#basket .table tbody tr td, -#customer-order .table tbody tr td { - vertical-align: middle; + +ul ul a.nav-link { + padding-left: 30px !important; + font-size: 0.85rem; + text-transform: none !important; + font-weight: 400 !important; + color: #777; } -#checkout .table tbody tr td input, -#basket .table tbody tr td input, -#customer-order .table tbody tr td input { - width: 50px; - text-align: right; + +.tag-cloud a { + font-size: 0.8rem; + border: 1px solid #eee; + text-transform: uppercase; + letter-spacing: 0.1em; + font-weight: 600; + padding: 5px 10px; + text-transform: uppercase; + margin: 3px 0; + text-decoration: none !important; } -#checkout .table tbody tr td img, -#basket .table tbody tr td img, -#customer-order .table tbody tr td img { - width: 50px; + +.tag-cloud a:hover { + border-color: #4fbfa8; } -#checkout .table tfoot, -#basket .table tfoot, -#customer-order .table tfoot { - font-size: 18px; + +.tag-cloud i { + margin-right: 5px; } -.shipping-method h4, -.payment-method h4 { + +.ribbon { + width: 80px; + height: 32px; + line-height: 32px; + background: #4fbfa8; + color: #fff; text-transform: uppercase; - letter-spacing: 0.08em; + letter-spacing: 0.1em; + font-weight: 700; + font-size: 0.9rem; + margin-bottom: 20px; + position: absolute; + top: 30px; + left: -15px; + text-align: center; } -#customer-orders table tr th, -#customer-orders table tr td { - vertical-align: baseline; + +.ribbon.sale { + background: #4fbfa8; } -#customer-order .table tfoot th { - font-size: 18px; - font-weight: 300; + +.ribbon.new { + background: #5bc0de; } -#customer-order .addresses { - text-align: right; - margin-bottom: 30px; + +.ribbon.new::after { + content: ''; + border-top: 15px solid #1f7e9a; } -#customer-order .addresses p { - font-size: 18px; - font-weight: 300; + +.ribbon.sold { + background: #f0ad4e; } -#customer-account { - margin-bottom: 30px; + +.ribbon.sold::after { + content: ''; + border-top: 15px solid #b06d0f; } -#get-it { - background: #38a7bb; - padding: 50px 0 30px; - color: #fff; - text-align: center; + +.ribbon.gift { + background: #5cb85c; +} + +.ribbon.gift::after { + content: ''; + border-top: 15px solid #2d672d; +} + +.ribbon:nth-of-type(2) { + top: 82px; +} + +.ribbon::after { + content: ''; + border-top: 15px solid #308372; + border-left: 15px solid transparent; + border-right: 0 solid transparent; + position: absolute; + bottom: -15px; + left: 0; + display: block; } -#get-it h1, -#get-it h2, -#get-it h3, -#get-it h4, -#get-it h5, -#get-it h6 { - color: #fff; + +.badge { + font-weight: 400; text-transform: uppercase; - letter-spacing: 0.08em; - margin: 0 0 20px; + letter-spacing: 0.1em; + padding: 3px 5px; } -#get-it p { - margin: 0 0 20px; + +#map { + border-top: 1px solid #4fbfa8; + border-bottom: 1px solid #4fbfa8; + height: 300px; } -#footer { - background: #555555; + +.get-it { + background: #4fbfa8; + color: #fff; padding: 50px 0; - color: #999999; -} -#footer h1, -#footer h2, -#footer h3, -#footer h4, -#footer h5, -#footer h6 { - color: #eeeeee; -} -#footer h4 { - font-size: 14px; - font-weight: 800; - text-transform: uppercase; - letter-spacing: 0.08em; } -#footer ul { - padding-left: 0; - list-style: none; -} -#footer ul a { - color: #999999; + +.get-it h3 { + text-transform: uppercase; + letter-spacing: 0.1em; + margin: 0; } -#footer ul a:hover { - color: #38a7bb; - text-decoration: none; + +footer.main-footer { + padding: 60px 0; + padding-bottom: 0; + background: #555; + color: #fff; } -#footer .photostream div { - float: left; - display: block; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - width: 33%; - padding: 7.5px; - overflow: hidden; + +footer.main-footer a { + color: inherit; + color: #eee; } -#footer .photostream div a { - border: solid 1 px #eeeeee; + +footer.main-footer h4 { + color: #eee; + margin: 10px 0; + text-transform: uppercase; + letter-spacing: 0.1em; } -#footer .photostream div img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +footer.main-footer p { + font-size: 0.9rem; + color: #aaa; } -#footer .photostream div:hover img { - -webkit-transform: scale(1.1, 1.1); - -ms-transform: scale(1.1, 1.1); - -o-transform: scale(1.1, 1.1); - transform: scale(1.1, 1.1); + +footer.main-footer hr { + border: none; + border-top: 1px solid #ddd; + background: none; } -#footer .blog-entries .item { - clear: both; - padding: 5px 0; - margin-bottom: 10px; - border-bottom: solid 1px #555555; + +footer.main-footer .footer-blog-list li { + margin-bottom: 20px; } -#footer .blog-entries .item .image { - float: left; - width: 15%; + +footer.main-footer .image { + width: 40px; + height: 40px; margin-right: 10px; + -ms-flex-negative: 0; + flex-shrink: 0; } -#footer .blog-entries .item .name { - width: 75%; - margin-left: 10px; - display: table-cell; - vertical-align: middle; -} -#footer .blog-entries .item .name h5 { - margin: 0; + +footer.main-footer .text { text-transform: uppercase; - letter-spacing: 0.08em; - font-size: 12px; -} -#footer .blog-entries .item .name h5 a { - color: #eeeeee; + letter-spacing: 0.1em; } -#footer .blog-entries .item .text { - width: 100%; - clear: both; -} -#footer .blog-entries .item:last-child { - border-bottom: none; - margin-bottom: 0; + +footer.main-footer .text a { + font-size: 0.8rem; } -#footer .social a { - color: #555555; - font-size: 25px; - margin: 0 10px 0 0; + +footer.main-footer .photo-stream li { + margin: 0; } -#footer .social a:hover { - color: #38a7bb; + +footer.main-footer .photo-stream a { + width: 80px; + height: 80px; + padding: 5px; + display: block; } -#copyright { + +footer.main-footer .copyrights { + padding: 50px 0; background: #333; color: #ccc; - padding: 50px 0; - font-size: 12px; - line-height: 28px; + margin-top: 50px; } -#copyright p { - margin: 0; + +footer.main-footer .copyrights a { + color: #4fbfa8; +} + +footer.main-footer .copyrights p { + color: inherit; + font-size: 0.8rem; + margin-bottom: 0; } + @media (max-width: 991px) { - #copyright p { - float: none !important; - text-align: center; - margin-bottom: 10px; + footer.main-footer .photo-stream a { + width: 120px; + height: 120px; } } -[data-animate] { - opacity: 0; - filter: alpha(opacity=0); + +@media (max-width: 767px) { + footer.main-footer .photo-stream li { + width: 32%; + margin-bottom: 10px; + } + footer.main-footer .photo-stream a { + width: 100%; + height: auto; + } } + +/* + +===================== +STYLE SWITCHER FOR DEMO +===================== + +*/ #style-switch-button { position: fixed; - top: 100px; + top: 120px; left: 0px; border-radius: 0; + z-index: 2; } + #style-switch { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; width: 300px; padding: 20px; position: fixed; - top: 140px; + top: 160px; left: 0; background: #fff; - border: solid 1px #eeeeee; + border: solid 1px #ced4da; + z-index: 2000; } -@media (max-width: 991px) { - #style-switch-button { - display: none; - } - #style-switch { - display: none; - } + +#style-switch h4 { + color: #495057; } -/* Original Boostrap template overwrite */ -/* breadcrumbs */ -.breadcrumb { - font-family: "Roboto", Helvetica, Arial, sans-serif; - text-transform: uppercase; - background-color: none; - letter-spacing: 0.08em; + +/* + * 1. NAVBAR + */ +.navbar { + padding: 0.5rem 1rem; } -/* nav */ -.nav > li > a { - padding: 10px 15px; + +.navbar-brand { + display: inline-block; + padding-top: 0.3125rem; + padding-bottom: 0.3125rem; + margin-right: 1rem; + font-size: 1.25rem; +} + +.navbar-toggler { + padding: 0.25rem 0.75rem; + font-size: 1.25rem; + line-height: 1; + border: 1px solid transparent; + border-radius: 0; } -.nav > li > a:hover, -.nav > li > a:focus { - background-color: #eeeeee; + +.navbar-light .navbar-brand { + color: rgba(0, 0, 0, 0.9); } -.nav > li.disabled > a { - color: #999999; + +.navbar-light .navbar-brand:focus, .navbar-light .navbar-brand:hover { + color: rgba(0, 0, 0, 0.9); } -.nav > li.disabled > a:hover, -.nav > li.disabled > a:focus { - color: #999999; + +.navbar-light .navbar-nav .nav-link { + color: rgba(0, 0, 0, 0.5); } -.nav .open > a, -.nav .open > a:hover, -.nav .open > a:focus { - background-color: #eeeeee; - border-color: #38a7bb; + +.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover { + color: rgba(0, 0, 0, 0.7); } -.nav-tabs { - border-bottom: 1px solid #38a7bb; + +.navbar-light .navbar-nav .nav-link.disabled { + color: rgba(0, 0, 0, 0.3); } -.nav-tabs > li { - float: left; - margin-bottom: -1px; + +.navbar-light .navbar-nav .show > .nav-link, +.navbar-light .navbar-nav .active > .nav-link, +.navbar-light .navbar-nav .nav-link.show, +.navbar-light .navbar-nav .nav-link.active { + color: rgba(0, 0, 0, 0.9); } -.nav-tabs > li > a { - margin-right: 2px; - line-height: 1.42857143; - border: 1px solid transparent; - border-radius: 0 0 0 0; + +.navbar-light .navbar-toggler { + color: rgba(0, 0, 0, 0.5); + border-color: rgba(0, 0, 0, 0.1); } -.nav-tabs > li > a:hover { - border-color: #eeeeee #eeeeee #38a7bb; + +.navbar-light .navbar-toggler-icon { + background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); } -.nav-tabs > li.active > a, -.nav-tabs > li.active > a:hover, -.nav-tabs > li.active > a:focus { - color: #555555; - background-color: #ffffff; - border: 1px solid #38a7bb; - border-bottom-color: transparent; - cursor: default; + +.navbar-light .navbar-text { + color: rgba(0, 0, 0, 0.5); } -.nav-tabs.nav-justified { - width: 100%; - border-bottom: solid 1px #38a7bb; - border-bottom: 0; + +.navbar-dark .navbar-brand { + color: #fff; } -.nav-tabs.nav-justified > li { - float: none; + +.navbar-dark .navbar-brand:focus, .navbar-dark .navbar-brand:hover { + color: #fff; } -.nav-tabs.nav-justified > li > a { - text-align: center; - /*margin-bottom: 5px;*/ + +.navbar-dark .navbar-nav .nav-link { + color: rgba(255, 255, 255, 0.5); } -.nav-tabs.nav-justified > .dropdown .dropdown-menu { - top: auto; - left: auto; + +.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover { + color: rgba(255, 255, 255, 0.75); } -.nav-tabs.nav-justified > li > a { - margin-right: 0; - border-radius: 0; + +.navbar-dark .navbar-nav .nav-link.disabled { + color: rgba(255, 255, 255, 0.25); } -.nav-tabs.nav-justified > .active > a, -.nav-tabs.nav-justified > .active > a:hover, -.nav-tabs.nav-justified > .active > a:focus { - border: 1px solid #38a7bb; + +.navbar-dark .navbar-nav .show > .nav-link, +.navbar-dark .navbar-nav .active > .nav-link, +.navbar-dark .navbar-nav .nav-link.show, +.navbar-dark .navbar-nav .nav-link.active { + color: #fff; } -@media (min-width: 768px) { - .nav-tabs.nav-justified > li > a { - border-bottom: 1px solid #38a7bb; - border-radius: 0 0 0 0; - } - .nav-tabs.nav-justified > .active > a, - .nav-tabs.nav-justified > .active > a:hover, - .nav-tabs.nav-justified > .active > a:focus { - border-bottom-color: #ffffff; - } + +.navbar-dark .navbar-toggler { + color: rgba(255, 255, 255, 0.5); + border-color: rgba(255, 255, 255, 0.1); +} + +.navbar-dark .navbar-toggler-icon { + background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); } -.nav-pills > li { - float: left; + +.navbar-dark .navbar-text { + color: rgba(255, 255, 255, 0.5); } -.nav-pills > li > a { + +/* + * 2. BUTTONS + */ +.btn { + font-weight: 700; + border: 1px solid transparent; + padding: 0.5rem 0.75rem; + font-size: 0.8rem; + line-height: 1.5; border-radius: 0; + -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; } -.nav-pills > li + li { - margin-left: 2px; + +.btn:focus, .btn.focus { + outline: 0; + -webkit-box-shadow: 0 0 0 0.2rem rgba(79, 191, 168, 0.25); + box-shadow: 0 0 0 0.2rem rgba(79, 191, 168, 0.25); } -.nav-pills > li.active > a, -.nav-pills > li.active > a:hover, -.nav-pills > li.active > a:focus { - color: #ffffff; - background-color: #38a7bb; + +.btn.disabled, .btn:disabled { + opacity: .65; } -.nav-stacked > li { - float: none; + +.btn:not([disabled]):not(.disabled):active, .btn:not([disabled]):not(.disabled).active { + background-image: none; } -.nav-stacked > li + li { - margin-top: 2px; - margin-left: 0; + +.btn-primary { + color: color-yiq(#4fbfa8); + background-color: #4fbfa8; + border-color: #4fbfa8; +} + +.btn-primary:hover { + color: color-yiq(#3eaa94); + background-color: #3aa18c; + border-color: #3aa18c; +} + +.btn-primary:focus, .btn-primary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(79, 191, 168, 0.5); + box-shadow: 0 0 0 0.2rem rgba(79, 191, 168, 0.5); +} + +.btn-primary.disabled, .btn-primary:disabled { + color: color-yiq(#4fbfa8); + background-color: #4fbfa8; + border-color: #4fbfa8; +} + +.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active, +.show > .btn-primary.dropdown-toggle { + color: color-yiq(#3aa18c); + background-color: #3aa18c; + border-color: #379783; +} + +.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, +.show > .btn-primary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(79, 191, 168, 0.5); + box-shadow: 0 0 0 0.2rem rgba(79, 191, 168, 0.5); +} + +.btn-secondary { + color: color-yiq(#868e96); + background-color: #868e96; + border-color: #868e96; +} + +.btn-secondary:hover { + color: color-yiq(#727b84); + background-color: #6c757d; + border-color: #6c757d; +} + +.btn-secondary:focus, .btn-secondary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); +} + +.btn-secondary.disabled, .btn-secondary:disabled { + color: color-yiq(#868e96); + background-color: #868e96; + border-color: #868e96; +} + +.btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active, +.show > .btn-secondary.dropdown-toggle { + color: color-yiq(#6c757d); + background-color: #6c757d; + border-color: #666e76; +} + +.btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus, +.show > .btn-secondary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); +} + +.btn-success { + color: color-yiq(#28a745); + background-color: #28a745; + border-color: #28a745; +} + +.btn-success:hover { + color: color-yiq(#218838); + background-color: #1e7e34; + border-color: #1e7e34; +} + +.btn-success:focus, .btn-success.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); +} + +.btn-success.disabled, .btn-success:disabled { + color: color-yiq(#28a745); + background-color: #28a745; + border-color: #28a745; +} + +.btn-success:not(:disabled):not(.disabled):active, .btn-success:not(:disabled):not(.disabled).active, +.show > .btn-success.dropdown-toggle { + color: color-yiq(#1e7e34); + background-color: #1e7e34; + border-color: #1c7430; +} + +.btn-success:not(:disabled):not(.disabled):active:focus, .btn-success:not(:disabled):not(.disabled).active:focus, +.show > .btn-success.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); +} + +.btn-info { + color: color-yiq(#17a2b8); + background-color: #17a2b8; + border-color: #17a2b8; +} + +.btn-info:hover { + color: color-yiq(#138496); + background-color: #117a8b; + border-color: #117a8b; +} + +.btn-info:focus, .btn-info.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); +} + +.btn-info.disabled, .btn-info:disabled { + color: color-yiq(#17a2b8); + background-color: #17a2b8; + border-color: #17a2b8; +} + +.btn-info:not(:disabled):not(.disabled):active, .btn-info:not(:disabled):not(.disabled).active, +.show > .btn-info.dropdown-toggle { + color: color-yiq(#117a8b); + background-color: #117a8b; + border-color: #10707f; +} + +.btn-info:not(:disabled):not(.disabled):active:focus, .btn-info:not(:disabled):not(.disabled).active:focus, +.show > .btn-info.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); +} + +.btn-warning { + color: color-yiq(#ffc107); + background-color: #ffc107; + border-color: #ffc107; +} + +.btn-warning:hover { + color: color-yiq(#e0a800); + background-color: #d39e00; + border-color: #d39e00; +} + +.btn-warning:focus, .btn-warning.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-warning.disabled, .btn-warning:disabled { + color: color-yiq(#ffc107); + background-color: #ffc107; + border-color: #ffc107; +} + +.btn-warning:not(:disabled):not(.disabled):active, .btn-warning:not(:disabled):not(.disabled).active, +.show > .btn-warning.dropdown-toggle { + color: color-yiq(#d39e00); + background-color: #d39e00; + border-color: #c69500; +} + +.btn-warning:not(:disabled):not(.disabled):active:focus, .btn-warning:not(:disabled):not(.disabled).active:focus, +.show > .btn-warning.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-danger { + color: color-yiq(#dc3545); + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-danger:hover { + color: color-yiq(#c82333); + background-color: #bd2130; + border-color: #bd2130; +} + +.btn-danger:focus, .btn-danger.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-danger.disabled, .btn-danger:disabled { + color: color-yiq(#dc3545); + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-danger:not(:disabled):not(.disabled):active, .btn-danger:not(:disabled):not(.disabled).active, +.show > .btn-danger.dropdown-toggle { + color: color-yiq(#bd2130); + background-color: #bd2130; + border-color: #b21f2d; +} + +.btn-danger:not(:disabled):not(.disabled):active:focus, .btn-danger:not(:disabled):not(.disabled).active:focus, +.show > .btn-danger.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-light { + color: color-yiq(#f8f9fa); + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-light:hover { + color: color-yiq(#e2e6ea); + background-color: #dae0e5; + border-color: #dae0e5; +} + +.btn-light:focus, .btn-light.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-light.disabled, .btn-light:disabled { + color: color-yiq(#f8f9fa); + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-light:not(:disabled):not(.disabled):active, .btn-light:not(:disabled):not(.disabled).active, +.show > .btn-light.dropdown-toggle { + color: color-yiq(#dae0e5); + background-color: #dae0e5; + border-color: #d3d9df; +} + +.btn-light:not(:disabled):not(.disabled):active:focus, .btn-light:not(:disabled):not(.disabled).active:focus, +.show > .btn-light.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-dark { + color: color-yiq(#343a40); + background-color: #343a40; + border-color: #343a40; +} + +.btn-dark:hover { + color: color-yiq(#23272b); + background-color: #1d2124; + border-color: #1d2124; +} + +.btn-dark:focus, .btn-dark.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-dark.disabled, .btn-dark:disabled { + color: color-yiq(#343a40); + background-color: #343a40; + border-color: #343a40; +} + +.btn-dark:not(:disabled):not(.disabled):active, .btn-dark:not(:disabled):not(.disabled).active, +.show > .btn-dark.dropdown-toggle { + color: color-yiq(#1d2124); + background-color: #1d2124; + border-color: #171a1d; +} + +.btn-dark:not(:disabled):not(.disabled):active:focus, .btn-dark:not(:disabled):not(.disabled).active:focus, +.show > .btn-dark.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-default { + color: color-yiq(#ced4da); + background-color: #ced4da; + border-color: #ced4da; +} + +.btn-default:hover { + color: color-yiq(#b8c1ca); + background-color: #b1bbc4; + border-color: #b1bbc4; +} + +.btn-default:focus, .btn-default.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); + box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); +} + +.btn-default.disabled, .btn-default:disabled { + color: color-yiq(#ced4da); + background-color: #ced4da; + border-color: #ced4da; +} + +.btn-default:not(:disabled):not(.disabled):active, .btn-default:not(:disabled):not(.disabled).active, +.show > .btn-default.dropdown-toggle { + color: color-yiq(#b1bbc4); + background-color: #b1bbc4; + border-color: #aab4bf; +} + +.btn-default:not(:disabled):not(.disabled):active:focus, .btn-default:not(:disabled):not(.disabled).active:focus, +.show > .btn-default.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); + box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); +} + +.btn-outline-primary { + color: #4fbfa8; + background-color: transparent; + background-image: none; + border-color: #4fbfa8; } -.nav-justified { - width: 100%; - border-bottom: solid 1px #38a7bb; + +.btn-outline-primary:hover { + color: #fff; + background-color: #4fbfa8; + border-color: #4fbfa8; } -.nav-justified > li { - float: none; + +.btn-outline-primary:focus, .btn-outline-primary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(79, 191, 168, 0.5); + box-shadow: 0 0 0 0.2rem rgba(79, 191, 168, 0.5); } -.nav-justified > li > a { - text-align: center; - /*margin-bottom: 5px;*/ + +.btn-outline-primary.disabled, .btn-outline-primary:disabled { + color: #4fbfa8; + background-color: transparent; } -.nav-justified > .dropdown .dropdown-menu { - top: auto; - left: auto; + +.btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active, +.show > .btn-outline-primary.dropdown-toggle { + color: color-yiq(#4fbfa8); + background-color: #4fbfa8; + border-color: #4fbfa8; +} + +.btn-outline-primary:not(:disabled):not(.disabled):active:focus, .btn-outline-primary:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-primary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(79, 191, 168, 0.5); + box-shadow: 0 0 0 0.2rem rgba(79, 191, 168, 0.5); +} + +.btn-outline-secondary { + color: #868e96; + background-color: transparent; + background-image: none; + border-color: #868e96; } -.nav-tabs-justified { - border-bottom: 0; + +.btn-outline-secondary:hover { + color: #fff; + background-color: #868e96; + border-color: #868e96; } -.nav-tabs-justified > li > a { - margin-right: 0; - border-radius: 0; + +.btn-outline-secondary:focus, .btn-outline-secondary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); } -.nav-tabs-justified > .active > a, -.nav-tabs-justified > .active > a:hover, -.nav-tabs-justified > .active > a:focus { - border: 1px solid #38a7bb; + +.btn-outline-secondary.disabled, .btn-outline-secondary:disabled { + color: #868e96; + background-color: transparent; } -@media (min-width: 768px) { - .nav-tabs-justified > li > a { - border-bottom: 1px solid #38a7bb; - border-radius: 0 0 0 0; - } - .nav-tabs-justified > .active > a, - .nav-tabs-justified > .active > a:hover, - .nav-tabs-justified > .active > a:focus { - border-bottom-color: #ffffff; - } + +.btn-outline-secondary:not(:disabled):not(.disabled):active, .btn-outline-secondary:not(:disabled):not(.disabled).active, +.show > .btn-outline-secondary.dropdown-toggle { + color: color-yiq(#868e96); + background-color: #868e96; + border-color: #868e96; +} + +.btn-outline-secondary:not(:disabled):not(.disabled):active:focus, .btn-outline-secondary:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-secondary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); +} + +.btn-outline-success { + color: #28a745; + background-color: transparent; + background-image: none; + border-color: #28a745; } -.tab-content { - padding: 15px; - border: solid 1px #ddd; - border-top: none; + +.btn-outline-success:hover { + color: #fff; + background-color: #28a745; + border-color: #28a745; } -/* navbar */ -.navbar { - position: relative; - min-height: 62px; - margin-bottom: 0; - border-bottom: 1px solid transparent; + +.btn-outline-success:focus, .btn-outline-success.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); } -@media (min-width: 768px) { - .navbar { - border-radius: 0px; - } + +.btn-outline-success.disabled, .btn-outline-success:disabled { + color: #28a745; + background-color: transparent; } -@media (min-width: 768px) { - .navbar-header { - float: left; - } + +.btn-outline-success:not(:disabled):not(.disabled):active, .btn-outline-success:not(:disabled):not(.disabled).active, +.show > .btn-outline-success.dropdown-toggle { + color: color-yiq(#28a745); + background-color: #28a745; + border-color: #28a745; +} + +.btn-outline-success:not(:disabled):not(.disabled):active:focus, .btn-outline-success:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-success.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); +} + +.btn-outline-info { + color: #17a2b8; + background-color: transparent; + background-image: none; + border-color: #17a2b8; +} + +.btn-outline-info:hover { + color: #fff; + background-color: #17a2b8; + border-color: #17a2b8; } -.navbar-collapse { - overflow-x: visible; - padding-right: 15px; - padding-left: 15px; + +.btn-outline-info:focus, .btn-outline-info.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); } -.navbar-collapse.in { - overflow-y: auto; + +.btn-outline-info.disabled, .btn-outline-info:disabled { + color: #17a2b8; + background-color: transparent; } -@media (min-width: 768px) { - .navbar-collapse { - width: auto; - border-top: 0; - box-shadow: none; - } - .navbar-collapse.collapse { - display: block !important; - height: auto !important; - padding-bottom: 0; - overflow: visible !important; - } - .navbar-collapse.in { - overflow-y: visible; - } - .navbar-fixed-top .navbar-collapse, - .navbar-static-top .navbar-collapse, - .navbar-fixed-bottom .navbar-collapse { - padding-left: 0; - padding-right: 0; - } + +.btn-outline-info:not(:disabled):not(.disabled):active, .btn-outline-info:not(:disabled):not(.disabled).active, +.show > .btn-outline-info.dropdown-toggle { + color: color-yiq(#17a2b8); + background-color: #17a2b8; + border-color: #17a2b8; +} + +.btn-outline-info:not(:disabled):not(.disabled):active:focus, .btn-outline-info:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-info.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); +} + +.btn-outline-warning { + color: #ffc107; + background-color: transparent; + background-image: none; + border-color: #ffc107; } -.navbar-fixed-top .navbar-collapse, -.navbar-affixed-top .navbar-collapse, -.navbar-fixed-bottom .navbar-collapse { - max-height: 340px; + +.btn-outline-warning:hover { + color: #fff; + background-color: #ffc107; + border-color: #ffc107; } -@media (max-width: 480px) and (orientation: landscape) { - .navbar-fixed-top .navbar-collapse, - .navbar-affixed-top .navbar-collapse, - .navbar-fixed-bottom .navbar-collapse { - max-height: 200px; - } + +.btn-outline-warning:focus, .btn-outline-warning.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-outline-warning.disabled, .btn-outline-warning:disabled { + color: #ffc107; + background-color: transparent; +} + +.btn-outline-warning:not(:disabled):not(.disabled):active, .btn-outline-warning:not(:disabled):not(.disabled).active, +.show > .btn-outline-warning.dropdown-toggle { + color: color-yiq(#ffc107); + background-color: #ffc107; + border-color: #ffc107; +} + +.btn-outline-warning:not(:disabled):not(.disabled):active:focus, .btn-outline-warning:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-warning.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-outline-danger { + color: #dc3545; + background-color: transparent; + background-image: none; + border-color: #dc3545; +} + +.btn-outline-danger:hover { + color: #fff; + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-outline-danger:focus, .btn-outline-danger.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-outline-danger.disabled, .btn-outline-danger:disabled { + color: #dc3545; + background-color: transparent; +} + +.btn-outline-danger:not(:disabled):not(.disabled):active, .btn-outline-danger:not(:disabled):not(.disabled).active, +.show > .btn-outline-danger.dropdown-toggle { + color: color-yiq(#dc3545); + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-outline-danger:not(:disabled):not(.disabled):active:focus, .btn-outline-danger:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-danger.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-outline-light { + color: #f8f9fa; + background-color: transparent; + background-image: none; + border-color: #f8f9fa; +} + +.btn-outline-light:hover { + color: #fff; + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-outline-light:focus, .btn-outline-light.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-outline-light.disabled, .btn-outline-light:disabled { + color: #f8f9fa; + background-color: transparent; +} + +.btn-outline-light:not(:disabled):not(.disabled):active, .btn-outline-light:not(:disabled):not(.disabled).active, +.show > .btn-outline-light.dropdown-toggle { + color: color-yiq(#f8f9fa); + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-outline-light:not(:disabled):not(.disabled):active:focus, .btn-outline-light:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-light.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-outline-dark { + color: #343a40; + background-color: transparent; + background-image: none; + border-color: #343a40; +} + +.btn-outline-dark:hover { + color: #fff; + background-color: #343a40; + border-color: #343a40; +} + +.btn-outline-dark:focus, .btn-outline-dark.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-outline-dark.disabled, .btn-outline-dark:disabled { + color: #343a40; + background-color: transparent; +} + +.btn-outline-dark:not(:disabled):not(.disabled):active, .btn-outline-dark:not(:disabled):not(.disabled).active, +.show > .btn-outline-dark.dropdown-toggle { + color: color-yiq(#343a40); + background-color: #343a40; + border-color: #343a40; +} + +.btn-outline-dark:not(:disabled):not(.disabled):active:focus, .btn-outline-dark:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-dark.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-lg { + padding: 0.5rem 1rem; + font-size: 1.25rem; + line-height: 1.5; + border-radius: 0; +} + +.btn-sm { + padding: 0.25rem 0.5rem; + font-size: 0.7rem; + line-height: 1.5; + border-radius: 0; +} + +/* + * 3. TYPE + */ +body { + font-family: "Roboto", Helvetica, Arial, sans-serif; + font-size: 1rem; + font-weight: 400; + line-height: 1.5; + color: #212529; + background-color: #fff; +} + +a { + color: #4fbfa8; + text-decoration: none; +} + +a:focus, a:hover { + color: #348e7b; + text-decoration: underline; +} + +h1, +h2, +h3, +h4, +h5, +h6, +.h1, +.h2, +.h3, +.h4, +.h5, +.h6 { + margin-bottom: 1rem; + font-family: inherit; + font-weight: 700; + line-height: 1.1; + color: inherit; } -.container > .navbar-header, -.container-fluid > .navbar-header, -.container > .navbar-collapse, -.container-fluid > .navbar-collapse { - margin-right: -15px; - margin-left: -15px; -} -@media (min-width: 768px) { - .container > .navbar-header, - .container-fluid > .navbar-header, - .container > .navbar-collapse, - .container-fluid > .navbar-collapse { - margin-right: 0; - margin-left: 0; - } + +h1, +.h1 { + font-size: 2.2rem; } -.navbar-static-top { - z-index: 1000; - border-width: 0 0 1px; + +h2, +.h2 { + font-size: 1.8rem; } -@media (min-width: 768px) { - .navbar-static-top { - border-radius: 0; - } + +h3, +.h3 { + font-size: 1.5rem; } -.navbar-fixed-top, -.navbar-fixed-bottom { - position: fixed; - right: 0; - left: 0; - z-index: 1030; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); -} -@media (min-width: 768px) { - .navbar-fixed-top, - .navbar-fixed-bottom { - border-radius: 0; - } + +h4, +.h4 { + font-size: 1.1rem; } -.navbar-fixed-top { - top: 0; - border-width: 0 0 1px; + +h5, +.h5 { + font-size: 1rem; } -.navbar-fixed-bottom { - bottom: 0; - margin-bottom: 0; - border-width: 1px 0 0; + +h6, +.h6 { + font-size: 0.8rem; } -.navbar-brand { - float: left; - padding: 10px 15px; - font-size: 18px; - line-height: 20px; - height: 62px; + +.lead { + font-size: 1.25rem; + font-weight: 300; } -.navbar-brand:hover, -.navbar-brand:focus { - text-decoration: none; + +.display-1 { + font-size: 6rem; + font-weight: 300; + line-height: 1.1; } -@media (min-width: 768px) { - .navbar > .container .navbar-brand, - .navbar > .container-fluid .navbar-brand { - margin-left: -15px; - } + +.display-2 { + font-size: 5.5rem; + font-weight: 300; + line-height: 1.1; } -.navbar-toggle { - position: relative; - float: right; - margin-right: 15px; - padding: 9px 10px; - margin-top: 14px; - margin-bottom: 14px; - background-color: transparent; - background-image: none; - border: 1px solid transparent; - border-radius: 0; + +.display-3 { + font-size: 4.5rem; + font-weight: 300; + line-height: 1.1; } -.navbar-toggle:focus { - outline: 0; + +.display-4 { + font-size: 3.5rem; + font-weight: 300; + line-height: 1.1; } -.navbar-nav { - margin: 10.5px -15px; + +hr { + border-top: 1px solid rgba(0, 0, 0, 0.1); } -.navbar-nav > li > a { - padding-top: 10px; - padding-bottom: 10px; - line-height: 20px; + +small, +.small { + font-size: 80%; + font-weight: 400; } -@media (max-width: 767px) { - .navbar-nav .open .dropdown-menu > li > a, - .navbar-nav .open .dropdown-menu .dropdown-header { - padding: 5px 15px 5px 25px; - } - .navbar-nav .open .dropdown-menu > li > a { - line-height: 20px; - } - .navbar-nav .open .dropdown-menu > li > a:hover, - .navbar-nav .open .dropdown-menu > li > a:focus { - background-image: none; - } + +mark, +.mark { + padding: 0.2em; + background-color: #fcf8e3; } -@media (min-width: 768px) { - .navbar-nav { - float: left; - margin: 0; - } - .navbar-nav > li { - float: left; - } - .navbar-nav > li > a { - padding-top: 21px; - padding-bottom: 21px; - } - .navbar-nav.navbar-right:last-child { - margin-right: -15px; - } + +.blockquote { + padding: 0.5rem 1rem; + margin-bottom: 2rem; + font-size: 1rem; + border-left: 5px solid #4fbfa8; } -@media (min-width: 768px) { - .navbar-left { - float: left !important; - } - .navbar-right { - float: right !important; - } + +.blockquote-footer { + color: #868e96; } -.navbar-form { - margin-left: -15px; - margin-right: -15px; - padding: 10px 15px; - border-top: 1px solid transparent; - border-bottom: 1px solid transparent; - -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); - margin-top: 14px; - margin-bottom: 14px; + +.blockquote-footer::before { + content: "\2014 \00A0"; } -@media (max-width: 767px) { - .navbar-form .form-group { - margin-bottom: 5px; - } + +.text-primary { + color: #4fbfa8 !important; } -@media (min-width: 768px) { - .navbar-form { - width: auto; - border: 0; - margin-left: 0; - margin-right: 0; - padding-top: 0; - padding-bottom: 0; - -webkit-box-shadow: none; - box-shadow: none; - } - .navbar-form.navbar-right:last-child { - margin-right: -15px; - } + +a.text-primary:focus, a.text-primary:hover { + color: #3aa18c !important; } -.navbar-nav > li > .dropdown-menu { - margin-top: 0; - border-top-right-radius: 0; + +/* + * 4. PAGINATION + */ +.page-item:first-child .page-link { border-top-left-radius: 0; + border-bottom-left-radius: 0; } -.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu { + +.page-item:last-child .page-link { + border-top-right-radius: 0; border-bottom-right-radius: 0; - border-bottom-left-radius: 0; } -.navbar-btn { - margin-top: 14px; - margin-bottom: 14px; + +.page-item.active .page-link { + color: #fff; + background-color: #4fbfa8; + border-color: #4fbfa8; } -.navbar-btn.btn-sm { - margin-top: 16px; - margin-bottom: 16px; + +.page-item.disabled .page-link { + color: #868e96; + background-color: #fff; + border-color: #dee2e6; } -.navbar-btn.btn-xs { - margin-top: 20px; - margin-bottom: 20px; + +.page-link { + padding: 0.5rem 0.75rem; + line-height: 1.25; + color: #4fbfa8; + background-color: #fff; + border: 1px solid #dee2e6; } -.navbar-text { - margin-top: 21px; - margin-bottom: 21px; + +.page-link:focus, .page-link:hover { + color: #348e7b; + text-decoration: none; + background-color: #e9ecef; + border-color: #dee2e6; + outline: 0; } -@media (min-width: 768px) { - .navbar-text { - float: left; - margin-left: 15px; - margin-right: 15px; - } - .navbar-text.navbar-right:last-child { - margin-right: 0; - } + +.pagination-lg .page-link { + padding: 0.75rem 1.5rem; + font-size: 1.25rem; + line-height: 1.5; } -.navbar-default { - background-color: #ffffff; - border-color: #cccccc; - border-bottom: none; + +.pagination-lg .page-item:first-child .page-link { + border-top-left-radius: 0; + border-bottom-left-radius: 0; } -.navbar-default .navbar-brand { - color: #555555; + +.pagination-lg .page-item:last-child .page-link { + border-top-right-radius: 0; + border-bottom-right-radius: 0; } -.navbar-default .navbar-brand:hover, -.navbar-default .navbar-brand:focus { - color: #3b3b3b; - background-color: transparent; + +.pagination-sm .page-link { + padding: 0.25rem 0.5rem; + font-size: 0.7rem; + line-height: 1.5; } -.navbar-default .navbar-text { - color: #777777; + +.pagination-sm .page-item:first-child .page-link { + border-top-left-radius: 0; + border-bottom-left-radius: 0; } -.navbar-default .navbar-nav > li > a { - color: #555555; + +.pagination-sm .page-item:last-child .page-link { + border-top-right-radius: 0; + border-bottom-right-radius: 0; } -.navbar-default .navbar-nav > li > a:hover, -.navbar-default .navbar-nav > li > a:focus { - color: #555555; - background-color: #80cbd9; + +/* +* 5. DROPDOWNS +*/ +.dropdown-menu { + z-index: 1000; + min-width: 10rem; + padding: 0.5rem 0; + margin: 0.125rem 0 0; + font-size: 1rem; + color: #212529; + background-color: #fff; + border: 1px solid rgba(0, 0, 0, 0.15); + border-radius: 0; } -.navbar-default .navbar-nav > .active > a, -.navbar-default .navbar-nav > .active > a:hover, -.navbar-default .navbar-nav > .active > a:focus { - color: #ffffff; - background-color: #38a7bb; + +.dropdown-item { + padding: 0.25rem 1.5rem; + color: #212529; } -.navbar-default .navbar-nav > .disabled > a, -.navbar-default .navbar-nav > .disabled > a:hover, -.navbar-default .navbar-nav > .disabled > a:focus { - color: #cccccc; - background-color: transparent; + +.dropdown-item:focus, .dropdown-item:hover { + color: #16181b; + background-color: #f8f9fa; } -.navbar-default .navbar-toggle { - border-color: #dddddd; + +.dropdown-item.active, .dropdown-item:active { + color: #fff; + background-color: #4fbfa8; +} + +.dropdown-item.disabled, .dropdown-item:disabled { + color: #868e96; +} + +.dropdown-header { + padding: 0.5rem 1.5rem; + font-size: 0.7rem; + color: #868e96; +} + +/* +* 6. UTILITIES +*/ +.bg-primary { + background-color: #4fbfa8 !important; } -.navbar-default .navbar-toggle:hover, -.navbar-default .navbar-toggle:focus { - background-color: #38a7bb; + +a.bg-primary:focus, a.bg-primary:hover { + background-color: #3aa18c !important; } -.navbar-default .navbar-toggle .icon-bar { - background-color: #888888; + +.bg-secondary { + background-color: #868e96 !important; } -.navbar-default .navbar-collapse, -.navbar-default .navbar-form { - border-color: #cccccc; + +a.bg-secondary:focus, a.bg-secondary:hover { + background-color: #6c757d !important; } -.navbar-default .navbar-nav > .open > a, -.navbar-default .navbar-nav > .open > a:hover, -.navbar-default .navbar-nav > .open > a:focus { - background-color: #38a7bb; - color: #ffffff; + +.bg-success { + background-color: #28a745 !important; } -@media (max-width: 767px) { - .navbar-default .navbar-nav .open .dropdown-menu > li > a { - color: #555555; - } - .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, - .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus { - color: #38a7bb; - } - .navbar-default .navbar-nav .open .dropdown-menu > .active > a, - .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, - .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus { - color: #ffffff; - background-color: #38a7bb; - } - .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a, - .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover, - .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus { - color: #cccccc; - background-color: transparent; - } + +a.bg-success:focus, a.bg-success:hover { + background-color: #1e7e34 !important; } -.navbar-default .navbar-link { - color: #555555; + +.bg-info { + background-color: #17a2b8 !important; } -.navbar-default .navbar-link:hover { - color: #555555; + +a.bg-info:focus, a.bg-info:hover { + background-color: #117a8b !important; } -.navbar-default .btn-link { - color: #555555; + +.bg-warning { + background-color: #ffc107 !important; } -.navbar-default .btn-link:hover, -.navbar-default .btn-link:focus { - color: #555555; + +a.bg-warning:focus, a.bg-warning:hover { + background-color: #d39e00 !important; } -.navbar-default .btn-link[disabled]:hover, -fieldset[disabled] .navbar-default .btn-link:hover, -.navbar-default .btn-link[disabled]:focus, -fieldset[disabled] .navbar-default .btn-link:focus { - color: #cccccc; + +.bg-danger { + background-color: #dc3545 !important; } -/* scaffolding */ -body { - font-family: "Roboto", Helvetica, Arial, sans-serif; - font-size: 14px; - line-height: 1.42857143; - color: #555555; + +a.bg-danger:focus, a.bg-danger:hover { + background-color: #bd2130 !important; } -a { - color: #38a7bb; - text-decoration: none; + +.bg-light { + background-color: #f8f9fa !important; } -a:hover, -a:focus { - color: #267280; - text-decoration: underline; + +a.bg-light:focus, a.bg-light:hover { + background-color: #dae0e5 !important; } -a:focus { - outline: thin dotted; - outline: 5px auto -webkit-focus-ring-color; - outline-offset: -2px; + +.bg-dark { + background-color: #343a40 !important; } -.img-rounded { - border-radius: 0; + +a.bg-dark:focus, a.bg-dark:hover { + background-color: #1d2124 !important; } -hr { - margin-top: 20px; - margin-bottom: 20px; - border: 0; - border-top: 1px solid #eeeeee; + +.border-primary { + border-color: #4fbfa8 !important; } -/* breadcrumbs */ -.breadcrumb { - padding: 20px 0; - margin-bottom: 20px; - background-color: transparent; - border-radius: 0; - text-align: right; + +.border-secondary { + border-color: #868e96 !important; } -.breadcrumb > li + li:before { - content: ">\00a0"; - color: #555555; + +.border-success { + border-color: #28a745 !important; } -.breadcrumb > .active { - color: #999999; + +.border-info { + border-color: #17a2b8 !important; } -@media (max-width: 991px) { - .breadcrumb { - padding: 20px 0; - text-align: center; - } + +.border-warning { + border-color: #ffc107 !important; } -/* dropdowns */ -.dropdown-menu { - z-index: 1000; - font-size: 14px; - background-color: #ffffff; - border: 1px solid #cccccc; - border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 0; - -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); - box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); + +.border-danger { + border-color: #dc3545 !important; } -.dropdown-menu.pull-right { - right: 0; - left: auto; + +.border-light { + border-color: #f8f9fa !important; } -.dropdown-menu .divider { - height: 1px; - margin: 9px 0; - overflow: hidden; - background-color: #e5e5e5; + +.border-dark { + border-color: #343a40 !important; } -.dropdown-menu > li > a { - padding: 5px 20px; - line-height: 1.42857143; - color: #333333; - white-space: nowrap; + +.text-primary { + color: #4fbfa8 !important; } -/* labels */ -.label { - font-family: "Roboto", Helvetica, Arial, sans-serif; - font-weight: normal; - text-transform: uppercase; - letter-spacing: 0.08em; + +a.text-primary:focus, a.text-primary:hover { + color: #3aa18c !important; } -/* forms.less */ -label { - font-weight: normal; + +.text-secondary { + color: #868e96 !important; } -.form-control { - -webkit-box-shadow: none; - box-shadow: none; - border-radius: 0; + +a.text-secondary:focus, a.text-secondary:hover { + color: #6c757d !important; } -.form-control:focus { - border-color: #38a7bb; - outline: 0; - -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(56, 167, 187, 0.6); - box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(56, 167, 187, 0.6); + +.text-success { + color: #28a745 !important; } -.form-group { - margin-bottom: 20px; + +a.text-success:focus, a.text-success:hover { + color: #1e7e34 !important; } -/* pager*/ -.pager { - margin: 20px 0; - border-top: solid 1px #eeeeee; - padding-top: 20px; - text-transform: uppercase; - letter-spacing: 0.08em; - font-family: "Roboto", Helvetica, Arial, sans-serif; + +.text-info { + color: #17a2b8 !important; } -.pager li { - display: inline; + +a.text-info:focus, a.text-info:hover { + color: #117a8b !important; } -.pager li > a, -.pager li > span { - background-color: #ffffff; - border: 1px solid #38a7bb; - border-radius: 0; + +.text-warning { + color: #ffc107 !important; } -.pager li > a:hover, -.pager li > a:focus { - text-decoration: none; - color: #fff; - background-color: #38a7bb; -} -.pager .disabled > a, -.pager .disabled > a:hover, -.pager .disabled > a:focus, -.pager .disabled > span { - color: #999999; - background-color: #ffffff; - border-color: #ddd; + +a.text-warning:focus, a.text-warning:hover { + color: #d39e00 !important; } -/* pagination */ -.pagination { - margin: 20px 0; - font-family: "Roboto", Helvetica, Arial, sans-serif; - border-radius: 0; + +.text-danger { + color: #dc3545 !important; } -.pagination > li > a, -.pagination > li > span { - padding: 6px 12px; - line-height: 1.42857143; - text-decoration: none; - color: #38a7bb; - background-color: #ffffff; - border: 1px solid #dddddd; -} -.pagination > li > a:hover, -.pagination > li > span:hover, -.pagination > li > a:focus, -.pagination > li > span:focus { - color: #38a7bb; - background-color: #a7dbe5; - border-color: #dddddd; -} -.pagination > .active > a, -.pagination > .active > span, -.pagination > .active > a:hover, -.pagination > .active > span:hover, -.pagination > .active > a:focus, -.pagination > .active > span:focus { - z-index: 2; - color: #ffffff; - background-color: #38a7bb; - border-color: #38a7bb; -} -.pagination > .disabled > span, -.pagination > .disabled > span:hover, -.pagination > .disabled > span:focus, -.pagination > .disabled > a, -.pagination > .disabled > a:hover, -.pagination > .disabled > a:focus { - color: #999999; - background-color: #ffffff; - border-color: #dddddd; -} -/* responsive utilities */ -@media (max-width: 767px) { - .text-center-xs { - text-align: center !important; - } - .text-center-xs img { - display: block; - margin-left: auto; - margin-right: auto; - } + +a.text-danger:focus, a.text-danger:hover { + color: #bd2130 !important; } -@media (min-width: 768px) and (max-width: 991px) { - .text-center-sm { - text-align: center !important; - } - .text-center-sm img { - display: block; - margin-left: auto; - margin-right: auto; - } + +.text-light { + color: #f8f9fa !important; } -/* type */ -h1, -h2, -h3, -h4, -h5, -h6, -.h1, -.h2, -.h3, -.h4, -.h5, -.h6 { - font-family: "Roboto", Helvetica, Arial, sans-serif; - font-weight: 900; - line-height: 1.1; - color: #333333; + +a.text-light:focus, a.text-light:hover { + color: #dae0e5 !important; } -h1, -.h1, -h2, -.h2, -h3, -.h3 { - margin-top: 20px; - margin-bottom: 20px; + +.text-dark { + color: #343a40 !important; } -p { - margin: 0 0 10px; + +a.text-dark:focus, a.text-dark:hover { + color: #1d2124 !important; } -.lead { - margin-bottom: 20px; - font-size: 18px; + +.badge-primary { + color: #111; + background-color: #4fbfa8; } -@media (min-width: 768px) { - .lead { - font-size: 21px; - } + +.badge-primary[href]:focus, .badge-primary[href]:hover { + color: #111; + text-decoration: none; + background-color: #3aa18c; } -.text-small { - font-size: 12px; + +.badge-secondary { + color: #fff; + background-color: #868e96; } -.text-large { - font-size: 18px; + +.badge-secondary[href]:focus, .badge-secondary[href]:hover { + color: #fff; + text-decoration: none; + background-color: #6c757d; } -.text-italic { - font-style: italic; + +.badge-success { + color: #fff; + background-color: #28a745; } -.text-primary { - color: #38a7bb; + +.badge-success[href]:focus, .badge-success[href]:hover { + color: #fff; + text-decoration: none; + background-color: #1e7e34; } -a.text-primary:hover { - color: #2c8494; + +.badge-info { + color: #fff; + background-color: #17a2b8; } -.bg-primary { + +.badge-info[href]:focus, .badge-info[href]:hover { color: #fff; - background-color: #38a7bb; + text-decoration: none; + background-color: #117a8b; } -a.bg-primary:hover { - background-color: #2c8494; + +.badge-warning { + color: #111; + background-color: #ffc107; } -abbr[title], -abbr[data-original-title] { - border-bottom: 1px dotted #999999; + +.badge-warning[href]:focus, .badge-warning[href]:hover { + color: #111; + text-decoration: none; + background-color: #d39e00; } -blockquote { - padding: 10px 20px; - margin: 0 0 20px; - font-size: 14px; - border-left: 5px solid #38a7bb; + +.badge-danger { + color: #fff; + background-color: #dc3545; } -blockquote footer, -blockquote small, -blockquote .small { - display: block; - font-size: 80%; - line-height: 1.42857143; - color: #999999; + +.badge-danger[href]:focus, .badge-danger[href]:hover { + color: #fff; + text-decoration: none; + background-color: #bd2130; } -blockquote footer:before, -blockquote small:before, -blockquote .small:before { - content: '\2014 \00A0'; + +.badge-light { + color: #111; + background-color: #f8f9fa; } -.blockquote-reverse, -blockquote.pull-right { - border-right: 5px solid #38a7bb; + +.badge-light[href]:focus, .badge-light[href]:hover { + color: #111; + text-decoration: none; + background-color: #dae0e5; } -address { - margin-bottom: 20px; - line-height: 1.42857143; + +.badge-dark { + color: #fff; + background-color: #343a40; } -.panel { - margin-bottom: 20px; - background-color: #ffffff; - border: 1px solid transparent; + +.badge-dark[href]:focus, .badge-dark[href]:hover { + color: #fff; + text-decoration: none; + background-color: #1d2124; +} + +/* +* 7.CODE +*/ +code { + font-size: 87.5%; + color: #e83e8c; border-radius: 0; - -webkit-box-shadow: 0 0 0; - box-shadow: 0 0 0; } -.panel-heading { - border-top-right-radius: 0; + +a > code { + padding: 0; + color: inherit; + background-color: inherit; +} + +/* +* 8. NAV +*/ +.nav-link { + padding: 0.5rem 1rem; +} + +.nav-link.disabled { + color: #868e96; +} + +.nav-tabs .nav-item { + margin-bottom: -1px; +} + +.nav-tabs .nav-link { + border: 1px solid transparent; border-top-left-radius: 0; - text-transform: uppercase; - letter-spacing: 0.08em; - padding: 15px 15px; + border-top-right-radius: 0; } -.progress { - overflow: hidden; - height: 20px; - margin-bottom: 20px; - background-color: #f5f5f5; - border-radius: 0; - -webkit-box-shadow: none; - box-shadow: none; + +.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover { + border-color: #e9ecef #e9ecef #dee2e6; } -.panel-group { - margin-bottom: 20px; + +.nav-tabs .nav-link.disabled { + color: #868e96; } -.panel-group .panel { - margin-bottom: 0; + +.nav-tabs .nav-link.active, +.nav-tabs .nav-item.show .nav-link { + color: #495057; + background-color: #fff; +} + +.nav-tabs .dropdown-menu { + margin-top: -1px; +} + +.nav-pills .nav-link { border-radius: 0; - overflow: hidden; } -.panel-group .panel + .panel { - margin-top: 5px; + +.nav-pills .nav-link.active, +.nav-pills .show > .nav-link { + color: #fff; + background-color: #4fbfa8; } -.panel-group.accordion .panel { - border-color: #ccc; + +/* +* 9. CARD +*/ +.card { + background-color: #fff; + border: 1px solid rgba(0, 0, 0, 0.125); + border-radius: 0; } -.panel-primary { - border-color: #38a7bb; + +.card > .list-group:first-child .list-group-item:first-child { + border-top-left-radius: 0; + border-top-right-radius: 0; } -.panel-primary > .panel-heading { - color: #ffffff; - background-color: #38a7bb; - border-color: #38a7bb; + +.card > .list-group:last-child .list-group-item:last-child { + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; } -.panel-primary > .panel-heading + .panel-collapse > .panel-body { - border-top-color: #38a7bb; + +.card-body { + padding: 1.25rem; } -.panel-primary > .panel-heading .badge { - color: #38a7bb; - background-color: #ffffff; + +.card-title { + margin-bottom: 0.75rem; } -.panel-primary > .panel-footer + .panel-collapse > .panel-body { - border-bottom-color: #38a7bb; + +.card-subtitle { + margin-top: -0.375rem; } -.panel-primary .panel-title { - font-weight: 300; + +.card-link + .card-link { + margin-left: 1.25rem; } -.panel-primary .panel-title a:hover { - color: #fff; - text-decoration: none; + +.card-header { + padding: 0.75rem 1.25rem; + background-color: rgba(0, 0, 0, 0.03); + border-bottom: 1px solid rgba(0, 0, 0, 0.125); } -a.badge:hover, -a.badge:focus { - color: #ffffff; - text-decoration: none; - cursor: pointer; + +.card-header:first-child { + border-radius: calc(0 - 1px) calc(0 - 1px) 0 0; } -a.list-group-item.active > .badge, -.nav-pills > .active > a > .badge { - color: #38a7bb; - background-color: #ffffff; + +.card-header-transparent { + background-color: rgba(0, 0, 0, 0.3); + border-bottom: none; } -.nav-pills > li > a > .badge { - margin-left: 3px; + +.card-footer { + padding: 0.75rem 1.25rem; + background-color: #f8f9fa; + border-top: 1px solid rgba(0, 0, 0, 0.125); +} + +.card-footer:last-child { + border-radius: 0 0 calc(0 - 1px) calc(0 - 1px); +} + +.card-header-tabs { + margin-right: -0.625rem; + margin-bottom: -0.75rem; + margin-left: -0.625rem; + border-bottom: 0; } -.progress-bar-primary { - background-color: #38a7bb; + +.card-header-pills { + margin-right: -0.625rem; + margin-left: -0.625rem; } -.progress-striped .progress-bar-primary { - background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); - background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); - background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); + +.card-img-overlay { + padding: 1.25rem; } -/*! - * Yamm!3 - Yet another megamenu for Bootstrap 3 - * http://geedmo.github.com/yamm3 - * - * @geedmo - Licensed under the MIT license - */ -.yamm .nav, -.yamm .collapse, -.yamm .dropup.use-yamm, -.yamm .dropdown.use-yamm { - position: static; + +.card-img-overlay-opacity { + background: rgba(0, 0, 0, 0.2); } -.yamm .container { - position: relative; + +.card-img { + border-radius: calc(0 - 1px); } -.yamm .dropdown-menu { - left: auto; + +.card-img-top { + border-top-left-radius: calc(0 - 1px); + border-top-right-radius: calc(0 - 1px); } -.yamm .nav.navbar-right .dropdown-menu { - left: auto; - right: 0; + +.card-img-bottom { + border-bottom-right-radius: calc(0 - 1px); + border-bottom-left-radius: calc(0 - 1px); } -.yamm .yamm-content { - padding: 20px 30px; + +.card-deck .card { + margin-bottom: 15px; } -.yamm .dropdown.yamm-fw .dropdown-menu { - left: 15px; - right: 15px; + +@media (min-width: 576px) { + .card-deck { + margin-right: -15px; + margin-left: -15px; + } + .card-deck .card { + margin-right: 15px; + margin-left: 15px; + } } diff --git a/static/css/style.green.css b/static/css/style.green.css index cf1a5ee66..216077bc6 100644 --- a/static/css/style.green.css +++ b/static/css/style.green.css @@ -1,3566 +1,3702 @@ -.clearfix:before, -.clearfix:after, -.navbar:before, -.navbar:after, -.navbar-header:before, -.navbar-header:after { - content: " "; - display: table; +/* + +================================================================================== +================================================================================== + +Universal Template + +https://bootstrapious.com/p/universal-business-e-commerce-template + +================================================================================== +================================================================================== + +*/ +/* +* +* ===================== +* GENERAL +* ===================== +* +*/ +.boxed { + background: url("../img/boxed-pattern.png"); +} + +.boxed #all { + max-width: 1200px; + margin: 0 auto; + background: #fff; + -webkit-box-shadow: 0 0 5px #ccc; + box-shadow: 0 0 5px #ccc; +} + +a { + -webkit-transition: all 0.3s !important; + transition: all 0.3s !important; + display: inline-block; +} + +button { + cursor: pointer; +} + +strong { + font-weight: 700; +} + +p.lead { + margin-bottom: 40px; +} + +.accent { + color: #6aae7a; } -.clearfix:after, -.navbar:after, -.navbar-header:after { - clear: both; + +.tooltip { + font-family: "Roboto", Helvetica, Arial, sans-serif; } -.center-block { + +.bs-select .dropdown-menu .dropdown-menu { + min-height: 20px; display: block; - margin-left: auto; - margin-right: auto; } -.pull-right { - float: right !important; + +.bs-select .dropdown-menu .dropdown-menu a { + padding: 6px 10px; + color: #666; + font-weight: 700; + text-decoration: none !important; + display: block; + font-size: .8rem; + text-transform: uppercase; + letter-spacing: 0.1em; + font-family: "Roboto", Helvetica, Arial, sans-serif; + outline: none; } -.pull-left { - float: left !important; + +.heading-light { + font-weight: 300 !important; } -.hide { - display: none !important; + +.text-bold { + font-weight: 700; } -.show { - display: block !important; + +.text-small { + font-size: 0.9rem; } -.invisible { - visibility: hidden; + +.text-uppercase { + text-transform: uppercase; + letter-spacing: 0.1em; } -.text-hide { - font: 0/0 a; - color: transparent; - text-shadow: none; - background-color: transparent; - border: 0; + +.no-letter-spacing { + letter-spacing: 0 !important; } -.hidden { - display: none !important; - visibility: hidden !important; + +.bar { + padding: 60px 0; } -.affix { - position: fixed; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); + +.bar.padding-big { + padding: 50px 0; } -/* general styles */ -a, -button { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.pagination { + margin-top: 20px; } -a i[class^="fa"], -button i[class^="fa"] { - margin: 0 5px; + +#pagination .pagination { + margin-bottom: 40px; } -.clickable { - cursor: pointer !important; + +.text-sm, .form-group label, #blog-listing-big .date-comments a, #blog-listing-medium .date-comments a, #blog-listing-big p.intro, #blog-listing-medium p.intro { + font-size: 0.9rem; } -.required { - color: #6aae7a; + +.text-xs { + font-size: 0.9rem; } -.accent { - color: #6aae7a; + +.text-xs * { + font-size: 0.9rem; } -.text-uppercase { - text-transform: uppercase; - letter-spacing: 0.08em; + +@media (max-width: 767px) { + .text-sm-center { + text-align: center !important; + } } + @media (max-width: 991px) { + .text-md-center { + text-align: center !important; + } +} + +@media (max-width: 1199px) { + .text-lg-center { + text-align: center !important; + } +} + +@media (max-width: 767px) { .text-center-sm { - text-align: center; + text-align: center !important; } } -p.lead { - margin-bottom: 40px; + +@media (max-width: 991px) { + .text-center-md { + text-align: center !important; + } } -section, -div.section { - margin-bottom: 40px; + +@media (max-width: 1199px) { + .text-center-sm, .text-center-xs { + text-align: center !important; + } } + +.bg-gray { + background: #e9ecef !important; +} + +.bg-gray-dark { + background: #555 !important; +} + +.bg-primary { + background: #6aae7a !important; +} + +.color-white { + color: #fff !important; +} + +.color-white * { + color: #fff !important; +} + +.bg-white { + background: #fff !important; +} + +.bg-fixed { + background-attachment: fixed !important; +} + +.light-gray { + background: #eee; +} + .no-mb { margin-bottom: 0 !important; } + +.no-mt { + margin-top: 0 !important; +} + +.no-horizontal-padding { + padding-left: 0 !important; + padding-right: 0 !important; +} + .mb-small { margin-bottom: 20px !important; } -.heading { - margin-bottom: 40px; + +.no-padding-top { + padding-top: 0 !important; } -.heading h1, -.heading h2, -.heading h3, -.heading h4, -.heading h5 { - display: inline-block; - border-bottom: solid 5px #6aae7a; + +.no-padding-bottom { + padding-bottom: 0 !important; +} + +.padding-horizontal { + padding-left: 30px !important; + padding-right: 30px !important; +} + +.relative-positioned { + position: relative; + z-index: 1; +} + +.jumbotron { + margin: 0; +} + +.owl-carousel.equal-height .owl-stage { + display: -webkit-box !important; + display: -ms-flexbox !important; + display: flex !important; + -webkit-box-align: stretch !important; + -ms-flex-align: stretch !important; + align-items: stretch !important; +} + +.background-pentagon, #heading-breadcrumbs { + background: url("../img/texture-bw.png") center center repeat; + border-top: 1px solid #999; + border-bottom: 1px solid #999; +} + +.heading, .panel-heading { + margin-bottom: 1rem; +} + +.heading h1, .panel-heading h1, .heading h2, .panel-heading h2, .heading h3, .panel-heading h3, .heading h4, .panel-heading h4, .heading h5, .panel-heading h5, .heading h6, .panel-heading h6 { line-height: 1.1; + display: inline-block; margin-bottom: 0; padding-bottom: 10px; - vertical-align: middle; text-transform: uppercase; - letter-spacing: 0.06em; + letter-spacing: 0.1em; } -.heading h1 i[class^="fa"], -.heading h2 i[class^="fa"], -.heading h3 i[class^="fa"], -.heading h4 i[class^="fa"], -.heading h5 i[class^="fa"] { - display: inline-block; + +.heading h1:after, .panel-heading h1:after, .heading h2:after, .panel-heading h2:after, .heading h3:after, .panel-heading h3:after, .heading h4:after, .panel-heading h4:after, .heading h5:after, .panel-heading h5:after, .heading h6:after, .panel-heading h6:after { + content: " "; + display: block; + width: 100px; + height: 2px; + margin-top: .6rem; background: #6aae7a; - width: 30px; - height: 30px; - vertical-align: middle; - text-align: center; - color: #fff; - font-size: 12px; - line-height: 30px; - border-radius: 15px; } -.icon { - display: inline-block; - width: 80px; - height: 80px; - color: #fff; - line-height: 80px; - border-radius: 40px; - border: solid 1px #fff; - font-size: 20px; + +.heading.text-center h1:after, .text-center.panel-heading h1:after, .heading.text-center h2:after, .text-center.panel-heading h2:after, .heading.text-center h3:after, .text-center.panel-heading h3:after, .heading.text-center h4:after, .text-center.panel-heading h4:after, .heading.text-center h5:after, .text-center.panel-heading h5:after, .heading.text-center h6:after, .text-center.panel-heading h6:after { + margin-left: auto; + margin-right: auto; } -.icon.icon-lg { - font-size: 30px; - border-width: 2px; + +.buttons a { + margin: 0 3px; } -.ul-icons { - padding-left: 10px; + +.dropdown-item.active, .dropdown-item:active { + background: #acd2b5; } -.ul-icons li { - list-style-type: none; - line-height: 20px; - margin-bottom: 20px; + +.card { + border-radius: 0; + margin-bottom: 10px; } -.ul-icons li i { - width: 20px; - height: 20px; - background: #6aae7a; - color: #fff; - text-align: center; - border-radius: 10px; - line-height: 20px; - margin-right: 10px; + +.card-header { + border-radius: 0; + padding: 20px; } -ul.list-style-none { - list-style: none; + +.card-header h1, .card-header h2, .card-header h3, .card-header h4, .card-header h5, .card-header h6 { + text-transform: uppercase; + letter-spacing: 0.1em; + font-size: 0.935rem; + margin: 0 !important; } -#text-page h1, -#text-page h2, -#text-page h3 { - font-weight: 700; + +.card-header a { + color: #333; } -#error-page { - text-align: center; - margin-top: 40px; - margin-bottom: 100px; + +.card-body p { + font-size: 0.9rem; + color: #333; } -#error-page h4 { - margin-bottom: 40px; + +.alert { + border-radius: 0; } -#error-page p.buttons { - margin-top: 40px; + +#heading-breadcrumbs { + padding: 2rem 0; + border-top: none !important; + border-bottom: none !important; } -.pages-listing .item { - text-align: center; + +#heading-breadcrumbs .breadcrumb { + margin-bottom: 0; + background: none; + font-size: 0.9rem; } -.pages-listing .item h3 { - font-size: 18px; + +#heading-breadcrumbs h1 { text-transform: uppercase; - margin-bottom: 20px; - letter-spacing: 0.08em; + letter-spacing: 0.1em; + margin-bottom: 0; } -.pages-listing .item h3 a { - color: #555555; + +#heading-breadcrumbs li { + text-transform: uppercase; + letter-spacing: 0.1em; } -.pages-listing .item .text { - margin-bottom: 20px; + +.row.no-space { + margin-left: 0; + margin-right: 0; } -.pages-listing .item .text p { - color: #999999; - font-size: 12px; - margin-bottom: 20px; + +.row.no-space div[class*="col-"] { + padding: 0; } -.banner { - margin-bottom: 30px; + +.row.no-space .box-image { + margin: 0; +} + +.owl-carousel .owl-dots { + margin-top: 20px; text-align: center; } -.banner img { - margin: 0 auto; + +.owl-carousel .owl-dots .owl-dot { + display: inline-block; + margin: 0 5px; } -.banner a:hover img { - opacity: 0.8; - filter: alpha(opacity=80); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.owl-carousel .owl-dots .owl-dot.active span { + background: #fff; } -.pages { - text-align: center; + +.owl-carousel .owl-dots .owl-dot span { + display: block; + width: 12px; + height: 12px; + border-radius: 50%; + background: #aaa; +} + +.dark-mask { + background: rgba(0, 0, 0, 0.3); + width: 100%; + height: 100%; + position: absolute; + top: 0; + left: 0; + z-index: -1; } -.pages .loadMore { - text-align: center; + +.dark-mask.mask-primary { + background: rgba(106, 174, 122, 0.9); } -.pages .pagination { + +.icon-outlined { + width: 80px; + height: 80px; + line-height: 80px; text-align: center; -} -.features-buttons button { + display: inline-block; + font-size: 1.4rem; + border-radius: 50%; + border: 2px solid #fff; margin-bottom: 20px; } -@media (min-width: 1300px) { - body.boxed { - background: url(https://www.toptal.com/designers/subtlepatterns/patterns/subtle_zebra_3d.png); - } - body.boxed #all { - position: relative; - background: #fff; - width: 1200px; - margin: 0 auto; - overflow: hidden; - -webkit-box-shadow: 0 0 5px #cccccc; - box-shadow: 0 0 5px #cccccc; - } -} -#top { - background: #555555; - color: #eeeeee; - padding: 10px 0; + +.icon-outlined.icon-lg { + font-size: 2rem; } -#top p { - margin: 0; - font-size: 12px; + +.icon-outlined.icon-sm { + width: 55px; + height: 55px; + line-height: 55px; + text-align: center; + font-size: 1.15rem; } -#top .social { - float: right; - text-align: right; + +.icon-outlined.icon-thin { + border-width: 1px; } -#top .social a { - color: #999999; - display: inline-block; + +.icon-filled { width: 24px; height: 24px; - border-radius: 12px; line-height: 24px; - font-size: 12px; + background: #6aae7a; + color: #fff; text-align: center; + border-radius: 50%; + font-size: 0.75rem; +} + +.ul-icons .icon-filled { + display: inline-block; + margin-right: 10px; +} + +.ul-icons li { + margin-bottom: 20px; + color: #555; + font-size: 0.9rem; +} + +.ul-icons a { + display: inline; +} + +ul.social { + margin: 15px 0; } -#top .social a:hover { + +ul.social a { + width: 28px; + height: 28px; + line-height: 28px; + background: #555; color: #fff; - background: #6aae7a; + text-align: center; + border-radius: 50%; + margin: 0 2px; + font-size: 0.8rem; +} + +ul.social a:hover { -webkit-transform: scale(1.1); transform: scale(1.1); } -#top .social a:hover.facebook { - background-color: #4460ae; + +ul.social a.facebook { + background: #4561ae; } -#top .social a:hover.gplus { - background-color: #c21f25; + +ul.social a.gplus { + background: #c22026; } -#top .social a:hover.twitter { - background-color: #3cf; + +ul.social a.twitter { + background: #34ccff; } -#top .social a:hover.instagram { - background-color: #cd4378; + +ul.social a.email { + background: #4b8046; } -#top .social a:hover.email { - background-color: #4a7f45; + +.showcase { + color: #555; } -#top .login { - float: right; + +.showcase .icon-outlined { + border-color: #555; } -#top .login a { - font-size: 12px; - color: #eeeeee; - margin-right: 15px; - text-decoration: none; + +.showcase .counter { + margin-bottom: 20px; + display: inline-block; + margin-top: 0; +} + +.showcase h4 { text-transform: uppercase; - font-weight: 700; - letter-spacing: 0.10em; + letter-spacing: 0.1em; + font-size: 0.935rem; + margin-top: 0; } -@media (max-width: 767px) { - #top .login { - float: left; - } + +.form-control { + border-radius: 0; } -#top.light { - background: #fff; - color: #999999; - border-bottom: solid 1px #eeeeee; + +.form-control:focus { + border-color: #6aae7a; + -webkit-box-shadow: 0 0 0 0.2rem rgba(106, 174, 122, 0.25); + box-shadow: 0 0 0 0.2rem rgba(106, 174, 122, 0.25); } -#top.light .login a { - color: #555555; + +.form-group label { + color: #555; } -.navbar { + +.card-primary { + border-radius: 0; + border-color: #6aae7a; +} + +.card-primary .card-header { + background: #6aae7a; + color: #fff; border: none; + border-radius: 0; } -.navbar ul.nav > li > a { + +.card-primary .card-header a { + color: #fff; text-transform: uppercase; - text-decoration: underline; - font-weight: bold; - letter-spacing: 0.08em; - border-top: solid 5px transparent; -} -.navbar ul.nav > li > a:hover { - border-top: solid 5px #6aae7a; + font-weight: 300; + letter-spacing: 0.05em; } -.navbar ul.nav > li.active > a, -.navbar ul.nav > li.open > a { - text-decoration: none !important; - border-top: solid 5px #3f734b; + +.card-primary .card-body { + border-color: #6aae7a; } -@media (max-width: 768px) { - .navbar ul.nav > li.active > a, - .navbar ul.nav > li.open > a { - border-top-color: transparent; - } - .navbar ul.nav > li > a:hover { - border-top-color: transparent; - } + +.card-body li { + font-size: 0.9rem; } -.navbar.navbar-light ul.nav > li.active > a { - border-top: solid 5px #3f734b; - background: #fff !important; - color: #555555 !important; + +table { + font-size: 0.9rem; } -.navbar.navbar-light ul.nav > li.active > a:hover { - border-top: solid 5px #3f734b; + +table img { + min-width: 50px !important; + max-width: 50px !important; + height: 50px; } -.navbar.navbar-light ul.nav > li > a:hover, -.navbar.navbar-light ul.nav > li.open > a:hover, -.navbar.navbar-light ul.nav > li > a:focus, -.navbar.navbar-light ul.nav > li.open > a:focus { - border-top: solid 5px #6aae7a; - background: #fff !important; - color: #555555 !important; + +table input[type="number"] { + max-width: 50px; } -.navbar ul.dropdown-menu { - margin: 0; - padding: 0; + +.nav-tabs { + border-bottom: none; } -.navbar ul.dropdown-menu li { - list-style-type: none; - border-bottom: solid 1px #eeeeee; - text-transform: uppercase; - letter-spacing: 0.08em; - padding: 4px 0; + +.nav-tabs a.nav-link { + border-radius: 0 !important; + font-size: 0.9rem; } -.navbar ul.dropdown-menu li a { - position: relative; - color: #999999; - font-size: 12px; - display: block; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - left: 0; + +.tab-content { + padding: 20px; + border: 1px solid #ddd; + font-size: 0.9rem; } -.navbar ul.dropdown-menu li a:hover { - color: #6aae7a; - text-decoration: none; - background: none; - left: 2px; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.top-bar { + background: #555; + color: #fff; + font-size: 0.9rem; + padding: 10px 0; } -@media (max-width: 767px) { - .navbar ul.dropdown-menu li a:hover { - left: 0; - } + +.top-bar.top-bar-light { + background: #fff; + color: #555; + border-bottom: 1px solid #ddd; } -.navbar .yamm-content h3 { - font-size: 18px; - text-transform: uppercase; - padding-bottom: 10px; - margin-top: 5px; - border-bottom: dotted 1px #555555; - letter-spacing: 0.08em; + +.top-bar.top-bar-light a.login-btn, .top-bar.top-bar-light a.signup-btn { + color: #555 !important; } -@media (max-width: 767px) { - .navbar .yamm-content h3 { - font-size: 14px; - } + +.top-bar.top-bar-light a.login-btn span, .top-bar.top-bar-light a.signup-btn span { + display: inline-block; } -.navbar .yamm-content h5 { - text-transform: uppercase; - padding-bottom: 10px; - border-bottom: dotted 1px #555555; - letter-spacing: 0.08em; + +.top-bar p { + margin-bottom: 0; + font-size: 0.75rem; } -.navbar .yamm-content ul { - margin: 0; - padding: 0; + +.top-bar ul { + margin-bottom: 0; } -.navbar .yamm-content ul li { - list-style-type: none; - border-bottom: solid 1px #eeeeee; + +.top-bar a.login-btn, .top-bar a.signup-btn { + color: #eee; text-transform: uppercase; - padding: 4px 0; -} -.navbar .yamm-content ul li a { - position: relative; - color: #999999; - font-size: 12px; - display: block; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + letter-spacing: 0.1em; + text-decoration: none !important; + font-size: 0.75rem; + font-weight: 700; + margin-right: 10px; } -.navbar .yamm-content ul li a:hover { - color: #6aae7a; - text-decoration: none; - padding-left: 2px; + +.top-bar a.login-btn i, .top-bar a.signup-btn i { + margin-right: 10px; } -.navbar .yamm-content .banner { - margin-bottom: 10px; + +.top-bar ul.social-custom { + margin-left: 20px; } -.navbar .yamm-fw .dropdown-menu { + +.top-bar ul.social-custom li { padding: 0; + margin: 0; } -.navbar .navbar-buttons { - float: right; + +.top-bar ul.social-custom a { + text-decoration: none !important; + font-size: 0.7rem; + width: 26px; + height: 26px; + line-height: 26px; + color: #999; + text-align: center; + border-radius: 50%; + margin: 0; } -.navbar .navbar-buttons button, -.navbar .navbar-buttons a.btn, -.navbar .navbar-buttons .btn-default.navbar-toggle { - margin-top: 11px; - margin-bottom: 11px; - margin-left: 0; - margin-right: 5px; -} -.navbar .btn-default, -.navbar .btn-default.navbar-toggle { - color: #999999; - background-color: #fff; - margin-left: 7px; - margin-right: 0; -} -.navbar .btn-default:hover, -.navbar .btn-default.navbar-toggle:hover, -.navbar .btn-default:focus, -.navbar .btn-default.navbar-toggle:focus { - background-color: #fff; - border-color: #6aae7a; - color: #6aae7a; + +.top-bar ul.social-custom a:hover { + background: #6aae7a; + color: #fff; } -.navbar #search { - clear: both; - border-top: solid 1px #6aae7a; - text-align: right; + +.top-bar .contact-info { + margin-right: 20px; } -.navbar #search form { - float: right; + +.top-bar .contact-info a { + font-size: 0.8rem; } -.navbar #search form .input-group { - width: 500px; + +.modal .modal-header h4 { + text-transform: uppercase; + letter-spacing: 0.1em; } -@media (max-width: 768px) { - .navbar #search form .input-group { - width: 100%; - } + +.modal input::-moz-placeholder { + font-size: 0.85rem; } -.navbar #basket-overview a { - margin-left: 7px; + +.modal input::-webkit-input-placeholder { + font-size: 0.85rem; } -.navbar-affixed-top { - top: -32px; + +.modal input:-ms-input-placeholder { + font-size: 0.85rem; } -.navbar-affixed-top.affix-top { - -webkit-transition: all 0.5s ease-out; - -moz-transition: all 0.5s ease-out; - transition: all 0.5s ease-out; + +.modal p { + font-size: 0.85rem; } -.navbar-affixed-top.affix { + +header.nav-holder.sticky { position: fixed; - width: 100%; top: 0; - z-index: 1000; - -webkit-box-shadow: 0 0 5px #cccccc; - box-shadow: 0 0 5px #cccccc; - -webkit-transition: all 0.5s ease-out; - -moz-transition: all 0.5s ease-out; - transition: all 0.5s ease-out; + left: 0; + width: 100%; + background: #fff; + z-index: 999; + -webkit-box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); + box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); } -body.boxed .navbar-affixed-top.affix { - position: static; + +#navbar { + background: #fff; + padding-top: 0; + padding-bottom: 0; } -#login-modal { - overflow: hidden; + +#navbar .navbar-toggler { + font-size: 0.9rem; + padding: 10px 15px; + border-color: #ddd; } -#login-modal .modal-header h4 { - text-transform: uppercase; + +#navbar ul ul a { + padding-left: 0 !important; } -#login-modal form { - margin-bottom: 20px; + +#navbar .dropdown-menu { + border-radius: 0; + -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); + box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); + margin-top: 0; + padding-top: 0; + padding-bottom: 0; +} + +#navbar .dropdown-menu .dropdown-item { + padding: 0; } -#login-modal a { + +#navbar .dropdown-menu h5 { + text-transform: uppercase; + letter-spacing: 0.1em; + padding-bottom: 5px; + border-bottom: 1px dotted #ccc; + margin-top: .7rem; + margin-bottom: .5rem; +} + +#navbar .dropdown-menu a.nav-link { + font-size: 0.75rem; + letter-spacing: 0.1em; + text-transform: uppercase !important; + border-bottom: 1px solid #eee; + padding: 15px 20px !important; +} + +#navbar .dropdown-menu a.nav-link:hover { + -webkit-transform: translateX(5px); + transform: translateX(5px); color: #6aae7a; } -#login-modal p { - font-weight: 300; - margin-bottom: 20px; - font-size: 13px; + +#navbar .dropdown-submenu { + position: relative; } -/* buttons */ -.btn { - font-weight: 700; - font-family: "Roboto", Helvetica, Arial, sans-serif; - text-transform: uppercase; - letter-spacing: 0.08em; - padding: 6px 12px; - font-size: 13px; - line-height: 1.42857143; - border-radius: 0; + +#navbar .dropdown-submenu > .dropdown-menu { + top: 0; + left: 100%; + margin-top: -2px; + font-size: 1em; } -.input-group .btn { - font-size: 14px; + +#navbar .menu-large { + position: static !important; } -.btn-lg { - padding: 10px 16px; - font-size: 14px; - line-height: 1.33; - border-radius: 0; + +#navbar .menu-large .megamenu { + padding: 20px; + width: 100%; + max-width: 1140px; + left: 50%; + -webkit-transform: translateX(-50%); + transform: translateX(-50%); + margin-top: -1px; +} + +#navbar .menu-large a.nav-link { + padding: 7px !important; + padding-left: 0 !important; +} + +#navbar .navbar-nav > li.active > a { + background: #6aae7a !important; + color: #fff !important; + text-decoration: none !important; + border-color: #519461 !important; } -.btn-sm { - padding: 5px 10px; - font-size: 12px; - line-height: 1.5; - border-radius: 0; + +#navbar .navbar-nav > li > a { + margin: 0; + padding: 1.4rem 1rem 1.6rem; + color: #555; + font-weight: 600; + text-transform: uppercase; + letter-spacing: 0.1em; + font-size: 0.9rem; + text-decoration: none; + border-top: .3rem solid transparent; } -.btn-xs { - padding: 1px 5px; - font-size: 12px; - line-height: 1.5; - border-radius: 0; + +#navbar .navbar-nav > li > a:hover { + background: rgba(106, 174, 122, 0.5); + border-color: rgba(106, 174, 122, 0.8); +} + +#navbar .navbar-nav > li > a:focus { + background: #6aae7a !important; + color: #fff !important; + text-decoration: none !important; + border-color: #519461 !important; +} + +#navbar.nav-light .navbar-nav > li.active a.dropdown-toggle, +#navbar.nav-light .navbar-nav > li.active a.dropdown-toggle:hover { + background: none !important; + color: #555 !important; + text-decoration: underline !important; + border-color: #6aae7a !important; +} + +#navbar.nav-light .navbar-nav > li > a:hover { + background: none !important; + border-color: #9cc9a6 !important; +} + +#navbar.nav-light .navbar-nav > li > a:focus { + background: none !important; + color: #555 !important; + text-decoration: underline !important; + border-color: #6aae7a !important; +} + +@media (max-width: 991px) { + #navbar { + padding-top: 1rem; + padding-bottom: 1rem; + } + #navbar .menu-large .megamenu { + width: 100%; + left: 0 !important; + -webkit-transform: none !important; + transform: none !important; + } + #navbar .navbar-collapse { + max-height: 600px; + overflow-y: auto; + margin-top: 1rem; + } + #navbar .navbar-nav > li > a { + padding: 0 10px; + height: 45px; + line-height: 45px; + border-top: 0; + font-size: 0.85rem; + width: 100%; + } + #navbar .navbar-nav > li > a:hover { + background: rgba(106, 174, 122, 0.5); + border-color: rgba(106, 174, 122, 0.8); + } + #navbar .dropdown-menu { + border: none; + -webkit-box-shadow: none; + box-shadow: none; + } } + +.btn { + text-transform: uppercase; + letter-spacing: 0.1em; +} + .btn-template-main { - color: #6aae7a; - background-color: #ffffff; - border-color: #6aae7a; + background: #6aae7a; + border: 1px solid #6aae7a !important; + color: #fff !important; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-main:hover, -.btn-template-main:focus, -.btn-template-main:active, -.btn-template-main.active, -.open > .dropdown-toggle.btn-template-main { - color: #6aae7a; - background-color: #e6e6e6; - border-color: #4d8e5c; + +.btn-template-main:hover, .btn-template-main:focus { + background: #5aa56b; + color: #fff !important; + border-color: #5aa56b !important; } -.btn-template-main:active, -.btn-template-main.active, -.open > .dropdown-toggle.btn-template-main { - background-image: none; + +.btn-template-white { + background: #fff; + color: #6aae7a !important; + border: 1px solid #6aae7a !important; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-main.disabled, -.btn-template-main[disabled], -fieldset[disabled] .btn-template-main, -.btn-template-main.disabled:hover, -.btn-template-main[disabled]:hover, -fieldset[disabled] .btn-template-main:hover, -.btn-template-main.disabled:focus, -.btn-template-main[disabled]:focus, -fieldset[disabled] .btn-template-main:focus, -.btn-template-main.disabled:active, -.btn-template-main[disabled]:active, -fieldset[disabled] .btn-template-main:active, -.btn-template-main.disabled.active, -.btn-template-main[disabled].active, -fieldset[disabled] .btn-template-main.active { - background-color: #ffffff; - border-color: #6aae7a; + +.btn-template-white:hover, .btn-template-white:focus { + background: #6aae7a !important; + color: #fff !important; } -.btn-template-main .badge { - color: #ffffff; - background-color: #6aae7a; + +.btn-template-outlined { + background: none; + border: 1px solid #6aae7a !important; + color: #6aae7a; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-main:hover, -.btn-template-main:focus, -.btn-template-main:active, -.btn-template-main.active { + +.btn-template-outlined:hover, .btn-template-outlined:focus { background: #6aae7a; - color: #ffffff; - border-color: #6aae7a; + color: #fff !important; } -.btn-template-transparent-primary { - color: #ffffff; - background-color: transparent; - border-color: #ffffff; -} -.btn-template-transparent-primary:hover, -.btn-template-transparent-primary:focus, -.btn-template-transparent-primary:active, -.btn-template-transparent-primary.active, -.open > .dropdown-toggle.btn-template-transparent-primary { - color: #ffffff; - background-color: rgba(0, 0, 0, 0); - border-color: #e0e0e0; -} -.btn-template-transparent-primary:active, -.btn-template-transparent-primary.active, -.open > .dropdown-toggle.btn-template-transparent-primary { - background-image: none; + +.btn-template-outlined-white { + background: none; + border: 1px solid #fff !important; + color: #fff; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-transparent-primary.disabled, -.btn-template-transparent-primary[disabled], -fieldset[disabled] .btn-template-transparent-primary, -.btn-template-transparent-primary.disabled:hover, -.btn-template-transparent-primary[disabled]:hover, -fieldset[disabled] .btn-template-transparent-primary:hover, -.btn-template-transparent-primary.disabled:focus, -.btn-template-transparent-primary[disabled]:focus, -fieldset[disabled] .btn-template-transparent-primary:focus, -.btn-template-transparent-primary.disabled:active, -.btn-template-transparent-primary[disabled]:active, -fieldset[disabled] .btn-template-transparent-primary:active, -.btn-template-transparent-primary.disabled.active, -.btn-template-transparent-primary[disabled].active, -fieldset[disabled] .btn-template-transparent-primary.active { - background-color: transparent; - border-color: #ffffff; + +.btn-template-outlined-white:hover, .btn-template-outlined-white:focus { + background: #fff; + color: #6aae7a !important; } -.btn-template-transparent-primary .badge { - color: transparent; - background-color: #ffffff; + +.btn-template-outlined-black { + background: none; + border: 1px solid #333 !important; + color: #333; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-transparent-primary:hover, -.btn-template-transparent-primary:focus, -.btn-template-transparent-primary:active, -.btn-template-transparent-primary.active { - background: #fff; - color: #6aae7a; - border-color: #fff; + +.btn-template-outlined-black:hover, .btn-template-outlined-black:focus { + background: #333 !important; + color: #fff !important; } -.btn-template-transparent-black { - color: #ffffff; - background-color: transparent; - border-color: #ffffff; -} -.btn-template-transparent-black:hover, -.btn-template-transparent-black:focus, -.btn-template-transparent-black:active, -.btn-template-transparent-black.active, -.open > .dropdown-toggle.btn-template-transparent-black { - color: #ffffff; - background-color: rgba(0, 0, 0, 0); - border-color: #e0e0e0; -} -.btn-template-transparent-black:active, -.btn-template-transparent-black.active, -.open > .dropdown-toggle.btn-template-transparent-black { - background-image: none; + +.features-buttons button { + margin-bottom: 20px; } -.btn-template-transparent-black.disabled, -.btn-template-transparent-black[disabled], -fieldset[disabled] .btn-template-transparent-black, -.btn-template-transparent-black.disabled:hover, -.btn-template-transparent-black[disabled]:hover, -fieldset[disabled] .btn-template-transparent-black:hover, -.btn-template-transparent-black.disabled:focus, -.btn-template-transparent-black[disabled]:focus, -fieldset[disabled] .btn-template-transparent-black:focus, -.btn-template-transparent-black.disabled:active, -.btn-template-transparent-black[disabled]:active, -fieldset[disabled] .btn-template-transparent-black:active, -.btn-template-transparent-black.disabled.active, -.btn-template-transparent-black[disabled].active, -fieldset[disabled] .btn-template-transparent-black.active { - background-color: transparent; - border-color: #ffffff; + +.customers { + margin-bottom: 40px; +} + +.customers .item { + margin: 0 20px; +} + +.customers .item img { + -webkit-filter: grayscale(100%); + filter: grayscale(100%); + -webkit-transition: all 0.3s; + transition: all 0.3s; +} + +.customers .item img:hover { + -webkit-filter: grayscale(0%); + filter: grayscale(0%); } -.btn-template-transparent-black .badge { - color: transparent; - background-color: #ffffff; + +.testimonials .item { + margin: 0 5px; + height: 100%; } -.btn-template-transparent-black:hover, -.btn-template-transparent-black:focus, -.btn-template-transparent-black:active, -.btn-template-transparent-black.active { + +.testimonials .testimonial { + padding: 20px; background: #fff; - color: #000; - border-color: #fff; + height: 100%; } -.btn-template-primary { - color: #ffffff; - background-color: #6aae7a; - border-color: #6aae7a; + +.testimonials .text { + font-size: 0.85rem; +} + +.testimonials .text p { + color: #999; +} + +.testimonials .avatar { + min-width: 60px; + max-width: 60px; + min-height: 60px; + max-height: 60px; + border-radius: 50%; + overflow: hidden; + margin-left: 10px; } -.btn-template-primary:hover, -.btn-template-primary:focus, -.btn-template-primary:active, -.btn-template-primary.active, -.open > .dropdown-toggle.btn-template-primary { - color: #ffffff; - background-color: #519461; - border-color: #4d8e5c; + +.testimonials .bottom { + width: 100%; } -.btn-template-primary:active, -.btn-template-primary.active, -.open > .dropdown-toggle.btn-template-primary { - background-image: none; + +.testimonials .bottom .testimonial-info { + text-align: right; } -.btn-template-primary.disabled, -.btn-template-primary[disabled], -fieldset[disabled] .btn-template-primary, -.btn-template-primary.disabled:hover, -.btn-template-primary[disabled]:hover, -fieldset[disabled] .btn-template-primary:hover, -.btn-template-primary.disabled:focus, -.btn-template-primary[disabled]:focus, -fieldset[disabled] .btn-template-primary:focus, -.btn-template-primary.disabled:active, -.btn-template-primary[disabled]:active, -fieldset[disabled] .btn-template-primary:active, -.btn-template-primary.disabled.active, -.btn-template-primary[disabled].active, -fieldset[disabled] .btn-template-primary.active { - background-color: #6aae7a; - border-color: #6aae7a; + +.testimonials .bottom h5 { + text-transform: uppercase; + letter-spacing: 0.1em; + margin-bottom: 5px; } -.btn-template-primary .badge { + +.testimonials .bottom p { + font-size: 0.75rem; + color: #999; + margin-bottom: 0; +} + +.testimonials .icon { color: #6aae7a; - background-color: #ffffff; + font-size: 2rem; + margin-right: 20px; } -#intro { - background: url('../img/home.jpg') no-repeat center top; - -webkit-background-size: cover; - -moz-background-size: cover; - -o-background-size: cover; - background-size: cover; + +.testimonials .owl-carousel .owl-stage { + display: -webkit-box !important; + display: -ms-flexbox !important; + display: flex !important; + -webkit-box-align: stretch !important; + -ms-flex-align: stretch !important; + align-items: stretch !important; } -#intro .item { - font-family: "Roboto", Helvetica, Arial, sans-serif; - height: 100%; + +.testimonials .owl-dot.active span { + background: #6aae7a !important; } -#intro .item h1 { - text-transform: uppercase; - font-size: 50px; + +.home-carousel { color: #fff; - margin-bottom: 40px; - letter-spacing: 0.08em; } -@media (max-width: 991px) { - #intro .item h1 { - font-size: 40px; - } + +.home-carousel .owl-carousel { + padding-top: 60px; + padding-bottom: 20px; } -@media (max-width: 767px) { - #intro .item h1 { - font-size: 25px; - } + +.home-carousel h1, .home-carousel h2 { + text-transform: uppercase; + letter-spacing: 0.1em; +} + +.home-carousel li, .home-carousel p { + text-transform: uppercase; + letter-spacing: 0.1em; + font-weight: 700; + font-size: 1.1rem; + margin-bottom: 10px; +} + +.home-carousel p img { + max-width: 200px; +} + +.project .owl-dot.active span { + background: #6aae7a !important; +} + +.project .owl-nav { + position: absolute; + top: 0; + right: 0; + left: auto; + bottom: auto; + width: 100%; + padding: 20px; + text-align: right; +} + +.project .owl-nav .owl-prev, .project .owl-nav .owl-next { + width: 30px; + height: 30px; + line-height: 30px; + background: #fff; + color: #6aae7a; + text-align: center; + border-radius: 50%; + display: inline-block; + margin: 0 5px; + -webkit-transition: all 0.3s; + transition: all 0.3s; } -#intro .item h3 { + +.project .owl-nav .owl-prev:hover, .project .owl-nav .owl-next:hover { + background: #6aae7a; color: #fff; - margin-bottom: 40px; } + @media (max-width: 767px) { - #intro .item h3 { - font-size: 15px; - margin-bottom: 20px; + .home-carousel { + text-align: center !important; } -} -#intro .item .btn { - text-transform: none; -} -@media (max-width: 991px) { - #intro .item .btn { - font-size: 14px; + .home-carousel p, .home-carousel h1, .home-carousel ul { + text-align: center !important; } -} -@media (max-width: 991px) { - #intro .item .carousel-caption { - left: 10%; - right: 10%; + .home-carousel img { + margin: 10px auto; } } -#intro .container, -#intro .row { - height: 100%; - position: relative; + +.owl-thumbs { + display: -webkit-box; + display: -ms-flexbox; + display: flex; } -.jumbotron { - padding: 30px; - margin-bottom: 0; + +.owl-thumbs button { + background: none; + border: none; + margin: 5px; + outline: none; +} + +.home-blog-post { + margin: 15px 0; +} + +.home-blog-post .image { position: relative; - background: url('../img/photogrid.jpg') center center repeat; - background-size: cover; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + margin-bottom: 15px; } -.jumbotron .dark-mask { - position: absolute; - top: 0; - left: 0; + +.home-blog-post .overlay { width: 100%; height: 100%; - background: #6aae7a; - opacity: 0.9; - filter: alpha(opacity=90); + background: rgba(106, 174, 122, 0.6); + position: absolute; + top: 0; + opacity: 0; + -webkit-transition: all 0.5s; + transition: all 0.5s; } -.jumbotron h1, -.jumbotron h2, -.jumbotron h3, -.jumbotron p, -.jumbotron ul { - color: #fff; + +.home-blog-post .overlay a { + -webkit-transform: translateY(30px); + transform: translateY(30px); + opacity: 0; } -.jumbotron h1, -.jumbotron h2, -.jumbotron h3 { - color: #ffffff; - text-transform: uppercase; - letter-spacing: 0.08em; + +.home-blog-post .overlay i { + margin-right: 5px; } -.jumbotron p { + +.home-blog-post .text { + text-align: center; +} + +.home-blog-post .text .intro { + text-align: left; margin-bottom: 20px; - font-size: 21px; - font-weight: 400; + color: #888; + font-size: 0.9rem; } -.jumbotron p.text-uppercase { - font-weight: 700; + +.home-blog-post h4 { + margin: 10px 0; + text-transform: uppercase; + letter-spacing: 0.1em; } -.jumbotron > hr { - border-top-color: #d5d5d5; + +.home-blog-post .author-category { + font-size: 0.75rem; + color: #999; + text-transform: uppercase; + letter-spacing: 0.1em; } -.container .jumbotron { - border-radius: 0; + +.home-blog-post .author-category a { + font-weight: 500; } -.jumbotron .container { - max-width: 100%; - z-index: 2; + +.home-blog-post:hover .overlay { + opacity: 1; } -@media screen and (min-width: 768px) { - .jumbotron { - padding-top: 48px; - padding-bottom: 48px; - } - .container .jumbotron { - padding-left: 60px; - padding-right: 60px; - } - .jumbotron h1, - .jumbotron .h1 { - font-size: 46px; - } + +.home-blog-post:hover .overlay a { + -webkit-transform: none; + transform: none; + opacity: 1; } -#categoryMenu h3 { - padding: 20px; - background: #f7f7f7; - margin: 0; - border-bottom: solid 1px #eeeeee; - text-transform: uppercase; - letter-spacing: 0.08em; + +#blog-listing-big .post, #blog-listing-medium .post { + margin-bottom: 60px; } -.panel.sidebar-menu h3 { - padding: 5px 0; - margin: 0; + +#blog-listing-big .image, #blog-listing-medium .image { + margin-bottom: 15px; } -.panel.sidebar-menu { - background: #fff; - margin: 0 0 20px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; + +#blog-listing-big h2 a, #blog-listing-medium h2 a { + color: #555; + text-transform: uppercase; + letter-spacing: 0.1em; } -.panel.sidebar-menu .panel-heading { + +#blog-listing-big .author-category, #blog-listing-medium .author-category { + color: #999; text-transform: uppercase; + letter-spacing: 0.1em; + font-weight: 300; margin-bottom: 10px; - background: none; - padding: 0; - letter-spacing: 0.08em; - border-bottom: none; + font-size: .9rem; } -.panel.sidebar-menu .panel-heading h1, -.panel.sidebar-menu .panel-heading h2, -.panel.sidebar-menu .panel-heading h3, -.panel.sidebar-menu .panel-heading h4, -.panel.sidebar-menu .panel-heading h5 { - display: inline-block; - border-bottom: solid 5px #6aae7a; - line-height: 1.1; + +#blog-listing-big .author-category a, #blog-listing-medium .author-category a { + font-weight: 500; margin-bottom: 0; - padding-bottom: 10px; } -.panel.sidebar-menu .panel-heading .btn.btn-danger { - color: #fff; - margin-top: 5px; + +#blog-listing-big .date-comments, #blog-listing-medium .date-comments { + margin-bottom: 0; } -.panel.sidebar-menu .panel-body { - padding: 0; + +#blog-listing-big .date-comments a, #blog-listing-medium .date-comments a { + color: #999; + margin-left: 25px; } -.panel.sidebar-menu .panel-body span.colour { - display: inline-block; - width: 15px; - height: 15px; - border: solid 1px #555555; - vertical-align: top; - margin-top: 2px; - margin-left: 5px; + +#blog-listing-big .date-comments i, #blog-listing-medium .date-comments i { + margin-right: 5px; } -.panel.sidebar-menu .panel-body span.colour.white { - background: #fff; + +#blog-listing-big p.intro, #blog-listing-medium p.intro { + margin-top: 10px; + color: #777; } -.panel.sidebar-menu .panel-body span.colour.red { - background: red; + +.pager { + padding: 20px 0; + margin-top: 20px; + border-top: 1px solid #e6e6e6; } -.panel.sidebar-menu .panel-body span.colour.green { - background: green; + +.disabled a, .disabled a:hover { + border-color: #999 !important; + color: #999 !important; + background: none !important; + cursor: not-allowed; } -.panel.sidebar-menu .panel-body span.colour.blue { - background: blue; + +#blog-post #post-content { + margin-bottom: 20px; } -.panel.sidebar-menu .panel-body span.colour.yellow { - background: yellow; + +#blog-post .comment { + margin-bottom: 25px; } -.panel.sidebar-menu .panel-body label { - color: #999999; - font-size: 12px; + +#blog-post .comment .posted { + color: #999; + font-size: 0.8rem; + margin-bottom: 10px; } -.panel.sidebar-menu .panel-body label:hover { - color: #555555; + +#blog-post .comment.last { + margin-bottom: 0; } -.panel.sidebar-menu ul.nav.category-menu { - margin-bottom: 20px; - text-transform: uppercase; - font-weight: 700; - letter-spacing: 0.08em; + +#blog-post .comment p { + font-size: 0.9rem; } -.panel.sidebar-menu ul.nav.category-menu li a { - font-family: "Roboto", Helvetica, Arial, sans-serif; + +#blog-post #comments, #blog-post #comment-form { + padding: 20px 0; + margin-top: 20px; + border-top: solid 1px #eee; } -.panel.sidebar-menu ul.nav ul { - list-style: none; - padding-left: 0; + +#blog-post #comments h4, #blog-post #comment-form h4 { + margin-bottom: 1.5rem; } -.panel.sidebar-menu ul.nav ul li { - display: block; -} -.panel.sidebar-menu ul.nav ul li a { - position: relative; - font-family: "Times New Roman", Times, serif; - font-weight: normal; - text-transform: none !important; - display: block; - padding: 10px 15px; - padding-left: 30px; - font-size: 12px; - color: #999999; -} -.panel.sidebar-menu ul.nav ul li a:hover, -.panel.sidebar-menu ul.nav ul li a:focus { - text-decoration: none; - background-color: #eeeeee; -} -.panel.sidebar-menu ul.tag-cloud { - list-style: none; - padding-left: 0; -} -.panel.sidebar-menu ul.tag-cloud li { - display: inline-block; -} -.panel.sidebar-menu ul.tag-cloud li a { - display: inline-block; - padding: 5px; - border: solid 1px #eeeeee; - border-radius: 0; - color: #6aae7a; - margin: 5px 5px 5px 0; - text-transform: uppercase; - letter-spacing: 0.08em; - font-weight: 700; - font-size: 12px; - text-decoration: none; -} -.panel.sidebar-menu ul.tag-cloud li a:hover { - color: #6aae7a; - border-color: #6aae7a; -} -.panel.sidebar-menu ul.tag-cloud li.active a { - color: #FFFFFF; - background-color: #6aae7a; -} -.panel.sidebar-menu ul.tag-cloud li.active a:hover { - color: #FFFFFF; -} -.panel.sidebar-menu ul.popular, -.panel.sidebar-menu ul.recent { - list-style: none; - padding-left: 0; - padding: 20px 0; -} -.panel.sidebar-menu ul.popular li, -.panel.sidebar-menu ul.recent li { - margin-bottom: 10px; - padding: 5px 0; - border-bottom: dotted 1px #eeeeee; -} -.panel.sidebar-menu ul.popular li:before, -.panel.sidebar-menu ul.recent li:before, -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - content: " "; - display: table; -} -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - clear: both; -} -.panel.sidebar-menu ul.popular li:before, -.panel.sidebar-menu ul.recent li:before, -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - content: " "; - display: table; -} -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - clear: both; -} -.panel.sidebar-menu ul.popular li img, -.panel.sidebar-menu ul.recent li img { - width: 50px; - margin-right: 10px; -} -.panel.sidebar-menu ul.popular li h5, -.panel.sidebar-menu ul.recent li h5 { - margin: 0 0 10px; -} -.panel.sidebar-menu ul.popular li h5 a, -.panel.sidebar-menu ul.recent li h5 a { - font-weight: normal; -} -.panel.sidebar-menu ul.popular li p.date, -.panel.sidebar-menu ul.recent li p.date { - float: right; - font-size: 12px; - color: #999999; -} -.panel.sidebar-menu ul.popular li:last-child, -.panel.sidebar-menu ul.recent li:last-child { - border-bottom: none; -} -.panel.sidebar-menu .text-widget { - font-size: 12px; -} -.panel.sidebar-menu.with-icons ul.nav li a:after { - font-family: 'FontAwesome'; - content: "\f105"; - position: relative; - top: 0; - float: right; -} -/* ribbons for product sales etc. */ -.ribbon { - position: absolute; - top: 50px; - padding-left: 51px; - font-weight: 700; - letter-spacing: 0.08em; -} -.ribbon .ribbon-background { - position: absolute; - top: 0; - right: 0; -} -.ribbon .theribbon { - position: relative; - width: 80px; - padding: 6px 20px 6px 20px; - margin: 30px 10px 10px -71px; - color: #fff; - background-color: #6aae7a; - font-family: "Roboto", Helvetica, Arial, sans-serif; -} -.ribbon .theribbon:before, -.ribbon .theribbon:after { - content: ' '; - position: absolute; - width: 0; - height: 0; -} -.ribbon .theribbon:after { - left: 0px; - top: 100%; - border-width: 5px 10px; - border-style: solid; - border-color: #000000 #000000 transparent transparent; -} -.ribbon.sale { - top: 0; -} -.ribbon.new { - top: 50px; -} -.ribbon.new .theribbon { - background-color: #5bc0de; - text-shadow: 0px 1px 2px #bbb; -} -.ribbon.new .theribbon:after { - border-color: #2390b0 #2390b0 transparent transparent; -} -.ribbon.gift { - top: 100px; -} -.ribbon.gift .theribbon { - background-color: #5cb85c; - text-shadow: 0px 1px 2px #bbb; -} -.ribbon.gift .theribbon:after { - border-color: #357935 #357935 transparent transparent; -} -.owl-carousel .owl-controls .owl-page.active span, -.owl-theme .owl-controls .owl-page.active span, -.owl-carousel .owl-controls.clickable .owl-page:hover span, -.owl-theme .owl-controls.clickable .owl-page:hover span { - background: #6aae7a; -} -.owl-carousel .owl-controls .owl-buttons, -.owl-theme .owl-controls .owl-buttons { - position: absolute; - top: 5px; - right: 0; -} -.owl-carousel .owl-controls .owl-buttons div, -.owl-theme .owl-controls .owl-buttons div { - width: 26px; - height: 26px; - line-height: 25px; - margin: 0 5px 0 0; - font-size: 18px; - color: #6aae7a; - padding: 0; - background: #fff; - border-radius: 13px; - vertical-align: middle; - text-align: center; - opacity: 1; - filter: alpha(opacity=100); -} -.home-carousel { - position: relative; - background: url('../img/photogrid.jpg') center center repeat; - background-size: cover; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -.home-carousel .dark-mask { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: #6aae7a; - opacity: 0.9; - filter: alpha(opacity=90); -} -.home-carousel .owl-carousel { - padding-top: 60px; - padding-bottom: 20px; -} -.home-carousel .owl-theme .owl-controls .owl-page span { - background: #666; -} -.home-carousel .owl-theme .owl-controls .owl-page.active span { - background: #fff; -} -.home-carousel .owl-theme .owl-controls .owl-page:hover span { - background: #fff; -} -@media (max-width: 767px) { - .home-carousel { - text-align: center !important; - } -} -@media (min-width: 992px) { - .home-carousel .right { - text-align: right; - } -} -.home-carousel h1, -.home-carousel h2, -.home-carousel h3, -.home-carousel p, -.home-carousel ul { - color: #fff; -} -.home-carousel h1 { - font-weight: 700; - text-transform: uppercase; - font-size: 46px; - letter-spacing: 0.08em; -} -@media (max-width: 991px) { - .home-carousel h1 { - font-size: 36px; - } -} -.home-carousel h2 { - font-weight: 700; - text-transform: uppercase; - font-size: 40px; - letter-spacing: 0.08em; -} -.home-carousel ul, -.home-carousel p { - font-size: 18px; - font-weight: 700; - padding: 0; - text-transform: uppercase; - letter-spacing: 0.10em; -} -@media (max-width: 991px) { - .home-carousel ul, - .home-carousel p { - font-size: 14px; - } -} -.home-carousel ul li { - margin-bottom: 10px; -} -.customers { - padding: 0; - margin-bottom: 40px; -} -.customers .item { - list-style-type: none; - text-align: center; - margin: 0 20px; -} -.customers .item img { - display: inline-block; - filter: url("data:image/svg+xml;utf8,#grayscale"); - /* Firefox 10+, Firefox on Android */ - filter: gray; - /* IE6-9 */ - -webkit-filter: grayscale(100%); - /* Chrome 19+, Safari 6+, Safari 6+ iOS */ - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -.customers .item img:hover { - max-width: auto; - filter: none; - -webkit-filter: none; -} -.testimonials { - padding: 0; - margin-bottom: 40px; -} -.testimonials .item { - list-style-type: none; - margin: 0 5px; - background: #fff; - padding-bottom: 60px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; -} -.testimonials .item .testimonial { - position: relative; - padding: 20px; -} -.testimonials .item .testimonial:before, -.testimonials .item .testimonial:after { - content: " "; - display: table; -} -.testimonials .item .testimonial:after { - clear: both; -} -.testimonials .item .testimonial:before, -.testimonials .item .testimonial:after { - content: " "; - display: table; -} -.testimonials .item .testimonial:after { - clear: both; -} -.testimonials .item .testimonial .text { - color: #999999; - margin-bottom: 40px; -} -.testimonials .item .testimonial .bottom { - position: absolute; - left: 0; - bottom: 0; - width: 100%; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - padding: 20px; - height: 50px; -} -.testimonials .item .testimonial .bottom .icon { - color: #6aae7a; - font-size: 30px; - float: left; - width: 20%; -} -.testimonials .item .testimonial .name-picture { - float: right; - width: 80%; - text-align: right; -} -.testimonials .item .testimonial .name-picture h5 { - font-size: 14px; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.testimonials .item .testimonial .name-picture p { - color: #999999; - margin: 0; - font-size: 12px; -} -.testimonials .item .testimonial .name-picture img { - float: right; - width: 60px; - border-radius: 30px; - margin-left: 10px; -} -.team-member { - text-align: center; - margin-bottom: 40px; -} -.team-member h3 { - font-size: 18px; - text-transform: uppercase; - margin-bottom: 5px; - letter-spacing: 0.08em; -} -.team-member h3 a { - color: #555555; -} -.team-member p.role { - color: #999999; - font-size: 12px; - text-transform: uppercase; - letter-spacing: 0.06em; -} -.team-member .social { - margin-bottom: 20px; -} -.team-member .social a { - margin: 0 10px 0 0; - color: #fff; - display: inline-block; - width: 26px; - height: 26px; - border-radius: 13px; - line-height: 26px; - font-size: 15px; - text-align: center; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - vertical-align: bottom; -} -.team-member .social a i { - vertical-align: bottom; - line-height: 26px; -} -.team-member .social a.facebook { - background-color: #4460ae; -} -.team-member .social a.gplus { - background-color: #c21f25; -} -.team-member .social a.twitter { - background-color: #3cf; -} -.team-member .social a.instagram { - background-color: #cd4378; -} -.team-member .social a.email { - background-color: #4a7f45; -} -.team-member .text p { - color: #999999; - font-size: 12px; -} -.team-member .social, -.team-member-detail .social { + +#blog-post #comment-form { margin-bottom: 20px; } -.team-member .social a, -.team-member-detail .social a { - margin: 0 10px 0 0; - color: #fff; - display: inline-block; - width: 26px; - height: 26px; - border-radius: 13px; - line-height: 26px; - font-size: 15px; - text-align: center; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - vertical-align: bottom; -} -.team-member .social a i, -.team-member-detail .social a i { - vertical-align: bottom; - line-height: 26px; -} -.team-member .social a.facebook, -.team-member-detail .social a.facebook { - background-color: #4460ae; -} -.team-member .social a.gplus, -.team-member-detail .social a.gplus { - background-color: #c21f25; -} -.team-member .social a.twitter, -.team-member-detail .social a.twitter { - background-color: #3cf; -} -.team-member .social a.instagram, -.team-member-detail .social a.instagram { - background-color: #cd4378; -} -.team-member .social a.email, -.team-member-detail .social a.email { - background-color: #4a7f45; + +#blog-post .reply i { + margin-right: 5px; } + .box-simple { - text-align: center; margin-bottom: 40px; + text-align: center; +} + +.box-simple:hover .icon-outlined { + -webkit-transform: scale(1.1); + transform: scale(1.1); } -.box-simple .icon { + +.box-simple .icon-outlined { color: #6aae7a; - border-color: #6aae7a; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + border: 1px solid #6aae7a; + -webkit-transition: all 0.3s; + transition: all 0.3s; } + .box-simple h3 { - font-weight: normal; - font-size: 18px; text-transform: uppercase; - line-height: 1.5; - color: #555555; - font-weight: 800; - letter-spacing: 0.08em; -} -.box-simple h3 a { - color: #555555; + letter-spacing: 0.1em; } + .box-simple p { - color: #999999; -} -.box-simple:hover .icon { - -webkit-transform: scale(1.1, 1.1); - -ms-transform: scale(1.1, 1.1); - -o-transform: scale(1.1, 1.1); - transform: scale(1.1, 1.1); -} -.box-simple:hover .icon i { - -webkit-transform: scale(1, 1); - -ms-transform: scale(1, 1); - -o-transform: scale(1, 1); - transform: scale(1, 1); + color: #999; + margin: 20px 0; + font-size: 0.9rem; } + .box-simple.box-white { - padding: 20px; - border: dotted 1px #999999; + border: dotted 1px #999; + padding: 15px 20px; + margin-bottom: 0; } + .box-simple.box-white .icon { - color: #555555; - border-color: transparent; - font-size: 70px; + font-size: 2rem; + margin-bottom: 1rem; +} + +.box-simple.box-white p { + color: #999; + margin-bottom: 5px; } + .box-simple.box-dark { - padding: 20px; - border: dotted 1px #999999; - background: #555555; + border: dotted 1px #999; + padding: 15px 20px; + margin-bottom: 0; color: #fff; + background: #555; } + .box-simple.box-dark .icon { - color: #f7f7f7; - border-color: transparent; - font-size: 70px; -} -.box-simple.box-dark h3 { - color: #fff; -} -.box-simple.box-dark h3 a { - color: #fff; + font-size: 2rem; + margin-bottom: 1rem; } + .box-simple.box-dark p { + margin-bottom: 5px; color: #fff; } -.box-image { - position: relative; - overflow: hidden; - text-align: center; - margin: 15px 0; + +.same-height div[class*="col-"] { + margin-bottom: 30px; } -.box-image .bg { - position: absolute; - top: auto; - bottom: 0; - width: 100%; + +.same-height .box-white, .same-height.box-dark { height: 100%; - opacity: 0; - filter: alpha(opacity=0); - background: #6aae7a; } -.box-image .name { - position: absolute; - width: 100%; - height: 50%; - bottom: 0; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image .name h3 { - color: #fff; - text-transform: uppercase; - font-size: 18px; - letter-spacing: 0.08em; -} -.box-image .name h3 a { - color: #fff; - text-decoration: none; -} -.box-image .text { - position: absolute; - width: 100%; - height: 50%; - top: 0; - -webkit-transform: translate(0, -150%); - -ms-transform: translate(0, -150%); - -o-transform: translate(0, -150%); - transform: translate(0, -150%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image:hover .bg { - opacity: 0.7; - filter: alpha(opacity=70); -} -.box-image:hover .name { - position: absolute; - -webkit-transform: translate(0, -75%); - -ms-transform: translate(0, -75%); - -o-transform: translate(0, -75%); - transform: translate(0, -75%); -} -.box-image:hover .text { - position: absolute; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); -} -.box-image-text { - position: relative; - overflow: hidden; - text-align: center; - margin: 15px 0; -} -.box-image-text .top { + +.box-image { position: relative; - margin-bottom: 10px; -} -.box-image-text .top .bg { - position: absolute; - top: auto; - bottom: 0; - width: 100%; - height: 100%; - opacity: 0; - filter: alpha(opacity=0); - background: #6aae7a; -} -.box-image-text .top .name { - position: absolute; - width: 100%; - height: 50%; - bottom: 0; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image-text .top .name h3 { - color: #fff; - text-transform: uppercase; - font-size: 18px; - letter-spacing: 0.08em; -} -.box-image-text .top .name h3 a { - color: #fff; - text-decoration: none; -} -.box-image-text .top .text { - position: absolute; - width: 100%; - height: 50%; - top: 0; - -webkit-transform: translate(0, -150%); - -ms-transform: translate(0, -150%); - -o-transform: translate(0, -150%); - transform: translate(0, -150%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image-text .content h3, -.box-image-text .content h4 { - text-transform: uppercase; - line-height: 1.5; - color: #555555; - font-weight: 800; - letter-spacing: 0.08em; -} -.box-image-text .content p { - color: #999999; -} -.box-image-text:hover .bg { - opacity: 0.7; - filter: alpha(opacity=70); -} -.box-image-text:hover .name { - position: absolute; - -webkit-transform: translate(0, -75%); - -ms-transform: translate(0, -75%); - -o-transform: translate(0, -75%); - transform: translate(0, -75%); -} -.box-image-text:hover .text { - position: absolute; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); -} -/* universal box */ -.box { - background: #fff; - margin: 0 0 30px; - border: solid 1px #ccc; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - padding: 20px 0; - border-left: none; - border-right: none; -} -.box .box-header { - background: #f7f7f7; - margin: -20px 0 20px; - padding: 20px; - border-bottom: solid 1px #eeeeee; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.box .box-header:before, -.box .box-header:after { - content: " "; - display: table; -} -.box .box-header:after { - clear: both; -} -.box .box-header:before, -.box .box-header:after { - content: " "; - display: table; -} -.box .box-header:after { - clear: both; -} -.box .box-footer { - background: #f7f7f7; - margin: 30px 0 -20px; - padding: 20px; - border-top: solid 1px #eeeeee; -} -.box .box-footer:before, -.box .box-footer:after { - content: " "; - display: table; -} -.box .box-footer:after { - clear: both; + margin: 20px 0; } -.box .box-footer:before, -.box .box-footer:after { - content: " "; - display: table; + +.box-image:hover .overlay { + opacity: 1; } -.box .box-footer:after { - clear: both; + +.box-image:hover h3, .box-image:hover p, .box-image:hover .buttons { + opacity: 1; + -webkit-transform: none; + transform: none; } -@media (max-width: 991px) { - .box .box-footer .btn { - margin-bottom: 20px; - } + +.box-image:hover p { + -webkit-transition-delay: 0.1s; + transition-delay: 0.1s; } -.box.no-border { - border: none; + +.box-image:hover .buttons { + -webkit-transition-delay: 0.2s; + transition-delay: 0.2s; } -#heading-breadcrumbs { - background: url('../img/texture-green.png') center center repeat; - padding: 20px 0; - margin-bottom: 40px; + +.box-image .name { + margin-bottom: 20px; } -#heading-breadcrumbs.no-mb { - margin-bottom: 0; + +.box-image a { + text-decoration: none !important; } -#heading-breadcrumbs h1 { - color: #333333; + +.box-image h3 { + font-size: 1.125rem; text-transform: uppercase; - font-size: 30px; - font-weight: 700; - letter-spacing: 0.08em; -} -@media (max-width: 991px) { - #heading-breadcrumbs h1 { - text-align: center; - } -} -#heading-breadcrumbs ul.breadcrumb { - margin-top: 5px; - margin-bottom: 0; -} -.bar { - position: relative; - background: #6aae7a; - padding: 60px 0; -} -.bar.background-pentagon { - background: url('../img/texture-green.png') center center repeat; - border-top: solid 1px #999999; - border-bottom: solid 1px #999999; -} -.bar.background-gray { - background: #eeeeee; -} -.bar.background-gray-dark { - background: #555555; -} -.bar.background-white { - background: #fff; -} -.bar.background-image-fixed-1 { - background: url('../img/fixed-background-1.jpg') center top no-repeat; - background-attachment: fixed; - background-size: cover; -} -.bar.background-image-fixed-2 { - background: url('../img/fixed-background-2.jpg') center top no-repeat; - background-attachment: fixed; - background-size: cover; -} -.bar.color-white h1, -.bar.color-white h2, -.bar.color-white h3, -.bar.color-white h4, -.bar.color-white h5, -.bar.color-white h6, -.bar.color-white p { - color: #fff; -} -.bar.padding-big { - padding: 50px 0; -} -.bar.padding-horizontal { - padding-left: 30px; - padding-right: 30px; -} -.bar.margin-vertical { - margin-top: 20px; - margin-bottom: 20px; + letter-spacing: 0.1em; + -webkit-transition: all 0.3s; + transition: all 0.3s; + opacity: 0; + -webkit-transform: translateY(-50px); + transform: translateY(-50px); } -.bar .dark-mask { + +.box-image .overlay { + width: 100%; + height: 100%; position: absolute; top: 0; left: 0; - width: 100%; - height: 100%; - background: #000; - opacity: 0.3; - filter: alpha(opacity=30); -} -.portfolio.no-space { - padding: 0 15px; -} -.portfolio.no-space .box-image { - margin: 0 -15px; -} -.portfolio-project .project-more h4 { - color: #555555; - text-transform: uppercase; - margin-bottom: 0; - text-align: left; - font-size: 14px; - letter-spacing: 0.08em; -} -.portfolio-project .project-more p { - color: #999999; - padding: 10px 0; - margin-bottom: 20px; - text-align: left; -} -.portfolio-showcase { - margin: 15px 0 60px; -} -.portfolio-showcase h3 a { - text-transform: uppercase; - line-height: 1.5; - letter-spacing: 0.08em; + background: rgba(106, 174, 122, 0.6); + padding: 20px; + -webkit-transition: all 0.3s; + transition: all 0.3s; + opacity: 0; } -.portfolio-showcase p.lead { - color: #555555; - margin-bottom: 20px; + +.box-image .buttons { + opacity: 0; + -webkit-transition: all 0.3s; + transition: all 0.3s; + -webkit-transform: translateY(20px); + transform: translateY(20px); +} + +.box-image .buttons a { + margin: 0 3px; +} + +.box-image p { + -webkit-transition: all 0.3s; + transition: all 0.3s; + opacity: 0; + -webkit-transform: translateY(20px); + transform: translateY(20px); } -.portfolio-showcase p { - color: #999999; + +.box-image-text .content { + text-align: center; } -.portfolio-showcase p.buttons { - margin-top: 40px; + +.box-image-text p { + color: #777; + font-size: 0.9rem; } + .see-more { - text-align: center; - margin-top: 20px; - padding-top: 20px; + margin-top: 40px; } + .see-more p { - font-size: 28px; + font-size: 1.8rem; font-weight: 100; - margin-bottom: 20px; -} -.showcase .item { - text-align: center; } -.showcase .item .icon { - display: inline-block; - width: 50px; - height: 50px; - color: #555555; - line-height: 50px; - border-radius: 25px; - border: solid 1px #555555; -} -.showcase .item h4 { - color: #555555; - text-transform: uppercase; - letter-spacing: 0.08em; - line-height: 1.5; - font-size: 16px; -} -.showcase .item h4 span { - font-weight: bold; - font-size: 51px; + +.box { + margin: 80px 0; + border-top: 1px solid #ddd; + border-bottom: 1px solid #ddd; + padding: 20px; } -.packages .package { - background: #fff; + +.box a.btn { margin-top: 25px; - margin-bottom: 20px; - padding-bottom: 15px; - text-align: center; - border: solid 1px #6aae7a; - overflow: hidden; -} -.packages .package .package-header { - height: 57px; - color: #fff; - line-height: 57px; - background: #6aae7a; -} -.packages .package .package-header h5 { - color: #fff; - text-transform: uppercase; - font-weight: bold; - line-height: 57px; - margin: 0; - letter-spacing: 0.08em; -} -.packages .package .package-header.light-gray { - background: #eeeeee; -} -.packages .package .package-header.light-gray h5 { - color: #555555; -} -.packages .package .price { - line-height: 120px; - height: 100px; - color: #fff; - font-weight: 400; -} -.packages .package .price h4 { - display: inline; - font-size: 50px; - line-height: normal; - margin-bottom: 0; -} -.packages .package .price .period { - line-height: normal; - color: #999999; -} -.packages .package ul { - padding: 0; -} -.packages .package ul li { - list-style-type: none; - padding-top: 10px; - padding-bottom: 10px; - width: 80%; - margin: auto; - border-bottom: 1px dotted #ccc; -} -.packages .package ul li:last-child { - border-bottom: 0; -} -.packages .package ul li i { - font-size: 13px; - margin-right: 5px; -} -.packages .best-value .package { - margin-top: 0; - padding-bottom: 40px; -} -.packages .best-value .package .package-header { - height: 72px; - padding-top: 17px; - height: 82px !important; -} -.packages .best-value .package .package-header h5 { - font-weight: bold; - line-height: 29px; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.packages .best-value .package .package-header .meta-text { - font-size: 13px; - line-height: 15px; -} -#map { - height: 300px; -} -#map.with-border { - border-top: solid 1px #6aae7a; - border-bottom: solid 1px #6aae7a; -} -#blog-listing-big .post, -#blog-homepage .post { - margin-bottom: 60px; } -#blog-listing-big .post h2, -#blog-homepage .post h2, -#blog-listing-big .post h4, -#blog-homepage .post h4 { - text-transform: uppercase; - letter-spacing: 0.08em; -} -#blog-listing-big .post h2 a, -#blog-homepage .post h2 a, -#blog-listing-big .post h4 a, -#blog-homepage .post h4 a { - color: #555555; -} -#blog-listing-big .post h2 a:hover, -#blog-homepage .post h2 a:hover, -#blog-listing-big .post h4 a:hover, -#blog-homepage .post h4 a:hover { - color: #6aae7a; -} -#blog-listing-big .post .author-category, -#blog-homepage .post .author-category { - color: #999999; + +.box .box-header { + background: #f7f7f7; + margin: 20px 0 20px; + padding: 20px; + border-top: 1px solid #eee; text-transform: uppercase; - font-weight: 300; - letter-spacing: 0.08em; -} -#blog-listing-big .post .author-category a, -#blog-homepage .post .author-category a { - font-weight: 500; -} -#blog-listing-big .post .date-comments a, -#blog-homepage .post .date-comments a { - color: #999999; - margin-right: 20px; + letter-spacing: 0.1em; } -#blog-listing-big .post .date-comments a:hover, -#blog-homepage .post .date-comments a:hover { - color: #6aae7a; + +.box .box-footer { + background: #f7f7f7; + margin-top: 30px; + padding: 20px; + border-top: 1px solid #eee; } -@media (min-width: 768px) { - #blog-listing-big .post .date-comments, - #blog-homepage .post .date-comments { - text-align: right; - } + +.box.shipping-method, .box.payment-method { + margin: 0; + margin-bottom: 20px; } -#blog-listing-big .post .intro, -#blog-homepage .post .intro { - text-align: left; + +.box.shipping-method h4, .box.payment-method h4 { + text-transform: uppercase; + letter-spacing: 0.1em; + margin-bottom: 5px; } -#blog-listing-big .post .image, -#blog-homepage .post .image { - margin-bottom: 10px; - overflow: hidden; + +.box.shipping-method p, .box.payment-method p { + font-size: 0.9rem; + color: #555; } -#blog-listing-big .post .image img, -#blog-homepage .post .image img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.box-image-text { + margin: 15px 0; } -@media (max-width: 767px) { - #blog-listing-big .post .image img.img-responsive, - #blog-homepage .post .image img.img-responsive { - min-width: 100%; - } + +.box-image-text .image { + position: relative; + margin-bottom: 15px; } -#blog-listing-big .post .video, -#blog-homepage .post .video { - margin-bottom: 10px; + +.box-image-text .overlay { + width: 100%; + height: 100%; + background: rgba(106, 174, 122, 0.6); + position: absolute; + top: 0; + opacity: 0; + -webkit-transition: all 0.5s; + transition: all 0.5s; } -#blog-listing-big .post .read-more, -#blog-homepage .post .read-more { - text-align: right; + +.box-image-text .overlay a { + -webkit-transform: translateY(30px); + transform: translateY(30px); + opacity: 0; } -#blog-listing-medium .post { - margin-bottom: 60px; + +.box-image-text .overlay i { + margin-right: 5px; } -#blog-listing-medium .post h2 { - text-transform: uppercase; - margin: 0 0 10px; - font-size: 24px; - letter-spacing: 0.08em; + +.box-image-text .text { + text-align: center; } -#blog-listing-medium .post h2 a { - color: #555555; + +.box-image-text .text .intro { + text-align: left; + margin-bottom: 20px; + color: #888; + font-size: 0.9rem; } -#blog-listing-medium .post h2 a:hover { - color: #6aae7a; + +.box-image-text h4 { + margin: 10px 0; + text-transform: uppercase; + letter-spacing: 0.1em; } -#blog-listing-medium .post .author-category { - float: left; - color: #999999; + +.box-image-text .author-category { + font-size: 0.75rem; + color: #999; text-transform: uppercase; - font-weight: 300; - font-size: 12px; - letter-spacing: 0.08em; + letter-spacing: 0.1em; } -#blog-listing-medium .post .author-category a { + +.box-image-text .author-category a { font-weight: 500; } -#blog-listing-medium .post .date-comments { - float: right; - font-size: 12px; -} -#blog-listing-medium .post .date-comments a { - color: #999999; - margin-right: 20px; -} -#blog-listing-medium .post .date-comments a:hover { - color: #6aae7a; -} -@media (min-width: 768px) { - #blog-listing-medium .post .date-comments { - text-align: right; - } -} -#blog-listing-medium .post .intro { - text-align: left; + +.box-image-text:hover .overlay { + opacity: 1; } -#blog-listing-medium .post .clearfix:before, -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:before, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:before, -#blog-listing-medium .post .navbar-header:after { - content: " "; - display: table; -} -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:after { - clear: both; -} -#blog-listing-medium .post .clearfix:before, -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:before, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:before, -#blog-listing-medium .post .navbar-header:after { - content: " "; - display: table; + +.box-image-text:hover .overlay a { + -webkit-transform: none; + transform: none; + opacity: 1; } -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:after { - clear: both; + +.box-footer a { + margin: 0 !important; } -#blog-listing-medium .post .image { - margin-bottom: 10px; - overflow: hidden; + +.box-footer .right-col i { + margin-left: 5px; } -#blog-listing-medium .post .image img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.box-footer .left-col i { + margin-right: 5px; } + @media (max-width: 767px) { - #blog-listing-medium .post .image img.img-responsive { - min-width: 100%; + .box-footer { + -webkit-box-pack: center !important; + -ms-flex-pack: center !important; + justify-content: center !important; + } + .box-footer a { + margin-bottom: 10px !important; } } -#blog-listing-medium .post .video { - margin-bottom: 10px; + +.jumbotron h1, .jumbotron h2 { + letter-spacing: 0.1em; } -#blog-listing-medium .post .read-more { - text-align: right; + +.jumbotron p { + letter-spacing: 0.1em; + font-size: 1.3rem; +} + +.package { + text-align: center; + border: 1px solid #6aae7a; + margin-top: 25px; + margin-bottom: 20px; + padding-bottom: 15px; + overflow: hidden; } -.box-image-text.blog .author-category { - color: #999999; + +.package .package-header { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + height: 55px; +} + +.package .package-header h5 { + margin: 0; text-transform: uppercase; - letter-spacing: 0.08em; - font-weight: 300; - font-size: 12px; + letter-spacing: 0.1em; + display: inline-block; + color: #555; } -.box-image-text.blog .author-category a { - font-weight: 500; + +.package .package-header .meta-text { + font-size: 0.8rem; } -.box-image-text.blog .intro { - text-align: left; + +.package h4 { + margin-top: 1rem; + margin-bottom: 0; + color: #333; +} + +.package .price-container { margin-bottom: 20px; } -#blog-homepage .post { - margin-bottom: 30px; + +.package .price-container span.period { + color: #777; + font-size: 0.9rem; + margin-left: 10px; } -#blog-homepage .post h2, -#blog-homepage .post h4, -#blog-homepage .post .author-category, -#blog-homepage .post .read-more { - text-align: center; + +.package ul { + padding: 0 30px; } -#blog-homepage .post .read-more { - margin-top: 20px; + +.package ul li { + padding: 10px; + border-bottom: 1px solid #eee; + color: #555; + font-size: 0.9rem; } -#blog-post #post-content { - margin-bottom: 20px; + +.package ul i { + margin-right: 10px; } -#blog-post .comment { - margin-bottom: 25px; + +.best-value .package { + margin-top: 0; + padding-bottom: 40px; + border: 1px solid #6aae7a; } -#blog-post .comment:before, -#blog-post .comment:after { - content: " "; - display: table; + +.best-value .package .package-header { + height: 85px; } -#blog-post .comment:after { - clear: both; + +.best-value .package .package-header h5 { + color: #fff; } -#blog-post .comment:before, -#blog-post .comment:after { - content: " "; - display: table; + +.team-member { + margin-bottom: 40px; } -#blog-post .comment:after { - clear: both; + +.team-member .image { + margin-bottom: 1rem; } -#blog-post .comment .posted { - color: #999999; - font-size: 12px; + +.team-member a { + color: #333; } -#blog-post .comment .reply { - font-family: "Roboto", Helvetica, Arial, sans-serif; + +.team-member a:hover { + color: #333; } -#blog-post .comment.last { + +.team-member h3 { + font-size: 1.125rem; + text-transform: uppercase; + letter-spacing: 0.1em; + margin-bottom: 5px; +} + +.team-member p.role { + font-size: 0.8rem; + text-transform: uppercase; + color: #999; margin-bottom: 0; } -#blog-post #comments, -#blog-post #comment-form { - padding: 20px 0; - margin-top: 20px; - border-top: solid 1px #eeeeee; + +.team-member p { + color: #999; + font-size: 0.8rem; } -#blog-post #comments:before, -#blog-post #comment-form:before, -#blog-post #comments:after, -#blog-post #comment-form:after { - content: " "; - display: table; + +.team-member-detail p:not(.lead) { + color: #555; + font-size: 0.9rem; } -#blog-post #comments:after, -#blog-post #comment-form:after { - clear: both; + +.portfolio p { + color: #fff; } -#blog-post #comments:before, -#blog-post #comment-form:before, -#blog-post #comments:after, -#blog-post #comment-form:after { - content: " "; - display: table; + +.portfolio-project p { + font-size: 0.9rem; + color: #888; } -#blog-post #comments:after, -#blog-post #comment-form:after { - clear: both; + +.portfolio-project .project-more p { + padding: 5px 0; + font-size: 0.85rem; } -#blog-post #comments h4, -#blog-post #comment-form h4 { - margin-bottom: 20px; + +.portfolio-project .project-more h4 { + margin-bottom: 5px; + text-transform: uppercase; + letter-spacing: 0.1em; + font-size: 0.88rem; + color: #555; } -#blog-post #comment-form { - margin-bottom: 20px; + +.portfolio-showcase { + margin-bottom: 60px; +} + +.portfolio-showcase h3 { + text-transform: uppercase; + -webkit-transition-property: 0.1rem; + transition-property: 0.1rem; +} + +.portfolio-showcase .buttons { + margin-top: 40px; +} + +.portfolio-showcase p:not(.lead) { + color: #999; + font-size: 0.9rem; } + +.portfolio-showcase p.lead { + color: #666; +} + .product { - background: #fff; - border-bottom: solid 1px #e6e6e6; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - margin-bottom: 60px; - overflow: hidden; text-align: center; + position: relative; + margin-bottom: 40px; } + .product .image { overflow: hidden; + max-height: 190px; } -.product .image img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -@media (max-width: 767px) { - .product .image img.img-responsive { - min-width: 100%; - } + +.product .image a { + margin: 0; } + .product .text { padding: 10px; + border-bottom: 1px solid #ddd; } + .product .text h3 { - font-size: 14px; - font-weight: 700; - height: 39.6px; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.product .text h3 a { - color: #555555; -} -.product .text h3 a:hover { - text-decoration: none; + min-height: 63px; } -.product .text p.price { - font-size: 18px; + +.product .price { + font-size: 1.1rem; } -.product .text p.price del { - color: #999999; + +.product .price del { + color: #999; + display: inline-block; + margin-right: 5px; } -.product .buttons { - clear: both; - position: absolute; - display: none; - bottom: 0; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - width: 100%; - border: solid 1px transparent; - padding: 20px; - background: rgba(255, 255, 255, 0.9); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - text-align: center; + +.product img { + -webkit-transition: all 0.3s; + transition: all 0.3s; } -.product .buttons .btn { - margin-bottom: 20px; + +.product:hover img { + -webkit-transform: scale(1.1); + transform: scale(1.1); } -.product:hover { - border-bottom: solid 1px #808080; - top: 0; + +.product:hover .text { + border-color: #555; } -.product:hover .buttons { - clear: both; - position: absolute; - top: 0; - background: rgba(255, 255, 255, 0.5); + +.product a { + text-transform: uppercase; + letter-spacing: 0.1em; + color: #333; + text-decoration: none !important; + margin-top: 15px; } -.product:hover .image img { - -webkit-transform: scale(1.1, 1.1); - -ms-transform: scale(1.1, 1.1); - -o-transform: scale(1.1, 1.1); - transform: scale(1.1, 1.1); + +.products-big .image { + min-height: 250px; + max-height: 250px; } + .goToDescription { - font-size: 12px; text-align: center; + font-size: 0.8rem; margin-bottom: 40px; } + .goToDescription a { - color: #999999; + color: #999; text-decoration: underline; } -#productMain { - margin-bottom: 30px; + +table tr td { + vertical-align: middle !important; +} + +#customer-orders a.btn { + margin-top: 0; +} + +#customer-orders table { + font-size: 0.9rem; +} + +#customer-orders th { + border-top: 0; +} + +#customer-order img { + width: 50px; +} + +#customer-order tfoot th { + font-size: 1.2rem; + font-weight: 300; +} + +#customer-order p { + font-size: 1.2rem; + font-weight: 300; +} + +#productMain #thumbs { + margin-top: 30px; +} + +#productMain input { + display: none; } + #productMain .sizes { text-align: center; } -#productMain .sizes h3 { - font-weight: 700; - letter-spacing: 0.08em; - text-transform: uppercase; - margin-bottom: 40px; -} + #productMain .sizes a { - display: inline-block; - width: 40px; - height: 40px; - border-radius: 40px; - background: #ccc; - line-height: 40px; - color: #555555; - text-align: center; - text-decoration: none; - font-family: "Roboto", Helvetica, Arial, sans-serif; + text-decoration: none !important; } -#productMain .sizes a.active, + #productMain .sizes a:hover { background: #6aae7a; color: #fff; } -#productMain .sizes input { - display: none; -} + #productMain .price { - font-size: 40px; text-align: center; - margin-top: 40px; - margin-bottom: 40px; + font-size: 2.5rem; + margin: 30px 0; + color: #555; } -#thumbs a { - display: block; - border: solid 1px transparent; + +#basket thead th { + border-top: none; } -#thumbs a.active { - border-color: #6aae7a; + +#basket tfoot th { + font-size: 1.25rem; + color: #555; } -#product-social { - text-align: center; + +#order-summary tr td { + color: #999; } -#product-social h4 { - font-weight: 300; + +#order-summary tr.total { + font-size: 1.25rem; + color: #555; + font-weight: 700; +} + +#order-summary tr.total td { + color: #555; +} + +#checkout .nav-pills { + margin-bottom: 30px; + border-bottom: 1px solid #6aae7a; +} + +#checkout .nav-pills a { + font-size: 0.9rem; + border-bottom: none !important; +} + +#checkout .nav-pills a.disabled { + cursor: not-allowed; +} + +#checkout form label { + margin-bottom: 5px; +} + +#checkout .payment-method:hover, #checkout .shipping-method:hover { + cursor: pointer; +} + +@media (max-width: 767px) { + .nav-pills { + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + } +} + +.sidebar-menu .badge { + font-weight: 700; + margin: 0; +} + +.sidebar-menu.with-icons a.nav-link { + position: relative; +} + +.sidebar-menu.with-icons a.nav-link::before { + content: '\f105'; + display: inline-block; + position: absolute; + top: 50%; + right: 15px; + -webkit-transform: translateY(-50%); + transform: translateY(-50%); + font-family: 'FontAwesome'; +} + +.panel-heading { margin-bottom: 10px; } -#product-social p { - line-height: 26px; + +.panel-heading h3 { + margin-top: 5px; } -#product-social p a { - margin: 0 10px 0 0; + +.panel-heading .btn { color: #fff; + text-decoration: none !important; +} + +.panel-heading .btn i { + margin-right: 7px; +} + +.panel-body p { + font-size: .9rem; + color: #555; +} + +.panel-body label { + font-size: 0.8rem; + font-weight: 400 !important; + color: #777; + opacity: 0.9; display: inline-block; - width: 26px; - height: 26px; - border-radius: 13px; - line-height: 26px; - font-size: 15px; - text-align: center; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - vertical-align: bottom; + cursor: pointer; } -#product-social p a i { - vertical-align: bottom; - line-height: 26px; + +.panel-body label input { + margin-right: 5px; } -#product-social p a.facebook { - background-color: #4460ae; + +.panel-body label:hover { + opacity: 1; } -#product-social p a.gplus { - background-color: #c21f25; + +.panel-body span.colour { + display: inline-block; + width: 14px; + height: 14px; + margin-top: 10px; + margin-left: 5px; + border: 1px solid #555; } -#product-social p a.twitter { - background-color: #3cf; + +.panel-body span.colour.white { + background: #fff; } -#product-social p a.instagram { - background-color: #cd4378; + +.panel-body span.colour.blue { + background: #007bff; } -#product-social p a.email { - background-color: #4a7f45; + +.panel-body span.colour.green { + background: #28a745; } -@media (max-width: 991px) { - #product-social { - text-align: center; - } + +.panel-body span.colour.red { + background: #dc3545; } -#checkout .nav { - margin-bottom: 20px; - border-bottom: solid 1px #6aae7a; + +.panel-body span.colour.yellow { + background: #ffc107; } -#checkout .nav li { - height: 100%; + +.nav-pills .nav-link { + border-radius: 0; } -#checkout .nav li a { - display: block; - height: 100%; + +.nav-pills .nav-link:hover { + background: #eee; } -#order-summary table { - margin-top: 20px; + +.nav-pills .nav-link.active { + background: #6aae7a; } -#order-summary table td { - color: #999999; + +.panel { + margin-bottom: 20px; } -#order-summary table tr.total td, -#order-summary table tr.total th { - font-size: 18px; - color: #555555; + +.category-menu a.nav-link { + text-transform: uppercase; + letter-spacing: 0.1em; font-weight: 700; } -#checkout .table tbody tr td, -#basket .table tbody tr td, -#customer-order .table tbody tr td { - vertical-align: middle; + +ul ul a.nav-link { + padding-left: 30px !important; + font-size: 0.85rem; + text-transform: none !important; + font-weight: 400 !important; + color: #777; } -#checkout .table tbody tr td input, -#basket .table tbody tr td input, -#customer-order .table tbody tr td input { - width: 50px; - text-align: right; + +.tag-cloud a { + font-size: 0.8rem; + border: 1px solid #eee; + text-transform: uppercase; + letter-spacing: 0.1em; + font-weight: 600; + padding: 5px 10px; + text-transform: uppercase; + margin: 3px 0; + text-decoration: none !important; } -#checkout .table tbody tr td img, -#basket .table tbody tr td img, -#customer-order .table tbody tr td img { - width: 50px; + +.tag-cloud a:hover { + border-color: #6aae7a; } -#checkout .table tfoot, -#basket .table tfoot, -#customer-order .table tfoot { - font-size: 18px; + +.tag-cloud i { + margin-right: 5px; } -.shipping-method h4, -.payment-method h4 { + +.ribbon { + width: 80px; + height: 32px; + line-height: 32px; + background: #6aae7a; + color: #fff; text-transform: uppercase; - letter-spacing: 0.08em; + letter-spacing: 0.1em; + font-weight: 700; + font-size: 0.9rem; + margin-bottom: 20px; + position: absolute; + top: 30px; + left: -15px; + text-align: center; } -#customer-orders table tr th, -#customer-orders table tr td { - vertical-align: baseline; + +.ribbon.sale { + background: #6aae7a; } -#customer-order .table tfoot th { - font-size: 18px; - font-weight: 300; + +.ribbon.new { + background: #5bc0de; } -#customer-order .addresses { - text-align: right; - margin-bottom: 30px; + +.ribbon.new::after { + content: ''; + border-top: 15px solid #1f7e9a; } -#customer-order .addresses p { - font-size: 18px; - font-weight: 300; + +.ribbon.sold { + background: #f0ad4e; } -#customer-account { - margin-bottom: 30px; + +.ribbon.sold::after { + content: ''; + border-top: 15px solid #b06d0f; } -#get-it { - background: #6aae7a; - padding: 50px 0 30px; - color: #fff; - text-align: center; + +.ribbon.gift { + background: #5cb85c; +} + +.ribbon.gift::after { + content: ''; + border-top: 15px solid #2d672d; +} + +.ribbon:nth-of-type(2) { + top: 82px; +} + +.ribbon::after { + content: ''; + border-top: 15px solid #427a4f; + border-left: 15px solid transparent; + border-right: 0 solid transparent; + position: absolute; + bottom: -15px; + left: 0; + display: block; } -#get-it h1, -#get-it h2, -#get-it h3, -#get-it h4, -#get-it h5, -#get-it h6 { - color: #fff; + +.badge { + font-weight: 400; text-transform: uppercase; - letter-spacing: 0.08em; - margin: 0 0 20px; + letter-spacing: 0.1em; + padding: 3px 5px; } -#get-it p { - margin: 0 0 20px; + +#map { + border-top: 1px solid #6aae7a; + border-bottom: 1px solid #6aae7a; + height: 300px; } -#footer { - background: #555555; + +.get-it { + background: #6aae7a; + color: #fff; padding: 50px 0; - color: #999999; -} -#footer h1, -#footer h2, -#footer h3, -#footer h4, -#footer h5, -#footer h6 { - color: #eeeeee; -} -#footer h4 { - font-size: 14px; - font-weight: 800; - text-transform: uppercase; - letter-spacing: 0.08em; } -#footer ul { - padding-left: 0; - list-style: none; -} -#footer ul a { - color: #999999; + +.get-it h3 { + text-transform: uppercase; + letter-spacing: 0.1em; + margin: 0; } -#footer ul a:hover { - color: #6aae7a; - text-decoration: none; + +footer.main-footer { + padding: 60px 0; + padding-bottom: 0; + background: #555; + color: #fff; } -#footer .photostream div { - float: left; - display: block; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - width: 33%; - padding: 7.5px; - overflow: hidden; + +footer.main-footer a { + color: inherit; + color: #eee; } -#footer .photostream div a { - border: solid 1 px #eeeeee; + +footer.main-footer h4 { + color: #eee; + margin: 10px 0; + text-transform: uppercase; + letter-spacing: 0.1em; } -#footer .photostream div img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +footer.main-footer p { + font-size: 0.9rem; + color: #aaa; } -#footer .photostream div:hover img { - -webkit-transform: scale(1.1, 1.1); - -ms-transform: scale(1.1, 1.1); - -o-transform: scale(1.1, 1.1); - transform: scale(1.1, 1.1); + +footer.main-footer hr { + border: none; + border-top: 1px solid #ddd; + background: none; } -#footer .blog-entries .item { - clear: both; - padding: 5px 0; - margin-bottom: 10px; - border-bottom: solid 1px #555555; + +footer.main-footer .footer-blog-list li { + margin-bottom: 20px; } -#footer .blog-entries .item .image { - float: left; - width: 15%; + +footer.main-footer .image { + width: 40px; + height: 40px; margin-right: 10px; + -ms-flex-negative: 0; + flex-shrink: 0; } -#footer .blog-entries .item .name { - width: 75%; - margin-left: 10px; - display: table-cell; - vertical-align: middle; -} -#footer .blog-entries .item .name h5 { - margin: 0; + +footer.main-footer .text { text-transform: uppercase; - letter-spacing: 0.08em; - font-size: 12px; -} -#footer .blog-entries .item .name h5 a { - color: #eeeeee; -} -#footer .blog-entries .item .text { - width: 100%; - clear: both; + letter-spacing: 0.1em; } -#footer .blog-entries .item:last-child { - border-bottom: none; - margin-bottom: 0; + +footer.main-footer .text a { + font-size: 0.8rem; } -#footer .social a { - color: #555555; - font-size: 25px; - margin: 0 10px 0 0; + +footer.main-footer .photo-stream li { + margin: 0; } -#footer .social a:hover { - color: #6aae7a; + +footer.main-footer .photo-stream a { + width: 80px; + height: 80px; + padding: 5px; + display: block; } -#copyright { + +footer.main-footer .copyrights { + padding: 50px 0; background: #333; color: #ccc; - padding: 50px 0; - font-size: 12px; - line-height: 28px; + margin-top: 50px; } -#copyright p { - margin: 0; + +footer.main-footer .copyrights a { + color: #6aae7a; +} + +footer.main-footer .copyrights p { + color: inherit; + font-size: 0.8rem; + margin-bottom: 0; } + @media (max-width: 991px) { - #copyright p { - float: none !important; - text-align: center; - margin-bottom: 10px; + footer.main-footer .photo-stream a { + width: 120px; + height: 120px; } } -[data-animate] { - opacity: 0; - filter: alpha(opacity=0); + +@media (max-width: 767px) { + footer.main-footer .photo-stream li { + width: 32%; + margin-bottom: 10px; + } + footer.main-footer .photo-stream a { + width: 100%; + height: auto; + } } + +/* + +===================== +STYLE SWITCHER FOR DEMO +===================== + +*/ #style-switch-button { position: fixed; - top: 100px; + top: 120px; left: 0px; border-radius: 0; + z-index: 2; } + #style-switch { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; width: 300px; padding: 20px; position: fixed; - top: 140px; + top: 160px; left: 0; background: #fff; - border: solid 1px #eeeeee; + border: solid 1px #ced4da; + z-index: 2000; } -@media (max-width: 991px) { - #style-switch-button { - display: none; - } - #style-switch { - display: none; - } + +#style-switch h4 { + color: #495057; } -/* Original Boostrap template overwrite */ -/* breadcrumbs */ -.breadcrumb { - font-family: "Roboto", Helvetica, Arial, sans-serif; - text-transform: uppercase; - background-color: none; - letter-spacing: 0.08em; + +/* + * 1. NAVBAR + */ +.navbar { + padding: 0.5rem 1rem; } -/* nav */ -.nav > li > a { - padding: 10px 15px; + +.navbar-brand { + display: inline-block; + padding-top: 0.3125rem; + padding-bottom: 0.3125rem; + margin-right: 1rem; + font-size: 1.25rem; +} + +.navbar-toggler { + padding: 0.25rem 0.75rem; + font-size: 1.25rem; + line-height: 1; + border: 1px solid transparent; + border-radius: 0; } -.nav > li > a:hover, -.nav > li > a:focus { - background-color: #eeeeee; + +.navbar-light .navbar-brand { + color: rgba(0, 0, 0, 0.9); } -.nav > li.disabled > a { - color: #999999; + +.navbar-light .navbar-brand:focus, .navbar-light .navbar-brand:hover { + color: rgba(0, 0, 0, 0.9); } -.nav > li.disabled > a:hover, -.nav > li.disabled > a:focus { - color: #999999; + +.navbar-light .navbar-nav .nav-link { + color: rgba(0, 0, 0, 0.5); } -.nav .open > a, -.nav .open > a:hover, -.nav .open > a:focus { - background-color: #eeeeee; - border-color: #6aae7a; + +.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover { + color: rgba(0, 0, 0, 0.7); } -.nav-tabs { - border-bottom: 1px solid #6aae7a; + +.navbar-light .navbar-nav .nav-link.disabled { + color: rgba(0, 0, 0, 0.3); } -.nav-tabs > li { - float: left; - margin-bottom: -1px; + +.navbar-light .navbar-nav .show > .nav-link, +.navbar-light .navbar-nav .active > .nav-link, +.navbar-light .navbar-nav .nav-link.show, +.navbar-light .navbar-nav .nav-link.active { + color: rgba(0, 0, 0, 0.9); } -.nav-tabs > li > a { - margin-right: 2px; - line-height: 1.42857143; - border: 1px solid transparent; - border-radius: 0 0 0 0; + +.navbar-light .navbar-toggler { + color: rgba(0, 0, 0, 0.5); + border-color: rgba(0, 0, 0, 0.1); } -.nav-tabs > li > a:hover { - border-color: #eeeeee #eeeeee #6aae7a; + +.navbar-light .navbar-toggler-icon { + background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); } -.nav-tabs > li.active > a, -.nav-tabs > li.active > a:hover, -.nav-tabs > li.active > a:focus { - color: #555555; - background-color: #ffffff; - border: 1px solid #6aae7a; - border-bottom-color: transparent; - cursor: default; + +.navbar-light .navbar-text { + color: rgba(0, 0, 0, 0.5); } -.nav-tabs.nav-justified { - width: 100%; - border-bottom: solid 1px #6aae7a; - border-bottom: 0; + +.navbar-dark .navbar-brand { + color: #fff; } -.nav-tabs.nav-justified > li { - float: none; + +.navbar-dark .navbar-brand:focus, .navbar-dark .navbar-brand:hover { + color: #fff; } -.nav-tabs.nav-justified > li > a { - text-align: center; - /*margin-bottom: 5px;*/ + +.navbar-dark .navbar-nav .nav-link { + color: rgba(255, 255, 255, 0.5); } -.nav-tabs.nav-justified > .dropdown .dropdown-menu { - top: auto; - left: auto; + +.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover { + color: rgba(255, 255, 255, 0.75); } -.nav-tabs.nav-justified > li > a { - margin-right: 0; - border-radius: 0; + +.navbar-dark .navbar-nav .nav-link.disabled { + color: rgba(255, 255, 255, 0.25); } -.nav-tabs.nav-justified > .active > a, -.nav-tabs.nav-justified > .active > a:hover, -.nav-tabs.nav-justified > .active > a:focus { - border: 1px solid #6aae7a; + +.navbar-dark .navbar-nav .show > .nav-link, +.navbar-dark .navbar-nav .active > .nav-link, +.navbar-dark .navbar-nav .nav-link.show, +.navbar-dark .navbar-nav .nav-link.active { + color: #fff; } -@media (min-width: 768px) { - .nav-tabs.nav-justified > li > a { - border-bottom: 1px solid #6aae7a; - border-radius: 0 0 0 0; - } - .nav-tabs.nav-justified > .active > a, - .nav-tabs.nav-justified > .active > a:hover, - .nav-tabs.nav-justified > .active > a:focus { - border-bottom-color: #ffffff; - } + +.navbar-dark .navbar-toggler { + color: rgba(255, 255, 255, 0.5); + border-color: rgba(255, 255, 255, 0.1); } -.nav-pills > li { - float: left; + +.navbar-dark .navbar-toggler-icon { + background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); } -.nav-pills > li > a { + +.navbar-dark .navbar-text { + color: rgba(255, 255, 255, 0.5); +} + +/* + * 2. BUTTONS + */ +.btn { + font-weight: 700; + border: 1px solid transparent; + padding: 0.5rem 0.75rem; + font-size: 0.8rem; + line-height: 1.5; border-radius: 0; + -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; } -.nav-pills > li + li { - margin-left: 2px; + +.btn:focus, .btn.focus { + outline: 0; + -webkit-box-shadow: 0 0 0 0.2rem rgba(106, 174, 122, 0.25); + box-shadow: 0 0 0 0.2rem rgba(106, 174, 122, 0.25); +} + +.btn.disabled, .btn:disabled { + opacity: .65; +} + +.btn:not([disabled]):not(.disabled):active, .btn:not([disabled]):not(.disabled).active { + background-image: none; } -.nav-pills > li.active > a, -.nav-pills > li.active > a:hover, -.nav-pills > li.active > a:focus { - color: #ffffff; + +.btn-primary { + color: color-yiq(#6aae7a); background-color: #6aae7a; + border-color: #6aae7a; } -.nav-stacked > li { - float: none; + +.btn-primary:hover { + color: color-yiq(#559d66); + background-color: #519461; + border-color: #519461; } -.nav-stacked > li + li { - margin-top: 2px; - margin-left: 0; + +.btn-primary:focus, .btn-primary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(106, 174, 122, 0.5); + box-shadow: 0 0 0 0.2rem rgba(106, 174, 122, 0.5); } -.nav-justified { - width: 100%; - border-bottom: solid 1px #6aae7a; + +.btn-primary.disabled, .btn-primary:disabled { + color: color-yiq(#6aae7a); + background-color: #6aae7a; + border-color: #6aae7a; } -.nav-justified > li { - float: none; + +.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active, +.show > .btn-primary.dropdown-toggle { + color: color-yiq(#519461); + background-color: #519461; + border-color: #4c8c5b; +} + +.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, +.show > .btn-primary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(106, 174, 122, 0.5); + box-shadow: 0 0 0 0.2rem rgba(106, 174, 122, 0.5); +} + +.btn-secondary { + color: color-yiq(#868e96); + background-color: #868e96; + border-color: #868e96; +} + +.btn-secondary:hover { + color: color-yiq(#727b84); + background-color: #6c757d; + border-color: #6c757d; +} + +.btn-secondary:focus, .btn-secondary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); +} + +.btn-secondary.disabled, .btn-secondary:disabled { + color: color-yiq(#868e96); + background-color: #868e96; + border-color: #868e96; +} + +.btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active, +.show > .btn-secondary.dropdown-toggle { + color: color-yiq(#6c757d); + background-color: #6c757d; + border-color: #666e76; +} + +.btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus, +.show > .btn-secondary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); +} + +.btn-success { + color: color-yiq(#28a745); + background-color: #28a745; + border-color: #28a745; +} + +.btn-success:hover { + color: color-yiq(#218838); + background-color: #1e7e34; + border-color: #1e7e34; +} + +.btn-success:focus, .btn-success.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); +} + +.btn-success.disabled, .btn-success:disabled { + color: color-yiq(#28a745); + background-color: #28a745; + border-color: #28a745; +} + +.btn-success:not(:disabled):not(.disabled):active, .btn-success:not(:disabled):not(.disabled).active, +.show > .btn-success.dropdown-toggle { + color: color-yiq(#1e7e34); + background-color: #1e7e34; + border-color: #1c7430; +} + +.btn-success:not(:disabled):not(.disabled):active:focus, .btn-success:not(:disabled):not(.disabled).active:focus, +.show > .btn-success.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); +} + +.btn-info { + color: color-yiq(#17a2b8); + background-color: #17a2b8; + border-color: #17a2b8; +} + +.btn-info:hover { + color: color-yiq(#138496); + background-color: #117a8b; + border-color: #117a8b; +} + +.btn-info:focus, .btn-info.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); +} + +.btn-info.disabled, .btn-info:disabled { + color: color-yiq(#17a2b8); + background-color: #17a2b8; + border-color: #17a2b8; +} + +.btn-info:not(:disabled):not(.disabled):active, .btn-info:not(:disabled):not(.disabled).active, +.show > .btn-info.dropdown-toggle { + color: color-yiq(#117a8b); + background-color: #117a8b; + border-color: #10707f; +} + +.btn-info:not(:disabled):not(.disabled):active:focus, .btn-info:not(:disabled):not(.disabled).active:focus, +.show > .btn-info.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); +} + +.btn-warning { + color: color-yiq(#ffc107); + background-color: #ffc107; + border-color: #ffc107; +} + +.btn-warning:hover { + color: color-yiq(#e0a800); + background-color: #d39e00; + border-color: #d39e00; +} + +.btn-warning:focus, .btn-warning.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-warning.disabled, .btn-warning:disabled { + color: color-yiq(#ffc107); + background-color: #ffc107; + border-color: #ffc107; +} + +.btn-warning:not(:disabled):not(.disabled):active, .btn-warning:not(:disabled):not(.disabled).active, +.show > .btn-warning.dropdown-toggle { + color: color-yiq(#d39e00); + background-color: #d39e00; + border-color: #c69500; +} + +.btn-warning:not(:disabled):not(.disabled):active:focus, .btn-warning:not(:disabled):not(.disabled).active:focus, +.show > .btn-warning.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-danger { + color: color-yiq(#dc3545); + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-danger:hover { + color: color-yiq(#c82333); + background-color: #bd2130; + border-color: #bd2130; +} + +.btn-danger:focus, .btn-danger.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-danger.disabled, .btn-danger:disabled { + color: color-yiq(#dc3545); + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-danger:not(:disabled):not(.disabled):active, .btn-danger:not(:disabled):not(.disabled).active, +.show > .btn-danger.dropdown-toggle { + color: color-yiq(#bd2130); + background-color: #bd2130; + border-color: #b21f2d; +} + +.btn-danger:not(:disabled):not(.disabled):active:focus, .btn-danger:not(:disabled):not(.disabled).active:focus, +.show > .btn-danger.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-light { + color: color-yiq(#f8f9fa); + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-light:hover { + color: color-yiq(#e2e6ea); + background-color: #dae0e5; + border-color: #dae0e5; +} + +.btn-light:focus, .btn-light.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-light.disabled, .btn-light:disabled { + color: color-yiq(#f8f9fa); + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-light:not(:disabled):not(.disabled):active, .btn-light:not(:disabled):not(.disabled).active, +.show > .btn-light.dropdown-toggle { + color: color-yiq(#dae0e5); + background-color: #dae0e5; + border-color: #d3d9df; +} + +.btn-light:not(:disabled):not(.disabled):active:focus, .btn-light:not(:disabled):not(.disabled).active:focus, +.show > .btn-light.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-dark { + color: color-yiq(#343a40); + background-color: #343a40; + border-color: #343a40; +} + +.btn-dark:hover { + color: color-yiq(#23272b); + background-color: #1d2124; + border-color: #1d2124; +} + +.btn-dark:focus, .btn-dark.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-dark.disabled, .btn-dark:disabled { + color: color-yiq(#343a40); + background-color: #343a40; + border-color: #343a40; +} + +.btn-dark:not(:disabled):not(.disabled):active, .btn-dark:not(:disabled):not(.disabled).active, +.show > .btn-dark.dropdown-toggle { + color: color-yiq(#1d2124); + background-color: #1d2124; + border-color: #171a1d; +} + +.btn-dark:not(:disabled):not(.disabled):active:focus, .btn-dark:not(:disabled):not(.disabled).active:focus, +.show > .btn-dark.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-default { + color: color-yiq(#ced4da); + background-color: #ced4da; + border-color: #ced4da; +} + +.btn-default:hover { + color: color-yiq(#b8c1ca); + background-color: #b1bbc4; + border-color: #b1bbc4; +} + +.btn-default:focus, .btn-default.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); + box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); +} + +.btn-default.disabled, .btn-default:disabled { + color: color-yiq(#ced4da); + background-color: #ced4da; + border-color: #ced4da; +} + +.btn-default:not(:disabled):not(.disabled):active, .btn-default:not(:disabled):not(.disabled).active, +.show > .btn-default.dropdown-toggle { + color: color-yiq(#b1bbc4); + background-color: #b1bbc4; + border-color: #aab4bf; +} + +.btn-default:not(:disabled):not(.disabled):active:focus, .btn-default:not(:disabled):not(.disabled).active:focus, +.show > .btn-default.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); + box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); +} + +.btn-outline-primary { + color: #6aae7a; + background-color: transparent; + background-image: none; + border-color: #6aae7a; } -.nav-justified > li > a { - text-align: center; - /*margin-bottom: 5px;*/ + +.btn-outline-primary:hover { + color: #fff; + background-color: #6aae7a; + border-color: #6aae7a; } -.nav-justified > .dropdown .dropdown-menu { - top: auto; - left: auto; + +.btn-outline-primary:focus, .btn-outline-primary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(106, 174, 122, 0.5); + box-shadow: 0 0 0 0.2rem rgba(106, 174, 122, 0.5); } -.nav-tabs-justified { - border-bottom: 0; + +.btn-outline-primary.disabled, .btn-outline-primary:disabled { + color: #6aae7a; + background-color: transparent; } -.nav-tabs-justified > li > a { - margin-right: 0; - border-radius: 0; + +.btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active, +.show > .btn-outline-primary.dropdown-toggle { + color: color-yiq(#6aae7a); + background-color: #6aae7a; + border-color: #6aae7a; } -.nav-tabs-justified > .active > a, -.nav-tabs-justified > .active > a:hover, -.nav-tabs-justified > .active > a:focus { - border: 1px solid #6aae7a; + +.btn-outline-primary:not(:disabled):not(.disabled):active:focus, .btn-outline-primary:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-primary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(106, 174, 122, 0.5); + box-shadow: 0 0 0 0.2rem rgba(106, 174, 122, 0.5); } -@media (min-width: 768px) { - .nav-tabs-justified > li > a { - border-bottom: 1px solid #6aae7a; - border-radius: 0 0 0 0; - } - .nav-tabs-justified > .active > a, - .nav-tabs-justified > .active > a:hover, - .nav-tabs-justified > .active > a:focus { - border-bottom-color: #ffffff; - } + +.btn-outline-secondary { + color: #868e96; + background-color: transparent; + background-image: none; + border-color: #868e96; } -.tab-content { - padding: 15px; - border: solid 1px #ddd; - border-top: none; + +.btn-outline-secondary:hover { + color: #fff; + background-color: #868e96; + border-color: #868e96; } -/* navbar */ -.navbar { - position: relative; - min-height: 62px; - margin-bottom: 0; - border-bottom: 1px solid transparent; + +.btn-outline-secondary:focus, .btn-outline-secondary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); } -@media (min-width: 768px) { - .navbar { - border-radius: 0px; - } + +.btn-outline-secondary.disabled, .btn-outline-secondary:disabled { + color: #868e96; + background-color: transparent; } -@media (min-width: 768px) { - .navbar-header { - float: left; - } + +.btn-outline-secondary:not(:disabled):not(.disabled):active, .btn-outline-secondary:not(:disabled):not(.disabled).active, +.show > .btn-outline-secondary.dropdown-toggle { + color: color-yiq(#868e96); + background-color: #868e96; + border-color: #868e96; +} + +.btn-outline-secondary:not(:disabled):not(.disabled):active:focus, .btn-outline-secondary:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-secondary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); +} + +.btn-outline-success { + color: #28a745; + background-color: transparent; + background-image: none; + border-color: #28a745; } -.navbar-collapse { - overflow-x: visible; - padding-right: 15px; - padding-left: 15px; + +.btn-outline-success:hover { + color: #fff; + background-color: #28a745; + border-color: #28a745; } -.navbar-collapse.in { - overflow-y: auto; + +.btn-outline-success:focus, .btn-outline-success.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); } -@media (min-width: 768px) { - .navbar-collapse { - width: auto; - border-top: 0; - box-shadow: none; - } - .navbar-collapse.collapse { - display: block !important; - height: auto !important; - padding-bottom: 0; - overflow: visible !important; - } - .navbar-collapse.in { - overflow-y: visible; - } - .navbar-fixed-top .navbar-collapse, - .navbar-static-top .navbar-collapse, - .navbar-fixed-bottom .navbar-collapse { - padding-left: 0; - padding-right: 0; - } + +.btn-outline-success.disabled, .btn-outline-success:disabled { + color: #28a745; + background-color: transparent; } -.navbar-fixed-top .navbar-collapse, -.navbar-affixed-top .navbar-collapse, -.navbar-fixed-bottom .navbar-collapse { - max-height: 340px; + +.btn-outline-success:not(:disabled):not(.disabled):active, .btn-outline-success:not(:disabled):not(.disabled).active, +.show > .btn-outline-success.dropdown-toggle { + color: color-yiq(#28a745); + background-color: #28a745; + border-color: #28a745; +} + +.btn-outline-success:not(:disabled):not(.disabled):active:focus, .btn-outline-success:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-success.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); +} + +.btn-outline-info { + color: #17a2b8; + background-color: transparent; + background-image: none; + border-color: #17a2b8; } -@media (max-width: 480px) and (orientation: landscape) { - .navbar-fixed-top .navbar-collapse, - .navbar-affixed-top .navbar-collapse, - .navbar-fixed-bottom .navbar-collapse { - max-height: 200px; - } + +.btn-outline-info:hover { + color: #fff; + background-color: #17a2b8; + border-color: #17a2b8; } -.container > .navbar-header, -.container-fluid > .navbar-header, -.container > .navbar-collapse, -.container-fluid > .navbar-collapse { - margin-right: -15px; - margin-left: -15px; -} -@media (min-width: 768px) { - .container > .navbar-header, - .container-fluid > .navbar-header, - .container > .navbar-collapse, - .container-fluid > .navbar-collapse { - margin-right: 0; - margin-left: 0; - } + +.btn-outline-info:focus, .btn-outline-info.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); } -.navbar-static-top { - z-index: 1000; - border-width: 0 0 1px; + +.btn-outline-info.disabled, .btn-outline-info:disabled { + color: #17a2b8; + background-color: transparent; } -@media (min-width: 768px) { - .navbar-static-top { - border-radius: 0; - } + +.btn-outline-info:not(:disabled):not(.disabled):active, .btn-outline-info:not(:disabled):not(.disabled).active, +.show > .btn-outline-info.dropdown-toggle { + color: color-yiq(#17a2b8); + background-color: #17a2b8; + border-color: #17a2b8; +} + +.btn-outline-info:not(:disabled):not(.disabled):active:focus, .btn-outline-info:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-info.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); +} + +.btn-outline-warning { + color: #ffc107; + background-color: transparent; + background-image: none; + border-color: #ffc107; } -.navbar-fixed-top, -.navbar-fixed-bottom { - position: fixed; - right: 0; - left: 0; - z-index: 1030; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); -} -@media (min-width: 768px) { - .navbar-fixed-top, - .navbar-fixed-bottom { - border-radius: 0; - } + +.btn-outline-warning:hover { + color: #fff; + background-color: #ffc107; + border-color: #ffc107; } -.navbar-fixed-top { - top: 0; - border-width: 0 0 1px; + +.btn-outline-warning:focus, .btn-outline-warning.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); } -.navbar-fixed-bottom { - bottom: 0; - margin-bottom: 0; - border-width: 1px 0 0; + +.btn-outline-warning.disabled, .btn-outline-warning:disabled { + color: #ffc107; + background-color: transparent; } -.navbar-brand { - float: left; - padding: 10px 15px; - font-size: 18px; - line-height: 20px; - height: 62px; + +.btn-outline-warning:not(:disabled):not(.disabled):active, .btn-outline-warning:not(:disabled):not(.disabled).active, +.show > .btn-outline-warning.dropdown-toggle { + color: color-yiq(#ffc107); + background-color: #ffc107; + border-color: #ffc107; +} + +.btn-outline-warning:not(:disabled):not(.disabled):active:focus, .btn-outline-warning:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-warning.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-outline-danger { + color: #dc3545; + background-color: transparent; + background-image: none; + border-color: #dc3545; } -.navbar-brand:hover, -.navbar-brand:focus { - text-decoration: none; + +.btn-outline-danger:hover { + color: #fff; + background-color: #dc3545; + border-color: #dc3545; } -@media (min-width: 768px) { - .navbar > .container .navbar-brand, - .navbar > .container-fluid .navbar-brand { - margin-left: -15px; - } + +.btn-outline-danger:focus, .btn-outline-danger.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); } -.navbar-toggle { - position: relative; - float: right; - margin-right: 15px; - padding: 9px 10px; - margin-top: 14px; - margin-bottom: 14px; + +.btn-outline-danger.disabled, .btn-outline-danger:disabled { + color: #dc3545; + background-color: transparent; +} + +.btn-outline-danger:not(:disabled):not(.disabled):active, .btn-outline-danger:not(:disabled):not(.disabled).active, +.show > .btn-outline-danger.dropdown-toggle { + color: color-yiq(#dc3545); + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-outline-danger:not(:disabled):not(.disabled):active:focus, .btn-outline-danger:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-danger.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-outline-light { + color: #f8f9fa; background-color: transparent; background-image: none; - border: 1px solid transparent; + border-color: #f8f9fa; +} + +.btn-outline-light:hover { + color: #fff; + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-outline-light:focus, .btn-outline-light.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-outline-light.disabled, .btn-outline-light:disabled { + color: #f8f9fa; + background-color: transparent; +} + +.btn-outline-light:not(:disabled):not(.disabled):active, .btn-outline-light:not(:disabled):not(.disabled).active, +.show > .btn-outline-light.dropdown-toggle { + color: color-yiq(#f8f9fa); + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-outline-light:not(:disabled):not(.disabled):active:focus, .btn-outline-light:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-light.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-outline-dark { + color: #343a40; + background-color: transparent; + background-image: none; + border-color: #343a40; +} + +.btn-outline-dark:hover { + color: #fff; + background-color: #343a40; + border-color: #343a40; +} + +.btn-outline-dark:focus, .btn-outline-dark.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-outline-dark.disabled, .btn-outline-dark:disabled { + color: #343a40; + background-color: transparent; +} + +.btn-outline-dark:not(:disabled):not(.disabled):active, .btn-outline-dark:not(:disabled):not(.disabled).active, +.show > .btn-outline-dark.dropdown-toggle { + color: color-yiq(#343a40); + background-color: #343a40; + border-color: #343a40; +} + +.btn-outline-dark:not(:disabled):not(.disabled):active:focus, .btn-outline-dark:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-dark.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-lg { + padding: 0.5rem 1rem; + font-size: 1.25rem; + line-height: 1.5; + border-radius: 0; +} + +.btn-sm { + padding: 0.25rem 0.5rem; + font-size: 0.7rem; + line-height: 1.5; border-radius: 0; } -.navbar-toggle:focus { - outline: 0; + +/* + * 3. TYPE + */ +body { + font-family: "Roboto", Helvetica, Arial, sans-serif; + font-size: 1rem; + font-weight: 400; + line-height: 1.5; + color: #212529; + background-color: #fff; +} + +a { + color: #6aae7a; + text-decoration: none; +} + +a:focus, a:hover { + color: #488456; + text-decoration: underline; +} + +h1, +h2, +h3, +h4, +h5, +h6, +.h1, +.h2, +.h3, +.h4, +.h5, +.h6 { + margin-bottom: 1rem; + font-family: inherit; + font-weight: 700; + line-height: 1.1; + color: inherit; +} + +h1, +.h1 { + font-size: 2.2rem; +} + +h2, +.h2 { + font-size: 1.8rem; +} + +h3, +.h3 { + font-size: 1.5rem; +} + +h4, +.h4 { + font-size: 1.1rem; +} + +h5, +.h5 { + font-size: 1rem; +} + +h6, +.h6 { + font-size: 0.8rem; +} + +.lead { + font-size: 1.25rem; + font-weight: 300; +} + +.display-1 { + font-size: 6rem; + font-weight: 300; + line-height: 1.1; +} + +.display-2 { + font-size: 5.5rem; + font-weight: 300; + line-height: 1.1; } -.navbar-nav { - margin: 10.5px -15px; + +.display-3 { + font-size: 4.5rem; + font-weight: 300; + line-height: 1.1; } -.navbar-nav > li > a { - padding-top: 10px; - padding-bottom: 10px; - line-height: 20px; + +.display-4 { + font-size: 3.5rem; + font-weight: 300; + line-height: 1.1; } -@media (max-width: 767px) { - .navbar-nav .open .dropdown-menu > li > a, - .navbar-nav .open .dropdown-menu .dropdown-header { - padding: 5px 15px 5px 25px; - } - .navbar-nav .open .dropdown-menu > li > a { - line-height: 20px; - } - .navbar-nav .open .dropdown-menu > li > a:hover, - .navbar-nav .open .dropdown-menu > li > a:focus { - background-image: none; - } + +hr { + border-top: 1px solid rgba(0, 0, 0, 0.1); } -@media (min-width: 768px) { - .navbar-nav { - float: left; - margin: 0; - } - .navbar-nav > li { - float: left; - } - .navbar-nav > li > a { - padding-top: 21px; - padding-bottom: 21px; - } - .navbar-nav.navbar-right:last-child { - margin-right: -15px; - } + +small, +.small { + font-size: 80%; + font-weight: 400; } -@media (min-width: 768px) { - .navbar-left { - float: left !important; - } - .navbar-right { - float: right !important; - } + +mark, +.mark { + padding: 0.2em; + background-color: #fcf8e3; +} + +.blockquote { + padding: 0.5rem 1rem; + margin-bottom: 2rem; + font-size: 1rem; + border-left: 5px solid #6aae7a; } -.navbar-form { - margin-left: -15px; - margin-right: -15px; - padding: 10px 15px; - border-top: 1px solid transparent; - border-bottom: 1px solid transparent; - -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); - margin-top: 14px; - margin-bottom: 14px; + +.blockquote-footer { + color: #868e96; } -@media (max-width: 767px) { - .navbar-form .form-group { - margin-bottom: 5px; - } + +.blockquote-footer::before { + content: "\2014 \00A0"; } -@media (min-width: 768px) { - .navbar-form { - width: auto; - border: 0; - margin-left: 0; - margin-right: 0; - padding-top: 0; - padding-bottom: 0; - -webkit-box-shadow: none; - box-shadow: none; - } - .navbar-form.navbar-right:last-child { - margin-right: -15px; - } + +.text-primary { + color: #6aae7a !important; } -.navbar-nav > li > .dropdown-menu { - margin-top: 0; - border-top-right-radius: 0; - border-top-left-radius: 0; + +a.text-primary:focus, a.text-primary:hover { + color: #519461 !important; } -.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu { - border-bottom-right-radius: 0; + +/* + * 4. PAGINATION + */ +.page-item:first-child .page-link { + border-top-left-radius: 0; border-bottom-left-radius: 0; } -.navbar-btn { - margin-top: 14px; - margin-bottom: 14px; + +.page-item:last-child .page-link { + border-top-right-radius: 0; + border-bottom-right-radius: 0; } -.navbar-btn.btn-sm { - margin-top: 16px; - margin-bottom: 16px; + +.page-item.active .page-link { + color: #fff; + background-color: #6aae7a; + border-color: #6aae7a; } -.navbar-btn.btn-xs { - margin-top: 20px; - margin-bottom: 20px; + +.page-item.disabled .page-link { + color: #868e96; + background-color: #fff; + border-color: #dee2e6; } -.navbar-text { - margin-top: 21px; - margin-bottom: 21px; + +.page-link { + padding: 0.5rem 0.75rem; + line-height: 1.25; + color: #6aae7a; + background-color: #fff; + border: 1px solid #dee2e6; } -@media (min-width: 768px) { - .navbar-text { - float: left; - margin-left: 15px; - margin-right: 15px; - } - .navbar-text.navbar-right:last-child { - margin-right: 0; - } + +.page-link:focus, .page-link:hover { + color: #488456; + text-decoration: none; + background-color: #e9ecef; + border-color: #dee2e6; + outline: 0; } -.navbar-default { - background-color: #ffffff; - border-color: #cccccc; - border-bottom: none; + +.pagination-lg .page-link { + padding: 0.75rem 1.5rem; + font-size: 1.25rem; + line-height: 1.5; } -.navbar-default .navbar-brand { - color: #555555; + +.pagination-lg .page-item:first-child .page-link { + border-top-left-radius: 0; + border-bottom-left-radius: 0; } -.navbar-default .navbar-brand:hover, -.navbar-default .navbar-brand:focus { - color: #3b3b3b; - background-color: transparent; + +.pagination-lg .page-item:last-child .page-link { + border-top-right-radius: 0; + border-bottom-right-radius: 0; } -.navbar-default .navbar-text { - color: #777777; + +.pagination-sm .page-link { + padding: 0.25rem 0.5rem; + font-size: 0.7rem; + line-height: 1.5; } -.navbar-default .navbar-nav > li > a { - color: #555555; + +.pagination-sm .page-item:first-child .page-link { + border-top-left-radius: 0; + border-bottom-left-radius: 0; } -.navbar-default .navbar-nav > li > a:hover, -.navbar-default .navbar-nav > li > a:focus { - color: #555555; - background-color: #acd2b5; + +.pagination-sm .page-item:last-child .page-link { + border-top-right-radius: 0; + border-bottom-right-radius: 0; } -.navbar-default .navbar-nav > .active > a, -.navbar-default .navbar-nav > .active > a:hover, -.navbar-default .navbar-nav > .active > a:focus { - color: #ffffff; - background-color: #6aae7a; + +/* +* 5. DROPDOWNS +*/ +.dropdown-menu { + z-index: 1000; + min-width: 10rem; + padding: 0.5rem 0; + margin: 0.125rem 0 0; + font-size: 1rem; + color: #212529; + background-color: #fff; + border: 1px solid rgba(0, 0, 0, 0.15); + border-radius: 0; } -.navbar-default .navbar-nav > .disabled > a, -.navbar-default .navbar-nav > .disabled > a:hover, -.navbar-default .navbar-nav > .disabled > a:focus { - color: #cccccc; - background-color: transparent; + +.dropdown-item { + padding: 0.25rem 1.5rem; + color: #212529; } -.navbar-default .navbar-toggle { - border-color: #dddddd; + +.dropdown-item:focus, .dropdown-item:hover { + color: #16181b; + background-color: #f8f9fa; } -.navbar-default .navbar-toggle:hover, -.navbar-default .navbar-toggle:focus { + +.dropdown-item.active, .dropdown-item:active { + color: #fff; background-color: #6aae7a; } -.navbar-default .navbar-toggle .icon-bar { - background-color: #888888; + +.dropdown-item.disabled, .dropdown-item:disabled { + color: #868e96; } -.navbar-default .navbar-collapse, -.navbar-default .navbar-form { - border-color: #cccccc; + +.dropdown-header { + padding: 0.5rem 1.5rem; + font-size: 0.7rem; + color: #868e96; } -.navbar-default .navbar-nav > .open > a, -.navbar-default .navbar-nav > .open > a:hover, -.navbar-default .navbar-nav > .open > a:focus { - background-color: #6aae7a; - color: #ffffff; + +/* +* 6. UTILITIES +*/ +.bg-primary { + background-color: #6aae7a !important; } -@media (max-width: 767px) { - .navbar-default .navbar-nav .open .dropdown-menu > li > a { - color: #555555; - } - .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, - .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus { - color: #6aae7a; - } - .navbar-default .navbar-nav .open .dropdown-menu > .active > a, - .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, - .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus { - color: #ffffff; - background-color: #6aae7a; - } - .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a, - .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover, - .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus { - color: #cccccc; - background-color: transparent; - } + +a.bg-primary:focus, a.bg-primary:hover { + background-color: #519461 !important; } -.navbar-default .navbar-link { - color: #555555; + +.bg-secondary { + background-color: #868e96 !important; } -.navbar-default .navbar-link:hover { - color: #555555; + +a.bg-secondary:focus, a.bg-secondary:hover { + background-color: #6c757d !important; } -.navbar-default .btn-link { - color: #555555; + +.bg-success { + background-color: #28a745 !important; } -.navbar-default .btn-link:hover, -.navbar-default .btn-link:focus { - color: #555555; + +a.bg-success:focus, a.bg-success:hover { + background-color: #1e7e34 !important; } -.navbar-default .btn-link[disabled]:hover, -fieldset[disabled] .navbar-default .btn-link:hover, -.navbar-default .btn-link[disabled]:focus, -fieldset[disabled] .navbar-default .btn-link:focus { - color: #cccccc; + +.bg-info { + background-color: #17a2b8 !important; } -/* scaffolding */ -body { - font-family: "Roboto", Helvetica, Arial, sans-serif; - font-size: 14px; - line-height: 1.42857143; - color: #555555; + +a.bg-info:focus, a.bg-info:hover { + background-color: #117a8b !important; } -a { - color: #6aae7a; - text-decoration: none; + +.bg-warning { + background-color: #ffc107 !important; } -a:hover, -a:focus { - color: #488456; - text-decoration: underline; + +a.bg-warning:focus, a.bg-warning:hover { + background-color: #d39e00 !important; } -a:focus { - outline: thin dotted; - outline: 5px auto -webkit-focus-ring-color; - outline-offset: -2px; + +.bg-danger { + background-color: #dc3545 !important; } -.img-rounded { - border-radius: 0; + +a.bg-danger:focus, a.bg-danger:hover { + background-color: #bd2130 !important; } -hr { - margin-top: 20px; - margin-bottom: 20px; - border: 0; - border-top: 1px solid #eeeeee; + +.bg-light { + background-color: #f8f9fa !important; } -/* breadcrumbs */ -.breadcrumb { - padding: 20px 0; - margin-bottom: 20px; - background-color: transparent; - border-radius: 0; - text-align: right; + +a.bg-light:focus, a.bg-light:hover { + background-color: #dae0e5 !important; } -.breadcrumb > li + li:before { - content: ">\00a0"; - color: #555555; + +.bg-dark { + background-color: #343a40 !important; } -.breadcrumb > .active { - color: #999999; + +a.bg-dark:focus, a.bg-dark:hover { + background-color: #1d2124 !important; } -@media (max-width: 991px) { - .breadcrumb { - padding: 20px 0; - text-align: center; - } + +.border-primary { + border-color: #6aae7a !important; } -/* dropdowns */ -.dropdown-menu { - z-index: 1000; - font-size: 14px; - background-color: #ffffff; - border: 1px solid #cccccc; - border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 0; - -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); - box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); + +.border-secondary { + border-color: #868e96 !important; } -.dropdown-menu.pull-right { - right: 0; - left: auto; + +.border-success { + border-color: #28a745 !important; } -.dropdown-menu .divider { - height: 1px; - margin: 9px 0; - overflow: hidden; - background-color: #e5e5e5; + +.border-info { + border-color: #17a2b8 !important; } -.dropdown-menu > li > a { - padding: 5px 20px; - line-height: 1.42857143; - color: #333333; - white-space: nowrap; + +.border-warning { + border-color: #ffc107 !important; } -/* labels */ -.label { - font-family: "Roboto", Helvetica, Arial, sans-serif; - font-weight: normal; - text-transform: uppercase; - letter-spacing: 0.08em; + +.border-danger { + border-color: #dc3545 !important; } -/* forms.less */ -label { - font-weight: normal; + +.border-light { + border-color: #f8f9fa !important; } -.form-control { - -webkit-box-shadow: none; - box-shadow: none; - border-radius: 0; + +.border-dark { + border-color: #343a40 !important; } -.form-control:focus { - border-color: #6aae7a; - outline: 0; - -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(106, 174, 122, 0.6); - box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(106, 174, 122, 0.6); + +.text-primary { + color: #6aae7a !important; } -.form-group { - margin-bottom: 20px; + +a.text-primary:focus, a.text-primary:hover { + color: #519461 !important; } -/* pager*/ -.pager { - margin: 20px 0; - border-top: solid 1px #eeeeee; - padding-top: 20px; - text-transform: uppercase; - letter-spacing: 0.08em; - font-family: "Roboto", Helvetica, Arial, sans-serif; + +.text-secondary { + color: #868e96 !important; } -.pager li { - display: inline; + +a.text-secondary:focus, a.text-secondary:hover { + color: #6c757d !important; } -.pager li > a, -.pager li > span { - background-color: #ffffff; - border: 1px solid #6aae7a; - border-radius: 0; + +.text-success { + color: #28a745 !important; } -.pager li > a:hover, -.pager li > a:focus { - text-decoration: none; - color: #fff; - background-color: #6aae7a; + +a.text-success:focus, a.text-success:hover { + color: #1e7e34 !important; } -.pager .disabled > a, -.pager .disabled > a:hover, -.pager .disabled > a:focus, -.pager .disabled > span { - color: #999999; - background-color: #ffffff; - border-color: #ddd; + +.text-info { + color: #17a2b8 !important; } -/* pagination */ -.pagination { - margin: 20px 0; - font-family: "Roboto", Helvetica, Arial, sans-serif; - border-radius: 0; + +a.text-info:focus, a.text-info:hover { + color: #117a8b !important; } -.pagination > li > a, -.pagination > li > span { - padding: 6px 12px; - line-height: 1.42857143; - text-decoration: none; - color: #6aae7a; - background-color: #ffffff; - border: 1px solid #dddddd; + +.text-warning { + color: #ffc107 !important; } -.pagination > li > a:hover, -.pagination > li > span:hover, -.pagination > li > a:focus, -.pagination > li > span:focus { - color: #6aae7a; - background-color: #cde4d2; - border-color: #dddddd; -} -.pagination > .active > a, -.pagination > .active > span, -.pagination > .active > a:hover, -.pagination > .active > span:hover, -.pagination > .active > a:focus, -.pagination > .active > span:focus { - z-index: 2; - color: #ffffff; - background-color: #6aae7a; - border-color: #6aae7a; + +a.text-warning:focus, a.text-warning:hover { + color: #d39e00 !important; } -.pagination > .disabled > span, -.pagination > .disabled > span:hover, -.pagination > .disabled > span:focus, -.pagination > .disabled > a, -.pagination > .disabled > a:hover, -.pagination > .disabled > a:focus { - color: #999999; - background-color: #ffffff; - border-color: #dddddd; -} -/* responsive utilities */ -@media (max-width: 767px) { - .text-center-xs { - text-align: center !important; - } - .text-center-xs img { - display: block; - margin-left: auto; - margin-right: auto; - } + +.text-danger { + color: #dc3545 !important; } -@media (min-width: 768px) and (max-width: 991px) { - .text-center-sm { - text-align: center !important; - } - .text-center-sm img { - display: block; - margin-left: auto; - margin-right: auto; - } + +a.text-danger:focus, a.text-danger:hover { + color: #bd2130 !important; } -/* type */ -h1, -h2, -h3, -h4, -h5, -h6, -.h1, -.h2, -.h3, -.h4, -.h5, -.h6 { - font-family: "Roboto", Helvetica, Arial, sans-serif; - font-weight: 900; - line-height: 1.1; - color: #333333; + +.text-light { + color: #f8f9fa !important; } -h1, -.h1, -h2, -.h2, -h3, -.h3 { - margin-top: 20px; - margin-bottom: 20px; + +a.text-light:focus, a.text-light:hover { + color: #dae0e5 !important; } -p { - margin: 0 0 10px; + +.text-dark { + color: #343a40 !important; } -.lead { - margin-bottom: 20px; - font-size: 18px; + +a.text-dark:focus, a.text-dark:hover { + color: #1d2124 !important; } -@media (min-width: 768px) { - .lead { - font-size: 21px; - } + +.badge-primary { + color: #fff; + background-color: #6aae7a; } -.text-small { - font-size: 12px; + +.badge-primary[href]:focus, .badge-primary[href]:hover { + color: #fff; + text-decoration: none; + background-color: #519461; } -.text-large { - font-size: 18px; + +.badge-secondary { + color: #fff; + background-color: #868e96; } -.text-italic { - font-style: italic; + +.badge-secondary[href]:focus, .badge-secondary[href]:hover { + color: #fff; + text-decoration: none; + background-color: #6c757d; } -.text-primary { - color: #6aae7a; + +.badge-success { + color: #fff; + background-color: #28a745; } -a.text-primary:hover { - color: #519461; + +.badge-success[href]:focus, .badge-success[href]:hover { + color: #fff; + text-decoration: none; + background-color: #1e7e34; } -.bg-primary { + +.badge-info { color: #fff; - background-color: #6aae7a; + background-color: #17a2b8; } -a.bg-primary:hover { - background-color: #519461; + +.badge-info[href]:focus, .badge-info[href]:hover { + color: #fff; + text-decoration: none; + background-color: #117a8b; } -abbr[title], -abbr[data-original-title] { - border-bottom: 1px dotted #999999; + +.badge-warning { + color: #111; + background-color: #ffc107; } -blockquote { - padding: 10px 20px; - margin: 0 0 20px; - font-size: 14px; - border-left: 5px solid #6aae7a; + +.badge-warning[href]:focus, .badge-warning[href]:hover { + color: #111; + text-decoration: none; + background-color: #d39e00; } -blockquote footer, -blockquote small, -blockquote .small { - display: block; - font-size: 80%; - line-height: 1.42857143; - color: #999999; + +.badge-danger { + color: #fff; + background-color: #dc3545; } -blockquote footer:before, -blockquote small:before, -blockquote .small:before { - content: '\2014 \00A0'; + +.badge-danger[href]:focus, .badge-danger[href]:hover { + color: #fff; + text-decoration: none; + background-color: #bd2130; } -.blockquote-reverse, -blockquote.pull-right { - border-right: 5px solid #6aae7a; + +.badge-light { + color: #111; + background-color: #f8f9fa; } -address { - margin-bottom: 20px; - line-height: 1.42857143; + +.badge-light[href]:focus, .badge-light[href]:hover { + color: #111; + text-decoration: none; + background-color: #dae0e5; } -.panel { - margin-bottom: 20px; - background-color: #ffffff; - border: 1px solid transparent; + +.badge-dark { + color: #fff; + background-color: #343a40; +} + +.badge-dark[href]:focus, .badge-dark[href]:hover { + color: #fff; + text-decoration: none; + background-color: #1d2124; +} + +/* +* 7.CODE +*/ +code { + font-size: 87.5%; + color: #e83e8c; border-radius: 0; - -webkit-box-shadow: 0 0 0; - box-shadow: 0 0 0; } -.panel-heading { - border-top-right-radius: 0; + +a > code { + padding: 0; + color: inherit; + background-color: inherit; +} + +/* +* 8. NAV +*/ +.nav-link { + padding: 0.5rem 1rem; +} + +.nav-link.disabled { + color: #868e96; +} + +.nav-tabs .nav-item { + margin-bottom: -1px; +} + +.nav-tabs .nav-link { + border: 1px solid transparent; border-top-left-radius: 0; - text-transform: uppercase; - letter-spacing: 0.08em; - padding: 15px 15px; + border-top-right-radius: 0; } -.progress { - overflow: hidden; - height: 20px; - margin-bottom: 20px; - background-color: #f5f5f5; - border-radius: 0; - -webkit-box-shadow: none; - box-shadow: none; + +.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover { + border-color: #e9ecef #e9ecef #dee2e6; } -.panel-group { - margin-bottom: 20px; + +.nav-tabs .nav-link.disabled { + color: #868e96; } -.panel-group .panel { - margin-bottom: 0; + +.nav-tabs .nav-link.active, +.nav-tabs .nav-item.show .nav-link { + color: #495057; + background-color: #fff; +} + +.nav-tabs .dropdown-menu { + margin-top: -1px; +} + +.nav-pills .nav-link { border-radius: 0; - overflow: hidden; } -.panel-group .panel + .panel { - margin-top: 5px; + +.nav-pills .nav-link.active, +.nav-pills .show > .nav-link { + color: #fff; + background-color: #6aae7a; } -.panel-group.accordion .panel { - border-color: #ccc; + +/* +* 9. CARD +*/ +.card { + background-color: #fff; + border: 1px solid rgba(0, 0, 0, 0.125); + border-radius: 0; } -.panel-primary { - border-color: #6aae7a; + +.card > .list-group:first-child .list-group-item:first-child { + border-top-left-radius: 0; + border-top-right-radius: 0; } -.panel-primary > .panel-heading { - color: #ffffff; - background-color: #6aae7a; - border-color: #6aae7a; + +.card > .list-group:last-child .list-group-item:last-child { + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; } -.panel-primary > .panel-heading + .panel-collapse > .panel-body { - border-top-color: #6aae7a; + +.card-body { + padding: 1.25rem; } -.panel-primary > .panel-heading .badge { - color: #6aae7a; - background-color: #ffffff; + +.card-title { + margin-bottom: 0.75rem; } -.panel-primary > .panel-footer + .panel-collapse > .panel-body { - border-bottom-color: #6aae7a; + +.card-subtitle { + margin-top: -0.375rem; } -.panel-primary .panel-title { - font-weight: 300; + +.card-link + .card-link { + margin-left: 1.25rem; } -.panel-primary .panel-title a:hover { - color: #fff; - text-decoration: none; + +.card-header { + padding: 0.75rem 1.25rem; + background-color: rgba(0, 0, 0, 0.03); + border-bottom: 1px solid rgba(0, 0, 0, 0.125); } -a.badge:hover, -a.badge:focus { - color: #ffffff; - text-decoration: none; - cursor: pointer; + +.card-header:first-child { + border-radius: calc(0 - 1px) calc(0 - 1px) 0 0; } -a.list-group-item.active > .badge, -.nav-pills > .active > a > .badge { - color: #6aae7a; - background-color: #ffffff; + +.card-header-transparent { + background-color: rgba(0, 0, 0, 0.3); + border-bottom: none; } -.nav-pills > li > a > .badge { - margin-left: 3px; + +.card-footer { + padding: 0.75rem 1.25rem; + background-color: #f8f9fa; + border-top: 1px solid rgba(0, 0, 0, 0.125); +} + +.card-footer:last-child { + border-radius: 0 0 calc(0 - 1px) calc(0 - 1px); +} + +.card-header-tabs { + margin-right: -0.625rem; + margin-bottom: -0.75rem; + margin-left: -0.625rem; + border-bottom: 0; } -.progress-bar-primary { - background-color: #6aae7a; + +.card-header-pills { + margin-right: -0.625rem; + margin-left: -0.625rem; } -.progress-striped .progress-bar-primary { - background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); - background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); - background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); + +.card-img-overlay { + padding: 1.25rem; } -/*! - * Yamm!3 - Yet another megamenu for Bootstrap 3 - * http://geedmo.github.com/yamm3 - * - * @geedmo - Licensed under the MIT license - */ -.yamm .nav, -.yamm .collapse, -.yamm .dropup.use-yamm, -.yamm .dropdown.use-yamm { - position: static; + +.card-img-overlay-opacity { + background: rgba(0, 0, 0, 0.2); } -.yamm .container { - position: relative; + +.card-img { + border-radius: calc(0 - 1px); } -.yamm .dropdown-menu { - left: auto; + +.card-img-top { + border-top-left-radius: calc(0 - 1px); + border-top-right-radius: calc(0 - 1px); } -.yamm .nav.navbar-right .dropdown-menu { - left: auto; - right: 0; + +.card-img-bottom { + border-bottom-right-radius: calc(0 - 1px); + border-bottom-left-radius: calc(0 - 1px); } -.yamm .yamm-content { - padding: 20px 30px; + +.card-deck .card { + margin-bottom: 15px; } -.yamm .dropdown.yamm-fw .dropdown-menu { - left: 15px; - right: 15px; + +@media (min-width: 576px) { + .card-deck { + margin-right: -15px; + margin-left: -15px; + } + .card-deck .card { + margin-right: 15px; + margin-left: 15px; + } } diff --git a/static/css/style.lightblue.css b/static/css/style.lightblue.css new file mode 100644 index 000000000..b578f2866 --- /dev/null +++ b/static/css/style.lightblue.css @@ -0,0 +1,3702 @@ +/* + +================================================================================== +================================================================================== + +Universal Template + +https://bootstrapious.com/p/universal-business-e-commerce-template + +================================================================================== +================================================================================== + +*/ +/* +* +* ===================== +* GENERAL +* ===================== +* +*/ +.boxed { + background: url("../img/boxed-pattern.png"); +} + +.boxed #all { + max-width: 1200px; + margin: 0 auto; + background: #fff; + -webkit-box-shadow: 0 0 5px #ccc; + box-shadow: 0 0 5px #ccc; +} + +a { + -webkit-transition: all 0.3s !important; + transition: all 0.3s !important; + display: inline-block; +} + +button { + cursor: pointer; +} + +strong { + font-weight: 700; +} + +p.lead { + margin-bottom: 40px; +} + +.accent { + color: #38a7bb; +} + +.tooltip { + font-family: "Roboto", Helvetica, Arial, sans-serif; +} + +.bs-select .dropdown-menu .dropdown-menu { + min-height: 20px; + display: block; +} + +.bs-select .dropdown-menu .dropdown-menu a { + padding: 6px 10px; + color: #666; + font-weight: 700; + text-decoration: none !important; + display: block; + font-size: .8rem; + text-transform: uppercase; + letter-spacing: 0.1em; + font-family: "Roboto", Helvetica, Arial, sans-serif; + outline: none; +} + +.heading-light { + font-weight: 300 !important; +} + +.text-bold { + font-weight: 700; +} + +.text-small { + font-size: 0.9rem; +} + +.text-uppercase { + text-transform: uppercase; + letter-spacing: 0.1em; +} + +.no-letter-spacing { + letter-spacing: 0 !important; +} + +.bar { + padding: 60px 0; +} + +.bar.padding-big { + padding: 50px 0; +} + +.pagination { + margin-top: 20px; +} + +#pagination .pagination { + margin-bottom: 40px; +} + +.text-sm, .form-group label, #blog-listing-big .date-comments a, #blog-listing-medium .date-comments a, #blog-listing-big p.intro, #blog-listing-medium p.intro { + font-size: 0.9rem; +} + +.text-xs { + font-size: 0.9rem; +} + +.text-xs * { + font-size: 0.9rem; +} + +@media (max-width: 767px) { + .text-sm-center { + text-align: center !important; + } +} + +@media (max-width: 991px) { + .text-md-center { + text-align: center !important; + } +} + +@media (max-width: 1199px) { + .text-lg-center { + text-align: center !important; + } +} + +@media (max-width: 767px) { + .text-center-sm { + text-align: center !important; + } +} + +@media (max-width: 991px) { + .text-center-md { + text-align: center !important; + } +} + +@media (max-width: 1199px) { + .text-center-sm, .text-center-xs { + text-align: center !important; + } +} + +.bg-gray { + background: #e9ecef !important; +} + +.bg-gray-dark { + background: #555 !important; +} + +.bg-primary { + background: #38a7bb !important; +} + +.color-white { + color: #fff !important; +} + +.color-white * { + color: #fff !important; +} + +.bg-white { + background: #fff !important; +} + +.bg-fixed { + background-attachment: fixed !important; +} + +.light-gray { + background: #eee; +} + +.no-mb { + margin-bottom: 0 !important; +} + +.no-mt { + margin-top: 0 !important; +} + +.no-horizontal-padding { + padding-left: 0 !important; + padding-right: 0 !important; +} + +.mb-small { + margin-bottom: 20px !important; +} + +.no-padding-top { + padding-top: 0 !important; +} + +.no-padding-bottom { + padding-bottom: 0 !important; +} + +.padding-horizontal { + padding-left: 30px !important; + padding-right: 30px !important; +} + +.relative-positioned { + position: relative; + z-index: 1; +} + +.jumbotron { + margin: 0; +} + +.owl-carousel.equal-height .owl-stage { + display: -webkit-box !important; + display: -ms-flexbox !important; + display: flex !important; + -webkit-box-align: stretch !important; + -ms-flex-align: stretch !important; + align-items: stretch !important; +} + +.background-pentagon, #heading-breadcrumbs { + background: url("../img/texture-bw.png") center center repeat; + border-top: 1px solid #999; + border-bottom: 1px solid #999; +} + +.heading, .panel-heading { + margin-bottom: 1rem; +} + +.heading h1, .panel-heading h1, .heading h2, .panel-heading h2, .heading h3, .panel-heading h3, .heading h4, .panel-heading h4, .heading h5, .panel-heading h5, .heading h6, .panel-heading h6 { + line-height: 1.1; + display: inline-block; + margin-bottom: 0; + padding-bottom: 10px; + text-transform: uppercase; + letter-spacing: 0.1em; +} + +.heading h1:after, .panel-heading h1:after, .heading h2:after, .panel-heading h2:after, .heading h3:after, .panel-heading h3:after, .heading h4:after, .panel-heading h4:after, .heading h5:after, .panel-heading h5:after, .heading h6:after, .panel-heading h6:after { + content: " "; + display: block; + width: 100px; + height: 2px; + margin-top: .6rem; + background: #38a7bb; +} + +.heading.text-center h1:after, .text-center.panel-heading h1:after, .heading.text-center h2:after, .text-center.panel-heading h2:after, .heading.text-center h3:after, .text-center.panel-heading h3:after, .heading.text-center h4:after, .text-center.panel-heading h4:after, .heading.text-center h5:after, .text-center.panel-heading h5:after, .heading.text-center h6:after, .text-center.panel-heading h6:after { + margin-left: auto; + margin-right: auto; +} + +.buttons a { + margin: 0 3px; +} + +.dropdown-item.active, .dropdown-item:active { + background: #80cbd9; +} + +.card { + border-radius: 0; + margin-bottom: 10px; +} + +.card-header { + border-radius: 0; + padding: 20px; +} + +.card-header h1, .card-header h2, .card-header h3, .card-header h4, .card-header h5, .card-header h6 { + text-transform: uppercase; + letter-spacing: 0.1em; + font-size: 0.935rem; + margin: 0 !important; +} + +.card-header a { + color: #333; +} + +.card-body p { + font-size: 0.9rem; + color: #333; +} + +.alert { + border-radius: 0; +} + +#heading-breadcrumbs { + padding: 2rem 0; + border-top: none !important; + border-bottom: none !important; +} + +#heading-breadcrumbs .breadcrumb { + margin-bottom: 0; + background: none; + font-size: 0.9rem; +} + +#heading-breadcrumbs h1 { + text-transform: uppercase; + letter-spacing: 0.1em; + margin-bottom: 0; +} + +#heading-breadcrumbs li { + text-transform: uppercase; + letter-spacing: 0.1em; +} + +.row.no-space { + margin-left: 0; + margin-right: 0; +} + +.row.no-space div[class*="col-"] { + padding: 0; +} + +.row.no-space .box-image { + margin: 0; +} + +.owl-carousel .owl-dots { + margin-top: 20px; + text-align: center; +} + +.owl-carousel .owl-dots .owl-dot { + display: inline-block; + margin: 0 5px; +} + +.owl-carousel .owl-dots .owl-dot.active span { + background: #fff; +} + +.owl-carousel .owl-dots .owl-dot span { + display: block; + width: 12px; + height: 12px; + border-radius: 50%; + background: #aaa; +} + +.dark-mask { + background: rgba(0, 0, 0, 0.3); + width: 100%; + height: 100%; + position: absolute; + top: 0; + left: 0; + z-index: -1; +} + +.dark-mask.mask-primary { + background: rgba(56, 167, 187, 0.9); +} + +.icon-outlined { + width: 80px; + height: 80px; + line-height: 80px; + text-align: center; + display: inline-block; + font-size: 1.4rem; + border-radius: 50%; + border: 2px solid #fff; + margin-bottom: 20px; +} + +.icon-outlined.icon-lg { + font-size: 2rem; +} + +.icon-outlined.icon-sm { + width: 55px; + height: 55px; + line-height: 55px; + text-align: center; + font-size: 1.15rem; +} + +.icon-outlined.icon-thin { + border-width: 1px; +} + +.icon-filled { + width: 24px; + height: 24px; + line-height: 24px; + background: #38a7bb; + color: #fff; + text-align: center; + border-radius: 50%; + font-size: 0.75rem; +} + +.ul-icons .icon-filled { + display: inline-block; + margin-right: 10px; +} + +.ul-icons li { + margin-bottom: 20px; + color: #555; + font-size: 0.9rem; +} + +.ul-icons a { + display: inline; +} + +ul.social { + margin: 15px 0; +} + +ul.social a { + width: 28px; + height: 28px; + line-height: 28px; + background: #555; + color: #fff; + text-align: center; + border-radius: 50%; + margin: 0 2px; + font-size: 0.8rem; +} + +ul.social a:hover { + -webkit-transform: scale(1.1); + transform: scale(1.1); +} + +ul.social a.facebook { + background: #4561ae; +} + +ul.social a.gplus { + background: #c22026; +} + +ul.social a.twitter { + background: #34ccff; +} + +ul.social a.email { + background: #4b8046; +} + +.showcase { + color: #555; +} + +.showcase .icon-outlined { + border-color: #555; +} + +.showcase .counter { + margin-bottom: 20px; + display: inline-block; + margin-top: 0; +} + +.showcase h4 { + text-transform: uppercase; + letter-spacing: 0.1em; + font-size: 0.935rem; + margin-top: 0; +} + +.form-control { + border-radius: 0; +} + +.form-control:focus { + border-color: #38a7bb; + -webkit-box-shadow: 0 0 0 0.2rem rgba(56, 167, 187, 0.25); + box-shadow: 0 0 0 0.2rem rgba(56, 167, 187, 0.25); +} + +.form-group label { + color: #555; +} + +.card-primary { + border-radius: 0; + border-color: #38a7bb; +} + +.card-primary .card-header { + background: #38a7bb; + color: #fff; + border: none; + border-radius: 0; +} + +.card-primary .card-header a { + color: #fff; + text-transform: uppercase; + font-weight: 300; + letter-spacing: 0.05em; +} + +.card-primary .card-body { + border-color: #38a7bb; +} + +.card-body li { + font-size: 0.9rem; +} + +table { + font-size: 0.9rem; +} + +table img { + min-width: 50px !important; + max-width: 50px !important; + height: 50px; +} + +table input[type="number"] { + max-width: 50px; +} + +.nav-tabs { + border-bottom: none; +} + +.nav-tabs a.nav-link { + border-radius: 0 !important; + font-size: 0.9rem; +} + +.tab-content { + padding: 20px; + border: 1px solid #ddd; + font-size: 0.9rem; +} + +.top-bar { + background: #555; + color: #fff; + font-size: 0.9rem; + padding: 10px 0; +} + +.top-bar.top-bar-light { + background: #fff; + color: #555; + border-bottom: 1px solid #ddd; +} + +.top-bar.top-bar-light a.login-btn, .top-bar.top-bar-light a.signup-btn { + color: #555 !important; +} + +.top-bar.top-bar-light a.login-btn span, .top-bar.top-bar-light a.signup-btn span { + display: inline-block; +} + +.top-bar p { + margin-bottom: 0; + font-size: 0.75rem; +} + +.top-bar ul { + margin-bottom: 0; +} + +.top-bar a.login-btn, .top-bar a.signup-btn { + color: #eee; + text-transform: uppercase; + letter-spacing: 0.1em; + text-decoration: none !important; + font-size: 0.75rem; + font-weight: 700; + margin-right: 10px; +} + +.top-bar a.login-btn i, .top-bar a.signup-btn i { + margin-right: 10px; +} + +.top-bar ul.social-custom { + margin-left: 20px; +} + +.top-bar ul.social-custom li { + padding: 0; + margin: 0; +} + +.top-bar ul.social-custom a { + text-decoration: none !important; + font-size: 0.7rem; + width: 26px; + height: 26px; + line-height: 26px; + color: #999; + text-align: center; + border-radius: 50%; + margin: 0; +} + +.top-bar ul.social-custom a:hover { + background: #38a7bb; + color: #fff; +} + +.top-bar .contact-info { + margin-right: 20px; +} + +.top-bar .contact-info a { + font-size: 0.8rem; +} + +.modal .modal-header h4 { + text-transform: uppercase; + letter-spacing: 0.1em; +} + +.modal input::-moz-placeholder { + font-size: 0.85rem; +} + +.modal input::-webkit-input-placeholder { + font-size: 0.85rem; +} + +.modal input:-ms-input-placeholder { + font-size: 0.85rem; +} + +.modal p { + font-size: 0.85rem; +} + +header.nav-holder.sticky { + position: fixed; + top: 0; + left: 0; + width: 100%; + background: #fff; + z-index: 999; + -webkit-box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); + box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); +} + +#navbar { + background: #fff; + padding-top: 0; + padding-bottom: 0; +} + +#navbar .navbar-toggler { + font-size: 0.9rem; + padding: 10px 15px; + border-color: #ddd; +} + +#navbar ul ul a { + padding-left: 0 !important; +} + +#navbar .dropdown-menu { + border-radius: 0; + -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); + box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); + margin-top: 0; + padding-top: 0; + padding-bottom: 0; +} + +#navbar .dropdown-menu .dropdown-item { + padding: 0; +} + +#navbar .dropdown-menu h5 { + text-transform: uppercase; + letter-spacing: 0.1em; + padding-bottom: 5px; + border-bottom: 1px dotted #ccc; + margin-top: .7rem; + margin-bottom: .5rem; +} + +#navbar .dropdown-menu a.nav-link { + font-size: 0.75rem; + letter-spacing: 0.1em; + text-transform: uppercase !important; + border-bottom: 1px solid #eee; + padding: 15px 20px !important; +} + +#navbar .dropdown-menu a.nav-link:hover { + -webkit-transform: translateX(5px); + transform: translateX(5px); + color: #38a7bb; +} + +#navbar .dropdown-submenu { + position: relative; +} + +#navbar .dropdown-submenu > .dropdown-menu { + top: 0; + left: 100%; + margin-top: -2px; + font-size: 1em; +} + +#navbar .menu-large { + position: static !important; +} + +#navbar .menu-large .megamenu { + padding: 20px; + width: 100%; + max-width: 1140px; + left: 50%; + -webkit-transform: translateX(-50%); + transform: translateX(-50%); + margin-top: -1px; +} + +#navbar .menu-large a.nav-link { + padding: 7px !important; + padding-left: 0 !important; +} + +#navbar .navbar-nav > li.active > a { + background: #38a7bb !important; + color: #fff !important; + text-decoration: none !important; + border-color: #2c8494 !important; +} + +#navbar .navbar-nav > li > a { + margin: 0; + padding: 1.4rem 1rem 1.6rem; + color: #555; + font-weight: 600; + text-transform: uppercase; + letter-spacing: 0.1em; + font-size: 0.9rem; + text-decoration: none; + border-top: .3rem solid transparent; +} + +#navbar .navbar-nav > li > a:hover { + background: rgba(56, 167, 187, 0.5); + border-color: rgba(56, 167, 187, 0.8); +} + +#navbar .navbar-nav > li > a:focus { + background: #38a7bb !important; + color: #fff !important; + text-decoration: none !important; + border-color: #2c8494 !important; +} + +#navbar.nav-light .navbar-nav > li.active a.dropdown-toggle, +#navbar.nav-light .navbar-nav > li.active a.dropdown-toggle:hover { + background: none !important; + color: #555 !important; + text-decoration: underline !important; + border-color: #38a7bb !important; +} + +#navbar.nav-light .navbar-nav > li > a:hover { + background: none !important; + border-color: #6cc3d3 !important; +} + +#navbar.nav-light .navbar-nav > li > a:focus { + background: none !important; + color: #555 !important; + text-decoration: underline !important; + border-color: #38a7bb !important; +} + +@media (max-width: 991px) { + #navbar { + padding-top: 1rem; + padding-bottom: 1rem; + } + #navbar .menu-large .megamenu { + width: 100%; + left: 0 !important; + -webkit-transform: none !important; + transform: none !important; + } + #navbar .navbar-collapse { + max-height: 600px; + overflow-y: auto; + margin-top: 1rem; + } + #navbar .navbar-nav > li > a { + padding: 0 10px; + height: 45px; + line-height: 45px; + border-top: 0; + font-size: 0.85rem; + width: 100%; + } + #navbar .navbar-nav > li > a:hover { + background: rgba(56, 167, 187, 0.5); + border-color: rgba(56, 167, 187, 0.8); + } + #navbar .dropdown-menu { + border: none; + -webkit-box-shadow: none; + box-shadow: none; + } +} + +.btn { + text-transform: uppercase; + letter-spacing: 0.1em; +} + +.btn-template-main { + background: #38a7bb; + border: 1px solid #38a7bb !important; + color: #fff !important; + border-radius: 0 !important; + text-decoration: none; +} + +.btn-template-main:hover, .btn-template-main:focus { + background: #3295a7; + color: #fff !important; + border-color: #3295a7 !important; +} + +.btn-template-white { + background: #fff; + color: #38a7bb !important; + border: 1px solid #38a7bb !important; + border-radius: 0 !important; + text-decoration: none; +} + +.btn-template-white:hover, .btn-template-white:focus { + background: #38a7bb !important; + color: #fff !important; +} + +.btn-template-outlined { + background: none; + border: 1px solid #38a7bb !important; + color: #38a7bb; + border-radius: 0 !important; + text-decoration: none; +} + +.btn-template-outlined:hover, .btn-template-outlined:focus { + background: #38a7bb; + color: #fff !important; +} + +.btn-template-outlined-white { + background: none; + border: 1px solid #fff !important; + color: #fff; + border-radius: 0 !important; + text-decoration: none; +} + +.btn-template-outlined-white:hover, .btn-template-outlined-white:focus { + background: #fff; + color: #38a7bb !important; +} + +.btn-template-outlined-black { + background: none; + border: 1px solid #333 !important; + color: #333; + border-radius: 0 !important; + text-decoration: none; +} + +.btn-template-outlined-black:hover, .btn-template-outlined-black:focus { + background: #333 !important; + color: #fff !important; +} + +.features-buttons button { + margin-bottom: 20px; +} + +.customers { + margin-bottom: 40px; +} + +.customers .item { + margin: 0 20px; +} + +.customers .item img { + -webkit-filter: grayscale(100%); + filter: grayscale(100%); + -webkit-transition: all 0.3s; + transition: all 0.3s; +} + +.customers .item img:hover { + -webkit-filter: grayscale(0%); + filter: grayscale(0%); +} + +.testimonials .item { + margin: 0 5px; + height: 100%; +} + +.testimonials .testimonial { + padding: 20px; + background: #fff; + height: 100%; +} + +.testimonials .text { + font-size: 0.85rem; +} + +.testimonials .text p { + color: #999; +} + +.testimonials .avatar { + min-width: 60px; + max-width: 60px; + min-height: 60px; + max-height: 60px; + border-radius: 50%; + overflow: hidden; + margin-left: 10px; +} + +.testimonials .bottom { + width: 100%; +} + +.testimonials .bottom .testimonial-info { + text-align: right; +} + +.testimonials .bottom h5 { + text-transform: uppercase; + letter-spacing: 0.1em; + margin-bottom: 5px; +} + +.testimonials .bottom p { + font-size: 0.75rem; + color: #999; + margin-bottom: 0; +} + +.testimonials .icon { + color: #38a7bb; + font-size: 2rem; + margin-right: 20px; +} + +.testimonials .owl-carousel .owl-stage { + display: -webkit-box !important; + display: -ms-flexbox !important; + display: flex !important; + -webkit-box-align: stretch !important; + -ms-flex-align: stretch !important; + align-items: stretch !important; +} + +.testimonials .owl-dot.active span { + background: #38a7bb !important; +} + +.home-carousel { + color: #fff; +} + +.home-carousel .owl-carousel { + padding-top: 60px; + padding-bottom: 20px; +} + +.home-carousel h1, .home-carousel h2 { + text-transform: uppercase; + letter-spacing: 0.1em; +} + +.home-carousel li, .home-carousel p { + text-transform: uppercase; + letter-spacing: 0.1em; + font-weight: 700; + font-size: 1.1rem; + margin-bottom: 10px; +} + +.home-carousel p img { + max-width: 200px; +} + +.project .owl-dot.active span { + background: #38a7bb !important; +} + +.project .owl-nav { + position: absolute; + top: 0; + right: 0; + left: auto; + bottom: auto; + width: 100%; + padding: 20px; + text-align: right; +} + +.project .owl-nav .owl-prev, .project .owl-nav .owl-next { + width: 30px; + height: 30px; + line-height: 30px; + background: #fff; + color: #38a7bb; + text-align: center; + border-radius: 50%; + display: inline-block; + margin: 0 5px; + -webkit-transition: all 0.3s; + transition: all 0.3s; +} + +.project .owl-nav .owl-prev:hover, .project .owl-nav .owl-next:hover { + background: #38a7bb; + color: #fff; +} + +@media (max-width: 767px) { + .home-carousel { + text-align: center !important; + } + .home-carousel p, .home-carousel h1, .home-carousel ul { + text-align: center !important; + } + .home-carousel img { + margin: 10px auto; + } +} + +.owl-thumbs { + display: -webkit-box; + display: -ms-flexbox; + display: flex; +} + +.owl-thumbs button { + background: none; + border: none; + margin: 5px; + outline: none; +} + +.home-blog-post { + margin: 15px 0; +} + +.home-blog-post .image { + position: relative; + margin-bottom: 15px; +} + +.home-blog-post .overlay { + width: 100%; + height: 100%; + background: rgba(56, 167, 187, 0.6); + position: absolute; + top: 0; + opacity: 0; + -webkit-transition: all 0.5s; + transition: all 0.5s; +} + +.home-blog-post .overlay a { + -webkit-transform: translateY(30px); + transform: translateY(30px); + opacity: 0; +} + +.home-blog-post .overlay i { + margin-right: 5px; +} + +.home-blog-post .text { + text-align: center; +} + +.home-blog-post .text .intro { + text-align: left; + margin-bottom: 20px; + color: #888; + font-size: 0.9rem; +} + +.home-blog-post h4 { + margin: 10px 0; + text-transform: uppercase; + letter-spacing: 0.1em; +} + +.home-blog-post .author-category { + font-size: 0.75rem; + color: #999; + text-transform: uppercase; + letter-spacing: 0.1em; +} + +.home-blog-post .author-category a { + font-weight: 500; +} + +.home-blog-post:hover .overlay { + opacity: 1; +} + +.home-blog-post:hover .overlay a { + -webkit-transform: none; + transform: none; + opacity: 1; +} + +#blog-listing-big .post, #blog-listing-medium .post { + margin-bottom: 60px; +} + +#blog-listing-big .image, #blog-listing-medium .image { + margin-bottom: 15px; +} + +#blog-listing-big h2 a, #blog-listing-medium h2 a { + color: #555; + text-transform: uppercase; + letter-spacing: 0.1em; +} + +#blog-listing-big .author-category, #blog-listing-medium .author-category { + color: #999; + text-transform: uppercase; + letter-spacing: 0.1em; + font-weight: 300; + margin-bottom: 10px; + font-size: .9rem; +} + +#blog-listing-big .author-category a, #blog-listing-medium .author-category a { + font-weight: 500; + margin-bottom: 0; +} + +#blog-listing-big .date-comments, #blog-listing-medium .date-comments { + margin-bottom: 0; +} + +#blog-listing-big .date-comments a, #blog-listing-medium .date-comments a { + color: #999; + margin-left: 25px; +} + +#blog-listing-big .date-comments i, #blog-listing-medium .date-comments i { + margin-right: 5px; +} + +#blog-listing-big p.intro, #blog-listing-medium p.intro { + margin-top: 10px; + color: #777; +} + +.pager { + padding: 20px 0; + margin-top: 20px; + border-top: 1px solid #e6e6e6; +} + +.disabled a, .disabled a:hover { + border-color: #999 !important; + color: #999 !important; + background: none !important; + cursor: not-allowed; +} + +#blog-post #post-content { + margin-bottom: 20px; +} + +#blog-post .comment { + margin-bottom: 25px; +} + +#blog-post .comment .posted { + color: #999; + font-size: 0.8rem; + margin-bottom: 10px; +} + +#blog-post .comment.last { + margin-bottom: 0; +} + +#blog-post .comment p { + font-size: 0.9rem; +} + +#blog-post #comments, #blog-post #comment-form { + padding: 20px 0; + margin-top: 20px; + border-top: solid 1px #eee; +} + +#blog-post #comments h4, #blog-post #comment-form h4 { + margin-bottom: 1.5rem; +} + +#blog-post #comment-form { + margin-bottom: 20px; +} + +#blog-post .reply i { + margin-right: 5px; +} + +.box-simple { + margin-bottom: 40px; + text-align: center; +} + +.box-simple:hover .icon-outlined { + -webkit-transform: scale(1.1); + transform: scale(1.1); +} + +.box-simple .icon-outlined { + color: #38a7bb; + border: 1px solid #38a7bb; + -webkit-transition: all 0.3s; + transition: all 0.3s; +} + +.box-simple h3 { + text-transform: uppercase; + letter-spacing: 0.1em; +} + +.box-simple p { + color: #999; + margin: 20px 0; + font-size: 0.9rem; +} + +.box-simple.box-white { + border: dotted 1px #999; + padding: 15px 20px; + margin-bottom: 0; +} + +.box-simple.box-white .icon { + font-size: 2rem; + margin-bottom: 1rem; +} + +.box-simple.box-white p { + color: #999; + margin-bottom: 5px; +} + +.box-simple.box-dark { + border: dotted 1px #999; + padding: 15px 20px; + margin-bottom: 0; + color: #fff; + background: #555; +} + +.box-simple.box-dark .icon { + font-size: 2rem; + margin-bottom: 1rem; +} + +.box-simple.box-dark p { + margin-bottom: 5px; + color: #fff; +} + +.same-height div[class*="col-"] { + margin-bottom: 30px; +} + +.same-height .box-white, .same-height.box-dark { + height: 100%; +} + +.box-image { + position: relative; + margin: 20px 0; +} + +.box-image:hover .overlay { + opacity: 1; +} + +.box-image:hover h3, .box-image:hover p, .box-image:hover .buttons { + opacity: 1; + -webkit-transform: none; + transform: none; +} + +.box-image:hover p { + -webkit-transition-delay: 0.1s; + transition-delay: 0.1s; +} + +.box-image:hover .buttons { + -webkit-transition-delay: 0.2s; + transition-delay: 0.2s; +} + +.box-image .name { + margin-bottom: 20px; +} + +.box-image a { + text-decoration: none !important; +} + +.box-image h3 { + font-size: 1.125rem; + text-transform: uppercase; + letter-spacing: 0.1em; + -webkit-transition: all 0.3s; + transition: all 0.3s; + opacity: 0; + -webkit-transform: translateY(-50px); + transform: translateY(-50px); +} + +.box-image .overlay { + width: 100%; + height: 100%; + position: absolute; + top: 0; + left: 0; + background: rgba(56, 167, 187, 0.6); + padding: 20px; + -webkit-transition: all 0.3s; + transition: all 0.3s; + opacity: 0; +} + +.box-image .buttons { + opacity: 0; + -webkit-transition: all 0.3s; + transition: all 0.3s; + -webkit-transform: translateY(20px); + transform: translateY(20px); +} + +.box-image .buttons a { + margin: 0 3px; +} + +.box-image p { + -webkit-transition: all 0.3s; + transition: all 0.3s; + opacity: 0; + -webkit-transform: translateY(20px); + transform: translateY(20px); +} + +.box-image-text .content { + text-align: center; +} + +.box-image-text p { + color: #777; + font-size: 0.9rem; +} + +.see-more { + margin-top: 40px; +} + +.see-more p { + font-size: 1.8rem; + font-weight: 100; +} + +.box { + margin: 80px 0; + border-top: 1px solid #ddd; + border-bottom: 1px solid #ddd; + padding: 20px; +} + +.box a.btn { + margin-top: 25px; +} + +.box .box-header { + background: #f7f7f7; + margin: 20px 0 20px; + padding: 20px; + border-top: 1px solid #eee; + text-transform: uppercase; + letter-spacing: 0.1em; +} + +.box .box-footer { + background: #f7f7f7; + margin-top: 30px; + padding: 20px; + border-top: 1px solid #eee; +} + +.box.shipping-method, .box.payment-method { + margin: 0; + margin-bottom: 20px; +} + +.box.shipping-method h4, .box.payment-method h4 { + text-transform: uppercase; + letter-spacing: 0.1em; + margin-bottom: 5px; +} + +.box.shipping-method p, .box.payment-method p { + font-size: 0.9rem; + color: #555; +} + +.box-image-text { + margin: 15px 0; +} + +.box-image-text .image { + position: relative; + margin-bottom: 15px; +} + +.box-image-text .overlay { + width: 100%; + height: 100%; + background: rgba(56, 167, 187, 0.6); + position: absolute; + top: 0; + opacity: 0; + -webkit-transition: all 0.5s; + transition: all 0.5s; +} + +.box-image-text .overlay a { + -webkit-transform: translateY(30px); + transform: translateY(30px); + opacity: 0; +} + +.box-image-text .overlay i { + margin-right: 5px; +} + +.box-image-text .text { + text-align: center; +} + +.box-image-text .text .intro { + text-align: left; + margin-bottom: 20px; + color: #888; + font-size: 0.9rem; +} + +.box-image-text h4 { + margin: 10px 0; + text-transform: uppercase; + letter-spacing: 0.1em; +} + +.box-image-text .author-category { + font-size: 0.75rem; + color: #999; + text-transform: uppercase; + letter-spacing: 0.1em; +} + +.box-image-text .author-category a { + font-weight: 500; +} + +.box-image-text:hover .overlay { + opacity: 1; +} + +.box-image-text:hover .overlay a { + -webkit-transform: none; + transform: none; + opacity: 1; +} + +.box-footer a { + margin: 0 !important; +} + +.box-footer .right-col i { + margin-left: 5px; +} + +.box-footer .left-col i { + margin-right: 5px; +} + +@media (max-width: 767px) { + .box-footer { + -webkit-box-pack: center !important; + -ms-flex-pack: center !important; + justify-content: center !important; + } + .box-footer a { + margin-bottom: 10px !important; + } +} + +.jumbotron h1, .jumbotron h2 { + letter-spacing: 0.1em; +} + +.jumbotron p { + letter-spacing: 0.1em; + font-size: 1.3rem; +} + +.package { + text-align: center; + border: 1px solid #38a7bb; + margin-top: 25px; + margin-bottom: 20px; + padding-bottom: 15px; + overflow: hidden; +} + +.package .package-header { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + height: 55px; +} + +.package .package-header h5 { + margin: 0; + text-transform: uppercase; + letter-spacing: 0.1em; + display: inline-block; + color: #555; +} + +.package .package-header .meta-text { + font-size: 0.8rem; +} + +.package h4 { + margin-top: 1rem; + margin-bottom: 0; + color: #333; +} + +.package .price-container { + margin-bottom: 20px; +} + +.package .price-container span.period { + color: #777; + font-size: 0.9rem; + margin-left: 10px; +} + +.package ul { + padding: 0 30px; +} + +.package ul li { + padding: 10px; + border-bottom: 1px solid #eee; + color: #555; + font-size: 0.9rem; +} + +.package ul i { + margin-right: 10px; +} + +.best-value .package { + margin-top: 0; + padding-bottom: 40px; + border: 1px solid #38a7bb; +} + +.best-value .package .package-header { + height: 85px; +} + +.best-value .package .package-header h5 { + color: #fff; +} + +.team-member { + margin-bottom: 40px; +} + +.team-member .image { + margin-bottom: 1rem; +} + +.team-member a { + color: #333; +} + +.team-member a:hover { + color: #333; +} + +.team-member h3 { + font-size: 1.125rem; + text-transform: uppercase; + letter-spacing: 0.1em; + margin-bottom: 5px; +} + +.team-member p.role { + font-size: 0.8rem; + text-transform: uppercase; + color: #999; + margin-bottom: 0; +} + +.team-member p { + color: #999; + font-size: 0.8rem; +} + +.team-member-detail p:not(.lead) { + color: #555; + font-size: 0.9rem; +} + +.portfolio p { + color: #fff; +} + +.portfolio-project p { + font-size: 0.9rem; + color: #888; +} + +.portfolio-project .project-more p { + padding: 5px 0; + font-size: 0.85rem; +} + +.portfolio-project .project-more h4 { + margin-bottom: 5px; + text-transform: uppercase; + letter-spacing: 0.1em; + font-size: 0.88rem; + color: #555; +} + +.portfolio-showcase { + margin-bottom: 60px; +} + +.portfolio-showcase h3 { + text-transform: uppercase; + -webkit-transition-property: 0.1rem; + transition-property: 0.1rem; +} + +.portfolio-showcase .buttons { + margin-top: 40px; +} + +.portfolio-showcase p:not(.lead) { + color: #999; + font-size: 0.9rem; +} + +.portfolio-showcase p.lead { + color: #666; +} + +.product { + text-align: center; + position: relative; + margin-bottom: 40px; +} + +.product .image { + overflow: hidden; + max-height: 190px; +} + +.product .image a { + margin: 0; +} + +.product .text { + padding: 10px; + border-bottom: 1px solid #ddd; +} + +.product .text h3 { + min-height: 63px; +} + +.product .price { + font-size: 1.1rem; +} + +.product .price del { + color: #999; + display: inline-block; + margin-right: 5px; +} + +.product img { + -webkit-transition: all 0.3s; + transition: all 0.3s; +} + +.product:hover img { + -webkit-transform: scale(1.1); + transform: scale(1.1); +} + +.product:hover .text { + border-color: #555; +} + +.product a { + text-transform: uppercase; + letter-spacing: 0.1em; + color: #333; + text-decoration: none !important; + margin-top: 15px; +} + +.products-big .image { + min-height: 250px; + max-height: 250px; +} + +.goToDescription { + text-align: center; + font-size: 0.8rem; + margin-bottom: 40px; +} + +.goToDescription a { + color: #999; + text-decoration: underline; +} + +table tr td { + vertical-align: middle !important; +} + +#customer-orders a.btn { + margin-top: 0; +} + +#customer-orders table { + font-size: 0.9rem; +} + +#customer-orders th { + border-top: 0; +} + +#customer-order img { + width: 50px; +} + +#customer-order tfoot th { + font-size: 1.2rem; + font-weight: 300; +} + +#customer-order p { + font-size: 1.2rem; + font-weight: 300; +} + +#productMain #thumbs { + margin-top: 30px; +} + +#productMain input { + display: none; +} + +#productMain .sizes { + text-align: center; +} + +#productMain .sizes a { + text-decoration: none !important; +} + +#productMain .sizes a:hover { + background: #38a7bb; + color: #fff; +} + +#productMain .price { + text-align: center; + font-size: 2.5rem; + margin: 30px 0; + color: #555; +} + +#basket thead th { + border-top: none; +} + +#basket tfoot th { + font-size: 1.25rem; + color: #555; +} + +#order-summary tr td { + color: #999; +} + +#order-summary tr.total { + font-size: 1.25rem; + color: #555; + font-weight: 700; +} + +#order-summary tr.total td { + color: #555; +} + +#checkout .nav-pills { + margin-bottom: 30px; + border-bottom: 1px solid #38a7bb; +} + +#checkout .nav-pills a { + font-size: 0.9rem; + border-bottom: none !important; +} + +#checkout .nav-pills a.disabled { + cursor: not-allowed; +} + +#checkout form label { + margin-bottom: 5px; +} + +#checkout .payment-method:hover, #checkout .shipping-method:hover { + cursor: pointer; +} + +@media (max-width: 767px) { + .nav-pills { + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + } +} + +.sidebar-menu .badge { + font-weight: 700; + margin: 0; +} + +.sidebar-menu.with-icons a.nav-link { + position: relative; +} + +.sidebar-menu.with-icons a.nav-link::before { + content: '\f105'; + display: inline-block; + position: absolute; + top: 50%; + right: 15px; + -webkit-transform: translateY(-50%); + transform: translateY(-50%); + font-family: 'FontAwesome'; +} + +.panel-heading { + margin-bottom: 10px; +} + +.panel-heading h3 { + margin-top: 5px; +} + +.panel-heading .btn { + color: #fff; + text-decoration: none !important; +} + +.panel-heading .btn i { + margin-right: 7px; +} + +.panel-body p { + font-size: .9rem; + color: #555; +} + +.panel-body label { + font-size: 0.8rem; + font-weight: 400 !important; + color: #777; + opacity: 0.9; + display: inline-block; + cursor: pointer; +} + +.panel-body label input { + margin-right: 5px; +} + +.panel-body label:hover { + opacity: 1; +} + +.panel-body span.colour { + display: inline-block; + width: 14px; + height: 14px; + margin-top: 10px; + margin-left: 5px; + border: 1px solid #555; +} + +.panel-body span.colour.white { + background: #fff; +} + +.panel-body span.colour.blue { + background: #007bff; +} + +.panel-body span.colour.green { + background: #28a745; +} + +.panel-body span.colour.red { + background: #dc3545; +} + +.panel-body span.colour.yellow { + background: #ffc107; +} + +.nav-pills .nav-link { + border-radius: 0; +} + +.nav-pills .nav-link:hover { + background: #eee; +} + +.nav-pills .nav-link.active { + background: #38a7bb; +} + +.panel { + margin-bottom: 20px; +} + +.category-menu a.nav-link { + text-transform: uppercase; + letter-spacing: 0.1em; + font-weight: 700; +} + +ul ul a.nav-link { + padding-left: 30px !important; + font-size: 0.85rem; + text-transform: none !important; + font-weight: 400 !important; + color: #777; +} + +.tag-cloud a { + font-size: 0.8rem; + border: 1px solid #eee; + text-transform: uppercase; + letter-spacing: 0.1em; + font-weight: 600; + padding: 5px 10px; + text-transform: uppercase; + margin: 3px 0; + text-decoration: none !important; +} + +.tag-cloud a:hover { + border-color: #38a7bb; +} + +.tag-cloud i { + margin-right: 5px; +} + +.ribbon { + width: 80px; + height: 32px; + line-height: 32px; + background: #38a7bb; + color: #fff; + text-transform: uppercase; + letter-spacing: 0.1em; + font-weight: 700; + font-size: 0.9rem; + margin-bottom: 20px; + position: absolute; + top: 30px; + left: -15px; + text-align: center; +} + +.ribbon.sale { + background: #38a7bb; +} + +.ribbon.new { + background: #5bc0de; +} + +.ribbon.new::after { + content: ''; + border-top: 15px solid #1f7e9a; +} + +.ribbon.sold { + background: #f0ad4e; +} + +.ribbon.sold::after { + content: ''; + border-top: 15px solid #b06d0f; +} + +.ribbon.gift { + background: #5cb85c; +} + +.ribbon.gift::after { + content: ''; + border-top: 15px solid #2d672d; +} + +.ribbon:nth-of-type(2) { + top: 82px; +} + +.ribbon::after { + content: ''; + border-top: 15px solid #236874; + border-left: 15px solid transparent; + border-right: 0 solid transparent; + position: absolute; + bottom: -15px; + left: 0; + display: block; +} + +.badge { + font-weight: 400; + text-transform: uppercase; + letter-spacing: 0.1em; + padding: 3px 5px; +} + +#map { + border-top: 1px solid #38a7bb; + border-bottom: 1px solid #38a7bb; + height: 300px; +} + +.get-it { + background: #38a7bb; + color: #fff; + padding: 50px 0; +} + +.get-it h3 { + text-transform: uppercase; + letter-spacing: 0.1em; + margin: 0; +} + +footer.main-footer { + padding: 60px 0; + padding-bottom: 0; + background: #555; + color: #fff; +} + +footer.main-footer a { + color: inherit; + color: #eee; +} + +footer.main-footer h4 { + color: #eee; + margin: 10px 0; + text-transform: uppercase; + letter-spacing: 0.1em; +} + +footer.main-footer p { + font-size: 0.9rem; + color: #aaa; +} + +footer.main-footer hr { + border: none; + border-top: 1px solid #ddd; + background: none; +} + +footer.main-footer .footer-blog-list li { + margin-bottom: 20px; +} + +footer.main-footer .image { + width: 40px; + height: 40px; + margin-right: 10px; + -ms-flex-negative: 0; + flex-shrink: 0; +} + +footer.main-footer .text { + text-transform: uppercase; + letter-spacing: 0.1em; +} + +footer.main-footer .text a { + font-size: 0.8rem; +} + +footer.main-footer .photo-stream li { + margin: 0; +} + +footer.main-footer .photo-stream a { + width: 80px; + height: 80px; + padding: 5px; + display: block; +} + +footer.main-footer .copyrights { + padding: 50px 0; + background: #333; + color: #ccc; + margin-top: 50px; +} + +footer.main-footer .copyrights a { + color: #38a7bb; +} + +footer.main-footer .copyrights p { + color: inherit; + font-size: 0.8rem; + margin-bottom: 0; +} + +@media (max-width: 991px) { + footer.main-footer .photo-stream a { + width: 120px; + height: 120px; + } +} + +@media (max-width: 767px) { + footer.main-footer .photo-stream li { + width: 32%; + margin-bottom: 10px; + } + footer.main-footer .photo-stream a { + width: 100%; + height: auto; + } +} + +/* + +===================== +STYLE SWITCHER FOR DEMO +===================== + +*/ +#style-switch-button { + position: fixed; + top: 120px; + left: 0px; + border-radius: 0; + z-index: 2; +} + +#style-switch { + width: 300px; + padding: 20px; + position: fixed; + top: 160px; + left: 0; + background: #fff; + border: solid 1px #ced4da; + z-index: 2000; +} + +#style-switch h4 { + color: #495057; +} + +/* + * 1. NAVBAR + */ +.navbar { + padding: 0.5rem 1rem; +} + +.navbar-brand { + display: inline-block; + padding-top: 0.3125rem; + padding-bottom: 0.3125rem; + margin-right: 1rem; + font-size: 1.25rem; +} + +.navbar-toggler { + padding: 0.25rem 0.75rem; + font-size: 1.25rem; + line-height: 1; + border: 1px solid transparent; + border-radius: 0; +} + +.navbar-light .navbar-brand { + color: rgba(0, 0, 0, 0.9); +} + +.navbar-light .navbar-brand:focus, .navbar-light .navbar-brand:hover { + color: rgba(0, 0, 0, 0.9); +} + +.navbar-light .navbar-nav .nav-link { + color: rgba(0, 0, 0, 0.5); +} + +.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover { + color: rgba(0, 0, 0, 0.7); +} + +.navbar-light .navbar-nav .nav-link.disabled { + color: rgba(0, 0, 0, 0.3); +} + +.navbar-light .navbar-nav .show > .nav-link, +.navbar-light .navbar-nav .active > .nav-link, +.navbar-light .navbar-nav .nav-link.show, +.navbar-light .navbar-nav .nav-link.active { + color: rgba(0, 0, 0, 0.9); +} + +.navbar-light .navbar-toggler { + color: rgba(0, 0, 0, 0.5); + border-color: rgba(0, 0, 0, 0.1); +} + +.navbar-light .navbar-toggler-icon { + background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); +} + +.navbar-light .navbar-text { + color: rgba(0, 0, 0, 0.5); +} + +.navbar-dark .navbar-brand { + color: #fff; +} + +.navbar-dark .navbar-brand:focus, .navbar-dark .navbar-brand:hover { + color: #fff; +} + +.navbar-dark .navbar-nav .nav-link { + color: rgba(255, 255, 255, 0.5); +} + +.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover { + color: rgba(255, 255, 255, 0.75); +} + +.navbar-dark .navbar-nav .nav-link.disabled { + color: rgba(255, 255, 255, 0.25); +} + +.navbar-dark .navbar-nav .show > .nav-link, +.navbar-dark .navbar-nav .active > .nav-link, +.navbar-dark .navbar-nav .nav-link.show, +.navbar-dark .navbar-nav .nav-link.active { + color: #fff; +} + +.navbar-dark .navbar-toggler { + color: rgba(255, 255, 255, 0.5); + border-color: rgba(255, 255, 255, 0.1); +} + +.navbar-dark .navbar-toggler-icon { + background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); +} + +.navbar-dark .navbar-text { + color: rgba(255, 255, 255, 0.5); +} + +/* + * 2. BUTTONS + */ +.btn { + font-weight: 700; + border: 1px solid transparent; + padding: 0.5rem 0.75rem; + font-size: 0.8rem; + line-height: 1.5; + border-radius: 0; + -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; +} + +.btn:focus, .btn.focus { + outline: 0; + -webkit-box-shadow: 0 0 0 0.2rem rgba(56, 167, 187, 0.25); + box-shadow: 0 0 0 0.2rem rgba(56, 167, 187, 0.25); +} + +.btn.disabled, .btn:disabled { + opacity: .65; +} + +.btn:not([disabled]):not(.disabled):active, .btn:not([disabled]):not(.disabled).active { + background-image: none; +} + +.btn-primary { + color: color-yiq(#38a7bb); + background-color: #38a7bb; + border-color: #38a7bb; +} + +.btn-primary:hover { + color: color-yiq(#2f8d9e); + background-color: #2c8494; + border-color: #2c8494; +} + +.btn-primary:focus, .btn-primary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(56, 167, 187, 0.5); + box-shadow: 0 0 0 0.2rem rgba(56, 167, 187, 0.5); +} + +.btn-primary.disabled, .btn-primary:disabled { + color: color-yiq(#38a7bb); + background-color: #38a7bb; + border-color: #38a7bb; +} + +.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active, +.show > .btn-primary.dropdown-toggle { + color: color-yiq(#2c8494); + background-color: #2c8494; + border-color: #297b8a; +} + +.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, +.show > .btn-primary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(56, 167, 187, 0.5); + box-shadow: 0 0 0 0.2rem rgba(56, 167, 187, 0.5); +} + +.btn-secondary { + color: color-yiq(#868e96); + background-color: #868e96; + border-color: #868e96; +} + +.btn-secondary:hover { + color: color-yiq(#727b84); + background-color: #6c757d; + border-color: #6c757d; +} + +.btn-secondary:focus, .btn-secondary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); +} + +.btn-secondary.disabled, .btn-secondary:disabled { + color: color-yiq(#868e96); + background-color: #868e96; + border-color: #868e96; +} + +.btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active, +.show > .btn-secondary.dropdown-toggle { + color: color-yiq(#6c757d); + background-color: #6c757d; + border-color: #666e76; +} + +.btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus, +.show > .btn-secondary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); +} + +.btn-success { + color: color-yiq(#28a745); + background-color: #28a745; + border-color: #28a745; +} + +.btn-success:hover { + color: color-yiq(#218838); + background-color: #1e7e34; + border-color: #1e7e34; +} + +.btn-success:focus, .btn-success.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); +} + +.btn-success.disabled, .btn-success:disabled { + color: color-yiq(#28a745); + background-color: #28a745; + border-color: #28a745; +} + +.btn-success:not(:disabled):not(.disabled):active, .btn-success:not(:disabled):not(.disabled).active, +.show > .btn-success.dropdown-toggle { + color: color-yiq(#1e7e34); + background-color: #1e7e34; + border-color: #1c7430; +} + +.btn-success:not(:disabled):not(.disabled):active:focus, .btn-success:not(:disabled):not(.disabled).active:focus, +.show > .btn-success.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); +} + +.btn-info { + color: color-yiq(#17a2b8); + background-color: #17a2b8; + border-color: #17a2b8; +} + +.btn-info:hover { + color: color-yiq(#138496); + background-color: #117a8b; + border-color: #117a8b; +} + +.btn-info:focus, .btn-info.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); +} + +.btn-info.disabled, .btn-info:disabled { + color: color-yiq(#17a2b8); + background-color: #17a2b8; + border-color: #17a2b8; +} + +.btn-info:not(:disabled):not(.disabled):active, .btn-info:not(:disabled):not(.disabled).active, +.show > .btn-info.dropdown-toggle { + color: color-yiq(#117a8b); + background-color: #117a8b; + border-color: #10707f; +} + +.btn-info:not(:disabled):not(.disabled):active:focus, .btn-info:not(:disabled):not(.disabled).active:focus, +.show > .btn-info.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); +} + +.btn-warning { + color: color-yiq(#ffc107); + background-color: #ffc107; + border-color: #ffc107; +} + +.btn-warning:hover { + color: color-yiq(#e0a800); + background-color: #d39e00; + border-color: #d39e00; +} + +.btn-warning:focus, .btn-warning.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-warning.disabled, .btn-warning:disabled { + color: color-yiq(#ffc107); + background-color: #ffc107; + border-color: #ffc107; +} + +.btn-warning:not(:disabled):not(.disabled):active, .btn-warning:not(:disabled):not(.disabled).active, +.show > .btn-warning.dropdown-toggle { + color: color-yiq(#d39e00); + background-color: #d39e00; + border-color: #c69500; +} + +.btn-warning:not(:disabled):not(.disabled):active:focus, .btn-warning:not(:disabled):not(.disabled).active:focus, +.show > .btn-warning.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-danger { + color: color-yiq(#dc3545); + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-danger:hover { + color: color-yiq(#c82333); + background-color: #bd2130; + border-color: #bd2130; +} + +.btn-danger:focus, .btn-danger.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-danger.disabled, .btn-danger:disabled { + color: color-yiq(#dc3545); + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-danger:not(:disabled):not(.disabled):active, .btn-danger:not(:disabled):not(.disabled).active, +.show > .btn-danger.dropdown-toggle { + color: color-yiq(#bd2130); + background-color: #bd2130; + border-color: #b21f2d; +} + +.btn-danger:not(:disabled):not(.disabled):active:focus, .btn-danger:not(:disabled):not(.disabled).active:focus, +.show > .btn-danger.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-light { + color: color-yiq(#f8f9fa); + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-light:hover { + color: color-yiq(#e2e6ea); + background-color: #dae0e5; + border-color: #dae0e5; +} + +.btn-light:focus, .btn-light.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-light.disabled, .btn-light:disabled { + color: color-yiq(#f8f9fa); + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-light:not(:disabled):not(.disabled):active, .btn-light:not(:disabled):not(.disabled).active, +.show > .btn-light.dropdown-toggle { + color: color-yiq(#dae0e5); + background-color: #dae0e5; + border-color: #d3d9df; +} + +.btn-light:not(:disabled):not(.disabled):active:focus, .btn-light:not(:disabled):not(.disabled).active:focus, +.show > .btn-light.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-dark { + color: color-yiq(#343a40); + background-color: #343a40; + border-color: #343a40; +} + +.btn-dark:hover { + color: color-yiq(#23272b); + background-color: #1d2124; + border-color: #1d2124; +} + +.btn-dark:focus, .btn-dark.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-dark.disabled, .btn-dark:disabled { + color: color-yiq(#343a40); + background-color: #343a40; + border-color: #343a40; +} + +.btn-dark:not(:disabled):not(.disabled):active, .btn-dark:not(:disabled):not(.disabled).active, +.show > .btn-dark.dropdown-toggle { + color: color-yiq(#1d2124); + background-color: #1d2124; + border-color: #171a1d; +} + +.btn-dark:not(:disabled):not(.disabled):active:focus, .btn-dark:not(:disabled):not(.disabled).active:focus, +.show > .btn-dark.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-default { + color: color-yiq(#ced4da); + background-color: #ced4da; + border-color: #ced4da; +} + +.btn-default:hover { + color: color-yiq(#b8c1ca); + background-color: #b1bbc4; + border-color: #b1bbc4; +} + +.btn-default:focus, .btn-default.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); + box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); +} + +.btn-default.disabled, .btn-default:disabled { + color: color-yiq(#ced4da); + background-color: #ced4da; + border-color: #ced4da; +} + +.btn-default:not(:disabled):not(.disabled):active, .btn-default:not(:disabled):not(.disabled).active, +.show > .btn-default.dropdown-toggle { + color: color-yiq(#b1bbc4); + background-color: #b1bbc4; + border-color: #aab4bf; +} + +.btn-default:not(:disabled):not(.disabled):active:focus, .btn-default:not(:disabled):not(.disabled).active:focus, +.show > .btn-default.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); + box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); +} + +.btn-outline-primary { + color: #38a7bb; + background-color: transparent; + background-image: none; + border-color: #38a7bb; +} + +.btn-outline-primary:hover { + color: #fff; + background-color: #38a7bb; + border-color: #38a7bb; +} + +.btn-outline-primary:focus, .btn-outline-primary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(56, 167, 187, 0.5); + box-shadow: 0 0 0 0.2rem rgba(56, 167, 187, 0.5); +} + +.btn-outline-primary.disabled, .btn-outline-primary:disabled { + color: #38a7bb; + background-color: transparent; +} + +.btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active, +.show > .btn-outline-primary.dropdown-toggle { + color: color-yiq(#38a7bb); + background-color: #38a7bb; + border-color: #38a7bb; +} + +.btn-outline-primary:not(:disabled):not(.disabled):active:focus, .btn-outline-primary:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-primary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(56, 167, 187, 0.5); + box-shadow: 0 0 0 0.2rem rgba(56, 167, 187, 0.5); +} + +.btn-outline-secondary { + color: #868e96; + background-color: transparent; + background-image: none; + border-color: #868e96; +} + +.btn-outline-secondary:hover { + color: #fff; + background-color: #868e96; + border-color: #868e96; +} + +.btn-outline-secondary:focus, .btn-outline-secondary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); +} + +.btn-outline-secondary.disabled, .btn-outline-secondary:disabled { + color: #868e96; + background-color: transparent; +} + +.btn-outline-secondary:not(:disabled):not(.disabled):active, .btn-outline-secondary:not(:disabled):not(.disabled).active, +.show > .btn-outline-secondary.dropdown-toggle { + color: color-yiq(#868e96); + background-color: #868e96; + border-color: #868e96; +} + +.btn-outline-secondary:not(:disabled):not(.disabled):active:focus, .btn-outline-secondary:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-secondary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); +} + +.btn-outline-success { + color: #28a745; + background-color: transparent; + background-image: none; + border-color: #28a745; +} + +.btn-outline-success:hover { + color: #fff; + background-color: #28a745; + border-color: #28a745; +} + +.btn-outline-success:focus, .btn-outline-success.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); +} + +.btn-outline-success.disabled, .btn-outline-success:disabled { + color: #28a745; + background-color: transparent; +} + +.btn-outline-success:not(:disabled):not(.disabled):active, .btn-outline-success:not(:disabled):not(.disabled).active, +.show > .btn-outline-success.dropdown-toggle { + color: color-yiq(#28a745); + background-color: #28a745; + border-color: #28a745; +} + +.btn-outline-success:not(:disabled):not(.disabled):active:focus, .btn-outline-success:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-success.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); +} + +.btn-outline-info { + color: #17a2b8; + background-color: transparent; + background-image: none; + border-color: #17a2b8; +} + +.btn-outline-info:hover { + color: #fff; + background-color: #17a2b8; + border-color: #17a2b8; +} + +.btn-outline-info:focus, .btn-outline-info.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); +} + +.btn-outline-info.disabled, .btn-outline-info:disabled { + color: #17a2b8; + background-color: transparent; +} + +.btn-outline-info:not(:disabled):not(.disabled):active, .btn-outline-info:not(:disabled):not(.disabled).active, +.show > .btn-outline-info.dropdown-toggle { + color: color-yiq(#17a2b8); + background-color: #17a2b8; + border-color: #17a2b8; +} + +.btn-outline-info:not(:disabled):not(.disabled):active:focus, .btn-outline-info:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-info.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); +} + +.btn-outline-warning { + color: #ffc107; + background-color: transparent; + background-image: none; + border-color: #ffc107; +} + +.btn-outline-warning:hover { + color: #fff; + background-color: #ffc107; + border-color: #ffc107; +} + +.btn-outline-warning:focus, .btn-outline-warning.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-outline-warning.disabled, .btn-outline-warning:disabled { + color: #ffc107; + background-color: transparent; +} + +.btn-outline-warning:not(:disabled):not(.disabled):active, .btn-outline-warning:not(:disabled):not(.disabled).active, +.show > .btn-outline-warning.dropdown-toggle { + color: color-yiq(#ffc107); + background-color: #ffc107; + border-color: #ffc107; +} + +.btn-outline-warning:not(:disabled):not(.disabled):active:focus, .btn-outline-warning:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-warning.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-outline-danger { + color: #dc3545; + background-color: transparent; + background-image: none; + border-color: #dc3545; +} + +.btn-outline-danger:hover { + color: #fff; + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-outline-danger:focus, .btn-outline-danger.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-outline-danger.disabled, .btn-outline-danger:disabled { + color: #dc3545; + background-color: transparent; +} + +.btn-outline-danger:not(:disabled):not(.disabled):active, .btn-outline-danger:not(:disabled):not(.disabled).active, +.show > .btn-outline-danger.dropdown-toggle { + color: color-yiq(#dc3545); + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-outline-danger:not(:disabled):not(.disabled):active:focus, .btn-outline-danger:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-danger.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-outline-light { + color: #f8f9fa; + background-color: transparent; + background-image: none; + border-color: #f8f9fa; +} + +.btn-outline-light:hover { + color: #fff; + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-outline-light:focus, .btn-outline-light.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-outline-light.disabled, .btn-outline-light:disabled { + color: #f8f9fa; + background-color: transparent; +} + +.btn-outline-light:not(:disabled):not(.disabled):active, .btn-outline-light:not(:disabled):not(.disabled).active, +.show > .btn-outline-light.dropdown-toggle { + color: color-yiq(#f8f9fa); + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-outline-light:not(:disabled):not(.disabled):active:focus, .btn-outline-light:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-light.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-outline-dark { + color: #343a40; + background-color: transparent; + background-image: none; + border-color: #343a40; +} + +.btn-outline-dark:hover { + color: #fff; + background-color: #343a40; + border-color: #343a40; +} + +.btn-outline-dark:focus, .btn-outline-dark.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-outline-dark.disabled, .btn-outline-dark:disabled { + color: #343a40; + background-color: transparent; +} + +.btn-outline-dark:not(:disabled):not(.disabled):active, .btn-outline-dark:not(:disabled):not(.disabled).active, +.show > .btn-outline-dark.dropdown-toggle { + color: color-yiq(#343a40); + background-color: #343a40; + border-color: #343a40; +} + +.btn-outline-dark:not(:disabled):not(.disabled):active:focus, .btn-outline-dark:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-dark.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-lg { + padding: 0.5rem 1rem; + font-size: 1.25rem; + line-height: 1.5; + border-radius: 0; +} + +.btn-sm { + padding: 0.25rem 0.5rem; + font-size: 0.7rem; + line-height: 1.5; + border-radius: 0; +} + +/* + * 3. TYPE + */ +body { + font-family: "Roboto", Helvetica, Arial, sans-serif; + font-size: 1rem; + font-weight: 400; + line-height: 1.5; + color: #212529; + background-color: #fff; +} + +a { + color: #38a7bb; + text-decoration: none; +} + +a:focus, a:hover { + color: #267280; + text-decoration: underline; +} + +h1, +h2, +h3, +h4, +h5, +h6, +.h1, +.h2, +.h3, +.h4, +.h5, +.h6 { + margin-bottom: 1rem; + font-family: inherit; + font-weight: 700; + line-height: 1.1; + color: inherit; +} + +h1, +.h1 { + font-size: 2.2rem; +} + +h2, +.h2 { + font-size: 1.8rem; +} + +h3, +.h3 { + font-size: 1.5rem; +} + +h4, +.h4 { + font-size: 1.1rem; +} + +h5, +.h5 { + font-size: 1rem; +} + +h6, +.h6 { + font-size: 0.8rem; +} + +.lead { + font-size: 1.25rem; + font-weight: 300; +} + +.display-1 { + font-size: 6rem; + font-weight: 300; + line-height: 1.1; +} + +.display-2 { + font-size: 5.5rem; + font-weight: 300; + line-height: 1.1; +} + +.display-3 { + font-size: 4.5rem; + font-weight: 300; + line-height: 1.1; +} + +.display-4 { + font-size: 3.5rem; + font-weight: 300; + line-height: 1.1; +} + +hr { + border-top: 1px solid rgba(0, 0, 0, 0.1); +} + +small, +.small { + font-size: 80%; + font-weight: 400; +} + +mark, +.mark { + padding: 0.2em; + background-color: #fcf8e3; +} + +.blockquote { + padding: 0.5rem 1rem; + margin-bottom: 2rem; + font-size: 1rem; + border-left: 5px solid #38a7bb; +} + +.blockquote-footer { + color: #868e96; +} + +.blockquote-footer::before { + content: "\2014 \00A0"; +} + +.text-primary { + color: #38a7bb !important; +} + +a.text-primary:focus, a.text-primary:hover { + color: #2c8494 !important; +} + +/* + * 4. PAGINATION + */ +.page-item:first-child .page-link { + border-top-left-radius: 0; + border-bottom-left-radius: 0; +} + +.page-item:last-child .page-link { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} + +.page-item.active .page-link { + color: #fff; + background-color: #38a7bb; + border-color: #38a7bb; +} + +.page-item.disabled .page-link { + color: #868e96; + background-color: #fff; + border-color: #dee2e6; +} + +.page-link { + padding: 0.5rem 0.75rem; + line-height: 1.25; + color: #38a7bb; + background-color: #fff; + border: 1px solid #dee2e6; +} + +.page-link:focus, .page-link:hover { + color: #267280; + text-decoration: none; + background-color: #e9ecef; + border-color: #dee2e6; + outline: 0; +} + +.pagination-lg .page-link { + padding: 0.75rem 1.5rem; + font-size: 1.25rem; + line-height: 1.5; +} + +.pagination-lg .page-item:first-child .page-link { + border-top-left-radius: 0; + border-bottom-left-radius: 0; +} + +.pagination-lg .page-item:last-child .page-link { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} + +.pagination-sm .page-link { + padding: 0.25rem 0.5rem; + font-size: 0.7rem; + line-height: 1.5; +} + +.pagination-sm .page-item:first-child .page-link { + border-top-left-radius: 0; + border-bottom-left-radius: 0; +} + +.pagination-sm .page-item:last-child .page-link { + border-top-right-radius: 0; + border-bottom-right-radius: 0; +} + +/* +* 5. DROPDOWNS +*/ +.dropdown-menu { + z-index: 1000; + min-width: 10rem; + padding: 0.5rem 0; + margin: 0.125rem 0 0; + font-size: 1rem; + color: #212529; + background-color: #fff; + border: 1px solid rgba(0, 0, 0, 0.15); + border-radius: 0; +} + +.dropdown-item { + padding: 0.25rem 1.5rem; + color: #212529; +} + +.dropdown-item:focus, .dropdown-item:hover { + color: #16181b; + background-color: #f8f9fa; +} + +.dropdown-item.active, .dropdown-item:active { + color: #fff; + background-color: #38a7bb; +} + +.dropdown-item.disabled, .dropdown-item:disabled { + color: #868e96; +} + +.dropdown-header { + padding: 0.5rem 1.5rem; + font-size: 0.7rem; + color: #868e96; +} + +/* +* 6. UTILITIES +*/ +.bg-primary { + background-color: #38a7bb !important; +} + +a.bg-primary:focus, a.bg-primary:hover { + background-color: #2c8494 !important; +} + +.bg-secondary { + background-color: #868e96 !important; +} + +a.bg-secondary:focus, a.bg-secondary:hover { + background-color: #6c757d !important; +} + +.bg-success { + background-color: #28a745 !important; +} + +a.bg-success:focus, a.bg-success:hover { + background-color: #1e7e34 !important; +} + +.bg-info { + background-color: #17a2b8 !important; +} + +a.bg-info:focus, a.bg-info:hover { + background-color: #117a8b !important; +} + +.bg-warning { + background-color: #ffc107 !important; +} + +a.bg-warning:focus, a.bg-warning:hover { + background-color: #d39e00 !important; +} + +.bg-danger { + background-color: #dc3545 !important; +} + +a.bg-danger:focus, a.bg-danger:hover { + background-color: #bd2130 !important; +} + +.bg-light { + background-color: #f8f9fa !important; +} + +a.bg-light:focus, a.bg-light:hover { + background-color: #dae0e5 !important; +} + +.bg-dark { + background-color: #343a40 !important; +} + +a.bg-dark:focus, a.bg-dark:hover { + background-color: #1d2124 !important; +} + +.border-primary { + border-color: #38a7bb !important; +} + +.border-secondary { + border-color: #868e96 !important; +} + +.border-success { + border-color: #28a745 !important; +} + +.border-info { + border-color: #17a2b8 !important; +} + +.border-warning { + border-color: #ffc107 !important; +} + +.border-danger { + border-color: #dc3545 !important; +} + +.border-light { + border-color: #f8f9fa !important; +} + +.border-dark { + border-color: #343a40 !important; +} + +.text-primary { + color: #38a7bb !important; +} + +a.text-primary:focus, a.text-primary:hover { + color: #2c8494 !important; +} + +.text-secondary { + color: #868e96 !important; +} + +a.text-secondary:focus, a.text-secondary:hover { + color: #6c757d !important; +} + +.text-success { + color: #28a745 !important; +} + +a.text-success:focus, a.text-success:hover { + color: #1e7e34 !important; +} + +.text-info { + color: #17a2b8 !important; +} + +a.text-info:focus, a.text-info:hover { + color: #117a8b !important; +} + +.text-warning { + color: #ffc107 !important; +} + +a.text-warning:focus, a.text-warning:hover { + color: #d39e00 !important; +} + +.text-danger { + color: #dc3545 !important; +} + +a.text-danger:focus, a.text-danger:hover { + color: #bd2130 !important; +} + +.text-light { + color: #f8f9fa !important; +} + +a.text-light:focus, a.text-light:hover { + color: #dae0e5 !important; +} + +.text-dark { + color: #343a40 !important; +} + +a.text-dark:focus, a.text-dark:hover { + color: #1d2124 !important; +} + +.badge-primary { + color: #fff; + background-color: #38a7bb; +} + +.badge-primary[href]:focus, .badge-primary[href]:hover { + color: #fff; + text-decoration: none; + background-color: #2c8494; +} + +.badge-secondary { + color: #fff; + background-color: #868e96; +} + +.badge-secondary[href]:focus, .badge-secondary[href]:hover { + color: #fff; + text-decoration: none; + background-color: #6c757d; +} + +.badge-success { + color: #fff; + background-color: #28a745; +} + +.badge-success[href]:focus, .badge-success[href]:hover { + color: #fff; + text-decoration: none; + background-color: #1e7e34; +} + +.badge-info { + color: #fff; + background-color: #17a2b8; +} + +.badge-info[href]:focus, .badge-info[href]:hover { + color: #fff; + text-decoration: none; + background-color: #117a8b; +} + +.badge-warning { + color: #111; + background-color: #ffc107; +} + +.badge-warning[href]:focus, .badge-warning[href]:hover { + color: #111; + text-decoration: none; + background-color: #d39e00; +} + +.badge-danger { + color: #fff; + background-color: #dc3545; +} + +.badge-danger[href]:focus, .badge-danger[href]:hover { + color: #fff; + text-decoration: none; + background-color: #bd2130; +} + +.badge-light { + color: #111; + background-color: #f8f9fa; +} + +.badge-light[href]:focus, .badge-light[href]:hover { + color: #111; + text-decoration: none; + background-color: #dae0e5; +} + +.badge-dark { + color: #fff; + background-color: #343a40; +} + +.badge-dark[href]:focus, .badge-dark[href]:hover { + color: #fff; + text-decoration: none; + background-color: #1d2124; +} + +/* +* 7.CODE +*/ +code { + font-size: 87.5%; + color: #e83e8c; + border-radius: 0; +} + +a > code { + padding: 0; + color: inherit; + background-color: inherit; +} + +/* +* 8. NAV +*/ +.nav-link { + padding: 0.5rem 1rem; +} + +.nav-link.disabled { + color: #868e96; +} + +.nav-tabs .nav-item { + margin-bottom: -1px; +} + +.nav-tabs .nav-link { + border: 1px solid transparent; + border-top-left-radius: 0; + border-top-right-radius: 0; +} + +.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover { + border-color: #e9ecef #e9ecef #dee2e6; +} + +.nav-tabs .nav-link.disabled { + color: #868e96; +} + +.nav-tabs .nav-link.active, +.nav-tabs .nav-item.show .nav-link { + color: #495057; + background-color: #fff; +} + +.nav-tabs .dropdown-menu { + margin-top: -1px; +} + +.nav-pills .nav-link { + border-radius: 0; +} + +.nav-pills .nav-link.active, +.nav-pills .show > .nav-link { + color: #fff; + background-color: #38a7bb; +} + +/* +* 9. CARD +*/ +.card { + background-color: #fff; + border: 1px solid rgba(0, 0, 0, 0.125); + border-radius: 0; +} + +.card > .list-group:first-child .list-group-item:first-child { + border-top-left-radius: 0; + border-top-right-radius: 0; +} + +.card > .list-group:last-child .list-group-item:last-child { + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; +} + +.card-body { + padding: 1.25rem; +} + +.card-title { + margin-bottom: 0.75rem; +} + +.card-subtitle { + margin-top: -0.375rem; +} + +.card-link + .card-link { + margin-left: 1.25rem; +} + +.card-header { + padding: 0.75rem 1.25rem; + background-color: rgba(0, 0, 0, 0.03); + border-bottom: 1px solid rgba(0, 0, 0, 0.125); +} + +.card-header:first-child { + border-radius: calc(0 - 1px) calc(0 - 1px) 0 0; +} + +.card-header-transparent { + background-color: rgba(0, 0, 0, 0.3); + border-bottom: none; +} + +.card-footer { + padding: 0.75rem 1.25rem; + background-color: #f8f9fa; + border-top: 1px solid rgba(0, 0, 0, 0.125); +} + +.card-footer:last-child { + border-radius: 0 0 calc(0 - 1px) calc(0 - 1px); +} + +.card-header-tabs { + margin-right: -0.625rem; + margin-bottom: -0.75rem; + margin-left: -0.625rem; + border-bottom: 0; +} + +.card-header-pills { + margin-right: -0.625rem; + margin-left: -0.625rem; +} + +.card-img-overlay { + padding: 1.25rem; +} + +.card-img-overlay-opacity { + background: rgba(0, 0, 0, 0.2); +} + +.card-img { + border-radius: calc(0 - 1px); +} + +.card-img-top { + border-top-left-radius: calc(0 - 1px); + border-top-right-radius: calc(0 - 1px); +} + +.card-img-bottom { + border-bottom-right-radius: calc(0 - 1px); + border-bottom-left-radius: calc(0 - 1px); +} + +.card-deck .card { + margin-bottom: 15px; +} + +@media (min-width: 576px) { + .card-deck { + margin-right: -15px; + margin-left: -15px; + } + .card-deck .card { + margin-right: 15px; + margin-left: 15px; + } +} diff --git a/static/css/style.marsala.css b/static/css/style.marsala.css index 08af88a71..508b7f0b4 100644 --- a/static/css/style.marsala.css +++ b/static/css/style.marsala.css @@ -1,3566 +1,3702 @@ -.clearfix:before, -.clearfix:after, -.navbar:before, -.navbar:after, -.navbar-header:before, -.navbar-header:after { - content: " "; - display: table; +/* + +================================================================================== +================================================================================== + +Universal Template + +https://bootstrapious.com/p/universal-business-e-commerce-template + +================================================================================== +================================================================================== + +*/ +/* +* +* ===================== +* GENERAL +* ===================== +* +*/ +.boxed { + background: url("../img/boxed-pattern.png"); +} + +.boxed #all { + max-width: 1200px; + margin: 0 auto; + background: #fff; + -webkit-box-shadow: 0 0 5px #ccc; + box-shadow: 0 0 5px #ccc; +} + +a { + -webkit-transition: all 0.3s !important; + transition: all 0.3s !important; + display: inline-block; +} + +button { + cursor: pointer; +} + +strong { + font-weight: 700; +} + +p.lead { + margin-bottom: 40px; +} + +.accent { + color: #955251; } -.clearfix:after, -.navbar:after, -.navbar-header:after { - clear: both; + +.tooltip { + font-family: "Roboto", Helvetica, Arial, sans-serif; } -.center-block { + +.bs-select .dropdown-menu .dropdown-menu { + min-height: 20px; display: block; - margin-left: auto; - margin-right: auto; } -.pull-right { - float: right !important; + +.bs-select .dropdown-menu .dropdown-menu a { + padding: 6px 10px; + color: #666; + font-weight: 700; + text-decoration: none !important; + display: block; + font-size: .8rem; + text-transform: uppercase; + letter-spacing: 0.1em; + font-family: "Roboto", Helvetica, Arial, sans-serif; + outline: none; } -.pull-left { - float: left !important; + +.heading-light { + font-weight: 300 !important; } -.hide { - display: none !important; + +.text-bold { + font-weight: 700; } -.show { - display: block !important; + +.text-small { + font-size: 0.9rem; } -.invisible { - visibility: hidden; + +.text-uppercase { + text-transform: uppercase; + letter-spacing: 0.1em; } -.text-hide { - font: 0/0 a; - color: transparent; - text-shadow: none; - background-color: transparent; - border: 0; + +.no-letter-spacing { + letter-spacing: 0 !important; } -.hidden { - display: none !important; - visibility: hidden !important; + +.bar { + padding: 60px 0; } -.affix { - position: fixed; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); + +.bar.padding-big { + padding: 50px 0; } -/* general styles */ -a, -button { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.pagination { + margin-top: 20px; } -a i[class^="fa"], -button i[class^="fa"] { - margin: 0 5px; + +#pagination .pagination { + margin-bottom: 40px; } -.clickable { - cursor: pointer !important; + +.text-sm, .form-group label, #blog-listing-big .date-comments a, #blog-listing-medium .date-comments a, #blog-listing-big p.intro, #blog-listing-medium p.intro { + font-size: 0.9rem; } -.required { - color: #955251; + +.text-xs { + font-size: 0.9rem; } -.accent { - color: #955251; + +.text-xs * { + font-size: 0.9rem; } -.text-uppercase { - text-transform: uppercase; - letter-spacing: 0.08em; + +@media (max-width: 767px) { + .text-sm-center { + text-align: center !important; + } } + @media (max-width: 991px) { + .text-md-center { + text-align: center !important; + } +} + +@media (max-width: 1199px) { + .text-lg-center { + text-align: center !important; + } +} + +@media (max-width: 767px) { .text-center-sm { - text-align: center; + text-align: center !important; } } -p.lead { - margin-bottom: 40px; + +@media (max-width: 991px) { + .text-center-md { + text-align: center !important; + } } -section, -div.section { - margin-bottom: 40px; + +@media (max-width: 1199px) { + .text-center-sm, .text-center-xs { + text-align: center !important; + } } + +.bg-gray { + background: #e9ecef !important; +} + +.bg-gray-dark { + background: #555 !important; +} + +.bg-primary { + background: #955251 !important; +} + +.color-white { + color: #fff !important; +} + +.color-white * { + color: #fff !important; +} + +.bg-white { + background: #fff !important; +} + +.bg-fixed { + background-attachment: fixed !important; +} + +.light-gray { + background: #eee; +} + .no-mb { margin-bottom: 0 !important; } + +.no-mt { + margin-top: 0 !important; +} + +.no-horizontal-padding { + padding-left: 0 !important; + padding-right: 0 !important; +} + .mb-small { margin-bottom: 20px !important; } -.heading { - margin-bottom: 40px; + +.no-padding-top { + padding-top: 0 !important; } -.heading h1, -.heading h2, -.heading h3, -.heading h4, -.heading h5 { - display: inline-block; - border-bottom: solid 5px #955251; + +.no-padding-bottom { + padding-bottom: 0 !important; +} + +.padding-horizontal { + padding-left: 30px !important; + padding-right: 30px !important; +} + +.relative-positioned { + position: relative; + z-index: 1; +} + +.jumbotron { + margin: 0; +} + +.owl-carousel.equal-height .owl-stage { + display: -webkit-box !important; + display: -ms-flexbox !important; + display: flex !important; + -webkit-box-align: stretch !important; + -ms-flex-align: stretch !important; + align-items: stretch !important; +} + +.background-pentagon, #heading-breadcrumbs { + background: url("../img/texture-bw.png") center center repeat; + border-top: 1px solid #999; + border-bottom: 1px solid #999; +} + +.heading, .panel-heading { + margin-bottom: 1rem; +} + +.heading h1, .panel-heading h1, .heading h2, .panel-heading h2, .heading h3, .panel-heading h3, .heading h4, .panel-heading h4, .heading h5, .panel-heading h5, .heading h6, .panel-heading h6 { line-height: 1.1; + display: inline-block; margin-bottom: 0; padding-bottom: 10px; - vertical-align: middle; text-transform: uppercase; - letter-spacing: 0.06em; + letter-spacing: 0.1em; } -.heading h1 i[class^="fa"], -.heading h2 i[class^="fa"], -.heading h3 i[class^="fa"], -.heading h4 i[class^="fa"], -.heading h5 i[class^="fa"] { - display: inline-block; + +.heading h1:after, .panel-heading h1:after, .heading h2:after, .panel-heading h2:after, .heading h3:after, .panel-heading h3:after, .heading h4:after, .panel-heading h4:after, .heading h5:after, .panel-heading h5:after, .heading h6:after, .panel-heading h6:after { + content: " "; + display: block; + width: 100px; + height: 2px; + margin-top: .6rem; background: #955251; - width: 30px; - height: 30px; - vertical-align: middle; - text-align: center; - color: #fff; - font-size: 12px; - line-height: 30px; - border-radius: 15px; } -.icon { - display: inline-block; - width: 80px; - height: 80px; - color: #fff; - line-height: 80px; - border-radius: 40px; - border: solid 1px #fff; - font-size: 20px; + +.heading.text-center h1:after, .text-center.panel-heading h1:after, .heading.text-center h2:after, .text-center.panel-heading h2:after, .heading.text-center h3:after, .text-center.panel-heading h3:after, .heading.text-center h4:after, .text-center.panel-heading h4:after, .heading.text-center h5:after, .text-center.panel-heading h5:after, .heading.text-center h6:after, .text-center.panel-heading h6:after { + margin-left: auto; + margin-right: auto; } -.icon.icon-lg { - font-size: 30px; - border-width: 2px; + +.buttons a { + margin: 0 3px; } -.ul-icons { - padding-left: 10px; + +.dropdown-item.active, .dropdown-item:active { + background: #c08c8c; } -.ul-icons li { - list-style-type: none; - line-height: 20px; - margin-bottom: 20px; + +.card { + border-radius: 0; + margin-bottom: 10px; } -.ul-icons li i { - width: 20px; - height: 20px; - background: #955251; - color: #fff; - text-align: center; - border-radius: 10px; - line-height: 20px; - margin-right: 10px; + +.card-header { + border-radius: 0; + padding: 20px; } -ul.list-style-none { - list-style: none; + +.card-header h1, .card-header h2, .card-header h3, .card-header h4, .card-header h5, .card-header h6 { + text-transform: uppercase; + letter-spacing: 0.1em; + font-size: 0.935rem; + margin: 0 !important; } -#text-page h1, -#text-page h2, -#text-page h3 { - font-weight: 700; + +.card-header a { + color: #333; } -#error-page { - text-align: center; - margin-top: 40px; - margin-bottom: 100px; + +.card-body p { + font-size: 0.9rem; + color: #333; } -#error-page h4 { - margin-bottom: 40px; + +.alert { + border-radius: 0; } -#error-page p.buttons { - margin-top: 40px; + +#heading-breadcrumbs { + padding: 2rem 0; + border-top: none !important; + border-bottom: none !important; } -.pages-listing .item { - text-align: center; + +#heading-breadcrumbs .breadcrumb { + margin-bottom: 0; + background: none; + font-size: 0.9rem; } -.pages-listing .item h3 { - font-size: 18px; + +#heading-breadcrumbs h1 { text-transform: uppercase; - margin-bottom: 20px; - letter-spacing: 0.08em; + letter-spacing: 0.1em; + margin-bottom: 0; } -.pages-listing .item h3 a { - color: #555555; + +#heading-breadcrumbs li { + text-transform: uppercase; + letter-spacing: 0.1em; } -.pages-listing .item .text { - margin-bottom: 20px; + +.row.no-space { + margin-left: 0; + margin-right: 0; } -.pages-listing .item .text p { - color: #999999; - font-size: 12px; - margin-bottom: 20px; + +.row.no-space div[class*="col-"] { + padding: 0; } -.banner { - margin-bottom: 30px; + +.row.no-space .box-image { + margin: 0; +} + +.owl-carousel .owl-dots { + margin-top: 20px; text-align: center; } -.banner img { - margin: 0 auto; + +.owl-carousel .owl-dots .owl-dot { + display: inline-block; + margin: 0 5px; } -.banner a:hover img { - opacity: 0.8; - filter: alpha(opacity=80); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.owl-carousel .owl-dots .owl-dot.active span { + background: #fff; } -.pages { - text-align: center; + +.owl-carousel .owl-dots .owl-dot span { + display: block; + width: 12px; + height: 12px; + border-radius: 50%; + background: #aaa; +} + +.dark-mask { + background: rgba(0, 0, 0, 0.3); + width: 100%; + height: 100%; + position: absolute; + top: 0; + left: 0; + z-index: -1; } -.pages .loadMore { - text-align: center; + +.dark-mask.mask-primary { + background: rgba(149, 82, 81, 0.9); } -.pages .pagination { + +.icon-outlined { + width: 80px; + height: 80px; + line-height: 80px; text-align: center; -} -.features-buttons button { + display: inline-block; + font-size: 1.4rem; + border-radius: 50%; + border: 2px solid #fff; margin-bottom: 20px; } -@media (min-width: 1300px) { - body.boxed { - background: url(https://www.toptal.com/designers/subtlepatterns/patterns/subtle_zebra_3d.png); - } - body.boxed #all { - position: relative; - background: #fff; - width: 1200px; - margin: 0 auto; - overflow: hidden; - -webkit-box-shadow: 0 0 5px #cccccc; - box-shadow: 0 0 5px #cccccc; - } -} -#top { - background: #555555; - color: #eeeeee; - padding: 10px 0; + +.icon-outlined.icon-lg { + font-size: 2rem; } -#top p { - margin: 0; - font-size: 12px; + +.icon-outlined.icon-sm { + width: 55px; + height: 55px; + line-height: 55px; + text-align: center; + font-size: 1.15rem; } -#top .social { - float: right; - text-align: right; + +.icon-outlined.icon-thin { + border-width: 1px; } -#top .social a { - color: #999999; - display: inline-block; + +.icon-filled { width: 24px; height: 24px; - border-radius: 12px; line-height: 24px; - font-size: 12px; + background: #955251; + color: #fff; text-align: center; + border-radius: 50%; + font-size: 0.75rem; +} + +.ul-icons .icon-filled { + display: inline-block; + margin-right: 10px; +} + +.ul-icons li { + margin-bottom: 20px; + color: #555; + font-size: 0.9rem; +} + +.ul-icons a { + display: inline; +} + +ul.social { + margin: 15px 0; } -#top .social a:hover { + +ul.social a { + width: 28px; + height: 28px; + line-height: 28px; + background: #555; color: #fff; - background: #955251; + text-align: center; + border-radius: 50%; + margin: 0 2px; + font-size: 0.8rem; +} + +ul.social a:hover { -webkit-transform: scale(1.1); transform: scale(1.1); } -#top .social a:hover.facebook { - background-color: #4460ae; + +ul.social a.facebook { + background: #4561ae; } -#top .social a:hover.gplus { - background-color: #c21f25; + +ul.social a.gplus { + background: #c22026; } -#top .social a:hover.twitter { - background-color: #3cf; + +ul.social a.twitter { + background: #34ccff; } -#top .social a:hover.instagram { - background-color: #cd4378; + +ul.social a.email { + background: #4b8046; } -#top .social a:hover.email { - background-color: #4a7f45; + +.showcase { + color: #555; } -#top .login { - float: right; + +.showcase .icon-outlined { + border-color: #555; } -#top .login a { - font-size: 12px; - color: #eeeeee; - margin-right: 15px; - text-decoration: none; + +.showcase .counter { + margin-bottom: 20px; + display: inline-block; + margin-top: 0; +} + +.showcase h4 { text-transform: uppercase; - font-weight: 700; - letter-spacing: 0.10em; + letter-spacing: 0.1em; + font-size: 0.935rem; + margin-top: 0; } -@media (max-width: 767px) { - #top .login { - float: left; - } + +.form-control { + border-radius: 0; } -#top.light { - background: #fff; - color: #999999; - border-bottom: solid 1px #eeeeee; + +.form-control:focus { + border-color: #955251; + -webkit-box-shadow: 0 0 0 0.2rem rgba(149, 82, 81, 0.25); + box-shadow: 0 0 0 0.2rem rgba(149, 82, 81, 0.25); } -#top.light .login a { - color: #555555; + +.form-group label { + color: #555; } -.navbar { + +.card-primary { + border-radius: 0; + border-color: #955251; +} + +.card-primary .card-header { + background: #955251; + color: #fff; border: none; + border-radius: 0; } -.navbar ul.nav > li > a { + +.card-primary .card-header a { + color: #fff; text-transform: uppercase; - text-decoration: underline; - font-weight: bold; - letter-spacing: 0.08em; - border-top: solid 5px transparent; -} -.navbar ul.nav > li > a:hover { - border-top: solid 5px #955251; + font-weight: 300; + letter-spacing: 0.05em; } -.navbar ul.nav > li.active > a, -.navbar ul.nav > li.open > a { - text-decoration: none !important; - border-top: solid 5px #532e2d; + +.card-primary .card-body { + border-color: #955251; } -@media (max-width: 768px) { - .navbar ul.nav > li.active > a, - .navbar ul.nav > li.open > a { - border-top-color: transparent; - } - .navbar ul.nav > li > a:hover { - border-top-color: transparent; - } + +.card-body li { + font-size: 0.9rem; } -.navbar.navbar-light ul.nav > li.active > a { - border-top: solid 5px #532e2d; - background: #fff !important; - color: #555555 !important; + +table { + font-size: 0.9rem; } -.navbar.navbar-light ul.nav > li.active > a:hover { - border-top: solid 5px #532e2d; + +table img { + min-width: 50px !important; + max-width: 50px !important; + height: 50px; } -.navbar.navbar-light ul.nav > li > a:hover, -.navbar.navbar-light ul.nav > li.open > a:hover, -.navbar.navbar-light ul.nav > li > a:focus, -.navbar.navbar-light ul.nav > li.open > a:focus { - border-top: solid 5px #955251; - background: #fff !important; - color: #555555 !important; + +table input[type="number"] { + max-width: 50px; } -.navbar ul.dropdown-menu { - margin: 0; - padding: 0; + +.nav-tabs { + border-bottom: none; } -.navbar ul.dropdown-menu li { - list-style-type: none; - border-bottom: solid 1px #eeeeee; - text-transform: uppercase; - letter-spacing: 0.08em; - padding: 4px 0; + +.nav-tabs a.nav-link { + border-radius: 0 !important; + font-size: 0.9rem; } -.navbar ul.dropdown-menu li a { - position: relative; - color: #999999; - font-size: 12px; - display: block; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - left: 0; + +.tab-content { + padding: 20px; + border: 1px solid #ddd; + font-size: 0.9rem; } -.navbar ul.dropdown-menu li a:hover { - color: #955251; - text-decoration: none; - background: none; - left: 2px; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.top-bar { + background: #555; + color: #fff; + font-size: 0.9rem; + padding: 10px 0; } -@media (max-width: 767px) { - .navbar ul.dropdown-menu li a:hover { - left: 0; - } + +.top-bar.top-bar-light { + background: #fff; + color: #555; + border-bottom: 1px solid #ddd; } -.navbar .yamm-content h3 { - font-size: 18px; - text-transform: uppercase; - padding-bottom: 10px; - margin-top: 5px; - border-bottom: dotted 1px #555555; - letter-spacing: 0.08em; + +.top-bar.top-bar-light a.login-btn, .top-bar.top-bar-light a.signup-btn { + color: #555 !important; } -@media (max-width: 767px) { - .navbar .yamm-content h3 { - font-size: 14px; - } + +.top-bar.top-bar-light a.login-btn span, .top-bar.top-bar-light a.signup-btn span { + display: inline-block; } -.navbar .yamm-content h5 { - text-transform: uppercase; - padding-bottom: 10px; - border-bottom: dotted 1px #555555; - letter-spacing: 0.08em; + +.top-bar p { + margin-bottom: 0; + font-size: 0.75rem; } -.navbar .yamm-content ul { - margin: 0; - padding: 0; + +.top-bar ul { + margin-bottom: 0; } -.navbar .yamm-content ul li { - list-style-type: none; - border-bottom: solid 1px #eeeeee; + +.top-bar a.login-btn, .top-bar a.signup-btn { + color: #eee; text-transform: uppercase; - padding: 4px 0; -} -.navbar .yamm-content ul li a { - position: relative; - color: #999999; - font-size: 12px; - display: block; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + letter-spacing: 0.1em; + text-decoration: none !important; + font-size: 0.75rem; + font-weight: 700; + margin-right: 10px; } -.navbar .yamm-content ul li a:hover { - color: #955251; - text-decoration: none; - padding-left: 2px; + +.top-bar a.login-btn i, .top-bar a.signup-btn i { + margin-right: 10px; } -.navbar .yamm-content .banner { - margin-bottom: 10px; + +.top-bar ul.social-custom { + margin-left: 20px; } -.navbar .yamm-fw .dropdown-menu { + +.top-bar ul.social-custom li { padding: 0; + margin: 0; } -.navbar .navbar-buttons { - float: right; + +.top-bar ul.social-custom a { + text-decoration: none !important; + font-size: 0.7rem; + width: 26px; + height: 26px; + line-height: 26px; + color: #999; + text-align: center; + border-radius: 50%; + margin: 0; } -.navbar .navbar-buttons button, -.navbar .navbar-buttons a.btn, -.navbar .navbar-buttons .btn-default.navbar-toggle { - margin-top: 11px; - margin-bottom: 11px; - margin-left: 0; - margin-right: 5px; -} -.navbar .btn-default, -.navbar .btn-default.navbar-toggle { - color: #999999; - background-color: #fff; - margin-left: 7px; - margin-right: 0; -} -.navbar .btn-default:hover, -.navbar .btn-default.navbar-toggle:hover, -.navbar .btn-default:focus, -.navbar .btn-default.navbar-toggle:focus { - background-color: #fff; - border-color: #955251; - color: #955251; + +.top-bar ul.social-custom a:hover { + background: #955251; + color: #fff; } -.navbar #search { - clear: both; - border-top: solid 1px #955251; - text-align: right; + +.top-bar .contact-info { + margin-right: 20px; } -.navbar #search form { - float: right; + +.top-bar .contact-info a { + font-size: 0.8rem; } -.navbar #search form .input-group { - width: 500px; + +.modal .modal-header h4 { + text-transform: uppercase; + letter-spacing: 0.1em; } -@media (max-width: 768px) { - .navbar #search form .input-group { - width: 100%; - } + +.modal input::-moz-placeholder { + font-size: 0.85rem; } -.navbar #basket-overview a { - margin-left: 7px; + +.modal input::-webkit-input-placeholder { + font-size: 0.85rem; } -.navbar-affixed-top { - top: -32px; + +.modal input:-ms-input-placeholder { + font-size: 0.85rem; } -.navbar-affixed-top.affix-top { - -webkit-transition: all 0.5s ease-out; - -moz-transition: all 0.5s ease-out; - transition: all 0.5s ease-out; + +.modal p { + font-size: 0.85rem; } -.navbar-affixed-top.affix { + +header.nav-holder.sticky { position: fixed; - width: 100%; top: 0; - z-index: 1000; - -webkit-box-shadow: 0 0 5px #cccccc; - box-shadow: 0 0 5px #cccccc; - -webkit-transition: all 0.5s ease-out; - -moz-transition: all 0.5s ease-out; - transition: all 0.5s ease-out; + left: 0; + width: 100%; + background: #fff; + z-index: 999; + -webkit-box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); + box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); } -body.boxed .navbar-affixed-top.affix { - position: static; + +#navbar { + background: #fff; + padding-top: 0; + padding-bottom: 0; } -#login-modal { - overflow: hidden; + +#navbar .navbar-toggler { + font-size: 0.9rem; + padding: 10px 15px; + border-color: #ddd; } -#login-modal .modal-header h4 { - text-transform: uppercase; + +#navbar ul ul a { + padding-left: 0 !important; } -#login-modal form { - margin-bottom: 20px; + +#navbar .dropdown-menu { + border-radius: 0; + -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); + box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); + margin-top: 0; + padding-top: 0; + padding-bottom: 0; +} + +#navbar .dropdown-menu .dropdown-item { + padding: 0; } -#login-modal a { + +#navbar .dropdown-menu h5 { + text-transform: uppercase; + letter-spacing: 0.1em; + padding-bottom: 5px; + border-bottom: 1px dotted #ccc; + margin-top: .7rem; + margin-bottom: .5rem; +} + +#navbar .dropdown-menu a.nav-link { + font-size: 0.75rem; + letter-spacing: 0.1em; + text-transform: uppercase !important; + border-bottom: 1px solid #eee; + padding: 15px 20px !important; +} + +#navbar .dropdown-menu a.nav-link:hover { + -webkit-transform: translateX(5px); + transform: translateX(5px); color: #955251; } -#login-modal p { - font-weight: 300; - margin-bottom: 20px; - font-size: 13px; + +#navbar .dropdown-submenu { + position: relative; } -/* buttons */ -.btn { - font-weight: 700; - font-family: "Roboto", Helvetica, Arial, sans-serif; - text-transform: uppercase; - letter-spacing: 0.08em; - padding: 6px 12px; - font-size: 13px; - line-height: 1.42857143; - border-radius: 0; + +#navbar .dropdown-submenu > .dropdown-menu { + top: 0; + left: 100%; + margin-top: -2px; + font-size: 1em; } -.input-group .btn { - font-size: 14px; + +#navbar .menu-large { + position: static !important; } -.btn-lg { - padding: 10px 16px; - font-size: 14px; - line-height: 1.33; - border-radius: 0; + +#navbar .menu-large .megamenu { + padding: 20px; + width: 100%; + max-width: 1140px; + left: 50%; + -webkit-transform: translateX(-50%); + transform: translateX(-50%); + margin-top: -1px; +} + +#navbar .menu-large a.nav-link { + padding: 7px !important; + padding-left: 0 !important; +} + +#navbar .navbar-nav > li.active > a { + background: #955251 !important; + color: #fff !important; + text-decoration: none !important; + border-color: #74403f !important; } -.btn-sm { - padding: 5px 10px; - font-size: 12px; - line-height: 1.5; - border-radius: 0; + +#navbar .navbar-nav > li > a { + margin: 0; + padding: 1.4rem 1rem 1.6rem; + color: #555; + font-weight: 600; + text-transform: uppercase; + letter-spacing: 0.1em; + font-size: 0.9rem; + text-decoration: none; + border-top: .3rem solid transparent; } -.btn-xs { - padding: 1px 5px; - font-size: 12px; - line-height: 1.5; - border-radius: 0; + +#navbar .navbar-nav > li > a:hover { + background: rgba(149, 82, 81, 0.5); + border-color: rgba(149, 82, 81, 0.8); +} + +#navbar .navbar-nav > li > a:focus { + background: #955251 !important; + color: #fff !important; + text-decoration: none !important; + border-color: #74403f !important; +} + +#navbar.nav-light .navbar-nav > li.active a.dropdown-toggle, +#navbar.nav-light .navbar-nav > li.active a.dropdown-toggle:hover { + background: none !important; + color: #555 !important; + text-decoration: underline !important; + border-color: #955251 !important; +} + +#navbar.nav-light .navbar-nav > li > a:hover { + background: none !important; + border-color: #b77c7b !important; +} + +#navbar.nav-light .navbar-nav > li > a:focus { + background: none !important; + color: #555 !important; + text-decoration: underline !important; + border-color: #955251 !important; +} + +@media (max-width: 991px) { + #navbar { + padding-top: 1rem; + padding-bottom: 1rem; + } + #navbar .menu-large .megamenu { + width: 100%; + left: 0 !important; + -webkit-transform: none !important; + transform: none !important; + } + #navbar .navbar-collapse { + max-height: 600px; + overflow-y: auto; + margin-top: 1rem; + } + #navbar .navbar-nav > li > a { + padding: 0 10px; + height: 45px; + line-height: 45px; + border-top: 0; + font-size: 0.85rem; + width: 100%; + } + #navbar .navbar-nav > li > a:hover { + background: rgba(149, 82, 81, 0.5); + border-color: rgba(149, 82, 81, 0.8); + } + #navbar .dropdown-menu { + border: none; + -webkit-box-shadow: none; + box-shadow: none; + } } + +.btn { + text-transform: uppercase; + letter-spacing: 0.1em; +} + .btn-template-main { - color: #955251; - background-color: #ffffff; - border-color: #955251; + background: #955251; + border: 1px solid #955251 !important; + color: #fff !important; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-main:hover, -.btn-template-main:focus, -.btn-template-main:active, -.btn-template-main.active, -.open > .dropdown-toggle.btn-template-main { - color: #955251; - background-color: #e6e6e6; - border-color: #6d3c3b; + +.btn-template-main:hover, .btn-template-main:focus { + background: #844948; + color: #fff !important; + border-color: #844948 !important; } -.btn-template-main:active, -.btn-template-main.active, -.open > .dropdown-toggle.btn-template-main { - background-image: none; + +.btn-template-white { + background: #fff; + color: #955251 !important; + border: 1px solid #955251 !important; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-main.disabled, -.btn-template-main[disabled], -fieldset[disabled] .btn-template-main, -.btn-template-main.disabled:hover, -.btn-template-main[disabled]:hover, -fieldset[disabled] .btn-template-main:hover, -.btn-template-main.disabled:focus, -.btn-template-main[disabled]:focus, -fieldset[disabled] .btn-template-main:focus, -.btn-template-main.disabled:active, -.btn-template-main[disabled]:active, -fieldset[disabled] .btn-template-main:active, -.btn-template-main.disabled.active, -.btn-template-main[disabled].active, -fieldset[disabled] .btn-template-main.active { - background-color: #ffffff; - border-color: #955251; + +.btn-template-white:hover, .btn-template-white:focus { + background: #955251 !important; + color: #fff !important; } -.btn-template-main .badge { - color: #ffffff; - background-color: #955251; + +.btn-template-outlined { + background: none; + border: 1px solid #955251 !important; + color: #955251; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-main:hover, -.btn-template-main:focus, -.btn-template-main:active, -.btn-template-main.active { + +.btn-template-outlined:hover, .btn-template-outlined:focus { background: #955251; - color: #ffffff; - border-color: #955251; + color: #fff !important; } -.btn-template-transparent-primary { - color: #ffffff; - background-color: transparent; - border-color: #ffffff; -} -.btn-template-transparent-primary:hover, -.btn-template-transparent-primary:focus, -.btn-template-transparent-primary:active, -.btn-template-transparent-primary.active, -.open > .dropdown-toggle.btn-template-transparent-primary { - color: #ffffff; - background-color: rgba(0, 0, 0, 0); - border-color: #e0e0e0; -} -.btn-template-transparent-primary:active, -.btn-template-transparent-primary.active, -.open > .dropdown-toggle.btn-template-transparent-primary { - background-image: none; + +.btn-template-outlined-white { + background: none; + border: 1px solid #fff !important; + color: #fff; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-transparent-primary.disabled, -.btn-template-transparent-primary[disabled], -fieldset[disabled] .btn-template-transparent-primary, -.btn-template-transparent-primary.disabled:hover, -.btn-template-transparent-primary[disabled]:hover, -fieldset[disabled] .btn-template-transparent-primary:hover, -.btn-template-transparent-primary.disabled:focus, -.btn-template-transparent-primary[disabled]:focus, -fieldset[disabled] .btn-template-transparent-primary:focus, -.btn-template-transparent-primary.disabled:active, -.btn-template-transparent-primary[disabled]:active, -fieldset[disabled] .btn-template-transparent-primary:active, -.btn-template-transparent-primary.disabled.active, -.btn-template-transparent-primary[disabled].active, -fieldset[disabled] .btn-template-transparent-primary.active { - background-color: transparent; - border-color: #ffffff; + +.btn-template-outlined-white:hover, .btn-template-outlined-white:focus { + background: #fff; + color: #955251 !important; } -.btn-template-transparent-primary .badge { - color: transparent; - background-color: #ffffff; + +.btn-template-outlined-black { + background: none; + border: 1px solid #333 !important; + color: #333; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-transparent-primary:hover, -.btn-template-transparent-primary:focus, -.btn-template-transparent-primary:active, -.btn-template-transparent-primary.active { - background: #fff; - color: #955251; - border-color: #fff; + +.btn-template-outlined-black:hover, .btn-template-outlined-black:focus { + background: #333 !important; + color: #fff !important; } -.btn-template-transparent-black { - color: #ffffff; - background-color: transparent; - border-color: #ffffff; -} -.btn-template-transparent-black:hover, -.btn-template-transparent-black:focus, -.btn-template-transparent-black:active, -.btn-template-transparent-black.active, -.open > .dropdown-toggle.btn-template-transparent-black { - color: #ffffff; - background-color: rgba(0, 0, 0, 0); - border-color: #e0e0e0; -} -.btn-template-transparent-black:active, -.btn-template-transparent-black.active, -.open > .dropdown-toggle.btn-template-transparent-black { - background-image: none; + +.features-buttons button { + margin-bottom: 20px; } -.btn-template-transparent-black.disabled, -.btn-template-transparent-black[disabled], -fieldset[disabled] .btn-template-transparent-black, -.btn-template-transparent-black.disabled:hover, -.btn-template-transparent-black[disabled]:hover, -fieldset[disabled] .btn-template-transparent-black:hover, -.btn-template-transparent-black.disabled:focus, -.btn-template-transparent-black[disabled]:focus, -fieldset[disabled] .btn-template-transparent-black:focus, -.btn-template-transparent-black.disabled:active, -.btn-template-transparent-black[disabled]:active, -fieldset[disabled] .btn-template-transparent-black:active, -.btn-template-transparent-black.disabled.active, -.btn-template-transparent-black[disabled].active, -fieldset[disabled] .btn-template-transparent-black.active { - background-color: transparent; - border-color: #ffffff; + +.customers { + margin-bottom: 40px; +} + +.customers .item { + margin: 0 20px; +} + +.customers .item img { + -webkit-filter: grayscale(100%); + filter: grayscale(100%); + -webkit-transition: all 0.3s; + transition: all 0.3s; +} + +.customers .item img:hover { + -webkit-filter: grayscale(0%); + filter: grayscale(0%); } -.btn-template-transparent-black .badge { - color: transparent; - background-color: #ffffff; + +.testimonials .item { + margin: 0 5px; + height: 100%; } -.btn-template-transparent-black:hover, -.btn-template-transparent-black:focus, -.btn-template-transparent-black:active, -.btn-template-transparent-black.active { + +.testimonials .testimonial { + padding: 20px; background: #fff; - color: #000; - border-color: #fff; + height: 100%; } -.btn-template-primary { - color: #ffffff; - background-color: #955251; - border-color: #955251; + +.testimonials .text { + font-size: 0.85rem; +} + +.testimonials .text p { + color: #999; +} + +.testimonials .avatar { + min-width: 60px; + max-width: 60px; + min-height: 60px; + max-height: 60px; + border-radius: 50%; + overflow: hidden; + margin-left: 10px; } -.btn-template-primary:hover, -.btn-template-primary:focus, -.btn-template-primary:active, -.btn-template-primary.active, -.open > .dropdown-toggle.btn-template-primary { - color: #ffffff; - background-color: #74403f; - border-color: #6d3c3b; + +.testimonials .bottom { + width: 100%; } -.btn-template-primary:active, -.btn-template-primary.active, -.open > .dropdown-toggle.btn-template-primary { - background-image: none; + +.testimonials .bottom .testimonial-info { + text-align: right; } -.btn-template-primary.disabled, -.btn-template-primary[disabled], -fieldset[disabled] .btn-template-primary, -.btn-template-primary.disabled:hover, -.btn-template-primary[disabled]:hover, -fieldset[disabled] .btn-template-primary:hover, -.btn-template-primary.disabled:focus, -.btn-template-primary[disabled]:focus, -fieldset[disabled] .btn-template-primary:focus, -.btn-template-primary.disabled:active, -.btn-template-primary[disabled]:active, -fieldset[disabled] .btn-template-primary:active, -.btn-template-primary.disabled.active, -.btn-template-primary[disabled].active, -fieldset[disabled] .btn-template-primary.active { - background-color: #955251; - border-color: #955251; + +.testimonials .bottom h5 { + text-transform: uppercase; + letter-spacing: 0.1em; + margin-bottom: 5px; } -.btn-template-primary .badge { + +.testimonials .bottom p { + font-size: 0.75rem; + color: #999; + margin-bottom: 0; +} + +.testimonials .icon { color: #955251; - background-color: #ffffff; + font-size: 2rem; + margin-right: 20px; } -#intro { - background: url('../img/home.jpg') no-repeat center top; - -webkit-background-size: cover; - -moz-background-size: cover; - -o-background-size: cover; - background-size: cover; + +.testimonials .owl-carousel .owl-stage { + display: -webkit-box !important; + display: -ms-flexbox !important; + display: flex !important; + -webkit-box-align: stretch !important; + -ms-flex-align: stretch !important; + align-items: stretch !important; } -#intro .item { - font-family: "Roboto", Helvetica, Arial, sans-serif; - height: 100%; + +.testimonials .owl-dot.active span { + background: #955251 !important; } -#intro .item h1 { - text-transform: uppercase; - font-size: 50px; + +.home-carousel { color: #fff; - margin-bottom: 40px; - letter-spacing: 0.08em; } -@media (max-width: 991px) { - #intro .item h1 { - font-size: 40px; - } + +.home-carousel .owl-carousel { + padding-top: 60px; + padding-bottom: 20px; } -@media (max-width: 767px) { - #intro .item h1 { - font-size: 25px; - } + +.home-carousel h1, .home-carousel h2 { + text-transform: uppercase; + letter-spacing: 0.1em; +} + +.home-carousel li, .home-carousel p { + text-transform: uppercase; + letter-spacing: 0.1em; + font-weight: 700; + font-size: 1.1rem; + margin-bottom: 10px; +} + +.home-carousel p img { + max-width: 200px; +} + +.project .owl-dot.active span { + background: #955251 !important; +} + +.project .owl-nav { + position: absolute; + top: 0; + right: 0; + left: auto; + bottom: auto; + width: 100%; + padding: 20px; + text-align: right; +} + +.project .owl-nav .owl-prev, .project .owl-nav .owl-next { + width: 30px; + height: 30px; + line-height: 30px; + background: #fff; + color: #955251; + text-align: center; + border-radius: 50%; + display: inline-block; + margin: 0 5px; + -webkit-transition: all 0.3s; + transition: all 0.3s; } -#intro .item h3 { + +.project .owl-nav .owl-prev:hover, .project .owl-nav .owl-next:hover { + background: #955251; color: #fff; - margin-bottom: 40px; } + @media (max-width: 767px) { - #intro .item h3 { - font-size: 15px; - margin-bottom: 20px; + .home-carousel { + text-align: center !important; } -} -#intro .item .btn { - text-transform: none; -} -@media (max-width: 991px) { - #intro .item .btn { - font-size: 14px; + .home-carousel p, .home-carousel h1, .home-carousel ul { + text-align: center !important; } -} -@media (max-width: 991px) { - #intro .item .carousel-caption { - left: 10%; - right: 10%; + .home-carousel img { + margin: 10px auto; } } -#intro .container, -#intro .row { - height: 100%; - position: relative; + +.owl-thumbs { + display: -webkit-box; + display: -ms-flexbox; + display: flex; } -.jumbotron { - padding: 30px; - margin-bottom: 0; + +.owl-thumbs button { + background: none; + border: none; + margin: 5px; + outline: none; +} + +.home-blog-post { + margin: 15px 0; +} + +.home-blog-post .image { position: relative; - background: url('../img/photogrid.jpg') center center repeat; - background-size: cover; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + margin-bottom: 15px; } -.jumbotron .dark-mask { - position: absolute; - top: 0; - left: 0; + +.home-blog-post .overlay { width: 100%; height: 100%; - background: #955251; - opacity: 0.9; - filter: alpha(opacity=90); + background: rgba(149, 82, 81, 0.6); + position: absolute; + top: 0; + opacity: 0; + -webkit-transition: all 0.5s; + transition: all 0.5s; } -.jumbotron h1, -.jumbotron h2, -.jumbotron h3, -.jumbotron p, -.jumbotron ul { - color: #fff; + +.home-blog-post .overlay a { + -webkit-transform: translateY(30px); + transform: translateY(30px); + opacity: 0; } -.jumbotron h1, -.jumbotron h2, -.jumbotron h3 { - color: #ffffff; - text-transform: uppercase; - letter-spacing: 0.08em; + +.home-blog-post .overlay i { + margin-right: 5px; } -.jumbotron p { + +.home-blog-post .text { + text-align: center; +} + +.home-blog-post .text .intro { + text-align: left; margin-bottom: 20px; - font-size: 21px; - font-weight: 400; + color: #888; + font-size: 0.9rem; } -.jumbotron p.text-uppercase { - font-weight: 700; + +.home-blog-post h4 { + margin: 10px 0; + text-transform: uppercase; + letter-spacing: 0.1em; } -.jumbotron > hr { - border-top-color: #d5d5d5; + +.home-blog-post .author-category { + font-size: 0.75rem; + color: #999; + text-transform: uppercase; + letter-spacing: 0.1em; } -.container .jumbotron { - border-radius: 0; + +.home-blog-post .author-category a { + font-weight: 500; } -.jumbotron .container { - max-width: 100%; - z-index: 2; + +.home-blog-post:hover .overlay { + opacity: 1; } -@media screen and (min-width: 768px) { - .jumbotron { - padding-top: 48px; - padding-bottom: 48px; - } - .container .jumbotron { - padding-left: 60px; - padding-right: 60px; - } - .jumbotron h1, - .jumbotron .h1 { - font-size: 46px; - } + +.home-blog-post:hover .overlay a { + -webkit-transform: none; + transform: none; + opacity: 1; } -#categoryMenu h3 { - padding: 20px; - background: #f7f7f7; - margin: 0; - border-bottom: solid 1px #eeeeee; - text-transform: uppercase; - letter-spacing: 0.08em; + +#blog-listing-big .post, #blog-listing-medium .post { + margin-bottom: 60px; } -.panel.sidebar-menu h3 { - padding: 5px 0; - margin: 0; + +#blog-listing-big .image, #blog-listing-medium .image { + margin-bottom: 15px; } -.panel.sidebar-menu { - background: #fff; - margin: 0 0 20px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; + +#blog-listing-big h2 a, #blog-listing-medium h2 a { + color: #555; + text-transform: uppercase; + letter-spacing: 0.1em; } -.panel.sidebar-menu .panel-heading { + +#blog-listing-big .author-category, #blog-listing-medium .author-category { + color: #999; text-transform: uppercase; + letter-spacing: 0.1em; + font-weight: 300; margin-bottom: 10px; - background: none; - padding: 0; - letter-spacing: 0.08em; - border-bottom: none; + font-size: .9rem; } -.panel.sidebar-menu .panel-heading h1, -.panel.sidebar-menu .panel-heading h2, -.panel.sidebar-menu .panel-heading h3, -.panel.sidebar-menu .panel-heading h4, -.panel.sidebar-menu .panel-heading h5 { - display: inline-block; - border-bottom: solid 5px #955251; - line-height: 1.1; + +#blog-listing-big .author-category a, #blog-listing-medium .author-category a { + font-weight: 500; margin-bottom: 0; - padding-bottom: 10px; } -.panel.sidebar-menu .panel-heading .btn.btn-danger { - color: #fff; - margin-top: 5px; + +#blog-listing-big .date-comments, #blog-listing-medium .date-comments { + margin-bottom: 0; } -.panel.sidebar-menu .panel-body { - padding: 0; + +#blog-listing-big .date-comments a, #blog-listing-medium .date-comments a { + color: #999; + margin-left: 25px; } -.panel.sidebar-menu .panel-body span.colour { - display: inline-block; - width: 15px; - height: 15px; - border: solid 1px #555555; - vertical-align: top; - margin-top: 2px; - margin-left: 5px; + +#blog-listing-big .date-comments i, #blog-listing-medium .date-comments i { + margin-right: 5px; } -.panel.sidebar-menu .panel-body span.colour.white { - background: #fff; + +#blog-listing-big p.intro, #blog-listing-medium p.intro { + margin-top: 10px; + color: #777; } -.panel.sidebar-menu .panel-body span.colour.red { - background: red; + +.pager { + padding: 20px 0; + margin-top: 20px; + border-top: 1px solid #e6e6e6; } -.panel.sidebar-menu .panel-body span.colour.green { - background: green; + +.disabled a, .disabled a:hover { + border-color: #999 !important; + color: #999 !important; + background: none !important; + cursor: not-allowed; } -.panel.sidebar-menu .panel-body span.colour.blue { - background: blue; + +#blog-post #post-content { + margin-bottom: 20px; } -.panel.sidebar-menu .panel-body span.colour.yellow { - background: yellow; + +#blog-post .comment { + margin-bottom: 25px; } -.panel.sidebar-menu .panel-body label { - color: #999999; - font-size: 12px; + +#blog-post .comment .posted { + color: #999; + font-size: 0.8rem; + margin-bottom: 10px; } -.panel.sidebar-menu .panel-body label:hover { - color: #555555; + +#blog-post .comment.last { + margin-bottom: 0; } -.panel.sidebar-menu ul.nav.category-menu { - margin-bottom: 20px; - text-transform: uppercase; - font-weight: 700; - letter-spacing: 0.08em; + +#blog-post .comment p { + font-size: 0.9rem; } -.panel.sidebar-menu ul.nav.category-menu li a { - font-family: "Roboto", Helvetica, Arial, sans-serif; + +#blog-post #comments, #blog-post #comment-form { + padding: 20px 0; + margin-top: 20px; + border-top: solid 1px #eee; } -.panel.sidebar-menu ul.nav ul { - list-style: none; - padding-left: 0; + +#blog-post #comments h4, #blog-post #comment-form h4 { + margin-bottom: 1.5rem; } -.panel.sidebar-menu ul.nav ul li { - display: block; -} -.panel.sidebar-menu ul.nav ul li a { - position: relative; - font-family: "Times New Roman", Times, serif; - font-weight: normal; - text-transform: none !important; - display: block; - padding: 10px 15px; - padding-left: 30px; - font-size: 12px; - color: #999999; -} -.panel.sidebar-menu ul.nav ul li a:hover, -.panel.sidebar-menu ul.nav ul li a:focus { - text-decoration: none; - background-color: #eeeeee; -} -.panel.sidebar-menu ul.tag-cloud { - list-style: none; - padding-left: 0; -} -.panel.sidebar-menu ul.tag-cloud li { - display: inline-block; -} -.panel.sidebar-menu ul.tag-cloud li a { - display: inline-block; - padding: 5px; - border: solid 1px #eeeeee; - border-radius: 0; - color: #955251; - margin: 5px 5px 5px 0; - text-transform: uppercase; - letter-spacing: 0.08em; - font-weight: 700; - font-size: 12px; - text-decoration: none; -} -.panel.sidebar-menu ul.tag-cloud li a:hover { - color: #955251; - border-color: #955251; -} -.panel.sidebar-menu ul.tag-cloud li.active a { - color: #FFFFFF; - background-color: #955251; -} -.panel.sidebar-menu ul.tag-cloud li.active a:hover { - color: #FFFFFF; -} -.panel.sidebar-menu ul.popular, -.panel.sidebar-menu ul.recent { - list-style: none; - padding-left: 0; - padding: 20px 0; -} -.panel.sidebar-menu ul.popular li, -.panel.sidebar-menu ul.recent li { - margin-bottom: 10px; - padding: 5px 0; - border-bottom: dotted 1px #eeeeee; -} -.panel.sidebar-menu ul.popular li:before, -.panel.sidebar-menu ul.recent li:before, -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - content: " "; - display: table; -} -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - clear: both; -} -.panel.sidebar-menu ul.popular li:before, -.panel.sidebar-menu ul.recent li:before, -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - content: " "; - display: table; -} -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - clear: both; -} -.panel.sidebar-menu ul.popular li img, -.panel.sidebar-menu ul.recent li img { - width: 50px; - margin-right: 10px; -} -.panel.sidebar-menu ul.popular li h5, -.panel.sidebar-menu ul.recent li h5 { - margin: 0 0 10px; -} -.panel.sidebar-menu ul.popular li h5 a, -.panel.sidebar-menu ul.recent li h5 a { - font-weight: normal; -} -.panel.sidebar-menu ul.popular li p.date, -.panel.sidebar-menu ul.recent li p.date { - float: right; - font-size: 12px; - color: #999999; -} -.panel.sidebar-menu ul.popular li:last-child, -.panel.sidebar-menu ul.recent li:last-child { - border-bottom: none; -} -.panel.sidebar-menu .text-widget { - font-size: 12px; -} -.panel.sidebar-menu.with-icons ul.nav li a:after { - font-family: 'FontAwesome'; - content: "\f105"; - position: relative; - top: 0; - float: right; -} -/* ribbons for product sales etc. */ -.ribbon { - position: absolute; - top: 50px; - padding-left: 51px; - font-weight: 700; - letter-spacing: 0.08em; -} -.ribbon .ribbon-background { - position: absolute; - top: 0; - right: 0; -} -.ribbon .theribbon { - position: relative; - width: 80px; - padding: 6px 20px 6px 20px; - margin: 30px 10px 10px -71px; - color: #fff; - background-color: #955251; - font-family: "Roboto", Helvetica, Arial, sans-serif; -} -.ribbon .theribbon:before, -.ribbon .theribbon:after { - content: ' '; - position: absolute; - width: 0; - height: 0; -} -.ribbon .theribbon:after { - left: 0px; - top: 100%; - border-width: 5px 10px; - border-style: solid; - border-color: #000000 #000000 transparent transparent; -} -.ribbon.sale { - top: 0; -} -.ribbon.new { - top: 50px; -} -.ribbon.new .theribbon { - background-color: #5bc0de; - text-shadow: 0px 1px 2px #bbb; -} -.ribbon.new .theribbon:after { - border-color: #2390b0 #2390b0 transparent transparent; -} -.ribbon.gift { - top: 100px; -} -.ribbon.gift .theribbon { - background-color: #5cb85c; - text-shadow: 0px 1px 2px #bbb; -} -.ribbon.gift .theribbon:after { - border-color: #357935 #357935 transparent transparent; -} -.owl-carousel .owl-controls .owl-page.active span, -.owl-theme .owl-controls .owl-page.active span, -.owl-carousel .owl-controls.clickable .owl-page:hover span, -.owl-theme .owl-controls.clickable .owl-page:hover span { - background: #955251; -} -.owl-carousel .owl-controls .owl-buttons, -.owl-theme .owl-controls .owl-buttons { - position: absolute; - top: 5px; - right: 0; -} -.owl-carousel .owl-controls .owl-buttons div, -.owl-theme .owl-controls .owl-buttons div { - width: 26px; - height: 26px; - line-height: 25px; - margin: 0 5px 0 0; - font-size: 18px; - color: #955251; - padding: 0; - background: #fff; - border-radius: 13px; - vertical-align: middle; - text-align: center; - opacity: 1; - filter: alpha(opacity=100); -} -.home-carousel { - position: relative; - background: url('../img/photogrid.jpg') center center repeat; - background-size: cover; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -.home-carousel .dark-mask { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: #955251; - opacity: 0.9; - filter: alpha(opacity=90); -} -.home-carousel .owl-carousel { - padding-top: 60px; - padding-bottom: 20px; -} -.home-carousel .owl-theme .owl-controls .owl-page span { - background: #666; -} -.home-carousel .owl-theme .owl-controls .owl-page.active span { - background: #fff; -} -.home-carousel .owl-theme .owl-controls .owl-page:hover span { - background: #fff; -} -@media (max-width: 767px) { - .home-carousel { - text-align: center !important; - } -} -@media (min-width: 992px) { - .home-carousel .right { - text-align: right; - } -} -.home-carousel h1, -.home-carousel h2, -.home-carousel h3, -.home-carousel p, -.home-carousel ul { - color: #fff; -} -.home-carousel h1 { - font-weight: 700; - text-transform: uppercase; - font-size: 46px; - letter-spacing: 0.08em; -} -@media (max-width: 991px) { - .home-carousel h1 { - font-size: 36px; - } -} -.home-carousel h2 { - font-weight: 700; - text-transform: uppercase; - font-size: 40px; - letter-spacing: 0.08em; -} -.home-carousel ul, -.home-carousel p { - font-size: 18px; - font-weight: 700; - padding: 0; - text-transform: uppercase; - letter-spacing: 0.10em; -} -@media (max-width: 991px) { - .home-carousel ul, - .home-carousel p { - font-size: 14px; - } -} -.home-carousel ul li { - margin-bottom: 10px; -} -.customers { - padding: 0; - margin-bottom: 40px; -} -.customers .item { - list-style-type: none; - text-align: center; - margin: 0 20px; -} -.customers .item img { - display: inline-block; - filter: url("data:image/svg+xml;utf8,#grayscale"); - /* Firefox 10+, Firefox on Android */ - filter: gray; - /* IE6-9 */ - -webkit-filter: grayscale(100%); - /* Chrome 19+, Safari 6+, Safari 6+ iOS */ - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -.customers .item img:hover { - max-width: auto; - filter: none; - -webkit-filter: none; -} -.testimonials { - padding: 0; - margin-bottom: 40px; -} -.testimonials .item { - list-style-type: none; - margin: 0 5px; - background: #fff; - padding-bottom: 60px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; -} -.testimonials .item .testimonial { - position: relative; - padding: 20px; -} -.testimonials .item .testimonial:before, -.testimonials .item .testimonial:after { - content: " "; - display: table; -} -.testimonials .item .testimonial:after { - clear: both; -} -.testimonials .item .testimonial:before, -.testimonials .item .testimonial:after { - content: " "; - display: table; -} -.testimonials .item .testimonial:after { - clear: both; -} -.testimonials .item .testimonial .text { - color: #999999; - margin-bottom: 40px; -} -.testimonials .item .testimonial .bottom { - position: absolute; - left: 0; - bottom: 0; - width: 100%; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - padding: 20px; - height: 50px; -} -.testimonials .item .testimonial .bottom .icon { - color: #955251; - font-size: 30px; - float: left; - width: 20%; -} -.testimonials .item .testimonial .name-picture { - float: right; - width: 80%; - text-align: right; -} -.testimonials .item .testimonial .name-picture h5 { - font-size: 14px; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.testimonials .item .testimonial .name-picture p { - color: #999999; - margin: 0; - font-size: 12px; -} -.testimonials .item .testimonial .name-picture img { - float: right; - width: 60px; - border-radius: 30px; - margin-left: 10px; -} -.team-member { - text-align: center; - margin-bottom: 40px; -} -.team-member h3 { - font-size: 18px; - text-transform: uppercase; - margin-bottom: 5px; - letter-spacing: 0.08em; -} -.team-member h3 a { - color: #555555; -} -.team-member p.role { - color: #999999; - font-size: 12px; - text-transform: uppercase; - letter-spacing: 0.06em; -} -.team-member .social { - margin-bottom: 20px; -} -.team-member .social a { - margin: 0 10px 0 0; - color: #fff; - display: inline-block; - width: 26px; - height: 26px; - border-radius: 13px; - line-height: 26px; - font-size: 15px; - text-align: center; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - vertical-align: bottom; -} -.team-member .social a i { - vertical-align: bottom; - line-height: 26px; -} -.team-member .social a.facebook { - background-color: #4460ae; -} -.team-member .social a.gplus { - background-color: #c21f25; -} -.team-member .social a.twitter { - background-color: #3cf; -} -.team-member .social a.instagram { - background-color: #cd4378; -} -.team-member .social a.email { - background-color: #4a7f45; -} -.team-member .text p { - color: #999999; - font-size: 12px; -} -.team-member .social, -.team-member-detail .social { + +#blog-post #comment-form { margin-bottom: 20px; } -.team-member .social a, -.team-member-detail .social a { - margin: 0 10px 0 0; - color: #fff; - display: inline-block; - width: 26px; - height: 26px; - border-radius: 13px; - line-height: 26px; - font-size: 15px; - text-align: center; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - vertical-align: bottom; -} -.team-member .social a i, -.team-member-detail .social a i { - vertical-align: bottom; - line-height: 26px; -} -.team-member .social a.facebook, -.team-member-detail .social a.facebook { - background-color: #4460ae; -} -.team-member .social a.gplus, -.team-member-detail .social a.gplus { - background-color: #c21f25; -} -.team-member .social a.twitter, -.team-member-detail .social a.twitter { - background-color: #3cf; -} -.team-member .social a.instagram, -.team-member-detail .social a.instagram { - background-color: #cd4378; -} -.team-member .social a.email, -.team-member-detail .social a.email { - background-color: #4a7f45; + +#blog-post .reply i { + margin-right: 5px; } + .box-simple { - text-align: center; margin-bottom: 40px; + text-align: center; +} + +.box-simple:hover .icon-outlined { + -webkit-transform: scale(1.1); + transform: scale(1.1); } -.box-simple .icon { + +.box-simple .icon-outlined { color: #955251; - border-color: #955251; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + border: 1px solid #955251; + -webkit-transition: all 0.3s; + transition: all 0.3s; } + .box-simple h3 { - font-weight: normal; - font-size: 18px; text-transform: uppercase; - line-height: 1.5; - color: #555555; - font-weight: 800; - letter-spacing: 0.08em; -} -.box-simple h3 a { - color: #555555; + letter-spacing: 0.1em; } + .box-simple p { - color: #999999; -} -.box-simple:hover .icon { - -webkit-transform: scale(1.1, 1.1); - -ms-transform: scale(1.1, 1.1); - -o-transform: scale(1.1, 1.1); - transform: scale(1.1, 1.1); -} -.box-simple:hover .icon i { - -webkit-transform: scale(1, 1); - -ms-transform: scale(1, 1); - -o-transform: scale(1, 1); - transform: scale(1, 1); + color: #999; + margin: 20px 0; + font-size: 0.9rem; } + .box-simple.box-white { - padding: 20px; - border: dotted 1px #999999; + border: dotted 1px #999; + padding: 15px 20px; + margin-bottom: 0; } + .box-simple.box-white .icon { - color: #555555; - border-color: transparent; - font-size: 70px; + font-size: 2rem; + margin-bottom: 1rem; +} + +.box-simple.box-white p { + color: #999; + margin-bottom: 5px; } + .box-simple.box-dark { - padding: 20px; - border: dotted 1px #999999; - background: #555555; + border: dotted 1px #999; + padding: 15px 20px; + margin-bottom: 0; color: #fff; + background: #555; } + .box-simple.box-dark .icon { - color: #f7f7f7; - border-color: transparent; - font-size: 70px; -} -.box-simple.box-dark h3 { - color: #fff; -} -.box-simple.box-dark h3 a { - color: #fff; + font-size: 2rem; + margin-bottom: 1rem; } + .box-simple.box-dark p { + margin-bottom: 5px; color: #fff; } -.box-image { - position: relative; - overflow: hidden; - text-align: center; - margin: 15px 0; + +.same-height div[class*="col-"] { + margin-bottom: 30px; } -.box-image .bg { - position: absolute; - top: auto; - bottom: 0; - width: 100%; + +.same-height .box-white, .same-height.box-dark { height: 100%; - opacity: 0; - filter: alpha(opacity=0); - background: #955251; } -.box-image .name { - position: absolute; - width: 100%; - height: 50%; - bottom: 0; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image .name h3 { - color: #fff; - text-transform: uppercase; - font-size: 18px; - letter-spacing: 0.08em; -} -.box-image .name h3 a { - color: #fff; - text-decoration: none; -} -.box-image .text { - position: absolute; - width: 100%; - height: 50%; - top: 0; - -webkit-transform: translate(0, -150%); - -ms-transform: translate(0, -150%); - -o-transform: translate(0, -150%); - transform: translate(0, -150%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image:hover .bg { - opacity: 0.7; - filter: alpha(opacity=70); -} -.box-image:hover .name { - position: absolute; - -webkit-transform: translate(0, -75%); - -ms-transform: translate(0, -75%); - -o-transform: translate(0, -75%); - transform: translate(0, -75%); -} -.box-image:hover .text { - position: absolute; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); -} -.box-image-text { - position: relative; - overflow: hidden; - text-align: center; - margin: 15px 0; -} -.box-image-text .top { + +.box-image { position: relative; - margin-bottom: 10px; -} -.box-image-text .top .bg { - position: absolute; - top: auto; - bottom: 0; - width: 100%; - height: 100%; - opacity: 0; - filter: alpha(opacity=0); - background: #955251; -} -.box-image-text .top .name { - position: absolute; - width: 100%; - height: 50%; - bottom: 0; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image-text .top .name h3 { - color: #fff; - text-transform: uppercase; - font-size: 18px; - letter-spacing: 0.08em; -} -.box-image-text .top .name h3 a { - color: #fff; - text-decoration: none; -} -.box-image-text .top .text { - position: absolute; - width: 100%; - height: 50%; - top: 0; - -webkit-transform: translate(0, -150%); - -ms-transform: translate(0, -150%); - -o-transform: translate(0, -150%); - transform: translate(0, -150%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image-text .content h3, -.box-image-text .content h4 { - text-transform: uppercase; - line-height: 1.5; - color: #555555; - font-weight: 800; - letter-spacing: 0.08em; -} -.box-image-text .content p { - color: #999999; -} -.box-image-text:hover .bg { - opacity: 0.7; - filter: alpha(opacity=70); -} -.box-image-text:hover .name { - position: absolute; - -webkit-transform: translate(0, -75%); - -ms-transform: translate(0, -75%); - -o-transform: translate(0, -75%); - transform: translate(0, -75%); -} -.box-image-text:hover .text { - position: absolute; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); -} -/* universal box */ -.box { - background: #fff; - margin: 0 0 30px; - border: solid 1px #ccc; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - padding: 20px 0; - border-left: none; - border-right: none; -} -.box .box-header { - background: #f7f7f7; - margin: -20px 0 20px; - padding: 20px; - border-bottom: solid 1px #eeeeee; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.box .box-header:before, -.box .box-header:after { - content: " "; - display: table; -} -.box .box-header:after { - clear: both; -} -.box .box-header:before, -.box .box-header:after { - content: " "; - display: table; -} -.box .box-header:after { - clear: both; -} -.box .box-footer { - background: #f7f7f7; - margin: 30px 0 -20px; - padding: 20px; - border-top: solid 1px #eeeeee; -} -.box .box-footer:before, -.box .box-footer:after { - content: " "; - display: table; -} -.box .box-footer:after { - clear: both; + margin: 20px 0; } -.box .box-footer:before, -.box .box-footer:after { - content: " "; - display: table; + +.box-image:hover .overlay { + opacity: 1; } -.box .box-footer:after { - clear: both; + +.box-image:hover h3, .box-image:hover p, .box-image:hover .buttons { + opacity: 1; + -webkit-transform: none; + transform: none; } -@media (max-width: 991px) { - .box .box-footer .btn { - margin-bottom: 20px; - } + +.box-image:hover p { + -webkit-transition-delay: 0.1s; + transition-delay: 0.1s; } -.box.no-border { - border: none; + +.box-image:hover .buttons { + -webkit-transition-delay: 0.2s; + transition-delay: 0.2s; } -#heading-breadcrumbs { - background: url('../img/texture-bw.png') center center repeat; - padding: 20px 0; - margin-bottom: 40px; + +.box-image .name { + margin-bottom: 20px; } -#heading-breadcrumbs.no-mb { - margin-bottom: 0; + +.box-image a { + text-decoration: none !important; } -#heading-breadcrumbs h1 { - color: #333333; + +.box-image h3 { + font-size: 1.125rem; text-transform: uppercase; - font-size: 30px; - font-weight: 700; - letter-spacing: 0.08em; -} -@media (max-width: 991px) { - #heading-breadcrumbs h1 { - text-align: center; - } -} -#heading-breadcrumbs ul.breadcrumb { - margin-top: 5px; - margin-bottom: 0; -} -.bar { - position: relative; - background: #955251; - padding: 60px 0; -} -.bar.background-pentagon { - background: url('../img/texture-bw.png') center center repeat; - border-top: solid 1px #999999; - border-bottom: solid 1px #999999; -} -.bar.background-gray { - background: #eeeeee; -} -.bar.background-gray-dark { - background: #555555; -} -.bar.background-white { - background: #fff; -} -.bar.background-image-fixed-1 { - background: url('../img/fixed-background-1.jpg') center top no-repeat; - background-attachment: fixed; - background-size: cover; -} -.bar.background-image-fixed-2 { - background: url('../img/fixed-background-2.jpg') center top no-repeat; - background-attachment: fixed; - background-size: cover; -} -.bar.color-white h1, -.bar.color-white h2, -.bar.color-white h3, -.bar.color-white h4, -.bar.color-white h5, -.bar.color-white h6, -.bar.color-white p { - color: #fff; -} -.bar.padding-big { - padding: 50px 0; -} -.bar.padding-horizontal { - padding-left: 30px; - padding-right: 30px; -} -.bar.margin-vertical { - margin-top: 20px; - margin-bottom: 20px; + letter-spacing: 0.1em; + -webkit-transition: all 0.3s; + transition: all 0.3s; + opacity: 0; + -webkit-transform: translateY(-50px); + transform: translateY(-50px); } -.bar .dark-mask { + +.box-image .overlay { + width: 100%; + height: 100%; position: absolute; top: 0; left: 0; - width: 100%; - height: 100%; - background: #000; - opacity: 0.3; - filter: alpha(opacity=30); -} -.portfolio.no-space { - padding: 0 15px; -} -.portfolio.no-space .box-image { - margin: 0 -15px; -} -.portfolio-project .project-more h4 { - color: #555555; - text-transform: uppercase; - margin-bottom: 0; - text-align: left; - font-size: 14px; - letter-spacing: 0.08em; -} -.portfolio-project .project-more p { - color: #999999; - padding: 10px 0; - margin-bottom: 20px; - text-align: left; -} -.portfolio-showcase { - margin: 15px 0 60px; -} -.portfolio-showcase h3 a { - text-transform: uppercase; - line-height: 1.5; - letter-spacing: 0.08em; + background: rgba(149, 82, 81, 0.6); + padding: 20px; + -webkit-transition: all 0.3s; + transition: all 0.3s; + opacity: 0; } -.portfolio-showcase p.lead { - color: #555555; - margin-bottom: 20px; + +.box-image .buttons { + opacity: 0; + -webkit-transition: all 0.3s; + transition: all 0.3s; + -webkit-transform: translateY(20px); + transform: translateY(20px); +} + +.box-image .buttons a { + margin: 0 3px; +} + +.box-image p { + -webkit-transition: all 0.3s; + transition: all 0.3s; + opacity: 0; + -webkit-transform: translateY(20px); + transform: translateY(20px); } -.portfolio-showcase p { - color: #999999; + +.box-image-text .content { + text-align: center; } -.portfolio-showcase p.buttons { - margin-top: 40px; + +.box-image-text p { + color: #777; + font-size: 0.9rem; } + .see-more { - text-align: center; - margin-top: 20px; - padding-top: 20px; + margin-top: 40px; } + .see-more p { - font-size: 28px; + font-size: 1.8rem; font-weight: 100; - margin-bottom: 20px; -} -.showcase .item { - text-align: center; } -.showcase .item .icon { - display: inline-block; - width: 50px; - height: 50px; - color: #555555; - line-height: 50px; - border-radius: 25px; - border: solid 1px #555555; -} -.showcase .item h4 { - color: #555555; - text-transform: uppercase; - letter-spacing: 0.08em; - line-height: 1.5; - font-size: 16px; -} -.showcase .item h4 span { - font-weight: bold; - font-size: 51px; + +.box { + margin: 80px 0; + border-top: 1px solid #ddd; + border-bottom: 1px solid #ddd; + padding: 20px; } -.packages .package { - background: #fff; + +.box a.btn { margin-top: 25px; - margin-bottom: 20px; - padding-bottom: 15px; - text-align: center; - border: solid 1px #955251; - overflow: hidden; -} -.packages .package .package-header { - height: 57px; - color: #fff; - line-height: 57px; - background: #955251; -} -.packages .package .package-header h5 { - color: #fff; - text-transform: uppercase; - font-weight: bold; - line-height: 57px; - margin: 0; - letter-spacing: 0.08em; -} -.packages .package .package-header.light-gray { - background: #eeeeee; -} -.packages .package .package-header.light-gray h5 { - color: #555555; -} -.packages .package .price { - line-height: 120px; - height: 100px; - color: #fff; - font-weight: 400; -} -.packages .package .price h4 { - display: inline; - font-size: 50px; - line-height: normal; - margin-bottom: 0; -} -.packages .package .price .period { - line-height: normal; - color: #999999; -} -.packages .package ul { - padding: 0; -} -.packages .package ul li { - list-style-type: none; - padding-top: 10px; - padding-bottom: 10px; - width: 80%; - margin: auto; - border-bottom: 1px dotted #ccc; -} -.packages .package ul li:last-child { - border-bottom: 0; -} -.packages .package ul li i { - font-size: 13px; - margin-right: 5px; -} -.packages .best-value .package { - margin-top: 0; - padding-bottom: 40px; -} -.packages .best-value .package .package-header { - height: 72px; - padding-top: 17px; - height: 82px !important; -} -.packages .best-value .package .package-header h5 { - font-weight: bold; - line-height: 29px; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.packages .best-value .package .package-header .meta-text { - font-size: 13px; - line-height: 15px; -} -#map { - height: 300px; -} -#map.with-border { - border-top: solid 1px #955251; - border-bottom: solid 1px #955251; -} -#blog-listing-big .post, -#blog-homepage .post { - margin-bottom: 60px; } -#blog-listing-big .post h2, -#blog-homepage .post h2, -#blog-listing-big .post h4, -#blog-homepage .post h4 { - text-transform: uppercase; - letter-spacing: 0.08em; -} -#blog-listing-big .post h2 a, -#blog-homepage .post h2 a, -#blog-listing-big .post h4 a, -#blog-homepage .post h4 a { - color: #555555; -} -#blog-listing-big .post h2 a:hover, -#blog-homepage .post h2 a:hover, -#blog-listing-big .post h4 a:hover, -#blog-homepage .post h4 a:hover { - color: #955251; -} -#blog-listing-big .post .author-category, -#blog-homepage .post .author-category { - color: #999999; + +.box .box-header { + background: #f7f7f7; + margin: 20px 0 20px; + padding: 20px; + border-top: 1px solid #eee; text-transform: uppercase; - font-weight: 300; - letter-spacing: 0.08em; -} -#blog-listing-big .post .author-category a, -#blog-homepage .post .author-category a { - font-weight: 500; -} -#blog-listing-big .post .date-comments a, -#blog-homepage .post .date-comments a { - color: #999999; - margin-right: 20px; + letter-spacing: 0.1em; } -#blog-listing-big .post .date-comments a:hover, -#blog-homepage .post .date-comments a:hover { - color: #955251; + +.box .box-footer { + background: #f7f7f7; + margin-top: 30px; + padding: 20px; + border-top: 1px solid #eee; } -@media (min-width: 768px) { - #blog-listing-big .post .date-comments, - #blog-homepage .post .date-comments { - text-align: right; - } + +.box.shipping-method, .box.payment-method { + margin: 0; + margin-bottom: 20px; } -#blog-listing-big .post .intro, -#blog-homepage .post .intro { - text-align: left; + +.box.shipping-method h4, .box.payment-method h4 { + text-transform: uppercase; + letter-spacing: 0.1em; + margin-bottom: 5px; } -#blog-listing-big .post .image, -#blog-homepage .post .image { - margin-bottom: 10px; - overflow: hidden; + +.box.shipping-method p, .box.payment-method p { + font-size: 0.9rem; + color: #555; } -#blog-listing-big .post .image img, -#blog-homepage .post .image img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.box-image-text { + margin: 15px 0; } -@media (max-width: 767px) { - #blog-listing-big .post .image img.img-responsive, - #blog-homepage .post .image img.img-responsive { - min-width: 100%; - } + +.box-image-text .image { + position: relative; + margin-bottom: 15px; } -#blog-listing-big .post .video, -#blog-homepage .post .video { - margin-bottom: 10px; + +.box-image-text .overlay { + width: 100%; + height: 100%; + background: rgba(149, 82, 81, 0.6); + position: absolute; + top: 0; + opacity: 0; + -webkit-transition: all 0.5s; + transition: all 0.5s; } -#blog-listing-big .post .read-more, -#blog-homepage .post .read-more { - text-align: right; + +.box-image-text .overlay a { + -webkit-transform: translateY(30px); + transform: translateY(30px); + opacity: 0; } -#blog-listing-medium .post { - margin-bottom: 60px; + +.box-image-text .overlay i { + margin-right: 5px; } -#blog-listing-medium .post h2 { - text-transform: uppercase; - margin: 0 0 10px; - font-size: 24px; - letter-spacing: 0.08em; + +.box-image-text .text { + text-align: center; } -#blog-listing-medium .post h2 a { - color: #555555; + +.box-image-text .text .intro { + text-align: left; + margin-bottom: 20px; + color: #888; + font-size: 0.9rem; } -#blog-listing-medium .post h2 a:hover { - color: #955251; + +.box-image-text h4 { + margin: 10px 0; + text-transform: uppercase; + letter-spacing: 0.1em; } -#blog-listing-medium .post .author-category { - float: left; - color: #999999; + +.box-image-text .author-category { + font-size: 0.75rem; + color: #999; text-transform: uppercase; - font-weight: 300; - font-size: 12px; - letter-spacing: 0.08em; + letter-spacing: 0.1em; } -#blog-listing-medium .post .author-category a { + +.box-image-text .author-category a { font-weight: 500; } -#blog-listing-medium .post .date-comments { - float: right; - font-size: 12px; -} -#blog-listing-medium .post .date-comments a { - color: #999999; - margin-right: 20px; -} -#blog-listing-medium .post .date-comments a:hover { - color: #955251; -} -@media (min-width: 768px) { - #blog-listing-medium .post .date-comments { - text-align: right; - } -} -#blog-listing-medium .post .intro { - text-align: left; + +.box-image-text:hover .overlay { + opacity: 1; } -#blog-listing-medium .post .clearfix:before, -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:before, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:before, -#blog-listing-medium .post .navbar-header:after { - content: " "; - display: table; -} -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:after { - clear: both; -} -#blog-listing-medium .post .clearfix:before, -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:before, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:before, -#blog-listing-medium .post .navbar-header:after { - content: " "; - display: table; + +.box-image-text:hover .overlay a { + -webkit-transform: none; + transform: none; + opacity: 1; } -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:after { - clear: both; + +.box-footer a { + margin: 0 !important; } -#blog-listing-medium .post .image { - margin-bottom: 10px; - overflow: hidden; + +.box-footer .right-col i { + margin-left: 5px; } -#blog-listing-medium .post .image img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.box-footer .left-col i { + margin-right: 5px; } + @media (max-width: 767px) { - #blog-listing-medium .post .image img.img-responsive { - min-width: 100%; + .box-footer { + -webkit-box-pack: center !important; + -ms-flex-pack: center !important; + justify-content: center !important; + } + .box-footer a { + margin-bottom: 10px !important; } } -#blog-listing-medium .post .video { - margin-bottom: 10px; + +.jumbotron h1, .jumbotron h2 { + letter-spacing: 0.1em; } -#blog-listing-medium .post .read-more { - text-align: right; + +.jumbotron p { + letter-spacing: 0.1em; + font-size: 1.3rem; +} + +.package { + text-align: center; + border: 1px solid #955251; + margin-top: 25px; + margin-bottom: 20px; + padding-bottom: 15px; + overflow: hidden; } -.box-image-text.blog .author-category { - color: #999999; + +.package .package-header { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + height: 55px; +} + +.package .package-header h5 { + margin: 0; text-transform: uppercase; - letter-spacing: 0.08em; - font-weight: 300; - font-size: 12px; + letter-spacing: 0.1em; + display: inline-block; + color: #555; } -.box-image-text.blog .author-category a { - font-weight: 500; + +.package .package-header .meta-text { + font-size: 0.8rem; } -.box-image-text.blog .intro { - text-align: left; + +.package h4 { + margin-top: 1rem; + margin-bottom: 0; + color: #333; +} + +.package .price-container { margin-bottom: 20px; } -#blog-homepage .post { - margin-bottom: 30px; + +.package .price-container span.period { + color: #777; + font-size: 0.9rem; + margin-left: 10px; } -#blog-homepage .post h2, -#blog-homepage .post h4, -#blog-homepage .post .author-category, -#blog-homepage .post .read-more { - text-align: center; + +.package ul { + padding: 0 30px; } -#blog-homepage .post .read-more { - margin-top: 20px; + +.package ul li { + padding: 10px; + border-bottom: 1px solid #eee; + color: #555; + font-size: 0.9rem; } -#blog-post #post-content { - margin-bottom: 20px; + +.package ul i { + margin-right: 10px; } -#blog-post .comment { - margin-bottom: 25px; + +.best-value .package { + margin-top: 0; + padding-bottom: 40px; + border: 1px solid #955251; } -#blog-post .comment:before, -#blog-post .comment:after { - content: " "; - display: table; + +.best-value .package .package-header { + height: 85px; } -#blog-post .comment:after { - clear: both; + +.best-value .package .package-header h5 { + color: #fff; } -#blog-post .comment:before, -#blog-post .comment:after { - content: " "; - display: table; + +.team-member { + margin-bottom: 40px; } -#blog-post .comment:after { - clear: both; + +.team-member .image { + margin-bottom: 1rem; } -#blog-post .comment .posted { - color: #999999; - font-size: 12px; + +.team-member a { + color: #333; } -#blog-post .comment .reply { - font-family: "Roboto", Helvetica, Arial, sans-serif; + +.team-member a:hover { + color: #333; } -#blog-post .comment.last { + +.team-member h3 { + font-size: 1.125rem; + text-transform: uppercase; + letter-spacing: 0.1em; + margin-bottom: 5px; +} + +.team-member p.role { + font-size: 0.8rem; + text-transform: uppercase; + color: #999; margin-bottom: 0; } -#blog-post #comments, -#blog-post #comment-form { - padding: 20px 0; - margin-top: 20px; - border-top: solid 1px #eeeeee; + +.team-member p { + color: #999; + font-size: 0.8rem; } -#blog-post #comments:before, -#blog-post #comment-form:before, -#blog-post #comments:after, -#blog-post #comment-form:after { - content: " "; - display: table; + +.team-member-detail p:not(.lead) { + color: #555; + font-size: 0.9rem; } -#blog-post #comments:after, -#blog-post #comment-form:after { - clear: both; + +.portfolio p { + color: #fff; } -#blog-post #comments:before, -#blog-post #comment-form:before, -#blog-post #comments:after, -#blog-post #comment-form:after { - content: " "; - display: table; + +.portfolio-project p { + font-size: 0.9rem; + color: #888; } -#blog-post #comments:after, -#blog-post #comment-form:after { - clear: both; + +.portfolio-project .project-more p { + padding: 5px 0; + font-size: 0.85rem; } -#blog-post #comments h4, -#blog-post #comment-form h4 { - margin-bottom: 20px; + +.portfolio-project .project-more h4 { + margin-bottom: 5px; + text-transform: uppercase; + letter-spacing: 0.1em; + font-size: 0.88rem; + color: #555; } -#blog-post #comment-form { - margin-bottom: 20px; + +.portfolio-showcase { + margin-bottom: 60px; +} + +.portfolio-showcase h3 { + text-transform: uppercase; + -webkit-transition-property: 0.1rem; + transition-property: 0.1rem; +} + +.portfolio-showcase .buttons { + margin-top: 40px; +} + +.portfolio-showcase p:not(.lead) { + color: #999; + font-size: 0.9rem; } + +.portfolio-showcase p.lead { + color: #666; +} + .product { - background: #fff; - border-bottom: solid 1px #e6e6e6; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - margin-bottom: 60px; - overflow: hidden; text-align: center; + position: relative; + margin-bottom: 40px; } + .product .image { overflow: hidden; + max-height: 190px; } -.product .image img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -@media (max-width: 767px) { - .product .image img.img-responsive { - min-width: 100%; - } + +.product .image a { + margin: 0; } + .product .text { padding: 10px; + border-bottom: 1px solid #ddd; } + .product .text h3 { - font-size: 14px; - font-weight: 700; - height: 39.6px; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.product .text h3 a { - color: #555555; -} -.product .text h3 a:hover { - text-decoration: none; + min-height: 63px; } -.product .text p.price { - font-size: 18px; + +.product .price { + font-size: 1.1rem; } -.product .text p.price del { - color: #999999; + +.product .price del { + color: #999; + display: inline-block; + margin-right: 5px; } -.product .buttons { - clear: both; - position: absolute; - display: none; - bottom: 0; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - width: 100%; - border: solid 1px transparent; - padding: 20px; - background: rgba(255, 255, 255, 0.9); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - text-align: center; + +.product img { + -webkit-transition: all 0.3s; + transition: all 0.3s; } -.product .buttons .btn { - margin-bottom: 20px; + +.product:hover img { + -webkit-transform: scale(1.1); + transform: scale(1.1); } -.product:hover { - border-bottom: solid 1px #808080; - top: 0; + +.product:hover .text { + border-color: #555; } -.product:hover .buttons { - clear: both; - position: absolute; - top: 0; - background: rgba(255, 255, 255, 0.5); + +.product a { + text-transform: uppercase; + letter-spacing: 0.1em; + color: #333; + text-decoration: none !important; + margin-top: 15px; } -.product:hover .image img { - -webkit-transform: scale(1.1, 1.1); - -ms-transform: scale(1.1, 1.1); - -o-transform: scale(1.1, 1.1); - transform: scale(1.1, 1.1); + +.products-big .image { + min-height: 250px; + max-height: 250px; } + .goToDescription { - font-size: 12px; text-align: center; + font-size: 0.8rem; margin-bottom: 40px; } + .goToDescription a { - color: #999999; + color: #999; text-decoration: underline; } -#productMain { - margin-bottom: 30px; + +table tr td { + vertical-align: middle !important; +} + +#customer-orders a.btn { + margin-top: 0; +} + +#customer-orders table { + font-size: 0.9rem; +} + +#customer-orders th { + border-top: 0; +} + +#customer-order img { + width: 50px; +} + +#customer-order tfoot th { + font-size: 1.2rem; + font-weight: 300; +} + +#customer-order p { + font-size: 1.2rem; + font-weight: 300; +} + +#productMain #thumbs { + margin-top: 30px; +} + +#productMain input { + display: none; } + #productMain .sizes { text-align: center; } -#productMain .sizes h3 { - font-weight: 700; - letter-spacing: 0.08em; - text-transform: uppercase; - margin-bottom: 40px; -} + #productMain .sizes a { - display: inline-block; - width: 40px; - height: 40px; - border-radius: 40px; - background: #ccc; - line-height: 40px; - color: #555555; - text-align: center; - text-decoration: none; - font-family: "Roboto", Helvetica, Arial, sans-serif; + text-decoration: none !important; } -#productMain .sizes a.active, + #productMain .sizes a:hover { background: #955251; color: #fff; } -#productMain .sizes input { - display: none; -} + #productMain .price { - font-size: 40px; text-align: center; - margin-top: 40px; - margin-bottom: 40px; + font-size: 2.5rem; + margin: 30px 0; + color: #555; } -#thumbs a { - display: block; - border: solid 1px transparent; + +#basket thead th { + border-top: none; } -#thumbs a.active { - border-color: #955251; + +#basket tfoot th { + font-size: 1.25rem; + color: #555; } -#product-social { - text-align: center; + +#order-summary tr td { + color: #999; } -#product-social h4 { - font-weight: 300; + +#order-summary tr.total { + font-size: 1.25rem; + color: #555; + font-weight: 700; +} + +#order-summary tr.total td { + color: #555; +} + +#checkout .nav-pills { + margin-bottom: 30px; + border-bottom: 1px solid #955251; +} + +#checkout .nav-pills a { + font-size: 0.9rem; + border-bottom: none !important; +} + +#checkout .nav-pills a.disabled { + cursor: not-allowed; +} + +#checkout form label { + margin-bottom: 5px; +} + +#checkout .payment-method:hover, #checkout .shipping-method:hover { + cursor: pointer; +} + +@media (max-width: 767px) { + .nav-pills { + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + } +} + +.sidebar-menu .badge { + font-weight: 700; + margin: 0; +} + +.sidebar-menu.with-icons a.nav-link { + position: relative; +} + +.sidebar-menu.with-icons a.nav-link::before { + content: '\f105'; + display: inline-block; + position: absolute; + top: 50%; + right: 15px; + -webkit-transform: translateY(-50%); + transform: translateY(-50%); + font-family: 'FontAwesome'; +} + +.panel-heading { margin-bottom: 10px; } -#product-social p { - line-height: 26px; + +.panel-heading h3 { + margin-top: 5px; } -#product-social p a { - margin: 0 10px 0 0; + +.panel-heading .btn { color: #fff; + text-decoration: none !important; +} + +.panel-heading .btn i { + margin-right: 7px; +} + +.panel-body p { + font-size: .9rem; + color: #555; +} + +.panel-body label { + font-size: 0.8rem; + font-weight: 400 !important; + color: #777; + opacity: 0.9; display: inline-block; - width: 26px; - height: 26px; - border-radius: 13px; - line-height: 26px; - font-size: 15px; - text-align: center; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - vertical-align: bottom; + cursor: pointer; } -#product-social p a i { - vertical-align: bottom; - line-height: 26px; + +.panel-body label input { + margin-right: 5px; } -#product-social p a.facebook { - background-color: #4460ae; + +.panel-body label:hover { + opacity: 1; } -#product-social p a.gplus { - background-color: #c21f25; + +.panel-body span.colour { + display: inline-block; + width: 14px; + height: 14px; + margin-top: 10px; + margin-left: 5px; + border: 1px solid #555; } -#product-social p a.twitter { - background-color: #3cf; + +.panel-body span.colour.white { + background: #fff; } -#product-social p a.instagram { - background-color: #cd4378; + +.panel-body span.colour.blue { + background: #007bff; } -#product-social p a.email { - background-color: #4a7f45; + +.panel-body span.colour.green { + background: #28a745; } -@media (max-width: 991px) { - #product-social { - text-align: center; - } + +.panel-body span.colour.red { + background: #dc3545; } -#checkout .nav { - margin-bottom: 20px; - border-bottom: solid 1px #955251; + +.panel-body span.colour.yellow { + background: #ffc107; } -#checkout .nav li { - height: 100%; + +.nav-pills .nav-link { + border-radius: 0; } -#checkout .nav li a { - display: block; - height: 100%; + +.nav-pills .nav-link:hover { + background: #eee; } -#order-summary table { - margin-top: 20px; + +.nav-pills .nav-link.active { + background: #955251; } -#order-summary table td { - color: #999999; + +.panel { + margin-bottom: 20px; } -#order-summary table tr.total td, -#order-summary table tr.total th { - font-size: 18px; - color: #555555; + +.category-menu a.nav-link { + text-transform: uppercase; + letter-spacing: 0.1em; font-weight: 700; } -#checkout .table tbody tr td, -#basket .table tbody tr td, -#customer-order .table tbody tr td { - vertical-align: middle; + +ul ul a.nav-link { + padding-left: 30px !important; + font-size: 0.85rem; + text-transform: none !important; + font-weight: 400 !important; + color: #777; } -#checkout .table tbody tr td input, -#basket .table tbody tr td input, -#customer-order .table tbody tr td input { - width: 50px; - text-align: right; + +.tag-cloud a { + font-size: 0.8rem; + border: 1px solid #eee; + text-transform: uppercase; + letter-spacing: 0.1em; + font-weight: 600; + padding: 5px 10px; + text-transform: uppercase; + margin: 3px 0; + text-decoration: none !important; } -#checkout .table tbody tr td img, -#basket .table tbody tr td img, -#customer-order .table tbody tr td img { - width: 50px; + +.tag-cloud a:hover { + border-color: #955251; } -#checkout .table tfoot, -#basket .table tfoot, -#customer-order .table tfoot { - font-size: 18px; + +.tag-cloud i { + margin-right: 5px; } -.shipping-method h4, -.payment-method h4 { + +.ribbon { + width: 80px; + height: 32px; + line-height: 32px; + background: #955251; + color: #fff; text-transform: uppercase; - letter-spacing: 0.08em; + letter-spacing: 0.1em; + font-weight: 700; + font-size: 0.9rem; + margin-bottom: 20px; + position: absolute; + top: 30px; + left: -15px; + text-align: center; } -#customer-orders table tr th, -#customer-orders table tr td { - vertical-align: baseline; + +.ribbon.sale { + background: #955251; } -#customer-order .table tfoot th { - font-size: 18px; - font-weight: 300; + +.ribbon.new { + background: #5bc0de; } -#customer-order .addresses { - text-align: right; - margin-bottom: 30px; + +.ribbon.new::after { + content: ''; + border-top: 15px solid #1f7e9a; } -#customer-order .addresses p { - font-size: 18px; - font-weight: 300; + +.ribbon.sold { + background: #f0ad4e; } -#customer-account { - margin-bottom: 30px; + +.ribbon.sold::after { + content: ''; + border-top: 15px solid #b06d0f; } -#get-it { - background: #955251; - padding: 50px 0 30px; - color: #fff; - text-align: center; + +.ribbon.gift { + background: #5cb85c; +} + +.ribbon.gift::after { + content: ''; + border-top: 15px solid #2d672d; +} + +.ribbon:nth-of-type(2) { + top: 82px; +} + +.ribbon::after { + content: ''; + border-top: 15px solid #5a3131; + border-left: 15px solid transparent; + border-right: 0 solid transparent; + position: absolute; + bottom: -15px; + left: 0; + display: block; } -#get-it h1, -#get-it h2, -#get-it h3, -#get-it h4, -#get-it h5, -#get-it h6 { - color: #fff; + +.badge { + font-weight: 400; text-transform: uppercase; - letter-spacing: 0.08em; - margin: 0 0 20px; + letter-spacing: 0.1em; + padding: 3px 5px; } -#get-it p { - margin: 0 0 20px; + +#map { + border-top: 1px solid #955251; + border-bottom: 1px solid #955251; + height: 300px; } -#footer { - background: #555555; + +.get-it { + background: #955251; + color: #fff; padding: 50px 0; - color: #999999; -} -#footer h1, -#footer h2, -#footer h3, -#footer h4, -#footer h5, -#footer h6 { - color: #eeeeee; -} -#footer h4 { - font-size: 14px; - font-weight: 800; - text-transform: uppercase; - letter-spacing: 0.08em; } -#footer ul { - padding-left: 0; - list-style: none; -} -#footer ul a { - color: #999999; + +.get-it h3 { + text-transform: uppercase; + letter-spacing: 0.1em; + margin: 0; } -#footer ul a:hover { - color: #955251; - text-decoration: none; + +footer.main-footer { + padding: 60px 0; + padding-bottom: 0; + background: #555; + color: #fff; } -#footer .photostream div { - float: left; - display: block; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - width: 33%; - padding: 7.5px; - overflow: hidden; + +footer.main-footer a { + color: inherit; + color: #eee; } -#footer .photostream div a { - border: solid 1 px #eeeeee; + +footer.main-footer h4 { + color: #eee; + margin: 10px 0; + text-transform: uppercase; + letter-spacing: 0.1em; } -#footer .photostream div img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +footer.main-footer p { + font-size: 0.9rem; + color: #aaa; } -#footer .photostream div:hover img { - -webkit-transform: scale(1.1, 1.1); - -ms-transform: scale(1.1, 1.1); - -o-transform: scale(1.1, 1.1); - transform: scale(1.1, 1.1); + +footer.main-footer hr { + border: none; + border-top: 1px solid #ddd; + background: none; } -#footer .blog-entries .item { - clear: both; - padding: 5px 0; - margin-bottom: 10px; - border-bottom: solid 1px #555555; + +footer.main-footer .footer-blog-list li { + margin-bottom: 20px; } -#footer .blog-entries .item .image { - float: left; - width: 15%; + +footer.main-footer .image { + width: 40px; + height: 40px; margin-right: 10px; + -ms-flex-negative: 0; + flex-shrink: 0; } -#footer .blog-entries .item .name { - width: 75%; - margin-left: 10px; - display: table-cell; - vertical-align: middle; -} -#footer .blog-entries .item .name h5 { - margin: 0; + +footer.main-footer .text { text-transform: uppercase; - letter-spacing: 0.08em; - font-size: 12px; -} -#footer .blog-entries .item .name h5 a { - color: #eeeeee; -} -#footer .blog-entries .item .text { - width: 100%; - clear: both; + letter-spacing: 0.1em; } -#footer .blog-entries .item:last-child { - border-bottom: none; - margin-bottom: 0; + +footer.main-footer .text a { + font-size: 0.8rem; } -#footer .social a { - color: #555555; - font-size: 25px; - margin: 0 10px 0 0; + +footer.main-footer .photo-stream li { + margin: 0; } -#footer .social a:hover { - color: #955251; + +footer.main-footer .photo-stream a { + width: 80px; + height: 80px; + padding: 5px; + display: block; } -#copyright { + +footer.main-footer .copyrights { + padding: 50px 0; background: #333; color: #ccc; - padding: 50px 0; - font-size: 12px; - line-height: 28px; + margin-top: 50px; } -#copyright p { - margin: 0; + +footer.main-footer .copyrights a { + color: #955251; +} + +footer.main-footer .copyrights p { + color: inherit; + font-size: 0.8rem; + margin-bottom: 0; } + @media (max-width: 991px) { - #copyright p { - float: none !important; - text-align: center; - margin-bottom: 10px; + footer.main-footer .photo-stream a { + width: 120px; + height: 120px; } } -[data-animate] { - opacity: 0; - filter: alpha(opacity=0); + +@media (max-width: 767px) { + footer.main-footer .photo-stream li { + width: 32%; + margin-bottom: 10px; + } + footer.main-footer .photo-stream a { + width: 100%; + height: auto; + } } + +/* + +===================== +STYLE SWITCHER FOR DEMO +===================== + +*/ #style-switch-button { position: fixed; - top: 100px; + top: 120px; left: 0px; border-radius: 0; + z-index: 2; } + #style-switch { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; width: 300px; padding: 20px; position: fixed; - top: 140px; + top: 160px; left: 0; background: #fff; - border: solid 1px #eeeeee; + border: solid 1px #ced4da; + z-index: 2000; } -@media (max-width: 991px) { - #style-switch-button { - display: none; - } - #style-switch { - display: none; - } + +#style-switch h4 { + color: #495057; } -/* Original Boostrap template overwrite */ -/* breadcrumbs */ -.breadcrumb { - font-family: "Roboto", Helvetica, Arial, sans-serif; - text-transform: uppercase; - background-color: none; - letter-spacing: 0.08em; + +/* + * 1. NAVBAR + */ +.navbar { + padding: 0.5rem 1rem; } -/* nav */ -.nav > li > a { - padding: 10px 15px; + +.navbar-brand { + display: inline-block; + padding-top: 0.3125rem; + padding-bottom: 0.3125rem; + margin-right: 1rem; + font-size: 1.25rem; +} + +.navbar-toggler { + padding: 0.25rem 0.75rem; + font-size: 1.25rem; + line-height: 1; + border: 1px solid transparent; + border-radius: 0; } -.nav > li > a:hover, -.nav > li > a:focus { - background-color: #eeeeee; + +.navbar-light .navbar-brand { + color: rgba(0, 0, 0, 0.9); } -.nav > li.disabled > a { - color: #999999; + +.navbar-light .navbar-brand:focus, .navbar-light .navbar-brand:hover { + color: rgba(0, 0, 0, 0.9); } -.nav > li.disabled > a:hover, -.nav > li.disabled > a:focus { - color: #999999; + +.navbar-light .navbar-nav .nav-link { + color: rgba(0, 0, 0, 0.5); } -.nav .open > a, -.nav .open > a:hover, -.nav .open > a:focus { - background-color: #eeeeee; - border-color: #955251; + +.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover { + color: rgba(0, 0, 0, 0.7); } -.nav-tabs { - border-bottom: 1px solid #955251; + +.navbar-light .navbar-nav .nav-link.disabled { + color: rgba(0, 0, 0, 0.3); } -.nav-tabs > li { - float: left; - margin-bottom: -1px; + +.navbar-light .navbar-nav .show > .nav-link, +.navbar-light .navbar-nav .active > .nav-link, +.navbar-light .navbar-nav .nav-link.show, +.navbar-light .navbar-nav .nav-link.active { + color: rgba(0, 0, 0, 0.9); } -.nav-tabs > li > a { - margin-right: 2px; - line-height: 1.42857143; - border: 1px solid transparent; - border-radius: 0 0 0 0; + +.navbar-light .navbar-toggler { + color: rgba(0, 0, 0, 0.5); + border-color: rgba(0, 0, 0, 0.1); } -.nav-tabs > li > a:hover { - border-color: #eeeeee #eeeeee #955251; + +.navbar-light .navbar-toggler-icon { + background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); } -.nav-tabs > li.active > a, -.nav-tabs > li.active > a:hover, -.nav-tabs > li.active > a:focus { - color: #555555; - background-color: #ffffff; - border: 1px solid #955251; - border-bottom-color: transparent; - cursor: default; + +.navbar-light .navbar-text { + color: rgba(0, 0, 0, 0.5); } -.nav-tabs.nav-justified { - width: 100%; - border-bottom: solid 1px #955251; - border-bottom: 0; + +.navbar-dark .navbar-brand { + color: #fff; } -.nav-tabs.nav-justified > li { - float: none; + +.navbar-dark .navbar-brand:focus, .navbar-dark .navbar-brand:hover { + color: #fff; } -.nav-tabs.nav-justified > li > a { - text-align: center; - /*margin-bottom: 5px;*/ + +.navbar-dark .navbar-nav .nav-link { + color: rgba(255, 255, 255, 0.5); } -.nav-tabs.nav-justified > .dropdown .dropdown-menu { - top: auto; - left: auto; + +.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover { + color: rgba(255, 255, 255, 0.75); } -.nav-tabs.nav-justified > li > a { - margin-right: 0; - border-radius: 0; + +.navbar-dark .navbar-nav .nav-link.disabled { + color: rgba(255, 255, 255, 0.25); } -.nav-tabs.nav-justified > .active > a, -.nav-tabs.nav-justified > .active > a:hover, -.nav-tabs.nav-justified > .active > a:focus { - border: 1px solid #955251; + +.navbar-dark .navbar-nav .show > .nav-link, +.navbar-dark .navbar-nav .active > .nav-link, +.navbar-dark .navbar-nav .nav-link.show, +.navbar-dark .navbar-nav .nav-link.active { + color: #fff; } -@media (min-width: 768px) { - .nav-tabs.nav-justified > li > a { - border-bottom: 1px solid #955251; - border-radius: 0 0 0 0; - } - .nav-tabs.nav-justified > .active > a, - .nav-tabs.nav-justified > .active > a:hover, - .nav-tabs.nav-justified > .active > a:focus { - border-bottom-color: #ffffff; - } + +.navbar-dark .navbar-toggler { + color: rgba(255, 255, 255, 0.5); + border-color: rgba(255, 255, 255, 0.1); } -.nav-pills > li { - float: left; + +.navbar-dark .navbar-toggler-icon { + background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); } -.nav-pills > li > a { + +.navbar-dark .navbar-text { + color: rgba(255, 255, 255, 0.5); +} + +/* + * 2. BUTTONS + */ +.btn { + font-weight: 700; + border: 1px solid transparent; + padding: 0.5rem 0.75rem; + font-size: 0.8rem; + line-height: 1.5; border-radius: 0; + -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; } -.nav-pills > li + li { - margin-left: 2px; + +.btn:focus, .btn.focus { + outline: 0; + -webkit-box-shadow: 0 0 0 0.2rem rgba(149, 82, 81, 0.25); + box-shadow: 0 0 0 0.2rem rgba(149, 82, 81, 0.25); +} + +.btn.disabled, .btn:disabled { + opacity: .65; +} + +.btn:not([disabled]):not(.disabled):active, .btn:not([disabled]):not(.disabled).active { + background-image: none; } -.nav-pills > li.active > a, -.nav-pills > li.active > a:hover, -.nav-pills > li.active > a:focus { - color: #ffffff; + +.btn-primary { + color: color-yiq(#955251); background-color: #955251; + border-color: #955251; } -.nav-stacked > li { - float: none; + +.btn-primary:hover { + color: color-yiq(#7c4444); + background-color: #74403f; + border-color: #74403f; } -.nav-stacked > li + li { - margin-top: 2px; - margin-left: 0; + +.btn-primary:focus, .btn-primary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(149, 82, 81, 0.5); + box-shadow: 0 0 0 0.2rem rgba(149, 82, 81, 0.5); } -.nav-justified { - width: 100%; - border-bottom: solid 1px #955251; + +.btn-primary.disabled, .btn-primary:disabled { + color: color-yiq(#955251); + background-color: #955251; + border-color: #955251; } -.nav-justified > li { - float: none; + +.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active, +.show > .btn-primary.dropdown-toggle { + color: color-yiq(#74403f); + background-color: #74403f; + border-color: #6c3b3b; +} + +.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, +.show > .btn-primary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(149, 82, 81, 0.5); + box-shadow: 0 0 0 0.2rem rgba(149, 82, 81, 0.5); +} + +.btn-secondary { + color: color-yiq(#868e96); + background-color: #868e96; + border-color: #868e96; +} + +.btn-secondary:hover { + color: color-yiq(#727b84); + background-color: #6c757d; + border-color: #6c757d; +} + +.btn-secondary:focus, .btn-secondary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); +} + +.btn-secondary.disabled, .btn-secondary:disabled { + color: color-yiq(#868e96); + background-color: #868e96; + border-color: #868e96; +} + +.btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active, +.show > .btn-secondary.dropdown-toggle { + color: color-yiq(#6c757d); + background-color: #6c757d; + border-color: #666e76; +} + +.btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus, +.show > .btn-secondary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); +} + +.btn-success { + color: color-yiq(#28a745); + background-color: #28a745; + border-color: #28a745; +} + +.btn-success:hover { + color: color-yiq(#218838); + background-color: #1e7e34; + border-color: #1e7e34; +} + +.btn-success:focus, .btn-success.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); +} + +.btn-success.disabled, .btn-success:disabled { + color: color-yiq(#28a745); + background-color: #28a745; + border-color: #28a745; +} + +.btn-success:not(:disabled):not(.disabled):active, .btn-success:not(:disabled):not(.disabled).active, +.show > .btn-success.dropdown-toggle { + color: color-yiq(#1e7e34); + background-color: #1e7e34; + border-color: #1c7430; +} + +.btn-success:not(:disabled):not(.disabled):active:focus, .btn-success:not(:disabled):not(.disabled).active:focus, +.show > .btn-success.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); +} + +.btn-info { + color: color-yiq(#17a2b8); + background-color: #17a2b8; + border-color: #17a2b8; +} + +.btn-info:hover { + color: color-yiq(#138496); + background-color: #117a8b; + border-color: #117a8b; +} + +.btn-info:focus, .btn-info.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); +} + +.btn-info.disabled, .btn-info:disabled { + color: color-yiq(#17a2b8); + background-color: #17a2b8; + border-color: #17a2b8; +} + +.btn-info:not(:disabled):not(.disabled):active, .btn-info:not(:disabled):not(.disabled).active, +.show > .btn-info.dropdown-toggle { + color: color-yiq(#117a8b); + background-color: #117a8b; + border-color: #10707f; +} + +.btn-info:not(:disabled):not(.disabled):active:focus, .btn-info:not(:disabled):not(.disabled).active:focus, +.show > .btn-info.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); +} + +.btn-warning { + color: color-yiq(#ffc107); + background-color: #ffc107; + border-color: #ffc107; +} + +.btn-warning:hover { + color: color-yiq(#e0a800); + background-color: #d39e00; + border-color: #d39e00; +} + +.btn-warning:focus, .btn-warning.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-warning.disabled, .btn-warning:disabled { + color: color-yiq(#ffc107); + background-color: #ffc107; + border-color: #ffc107; +} + +.btn-warning:not(:disabled):not(.disabled):active, .btn-warning:not(:disabled):not(.disabled).active, +.show > .btn-warning.dropdown-toggle { + color: color-yiq(#d39e00); + background-color: #d39e00; + border-color: #c69500; +} + +.btn-warning:not(:disabled):not(.disabled):active:focus, .btn-warning:not(:disabled):not(.disabled).active:focus, +.show > .btn-warning.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-danger { + color: color-yiq(#dc3545); + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-danger:hover { + color: color-yiq(#c82333); + background-color: #bd2130; + border-color: #bd2130; +} + +.btn-danger:focus, .btn-danger.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-danger.disabled, .btn-danger:disabled { + color: color-yiq(#dc3545); + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-danger:not(:disabled):not(.disabled):active, .btn-danger:not(:disabled):not(.disabled).active, +.show > .btn-danger.dropdown-toggle { + color: color-yiq(#bd2130); + background-color: #bd2130; + border-color: #b21f2d; +} + +.btn-danger:not(:disabled):not(.disabled):active:focus, .btn-danger:not(:disabled):not(.disabled).active:focus, +.show > .btn-danger.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-light { + color: color-yiq(#f8f9fa); + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-light:hover { + color: color-yiq(#e2e6ea); + background-color: #dae0e5; + border-color: #dae0e5; +} + +.btn-light:focus, .btn-light.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-light.disabled, .btn-light:disabled { + color: color-yiq(#f8f9fa); + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-light:not(:disabled):not(.disabled):active, .btn-light:not(:disabled):not(.disabled).active, +.show > .btn-light.dropdown-toggle { + color: color-yiq(#dae0e5); + background-color: #dae0e5; + border-color: #d3d9df; +} + +.btn-light:not(:disabled):not(.disabled):active:focus, .btn-light:not(:disabled):not(.disabled).active:focus, +.show > .btn-light.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-dark { + color: color-yiq(#343a40); + background-color: #343a40; + border-color: #343a40; +} + +.btn-dark:hover { + color: color-yiq(#23272b); + background-color: #1d2124; + border-color: #1d2124; +} + +.btn-dark:focus, .btn-dark.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-dark.disabled, .btn-dark:disabled { + color: color-yiq(#343a40); + background-color: #343a40; + border-color: #343a40; +} + +.btn-dark:not(:disabled):not(.disabled):active, .btn-dark:not(:disabled):not(.disabled).active, +.show > .btn-dark.dropdown-toggle { + color: color-yiq(#1d2124); + background-color: #1d2124; + border-color: #171a1d; +} + +.btn-dark:not(:disabled):not(.disabled):active:focus, .btn-dark:not(:disabled):not(.disabled).active:focus, +.show > .btn-dark.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-default { + color: color-yiq(#ced4da); + background-color: #ced4da; + border-color: #ced4da; +} + +.btn-default:hover { + color: color-yiq(#b8c1ca); + background-color: #b1bbc4; + border-color: #b1bbc4; +} + +.btn-default:focus, .btn-default.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); + box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); +} + +.btn-default.disabled, .btn-default:disabled { + color: color-yiq(#ced4da); + background-color: #ced4da; + border-color: #ced4da; +} + +.btn-default:not(:disabled):not(.disabled):active, .btn-default:not(:disabled):not(.disabled).active, +.show > .btn-default.dropdown-toggle { + color: color-yiq(#b1bbc4); + background-color: #b1bbc4; + border-color: #aab4bf; +} + +.btn-default:not(:disabled):not(.disabled):active:focus, .btn-default:not(:disabled):not(.disabled).active:focus, +.show > .btn-default.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); + box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); +} + +.btn-outline-primary { + color: #955251; + background-color: transparent; + background-image: none; + border-color: #955251; } -.nav-justified > li > a { - text-align: center; - /*margin-bottom: 5px;*/ + +.btn-outline-primary:hover { + color: #fff; + background-color: #955251; + border-color: #955251; } -.nav-justified > .dropdown .dropdown-menu { - top: auto; - left: auto; + +.btn-outline-primary:focus, .btn-outline-primary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(149, 82, 81, 0.5); + box-shadow: 0 0 0 0.2rem rgba(149, 82, 81, 0.5); } -.nav-tabs-justified { - border-bottom: 0; + +.btn-outline-primary.disabled, .btn-outline-primary:disabled { + color: #955251; + background-color: transparent; } -.nav-tabs-justified > li > a { - margin-right: 0; - border-radius: 0; + +.btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active, +.show > .btn-outline-primary.dropdown-toggle { + color: color-yiq(#955251); + background-color: #955251; + border-color: #955251; } -.nav-tabs-justified > .active > a, -.nav-tabs-justified > .active > a:hover, -.nav-tabs-justified > .active > a:focus { - border: 1px solid #955251; + +.btn-outline-primary:not(:disabled):not(.disabled):active:focus, .btn-outline-primary:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-primary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(149, 82, 81, 0.5); + box-shadow: 0 0 0 0.2rem rgba(149, 82, 81, 0.5); } -@media (min-width: 768px) { - .nav-tabs-justified > li > a { - border-bottom: 1px solid #955251; - border-radius: 0 0 0 0; - } - .nav-tabs-justified > .active > a, - .nav-tabs-justified > .active > a:hover, - .nav-tabs-justified > .active > a:focus { - border-bottom-color: #ffffff; - } + +.btn-outline-secondary { + color: #868e96; + background-color: transparent; + background-image: none; + border-color: #868e96; } -.tab-content { - padding: 15px; - border: solid 1px #ddd; - border-top: none; + +.btn-outline-secondary:hover { + color: #fff; + background-color: #868e96; + border-color: #868e96; } -/* navbar */ -.navbar { - position: relative; - min-height: 62px; - margin-bottom: 0; - border-bottom: 1px solid transparent; + +.btn-outline-secondary:focus, .btn-outline-secondary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); } -@media (min-width: 768px) { - .navbar { - border-radius: 0px; - } + +.btn-outline-secondary.disabled, .btn-outline-secondary:disabled { + color: #868e96; + background-color: transparent; } -@media (min-width: 768px) { - .navbar-header { - float: left; - } + +.btn-outline-secondary:not(:disabled):not(.disabled):active, .btn-outline-secondary:not(:disabled):not(.disabled).active, +.show > .btn-outline-secondary.dropdown-toggle { + color: color-yiq(#868e96); + background-color: #868e96; + border-color: #868e96; +} + +.btn-outline-secondary:not(:disabled):not(.disabled):active:focus, .btn-outline-secondary:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-secondary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); +} + +.btn-outline-success { + color: #28a745; + background-color: transparent; + background-image: none; + border-color: #28a745; } -.navbar-collapse { - overflow-x: visible; - padding-right: 15px; - padding-left: 15px; + +.btn-outline-success:hover { + color: #fff; + background-color: #28a745; + border-color: #28a745; } -.navbar-collapse.in { - overflow-y: auto; + +.btn-outline-success:focus, .btn-outline-success.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); } -@media (min-width: 768px) { - .navbar-collapse { - width: auto; - border-top: 0; - box-shadow: none; - } - .navbar-collapse.collapse { - display: block !important; - height: auto !important; - padding-bottom: 0; - overflow: visible !important; - } - .navbar-collapse.in { - overflow-y: visible; - } - .navbar-fixed-top .navbar-collapse, - .navbar-static-top .navbar-collapse, - .navbar-fixed-bottom .navbar-collapse { - padding-left: 0; - padding-right: 0; - } + +.btn-outline-success.disabled, .btn-outline-success:disabled { + color: #28a745; + background-color: transparent; } -.navbar-fixed-top .navbar-collapse, -.navbar-affixed-top .navbar-collapse, -.navbar-fixed-bottom .navbar-collapse { - max-height: 340px; + +.btn-outline-success:not(:disabled):not(.disabled):active, .btn-outline-success:not(:disabled):not(.disabled).active, +.show > .btn-outline-success.dropdown-toggle { + color: color-yiq(#28a745); + background-color: #28a745; + border-color: #28a745; +} + +.btn-outline-success:not(:disabled):not(.disabled):active:focus, .btn-outline-success:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-success.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); +} + +.btn-outline-info { + color: #17a2b8; + background-color: transparent; + background-image: none; + border-color: #17a2b8; } -@media (max-width: 480px) and (orientation: landscape) { - .navbar-fixed-top .navbar-collapse, - .navbar-affixed-top .navbar-collapse, - .navbar-fixed-bottom .navbar-collapse { - max-height: 200px; - } + +.btn-outline-info:hover { + color: #fff; + background-color: #17a2b8; + border-color: #17a2b8; } -.container > .navbar-header, -.container-fluid > .navbar-header, -.container > .navbar-collapse, -.container-fluid > .navbar-collapse { - margin-right: -15px; - margin-left: -15px; -} -@media (min-width: 768px) { - .container > .navbar-header, - .container-fluid > .navbar-header, - .container > .navbar-collapse, - .container-fluid > .navbar-collapse { - margin-right: 0; - margin-left: 0; - } + +.btn-outline-info:focus, .btn-outline-info.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); } -.navbar-static-top { - z-index: 1000; - border-width: 0 0 1px; + +.btn-outline-info.disabled, .btn-outline-info:disabled { + color: #17a2b8; + background-color: transparent; } -@media (min-width: 768px) { - .navbar-static-top { - border-radius: 0; - } + +.btn-outline-info:not(:disabled):not(.disabled):active, .btn-outline-info:not(:disabled):not(.disabled).active, +.show > .btn-outline-info.dropdown-toggle { + color: color-yiq(#17a2b8); + background-color: #17a2b8; + border-color: #17a2b8; +} + +.btn-outline-info:not(:disabled):not(.disabled):active:focus, .btn-outline-info:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-info.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); +} + +.btn-outline-warning { + color: #ffc107; + background-color: transparent; + background-image: none; + border-color: #ffc107; } -.navbar-fixed-top, -.navbar-fixed-bottom { - position: fixed; - right: 0; - left: 0; - z-index: 1030; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); -} -@media (min-width: 768px) { - .navbar-fixed-top, - .navbar-fixed-bottom { - border-radius: 0; - } + +.btn-outline-warning:hover { + color: #fff; + background-color: #ffc107; + border-color: #ffc107; } -.navbar-fixed-top { - top: 0; - border-width: 0 0 1px; + +.btn-outline-warning:focus, .btn-outline-warning.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); } -.navbar-fixed-bottom { - bottom: 0; - margin-bottom: 0; - border-width: 1px 0 0; + +.btn-outline-warning.disabled, .btn-outline-warning:disabled { + color: #ffc107; + background-color: transparent; } -.navbar-brand { - float: left; - padding: 10px 15px; - font-size: 18px; - line-height: 20px; - height: 62px; + +.btn-outline-warning:not(:disabled):not(.disabled):active, .btn-outline-warning:not(:disabled):not(.disabled).active, +.show > .btn-outline-warning.dropdown-toggle { + color: color-yiq(#ffc107); + background-color: #ffc107; + border-color: #ffc107; +} + +.btn-outline-warning:not(:disabled):not(.disabled):active:focus, .btn-outline-warning:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-warning.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-outline-danger { + color: #dc3545; + background-color: transparent; + background-image: none; + border-color: #dc3545; } -.navbar-brand:hover, -.navbar-brand:focus { - text-decoration: none; + +.btn-outline-danger:hover { + color: #fff; + background-color: #dc3545; + border-color: #dc3545; } -@media (min-width: 768px) { - .navbar > .container .navbar-brand, - .navbar > .container-fluid .navbar-brand { - margin-left: -15px; - } + +.btn-outline-danger:focus, .btn-outline-danger.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); } -.navbar-toggle { - position: relative; - float: right; - margin-right: 15px; - padding: 9px 10px; - margin-top: 14px; - margin-bottom: 14px; + +.btn-outline-danger.disabled, .btn-outline-danger:disabled { + color: #dc3545; + background-color: transparent; +} + +.btn-outline-danger:not(:disabled):not(.disabled):active, .btn-outline-danger:not(:disabled):not(.disabled).active, +.show > .btn-outline-danger.dropdown-toggle { + color: color-yiq(#dc3545); + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-outline-danger:not(:disabled):not(.disabled):active:focus, .btn-outline-danger:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-danger.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-outline-light { + color: #f8f9fa; background-color: transparent; background-image: none; - border: 1px solid transparent; + border-color: #f8f9fa; +} + +.btn-outline-light:hover { + color: #fff; + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-outline-light:focus, .btn-outline-light.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-outline-light.disabled, .btn-outline-light:disabled { + color: #f8f9fa; + background-color: transparent; +} + +.btn-outline-light:not(:disabled):not(.disabled):active, .btn-outline-light:not(:disabled):not(.disabled).active, +.show > .btn-outline-light.dropdown-toggle { + color: color-yiq(#f8f9fa); + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-outline-light:not(:disabled):not(.disabled):active:focus, .btn-outline-light:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-light.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-outline-dark { + color: #343a40; + background-color: transparent; + background-image: none; + border-color: #343a40; +} + +.btn-outline-dark:hover { + color: #fff; + background-color: #343a40; + border-color: #343a40; +} + +.btn-outline-dark:focus, .btn-outline-dark.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-outline-dark.disabled, .btn-outline-dark:disabled { + color: #343a40; + background-color: transparent; +} + +.btn-outline-dark:not(:disabled):not(.disabled):active, .btn-outline-dark:not(:disabled):not(.disabled).active, +.show > .btn-outline-dark.dropdown-toggle { + color: color-yiq(#343a40); + background-color: #343a40; + border-color: #343a40; +} + +.btn-outline-dark:not(:disabled):not(.disabled):active:focus, .btn-outline-dark:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-dark.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-lg { + padding: 0.5rem 1rem; + font-size: 1.25rem; + line-height: 1.5; + border-radius: 0; +} + +.btn-sm { + padding: 0.25rem 0.5rem; + font-size: 0.7rem; + line-height: 1.5; border-radius: 0; } -.navbar-toggle:focus { - outline: 0; + +/* + * 3. TYPE + */ +body { + font-family: "Roboto", Helvetica, Arial, sans-serif; + font-size: 1rem; + font-weight: 400; + line-height: 1.5; + color: #212529; + background-color: #fff; +} + +a { + color: #955251; + text-decoration: none; +} + +a:focus, a:hover { + color: #633736; + text-decoration: underline; +} + +h1, +h2, +h3, +h4, +h5, +h6, +.h1, +.h2, +.h3, +.h4, +.h5, +.h6 { + margin-bottom: 1rem; + font-family: inherit; + font-weight: 700; + line-height: 1.1; + color: inherit; +} + +h1, +.h1 { + font-size: 2.2rem; +} + +h2, +.h2 { + font-size: 1.8rem; +} + +h3, +.h3 { + font-size: 1.5rem; +} + +h4, +.h4 { + font-size: 1.1rem; +} + +h5, +.h5 { + font-size: 1rem; +} + +h6, +.h6 { + font-size: 0.8rem; +} + +.lead { + font-size: 1.25rem; + font-weight: 300; +} + +.display-1 { + font-size: 6rem; + font-weight: 300; + line-height: 1.1; +} + +.display-2 { + font-size: 5.5rem; + font-weight: 300; + line-height: 1.1; } -.navbar-nav { - margin: 10.5px -15px; + +.display-3 { + font-size: 4.5rem; + font-weight: 300; + line-height: 1.1; } -.navbar-nav > li > a { - padding-top: 10px; - padding-bottom: 10px; - line-height: 20px; + +.display-4 { + font-size: 3.5rem; + font-weight: 300; + line-height: 1.1; } -@media (max-width: 767px) { - .navbar-nav .open .dropdown-menu > li > a, - .navbar-nav .open .dropdown-menu .dropdown-header { - padding: 5px 15px 5px 25px; - } - .navbar-nav .open .dropdown-menu > li > a { - line-height: 20px; - } - .navbar-nav .open .dropdown-menu > li > a:hover, - .navbar-nav .open .dropdown-menu > li > a:focus { - background-image: none; - } + +hr { + border-top: 1px solid rgba(0, 0, 0, 0.1); } -@media (min-width: 768px) { - .navbar-nav { - float: left; - margin: 0; - } - .navbar-nav > li { - float: left; - } - .navbar-nav > li > a { - padding-top: 21px; - padding-bottom: 21px; - } - .navbar-nav.navbar-right:last-child { - margin-right: -15px; - } + +small, +.small { + font-size: 80%; + font-weight: 400; } -@media (min-width: 768px) { - .navbar-left { - float: left !important; - } - .navbar-right { - float: right !important; - } + +mark, +.mark { + padding: 0.2em; + background-color: #fcf8e3; +} + +.blockquote { + padding: 0.5rem 1rem; + margin-bottom: 2rem; + font-size: 1rem; + border-left: 5px solid #955251; } -.navbar-form { - margin-left: -15px; - margin-right: -15px; - padding: 10px 15px; - border-top: 1px solid transparent; - border-bottom: 1px solid transparent; - -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); - margin-top: 14px; - margin-bottom: 14px; + +.blockquote-footer { + color: #868e96; } -@media (max-width: 767px) { - .navbar-form .form-group { - margin-bottom: 5px; - } + +.blockquote-footer::before { + content: "\2014 \00A0"; } -@media (min-width: 768px) { - .navbar-form { - width: auto; - border: 0; - margin-left: 0; - margin-right: 0; - padding-top: 0; - padding-bottom: 0; - -webkit-box-shadow: none; - box-shadow: none; - } - .navbar-form.navbar-right:last-child { - margin-right: -15px; - } + +.text-primary { + color: #955251 !important; } -.navbar-nav > li > .dropdown-menu { - margin-top: 0; - border-top-right-radius: 0; - border-top-left-radius: 0; + +a.text-primary:focus, a.text-primary:hover { + color: #74403f !important; } -.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu { - border-bottom-right-radius: 0; + +/* + * 4. PAGINATION + */ +.page-item:first-child .page-link { + border-top-left-radius: 0; border-bottom-left-radius: 0; } -.navbar-btn { - margin-top: 14px; - margin-bottom: 14px; + +.page-item:last-child .page-link { + border-top-right-radius: 0; + border-bottom-right-radius: 0; } -.navbar-btn.btn-sm { - margin-top: 16px; - margin-bottom: 16px; + +.page-item.active .page-link { + color: #fff; + background-color: #955251; + border-color: #955251; } -.navbar-btn.btn-xs { - margin-top: 20px; - margin-bottom: 20px; + +.page-item.disabled .page-link { + color: #868e96; + background-color: #fff; + border-color: #dee2e6; } -.navbar-text { - margin-top: 21px; - margin-bottom: 21px; + +.page-link { + padding: 0.5rem 0.75rem; + line-height: 1.25; + color: #955251; + background-color: #fff; + border: 1px solid #dee2e6; } -@media (min-width: 768px) { - .navbar-text { - float: left; - margin-left: 15px; - margin-right: 15px; - } - .navbar-text.navbar-right:last-child { - margin-right: 0; - } + +.page-link:focus, .page-link:hover { + color: #633736; + text-decoration: none; + background-color: #e9ecef; + border-color: #dee2e6; + outline: 0; } -.navbar-default { - background-color: #ffffff; - border-color: #cccccc; - border-bottom: none; + +.pagination-lg .page-link { + padding: 0.75rem 1.5rem; + font-size: 1.25rem; + line-height: 1.5; } -.navbar-default .navbar-brand { - color: #555555; + +.pagination-lg .page-item:first-child .page-link { + border-top-left-radius: 0; + border-bottom-left-radius: 0; } -.navbar-default .navbar-brand:hover, -.navbar-default .navbar-brand:focus { - color: #3b3b3b; - background-color: transparent; + +.pagination-lg .page-item:last-child .page-link { + border-top-right-radius: 0; + border-bottom-right-radius: 0; } -.navbar-default .navbar-text { - color: #777777; + +.pagination-sm .page-link { + padding: 0.25rem 0.5rem; + font-size: 0.7rem; + line-height: 1.5; } -.navbar-default .navbar-nav > li > a { - color: #555555; + +.pagination-sm .page-item:first-child .page-link { + border-top-left-radius: 0; + border-bottom-left-radius: 0; } -.navbar-default .navbar-nav > li > a:hover, -.navbar-default .navbar-nav > li > a:focus { - color: #555555; - background-color: #c08c8c; + +.pagination-sm .page-item:last-child .page-link { + border-top-right-radius: 0; + border-bottom-right-radius: 0; } -.navbar-default .navbar-nav > .active > a, -.navbar-default .navbar-nav > .active > a:hover, -.navbar-default .navbar-nav > .active > a:focus { - color: #ffffff; - background-color: #955251; + +/* +* 5. DROPDOWNS +*/ +.dropdown-menu { + z-index: 1000; + min-width: 10rem; + padding: 0.5rem 0; + margin: 0.125rem 0 0; + font-size: 1rem; + color: #212529; + background-color: #fff; + border: 1px solid rgba(0, 0, 0, 0.15); + border-radius: 0; } -.navbar-default .navbar-nav > .disabled > a, -.navbar-default .navbar-nav > .disabled > a:hover, -.navbar-default .navbar-nav > .disabled > a:focus { - color: #cccccc; - background-color: transparent; + +.dropdown-item { + padding: 0.25rem 1.5rem; + color: #212529; } -.navbar-default .navbar-toggle { - border-color: #dddddd; + +.dropdown-item:focus, .dropdown-item:hover { + color: #16181b; + background-color: #f8f9fa; } -.navbar-default .navbar-toggle:hover, -.navbar-default .navbar-toggle:focus { + +.dropdown-item.active, .dropdown-item:active { + color: #fff; background-color: #955251; } -.navbar-default .navbar-toggle .icon-bar { - background-color: #888888; + +.dropdown-item.disabled, .dropdown-item:disabled { + color: #868e96; } -.navbar-default .navbar-collapse, -.navbar-default .navbar-form { - border-color: #cccccc; + +.dropdown-header { + padding: 0.5rem 1.5rem; + font-size: 0.7rem; + color: #868e96; } -.navbar-default .navbar-nav > .open > a, -.navbar-default .navbar-nav > .open > a:hover, -.navbar-default .navbar-nav > .open > a:focus { - background-color: #955251; - color: #ffffff; + +/* +* 6. UTILITIES +*/ +.bg-primary { + background-color: #955251 !important; } -@media (max-width: 767px) { - .navbar-default .navbar-nav .open .dropdown-menu > li > a { - color: #555555; - } - .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, - .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus { - color: #955251; - } - .navbar-default .navbar-nav .open .dropdown-menu > .active > a, - .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, - .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus { - color: #ffffff; - background-color: #955251; - } - .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a, - .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover, - .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus { - color: #cccccc; - background-color: transparent; - } + +a.bg-primary:focus, a.bg-primary:hover { + background-color: #74403f !important; } -.navbar-default .navbar-link { - color: #555555; + +.bg-secondary { + background-color: #868e96 !important; } -.navbar-default .navbar-link:hover { - color: #555555; + +a.bg-secondary:focus, a.bg-secondary:hover { + background-color: #6c757d !important; } -.navbar-default .btn-link { - color: #555555; + +.bg-success { + background-color: #28a745 !important; } -.navbar-default .btn-link:hover, -.navbar-default .btn-link:focus { - color: #555555; + +a.bg-success:focus, a.bg-success:hover { + background-color: #1e7e34 !important; } -.navbar-default .btn-link[disabled]:hover, -fieldset[disabled] .navbar-default .btn-link:hover, -.navbar-default .btn-link[disabled]:focus, -fieldset[disabled] .navbar-default .btn-link:focus { - color: #cccccc; + +.bg-info { + background-color: #17a2b8 !important; } -/* scaffolding */ -body { - font-family: "Roboto", Helvetica, Arial, sans-serif; - font-size: 14px; - line-height: 1.42857143; - color: #555555; + +a.bg-info:focus, a.bg-info:hover { + background-color: #117a8b !important; } -a { - color: #955251; - text-decoration: none; + +.bg-warning { + background-color: #ffc107 !important; } -a:hover, -a:focus { - color: #633736; - text-decoration: underline; + +a.bg-warning:focus, a.bg-warning:hover { + background-color: #d39e00 !important; } -a:focus { - outline: thin dotted; - outline: 5px auto -webkit-focus-ring-color; - outline-offset: -2px; + +.bg-danger { + background-color: #dc3545 !important; } -.img-rounded { - border-radius: 0; + +a.bg-danger:focus, a.bg-danger:hover { + background-color: #bd2130 !important; } -hr { - margin-top: 20px; - margin-bottom: 20px; - border: 0; - border-top: 1px solid #eeeeee; + +.bg-light { + background-color: #f8f9fa !important; } -/* breadcrumbs */ -.breadcrumb { - padding: 20px 0; - margin-bottom: 20px; - background-color: transparent; - border-radius: 0; - text-align: right; + +a.bg-light:focus, a.bg-light:hover { + background-color: #dae0e5 !important; } -.breadcrumb > li + li:before { - content: ">\00a0"; - color: #555555; + +.bg-dark { + background-color: #343a40 !important; } -.breadcrumb > .active { - color: #999999; + +a.bg-dark:focus, a.bg-dark:hover { + background-color: #1d2124 !important; } -@media (max-width: 991px) { - .breadcrumb { - padding: 20px 0; - text-align: center; - } + +.border-primary { + border-color: #955251 !important; } -/* dropdowns */ -.dropdown-menu { - z-index: 1000; - font-size: 14px; - background-color: #ffffff; - border: 1px solid #cccccc; - border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 0; - -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); - box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); + +.border-secondary { + border-color: #868e96 !important; } -.dropdown-menu.pull-right { - right: 0; - left: auto; + +.border-success { + border-color: #28a745 !important; } -.dropdown-menu .divider { - height: 1px; - margin: 9px 0; - overflow: hidden; - background-color: #e5e5e5; + +.border-info { + border-color: #17a2b8 !important; } -.dropdown-menu > li > a { - padding: 5px 20px; - line-height: 1.42857143; - color: #333333; - white-space: nowrap; + +.border-warning { + border-color: #ffc107 !important; } -/* labels */ -.label { - font-family: "Roboto", Helvetica, Arial, sans-serif; - font-weight: normal; - text-transform: uppercase; - letter-spacing: 0.08em; + +.border-danger { + border-color: #dc3545 !important; } -/* forms.less */ -label { - font-weight: normal; + +.border-light { + border-color: #f8f9fa !important; } -.form-control { - -webkit-box-shadow: none; - box-shadow: none; - border-radius: 0; + +.border-dark { + border-color: #343a40 !important; } -.form-control:focus { - border-color: #955251; - outline: 0; - -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(149, 82, 81, 0.6); - box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(149, 82, 81, 0.6); + +.text-primary { + color: #955251 !important; } -.form-group { - margin-bottom: 20px; + +a.text-primary:focus, a.text-primary:hover { + color: #74403f !important; } -/* pager*/ -.pager { - margin: 20px 0; - border-top: solid 1px #eeeeee; - padding-top: 20px; - text-transform: uppercase; - letter-spacing: 0.08em; - font-family: "Roboto", Helvetica, Arial, sans-serif; + +.text-secondary { + color: #868e96 !important; } -.pager li { - display: inline; + +a.text-secondary:focus, a.text-secondary:hover { + color: #6c757d !important; } -.pager li > a, -.pager li > span { - background-color: #ffffff; - border: 1px solid #955251; - border-radius: 0; + +.text-success { + color: #28a745 !important; } -.pager li > a:hover, -.pager li > a:focus { - text-decoration: none; - color: #fff; - background-color: #955251; + +a.text-success:focus, a.text-success:hover { + color: #1e7e34 !important; } -.pager .disabled > a, -.pager .disabled > a:hover, -.pager .disabled > a:focus, -.pager .disabled > span { - color: #999999; - background-color: #ffffff; - border-color: #ddd; + +.text-info { + color: #17a2b8 !important; } -/* pagination */ -.pagination { - margin: 20px 0; - font-family: "Roboto", Helvetica, Arial, sans-serif; - border-radius: 0; + +a.text-info:focus, a.text-info:hover { + color: #117a8b !important; } -.pagination > li > a, -.pagination > li > span { - padding: 6px 12px; - line-height: 1.42857143; - text-decoration: none; - color: #955251; - background-color: #ffffff; - border: 1px solid #dddddd; + +.text-warning { + color: #ffc107 !important; } -.pagination > li > a:hover, -.pagination > li > span:hover, -.pagination > li > a:focus, -.pagination > li > span:focus { - color: #955251; - background-color: #d2adad; - border-color: #dddddd; -} -.pagination > .active > a, -.pagination > .active > span, -.pagination > .active > a:hover, -.pagination > .active > span:hover, -.pagination > .active > a:focus, -.pagination > .active > span:focus { - z-index: 2; - color: #ffffff; - background-color: #955251; - border-color: #955251; + +a.text-warning:focus, a.text-warning:hover { + color: #d39e00 !important; } -.pagination > .disabled > span, -.pagination > .disabled > span:hover, -.pagination > .disabled > span:focus, -.pagination > .disabled > a, -.pagination > .disabled > a:hover, -.pagination > .disabled > a:focus { - color: #999999; - background-color: #ffffff; - border-color: #dddddd; -} -/* responsive utilities */ -@media (max-width: 767px) { - .text-center-xs { - text-align: center !important; - } - .text-center-xs img { - display: block; - margin-left: auto; - margin-right: auto; - } + +.text-danger { + color: #dc3545 !important; } -@media (min-width: 768px) and (max-width: 991px) { - .text-center-sm { - text-align: center !important; - } - .text-center-sm img { - display: block; - margin-left: auto; - margin-right: auto; - } + +a.text-danger:focus, a.text-danger:hover { + color: #bd2130 !important; } -/* type */ -h1, -h2, -h3, -h4, -h5, -h6, -.h1, -.h2, -.h3, -.h4, -.h5, -.h6 { - font-family: "Roboto", Helvetica, Arial, sans-serif; - font-weight: 900; - line-height: 1.1; - color: #333333; + +.text-light { + color: #f8f9fa !important; } -h1, -.h1, -h2, -.h2, -h3, -.h3 { - margin-top: 20px; - margin-bottom: 20px; + +a.text-light:focus, a.text-light:hover { + color: #dae0e5 !important; } -p { - margin: 0 0 10px; + +.text-dark { + color: #343a40 !important; } -.lead { - margin-bottom: 20px; - font-size: 18px; + +a.text-dark:focus, a.text-dark:hover { + color: #1d2124 !important; } -@media (min-width: 768px) { - .lead { - font-size: 21px; - } + +.badge-primary { + color: #fff; + background-color: #955251; } -.text-small { - font-size: 12px; + +.badge-primary[href]:focus, .badge-primary[href]:hover { + color: #fff; + text-decoration: none; + background-color: #74403f; } -.text-large { - font-size: 18px; + +.badge-secondary { + color: #fff; + background-color: #868e96; } -.text-italic { - font-style: italic; + +.badge-secondary[href]:focus, .badge-secondary[href]:hover { + color: #fff; + text-decoration: none; + background-color: #6c757d; } -.text-primary { - color: #955251; + +.badge-success { + color: #fff; + background-color: #28a745; } -a.text-primary:hover { - color: #74403f; + +.badge-success[href]:focus, .badge-success[href]:hover { + color: #fff; + text-decoration: none; + background-color: #1e7e34; } -.bg-primary { + +.badge-info { color: #fff; - background-color: #955251; + background-color: #17a2b8; } -a.bg-primary:hover { - background-color: #74403f; + +.badge-info[href]:focus, .badge-info[href]:hover { + color: #fff; + text-decoration: none; + background-color: #117a8b; } -abbr[title], -abbr[data-original-title] { - border-bottom: 1px dotted #999999; + +.badge-warning { + color: #111; + background-color: #ffc107; } -blockquote { - padding: 10px 20px; - margin: 0 0 20px; - font-size: 14px; - border-left: 5px solid #955251; + +.badge-warning[href]:focus, .badge-warning[href]:hover { + color: #111; + text-decoration: none; + background-color: #d39e00; } -blockquote footer, -blockquote small, -blockquote .small { - display: block; - font-size: 80%; - line-height: 1.42857143; - color: #999999; + +.badge-danger { + color: #fff; + background-color: #dc3545; } -blockquote footer:before, -blockquote small:before, -blockquote .small:before { - content: '\2014 \00A0'; + +.badge-danger[href]:focus, .badge-danger[href]:hover { + color: #fff; + text-decoration: none; + background-color: #bd2130; } -.blockquote-reverse, -blockquote.pull-right { - border-right: 5px solid #955251; + +.badge-light { + color: #111; + background-color: #f8f9fa; } -address { - margin-bottom: 20px; - line-height: 1.42857143; + +.badge-light[href]:focus, .badge-light[href]:hover { + color: #111; + text-decoration: none; + background-color: #dae0e5; } -.panel { - margin-bottom: 20px; - background-color: #ffffff; - border: 1px solid transparent; + +.badge-dark { + color: #fff; + background-color: #343a40; +} + +.badge-dark[href]:focus, .badge-dark[href]:hover { + color: #fff; + text-decoration: none; + background-color: #1d2124; +} + +/* +* 7.CODE +*/ +code { + font-size: 87.5%; + color: #e83e8c; border-radius: 0; - -webkit-box-shadow: 0 0 0; - box-shadow: 0 0 0; } -.panel-heading { - border-top-right-radius: 0; + +a > code { + padding: 0; + color: inherit; + background-color: inherit; +} + +/* +* 8. NAV +*/ +.nav-link { + padding: 0.5rem 1rem; +} + +.nav-link.disabled { + color: #868e96; +} + +.nav-tabs .nav-item { + margin-bottom: -1px; +} + +.nav-tabs .nav-link { + border: 1px solid transparent; border-top-left-radius: 0; - text-transform: uppercase; - letter-spacing: 0.08em; - padding: 15px 15px; + border-top-right-radius: 0; } -.progress { - overflow: hidden; - height: 20px; - margin-bottom: 20px; - background-color: #f5f5f5; - border-radius: 0; - -webkit-box-shadow: none; - box-shadow: none; + +.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover { + border-color: #e9ecef #e9ecef #dee2e6; } -.panel-group { - margin-bottom: 20px; + +.nav-tabs .nav-link.disabled { + color: #868e96; } -.panel-group .panel { - margin-bottom: 0; + +.nav-tabs .nav-link.active, +.nav-tabs .nav-item.show .nav-link { + color: #495057; + background-color: #fff; +} + +.nav-tabs .dropdown-menu { + margin-top: -1px; +} + +.nav-pills .nav-link { border-radius: 0; - overflow: hidden; } -.panel-group .panel + .panel { - margin-top: 5px; + +.nav-pills .nav-link.active, +.nav-pills .show > .nav-link { + color: #fff; + background-color: #955251; } -.panel-group.accordion .panel { - border-color: #ccc; + +/* +* 9. CARD +*/ +.card { + background-color: #fff; + border: 1px solid rgba(0, 0, 0, 0.125); + border-radius: 0; } -.panel-primary { - border-color: #955251; + +.card > .list-group:first-child .list-group-item:first-child { + border-top-left-radius: 0; + border-top-right-radius: 0; } -.panel-primary > .panel-heading { - color: #ffffff; - background-color: #955251; - border-color: #955251; + +.card > .list-group:last-child .list-group-item:last-child { + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; } -.panel-primary > .panel-heading + .panel-collapse > .panel-body { - border-top-color: #955251; + +.card-body { + padding: 1.25rem; } -.panel-primary > .panel-heading .badge { - color: #955251; - background-color: #ffffff; + +.card-title { + margin-bottom: 0.75rem; } -.panel-primary > .panel-footer + .panel-collapse > .panel-body { - border-bottom-color: #955251; + +.card-subtitle { + margin-top: -0.375rem; } -.panel-primary .panel-title { - font-weight: 300; + +.card-link + .card-link { + margin-left: 1.25rem; } -.panel-primary .panel-title a:hover { - color: #fff; - text-decoration: none; + +.card-header { + padding: 0.75rem 1.25rem; + background-color: rgba(0, 0, 0, 0.03); + border-bottom: 1px solid rgba(0, 0, 0, 0.125); } -a.badge:hover, -a.badge:focus { - color: #ffffff; - text-decoration: none; - cursor: pointer; + +.card-header:first-child { + border-radius: calc(0 - 1px) calc(0 - 1px) 0 0; } -a.list-group-item.active > .badge, -.nav-pills > .active > a > .badge { - color: #955251; - background-color: #ffffff; + +.card-header-transparent { + background-color: rgba(0, 0, 0, 0.3); + border-bottom: none; } -.nav-pills > li > a > .badge { - margin-left: 3px; + +.card-footer { + padding: 0.75rem 1.25rem; + background-color: #f8f9fa; + border-top: 1px solid rgba(0, 0, 0, 0.125); +} + +.card-footer:last-child { + border-radius: 0 0 calc(0 - 1px) calc(0 - 1px); +} + +.card-header-tabs { + margin-right: -0.625rem; + margin-bottom: -0.75rem; + margin-left: -0.625rem; + border-bottom: 0; } -.progress-bar-primary { - background-color: #955251; + +.card-header-pills { + margin-right: -0.625rem; + margin-left: -0.625rem; } -.progress-striped .progress-bar-primary { - background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); - background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); - background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); + +.card-img-overlay { + padding: 1.25rem; } -/*! - * Yamm!3 - Yet another megamenu for Bootstrap 3 - * http://geedmo.github.com/yamm3 - * - * @geedmo - Licensed under the MIT license - */ -.yamm .nav, -.yamm .collapse, -.yamm .dropup.use-yamm, -.yamm .dropdown.use-yamm { - position: static; + +.card-img-overlay-opacity { + background: rgba(0, 0, 0, 0.2); } -.yamm .container { - position: relative; + +.card-img { + border-radius: calc(0 - 1px); } -.yamm .dropdown-menu { - left: auto; + +.card-img-top { + border-top-left-radius: calc(0 - 1px); + border-top-right-radius: calc(0 - 1px); } -.yamm .nav.navbar-right .dropdown-menu { - left: auto; - right: 0; + +.card-img-bottom { + border-bottom-right-radius: calc(0 - 1px); + border-bottom-left-radius: calc(0 - 1px); } -.yamm .yamm-content { - padding: 20px 30px; + +.card-deck .card { + margin-bottom: 15px; } -.yamm .dropdown.yamm-fw .dropdown-menu { - left: 15px; - right: 15px; + +@media (min-width: 576px) { + .card-deck { + margin-right: -15px; + margin-left: -15px; + } + .card-deck .card { + margin-right: 15px; + margin-left: 15px; + } } diff --git a/static/css/style.pink.css b/static/css/style.pink.css index b5faa8fac..f2b621a7e 100644 --- a/static/css/style.pink.css +++ b/static/css/style.pink.css @@ -1,3566 +1,3702 @@ -.clearfix:before, -.clearfix:after, -.navbar:before, -.navbar:after, -.navbar-header:before, -.navbar-header:after { - content: " "; - display: table; +/* + +================================================================================== +================================================================================== + +Universal Template + +https://bootstrapious.com/p/universal-business-e-commerce-template + +================================================================================== +================================================================================== + +*/ +/* +* +* ===================== +* GENERAL +* ===================== +* +*/ +.boxed { + background: url("../img/boxed-pattern.png"); +} + +.boxed #all { + max-width: 1200px; + margin: 0 auto; + background: #fff; + -webkit-box-shadow: 0 0 5px #ccc; + box-shadow: 0 0 5px #ccc; +} + +a { + -webkit-transition: all 0.3s !important; + transition: all 0.3s !important; + display: inline-block; +} + +button { + cursor: pointer; +} + +strong { + font-weight: 700; +} + +p.lead { + margin-bottom: 40px; +} + +.accent { + color: #c27baa; } -.clearfix:after, -.navbar:after, -.navbar-header:after { - clear: both; + +.tooltip { + font-family: "Roboto", Helvetica, Arial, sans-serif; } -.center-block { + +.bs-select .dropdown-menu .dropdown-menu { + min-height: 20px; display: block; - margin-left: auto; - margin-right: auto; } -.pull-right { - float: right !important; + +.bs-select .dropdown-menu .dropdown-menu a { + padding: 6px 10px; + color: #666; + font-weight: 700; + text-decoration: none !important; + display: block; + font-size: .8rem; + text-transform: uppercase; + letter-spacing: 0.1em; + font-family: "Roboto", Helvetica, Arial, sans-serif; + outline: none; } -.pull-left { - float: left !important; + +.heading-light { + font-weight: 300 !important; } -.hide { - display: none !important; + +.text-bold { + font-weight: 700; } -.show { - display: block !important; + +.text-small { + font-size: 0.9rem; } -.invisible { - visibility: hidden; + +.text-uppercase { + text-transform: uppercase; + letter-spacing: 0.1em; } -.text-hide { - font: 0/0 a; - color: transparent; - text-shadow: none; - background-color: transparent; - border: 0; + +.no-letter-spacing { + letter-spacing: 0 !important; } -.hidden { - display: none !important; - visibility: hidden !important; + +.bar { + padding: 60px 0; } -.affix { - position: fixed; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); + +.bar.padding-big { + padding: 50px 0; } -/* general styles */ -a, -button { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.pagination { + margin-top: 20px; } -a i[class^="fa"], -button i[class^="fa"] { - margin: 0 5px; + +#pagination .pagination { + margin-bottom: 40px; } -.clickable { - cursor: pointer !important; + +.text-sm, .form-group label, #blog-listing-big .date-comments a, #blog-listing-medium .date-comments a, #blog-listing-big p.intro, #blog-listing-medium p.intro { + font-size: 0.9rem; } -.required { - color: #c27baa; + +.text-xs { + font-size: 0.9rem; } -.accent { - color: #c27baa; + +.text-xs * { + font-size: 0.9rem; } -.text-uppercase { - text-transform: uppercase; - letter-spacing: 0.08em; + +@media (max-width: 767px) { + .text-sm-center { + text-align: center !important; + } } + @media (max-width: 991px) { + .text-md-center { + text-align: center !important; + } +} + +@media (max-width: 1199px) { + .text-lg-center { + text-align: center !important; + } +} + +@media (max-width: 767px) { .text-center-sm { - text-align: center; + text-align: center !important; } } -p.lead { - margin-bottom: 40px; + +@media (max-width: 991px) { + .text-center-md { + text-align: center !important; + } } -section, -div.section { - margin-bottom: 40px; + +@media (max-width: 1199px) { + .text-center-sm, .text-center-xs { + text-align: center !important; + } } + +.bg-gray { + background: #e9ecef !important; +} + +.bg-gray-dark { + background: #555 !important; +} + +.bg-primary { + background: #c27baa !important; +} + +.color-white { + color: #fff !important; +} + +.color-white * { + color: #fff !important; +} + +.bg-white { + background: #fff !important; +} + +.bg-fixed { + background-attachment: fixed !important; +} + +.light-gray { + background: #eee; +} + .no-mb { margin-bottom: 0 !important; } + +.no-mt { + margin-top: 0 !important; +} + +.no-horizontal-padding { + padding-left: 0 !important; + padding-right: 0 !important; +} + .mb-small { margin-bottom: 20px !important; } -.heading { - margin-bottom: 40px; + +.no-padding-top { + padding-top: 0 !important; } -.heading h1, -.heading h2, -.heading h3, -.heading h4, -.heading h5 { - display: inline-block; - border-bottom: solid 5px #c27baa; + +.no-padding-bottom { + padding-bottom: 0 !important; +} + +.padding-horizontal { + padding-left: 30px !important; + padding-right: 30px !important; +} + +.relative-positioned { + position: relative; + z-index: 1; +} + +.jumbotron { + margin: 0; +} + +.owl-carousel.equal-height .owl-stage { + display: -webkit-box !important; + display: -ms-flexbox !important; + display: flex !important; + -webkit-box-align: stretch !important; + -ms-flex-align: stretch !important; + align-items: stretch !important; +} + +.background-pentagon, #heading-breadcrumbs { + background: url("../img/texture-bw.png") center center repeat; + border-top: 1px solid #999; + border-bottom: 1px solid #999; +} + +.heading, .panel-heading { + margin-bottom: 1rem; +} + +.heading h1, .panel-heading h1, .heading h2, .panel-heading h2, .heading h3, .panel-heading h3, .heading h4, .panel-heading h4, .heading h5, .panel-heading h5, .heading h6, .panel-heading h6 { line-height: 1.1; + display: inline-block; margin-bottom: 0; padding-bottom: 10px; - vertical-align: middle; text-transform: uppercase; - letter-spacing: 0.06em; + letter-spacing: 0.1em; } -.heading h1 i[class^="fa"], -.heading h2 i[class^="fa"], -.heading h3 i[class^="fa"], -.heading h4 i[class^="fa"], -.heading h5 i[class^="fa"] { - display: inline-block; + +.heading h1:after, .panel-heading h1:after, .heading h2:after, .panel-heading h2:after, .heading h3:after, .panel-heading h3:after, .heading h4:after, .panel-heading h4:after, .heading h5:after, .panel-heading h5:after, .heading h6:after, .panel-heading h6:after { + content: " "; + display: block; + width: 100px; + height: 2px; + margin-top: .6rem; background: #c27baa; - width: 30px; - height: 30px; - vertical-align: middle; - text-align: center; - color: #fff; - font-size: 12px; - line-height: 30px; - border-radius: 15px; } -.icon { - display: inline-block; - width: 80px; - height: 80px; - color: #fff; - line-height: 80px; - border-radius: 40px; - border: solid 1px #fff; - font-size: 20px; + +.heading.text-center h1:after, .text-center.panel-heading h1:after, .heading.text-center h2:after, .text-center.panel-heading h2:after, .heading.text-center h3:after, .text-center.panel-heading h3:after, .heading.text-center h4:after, .text-center.panel-heading h4:after, .heading.text-center h5:after, .text-center.panel-heading h5:after, .heading.text-center h6:after, .text-center.panel-heading h6:after { + margin-left: auto; + margin-right: auto; } -.icon.icon-lg { - font-size: 30px; - border-width: 2px; + +.buttons a { + margin: 0 3px; } -.ul-icons { - padding-left: 10px; + +.dropdown-item.active, .dropdown-item:active { + background: #e2c1d7; } -.ul-icons li { - list-style-type: none; - line-height: 20px; - margin-bottom: 20px; + +.card { + border-radius: 0; + margin-bottom: 10px; } -.ul-icons li i { - width: 20px; - height: 20px; - background: #c27baa; - color: #fff; - text-align: center; - border-radius: 10px; - line-height: 20px; - margin-right: 10px; + +.card-header { + border-radius: 0; + padding: 20px; } -ul.list-style-none { - list-style: none; + +.card-header h1, .card-header h2, .card-header h3, .card-header h4, .card-header h5, .card-header h6 { + text-transform: uppercase; + letter-spacing: 0.1em; + font-size: 0.935rem; + margin: 0 !important; } -#text-page h1, -#text-page h2, -#text-page h3 { - font-weight: 700; + +.card-header a { + color: #333; } -#error-page { - text-align: center; - margin-top: 40px; - margin-bottom: 100px; + +.card-body p { + font-size: 0.9rem; + color: #333; } -#error-page h4 { - margin-bottom: 40px; + +.alert { + border-radius: 0; } -#error-page p.buttons { - margin-top: 40px; + +#heading-breadcrumbs { + padding: 2rem 0; + border-top: none !important; + border-bottom: none !important; } -.pages-listing .item { - text-align: center; + +#heading-breadcrumbs .breadcrumb { + margin-bottom: 0; + background: none; + font-size: 0.9rem; } -.pages-listing .item h3 { - font-size: 18px; + +#heading-breadcrumbs h1 { text-transform: uppercase; - margin-bottom: 20px; - letter-spacing: 0.08em; + letter-spacing: 0.1em; + margin-bottom: 0; } -.pages-listing .item h3 a { - color: #555555; + +#heading-breadcrumbs li { + text-transform: uppercase; + letter-spacing: 0.1em; } -.pages-listing .item .text { - margin-bottom: 20px; + +.row.no-space { + margin-left: 0; + margin-right: 0; } -.pages-listing .item .text p { - color: #999999; - font-size: 12px; - margin-bottom: 20px; + +.row.no-space div[class*="col-"] { + padding: 0; } -.banner { - margin-bottom: 30px; + +.row.no-space .box-image { + margin: 0; +} + +.owl-carousel .owl-dots { + margin-top: 20px; text-align: center; } -.banner img { - margin: 0 auto; + +.owl-carousel .owl-dots .owl-dot { + display: inline-block; + margin: 0 5px; } -.banner a:hover img { - opacity: 0.8; - filter: alpha(opacity=80); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.owl-carousel .owl-dots .owl-dot.active span { + background: #fff; } -.pages { - text-align: center; + +.owl-carousel .owl-dots .owl-dot span { + display: block; + width: 12px; + height: 12px; + border-radius: 50%; + background: #aaa; +} + +.dark-mask { + background: rgba(0, 0, 0, 0.3); + width: 100%; + height: 100%; + position: absolute; + top: 0; + left: 0; + z-index: -1; } -.pages .loadMore { - text-align: center; + +.dark-mask.mask-primary { + background: rgba(194, 123, 170, 0.9); } -.pages .pagination { + +.icon-outlined { + width: 80px; + height: 80px; + line-height: 80px; text-align: center; -} -.features-buttons button { + display: inline-block; + font-size: 1.4rem; + border-radius: 50%; + border: 2px solid #fff; margin-bottom: 20px; } -@media (min-width: 1300px) { - body.boxed { - background: url(https://www.toptal.com/designers/subtlepatterns/patterns/subtle_zebra_3d.png); - } - body.boxed #all { - position: relative; - background: #fff; - width: 1200px; - margin: 0 auto; - overflow: hidden; - -webkit-box-shadow: 0 0 5px #cccccc; - box-shadow: 0 0 5px #cccccc; - } -} -#top { - background: #555555; - color: #eeeeee; - padding: 10px 0; + +.icon-outlined.icon-lg { + font-size: 2rem; } -#top p { - margin: 0; - font-size: 12px; + +.icon-outlined.icon-sm { + width: 55px; + height: 55px; + line-height: 55px; + text-align: center; + font-size: 1.15rem; } -#top .social { - float: right; - text-align: right; + +.icon-outlined.icon-thin { + border-width: 1px; } -#top .social a { - color: #999999; - display: inline-block; + +.icon-filled { width: 24px; height: 24px; - border-radius: 12px; line-height: 24px; - font-size: 12px; + background: #c27baa; + color: #fff; text-align: center; + border-radius: 50%; + font-size: 0.75rem; +} + +.ul-icons .icon-filled { + display: inline-block; + margin-right: 10px; +} + +.ul-icons li { + margin-bottom: 20px; + color: #555; + font-size: 0.9rem; +} + +.ul-icons a { + display: inline; +} + +ul.social { + margin: 15px 0; } -#top .social a:hover { + +ul.social a { + width: 28px; + height: 28px; + line-height: 28px; + background: #555; color: #fff; - background: #c27baa; + text-align: center; + border-radius: 50%; + margin: 0 2px; + font-size: 0.8rem; +} + +ul.social a:hover { -webkit-transform: scale(1.1); transform: scale(1.1); } -#top .social a:hover.facebook { - background-color: #4460ae; + +ul.social a.facebook { + background: #4561ae; } -#top .social a:hover.gplus { - background-color: #c21f25; + +ul.social a.gplus { + background: #c22026; } -#top .social a:hover.twitter { - background-color: #3cf; + +ul.social a.twitter { + background: #34ccff; } -#top .social a:hover.instagram { - background-color: #cd4378; + +ul.social a.email { + background: #4b8046; } -#top .social a:hover.email { - background-color: #4a7f45; + +.showcase { + color: #555; } -#top .login { - float: right; + +.showcase .icon-outlined { + border-color: #555; } -#top .login a { - font-size: 12px; - color: #eeeeee; - margin-right: 15px; - text-decoration: none; + +.showcase .counter { + margin-bottom: 20px; + display: inline-block; + margin-top: 0; +} + +.showcase h4 { text-transform: uppercase; - font-weight: 700; - letter-spacing: 0.10em; + letter-spacing: 0.1em; + font-size: 0.935rem; + margin-top: 0; } -@media (max-width: 767px) { - #top .login { - float: left; - } + +.form-control { + border-radius: 0; } -#top.light { - background: #fff; - color: #999999; - border-bottom: solid 1px #eeeeee; + +.form-control:focus { + border-color: #c27baa; + -webkit-box-shadow: 0 0 0 0.2rem rgba(194, 123, 170, 0.25); + box-shadow: 0 0 0 0.2rem rgba(194, 123, 170, 0.25); } -#top.light .login a { - color: #555555; + +.form-group label { + color: #555; } -.navbar { + +.card-primary { + border-radius: 0; + border-color: #c27baa; +} + +.card-primary .card-header { + background: #c27baa; + color: #fff; border: none; + border-radius: 0; } -.navbar ul.nav > li > a { + +.card-primary .card-header a { + color: #fff; text-transform: uppercase; - text-decoration: underline; - font-weight: bold; - letter-spacing: 0.08em; - border-top: solid 5px transparent; -} -.navbar ul.nav > li > a:hover { - border-top: solid 5px #c27baa; + font-weight: 300; + letter-spacing: 0.05em; } -.navbar ul.nav > li.active > a, -.navbar ul.nav > li.open > a { - text-decoration: none !important; - border-top: solid 5px #934478; + +.card-primary .card-body { + border-color: #c27baa; } -@media (max-width: 768px) { - .navbar ul.nav > li.active > a, - .navbar ul.nav > li.open > a { - border-top-color: transparent; - } - .navbar ul.nav > li > a:hover { - border-top-color: transparent; - } + +.card-body li { + font-size: 0.9rem; } -.navbar.navbar-light ul.nav > li.active > a { - border-top: solid 5px #934478; - background: #fff !important; - color: #555555 !important; + +table { + font-size: 0.9rem; } -.navbar.navbar-light ul.nav > li.active > a:hover { - border-top: solid 5px #934478; + +table img { + min-width: 50px !important; + max-width: 50px !important; + height: 50px; } -.navbar.navbar-light ul.nav > li > a:hover, -.navbar.navbar-light ul.nav > li.open > a:hover, -.navbar.navbar-light ul.nav > li > a:focus, -.navbar.navbar-light ul.nav > li.open > a:focus { - border-top: solid 5px #c27baa; - background: #fff !important; - color: #555555 !important; + +table input[type="number"] { + max-width: 50px; } -.navbar ul.dropdown-menu { - margin: 0; - padding: 0; + +.nav-tabs { + border-bottom: none; } -.navbar ul.dropdown-menu li { - list-style-type: none; - border-bottom: solid 1px #eeeeee; - text-transform: uppercase; - letter-spacing: 0.08em; - padding: 4px 0; + +.nav-tabs a.nav-link { + border-radius: 0 !important; + font-size: 0.9rem; } -.navbar ul.dropdown-menu li a { - position: relative; - color: #999999; - font-size: 12px; - display: block; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - left: 0; + +.tab-content { + padding: 20px; + border: 1px solid #ddd; + font-size: 0.9rem; } -.navbar ul.dropdown-menu li a:hover { - color: #c27baa; - text-decoration: none; - background: none; - left: 2px; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.top-bar { + background: #555; + color: #fff; + font-size: 0.9rem; + padding: 10px 0; } -@media (max-width: 767px) { - .navbar ul.dropdown-menu li a:hover { - left: 0; - } + +.top-bar.top-bar-light { + background: #fff; + color: #555; + border-bottom: 1px solid #ddd; } -.navbar .yamm-content h3 { - font-size: 18px; - text-transform: uppercase; - padding-bottom: 10px; - margin-top: 5px; - border-bottom: dotted 1px #555555; - letter-spacing: 0.08em; + +.top-bar.top-bar-light a.login-btn, .top-bar.top-bar-light a.signup-btn { + color: #555 !important; } -@media (max-width: 767px) { - .navbar .yamm-content h3 { - font-size: 14px; - } + +.top-bar.top-bar-light a.login-btn span, .top-bar.top-bar-light a.signup-btn span { + display: inline-block; } -.navbar .yamm-content h5 { - text-transform: uppercase; - padding-bottom: 10px; - border-bottom: dotted 1px #555555; - letter-spacing: 0.08em; + +.top-bar p { + margin-bottom: 0; + font-size: 0.75rem; } -.navbar .yamm-content ul { - margin: 0; - padding: 0; + +.top-bar ul { + margin-bottom: 0; } -.navbar .yamm-content ul li { - list-style-type: none; - border-bottom: solid 1px #eeeeee; + +.top-bar a.login-btn, .top-bar a.signup-btn { + color: #eee; text-transform: uppercase; - padding: 4px 0; -} -.navbar .yamm-content ul li a { - position: relative; - color: #999999; - font-size: 12px; - display: block; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + letter-spacing: 0.1em; + text-decoration: none !important; + font-size: 0.75rem; + font-weight: 700; + margin-right: 10px; } -.navbar .yamm-content ul li a:hover { - color: #c27baa; - text-decoration: none; - padding-left: 2px; + +.top-bar a.login-btn i, .top-bar a.signup-btn i { + margin-right: 10px; } -.navbar .yamm-content .banner { - margin-bottom: 10px; + +.top-bar ul.social-custom { + margin-left: 20px; } -.navbar .yamm-fw .dropdown-menu { + +.top-bar ul.social-custom li { padding: 0; + margin: 0; } -.navbar .navbar-buttons { - float: right; + +.top-bar ul.social-custom a { + text-decoration: none !important; + font-size: 0.7rem; + width: 26px; + height: 26px; + line-height: 26px; + color: #999; + text-align: center; + border-radius: 50%; + margin: 0; } -.navbar .navbar-buttons button, -.navbar .navbar-buttons a.btn, -.navbar .navbar-buttons .btn-default.navbar-toggle { - margin-top: 11px; - margin-bottom: 11px; - margin-left: 0; - margin-right: 5px; -} -.navbar .btn-default, -.navbar .btn-default.navbar-toggle { - color: #999999; - background-color: #fff; - margin-left: 7px; - margin-right: 0; -} -.navbar .btn-default:hover, -.navbar .btn-default.navbar-toggle:hover, -.navbar .btn-default:focus, -.navbar .btn-default.navbar-toggle:focus { - background-color: #fff; - border-color: #c27baa; - color: #c27baa; + +.top-bar ul.social-custom a:hover { + background: #c27baa; + color: #fff; } -.navbar #search { - clear: both; - border-top: solid 1px #c27baa; - text-align: right; + +.top-bar .contact-info { + margin-right: 20px; } -.navbar #search form { - float: right; + +.top-bar .contact-info a { + font-size: 0.8rem; } -.navbar #search form .input-group { - width: 500px; + +.modal .modal-header h4 { + text-transform: uppercase; + letter-spacing: 0.1em; } -@media (max-width: 768px) { - .navbar #search form .input-group { - width: 100%; - } + +.modal input::-moz-placeholder { + font-size: 0.85rem; } -.navbar #basket-overview a { - margin-left: 7px; + +.modal input::-webkit-input-placeholder { + font-size: 0.85rem; } -.navbar-affixed-top { - top: -32px; + +.modal input:-ms-input-placeholder { + font-size: 0.85rem; } -.navbar-affixed-top.affix-top { - -webkit-transition: all 0.5s ease-out; - -moz-transition: all 0.5s ease-out; - transition: all 0.5s ease-out; + +.modal p { + font-size: 0.85rem; } -.navbar-affixed-top.affix { + +header.nav-holder.sticky { position: fixed; - width: 100%; top: 0; - z-index: 1000; - -webkit-box-shadow: 0 0 5px #cccccc; - box-shadow: 0 0 5px #cccccc; - -webkit-transition: all 0.5s ease-out; - -moz-transition: all 0.5s ease-out; - transition: all 0.5s ease-out; + left: 0; + width: 100%; + background: #fff; + z-index: 999; + -webkit-box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); + box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); } -body.boxed .navbar-affixed-top.affix { - position: static; + +#navbar { + background: #fff; + padding-top: 0; + padding-bottom: 0; } -#login-modal { - overflow: hidden; + +#navbar .navbar-toggler { + font-size: 0.9rem; + padding: 10px 15px; + border-color: #ddd; } -#login-modal .modal-header h4 { - text-transform: uppercase; + +#navbar ul ul a { + padding-left: 0 !important; } -#login-modal form { - margin-bottom: 20px; + +#navbar .dropdown-menu { + border-radius: 0; + -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); + box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); + margin-top: 0; + padding-top: 0; + padding-bottom: 0; +} + +#navbar .dropdown-menu .dropdown-item { + padding: 0; } -#login-modal a { + +#navbar .dropdown-menu h5 { + text-transform: uppercase; + letter-spacing: 0.1em; + padding-bottom: 5px; + border-bottom: 1px dotted #ccc; + margin-top: .7rem; + margin-bottom: .5rem; +} + +#navbar .dropdown-menu a.nav-link { + font-size: 0.75rem; + letter-spacing: 0.1em; + text-transform: uppercase !important; + border-bottom: 1px solid #eee; + padding: 15px 20px !important; +} + +#navbar .dropdown-menu a.nav-link:hover { + -webkit-transform: translateX(5px); + transform: translateX(5px); color: #c27baa; } -#login-modal p { - font-weight: 300; - margin-bottom: 20px; - font-size: 13px; + +#navbar .dropdown-submenu { + position: relative; } -/* buttons */ -.btn { - font-weight: 700; - font-family: "Roboto", Helvetica, Arial, sans-serif; - text-transform: uppercase; - letter-spacing: 0.08em; - padding: 6px 12px; - font-size: 13px; - line-height: 1.42857143; - border-radius: 0; + +#navbar .dropdown-submenu > .dropdown-menu { + top: 0; + left: 100%; + margin-top: -2px; + font-size: 1em; } -.input-group .btn { - font-size: 14px; + +#navbar .menu-large { + position: static !important; } -.btn-lg { - padding: 10px 16px; - font-size: 14px; - line-height: 1.33; - border-radius: 0; + +#navbar .menu-large .megamenu { + padding: 20px; + width: 100%; + max-width: 1140px; + left: 50%; + -webkit-transform: translateX(-50%); + transform: translateX(-50%); + margin-top: -1px; +} + +#navbar .menu-large a.nav-link { + padding: 7px !important; + padding-left: 0 !important; +} + +#navbar .navbar-nav > li.active > a { + background: #c27baa !important; + color: #fff !important; + text-decoration: none !important; + border-color: #b25894 !important; } -.btn-sm { - padding: 5px 10px; - font-size: 12px; - line-height: 1.5; - border-radius: 0; + +#navbar .navbar-nav > li > a { + margin: 0; + padding: 1.4rem 1rem 1.6rem; + color: #555; + font-weight: 600; + text-transform: uppercase; + letter-spacing: 0.1em; + font-size: 0.9rem; + text-decoration: none; + border-top: .3rem solid transparent; } -.btn-xs { - padding: 1px 5px; - font-size: 12px; - line-height: 1.5; - border-radius: 0; + +#navbar .navbar-nav > li > a:hover { + background: rgba(194, 123, 170, 0.5); + border-color: rgba(194, 123, 170, 0.8); +} + +#navbar .navbar-nav > li > a:focus { + background: #c27baa !important; + color: #fff !important; + text-decoration: none !important; + border-color: #b25894 !important; +} + +#navbar.nav-light .navbar-nav > li.active a.dropdown-toggle, +#navbar.nav-light .navbar-nav > li.active a.dropdown-toggle:hover { + background: none !important; + color: #555 !important; + text-decoration: underline !important; + border-color: #c27baa !important; +} + +#navbar.nav-light .navbar-nav > li > a:hover { + background: none !important; + border-color: #daafcc !important; +} + +#navbar.nav-light .navbar-nav > li > a:focus { + background: none !important; + color: #555 !important; + text-decoration: underline !important; + border-color: #c27baa !important; +} + +@media (max-width: 991px) { + #navbar { + padding-top: 1rem; + padding-bottom: 1rem; + } + #navbar .menu-large .megamenu { + width: 100%; + left: 0 !important; + -webkit-transform: none !important; + transform: none !important; + } + #navbar .navbar-collapse { + max-height: 600px; + overflow-y: auto; + margin-top: 1rem; + } + #navbar .navbar-nav > li > a { + padding: 0 10px; + height: 45px; + line-height: 45px; + border-top: 0; + font-size: 0.85rem; + width: 100%; + } + #navbar .navbar-nav > li > a:hover { + background: rgba(194, 123, 170, 0.5); + border-color: rgba(194, 123, 170, 0.8); + } + #navbar .dropdown-menu { + border: none; + -webkit-box-shadow: none; + box-shadow: none; + } } + +.btn { + text-transform: uppercase; + letter-spacing: 0.1em; +} + .btn-template-main { - color: #c27baa; - background-color: #ffffff; - border-color: #c27baa; + background: #c27baa; + border: 1px solid #c27baa !important; + color: #fff !important; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-main:hover, -.btn-template-main:focus, -.btn-template-main:active, -.btn-template-main.active, -.open > .dropdown-toggle.btn-template-main { - color: #c27baa; - background-color: #e6e6e6; - border-color: #af518f; + +.btn-template-main:hover, .btn-template-main:focus { + background: #ba6a9f; + color: #fff !important; + border-color: #ba6a9f !important; } -.btn-template-main:active, -.btn-template-main.active, -.open > .dropdown-toggle.btn-template-main { - background-image: none; + +.btn-template-white { + background: #fff; + color: #c27baa !important; + border: 1px solid #c27baa !important; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-main.disabled, -.btn-template-main[disabled], -fieldset[disabled] .btn-template-main, -.btn-template-main.disabled:hover, -.btn-template-main[disabled]:hover, -fieldset[disabled] .btn-template-main:hover, -.btn-template-main.disabled:focus, -.btn-template-main[disabled]:focus, -fieldset[disabled] .btn-template-main:focus, -.btn-template-main.disabled:active, -.btn-template-main[disabled]:active, -fieldset[disabled] .btn-template-main:active, -.btn-template-main.disabled.active, -.btn-template-main[disabled].active, -fieldset[disabled] .btn-template-main.active { - background-color: #ffffff; - border-color: #c27baa; + +.btn-template-white:hover, .btn-template-white:focus { + background: #c27baa !important; + color: #fff !important; } -.btn-template-main .badge { - color: #ffffff; - background-color: #c27baa; + +.btn-template-outlined { + background: none; + border: 1px solid #c27baa !important; + color: #c27baa; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-main:hover, -.btn-template-main:focus, -.btn-template-main:active, -.btn-template-main.active { + +.btn-template-outlined:hover, .btn-template-outlined:focus { background: #c27baa; - color: #ffffff; - border-color: #c27baa; + color: #fff !important; } -.btn-template-transparent-primary { - color: #ffffff; - background-color: transparent; - border-color: #ffffff; -} -.btn-template-transparent-primary:hover, -.btn-template-transparent-primary:focus, -.btn-template-transparent-primary:active, -.btn-template-transparent-primary.active, -.open > .dropdown-toggle.btn-template-transparent-primary { - color: #ffffff; - background-color: rgba(0, 0, 0, 0); - border-color: #e0e0e0; -} -.btn-template-transparent-primary:active, -.btn-template-transparent-primary.active, -.open > .dropdown-toggle.btn-template-transparent-primary { - background-image: none; + +.btn-template-outlined-white { + background: none; + border: 1px solid #fff !important; + color: #fff; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-transparent-primary.disabled, -.btn-template-transparent-primary[disabled], -fieldset[disabled] .btn-template-transparent-primary, -.btn-template-transparent-primary.disabled:hover, -.btn-template-transparent-primary[disabled]:hover, -fieldset[disabled] .btn-template-transparent-primary:hover, -.btn-template-transparent-primary.disabled:focus, -.btn-template-transparent-primary[disabled]:focus, -fieldset[disabled] .btn-template-transparent-primary:focus, -.btn-template-transparent-primary.disabled:active, -.btn-template-transparent-primary[disabled]:active, -fieldset[disabled] .btn-template-transparent-primary:active, -.btn-template-transparent-primary.disabled.active, -.btn-template-transparent-primary[disabled].active, -fieldset[disabled] .btn-template-transparent-primary.active { - background-color: transparent; - border-color: #ffffff; + +.btn-template-outlined-white:hover, .btn-template-outlined-white:focus { + background: #fff; + color: #c27baa !important; } -.btn-template-transparent-primary .badge { - color: transparent; - background-color: #ffffff; + +.btn-template-outlined-black { + background: none; + border: 1px solid #333 !important; + color: #333; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-transparent-primary:hover, -.btn-template-transparent-primary:focus, -.btn-template-transparent-primary:active, -.btn-template-transparent-primary.active { - background: #fff; - color: #c27baa; - border-color: #fff; + +.btn-template-outlined-black:hover, .btn-template-outlined-black:focus { + background: #333 !important; + color: #fff !important; } -.btn-template-transparent-black { - color: #ffffff; - background-color: transparent; - border-color: #ffffff; -} -.btn-template-transparent-black:hover, -.btn-template-transparent-black:focus, -.btn-template-transparent-black:active, -.btn-template-transparent-black.active, -.open > .dropdown-toggle.btn-template-transparent-black { - color: #ffffff; - background-color: rgba(0, 0, 0, 0); - border-color: #e0e0e0; -} -.btn-template-transparent-black:active, -.btn-template-transparent-black.active, -.open > .dropdown-toggle.btn-template-transparent-black { - background-image: none; + +.features-buttons button { + margin-bottom: 20px; } -.btn-template-transparent-black.disabled, -.btn-template-transparent-black[disabled], -fieldset[disabled] .btn-template-transparent-black, -.btn-template-transparent-black.disabled:hover, -.btn-template-transparent-black[disabled]:hover, -fieldset[disabled] .btn-template-transparent-black:hover, -.btn-template-transparent-black.disabled:focus, -.btn-template-transparent-black[disabled]:focus, -fieldset[disabled] .btn-template-transparent-black:focus, -.btn-template-transparent-black.disabled:active, -.btn-template-transparent-black[disabled]:active, -fieldset[disabled] .btn-template-transparent-black:active, -.btn-template-transparent-black.disabled.active, -.btn-template-transparent-black[disabled].active, -fieldset[disabled] .btn-template-transparent-black.active { - background-color: transparent; - border-color: #ffffff; + +.customers { + margin-bottom: 40px; +} + +.customers .item { + margin: 0 20px; +} + +.customers .item img { + -webkit-filter: grayscale(100%); + filter: grayscale(100%); + -webkit-transition: all 0.3s; + transition: all 0.3s; +} + +.customers .item img:hover { + -webkit-filter: grayscale(0%); + filter: grayscale(0%); } -.btn-template-transparent-black .badge { - color: transparent; - background-color: #ffffff; + +.testimonials .item { + margin: 0 5px; + height: 100%; } -.btn-template-transparent-black:hover, -.btn-template-transparent-black:focus, -.btn-template-transparent-black:active, -.btn-template-transparent-black.active { + +.testimonials .testimonial { + padding: 20px; background: #fff; - color: #000; - border-color: #fff; + height: 100%; } -.btn-template-primary { - color: #ffffff; - background-color: #c27baa; - border-color: #c27baa; + +.testimonials .text { + font-size: 0.85rem; +} + +.testimonials .text p { + color: #999; +} + +.testimonials .avatar { + min-width: 60px; + max-width: 60px; + min-height: 60px; + max-height: 60px; + border-radius: 50%; + overflow: hidden; + margin-left: 10px; } -.btn-template-primary:hover, -.btn-template-primary:focus, -.btn-template-primary:active, -.btn-template-primary.active, -.open > .dropdown-toggle.btn-template-primary { - color: #ffffff; - background-color: #b25894; - border-color: #af518f; + +.testimonials .bottom { + width: 100%; } -.btn-template-primary:active, -.btn-template-primary.active, -.open > .dropdown-toggle.btn-template-primary { - background-image: none; + +.testimonials .bottom .testimonial-info { + text-align: right; } -.btn-template-primary.disabled, -.btn-template-primary[disabled], -fieldset[disabled] .btn-template-primary, -.btn-template-primary.disabled:hover, -.btn-template-primary[disabled]:hover, -fieldset[disabled] .btn-template-primary:hover, -.btn-template-primary.disabled:focus, -.btn-template-primary[disabled]:focus, -fieldset[disabled] .btn-template-primary:focus, -.btn-template-primary.disabled:active, -.btn-template-primary[disabled]:active, -fieldset[disabled] .btn-template-primary:active, -.btn-template-primary.disabled.active, -.btn-template-primary[disabled].active, -fieldset[disabled] .btn-template-primary.active { - background-color: #c27baa; - border-color: #c27baa; + +.testimonials .bottom h5 { + text-transform: uppercase; + letter-spacing: 0.1em; + margin-bottom: 5px; } -.btn-template-primary .badge { + +.testimonials .bottom p { + font-size: 0.75rem; + color: #999; + margin-bottom: 0; +} + +.testimonials .icon { color: #c27baa; - background-color: #ffffff; + font-size: 2rem; + margin-right: 20px; } -#intro { - background: url('../img/home.jpg') no-repeat center top; - -webkit-background-size: cover; - -moz-background-size: cover; - -o-background-size: cover; - background-size: cover; + +.testimonials .owl-carousel .owl-stage { + display: -webkit-box !important; + display: -ms-flexbox !important; + display: flex !important; + -webkit-box-align: stretch !important; + -ms-flex-align: stretch !important; + align-items: stretch !important; } -#intro .item { - font-family: "Roboto", Helvetica, Arial, sans-serif; - height: 100%; + +.testimonials .owl-dot.active span { + background: #c27baa !important; } -#intro .item h1 { - text-transform: uppercase; - font-size: 50px; + +.home-carousel { color: #fff; - margin-bottom: 40px; - letter-spacing: 0.08em; } -@media (max-width: 991px) { - #intro .item h1 { - font-size: 40px; - } + +.home-carousel .owl-carousel { + padding-top: 60px; + padding-bottom: 20px; } -@media (max-width: 767px) { - #intro .item h1 { - font-size: 25px; - } + +.home-carousel h1, .home-carousel h2 { + text-transform: uppercase; + letter-spacing: 0.1em; +} + +.home-carousel li, .home-carousel p { + text-transform: uppercase; + letter-spacing: 0.1em; + font-weight: 700; + font-size: 1.1rem; + margin-bottom: 10px; +} + +.home-carousel p img { + max-width: 200px; +} + +.project .owl-dot.active span { + background: #c27baa !important; +} + +.project .owl-nav { + position: absolute; + top: 0; + right: 0; + left: auto; + bottom: auto; + width: 100%; + padding: 20px; + text-align: right; +} + +.project .owl-nav .owl-prev, .project .owl-nav .owl-next { + width: 30px; + height: 30px; + line-height: 30px; + background: #fff; + color: #c27baa; + text-align: center; + border-radius: 50%; + display: inline-block; + margin: 0 5px; + -webkit-transition: all 0.3s; + transition: all 0.3s; } -#intro .item h3 { + +.project .owl-nav .owl-prev:hover, .project .owl-nav .owl-next:hover { + background: #c27baa; color: #fff; - margin-bottom: 40px; } + @media (max-width: 767px) { - #intro .item h3 { - font-size: 15px; - margin-bottom: 20px; + .home-carousel { + text-align: center !important; } -} -#intro .item .btn { - text-transform: none; -} -@media (max-width: 991px) { - #intro .item .btn { - font-size: 14px; + .home-carousel p, .home-carousel h1, .home-carousel ul { + text-align: center !important; } -} -@media (max-width: 991px) { - #intro .item .carousel-caption { - left: 10%; - right: 10%; + .home-carousel img { + margin: 10px auto; } } -#intro .container, -#intro .row { - height: 100%; - position: relative; + +.owl-thumbs { + display: -webkit-box; + display: -ms-flexbox; + display: flex; } -.jumbotron { - padding: 30px; - margin-bottom: 0; + +.owl-thumbs button { + background: none; + border: none; + margin: 5px; + outline: none; +} + +.home-blog-post { + margin: 15px 0; +} + +.home-blog-post .image { position: relative; - background: url('../img/photogrid.jpg') center center repeat; - background-size: cover; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + margin-bottom: 15px; } -.jumbotron .dark-mask { - position: absolute; - top: 0; - left: 0; + +.home-blog-post .overlay { width: 100%; height: 100%; - background: #c27baa; - opacity: 0.9; - filter: alpha(opacity=90); + background: rgba(194, 123, 170, 0.6); + position: absolute; + top: 0; + opacity: 0; + -webkit-transition: all 0.5s; + transition: all 0.5s; } -.jumbotron h1, -.jumbotron h2, -.jumbotron h3, -.jumbotron p, -.jumbotron ul { - color: #fff; + +.home-blog-post .overlay a { + -webkit-transform: translateY(30px); + transform: translateY(30px); + opacity: 0; } -.jumbotron h1, -.jumbotron h2, -.jumbotron h3 { - color: #ffffff; - text-transform: uppercase; - letter-spacing: 0.08em; + +.home-blog-post .overlay i { + margin-right: 5px; } -.jumbotron p { + +.home-blog-post .text { + text-align: center; +} + +.home-blog-post .text .intro { + text-align: left; margin-bottom: 20px; - font-size: 21px; - font-weight: 400; + color: #888; + font-size: 0.9rem; } -.jumbotron p.text-uppercase { - font-weight: 700; + +.home-blog-post h4 { + margin: 10px 0; + text-transform: uppercase; + letter-spacing: 0.1em; } -.jumbotron > hr { - border-top-color: #d5d5d5; + +.home-blog-post .author-category { + font-size: 0.75rem; + color: #999; + text-transform: uppercase; + letter-spacing: 0.1em; } -.container .jumbotron { - border-radius: 0; + +.home-blog-post .author-category a { + font-weight: 500; } -.jumbotron .container { - max-width: 100%; - z-index: 2; + +.home-blog-post:hover .overlay { + opacity: 1; } -@media screen and (min-width: 768px) { - .jumbotron { - padding-top: 48px; - padding-bottom: 48px; - } - .container .jumbotron { - padding-left: 60px; - padding-right: 60px; - } - .jumbotron h1, - .jumbotron .h1 { - font-size: 46px; - } + +.home-blog-post:hover .overlay a { + -webkit-transform: none; + transform: none; + opacity: 1; } -#categoryMenu h3 { - padding: 20px; - background: #f7f7f7; - margin: 0; - border-bottom: solid 1px #eeeeee; - text-transform: uppercase; - letter-spacing: 0.08em; + +#blog-listing-big .post, #blog-listing-medium .post { + margin-bottom: 60px; } -.panel.sidebar-menu h3 { - padding: 5px 0; - margin: 0; + +#blog-listing-big .image, #blog-listing-medium .image { + margin-bottom: 15px; } -.panel.sidebar-menu { - background: #fff; - margin: 0 0 20px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; + +#blog-listing-big h2 a, #blog-listing-medium h2 a { + color: #555; + text-transform: uppercase; + letter-spacing: 0.1em; } -.panel.sidebar-menu .panel-heading { + +#blog-listing-big .author-category, #blog-listing-medium .author-category { + color: #999; text-transform: uppercase; + letter-spacing: 0.1em; + font-weight: 300; margin-bottom: 10px; - background: none; - padding: 0; - letter-spacing: 0.08em; - border-bottom: none; + font-size: .9rem; } -.panel.sidebar-menu .panel-heading h1, -.panel.sidebar-menu .panel-heading h2, -.panel.sidebar-menu .panel-heading h3, -.panel.sidebar-menu .panel-heading h4, -.panel.sidebar-menu .panel-heading h5 { - display: inline-block; - border-bottom: solid 5px #c27baa; - line-height: 1.1; + +#blog-listing-big .author-category a, #blog-listing-medium .author-category a { + font-weight: 500; margin-bottom: 0; - padding-bottom: 10px; } -.panel.sidebar-menu .panel-heading .btn.btn-danger { - color: #fff; - margin-top: 5px; + +#blog-listing-big .date-comments, #blog-listing-medium .date-comments { + margin-bottom: 0; } -.panel.sidebar-menu .panel-body { - padding: 0; + +#blog-listing-big .date-comments a, #blog-listing-medium .date-comments a { + color: #999; + margin-left: 25px; } -.panel.sidebar-menu .panel-body span.colour { - display: inline-block; - width: 15px; - height: 15px; - border: solid 1px #555555; - vertical-align: top; - margin-top: 2px; - margin-left: 5px; + +#blog-listing-big .date-comments i, #blog-listing-medium .date-comments i { + margin-right: 5px; } -.panel.sidebar-menu .panel-body span.colour.white { - background: #fff; + +#blog-listing-big p.intro, #blog-listing-medium p.intro { + margin-top: 10px; + color: #777; } -.panel.sidebar-menu .panel-body span.colour.red { - background: red; + +.pager { + padding: 20px 0; + margin-top: 20px; + border-top: 1px solid #e6e6e6; } -.panel.sidebar-menu .panel-body span.colour.green { - background: green; + +.disabled a, .disabled a:hover { + border-color: #999 !important; + color: #999 !important; + background: none !important; + cursor: not-allowed; } -.panel.sidebar-menu .panel-body span.colour.blue { - background: blue; + +#blog-post #post-content { + margin-bottom: 20px; } -.panel.sidebar-menu .panel-body span.colour.yellow { - background: yellow; + +#blog-post .comment { + margin-bottom: 25px; } -.panel.sidebar-menu .panel-body label { - color: #999999; - font-size: 12px; + +#blog-post .comment .posted { + color: #999; + font-size: 0.8rem; + margin-bottom: 10px; } -.panel.sidebar-menu .panel-body label:hover { - color: #555555; + +#blog-post .comment.last { + margin-bottom: 0; } -.panel.sidebar-menu ul.nav.category-menu { - margin-bottom: 20px; - text-transform: uppercase; - font-weight: 700; - letter-spacing: 0.08em; + +#blog-post .comment p { + font-size: 0.9rem; } -.panel.sidebar-menu ul.nav.category-menu li a { - font-family: "Roboto", Helvetica, Arial, sans-serif; + +#blog-post #comments, #blog-post #comment-form { + padding: 20px 0; + margin-top: 20px; + border-top: solid 1px #eee; } -.panel.sidebar-menu ul.nav ul { - list-style: none; - padding-left: 0; + +#blog-post #comments h4, #blog-post #comment-form h4 { + margin-bottom: 1.5rem; } -.panel.sidebar-menu ul.nav ul li { - display: block; -} -.panel.sidebar-menu ul.nav ul li a { - position: relative; - font-family: "Times New Roman", Times, serif; - font-weight: normal; - text-transform: none !important; - display: block; - padding: 10px 15px; - padding-left: 30px; - font-size: 12px; - color: #999999; -} -.panel.sidebar-menu ul.nav ul li a:hover, -.panel.sidebar-menu ul.nav ul li a:focus { - text-decoration: none; - background-color: #eeeeee; -} -.panel.sidebar-menu ul.tag-cloud { - list-style: none; - padding-left: 0; -} -.panel.sidebar-menu ul.tag-cloud li { - display: inline-block; -} -.panel.sidebar-menu ul.tag-cloud li a { - display: inline-block; - padding: 5px; - border: solid 1px #eeeeee; - border-radius: 0; - color: #c27baa; - margin: 5px 5px 5px 0; - text-transform: uppercase; - letter-spacing: 0.08em; - font-weight: 700; - font-size: 12px; - text-decoration: none; -} -.panel.sidebar-menu ul.tag-cloud li a:hover { - color: #c27baa; - border-color: #c27baa; -} -.panel.sidebar-menu ul.tag-cloud li.active a { - color: #FFFFFF; - background-color: #c27baa; -} -.panel.sidebar-menu ul.tag-cloud li.active a:hover { - color: #FFFFFF; -} -.panel.sidebar-menu ul.popular, -.panel.sidebar-menu ul.recent { - list-style: none; - padding-left: 0; - padding: 20px 0; -} -.panel.sidebar-menu ul.popular li, -.panel.sidebar-menu ul.recent li { - margin-bottom: 10px; - padding: 5px 0; - border-bottom: dotted 1px #eeeeee; -} -.panel.sidebar-menu ul.popular li:before, -.panel.sidebar-menu ul.recent li:before, -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - content: " "; - display: table; -} -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - clear: both; -} -.panel.sidebar-menu ul.popular li:before, -.panel.sidebar-menu ul.recent li:before, -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - content: " "; - display: table; -} -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - clear: both; -} -.panel.sidebar-menu ul.popular li img, -.panel.sidebar-menu ul.recent li img { - width: 50px; - margin-right: 10px; -} -.panel.sidebar-menu ul.popular li h5, -.panel.sidebar-menu ul.recent li h5 { - margin: 0 0 10px; -} -.panel.sidebar-menu ul.popular li h5 a, -.panel.sidebar-menu ul.recent li h5 a { - font-weight: normal; -} -.panel.sidebar-menu ul.popular li p.date, -.panel.sidebar-menu ul.recent li p.date { - float: right; - font-size: 12px; - color: #999999; -} -.panel.sidebar-menu ul.popular li:last-child, -.panel.sidebar-menu ul.recent li:last-child { - border-bottom: none; -} -.panel.sidebar-menu .text-widget { - font-size: 12px; -} -.panel.sidebar-menu.with-icons ul.nav li a:after { - font-family: 'FontAwesome'; - content: "\f105"; - position: relative; - top: 0; - float: right; -} -/* ribbons for product sales etc. */ -.ribbon { - position: absolute; - top: 50px; - padding-left: 51px; - font-weight: 700; - letter-spacing: 0.08em; -} -.ribbon .ribbon-background { - position: absolute; - top: 0; - right: 0; -} -.ribbon .theribbon { - position: relative; - width: 80px; - padding: 6px 20px 6px 20px; - margin: 30px 10px 10px -71px; - color: #fff; - background-color: #c27baa; - font-family: "Roboto", Helvetica, Arial, sans-serif; -} -.ribbon .theribbon:before, -.ribbon .theribbon:after { - content: ' '; - position: absolute; - width: 0; - height: 0; -} -.ribbon .theribbon:after { - left: 0px; - top: 100%; - border-width: 5px 10px; - border-style: solid; - border-color: #000000 #000000 transparent transparent; -} -.ribbon.sale { - top: 0; -} -.ribbon.new { - top: 50px; -} -.ribbon.new .theribbon { - background-color: #5bc0de; - text-shadow: 0px 1px 2px #bbb; -} -.ribbon.new .theribbon:after { - border-color: #2390b0 #2390b0 transparent transparent; -} -.ribbon.gift { - top: 100px; -} -.ribbon.gift .theribbon { - background-color: #5cb85c; - text-shadow: 0px 1px 2px #bbb; -} -.ribbon.gift .theribbon:after { - border-color: #357935 #357935 transparent transparent; -} -.owl-carousel .owl-controls .owl-page.active span, -.owl-theme .owl-controls .owl-page.active span, -.owl-carousel .owl-controls.clickable .owl-page:hover span, -.owl-theme .owl-controls.clickable .owl-page:hover span { - background: #c27baa; -} -.owl-carousel .owl-controls .owl-buttons, -.owl-theme .owl-controls .owl-buttons { - position: absolute; - top: 5px; - right: 0; -} -.owl-carousel .owl-controls .owl-buttons div, -.owl-theme .owl-controls .owl-buttons div { - width: 26px; - height: 26px; - line-height: 25px; - margin: 0 5px 0 0; - font-size: 18px; - color: #c27baa; - padding: 0; - background: #fff; - border-radius: 13px; - vertical-align: middle; - text-align: center; - opacity: 1; - filter: alpha(opacity=100); -} -.home-carousel { - position: relative; - background: url('../img/photogrid.jpg') center center repeat; - background-size: cover; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -.home-carousel .dark-mask { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: #c27baa; - opacity: 0.9; - filter: alpha(opacity=90); -} -.home-carousel .owl-carousel { - padding-top: 60px; - padding-bottom: 20px; -} -.home-carousel .owl-theme .owl-controls .owl-page span { - background: #666; -} -.home-carousel .owl-theme .owl-controls .owl-page.active span { - background: #fff; -} -.home-carousel .owl-theme .owl-controls .owl-page:hover span { - background: #fff; -} -@media (max-width: 767px) { - .home-carousel { - text-align: center !important; - } -} -@media (min-width: 992px) { - .home-carousel .right { - text-align: right; - } -} -.home-carousel h1, -.home-carousel h2, -.home-carousel h3, -.home-carousel p, -.home-carousel ul { - color: #fff; -} -.home-carousel h1 { - font-weight: 700; - text-transform: uppercase; - font-size: 46px; - letter-spacing: 0.08em; -} -@media (max-width: 991px) { - .home-carousel h1 { - font-size: 36px; - } -} -.home-carousel h2 { - font-weight: 700; - text-transform: uppercase; - font-size: 40px; - letter-spacing: 0.08em; -} -.home-carousel ul, -.home-carousel p { - font-size: 18px; - font-weight: 700; - padding: 0; - text-transform: uppercase; - letter-spacing: 0.10em; -} -@media (max-width: 991px) { - .home-carousel ul, - .home-carousel p { - font-size: 14px; - } -} -.home-carousel ul li { - margin-bottom: 10px; -} -.customers { - padding: 0; - margin-bottom: 40px; -} -.customers .item { - list-style-type: none; - text-align: center; - margin: 0 20px; -} -.customers .item img { - display: inline-block; - filter: url("data:image/svg+xml;utf8,#grayscale"); - /* Firefox 10+, Firefox on Android */ - filter: gray; - /* IE6-9 */ - -webkit-filter: grayscale(100%); - /* Chrome 19+, Safari 6+, Safari 6+ iOS */ - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -.customers .item img:hover { - max-width: auto; - filter: none; - -webkit-filter: none; -} -.testimonials { - padding: 0; - margin-bottom: 40px; -} -.testimonials .item { - list-style-type: none; - margin: 0 5px; - background: #fff; - padding-bottom: 60px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; -} -.testimonials .item .testimonial { - position: relative; - padding: 20px; -} -.testimonials .item .testimonial:before, -.testimonials .item .testimonial:after { - content: " "; - display: table; -} -.testimonials .item .testimonial:after { - clear: both; -} -.testimonials .item .testimonial:before, -.testimonials .item .testimonial:after { - content: " "; - display: table; -} -.testimonials .item .testimonial:after { - clear: both; -} -.testimonials .item .testimonial .text { - color: #999999; - margin-bottom: 40px; -} -.testimonials .item .testimonial .bottom { - position: absolute; - left: 0; - bottom: 0; - width: 100%; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - padding: 20px; - height: 50px; -} -.testimonials .item .testimonial .bottom .icon { - color: #c27baa; - font-size: 30px; - float: left; - width: 20%; -} -.testimonials .item .testimonial .name-picture { - float: right; - width: 80%; - text-align: right; -} -.testimonials .item .testimonial .name-picture h5 { - font-size: 14px; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.testimonials .item .testimonial .name-picture p { - color: #999999; - margin: 0; - font-size: 12px; -} -.testimonials .item .testimonial .name-picture img { - float: right; - width: 60px; - border-radius: 30px; - margin-left: 10px; -} -.team-member { - text-align: center; - margin-bottom: 40px; -} -.team-member h3 { - font-size: 18px; - text-transform: uppercase; - margin-bottom: 5px; - letter-spacing: 0.08em; -} -.team-member h3 a { - color: #555555; -} -.team-member p.role { - color: #999999; - font-size: 12px; - text-transform: uppercase; - letter-spacing: 0.06em; -} -.team-member .social { - margin-bottom: 20px; -} -.team-member .social a { - margin: 0 10px 0 0; - color: #fff; - display: inline-block; - width: 26px; - height: 26px; - border-radius: 13px; - line-height: 26px; - font-size: 15px; - text-align: center; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - vertical-align: bottom; -} -.team-member .social a i { - vertical-align: bottom; - line-height: 26px; -} -.team-member .social a.facebook { - background-color: #4460ae; -} -.team-member .social a.gplus { - background-color: #c21f25; -} -.team-member .social a.twitter { - background-color: #3cf; -} -.team-member .social a.instagram { - background-color: #cd4378; -} -.team-member .social a.email { - background-color: #4a7f45; -} -.team-member .text p { - color: #999999; - font-size: 12px; -} -.team-member .social, -.team-member-detail .social { + +#blog-post #comment-form { margin-bottom: 20px; } -.team-member .social a, -.team-member-detail .social a { - margin: 0 10px 0 0; - color: #fff; - display: inline-block; - width: 26px; - height: 26px; - border-radius: 13px; - line-height: 26px; - font-size: 15px; - text-align: center; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - vertical-align: bottom; -} -.team-member .social a i, -.team-member-detail .social a i { - vertical-align: bottom; - line-height: 26px; -} -.team-member .social a.facebook, -.team-member-detail .social a.facebook { - background-color: #4460ae; -} -.team-member .social a.gplus, -.team-member-detail .social a.gplus { - background-color: #c21f25; -} -.team-member .social a.twitter, -.team-member-detail .social a.twitter { - background-color: #3cf; -} -.team-member .social a.instagram, -.team-member-detail .social a.instagram { - background-color: #cd4378; -} -.team-member .social a.email, -.team-member-detail .social a.email { - background-color: #4a7f45; + +#blog-post .reply i { + margin-right: 5px; } + .box-simple { - text-align: center; margin-bottom: 40px; + text-align: center; +} + +.box-simple:hover .icon-outlined { + -webkit-transform: scale(1.1); + transform: scale(1.1); } -.box-simple .icon { + +.box-simple .icon-outlined { color: #c27baa; - border-color: #c27baa; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + border: 1px solid #c27baa; + -webkit-transition: all 0.3s; + transition: all 0.3s; } + .box-simple h3 { - font-weight: normal; - font-size: 18px; text-transform: uppercase; - line-height: 1.5; - color: #555555; - font-weight: 800; - letter-spacing: 0.08em; -} -.box-simple h3 a { - color: #555555; + letter-spacing: 0.1em; } + .box-simple p { - color: #999999; -} -.box-simple:hover .icon { - -webkit-transform: scale(1.1, 1.1); - -ms-transform: scale(1.1, 1.1); - -o-transform: scale(1.1, 1.1); - transform: scale(1.1, 1.1); -} -.box-simple:hover .icon i { - -webkit-transform: scale(1, 1); - -ms-transform: scale(1, 1); - -o-transform: scale(1, 1); - transform: scale(1, 1); + color: #999; + margin: 20px 0; + font-size: 0.9rem; } + .box-simple.box-white { - padding: 20px; - border: dotted 1px #999999; + border: dotted 1px #999; + padding: 15px 20px; + margin-bottom: 0; } + .box-simple.box-white .icon { - color: #555555; - border-color: transparent; - font-size: 70px; + font-size: 2rem; + margin-bottom: 1rem; +} + +.box-simple.box-white p { + color: #999; + margin-bottom: 5px; } + .box-simple.box-dark { - padding: 20px; - border: dotted 1px #999999; - background: #555555; + border: dotted 1px #999; + padding: 15px 20px; + margin-bottom: 0; color: #fff; + background: #555; } + .box-simple.box-dark .icon { - color: #f7f7f7; - border-color: transparent; - font-size: 70px; -} -.box-simple.box-dark h3 { - color: #fff; -} -.box-simple.box-dark h3 a { - color: #fff; + font-size: 2rem; + margin-bottom: 1rem; } + .box-simple.box-dark p { + margin-bottom: 5px; color: #fff; } -.box-image { - position: relative; - overflow: hidden; - text-align: center; - margin: 15px 0; + +.same-height div[class*="col-"] { + margin-bottom: 30px; } -.box-image .bg { - position: absolute; - top: auto; - bottom: 0; - width: 100%; + +.same-height .box-white, .same-height.box-dark { height: 100%; - opacity: 0; - filter: alpha(opacity=0); - background: #c27baa; } -.box-image .name { - position: absolute; - width: 100%; - height: 50%; - bottom: 0; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image .name h3 { - color: #fff; - text-transform: uppercase; - font-size: 18px; - letter-spacing: 0.08em; -} -.box-image .name h3 a { - color: #fff; - text-decoration: none; -} -.box-image .text { - position: absolute; - width: 100%; - height: 50%; - top: 0; - -webkit-transform: translate(0, -150%); - -ms-transform: translate(0, -150%); - -o-transform: translate(0, -150%); - transform: translate(0, -150%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image:hover .bg { - opacity: 0.7; - filter: alpha(opacity=70); -} -.box-image:hover .name { - position: absolute; - -webkit-transform: translate(0, -75%); - -ms-transform: translate(0, -75%); - -o-transform: translate(0, -75%); - transform: translate(0, -75%); -} -.box-image:hover .text { - position: absolute; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); -} -.box-image-text { - position: relative; - overflow: hidden; - text-align: center; - margin: 15px 0; -} -.box-image-text .top { + +.box-image { position: relative; - margin-bottom: 10px; -} -.box-image-text .top .bg { - position: absolute; - top: auto; - bottom: 0; - width: 100%; - height: 100%; - opacity: 0; - filter: alpha(opacity=0); - background: #c27baa; -} -.box-image-text .top .name { - position: absolute; - width: 100%; - height: 50%; - bottom: 0; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image-text .top .name h3 { - color: #fff; - text-transform: uppercase; - font-size: 18px; - letter-spacing: 0.08em; -} -.box-image-text .top .name h3 a { - color: #fff; - text-decoration: none; -} -.box-image-text .top .text { - position: absolute; - width: 100%; - height: 50%; - top: 0; - -webkit-transform: translate(0, -150%); - -ms-transform: translate(0, -150%); - -o-transform: translate(0, -150%); - transform: translate(0, -150%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image-text .content h3, -.box-image-text .content h4 { - text-transform: uppercase; - line-height: 1.5; - color: #555555; - font-weight: 800; - letter-spacing: 0.08em; -} -.box-image-text .content p { - color: #999999; -} -.box-image-text:hover .bg { - opacity: 0.7; - filter: alpha(opacity=70); -} -.box-image-text:hover .name { - position: absolute; - -webkit-transform: translate(0, -75%); - -ms-transform: translate(0, -75%); - -o-transform: translate(0, -75%); - transform: translate(0, -75%); -} -.box-image-text:hover .text { - position: absolute; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); -} -/* universal box */ -.box { - background: #fff; - margin: 0 0 30px; - border: solid 1px #ccc; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - padding: 20px 0; - border-left: none; - border-right: none; -} -.box .box-header { - background: #f7f7f7; - margin: -20px 0 20px; - padding: 20px; - border-bottom: solid 1px #eeeeee; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.box .box-header:before, -.box .box-header:after { - content: " "; - display: table; -} -.box .box-header:after { - clear: both; -} -.box .box-header:before, -.box .box-header:after { - content: " "; - display: table; -} -.box .box-header:after { - clear: both; -} -.box .box-footer { - background: #f7f7f7; - margin: 30px 0 -20px; - padding: 20px; - border-top: solid 1px #eeeeee; -} -.box .box-footer:before, -.box .box-footer:after { - content: " "; - display: table; -} -.box .box-footer:after { - clear: both; + margin: 20px 0; } -.box .box-footer:before, -.box .box-footer:after { - content: " "; - display: table; + +.box-image:hover .overlay { + opacity: 1; } -.box .box-footer:after { - clear: both; + +.box-image:hover h3, .box-image:hover p, .box-image:hover .buttons { + opacity: 1; + -webkit-transform: none; + transform: none; } -@media (max-width: 991px) { - .box .box-footer .btn { - margin-bottom: 20px; - } + +.box-image:hover p { + -webkit-transition-delay: 0.1s; + transition-delay: 0.1s; } -.box.no-border { - border: none; + +.box-image:hover .buttons { + -webkit-transition-delay: 0.2s; + transition-delay: 0.2s; } -#heading-breadcrumbs { - background: url('../img/texture-bw.png') center center repeat; - padding: 20px 0; - margin-bottom: 40px; + +.box-image .name { + margin-bottom: 20px; } -#heading-breadcrumbs.no-mb { - margin-bottom: 0; + +.box-image a { + text-decoration: none !important; } -#heading-breadcrumbs h1 { - color: #333333; + +.box-image h3 { + font-size: 1.125rem; text-transform: uppercase; - font-size: 30px; - font-weight: 700; - letter-spacing: 0.08em; -} -@media (max-width: 991px) { - #heading-breadcrumbs h1 { - text-align: center; - } -} -#heading-breadcrumbs ul.breadcrumb { - margin-top: 5px; - margin-bottom: 0; -} -.bar { - position: relative; - background: #c27baa; - padding: 60px 0; -} -.bar.background-pentagon { - background: url('../img/texture-bw.png') center center repeat; - border-top: solid 1px #999999; - border-bottom: solid 1px #999999; -} -.bar.background-gray { - background: #eeeeee; -} -.bar.background-gray-dark { - background: #555555; -} -.bar.background-white { - background: #fff; -} -.bar.background-image-fixed-1 { - background: url('../img/fixed-background-1.jpg') center top no-repeat; - background-attachment: fixed; - background-size: cover; -} -.bar.background-image-fixed-2 { - background: url('../img/fixed-background-2.jpg') center top no-repeat; - background-attachment: fixed; - background-size: cover; -} -.bar.color-white h1, -.bar.color-white h2, -.bar.color-white h3, -.bar.color-white h4, -.bar.color-white h5, -.bar.color-white h6, -.bar.color-white p { - color: #fff; -} -.bar.padding-big { - padding: 50px 0; -} -.bar.padding-horizontal { - padding-left: 30px; - padding-right: 30px; -} -.bar.margin-vertical { - margin-top: 20px; - margin-bottom: 20px; + letter-spacing: 0.1em; + -webkit-transition: all 0.3s; + transition: all 0.3s; + opacity: 0; + -webkit-transform: translateY(-50px); + transform: translateY(-50px); } -.bar .dark-mask { + +.box-image .overlay { + width: 100%; + height: 100%; position: absolute; top: 0; left: 0; - width: 100%; - height: 100%; - background: #000; - opacity: 0.3; - filter: alpha(opacity=30); -} -.portfolio.no-space { - padding: 0 15px; -} -.portfolio.no-space .box-image { - margin: 0 -15px; -} -.portfolio-project .project-more h4 { - color: #555555; - text-transform: uppercase; - margin-bottom: 0; - text-align: left; - font-size: 14px; - letter-spacing: 0.08em; -} -.portfolio-project .project-more p { - color: #999999; - padding: 10px 0; - margin-bottom: 20px; - text-align: left; -} -.portfolio-showcase { - margin: 15px 0 60px; -} -.portfolio-showcase h3 a { - text-transform: uppercase; - line-height: 1.5; - letter-spacing: 0.08em; + background: rgba(194, 123, 170, 0.6); + padding: 20px; + -webkit-transition: all 0.3s; + transition: all 0.3s; + opacity: 0; } -.portfolio-showcase p.lead { - color: #555555; - margin-bottom: 20px; + +.box-image .buttons { + opacity: 0; + -webkit-transition: all 0.3s; + transition: all 0.3s; + -webkit-transform: translateY(20px); + transform: translateY(20px); +} + +.box-image .buttons a { + margin: 0 3px; +} + +.box-image p { + -webkit-transition: all 0.3s; + transition: all 0.3s; + opacity: 0; + -webkit-transform: translateY(20px); + transform: translateY(20px); } -.portfolio-showcase p { - color: #999999; + +.box-image-text .content { + text-align: center; } -.portfolio-showcase p.buttons { - margin-top: 40px; + +.box-image-text p { + color: #777; + font-size: 0.9rem; } + .see-more { - text-align: center; - margin-top: 20px; - padding-top: 20px; + margin-top: 40px; } + .see-more p { - font-size: 28px; + font-size: 1.8rem; font-weight: 100; - margin-bottom: 20px; -} -.showcase .item { - text-align: center; } -.showcase .item .icon { - display: inline-block; - width: 50px; - height: 50px; - color: #555555; - line-height: 50px; - border-radius: 25px; - border: solid 1px #555555; -} -.showcase .item h4 { - color: #555555; - text-transform: uppercase; - letter-spacing: 0.08em; - line-height: 1.5; - font-size: 16px; -} -.showcase .item h4 span { - font-weight: bold; - font-size: 51px; + +.box { + margin: 80px 0; + border-top: 1px solid #ddd; + border-bottom: 1px solid #ddd; + padding: 20px; } -.packages .package { - background: #fff; + +.box a.btn { margin-top: 25px; - margin-bottom: 20px; - padding-bottom: 15px; - text-align: center; - border: solid 1px #c27baa; - overflow: hidden; -} -.packages .package .package-header { - height: 57px; - color: #fff; - line-height: 57px; - background: #c27baa; -} -.packages .package .package-header h5 { - color: #fff; - text-transform: uppercase; - font-weight: bold; - line-height: 57px; - margin: 0; - letter-spacing: 0.08em; -} -.packages .package .package-header.light-gray { - background: #eeeeee; -} -.packages .package .package-header.light-gray h5 { - color: #555555; -} -.packages .package .price { - line-height: 120px; - height: 100px; - color: #fff; - font-weight: 400; -} -.packages .package .price h4 { - display: inline; - font-size: 50px; - line-height: normal; - margin-bottom: 0; -} -.packages .package .price .period { - line-height: normal; - color: #999999; -} -.packages .package ul { - padding: 0; -} -.packages .package ul li { - list-style-type: none; - padding-top: 10px; - padding-bottom: 10px; - width: 80%; - margin: auto; - border-bottom: 1px dotted #ccc; -} -.packages .package ul li:last-child { - border-bottom: 0; -} -.packages .package ul li i { - font-size: 13px; - margin-right: 5px; -} -.packages .best-value .package { - margin-top: 0; - padding-bottom: 40px; -} -.packages .best-value .package .package-header { - height: 72px; - padding-top: 17px; - height: 82px !important; -} -.packages .best-value .package .package-header h5 { - font-weight: bold; - line-height: 29px; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.packages .best-value .package .package-header .meta-text { - font-size: 13px; - line-height: 15px; -} -#map { - height: 300px; -} -#map.with-border { - border-top: solid 1px #c27baa; - border-bottom: solid 1px #c27baa; -} -#blog-listing-big .post, -#blog-homepage .post { - margin-bottom: 60px; } -#blog-listing-big .post h2, -#blog-homepage .post h2, -#blog-listing-big .post h4, -#blog-homepage .post h4 { - text-transform: uppercase; - letter-spacing: 0.08em; -} -#blog-listing-big .post h2 a, -#blog-homepage .post h2 a, -#blog-listing-big .post h4 a, -#blog-homepage .post h4 a { - color: #555555; -} -#blog-listing-big .post h2 a:hover, -#blog-homepage .post h2 a:hover, -#blog-listing-big .post h4 a:hover, -#blog-homepage .post h4 a:hover { - color: #c27baa; -} -#blog-listing-big .post .author-category, -#blog-homepage .post .author-category { - color: #999999; + +.box .box-header { + background: #f7f7f7; + margin: 20px 0 20px; + padding: 20px; + border-top: 1px solid #eee; text-transform: uppercase; - font-weight: 300; - letter-spacing: 0.08em; -} -#blog-listing-big .post .author-category a, -#blog-homepage .post .author-category a { - font-weight: 500; -} -#blog-listing-big .post .date-comments a, -#blog-homepage .post .date-comments a { - color: #999999; - margin-right: 20px; + letter-spacing: 0.1em; } -#blog-listing-big .post .date-comments a:hover, -#blog-homepage .post .date-comments a:hover { - color: #c27baa; + +.box .box-footer { + background: #f7f7f7; + margin-top: 30px; + padding: 20px; + border-top: 1px solid #eee; } -@media (min-width: 768px) { - #blog-listing-big .post .date-comments, - #blog-homepage .post .date-comments { - text-align: right; - } + +.box.shipping-method, .box.payment-method { + margin: 0; + margin-bottom: 20px; } -#blog-listing-big .post .intro, -#blog-homepage .post .intro { - text-align: left; + +.box.shipping-method h4, .box.payment-method h4 { + text-transform: uppercase; + letter-spacing: 0.1em; + margin-bottom: 5px; } -#blog-listing-big .post .image, -#blog-homepage .post .image { - margin-bottom: 10px; - overflow: hidden; + +.box.shipping-method p, .box.payment-method p { + font-size: 0.9rem; + color: #555; } -#blog-listing-big .post .image img, -#blog-homepage .post .image img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.box-image-text { + margin: 15px 0; } -@media (max-width: 767px) { - #blog-listing-big .post .image img.img-responsive, - #blog-homepage .post .image img.img-responsive { - min-width: 100%; - } + +.box-image-text .image { + position: relative; + margin-bottom: 15px; } -#blog-listing-big .post .video, -#blog-homepage .post .video { - margin-bottom: 10px; + +.box-image-text .overlay { + width: 100%; + height: 100%; + background: rgba(194, 123, 170, 0.6); + position: absolute; + top: 0; + opacity: 0; + -webkit-transition: all 0.5s; + transition: all 0.5s; } -#blog-listing-big .post .read-more, -#blog-homepage .post .read-more { - text-align: right; + +.box-image-text .overlay a { + -webkit-transform: translateY(30px); + transform: translateY(30px); + opacity: 0; } -#blog-listing-medium .post { - margin-bottom: 60px; + +.box-image-text .overlay i { + margin-right: 5px; } -#blog-listing-medium .post h2 { - text-transform: uppercase; - margin: 0 0 10px; - font-size: 24px; - letter-spacing: 0.08em; + +.box-image-text .text { + text-align: center; } -#blog-listing-medium .post h2 a { - color: #555555; + +.box-image-text .text .intro { + text-align: left; + margin-bottom: 20px; + color: #888; + font-size: 0.9rem; } -#blog-listing-medium .post h2 a:hover { - color: #c27baa; + +.box-image-text h4 { + margin: 10px 0; + text-transform: uppercase; + letter-spacing: 0.1em; } -#blog-listing-medium .post .author-category { - float: left; - color: #999999; + +.box-image-text .author-category { + font-size: 0.75rem; + color: #999; text-transform: uppercase; - font-weight: 300; - font-size: 12px; - letter-spacing: 0.08em; + letter-spacing: 0.1em; } -#blog-listing-medium .post .author-category a { + +.box-image-text .author-category a { font-weight: 500; } -#blog-listing-medium .post .date-comments { - float: right; - font-size: 12px; -} -#blog-listing-medium .post .date-comments a { - color: #999999; - margin-right: 20px; -} -#blog-listing-medium .post .date-comments a:hover { - color: #c27baa; -} -@media (min-width: 768px) { - #blog-listing-medium .post .date-comments { - text-align: right; - } -} -#blog-listing-medium .post .intro { - text-align: left; + +.box-image-text:hover .overlay { + opacity: 1; } -#blog-listing-medium .post .clearfix:before, -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:before, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:before, -#blog-listing-medium .post .navbar-header:after { - content: " "; - display: table; -} -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:after { - clear: both; -} -#blog-listing-medium .post .clearfix:before, -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:before, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:before, -#blog-listing-medium .post .navbar-header:after { - content: " "; - display: table; + +.box-image-text:hover .overlay a { + -webkit-transform: none; + transform: none; + opacity: 1; } -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:after { - clear: both; + +.box-footer a { + margin: 0 !important; } -#blog-listing-medium .post .image { - margin-bottom: 10px; - overflow: hidden; + +.box-footer .right-col i { + margin-left: 5px; } -#blog-listing-medium .post .image img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.box-footer .left-col i { + margin-right: 5px; } + @media (max-width: 767px) { - #blog-listing-medium .post .image img.img-responsive { - min-width: 100%; + .box-footer { + -webkit-box-pack: center !important; + -ms-flex-pack: center !important; + justify-content: center !important; + } + .box-footer a { + margin-bottom: 10px !important; } } -#blog-listing-medium .post .video { - margin-bottom: 10px; + +.jumbotron h1, .jumbotron h2 { + letter-spacing: 0.1em; } -#blog-listing-medium .post .read-more { - text-align: right; + +.jumbotron p { + letter-spacing: 0.1em; + font-size: 1.3rem; +} + +.package { + text-align: center; + border: 1px solid #c27baa; + margin-top: 25px; + margin-bottom: 20px; + padding-bottom: 15px; + overflow: hidden; } -.box-image-text.blog .author-category { - color: #999999; + +.package .package-header { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + height: 55px; +} + +.package .package-header h5 { + margin: 0; text-transform: uppercase; - letter-spacing: 0.08em; - font-weight: 300; - font-size: 12px; + letter-spacing: 0.1em; + display: inline-block; + color: #555; } -.box-image-text.blog .author-category a { - font-weight: 500; + +.package .package-header .meta-text { + font-size: 0.8rem; } -.box-image-text.blog .intro { - text-align: left; + +.package h4 { + margin-top: 1rem; + margin-bottom: 0; + color: #333; +} + +.package .price-container { margin-bottom: 20px; } -#blog-homepage .post { - margin-bottom: 30px; + +.package .price-container span.period { + color: #777; + font-size: 0.9rem; + margin-left: 10px; } -#blog-homepage .post h2, -#blog-homepage .post h4, -#blog-homepage .post .author-category, -#blog-homepage .post .read-more { - text-align: center; + +.package ul { + padding: 0 30px; } -#blog-homepage .post .read-more { - margin-top: 20px; + +.package ul li { + padding: 10px; + border-bottom: 1px solid #eee; + color: #555; + font-size: 0.9rem; } -#blog-post #post-content { - margin-bottom: 20px; + +.package ul i { + margin-right: 10px; } -#blog-post .comment { - margin-bottom: 25px; + +.best-value .package { + margin-top: 0; + padding-bottom: 40px; + border: 1px solid #c27baa; } -#blog-post .comment:before, -#blog-post .comment:after { - content: " "; - display: table; + +.best-value .package .package-header { + height: 85px; } -#blog-post .comment:after { - clear: both; + +.best-value .package .package-header h5 { + color: #fff; } -#blog-post .comment:before, -#blog-post .comment:after { - content: " "; - display: table; + +.team-member { + margin-bottom: 40px; } -#blog-post .comment:after { - clear: both; + +.team-member .image { + margin-bottom: 1rem; } -#blog-post .comment .posted { - color: #999999; - font-size: 12px; + +.team-member a { + color: #333; } -#blog-post .comment .reply { - font-family: "Roboto", Helvetica, Arial, sans-serif; + +.team-member a:hover { + color: #333; } -#blog-post .comment.last { + +.team-member h3 { + font-size: 1.125rem; + text-transform: uppercase; + letter-spacing: 0.1em; + margin-bottom: 5px; +} + +.team-member p.role { + font-size: 0.8rem; + text-transform: uppercase; + color: #999; margin-bottom: 0; } -#blog-post #comments, -#blog-post #comment-form { - padding: 20px 0; - margin-top: 20px; - border-top: solid 1px #eeeeee; + +.team-member p { + color: #999; + font-size: 0.8rem; } -#blog-post #comments:before, -#blog-post #comment-form:before, -#blog-post #comments:after, -#blog-post #comment-form:after { - content: " "; - display: table; + +.team-member-detail p:not(.lead) { + color: #555; + font-size: 0.9rem; } -#blog-post #comments:after, -#blog-post #comment-form:after { - clear: both; + +.portfolio p { + color: #fff; } -#blog-post #comments:before, -#blog-post #comment-form:before, -#blog-post #comments:after, -#blog-post #comment-form:after { - content: " "; - display: table; + +.portfolio-project p { + font-size: 0.9rem; + color: #888; } -#blog-post #comments:after, -#blog-post #comment-form:after { - clear: both; + +.portfolio-project .project-more p { + padding: 5px 0; + font-size: 0.85rem; } -#blog-post #comments h4, -#blog-post #comment-form h4 { - margin-bottom: 20px; + +.portfolio-project .project-more h4 { + margin-bottom: 5px; + text-transform: uppercase; + letter-spacing: 0.1em; + font-size: 0.88rem; + color: #555; } -#blog-post #comment-form { - margin-bottom: 20px; + +.portfolio-showcase { + margin-bottom: 60px; +} + +.portfolio-showcase h3 { + text-transform: uppercase; + -webkit-transition-property: 0.1rem; + transition-property: 0.1rem; +} + +.portfolio-showcase .buttons { + margin-top: 40px; +} + +.portfolio-showcase p:not(.lead) { + color: #999; + font-size: 0.9rem; } + +.portfolio-showcase p.lead { + color: #666; +} + .product { - background: #fff; - border-bottom: solid 1px #e6e6e6; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - margin-bottom: 60px; - overflow: hidden; text-align: center; + position: relative; + margin-bottom: 40px; } + .product .image { overflow: hidden; + max-height: 190px; } -.product .image img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -@media (max-width: 767px) { - .product .image img.img-responsive { - min-width: 100%; - } + +.product .image a { + margin: 0; } + .product .text { padding: 10px; + border-bottom: 1px solid #ddd; } + .product .text h3 { - font-size: 14px; - font-weight: 700; - height: 39.6px; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.product .text h3 a { - color: #555555; -} -.product .text h3 a:hover { - text-decoration: none; + min-height: 63px; } -.product .text p.price { - font-size: 18px; + +.product .price { + font-size: 1.1rem; } -.product .text p.price del { - color: #999999; + +.product .price del { + color: #999; + display: inline-block; + margin-right: 5px; } -.product .buttons { - clear: both; - position: absolute; - display: none; - bottom: 0; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - width: 100%; - border: solid 1px transparent; - padding: 20px; - background: rgba(255, 255, 255, 0.9); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - text-align: center; + +.product img { + -webkit-transition: all 0.3s; + transition: all 0.3s; } -.product .buttons .btn { - margin-bottom: 20px; + +.product:hover img { + -webkit-transform: scale(1.1); + transform: scale(1.1); } -.product:hover { - border-bottom: solid 1px #808080; - top: 0; + +.product:hover .text { + border-color: #555; } -.product:hover .buttons { - clear: both; - position: absolute; - top: 0; - background: rgba(255, 255, 255, 0.5); + +.product a { + text-transform: uppercase; + letter-spacing: 0.1em; + color: #333; + text-decoration: none !important; + margin-top: 15px; } -.product:hover .image img { - -webkit-transform: scale(1.1, 1.1); - -ms-transform: scale(1.1, 1.1); - -o-transform: scale(1.1, 1.1); - transform: scale(1.1, 1.1); + +.products-big .image { + min-height: 250px; + max-height: 250px; } + .goToDescription { - font-size: 12px; text-align: center; + font-size: 0.8rem; margin-bottom: 40px; } + .goToDescription a { - color: #999999; + color: #999; text-decoration: underline; } -#productMain { - margin-bottom: 30px; + +table tr td { + vertical-align: middle !important; +} + +#customer-orders a.btn { + margin-top: 0; +} + +#customer-orders table { + font-size: 0.9rem; +} + +#customer-orders th { + border-top: 0; +} + +#customer-order img { + width: 50px; +} + +#customer-order tfoot th { + font-size: 1.2rem; + font-weight: 300; +} + +#customer-order p { + font-size: 1.2rem; + font-weight: 300; +} + +#productMain #thumbs { + margin-top: 30px; +} + +#productMain input { + display: none; } + #productMain .sizes { text-align: center; } -#productMain .sizes h3 { - font-weight: 700; - letter-spacing: 0.08em; - text-transform: uppercase; - margin-bottom: 40px; -} + #productMain .sizes a { - display: inline-block; - width: 40px; - height: 40px; - border-radius: 40px; - background: #ccc; - line-height: 40px; - color: #555555; - text-align: center; - text-decoration: none; - font-family: "Roboto", Helvetica, Arial, sans-serif; + text-decoration: none !important; } -#productMain .sizes a.active, + #productMain .sizes a:hover { background: #c27baa; color: #fff; } -#productMain .sizes input { - display: none; -} + #productMain .price { - font-size: 40px; text-align: center; - margin-top: 40px; - margin-bottom: 40px; + font-size: 2.5rem; + margin: 30px 0; + color: #555; } -#thumbs a { - display: block; - border: solid 1px transparent; + +#basket thead th { + border-top: none; } -#thumbs a.active { - border-color: #c27baa; + +#basket tfoot th { + font-size: 1.25rem; + color: #555; } -#product-social { - text-align: center; + +#order-summary tr td { + color: #999; } -#product-social h4 { - font-weight: 300; + +#order-summary tr.total { + font-size: 1.25rem; + color: #555; + font-weight: 700; +} + +#order-summary tr.total td { + color: #555; +} + +#checkout .nav-pills { + margin-bottom: 30px; + border-bottom: 1px solid #c27baa; +} + +#checkout .nav-pills a { + font-size: 0.9rem; + border-bottom: none !important; +} + +#checkout .nav-pills a.disabled { + cursor: not-allowed; +} + +#checkout form label { + margin-bottom: 5px; +} + +#checkout .payment-method:hover, #checkout .shipping-method:hover { + cursor: pointer; +} + +@media (max-width: 767px) { + .nav-pills { + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + } +} + +.sidebar-menu .badge { + font-weight: 700; + margin: 0; +} + +.sidebar-menu.with-icons a.nav-link { + position: relative; +} + +.sidebar-menu.with-icons a.nav-link::before { + content: '\f105'; + display: inline-block; + position: absolute; + top: 50%; + right: 15px; + -webkit-transform: translateY(-50%); + transform: translateY(-50%); + font-family: 'FontAwesome'; +} + +.panel-heading { margin-bottom: 10px; } -#product-social p { - line-height: 26px; + +.panel-heading h3 { + margin-top: 5px; } -#product-social p a { - margin: 0 10px 0 0; + +.panel-heading .btn { color: #fff; + text-decoration: none !important; +} + +.panel-heading .btn i { + margin-right: 7px; +} + +.panel-body p { + font-size: .9rem; + color: #555; +} + +.panel-body label { + font-size: 0.8rem; + font-weight: 400 !important; + color: #777; + opacity: 0.9; display: inline-block; - width: 26px; - height: 26px; - border-radius: 13px; - line-height: 26px; - font-size: 15px; - text-align: center; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - vertical-align: bottom; + cursor: pointer; } -#product-social p a i { - vertical-align: bottom; - line-height: 26px; + +.panel-body label input { + margin-right: 5px; } -#product-social p a.facebook { - background-color: #4460ae; + +.panel-body label:hover { + opacity: 1; } -#product-social p a.gplus { - background-color: #c21f25; + +.panel-body span.colour { + display: inline-block; + width: 14px; + height: 14px; + margin-top: 10px; + margin-left: 5px; + border: 1px solid #555; } -#product-social p a.twitter { - background-color: #3cf; + +.panel-body span.colour.white { + background: #fff; } -#product-social p a.instagram { - background-color: #cd4378; + +.panel-body span.colour.blue { + background: #007bff; } -#product-social p a.email { - background-color: #4a7f45; + +.panel-body span.colour.green { + background: #28a745; } -@media (max-width: 991px) { - #product-social { - text-align: center; - } + +.panel-body span.colour.red { + background: #dc3545; } -#checkout .nav { - margin-bottom: 20px; - border-bottom: solid 1px #c27baa; + +.panel-body span.colour.yellow { + background: #ffc107; } -#checkout .nav li { - height: 100%; + +.nav-pills .nav-link { + border-radius: 0; } -#checkout .nav li a { - display: block; - height: 100%; + +.nav-pills .nav-link:hover { + background: #eee; } -#order-summary table { - margin-top: 20px; + +.nav-pills .nav-link.active { + background: #c27baa; } -#order-summary table td { - color: #999999; + +.panel { + margin-bottom: 20px; } -#order-summary table tr.total td, -#order-summary table tr.total th { - font-size: 18px; - color: #555555; + +.category-menu a.nav-link { + text-transform: uppercase; + letter-spacing: 0.1em; font-weight: 700; } -#checkout .table tbody tr td, -#basket .table tbody tr td, -#customer-order .table tbody tr td { - vertical-align: middle; + +ul ul a.nav-link { + padding-left: 30px !important; + font-size: 0.85rem; + text-transform: none !important; + font-weight: 400 !important; + color: #777; } -#checkout .table tbody tr td input, -#basket .table tbody tr td input, -#customer-order .table tbody tr td input { - width: 50px; - text-align: right; + +.tag-cloud a { + font-size: 0.8rem; + border: 1px solid #eee; + text-transform: uppercase; + letter-spacing: 0.1em; + font-weight: 600; + padding: 5px 10px; + text-transform: uppercase; + margin: 3px 0; + text-decoration: none !important; } -#checkout .table tbody tr td img, -#basket .table tbody tr td img, -#customer-order .table tbody tr td img { - width: 50px; + +.tag-cloud a:hover { + border-color: #c27baa; } -#checkout .table tfoot, -#basket .table tfoot, -#customer-order .table tfoot { - font-size: 18px; + +.tag-cloud i { + margin-right: 5px; } -.shipping-method h4, -.payment-method h4 { + +.ribbon { + width: 80px; + height: 32px; + line-height: 32px; + background: #c27baa; + color: #fff; text-transform: uppercase; - letter-spacing: 0.08em; + letter-spacing: 0.1em; + font-weight: 700; + font-size: 0.9rem; + margin-bottom: 20px; + position: absolute; + top: 30px; + left: -15px; + text-align: center; } -#customer-orders table tr th, -#customer-orders table tr td { - vertical-align: baseline; + +.ribbon.sale { + background: #c27baa; } -#customer-order .table tfoot th { - font-size: 18px; - font-weight: 300; + +.ribbon.new { + background: #5bc0de; } -#customer-order .addresses { - text-align: right; - margin-bottom: 30px; + +.ribbon.new::after { + content: ''; + border-top: 15px solid #1f7e9a; } -#customer-order .addresses p { - font-size: 18px; - font-weight: 300; + +.ribbon.sold { + background: #f0ad4e; } -#customer-account { - margin-bottom: 30px; + +.ribbon.sold::after { + content: ''; + border-top: 15px solid #b06d0f; } -#get-it { - background: #c27baa; - padding: 50px 0 30px; - color: #fff; - text-align: center; + +.ribbon.gift { + background: #5cb85c; +} + +.ribbon.gift::after { + content: ''; + border-top: 15px solid #2d672d; +} + +.ribbon:nth-of-type(2) { + top: 82px; +} + +.ribbon::after { + content: ''; + border-top: 15px solid #9a477e; + border-left: 15px solid transparent; + border-right: 0 solid transparent; + position: absolute; + bottom: -15px; + left: 0; + display: block; } -#get-it h1, -#get-it h2, -#get-it h3, -#get-it h4, -#get-it h5, -#get-it h6 { - color: #fff; + +.badge { + font-weight: 400; text-transform: uppercase; - letter-spacing: 0.08em; - margin: 0 0 20px; + letter-spacing: 0.1em; + padding: 3px 5px; } -#get-it p { - margin: 0 0 20px; + +#map { + border-top: 1px solid #c27baa; + border-bottom: 1px solid #c27baa; + height: 300px; } -#footer { - background: #555555; + +.get-it { + background: #c27baa; + color: #fff; padding: 50px 0; - color: #999999; -} -#footer h1, -#footer h2, -#footer h3, -#footer h4, -#footer h5, -#footer h6 { - color: #eeeeee; -} -#footer h4 { - font-size: 14px; - font-weight: 800; - text-transform: uppercase; - letter-spacing: 0.08em; } -#footer ul { - padding-left: 0; - list-style: none; -} -#footer ul a { - color: #999999; + +.get-it h3 { + text-transform: uppercase; + letter-spacing: 0.1em; + margin: 0; } -#footer ul a:hover { - color: #c27baa; - text-decoration: none; + +footer.main-footer { + padding: 60px 0; + padding-bottom: 0; + background: #555; + color: #fff; } -#footer .photostream div { - float: left; - display: block; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - width: 33%; - padding: 7.5px; - overflow: hidden; + +footer.main-footer a { + color: inherit; + color: #eee; } -#footer .photostream div a { - border: solid 1 px #eeeeee; + +footer.main-footer h4 { + color: #eee; + margin: 10px 0; + text-transform: uppercase; + letter-spacing: 0.1em; } -#footer .photostream div img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +footer.main-footer p { + font-size: 0.9rem; + color: #aaa; } -#footer .photostream div:hover img { - -webkit-transform: scale(1.1, 1.1); - -ms-transform: scale(1.1, 1.1); - -o-transform: scale(1.1, 1.1); - transform: scale(1.1, 1.1); + +footer.main-footer hr { + border: none; + border-top: 1px solid #ddd; + background: none; } -#footer .blog-entries .item { - clear: both; - padding: 5px 0; - margin-bottom: 10px; - border-bottom: solid 1px #555555; + +footer.main-footer .footer-blog-list li { + margin-bottom: 20px; } -#footer .blog-entries .item .image { - float: left; - width: 15%; + +footer.main-footer .image { + width: 40px; + height: 40px; margin-right: 10px; + -ms-flex-negative: 0; + flex-shrink: 0; } -#footer .blog-entries .item .name { - width: 75%; - margin-left: 10px; - display: table-cell; - vertical-align: middle; -} -#footer .blog-entries .item .name h5 { - margin: 0; + +footer.main-footer .text { text-transform: uppercase; - letter-spacing: 0.08em; - font-size: 12px; -} -#footer .blog-entries .item .name h5 a { - color: #eeeeee; -} -#footer .blog-entries .item .text { - width: 100%; - clear: both; + letter-spacing: 0.1em; } -#footer .blog-entries .item:last-child { - border-bottom: none; - margin-bottom: 0; + +footer.main-footer .text a { + font-size: 0.8rem; } -#footer .social a { - color: #555555; - font-size: 25px; - margin: 0 10px 0 0; + +footer.main-footer .photo-stream li { + margin: 0; } -#footer .social a:hover { - color: #c27baa; + +footer.main-footer .photo-stream a { + width: 80px; + height: 80px; + padding: 5px; + display: block; } -#copyright { + +footer.main-footer .copyrights { + padding: 50px 0; background: #333; color: #ccc; - padding: 50px 0; - font-size: 12px; - line-height: 28px; + margin-top: 50px; } -#copyright p { - margin: 0; + +footer.main-footer .copyrights a { + color: #c27baa; +} + +footer.main-footer .copyrights p { + color: inherit; + font-size: 0.8rem; + margin-bottom: 0; } + @media (max-width: 991px) { - #copyright p { - float: none !important; - text-align: center; - margin-bottom: 10px; + footer.main-footer .photo-stream a { + width: 120px; + height: 120px; } } -[data-animate] { - opacity: 0; - filter: alpha(opacity=0); + +@media (max-width: 767px) { + footer.main-footer .photo-stream li { + width: 32%; + margin-bottom: 10px; + } + footer.main-footer .photo-stream a { + width: 100%; + height: auto; + } } + +/* + +===================== +STYLE SWITCHER FOR DEMO +===================== + +*/ #style-switch-button { position: fixed; - top: 100px; + top: 120px; left: 0px; border-radius: 0; + z-index: 2; } + #style-switch { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; width: 300px; padding: 20px; position: fixed; - top: 140px; + top: 160px; left: 0; background: #fff; - border: solid 1px #eeeeee; + border: solid 1px #ced4da; + z-index: 2000; } -@media (max-width: 991px) { - #style-switch-button { - display: none; - } - #style-switch { - display: none; - } + +#style-switch h4 { + color: #495057; } -/* Original Boostrap template overwrite */ -/* breadcrumbs */ -.breadcrumb { - font-family: "Roboto", Helvetica, Arial, sans-serif; - text-transform: uppercase; - background-color: none; - letter-spacing: 0.08em; + +/* + * 1. NAVBAR + */ +.navbar { + padding: 0.5rem 1rem; } -/* nav */ -.nav > li > a { - padding: 10px 15px; + +.navbar-brand { + display: inline-block; + padding-top: 0.3125rem; + padding-bottom: 0.3125rem; + margin-right: 1rem; + font-size: 1.25rem; +} + +.navbar-toggler { + padding: 0.25rem 0.75rem; + font-size: 1.25rem; + line-height: 1; + border: 1px solid transparent; + border-radius: 0; } -.nav > li > a:hover, -.nav > li > a:focus { - background-color: #eeeeee; + +.navbar-light .navbar-brand { + color: rgba(0, 0, 0, 0.9); } -.nav > li.disabled > a { - color: #999999; + +.navbar-light .navbar-brand:focus, .navbar-light .navbar-brand:hover { + color: rgba(0, 0, 0, 0.9); } -.nav > li.disabled > a:hover, -.nav > li.disabled > a:focus { - color: #999999; + +.navbar-light .navbar-nav .nav-link { + color: rgba(0, 0, 0, 0.5); } -.nav .open > a, -.nav .open > a:hover, -.nav .open > a:focus { - background-color: #eeeeee; - border-color: #c27baa; + +.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover { + color: rgba(0, 0, 0, 0.7); } -.nav-tabs { - border-bottom: 1px solid #c27baa; + +.navbar-light .navbar-nav .nav-link.disabled { + color: rgba(0, 0, 0, 0.3); } -.nav-tabs > li { - float: left; - margin-bottom: -1px; + +.navbar-light .navbar-nav .show > .nav-link, +.navbar-light .navbar-nav .active > .nav-link, +.navbar-light .navbar-nav .nav-link.show, +.navbar-light .navbar-nav .nav-link.active { + color: rgba(0, 0, 0, 0.9); } -.nav-tabs > li > a { - margin-right: 2px; - line-height: 1.42857143; - border: 1px solid transparent; - border-radius: 0 0 0 0; + +.navbar-light .navbar-toggler { + color: rgba(0, 0, 0, 0.5); + border-color: rgba(0, 0, 0, 0.1); } -.nav-tabs > li > a:hover { - border-color: #eeeeee #eeeeee #c27baa; + +.navbar-light .navbar-toggler-icon { + background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); } -.nav-tabs > li.active > a, -.nav-tabs > li.active > a:hover, -.nav-tabs > li.active > a:focus { - color: #555555; - background-color: #ffffff; - border: 1px solid #c27baa; - border-bottom-color: transparent; - cursor: default; + +.navbar-light .navbar-text { + color: rgba(0, 0, 0, 0.5); } -.nav-tabs.nav-justified { - width: 100%; - border-bottom: solid 1px #c27baa; - border-bottom: 0; + +.navbar-dark .navbar-brand { + color: #fff; } -.nav-tabs.nav-justified > li { - float: none; + +.navbar-dark .navbar-brand:focus, .navbar-dark .navbar-brand:hover { + color: #fff; } -.nav-tabs.nav-justified > li > a { - text-align: center; - /*margin-bottom: 5px;*/ + +.navbar-dark .navbar-nav .nav-link { + color: rgba(255, 255, 255, 0.5); } -.nav-tabs.nav-justified > .dropdown .dropdown-menu { - top: auto; - left: auto; + +.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover { + color: rgba(255, 255, 255, 0.75); } -.nav-tabs.nav-justified > li > a { - margin-right: 0; - border-radius: 0; + +.navbar-dark .navbar-nav .nav-link.disabled { + color: rgba(255, 255, 255, 0.25); } -.nav-tabs.nav-justified > .active > a, -.nav-tabs.nav-justified > .active > a:hover, -.nav-tabs.nav-justified > .active > a:focus { - border: 1px solid #c27baa; + +.navbar-dark .navbar-nav .show > .nav-link, +.navbar-dark .navbar-nav .active > .nav-link, +.navbar-dark .navbar-nav .nav-link.show, +.navbar-dark .navbar-nav .nav-link.active { + color: #fff; } -@media (min-width: 768px) { - .nav-tabs.nav-justified > li > a { - border-bottom: 1px solid #c27baa; - border-radius: 0 0 0 0; - } - .nav-tabs.nav-justified > .active > a, - .nav-tabs.nav-justified > .active > a:hover, - .nav-tabs.nav-justified > .active > a:focus { - border-bottom-color: #ffffff; - } + +.navbar-dark .navbar-toggler { + color: rgba(255, 255, 255, 0.5); + border-color: rgba(255, 255, 255, 0.1); } -.nav-pills > li { - float: left; + +.navbar-dark .navbar-toggler-icon { + background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); } -.nav-pills > li > a { + +.navbar-dark .navbar-text { + color: rgba(255, 255, 255, 0.5); +} + +/* + * 2. BUTTONS + */ +.btn { + font-weight: 700; + border: 1px solid transparent; + padding: 0.5rem 0.75rem; + font-size: 0.8rem; + line-height: 1.5; border-radius: 0; + -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; } -.nav-pills > li + li { - margin-left: 2px; + +.btn:focus, .btn.focus { + outline: 0; + -webkit-box-shadow: 0 0 0 0.2rem rgba(194, 123, 170, 0.25); + box-shadow: 0 0 0 0.2rem rgba(194, 123, 170, 0.25); +} + +.btn.disabled, .btn:disabled { + opacity: .65; +} + +.btn:not([disabled]):not(.disabled):active, .btn:not([disabled]):not(.disabled).active { + background-image: none; } -.nav-pills > li.active > a, -.nav-pills > li.active > a:hover, -.nav-pills > li.active > a:focus { - color: #ffffff; + +.btn-primary { + color: color-yiq(#c27baa); background-color: #c27baa; + border-color: #c27baa; } -.nav-stacked > li { - float: none; + +.btn-primary:hover { + color: color-yiq(#b66199); + background-color: #b25894; + border-color: #b25894; } -.nav-stacked > li + li { - margin-top: 2px; - margin-left: 0; + +.btn-primary:focus, .btn-primary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(194, 123, 170, 0.5); + box-shadow: 0 0 0 0.2rem rgba(194, 123, 170, 0.5); } -.nav-justified { - width: 100%; - border-bottom: solid 1px #c27baa; + +.btn-primary.disabled, .btn-primary:disabled { + color: color-yiq(#c27baa); + background-color: #c27baa; + border-color: #c27baa; } -.nav-justified > li { - float: none; + +.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active, +.show > .btn-primary.dropdown-toggle { + color: color-yiq(#b25894); + background-color: #b25894; + border-color: #ad508e; +} + +.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, +.show > .btn-primary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(194, 123, 170, 0.5); + box-shadow: 0 0 0 0.2rem rgba(194, 123, 170, 0.5); +} + +.btn-secondary { + color: color-yiq(#868e96); + background-color: #868e96; + border-color: #868e96; +} + +.btn-secondary:hover { + color: color-yiq(#727b84); + background-color: #6c757d; + border-color: #6c757d; +} + +.btn-secondary:focus, .btn-secondary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); +} + +.btn-secondary.disabled, .btn-secondary:disabled { + color: color-yiq(#868e96); + background-color: #868e96; + border-color: #868e96; +} + +.btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active, +.show > .btn-secondary.dropdown-toggle { + color: color-yiq(#6c757d); + background-color: #6c757d; + border-color: #666e76; +} + +.btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus, +.show > .btn-secondary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); +} + +.btn-success { + color: color-yiq(#28a745); + background-color: #28a745; + border-color: #28a745; +} + +.btn-success:hover { + color: color-yiq(#218838); + background-color: #1e7e34; + border-color: #1e7e34; +} + +.btn-success:focus, .btn-success.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); +} + +.btn-success.disabled, .btn-success:disabled { + color: color-yiq(#28a745); + background-color: #28a745; + border-color: #28a745; +} + +.btn-success:not(:disabled):not(.disabled):active, .btn-success:not(:disabled):not(.disabled).active, +.show > .btn-success.dropdown-toggle { + color: color-yiq(#1e7e34); + background-color: #1e7e34; + border-color: #1c7430; +} + +.btn-success:not(:disabled):not(.disabled):active:focus, .btn-success:not(:disabled):not(.disabled).active:focus, +.show > .btn-success.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); +} + +.btn-info { + color: color-yiq(#17a2b8); + background-color: #17a2b8; + border-color: #17a2b8; +} + +.btn-info:hover { + color: color-yiq(#138496); + background-color: #117a8b; + border-color: #117a8b; +} + +.btn-info:focus, .btn-info.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); +} + +.btn-info.disabled, .btn-info:disabled { + color: color-yiq(#17a2b8); + background-color: #17a2b8; + border-color: #17a2b8; +} + +.btn-info:not(:disabled):not(.disabled):active, .btn-info:not(:disabled):not(.disabled).active, +.show > .btn-info.dropdown-toggle { + color: color-yiq(#117a8b); + background-color: #117a8b; + border-color: #10707f; +} + +.btn-info:not(:disabled):not(.disabled):active:focus, .btn-info:not(:disabled):not(.disabled).active:focus, +.show > .btn-info.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); +} + +.btn-warning { + color: color-yiq(#ffc107); + background-color: #ffc107; + border-color: #ffc107; +} + +.btn-warning:hover { + color: color-yiq(#e0a800); + background-color: #d39e00; + border-color: #d39e00; +} + +.btn-warning:focus, .btn-warning.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-warning.disabled, .btn-warning:disabled { + color: color-yiq(#ffc107); + background-color: #ffc107; + border-color: #ffc107; +} + +.btn-warning:not(:disabled):not(.disabled):active, .btn-warning:not(:disabled):not(.disabled).active, +.show > .btn-warning.dropdown-toggle { + color: color-yiq(#d39e00); + background-color: #d39e00; + border-color: #c69500; +} + +.btn-warning:not(:disabled):not(.disabled):active:focus, .btn-warning:not(:disabled):not(.disabled).active:focus, +.show > .btn-warning.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-danger { + color: color-yiq(#dc3545); + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-danger:hover { + color: color-yiq(#c82333); + background-color: #bd2130; + border-color: #bd2130; +} + +.btn-danger:focus, .btn-danger.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-danger.disabled, .btn-danger:disabled { + color: color-yiq(#dc3545); + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-danger:not(:disabled):not(.disabled):active, .btn-danger:not(:disabled):not(.disabled).active, +.show > .btn-danger.dropdown-toggle { + color: color-yiq(#bd2130); + background-color: #bd2130; + border-color: #b21f2d; +} + +.btn-danger:not(:disabled):not(.disabled):active:focus, .btn-danger:not(:disabled):not(.disabled).active:focus, +.show > .btn-danger.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-light { + color: color-yiq(#f8f9fa); + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-light:hover { + color: color-yiq(#e2e6ea); + background-color: #dae0e5; + border-color: #dae0e5; +} + +.btn-light:focus, .btn-light.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-light.disabled, .btn-light:disabled { + color: color-yiq(#f8f9fa); + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-light:not(:disabled):not(.disabled):active, .btn-light:not(:disabled):not(.disabled).active, +.show > .btn-light.dropdown-toggle { + color: color-yiq(#dae0e5); + background-color: #dae0e5; + border-color: #d3d9df; +} + +.btn-light:not(:disabled):not(.disabled):active:focus, .btn-light:not(:disabled):not(.disabled).active:focus, +.show > .btn-light.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-dark { + color: color-yiq(#343a40); + background-color: #343a40; + border-color: #343a40; +} + +.btn-dark:hover { + color: color-yiq(#23272b); + background-color: #1d2124; + border-color: #1d2124; +} + +.btn-dark:focus, .btn-dark.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-dark.disabled, .btn-dark:disabled { + color: color-yiq(#343a40); + background-color: #343a40; + border-color: #343a40; +} + +.btn-dark:not(:disabled):not(.disabled):active, .btn-dark:not(:disabled):not(.disabled).active, +.show > .btn-dark.dropdown-toggle { + color: color-yiq(#1d2124); + background-color: #1d2124; + border-color: #171a1d; +} + +.btn-dark:not(:disabled):not(.disabled):active:focus, .btn-dark:not(:disabled):not(.disabled).active:focus, +.show > .btn-dark.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-default { + color: color-yiq(#ced4da); + background-color: #ced4da; + border-color: #ced4da; +} + +.btn-default:hover { + color: color-yiq(#b8c1ca); + background-color: #b1bbc4; + border-color: #b1bbc4; +} + +.btn-default:focus, .btn-default.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); + box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); +} + +.btn-default.disabled, .btn-default:disabled { + color: color-yiq(#ced4da); + background-color: #ced4da; + border-color: #ced4da; +} + +.btn-default:not(:disabled):not(.disabled):active, .btn-default:not(:disabled):not(.disabled).active, +.show > .btn-default.dropdown-toggle { + color: color-yiq(#b1bbc4); + background-color: #b1bbc4; + border-color: #aab4bf; +} + +.btn-default:not(:disabled):not(.disabled):active:focus, .btn-default:not(:disabled):not(.disabled).active:focus, +.show > .btn-default.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); + box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); +} + +.btn-outline-primary { + color: #c27baa; + background-color: transparent; + background-image: none; + border-color: #c27baa; } -.nav-justified > li > a { - text-align: center; - /*margin-bottom: 5px;*/ + +.btn-outline-primary:hover { + color: #fff; + background-color: #c27baa; + border-color: #c27baa; } -.nav-justified > .dropdown .dropdown-menu { - top: auto; - left: auto; + +.btn-outline-primary:focus, .btn-outline-primary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(194, 123, 170, 0.5); + box-shadow: 0 0 0 0.2rem rgba(194, 123, 170, 0.5); } -.nav-tabs-justified { - border-bottom: 0; + +.btn-outline-primary.disabled, .btn-outline-primary:disabled { + color: #c27baa; + background-color: transparent; } -.nav-tabs-justified > li > a { - margin-right: 0; - border-radius: 0; + +.btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active, +.show > .btn-outline-primary.dropdown-toggle { + color: color-yiq(#c27baa); + background-color: #c27baa; + border-color: #c27baa; } -.nav-tabs-justified > .active > a, -.nav-tabs-justified > .active > a:hover, -.nav-tabs-justified > .active > a:focus { - border: 1px solid #c27baa; + +.btn-outline-primary:not(:disabled):not(.disabled):active:focus, .btn-outline-primary:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-primary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(194, 123, 170, 0.5); + box-shadow: 0 0 0 0.2rem rgba(194, 123, 170, 0.5); } -@media (min-width: 768px) { - .nav-tabs-justified > li > a { - border-bottom: 1px solid #c27baa; - border-radius: 0 0 0 0; - } - .nav-tabs-justified > .active > a, - .nav-tabs-justified > .active > a:hover, - .nav-tabs-justified > .active > a:focus { - border-bottom-color: #ffffff; - } + +.btn-outline-secondary { + color: #868e96; + background-color: transparent; + background-image: none; + border-color: #868e96; } -.tab-content { - padding: 15px; - border: solid 1px #ddd; - border-top: none; + +.btn-outline-secondary:hover { + color: #fff; + background-color: #868e96; + border-color: #868e96; } -/* navbar */ -.navbar { - position: relative; - min-height: 62px; - margin-bottom: 0; - border-bottom: 1px solid transparent; + +.btn-outline-secondary:focus, .btn-outline-secondary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); } -@media (min-width: 768px) { - .navbar { - border-radius: 0px; - } + +.btn-outline-secondary.disabled, .btn-outline-secondary:disabled { + color: #868e96; + background-color: transparent; } -@media (min-width: 768px) { - .navbar-header { - float: left; - } + +.btn-outline-secondary:not(:disabled):not(.disabled):active, .btn-outline-secondary:not(:disabled):not(.disabled).active, +.show > .btn-outline-secondary.dropdown-toggle { + color: color-yiq(#868e96); + background-color: #868e96; + border-color: #868e96; +} + +.btn-outline-secondary:not(:disabled):not(.disabled):active:focus, .btn-outline-secondary:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-secondary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); +} + +.btn-outline-success { + color: #28a745; + background-color: transparent; + background-image: none; + border-color: #28a745; } -.navbar-collapse { - overflow-x: visible; - padding-right: 15px; - padding-left: 15px; + +.btn-outline-success:hover { + color: #fff; + background-color: #28a745; + border-color: #28a745; } -.navbar-collapse.in { - overflow-y: auto; + +.btn-outline-success:focus, .btn-outline-success.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); } -@media (min-width: 768px) { - .navbar-collapse { - width: auto; - border-top: 0; - box-shadow: none; - } - .navbar-collapse.collapse { - display: block !important; - height: auto !important; - padding-bottom: 0; - overflow: visible !important; - } - .navbar-collapse.in { - overflow-y: visible; - } - .navbar-fixed-top .navbar-collapse, - .navbar-static-top .navbar-collapse, - .navbar-fixed-bottom .navbar-collapse { - padding-left: 0; - padding-right: 0; - } + +.btn-outline-success.disabled, .btn-outline-success:disabled { + color: #28a745; + background-color: transparent; } -.navbar-fixed-top .navbar-collapse, -.navbar-affixed-top .navbar-collapse, -.navbar-fixed-bottom .navbar-collapse { - max-height: 340px; + +.btn-outline-success:not(:disabled):not(.disabled):active, .btn-outline-success:not(:disabled):not(.disabled).active, +.show > .btn-outline-success.dropdown-toggle { + color: color-yiq(#28a745); + background-color: #28a745; + border-color: #28a745; +} + +.btn-outline-success:not(:disabled):not(.disabled):active:focus, .btn-outline-success:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-success.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); +} + +.btn-outline-info { + color: #17a2b8; + background-color: transparent; + background-image: none; + border-color: #17a2b8; } -@media (max-width: 480px) and (orientation: landscape) { - .navbar-fixed-top .navbar-collapse, - .navbar-affixed-top .navbar-collapse, - .navbar-fixed-bottom .navbar-collapse { - max-height: 200px; - } + +.btn-outline-info:hover { + color: #fff; + background-color: #17a2b8; + border-color: #17a2b8; } -.container > .navbar-header, -.container-fluid > .navbar-header, -.container > .navbar-collapse, -.container-fluid > .navbar-collapse { - margin-right: -15px; - margin-left: -15px; -} -@media (min-width: 768px) { - .container > .navbar-header, - .container-fluid > .navbar-header, - .container > .navbar-collapse, - .container-fluid > .navbar-collapse { - margin-right: 0; - margin-left: 0; - } + +.btn-outline-info:focus, .btn-outline-info.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); } -.navbar-static-top { - z-index: 1000; - border-width: 0 0 1px; + +.btn-outline-info.disabled, .btn-outline-info:disabled { + color: #17a2b8; + background-color: transparent; } -@media (min-width: 768px) { - .navbar-static-top { - border-radius: 0; - } + +.btn-outline-info:not(:disabled):not(.disabled):active, .btn-outline-info:not(:disabled):not(.disabled).active, +.show > .btn-outline-info.dropdown-toggle { + color: color-yiq(#17a2b8); + background-color: #17a2b8; + border-color: #17a2b8; +} + +.btn-outline-info:not(:disabled):not(.disabled):active:focus, .btn-outline-info:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-info.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); +} + +.btn-outline-warning { + color: #ffc107; + background-color: transparent; + background-image: none; + border-color: #ffc107; } -.navbar-fixed-top, -.navbar-fixed-bottom { - position: fixed; - right: 0; - left: 0; - z-index: 1030; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); -} -@media (min-width: 768px) { - .navbar-fixed-top, - .navbar-fixed-bottom { - border-radius: 0; - } + +.btn-outline-warning:hover { + color: #fff; + background-color: #ffc107; + border-color: #ffc107; } -.navbar-fixed-top { - top: 0; - border-width: 0 0 1px; + +.btn-outline-warning:focus, .btn-outline-warning.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); } -.navbar-fixed-bottom { - bottom: 0; - margin-bottom: 0; - border-width: 1px 0 0; + +.btn-outline-warning.disabled, .btn-outline-warning:disabled { + color: #ffc107; + background-color: transparent; } -.navbar-brand { - float: left; - padding: 10px 15px; - font-size: 18px; - line-height: 20px; - height: 62px; + +.btn-outline-warning:not(:disabled):not(.disabled):active, .btn-outline-warning:not(:disabled):not(.disabled).active, +.show > .btn-outline-warning.dropdown-toggle { + color: color-yiq(#ffc107); + background-color: #ffc107; + border-color: #ffc107; +} + +.btn-outline-warning:not(:disabled):not(.disabled):active:focus, .btn-outline-warning:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-warning.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-outline-danger { + color: #dc3545; + background-color: transparent; + background-image: none; + border-color: #dc3545; } -.navbar-brand:hover, -.navbar-brand:focus { - text-decoration: none; + +.btn-outline-danger:hover { + color: #fff; + background-color: #dc3545; + border-color: #dc3545; } -@media (min-width: 768px) { - .navbar > .container .navbar-brand, - .navbar > .container-fluid .navbar-brand { - margin-left: -15px; - } + +.btn-outline-danger:focus, .btn-outline-danger.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); } -.navbar-toggle { - position: relative; - float: right; - margin-right: 15px; - padding: 9px 10px; - margin-top: 14px; - margin-bottom: 14px; + +.btn-outline-danger.disabled, .btn-outline-danger:disabled { + color: #dc3545; + background-color: transparent; +} + +.btn-outline-danger:not(:disabled):not(.disabled):active, .btn-outline-danger:not(:disabled):not(.disabled).active, +.show > .btn-outline-danger.dropdown-toggle { + color: color-yiq(#dc3545); + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-outline-danger:not(:disabled):not(.disabled):active:focus, .btn-outline-danger:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-danger.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-outline-light { + color: #f8f9fa; background-color: transparent; background-image: none; - border: 1px solid transparent; + border-color: #f8f9fa; +} + +.btn-outline-light:hover { + color: #fff; + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-outline-light:focus, .btn-outline-light.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-outline-light.disabled, .btn-outline-light:disabled { + color: #f8f9fa; + background-color: transparent; +} + +.btn-outline-light:not(:disabled):not(.disabled):active, .btn-outline-light:not(:disabled):not(.disabled).active, +.show > .btn-outline-light.dropdown-toggle { + color: color-yiq(#f8f9fa); + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-outline-light:not(:disabled):not(.disabled):active:focus, .btn-outline-light:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-light.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-outline-dark { + color: #343a40; + background-color: transparent; + background-image: none; + border-color: #343a40; +} + +.btn-outline-dark:hover { + color: #fff; + background-color: #343a40; + border-color: #343a40; +} + +.btn-outline-dark:focus, .btn-outline-dark.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-outline-dark.disabled, .btn-outline-dark:disabled { + color: #343a40; + background-color: transparent; +} + +.btn-outline-dark:not(:disabled):not(.disabled):active, .btn-outline-dark:not(:disabled):not(.disabled).active, +.show > .btn-outline-dark.dropdown-toggle { + color: color-yiq(#343a40); + background-color: #343a40; + border-color: #343a40; +} + +.btn-outline-dark:not(:disabled):not(.disabled):active:focus, .btn-outline-dark:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-dark.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-lg { + padding: 0.5rem 1rem; + font-size: 1.25rem; + line-height: 1.5; + border-radius: 0; +} + +.btn-sm { + padding: 0.25rem 0.5rem; + font-size: 0.7rem; + line-height: 1.5; border-radius: 0; } -.navbar-toggle:focus { - outline: 0; + +/* + * 3. TYPE + */ +body { + font-family: "Roboto", Helvetica, Arial, sans-serif; + font-size: 1rem; + font-weight: 400; + line-height: 1.5; + color: #212529; + background-color: #fff; +} + +a { + color: #c27baa; + text-decoration: none; +} + +a:focus, a:hover { + color: #a44c87; + text-decoration: underline; +} + +h1, +h2, +h3, +h4, +h5, +h6, +.h1, +.h2, +.h3, +.h4, +.h5, +.h6 { + margin-bottom: 1rem; + font-family: inherit; + font-weight: 700; + line-height: 1.1; + color: inherit; +} + +h1, +.h1 { + font-size: 2.2rem; +} + +h2, +.h2 { + font-size: 1.8rem; +} + +h3, +.h3 { + font-size: 1.5rem; +} + +h4, +.h4 { + font-size: 1.1rem; +} + +h5, +.h5 { + font-size: 1rem; +} + +h6, +.h6 { + font-size: 0.8rem; +} + +.lead { + font-size: 1.25rem; + font-weight: 300; +} + +.display-1 { + font-size: 6rem; + font-weight: 300; + line-height: 1.1; +} + +.display-2 { + font-size: 5.5rem; + font-weight: 300; + line-height: 1.1; } -.navbar-nav { - margin: 10.5px -15px; + +.display-3 { + font-size: 4.5rem; + font-weight: 300; + line-height: 1.1; } -.navbar-nav > li > a { - padding-top: 10px; - padding-bottom: 10px; - line-height: 20px; + +.display-4 { + font-size: 3.5rem; + font-weight: 300; + line-height: 1.1; } -@media (max-width: 767px) { - .navbar-nav .open .dropdown-menu > li > a, - .navbar-nav .open .dropdown-menu .dropdown-header { - padding: 5px 15px 5px 25px; - } - .navbar-nav .open .dropdown-menu > li > a { - line-height: 20px; - } - .navbar-nav .open .dropdown-menu > li > a:hover, - .navbar-nav .open .dropdown-menu > li > a:focus { - background-image: none; - } + +hr { + border-top: 1px solid rgba(0, 0, 0, 0.1); } -@media (min-width: 768px) { - .navbar-nav { - float: left; - margin: 0; - } - .navbar-nav > li { - float: left; - } - .navbar-nav > li > a { - padding-top: 21px; - padding-bottom: 21px; - } - .navbar-nav.navbar-right:last-child { - margin-right: -15px; - } + +small, +.small { + font-size: 80%; + font-weight: 400; } -@media (min-width: 768px) { - .navbar-left { - float: left !important; - } - .navbar-right { - float: right !important; - } + +mark, +.mark { + padding: 0.2em; + background-color: #fcf8e3; +} + +.blockquote { + padding: 0.5rem 1rem; + margin-bottom: 2rem; + font-size: 1rem; + border-left: 5px solid #c27baa; } -.navbar-form { - margin-left: -15px; - margin-right: -15px; - padding: 10px 15px; - border-top: 1px solid transparent; - border-bottom: 1px solid transparent; - -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); - margin-top: 14px; - margin-bottom: 14px; + +.blockquote-footer { + color: #868e96; } -@media (max-width: 767px) { - .navbar-form .form-group { - margin-bottom: 5px; - } + +.blockquote-footer::before { + content: "\2014 \00A0"; } -@media (min-width: 768px) { - .navbar-form { - width: auto; - border: 0; - margin-left: 0; - margin-right: 0; - padding-top: 0; - padding-bottom: 0; - -webkit-box-shadow: none; - box-shadow: none; - } - .navbar-form.navbar-right:last-child { - margin-right: -15px; - } + +.text-primary { + color: #c27baa !important; } -.navbar-nav > li > .dropdown-menu { - margin-top: 0; - border-top-right-radius: 0; - border-top-left-radius: 0; + +a.text-primary:focus, a.text-primary:hover { + color: #b25894 !important; } -.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu { - border-bottom-right-radius: 0; + +/* + * 4. PAGINATION + */ +.page-item:first-child .page-link { + border-top-left-radius: 0; border-bottom-left-radius: 0; } -.navbar-btn { - margin-top: 14px; - margin-bottom: 14px; + +.page-item:last-child .page-link { + border-top-right-radius: 0; + border-bottom-right-radius: 0; } -.navbar-btn.btn-sm { - margin-top: 16px; - margin-bottom: 16px; + +.page-item.active .page-link { + color: #fff; + background-color: #c27baa; + border-color: #c27baa; } -.navbar-btn.btn-xs { - margin-top: 20px; - margin-bottom: 20px; + +.page-item.disabled .page-link { + color: #868e96; + background-color: #fff; + border-color: #dee2e6; } -.navbar-text { - margin-top: 21px; - margin-bottom: 21px; + +.page-link { + padding: 0.5rem 0.75rem; + line-height: 1.25; + color: #c27baa; + background-color: #fff; + border: 1px solid #dee2e6; } -@media (min-width: 768px) { - .navbar-text { - float: left; - margin-left: 15px; - margin-right: 15px; - } - .navbar-text.navbar-right:last-child { - margin-right: 0; - } + +.page-link:focus, .page-link:hover { + color: #a44c87; + text-decoration: none; + background-color: #e9ecef; + border-color: #dee2e6; + outline: 0; } -.navbar-default { - background-color: #ffffff; - border-color: #cccccc; - border-bottom: none; + +.pagination-lg .page-link { + padding: 0.75rem 1.5rem; + font-size: 1.25rem; + line-height: 1.5; } -.navbar-default .navbar-brand { - color: #555555; + +.pagination-lg .page-item:first-child .page-link { + border-top-left-radius: 0; + border-bottom-left-radius: 0; } -.navbar-default .navbar-brand:hover, -.navbar-default .navbar-brand:focus { - color: #3b3b3b; - background-color: transparent; + +.pagination-lg .page-item:last-child .page-link { + border-top-right-radius: 0; + border-bottom-right-radius: 0; } -.navbar-default .navbar-text { - color: #777777; + +.pagination-sm .page-link { + padding: 0.25rem 0.5rem; + font-size: 0.7rem; + line-height: 1.5; } -.navbar-default .navbar-nav > li > a { - color: #555555; + +.pagination-sm .page-item:first-child .page-link { + border-top-left-radius: 0; + border-bottom-left-radius: 0; } -.navbar-default .navbar-nav > li > a:hover, -.navbar-default .navbar-nav > li > a:focus { - color: #555555; - background-color: #e2c1d7; + +.pagination-sm .page-item:last-child .page-link { + border-top-right-radius: 0; + border-bottom-right-radius: 0; } -.navbar-default .navbar-nav > .active > a, -.navbar-default .navbar-nav > .active > a:hover, -.navbar-default .navbar-nav > .active > a:focus { - color: #ffffff; - background-color: #c27baa; + +/* +* 5. DROPDOWNS +*/ +.dropdown-menu { + z-index: 1000; + min-width: 10rem; + padding: 0.5rem 0; + margin: 0.125rem 0 0; + font-size: 1rem; + color: #212529; + background-color: #fff; + border: 1px solid rgba(0, 0, 0, 0.15); + border-radius: 0; } -.navbar-default .navbar-nav > .disabled > a, -.navbar-default .navbar-nav > .disabled > a:hover, -.navbar-default .navbar-nav > .disabled > a:focus { - color: #cccccc; - background-color: transparent; + +.dropdown-item { + padding: 0.25rem 1.5rem; + color: #212529; } -.navbar-default .navbar-toggle { - border-color: #dddddd; + +.dropdown-item:focus, .dropdown-item:hover { + color: #16181b; + background-color: #f8f9fa; } -.navbar-default .navbar-toggle:hover, -.navbar-default .navbar-toggle:focus { + +.dropdown-item.active, .dropdown-item:active { + color: #fff; background-color: #c27baa; } -.navbar-default .navbar-toggle .icon-bar { - background-color: #888888; + +.dropdown-item.disabled, .dropdown-item:disabled { + color: #868e96; } -.navbar-default .navbar-collapse, -.navbar-default .navbar-form { - border-color: #cccccc; + +.dropdown-header { + padding: 0.5rem 1.5rem; + font-size: 0.7rem; + color: #868e96; } -.navbar-default .navbar-nav > .open > a, -.navbar-default .navbar-nav > .open > a:hover, -.navbar-default .navbar-nav > .open > a:focus { - background-color: #c27baa; - color: #ffffff; + +/* +* 6. UTILITIES +*/ +.bg-primary { + background-color: #c27baa !important; } -@media (max-width: 767px) { - .navbar-default .navbar-nav .open .dropdown-menu > li > a { - color: #555555; - } - .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, - .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus { - color: #c27baa; - } - .navbar-default .navbar-nav .open .dropdown-menu > .active > a, - .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, - .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus { - color: #ffffff; - background-color: #c27baa; - } - .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a, - .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover, - .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus { - color: #cccccc; - background-color: transparent; - } + +a.bg-primary:focus, a.bg-primary:hover { + background-color: #b25894 !important; } -.navbar-default .navbar-link { - color: #555555; + +.bg-secondary { + background-color: #868e96 !important; } -.navbar-default .navbar-link:hover { - color: #555555; + +a.bg-secondary:focus, a.bg-secondary:hover { + background-color: #6c757d !important; } -.navbar-default .btn-link { - color: #555555; + +.bg-success { + background-color: #28a745 !important; } -.navbar-default .btn-link:hover, -.navbar-default .btn-link:focus { - color: #555555; + +a.bg-success:focus, a.bg-success:hover { + background-color: #1e7e34 !important; } -.navbar-default .btn-link[disabled]:hover, -fieldset[disabled] .navbar-default .btn-link:hover, -.navbar-default .btn-link[disabled]:focus, -fieldset[disabled] .navbar-default .btn-link:focus { - color: #cccccc; + +.bg-info { + background-color: #17a2b8 !important; } -/* scaffolding */ -body { - font-family: "Roboto", Helvetica, Arial, sans-serif; - font-size: 14px; - line-height: 1.42857143; - color: #555555; + +a.bg-info:focus, a.bg-info:hover { + background-color: #117a8b !important; } -a { - color: #c27baa; - text-decoration: none; + +.bg-warning { + background-color: #ffc107 !important; } -a:hover, -a:focus { - color: #a44c87; - text-decoration: underline; + +a.bg-warning:focus, a.bg-warning:hover { + background-color: #d39e00 !important; } -a:focus { - outline: thin dotted; - outline: 5px auto -webkit-focus-ring-color; - outline-offset: -2px; + +.bg-danger { + background-color: #dc3545 !important; } -.img-rounded { - border-radius: 0; + +a.bg-danger:focus, a.bg-danger:hover { + background-color: #bd2130 !important; } -hr { - margin-top: 20px; - margin-bottom: 20px; - border: 0; - border-top: 1px solid #eeeeee; + +.bg-light { + background-color: #f8f9fa !important; } -/* breadcrumbs */ -.breadcrumb { - padding: 20px 0; - margin-bottom: 20px; - background-color: transparent; - border-radius: 0; - text-align: right; + +a.bg-light:focus, a.bg-light:hover { + background-color: #dae0e5 !important; } -.breadcrumb > li + li:before { - content: ">\00a0"; - color: #555555; + +.bg-dark { + background-color: #343a40 !important; } -.breadcrumb > .active { - color: #999999; + +a.bg-dark:focus, a.bg-dark:hover { + background-color: #1d2124 !important; } -@media (max-width: 991px) { - .breadcrumb { - padding: 20px 0; - text-align: center; - } + +.border-primary { + border-color: #c27baa !important; } -/* dropdowns */ -.dropdown-menu { - z-index: 1000; - font-size: 14px; - background-color: #ffffff; - border: 1px solid #cccccc; - border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 0; - -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); - box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); + +.border-secondary { + border-color: #868e96 !important; } -.dropdown-menu.pull-right { - right: 0; - left: auto; + +.border-success { + border-color: #28a745 !important; } -.dropdown-menu .divider { - height: 1px; - margin: 9px 0; - overflow: hidden; - background-color: #e5e5e5; + +.border-info { + border-color: #17a2b8 !important; } -.dropdown-menu > li > a { - padding: 5px 20px; - line-height: 1.42857143; - color: #333333; - white-space: nowrap; + +.border-warning { + border-color: #ffc107 !important; } -/* labels */ -.label { - font-family: "Roboto", Helvetica, Arial, sans-serif; - font-weight: normal; - text-transform: uppercase; - letter-spacing: 0.08em; + +.border-danger { + border-color: #dc3545 !important; } -/* forms.less */ -label { - font-weight: normal; + +.border-light { + border-color: #f8f9fa !important; } -.form-control { - -webkit-box-shadow: none; - box-shadow: none; - border-radius: 0; + +.border-dark { + border-color: #343a40 !important; } -.form-control:focus { - border-color: #c27baa; - outline: 0; - -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(194, 123, 170, 0.6); - box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(194, 123, 170, 0.6); + +.text-primary { + color: #c27baa !important; } -.form-group { - margin-bottom: 20px; + +a.text-primary:focus, a.text-primary:hover { + color: #b25894 !important; } -/* pager*/ -.pager { - margin: 20px 0; - border-top: solid 1px #eeeeee; - padding-top: 20px; - text-transform: uppercase; - letter-spacing: 0.08em; - font-family: "Roboto", Helvetica, Arial, sans-serif; + +.text-secondary { + color: #868e96 !important; } -.pager li { - display: inline; + +a.text-secondary:focus, a.text-secondary:hover { + color: #6c757d !important; } -.pager li > a, -.pager li > span { - background-color: #ffffff; - border: 1px solid #c27baa; - border-radius: 0; + +.text-success { + color: #28a745 !important; } -.pager li > a:hover, -.pager li > a:focus { - text-decoration: none; - color: #fff; - background-color: #c27baa; + +a.text-success:focus, a.text-success:hover { + color: #1e7e34 !important; } -.pager .disabled > a, -.pager .disabled > a:hover, -.pager .disabled > a:focus, -.pager .disabled > span { - color: #999999; - background-color: #ffffff; - border-color: #ddd; + +.text-info { + color: #17a2b8 !important; } -/* pagination */ -.pagination { - margin: 20px 0; - font-family: "Roboto", Helvetica, Arial, sans-serif; - border-radius: 0; + +a.text-info:focus, a.text-info:hover { + color: #117a8b !important; } -.pagination > li > a, -.pagination > li > span { - padding: 6px 12px; - line-height: 1.42857143; - text-decoration: none; - color: #c27baa; - background-color: #ffffff; - border: 1px solid #dddddd; + +.text-warning { + color: #ffc107 !important; } -.pagination > li > a:hover, -.pagination > li > span:hover, -.pagination > li > a:focus, -.pagination > li > span:focus { - color: #c27baa; - background-color: #f2e4ed; - border-color: #dddddd; -} -.pagination > .active > a, -.pagination > .active > span, -.pagination > .active > a:hover, -.pagination > .active > span:hover, -.pagination > .active > a:focus, -.pagination > .active > span:focus { - z-index: 2; - color: #ffffff; - background-color: #c27baa; - border-color: #c27baa; + +a.text-warning:focus, a.text-warning:hover { + color: #d39e00 !important; } -.pagination > .disabled > span, -.pagination > .disabled > span:hover, -.pagination > .disabled > span:focus, -.pagination > .disabled > a, -.pagination > .disabled > a:hover, -.pagination > .disabled > a:focus { - color: #999999; - background-color: #ffffff; - border-color: #dddddd; -} -/* responsive utilities */ -@media (max-width: 767px) { - .text-center-xs { - text-align: center !important; - } - .text-center-xs img { - display: block; - margin-left: auto; - margin-right: auto; - } + +.text-danger { + color: #dc3545 !important; } -@media (min-width: 768px) and (max-width: 991px) { - .text-center-sm { - text-align: center !important; - } - .text-center-sm img { - display: block; - margin-left: auto; - margin-right: auto; - } + +a.text-danger:focus, a.text-danger:hover { + color: #bd2130 !important; } -/* type */ -h1, -h2, -h3, -h4, -h5, -h6, -.h1, -.h2, -.h3, -.h4, -.h5, -.h6 { - font-family: "Roboto", Helvetica, Arial, sans-serif; - font-weight: 900; - line-height: 1.1; - color: #333333; + +.text-light { + color: #f8f9fa !important; } -h1, -.h1, -h2, -.h2, -h3, -.h3 { - margin-top: 20px; - margin-bottom: 20px; + +a.text-light:focus, a.text-light:hover { + color: #dae0e5 !important; } -p { - margin: 0 0 10px; + +.text-dark { + color: #343a40 !important; } -.lead { - margin-bottom: 20px; - font-size: 18px; + +a.text-dark:focus, a.text-dark:hover { + color: #1d2124 !important; } -@media (min-width: 768px) { - .lead { - font-size: 21px; - } + +.badge-primary { + color: #fff; + background-color: #c27baa; } -.text-small { - font-size: 12px; + +.badge-primary[href]:focus, .badge-primary[href]:hover { + color: #fff; + text-decoration: none; + background-color: #b25894; } -.text-large { - font-size: 18px; + +.badge-secondary { + color: #fff; + background-color: #868e96; } -.text-italic { - font-style: italic; + +.badge-secondary[href]:focus, .badge-secondary[href]:hover { + color: #fff; + text-decoration: none; + background-color: #6c757d; } -.text-primary { - color: #c27baa; + +.badge-success { + color: #fff; + background-color: #28a745; } -a.text-primary:hover { - color: #b25894; + +.badge-success[href]:focus, .badge-success[href]:hover { + color: #fff; + text-decoration: none; + background-color: #1e7e34; } -.bg-primary { + +.badge-info { color: #fff; - background-color: #c27baa; + background-color: #17a2b8; } -a.bg-primary:hover { - background-color: #b25894; + +.badge-info[href]:focus, .badge-info[href]:hover { + color: #fff; + text-decoration: none; + background-color: #117a8b; } -abbr[title], -abbr[data-original-title] { - border-bottom: 1px dotted #999999; + +.badge-warning { + color: #111; + background-color: #ffc107; } -blockquote { - padding: 10px 20px; - margin: 0 0 20px; - font-size: 14px; - border-left: 5px solid #c27baa; + +.badge-warning[href]:focus, .badge-warning[href]:hover { + color: #111; + text-decoration: none; + background-color: #d39e00; } -blockquote footer, -blockquote small, -blockquote .small { - display: block; - font-size: 80%; - line-height: 1.42857143; - color: #999999; + +.badge-danger { + color: #fff; + background-color: #dc3545; } -blockquote footer:before, -blockquote small:before, -blockquote .small:before { - content: '\2014 \00A0'; + +.badge-danger[href]:focus, .badge-danger[href]:hover { + color: #fff; + text-decoration: none; + background-color: #bd2130; } -.blockquote-reverse, -blockquote.pull-right { - border-right: 5px solid #c27baa; + +.badge-light { + color: #111; + background-color: #f8f9fa; } -address { - margin-bottom: 20px; - line-height: 1.42857143; + +.badge-light[href]:focus, .badge-light[href]:hover { + color: #111; + text-decoration: none; + background-color: #dae0e5; } -.panel { - margin-bottom: 20px; - background-color: #ffffff; - border: 1px solid transparent; + +.badge-dark { + color: #fff; + background-color: #343a40; +} + +.badge-dark[href]:focus, .badge-dark[href]:hover { + color: #fff; + text-decoration: none; + background-color: #1d2124; +} + +/* +* 7.CODE +*/ +code { + font-size: 87.5%; + color: #e83e8c; border-radius: 0; - -webkit-box-shadow: 0 0 0; - box-shadow: 0 0 0; } -.panel-heading { - border-top-right-radius: 0; + +a > code { + padding: 0; + color: inherit; + background-color: inherit; +} + +/* +* 8. NAV +*/ +.nav-link { + padding: 0.5rem 1rem; +} + +.nav-link.disabled { + color: #868e96; +} + +.nav-tabs .nav-item { + margin-bottom: -1px; +} + +.nav-tabs .nav-link { + border: 1px solid transparent; border-top-left-radius: 0; - text-transform: uppercase; - letter-spacing: 0.08em; - padding: 15px 15px; + border-top-right-radius: 0; } -.progress { - overflow: hidden; - height: 20px; - margin-bottom: 20px; - background-color: #f5f5f5; - border-radius: 0; - -webkit-box-shadow: none; - box-shadow: none; + +.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover { + border-color: #e9ecef #e9ecef #dee2e6; } -.panel-group { - margin-bottom: 20px; + +.nav-tabs .nav-link.disabled { + color: #868e96; } -.panel-group .panel { - margin-bottom: 0; + +.nav-tabs .nav-link.active, +.nav-tabs .nav-item.show .nav-link { + color: #495057; + background-color: #fff; +} + +.nav-tabs .dropdown-menu { + margin-top: -1px; +} + +.nav-pills .nav-link { border-radius: 0; - overflow: hidden; } -.panel-group .panel + .panel { - margin-top: 5px; + +.nav-pills .nav-link.active, +.nav-pills .show > .nav-link { + color: #fff; + background-color: #c27baa; } -.panel-group.accordion .panel { - border-color: #ccc; + +/* +* 9. CARD +*/ +.card { + background-color: #fff; + border: 1px solid rgba(0, 0, 0, 0.125); + border-radius: 0; } -.panel-primary { - border-color: #c27baa; + +.card > .list-group:first-child .list-group-item:first-child { + border-top-left-radius: 0; + border-top-right-radius: 0; } -.panel-primary > .panel-heading { - color: #ffffff; - background-color: #c27baa; - border-color: #c27baa; + +.card > .list-group:last-child .list-group-item:last-child { + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; } -.panel-primary > .panel-heading + .panel-collapse > .panel-body { - border-top-color: #c27baa; + +.card-body { + padding: 1.25rem; } -.panel-primary > .panel-heading .badge { - color: #c27baa; - background-color: #ffffff; + +.card-title { + margin-bottom: 0.75rem; } -.panel-primary > .panel-footer + .panel-collapse > .panel-body { - border-bottom-color: #c27baa; + +.card-subtitle { + margin-top: -0.375rem; } -.panel-primary .panel-title { - font-weight: 300; + +.card-link + .card-link { + margin-left: 1.25rem; } -.panel-primary .panel-title a:hover { - color: #fff; - text-decoration: none; + +.card-header { + padding: 0.75rem 1.25rem; + background-color: rgba(0, 0, 0, 0.03); + border-bottom: 1px solid rgba(0, 0, 0, 0.125); } -a.badge:hover, -a.badge:focus { - color: #ffffff; - text-decoration: none; - cursor: pointer; + +.card-header:first-child { + border-radius: calc(0 - 1px) calc(0 - 1px) 0 0; } -a.list-group-item.active > .badge, -.nav-pills > .active > a > .badge { - color: #c27baa; - background-color: #ffffff; + +.card-header-transparent { + background-color: rgba(0, 0, 0, 0.3); + border-bottom: none; } -.nav-pills > li > a > .badge { - margin-left: 3px; + +.card-footer { + padding: 0.75rem 1.25rem; + background-color: #f8f9fa; + border-top: 1px solid rgba(0, 0, 0, 0.125); +} + +.card-footer:last-child { + border-radius: 0 0 calc(0 - 1px) calc(0 - 1px); +} + +.card-header-tabs { + margin-right: -0.625rem; + margin-bottom: -0.75rem; + margin-left: -0.625rem; + border-bottom: 0; } -.progress-bar-primary { - background-color: #c27baa; + +.card-header-pills { + margin-right: -0.625rem; + margin-left: -0.625rem; } -.progress-striped .progress-bar-primary { - background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); - background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); - background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); + +.card-img-overlay { + padding: 1.25rem; } -/*! - * Yamm!3 - Yet another megamenu for Bootstrap 3 - * http://geedmo.github.com/yamm3 - * - * @geedmo - Licensed under the MIT license - */ -.yamm .nav, -.yamm .collapse, -.yamm .dropup.use-yamm, -.yamm .dropdown.use-yamm { - position: static; + +.card-img-overlay-opacity { + background: rgba(0, 0, 0, 0.2); } -.yamm .container { - position: relative; + +.card-img { + border-radius: calc(0 - 1px); } -.yamm .dropdown-menu { - left: auto; + +.card-img-top { + border-top-left-radius: calc(0 - 1px); + border-top-right-radius: calc(0 - 1px); } -.yamm .nav.navbar-right .dropdown-menu { - left: auto; - right: 0; + +.card-img-bottom { + border-bottom-right-radius: calc(0 - 1px); + border-bottom-left-radius: calc(0 - 1px); } -.yamm .yamm-content { - padding: 20px 30px; + +.card-deck .card { + margin-bottom: 15px; } -.yamm .dropdown.yamm-fw .dropdown-menu { - left: 15px; - right: 15px; + +@media (min-width: 576px) { + .card-deck { + margin-right: -15px; + margin-left: -15px; + } + .card-deck .card { + margin-right: 15px; + margin-left: 15px; + } } diff --git a/static/css/style.red.css b/static/css/style.red.css index cf4710f76..dc20e2bd3 100644 --- a/static/css/style.red.css +++ b/static/css/style.red.css @@ -1,3566 +1,3702 @@ -.clearfix:before, -.clearfix:after, -.navbar:before, -.navbar:after, -.navbar-header:before, -.navbar-header:after { - content: " "; - display: table; +/* + +================================================================================== +================================================================================== + +Universal Template + +https://bootstrapious.com/p/universal-business-e-commerce-template + +================================================================================== +================================================================================== + +*/ +/* +* +* ===================== +* GENERAL +* ===================== +* +*/ +.boxed { + background: url("../img/boxed-pattern.png"); +} + +.boxed #all { + max-width: 1200px; + margin: 0 auto; + background: #fff; + -webkit-box-shadow: 0 0 5px #ccc; + box-shadow: 0 0 5px #ccc; +} + +a { + -webkit-transition: all 0.3s !important; + transition: all 0.3s !important; + display: inline-block; +} + +button { + cursor: pointer; +} + +strong { + font-weight: 700; +} + +p.lead { + margin-bottom: 40px; +} + +.accent { + color: #da4d4d; } -.clearfix:after, -.navbar:after, -.navbar-header:after { - clear: both; + +.tooltip { + font-family: "Roboto", Helvetica, Arial, sans-serif; } -.center-block { + +.bs-select .dropdown-menu .dropdown-menu { + min-height: 20px; display: block; - margin-left: auto; - margin-right: auto; } -.pull-right { - float: right !important; + +.bs-select .dropdown-menu .dropdown-menu a { + padding: 6px 10px; + color: #666; + font-weight: 700; + text-decoration: none !important; + display: block; + font-size: .8rem; + text-transform: uppercase; + letter-spacing: 0.1em; + font-family: "Roboto", Helvetica, Arial, sans-serif; + outline: none; } -.pull-left { - float: left !important; + +.heading-light { + font-weight: 300 !important; } -.hide { - display: none !important; + +.text-bold { + font-weight: 700; } -.show { - display: block !important; + +.text-small { + font-size: 0.9rem; } -.invisible { - visibility: hidden; + +.text-uppercase { + text-transform: uppercase; + letter-spacing: 0.1em; } -.text-hide { - font: 0/0 a; - color: transparent; - text-shadow: none; - background-color: transparent; - border: 0; + +.no-letter-spacing { + letter-spacing: 0 !important; } -.hidden { - display: none !important; - visibility: hidden !important; + +.bar { + padding: 60px 0; } -.affix { - position: fixed; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); + +.bar.padding-big { + padding: 50px 0; } -/* general styles */ -a, -button { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.pagination { + margin-top: 20px; } -a i[class^="fa"], -button i[class^="fa"] { - margin: 0 5px; + +#pagination .pagination { + margin-bottom: 40px; } -.clickable { - cursor: pointer !important; + +.text-sm, .form-group label, #blog-listing-big .date-comments a, #blog-listing-medium .date-comments a, #blog-listing-big p.intro, #blog-listing-medium p.intro { + font-size: 0.9rem; } -.required { - color: #da4d4d; + +.text-xs { + font-size: 0.9rem; } -.accent { - color: #da4d4d; + +.text-xs * { + font-size: 0.9rem; } -.text-uppercase { - text-transform: uppercase; - letter-spacing: 0.08em; + +@media (max-width: 767px) { + .text-sm-center { + text-align: center !important; + } } + @media (max-width: 991px) { + .text-md-center { + text-align: center !important; + } +} + +@media (max-width: 1199px) { + .text-lg-center { + text-align: center !important; + } +} + +@media (max-width: 767px) { .text-center-sm { - text-align: center; + text-align: center !important; } } -p.lead { - margin-bottom: 40px; + +@media (max-width: 991px) { + .text-center-md { + text-align: center !important; + } } -section, -div.section { - margin-bottom: 40px; + +@media (max-width: 1199px) { + .text-center-sm, .text-center-xs { + text-align: center !important; + } } + +.bg-gray { + background: #e9ecef !important; +} + +.bg-gray-dark { + background: #555 !important; +} + +.bg-primary { + background: #da4d4d !important; +} + +.color-white { + color: #fff !important; +} + +.color-white * { + color: #fff !important; +} + +.bg-white { + background: #fff !important; +} + +.bg-fixed { + background-attachment: fixed !important; +} + +.light-gray { + background: #eee; +} + .no-mb { margin-bottom: 0 !important; } + +.no-mt { + margin-top: 0 !important; +} + +.no-horizontal-padding { + padding-left: 0 !important; + padding-right: 0 !important; +} + .mb-small { margin-bottom: 20px !important; } -.heading { - margin-bottom: 40px; + +.no-padding-top { + padding-top: 0 !important; } -.heading h1, -.heading h2, -.heading h3, -.heading h4, -.heading h5 { - display: inline-block; - border-bottom: solid 5px #da4d4d; + +.no-padding-bottom { + padding-bottom: 0 !important; +} + +.padding-horizontal { + padding-left: 30px !important; + padding-right: 30px !important; +} + +.relative-positioned { + position: relative; + z-index: 1; +} + +.jumbotron { + margin: 0; +} + +.owl-carousel.equal-height .owl-stage { + display: -webkit-box !important; + display: -ms-flexbox !important; + display: flex !important; + -webkit-box-align: stretch !important; + -ms-flex-align: stretch !important; + align-items: stretch !important; +} + +.background-pentagon, #heading-breadcrumbs { + background: url("../img/texture-bw.png") center center repeat; + border-top: 1px solid #999; + border-bottom: 1px solid #999; +} + +.heading, .panel-heading { + margin-bottom: 1rem; +} + +.heading h1, .panel-heading h1, .heading h2, .panel-heading h2, .heading h3, .panel-heading h3, .heading h4, .panel-heading h4, .heading h5, .panel-heading h5, .heading h6, .panel-heading h6 { line-height: 1.1; + display: inline-block; margin-bottom: 0; padding-bottom: 10px; - vertical-align: middle; text-transform: uppercase; - letter-spacing: 0.06em; + letter-spacing: 0.1em; } -.heading h1 i[class^="fa"], -.heading h2 i[class^="fa"], -.heading h3 i[class^="fa"], -.heading h4 i[class^="fa"], -.heading h5 i[class^="fa"] { - display: inline-block; + +.heading h1:after, .panel-heading h1:after, .heading h2:after, .panel-heading h2:after, .heading h3:after, .panel-heading h3:after, .heading h4:after, .panel-heading h4:after, .heading h5:after, .panel-heading h5:after, .heading h6:after, .panel-heading h6:after { + content: " "; + display: block; + width: 100px; + height: 2px; + margin-top: .6rem; background: #da4d4d; - width: 30px; - height: 30px; - vertical-align: middle; - text-align: center; - color: #fff; - font-size: 12px; - line-height: 30px; - border-radius: 15px; } -.icon { - display: inline-block; - width: 80px; - height: 80px; - color: #fff; - line-height: 80px; - border-radius: 40px; - border: solid 1px #fff; - font-size: 20px; + +.heading.text-center h1:after, .text-center.panel-heading h1:after, .heading.text-center h2:after, .text-center.panel-heading h2:after, .heading.text-center h3:after, .text-center.panel-heading h3:after, .heading.text-center h4:after, .text-center.panel-heading h4:after, .heading.text-center h5:after, .text-center.panel-heading h5:after, .heading.text-center h6:after, .text-center.panel-heading h6:after { + margin-left: auto; + margin-right: auto; } -.icon.icon-lg { - font-size: 30px; - border-width: 2px; + +.buttons a { + margin: 0 3px; } -.ul-icons { - padding-left: 10px; + +.dropdown-item.active, .dropdown-item:active { + background: #eca1a1; } -.ul-icons li { - list-style-type: none; - line-height: 20px; - margin-bottom: 20px; + +.card { + border-radius: 0; + margin-bottom: 10px; } -.ul-icons li i { - width: 20px; - height: 20px; - background: #da4d4d; - color: #fff; - text-align: center; - border-radius: 10px; - line-height: 20px; - margin-right: 10px; + +.card-header { + border-radius: 0; + padding: 20px; } -ul.list-style-none { - list-style: none; + +.card-header h1, .card-header h2, .card-header h3, .card-header h4, .card-header h5, .card-header h6 { + text-transform: uppercase; + letter-spacing: 0.1em; + font-size: 0.935rem; + margin: 0 !important; } -#text-page h1, -#text-page h2, -#text-page h3 { - font-weight: 700; + +.card-header a { + color: #333; } -#error-page { - text-align: center; - margin-top: 40px; - margin-bottom: 100px; + +.card-body p { + font-size: 0.9rem; + color: #333; } -#error-page h4 { - margin-bottom: 40px; + +.alert { + border-radius: 0; } -#error-page p.buttons { - margin-top: 40px; + +#heading-breadcrumbs { + padding: 2rem 0; + border-top: none !important; + border-bottom: none !important; } -.pages-listing .item { - text-align: center; + +#heading-breadcrumbs .breadcrumb { + margin-bottom: 0; + background: none; + font-size: 0.9rem; } -.pages-listing .item h3 { - font-size: 18px; + +#heading-breadcrumbs h1 { text-transform: uppercase; - margin-bottom: 20px; - letter-spacing: 0.08em; + letter-spacing: 0.1em; + margin-bottom: 0; } -.pages-listing .item h3 a { - color: #555555; + +#heading-breadcrumbs li { + text-transform: uppercase; + letter-spacing: 0.1em; } -.pages-listing .item .text { - margin-bottom: 20px; + +.row.no-space { + margin-left: 0; + margin-right: 0; } -.pages-listing .item .text p { - color: #999999; - font-size: 12px; - margin-bottom: 20px; + +.row.no-space div[class*="col-"] { + padding: 0; } -.banner { - margin-bottom: 30px; + +.row.no-space .box-image { + margin: 0; +} + +.owl-carousel .owl-dots { + margin-top: 20px; text-align: center; } -.banner img { - margin: 0 auto; + +.owl-carousel .owl-dots .owl-dot { + display: inline-block; + margin: 0 5px; } -.banner a:hover img { - opacity: 0.8; - filter: alpha(opacity=80); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.owl-carousel .owl-dots .owl-dot.active span { + background: #fff; } -.pages { - text-align: center; + +.owl-carousel .owl-dots .owl-dot span { + display: block; + width: 12px; + height: 12px; + border-radius: 50%; + background: #aaa; +} + +.dark-mask { + background: rgba(0, 0, 0, 0.3); + width: 100%; + height: 100%; + position: absolute; + top: 0; + left: 0; + z-index: -1; } -.pages .loadMore { - text-align: center; + +.dark-mask.mask-primary { + background: rgba(218, 77, 77, 0.9); } -.pages .pagination { + +.icon-outlined { + width: 80px; + height: 80px; + line-height: 80px; text-align: center; -} -.features-buttons button { + display: inline-block; + font-size: 1.4rem; + border-radius: 50%; + border: 2px solid #fff; margin-bottom: 20px; } -@media (min-width: 1300px) { - body.boxed { - background: url(https://www.toptal.com/designers/subtlepatterns/patterns/subtle_zebra_3d.png); - } - body.boxed #all { - position: relative; - background: #fff; - width: 1200px; - margin: 0 auto; - overflow: hidden; - -webkit-box-shadow: 0 0 5px #cccccc; - box-shadow: 0 0 5px #cccccc; - } -} -#top { - background: #555555; - color: #eeeeee; - padding: 10px 0; + +.icon-outlined.icon-lg { + font-size: 2rem; } -#top p { - margin: 0; - font-size: 12px; + +.icon-outlined.icon-sm { + width: 55px; + height: 55px; + line-height: 55px; + text-align: center; + font-size: 1.15rem; } -#top .social { - float: right; - text-align: right; + +.icon-outlined.icon-thin { + border-width: 1px; } -#top .social a { - color: #999999; - display: inline-block; + +.icon-filled { width: 24px; height: 24px; - border-radius: 12px; line-height: 24px; - font-size: 12px; + background: #da4d4d; + color: #fff; text-align: center; + border-radius: 50%; + font-size: 0.75rem; +} + +.ul-icons .icon-filled { + display: inline-block; + margin-right: 10px; +} + +.ul-icons li { + margin-bottom: 20px; + color: #555; + font-size: 0.9rem; +} + +.ul-icons a { + display: inline; +} + +ul.social { + margin: 15px 0; } -#top .social a:hover { + +ul.social a { + width: 28px; + height: 28px; + line-height: 28px; + background: #555; color: #fff; - background: #da4d4d; + text-align: center; + border-radius: 50%; + margin: 0 2px; + font-size: 0.8rem; +} + +ul.social a:hover { -webkit-transform: scale(1.1); transform: scale(1.1); } -#top .social a:hover.facebook { - background-color: #4460ae; + +ul.social a.facebook { + background: #4561ae; } -#top .social a:hover.gplus { - background-color: #c21f25; + +ul.social a.gplus { + background: #c22026; } -#top .social a:hover.twitter { - background-color: #3cf; + +ul.social a.twitter { + background: #34ccff; } -#top .social a:hover.instagram { - background-color: #cd4378; + +ul.social a.email { + background: #4b8046; } -#top .social a:hover.email { - background-color: #4a7f45; + +.showcase { + color: #555; } -#top .login { - float: right; + +.showcase .icon-outlined { + border-color: #555; } -#top .login a { - font-size: 12px; - color: #eeeeee; - margin-right: 15px; - text-decoration: none; + +.showcase .counter { + margin-bottom: 20px; + display: inline-block; + margin-top: 0; +} + +.showcase h4 { text-transform: uppercase; - font-weight: 700; - letter-spacing: 0.10em; + letter-spacing: 0.1em; + font-size: 0.935rem; + margin-top: 0; } -@media (max-width: 767px) { - #top .login { - float: left; - } + +.form-control { + border-radius: 0; } -#top.light { - background: #fff; - color: #999999; - border-bottom: solid 1px #eeeeee; + +.form-control:focus { + border-color: #da4d4d; + -webkit-box-shadow: 0 0 0 0.2rem rgba(218, 77, 77, 0.25); + box-shadow: 0 0 0 0.2rem rgba(218, 77, 77, 0.25); } -#top.light .login a { - color: #555555; + +.form-group label { + color: #555; } -.navbar { + +.card-primary { + border-radius: 0; + border-color: #da4d4d; +} + +.card-primary .card-header { + background: #da4d4d; + color: #fff; border: none; + border-radius: 0; } -.navbar ul.nav > li > a { + +.card-primary .card-header a { + color: #fff; text-transform: uppercase; - text-decoration: underline; - font-weight: bold; - letter-spacing: 0.08em; - border-top: solid 5px transparent; -} -.navbar ul.nav > li > a:hover { - border-top: solid 5px #da4d4d; + font-weight: 300; + letter-spacing: 0.05em; } -.navbar ul.nav > li.active > a, -.navbar ul.nav > li.open > a { - text-decoration: none !important; - border-top: solid 5px #a02121; + +.card-primary .card-body { + border-color: #da4d4d; } -@media (max-width: 768px) { - .navbar ul.nav > li.active > a, - .navbar ul.nav > li.open > a { - border-top-color: transparent; - } - .navbar ul.nav > li > a:hover { - border-top-color: transparent; - } + +.card-body li { + font-size: 0.9rem; } -.navbar.navbar-light ul.nav > li.active > a { - border-top: solid 5px #a02121; - background: #fff !important; - color: #555555 !important; + +table { + font-size: 0.9rem; } -.navbar.navbar-light ul.nav > li.active > a:hover { - border-top: solid 5px #a02121; + +table img { + min-width: 50px !important; + max-width: 50px !important; + height: 50px; } -.navbar.navbar-light ul.nav > li > a:hover, -.navbar.navbar-light ul.nav > li.open > a:hover, -.navbar.navbar-light ul.nav > li > a:focus, -.navbar.navbar-light ul.nav > li.open > a:focus { - border-top: solid 5px #da4d4d; - background: #fff !important; - color: #555555 !important; + +table input[type="number"] { + max-width: 50px; } -.navbar ul.dropdown-menu { - margin: 0; - padding: 0; + +.nav-tabs { + border-bottom: none; } -.navbar ul.dropdown-menu li { - list-style-type: none; - border-bottom: solid 1px #eeeeee; - text-transform: uppercase; - letter-spacing: 0.08em; - padding: 4px 0; + +.nav-tabs a.nav-link { + border-radius: 0 !important; + font-size: 0.9rem; } -.navbar ul.dropdown-menu li a { - position: relative; - color: #999999; - font-size: 12px; - display: block; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - left: 0; + +.tab-content { + padding: 20px; + border: 1px solid #ddd; + font-size: 0.9rem; } -.navbar ul.dropdown-menu li a:hover { - color: #da4d4d; - text-decoration: none; - background: none; - left: 2px; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.top-bar { + background: #555; + color: #fff; + font-size: 0.9rem; + padding: 10px 0; } -@media (max-width: 767px) { - .navbar ul.dropdown-menu li a:hover { - left: 0; - } + +.top-bar.top-bar-light { + background: #fff; + color: #555; + border-bottom: 1px solid #ddd; } -.navbar .yamm-content h3 { - font-size: 18px; - text-transform: uppercase; - padding-bottom: 10px; - margin-top: 5px; - border-bottom: dotted 1px #555555; - letter-spacing: 0.08em; + +.top-bar.top-bar-light a.login-btn, .top-bar.top-bar-light a.signup-btn { + color: #555 !important; } -@media (max-width: 767px) { - .navbar .yamm-content h3 { - font-size: 14px; - } + +.top-bar.top-bar-light a.login-btn span, .top-bar.top-bar-light a.signup-btn span { + display: inline-block; } -.navbar .yamm-content h5 { - text-transform: uppercase; - padding-bottom: 10px; - border-bottom: dotted 1px #555555; - letter-spacing: 0.08em; + +.top-bar p { + margin-bottom: 0; + font-size: 0.75rem; } -.navbar .yamm-content ul { - margin: 0; - padding: 0; + +.top-bar ul { + margin-bottom: 0; } -.navbar .yamm-content ul li { - list-style-type: none; - border-bottom: solid 1px #eeeeee; + +.top-bar a.login-btn, .top-bar a.signup-btn { + color: #eee; text-transform: uppercase; - padding: 4px 0; -} -.navbar .yamm-content ul li a { - position: relative; - color: #999999; - font-size: 12px; - display: block; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + letter-spacing: 0.1em; + text-decoration: none !important; + font-size: 0.75rem; + font-weight: 700; + margin-right: 10px; } -.navbar .yamm-content ul li a:hover { - color: #da4d4d; - text-decoration: none; - padding-left: 2px; + +.top-bar a.login-btn i, .top-bar a.signup-btn i { + margin-right: 10px; } -.navbar .yamm-content .banner { - margin-bottom: 10px; + +.top-bar ul.social-custom { + margin-left: 20px; } -.navbar .yamm-fw .dropdown-menu { + +.top-bar ul.social-custom li { padding: 0; + margin: 0; } -.navbar .navbar-buttons { - float: right; + +.top-bar ul.social-custom a { + text-decoration: none !important; + font-size: 0.7rem; + width: 26px; + height: 26px; + line-height: 26px; + color: #999; + text-align: center; + border-radius: 50%; + margin: 0; } -.navbar .navbar-buttons button, -.navbar .navbar-buttons a.btn, -.navbar .navbar-buttons .btn-default.navbar-toggle { - margin-top: 11px; - margin-bottom: 11px; - margin-left: 0; - margin-right: 5px; -} -.navbar .btn-default, -.navbar .btn-default.navbar-toggle { - color: #999999; - background-color: #fff; - margin-left: 7px; - margin-right: 0; -} -.navbar .btn-default:hover, -.navbar .btn-default.navbar-toggle:hover, -.navbar .btn-default:focus, -.navbar .btn-default.navbar-toggle:focus { - background-color: #fff; - border-color: #da4d4d; - color: #da4d4d; + +.top-bar ul.social-custom a:hover { + background: #da4d4d; + color: #fff; } -.navbar #search { - clear: both; - border-top: solid 1px #da4d4d; - text-align: right; + +.top-bar .contact-info { + margin-right: 20px; } -.navbar #search form { - float: right; + +.top-bar .contact-info a { + font-size: 0.8rem; } -.navbar #search form .input-group { - width: 500px; + +.modal .modal-header h4 { + text-transform: uppercase; + letter-spacing: 0.1em; } -@media (max-width: 768px) { - .navbar #search form .input-group { - width: 100%; - } + +.modal input::-moz-placeholder { + font-size: 0.85rem; } -.navbar #basket-overview a { - margin-left: 7px; + +.modal input::-webkit-input-placeholder { + font-size: 0.85rem; } -.navbar-affixed-top { - top: -32px; + +.modal input:-ms-input-placeholder { + font-size: 0.85rem; } -.navbar-affixed-top.affix-top { - -webkit-transition: all 0.5s ease-out; - -moz-transition: all 0.5s ease-out; - transition: all 0.5s ease-out; + +.modal p { + font-size: 0.85rem; } -.navbar-affixed-top.affix { + +header.nav-holder.sticky { position: fixed; - width: 100%; top: 0; - z-index: 1000; - -webkit-box-shadow: 0 0 5px #cccccc; - box-shadow: 0 0 5px #cccccc; - -webkit-transition: all 0.5s ease-out; - -moz-transition: all 0.5s ease-out; - transition: all 0.5s ease-out; + left: 0; + width: 100%; + background: #fff; + z-index: 999; + -webkit-box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); + box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); } -body.boxed .navbar-affixed-top.affix { - position: static; + +#navbar { + background: #fff; + padding-top: 0; + padding-bottom: 0; } -#login-modal { - overflow: hidden; + +#navbar .navbar-toggler { + font-size: 0.9rem; + padding: 10px 15px; + border-color: #ddd; } -#login-modal .modal-header h4 { - text-transform: uppercase; + +#navbar ul ul a { + padding-left: 0 !important; } -#login-modal form { - margin-bottom: 20px; + +#navbar .dropdown-menu { + border-radius: 0; + -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); + box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); + margin-top: 0; + padding-top: 0; + padding-bottom: 0; +} + +#navbar .dropdown-menu .dropdown-item { + padding: 0; } -#login-modal a { + +#navbar .dropdown-menu h5 { + text-transform: uppercase; + letter-spacing: 0.1em; + padding-bottom: 5px; + border-bottom: 1px dotted #ccc; + margin-top: .7rem; + margin-bottom: .5rem; +} + +#navbar .dropdown-menu a.nav-link { + font-size: 0.75rem; + letter-spacing: 0.1em; + text-transform: uppercase !important; + border-bottom: 1px solid #eee; + padding: 15px 20px !important; +} + +#navbar .dropdown-menu a.nav-link:hover { + -webkit-transform: translateX(5px); + transform: translateX(5px); color: #da4d4d; } -#login-modal p { - font-weight: 300; - margin-bottom: 20px; - font-size: 13px; + +#navbar .dropdown-submenu { + position: relative; } -/* buttons */ -.btn { - font-weight: 700; - font-family: "Roboto", Helvetica, Arial, sans-serif; - text-transform: uppercase; - letter-spacing: 0.08em; - padding: 6px 12px; - font-size: 13px; - line-height: 1.42857143; - border-radius: 0; + +#navbar .dropdown-submenu > .dropdown-menu { + top: 0; + left: 100%; + margin-top: -2px; + font-size: 1em; } -.input-group .btn { - font-size: 14px; + +#navbar .menu-large { + position: static !important; } -.btn-lg { - padding: 10px 16px; - font-size: 14px; - line-height: 1.33; - border-radius: 0; + +#navbar .menu-large .megamenu { + padding: 20px; + width: 100%; + max-width: 1140px; + left: 50%; + -webkit-transform: translateX(-50%); + transform: translateX(-50%); + margin-top: -1px; +} + +#navbar .menu-large a.nav-link { + padding: 7px !important; + padding-left: 0 !important; +} + +#navbar .navbar-nav > li.active > a { + background: #da4d4d !important; + color: #fff !important; + text-decoration: none !important; + border-color: #ca2a2a !important; } -.btn-sm { - padding: 5px 10px; - font-size: 12px; - line-height: 1.5; - border-radius: 0; + +#navbar .navbar-nav > li > a { + margin: 0; + padding: 1.4rem 1rem 1.6rem; + color: #555; + font-weight: 600; + text-transform: uppercase; + letter-spacing: 0.1em; + font-size: 0.9rem; + text-decoration: none; + border-top: .3rem solid transparent; } -.btn-xs { - padding: 1px 5px; - font-size: 12px; - line-height: 1.5; - border-radius: 0; + +#navbar .navbar-nav > li > a:hover { + background: rgba(218, 77, 77, 0.5); + border-color: rgba(218, 77, 77, 0.8); +} + +#navbar .navbar-nav > li > a:focus { + background: #da4d4d !important; + color: #fff !important; + text-decoration: none !important; + border-color: #ca2a2a !important; +} + +#navbar.nav-light .navbar-nav > li.active a.dropdown-toggle, +#navbar.nav-light .navbar-nav > li.active a.dropdown-toggle:hover { + background: none !important; + color: #555 !important; + text-decoration: underline !important; + border-color: #da4d4d !important; +} + +#navbar.nav-light .navbar-nav > li > a:hover { + background: none !important; + border-color: #e78c8c !important; +} + +#navbar.nav-light .navbar-nav > li > a:focus { + background: none !important; + color: #555 !important; + text-decoration: underline !important; + border-color: #da4d4d !important; +} + +@media (max-width: 991px) { + #navbar { + padding-top: 1rem; + padding-bottom: 1rem; + } + #navbar .menu-large .megamenu { + width: 100%; + left: 0 !important; + -webkit-transform: none !important; + transform: none !important; + } + #navbar .navbar-collapse { + max-height: 600px; + overflow-y: auto; + margin-top: 1rem; + } + #navbar .navbar-nav > li > a { + padding: 0 10px; + height: 45px; + line-height: 45px; + border-top: 0; + font-size: 0.85rem; + width: 100%; + } + #navbar .navbar-nav > li > a:hover { + background: rgba(218, 77, 77, 0.5); + border-color: rgba(218, 77, 77, 0.8); + } + #navbar .dropdown-menu { + border: none; + -webkit-box-shadow: none; + box-shadow: none; + } } + +.btn { + text-transform: uppercase; + letter-spacing: 0.1em; +} + .btn-template-main { - color: #da4d4d; - background-color: #ffffff; - border-color: #da4d4d; + background: #da4d4d; + border: 1px solid #da4d4d !important; + color: #fff !important; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-main:hover, -.btn-template-main:focus, -.btn-template-main:active, -.btn-template-main.active, -.open > .dropdown-toggle.btn-template-main { - color: #da4d4d; - background-color: #e6e6e6; - border-color: #c22828; + +.btn-template-main:hover, .btn-template-main:focus { + background: #d63838; + color: #fff !important; + border-color: #d63838 !important; } -.btn-template-main:active, -.btn-template-main.active, -.open > .dropdown-toggle.btn-template-main { - background-image: none; + +.btn-template-white { + background: #fff; + color: #da4d4d !important; + border: 1px solid #da4d4d !important; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-main.disabled, -.btn-template-main[disabled], -fieldset[disabled] .btn-template-main, -.btn-template-main.disabled:hover, -.btn-template-main[disabled]:hover, -fieldset[disabled] .btn-template-main:hover, -.btn-template-main.disabled:focus, -.btn-template-main[disabled]:focus, -fieldset[disabled] .btn-template-main:focus, -.btn-template-main.disabled:active, -.btn-template-main[disabled]:active, -fieldset[disabled] .btn-template-main:active, -.btn-template-main.disabled.active, -.btn-template-main[disabled].active, -fieldset[disabled] .btn-template-main.active { - background-color: #ffffff; - border-color: #da4d4d; + +.btn-template-white:hover, .btn-template-white:focus { + background: #da4d4d !important; + color: #fff !important; } -.btn-template-main .badge { - color: #ffffff; - background-color: #da4d4d; + +.btn-template-outlined { + background: none; + border: 1px solid #da4d4d !important; + color: #da4d4d; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-main:hover, -.btn-template-main:focus, -.btn-template-main:active, -.btn-template-main.active { + +.btn-template-outlined:hover, .btn-template-outlined:focus { background: #da4d4d; - color: #ffffff; - border-color: #da4d4d; + color: #fff !important; } -.btn-template-transparent-primary { - color: #ffffff; - background-color: transparent; - border-color: #ffffff; -} -.btn-template-transparent-primary:hover, -.btn-template-transparent-primary:focus, -.btn-template-transparent-primary:active, -.btn-template-transparent-primary.active, -.open > .dropdown-toggle.btn-template-transparent-primary { - color: #ffffff; - background-color: rgba(0, 0, 0, 0); - border-color: #e0e0e0; -} -.btn-template-transparent-primary:active, -.btn-template-transparent-primary.active, -.open > .dropdown-toggle.btn-template-transparent-primary { - background-image: none; + +.btn-template-outlined-white { + background: none; + border: 1px solid #fff !important; + color: #fff; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-transparent-primary.disabled, -.btn-template-transparent-primary[disabled], -fieldset[disabled] .btn-template-transparent-primary, -.btn-template-transparent-primary.disabled:hover, -.btn-template-transparent-primary[disabled]:hover, -fieldset[disabled] .btn-template-transparent-primary:hover, -.btn-template-transparent-primary.disabled:focus, -.btn-template-transparent-primary[disabled]:focus, -fieldset[disabled] .btn-template-transparent-primary:focus, -.btn-template-transparent-primary.disabled:active, -.btn-template-transparent-primary[disabled]:active, -fieldset[disabled] .btn-template-transparent-primary:active, -.btn-template-transparent-primary.disabled.active, -.btn-template-transparent-primary[disabled].active, -fieldset[disabled] .btn-template-transparent-primary.active { - background-color: transparent; - border-color: #ffffff; + +.btn-template-outlined-white:hover, .btn-template-outlined-white:focus { + background: #fff; + color: #da4d4d !important; } -.btn-template-transparent-primary .badge { - color: transparent; - background-color: #ffffff; + +.btn-template-outlined-black { + background: none; + border: 1px solid #333 !important; + color: #333; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-transparent-primary:hover, -.btn-template-transparent-primary:focus, -.btn-template-transparent-primary:active, -.btn-template-transparent-primary.active { - background: #fff; - color: #da4d4d; - border-color: #fff; + +.btn-template-outlined-black:hover, .btn-template-outlined-black:focus { + background: #333 !important; + color: #fff !important; } -.btn-template-transparent-black { - color: #ffffff; - background-color: transparent; - border-color: #ffffff; -} -.btn-template-transparent-black:hover, -.btn-template-transparent-black:focus, -.btn-template-transparent-black:active, -.btn-template-transparent-black.active, -.open > .dropdown-toggle.btn-template-transparent-black { - color: #ffffff; - background-color: rgba(0, 0, 0, 0); - border-color: #e0e0e0; -} -.btn-template-transparent-black:active, -.btn-template-transparent-black.active, -.open > .dropdown-toggle.btn-template-transparent-black { - background-image: none; + +.features-buttons button { + margin-bottom: 20px; } -.btn-template-transparent-black.disabled, -.btn-template-transparent-black[disabled], -fieldset[disabled] .btn-template-transparent-black, -.btn-template-transparent-black.disabled:hover, -.btn-template-transparent-black[disabled]:hover, -fieldset[disabled] .btn-template-transparent-black:hover, -.btn-template-transparent-black.disabled:focus, -.btn-template-transparent-black[disabled]:focus, -fieldset[disabled] .btn-template-transparent-black:focus, -.btn-template-transparent-black.disabled:active, -.btn-template-transparent-black[disabled]:active, -fieldset[disabled] .btn-template-transparent-black:active, -.btn-template-transparent-black.disabled.active, -.btn-template-transparent-black[disabled].active, -fieldset[disabled] .btn-template-transparent-black.active { - background-color: transparent; - border-color: #ffffff; + +.customers { + margin-bottom: 40px; +} + +.customers .item { + margin: 0 20px; +} + +.customers .item img { + -webkit-filter: grayscale(100%); + filter: grayscale(100%); + -webkit-transition: all 0.3s; + transition: all 0.3s; +} + +.customers .item img:hover { + -webkit-filter: grayscale(0%); + filter: grayscale(0%); } -.btn-template-transparent-black .badge { - color: transparent; - background-color: #ffffff; + +.testimonials .item { + margin: 0 5px; + height: 100%; } -.btn-template-transparent-black:hover, -.btn-template-transparent-black:focus, -.btn-template-transparent-black:active, -.btn-template-transparent-black.active { + +.testimonials .testimonial { + padding: 20px; background: #fff; - color: #000; - border-color: #fff; + height: 100%; } -.btn-template-primary { - color: #ffffff; - background-color: #da4d4d; - border-color: #da4d4d; + +.testimonials .text { + font-size: 0.85rem; +} + +.testimonials .text p { + color: #999; +} + +.testimonials .avatar { + min-width: 60px; + max-width: 60px; + min-height: 60px; + max-height: 60px; + border-radius: 50%; + overflow: hidden; + margin-left: 10px; } -.btn-template-primary:hover, -.btn-template-primary:focus, -.btn-template-primary:active, -.btn-template-primary.active, -.open > .dropdown-toggle.btn-template-primary { - color: #ffffff; - background-color: #ca2a2a; - border-color: #c22828; + +.testimonials .bottom { + width: 100%; } -.btn-template-primary:active, -.btn-template-primary.active, -.open > .dropdown-toggle.btn-template-primary { - background-image: none; + +.testimonials .bottom .testimonial-info { + text-align: right; } -.btn-template-primary.disabled, -.btn-template-primary[disabled], -fieldset[disabled] .btn-template-primary, -.btn-template-primary.disabled:hover, -.btn-template-primary[disabled]:hover, -fieldset[disabled] .btn-template-primary:hover, -.btn-template-primary.disabled:focus, -.btn-template-primary[disabled]:focus, -fieldset[disabled] .btn-template-primary:focus, -.btn-template-primary.disabled:active, -.btn-template-primary[disabled]:active, -fieldset[disabled] .btn-template-primary:active, -.btn-template-primary.disabled.active, -.btn-template-primary[disabled].active, -fieldset[disabled] .btn-template-primary.active { - background-color: #da4d4d; - border-color: #da4d4d; + +.testimonials .bottom h5 { + text-transform: uppercase; + letter-spacing: 0.1em; + margin-bottom: 5px; } -.btn-template-primary .badge { + +.testimonials .bottom p { + font-size: 0.75rem; + color: #999; + margin-bottom: 0; +} + +.testimonials .icon { color: #da4d4d; - background-color: #ffffff; + font-size: 2rem; + margin-right: 20px; } -#intro { - background: url('../img/home.jpg') no-repeat center top; - -webkit-background-size: cover; - -moz-background-size: cover; - -o-background-size: cover; - background-size: cover; + +.testimonials .owl-carousel .owl-stage { + display: -webkit-box !important; + display: -ms-flexbox !important; + display: flex !important; + -webkit-box-align: stretch !important; + -ms-flex-align: stretch !important; + align-items: stretch !important; } -#intro .item { - font-family: "Roboto", Helvetica, Arial, sans-serif; - height: 100%; + +.testimonials .owl-dot.active span { + background: #da4d4d !important; } -#intro .item h1 { - text-transform: uppercase; - font-size: 50px; + +.home-carousel { color: #fff; - margin-bottom: 40px; - letter-spacing: 0.08em; } -@media (max-width: 991px) { - #intro .item h1 { - font-size: 40px; - } + +.home-carousel .owl-carousel { + padding-top: 60px; + padding-bottom: 20px; } -@media (max-width: 767px) { - #intro .item h1 { - font-size: 25px; - } + +.home-carousel h1, .home-carousel h2 { + text-transform: uppercase; + letter-spacing: 0.1em; +} + +.home-carousel li, .home-carousel p { + text-transform: uppercase; + letter-spacing: 0.1em; + font-weight: 700; + font-size: 1.1rem; + margin-bottom: 10px; +} + +.home-carousel p img { + max-width: 200px; +} + +.project .owl-dot.active span { + background: #da4d4d !important; +} + +.project .owl-nav { + position: absolute; + top: 0; + right: 0; + left: auto; + bottom: auto; + width: 100%; + padding: 20px; + text-align: right; +} + +.project .owl-nav .owl-prev, .project .owl-nav .owl-next { + width: 30px; + height: 30px; + line-height: 30px; + background: #fff; + color: #da4d4d; + text-align: center; + border-radius: 50%; + display: inline-block; + margin: 0 5px; + -webkit-transition: all 0.3s; + transition: all 0.3s; } -#intro .item h3 { + +.project .owl-nav .owl-prev:hover, .project .owl-nav .owl-next:hover { + background: #da4d4d; color: #fff; - margin-bottom: 40px; } + @media (max-width: 767px) { - #intro .item h3 { - font-size: 15px; - margin-bottom: 20px; + .home-carousel { + text-align: center !important; } -} -#intro .item .btn { - text-transform: none; -} -@media (max-width: 991px) { - #intro .item .btn { - font-size: 14px; + .home-carousel p, .home-carousel h1, .home-carousel ul { + text-align: center !important; } -} -@media (max-width: 991px) { - #intro .item .carousel-caption { - left: 10%; - right: 10%; + .home-carousel img { + margin: 10px auto; } } -#intro .container, -#intro .row { - height: 100%; - position: relative; + +.owl-thumbs { + display: -webkit-box; + display: -ms-flexbox; + display: flex; } -.jumbotron { - padding: 30px; - margin-bottom: 0; + +.owl-thumbs button { + background: none; + border: none; + margin: 5px; + outline: none; +} + +.home-blog-post { + margin: 15px 0; +} + +.home-blog-post .image { position: relative; - background: url('../img/photogrid.jpg') center center repeat; - background-size: cover; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + margin-bottom: 15px; } -.jumbotron .dark-mask { - position: absolute; - top: 0; - left: 0; + +.home-blog-post .overlay { width: 100%; height: 100%; - background: #da4d4d; - opacity: 0.9; - filter: alpha(opacity=90); + background: rgba(218, 77, 77, 0.6); + position: absolute; + top: 0; + opacity: 0; + -webkit-transition: all 0.5s; + transition: all 0.5s; } -.jumbotron h1, -.jumbotron h2, -.jumbotron h3, -.jumbotron p, -.jumbotron ul { - color: #fff; + +.home-blog-post .overlay a { + -webkit-transform: translateY(30px); + transform: translateY(30px); + opacity: 0; } -.jumbotron h1, -.jumbotron h2, -.jumbotron h3 { - color: #ffffff; - text-transform: uppercase; - letter-spacing: 0.08em; + +.home-blog-post .overlay i { + margin-right: 5px; } -.jumbotron p { + +.home-blog-post .text { + text-align: center; +} + +.home-blog-post .text .intro { + text-align: left; margin-bottom: 20px; - font-size: 21px; - font-weight: 400; + color: #888; + font-size: 0.9rem; } -.jumbotron p.text-uppercase { - font-weight: 700; + +.home-blog-post h4 { + margin: 10px 0; + text-transform: uppercase; + letter-spacing: 0.1em; } -.jumbotron > hr { - border-top-color: #d5d5d5; + +.home-blog-post .author-category { + font-size: 0.75rem; + color: #999; + text-transform: uppercase; + letter-spacing: 0.1em; } -.container .jumbotron { - border-radius: 0; + +.home-blog-post .author-category a { + font-weight: 500; } -.jumbotron .container { - max-width: 100%; - z-index: 2; + +.home-blog-post:hover .overlay { + opacity: 1; } -@media screen and (min-width: 768px) { - .jumbotron { - padding-top: 48px; - padding-bottom: 48px; - } - .container .jumbotron { - padding-left: 60px; - padding-right: 60px; - } - .jumbotron h1, - .jumbotron .h1 { - font-size: 46px; - } + +.home-blog-post:hover .overlay a { + -webkit-transform: none; + transform: none; + opacity: 1; } -#categoryMenu h3 { - padding: 20px; - background: #f7f7f7; - margin: 0; - border-bottom: solid 1px #eeeeee; - text-transform: uppercase; - letter-spacing: 0.08em; + +#blog-listing-big .post, #blog-listing-medium .post { + margin-bottom: 60px; } -.panel.sidebar-menu h3 { - padding: 5px 0; - margin: 0; + +#blog-listing-big .image, #blog-listing-medium .image { + margin-bottom: 15px; } -.panel.sidebar-menu { - background: #fff; - margin: 0 0 20px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; + +#blog-listing-big h2 a, #blog-listing-medium h2 a { + color: #555; + text-transform: uppercase; + letter-spacing: 0.1em; } -.panel.sidebar-menu .panel-heading { + +#blog-listing-big .author-category, #blog-listing-medium .author-category { + color: #999; text-transform: uppercase; + letter-spacing: 0.1em; + font-weight: 300; margin-bottom: 10px; - background: none; - padding: 0; - letter-spacing: 0.08em; - border-bottom: none; + font-size: .9rem; } -.panel.sidebar-menu .panel-heading h1, -.panel.sidebar-menu .panel-heading h2, -.panel.sidebar-menu .panel-heading h3, -.panel.sidebar-menu .panel-heading h4, -.panel.sidebar-menu .panel-heading h5 { - display: inline-block; - border-bottom: solid 5px #da4d4d; - line-height: 1.1; + +#blog-listing-big .author-category a, #blog-listing-medium .author-category a { + font-weight: 500; margin-bottom: 0; - padding-bottom: 10px; } -.panel.sidebar-menu .panel-heading .btn.btn-danger { - color: #fff; - margin-top: 5px; + +#blog-listing-big .date-comments, #blog-listing-medium .date-comments { + margin-bottom: 0; } -.panel.sidebar-menu .panel-body { - padding: 0; + +#blog-listing-big .date-comments a, #blog-listing-medium .date-comments a { + color: #999; + margin-left: 25px; } -.panel.sidebar-menu .panel-body span.colour { - display: inline-block; - width: 15px; - height: 15px; - border: solid 1px #555555; - vertical-align: top; - margin-top: 2px; - margin-left: 5px; + +#blog-listing-big .date-comments i, #blog-listing-medium .date-comments i { + margin-right: 5px; } -.panel.sidebar-menu .panel-body span.colour.white { - background: #fff; + +#blog-listing-big p.intro, #blog-listing-medium p.intro { + margin-top: 10px; + color: #777; } -.panel.sidebar-menu .panel-body span.colour.red { - background: red; + +.pager { + padding: 20px 0; + margin-top: 20px; + border-top: 1px solid #e6e6e6; } -.panel.sidebar-menu .panel-body span.colour.green { - background: green; + +.disabled a, .disabled a:hover { + border-color: #999 !important; + color: #999 !important; + background: none !important; + cursor: not-allowed; } -.panel.sidebar-menu .panel-body span.colour.blue { - background: blue; + +#blog-post #post-content { + margin-bottom: 20px; } -.panel.sidebar-menu .panel-body span.colour.yellow { - background: yellow; + +#blog-post .comment { + margin-bottom: 25px; } -.panel.sidebar-menu .panel-body label { - color: #999999; - font-size: 12px; + +#blog-post .comment .posted { + color: #999; + font-size: 0.8rem; + margin-bottom: 10px; } -.panel.sidebar-menu .panel-body label:hover { - color: #555555; + +#blog-post .comment.last { + margin-bottom: 0; } -.panel.sidebar-menu ul.nav.category-menu { - margin-bottom: 20px; - text-transform: uppercase; - font-weight: 700; - letter-spacing: 0.08em; + +#blog-post .comment p { + font-size: 0.9rem; } -.panel.sidebar-menu ul.nav.category-menu li a { - font-family: "Roboto", Helvetica, Arial, sans-serif; + +#blog-post #comments, #blog-post #comment-form { + padding: 20px 0; + margin-top: 20px; + border-top: solid 1px #eee; } -.panel.sidebar-menu ul.nav ul { - list-style: none; - padding-left: 0; + +#blog-post #comments h4, #blog-post #comment-form h4 { + margin-bottom: 1.5rem; } -.panel.sidebar-menu ul.nav ul li { - display: block; -} -.panel.sidebar-menu ul.nav ul li a { - position: relative; - font-family: "Times New Roman", Times, serif; - font-weight: normal; - text-transform: none !important; - display: block; - padding: 10px 15px; - padding-left: 30px; - font-size: 12px; - color: #999999; -} -.panel.sidebar-menu ul.nav ul li a:hover, -.panel.sidebar-menu ul.nav ul li a:focus { - text-decoration: none; - background-color: #eeeeee; -} -.panel.sidebar-menu ul.tag-cloud { - list-style: none; - padding-left: 0; -} -.panel.sidebar-menu ul.tag-cloud li { - display: inline-block; -} -.panel.sidebar-menu ul.tag-cloud li a { - display: inline-block; - padding: 5px; - border: solid 1px #eeeeee; - border-radius: 0; - color: #da4d4d; - margin: 5px 5px 5px 0; - text-transform: uppercase; - letter-spacing: 0.08em; - font-weight: 700; - font-size: 12px; - text-decoration: none; -} -.panel.sidebar-menu ul.tag-cloud li a:hover { - color: #da4d4d; - border-color: #da4d4d; -} -.panel.sidebar-menu ul.tag-cloud li.active a { - color: #FFFFFF; - background-color: #da4d4d; -} -.panel.sidebar-menu ul.tag-cloud li.active a:hover { - color: #FFFFFF; -} -.panel.sidebar-menu ul.popular, -.panel.sidebar-menu ul.recent { - list-style: none; - padding-left: 0; - padding: 20px 0; -} -.panel.sidebar-menu ul.popular li, -.panel.sidebar-menu ul.recent li { - margin-bottom: 10px; - padding: 5px 0; - border-bottom: dotted 1px #eeeeee; -} -.panel.sidebar-menu ul.popular li:before, -.panel.sidebar-menu ul.recent li:before, -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - content: " "; - display: table; -} -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - clear: both; -} -.panel.sidebar-menu ul.popular li:before, -.panel.sidebar-menu ul.recent li:before, -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - content: " "; - display: table; -} -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - clear: both; -} -.panel.sidebar-menu ul.popular li img, -.panel.sidebar-menu ul.recent li img { - width: 50px; - margin-right: 10px; -} -.panel.sidebar-menu ul.popular li h5, -.panel.sidebar-menu ul.recent li h5 { - margin: 0 0 10px; -} -.panel.sidebar-menu ul.popular li h5 a, -.panel.sidebar-menu ul.recent li h5 a { - font-weight: normal; -} -.panel.sidebar-menu ul.popular li p.date, -.panel.sidebar-menu ul.recent li p.date { - float: right; - font-size: 12px; - color: #999999; -} -.panel.sidebar-menu ul.popular li:last-child, -.panel.sidebar-menu ul.recent li:last-child { - border-bottom: none; -} -.panel.sidebar-menu .text-widget { - font-size: 12px; -} -.panel.sidebar-menu.with-icons ul.nav li a:after { - font-family: 'FontAwesome'; - content: "\f105"; - position: relative; - top: 0; - float: right; -} -/* ribbons for product sales etc. */ -.ribbon { - position: absolute; - top: 50px; - padding-left: 51px; - font-weight: 700; - letter-spacing: 0.08em; -} -.ribbon .ribbon-background { - position: absolute; - top: 0; - right: 0; -} -.ribbon .theribbon { - position: relative; - width: 80px; - padding: 6px 20px 6px 20px; - margin: 30px 10px 10px -71px; - color: #fff; - background-color: #da4d4d; - font-family: "Roboto", Helvetica, Arial, sans-serif; -} -.ribbon .theribbon:before, -.ribbon .theribbon:after { - content: ' '; - position: absolute; - width: 0; - height: 0; -} -.ribbon .theribbon:after { - left: 0px; - top: 100%; - border-width: 5px 10px; - border-style: solid; - border-color: #000000 #000000 transparent transparent; -} -.ribbon.sale { - top: 0; -} -.ribbon.new { - top: 50px; -} -.ribbon.new .theribbon { - background-color: #5bc0de; - text-shadow: 0px 1px 2px #bbb; -} -.ribbon.new .theribbon:after { - border-color: #2390b0 #2390b0 transparent transparent; -} -.ribbon.gift { - top: 100px; -} -.ribbon.gift .theribbon { - background-color: #5cb85c; - text-shadow: 0px 1px 2px #bbb; -} -.ribbon.gift .theribbon:after { - border-color: #357935 #357935 transparent transparent; -} -.owl-carousel .owl-controls .owl-page.active span, -.owl-theme .owl-controls .owl-page.active span, -.owl-carousel .owl-controls.clickable .owl-page:hover span, -.owl-theme .owl-controls.clickable .owl-page:hover span { - background: #da4d4d; -} -.owl-carousel .owl-controls .owl-buttons, -.owl-theme .owl-controls .owl-buttons { - position: absolute; - top: 5px; - right: 0; -} -.owl-carousel .owl-controls .owl-buttons div, -.owl-theme .owl-controls .owl-buttons div { - width: 26px; - height: 26px; - line-height: 25px; - margin: 0 5px 0 0; - font-size: 18px; - color: #da4d4d; - padding: 0; - background: #fff; - border-radius: 13px; - vertical-align: middle; - text-align: center; - opacity: 1; - filter: alpha(opacity=100); -} -.home-carousel { - position: relative; - background: url('../img/photogrid.jpg') center center repeat; - background-size: cover; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -.home-carousel .dark-mask { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: #da4d4d; - opacity: 0.9; - filter: alpha(opacity=90); -} -.home-carousel .owl-carousel { - padding-top: 60px; - padding-bottom: 20px; -} -.home-carousel .owl-theme .owl-controls .owl-page span { - background: #666; -} -.home-carousel .owl-theme .owl-controls .owl-page.active span { - background: #fff; -} -.home-carousel .owl-theme .owl-controls .owl-page:hover span { - background: #fff; -} -@media (max-width: 767px) { - .home-carousel { - text-align: center !important; - } -} -@media (min-width: 992px) { - .home-carousel .right { - text-align: right; - } -} -.home-carousel h1, -.home-carousel h2, -.home-carousel h3, -.home-carousel p, -.home-carousel ul { - color: #fff; -} -.home-carousel h1 { - font-weight: 700; - text-transform: uppercase; - font-size: 46px; - letter-spacing: 0.08em; -} -@media (max-width: 991px) { - .home-carousel h1 { - font-size: 36px; - } -} -.home-carousel h2 { - font-weight: 700; - text-transform: uppercase; - font-size: 40px; - letter-spacing: 0.08em; -} -.home-carousel ul, -.home-carousel p { - font-size: 18px; - font-weight: 700; - padding: 0; - text-transform: uppercase; - letter-spacing: 0.10em; -} -@media (max-width: 991px) { - .home-carousel ul, - .home-carousel p { - font-size: 14px; - } -} -.home-carousel ul li { - margin-bottom: 10px; -} -.customers { - padding: 0; - margin-bottom: 40px; -} -.customers .item { - list-style-type: none; - text-align: center; - margin: 0 20px; -} -.customers .item img { - display: inline-block; - filter: url("data:image/svg+xml;utf8,#grayscale"); - /* Firefox 10+, Firefox on Android */ - filter: gray; - /* IE6-9 */ - -webkit-filter: grayscale(100%); - /* Chrome 19+, Safari 6+, Safari 6+ iOS */ - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -.customers .item img:hover { - max-width: auto; - filter: none; - -webkit-filter: none; -} -.testimonials { - padding: 0; - margin-bottom: 40px; -} -.testimonials .item { - list-style-type: none; - margin: 0 5px; - background: #fff; - padding-bottom: 60px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; -} -.testimonials .item .testimonial { - position: relative; - padding: 20px; -} -.testimonials .item .testimonial:before, -.testimonials .item .testimonial:after { - content: " "; - display: table; -} -.testimonials .item .testimonial:after { - clear: both; -} -.testimonials .item .testimonial:before, -.testimonials .item .testimonial:after { - content: " "; - display: table; -} -.testimonials .item .testimonial:after { - clear: both; -} -.testimonials .item .testimonial .text { - color: #999999; - margin-bottom: 40px; -} -.testimonials .item .testimonial .bottom { - position: absolute; - left: 0; - bottom: 0; - width: 100%; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - padding: 20px; - height: 50px; -} -.testimonials .item .testimonial .bottom .icon { - color: #da4d4d; - font-size: 30px; - float: left; - width: 20%; -} -.testimonials .item .testimonial .name-picture { - float: right; - width: 80%; - text-align: right; -} -.testimonials .item .testimonial .name-picture h5 { - font-size: 14px; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.testimonials .item .testimonial .name-picture p { - color: #999999; - margin: 0; - font-size: 12px; -} -.testimonials .item .testimonial .name-picture img { - float: right; - width: 60px; - border-radius: 30px; - margin-left: 10px; -} -.team-member { - text-align: center; - margin-bottom: 40px; -} -.team-member h3 { - font-size: 18px; - text-transform: uppercase; - margin-bottom: 5px; - letter-spacing: 0.08em; -} -.team-member h3 a { - color: #555555; -} -.team-member p.role { - color: #999999; - font-size: 12px; - text-transform: uppercase; - letter-spacing: 0.06em; -} -.team-member .social { - margin-bottom: 20px; -} -.team-member .social a { - margin: 0 10px 0 0; - color: #fff; - display: inline-block; - width: 26px; - height: 26px; - border-radius: 13px; - line-height: 26px; - font-size: 15px; - text-align: center; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - vertical-align: bottom; -} -.team-member .social a i { - vertical-align: bottom; - line-height: 26px; -} -.team-member .social a.facebook { - background-color: #4460ae; -} -.team-member .social a.gplus { - background-color: #c21f25; -} -.team-member .social a.twitter { - background-color: #3cf; -} -.team-member .social a.instagram { - background-color: #cd4378; -} -.team-member .social a.email { - background-color: #4a7f45; -} -.team-member .text p { - color: #999999; - font-size: 12px; -} -.team-member .social, -.team-member-detail .social { + +#blog-post #comment-form { margin-bottom: 20px; } -.team-member .social a, -.team-member-detail .social a { - margin: 0 10px 0 0; - color: #fff; - display: inline-block; - width: 26px; - height: 26px; - border-radius: 13px; - line-height: 26px; - font-size: 15px; - text-align: center; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - vertical-align: bottom; -} -.team-member .social a i, -.team-member-detail .social a i { - vertical-align: bottom; - line-height: 26px; -} -.team-member .social a.facebook, -.team-member-detail .social a.facebook { - background-color: #4460ae; -} -.team-member .social a.gplus, -.team-member-detail .social a.gplus { - background-color: #c21f25; -} -.team-member .social a.twitter, -.team-member-detail .social a.twitter { - background-color: #3cf; -} -.team-member .social a.instagram, -.team-member-detail .social a.instagram { - background-color: #cd4378; -} -.team-member .social a.email, -.team-member-detail .social a.email { - background-color: #4a7f45; + +#blog-post .reply i { + margin-right: 5px; } + .box-simple { - text-align: center; margin-bottom: 40px; + text-align: center; +} + +.box-simple:hover .icon-outlined { + -webkit-transform: scale(1.1); + transform: scale(1.1); } -.box-simple .icon { + +.box-simple .icon-outlined { color: #da4d4d; - border-color: #da4d4d; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + border: 1px solid #da4d4d; + -webkit-transition: all 0.3s; + transition: all 0.3s; } + .box-simple h3 { - font-weight: normal; - font-size: 18px; text-transform: uppercase; - line-height: 1.5; - color: #555555; - font-weight: 800; - letter-spacing: 0.08em; -} -.box-simple h3 a { - color: #555555; + letter-spacing: 0.1em; } + .box-simple p { - color: #999999; -} -.box-simple:hover .icon { - -webkit-transform: scale(1.1, 1.1); - -ms-transform: scale(1.1, 1.1); - -o-transform: scale(1.1, 1.1); - transform: scale(1.1, 1.1); -} -.box-simple:hover .icon i { - -webkit-transform: scale(1, 1); - -ms-transform: scale(1, 1); - -o-transform: scale(1, 1); - transform: scale(1, 1); + color: #999; + margin: 20px 0; + font-size: 0.9rem; } + .box-simple.box-white { - padding: 20px; - border: dotted 1px #999999; + border: dotted 1px #999; + padding: 15px 20px; + margin-bottom: 0; } + .box-simple.box-white .icon { - color: #555555; - border-color: transparent; - font-size: 70px; + font-size: 2rem; + margin-bottom: 1rem; +} + +.box-simple.box-white p { + color: #999; + margin-bottom: 5px; } + .box-simple.box-dark { - padding: 20px; - border: dotted 1px #999999; - background: #555555; + border: dotted 1px #999; + padding: 15px 20px; + margin-bottom: 0; color: #fff; + background: #555; } + .box-simple.box-dark .icon { - color: #f7f7f7; - border-color: transparent; - font-size: 70px; -} -.box-simple.box-dark h3 { - color: #fff; -} -.box-simple.box-dark h3 a { - color: #fff; + font-size: 2rem; + margin-bottom: 1rem; } + .box-simple.box-dark p { + margin-bottom: 5px; color: #fff; } -.box-image { - position: relative; - overflow: hidden; - text-align: center; - margin: 15px 0; + +.same-height div[class*="col-"] { + margin-bottom: 30px; } -.box-image .bg { - position: absolute; - top: auto; - bottom: 0; - width: 100%; + +.same-height .box-white, .same-height.box-dark { height: 100%; - opacity: 0; - filter: alpha(opacity=0); - background: #da4d4d; } -.box-image .name { - position: absolute; - width: 100%; - height: 50%; - bottom: 0; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image .name h3 { - color: #fff; - text-transform: uppercase; - font-size: 18px; - letter-spacing: 0.08em; -} -.box-image .name h3 a { - color: #fff; - text-decoration: none; -} -.box-image .text { - position: absolute; - width: 100%; - height: 50%; - top: 0; - -webkit-transform: translate(0, -150%); - -ms-transform: translate(0, -150%); - -o-transform: translate(0, -150%); - transform: translate(0, -150%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image:hover .bg { - opacity: 0.7; - filter: alpha(opacity=70); -} -.box-image:hover .name { - position: absolute; - -webkit-transform: translate(0, -75%); - -ms-transform: translate(0, -75%); - -o-transform: translate(0, -75%); - transform: translate(0, -75%); -} -.box-image:hover .text { - position: absolute; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); -} -.box-image-text { - position: relative; - overflow: hidden; - text-align: center; - margin: 15px 0; -} -.box-image-text .top { + +.box-image { position: relative; - margin-bottom: 10px; -} -.box-image-text .top .bg { - position: absolute; - top: auto; - bottom: 0; - width: 100%; - height: 100%; - opacity: 0; - filter: alpha(opacity=0); - background: #da4d4d; -} -.box-image-text .top .name { - position: absolute; - width: 100%; - height: 50%; - bottom: 0; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image-text .top .name h3 { - color: #fff; - text-transform: uppercase; - font-size: 18px; - letter-spacing: 0.08em; -} -.box-image-text .top .name h3 a { - color: #fff; - text-decoration: none; -} -.box-image-text .top .text { - position: absolute; - width: 100%; - height: 50%; - top: 0; - -webkit-transform: translate(0, -150%); - -ms-transform: translate(0, -150%); - -o-transform: translate(0, -150%); - transform: translate(0, -150%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image-text .content h3, -.box-image-text .content h4 { - text-transform: uppercase; - line-height: 1.5; - color: #555555; - font-weight: 800; - letter-spacing: 0.08em; -} -.box-image-text .content p { - color: #999999; -} -.box-image-text:hover .bg { - opacity: 0.7; - filter: alpha(opacity=70); -} -.box-image-text:hover .name { - position: absolute; - -webkit-transform: translate(0, -75%); - -ms-transform: translate(0, -75%); - -o-transform: translate(0, -75%); - transform: translate(0, -75%); -} -.box-image-text:hover .text { - position: absolute; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); -} -/* universal box */ -.box { - background: #fff; - margin: 0 0 30px; - border: solid 1px #ccc; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - padding: 20px 0; - border-left: none; - border-right: none; -} -.box .box-header { - background: #f7f7f7; - margin: -20px 0 20px; - padding: 20px; - border-bottom: solid 1px #eeeeee; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.box .box-header:before, -.box .box-header:after { - content: " "; - display: table; -} -.box .box-header:after { - clear: both; -} -.box .box-header:before, -.box .box-header:after { - content: " "; - display: table; -} -.box .box-header:after { - clear: both; -} -.box .box-footer { - background: #f7f7f7; - margin: 30px 0 -20px; - padding: 20px; - border-top: solid 1px #eeeeee; -} -.box .box-footer:before, -.box .box-footer:after { - content: " "; - display: table; -} -.box .box-footer:after { - clear: both; + margin: 20px 0; } -.box .box-footer:before, -.box .box-footer:after { - content: " "; - display: table; + +.box-image:hover .overlay { + opacity: 1; } -.box .box-footer:after { - clear: both; + +.box-image:hover h3, .box-image:hover p, .box-image:hover .buttons { + opacity: 1; + -webkit-transform: none; + transform: none; } -@media (max-width: 991px) { - .box .box-footer .btn { - margin-bottom: 20px; - } + +.box-image:hover p { + -webkit-transition-delay: 0.1s; + transition-delay: 0.1s; } -.box.no-border { - border: none; + +.box-image:hover .buttons { + -webkit-transition-delay: 0.2s; + transition-delay: 0.2s; } -#heading-breadcrumbs { - background: url('../img/texture-bw.png') center center repeat; - padding: 20px 0; - margin-bottom: 40px; + +.box-image .name { + margin-bottom: 20px; } -#heading-breadcrumbs.no-mb { - margin-bottom: 0; + +.box-image a { + text-decoration: none !important; } -#heading-breadcrumbs h1 { - color: #333333; + +.box-image h3 { + font-size: 1.125rem; text-transform: uppercase; - font-size: 30px; - font-weight: 700; - letter-spacing: 0.08em; -} -@media (max-width: 991px) { - #heading-breadcrumbs h1 { - text-align: center; - } -} -#heading-breadcrumbs ul.breadcrumb { - margin-top: 5px; - margin-bottom: 0; -} -.bar { - position: relative; - background: #da4d4d; - padding: 60px 0; -} -.bar.background-pentagon { - background: url('../img/texture-bw.png') center center repeat; - border-top: solid 1px #999999; - border-bottom: solid 1px #999999; -} -.bar.background-gray { - background: #eeeeee; -} -.bar.background-gray-dark { - background: #555555; -} -.bar.background-white { - background: #fff; -} -.bar.background-image-fixed-1 { - background: url('../img/fixed-background-1.jpg') center top no-repeat; - background-attachment: fixed; - background-size: cover; -} -.bar.background-image-fixed-2 { - background: url('../img/fixed-background-2.jpg') center top no-repeat; - background-attachment: fixed; - background-size: cover; -} -.bar.color-white h1, -.bar.color-white h2, -.bar.color-white h3, -.bar.color-white h4, -.bar.color-white h5, -.bar.color-white h6, -.bar.color-white p { - color: #fff; -} -.bar.padding-big { - padding: 50px 0; -} -.bar.padding-horizontal { - padding-left: 30px; - padding-right: 30px; -} -.bar.margin-vertical { - margin-top: 20px; - margin-bottom: 20px; + letter-spacing: 0.1em; + -webkit-transition: all 0.3s; + transition: all 0.3s; + opacity: 0; + -webkit-transform: translateY(-50px); + transform: translateY(-50px); } -.bar .dark-mask { + +.box-image .overlay { + width: 100%; + height: 100%; position: absolute; top: 0; left: 0; - width: 100%; - height: 100%; - background: #000; - opacity: 0.3; - filter: alpha(opacity=30); -} -.portfolio.no-space { - padding: 0 15px; -} -.portfolio.no-space .box-image { - margin: 0 -15px; -} -.portfolio-project .project-more h4 { - color: #555555; - text-transform: uppercase; - margin-bottom: 0; - text-align: left; - font-size: 14px; - letter-spacing: 0.08em; -} -.portfolio-project .project-more p { - color: #999999; - padding: 10px 0; - margin-bottom: 20px; - text-align: left; -} -.portfolio-showcase { - margin: 15px 0 60px; -} -.portfolio-showcase h3 a { - text-transform: uppercase; - line-height: 1.5; - letter-spacing: 0.08em; + background: rgba(218, 77, 77, 0.6); + padding: 20px; + -webkit-transition: all 0.3s; + transition: all 0.3s; + opacity: 0; } -.portfolio-showcase p.lead { - color: #555555; - margin-bottom: 20px; + +.box-image .buttons { + opacity: 0; + -webkit-transition: all 0.3s; + transition: all 0.3s; + -webkit-transform: translateY(20px); + transform: translateY(20px); +} + +.box-image .buttons a { + margin: 0 3px; +} + +.box-image p { + -webkit-transition: all 0.3s; + transition: all 0.3s; + opacity: 0; + -webkit-transform: translateY(20px); + transform: translateY(20px); } -.portfolio-showcase p { - color: #999999; + +.box-image-text .content { + text-align: center; } -.portfolio-showcase p.buttons { - margin-top: 40px; + +.box-image-text p { + color: #777; + font-size: 0.9rem; } + .see-more { - text-align: center; - margin-top: 20px; - padding-top: 20px; + margin-top: 40px; } + .see-more p { - font-size: 28px; + font-size: 1.8rem; font-weight: 100; - margin-bottom: 20px; -} -.showcase .item { - text-align: center; } -.showcase .item .icon { - display: inline-block; - width: 50px; - height: 50px; - color: #555555; - line-height: 50px; - border-radius: 25px; - border: solid 1px #555555; -} -.showcase .item h4 { - color: #555555; - text-transform: uppercase; - letter-spacing: 0.08em; - line-height: 1.5; - font-size: 16px; -} -.showcase .item h4 span { - font-weight: bold; - font-size: 51px; + +.box { + margin: 80px 0; + border-top: 1px solid #ddd; + border-bottom: 1px solid #ddd; + padding: 20px; } -.packages .package { - background: #fff; + +.box a.btn { margin-top: 25px; - margin-bottom: 20px; - padding-bottom: 15px; - text-align: center; - border: solid 1px #da4d4d; - overflow: hidden; -} -.packages .package .package-header { - height: 57px; - color: #fff; - line-height: 57px; - background: #da4d4d; -} -.packages .package .package-header h5 { - color: #fff; - text-transform: uppercase; - font-weight: bold; - line-height: 57px; - margin: 0; - letter-spacing: 0.08em; -} -.packages .package .package-header.light-gray { - background: #eeeeee; -} -.packages .package .package-header.light-gray h5 { - color: #555555; -} -.packages .package .price { - line-height: 120px; - height: 100px; - color: #fff; - font-weight: 400; -} -.packages .package .price h4 { - display: inline; - font-size: 50px; - line-height: normal; - margin-bottom: 0; -} -.packages .package .price .period { - line-height: normal; - color: #999999; -} -.packages .package ul { - padding: 0; -} -.packages .package ul li { - list-style-type: none; - padding-top: 10px; - padding-bottom: 10px; - width: 80%; - margin: auto; - border-bottom: 1px dotted #ccc; -} -.packages .package ul li:last-child { - border-bottom: 0; -} -.packages .package ul li i { - font-size: 13px; - margin-right: 5px; -} -.packages .best-value .package { - margin-top: 0; - padding-bottom: 40px; -} -.packages .best-value .package .package-header { - height: 72px; - padding-top: 17px; - height: 82px !important; -} -.packages .best-value .package .package-header h5 { - font-weight: bold; - line-height: 29px; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.packages .best-value .package .package-header .meta-text { - font-size: 13px; - line-height: 15px; -} -#map { - height: 300px; -} -#map.with-border { - border-top: solid 1px #da4d4d; - border-bottom: solid 1px #da4d4d; -} -#blog-listing-big .post, -#blog-homepage .post { - margin-bottom: 60px; } -#blog-listing-big .post h2, -#blog-homepage .post h2, -#blog-listing-big .post h4, -#blog-homepage .post h4 { - text-transform: uppercase; - letter-spacing: 0.08em; -} -#blog-listing-big .post h2 a, -#blog-homepage .post h2 a, -#blog-listing-big .post h4 a, -#blog-homepage .post h4 a { - color: #555555; -} -#blog-listing-big .post h2 a:hover, -#blog-homepage .post h2 a:hover, -#blog-listing-big .post h4 a:hover, -#blog-homepage .post h4 a:hover { - color: #da4d4d; -} -#blog-listing-big .post .author-category, -#blog-homepage .post .author-category { - color: #999999; + +.box .box-header { + background: #f7f7f7; + margin: 20px 0 20px; + padding: 20px; + border-top: 1px solid #eee; text-transform: uppercase; - font-weight: 300; - letter-spacing: 0.08em; -} -#blog-listing-big .post .author-category a, -#blog-homepage .post .author-category a { - font-weight: 500; -} -#blog-listing-big .post .date-comments a, -#blog-homepage .post .date-comments a { - color: #999999; - margin-right: 20px; + letter-spacing: 0.1em; } -#blog-listing-big .post .date-comments a:hover, -#blog-homepage .post .date-comments a:hover { - color: #da4d4d; + +.box .box-footer { + background: #f7f7f7; + margin-top: 30px; + padding: 20px; + border-top: 1px solid #eee; } -@media (min-width: 768px) { - #blog-listing-big .post .date-comments, - #blog-homepage .post .date-comments { - text-align: right; - } + +.box.shipping-method, .box.payment-method { + margin: 0; + margin-bottom: 20px; } -#blog-listing-big .post .intro, -#blog-homepage .post .intro { - text-align: left; + +.box.shipping-method h4, .box.payment-method h4 { + text-transform: uppercase; + letter-spacing: 0.1em; + margin-bottom: 5px; } -#blog-listing-big .post .image, -#blog-homepage .post .image { - margin-bottom: 10px; - overflow: hidden; + +.box.shipping-method p, .box.payment-method p { + font-size: 0.9rem; + color: #555; } -#blog-listing-big .post .image img, -#blog-homepage .post .image img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.box-image-text { + margin: 15px 0; } -@media (max-width: 767px) { - #blog-listing-big .post .image img.img-responsive, - #blog-homepage .post .image img.img-responsive { - min-width: 100%; - } + +.box-image-text .image { + position: relative; + margin-bottom: 15px; } -#blog-listing-big .post .video, -#blog-homepage .post .video { - margin-bottom: 10px; + +.box-image-text .overlay { + width: 100%; + height: 100%; + background: rgba(218, 77, 77, 0.6); + position: absolute; + top: 0; + opacity: 0; + -webkit-transition: all 0.5s; + transition: all 0.5s; } -#blog-listing-big .post .read-more, -#blog-homepage .post .read-more { - text-align: right; + +.box-image-text .overlay a { + -webkit-transform: translateY(30px); + transform: translateY(30px); + opacity: 0; } -#blog-listing-medium .post { - margin-bottom: 60px; + +.box-image-text .overlay i { + margin-right: 5px; } -#blog-listing-medium .post h2 { - text-transform: uppercase; - margin: 0 0 10px; - font-size: 24px; - letter-spacing: 0.08em; + +.box-image-text .text { + text-align: center; } -#blog-listing-medium .post h2 a { - color: #555555; + +.box-image-text .text .intro { + text-align: left; + margin-bottom: 20px; + color: #888; + font-size: 0.9rem; } -#blog-listing-medium .post h2 a:hover { - color: #da4d4d; + +.box-image-text h4 { + margin: 10px 0; + text-transform: uppercase; + letter-spacing: 0.1em; } -#blog-listing-medium .post .author-category { - float: left; - color: #999999; + +.box-image-text .author-category { + font-size: 0.75rem; + color: #999; text-transform: uppercase; - font-weight: 300; - font-size: 12px; - letter-spacing: 0.08em; + letter-spacing: 0.1em; } -#blog-listing-medium .post .author-category a { + +.box-image-text .author-category a { font-weight: 500; } -#blog-listing-medium .post .date-comments { - float: right; - font-size: 12px; -} -#blog-listing-medium .post .date-comments a { - color: #999999; - margin-right: 20px; -} -#blog-listing-medium .post .date-comments a:hover { - color: #da4d4d; -} -@media (min-width: 768px) { - #blog-listing-medium .post .date-comments { - text-align: right; - } -} -#blog-listing-medium .post .intro { - text-align: left; + +.box-image-text:hover .overlay { + opacity: 1; } -#blog-listing-medium .post .clearfix:before, -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:before, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:before, -#blog-listing-medium .post .navbar-header:after { - content: " "; - display: table; -} -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:after { - clear: both; -} -#blog-listing-medium .post .clearfix:before, -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:before, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:before, -#blog-listing-medium .post .navbar-header:after { - content: " "; - display: table; + +.box-image-text:hover .overlay a { + -webkit-transform: none; + transform: none; + opacity: 1; } -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:after { - clear: both; + +.box-footer a { + margin: 0 !important; } -#blog-listing-medium .post .image { - margin-bottom: 10px; - overflow: hidden; + +.box-footer .right-col i { + margin-left: 5px; } -#blog-listing-medium .post .image img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.box-footer .left-col i { + margin-right: 5px; } + @media (max-width: 767px) { - #blog-listing-medium .post .image img.img-responsive { - min-width: 100%; + .box-footer { + -webkit-box-pack: center !important; + -ms-flex-pack: center !important; + justify-content: center !important; + } + .box-footer a { + margin-bottom: 10px !important; } } -#blog-listing-medium .post .video { - margin-bottom: 10px; + +.jumbotron h1, .jumbotron h2 { + letter-spacing: 0.1em; } -#blog-listing-medium .post .read-more { - text-align: right; + +.jumbotron p { + letter-spacing: 0.1em; + font-size: 1.3rem; +} + +.package { + text-align: center; + border: 1px solid #da4d4d; + margin-top: 25px; + margin-bottom: 20px; + padding-bottom: 15px; + overflow: hidden; } -.box-image-text.blog .author-category { - color: #999999; + +.package .package-header { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + height: 55px; +} + +.package .package-header h5 { + margin: 0; text-transform: uppercase; - letter-spacing: 0.08em; - font-weight: 300; - font-size: 12px; + letter-spacing: 0.1em; + display: inline-block; + color: #555; } -.box-image-text.blog .author-category a { - font-weight: 500; + +.package .package-header .meta-text { + font-size: 0.8rem; } -.box-image-text.blog .intro { - text-align: left; + +.package h4 { + margin-top: 1rem; + margin-bottom: 0; + color: #333; +} + +.package .price-container { margin-bottom: 20px; } -#blog-homepage .post { - margin-bottom: 30px; + +.package .price-container span.period { + color: #777; + font-size: 0.9rem; + margin-left: 10px; } -#blog-homepage .post h2, -#blog-homepage .post h4, -#blog-homepage .post .author-category, -#blog-homepage .post .read-more { - text-align: center; + +.package ul { + padding: 0 30px; } -#blog-homepage .post .read-more { - margin-top: 20px; + +.package ul li { + padding: 10px; + border-bottom: 1px solid #eee; + color: #555; + font-size: 0.9rem; } -#blog-post #post-content { - margin-bottom: 20px; + +.package ul i { + margin-right: 10px; } -#blog-post .comment { - margin-bottom: 25px; + +.best-value .package { + margin-top: 0; + padding-bottom: 40px; + border: 1px solid #da4d4d; } -#blog-post .comment:before, -#blog-post .comment:after { - content: " "; - display: table; + +.best-value .package .package-header { + height: 85px; } -#blog-post .comment:after { - clear: both; + +.best-value .package .package-header h5 { + color: #fff; } -#blog-post .comment:before, -#blog-post .comment:after { - content: " "; - display: table; + +.team-member { + margin-bottom: 40px; } -#blog-post .comment:after { - clear: both; + +.team-member .image { + margin-bottom: 1rem; } -#blog-post .comment .posted { - color: #999999; - font-size: 12px; + +.team-member a { + color: #333; } -#blog-post .comment .reply { - font-family: "Roboto", Helvetica, Arial, sans-serif; + +.team-member a:hover { + color: #333; } -#blog-post .comment.last { + +.team-member h3 { + font-size: 1.125rem; + text-transform: uppercase; + letter-spacing: 0.1em; + margin-bottom: 5px; +} + +.team-member p.role { + font-size: 0.8rem; + text-transform: uppercase; + color: #999; margin-bottom: 0; } -#blog-post #comments, -#blog-post #comment-form { - padding: 20px 0; - margin-top: 20px; - border-top: solid 1px #eeeeee; + +.team-member p { + color: #999; + font-size: 0.8rem; } -#blog-post #comments:before, -#blog-post #comment-form:before, -#blog-post #comments:after, -#blog-post #comment-form:after { - content: " "; - display: table; + +.team-member-detail p:not(.lead) { + color: #555; + font-size: 0.9rem; } -#blog-post #comments:after, -#blog-post #comment-form:after { - clear: both; + +.portfolio p { + color: #fff; } -#blog-post #comments:before, -#blog-post #comment-form:before, -#blog-post #comments:after, -#blog-post #comment-form:after { - content: " "; - display: table; + +.portfolio-project p { + font-size: 0.9rem; + color: #888; } -#blog-post #comments:after, -#blog-post #comment-form:after { - clear: both; + +.portfolio-project .project-more p { + padding: 5px 0; + font-size: 0.85rem; } -#blog-post #comments h4, -#blog-post #comment-form h4 { - margin-bottom: 20px; + +.portfolio-project .project-more h4 { + margin-bottom: 5px; + text-transform: uppercase; + letter-spacing: 0.1em; + font-size: 0.88rem; + color: #555; } -#blog-post #comment-form { - margin-bottom: 20px; + +.portfolio-showcase { + margin-bottom: 60px; +} + +.portfolio-showcase h3 { + text-transform: uppercase; + -webkit-transition-property: 0.1rem; + transition-property: 0.1rem; +} + +.portfolio-showcase .buttons { + margin-top: 40px; +} + +.portfolio-showcase p:not(.lead) { + color: #999; + font-size: 0.9rem; } + +.portfolio-showcase p.lead { + color: #666; +} + .product { - background: #fff; - border-bottom: solid 1px #e6e6e6; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - margin-bottom: 60px; - overflow: hidden; text-align: center; + position: relative; + margin-bottom: 40px; } + .product .image { overflow: hidden; + max-height: 190px; } -.product .image img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -@media (max-width: 767px) { - .product .image img.img-responsive { - min-width: 100%; - } + +.product .image a { + margin: 0; } + .product .text { padding: 10px; + border-bottom: 1px solid #ddd; } + .product .text h3 { - font-size: 14px; - font-weight: 700; - height: 39.6px; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.product .text h3 a { - color: #555555; -} -.product .text h3 a:hover { - text-decoration: none; + min-height: 63px; } -.product .text p.price { - font-size: 18px; + +.product .price { + font-size: 1.1rem; } -.product .text p.price del { - color: #999999; + +.product .price del { + color: #999; + display: inline-block; + margin-right: 5px; } -.product .buttons { - clear: both; - position: absolute; - display: none; - bottom: 0; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - width: 100%; - border: solid 1px transparent; - padding: 20px; - background: rgba(255, 255, 255, 0.9); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - text-align: center; + +.product img { + -webkit-transition: all 0.3s; + transition: all 0.3s; } -.product .buttons .btn { - margin-bottom: 20px; + +.product:hover img { + -webkit-transform: scale(1.1); + transform: scale(1.1); } -.product:hover { - border-bottom: solid 1px #808080; - top: 0; + +.product:hover .text { + border-color: #555; } -.product:hover .buttons { - clear: both; - position: absolute; - top: 0; - background: rgba(255, 255, 255, 0.5); + +.product a { + text-transform: uppercase; + letter-spacing: 0.1em; + color: #333; + text-decoration: none !important; + margin-top: 15px; } -.product:hover .image img { - -webkit-transform: scale(1.1, 1.1); - -ms-transform: scale(1.1, 1.1); - -o-transform: scale(1.1, 1.1); - transform: scale(1.1, 1.1); + +.products-big .image { + min-height: 250px; + max-height: 250px; } + .goToDescription { - font-size: 12px; text-align: center; + font-size: 0.8rem; margin-bottom: 40px; } + .goToDescription a { - color: #999999; + color: #999; text-decoration: underline; } -#productMain { - margin-bottom: 30px; + +table tr td { + vertical-align: middle !important; +} + +#customer-orders a.btn { + margin-top: 0; +} + +#customer-orders table { + font-size: 0.9rem; +} + +#customer-orders th { + border-top: 0; +} + +#customer-order img { + width: 50px; +} + +#customer-order tfoot th { + font-size: 1.2rem; + font-weight: 300; +} + +#customer-order p { + font-size: 1.2rem; + font-weight: 300; +} + +#productMain #thumbs { + margin-top: 30px; +} + +#productMain input { + display: none; } + #productMain .sizes { text-align: center; } -#productMain .sizes h3 { - font-weight: 700; - letter-spacing: 0.08em; - text-transform: uppercase; - margin-bottom: 40px; -} + #productMain .sizes a { - display: inline-block; - width: 40px; - height: 40px; - border-radius: 40px; - background: #ccc; - line-height: 40px; - color: #555555; - text-align: center; - text-decoration: none; - font-family: "Roboto", Helvetica, Arial, sans-serif; + text-decoration: none !important; } -#productMain .sizes a.active, + #productMain .sizes a:hover { background: #da4d4d; color: #fff; } -#productMain .sizes input { - display: none; -} + #productMain .price { - font-size: 40px; text-align: center; - margin-top: 40px; - margin-bottom: 40px; + font-size: 2.5rem; + margin: 30px 0; + color: #555; } -#thumbs a { - display: block; - border: solid 1px transparent; + +#basket thead th { + border-top: none; } -#thumbs a.active { - border-color: #da4d4d; + +#basket tfoot th { + font-size: 1.25rem; + color: #555; } -#product-social { - text-align: center; + +#order-summary tr td { + color: #999; } -#product-social h4 { - font-weight: 300; + +#order-summary tr.total { + font-size: 1.25rem; + color: #555; + font-weight: 700; +} + +#order-summary tr.total td { + color: #555; +} + +#checkout .nav-pills { + margin-bottom: 30px; + border-bottom: 1px solid #da4d4d; +} + +#checkout .nav-pills a { + font-size: 0.9rem; + border-bottom: none !important; +} + +#checkout .nav-pills a.disabled { + cursor: not-allowed; +} + +#checkout form label { + margin-bottom: 5px; +} + +#checkout .payment-method:hover, #checkout .shipping-method:hover { + cursor: pointer; +} + +@media (max-width: 767px) { + .nav-pills { + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + } +} + +.sidebar-menu .badge { + font-weight: 700; + margin: 0; +} + +.sidebar-menu.with-icons a.nav-link { + position: relative; +} + +.sidebar-menu.with-icons a.nav-link::before { + content: '\f105'; + display: inline-block; + position: absolute; + top: 50%; + right: 15px; + -webkit-transform: translateY(-50%); + transform: translateY(-50%); + font-family: 'FontAwesome'; +} + +.panel-heading { margin-bottom: 10px; } -#product-social p { - line-height: 26px; + +.panel-heading h3 { + margin-top: 5px; } -#product-social p a { - margin: 0 10px 0 0; + +.panel-heading .btn { color: #fff; + text-decoration: none !important; +} + +.panel-heading .btn i { + margin-right: 7px; +} + +.panel-body p { + font-size: .9rem; + color: #555; +} + +.panel-body label { + font-size: 0.8rem; + font-weight: 400 !important; + color: #777; + opacity: 0.9; display: inline-block; - width: 26px; - height: 26px; - border-radius: 13px; - line-height: 26px; - font-size: 15px; - text-align: center; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - vertical-align: bottom; + cursor: pointer; } -#product-social p a i { - vertical-align: bottom; - line-height: 26px; + +.panel-body label input { + margin-right: 5px; } -#product-social p a.facebook { - background-color: #4460ae; + +.panel-body label:hover { + opacity: 1; } -#product-social p a.gplus { - background-color: #c21f25; + +.panel-body span.colour { + display: inline-block; + width: 14px; + height: 14px; + margin-top: 10px; + margin-left: 5px; + border: 1px solid #555; } -#product-social p a.twitter { - background-color: #3cf; + +.panel-body span.colour.white { + background: #fff; } -#product-social p a.instagram { - background-color: #cd4378; + +.panel-body span.colour.blue { + background: #007bff; } -#product-social p a.email { - background-color: #4a7f45; + +.panel-body span.colour.green { + background: #28a745; } -@media (max-width: 991px) { - #product-social { - text-align: center; - } + +.panel-body span.colour.red { + background: #dc3545; } -#checkout .nav { - margin-bottom: 20px; - border-bottom: solid 1px #da4d4d; + +.panel-body span.colour.yellow { + background: #ffc107; } -#checkout .nav li { - height: 100%; + +.nav-pills .nav-link { + border-radius: 0; } -#checkout .nav li a { - display: block; - height: 100%; + +.nav-pills .nav-link:hover { + background: #eee; } -#order-summary table { - margin-top: 20px; + +.nav-pills .nav-link.active { + background: #da4d4d; } -#order-summary table td { - color: #999999; + +.panel { + margin-bottom: 20px; } -#order-summary table tr.total td, -#order-summary table tr.total th { - font-size: 18px; - color: #555555; + +.category-menu a.nav-link { + text-transform: uppercase; + letter-spacing: 0.1em; font-weight: 700; } -#checkout .table tbody tr td, -#basket .table tbody tr td, -#customer-order .table tbody tr td { - vertical-align: middle; + +ul ul a.nav-link { + padding-left: 30px !important; + font-size: 0.85rem; + text-transform: none !important; + font-weight: 400 !important; + color: #777; } -#checkout .table tbody tr td input, -#basket .table tbody tr td input, -#customer-order .table tbody tr td input { - width: 50px; - text-align: right; + +.tag-cloud a { + font-size: 0.8rem; + border: 1px solid #eee; + text-transform: uppercase; + letter-spacing: 0.1em; + font-weight: 600; + padding: 5px 10px; + text-transform: uppercase; + margin: 3px 0; + text-decoration: none !important; } -#checkout .table tbody tr td img, -#basket .table tbody tr td img, -#customer-order .table tbody tr td img { - width: 50px; + +.tag-cloud a:hover { + border-color: #da4d4d; } -#checkout .table tfoot, -#basket .table tfoot, -#customer-order .table tfoot { - font-size: 18px; + +.tag-cloud i { + margin-right: 5px; } -.shipping-method h4, -.payment-method h4 { + +.ribbon { + width: 80px; + height: 32px; + line-height: 32px; + background: #da4d4d; + color: #fff; text-transform: uppercase; - letter-spacing: 0.08em; + letter-spacing: 0.1em; + font-weight: 700; + font-size: 0.9rem; + margin-bottom: 20px; + position: absolute; + top: 30px; + left: -15px; + text-align: center; } -#customer-orders table tr th, -#customer-orders table tr td { - vertical-align: baseline; + +.ribbon.sale { + background: #da4d4d; } -#customer-order .table tfoot th { - font-size: 18px; - font-weight: 300; + +.ribbon.new { + background: #5bc0de; } -#customer-order .addresses { - text-align: right; - margin-bottom: 30px; + +.ribbon.new::after { + content: ''; + border-top: 15px solid #1f7e9a; } -#customer-order .addresses p { - font-size: 18px; - font-weight: 300; + +.ribbon.sold { + background: #f0ad4e; } -#customer-account { - margin-bottom: 30px; + +.ribbon.sold::after { + content: ''; + border-top: 15px solid #b06d0f; } -#get-it { - background: #da4d4d; - padding: 50px 0 30px; - color: #fff; - text-align: center; + +.ribbon.gift { + background: #5cb85c; +} + +.ribbon.gift::after { + content: ''; + border-top: 15px solid #2d672d; +} + +.ribbon:nth-of-type(2) { + top: 82px; +} + +.ribbon::after { + content: ''; + border-top: 15px solid #a82323; + border-left: 15px solid transparent; + border-right: 0 solid transparent; + position: absolute; + bottom: -15px; + left: 0; + display: block; } -#get-it h1, -#get-it h2, -#get-it h3, -#get-it h4, -#get-it h5, -#get-it h6 { - color: #fff; + +.badge { + font-weight: 400; text-transform: uppercase; - letter-spacing: 0.08em; - margin: 0 0 20px; + letter-spacing: 0.1em; + padding: 3px 5px; } -#get-it p { - margin: 0 0 20px; + +#map { + border-top: 1px solid #da4d4d; + border-bottom: 1px solid #da4d4d; + height: 300px; } -#footer { - background: #555555; + +.get-it { + background: #da4d4d; + color: #fff; padding: 50px 0; - color: #999999; -} -#footer h1, -#footer h2, -#footer h3, -#footer h4, -#footer h5, -#footer h6 { - color: #eeeeee; -} -#footer h4 { - font-size: 14px; - font-weight: 800; - text-transform: uppercase; - letter-spacing: 0.08em; } -#footer ul { - padding-left: 0; - list-style: none; -} -#footer ul a { - color: #999999; + +.get-it h3 { + text-transform: uppercase; + letter-spacing: 0.1em; + margin: 0; } -#footer ul a:hover { - color: #da4d4d; - text-decoration: none; + +footer.main-footer { + padding: 60px 0; + padding-bottom: 0; + background: #555; + color: #fff; } -#footer .photostream div { - float: left; - display: block; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - width: 33%; - padding: 7.5px; - overflow: hidden; + +footer.main-footer a { + color: inherit; + color: #eee; } -#footer .photostream div a { - border: solid 1 px #eeeeee; + +footer.main-footer h4 { + color: #eee; + margin: 10px 0; + text-transform: uppercase; + letter-spacing: 0.1em; } -#footer .photostream div img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +footer.main-footer p { + font-size: 0.9rem; + color: #aaa; } -#footer .photostream div:hover img { - -webkit-transform: scale(1.1, 1.1); - -ms-transform: scale(1.1, 1.1); - -o-transform: scale(1.1, 1.1); - transform: scale(1.1, 1.1); + +footer.main-footer hr { + border: none; + border-top: 1px solid #ddd; + background: none; } -#footer .blog-entries .item { - clear: both; - padding: 5px 0; - margin-bottom: 10px; - border-bottom: solid 1px #555555; + +footer.main-footer .footer-blog-list li { + margin-bottom: 20px; } -#footer .blog-entries .item .image { - float: left; - width: 15%; + +footer.main-footer .image { + width: 40px; + height: 40px; margin-right: 10px; + -ms-flex-negative: 0; + flex-shrink: 0; } -#footer .blog-entries .item .name { - width: 75%; - margin-left: 10px; - display: table-cell; - vertical-align: middle; -} -#footer .blog-entries .item .name h5 { - margin: 0; + +footer.main-footer .text { text-transform: uppercase; - letter-spacing: 0.08em; - font-size: 12px; -} -#footer .blog-entries .item .name h5 a { - color: #eeeeee; -} -#footer .blog-entries .item .text { - width: 100%; - clear: both; + letter-spacing: 0.1em; } -#footer .blog-entries .item:last-child { - border-bottom: none; - margin-bottom: 0; + +footer.main-footer .text a { + font-size: 0.8rem; } -#footer .social a { - color: #555555; - font-size: 25px; - margin: 0 10px 0 0; + +footer.main-footer .photo-stream li { + margin: 0; } -#footer .social a:hover { - color: #da4d4d; + +footer.main-footer .photo-stream a { + width: 80px; + height: 80px; + padding: 5px; + display: block; } -#copyright { + +footer.main-footer .copyrights { + padding: 50px 0; background: #333; color: #ccc; - padding: 50px 0; - font-size: 12px; - line-height: 28px; + margin-top: 50px; } -#copyright p { - margin: 0; + +footer.main-footer .copyrights a { + color: #da4d4d; +} + +footer.main-footer .copyrights p { + color: inherit; + font-size: 0.8rem; + margin-bottom: 0; } + @media (max-width: 991px) { - #copyright p { - float: none !important; - text-align: center; - margin-bottom: 10px; + footer.main-footer .photo-stream a { + width: 120px; + height: 120px; } } -[data-animate] { - opacity: 0; - filter: alpha(opacity=0); + +@media (max-width: 767px) { + footer.main-footer .photo-stream li { + width: 32%; + margin-bottom: 10px; + } + footer.main-footer .photo-stream a { + width: 100%; + height: auto; + } } + +/* + +===================== +STYLE SWITCHER FOR DEMO +===================== + +*/ #style-switch-button { position: fixed; - top: 100px; + top: 120px; left: 0px; border-radius: 0; + z-index: 2; } + #style-switch { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; width: 300px; padding: 20px; position: fixed; - top: 140px; + top: 160px; left: 0; background: #fff; - border: solid 1px #eeeeee; + border: solid 1px #ced4da; + z-index: 2000; } -@media (max-width: 991px) { - #style-switch-button { - display: none; - } - #style-switch { - display: none; - } + +#style-switch h4 { + color: #495057; } -/* Original Boostrap template overwrite */ -/* breadcrumbs */ -.breadcrumb { - font-family: "Roboto", Helvetica, Arial, sans-serif; - text-transform: uppercase; - background-color: none; - letter-spacing: 0.08em; + +/* + * 1. NAVBAR + */ +.navbar { + padding: 0.5rem 1rem; } -/* nav */ -.nav > li > a { - padding: 10px 15px; + +.navbar-brand { + display: inline-block; + padding-top: 0.3125rem; + padding-bottom: 0.3125rem; + margin-right: 1rem; + font-size: 1.25rem; +} + +.navbar-toggler { + padding: 0.25rem 0.75rem; + font-size: 1.25rem; + line-height: 1; + border: 1px solid transparent; + border-radius: 0; } -.nav > li > a:hover, -.nav > li > a:focus { - background-color: #eeeeee; + +.navbar-light .navbar-brand { + color: rgba(0, 0, 0, 0.9); } -.nav > li.disabled > a { - color: #999999; + +.navbar-light .navbar-brand:focus, .navbar-light .navbar-brand:hover { + color: rgba(0, 0, 0, 0.9); } -.nav > li.disabled > a:hover, -.nav > li.disabled > a:focus { - color: #999999; + +.navbar-light .navbar-nav .nav-link { + color: rgba(0, 0, 0, 0.5); } -.nav .open > a, -.nav .open > a:hover, -.nav .open > a:focus { - background-color: #eeeeee; - border-color: #da4d4d; + +.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover { + color: rgba(0, 0, 0, 0.7); } -.nav-tabs { - border-bottom: 1px solid #da4d4d; + +.navbar-light .navbar-nav .nav-link.disabled { + color: rgba(0, 0, 0, 0.3); } -.nav-tabs > li { - float: left; - margin-bottom: -1px; + +.navbar-light .navbar-nav .show > .nav-link, +.navbar-light .navbar-nav .active > .nav-link, +.navbar-light .navbar-nav .nav-link.show, +.navbar-light .navbar-nav .nav-link.active { + color: rgba(0, 0, 0, 0.9); } -.nav-tabs > li > a { - margin-right: 2px; - line-height: 1.42857143; - border: 1px solid transparent; - border-radius: 0 0 0 0; + +.navbar-light .navbar-toggler { + color: rgba(0, 0, 0, 0.5); + border-color: rgba(0, 0, 0, 0.1); } -.nav-tabs > li > a:hover { - border-color: #eeeeee #eeeeee #da4d4d; + +.navbar-light .navbar-toggler-icon { + background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); } -.nav-tabs > li.active > a, -.nav-tabs > li.active > a:hover, -.nav-tabs > li.active > a:focus { - color: #555555; - background-color: #ffffff; - border: 1px solid #da4d4d; - border-bottom-color: transparent; - cursor: default; + +.navbar-light .navbar-text { + color: rgba(0, 0, 0, 0.5); } -.nav-tabs.nav-justified { - width: 100%; - border-bottom: solid 1px #da4d4d; - border-bottom: 0; + +.navbar-dark .navbar-brand { + color: #fff; } -.nav-tabs.nav-justified > li { - float: none; + +.navbar-dark .navbar-brand:focus, .navbar-dark .navbar-brand:hover { + color: #fff; } -.nav-tabs.nav-justified > li > a { - text-align: center; - /*margin-bottom: 5px;*/ + +.navbar-dark .navbar-nav .nav-link { + color: rgba(255, 255, 255, 0.5); } -.nav-tabs.nav-justified > .dropdown .dropdown-menu { - top: auto; - left: auto; + +.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover { + color: rgba(255, 255, 255, 0.75); } -.nav-tabs.nav-justified > li > a { - margin-right: 0; - border-radius: 0; + +.navbar-dark .navbar-nav .nav-link.disabled { + color: rgba(255, 255, 255, 0.25); } -.nav-tabs.nav-justified > .active > a, -.nav-tabs.nav-justified > .active > a:hover, -.nav-tabs.nav-justified > .active > a:focus { - border: 1px solid #da4d4d; + +.navbar-dark .navbar-nav .show > .nav-link, +.navbar-dark .navbar-nav .active > .nav-link, +.navbar-dark .navbar-nav .nav-link.show, +.navbar-dark .navbar-nav .nav-link.active { + color: #fff; } -@media (min-width: 768px) { - .nav-tabs.nav-justified > li > a { - border-bottom: 1px solid #da4d4d; - border-radius: 0 0 0 0; - } - .nav-tabs.nav-justified > .active > a, - .nav-tabs.nav-justified > .active > a:hover, - .nav-tabs.nav-justified > .active > a:focus { - border-bottom-color: #ffffff; - } + +.navbar-dark .navbar-toggler { + color: rgba(255, 255, 255, 0.5); + border-color: rgba(255, 255, 255, 0.1); } -.nav-pills > li { - float: left; + +.navbar-dark .navbar-toggler-icon { + background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); } -.nav-pills > li > a { + +.navbar-dark .navbar-text { + color: rgba(255, 255, 255, 0.5); +} + +/* + * 2. BUTTONS + */ +.btn { + font-weight: 700; + border: 1px solid transparent; + padding: 0.5rem 0.75rem; + font-size: 0.8rem; + line-height: 1.5; border-radius: 0; + -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; } -.nav-pills > li + li { - margin-left: 2px; + +.btn:focus, .btn.focus { + outline: 0; + -webkit-box-shadow: 0 0 0 0.2rem rgba(218, 77, 77, 0.25); + box-shadow: 0 0 0 0.2rem rgba(218, 77, 77, 0.25); +} + +.btn.disabled, .btn:disabled { + opacity: .65; +} + +.btn:not([disabled]):not(.disabled):active, .btn:not([disabled]):not(.disabled).active { + background-image: none; } -.nav-pills > li.active > a, -.nav-pills > li.active > a:hover, -.nav-pills > li.active > a:focus { - color: #ffffff; + +.btn-primary { + color: color-yiq(#da4d4d); background-color: #da4d4d; + border-color: #da4d4d; } -.nav-stacked > li { - float: none; + +.btn-primary:hover { + color: color-yiq(#d32d2d); + background-color: #ca2a2a; + border-color: #ca2a2a; } -.nav-stacked > li + li { - margin-top: 2px; - margin-left: 0; + +.btn-primary:focus, .btn-primary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(218, 77, 77, 0.5); + box-shadow: 0 0 0 0.2rem rgba(218, 77, 77, 0.5); } -.nav-justified { - width: 100%; - border-bottom: solid 1px #da4d4d; + +.btn-primary.disabled, .btn-primary:disabled { + color: color-yiq(#da4d4d); + background-color: #da4d4d; + border-color: #da4d4d; } -.nav-justified > li { - float: none; + +.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active, +.show > .btn-primary.dropdown-toggle { + color: color-yiq(#ca2a2a); + background-color: #ca2a2a; + border-color: #bf2828; +} + +.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, +.show > .btn-primary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(218, 77, 77, 0.5); + box-shadow: 0 0 0 0.2rem rgba(218, 77, 77, 0.5); +} + +.btn-secondary { + color: color-yiq(#868e96); + background-color: #868e96; + border-color: #868e96; +} + +.btn-secondary:hover { + color: color-yiq(#727b84); + background-color: #6c757d; + border-color: #6c757d; +} + +.btn-secondary:focus, .btn-secondary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); +} + +.btn-secondary.disabled, .btn-secondary:disabled { + color: color-yiq(#868e96); + background-color: #868e96; + border-color: #868e96; +} + +.btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active, +.show > .btn-secondary.dropdown-toggle { + color: color-yiq(#6c757d); + background-color: #6c757d; + border-color: #666e76; +} + +.btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus, +.show > .btn-secondary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); +} + +.btn-success { + color: color-yiq(#28a745); + background-color: #28a745; + border-color: #28a745; +} + +.btn-success:hover { + color: color-yiq(#218838); + background-color: #1e7e34; + border-color: #1e7e34; +} + +.btn-success:focus, .btn-success.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); +} + +.btn-success.disabled, .btn-success:disabled { + color: color-yiq(#28a745); + background-color: #28a745; + border-color: #28a745; +} + +.btn-success:not(:disabled):not(.disabled):active, .btn-success:not(:disabled):not(.disabled).active, +.show > .btn-success.dropdown-toggle { + color: color-yiq(#1e7e34); + background-color: #1e7e34; + border-color: #1c7430; +} + +.btn-success:not(:disabled):not(.disabled):active:focus, .btn-success:not(:disabled):not(.disabled).active:focus, +.show > .btn-success.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); +} + +.btn-info { + color: color-yiq(#17a2b8); + background-color: #17a2b8; + border-color: #17a2b8; +} + +.btn-info:hover { + color: color-yiq(#138496); + background-color: #117a8b; + border-color: #117a8b; +} + +.btn-info:focus, .btn-info.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); +} + +.btn-info.disabled, .btn-info:disabled { + color: color-yiq(#17a2b8); + background-color: #17a2b8; + border-color: #17a2b8; +} + +.btn-info:not(:disabled):not(.disabled):active, .btn-info:not(:disabled):not(.disabled).active, +.show > .btn-info.dropdown-toggle { + color: color-yiq(#117a8b); + background-color: #117a8b; + border-color: #10707f; +} + +.btn-info:not(:disabled):not(.disabled):active:focus, .btn-info:not(:disabled):not(.disabled).active:focus, +.show > .btn-info.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); +} + +.btn-warning { + color: color-yiq(#ffc107); + background-color: #ffc107; + border-color: #ffc107; +} + +.btn-warning:hover { + color: color-yiq(#e0a800); + background-color: #d39e00; + border-color: #d39e00; +} + +.btn-warning:focus, .btn-warning.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-warning.disabled, .btn-warning:disabled { + color: color-yiq(#ffc107); + background-color: #ffc107; + border-color: #ffc107; +} + +.btn-warning:not(:disabled):not(.disabled):active, .btn-warning:not(:disabled):not(.disabled).active, +.show > .btn-warning.dropdown-toggle { + color: color-yiq(#d39e00); + background-color: #d39e00; + border-color: #c69500; +} + +.btn-warning:not(:disabled):not(.disabled):active:focus, .btn-warning:not(:disabled):not(.disabled).active:focus, +.show > .btn-warning.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-danger { + color: color-yiq(#dc3545); + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-danger:hover { + color: color-yiq(#c82333); + background-color: #bd2130; + border-color: #bd2130; +} + +.btn-danger:focus, .btn-danger.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-danger.disabled, .btn-danger:disabled { + color: color-yiq(#dc3545); + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-danger:not(:disabled):not(.disabled):active, .btn-danger:not(:disabled):not(.disabled).active, +.show > .btn-danger.dropdown-toggle { + color: color-yiq(#bd2130); + background-color: #bd2130; + border-color: #b21f2d; +} + +.btn-danger:not(:disabled):not(.disabled):active:focus, .btn-danger:not(:disabled):not(.disabled).active:focus, +.show > .btn-danger.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-light { + color: color-yiq(#f8f9fa); + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-light:hover { + color: color-yiq(#e2e6ea); + background-color: #dae0e5; + border-color: #dae0e5; +} + +.btn-light:focus, .btn-light.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-light.disabled, .btn-light:disabled { + color: color-yiq(#f8f9fa); + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-light:not(:disabled):not(.disabled):active, .btn-light:not(:disabled):not(.disabled).active, +.show > .btn-light.dropdown-toggle { + color: color-yiq(#dae0e5); + background-color: #dae0e5; + border-color: #d3d9df; +} + +.btn-light:not(:disabled):not(.disabled):active:focus, .btn-light:not(:disabled):not(.disabled).active:focus, +.show > .btn-light.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-dark { + color: color-yiq(#343a40); + background-color: #343a40; + border-color: #343a40; +} + +.btn-dark:hover { + color: color-yiq(#23272b); + background-color: #1d2124; + border-color: #1d2124; +} + +.btn-dark:focus, .btn-dark.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-dark.disabled, .btn-dark:disabled { + color: color-yiq(#343a40); + background-color: #343a40; + border-color: #343a40; +} + +.btn-dark:not(:disabled):not(.disabled):active, .btn-dark:not(:disabled):not(.disabled).active, +.show > .btn-dark.dropdown-toggle { + color: color-yiq(#1d2124); + background-color: #1d2124; + border-color: #171a1d; +} + +.btn-dark:not(:disabled):not(.disabled):active:focus, .btn-dark:not(:disabled):not(.disabled).active:focus, +.show > .btn-dark.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-default { + color: color-yiq(#ced4da); + background-color: #ced4da; + border-color: #ced4da; +} + +.btn-default:hover { + color: color-yiq(#b8c1ca); + background-color: #b1bbc4; + border-color: #b1bbc4; +} + +.btn-default:focus, .btn-default.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); + box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); +} + +.btn-default.disabled, .btn-default:disabled { + color: color-yiq(#ced4da); + background-color: #ced4da; + border-color: #ced4da; +} + +.btn-default:not(:disabled):not(.disabled):active, .btn-default:not(:disabled):not(.disabled).active, +.show > .btn-default.dropdown-toggle { + color: color-yiq(#b1bbc4); + background-color: #b1bbc4; + border-color: #aab4bf; +} + +.btn-default:not(:disabled):not(.disabled):active:focus, .btn-default:not(:disabled):not(.disabled).active:focus, +.show > .btn-default.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); + box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); +} + +.btn-outline-primary { + color: #da4d4d; + background-color: transparent; + background-image: none; + border-color: #da4d4d; } -.nav-justified > li > a { - text-align: center; - /*margin-bottom: 5px;*/ + +.btn-outline-primary:hover { + color: #fff; + background-color: #da4d4d; + border-color: #da4d4d; } -.nav-justified > .dropdown .dropdown-menu { - top: auto; - left: auto; + +.btn-outline-primary:focus, .btn-outline-primary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(218, 77, 77, 0.5); + box-shadow: 0 0 0 0.2rem rgba(218, 77, 77, 0.5); } -.nav-tabs-justified { - border-bottom: 0; + +.btn-outline-primary.disabled, .btn-outline-primary:disabled { + color: #da4d4d; + background-color: transparent; } -.nav-tabs-justified > li > a { - margin-right: 0; - border-radius: 0; + +.btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active, +.show > .btn-outline-primary.dropdown-toggle { + color: color-yiq(#da4d4d); + background-color: #da4d4d; + border-color: #da4d4d; } -.nav-tabs-justified > .active > a, -.nav-tabs-justified > .active > a:hover, -.nav-tabs-justified > .active > a:focus { - border: 1px solid #da4d4d; + +.btn-outline-primary:not(:disabled):not(.disabled):active:focus, .btn-outline-primary:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-primary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(218, 77, 77, 0.5); + box-shadow: 0 0 0 0.2rem rgba(218, 77, 77, 0.5); } -@media (min-width: 768px) { - .nav-tabs-justified > li > a { - border-bottom: 1px solid #da4d4d; - border-radius: 0 0 0 0; - } - .nav-tabs-justified > .active > a, - .nav-tabs-justified > .active > a:hover, - .nav-tabs-justified > .active > a:focus { - border-bottom-color: #ffffff; - } + +.btn-outline-secondary { + color: #868e96; + background-color: transparent; + background-image: none; + border-color: #868e96; } -.tab-content { - padding: 15px; - border: solid 1px #ddd; - border-top: none; + +.btn-outline-secondary:hover { + color: #fff; + background-color: #868e96; + border-color: #868e96; } -/* navbar */ -.navbar { - position: relative; - min-height: 62px; - margin-bottom: 0; - border-bottom: 1px solid transparent; + +.btn-outline-secondary:focus, .btn-outline-secondary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); } -@media (min-width: 768px) { - .navbar { - border-radius: 0px; - } + +.btn-outline-secondary.disabled, .btn-outline-secondary:disabled { + color: #868e96; + background-color: transparent; } -@media (min-width: 768px) { - .navbar-header { - float: left; - } + +.btn-outline-secondary:not(:disabled):not(.disabled):active, .btn-outline-secondary:not(:disabled):not(.disabled).active, +.show > .btn-outline-secondary.dropdown-toggle { + color: color-yiq(#868e96); + background-color: #868e96; + border-color: #868e96; +} + +.btn-outline-secondary:not(:disabled):not(.disabled):active:focus, .btn-outline-secondary:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-secondary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); +} + +.btn-outline-success { + color: #28a745; + background-color: transparent; + background-image: none; + border-color: #28a745; } -.navbar-collapse { - overflow-x: visible; - padding-right: 15px; - padding-left: 15px; + +.btn-outline-success:hover { + color: #fff; + background-color: #28a745; + border-color: #28a745; } -.navbar-collapse.in { - overflow-y: auto; + +.btn-outline-success:focus, .btn-outline-success.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); } -@media (min-width: 768px) { - .navbar-collapse { - width: auto; - border-top: 0; - box-shadow: none; - } - .navbar-collapse.collapse { - display: block !important; - height: auto !important; - padding-bottom: 0; - overflow: visible !important; - } - .navbar-collapse.in { - overflow-y: visible; - } - .navbar-fixed-top .navbar-collapse, - .navbar-static-top .navbar-collapse, - .navbar-fixed-bottom .navbar-collapse { - padding-left: 0; - padding-right: 0; - } + +.btn-outline-success.disabled, .btn-outline-success:disabled { + color: #28a745; + background-color: transparent; } -.navbar-fixed-top .navbar-collapse, -.navbar-affixed-top .navbar-collapse, -.navbar-fixed-bottom .navbar-collapse { - max-height: 340px; + +.btn-outline-success:not(:disabled):not(.disabled):active, .btn-outline-success:not(:disabled):not(.disabled).active, +.show > .btn-outline-success.dropdown-toggle { + color: color-yiq(#28a745); + background-color: #28a745; + border-color: #28a745; +} + +.btn-outline-success:not(:disabled):not(.disabled):active:focus, .btn-outline-success:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-success.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); +} + +.btn-outline-info { + color: #17a2b8; + background-color: transparent; + background-image: none; + border-color: #17a2b8; } -@media (max-width: 480px) and (orientation: landscape) { - .navbar-fixed-top .navbar-collapse, - .navbar-affixed-top .navbar-collapse, - .navbar-fixed-bottom .navbar-collapse { - max-height: 200px; - } + +.btn-outline-info:hover { + color: #fff; + background-color: #17a2b8; + border-color: #17a2b8; } -.container > .navbar-header, -.container-fluid > .navbar-header, -.container > .navbar-collapse, -.container-fluid > .navbar-collapse { - margin-right: -15px; - margin-left: -15px; -} -@media (min-width: 768px) { - .container > .navbar-header, - .container-fluid > .navbar-header, - .container > .navbar-collapse, - .container-fluid > .navbar-collapse { - margin-right: 0; - margin-left: 0; - } + +.btn-outline-info:focus, .btn-outline-info.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); } -.navbar-static-top { - z-index: 1000; - border-width: 0 0 1px; + +.btn-outline-info.disabled, .btn-outline-info:disabled { + color: #17a2b8; + background-color: transparent; } -@media (min-width: 768px) { - .navbar-static-top { - border-radius: 0; - } + +.btn-outline-info:not(:disabled):not(.disabled):active, .btn-outline-info:not(:disabled):not(.disabled).active, +.show > .btn-outline-info.dropdown-toggle { + color: color-yiq(#17a2b8); + background-color: #17a2b8; + border-color: #17a2b8; +} + +.btn-outline-info:not(:disabled):not(.disabled):active:focus, .btn-outline-info:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-info.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); +} + +.btn-outline-warning { + color: #ffc107; + background-color: transparent; + background-image: none; + border-color: #ffc107; } -.navbar-fixed-top, -.navbar-fixed-bottom { - position: fixed; - right: 0; - left: 0; - z-index: 1030; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); -} -@media (min-width: 768px) { - .navbar-fixed-top, - .navbar-fixed-bottom { - border-radius: 0; - } + +.btn-outline-warning:hover { + color: #fff; + background-color: #ffc107; + border-color: #ffc107; } -.navbar-fixed-top { - top: 0; - border-width: 0 0 1px; + +.btn-outline-warning:focus, .btn-outline-warning.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); } -.navbar-fixed-bottom { - bottom: 0; - margin-bottom: 0; - border-width: 1px 0 0; + +.btn-outline-warning.disabled, .btn-outline-warning:disabled { + color: #ffc107; + background-color: transparent; } -.navbar-brand { - float: left; - padding: 10px 15px; - font-size: 18px; - line-height: 20px; - height: 62px; + +.btn-outline-warning:not(:disabled):not(.disabled):active, .btn-outline-warning:not(:disabled):not(.disabled).active, +.show > .btn-outline-warning.dropdown-toggle { + color: color-yiq(#ffc107); + background-color: #ffc107; + border-color: #ffc107; +} + +.btn-outline-warning:not(:disabled):not(.disabled):active:focus, .btn-outline-warning:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-warning.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-outline-danger { + color: #dc3545; + background-color: transparent; + background-image: none; + border-color: #dc3545; } -.navbar-brand:hover, -.navbar-brand:focus { - text-decoration: none; + +.btn-outline-danger:hover { + color: #fff; + background-color: #dc3545; + border-color: #dc3545; } -@media (min-width: 768px) { - .navbar > .container .navbar-brand, - .navbar > .container-fluid .navbar-brand { - margin-left: -15px; - } + +.btn-outline-danger:focus, .btn-outline-danger.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); } -.navbar-toggle { - position: relative; - float: right; - margin-right: 15px; - padding: 9px 10px; - margin-top: 14px; - margin-bottom: 14px; + +.btn-outline-danger.disabled, .btn-outline-danger:disabled { + color: #dc3545; + background-color: transparent; +} + +.btn-outline-danger:not(:disabled):not(.disabled):active, .btn-outline-danger:not(:disabled):not(.disabled).active, +.show > .btn-outline-danger.dropdown-toggle { + color: color-yiq(#dc3545); + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-outline-danger:not(:disabled):not(.disabled):active:focus, .btn-outline-danger:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-danger.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-outline-light { + color: #f8f9fa; background-color: transparent; background-image: none; - border: 1px solid transparent; + border-color: #f8f9fa; +} + +.btn-outline-light:hover { + color: #fff; + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-outline-light:focus, .btn-outline-light.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-outline-light.disabled, .btn-outline-light:disabled { + color: #f8f9fa; + background-color: transparent; +} + +.btn-outline-light:not(:disabled):not(.disabled):active, .btn-outline-light:not(:disabled):not(.disabled).active, +.show > .btn-outline-light.dropdown-toggle { + color: color-yiq(#f8f9fa); + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-outline-light:not(:disabled):not(.disabled):active:focus, .btn-outline-light:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-light.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-outline-dark { + color: #343a40; + background-color: transparent; + background-image: none; + border-color: #343a40; +} + +.btn-outline-dark:hover { + color: #fff; + background-color: #343a40; + border-color: #343a40; +} + +.btn-outline-dark:focus, .btn-outline-dark.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-outline-dark.disabled, .btn-outline-dark:disabled { + color: #343a40; + background-color: transparent; +} + +.btn-outline-dark:not(:disabled):not(.disabled):active, .btn-outline-dark:not(:disabled):not(.disabled).active, +.show > .btn-outline-dark.dropdown-toggle { + color: color-yiq(#343a40); + background-color: #343a40; + border-color: #343a40; +} + +.btn-outline-dark:not(:disabled):not(.disabled):active:focus, .btn-outline-dark:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-dark.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-lg { + padding: 0.5rem 1rem; + font-size: 1.25rem; + line-height: 1.5; + border-radius: 0; +} + +.btn-sm { + padding: 0.25rem 0.5rem; + font-size: 0.7rem; + line-height: 1.5; border-radius: 0; } -.navbar-toggle:focus { - outline: 0; + +/* + * 3. TYPE + */ +body { + font-family: "Roboto", Helvetica, Arial, sans-serif; + font-size: 1rem; + font-weight: 400; + line-height: 1.5; + color: #212529; + background-color: #fff; +} + +a { + color: #da4d4d; + text-decoration: none; +} + +a:focus, a:hover { + color: #b52626; + text-decoration: underline; +} + +h1, +h2, +h3, +h4, +h5, +h6, +.h1, +.h2, +.h3, +.h4, +.h5, +.h6 { + margin-bottom: 1rem; + font-family: inherit; + font-weight: 700; + line-height: 1.1; + color: inherit; +} + +h1, +.h1 { + font-size: 2.2rem; +} + +h2, +.h2 { + font-size: 1.8rem; +} + +h3, +.h3 { + font-size: 1.5rem; +} + +h4, +.h4 { + font-size: 1.1rem; +} + +h5, +.h5 { + font-size: 1rem; +} + +h6, +.h6 { + font-size: 0.8rem; +} + +.lead { + font-size: 1.25rem; + font-weight: 300; +} + +.display-1 { + font-size: 6rem; + font-weight: 300; + line-height: 1.1; +} + +.display-2 { + font-size: 5.5rem; + font-weight: 300; + line-height: 1.1; } -.navbar-nav { - margin: 10.5px -15px; + +.display-3 { + font-size: 4.5rem; + font-weight: 300; + line-height: 1.1; } -.navbar-nav > li > a { - padding-top: 10px; - padding-bottom: 10px; - line-height: 20px; + +.display-4 { + font-size: 3.5rem; + font-weight: 300; + line-height: 1.1; } -@media (max-width: 767px) { - .navbar-nav .open .dropdown-menu > li > a, - .navbar-nav .open .dropdown-menu .dropdown-header { - padding: 5px 15px 5px 25px; - } - .navbar-nav .open .dropdown-menu > li > a { - line-height: 20px; - } - .navbar-nav .open .dropdown-menu > li > a:hover, - .navbar-nav .open .dropdown-menu > li > a:focus { - background-image: none; - } + +hr { + border-top: 1px solid rgba(0, 0, 0, 0.1); } -@media (min-width: 768px) { - .navbar-nav { - float: left; - margin: 0; - } - .navbar-nav > li { - float: left; - } - .navbar-nav > li > a { - padding-top: 21px; - padding-bottom: 21px; - } - .navbar-nav.navbar-right:last-child { - margin-right: -15px; - } + +small, +.small { + font-size: 80%; + font-weight: 400; } -@media (min-width: 768px) { - .navbar-left { - float: left !important; - } - .navbar-right { - float: right !important; - } + +mark, +.mark { + padding: 0.2em; + background-color: #fcf8e3; +} + +.blockquote { + padding: 0.5rem 1rem; + margin-bottom: 2rem; + font-size: 1rem; + border-left: 5px solid #da4d4d; } -.navbar-form { - margin-left: -15px; - margin-right: -15px; - padding: 10px 15px; - border-top: 1px solid transparent; - border-bottom: 1px solid transparent; - -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); - margin-top: 14px; - margin-bottom: 14px; + +.blockquote-footer { + color: #868e96; } -@media (max-width: 767px) { - .navbar-form .form-group { - margin-bottom: 5px; - } + +.blockquote-footer::before { + content: "\2014 \00A0"; } -@media (min-width: 768px) { - .navbar-form { - width: auto; - border: 0; - margin-left: 0; - margin-right: 0; - padding-top: 0; - padding-bottom: 0; - -webkit-box-shadow: none; - box-shadow: none; - } - .navbar-form.navbar-right:last-child { - margin-right: -15px; - } + +.text-primary { + color: #da4d4d !important; } -.navbar-nav > li > .dropdown-menu { - margin-top: 0; - border-top-right-radius: 0; - border-top-left-radius: 0; + +a.text-primary:focus, a.text-primary:hover { + color: #ca2a2a !important; } -.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu { - border-bottom-right-radius: 0; + +/* + * 4. PAGINATION + */ +.page-item:first-child .page-link { + border-top-left-radius: 0; border-bottom-left-radius: 0; } -.navbar-btn { - margin-top: 14px; - margin-bottom: 14px; + +.page-item:last-child .page-link { + border-top-right-radius: 0; + border-bottom-right-radius: 0; } -.navbar-btn.btn-sm { - margin-top: 16px; - margin-bottom: 16px; + +.page-item.active .page-link { + color: #fff; + background-color: #da4d4d; + border-color: #da4d4d; } -.navbar-btn.btn-xs { - margin-top: 20px; - margin-bottom: 20px; + +.page-item.disabled .page-link { + color: #868e96; + background-color: #fff; + border-color: #dee2e6; } -.navbar-text { - margin-top: 21px; - margin-bottom: 21px; + +.page-link { + padding: 0.5rem 0.75rem; + line-height: 1.25; + color: #da4d4d; + background-color: #fff; + border: 1px solid #dee2e6; } -@media (min-width: 768px) { - .navbar-text { - float: left; - margin-left: 15px; - margin-right: 15px; - } - .navbar-text.navbar-right:last-child { - margin-right: 0; - } + +.page-link:focus, .page-link:hover { + color: #b52626; + text-decoration: none; + background-color: #e9ecef; + border-color: #dee2e6; + outline: 0; } -.navbar-default { - background-color: #ffffff; - border-color: #cccccc; - border-bottom: none; + +.pagination-lg .page-link { + padding: 0.75rem 1.5rem; + font-size: 1.25rem; + line-height: 1.5; } -.navbar-default .navbar-brand { - color: #555555; + +.pagination-lg .page-item:first-child .page-link { + border-top-left-radius: 0; + border-bottom-left-radius: 0; } -.navbar-default .navbar-brand:hover, -.navbar-default .navbar-brand:focus { - color: #3b3b3b; - background-color: transparent; + +.pagination-lg .page-item:last-child .page-link { + border-top-right-radius: 0; + border-bottom-right-radius: 0; } -.navbar-default .navbar-text { - color: #777777; + +.pagination-sm .page-link { + padding: 0.25rem 0.5rem; + font-size: 0.7rem; + line-height: 1.5; } -.navbar-default .navbar-nav > li > a { - color: #555555; + +.pagination-sm .page-item:first-child .page-link { + border-top-left-radius: 0; + border-bottom-left-radius: 0; } -.navbar-default .navbar-nav > li > a:hover, -.navbar-default .navbar-nav > li > a:focus { - color: #555555; - background-color: #eca1a1; + +.pagination-sm .page-item:last-child .page-link { + border-top-right-radius: 0; + border-bottom-right-radius: 0; } -.navbar-default .navbar-nav > .active > a, -.navbar-default .navbar-nav > .active > a:hover, -.navbar-default .navbar-nav > .active > a:focus { - color: #ffffff; - background-color: #da4d4d; + +/* +* 5. DROPDOWNS +*/ +.dropdown-menu { + z-index: 1000; + min-width: 10rem; + padding: 0.5rem 0; + margin: 0.125rem 0 0; + font-size: 1rem; + color: #212529; + background-color: #fff; + border: 1px solid rgba(0, 0, 0, 0.15); + border-radius: 0; } -.navbar-default .navbar-nav > .disabled > a, -.navbar-default .navbar-nav > .disabled > a:hover, -.navbar-default .navbar-nav > .disabled > a:focus { - color: #cccccc; - background-color: transparent; + +.dropdown-item { + padding: 0.25rem 1.5rem; + color: #212529; } -.navbar-default .navbar-toggle { - border-color: #dddddd; + +.dropdown-item:focus, .dropdown-item:hover { + color: #16181b; + background-color: #f8f9fa; } -.navbar-default .navbar-toggle:hover, -.navbar-default .navbar-toggle:focus { + +.dropdown-item.active, .dropdown-item:active { + color: #fff; background-color: #da4d4d; } -.navbar-default .navbar-toggle .icon-bar { - background-color: #888888; + +.dropdown-item.disabled, .dropdown-item:disabled { + color: #868e96; } -.navbar-default .navbar-collapse, -.navbar-default .navbar-form { - border-color: #cccccc; + +.dropdown-header { + padding: 0.5rem 1.5rem; + font-size: 0.7rem; + color: #868e96; } -.navbar-default .navbar-nav > .open > a, -.navbar-default .navbar-nav > .open > a:hover, -.navbar-default .navbar-nav > .open > a:focus { - background-color: #da4d4d; - color: #ffffff; + +/* +* 6. UTILITIES +*/ +.bg-primary { + background-color: #da4d4d !important; } -@media (max-width: 767px) { - .navbar-default .navbar-nav .open .dropdown-menu > li > a { - color: #555555; - } - .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, - .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus { - color: #da4d4d; - } - .navbar-default .navbar-nav .open .dropdown-menu > .active > a, - .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, - .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus { - color: #ffffff; - background-color: #da4d4d; - } - .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a, - .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover, - .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus { - color: #cccccc; - background-color: transparent; - } + +a.bg-primary:focus, a.bg-primary:hover { + background-color: #ca2a2a !important; } -.navbar-default .navbar-link { - color: #555555; + +.bg-secondary { + background-color: #868e96 !important; } -.navbar-default .navbar-link:hover { - color: #555555; + +a.bg-secondary:focus, a.bg-secondary:hover { + background-color: #6c757d !important; } -.navbar-default .btn-link { - color: #555555; + +.bg-success { + background-color: #28a745 !important; } -.navbar-default .btn-link:hover, -.navbar-default .btn-link:focus { - color: #555555; + +a.bg-success:focus, a.bg-success:hover { + background-color: #1e7e34 !important; } -.navbar-default .btn-link[disabled]:hover, -fieldset[disabled] .navbar-default .btn-link:hover, -.navbar-default .btn-link[disabled]:focus, -fieldset[disabled] .navbar-default .btn-link:focus { - color: #cccccc; + +.bg-info { + background-color: #17a2b8 !important; } -/* scaffolding */ -body { - font-family: "Roboto", Helvetica, Arial, sans-serif; - font-size: 14px; - line-height: 1.42857143; - color: #555555; + +a.bg-info:focus, a.bg-info:hover { + background-color: #117a8b !important; } -a { - color: #da4d4d; - text-decoration: none; + +.bg-warning { + background-color: #ffc107 !important; } -a:hover, -a:focus { - color: #b52626; - text-decoration: underline; + +a.bg-warning:focus, a.bg-warning:hover { + background-color: #d39e00 !important; } -a:focus { - outline: thin dotted; - outline: 5px auto -webkit-focus-ring-color; - outline-offset: -2px; + +.bg-danger { + background-color: #dc3545 !important; } -.img-rounded { - border-radius: 0; + +a.bg-danger:focus, a.bg-danger:hover { + background-color: #bd2130 !important; } -hr { - margin-top: 20px; - margin-bottom: 20px; - border: 0; - border-top: 1px solid #eeeeee; + +.bg-light { + background-color: #f8f9fa !important; } -/* breadcrumbs */ -.breadcrumb { - padding: 20px 0; - margin-bottom: 20px; - background-color: transparent; - border-radius: 0; - text-align: right; + +a.bg-light:focus, a.bg-light:hover { + background-color: #dae0e5 !important; } -.breadcrumb > li + li:before { - content: ">\00a0"; - color: #555555; + +.bg-dark { + background-color: #343a40 !important; } -.breadcrumb > .active { - color: #999999; + +a.bg-dark:focus, a.bg-dark:hover { + background-color: #1d2124 !important; } -@media (max-width: 991px) { - .breadcrumb { - padding: 20px 0; - text-align: center; - } + +.border-primary { + border-color: #da4d4d !important; } -/* dropdowns */ -.dropdown-menu { - z-index: 1000; - font-size: 14px; - background-color: #ffffff; - border: 1px solid #cccccc; - border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 0; - -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); - box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); + +.border-secondary { + border-color: #868e96 !important; } -.dropdown-menu.pull-right { - right: 0; - left: auto; + +.border-success { + border-color: #28a745 !important; } -.dropdown-menu .divider { - height: 1px; - margin: 9px 0; - overflow: hidden; - background-color: #e5e5e5; + +.border-info { + border-color: #17a2b8 !important; } -.dropdown-menu > li > a { - padding: 5px 20px; - line-height: 1.42857143; - color: #333333; - white-space: nowrap; + +.border-warning { + border-color: #ffc107 !important; } -/* labels */ -.label { - font-family: "Roboto", Helvetica, Arial, sans-serif; - font-weight: normal; - text-transform: uppercase; - letter-spacing: 0.08em; + +.border-danger { + border-color: #dc3545 !important; } -/* forms.less */ -label { - font-weight: normal; + +.border-light { + border-color: #f8f9fa !important; } -.form-control { - -webkit-box-shadow: none; - box-shadow: none; - border-radius: 0; + +.border-dark { + border-color: #343a40 !important; } -.form-control:focus { - border-color: #da4d4d; - outline: 0; - -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(218, 77, 77, 0.6); - box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(218, 77, 77, 0.6); + +.text-primary { + color: #da4d4d !important; } -.form-group { - margin-bottom: 20px; + +a.text-primary:focus, a.text-primary:hover { + color: #ca2a2a !important; } -/* pager*/ -.pager { - margin: 20px 0; - border-top: solid 1px #eeeeee; - padding-top: 20px; - text-transform: uppercase; - letter-spacing: 0.08em; - font-family: "Roboto", Helvetica, Arial, sans-serif; + +.text-secondary { + color: #868e96 !important; } -.pager li { - display: inline; + +a.text-secondary:focus, a.text-secondary:hover { + color: #6c757d !important; } -.pager li > a, -.pager li > span { - background-color: #ffffff; - border: 1px solid #da4d4d; - border-radius: 0; + +.text-success { + color: #28a745 !important; } -.pager li > a:hover, -.pager li > a:focus { - text-decoration: none; - color: #fff; - background-color: #da4d4d; + +a.text-success:focus, a.text-success:hover { + color: #1e7e34 !important; } -.pager .disabled > a, -.pager .disabled > a:hover, -.pager .disabled > a:focus, -.pager .disabled > span { - color: #999999; - background-color: #ffffff; - border-color: #ddd; + +.text-info { + color: #17a2b8 !important; } -/* pagination */ -.pagination { - margin: 20px 0; - font-family: "Roboto", Helvetica, Arial, sans-serif; - border-radius: 0; + +a.text-info:focus, a.text-info:hover { + color: #117a8b !important; } -.pagination > li > a, -.pagination > li > span { - padding: 6px 12px; - line-height: 1.42857143; - text-decoration: none; - color: #da4d4d; - background-color: #ffffff; - border: 1px solid #dddddd; + +.text-warning { + color: #ffc107 !important; } -.pagination > li > a:hover, -.pagination > li > span:hover, -.pagination > li > a:focus, -.pagination > li > span:focus { - color: #da4d4d; - background-color: #f4cccc; - border-color: #dddddd; -} -.pagination > .active > a, -.pagination > .active > span, -.pagination > .active > a:hover, -.pagination > .active > span:hover, -.pagination > .active > a:focus, -.pagination > .active > span:focus { - z-index: 2; - color: #ffffff; - background-color: #da4d4d; - border-color: #da4d4d; + +a.text-warning:focus, a.text-warning:hover { + color: #d39e00 !important; } -.pagination > .disabled > span, -.pagination > .disabled > span:hover, -.pagination > .disabled > span:focus, -.pagination > .disabled > a, -.pagination > .disabled > a:hover, -.pagination > .disabled > a:focus { - color: #999999; - background-color: #ffffff; - border-color: #dddddd; -} -/* responsive utilities */ -@media (max-width: 767px) { - .text-center-xs { - text-align: center !important; - } - .text-center-xs img { - display: block; - margin-left: auto; - margin-right: auto; - } + +.text-danger { + color: #dc3545 !important; } -@media (min-width: 768px) and (max-width: 991px) { - .text-center-sm { - text-align: center !important; - } - .text-center-sm img { - display: block; - margin-left: auto; - margin-right: auto; - } + +a.text-danger:focus, a.text-danger:hover { + color: #bd2130 !important; } -/* type */ -h1, -h2, -h3, -h4, -h5, -h6, -.h1, -.h2, -.h3, -.h4, -.h5, -.h6 { - font-family: "Roboto", Helvetica, Arial, sans-serif; - font-weight: 900; - line-height: 1.1; - color: #333333; + +.text-light { + color: #f8f9fa !important; } -h1, -.h1, -h2, -.h2, -h3, -.h3 { - margin-top: 20px; - margin-bottom: 20px; + +a.text-light:focus, a.text-light:hover { + color: #dae0e5 !important; } -p { - margin: 0 0 10px; + +.text-dark { + color: #343a40 !important; } -.lead { - margin-bottom: 20px; - font-size: 18px; + +a.text-dark:focus, a.text-dark:hover { + color: #1d2124 !important; } -@media (min-width: 768px) { - .lead { - font-size: 21px; - } + +.badge-primary { + color: #fff; + background-color: #da4d4d; } -.text-small { - font-size: 12px; + +.badge-primary[href]:focus, .badge-primary[href]:hover { + color: #fff; + text-decoration: none; + background-color: #ca2a2a; } -.text-large { - font-size: 18px; + +.badge-secondary { + color: #fff; + background-color: #868e96; } -.text-italic { - font-style: italic; + +.badge-secondary[href]:focus, .badge-secondary[href]:hover { + color: #fff; + text-decoration: none; + background-color: #6c757d; } -.text-primary { - color: #da4d4d; + +.badge-success { + color: #fff; + background-color: #28a745; } -a.text-primary:hover { - color: #ca2a2a; + +.badge-success[href]:focus, .badge-success[href]:hover { + color: #fff; + text-decoration: none; + background-color: #1e7e34; } -.bg-primary { + +.badge-info { color: #fff; - background-color: #da4d4d; + background-color: #17a2b8; } -a.bg-primary:hover { - background-color: #ca2a2a; + +.badge-info[href]:focus, .badge-info[href]:hover { + color: #fff; + text-decoration: none; + background-color: #117a8b; } -abbr[title], -abbr[data-original-title] { - border-bottom: 1px dotted #999999; + +.badge-warning { + color: #111; + background-color: #ffc107; } -blockquote { - padding: 10px 20px; - margin: 0 0 20px; - font-size: 14px; - border-left: 5px solid #da4d4d; + +.badge-warning[href]:focus, .badge-warning[href]:hover { + color: #111; + text-decoration: none; + background-color: #d39e00; } -blockquote footer, -blockquote small, -blockquote .small { - display: block; - font-size: 80%; - line-height: 1.42857143; - color: #999999; + +.badge-danger { + color: #fff; + background-color: #dc3545; } -blockquote footer:before, -blockquote small:before, -blockquote .small:before { - content: '\2014 \00A0'; + +.badge-danger[href]:focus, .badge-danger[href]:hover { + color: #fff; + text-decoration: none; + background-color: #bd2130; } -.blockquote-reverse, -blockquote.pull-right { - border-right: 5px solid #da4d4d; + +.badge-light { + color: #111; + background-color: #f8f9fa; } -address { - margin-bottom: 20px; - line-height: 1.42857143; + +.badge-light[href]:focus, .badge-light[href]:hover { + color: #111; + text-decoration: none; + background-color: #dae0e5; } -.panel { - margin-bottom: 20px; - background-color: #ffffff; - border: 1px solid transparent; + +.badge-dark { + color: #fff; + background-color: #343a40; +} + +.badge-dark[href]:focus, .badge-dark[href]:hover { + color: #fff; + text-decoration: none; + background-color: #1d2124; +} + +/* +* 7.CODE +*/ +code { + font-size: 87.5%; + color: #e83e8c; border-radius: 0; - -webkit-box-shadow: 0 0 0; - box-shadow: 0 0 0; } -.panel-heading { - border-top-right-radius: 0; + +a > code { + padding: 0; + color: inherit; + background-color: inherit; +} + +/* +* 8. NAV +*/ +.nav-link { + padding: 0.5rem 1rem; +} + +.nav-link.disabled { + color: #868e96; +} + +.nav-tabs .nav-item { + margin-bottom: -1px; +} + +.nav-tabs .nav-link { + border: 1px solid transparent; border-top-left-radius: 0; - text-transform: uppercase; - letter-spacing: 0.08em; - padding: 15px 15px; + border-top-right-radius: 0; } -.progress { - overflow: hidden; - height: 20px; - margin-bottom: 20px; - background-color: #f5f5f5; - border-radius: 0; - -webkit-box-shadow: none; - box-shadow: none; + +.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover { + border-color: #e9ecef #e9ecef #dee2e6; } -.panel-group { - margin-bottom: 20px; + +.nav-tabs .nav-link.disabled { + color: #868e96; } -.panel-group .panel { - margin-bottom: 0; + +.nav-tabs .nav-link.active, +.nav-tabs .nav-item.show .nav-link { + color: #495057; + background-color: #fff; +} + +.nav-tabs .dropdown-menu { + margin-top: -1px; +} + +.nav-pills .nav-link { border-radius: 0; - overflow: hidden; } -.panel-group .panel + .panel { - margin-top: 5px; + +.nav-pills .nav-link.active, +.nav-pills .show > .nav-link { + color: #fff; + background-color: #da4d4d; } -.panel-group.accordion .panel { - border-color: #ccc; + +/* +* 9. CARD +*/ +.card { + background-color: #fff; + border: 1px solid rgba(0, 0, 0, 0.125); + border-radius: 0; } -.panel-primary { - border-color: #da4d4d; + +.card > .list-group:first-child .list-group-item:first-child { + border-top-left-radius: 0; + border-top-right-radius: 0; } -.panel-primary > .panel-heading { - color: #ffffff; - background-color: #da4d4d; - border-color: #da4d4d; + +.card > .list-group:last-child .list-group-item:last-child { + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; } -.panel-primary > .panel-heading + .panel-collapse > .panel-body { - border-top-color: #da4d4d; + +.card-body { + padding: 1.25rem; } -.panel-primary > .panel-heading .badge { - color: #da4d4d; - background-color: #ffffff; + +.card-title { + margin-bottom: 0.75rem; } -.panel-primary > .panel-footer + .panel-collapse > .panel-body { - border-bottom-color: #da4d4d; + +.card-subtitle { + margin-top: -0.375rem; } -.panel-primary .panel-title { - font-weight: 300; + +.card-link + .card-link { + margin-left: 1.25rem; } -.panel-primary .panel-title a:hover { - color: #fff; - text-decoration: none; + +.card-header { + padding: 0.75rem 1.25rem; + background-color: rgba(0, 0, 0, 0.03); + border-bottom: 1px solid rgba(0, 0, 0, 0.125); } -a.badge:hover, -a.badge:focus { - color: #ffffff; - text-decoration: none; - cursor: pointer; + +.card-header:first-child { + border-radius: calc(0 - 1px) calc(0 - 1px) 0 0; } -a.list-group-item.active > .badge, -.nav-pills > .active > a > .badge { - color: #da4d4d; - background-color: #ffffff; + +.card-header-transparent { + background-color: rgba(0, 0, 0, 0.3); + border-bottom: none; } -.nav-pills > li > a > .badge { - margin-left: 3px; + +.card-footer { + padding: 0.75rem 1.25rem; + background-color: #f8f9fa; + border-top: 1px solid rgba(0, 0, 0, 0.125); +} + +.card-footer:last-child { + border-radius: 0 0 calc(0 - 1px) calc(0 - 1px); +} + +.card-header-tabs { + margin-right: -0.625rem; + margin-bottom: -0.75rem; + margin-left: -0.625rem; + border-bottom: 0; } -.progress-bar-primary { - background-color: #da4d4d; + +.card-header-pills { + margin-right: -0.625rem; + margin-left: -0.625rem; } -.progress-striped .progress-bar-primary { - background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); - background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); - background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); + +.card-img-overlay { + padding: 1.25rem; } -/*! - * Yamm!3 - Yet another megamenu for Bootstrap 3 - * http://geedmo.github.com/yamm3 - * - * @geedmo - Licensed under the MIT license - */ -.yamm .nav, -.yamm .collapse, -.yamm .dropup.use-yamm, -.yamm .dropdown.use-yamm { - position: static; + +.card-img-overlay-opacity { + background: rgba(0, 0, 0, 0.2); } -.yamm .container { - position: relative; + +.card-img { + border-radius: calc(0 - 1px); } -.yamm .dropdown-menu { - left: auto; + +.card-img-top { + border-top-left-radius: calc(0 - 1px); + border-top-right-radius: calc(0 - 1px); } -.yamm .nav.navbar-right .dropdown-menu { - left: auto; - right: 0; + +.card-img-bottom { + border-bottom-right-radius: calc(0 - 1px); + border-bottom-left-radius: calc(0 - 1px); } -.yamm .yamm-content { - padding: 20px 30px; + +.card-deck .card { + margin-bottom: 15px; } -.yamm .dropdown.yamm-fw .dropdown-menu { - left: 15px; - right: 15px; + +@media (min-width: 576px) { + .card-deck { + margin-right: -15px; + margin-left: -15px; + } + .card-deck .card { + margin-right: 15px; + margin-left: 15px; + } } diff --git a/static/css/style.turquoise.css b/static/css/style.turquoise.css deleted file mode 100644 index cfdc2048d..000000000 --- a/static/css/style.turquoise.css +++ /dev/null @@ -1,3566 +0,0 @@ -.clearfix:before, -.clearfix:after, -.navbar:before, -.navbar:after, -.navbar-header:before, -.navbar-header:after { - content: " "; - display: table; -} -.clearfix:after, -.navbar:after, -.navbar-header:after { - clear: both; -} -.center-block { - display: block; - margin-left: auto; - margin-right: auto; -} -.pull-right { - float: right !important; -} -.pull-left { - float: left !important; -} -.hide { - display: none !important; -} -.show { - display: block !important; -} -.invisible { - visibility: hidden; -} -.text-hide { - font: 0/0 a; - color: transparent; - text-shadow: none; - background-color: transparent; - border: 0; -} -.hidden { - display: none !important; - visibility: hidden !important; -} -.affix { - position: fixed; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); -} -/* general styles */ -a, -button { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -a i[class^="fa"], -button i[class^="fa"] { - margin: 0 5px; -} -.clickable { - cursor: pointer !important; -} -.required { - color: #4fbfa8; -} -.accent { - color: #4fbfa8; -} -.text-uppercase { - text-transform: uppercase; - letter-spacing: 0.08em; -} -@media (max-width: 991px) { - .text-center-sm { - text-align: center; - } -} -p.lead { - margin-bottom: 40px; -} -section, -div.section { - margin-bottom: 40px; -} -.no-mb { - margin-bottom: 0 !important; -} -.mb-small { - margin-bottom: 20px !important; -} -.heading { - margin-bottom: 40px; -} -.heading h1, -.heading h2, -.heading h3, -.heading h4, -.heading h5 { - display: inline-block; - border-bottom: solid 5px #4fbfa8; - line-height: 1.1; - margin-bottom: 0; - padding-bottom: 10px; - vertical-align: middle; - text-transform: uppercase; - letter-spacing: 0.06em; -} -.heading h1 i[class^="fa"], -.heading h2 i[class^="fa"], -.heading h3 i[class^="fa"], -.heading h4 i[class^="fa"], -.heading h5 i[class^="fa"] { - display: inline-block; - background: #4fbfa8; - width: 30px; - height: 30px; - vertical-align: middle; - text-align: center; - color: #fff; - font-size: 12px; - line-height: 30px; - border-radius: 15px; -} -.icon { - display: inline-block; - width: 80px; - height: 80px; - color: #fff; - line-height: 80px; - border-radius: 40px; - border: solid 1px #fff; - font-size: 20px; -} -.icon.icon-lg { - font-size: 30px; - border-width: 2px; -} -.ul-icons { - padding-left: 10px; -} -.ul-icons li { - list-style-type: none; - line-height: 20px; - margin-bottom: 20px; -} -.ul-icons li i { - width: 20px; - height: 20px; - background: #4fbfa8; - color: #fff; - text-align: center; - border-radius: 10px; - line-height: 20px; - margin-right: 10px; -} -ul.list-style-none { - list-style: none; -} -#text-page h1, -#text-page h2, -#text-page h3 { - font-weight: 700; -} -#error-page { - text-align: center; - margin-top: 40px; - margin-bottom: 100px; -} -#error-page h4 { - margin-bottom: 40px; -} -#error-page p.buttons { - margin-top: 40px; -} -.pages-listing .item { - text-align: center; -} -.pages-listing .item h3 { - font-size: 18px; - text-transform: uppercase; - margin-bottom: 20px; - letter-spacing: 0.08em; -} -.pages-listing .item h3 a { - color: #555555; -} -.pages-listing .item .text { - margin-bottom: 20px; -} -.pages-listing .item .text p { - color: #999999; - font-size: 12px; - margin-bottom: 20px; -} -.banner { - margin-bottom: 30px; - text-align: center; -} -.banner img { - margin: 0 auto; -} -.banner a:hover img { - opacity: 0.8; - filter: alpha(opacity=80); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -.pages { - text-align: center; -} -.pages .loadMore { - text-align: center; -} -.pages .pagination { - text-align: center; -} -.features-buttons button { - margin-bottom: 20px; -} -@media (min-width: 1300px) { - body.boxed { - background: url(https://www.toptal.com/designers/subtlepatterns/patterns/subtle_zebra_3d.png); - } - body.boxed #all { - position: relative; - background: #fff; - width: 1200px; - margin: 0 auto; - overflow: hidden; - -webkit-box-shadow: 0 0 5px #cccccc; - box-shadow: 0 0 5px #cccccc; - } -} -#top { - background: #555555; - color: #eeeeee; - padding: 10px 0; -} -#top p { - margin: 0; - font-size: 12px; -} -#top .social { - float: right; - text-align: right; -} -#top .social a { - color: #999999; - display: inline-block; - width: 24px; - height: 24px; - border-radius: 12px; - line-height: 24px; - font-size: 12px; - text-align: center; -} -#top .social a:hover { - color: #fff; - background: #4fbfa8; - -webkit-transform: scale(1.1); - transform: scale(1.1); -} -#top .social a:hover.facebook { - background-color: #4460ae; -} -#top .social a:hover.gplus { - background-color: #c21f25; -} -#top .social a:hover.twitter { - background-color: #3cf; -} -#top .social a:hover.instagram { - background-color: #cd4378; -} -#top .social a:hover.email { - background-color: #4a7f45; -} -#top .login { - float: right; -} -#top .login a { - font-size: 12px; - color: #eeeeee; - margin-right: 15px; - text-decoration: none; - text-transform: uppercase; - font-weight: 700; - letter-spacing: 0.10em; -} -@media (max-width: 767px) { - #top .login { - float: left; - } -} -#top.light { - background: #fff; - color: #999999; - border-bottom: solid 1px #eeeeee; -} -#top.light .login a { - color: #555555; -} -.navbar { - border: none; -} -.navbar ul.nav > li > a { - text-transform: uppercase; - text-decoration: underline; - font-weight: bold; - letter-spacing: 0.08em; - border-top: solid 5px transparent; -} -.navbar ul.nav > li > a:hover { - border-top: solid 5px #4fbfa8; -} -.navbar ul.nav > li.active > a, -.navbar ul.nav > li.open > a { - text-decoration: none !important; - border-top: solid 5px #2d7b6b; -} -@media (max-width: 768px) { - .navbar ul.nav > li.active > a, - .navbar ul.nav > li.open > a { - border-top-color: transparent; - } - .navbar ul.nav > li > a:hover { - border-top-color: transparent; - } -} -.navbar.navbar-light ul.nav > li.active > a { - border-top: solid 5px #2d7b6b; - background: #fff !important; - color: #555555 !important; -} -.navbar.navbar-light ul.nav > li.active > a:hover { - border-top: solid 5px #2d7b6b; -} -.navbar.navbar-light ul.nav > li > a:hover, -.navbar.navbar-light ul.nav > li.open > a:hover, -.navbar.navbar-light ul.nav > li > a:focus, -.navbar.navbar-light ul.nav > li.open > a:focus { - border-top: solid 5px #4fbfa8; - background: #fff !important; - color: #555555 !important; -} -.navbar ul.dropdown-menu { - margin: 0; - padding: 0; -} -.navbar ul.dropdown-menu li { - list-style-type: none; - border-bottom: solid 1px #eeeeee; - text-transform: uppercase; - letter-spacing: 0.08em; - padding: 4px 0; -} -.navbar ul.dropdown-menu li a { - position: relative; - color: #999999; - font-size: 12px; - display: block; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - left: 0; -} -.navbar ul.dropdown-menu li a:hover { - color: #4fbfa8; - text-decoration: none; - background: none; - left: 2px; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -@media (max-width: 767px) { - .navbar ul.dropdown-menu li a:hover { - left: 0; - } -} -.navbar .yamm-content h3 { - font-size: 18px; - text-transform: uppercase; - padding-bottom: 10px; - margin-top: 5px; - border-bottom: dotted 1px #555555; - letter-spacing: 0.08em; -} -@media (max-width: 767px) { - .navbar .yamm-content h3 { - font-size: 14px; - } -} -.navbar .yamm-content h5 { - text-transform: uppercase; - padding-bottom: 10px; - border-bottom: dotted 1px #555555; - letter-spacing: 0.08em; -} -.navbar .yamm-content ul { - margin: 0; - padding: 0; -} -.navbar .yamm-content ul li { - list-style-type: none; - border-bottom: solid 1px #eeeeee; - text-transform: uppercase; - padding: 4px 0; -} -.navbar .yamm-content ul li a { - position: relative; - color: #999999; - font-size: 12px; - display: block; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -.navbar .yamm-content ul li a:hover { - color: #4fbfa8; - text-decoration: none; - padding-left: 2px; -} -.navbar .yamm-content .banner { - margin-bottom: 10px; -} -.navbar .yamm-fw .dropdown-menu { - padding: 0; -} -.navbar .navbar-buttons { - float: right; -} -.navbar .navbar-buttons button, -.navbar .navbar-buttons a.btn, -.navbar .navbar-buttons .btn-default.navbar-toggle { - margin-top: 11px; - margin-bottom: 11px; - margin-left: 0; - margin-right: 5px; -} -.navbar .btn-default, -.navbar .btn-default.navbar-toggle { - color: #999999; - background-color: #fff; - margin-left: 7px; - margin-right: 0; -} -.navbar .btn-default:hover, -.navbar .btn-default.navbar-toggle:hover, -.navbar .btn-default:focus, -.navbar .btn-default.navbar-toggle:focus { - background-color: #fff; - border-color: #4fbfa8; - color: #4fbfa8; -} -.navbar #search { - clear: both; - border-top: solid 1px #4fbfa8; - text-align: right; -} -.navbar #search form { - float: right; -} -.navbar #search form .input-group { - width: 500px; -} -@media (max-width: 768px) { - .navbar #search form .input-group { - width: 100%; - } -} -.navbar #basket-overview a { - margin-left: 7px; -} -.navbar-affixed-top { - top: -32px; -} -.navbar-affixed-top.affix-top { - -webkit-transition: all 0.5s ease-out; - -moz-transition: all 0.5s ease-out; - transition: all 0.5s ease-out; -} -.navbar-affixed-top.affix { - position: fixed; - width: 100%; - top: 0; - z-index: 1000; - -webkit-box-shadow: 0 0 5px #cccccc; - box-shadow: 0 0 5px #cccccc; - -webkit-transition: all 0.5s ease-out; - -moz-transition: all 0.5s ease-out; - transition: all 0.5s ease-out; -} -body.boxed .navbar-affixed-top.affix { - position: static; -} -#login-modal { - overflow: hidden; -} -#login-modal .modal-header h4 { - text-transform: uppercase; -} -#login-modal form { - margin-bottom: 20px; -} -#login-modal a { - color: #4fbfa8; -} -#login-modal p { - font-weight: 300; - margin-bottom: 20px; - font-size: 13px; -} -/* buttons */ -.btn { - font-weight: 700; - font-family: "Roboto", Helvetica, Arial, sans-serif; - text-transform: uppercase; - letter-spacing: 0.08em; - padding: 6px 12px; - font-size: 13px; - line-height: 1.42857143; - border-radius: 0; -} -.input-group .btn { - font-size: 14px; -} -.btn-lg { - padding: 10px 16px; - font-size: 14px; - line-height: 1.33; - border-radius: 0; -} -.btn-sm { - padding: 5px 10px; - font-size: 12px; - line-height: 1.5; - border-radius: 0; -} -.btn-xs { - padding: 1px 5px; - font-size: 12px; - line-height: 1.5; - border-radius: 0; -} -.btn-template-main { - color: #4fbfa8; - background-color: #ffffff; - border-color: #4fbfa8; -} -.btn-template-main:hover, -.btn-template-main:focus, -.btn-template-main:active, -.btn-template-main.active, -.open > .dropdown-toggle.btn-template-main { - color: #4fbfa8; - background-color: #e6e6e6; - border-color: #389985; -} -.btn-template-main:active, -.btn-template-main.active, -.open > .dropdown-toggle.btn-template-main { - background-image: none; -} -.btn-template-main.disabled, -.btn-template-main[disabled], -fieldset[disabled] .btn-template-main, -.btn-template-main.disabled:hover, -.btn-template-main[disabled]:hover, -fieldset[disabled] .btn-template-main:hover, -.btn-template-main.disabled:focus, -.btn-template-main[disabled]:focus, -fieldset[disabled] .btn-template-main:focus, -.btn-template-main.disabled:active, -.btn-template-main[disabled]:active, -fieldset[disabled] .btn-template-main:active, -.btn-template-main.disabled.active, -.btn-template-main[disabled].active, -fieldset[disabled] .btn-template-main.active { - background-color: #ffffff; - border-color: #4fbfa8; -} -.btn-template-main .badge { - color: #ffffff; - background-color: #4fbfa8; -} -.btn-template-main:hover, -.btn-template-main:focus, -.btn-template-main:active, -.btn-template-main.active { - background: #4fbfa8; - color: #ffffff; - border-color: #4fbfa8; -} -.btn-template-transparent-primary { - color: #ffffff; - background-color: transparent; - border-color: #ffffff; -} -.btn-template-transparent-primary:hover, -.btn-template-transparent-primary:focus, -.btn-template-transparent-primary:active, -.btn-template-transparent-primary.active, -.open > .dropdown-toggle.btn-template-transparent-primary { - color: #ffffff; - background-color: rgba(0, 0, 0, 0); - border-color: #e0e0e0; -} -.btn-template-transparent-primary:active, -.btn-template-transparent-primary.active, -.open > .dropdown-toggle.btn-template-transparent-primary { - background-image: none; -} -.btn-template-transparent-primary.disabled, -.btn-template-transparent-primary[disabled], -fieldset[disabled] .btn-template-transparent-primary, -.btn-template-transparent-primary.disabled:hover, -.btn-template-transparent-primary[disabled]:hover, -fieldset[disabled] .btn-template-transparent-primary:hover, -.btn-template-transparent-primary.disabled:focus, -.btn-template-transparent-primary[disabled]:focus, -fieldset[disabled] .btn-template-transparent-primary:focus, -.btn-template-transparent-primary.disabled:active, -.btn-template-transparent-primary[disabled]:active, -fieldset[disabled] .btn-template-transparent-primary:active, -.btn-template-transparent-primary.disabled.active, -.btn-template-transparent-primary[disabled].active, -fieldset[disabled] .btn-template-transparent-primary.active { - background-color: transparent; - border-color: #ffffff; -} -.btn-template-transparent-primary .badge { - color: transparent; - background-color: #ffffff; -} -.btn-template-transparent-primary:hover, -.btn-template-transparent-primary:focus, -.btn-template-transparent-primary:active, -.btn-template-transparent-primary.active { - background: #fff; - color: #4fbfa8; - border-color: #fff; -} -.btn-template-transparent-black { - color: #ffffff; - background-color: transparent; - border-color: #ffffff; -} -.btn-template-transparent-black:hover, -.btn-template-transparent-black:focus, -.btn-template-transparent-black:active, -.btn-template-transparent-black.active, -.open > .dropdown-toggle.btn-template-transparent-black { - color: #ffffff; - background-color: rgba(0, 0, 0, 0); - border-color: #e0e0e0; -} -.btn-template-transparent-black:active, -.btn-template-transparent-black.active, -.open > .dropdown-toggle.btn-template-transparent-black { - background-image: none; -} -.btn-template-transparent-black.disabled, -.btn-template-transparent-black[disabled], -fieldset[disabled] .btn-template-transparent-black, -.btn-template-transparent-black.disabled:hover, -.btn-template-transparent-black[disabled]:hover, -fieldset[disabled] .btn-template-transparent-black:hover, -.btn-template-transparent-black.disabled:focus, -.btn-template-transparent-black[disabled]:focus, -fieldset[disabled] .btn-template-transparent-black:focus, -.btn-template-transparent-black.disabled:active, -.btn-template-transparent-black[disabled]:active, -fieldset[disabled] .btn-template-transparent-black:active, -.btn-template-transparent-black.disabled.active, -.btn-template-transparent-black[disabled].active, -fieldset[disabled] .btn-template-transparent-black.active { - background-color: transparent; - border-color: #ffffff; -} -.btn-template-transparent-black .badge { - color: transparent; - background-color: #ffffff; -} -.btn-template-transparent-black:hover, -.btn-template-transparent-black:focus, -.btn-template-transparent-black:active, -.btn-template-transparent-black.active { - background: #fff; - color: #000; - border-color: #fff; -} -.btn-template-primary { - color: #ffffff; - background-color: #4fbfa8; - border-color: #4fbfa8; -} -.btn-template-primary:hover, -.btn-template-primary:focus, -.btn-template-primary:active, -.btn-template-primary.active, -.open > .dropdown-toggle.btn-template-primary { - color: #ffffff; - background-color: #3aa18c; - border-color: #389985; -} -.btn-template-primary:active, -.btn-template-primary.active, -.open > .dropdown-toggle.btn-template-primary { - background-image: none; -} -.btn-template-primary.disabled, -.btn-template-primary[disabled], -fieldset[disabled] .btn-template-primary, -.btn-template-primary.disabled:hover, -.btn-template-primary[disabled]:hover, -fieldset[disabled] .btn-template-primary:hover, -.btn-template-primary.disabled:focus, -.btn-template-primary[disabled]:focus, -fieldset[disabled] .btn-template-primary:focus, -.btn-template-primary.disabled:active, -.btn-template-primary[disabled]:active, -fieldset[disabled] .btn-template-primary:active, -.btn-template-primary.disabled.active, -.btn-template-primary[disabled].active, -fieldset[disabled] .btn-template-primary.active { - background-color: #4fbfa8; - border-color: #4fbfa8; -} -.btn-template-primary .badge { - color: #4fbfa8; - background-color: #ffffff; -} -#intro { - background: url('../img/home.jpg') no-repeat center top; - -webkit-background-size: cover; - -moz-background-size: cover; - -o-background-size: cover; - background-size: cover; -} -#intro .item { - font-family: "Roboto", Helvetica, Arial, sans-serif; - height: 100%; -} -#intro .item h1 { - text-transform: uppercase; - font-size: 50px; - color: #fff; - margin-bottom: 40px; - letter-spacing: 0.08em; -} -@media (max-width: 991px) { - #intro .item h1 { - font-size: 40px; - } -} -@media (max-width: 767px) { - #intro .item h1 { - font-size: 25px; - } -} -#intro .item h3 { - color: #fff; - margin-bottom: 40px; -} -@media (max-width: 767px) { - #intro .item h3 { - font-size: 15px; - margin-bottom: 20px; - } -} -#intro .item .btn { - text-transform: none; -} -@media (max-width: 991px) { - #intro .item .btn { - font-size: 14px; - } -} -@media (max-width: 991px) { - #intro .item .carousel-caption { - left: 10%; - right: 10%; - } -} -#intro .container, -#intro .row { - height: 100%; - position: relative; -} -.jumbotron { - padding: 30px; - margin-bottom: 0; - position: relative; - background: url('../img/photogrid.jpg') center center repeat; - background-size: cover; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -.jumbotron .dark-mask { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: #4fbfa8; - opacity: 0.9; - filter: alpha(opacity=90); -} -.jumbotron h1, -.jumbotron h2, -.jumbotron h3, -.jumbotron p, -.jumbotron ul { - color: #fff; -} -.jumbotron h1, -.jumbotron h2, -.jumbotron h3 { - color: #ffffff; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.jumbotron p { - margin-bottom: 20px; - font-size: 21px; - font-weight: 400; -} -.jumbotron p.text-uppercase { - font-weight: 700; -} -.jumbotron > hr { - border-top-color: #d5d5d5; -} -.container .jumbotron { - border-radius: 0; -} -.jumbotron .container { - max-width: 100%; - z-index: 2; -} -@media screen and (min-width: 768px) { - .jumbotron { - padding-top: 48px; - padding-bottom: 48px; - } - .container .jumbotron { - padding-left: 60px; - padding-right: 60px; - } - .jumbotron h1, - .jumbotron .h1 { - font-size: 46px; - } -} -#categoryMenu h3 { - padding: 20px; - background: #f7f7f7; - margin: 0; - border-bottom: solid 1px #eeeeee; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.panel.sidebar-menu h3 { - padding: 5px 0; - margin: 0; -} -.panel.sidebar-menu { - background: #fff; - margin: 0 0 20px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; -} -.panel.sidebar-menu .panel-heading { - text-transform: uppercase; - margin-bottom: 10px; - background: none; - padding: 0; - letter-spacing: 0.08em; - border-bottom: none; -} -.panel.sidebar-menu .panel-heading h1, -.panel.sidebar-menu .panel-heading h2, -.panel.sidebar-menu .panel-heading h3, -.panel.sidebar-menu .panel-heading h4, -.panel.sidebar-menu .panel-heading h5 { - display: inline-block; - border-bottom: solid 5px #4fbfa8; - line-height: 1.1; - margin-bottom: 0; - padding-bottom: 10px; -} -.panel.sidebar-menu .panel-heading .btn.btn-danger { - color: #fff; - margin-top: 5px; -} -.panel.sidebar-menu .panel-body { - padding: 0; -} -.panel.sidebar-menu .panel-body span.colour { - display: inline-block; - width: 15px; - height: 15px; - border: solid 1px #555555; - vertical-align: top; - margin-top: 2px; - margin-left: 5px; -} -.panel.sidebar-menu .panel-body span.colour.white { - background: #fff; -} -.panel.sidebar-menu .panel-body span.colour.red { - background: red; -} -.panel.sidebar-menu .panel-body span.colour.green { - background: green; -} -.panel.sidebar-menu .panel-body span.colour.blue { - background: blue; -} -.panel.sidebar-menu .panel-body span.colour.yellow { - background: yellow; -} -.panel.sidebar-menu .panel-body label { - color: #999999; - font-size: 12px; -} -.panel.sidebar-menu .panel-body label:hover { - color: #555555; -} -.panel.sidebar-menu ul.nav.category-menu { - margin-bottom: 20px; - text-transform: uppercase; - font-weight: 700; - letter-spacing: 0.08em; -} -.panel.sidebar-menu ul.nav.category-menu li a { - font-family: "Roboto", Helvetica, Arial, sans-serif; -} -.panel.sidebar-menu ul.nav ul { - list-style: none; - padding-left: 0; -} -.panel.sidebar-menu ul.nav ul li { - display: block; -} -.panel.sidebar-menu ul.nav ul li a { - position: relative; - font-family: "Times New Roman", Times, serif; - font-weight: normal; - text-transform: none !important; - display: block; - padding: 10px 15px; - padding-left: 30px; - font-size: 12px; - color: #999999; -} -.panel.sidebar-menu ul.nav ul li a:hover, -.panel.sidebar-menu ul.nav ul li a:focus { - text-decoration: none; - background-color: #eeeeee; -} -.panel.sidebar-menu ul.tag-cloud { - list-style: none; - padding-left: 0; -} -.panel.sidebar-menu ul.tag-cloud li { - display: inline-block; -} -.panel.sidebar-menu ul.tag-cloud li a { - display: inline-block; - padding: 5px; - border: solid 1px #eeeeee; - border-radius: 0; - color: #4fbfa8; - margin: 5px 5px 5px 0; - text-transform: uppercase; - letter-spacing: 0.08em; - font-weight: 700; - font-size: 12px; - text-decoration: none; -} -.panel.sidebar-menu ul.tag-cloud li a:hover { - color: #4fbfa8; - border-color: #4fbfa8; -} -.panel.sidebar-menu ul.tag-cloud li.active a { - color: #FFFFFF; - background-color: #4fbfa8; -} -.panel.sidebar-menu ul.tag-cloud li.active a:hover { - color: #FFFFFF; -} -.panel.sidebar-menu ul.popular, -.panel.sidebar-menu ul.recent { - list-style: none; - padding-left: 0; - padding: 20px 0; -} -.panel.sidebar-menu ul.popular li, -.panel.sidebar-menu ul.recent li { - margin-bottom: 10px; - padding: 5px 0; - border-bottom: dotted 1px #eeeeee; -} -.panel.sidebar-menu ul.popular li:before, -.panel.sidebar-menu ul.recent li:before, -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - content: " "; - display: table; -} -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - clear: both; -} -.panel.sidebar-menu ul.popular li:before, -.panel.sidebar-menu ul.recent li:before, -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - content: " "; - display: table; -} -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - clear: both; -} -.panel.sidebar-menu ul.popular li img, -.panel.sidebar-menu ul.recent li img { - width: 50px; - margin-right: 10px; -} -.panel.sidebar-menu ul.popular li h5, -.panel.sidebar-menu ul.recent li h5 { - margin: 0 0 10px; -} -.panel.sidebar-menu ul.popular li h5 a, -.panel.sidebar-menu ul.recent li h5 a { - font-weight: normal; -} -.panel.sidebar-menu ul.popular li p.date, -.panel.sidebar-menu ul.recent li p.date { - float: right; - font-size: 12px; - color: #999999; -} -.panel.sidebar-menu ul.popular li:last-child, -.panel.sidebar-menu ul.recent li:last-child { - border-bottom: none; -} -.panel.sidebar-menu .text-widget { - font-size: 12px; -} -.panel.sidebar-menu.with-icons ul.nav li a:after { - font-family: 'FontAwesome'; - content: "\f105"; - position: relative; - top: 0; - float: right; -} -/* ribbons for product sales etc. */ -.ribbon { - position: absolute; - top: 50px; - padding-left: 51px; - font-weight: 700; - letter-spacing: 0.08em; -} -.ribbon .ribbon-background { - position: absolute; - top: 0; - right: 0; -} -.ribbon .theribbon { - position: relative; - width: 80px; - padding: 6px 20px 6px 20px; - margin: 30px 10px 10px -71px; - color: #fff; - background-color: #4fbfa8; - font-family: "Roboto", Helvetica, Arial, sans-serif; -} -.ribbon .theribbon:before, -.ribbon .theribbon:after { - content: ' '; - position: absolute; - width: 0; - height: 0; -} -.ribbon .theribbon:after { - left: 0px; - top: 100%; - border-width: 5px 10px; - border-style: solid; - border-color: #000000 #000000 transparent transparent; -} -.ribbon.sale { - top: 0; -} -.ribbon.new { - top: 50px; -} -.ribbon.new .theribbon { - background-color: #5bc0de; - text-shadow: 0px 1px 2px #bbb; -} -.ribbon.new .theribbon:after { - border-color: #2390b0 #2390b0 transparent transparent; -} -.ribbon.gift { - top: 100px; -} -.ribbon.gift .theribbon { - background-color: #5cb85c; - text-shadow: 0px 1px 2px #bbb; -} -.ribbon.gift .theribbon:after { - border-color: #357935 #357935 transparent transparent; -} -.owl-carousel .owl-controls .owl-page.active span, -.owl-theme .owl-controls .owl-page.active span, -.owl-carousel .owl-controls.clickable .owl-page:hover span, -.owl-theme .owl-controls.clickable .owl-page:hover span { - background: #4fbfa8; -} -.owl-carousel .owl-controls .owl-buttons, -.owl-theme .owl-controls .owl-buttons { - position: absolute; - top: 5px; - right: 0; -} -.owl-carousel .owl-controls .owl-buttons div, -.owl-theme .owl-controls .owl-buttons div { - width: 26px; - height: 26px; - line-height: 25px; - margin: 0 5px 0 0; - font-size: 18px; - color: #4fbfa8; - padding: 0; - background: #fff; - border-radius: 13px; - vertical-align: middle; - text-align: center; - opacity: 1; - filter: alpha(opacity=100); -} -.home-carousel { - position: relative; - background: url('../img/photogrid.jpg') center center repeat; - background-size: cover; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -.home-carousel .dark-mask { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: #4fbfa8; - opacity: 0.9; - filter: alpha(opacity=90); -} -.home-carousel .owl-carousel { - padding-top: 60px; - padding-bottom: 20px; -} -.home-carousel .owl-theme .owl-controls .owl-page span { - background: #666; -} -.home-carousel .owl-theme .owl-controls .owl-page.active span { - background: #fff; -} -.home-carousel .owl-theme .owl-controls .owl-page:hover span { - background: #fff; -} -@media (max-width: 767px) { - .home-carousel { - text-align: center !important; - } -} -@media (min-width: 992px) { - .home-carousel .right { - text-align: right; - } -} -.home-carousel h1, -.home-carousel h2, -.home-carousel h3, -.home-carousel p, -.home-carousel ul { - color: #fff; -} -.home-carousel h1 { - font-weight: 700; - text-transform: uppercase; - font-size: 46px; - letter-spacing: 0.08em; -} -@media (max-width: 991px) { - .home-carousel h1 { - font-size: 36px; - } -} -.home-carousel h2 { - font-weight: 700; - text-transform: uppercase; - font-size: 40px; - letter-spacing: 0.08em; -} -.home-carousel ul, -.home-carousel p { - font-size: 18px; - font-weight: 700; - padding: 0; - text-transform: uppercase; - letter-spacing: 0.10em; -} -@media (max-width: 991px) { - .home-carousel ul, - .home-carousel p { - font-size: 14px; - } -} -.home-carousel ul li { - margin-bottom: 10px; -} -.customers { - padding: 0; - margin-bottom: 40px; -} -.customers .item { - list-style-type: none; - text-align: center; - margin: 0 20px; -} -.customers .item img { - display: inline-block; - filter: url("data:image/svg+xml;utf8,#grayscale"); - /* Firefox 10+, Firefox on Android */ - filter: gray; - /* IE6-9 */ - -webkit-filter: grayscale(100%); - /* Chrome 19+, Safari 6+, Safari 6+ iOS */ - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -.customers .item img:hover { - max-width: auto; - filter: none; - -webkit-filter: none; -} -.testimonials { - padding: 0; - margin-bottom: 40px; -} -.testimonials .item { - list-style-type: none; - margin: 0 5px; - background: #fff; - padding-bottom: 60px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; -} -.testimonials .item .testimonial { - position: relative; - padding: 20px; -} -.testimonials .item .testimonial:before, -.testimonials .item .testimonial:after { - content: " "; - display: table; -} -.testimonials .item .testimonial:after { - clear: both; -} -.testimonials .item .testimonial:before, -.testimonials .item .testimonial:after { - content: " "; - display: table; -} -.testimonials .item .testimonial:after { - clear: both; -} -.testimonials .item .testimonial .text { - color: #999999; - margin-bottom: 40px; -} -.testimonials .item .testimonial .bottom { - position: absolute; - left: 0; - bottom: 0; - width: 100%; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - padding: 20px; - height: 50px; -} -.testimonials .item .testimonial .bottom .icon { - color: #4fbfa8; - font-size: 30px; - float: left; - width: 20%; -} -.testimonials .item .testimonial .name-picture { - float: right; - width: 80%; - text-align: right; -} -.testimonials .item .testimonial .name-picture h5 { - font-size: 14px; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.testimonials .item .testimonial .name-picture p { - color: #999999; - margin: 0; - font-size: 12px; -} -.testimonials .item .testimonial .name-picture img { - float: right; - width: 60px; - border-radius: 30px; - margin-left: 10px; -} -.team-member { - text-align: center; - margin-bottom: 40px; -} -.team-member h3 { - font-size: 18px; - text-transform: uppercase; - margin-bottom: 5px; - letter-spacing: 0.08em; -} -.team-member h3 a { - color: #555555; -} -.team-member p.role { - color: #999999; - font-size: 12px; - text-transform: uppercase; - letter-spacing: 0.06em; -} -.team-member .social { - margin-bottom: 20px; -} -.team-member .social a { - margin: 0 10px 0 0; - color: #fff; - display: inline-block; - width: 26px; - height: 26px; - border-radius: 13px; - line-height: 26px; - font-size: 15px; - text-align: center; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - vertical-align: bottom; -} -.team-member .social a i { - vertical-align: bottom; - line-height: 26px; -} -.team-member .social a.facebook { - background-color: #4460ae; -} -.team-member .social a.gplus { - background-color: #c21f25; -} -.team-member .social a.twitter { - background-color: #3cf; -} -.team-member .social a.instagram { - background-color: #cd4378; -} -.team-member .social a.email { - background-color: #4a7f45; -} -.team-member .text p { - color: #999999; - font-size: 12px; -} -.team-member .social, -.team-member-detail .social { - margin-bottom: 20px; -} -.team-member .social a, -.team-member-detail .social a { - margin: 0 10px 0 0; - color: #fff; - display: inline-block; - width: 26px; - height: 26px; - border-radius: 13px; - line-height: 26px; - font-size: 15px; - text-align: center; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - vertical-align: bottom; -} -.team-member .social a i, -.team-member-detail .social a i { - vertical-align: bottom; - line-height: 26px; -} -.team-member .social a.facebook, -.team-member-detail .social a.facebook { - background-color: #4460ae; -} -.team-member .social a.gplus, -.team-member-detail .social a.gplus { - background-color: #c21f25; -} -.team-member .social a.twitter, -.team-member-detail .social a.twitter { - background-color: #3cf; -} -.team-member .social a.instagram, -.team-member-detail .social a.instagram { - background-color: #cd4378; -} -.team-member .social a.email, -.team-member-detail .social a.email { - background-color: #4a7f45; -} -.box-simple { - text-align: center; - margin-bottom: 40px; -} -.box-simple .icon { - color: #4fbfa8; - border-color: #4fbfa8; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -.box-simple h3 { - font-weight: normal; - font-size: 18px; - text-transform: uppercase; - line-height: 1.5; - color: #555555; - font-weight: 800; - letter-spacing: 0.08em; -} -.box-simple h3 a { - color: #555555; -} -.box-simple p { - color: #999999; -} -.box-simple:hover .icon { - -webkit-transform: scale(1.1, 1.1); - -ms-transform: scale(1.1, 1.1); - -o-transform: scale(1.1, 1.1); - transform: scale(1.1, 1.1); -} -.box-simple:hover .icon i { - -webkit-transform: scale(1, 1); - -ms-transform: scale(1, 1); - -o-transform: scale(1, 1); - transform: scale(1, 1); -} -.box-simple.box-white { - padding: 20px; - border: dotted 1px #999999; -} -.box-simple.box-white .icon { - color: #555555; - border-color: transparent; - font-size: 70px; -} -.box-simple.box-dark { - padding: 20px; - border: dotted 1px #999999; - background: #555555; - color: #fff; -} -.box-simple.box-dark .icon { - color: #f7f7f7; - border-color: transparent; - font-size: 70px; -} -.box-simple.box-dark h3 { - color: #fff; -} -.box-simple.box-dark h3 a { - color: #fff; -} -.box-simple.box-dark p { - color: #fff; -} -.box-image { - position: relative; - overflow: hidden; - text-align: center; - margin: 15px 0; -} -.box-image .bg { - position: absolute; - top: auto; - bottom: 0; - width: 100%; - height: 100%; - opacity: 0; - filter: alpha(opacity=0); - background: #4fbfa8; -} -.box-image .name { - position: absolute; - width: 100%; - height: 50%; - bottom: 0; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image .name h3 { - color: #fff; - text-transform: uppercase; - font-size: 18px; - letter-spacing: 0.08em; -} -.box-image .name h3 a { - color: #fff; - text-decoration: none; -} -.box-image .text { - position: absolute; - width: 100%; - height: 50%; - top: 0; - -webkit-transform: translate(0, -150%); - -ms-transform: translate(0, -150%); - -o-transform: translate(0, -150%); - transform: translate(0, -150%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image:hover .bg { - opacity: 0.7; - filter: alpha(opacity=70); -} -.box-image:hover .name { - position: absolute; - -webkit-transform: translate(0, -75%); - -ms-transform: translate(0, -75%); - -o-transform: translate(0, -75%); - transform: translate(0, -75%); -} -.box-image:hover .text { - position: absolute; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); -} -.box-image-text { - position: relative; - overflow: hidden; - text-align: center; - margin: 15px 0; -} -.box-image-text .top { - position: relative; - margin-bottom: 10px; -} -.box-image-text .top .bg { - position: absolute; - top: auto; - bottom: 0; - width: 100%; - height: 100%; - opacity: 0; - filter: alpha(opacity=0); - background: #4fbfa8; -} -.box-image-text .top .name { - position: absolute; - width: 100%; - height: 50%; - bottom: 0; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image-text .top .name h3 { - color: #fff; - text-transform: uppercase; - font-size: 18px; - letter-spacing: 0.08em; -} -.box-image-text .top .name h3 a { - color: #fff; - text-decoration: none; -} -.box-image-text .top .text { - position: absolute; - width: 100%; - height: 50%; - top: 0; - -webkit-transform: translate(0, -150%); - -ms-transform: translate(0, -150%); - -o-transform: translate(0, -150%); - transform: translate(0, -150%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image-text .content h3, -.box-image-text .content h4 { - text-transform: uppercase; - line-height: 1.5; - color: #555555; - font-weight: 800; - letter-spacing: 0.08em; -} -.box-image-text .content p { - color: #999999; -} -.box-image-text:hover .bg { - opacity: 0.7; - filter: alpha(opacity=70); -} -.box-image-text:hover .name { - position: absolute; - -webkit-transform: translate(0, -75%); - -ms-transform: translate(0, -75%); - -o-transform: translate(0, -75%); - transform: translate(0, -75%); -} -.box-image-text:hover .text { - position: absolute; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); -} -/* universal box */ -.box { - background: #fff; - margin: 0 0 30px; - border: solid 1px #ccc; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - padding: 20px 0; - border-left: none; - border-right: none; -} -.box .box-header { - background: #f7f7f7; - margin: -20px 0 20px; - padding: 20px; - border-bottom: solid 1px #eeeeee; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.box .box-header:before, -.box .box-header:after { - content: " "; - display: table; -} -.box .box-header:after { - clear: both; -} -.box .box-header:before, -.box .box-header:after { - content: " "; - display: table; -} -.box .box-header:after { - clear: both; -} -.box .box-footer { - background: #f7f7f7; - margin: 30px 0 -20px; - padding: 20px; - border-top: solid 1px #eeeeee; -} -.box .box-footer:before, -.box .box-footer:after { - content: " "; - display: table; -} -.box .box-footer:after { - clear: both; -} -.box .box-footer:before, -.box .box-footer:after { - content: " "; - display: table; -} -.box .box-footer:after { - clear: both; -} -@media (max-width: 991px) { - .box .box-footer .btn { - margin-bottom: 20px; - } -} -.box.no-border { - border: none; -} -#heading-breadcrumbs { - background: url('../img/texture-turquoise.png') center center repeat; - padding: 20px 0; - margin-bottom: 40px; -} -#heading-breadcrumbs.no-mb { - margin-bottom: 0; -} -#heading-breadcrumbs h1 { - color: #333333; - text-transform: uppercase; - font-size: 30px; - font-weight: 700; - letter-spacing: 0.08em; -} -@media (max-width: 991px) { - #heading-breadcrumbs h1 { - text-align: center; - } -} -#heading-breadcrumbs ul.breadcrumb { - margin-top: 5px; - margin-bottom: 0; -} -.bar { - position: relative; - background: #4fbfa8; - padding: 60px 0; -} -.bar.background-pentagon { - background: url('../img/texture-turquoise.png') center center repeat; - border-top: solid 1px #999999; - border-bottom: solid 1px #999999; -} -.bar.background-gray { - background: #eeeeee; -} -.bar.background-gray-dark { - background: #555555; -} -.bar.background-white { - background: #fff; -} -.bar.background-image-fixed-1 { - background: url('../img/fixed-background-1.jpg') center top no-repeat; - background-attachment: fixed; - background-size: cover; -} -.bar.background-image-fixed-2 { - background: url('../img/fixed-background-2.jpg') center top no-repeat; - background-attachment: fixed; - background-size: cover; -} -.bar.color-white h1, -.bar.color-white h2, -.bar.color-white h3, -.bar.color-white h4, -.bar.color-white h5, -.bar.color-white h6, -.bar.color-white p { - color: #fff; -} -.bar.padding-big { - padding: 50px 0; -} -.bar.padding-horizontal { - padding-left: 30px; - padding-right: 30px; -} -.bar.margin-vertical { - margin-top: 20px; - margin-bottom: 20px; -} -.bar .dark-mask { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: #000; - opacity: 0.3; - filter: alpha(opacity=30); -} -.portfolio.no-space { - padding: 0 15px; -} -.portfolio.no-space .box-image { - margin: 0 -15px; -} -.portfolio-project .project-more h4 { - color: #555555; - text-transform: uppercase; - margin-bottom: 0; - text-align: left; - font-size: 14px; - letter-spacing: 0.08em; -} -.portfolio-project .project-more p { - color: #999999; - padding: 10px 0; - margin-bottom: 20px; - text-align: left; -} -.portfolio-showcase { - margin: 15px 0 60px; -} -.portfolio-showcase h3 a { - text-transform: uppercase; - line-height: 1.5; - letter-spacing: 0.08em; -} -.portfolio-showcase p.lead { - color: #555555; - margin-bottom: 20px; -} -.portfolio-showcase p { - color: #999999; -} -.portfolio-showcase p.buttons { - margin-top: 40px; -} -.see-more { - text-align: center; - margin-top: 20px; - padding-top: 20px; -} -.see-more p { - font-size: 28px; - font-weight: 100; - margin-bottom: 20px; -} -.showcase .item { - text-align: center; -} -.showcase .item .icon { - display: inline-block; - width: 50px; - height: 50px; - color: #555555; - line-height: 50px; - border-radius: 25px; - border: solid 1px #555555; -} -.showcase .item h4 { - color: #555555; - text-transform: uppercase; - letter-spacing: 0.08em; - line-height: 1.5; - font-size: 16px; -} -.showcase .item h4 span { - font-weight: bold; - font-size: 51px; -} -.packages .package { - background: #fff; - margin-top: 25px; - margin-bottom: 20px; - padding-bottom: 15px; - text-align: center; - border: solid 1px #4fbfa8; - overflow: hidden; -} -.packages .package .package-header { - height: 57px; - color: #fff; - line-height: 57px; - background: #4fbfa8; -} -.packages .package .package-header h5 { - color: #fff; - text-transform: uppercase; - font-weight: bold; - line-height: 57px; - margin: 0; - letter-spacing: 0.08em; -} -.packages .package .package-header.light-gray { - background: #eeeeee; -} -.packages .package .package-header.light-gray h5 { - color: #555555; -} -.packages .package .price { - line-height: 120px; - height: 100px; - color: #fff; - font-weight: 400; -} -.packages .package .price h4 { - display: inline; - font-size: 50px; - line-height: normal; - margin-bottom: 0; -} -.packages .package .price .period { - line-height: normal; - color: #999999; -} -.packages .package ul { - padding: 0; -} -.packages .package ul li { - list-style-type: none; - padding-top: 10px; - padding-bottom: 10px; - width: 80%; - margin: auto; - border-bottom: 1px dotted #ccc; -} -.packages .package ul li:last-child { - border-bottom: 0; -} -.packages .package ul li i { - font-size: 13px; - margin-right: 5px; -} -.packages .best-value .package { - margin-top: 0; - padding-bottom: 40px; -} -.packages .best-value .package .package-header { - height: 72px; - padding-top: 17px; - height: 82px !important; -} -.packages .best-value .package .package-header h5 { - font-weight: bold; - line-height: 29px; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.packages .best-value .package .package-header .meta-text { - font-size: 13px; - line-height: 15px; -} -#map { - height: 300px; -} -#map.with-border { - border-top: solid 1px #4fbfa8; - border-bottom: solid 1px #4fbfa8; -} -#blog-listing-big .post, -#blog-homepage .post { - margin-bottom: 60px; -} -#blog-listing-big .post h2, -#blog-homepage .post h2, -#blog-listing-big .post h4, -#blog-homepage .post h4 { - text-transform: uppercase; - letter-spacing: 0.08em; -} -#blog-listing-big .post h2 a, -#blog-homepage .post h2 a, -#blog-listing-big .post h4 a, -#blog-homepage .post h4 a { - color: #555555; -} -#blog-listing-big .post h2 a:hover, -#blog-homepage .post h2 a:hover, -#blog-listing-big .post h4 a:hover, -#blog-homepage .post h4 a:hover { - color: #4fbfa8; -} -#blog-listing-big .post .author-category, -#blog-homepage .post .author-category { - color: #999999; - text-transform: uppercase; - font-weight: 300; - letter-spacing: 0.08em; -} -#blog-listing-big .post .author-category a, -#blog-homepage .post .author-category a { - font-weight: 500; -} -#blog-listing-big .post .date-comments a, -#blog-homepage .post .date-comments a { - color: #999999; - margin-right: 20px; -} -#blog-listing-big .post .date-comments a:hover, -#blog-homepage .post .date-comments a:hover { - color: #4fbfa8; -} -@media (min-width: 768px) { - #blog-listing-big .post .date-comments, - #blog-homepage .post .date-comments { - text-align: right; - } -} -#blog-listing-big .post .intro, -#blog-homepage .post .intro { - text-align: left; -} -#blog-listing-big .post .image, -#blog-homepage .post .image { - margin-bottom: 10px; - overflow: hidden; -} -#blog-listing-big .post .image img, -#blog-homepage .post .image img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -@media (max-width: 767px) { - #blog-listing-big .post .image img.img-responsive, - #blog-homepage .post .image img.img-responsive { - min-width: 100%; - } -} -#blog-listing-big .post .video, -#blog-homepage .post .video { - margin-bottom: 10px; -} -#blog-listing-big .post .read-more, -#blog-homepage .post .read-more { - text-align: right; -} -#blog-listing-medium .post { - margin-bottom: 60px; -} -#blog-listing-medium .post h2 { - text-transform: uppercase; - margin: 0 0 10px; - font-size: 24px; - letter-spacing: 0.08em; -} -#blog-listing-medium .post h2 a { - color: #555555; -} -#blog-listing-medium .post h2 a:hover { - color: #4fbfa8; -} -#blog-listing-medium .post .author-category { - float: left; - color: #999999; - text-transform: uppercase; - font-weight: 300; - font-size: 12px; - letter-spacing: 0.08em; -} -#blog-listing-medium .post .author-category a { - font-weight: 500; -} -#blog-listing-medium .post .date-comments { - float: right; - font-size: 12px; -} -#blog-listing-medium .post .date-comments a { - color: #999999; - margin-right: 20px; -} -#blog-listing-medium .post .date-comments a:hover { - color: #4fbfa8; -} -@media (min-width: 768px) { - #blog-listing-medium .post .date-comments { - text-align: right; - } -} -#blog-listing-medium .post .intro { - text-align: left; -} -#blog-listing-medium .post .clearfix:before, -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:before, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:before, -#blog-listing-medium .post .navbar-header:after { - content: " "; - display: table; -} -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:after { - clear: both; -} -#blog-listing-medium .post .clearfix:before, -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:before, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:before, -#blog-listing-medium .post .navbar-header:after { - content: " "; - display: table; -} -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:after { - clear: both; -} -#blog-listing-medium .post .image { - margin-bottom: 10px; - overflow: hidden; -} -#blog-listing-medium .post .image img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -@media (max-width: 767px) { - #blog-listing-medium .post .image img.img-responsive { - min-width: 100%; - } -} -#blog-listing-medium .post .video { - margin-bottom: 10px; -} -#blog-listing-medium .post .read-more { - text-align: right; -} -.box-image-text.blog .author-category { - color: #999999; - text-transform: uppercase; - letter-spacing: 0.08em; - font-weight: 300; - font-size: 12px; -} -.box-image-text.blog .author-category a { - font-weight: 500; -} -.box-image-text.blog .intro { - text-align: left; - margin-bottom: 20px; -} -#blog-homepage .post { - margin-bottom: 30px; -} -#blog-homepage .post h2, -#blog-homepage .post h4, -#blog-homepage .post .author-category, -#blog-homepage .post .read-more { - text-align: center; -} -#blog-homepage .post .read-more { - margin-top: 20px; -} -#blog-post #post-content { - margin-bottom: 20px; -} -#blog-post .comment { - margin-bottom: 25px; -} -#blog-post .comment:before, -#blog-post .comment:after { - content: " "; - display: table; -} -#blog-post .comment:after { - clear: both; -} -#blog-post .comment:before, -#blog-post .comment:after { - content: " "; - display: table; -} -#blog-post .comment:after { - clear: both; -} -#blog-post .comment .posted { - color: #999999; - font-size: 12px; -} -#blog-post .comment .reply { - font-family: "Roboto", Helvetica, Arial, sans-serif; -} -#blog-post .comment.last { - margin-bottom: 0; -} -#blog-post #comments, -#blog-post #comment-form { - padding: 20px 0; - margin-top: 20px; - border-top: solid 1px #eeeeee; -} -#blog-post #comments:before, -#blog-post #comment-form:before, -#blog-post #comments:after, -#blog-post #comment-form:after { - content: " "; - display: table; -} -#blog-post #comments:after, -#blog-post #comment-form:after { - clear: both; -} -#blog-post #comments:before, -#blog-post #comment-form:before, -#blog-post #comments:after, -#blog-post #comment-form:after { - content: " "; - display: table; -} -#blog-post #comments:after, -#blog-post #comment-form:after { - clear: both; -} -#blog-post #comments h4, -#blog-post #comment-form h4 { - margin-bottom: 20px; -} -#blog-post #comment-form { - margin-bottom: 20px; -} -.product { - background: #fff; - border-bottom: solid 1px #e6e6e6; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - margin-bottom: 60px; - overflow: hidden; - text-align: center; -} -.product .image { - overflow: hidden; -} -.product .image img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -@media (max-width: 767px) { - .product .image img.img-responsive { - min-width: 100%; - } -} -.product .text { - padding: 10px; -} -.product .text h3 { - font-size: 14px; - font-weight: 700; - height: 39.6px; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.product .text h3 a { - color: #555555; -} -.product .text h3 a:hover { - text-decoration: none; -} -.product .text p.price { - font-size: 18px; -} -.product .text p.price del { - color: #999999; -} -.product .buttons { - clear: both; - position: absolute; - display: none; - bottom: 0; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - width: 100%; - border: solid 1px transparent; - padding: 20px; - background: rgba(255, 255, 255, 0.9); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - text-align: center; -} -.product .buttons .btn { - margin-bottom: 20px; -} -.product:hover { - border-bottom: solid 1px #808080; - top: 0; -} -.product:hover .buttons { - clear: both; - position: absolute; - top: 0; - background: rgba(255, 255, 255, 0.5); -} -.product:hover .image img { - -webkit-transform: scale(1.1, 1.1); - -ms-transform: scale(1.1, 1.1); - -o-transform: scale(1.1, 1.1); - transform: scale(1.1, 1.1); -} -.goToDescription { - font-size: 12px; - text-align: center; - margin-bottom: 40px; -} -.goToDescription a { - color: #999999; - text-decoration: underline; -} -#productMain { - margin-bottom: 30px; -} -#productMain .sizes { - text-align: center; -} -#productMain .sizes h3 { - font-weight: 700; - letter-spacing: 0.08em; - text-transform: uppercase; - margin-bottom: 40px; -} -#productMain .sizes a { - display: inline-block; - width: 40px; - height: 40px; - border-radius: 40px; - background: #ccc; - line-height: 40px; - color: #555555; - text-align: center; - text-decoration: none; - font-family: "Roboto", Helvetica, Arial, sans-serif; -} -#productMain .sizes a.active, -#productMain .sizes a:hover { - background: #4fbfa8; - color: #fff; -} -#productMain .sizes input { - display: none; -} -#productMain .price { - font-size: 40px; - text-align: center; - margin-top: 40px; - margin-bottom: 40px; -} -#thumbs a { - display: block; - border: solid 1px transparent; -} -#thumbs a.active { - border-color: #4fbfa8; -} -#product-social { - text-align: center; -} -#product-social h4 { - font-weight: 300; - margin-bottom: 10px; -} -#product-social p { - line-height: 26px; -} -#product-social p a { - margin: 0 10px 0 0; - color: #fff; - display: inline-block; - width: 26px; - height: 26px; - border-radius: 13px; - line-height: 26px; - font-size: 15px; - text-align: center; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - vertical-align: bottom; -} -#product-social p a i { - vertical-align: bottom; - line-height: 26px; -} -#product-social p a.facebook { - background-color: #4460ae; -} -#product-social p a.gplus { - background-color: #c21f25; -} -#product-social p a.twitter { - background-color: #3cf; -} -#product-social p a.instagram { - background-color: #cd4378; -} -#product-social p a.email { - background-color: #4a7f45; -} -@media (max-width: 991px) { - #product-social { - text-align: center; - } -} -#checkout .nav { - margin-bottom: 20px; - border-bottom: solid 1px #4fbfa8; -} -#checkout .nav li { - height: 100%; -} -#checkout .nav li a { - display: block; - height: 100%; -} -#order-summary table { - margin-top: 20px; -} -#order-summary table td { - color: #999999; -} -#order-summary table tr.total td, -#order-summary table tr.total th { - font-size: 18px; - color: #555555; - font-weight: 700; -} -#checkout .table tbody tr td, -#basket .table tbody tr td, -#customer-order .table tbody tr td { - vertical-align: middle; -} -#checkout .table tbody tr td input, -#basket .table tbody tr td input, -#customer-order .table tbody tr td input { - width: 50px; - text-align: right; -} -#checkout .table tbody tr td img, -#basket .table tbody tr td img, -#customer-order .table tbody tr td img { - width: 50px; -} -#checkout .table tfoot, -#basket .table tfoot, -#customer-order .table tfoot { - font-size: 18px; -} -.shipping-method h4, -.payment-method h4 { - text-transform: uppercase; - letter-spacing: 0.08em; -} -#customer-orders table tr th, -#customer-orders table tr td { - vertical-align: baseline; -} -#customer-order .table tfoot th { - font-size: 18px; - font-weight: 300; -} -#customer-order .addresses { - text-align: right; - margin-bottom: 30px; -} -#customer-order .addresses p { - font-size: 18px; - font-weight: 300; -} -#customer-account { - margin-bottom: 30px; -} -#get-it { - background: #4fbfa8; - padding: 50px 0 30px; - color: #fff; - text-align: center; -} -#get-it h1, -#get-it h2, -#get-it h3, -#get-it h4, -#get-it h5, -#get-it h6 { - color: #fff; - text-transform: uppercase; - letter-spacing: 0.08em; - margin: 0 0 20px; -} -#get-it p { - margin: 0 0 20px; -} -#footer { - background: #555555; - padding: 50px 0; - color: #999999; -} -#footer h1, -#footer h2, -#footer h3, -#footer h4, -#footer h5, -#footer h6 { - color: #eeeeee; -} -#footer h4 { - font-size: 14px; - font-weight: 800; - text-transform: uppercase; - letter-spacing: 0.08em; -} -#footer ul { - padding-left: 0; - list-style: none; -} -#footer ul a { - color: #999999; -} -#footer ul a:hover { - color: #4fbfa8; - text-decoration: none; -} -#footer .photostream div { - float: left; - display: block; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - width: 33%; - padding: 7.5px; - overflow: hidden; -} -#footer .photostream div a { - border: solid 1 px #eeeeee; -} -#footer .photostream div img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -#footer .photostream div:hover img { - -webkit-transform: scale(1.1, 1.1); - -ms-transform: scale(1.1, 1.1); - -o-transform: scale(1.1, 1.1); - transform: scale(1.1, 1.1); -} -#footer .blog-entries .item { - clear: both; - padding: 5px 0; - margin-bottom: 10px; - border-bottom: solid 1px #555555; -} -#footer .blog-entries .item .image { - float: left; - width: 15%; - margin-right: 10px; -} -#footer .blog-entries .item .name { - width: 75%; - margin-left: 10px; - display: table-cell; - vertical-align: middle; -} -#footer .blog-entries .item .name h5 { - margin: 0; - text-transform: uppercase; - letter-spacing: 0.08em; - font-size: 12px; -} -#footer .blog-entries .item .name h5 a { - color: #eeeeee; -} -#footer .blog-entries .item .text { - width: 100%; - clear: both; -} -#footer .blog-entries .item:last-child { - border-bottom: none; - margin-bottom: 0; -} -#footer .social a { - color: #555555; - font-size: 25px; - margin: 0 10px 0 0; -} -#footer .social a:hover { - color: #4fbfa8; -} -#copyright { - background: #333; - color: #ccc; - padding: 50px 0; - font-size: 12px; - line-height: 28px; -} -#copyright p { - margin: 0; -} -@media (max-width: 991px) { - #copyright p { - float: none !important; - text-align: center; - margin-bottom: 10px; - } -} -[data-animate] { - opacity: 0; - filter: alpha(opacity=0); -} -#style-switch-button { - position: fixed; - top: 100px; - left: 0px; - border-radius: 0; -} -#style-switch { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - width: 300px; - padding: 20px; - position: fixed; - top: 140px; - left: 0; - background: #fff; - border: solid 1px #eeeeee; -} -@media (max-width: 991px) { - #style-switch-button { - display: none; - } - #style-switch { - display: none; - } -} -/* Original Boostrap template overwrite */ -/* breadcrumbs */ -.breadcrumb { - font-family: "Roboto", Helvetica, Arial, sans-serif; - text-transform: uppercase; - background-color: none; - letter-spacing: 0.08em; -} -/* nav */ -.nav > li > a { - padding: 10px 15px; -} -.nav > li > a:hover, -.nav > li > a:focus { - background-color: #eeeeee; -} -.nav > li.disabled > a { - color: #999999; -} -.nav > li.disabled > a:hover, -.nav > li.disabled > a:focus { - color: #999999; -} -.nav .open > a, -.nav .open > a:hover, -.nav .open > a:focus { - background-color: #eeeeee; - border-color: #4fbfa8; -} -.nav-tabs { - border-bottom: 1px solid #4fbfa8; -} -.nav-tabs > li { - float: left; - margin-bottom: -1px; -} -.nav-tabs > li > a { - margin-right: 2px; - line-height: 1.42857143; - border: 1px solid transparent; - border-radius: 0 0 0 0; -} -.nav-tabs > li > a:hover { - border-color: #eeeeee #eeeeee #4fbfa8; -} -.nav-tabs > li.active > a, -.nav-tabs > li.active > a:hover, -.nav-tabs > li.active > a:focus { - color: #555555; - background-color: #ffffff; - border: 1px solid #4fbfa8; - border-bottom-color: transparent; - cursor: default; -} -.nav-tabs.nav-justified { - width: 100%; - border-bottom: solid 1px #4fbfa8; - border-bottom: 0; -} -.nav-tabs.nav-justified > li { - float: none; -} -.nav-tabs.nav-justified > li > a { - text-align: center; - /*margin-bottom: 5px;*/ -} -.nav-tabs.nav-justified > .dropdown .dropdown-menu { - top: auto; - left: auto; -} -.nav-tabs.nav-justified > li > a { - margin-right: 0; - border-radius: 0; -} -.nav-tabs.nav-justified > .active > a, -.nav-tabs.nav-justified > .active > a:hover, -.nav-tabs.nav-justified > .active > a:focus { - border: 1px solid #4fbfa8; -} -@media (min-width: 768px) { - .nav-tabs.nav-justified > li > a { - border-bottom: 1px solid #4fbfa8; - border-radius: 0 0 0 0; - } - .nav-tabs.nav-justified > .active > a, - .nav-tabs.nav-justified > .active > a:hover, - .nav-tabs.nav-justified > .active > a:focus { - border-bottom-color: #ffffff; - } -} -.nav-pills > li { - float: left; -} -.nav-pills > li > a { - border-radius: 0; -} -.nav-pills > li + li { - margin-left: 2px; -} -.nav-pills > li.active > a, -.nav-pills > li.active > a:hover, -.nav-pills > li.active > a:focus { - color: #ffffff; - background-color: #4fbfa8; -} -.nav-stacked > li { - float: none; -} -.nav-stacked > li + li { - margin-top: 2px; - margin-left: 0; -} -.nav-justified { - width: 100%; - border-bottom: solid 1px #4fbfa8; -} -.nav-justified > li { - float: none; -} -.nav-justified > li > a { - text-align: center; - /*margin-bottom: 5px;*/ -} -.nav-justified > .dropdown .dropdown-menu { - top: auto; - left: auto; -} -.nav-tabs-justified { - border-bottom: 0; -} -.nav-tabs-justified > li > a { - margin-right: 0; - border-radius: 0; -} -.nav-tabs-justified > .active > a, -.nav-tabs-justified > .active > a:hover, -.nav-tabs-justified > .active > a:focus { - border: 1px solid #4fbfa8; -} -@media (min-width: 768px) { - .nav-tabs-justified > li > a { - border-bottom: 1px solid #4fbfa8; - border-radius: 0 0 0 0; - } - .nav-tabs-justified > .active > a, - .nav-tabs-justified > .active > a:hover, - .nav-tabs-justified > .active > a:focus { - border-bottom-color: #ffffff; - } -} -.tab-content { - padding: 15px; - border: solid 1px #ddd; - border-top: none; -} -/* navbar */ -.navbar { - position: relative; - min-height: 62px; - margin-bottom: 0; - border-bottom: 1px solid transparent; -} -@media (min-width: 768px) { - .navbar { - border-radius: 0px; - } -} -@media (min-width: 768px) { - .navbar-header { - float: left; - } -} -.navbar-collapse { - overflow-x: visible; - padding-right: 15px; - padding-left: 15px; -} -.navbar-collapse.in { - overflow-y: auto; -} -@media (min-width: 768px) { - .navbar-collapse { - width: auto; - border-top: 0; - box-shadow: none; - } - .navbar-collapse.collapse { - display: block !important; - height: auto !important; - padding-bottom: 0; - overflow: visible !important; - } - .navbar-collapse.in { - overflow-y: visible; - } - .navbar-fixed-top .navbar-collapse, - .navbar-static-top .navbar-collapse, - .navbar-fixed-bottom .navbar-collapse { - padding-left: 0; - padding-right: 0; - } -} -.navbar-fixed-top .navbar-collapse, -.navbar-affixed-top .navbar-collapse, -.navbar-fixed-bottom .navbar-collapse { - max-height: 340px; -} -@media (max-width: 480px) and (orientation: landscape) { - .navbar-fixed-top .navbar-collapse, - .navbar-affixed-top .navbar-collapse, - .navbar-fixed-bottom .navbar-collapse { - max-height: 200px; - } -} -.container > .navbar-header, -.container-fluid > .navbar-header, -.container > .navbar-collapse, -.container-fluid > .navbar-collapse { - margin-right: -15px; - margin-left: -15px; -} -@media (min-width: 768px) { - .container > .navbar-header, - .container-fluid > .navbar-header, - .container > .navbar-collapse, - .container-fluid > .navbar-collapse { - margin-right: 0; - margin-left: 0; - } -} -.navbar-static-top { - z-index: 1000; - border-width: 0 0 1px; -} -@media (min-width: 768px) { - .navbar-static-top { - border-radius: 0; - } -} -.navbar-fixed-top, -.navbar-fixed-bottom { - position: fixed; - right: 0; - left: 0; - z-index: 1030; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); -} -@media (min-width: 768px) { - .navbar-fixed-top, - .navbar-fixed-bottom { - border-radius: 0; - } -} -.navbar-fixed-top { - top: 0; - border-width: 0 0 1px; -} -.navbar-fixed-bottom { - bottom: 0; - margin-bottom: 0; - border-width: 1px 0 0; -} -.navbar-brand { - float: left; - padding: 10px 15px; - font-size: 18px; - line-height: 20px; - height: 62px; -} -.navbar-brand:hover, -.navbar-brand:focus { - text-decoration: none; -} -@media (min-width: 768px) { - .navbar > .container .navbar-brand, - .navbar > .container-fluid .navbar-brand { - margin-left: -15px; - } -} -.navbar-toggle { - position: relative; - float: right; - margin-right: 15px; - padding: 9px 10px; - margin-top: 14px; - margin-bottom: 14px; - background-color: transparent; - background-image: none; - border: 1px solid transparent; - border-radius: 0; -} -.navbar-toggle:focus { - outline: 0; -} -.navbar-nav { - margin: 10.5px -15px; -} -.navbar-nav > li > a { - padding-top: 10px; - padding-bottom: 10px; - line-height: 20px; -} -@media (max-width: 767px) { - .navbar-nav .open .dropdown-menu > li > a, - .navbar-nav .open .dropdown-menu .dropdown-header { - padding: 5px 15px 5px 25px; - } - .navbar-nav .open .dropdown-menu > li > a { - line-height: 20px; - } - .navbar-nav .open .dropdown-menu > li > a:hover, - .navbar-nav .open .dropdown-menu > li > a:focus { - background-image: none; - } -} -@media (min-width: 768px) { - .navbar-nav { - float: left; - margin: 0; - } - .navbar-nav > li { - float: left; - } - .navbar-nav > li > a { - padding-top: 21px; - padding-bottom: 21px; - } - .navbar-nav.navbar-right:last-child { - margin-right: -15px; - } -} -@media (min-width: 768px) { - .navbar-left { - float: left !important; - } - .navbar-right { - float: right !important; - } -} -.navbar-form { - margin-left: -15px; - margin-right: -15px; - padding: 10px 15px; - border-top: 1px solid transparent; - border-bottom: 1px solid transparent; - -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); - margin-top: 14px; - margin-bottom: 14px; -} -@media (max-width: 767px) { - .navbar-form .form-group { - margin-bottom: 5px; - } -} -@media (min-width: 768px) { - .navbar-form { - width: auto; - border: 0; - margin-left: 0; - margin-right: 0; - padding-top: 0; - padding-bottom: 0; - -webkit-box-shadow: none; - box-shadow: none; - } - .navbar-form.navbar-right:last-child { - margin-right: -15px; - } -} -.navbar-nav > li > .dropdown-menu { - margin-top: 0; - border-top-right-radius: 0; - border-top-left-radius: 0; -} -.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu { - border-bottom-right-radius: 0; - border-bottom-left-radius: 0; -} -.navbar-btn { - margin-top: 14px; - margin-bottom: 14px; -} -.navbar-btn.btn-sm { - margin-top: 16px; - margin-bottom: 16px; -} -.navbar-btn.btn-xs { - margin-top: 20px; - margin-bottom: 20px; -} -.navbar-text { - margin-top: 21px; - margin-bottom: 21px; -} -@media (min-width: 768px) { - .navbar-text { - float: left; - margin-left: 15px; - margin-right: 15px; - } - .navbar-text.navbar-right:last-child { - margin-right: 0; - } -} -.navbar-default { - background-color: #ffffff; - border-color: #cccccc; - border-bottom: none; -} -.navbar-default .navbar-brand { - color: #555555; -} -.navbar-default .navbar-brand:hover, -.navbar-default .navbar-brand:focus { - color: #3b3b3b; - background-color: transparent; -} -.navbar-default .navbar-text { - color: #777777; -} -.navbar-default .navbar-nav > li > a { - color: #555555; -} -.navbar-default .navbar-nav > li > a:hover, -.navbar-default .navbar-nav > li > a:focus { - color: #555555; - background-color: #9adacd; -} -.navbar-default .navbar-nav > .active > a, -.navbar-default .navbar-nav > .active > a:hover, -.navbar-default .navbar-nav > .active > a:focus { - color: #ffffff; - background-color: #4fbfa8; -} -.navbar-default .navbar-nav > .disabled > a, -.navbar-default .navbar-nav > .disabled > a:hover, -.navbar-default .navbar-nav > .disabled > a:focus { - color: #cccccc; - background-color: transparent; -} -.navbar-default .navbar-toggle { - border-color: #dddddd; -} -.navbar-default .navbar-toggle:hover, -.navbar-default .navbar-toggle:focus { - background-color: #4fbfa8; -} -.navbar-default .navbar-toggle .icon-bar { - background-color: #888888; -} -.navbar-default .navbar-collapse, -.navbar-default .navbar-form { - border-color: #cccccc; -} -.navbar-default .navbar-nav > .open > a, -.navbar-default .navbar-nav > .open > a:hover, -.navbar-default .navbar-nav > .open > a:focus { - background-color: #4fbfa8; - color: #ffffff; -} -@media (max-width: 767px) { - .navbar-default .navbar-nav .open .dropdown-menu > li > a { - color: #555555; - } - .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, - .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus { - color: #4fbfa8; - } - .navbar-default .navbar-nav .open .dropdown-menu > .active > a, - .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, - .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus { - color: #ffffff; - background-color: #4fbfa8; - } - .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a, - .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover, - .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus { - color: #cccccc; - background-color: transparent; - } -} -.navbar-default .navbar-link { - color: #555555; -} -.navbar-default .navbar-link:hover { - color: #555555; -} -.navbar-default .btn-link { - color: #555555; -} -.navbar-default .btn-link:hover, -.navbar-default .btn-link:focus { - color: #555555; -} -.navbar-default .btn-link[disabled]:hover, -fieldset[disabled] .navbar-default .btn-link:hover, -.navbar-default .btn-link[disabled]:focus, -fieldset[disabled] .navbar-default .btn-link:focus { - color: #cccccc; -} -/* scaffolding */ -body { - font-family: "Roboto", Helvetica, Arial, sans-serif; - font-size: 14px; - line-height: 1.42857143; - color: #555555; -} -a { - color: #4fbfa8; - text-decoration: none; -} -a:hover, -a:focus { - color: #348e7b; - text-decoration: underline; -} -a:focus { - outline: thin dotted; - outline: 5px auto -webkit-focus-ring-color; - outline-offset: -2px; -} -.img-rounded { - border-radius: 0; -} -hr { - margin-top: 20px; - margin-bottom: 20px; - border: 0; - border-top: 1px solid #eeeeee; -} -/* breadcrumbs */ -.breadcrumb { - padding: 20px 0; - margin-bottom: 20px; - background-color: transparent; - border-radius: 0; - text-align: right; -} -.breadcrumb > li + li:before { - content: ">\00a0"; - color: #555555; -} -.breadcrumb > .active { - color: #999999; -} -@media (max-width: 991px) { - .breadcrumb { - padding: 20px 0; - text-align: center; - } -} -/* dropdowns */ -.dropdown-menu { - z-index: 1000; - font-size: 14px; - background-color: #ffffff; - border: 1px solid #cccccc; - border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 0; - -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); - box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); -} -.dropdown-menu.pull-right { - right: 0; - left: auto; -} -.dropdown-menu .divider { - height: 1px; - margin: 9px 0; - overflow: hidden; - background-color: #e5e5e5; -} -.dropdown-menu > li > a { - padding: 5px 20px; - line-height: 1.42857143; - color: #333333; - white-space: nowrap; -} -/* labels */ -.label { - font-family: "Roboto", Helvetica, Arial, sans-serif; - font-weight: normal; - text-transform: uppercase; - letter-spacing: 0.08em; -} -/* forms.less */ -label { - font-weight: normal; -} -.form-control { - -webkit-box-shadow: none; - box-shadow: none; - border-radius: 0; -} -.form-control:focus { - border-color: #4fbfa8; - outline: 0; - -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(79, 191, 168, 0.6); - box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(79, 191, 168, 0.6); -} -.form-group { - margin-bottom: 20px; -} -/* pager*/ -.pager { - margin: 20px 0; - border-top: solid 1px #eeeeee; - padding-top: 20px; - text-transform: uppercase; - letter-spacing: 0.08em; - font-family: "Roboto", Helvetica, Arial, sans-serif; -} -.pager li { - display: inline; -} -.pager li > a, -.pager li > span { - background-color: #ffffff; - border: 1px solid #4fbfa8; - border-radius: 0; -} -.pager li > a:hover, -.pager li > a:focus { - text-decoration: none; - color: #fff; - background-color: #4fbfa8; -} -.pager .disabled > a, -.pager .disabled > a:hover, -.pager .disabled > a:focus, -.pager .disabled > span { - color: #999999; - background-color: #ffffff; - border-color: #ddd; -} -/* pagination */ -.pagination { - margin: 20px 0; - font-family: "Roboto", Helvetica, Arial, sans-serif; - border-radius: 0; -} -.pagination > li > a, -.pagination > li > span { - padding: 6px 12px; - line-height: 1.42857143; - text-decoration: none; - color: #4fbfa8; - background-color: #ffffff; - border: 1px solid #dddddd; -} -.pagination > li > a:hover, -.pagination > li > span:hover, -.pagination > li > a:focus, -.pagination > li > span:focus { - color: #4fbfa8; - background-color: #bfe8df; - border-color: #dddddd; -} -.pagination > .active > a, -.pagination > .active > span, -.pagination > .active > a:hover, -.pagination > .active > span:hover, -.pagination > .active > a:focus, -.pagination > .active > span:focus { - z-index: 2; - color: #ffffff; - background-color: #4fbfa8; - border-color: #4fbfa8; -} -.pagination > .disabled > span, -.pagination > .disabled > span:hover, -.pagination > .disabled > span:focus, -.pagination > .disabled > a, -.pagination > .disabled > a:hover, -.pagination > .disabled > a:focus { - color: #999999; - background-color: #ffffff; - border-color: #dddddd; -} -/* responsive utilities */ -@media (max-width: 767px) { - .text-center-xs { - text-align: center !important; - } - .text-center-xs img { - display: block; - margin-left: auto; - margin-right: auto; - } -} -@media (min-width: 768px) and (max-width: 991px) { - .text-center-sm { - text-align: center !important; - } - .text-center-sm img { - display: block; - margin-left: auto; - margin-right: auto; - } -} -/* type */ -h1, -h2, -h3, -h4, -h5, -h6, -.h1, -.h2, -.h3, -.h4, -.h5, -.h6 { - font-family: "Roboto", Helvetica, Arial, sans-serif; - font-weight: 900; - line-height: 1.1; - color: #333333; -} -h1, -.h1, -h2, -.h2, -h3, -.h3 { - margin-top: 20px; - margin-bottom: 20px; -} -p { - margin: 0 0 10px; -} -.lead { - margin-bottom: 20px; - font-size: 18px; -} -@media (min-width: 768px) { - .lead { - font-size: 21px; - } -} -.text-small { - font-size: 12px; -} -.text-large { - font-size: 18px; -} -.text-italic { - font-style: italic; -} -.text-primary { - color: #4fbfa8; -} -a.text-primary:hover { - color: #3aa18c; -} -.bg-primary { - color: #fff; - background-color: #4fbfa8; -} -a.bg-primary:hover { - background-color: #3aa18c; -} -abbr[title], -abbr[data-original-title] { - border-bottom: 1px dotted #999999; -} -blockquote { - padding: 10px 20px; - margin: 0 0 20px; - font-size: 14px; - border-left: 5px solid #4fbfa8; -} -blockquote footer, -blockquote small, -blockquote .small { - display: block; - font-size: 80%; - line-height: 1.42857143; - color: #999999; -} -blockquote footer:before, -blockquote small:before, -blockquote .small:before { - content: '\2014 \00A0'; -} -.blockquote-reverse, -blockquote.pull-right { - border-right: 5px solid #4fbfa8; -} -address { - margin-bottom: 20px; - line-height: 1.42857143; -} -.panel { - margin-bottom: 20px; - background-color: #ffffff; - border: 1px solid transparent; - border-radius: 0; - -webkit-box-shadow: 0 0 0; - box-shadow: 0 0 0; -} -.panel-heading { - border-top-right-radius: 0; - border-top-left-radius: 0; - text-transform: uppercase; - letter-spacing: 0.08em; - padding: 15px 15px; -} -.progress { - overflow: hidden; - height: 20px; - margin-bottom: 20px; - background-color: #f5f5f5; - border-radius: 0; - -webkit-box-shadow: none; - box-shadow: none; -} -.panel-group { - margin-bottom: 20px; -} -.panel-group .panel { - margin-bottom: 0; - border-radius: 0; - overflow: hidden; -} -.panel-group .panel + .panel { - margin-top: 5px; -} -.panel-group.accordion .panel { - border-color: #ccc; -} -.panel-primary { - border-color: #4fbfa8; -} -.panel-primary > .panel-heading { - color: #ffffff; - background-color: #4fbfa8; - border-color: #4fbfa8; -} -.panel-primary > .panel-heading + .panel-collapse > .panel-body { - border-top-color: #4fbfa8; -} -.panel-primary > .panel-heading .badge { - color: #4fbfa8; - background-color: #ffffff; -} -.panel-primary > .panel-footer + .panel-collapse > .panel-body { - border-bottom-color: #4fbfa8; -} -.panel-primary .panel-title { - font-weight: 300; -} -.panel-primary .panel-title a:hover { - color: #fff; - text-decoration: none; -} -a.badge:hover, -a.badge:focus { - color: #ffffff; - text-decoration: none; - cursor: pointer; -} -a.list-group-item.active > .badge, -.nav-pills > .active > a > .badge { - color: #4fbfa8; - background-color: #ffffff; -} -.nav-pills > li > a > .badge { - margin-left: 3px; -} -.progress-bar-primary { - background-color: #4fbfa8; -} -.progress-striped .progress-bar-primary { - background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); - background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); - background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); -} -/*! - * Yamm!3 - Yet another megamenu for Bootstrap 3 - * http://geedmo.github.com/yamm3 - * - * @geedmo - Licensed under the MIT license - */ -.yamm .nav, -.yamm .collapse, -.yamm .dropup.use-yamm, -.yamm .dropdown.use-yamm { - position: static; -} -.yamm .container { - position: relative; -} -.yamm .dropdown-menu { - left: auto; -} -.yamm .nav.navbar-right .dropdown-menu { - left: auto; - right: 0; -} -.yamm .yamm-content { - padding: 20px 30px; -} -.yamm .dropdown.yamm-fw .dropdown-menu { - left: 15px; - right: 15px; -} diff --git a/static/css/style.violet.css b/static/css/style.violet.css index e71222f7f..f14a1bbb3 100644 --- a/static/css/style.violet.css +++ b/static/css/style.violet.css @@ -1,3566 +1,3702 @@ -.clearfix:before, -.clearfix:after, -.navbar:before, -.navbar:after, -.navbar-header:before, -.navbar-header:after { - content: " "; - display: table; +/* + +================================================================================== +================================================================================== + +Universal Template + +https://bootstrapious.com/p/universal-business-e-commerce-template + +================================================================================== +================================================================================== + +*/ +/* +* +* ===================== +* GENERAL +* ===================== +* +*/ +.boxed { + background: url("../img/boxed-pattern.png"); +} + +.boxed #all { + max-width: 1200px; + margin: 0 auto; + background: #fff; + -webkit-box-shadow: 0 0 5px #ccc; + box-shadow: 0 0 5px #ccc; +} + +a { + -webkit-transition: all 0.3s !important; + transition: all 0.3s !important; + display: inline-block; +} + +button { + cursor: pointer; +} + +strong { + font-weight: 700; +} + +p.lead { + margin-bottom: 40px; +} + +.accent { + color: #986dbd; } -.clearfix:after, -.navbar:after, -.navbar-header:after { - clear: both; + +.tooltip { + font-family: "Roboto", Helvetica, Arial, sans-serif; } -.center-block { + +.bs-select .dropdown-menu .dropdown-menu { + min-height: 20px; display: block; - margin-left: auto; - margin-right: auto; } -.pull-right { - float: right !important; + +.bs-select .dropdown-menu .dropdown-menu a { + padding: 6px 10px; + color: #666; + font-weight: 700; + text-decoration: none !important; + display: block; + font-size: .8rem; + text-transform: uppercase; + letter-spacing: 0.1em; + font-family: "Roboto", Helvetica, Arial, sans-serif; + outline: none; } -.pull-left { - float: left !important; + +.heading-light { + font-weight: 300 !important; } -.hide { - display: none !important; + +.text-bold { + font-weight: 700; } -.show { - display: block !important; + +.text-small { + font-size: 0.9rem; } -.invisible { - visibility: hidden; + +.text-uppercase { + text-transform: uppercase; + letter-spacing: 0.1em; } -.text-hide { - font: 0/0 a; - color: transparent; - text-shadow: none; - background-color: transparent; - border: 0; + +.no-letter-spacing { + letter-spacing: 0 !important; } -.hidden { - display: none !important; - visibility: hidden !important; + +.bar { + padding: 60px 0; } -.affix { - position: fixed; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); + +.bar.padding-big { + padding: 50px 0; } -/* general styles */ -a, -button { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.pagination { + margin-top: 20px; } -a i[class^="fa"], -button i[class^="fa"] { - margin: 0 5px; + +#pagination .pagination { + margin-bottom: 40px; } -.clickable { - cursor: pointer !important; + +.text-sm, .form-group label, #blog-listing-big .date-comments a, #blog-listing-medium .date-comments a, #blog-listing-big p.intro, #blog-listing-medium p.intro { + font-size: 0.9rem; } -.required { - color: #986dbd; + +.text-xs { + font-size: 0.9rem; } -.accent { - color: #986dbd; + +.text-xs * { + font-size: 0.9rem; } -.text-uppercase { - text-transform: uppercase; - letter-spacing: 0.08em; + +@media (max-width: 767px) { + .text-sm-center { + text-align: center !important; + } } + @media (max-width: 991px) { + .text-md-center { + text-align: center !important; + } +} + +@media (max-width: 1199px) { + .text-lg-center { + text-align: center !important; + } +} + +@media (max-width: 767px) { .text-center-sm { - text-align: center; + text-align: center !important; } } -p.lead { - margin-bottom: 40px; + +@media (max-width: 991px) { + .text-center-md { + text-align: center !important; + } } -section, -div.section { - margin-bottom: 40px; + +@media (max-width: 1199px) { + .text-center-sm, .text-center-xs { + text-align: center !important; + } } + +.bg-gray { + background: #e9ecef !important; +} + +.bg-gray-dark { + background: #555 !important; +} + +.bg-primary { + background: #986dbd !important; +} + +.color-white { + color: #fff !important; +} + +.color-white * { + color: #fff !important; +} + +.bg-white { + background: #fff !important; +} + +.bg-fixed { + background-attachment: fixed !important; +} + +.light-gray { + background: #eee; +} + .no-mb { margin-bottom: 0 !important; } + +.no-mt { + margin-top: 0 !important; +} + +.no-horizontal-padding { + padding-left: 0 !important; + padding-right: 0 !important; +} + .mb-small { margin-bottom: 20px !important; } -.heading { - margin-bottom: 40px; + +.no-padding-top { + padding-top: 0 !important; } -.heading h1, -.heading h2, -.heading h3, -.heading h4, -.heading h5 { - display: inline-block; - border-bottom: solid 5px #986dbd; + +.no-padding-bottom { + padding-bottom: 0 !important; +} + +.padding-horizontal { + padding-left: 30px !important; + padding-right: 30px !important; +} + +.relative-positioned { + position: relative; + z-index: 1; +} + +.jumbotron { + margin: 0; +} + +.owl-carousel.equal-height .owl-stage { + display: -webkit-box !important; + display: -ms-flexbox !important; + display: flex !important; + -webkit-box-align: stretch !important; + -ms-flex-align: stretch !important; + align-items: stretch !important; +} + +.background-pentagon, #heading-breadcrumbs { + background: url("../img/texture-bw.png") center center repeat; + border-top: 1px solid #999; + border-bottom: 1px solid #999; +} + +.heading, .panel-heading { + margin-bottom: 1rem; +} + +.heading h1, .panel-heading h1, .heading h2, .panel-heading h2, .heading h3, .panel-heading h3, .heading h4, .panel-heading h4, .heading h5, .panel-heading h5, .heading h6, .panel-heading h6 { line-height: 1.1; + display: inline-block; margin-bottom: 0; padding-bottom: 10px; - vertical-align: middle; text-transform: uppercase; - letter-spacing: 0.06em; + letter-spacing: 0.1em; } -.heading h1 i[class^="fa"], -.heading h2 i[class^="fa"], -.heading h3 i[class^="fa"], -.heading h4 i[class^="fa"], -.heading h5 i[class^="fa"] { - display: inline-block; + +.heading h1:after, .panel-heading h1:after, .heading h2:after, .panel-heading h2:after, .heading h3:after, .panel-heading h3:after, .heading h4:after, .panel-heading h4:after, .heading h5:after, .panel-heading h5:after, .heading h6:after, .panel-heading h6:after { + content: " "; + display: block; + width: 100px; + height: 2px; + margin-top: .6rem; background: #986dbd; - width: 30px; - height: 30px; - vertical-align: middle; - text-align: center; - color: #fff; - font-size: 12px; - line-height: 30px; - border-radius: 15px; } -.icon { - display: inline-block; - width: 80px; - height: 80px; - color: #fff; - line-height: 80px; - border-radius: 40px; - border: solid 1px #fff; - font-size: 20px; + +.heading.text-center h1:after, .text-center.panel-heading h1:after, .heading.text-center h2:after, .text-center.panel-heading h2:after, .heading.text-center h3:after, .text-center.panel-heading h3:after, .heading.text-center h4:after, .text-center.panel-heading h4:after, .heading.text-center h5:after, .text-center.panel-heading h5:after, .heading.text-center h6:after, .text-center.panel-heading h6:after { + margin-left: auto; + margin-right: auto; } -.icon.icon-lg { - font-size: 30px; - border-width: 2px; + +.buttons a { + margin: 0 3px; } -.ul-icons { - padding-left: 10px; + +.dropdown-item.active, .dropdown-item:active { + background: #cab3dd; } -.ul-icons li { - list-style-type: none; - line-height: 20px; - margin-bottom: 20px; + +.card { + border-radius: 0; + margin-bottom: 10px; } -.ul-icons li i { - width: 20px; - height: 20px; - background: #986dbd; - color: #fff; - text-align: center; - border-radius: 10px; - line-height: 20px; - margin-right: 10px; + +.card-header { + border-radius: 0; + padding: 20px; } -ul.list-style-none { - list-style: none; + +.card-header h1, .card-header h2, .card-header h3, .card-header h4, .card-header h5, .card-header h6 { + text-transform: uppercase; + letter-spacing: 0.1em; + font-size: 0.935rem; + margin: 0 !important; } -#text-page h1, -#text-page h2, -#text-page h3 { - font-weight: 700; + +.card-header a { + color: #333; } -#error-page { - text-align: center; - margin-top: 40px; - margin-bottom: 100px; + +.card-body p { + font-size: 0.9rem; + color: #333; } -#error-page h4 { - margin-bottom: 40px; + +.alert { + border-radius: 0; } -#error-page p.buttons { - margin-top: 40px; + +#heading-breadcrumbs { + padding: 2rem 0; + border-top: none !important; + border-bottom: none !important; } -.pages-listing .item { - text-align: center; + +#heading-breadcrumbs .breadcrumb { + margin-bottom: 0; + background: none; + font-size: 0.9rem; } -.pages-listing .item h3 { - font-size: 18px; + +#heading-breadcrumbs h1 { text-transform: uppercase; - margin-bottom: 20px; - letter-spacing: 0.08em; + letter-spacing: 0.1em; + margin-bottom: 0; } -.pages-listing .item h3 a { - color: #555555; + +#heading-breadcrumbs li { + text-transform: uppercase; + letter-spacing: 0.1em; } -.pages-listing .item .text { - margin-bottom: 20px; + +.row.no-space { + margin-left: 0; + margin-right: 0; } -.pages-listing .item .text p { - color: #999999; - font-size: 12px; - margin-bottom: 20px; + +.row.no-space div[class*="col-"] { + padding: 0; } -.banner { - margin-bottom: 30px; + +.row.no-space .box-image { + margin: 0; +} + +.owl-carousel .owl-dots { + margin-top: 20px; text-align: center; } -.banner img { - margin: 0 auto; + +.owl-carousel .owl-dots .owl-dot { + display: inline-block; + margin: 0 5px; } -.banner a:hover img { - opacity: 0.8; - filter: alpha(opacity=80); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.owl-carousel .owl-dots .owl-dot.active span { + background: #fff; } -.pages { - text-align: center; + +.owl-carousel .owl-dots .owl-dot span { + display: block; + width: 12px; + height: 12px; + border-radius: 50%; + background: #aaa; +} + +.dark-mask { + background: rgba(0, 0, 0, 0.3); + width: 100%; + height: 100%; + position: absolute; + top: 0; + left: 0; + z-index: -1; } -.pages .loadMore { - text-align: center; + +.dark-mask.mask-primary { + background: rgba(152, 109, 189, 0.9); } -.pages .pagination { + +.icon-outlined { + width: 80px; + height: 80px; + line-height: 80px; text-align: center; -} -.features-buttons button { + display: inline-block; + font-size: 1.4rem; + border-radius: 50%; + border: 2px solid #fff; margin-bottom: 20px; } -@media (min-width: 1300px) { - body.boxed { - background: url(https://www.toptal.com/designers/subtlepatterns/patterns/subtle_zebra_3d.png); - } - body.boxed #all { - position: relative; - background: #fff; - width: 1200px; - margin: 0 auto; - overflow: hidden; - -webkit-box-shadow: 0 0 5px #cccccc; - box-shadow: 0 0 5px #cccccc; - } -} -#top { - background: #555555; - color: #eeeeee; - padding: 10px 0; + +.icon-outlined.icon-lg { + font-size: 2rem; } -#top p { - margin: 0; - font-size: 12px; + +.icon-outlined.icon-sm { + width: 55px; + height: 55px; + line-height: 55px; + text-align: center; + font-size: 1.15rem; } -#top .social { - float: right; - text-align: right; + +.icon-outlined.icon-thin { + border-width: 1px; } -#top .social a { - color: #999999; - display: inline-block; + +.icon-filled { width: 24px; height: 24px; - border-radius: 12px; line-height: 24px; - font-size: 12px; + background: #986dbd; + color: #fff; text-align: center; + border-radius: 50%; + font-size: 0.75rem; +} + +.ul-icons .icon-filled { + display: inline-block; + margin-right: 10px; +} + +.ul-icons li { + margin-bottom: 20px; + color: #555; + font-size: 0.9rem; +} + +.ul-icons a { + display: inline; +} + +ul.social { + margin: 15px 0; } -#top .social a:hover { + +ul.social a { + width: 28px; + height: 28px; + line-height: 28px; + background: #555; color: #fff; - background: #986dbd; + text-align: center; + border-radius: 50%; + margin: 0 2px; + font-size: 0.8rem; +} + +ul.social a:hover { -webkit-transform: scale(1.1); transform: scale(1.1); } -#top .social a:hover.facebook { - background-color: #4460ae; + +ul.social a.facebook { + background: #4561ae; } -#top .social a:hover.gplus { - background-color: #c21f25; + +ul.social a.gplus { + background: #c22026; } -#top .social a:hover.twitter { - background-color: #3cf; + +ul.social a.twitter { + background: #34ccff; } -#top .social a:hover.instagram { - background-color: #cd4378; + +ul.social a.email { + background: #4b8046; } -#top .social a:hover.email { - background-color: #4a7f45; + +.showcase { + color: #555; } -#top .login { - float: right; + +.showcase .icon-outlined { + border-color: #555; } -#top .login a { - font-size: 12px; - color: #eeeeee; - margin-right: 15px; - text-decoration: none; + +.showcase .counter { + margin-bottom: 20px; + display: inline-block; + margin-top: 0; +} + +.showcase h4 { text-transform: uppercase; - font-weight: 700; - letter-spacing: 0.10em; + letter-spacing: 0.1em; + font-size: 0.935rem; + margin-top: 0; } -@media (max-width: 767px) { - #top .login { - float: left; - } + +.form-control { + border-radius: 0; } -#top.light { - background: #fff; - color: #999999; - border-bottom: solid 1px #eeeeee; + +.form-control:focus { + border-color: #986dbd; + -webkit-box-shadow: 0 0 0 0.2rem rgba(152, 109, 189, 0.25); + box-shadow: 0 0 0 0.2rem rgba(152, 109, 189, 0.25); } -#top.light .login a { - color: #555555; + +.form-group label { + color: #555; } -.navbar { + +.card-primary { + border-radius: 0; + border-color: #986dbd; +} + +.card-primary .card-header { + background: #986dbd; + color: #fff; border: none; + border-radius: 0; } -.navbar ul.nav > li > a { + +.card-primary .card-header a { + color: #fff; text-transform: uppercase; - text-decoration: underline; - font-weight: bold; - letter-spacing: 0.08em; - border-top: solid 5px transparent; -} -.navbar ul.nav > li > a:hover { - border-top: solid 5px #986dbd; + font-weight: 300; + letter-spacing: 0.05em; } -.navbar ul.nav > li.active > a, -.navbar ul.nav > li.open > a { - text-decoration: none !important; - border-top: solid 5px #653d87; + +.card-primary .card-body { + border-color: #986dbd; } -@media (max-width: 768px) { - .navbar ul.nav > li.active > a, - .navbar ul.nav > li.open > a { - border-top-color: transparent; - } - .navbar ul.nav > li > a:hover { - border-top-color: transparent; - } + +.card-body li { + font-size: 0.9rem; } -.navbar.navbar-light ul.nav > li.active > a { - border-top: solid 5px #653d87; - background: #fff !important; - color: #555555 !important; + +table { + font-size: 0.9rem; } -.navbar.navbar-light ul.nav > li.active > a:hover { - border-top: solid 5px #653d87; + +table img { + min-width: 50px !important; + max-width: 50px !important; + height: 50px; } -.navbar.navbar-light ul.nav > li > a:hover, -.navbar.navbar-light ul.nav > li.open > a:hover, -.navbar.navbar-light ul.nav > li > a:focus, -.navbar.navbar-light ul.nav > li.open > a:focus { - border-top: solid 5px #986dbd; - background: #fff !important; - color: #555555 !important; + +table input[type="number"] { + max-width: 50px; } -.navbar ul.dropdown-menu { - margin: 0; - padding: 0; + +.nav-tabs { + border-bottom: none; } -.navbar ul.dropdown-menu li { - list-style-type: none; - border-bottom: solid 1px #eeeeee; - text-transform: uppercase; - letter-spacing: 0.08em; - padding: 4px 0; + +.nav-tabs a.nav-link { + border-radius: 0 !important; + font-size: 0.9rem; } -.navbar ul.dropdown-menu li a { - position: relative; - color: #999999; - font-size: 12px; - display: block; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - left: 0; + +.tab-content { + padding: 20px; + border: 1px solid #ddd; + font-size: 0.9rem; } -.navbar ul.dropdown-menu li a:hover { - color: #986dbd; - text-decoration: none; - background: none; - left: 2px; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.top-bar { + background: #555; + color: #fff; + font-size: 0.9rem; + padding: 10px 0; } -@media (max-width: 767px) { - .navbar ul.dropdown-menu li a:hover { - left: 0; - } + +.top-bar.top-bar-light { + background: #fff; + color: #555; + border-bottom: 1px solid #ddd; } -.navbar .yamm-content h3 { - font-size: 18px; - text-transform: uppercase; - padding-bottom: 10px; - margin-top: 5px; - border-bottom: dotted 1px #555555; - letter-spacing: 0.08em; + +.top-bar.top-bar-light a.login-btn, .top-bar.top-bar-light a.signup-btn { + color: #555 !important; } -@media (max-width: 767px) { - .navbar .yamm-content h3 { - font-size: 14px; - } + +.top-bar.top-bar-light a.login-btn span, .top-bar.top-bar-light a.signup-btn span { + display: inline-block; } -.navbar .yamm-content h5 { - text-transform: uppercase; - padding-bottom: 10px; - border-bottom: dotted 1px #555555; - letter-spacing: 0.08em; + +.top-bar p { + margin-bottom: 0; + font-size: 0.75rem; } -.navbar .yamm-content ul { - margin: 0; - padding: 0; + +.top-bar ul { + margin-bottom: 0; } -.navbar .yamm-content ul li { - list-style-type: none; - border-bottom: solid 1px #eeeeee; + +.top-bar a.login-btn, .top-bar a.signup-btn { + color: #eee; text-transform: uppercase; - padding: 4px 0; -} -.navbar .yamm-content ul li a { - position: relative; - color: #999999; - font-size: 12px; - display: block; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + letter-spacing: 0.1em; + text-decoration: none !important; + font-size: 0.75rem; + font-weight: 700; + margin-right: 10px; } -.navbar .yamm-content ul li a:hover { - color: #986dbd; - text-decoration: none; - padding-left: 2px; + +.top-bar a.login-btn i, .top-bar a.signup-btn i { + margin-right: 10px; } -.navbar .yamm-content .banner { - margin-bottom: 10px; + +.top-bar ul.social-custom { + margin-left: 20px; } -.navbar .yamm-fw .dropdown-menu { + +.top-bar ul.social-custom li { padding: 0; + margin: 0; } -.navbar .navbar-buttons { - float: right; + +.top-bar ul.social-custom a { + text-decoration: none !important; + font-size: 0.7rem; + width: 26px; + height: 26px; + line-height: 26px; + color: #999; + text-align: center; + border-radius: 50%; + margin: 0; } -.navbar .navbar-buttons button, -.navbar .navbar-buttons a.btn, -.navbar .navbar-buttons .btn-default.navbar-toggle { - margin-top: 11px; - margin-bottom: 11px; - margin-left: 0; - margin-right: 5px; -} -.navbar .btn-default, -.navbar .btn-default.navbar-toggle { - color: #999999; - background-color: #fff; - margin-left: 7px; - margin-right: 0; -} -.navbar .btn-default:hover, -.navbar .btn-default.navbar-toggle:hover, -.navbar .btn-default:focus, -.navbar .btn-default.navbar-toggle:focus { - background-color: #fff; - border-color: #986dbd; - color: #986dbd; + +.top-bar ul.social-custom a:hover { + background: #986dbd; + color: #fff; } -.navbar #search { - clear: both; - border-top: solid 1px #986dbd; - text-align: right; + +.top-bar .contact-info { + margin-right: 20px; } -.navbar #search form { - float: right; + +.top-bar .contact-info a { + font-size: 0.8rem; } -.navbar #search form .input-group { - width: 500px; + +.modal .modal-header h4 { + text-transform: uppercase; + letter-spacing: 0.1em; } -@media (max-width: 768px) { - .navbar #search form .input-group { - width: 100%; - } + +.modal input::-moz-placeholder { + font-size: 0.85rem; } -.navbar #basket-overview a { - margin-left: 7px; + +.modal input::-webkit-input-placeholder { + font-size: 0.85rem; } -.navbar-affixed-top { - top: -32px; + +.modal input:-ms-input-placeholder { + font-size: 0.85rem; } -.navbar-affixed-top.affix-top { - -webkit-transition: all 0.5s ease-out; - -moz-transition: all 0.5s ease-out; - transition: all 0.5s ease-out; + +.modal p { + font-size: 0.85rem; } -.navbar-affixed-top.affix { + +header.nav-holder.sticky { position: fixed; - width: 100%; top: 0; - z-index: 1000; - -webkit-box-shadow: 0 0 5px #cccccc; - box-shadow: 0 0 5px #cccccc; - -webkit-transition: all 0.5s ease-out; - -moz-transition: all 0.5s ease-out; - transition: all 0.5s ease-out; + left: 0; + width: 100%; + background: #fff; + z-index: 999; + -webkit-box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); + box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.1); } -body.boxed .navbar-affixed-top.affix { - position: static; + +#navbar { + background: #fff; + padding-top: 0; + padding-bottom: 0; } -#login-modal { - overflow: hidden; + +#navbar .navbar-toggler { + font-size: 0.9rem; + padding: 10px 15px; + border-color: #ddd; } -#login-modal .modal-header h4 { - text-transform: uppercase; + +#navbar ul ul a { + padding-left: 0 !important; } -#login-modal form { - margin-bottom: 20px; + +#navbar .dropdown-menu { + border-radius: 0; + -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); + box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1); + margin-top: 0; + padding-top: 0; + padding-bottom: 0; +} + +#navbar .dropdown-menu .dropdown-item { + padding: 0; } -#login-modal a { + +#navbar .dropdown-menu h5 { + text-transform: uppercase; + letter-spacing: 0.1em; + padding-bottom: 5px; + border-bottom: 1px dotted #ccc; + margin-top: .7rem; + margin-bottom: .5rem; +} + +#navbar .dropdown-menu a.nav-link { + font-size: 0.75rem; + letter-spacing: 0.1em; + text-transform: uppercase !important; + border-bottom: 1px solid #eee; + padding: 15px 20px !important; +} + +#navbar .dropdown-menu a.nav-link:hover { + -webkit-transform: translateX(5px); + transform: translateX(5px); color: #986dbd; } -#login-modal p { - font-weight: 300; - margin-bottom: 20px; - font-size: 13px; + +#navbar .dropdown-submenu { + position: relative; } -/* buttons */ -.btn { - font-weight: 700; - font-family: "Roboto", Helvetica, Arial, sans-serif; - text-transform: uppercase; - letter-spacing: 0.08em; - padding: 6px 12px; - font-size: 13px; - line-height: 1.42857143; - border-radius: 0; + +#navbar .dropdown-submenu > .dropdown-menu { + top: 0; + left: 100%; + margin-top: -2px; + font-size: 1em; } -.input-group .btn { - font-size: 14px; + +#navbar .menu-large { + position: static !important; } -.btn-lg { - padding: 10px 16px; - font-size: 14px; - line-height: 1.33; - border-radius: 0; + +#navbar .menu-large .megamenu { + padding: 20px; + width: 100%; + max-width: 1140px; + left: 50%; + -webkit-transform: translateX(-50%); + transform: translateX(-50%); + margin-top: -1px; +} + +#navbar .menu-large a.nav-link { + padding: 7px !important; + padding-left: 0 !important; +} + +#navbar .navbar-nav > li.active > a { + background: #986dbd !important; + color: #fff !important; + text-decoration: none !important; + border-color: #7f4daa !important; } -.btn-sm { - padding: 5px 10px; - font-size: 12px; - line-height: 1.5; - border-radius: 0; + +#navbar .navbar-nav > li > a { + margin: 0; + padding: 1.4rem 1rem 1.6rem; + color: #555; + font-weight: 600; + text-transform: uppercase; + letter-spacing: 0.1em; + font-size: 0.9rem; + text-decoration: none; + border-top: .3rem solid transparent; } -.btn-xs { - padding: 1px 5px; - font-size: 12px; - line-height: 1.5; - border-radius: 0; + +#navbar .navbar-nav > li > a:hover { + background: rgba(152, 109, 189, 0.5); + border-color: rgba(152, 109, 189, 0.8); +} + +#navbar .navbar-nav > li > a:focus { + background: #986dbd !important; + color: #fff !important; + text-decoration: none !important; + border-color: #7f4daa !important; +} + +#navbar.nav-light .navbar-nav > li.active a.dropdown-toggle, +#navbar.nav-light .navbar-nav > li.active a.dropdown-toggle:hover { + background: none !important; + color: #555 !important; + text-decoration: underline !important; + border-color: #986dbd !important; +} + +#navbar.nav-light .navbar-nav > li > a:hover { + background: none !important; + border-color: #bda2d5 !important; +} + +#navbar.nav-light .navbar-nav > li > a:focus { + background: none !important; + color: #555 !important; + text-decoration: underline !important; + border-color: #986dbd !important; +} + +@media (max-width: 991px) { + #navbar { + padding-top: 1rem; + padding-bottom: 1rem; + } + #navbar .menu-large .megamenu { + width: 100%; + left: 0 !important; + -webkit-transform: none !important; + transform: none !important; + } + #navbar .navbar-collapse { + max-height: 600px; + overflow-y: auto; + margin-top: 1rem; + } + #navbar .navbar-nav > li > a { + padding: 0 10px; + height: 45px; + line-height: 45px; + border-top: 0; + font-size: 0.85rem; + width: 100%; + } + #navbar .navbar-nav > li > a:hover { + background: rgba(152, 109, 189, 0.5); + border-color: rgba(152, 109, 189, 0.8); + } + #navbar .dropdown-menu { + border: none; + -webkit-box-shadow: none; + box-shadow: none; + } } + +.btn { + text-transform: uppercase; + letter-spacing: 0.1em; +} + .btn-template-main { - color: #986dbd; - background-color: #ffffff; - border-color: #986dbd; + background: #986dbd; + border: 1px solid #986dbd !important; + color: #fff !important; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-main:hover, -.btn-template-main:focus, -.btn-template-main:active, -.btn-template-main.active, -.open > .dropdown-toggle.btn-template-main { - color: #986dbd; - background-color: #e6e6e6; - border-color: #7a4aa3; + +.btn-template-main:hover, .btn-template-main:focus { + background: #8c5bb5; + color: #fff !important; + border-color: #8c5bb5 !important; } -.btn-template-main:active, -.btn-template-main.active, -.open > .dropdown-toggle.btn-template-main { - background-image: none; + +.btn-template-white { + background: #fff; + color: #986dbd !important; + border: 1px solid #986dbd !important; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-main.disabled, -.btn-template-main[disabled], -fieldset[disabled] .btn-template-main, -.btn-template-main.disabled:hover, -.btn-template-main[disabled]:hover, -fieldset[disabled] .btn-template-main:hover, -.btn-template-main.disabled:focus, -.btn-template-main[disabled]:focus, -fieldset[disabled] .btn-template-main:focus, -.btn-template-main.disabled:active, -.btn-template-main[disabled]:active, -fieldset[disabled] .btn-template-main:active, -.btn-template-main.disabled.active, -.btn-template-main[disabled].active, -fieldset[disabled] .btn-template-main.active { - background-color: #ffffff; - border-color: #986dbd; + +.btn-template-white:hover, .btn-template-white:focus { + background: #986dbd !important; + color: #fff !important; } -.btn-template-main .badge { - color: #ffffff; - background-color: #986dbd; + +.btn-template-outlined { + background: none; + border: 1px solid #986dbd !important; + color: #986dbd; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-main:hover, -.btn-template-main:focus, -.btn-template-main:active, -.btn-template-main.active { + +.btn-template-outlined:hover, .btn-template-outlined:focus { background: #986dbd; - color: #ffffff; - border-color: #986dbd; + color: #fff !important; } -.btn-template-transparent-primary { - color: #ffffff; - background-color: transparent; - border-color: #ffffff; -} -.btn-template-transparent-primary:hover, -.btn-template-transparent-primary:focus, -.btn-template-transparent-primary:active, -.btn-template-transparent-primary.active, -.open > .dropdown-toggle.btn-template-transparent-primary { - color: #ffffff; - background-color: rgba(0, 0, 0, 0); - border-color: #e0e0e0; -} -.btn-template-transparent-primary:active, -.btn-template-transparent-primary.active, -.open > .dropdown-toggle.btn-template-transparent-primary { - background-image: none; + +.btn-template-outlined-white { + background: none; + border: 1px solid #fff !important; + color: #fff; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-transparent-primary.disabled, -.btn-template-transparent-primary[disabled], -fieldset[disabled] .btn-template-transparent-primary, -.btn-template-transparent-primary.disabled:hover, -.btn-template-transparent-primary[disabled]:hover, -fieldset[disabled] .btn-template-transparent-primary:hover, -.btn-template-transparent-primary.disabled:focus, -.btn-template-transparent-primary[disabled]:focus, -fieldset[disabled] .btn-template-transparent-primary:focus, -.btn-template-transparent-primary.disabled:active, -.btn-template-transparent-primary[disabled]:active, -fieldset[disabled] .btn-template-transparent-primary:active, -.btn-template-transparent-primary.disabled.active, -.btn-template-transparent-primary[disabled].active, -fieldset[disabled] .btn-template-transparent-primary.active { - background-color: transparent; - border-color: #ffffff; + +.btn-template-outlined-white:hover, .btn-template-outlined-white:focus { + background: #fff; + color: #986dbd !important; } -.btn-template-transparent-primary .badge { - color: transparent; - background-color: #ffffff; + +.btn-template-outlined-black { + background: none; + border: 1px solid #333 !important; + color: #333; + border-radius: 0 !important; + text-decoration: none; } -.btn-template-transparent-primary:hover, -.btn-template-transparent-primary:focus, -.btn-template-transparent-primary:active, -.btn-template-transparent-primary.active { - background: #fff; - color: #986dbd; - border-color: #fff; + +.btn-template-outlined-black:hover, .btn-template-outlined-black:focus { + background: #333 !important; + color: #fff !important; } -.btn-template-transparent-black { - color: #ffffff; - background-color: transparent; - border-color: #ffffff; -} -.btn-template-transparent-black:hover, -.btn-template-transparent-black:focus, -.btn-template-transparent-black:active, -.btn-template-transparent-black.active, -.open > .dropdown-toggle.btn-template-transparent-black { - color: #ffffff; - background-color: rgba(0, 0, 0, 0); - border-color: #e0e0e0; -} -.btn-template-transparent-black:active, -.btn-template-transparent-black.active, -.open > .dropdown-toggle.btn-template-transparent-black { - background-image: none; + +.features-buttons button { + margin-bottom: 20px; } -.btn-template-transparent-black.disabled, -.btn-template-transparent-black[disabled], -fieldset[disabled] .btn-template-transparent-black, -.btn-template-transparent-black.disabled:hover, -.btn-template-transparent-black[disabled]:hover, -fieldset[disabled] .btn-template-transparent-black:hover, -.btn-template-transparent-black.disabled:focus, -.btn-template-transparent-black[disabled]:focus, -fieldset[disabled] .btn-template-transparent-black:focus, -.btn-template-transparent-black.disabled:active, -.btn-template-transparent-black[disabled]:active, -fieldset[disabled] .btn-template-transparent-black:active, -.btn-template-transparent-black.disabled.active, -.btn-template-transparent-black[disabled].active, -fieldset[disabled] .btn-template-transparent-black.active { - background-color: transparent; - border-color: #ffffff; + +.customers { + margin-bottom: 40px; +} + +.customers .item { + margin: 0 20px; +} + +.customers .item img { + -webkit-filter: grayscale(100%); + filter: grayscale(100%); + -webkit-transition: all 0.3s; + transition: all 0.3s; +} + +.customers .item img:hover { + -webkit-filter: grayscale(0%); + filter: grayscale(0%); } -.btn-template-transparent-black .badge { - color: transparent; - background-color: #ffffff; + +.testimonials .item { + margin: 0 5px; + height: 100%; } -.btn-template-transparent-black:hover, -.btn-template-transparent-black:focus, -.btn-template-transparent-black:active, -.btn-template-transparent-black.active { + +.testimonials .testimonial { + padding: 20px; background: #fff; - color: #000; - border-color: #fff; + height: 100%; } -.btn-template-primary { - color: #ffffff; - background-color: #986dbd; - border-color: #986dbd; + +.testimonials .text { + font-size: 0.85rem; +} + +.testimonials .text p { + color: #999; +} + +.testimonials .avatar { + min-width: 60px; + max-width: 60px; + min-height: 60px; + max-height: 60px; + border-radius: 50%; + overflow: hidden; + margin-left: 10px; } -.btn-template-primary:hover, -.btn-template-primary:focus, -.btn-template-primary:active, -.btn-template-primary.active, -.open > .dropdown-toggle.btn-template-primary { - color: #ffffff; - background-color: #7f4daa; - border-color: #7a4aa3; + +.testimonials .bottom { + width: 100%; } -.btn-template-primary:active, -.btn-template-primary.active, -.open > .dropdown-toggle.btn-template-primary { - background-image: none; + +.testimonials .bottom .testimonial-info { + text-align: right; } -.btn-template-primary.disabled, -.btn-template-primary[disabled], -fieldset[disabled] .btn-template-primary, -.btn-template-primary.disabled:hover, -.btn-template-primary[disabled]:hover, -fieldset[disabled] .btn-template-primary:hover, -.btn-template-primary.disabled:focus, -.btn-template-primary[disabled]:focus, -fieldset[disabled] .btn-template-primary:focus, -.btn-template-primary.disabled:active, -.btn-template-primary[disabled]:active, -fieldset[disabled] .btn-template-primary:active, -.btn-template-primary.disabled.active, -.btn-template-primary[disabled].active, -fieldset[disabled] .btn-template-primary.active { - background-color: #986dbd; - border-color: #986dbd; + +.testimonials .bottom h5 { + text-transform: uppercase; + letter-spacing: 0.1em; + margin-bottom: 5px; } -.btn-template-primary .badge { + +.testimonials .bottom p { + font-size: 0.75rem; + color: #999; + margin-bottom: 0; +} + +.testimonials .icon { color: #986dbd; - background-color: #ffffff; + font-size: 2rem; + margin-right: 20px; } -#intro { - background: url('../img/home.jpg') no-repeat center top; - -webkit-background-size: cover; - -moz-background-size: cover; - -o-background-size: cover; - background-size: cover; + +.testimonials .owl-carousel .owl-stage { + display: -webkit-box !important; + display: -ms-flexbox !important; + display: flex !important; + -webkit-box-align: stretch !important; + -ms-flex-align: stretch !important; + align-items: stretch !important; } -#intro .item { - font-family: "Roboto", Helvetica, Arial, sans-serif; - height: 100%; + +.testimonials .owl-dot.active span { + background: #986dbd !important; } -#intro .item h1 { - text-transform: uppercase; - font-size: 50px; + +.home-carousel { color: #fff; - margin-bottom: 40px; - letter-spacing: 0.08em; } -@media (max-width: 991px) { - #intro .item h1 { - font-size: 40px; - } + +.home-carousel .owl-carousel { + padding-top: 60px; + padding-bottom: 20px; } -@media (max-width: 767px) { - #intro .item h1 { - font-size: 25px; - } + +.home-carousel h1, .home-carousel h2 { + text-transform: uppercase; + letter-spacing: 0.1em; +} + +.home-carousel li, .home-carousel p { + text-transform: uppercase; + letter-spacing: 0.1em; + font-weight: 700; + font-size: 1.1rem; + margin-bottom: 10px; +} + +.home-carousel p img { + max-width: 200px; +} + +.project .owl-dot.active span { + background: #986dbd !important; +} + +.project .owl-nav { + position: absolute; + top: 0; + right: 0; + left: auto; + bottom: auto; + width: 100%; + padding: 20px; + text-align: right; +} + +.project .owl-nav .owl-prev, .project .owl-nav .owl-next { + width: 30px; + height: 30px; + line-height: 30px; + background: #fff; + color: #986dbd; + text-align: center; + border-radius: 50%; + display: inline-block; + margin: 0 5px; + -webkit-transition: all 0.3s; + transition: all 0.3s; } -#intro .item h3 { + +.project .owl-nav .owl-prev:hover, .project .owl-nav .owl-next:hover { + background: #986dbd; color: #fff; - margin-bottom: 40px; } + @media (max-width: 767px) { - #intro .item h3 { - font-size: 15px; - margin-bottom: 20px; + .home-carousel { + text-align: center !important; } -} -#intro .item .btn { - text-transform: none; -} -@media (max-width: 991px) { - #intro .item .btn { - font-size: 14px; + .home-carousel p, .home-carousel h1, .home-carousel ul { + text-align: center !important; } -} -@media (max-width: 991px) { - #intro .item .carousel-caption { - left: 10%; - right: 10%; + .home-carousel img { + margin: 10px auto; } } -#intro .container, -#intro .row { - height: 100%; - position: relative; + +.owl-thumbs { + display: -webkit-box; + display: -ms-flexbox; + display: flex; } -.jumbotron { - padding: 30px; - margin-bottom: 0; + +.owl-thumbs button { + background: none; + border: none; + margin: 5px; + outline: none; +} + +.home-blog-post { + margin: 15px 0; +} + +.home-blog-post .image { position: relative; - background: url('../img/photogrid.jpg') center center repeat; - background-size: cover; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + margin-bottom: 15px; } -.jumbotron .dark-mask { - position: absolute; - top: 0; - left: 0; + +.home-blog-post .overlay { width: 100%; height: 100%; - background: #986dbd; - opacity: 0.9; - filter: alpha(opacity=90); + background: rgba(152, 109, 189, 0.6); + position: absolute; + top: 0; + opacity: 0; + -webkit-transition: all 0.5s; + transition: all 0.5s; } -.jumbotron h1, -.jumbotron h2, -.jumbotron h3, -.jumbotron p, -.jumbotron ul { - color: #fff; + +.home-blog-post .overlay a { + -webkit-transform: translateY(30px); + transform: translateY(30px); + opacity: 0; } -.jumbotron h1, -.jumbotron h2, -.jumbotron h3 { - color: #ffffff; - text-transform: uppercase; - letter-spacing: 0.08em; + +.home-blog-post .overlay i { + margin-right: 5px; } -.jumbotron p { + +.home-blog-post .text { + text-align: center; +} + +.home-blog-post .text .intro { + text-align: left; margin-bottom: 20px; - font-size: 21px; - font-weight: 400; + color: #888; + font-size: 0.9rem; } -.jumbotron p.text-uppercase { - font-weight: 700; + +.home-blog-post h4 { + margin: 10px 0; + text-transform: uppercase; + letter-spacing: 0.1em; } -.jumbotron > hr { - border-top-color: #d5d5d5; + +.home-blog-post .author-category { + font-size: 0.75rem; + color: #999; + text-transform: uppercase; + letter-spacing: 0.1em; } -.container .jumbotron { - border-radius: 0; + +.home-blog-post .author-category a { + font-weight: 500; } -.jumbotron .container { - max-width: 100%; - z-index: 2; + +.home-blog-post:hover .overlay { + opacity: 1; } -@media screen and (min-width: 768px) { - .jumbotron { - padding-top: 48px; - padding-bottom: 48px; - } - .container .jumbotron { - padding-left: 60px; - padding-right: 60px; - } - .jumbotron h1, - .jumbotron .h1 { - font-size: 46px; - } + +.home-blog-post:hover .overlay a { + -webkit-transform: none; + transform: none; + opacity: 1; } -#categoryMenu h3 { - padding: 20px; - background: #f7f7f7; - margin: 0; - border-bottom: solid 1px #eeeeee; - text-transform: uppercase; - letter-spacing: 0.08em; + +#blog-listing-big .post, #blog-listing-medium .post { + margin-bottom: 60px; } -.panel.sidebar-menu h3 { - padding: 5px 0; - margin: 0; + +#blog-listing-big .image, #blog-listing-medium .image { + margin-bottom: 15px; } -.panel.sidebar-menu { - background: #fff; - margin: 0 0 20px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; + +#blog-listing-big h2 a, #blog-listing-medium h2 a { + color: #555; + text-transform: uppercase; + letter-spacing: 0.1em; } -.panel.sidebar-menu .panel-heading { + +#blog-listing-big .author-category, #blog-listing-medium .author-category { + color: #999; text-transform: uppercase; + letter-spacing: 0.1em; + font-weight: 300; margin-bottom: 10px; - background: none; - padding: 0; - letter-spacing: 0.08em; - border-bottom: none; + font-size: .9rem; } -.panel.sidebar-menu .panel-heading h1, -.panel.sidebar-menu .panel-heading h2, -.panel.sidebar-menu .panel-heading h3, -.panel.sidebar-menu .panel-heading h4, -.panel.sidebar-menu .panel-heading h5 { - display: inline-block; - border-bottom: solid 5px #986dbd; - line-height: 1.1; + +#blog-listing-big .author-category a, #blog-listing-medium .author-category a { + font-weight: 500; margin-bottom: 0; - padding-bottom: 10px; } -.panel.sidebar-menu .panel-heading .btn.btn-danger { - color: #fff; - margin-top: 5px; + +#blog-listing-big .date-comments, #blog-listing-medium .date-comments { + margin-bottom: 0; } -.panel.sidebar-menu .panel-body { - padding: 0; + +#blog-listing-big .date-comments a, #blog-listing-medium .date-comments a { + color: #999; + margin-left: 25px; } -.panel.sidebar-menu .panel-body span.colour { - display: inline-block; - width: 15px; - height: 15px; - border: solid 1px #555555; - vertical-align: top; - margin-top: 2px; - margin-left: 5px; + +#blog-listing-big .date-comments i, #blog-listing-medium .date-comments i { + margin-right: 5px; } -.panel.sidebar-menu .panel-body span.colour.white { - background: #fff; + +#blog-listing-big p.intro, #blog-listing-medium p.intro { + margin-top: 10px; + color: #777; } -.panel.sidebar-menu .panel-body span.colour.red { - background: red; + +.pager { + padding: 20px 0; + margin-top: 20px; + border-top: 1px solid #e6e6e6; } -.panel.sidebar-menu .panel-body span.colour.green { - background: green; + +.disabled a, .disabled a:hover { + border-color: #999 !important; + color: #999 !important; + background: none !important; + cursor: not-allowed; } -.panel.sidebar-menu .panel-body span.colour.blue { - background: blue; + +#blog-post #post-content { + margin-bottom: 20px; } -.panel.sidebar-menu .panel-body span.colour.yellow { - background: yellow; + +#blog-post .comment { + margin-bottom: 25px; } -.panel.sidebar-menu .panel-body label { - color: #999999; - font-size: 12px; + +#blog-post .comment .posted { + color: #999; + font-size: 0.8rem; + margin-bottom: 10px; } -.panel.sidebar-menu .panel-body label:hover { - color: #555555; + +#blog-post .comment.last { + margin-bottom: 0; } -.panel.sidebar-menu ul.nav.category-menu { - margin-bottom: 20px; - text-transform: uppercase; - font-weight: 700; - letter-spacing: 0.08em; + +#blog-post .comment p { + font-size: 0.9rem; } -.panel.sidebar-menu ul.nav.category-menu li a { - font-family: "Roboto", Helvetica, Arial, sans-serif; + +#blog-post #comments, #blog-post #comment-form { + padding: 20px 0; + margin-top: 20px; + border-top: solid 1px #eee; } -.panel.sidebar-menu ul.nav ul { - list-style: none; - padding-left: 0; + +#blog-post #comments h4, #blog-post #comment-form h4 { + margin-bottom: 1.5rem; } -.panel.sidebar-menu ul.nav ul li { - display: block; -} -.panel.sidebar-menu ul.nav ul li a { - position: relative; - font-family: "Times New Roman", Times, serif; - font-weight: normal; - text-transform: none !important; - display: block; - padding: 10px 15px; - padding-left: 30px; - font-size: 12px; - color: #999999; -} -.panel.sidebar-menu ul.nav ul li a:hover, -.panel.sidebar-menu ul.nav ul li a:focus { - text-decoration: none; - background-color: #eeeeee; -} -.panel.sidebar-menu ul.tag-cloud { - list-style: none; - padding-left: 0; -} -.panel.sidebar-menu ul.tag-cloud li { - display: inline-block; -} -.panel.sidebar-menu ul.tag-cloud li a { - display: inline-block; - padding: 5px; - border: solid 1px #eeeeee; - border-radius: 0; - color: #986dbd; - margin: 5px 5px 5px 0; - text-transform: uppercase; - letter-spacing: 0.08em; - font-weight: 700; - font-size: 12px; - text-decoration: none; -} -.panel.sidebar-menu ul.tag-cloud li a:hover { - color: #986dbd; - border-color: #986dbd; -} -.panel.sidebar-menu ul.tag-cloud li.active a { - color: #FFFFFF; - background-color: #986dbd; -} -.panel.sidebar-menu ul.tag-cloud li.active a:hover { - color: #FFFFFF; -} -.panel.sidebar-menu ul.popular, -.panel.sidebar-menu ul.recent { - list-style: none; - padding-left: 0; - padding: 20px 0; -} -.panel.sidebar-menu ul.popular li, -.panel.sidebar-menu ul.recent li { - margin-bottom: 10px; - padding: 5px 0; - border-bottom: dotted 1px #eeeeee; -} -.panel.sidebar-menu ul.popular li:before, -.panel.sidebar-menu ul.recent li:before, -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - content: " "; - display: table; -} -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - clear: both; -} -.panel.sidebar-menu ul.popular li:before, -.panel.sidebar-menu ul.recent li:before, -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - content: " "; - display: table; -} -.panel.sidebar-menu ul.popular li:after, -.panel.sidebar-menu ul.recent li:after { - clear: both; -} -.panel.sidebar-menu ul.popular li img, -.panel.sidebar-menu ul.recent li img { - width: 50px; - margin-right: 10px; -} -.panel.sidebar-menu ul.popular li h5, -.panel.sidebar-menu ul.recent li h5 { - margin: 0 0 10px; -} -.panel.sidebar-menu ul.popular li h5 a, -.panel.sidebar-menu ul.recent li h5 a { - font-weight: normal; -} -.panel.sidebar-menu ul.popular li p.date, -.panel.sidebar-menu ul.recent li p.date { - float: right; - font-size: 12px; - color: #999999; -} -.panel.sidebar-menu ul.popular li:last-child, -.panel.sidebar-menu ul.recent li:last-child { - border-bottom: none; -} -.panel.sidebar-menu .text-widget { - font-size: 12px; -} -.panel.sidebar-menu.with-icons ul.nav li a:after { - font-family: 'FontAwesome'; - content: "\f105"; - position: relative; - top: 0; - float: right; -} -/* ribbons for product sales etc. */ -.ribbon { - position: absolute; - top: 50px; - padding-left: 51px; - font-weight: 700; - letter-spacing: 0.08em; -} -.ribbon .ribbon-background { - position: absolute; - top: 0; - right: 0; -} -.ribbon .theribbon { - position: relative; - width: 80px; - padding: 6px 20px 6px 20px; - margin: 30px 10px 10px -71px; - color: #fff; - background-color: #986dbd; - font-family: "Roboto", Helvetica, Arial, sans-serif; -} -.ribbon .theribbon:before, -.ribbon .theribbon:after { - content: ' '; - position: absolute; - width: 0; - height: 0; -} -.ribbon .theribbon:after { - left: 0px; - top: 100%; - border-width: 5px 10px; - border-style: solid; - border-color: #000000 #000000 transparent transparent; -} -.ribbon.sale { - top: 0; -} -.ribbon.new { - top: 50px; -} -.ribbon.new .theribbon { - background-color: #5bc0de; - text-shadow: 0px 1px 2px #bbb; -} -.ribbon.new .theribbon:after { - border-color: #2390b0 #2390b0 transparent transparent; -} -.ribbon.gift { - top: 100px; -} -.ribbon.gift .theribbon { - background-color: #5cb85c; - text-shadow: 0px 1px 2px #bbb; -} -.ribbon.gift .theribbon:after { - border-color: #357935 #357935 transparent transparent; -} -.owl-carousel .owl-controls .owl-page.active span, -.owl-theme .owl-controls .owl-page.active span, -.owl-carousel .owl-controls.clickable .owl-page:hover span, -.owl-theme .owl-controls.clickable .owl-page:hover span { - background: #986dbd; -} -.owl-carousel .owl-controls .owl-buttons, -.owl-theme .owl-controls .owl-buttons { - position: absolute; - top: 5px; - right: 0; -} -.owl-carousel .owl-controls .owl-buttons div, -.owl-theme .owl-controls .owl-buttons div { - width: 26px; - height: 26px; - line-height: 25px; - margin: 0 5px 0 0; - font-size: 18px; - color: #986dbd; - padding: 0; - background: #fff; - border-radius: 13px; - vertical-align: middle; - text-align: center; - opacity: 1; - filter: alpha(opacity=100); -} -.home-carousel { - position: relative; - background: url('../img/photogrid.jpg') center center repeat; - background-size: cover; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -.home-carousel .dark-mask { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: #986dbd; - opacity: 0.9; - filter: alpha(opacity=90); -} -.home-carousel .owl-carousel { - padding-top: 60px; - padding-bottom: 20px; -} -.home-carousel .owl-theme .owl-controls .owl-page span { - background: #666; -} -.home-carousel .owl-theme .owl-controls .owl-page.active span { - background: #fff; -} -.home-carousel .owl-theme .owl-controls .owl-page:hover span { - background: #fff; -} -@media (max-width: 767px) { - .home-carousel { - text-align: center !important; - } -} -@media (min-width: 992px) { - .home-carousel .right { - text-align: right; - } -} -.home-carousel h1, -.home-carousel h2, -.home-carousel h3, -.home-carousel p, -.home-carousel ul { - color: #fff; -} -.home-carousel h1 { - font-weight: 700; - text-transform: uppercase; - font-size: 46px; - letter-spacing: 0.08em; -} -@media (max-width: 991px) { - .home-carousel h1 { - font-size: 36px; - } -} -.home-carousel h2 { - font-weight: 700; - text-transform: uppercase; - font-size: 40px; - letter-spacing: 0.08em; -} -.home-carousel ul, -.home-carousel p { - font-size: 18px; - font-weight: 700; - padding: 0; - text-transform: uppercase; - letter-spacing: 0.10em; -} -@media (max-width: 991px) { - .home-carousel ul, - .home-carousel p { - font-size: 14px; - } -} -.home-carousel ul li { - margin-bottom: 10px; -} -.customers { - padding: 0; - margin-bottom: 40px; -} -.customers .item { - list-style-type: none; - text-align: center; - margin: 0 20px; -} -.customers .item img { - display: inline-block; - filter: url("data:image/svg+xml;utf8,#grayscale"); - /* Firefox 10+, Firefox on Android */ - filter: gray; - /* IE6-9 */ - -webkit-filter: grayscale(100%); - /* Chrome 19+, Safari 6+, Safari 6+ iOS */ - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -.customers .item img:hover { - max-width: auto; - filter: none; - -webkit-filter: none; -} -.testimonials { - padding: 0; - margin-bottom: 40px; -} -.testimonials .item { - list-style-type: none; - margin: 0 5px; - background: #fff; - padding-bottom: 60px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; -} -.testimonials .item .testimonial { - position: relative; - padding: 20px; -} -.testimonials .item .testimonial:before, -.testimonials .item .testimonial:after { - content: " "; - display: table; -} -.testimonials .item .testimonial:after { - clear: both; -} -.testimonials .item .testimonial:before, -.testimonials .item .testimonial:after { - content: " "; - display: table; -} -.testimonials .item .testimonial:after { - clear: both; -} -.testimonials .item .testimonial .text { - color: #999999; - margin-bottom: 40px; -} -.testimonials .item .testimonial .bottom { - position: absolute; - left: 0; - bottom: 0; - width: 100%; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - padding: 20px; - height: 50px; -} -.testimonials .item .testimonial .bottom .icon { - color: #986dbd; - font-size: 30px; - float: left; - width: 20%; -} -.testimonials .item .testimonial .name-picture { - float: right; - width: 80%; - text-align: right; -} -.testimonials .item .testimonial .name-picture h5 { - font-size: 14px; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.testimonials .item .testimonial .name-picture p { - color: #999999; - margin: 0; - font-size: 12px; -} -.testimonials .item .testimonial .name-picture img { - float: right; - width: 60px; - border-radius: 30px; - margin-left: 10px; -} -.team-member { - text-align: center; - margin-bottom: 40px; -} -.team-member h3 { - font-size: 18px; - text-transform: uppercase; - margin-bottom: 5px; - letter-spacing: 0.08em; -} -.team-member h3 a { - color: #555555; -} -.team-member p.role { - color: #999999; - font-size: 12px; - text-transform: uppercase; - letter-spacing: 0.06em; -} -.team-member .social { - margin-bottom: 20px; -} -.team-member .social a { - margin: 0 10px 0 0; - color: #fff; - display: inline-block; - width: 26px; - height: 26px; - border-radius: 13px; - line-height: 26px; - font-size: 15px; - text-align: center; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - vertical-align: bottom; -} -.team-member .social a i { - vertical-align: bottom; - line-height: 26px; -} -.team-member .social a.facebook { - background-color: #4460ae; -} -.team-member .social a.gplus { - background-color: #c21f25; -} -.team-member .social a.twitter { - background-color: #3cf; -} -.team-member .social a.instagram { - background-color: #cd4378; -} -.team-member .social a.email { - background-color: #4a7f45; -} -.team-member .text p { - color: #999999; - font-size: 12px; -} -.team-member .social, -.team-member-detail .social { + +#blog-post #comment-form { margin-bottom: 20px; } -.team-member .social a, -.team-member-detail .social a { - margin: 0 10px 0 0; - color: #fff; - display: inline-block; - width: 26px; - height: 26px; - border-radius: 13px; - line-height: 26px; - font-size: 15px; - text-align: center; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - vertical-align: bottom; -} -.team-member .social a i, -.team-member-detail .social a i { - vertical-align: bottom; - line-height: 26px; -} -.team-member .social a.facebook, -.team-member-detail .social a.facebook { - background-color: #4460ae; -} -.team-member .social a.gplus, -.team-member-detail .social a.gplus { - background-color: #c21f25; -} -.team-member .social a.twitter, -.team-member-detail .social a.twitter { - background-color: #3cf; -} -.team-member .social a.instagram, -.team-member-detail .social a.instagram { - background-color: #cd4378; -} -.team-member .social a.email, -.team-member-detail .social a.email { - background-color: #4a7f45; + +#blog-post .reply i { + margin-right: 5px; } + .box-simple { - text-align: center; margin-bottom: 40px; + text-align: center; +} + +.box-simple:hover .icon-outlined { + -webkit-transform: scale(1.1); + transform: scale(1.1); } -.box-simple .icon { + +.box-simple .icon-outlined { color: #986dbd; - border-color: #986dbd; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + border: 1px solid #986dbd; + -webkit-transition: all 0.3s; + transition: all 0.3s; } + .box-simple h3 { - font-weight: normal; - font-size: 18px; text-transform: uppercase; - line-height: 1.5; - color: #555555; - font-weight: 800; - letter-spacing: 0.08em; -} -.box-simple h3 a { - color: #555555; + letter-spacing: 0.1em; } + .box-simple p { - color: #999999; -} -.box-simple:hover .icon { - -webkit-transform: scale(1.1, 1.1); - -ms-transform: scale(1.1, 1.1); - -o-transform: scale(1.1, 1.1); - transform: scale(1.1, 1.1); -} -.box-simple:hover .icon i { - -webkit-transform: scale(1, 1); - -ms-transform: scale(1, 1); - -o-transform: scale(1, 1); - transform: scale(1, 1); + color: #999; + margin: 20px 0; + font-size: 0.9rem; } + .box-simple.box-white { - padding: 20px; - border: dotted 1px #999999; + border: dotted 1px #999; + padding: 15px 20px; + margin-bottom: 0; } + .box-simple.box-white .icon { - color: #555555; - border-color: transparent; - font-size: 70px; + font-size: 2rem; + margin-bottom: 1rem; +} + +.box-simple.box-white p { + color: #999; + margin-bottom: 5px; } + .box-simple.box-dark { - padding: 20px; - border: dotted 1px #999999; - background: #555555; + border: dotted 1px #999; + padding: 15px 20px; + margin-bottom: 0; color: #fff; + background: #555; } + .box-simple.box-dark .icon { - color: #f7f7f7; - border-color: transparent; - font-size: 70px; -} -.box-simple.box-dark h3 { - color: #fff; -} -.box-simple.box-dark h3 a { - color: #fff; + font-size: 2rem; + margin-bottom: 1rem; } + .box-simple.box-dark p { + margin-bottom: 5px; color: #fff; } -.box-image { - position: relative; - overflow: hidden; - text-align: center; - margin: 15px 0; + +.same-height div[class*="col-"] { + margin-bottom: 30px; } -.box-image .bg { - position: absolute; - top: auto; - bottom: 0; - width: 100%; + +.same-height .box-white, .same-height.box-dark { height: 100%; - opacity: 0; - filter: alpha(opacity=0); - background: #986dbd; } -.box-image .name { - position: absolute; - width: 100%; - height: 50%; - bottom: 0; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image .name h3 { - color: #fff; - text-transform: uppercase; - font-size: 18px; - letter-spacing: 0.08em; -} -.box-image .name h3 a { - color: #fff; - text-decoration: none; -} -.box-image .text { - position: absolute; - width: 100%; - height: 50%; - top: 0; - -webkit-transform: translate(0, -150%); - -ms-transform: translate(0, -150%); - -o-transform: translate(0, -150%); - transform: translate(0, -150%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image:hover .bg { - opacity: 0.7; - filter: alpha(opacity=70); -} -.box-image:hover .name { - position: absolute; - -webkit-transform: translate(0, -75%); - -ms-transform: translate(0, -75%); - -o-transform: translate(0, -75%); - transform: translate(0, -75%); -} -.box-image:hover .text { - position: absolute; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); -} -.box-image-text { - position: relative; - overflow: hidden; - text-align: center; - margin: 15px 0; -} -.box-image-text .top { + +.box-image { position: relative; - margin-bottom: 10px; -} -.box-image-text .top .bg { - position: absolute; - top: auto; - bottom: 0; - width: 100%; - height: 100%; - opacity: 0; - filter: alpha(opacity=0); - background: #986dbd; -} -.box-image-text .top .name { - position: absolute; - width: 100%; - height: 50%; - bottom: 0; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image-text .top .name h3 { - color: #fff; - text-transform: uppercase; - font-size: 18px; - letter-spacing: 0.08em; -} -.box-image-text .top .name h3 a { - color: #fff; - text-decoration: none; -} -.box-image-text .top .text { - position: absolute; - width: 100%; - height: 50%; - top: 0; - -webkit-transform: translate(0, -150%); - -ms-transform: translate(0, -150%); - -o-transform: translate(0, -150%); - transform: translate(0, -150%); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - color: #fff; - padding: 0 20px; -} -.box-image-text .content h3, -.box-image-text .content h4 { - text-transform: uppercase; - line-height: 1.5; - color: #555555; - font-weight: 800; - letter-spacing: 0.08em; -} -.box-image-text .content p { - color: #999999; -} -.box-image-text:hover .bg { - opacity: 0.7; - filter: alpha(opacity=70); -} -.box-image-text:hover .name { - position: absolute; - -webkit-transform: translate(0, -75%); - -ms-transform: translate(0, -75%); - -o-transform: translate(0, -75%); - transform: translate(0, -75%); -} -.box-image-text:hover .text { - position: absolute; - -webkit-transform: translate(0, 100%); - -ms-transform: translate(0, 100%); - -o-transform: translate(0, 100%); - transform: translate(0, 100%); -} -/* universal box */ -.box { - background: #fff; - margin: 0 0 30px; - border: solid 1px #ccc; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - padding: 20px 0; - border-left: none; - border-right: none; -} -.box .box-header { - background: #f7f7f7; - margin: -20px 0 20px; - padding: 20px; - border-bottom: solid 1px #eeeeee; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.box .box-header:before, -.box .box-header:after { - content: " "; - display: table; -} -.box .box-header:after { - clear: both; -} -.box .box-header:before, -.box .box-header:after { - content: " "; - display: table; -} -.box .box-header:after { - clear: both; -} -.box .box-footer { - background: #f7f7f7; - margin: 30px 0 -20px; - padding: 20px; - border-top: solid 1px #eeeeee; -} -.box .box-footer:before, -.box .box-footer:after { - content: " "; - display: table; -} -.box .box-footer:after { - clear: both; + margin: 20px 0; } -.box .box-footer:before, -.box .box-footer:after { - content: " "; - display: table; + +.box-image:hover .overlay { + opacity: 1; } -.box .box-footer:after { - clear: both; + +.box-image:hover h3, .box-image:hover p, .box-image:hover .buttons { + opacity: 1; + -webkit-transform: none; + transform: none; } -@media (max-width: 991px) { - .box .box-footer .btn { - margin-bottom: 20px; - } + +.box-image:hover p { + -webkit-transition-delay: 0.1s; + transition-delay: 0.1s; } -.box.no-border { - border: none; + +.box-image:hover .buttons { + -webkit-transition-delay: 0.2s; + transition-delay: 0.2s; } -#heading-breadcrumbs { - background: url('../img/texture-violet.png') center center repeat; - padding: 20px 0; - margin-bottom: 40px; + +.box-image .name { + margin-bottom: 20px; } -#heading-breadcrumbs.no-mb { - margin-bottom: 0; + +.box-image a { + text-decoration: none !important; } -#heading-breadcrumbs h1 { - color: #333333; + +.box-image h3 { + font-size: 1.125rem; text-transform: uppercase; - font-size: 30px; - font-weight: 700; - letter-spacing: 0.08em; -} -@media (max-width: 991px) { - #heading-breadcrumbs h1 { - text-align: center; - } -} -#heading-breadcrumbs ul.breadcrumb { - margin-top: 5px; - margin-bottom: 0; -} -.bar { - position: relative; - background: #986dbd; - padding: 60px 0; -} -.bar.background-pentagon { - background: url('../img/texture-violet.png') center center repeat; - border-top: solid 1px #999999; - border-bottom: solid 1px #999999; -} -.bar.background-gray { - background: #eeeeee; -} -.bar.background-gray-dark { - background: #555555; -} -.bar.background-white { - background: #fff; -} -.bar.background-image-fixed-1 { - background: url('../img/fixed-background-1.jpg') center top no-repeat; - background-attachment: fixed; - background-size: cover; -} -.bar.background-image-fixed-2 { - background: url('../img/fixed-background-2.jpg') center top no-repeat; - background-attachment: fixed; - background-size: cover; -} -.bar.color-white h1, -.bar.color-white h2, -.bar.color-white h3, -.bar.color-white h4, -.bar.color-white h5, -.bar.color-white h6, -.bar.color-white p { - color: #fff; -} -.bar.padding-big { - padding: 50px 0; -} -.bar.padding-horizontal { - padding-left: 30px; - padding-right: 30px; -} -.bar.margin-vertical { - margin-top: 20px; - margin-bottom: 20px; + letter-spacing: 0.1em; + -webkit-transition: all 0.3s; + transition: all 0.3s; + opacity: 0; + -webkit-transform: translateY(-50px); + transform: translateY(-50px); } -.bar .dark-mask { + +.box-image .overlay { + width: 100%; + height: 100%; position: absolute; top: 0; left: 0; - width: 100%; - height: 100%; - background: #000; - opacity: 0.3; - filter: alpha(opacity=30); -} -.portfolio.no-space { - padding: 0 15px; -} -.portfolio.no-space .box-image { - margin: 0 -15px; -} -.portfolio-project .project-more h4 { - color: #555555; - text-transform: uppercase; - margin-bottom: 0; - text-align: left; - font-size: 14px; - letter-spacing: 0.08em; -} -.portfolio-project .project-more p { - color: #999999; - padding: 10px 0; - margin-bottom: 20px; - text-align: left; -} -.portfolio-showcase { - margin: 15px 0 60px; -} -.portfolio-showcase h3 a { - text-transform: uppercase; - line-height: 1.5; - letter-spacing: 0.08em; + background: rgba(152, 109, 189, 0.6); + padding: 20px; + -webkit-transition: all 0.3s; + transition: all 0.3s; + opacity: 0; } -.portfolio-showcase p.lead { - color: #555555; - margin-bottom: 20px; + +.box-image .buttons { + opacity: 0; + -webkit-transition: all 0.3s; + transition: all 0.3s; + -webkit-transform: translateY(20px); + transform: translateY(20px); +} + +.box-image .buttons a { + margin: 0 3px; +} + +.box-image p { + -webkit-transition: all 0.3s; + transition: all 0.3s; + opacity: 0; + -webkit-transform: translateY(20px); + transform: translateY(20px); } -.portfolio-showcase p { - color: #999999; + +.box-image-text .content { + text-align: center; } -.portfolio-showcase p.buttons { - margin-top: 40px; + +.box-image-text p { + color: #777; + font-size: 0.9rem; } + .see-more { - text-align: center; - margin-top: 20px; - padding-top: 20px; + margin-top: 40px; } + .see-more p { - font-size: 28px; + font-size: 1.8rem; font-weight: 100; - margin-bottom: 20px; -} -.showcase .item { - text-align: center; } -.showcase .item .icon { - display: inline-block; - width: 50px; - height: 50px; - color: #555555; - line-height: 50px; - border-radius: 25px; - border: solid 1px #555555; -} -.showcase .item h4 { - color: #555555; - text-transform: uppercase; - letter-spacing: 0.08em; - line-height: 1.5; - font-size: 16px; -} -.showcase .item h4 span { - font-weight: bold; - font-size: 51px; + +.box { + margin: 80px 0; + border-top: 1px solid #ddd; + border-bottom: 1px solid #ddd; + padding: 20px; } -.packages .package { - background: #fff; + +.box a.btn { margin-top: 25px; - margin-bottom: 20px; - padding-bottom: 15px; - text-align: center; - border: solid 1px #986dbd; - overflow: hidden; -} -.packages .package .package-header { - height: 57px; - color: #fff; - line-height: 57px; - background: #986dbd; -} -.packages .package .package-header h5 { - color: #fff; - text-transform: uppercase; - font-weight: bold; - line-height: 57px; - margin: 0; - letter-spacing: 0.08em; -} -.packages .package .package-header.light-gray { - background: #eeeeee; -} -.packages .package .package-header.light-gray h5 { - color: #555555; -} -.packages .package .price { - line-height: 120px; - height: 100px; - color: #fff; - font-weight: 400; -} -.packages .package .price h4 { - display: inline; - font-size: 50px; - line-height: normal; - margin-bottom: 0; -} -.packages .package .price .period { - line-height: normal; - color: #999999; -} -.packages .package ul { - padding: 0; -} -.packages .package ul li { - list-style-type: none; - padding-top: 10px; - padding-bottom: 10px; - width: 80%; - margin: auto; - border-bottom: 1px dotted #ccc; -} -.packages .package ul li:last-child { - border-bottom: 0; -} -.packages .package ul li i { - font-size: 13px; - margin-right: 5px; -} -.packages .best-value .package { - margin-top: 0; - padding-bottom: 40px; -} -.packages .best-value .package .package-header { - height: 72px; - padding-top: 17px; - height: 82px !important; -} -.packages .best-value .package .package-header h5 { - font-weight: bold; - line-height: 29px; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.packages .best-value .package .package-header .meta-text { - font-size: 13px; - line-height: 15px; -} -#map { - height: 300px; -} -#map.with-border { - border-top: solid 1px #986dbd; - border-bottom: solid 1px #986dbd; -} -#blog-listing-big .post, -#blog-homepage .post { - margin-bottom: 60px; } -#blog-listing-big .post h2, -#blog-homepage .post h2, -#blog-listing-big .post h4, -#blog-homepage .post h4 { - text-transform: uppercase; - letter-spacing: 0.08em; -} -#blog-listing-big .post h2 a, -#blog-homepage .post h2 a, -#blog-listing-big .post h4 a, -#blog-homepage .post h4 a { - color: #555555; -} -#blog-listing-big .post h2 a:hover, -#blog-homepage .post h2 a:hover, -#blog-listing-big .post h4 a:hover, -#blog-homepage .post h4 a:hover { - color: #986dbd; -} -#blog-listing-big .post .author-category, -#blog-homepage .post .author-category { - color: #999999; + +.box .box-header { + background: #f7f7f7; + margin: 20px 0 20px; + padding: 20px; + border-top: 1px solid #eee; text-transform: uppercase; - font-weight: 300; - letter-spacing: 0.08em; -} -#blog-listing-big .post .author-category a, -#blog-homepage .post .author-category a { - font-weight: 500; -} -#blog-listing-big .post .date-comments a, -#blog-homepage .post .date-comments a { - color: #999999; - margin-right: 20px; + letter-spacing: 0.1em; } -#blog-listing-big .post .date-comments a:hover, -#blog-homepage .post .date-comments a:hover { - color: #986dbd; + +.box .box-footer { + background: #f7f7f7; + margin-top: 30px; + padding: 20px; + border-top: 1px solid #eee; } -@media (min-width: 768px) { - #blog-listing-big .post .date-comments, - #blog-homepage .post .date-comments { - text-align: right; - } + +.box.shipping-method, .box.payment-method { + margin: 0; + margin-bottom: 20px; } -#blog-listing-big .post .intro, -#blog-homepage .post .intro { - text-align: left; + +.box.shipping-method h4, .box.payment-method h4 { + text-transform: uppercase; + letter-spacing: 0.1em; + margin-bottom: 5px; } -#blog-listing-big .post .image, -#blog-homepage .post .image { - margin-bottom: 10px; - overflow: hidden; + +.box.shipping-method p, .box.payment-method p { + font-size: 0.9rem; + color: #555; } -#blog-listing-big .post .image img, -#blog-homepage .post .image img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.box-image-text { + margin: 15px 0; } -@media (max-width: 767px) { - #blog-listing-big .post .image img.img-responsive, - #blog-homepage .post .image img.img-responsive { - min-width: 100%; - } + +.box-image-text .image { + position: relative; + margin-bottom: 15px; } -#blog-listing-big .post .video, -#blog-homepage .post .video { - margin-bottom: 10px; + +.box-image-text .overlay { + width: 100%; + height: 100%; + background: rgba(152, 109, 189, 0.6); + position: absolute; + top: 0; + opacity: 0; + -webkit-transition: all 0.5s; + transition: all 0.5s; } -#blog-listing-big .post .read-more, -#blog-homepage .post .read-more { - text-align: right; + +.box-image-text .overlay a { + -webkit-transform: translateY(30px); + transform: translateY(30px); + opacity: 0; } -#blog-listing-medium .post { - margin-bottom: 60px; + +.box-image-text .overlay i { + margin-right: 5px; } -#blog-listing-medium .post h2 { - text-transform: uppercase; - margin: 0 0 10px; - font-size: 24px; - letter-spacing: 0.08em; + +.box-image-text .text { + text-align: center; } -#blog-listing-medium .post h2 a { - color: #555555; + +.box-image-text .text .intro { + text-align: left; + margin-bottom: 20px; + color: #888; + font-size: 0.9rem; } -#blog-listing-medium .post h2 a:hover { - color: #986dbd; + +.box-image-text h4 { + margin: 10px 0; + text-transform: uppercase; + letter-spacing: 0.1em; } -#blog-listing-medium .post .author-category { - float: left; - color: #999999; + +.box-image-text .author-category { + font-size: 0.75rem; + color: #999; text-transform: uppercase; - font-weight: 300; - font-size: 12px; - letter-spacing: 0.08em; + letter-spacing: 0.1em; } -#blog-listing-medium .post .author-category a { + +.box-image-text .author-category a { font-weight: 500; } -#blog-listing-medium .post .date-comments { - float: right; - font-size: 12px; -} -#blog-listing-medium .post .date-comments a { - color: #999999; - margin-right: 20px; -} -#blog-listing-medium .post .date-comments a:hover { - color: #986dbd; -} -@media (min-width: 768px) { - #blog-listing-medium .post .date-comments { - text-align: right; - } -} -#blog-listing-medium .post .intro { - text-align: left; + +.box-image-text:hover .overlay { + opacity: 1; } -#blog-listing-medium .post .clearfix:before, -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:before, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:before, -#blog-listing-medium .post .navbar-header:after { - content: " "; - display: table; -} -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:after { - clear: both; -} -#blog-listing-medium .post .clearfix:before, -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:before, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:before, -#blog-listing-medium .post .navbar-header:after { - content: " "; - display: table; + +.box-image-text:hover .overlay a { + -webkit-transform: none; + transform: none; + opacity: 1; } -#blog-listing-medium .post .clearfix:after, -#blog-listing-medium .post .navbar:after, -#blog-listing-medium .post .navbar-header:after { - clear: both; + +.box-footer a { + margin: 0 !important; } -#blog-listing-medium .post .image { - margin-bottom: 10px; - overflow: hidden; + +.box-footer .right-col i { + margin-left: 5px; } -#blog-listing-medium .post .image img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +.box-footer .left-col i { + margin-right: 5px; } + @media (max-width: 767px) { - #blog-listing-medium .post .image img.img-responsive { - min-width: 100%; + .box-footer { + -webkit-box-pack: center !important; + -ms-flex-pack: center !important; + justify-content: center !important; + } + .box-footer a { + margin-bottom: 10px !important; } } -#blog-listing-medium .post .video { - margin-bottom: 10px; + +.jumbotron h1, .jumbotron h2 { + letter-spacing: 0.1em; } -#blog-listing-medium .post .read-more { - text-align: right; + +.jumbotron p { + letter-spacing: 0.1em; + font-size: 1.3rem; +} + +.package { + text-align: center; + border: 1px solid #986dbd; + margin-top: 25px; + margin-bottom: 20px; + padding-bottom: 15px; + overflow: hidden; } -.box-image-text.blog .author-category { - color: #999999; + +.package .package-header { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + height: 55px; +} + +.package .package-header h5 { + margin: 0; text-transform: uppercase; - letter-spacing: 0.08em; - font-weight: 300; - font-size: 12px; + letter-spacing: 0.1em; + display: inline-block; + color: #555; } -.box-image-text.blog .author-category a { - font-weight: 500; + +.package .package-header .meta-text { + font-size: 0.8rem; } -.box-image-text.blog .intro { - text-align: left; + +.package h4 { + margin-top: 1rem; + margin-bottom: 0; + color: #333; +} + +.package .price-container { margin-bottom: 20px; } -#blog-homepage .post { - margin-bottom: 30px; + +.package .price-container span.period { + color: #777; + font-size: 0.9rem; + margin-left: 10px; } -#blog-homepage .post h2, -#blog-homepage .post h4, -#blog-homepage .post .author-category, -#blog-homepage .post .read-more { - text-align: center; + +.package ul { + padding: 0 30px; } -#blog-homepage .post .read-more { - margin-top: 20px; + +.package ul li { + padding: 10px; + border-bottom: 1px solid #eee; + color: #555; + font-size: 0.9rem; } -#blog-post #post-content { - margin-bottom: 20px; + +.package ul i { + margin-right: 10px; } -#blog-post .comment { - margin-bottom: 25px; + +.best-value .package { + margin-top: 0; + padding-bottom: 40px; + border: 1px solid #986dbd; } -#blog-post .comment:before, -#blog-post .comment:after { - content: " "; - display: table; + +.best-value .package .package-header { + height: 85px; } -#blog-post .comment:after { - clear: both; + +.best-value .package .package-header h5 { + color: #fff; } -#blog-post .comment:before, -#blog-post .comment:after { - content: " "; - display: table; + +.team-member { + margin-bottom: 40px; } -#blog-post .comment:after { - clear: both; + +.team-member .image { + margin-bottom: 1rem; } -#blog-post .comment .posted { - color: #999999; - font-size: 12px; + +.team-member a { + color: #333; } -#blog-post .comment .reply { - font-family: "Roboto", Helvetica, Arial, sans-serif; + +.team-member a:hover { + color: #333; } -#blog-post .comment.last { + +.team-member h3 { + font-size: 1.125rem; + text-transform: uppercase; + letter-spacing: 0.1em; + margin-bottom: 5px; +} + +.team-member p.role { + font-size: 0.8rem; + text-transform: uppercase; + color: #999; margin-bottom: 0; } -#blog-post #comments, -#blog-post #comment-form { - padding: 20px 0; - margin-top: 20px; - border-top: solid 1px #eeeeee; + +.team-member p { + color: #999; + font-size: 0.8rem; } -#blog-post #comments:before, -#blog-post #comment-form:before, -#blog-post #comments:after, -#blog-post #comment-form:after { - content: " "; - display: table; + +.team-member-detail p:not(.lead) { + color: #555; + font-size: 0.9rem; } -#blog-post #comments:after, -#blog-post #comment-form:after { - clear: both; + +.portfolio p { + color: #fff; } -#blog-post #comments:before, -#blog-post #comment-form:before, -#blog-post #comments:after, -#blog-post #comment-form:after { - content: " "; - display: table; + +.portfolio-project p { + font-size: 0.9rem; + color: #888; } -#blog-post #comments:after, -#blog-post #comment-form:after { - clear: both; + +.portfolio-project .project-more p { + padding: 5px 0; + font-size: 0.85rem; } -#blog-post #comments h4, -#blog-post #comment-form h4 { - margin-bottom: 20px; + +.portfolio-project .project-more h4 { + margin-bottom: 5px; + text-transform: uppercase; + letter-spacing: 0.1em; + font-size: 0.88rem; + color: #555; } -#blog-post #comment-form { - margin-bottom: 20px; + +.portfolio-showcase { + margin-bottom: 60px; +} + +.portfolio-showcase h3 { + text-transform: uppercase; + -webkit-transition-property: 0.1rem; + transition-property: 0.1rem; +} + +.portfolio-showcase .buttons { + margin-top: 40px; +} + +.portfolio-showcase p:not(.lead) { + color: #999; + font-size: 0.9rem; } + +.portfolio-showcase p.lead { + color: #666; +} + .product { - background: #fff; - border-bottom: solid 1px #e6e6e6; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - margin-bottom: 60px; - overflow: hidden; text-align: center; + position: relative; + margin-bottom: 40px; } + .product .image { overflow: hidden; + max-height: 190px; } -.product .image img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; -} -@media (max-width: 767px) { - .product .image img.img-responsive { - min-width: 100%; - } + +.product .image a { + margin: 0; } + .product .text { padding: 10px; + border-bottom: 1px solid #ddd; } + .product .text h3 { - font-size: 14px; - font-weight: 700; - height: 39.6px; - text-transform: uppercase; - letter-spacing: 0.08em; -} -.product .text h3 a { - color: #555555; -} -.product .text h3 a:hover { - text-decoration: none; + min-height: 63px; } -.product .text p.price { - font-size: 18px; + +.product .price { + font-size: 1.1rem; } -.product .text p.price del { - color: #999999; + +.product .price del { + color: #999; + display: inline-block; + margin-right: 5px; } -.product .buttons { - clear: both; - position: absolute; - display: none; - bottom: 0; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - width: 100%; - border: solid 1px transparent; - padding: 20px; - background: rgba(255, 255, 255, 0.9); - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - text-align: center; + +.product img { + -webkit-transition: all 0.3s; + transition: all 0.3s; } -.product .buttons .btn { - margin-bottom: 20px; + +.product:hover img { + -webkit-transform: scale(1.1); + transform: scale(1.1); } -.product:hover { - border-bottom: solid 1px #808080; - top: 0; + +.product:hover .text { + border-color: #555; } -.product:hover .buttons { - clear: both; - position: absolute; - top: 0; - background: rgba(255, 255, 255, 0.5); + +.product a { + text-transform: uppercase; + letter-spacing: 0.1em; + color: #333; + text-decoration: none !important; + margin-top: 15px; } -.product:hover .image img { - -webkit-transform: scale(1.1, 1.1); - -ms-transform: scale(1.1, 1.1); - -o-transform: scale(1.1, 1.1); - transform: scale(1.1, 1.1); + +.products-big .image { + min-height: 250px; + max-height: 250px; } + .goToDescription { - font-size: 12px; text-align: center; + font-size: 0.8rem; margin-bottom: 40px; } + .goToDescription a { - color: #999999; + color: #999; text-decoration: underline; } -#productMain { - margin-bottom: 30px; + +table tr td { + vertical-align: middle !important; +} + +#customer-orders a.btn { + margin-top: 0; +} + +#customer-orders table { + font-size: 0.9rem; +} + +#customer-orders th { + border-top: 0; +} + +#customer-order img { + width: 50px; +} + +#customer-order tfoot th { + font-size: 1.2rem; + font-weight: 300; +} + +#customer-order p { + font-size: 1.2rem; + font-weight: 300; +} + +#productMain #thumbs { + margin-top: 30px; +} + +#productMain input { + display: none; } + #productMain .sizes { text-align: center; } -#productMain .sizes h3 { - font-weight: 700; - letter-spacing: 0.08em; - text-transform: uppercase; - margin-bottom: 40px; -} + #productMain .sizes a { - display: inline-block; - width: 40px; - height: 40px; - border-radius: 40px; - background: #ccc; - line-height: 40px; - color: #555555; - text-align: center; - text-decoration: none; - font-family: "Roboto", Helvetica, Arial, sans-serif; + text-decoration: none !important; } -#productMain .sizes a.active, + #productMain .sizes a:hover { background: #986dbd; color: #fff; } -#productMain .sizes input { - display: none; -} + #productMain .price { - font-size: 40px; text-align: center; - margin-top: 40px; - margin-bottom: 40px; + font-size: 2.5rem; + margin: 30px 0; + color: #555; } -#thumbs a { - display: block; - border: solid 1px transparent; + +#basket thead th { + border-top: none; } -#thumbs a.active { - border-color: #986dbd; + +#basket tfoot th { + font-size: 1.25rem; + color: #555; } -#product-social { - text-align: center; + +#order-summary tr td { + color: #999; } -#product-social h4 { - font-weight: 300; + +#order-summary tr.total { + font-size: 1.25rem; + color: #555; + font-weight: 700; +} + +#order-summary tr.total td { + color: #555; +} + +#checkout .nav-pills { + margin-bottom: 30px; + border-bottom: 1px solid #986dbd; +} + +#checkout .nav-pills a { + font-size: 0.9rem; + border-bottom: none !important; +} + +#checkout .nav-pills a.disabled { + cursor: not-allowed; +} + +#checkout form label { + margin-bottom: 5px; +} + +#checkout .payment-method:hover, #checkout .shipping-method:hover { + cursor: pointer; +} + +@media (max-width: 767px) { + .nav-pills { + -webkit-box-orient: vertical; + -webkit-box-direction: normal; + -ms-flex-direction: column; + flex-direction: column; + } +} + +.sidebar-menu .badge { + font-weight: 700; + margin: 0; +} + +.sidebar-menu.with-icons a.nav-link { + position: relative; +} + +.sidebar-menu.with-icons a.nav-link::before { + content: '\f105'; + display: inline-block; + position: absolute; + top: 50%; + right: 15px; + -webkit-transform: translateY(-50%); + transform: translateY(-50%); + font-family: 'FontAwesome'; +} + +.panel-heading { margin-bottom: 10px; } -#product-social p { - line-height: 26px; + +.panel-heading h3 { + margin-top: 5px; } -#product-social p a { - margin: 0 10px 0 0; + +.panel-heading .btn { color: #fff; + text-decoration: none !important; +} + +.panel-heading .btn i { + margin-right: 7px; +} + +.panel-body p { + font-size: .9rem; + color: #555; +} + +.panel-body label { + font-size: 0.8rem; + font-weight: 400 !important; + color: #777; + opacity: 0.9; display: inline-block; - width: 26px; - height: 26px; - border-radius: 13px; - line-height: 26px; - font-size: 15px; - text-align: center; - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; - vertical-align: bottom; + cursor: pointer; } -#product-social p a i { - vertical-align: bottom; - line-height: 26px; + +.panel-body label input { + margin-right: 5px; } -#product-social p a.facebook { - background-color: #4460ae; + +.panel-body label:hover { + opacity: 1; } -#product-social p a.gplus { - background-color: #c21f25; + +.panel-body span.colour { + display: inline-block; + width: 14px; + height: 14px; + margin-top: 10px; + margin-left: 5px; + border: 1px solid #555; } -#product-social p a.twitter { - background-color: #3cf; + +.panel-body span.colour.white { + background: #fff; } -#product-social p a.instagram { - background-color: #cd4378; + +.panel-body span.colour.blue { + background: #007bff; } -#product-social p a.email { - background-color: #4a7f45; + +.panel-body span.colour.green { + background: #28a745; } -@media (max-width: 991px) { - #product-social { - text-align: center; - } + +.panel-body span.colour.red { + background: #dc3545; } -#checkout .nav { - margin-bottom: 20px; - border-bottom: solid 1px #986dbd; + +.panel-body span.colour.yellow { + background: #ffc107; } -#checkout .nav li { - height: 100%; + +.nav-pills .nav-link { + border-radius: 0; } -#checkout .nav li a { - display: block; - height: 100%; + +.nav-pills .nav-link:hover { + background: #eee; } -#order-summary table { - margin-top: 20px; + +.nav-pills .nav-link.active { + background: #986dbd; } -#order-summary table td { - color: #999999; + +.panel { + margin-bottom: 20px; } -#order-summary table tr.total td, -#order-summary table tr.total th { - font-size: 18px; - color: #555555; + +.category-menu a.nav-link { + text-transform: uppercase; + letter-spacing: 0.1em; font-weight: 700; } -#checkout .table tbody tr td, -#basket .table tbody tr td, -#customer-order .table tbody tr td { - vertical-align: middle; + +ul ul a.nav-link { + padding-left: 30px !important; + font-size: 0.85rem; + text-transform: none !important; + font-weight: 400 !important; + color: #777; } -#checkout .table tbody tr td input, -#basket .table tbody tr td input, -#customer-order .table tbody tr td input { - width: 50px; - text-align: right; + +.tag-cloud a { + font-size: 0.8rem; + border: 1px solid #eee; + text-transform: uppercase; + letter-spacing: 0.1em; + font-weight: 600; + padding: 5px 10px; + text-transform: uppercase; + margin: 3px 0; + text-decoration: none !important; } -#checkout .table tbody tr td img, -#basket .table tbody tr td img, -#customer-order .table tbody tr td img { - width: 50px; + +.tag-cloud a:hover { + border-color: #986dbd; } -#checkout .table tfoot, -#basket .table tfoot, -#customer-order .table tfoot { - font-size: 18px; + +.tag-cloud i { + margin-right: 5px; } -.shipping-method h4, -.payment-method h4 { + +.ribbon { + width: 80px; + height: 32px; + line-height: 32px; + background: #986dbd; + color: #fff; text-transform: uppercase; - letter-spacing: 0.08em; + letter-spacing: 0.1em; + font-weight: 700; + font-size: 0.9rem; + margin-bottom: 20px; + position: absolute; + top: 30px; + left: -15px; + text-align: center; } -#customer-orders table tr th, -#customer-orders table tr td { - vertical-align: baseline; + +.ribbon.sale { + background: #986dbd; } -#customer-order .table tfoot th { - font-size: 18px; - font-weight: 300; + +.ribbon.new { + background: #5bc0de; } -#customer-order .addresses { - text-align: right; - margin-bottom: 30px; + +.ribbon.new::after { + content: ''; + border-top: 15px solid #1f7e9a; } -#customer-order .addresses p { - font-size: 18px; - font-weight: 300; + +.ribbon.sold { + background: #f0ad4e; } -#customer-account { - margin-bottom: 30px; + +.ribbon.sold::after { + content: ''; + border-top: 15px solid #b06d0f; } -#get-it { - background: #986dbd; - padding: 50px 0 30px; - color: #fff; - text-align: center; + +.ribbon.gift { + background: #5cb85c; +} + +.ribbon.gift::after { + content: ''; + border-top: 15px solid #2d672d; +} + +.ribbon:nth-of-type(2) { + top: 82px; +} + +.ribbon::after { + content: ''; + border-top: 15px solid #6a408e; + border-left: 15px solid transparent; + border-right: 0 solid transparent; + position: absolute; + bottom: -15px; + left: 0; + display: block; } -#get-it h1, -#get-it h2, -#get-it h3, -#get-it h4, -#get-it h5, -#get-it h6 { - color: #fff; + +.badge { + font-weight: 400; text-transform: uppercase; - letter-spacing: 0.08em; - margin: 0 0 20px; + letter-spacing: 0.1em; + padding: 3px 5px; } -#get-it p { - margin: 0 0 20px; + +#map { + border-top: 1px solid #986dbd; + border-bottom: 1px solid #986dbd; + height: 300px; } -#footer { - background: #555555; + +.get-it { + background: #986dbd; + color: #fff; padding: 50px 0; - color: #999999; -} -#footer h1, -#footer h2, -#footer h3, -#footer h4, -#footer h5, -#footer h6 { - color: #eeeeee; -} -#footer h4 { - font-size: 14px; - font-weight: 800; - text-transform: uppercase; - letter-spacing: 0.08em; } -#footer ul { - padding-left: 0; - list-style: none; -} -#footer ul a { - color: #999999; + +.get-it h3 { + text-transform: uppercase; + letter-spacing: 0.1em; + margin: 0; } -#footer ul a:hover { - color: #986dbd; - text-decoration: none; + +footer.main-footer { + padding: 60px 0; + padding-bottom: 0; + background: #555; + color: #fff; } -#footer .photostream div { - float: left; - display: block; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - width: 33%; - padding: 7.5px; - overflow: hidden; + +footer.main-footer a { + color: inherit; + color: #eee; } -#footer .photostream div a { - border: solid 1 px #eeeeee; + +footer.main-footer h4 { + color: #eee; + margin: 10px 0; + text-transform: uppercase; + letter-spacing: 0.1em; } -#footer .photostream div img { - -webkit-transition: all 0.2s ease-out; - -moz-transition: all 0.2s ease-out; - transition: all 0.2s ease-out; + +footer.main-footer p { + font-size: 0.9rem; + color: #aaa; } -#footer .photostream div:hover img { - -webkit-transform: scale(1.1, 1.1); - -ms-transform: scale(1.1, 1.1); - -o-transform: scale(1.1, 1.1); - transform: scale(1.1, 1.1); + +footer.main-footer hr { + border: none; + border-top: 1px solid #ddd; + background: none; } -#footer .blog-entries .item { - clear: both; - padding: 5px 0; - margin-bottom: 10px; - border-bottom: solid 1px #555555; + +footer.main-footer .footer-blog-list li { + margin-bottom: 20px; } -#footer .blog-entries .item .image { - float: left; - width: 15%; + +footer.main-footer .image { + width: 40px; + height: 40px; margin-right: 10px; + -ms-flex-negative: 0; + flex-shrink: 0; } -#footer .blog-entries .item .name { - width: 75%; - margin-left: 10px; - display: table-cell; - vertical-align: middle; -} -#footer .blog-entries .item .name h5 { - margin: 0; + +footer.main-footer .text { text-transform: uppercase; - letter-spacing: 0.08em; - font-size: 12px; -} -#footer .blog-entries .item .name h5 a { - color: #eeeeee; -} -#footer .blog-entries .item .text { - width: 100%; - clear: both; + letter-spacing: 0.1em; } -#footer .blog-entries .item:last-child { - border-bottom: none; - margin-bottom: 0; + +footer.main-footer .text a { + font-size: 0.8rem; } -#footer .social a { - color: #555555; - font-size: 25px; - margin: 0 10px 0 0; + +footer.main-footer .photo-stream li { + margin: 0; } -#footer .social a:hover { - color: #986dbd; + +footer.main-footer .photo-stream a { + width: 80px; + height: 80px; + padding: 5px; + display: block; } -#copyright { + +footer.main-footer .copyrights { + padding: 50px 0; background: #333; color: #ccc; - padding: 50px 0; - font-size: 12px; - line-height: 28px; + margin-top: 50px; } -#copyright p { - margin: 0; + +footer.main-footer .copyrights a { + color: #986dbd; +} + +footer.main-footer .copyrights p { + color: inherit; + font-size: 0.8rem; + margin-bottom: 0; } + @media (max-width: 991px) { - #copyright p { - float: none !important; - text-align: center; - margin-bottom: 10px; + footer.main-footer .photo-stream a { + width: 120px; + height: 120px; } } -[data-animate] { - opacity: 0; - filter: alpha(opacity=0); + +@media (max-width: 767px) { + footer.main-footer .photo-stream li { + width: 32%; + margin-bottom: 10px; + } + footer.main-footer .photo-stream a { + width: 100%; + height: auto; + } } + +/* + +===================== +STYLE SWITCHER FOR DEMO +===================== + +*/ #style-switch-button { position: fixed; - top: 100px; + top: 120px; left: 0px; border-radius: 0; + z-index: 2; } + #style-switch { - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; width: 300px; padding: 20px; position: fixed; - top: 140px; + top: 160px; left: 0; background: #fff; - border: solid 1px #eeeeee; + border: solid 1px #ced4da; + z-index: 2000; } -@media (max-width: 991px) { - #style-switch-button { - display: none; - } - #style-switch { - display: none; - } + +#style-switch h4 { + color: #495057; } -/* Original Boostrap template overwrite */ -/* breadcrumbs */ -.breadcrumb { - font-family: "Roboto", Helvetica, Arial, sans-serif; - text-transform: uppercase; - background-color: none; - letter-spacing: 0.08em; + +/* + * 1. NAVBAR + */ +.navbar { + padding: 0.5rem 1rem; } -/* nav */ -.nav > li > a { - padding: 10px 15px; + +.navbar-brand { + display: inline-block; + padding-top: 0.3125rem; + padding-bottom: 0.3125rem; + margin-right: 1rem; + font-size: 1.25rem; +} + +.navbar-toggler { + padding: 0.25rem 0.75rem; + font-size: 1.25rem; + line-height: 1; + border: 1px solid transparent; + border-radius: 0; } -.nav > li > a:hover, -.nav > li > a:focus { - background-color: #eeeeee; + +.navbar-light .navbar-brand { + color: rgba(0, 0, 0, 0.9); } -.nav > li.disabled > a { - color: #999999; + +.navbar-light .navbar-brand:focus, .navbar-light .navbar-brand:hover { + color: rgba(0, 0, 0, 0.9); } -.nav > li.disabled > a:hover, -.nav > li.disabled > a:focus { - color: #999999; + +.navbar-light .navbar-nav .nav-link { + color: rgba(0, 0, 0, 0.5); } -.nav .open > a, -.nav .open > a:hover, -.nav .open > a:focus { - background-color: #eeeeee; - border-color: #986dbd; + +.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover { + color: rgba(0, 0, 0, 0.7); } -.nav-tabs { - border-bottom: 1px solid #986dbd; + +.navbar-light .navbar-nav .nav-link.disabled { + color: rgba(0, 0, 0, 0.3); } -.nav-tabs > li { - float: left; - margin-bottom: -1px; + +.navbar-light .navbar-nav .show > .nav-link, +.navbar-light .navbar-nav .active > .nav-link, +.navbar-light .navbar-nav .nav-link.show, +.navbar-light .navbar-nav .nav-link.active { + color: rgba(0, 0, 0, 0.9); } -.nav-tabs > li > a { - margin-right: 2px; - line-height: 1.42857143; - border: 1px solid transparent; - border-radius: 0 0 0 0; + +.navbar-light .navbar-toggler { + color: rgba(0, 0, 0, 0.5); + border-color: rgba(0, 0, 0, 0.1); } -.nav-tabs > li > a:hover { - border-color: #eeeeee #eeeeee #986dbd; + +.navbar-light .navbar-toggler-icon { + background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 0, 0, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); } -.nav-tabs > li.active > a, -.nav-tabs > li.active > a:hover, -.nav-tabs > li.active > a:focus { - color: #555555; - background-color: #ffffff; - border: 1px solid #986dbd; - border-bottom-color: transparent; - cursor: default; + +.navbar-light .navbar-text { + color: rgba(0, 0, 0, 0.5); } -.nav-tabs.nav-justified { - width: 100%; - border-bottom: solid 1px #986dbd; - border-bottom: 0; + +.navbar-dark .navbar-brand { + color: #fff; } -.nav-tabs.nav-justified > li { - float: none; + +.navbar-dark .navbar-brand:focus, .navbar-dark .navbar-brand:hover { + color: #fff; } -.nav-tabs.nav-justified > li > a { - text-align: center; - /*margin-bottom: 5px;*/ + +.navbar-dark .navbar-nav .nav-link { + color: rgba(255, 255, 255, 0.5); } -.nav-tabs.nav-justified > .dropdown .dropdown-menu { - top: auto; - left: auto; + +.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover { + color: rgba(255, 255, 255, 0.75); } -.nav-tabs.nav-justified > li > a { - margin-right: 0; - border-radius: 0; + +.navbar-dark .navbar-nav .nav-link.disabled { + color: rgba(255, 255, 255, 0.25); } -.nav-tabs.nav-justified > .active > a, -.nav-tabs.nav-justified > .active > a:hover, -.nav-tabs.nav-justified > .active > a:focus { - border: 1px solid #986dbd; + +.navbar-dark .navbar-nav .show > .nav-link, +.navbar-dark .navbar-nav .active > .nav-link, +.navbar-dark .navbar-nav .nav-link.show, +.navbar-dark .navbar-nav .nav-link.active { + color: #fff; } -@media (min-width: 768px) { - .nav-tabs.nav-justified > li > a { - border-bottom: 1px solid #986dbd; - border-radius: 0 0 0 0; - } - .nav-tabs.nav-justified > .active > a, - .nav-tabs.nav-justified > .active > a:hover, - .nav-tabs.nav-justified > .active > a:focus { - border-bottom-color: #ffffff; - } + +.navbar-dark .navbar-toggler { + color: rgba(255, 255, 255, 0.5); + border-color: rgba(255, 255, 255, 0.1); } -.nav-pills > li { - float: left; + +.navbar-dark .navbar-toggler-icon { + background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E"); } -.nav-pills > li > a { + +.navbar-dark .navbar-text { + color: rgba(255, 255, 255, 0.5); +} + +/* + * 2. BUTTONS + */ +.btn { + font-weight: 700; + border: 1px solid transparent; + padding: 0.5rem 0.75rem; + font-size: 0.8rem; + line-height: 1.5; border-radius: 0; + -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out; } -.nav-pills > li + li { - margin-left: 2px; + +.btn:focus, .btn.focus { + outline: 0; + -webkit-box-shadow: 0 0 0 0.2rem rgba(152, 109, 189, 0.25); + box-shadow: 0 0 0 0.2rem rgba(152, 109, 189, 0.25); +} + +.btn.disabled, .btn:disabled { + opacity: .65; +} + +.btn:not([disabled]):not(.disabled):active, .btn:not([disabled]):not(.disabled).active { + background-image: none; } -.nav-pills > li.active > a, -.nav-pills > li.active > a:hover, -.nav-pills > li.active > a:focus { - color: #ffffff; + +.btn-primary { + color: color-yiq(#986dbd); background-color: #986dbd; + border-color: #986dbd; } -.nav-stacked > li { - float: none; + +.btn-primary:hover { + color: color-yiq(#8553b1); + background-color: #7f4daa; + border-color: #7f4daa; } -.nav-stacked > li + li { - margin-top: 2px; - margin-left: 0; + +.btn-primary:focus, .btn-primary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(152, 109, 189, 0.5); + box-shadow: 0 0 0 0.2rem rgba(152, 109, 189, 0.5); } -.nav-justified { - width: 100%; - border-bottom: solid 1px #986dbd; + +.btn-primary.disabled, .btn-primary:disabled { + color: color-yiq(#986dbd); + background-color: #986dbd; + border-color: #986dbd; } -.nav-justified > li { - float: none; + +.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active, +.show > .btn-primary.dropdown-toggle { + color: color-yiq(#7f4daa); + background-color: #7f4daa; + border-color: #7849a1; +} + +.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, +.show > .btn-primary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(152, 109, 189, 0.5); + box-shadow: 0 0 0 0.2rem rgba(152, 109, 189, 0.5); +} + +.btn-secondary { + color: color-yiq(#868e96); + background-color: #868e96; + border-color: #868e96; +} + +.btn-secondary:hover { + color: color-yiq(#727b84); + background-color: #6c757d; + border-color: #6c757d; +} + +.btn-secondary:focus, .btn-secondary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); +} + +.btn-secondary.disabled, .btn-secondary:disabled { + color: color-yiq(#868e96); + background-color: #868e96; + border-color: #868e96; +} + +.btn-secondary:not(:disabled):not(.disabled):active, .btn-secondary:not(:disabled):not(.disabled).active, +.show > .btn-secondary.dropdown-toggle { + color: color-yiq(#6c757d); + background-color: #6c757d; + border-color: #666e76; +} + +.btn-secondary:not(:disabled):not(.disabled):active:focus, .btn-secondary:not(:disabled):not(.disabled).active:focus, +.show > .btn-secondary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); +} + +.btn-success { + color: color-yiq(#28a745); + background-color: #28a745; + border-color: #28a745; +} + +.btn-success:hover { + color: color-yiq(#218838); + background-color: #1e7e34; + border-color: #1e7e34; +} + +.btn-success:focus, .btn-success.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); +} + +.btn-success.disabled, .btn-success:disabled { + color: color-yiq(#28a745); + background-color: #28a745; + border-color: #28a745; +} + +.btn-success:not(:disabled):not(.disabled):active, .btn-success:not(:disabled):not(.disabled).active, +.show > .btn-success.dropdown-toggle { + color: color-yiq(#1e7e34); + background-color: #1e7e34; + border-color: #1c7430; +} + +.btn-success:not(:disabled):not(.disabled):active:focus, .btn-success:not(:disabled):not(.disabled).active:focus, +.show > .btn-success.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); +} + +.btn-info { + color: color-yiq(#17a2b8); + background-color: #17a2b8; + border-color: #17a2b8; +} + +.btn-info:hover { + color: color-yiq(#138496); + background-color: #117a8b; + border-color: #117a8b; +} + +.btn-info:focus, .btn-info.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); +} + +.btn-info.disabled, .btn-info:disabled { + color: color-yiq(#17a2b8); + background-color: #17a2b8; + border-color: #17a2b8; +} + +.btn-info:not(:disabled):not(.disabled):active, .btn-info:not(:disabled):not(.disabled).active, +.show > .btn-info.dropdown-toggle { + color: color-yiq(#117a8b); + background-color: #117a8b; + border-color: #10707f; +} + +.btn-info:not(:disabled):not(.disabled):active:focus, .btn-info:not(:disabled):not(.disabled).active:focus, +.show > .btn-info.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); +} + +.btn-warning { + color: color-yiq(#ffc107); + background-color: #ffc107; + border-color: #ffc107; +} + +.btn-warning:hover { + color: color-yiq(#e0a800); + background-color: #d39e00; + border-color: #d39e00; +} + +.btn-warning:focus, .btn-warning.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-warning.disabled, .btn-warning:disabled { + color: color-yiq(#ffc107); + background-color: #ffc107; + border-color: #ffc107; +} + +.btn-warning:not(:disabled):not(.disabled):active, .btn-warning:not(:disabled):not(.disabled).active, +.show > .btn-warning.dropdown-toggle { + color: color-yiq(#d39e00); + background-color: #d39e00; + border-color: #c69500; +} + +.btn-warning:not(:disabled):not(.disabled):active:focus, .btn-warning:not(:disabled):not(.disabled).active:focus, +.show > .btn-warning.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-danger { + color: color-yiq(#dc3545); + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-danger:hover { + color: color-yiq(#c82333); + background-color: #bd2130; + border-color: #bd2130; +} + +.btn-danger:focus, .btn-danger.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-danger.disabled, .btn-danger:disabled { + color: color-yiq(#dc3545); + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-danger:not(:disabled):not(.disabled):active, .btn-danger:not(:disabled):not(.disabled).active, +.show > .btn-danger.dropdown-toggle { + color: color-yiq(#bd2130); + background-color: #bd2130; + border-color: #b21f2d; +} + +.btn-danger:not(:disabled):not(.disabled):active:focus, .btn-danger:not(:disabled):not(.disabled).active:focus, +.show > .btn-danger.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-light { + color: color-yiq(#f8f9fa); + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-light:hover { + color: color-yiq(#e2e6ea); + background-color: #dae0e5; + border-color: #dae0e5; +} + +.btn-light:focus, .btn-light.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-light.disabled, .btn-light:disabled { + color: color-yiq(#f8f9fa); + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-light:not(:disabled):not(.disabled):active, .btn-light:not(:disabled):not(.disabled).active, +.show > .btn-light.dropdown-toggle { + color: color-yiq(#dae0e5); + background-color: #dae0e5; + border-color: #d3d9df; +} + +.btn-light:not(:disabled):not(.disabled):active:focus, .btn-light:not(:disabled):not(.disabled).active:focus, +.show > .btn-light.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-dark { + color: color-yiq(#343a40); + background-color: #343a40; + border-color: #343a40; +} + +.btn-dark:hover { + color: color-yiq(#23272b); + background-color: #1d2124; + border-color: #1d2124; +} + +.btn-dark:focus, .btn-dark.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-dark.disabled, .btn-dark:disabled { + color: color-yiq(#343a40); + background-color: #343a40; + border-color: #343a40; +} + +.btn-dark:not(:disabled):not(.disabled):active, .btn-dark:not(:disabled):not(.disabled).active, +.show > .btn-dark.dropdown-toggle { + color: color-yiq(#1d2124); + background-color: #1d2124; + border-color: #171a1d; +} + +.btn-dark:not(:disabled):not(.disabled):active:focus, .btn-dark:not(:disabled):not(.disabled).active:focus, +.show > .btn-dark.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-default { + color: color-yiq(#ced4da); + background-color: #ced4da; + border-color: #ced4da; +} + +.btn-default:hover { + color: color-yiq(#b8c1ca); + background-color: #b1bbc4; + border-color: #b1bbc4; +} + +.btn-default:focus, .btn-default.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); + box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); +} + +.btn-default.disabled, .btn-default:disabled { + color: color-yiq(#ced4da); + background-color: #ced4da; + border-color: #ced4da; +} + +.btn-default:not(:disabled):not(.disabled):active, .btn-default:not(:disabled):not(.disabled).active, +.show > .btn-default.dropdown-toggle { + color: color-yiq(#b1bbc4); + background-color: #b1bbc4; + border-color: #aab4bf; +} + +.btn-default:not(:disabled):not(.disabled):active:focus, .btn-default:not(:disabled):not(.disabled).active:focus, +.show > .btn-default.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); + box-shadow: 0 0 0 0.2rem rgba(206, 212, 218, 0.5); +} + +.btn-outline-primary { + color: #986dbd; + background-color: transparent; + background-image: none; + border-color: #986dbd; } -.nav-justified > li > a { - text-align: center; - /*margin-bottom: 5px;*/ + +.btn-outline-primary:hover { + color: #fff; + background-color: #986dbd; + border-color: #986dbd; } -.nav-justified > .dropdown .dropdown-menu { - top: auto; - left: auto; + +.btn-outline-primary:focus, .btn-outline-primary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(152, 109, 189, 0.5); + box-shadow: 0 0 0 0.2rem rgba(152, 109, 189, 0.5); } -.nav-tabs-justified { - border-bottom: 0; + +.btn-outline-primary.disabled, .btn-outline-primary:disabled { + color: #986dbd; + background-color: transparent; } -.nav-tabs-justified > li > a { - margin-right: 0; - border-radius: 0; + +.btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active, +.show > .btn-outline-primary.dropdown-toggle { + color: color-yiq(#986dbd); + background-color: #986dbd; + border-color: #986dbd; } -.nav-tabs-justified > .active > a, -.nav-tabs-justified > .active > a:hover, -.nav-tabs-justified > .active > a:focus { - border: 1px solid #986dbd; + +.btn-outline-primary:not(:disabled):not(.disabled):active:focus, .btn-outline-primary:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-primary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(152, 109, 189, 0.5); + box-shadow: 0 0 0 0.2rem rgba(152, 109, 189, 0.5); } -@media (min-width: 768px) { - .nav-tabs-justified > li > a { - border-bottom: 1px solid #986dbd; - border-radius: 0 0 0 0; - } - .nav-tabs-justified > .active > a, - .nav-tabs-justified > .active > a:hover, - .nav-tabs-justified > .active > a:focus { - border-bottom-color: #ffffff; - } + +.btn-outline-secondary { + color: #868e96; + background-color: transparent; + background-image: none; + border-color: #868e96; } -.tab-content { - padding: 15px; - border: solid 1px #ddd; - border-top: none; + +.btn-outline-secondary:hover { + color: #fff; + background-color: #868e96; + border-color: #868e96; } -/* navbar */ -.navbar { - position: relative; - min-height: 62px; - margin-bottom: 0; - border-bottom: 1px solid transparent; + +.btn-outline-secondary:focus, .btn-outline-secondary.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); } -@media (min-width: 768px) { - .navbar { - border-radius: 0px; - } + +.btn-outline-secondary.disabled, .btn-outline-secondary:disabled { + color: #868e96; + background-color: transparent; } -@media (min-width: 768px) { - .navbar-header { - float: left; - } + +.btn-outline-secondary:not(:disabled):not(.disabled):active, .btn-outline-secondary:not(:disabled):not(.disabled).active, +.show > .btn-outline-secondary.dropdown-toggle { + color: color-yiq(#868e96); + background-color: #868e96; + border-color: #868e96; +} + +.btn-outline-secondary:not(:disabled):not(.disabled):active:focus, .btn-outline-secondary:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-secondary.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); + box-shadow: 0 0 0 0.2rem rgba(134, 142, 150, 0.5); +} + +.btn-outline-success { + color: #28a745; + background-color: transparent; + background-image: none; + border-color: #28a745; } -.navbar-collapse { - overflow-x: visible; - padding-right: 15px; - padding-left: 15px; + +.btn-outline-success:hover { + color: #fff; + background-color: #28a745; + border-color: #28a745; } -.navbar-collapse.in { - overflow-y: auto; + +.btn-outline-success:focus, .btn-outline-success.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); } -@media (min-width: 768px) { - .navbar-collapse { - width: auto; - border-top: 0; - box-shadow: none; - } - .navbar-collapse.collapse { - display: block !important; - height: auto !important; - padding-bottom: 0; - overflow: visible !important; - } - .navbar-collapse.in { - overflow-y: visible; - } - .navbar-fixed-top .navbar-collapse, - .navbar-static-top .navbar-collapse, - .navbar-fixed-bottom .navbar-collapse { - padding-left: 0; - padding-right: 0; - } + +.btn-outline-success.disabled, .btn-outline-success:disabled { + color: #28a745; + background-color: transparent; } -.navbar-fixed-top .navbar-collapse, -.navbar-affixed-top .navbar-collapse, -.navbar-fixed-bottom .navbar-collapse { - max-height: 340px; + +.btn-outline-success:not(:disabled):not(.disabled):active, .btn-outline-success:not(:disabled):not(.disabled).active, +.show > .btn-outline-success.dropdown-toggle { + color: color-yiq(#28a745); + background-color: #28a745; + border-color: #28a745; +} + +.btn-outline-success:not(:disabled):not(.disabled):active:focus, .btn-outline-success:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-success.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5); +} + +.btn-outline-info { + color: #17a2b8; + background-color: transparent; + background-image: none; + border-color: #17a2b8; } -@media (max-width: 480px) and (orientation: landscape) { - .navbar-fixed-top .navbar-collapse, - .navbar-affixed-top .navbar-collapse, - .navbar-fixed-bottom .navbar-collapse { - max-height: 200px; - } + +.btn-outline-info:hover { + color: #fff; + background-color: #17a2b8; + border-color: #17a2b8; } -.container > .navbar-header, -.container-fluid > .navbar-header, -.container > .navbar-collapse, -.container-fluid > .navbar-collapse { - margin-right: -15px; - margin-left: -15px; -} -@media (min-width: 768px) { - .container > .navbar-header, - .container-fluid > .navbar-header, - .container > .navbar-collapse, - .container-fluid > .navbar-collapse { - margin-right: 0; - margin-left: 0; - } + +.btn-outline-info:focus, .btn-outline-info.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); } -.navbar-static-top { - z-index: 1000; - border-width: 0 0 1px; + +.btn-outline-info.disabled, .btn-outline-info:disabled { + color: #17a2b8; + background-color: transparent; } -@media (min-width: 768px) { - .navbar-static-top { - border-radius: 0; - } + +.btn-outline-info:not(:disabled):not(.disabled):active, .btn-outline-info:not(:disabled):not(.disabled).active, +.show > .btn-outline-info.dropdown-toggle { + color: color-yiq(#17a2b8); + background-color: #17a2b8; + border-color: #17a2b8; +} + +.btn-outline-info:not(:disabled):not(.disabled):active:focus, .btn-outline-info:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-info.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); + box-shadow: 0 0 0 0.2rem rgba(23, 162, 184, 0.5); +} + +.btn-outline-warning { + color: #ffc107; + background-color: transparent; + background-image: none; + border-color: #ffc107; } -.navbar-fixed-top, -.navbar-fixed-bottom { - position: fixed; - right: 0; - left: 0; - z-index: 1030; - -webkit-transform: translate3d(0, 0, 0); - transform: translate3d(0, 0, 0); -} -@media (min-width: 768px) { - .navbar-fixed-top, - .navbar-fixed-bottom { - border-radius: 0; - } + +.btn-outline-warning:hover { + color: #fff; + background-color: #ffc107; + border-color: #ffc107; } -.navbar-fixed-top { - top: 0; - border-width: 0 0 1px; + +.btn-outline-warning:focus, .btn-outline-warning.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); } -.navbar-fixed-bottom { - bottom: 0; - margin-bottom: 0; - border-width: 1px 0 0; + +.btn-outline-warning.disabled, .btn-outline-warning:disabled { + color: #ffc107; + background-color: transparent; } -.navbar-brand { - float: left; - padding: 10px 15px; - font-size: 18px; - line-height: 20px; - height: 62px; + +.btn-outline-warning:not(:disabled):not(.disabled):active, .btn-outline-warning:not(:disabled):not(.disabled).active, +.show > .btn-outline-warning.dropdown-toggle { + color: color-yiq(#ffc107); + background-color: #ffc107; + border-color: #ffc107; +} + +.btn-outline-warning:not(:disabled):not(.disabled):active:focus, .btn-outline-warning:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-warning.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); + box-shadow: 0 0 0 0.2rem rgba(255, 193, 7, 0.5); +} + +.btn-outline-danger { + color: #dc3545; + background-color: transparent; + background-image: none; + border-color: #dc3545; } -.navbar-brand:hover, -.navbar-brand:focus { - text-decoration: none; + +.btn-outline-danger:hover { + color: #fff; + background-color: #dc3545; + border-color: #dc3545; } -@media (min-width: 768px) { - .navbar > .container .navbar-brand, - .navbar > .container-fluid .navbar-brand { - margin-left: -15px; - } + +.btn-outline-danger:focus, .btn-outline-danger.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); } -.navbar-toggle { - position: relative; - float: right; - margin-right: 15px; - padding: 9px 10px; - margin-top: 14px; - margin-bottom: 14px; + +.btn-outline-danger.disabled, .btn-outline-danger:disabled { + color: #dc3545; + background-color: transparent; +} + +.btn-outline-danger:not(:disabled):not(.disabled):active, .btn-outline-danger:not(:disabled):not(.disabled).active, +.show > .btn-outline-danger.dropdown-toggle { + color: color-yiq(#dc3545); + background-color: #dc3545; + border-color: #dc3545; +} + +.btn-outline-danger:not(:disabled):not(.disabled):active:focus, .btn-outline-danger:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-danger.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); + box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5); +} + +.btn-outline-light { + color: #f8f9fa; background-color: transparent; background-image: none; - border: 1px solid transparent; + border-color: #f8f9fa; +} + +.btn-outline-light:hover { + color: #fff; + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-outline-light:focus, .btn-outline-light.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-outline-light.disabled, .btn-outline-light:disabled { + color: #f8f9fa; + background-color: transparent; +} + +.btn-outline-light:not(:disabled):not(.disabled):active, .btn-outline-light:not(:disabled):not(.disabled).active, +.show > .btn-outline-light.dropdown-toggle { + color: color-yiq(#f8f9fa); + background-color: #f8f9fa; + border-color: #f8f9fa; +} + +.btn-outline-light:not(:disabled):not(.disabled):active:focus, .btn-outline-light:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-light.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); + box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5); +} + +.btn-outline-dark { + color: #343a40; + background-color: transparent; + background-image: none; + border-color: #343a40; +} + +.btn-outline-dark:hover { + color: #fff; + background-color: #343a40; + border-color: #343a40; +} + +.btn-outline-dark:focus, .btn-outline-dark.focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-outline-dark.disabled, .btn-outline-dark:disabled { + color: #343a40; + background-color: transparent; +} + +.btn-outline-dark:not(:disabled):not(.disabled):active, .btn-outline-dark:not(:disabled):not(.disabled).active, +.show > .btn-outline-dark.dropdown-toggle { + color: color-yiq(#343a40); + background-color: #343a40; + border-color: #343a40; +} + +.btn-outline-dark:not(:disabled):not(.disabled):active:focus, .btn-outline-dark:not(:disabled):not(.disabled).active:focus, +.show > .btn-outline-dark.dropdown-toggle:focus { + -webkit-box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); + box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5); +} + +.btn-lg { + padding: 0.5rem 1rem; + font-size: 1.25rem; + line-height: 1.5; + border-radius: 0; +} + +.btn-sm { + padding: 0.25rem 0.5rem; + font-size: 0.7rem; + line-height: 1.5; border-radius: 0; } -.navbar-toggle:focus { - outline: 0; + +/* + * 3. TYPE + */ +body { + font-family: "Roboto", Helvetica, Arial, sans-serif; + font-size: 1rem; + font-weight: 400; + line-height: 1.5; + color: #212529; + background-color: #fff; +} + +a { + color: #986dbd; + text-decoration: none; +} + +a:focus, a:hover { + color: #724599; + text-decoration: underline; +} + +h1, +h2, +h3, +h4, +h5, +h6, +.h1, +.h2, +.h3, +.h4, +.h5, +.h6 { + margin-bottom: 1rem; + font-family: inherit; + font-weight: 700; + line-height: 1.1; + color: inherit; +} + +h1, +.h1 { + font-size: 2.2rem; +} + +h2, +.h2 { + font-size: 1.8rem; +} + +h3, +.h3 { + font-size: 1.5rem; +} + +h4, +.h4 { + font-size: 1.1rem; +} + +h5, +.h5 { + font-size: 1rem; +} + +h6, +.h6 { + font-size: 0.8rem; +} + +.lead { + font-size: 1.25rem; + font-weight: 300; +} + +.display-1 { + font-size: 6rem; + font-weight: 300; + line-height: 1.1; +} + +.display-2 { + font-size: 5.5rem; + font-weight: 300; + line-height: 1.1; } -.navbar-nav { - margin: 10.5px -15px; + +.display-3 { + font-size: 4.5rem; + font-weight: 300; + line-height: 1.1; } -.navbar-nav > li > a { - padding-top: 10px; - padding-bottom: 10px; - line-height: 20px; + +.display-4 { + font-size: 3.5rem; + font-weight: 300; + line-height: 1.1; } -@media (max-width: 767px) { - .navbar-nav .open .dropdown-menu > li > a, - .navbar-nav .open .dropdown-menu .dropdown-header { - padding: 5px 15px 5px 25px; - } - .navbar-nav .open .dropdown-menu > li > a { - line-height: 20px; - } - .navbar-nav .open .dropdown-menu > li > a:hover, - .navbar-nav .open .dropdown-menu > li > a:focus { - background-image: none; - } + +hr { + border-top: 1px solid rgba(0, 0, 0, 0.1); } -@media (min-width: 768px) { - .navbar-nav { - float: left; - margin: 0; - } - .navbar-nav > li { - float: left; - } - .navbar-nav > li > a { - padding-top: 21px; - padding-bottom: 21px; - } - .navbar-nav.navbar-right:last-child { - margin-right: -15px; - } + +small, +.small { + font-size: 80%; + font-weight: 400; } -@media (min-width: 768px) { - .navbar-left { - float: left !important; - } - .navbar-right { - float: right !important; - } + +mark, +.mark { + padding: 0.2em; + background-color: #fcf8e3; +} + +.blockquote { + padding: 0.5rem 1rem; + margin-bottom: 2rem; + font-size: 1rem; + border-left: 5px solid #986dbd; } -.navbar-form { - margin-left: -15px; - margin-right: -15px; - padding: 10px 15px; - border-top: 1px solid transparent; - border-bottom: 1px solid transparent; - -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); - box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); - margin-top: 14px; - margin-bottom: 14px; + +.blockquote-footer { + color: #868e96; } -@media (max-width: 767px) { - .navbar-form .form-group { - margin-bottom: 5px; - } + +.blockquote-footer::before { + content: "\2014 \00A0"; } -@media (min-width: 768px) { - .navbar-form { - width: auto; - border: 0; - margin-left: 0; - margin-right: 0; - padding-top: 0; - padding-bottom: 0; - -webkit-box-shadow: none; - box-shadow: none; - } - .navbar-form.navbar-right:last-child { - margin-right: -15px; - } + +.text-primary { + color: #986dbd !important; } -.navbar-nav > li > .dropdown-menu { - margin-top: 0; - border-top-right-radius: 0; - border-top-left-radius: 0; + +a.text-primary:focus, a.text-primary:hover { + color: #7f4daa !important; } -.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu { - border-bottom-right-radius: 0; + +/* + * 4. PAGINATION + */ +.page-item:first-child .page-link { + border-top-left-radius: 0; border-bottom-left-radius: 0; } -.navbar-btn { - margin-top: 14px; - margin-bottom: 14px; + +.page-item:last-child .page-link { + border-top-right-radius: 0; + border-bottom-right-radius: 0; } -.navbar-btn.btn-sm { - margin-top: 16px; - margin-bottom: 16px; + +.page-item.active .page-link { + color: #fff; + background-color: #986dbd; + border-color: #986dbd; } -.navbar-btn.btn-xs { - margin-top: 20px; - margin-bottom: 20px; + +.page-item.disabled .page-link { + color: #868e96; + background-color: #fff; + border-color: #dee2e6; } -.navbar-text { - margin-top: 21px; - margin-bottom: 21px; + +.page-link { + padding: 0.5rem 0.75rem; + line-height: 1.25; + color: #986dbd; + background-color: #fff; + border: 1px solid #dee2e6; } -@media (min-width: 768px) { - .navbar-text { - float: left; - margin-left: 15px; - margin-right: 15px; - } - .navbar-text.navbar-right:last-child { - margin-right: 0; - } + +.page-link:focus, .page-link:hover { + color: #724599; + text-decoration: none; + background-color: #e9ecef; + border-color: #dee2e6; + outline: 0; } -.navbar-default { - background-color: #ffffff; - border-color: #cccccc; - border-bottom: none; + +.pagination-lg .page-link { + padding: 0.75rem 1.5rem; + font-size: 1.25rem; + line-height: 1.5; } -.navbar-default .navbar-brand { - color: #555555; + +.pagination-lg .page-item:first-child .page-link { + border-top-left-radius: 0; + border-bottom-left-radius: 0; } -.navbar-default .navbar-brand:hover, -.navbar-default .navbar-brand:focus { - color: #3b3b3b; - background-color: transparent; + +.pagination-lg .page-item:last-child .page-link { + border-top-right-radius: 0; + border-bottom-right-radius: 0; } -.navbar-default .navbar-text { - color: #777777; + +.pagination-sm .page-link { + padding: 0.25rem 0.5rem; + font-size: 0.7rem; + line-height: 1.5; } -.navbar-default .navbar-nav > li > a { - color: #555555; + +.pagination-sm .page-item:first-child .page-link { + border-top-left-radius: 0; + border-bottom-left-radius: 0; } -.navbar-default .navbar-nav > li > a:hover, -.navbar-default .navbar-nav > li > a:focus { - color: #555555; - background-color: #cab3dd; + +.pagination-sm .page-item:last-child .page-link { + border-top-right-radius: 0; + border-bottom-right-radius: 0; } -.navbar-default .navbar-nav > .active > a, -.navbar-default .navbar-nav > .active > a:hover, -.navbar-default .navbar-nav > .active > a:focus { - color: #ffffff; - background-color: #986dbd; + +/* +* 5. DROPDOWNS +*/ +.dropdown-menu { + z-index: 1000; + min-width: 10rem; + padding: 0.5rem 0; + margin: 0.125rem 0 0; + font-size: 1rem; + color: #212529; + background-color: #fff; + border: 1px solid rgba(0, 0, 0, 0.15); + border-radius: 0; } -.navbar-default .navbar-nav > .disabled > a, -.navbar-default .navbar-nav > .disabled > a:hover, -.navbar-default .navbar-nav > .disabled > a:focus { - color: #cccccc; - background-color: transparent; + +.dropdown-item { + padding: 0.25rem 1.5rem; + color: #212529; } -.navbar-default .navbar-toggle { - border-color: #dddddd; + +.dropdown-item:focus, .dropdown-item:hover { + color: #16181b; + background-color: #f8f9fa; } -.navbar-default .navbar-toggle:hover, -.navbar-default .navbar-toggle:focus { + +.dropdown-item.active, .dropdown-item:active { + color: #fff; background-color: #986dbd; } -.navbar-default .navbar-toggle .icon-bar { - background-color: #888888; + +.dropdown-item.disabled, .dropdown-item:disabled { + color: #868e96; } -.navbar-default .navbar-collapse, -.navbar-default .navbar-form { - border-color: #cccccc; + +.dropdown-header { + padding: 0.5rem 1.5rem; + font-size: 0.7rem; + color: #868e96; } -.navbar-default .navbar-nav > .open > a, -.navbar-default .navbar-nav > .open > a:hover, -.navbar-default .navbar-nav > .open > a:focus { - background-color: #986dbd; - color: #ffffff; + +/* +* 6. UTILITIES +*/ +.bg-primary { + background-color: #986dbd !important; } -@media (max-width: 767px) { - .navbar-default .navbar-nav .open .dropdown-menu > li > a { - color: #555555; - } - .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, - .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus { - color: #986dbd; - } - .navbar-default .navbar-nav .open .dropdown-menu > .active > a, - .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, - .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus { - color: #ffffff; - background-color: #986dbd; - } - .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a, - .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover, - .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus { - color: #cccccc; - background-color: transparent; - } + +a.bg-primary:focus, a.bg-primary:hover { + background-color: #7f4daa !important; } -.navbar-default .navbar-link { - color: #555555; + +.bg-secondary { + background-color: #868e96 !important; } -.navbar-default .navbar-link:hover { - color: #555555; + +a.bg-secondary:focus, a.bg-secondary:hover { + background-color: #6c757d !important; } -.navbar-default .btn-link { - color: #555555; + +.bg-success { + background-color: #28a745 !important; } -.navbar-default .btn-link:hover, -.navbar-default .btn-link:focus { - color: #555555; + +a.bg-success:focus, a.bg-success:hover { + background-color: #1e7e34 !important; } -.navbar-default .btn-link[disabled]:hover, -fieldset[disabled] .navbar-default .btn-link:hover, -.navbar-default .btn-link[disabled]:focus, -fieldset[disabled] .navbar-default .btn-link:focus { - color: #cccccc; + +.bg-info { + background-color: #17a2b8 !important; } -/* scaffolding */ -body { - font-family: "Roboto", Helvetica, Arial, sans-serif; - font-size: 14px; - line-height: 1.42857143; - color: #555555; + +a.bg-info:focus, a.bg-info:hover { + background-color: #117a8b !important; } -a { - color: #986dbd; - text-decoration: none; + +.bg-warning { + background-color: #ffc107 !important; } -a:hover, -a:focus { - color: #724599; - text-decoration: underline; + +a.bg-warning:focus, a.bg-warning:hover { + background-color: #d39e00 !important; } -a:focus { - outline: thin dotted; - outline: 5px auto -webkit-focus-ring-color; - outline-offset: -2px; + +.bg-danger { + background-color: #dc3545 !important; } -.img-rounded { - border-radius: 0; + +a.bg-danger:focus, a.bg-danger:hover { + background-color: #bd2130 !important; } -hr { - margin-top: 20px; - margin-bottom: 20px; - border: 0; - border-top: 1px solid #eeeeee; + +.bg-light { + background-color: #f8f9fa !important; } -/* breadcrumbs */ -.breadcrumb { - padding: 20px 0; - margin-bottom: 20px; - background-color: transparent; - border-radius: 0; - text-align: right; + +a.bg-light:focus, a.bg-light:hover { + background-color: #dae0e5 !important; } -.breadcrumb > li + li:before { - content: ">\00a0"; - color: #555555; + +.bg-dark { + background-color: #343a40 !important; } -.breadcrumb > .active { - color: #999999; + +a.bg-dark:focus, a.bg-dark:hover { + background-color: #1d2124 !important; } -@media (max-width: 991px) { - .breadcrumb { - padding: 20px 0; - text-align: center; - } + +.border-primary { + border-color: #986dbd !important; } -/* dropdowns */ -.dropdown-menu { - z-index: 1000; - font-size: 14px; - background-color: #ffffff; - border: 1px solid #cccccc; - border: 1px solid rgba(0, 0, 0, 0.15); - border-radius: 0; - -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); - box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175); + +.border-secondary { + border-color: #868e96 !important; } -.dropdown-menu.pull-right { - right: 0; - left: auto; + +.border-success { + border-color: #28a745 !important; } -.dropdown-menu .divider { - height: 1px; - margin: 9px 0; - overflow: hidden; - background-color: #e5e5e5; + +.border-info { + border-color: #17a2b8 !important; } -.dropdown-menu > li > a { - padding: 5px 20px; - line-height: 1.42857143; - color: #333333; - white-space: nowrap; + +.border-warning { + border-color: #ffc107 !important; } -/* labels */ -.label { - font-family: "Roboto", Helvetica, Arial, sans-serif; - font-weight: normal; - text-transform: uppercase; - letter-spacing: 0.08em; + +.border-danger { + border-color: #dc3545 !important; } -/* forms.less */ -label { - font-weight: normal; + +.border-light { + border-color: #f8f9fa !important; } -.form-control { - -webkit-box-shadow: none; - box-shadow: none; - border-radius: 0; + +.border-dark { + border-color: #343a40 !important; } -.form-control:focus { - border-color: #986dbd; - outline: 0; - -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(152, 109, 189, 0.6); - box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(152, 109, 189, 0.6); + +.text-primary { + color: #986dbd !important; } -.form-group { - margin-bottom: 20px; + +a.text-primary:focus, a.text-primary:hover { + color: #7f4daa !important; } -/* pager*/ -.pager { - margin: 20px 0; - border-top: solid 1px #eeeeee; - padding-top: 20px; - text-transform: uppercase; - letter-spacing: 0.08em; - font-family: "Roboto", Helvetica, Arial, sans-serif; + +.text-secondary { + color: #868e96 !important; } -.pager li { - display: inline; + +a.text-secondary:focus, a.text-secondary:hover { + color: #6c757d !important; } -.pager li > a, -.pager li > span { - background-color: #ffffff; - border: 1px solid #986dbd; - border-radius: 0; + +.text-success { + color: #28a745 !important; } -.pager li > a:hover, -.pager li > a:focus { - text-decoration: none; - color: #fff; - background-color: #986dbd; + +a.text-success:focus, a.text-success:hover { + color: #1e7e34 !important; } -.pager .disabled > a, -.pager .disabled > a:hover, -.pager .disabled > a:focus, -.pager .disabled > span { - color: #999999; - background-color: #ffffff; - border-color: #ddd; + +.text-info { + color: #17a2b8 !important; } -/* pagination */ -.pagination { - margin: 20px 0; - font-family: "Roboto", Helvetica, Arial, sans-serif; - border-radius: 0; + +a.text-info:focus, a.text-info:hover { + color: #117a8b !important; } -.pagination > li > a, -.pagination > li > span { - padding: 6px 12px; - line-height: 1.42857143; - text-decoration: none; - color: #986dbd; - background-color: #ffffff; - border: 1px solid #dddddd; + +.text-warning { + color: #ffc107 !important; } -.pagination > li > a:hover, -.pagination > li > span:hover, -.pagination > li > a:focus, -.pagination > li > span:focus { - color: #986dbd; - background-color: #e2d6ed; - border-color: #dddddd; -} -.pagination > .active > a, -.pagination > .active > span, -.pagination > .active > a:hover, -.pagination > .active > span:hover, -.pagination > .active > a:focus, -.pagination > .active > span:focus { - z-index: 2; - color: #ffffff; - background-color: #986dbd; - border-color: #986dbd; + +a.text-warning:focus, a.text-warning:hover { + color: #d39e00 !important; } -.pagination > .disabled > span, -.pagination > .disabled > span:hover, -.pagination > .disabled > span:focus, -.pagination > .disabled > a, -.pagination > .disabled > a:hover, -.pagination > .disabled > a:focus { - color: #999999; - background-color: #ffffff; - border-color: #dddddd; -} -/* responsive utilities */ -@media (max-width: 767px) { - .text-center-xs { - text-align: center !important; - } - .text-center-xs img { - display: block; - margin-left: auto; - margin-right: auto; - } + +.text-danger { + color: #dc3545 !important; } -@media (min-width: 768px) and (max-width: 991px) { - .text-center-sm { - text-align: center !important; - } - .text-center-sm img { - display: block; - margin-left: auto; - margin-right: auto; - } + +a.text-danger:focus, a.text-danger:hover { + color: #bd2130 !important; } -/* type */ -h1, -h2, -h3, -h4, -h5, -h6, -.h1, -.h2, -.h3, -.h4, -.h5, -.h6 { - font-family: "Roboto", Helvetica, Arial, sans-serif; - font-weight: 900; - line-height: 1.1; - color: #333333; + +.text-light { + color: #f8f9fa !important; } -h1, -.h1, -h2, -.h2, -h3, -.h3 { - margin-top: 20px; - margin-bottom: 20px; + +a.text-light:focus, a.text-light:hover { + color: #dae0e5 !important; } -p { - margin: 0 0 10px; + +.text-dark { + color: #343a40 !important; } -.lead { - margin-bottom: 20px; - font-size: 18px; + +a.text-dark:focus, a.text-dark:hover { + color: #1d2124 !important; } -@media (min-width: 768px) { - .lead { - font-size: 21px; - } + +.badge-primary { + color: #fff; + background-color: #986dbd; } -.text-small { - font-size: 12px; + +.badge-primary[href]:focus, .badge-primary[href]:hover { + color: #fff; + text-decoration: none; + background-color: #7f4daa; } -.text-large { - font-size: 18px; + +.badge-secondary { + color: #fff; + background-color: #868e96; } -.text-italic { - font-style: italic; + +.badge-secondary[href]:focus, .badge-secondary[href]:hover { + color: #fff; + text-decoration: none; + background-color: #6c757d; } -.text-primary { - color: #986dbd; + +.badge-success { + color: #fff; + background-color: #28a745; } -a.text-primary:hover { - color: #7f4daa; + +.badge-success[href]:focus, .badge-success[href]:hover { + color: #fff; + text-decoration: none; + background-color: #1e7e34; } -.bg-primary { + +.badge-info { color: #fff; - background-color: #986dbd; + background-color: #17a2b8; } -a.bg-primary:hover { - background-color: #7f4daa; + +.badge-info[href]:focus, .badge-info[href]:hover { + color: #fff; + text-decoration: none; + background-color: #117a8b; } -abbr[title], -abbr[data-original-title] { - border-bottom: 1px dotted #999999; + +.badge-warning { + color: #111; + background-color: #ffc107; } -blockquote { - padding: 10px 20px; - margin: 0 0 20px; - font-size: 14px; - border-left: 5px solid #986dbd; + +.badge-warning[href]:focus, .badge-warning[href]:hover { + color: #111; + text-decoration: none; + background-color: #d39e00; } -blockquote footer, -blockquote small, -blockquote .small { - display: block; - font-size: 80%; - line-height: 1.42857143; - color: #999999; + +.badge-danger { + color: #fff; + background-color: #dc3545; } -blockquote footer:before, -blockquote small:before, -blockquote .small:before { - content: '\2014 \00A0'; + +.badge-danger[href]:focus, .badge-danger[href]:hover { + color: #fff; + text-decoration: none; + background-color: #bd2130; } -.blockquote-reverse, -blockquote.pull-right { - border-right: 5px solid #986dbd; + +.badge-light { + color: #111; + background-color: #f8f9fa; } -address { - margin-bottom: 20px; - line-height: 1.42857143; + +.badge-light[href]:focus, .badge-light[href]:hover { + color: #111; + text-decoration: none; + background-color: #dae0e5; } -.panel { - margin-bottom: 20px; - background-color: #ffffff; - border: 1px solid transparent; + +.badge-dark { + color: #fff; + background-color: #343a40; +} + +.badge-dark[href]:focus, .badge-dark[href]:hover { + color: #fff; + text-decoration: none; + background-color: #1d2124; +} + +/* +* 7.CODE +*/ +code { + font-size: 87.5%; + color: #e83e8c; border-radius: 0; - -webkit-box-shadow: 0 0 0; - box-shadow: 0 0 0; } -.panel-heading { - border-top-right-radius: 0; + +a > code { + padding: 0; + color: inherit; + background-color: inherit; +} + +/* +* 8. NAV +*/ +.nav-link { + padding: 0.5rem 1rem; +} + +.nav-link.disabled { + color: #868e96; +} + +.nav-tabs .nav-item { + margin-bottom: -1px; +} + +.nav-tabs .nav-link { + border: 1px solid transparent; border-top-left-radius: 0; - text-transform: uppercase; - letter-spacing: 0.08em; - padding: 15px 15px; + border-top-right-radius: 0; } -.progress { - overflow: hidden; - height: 20px; - margin-bottom: 20px; - background-color: #f5f5f5; - border-radius: 0; - -webkit-box-shadow: none; - box-shadow: none; + +.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover { + border-color: #e9ecef #e9ecef #dee2e6; } -.panel-group { - margin-bottom: 20px; + +.nav-tabs .nav-link.disabled { + color: #868e96; } -.panel-group .panel { - margin-bottom: 0; + +.nav-tabs .nav-link.active, +.nav-tabs .nav-item.show .nav-link { + color: #495057; + background-color: #fff; +} + +.nav-tabs .dropdown-menu { + margin-top: -1px; +} + +.nav-pills .nav-link { border-radius: 0; - overflow: hidden; } -.panel-group .panel + .panel { - margin-top: 5px; + +.nav-pills .nav-link.active, +.nav-pills .show > .nav-link { + color: #fff; + background-color: #986dbd; } -.panel-group.accordion .panel { - border-color: #ccc; + +/* +* 9. CARD +*/ +.card { + background-color: #fff; + border: 1px solid rgba(0, 0, 0, 0.125); + border-radius: 0; } -.panel-primary { - border-color: #986dbd; + +.card > .list-group:first-child .list-group-item:first-child { + border-top-left-radius: 0; + border-top-right-radius: 0; } -.panel-primary > .panel-heading { - color: #ffffff; - background-color: #986dbd; - border-color: #986dbd; + +.card > .list-group:last-child .list-group-item:last-child { + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; } -.panel-primary > .panel-heading + .panel-collapse > .panel-body { - border-top-color: #986dbd; + +.card-body { + padding: 1.25rem; } -.panel-primary > .panel-heading .badge { - color: #986dbd; - background-color: #ffffff; + +.card-title { + margin-bottom: 0.75rem; } -.panel-primary > .panel-footer + .panel-collapse > .panel-body { - border-bottom-color: #986dbd; + +.card-subtitle { + margin-top: -0.375rem; } -.panel-primary .panel-title { - font-weight: 300; + +.card-link + .card-link { + margin-left: 1.25rem; } -.panel-primary .panel-title a:hover { - color: #fff; - text-decoration: none; + +.card-header { + padding: 0.75rem 1.25rem; + background-color: rgba(0, 0, 0, 0.03); + border-bottom: 1px solid rgba(0, 0, 0, 0.125); } -a.badge:hover, -a.badge:focus { - color: #ffffff; - text-decoration: none; - cursor: pointer; + +.card-header:first-child { + border-radius: calc(0 - 1px) calc(0 - 1px) 0 0; } -a.list-group-item.active > .badge, -.nav-pills > .active > a > .badge { - color: #986dbd; - background-color: #ffffff; + +.card-header-transparent { + background-color: rgba(0, 0, 0, 0.3); + border-bottom: none; } -.nav-pills > li > a > .badge { - margin-left: 3px; + +.card-footer { + padding: 0.75rem 1.25rem; + background-color: #f8f9fa; + border-top: 1px solid rgba(0, 0, 0, 0.125); +} + +.card-footer:last-child { + border-radius: 0 0 calc(0 - 1px) calc(0 - 1px); +} + +.card-header-tabs { + margin-right: -0.625rem; + margin-bottom: -0.75rem; + margin-left: -0.625rem; + border-bottom: 0; } -.progress-bar-primary { - background-color: #986dbd; + +.card-header-pills { + margin-right: -0.625rem; + margin-left: -0.625rem; } -.progress-striped .progress-bar-primary { - background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); - background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); - background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent); + +.card-img-overlay { + padding: 1.25rem; } -/*! - * Yamm!3 - Yet another megamenu for Bootstrap 3 - * http://geedmo.github.com/yamm3 - * - * @geedmo - Licensed under the MIT license - */ -.yamm .nav, -.yamm .collapse, -.yamm .dropup.use-yamm, -.yamm .dropdown.use-yamm { - position: static; + +.card-img-overlay-opacity { + background: rgba(0, 0, 0, 0.2); } -.yamm .container { - position: relative; + +.card-img { + border-radius: calc(0 - 1px); } -.yamm .dropdown-menu { - left: auto; + +.card-img-top { + border-top-left-radius: calc(0 - 1px); + border-top-right-radius: calc(0 - 1px); } -.yamm .nav.navbar-right .dropdown-menu { - left: auto; - right: 0; + +.card-img-bottom { + border-bottom-right-radius: calc(0 - 1px); + border-bottom-left-radius: calc(0 - 1px); } -.yamm .yamm-content { - padding: 20px 30px; + +.card-deck .card { + margin-bottom: 15px; } -.yamm .dropdown.yamm-fw .dropdown-menu { - left: 15px; - right: 15px; + +@media (min-width: 576px) { + .card-deck { + margin-right: -15px; + margin-left: -15px; + } + .card-deck .card { + margin-right: 15px; + margin-left: 15px; + } } diff --git a/static/js/front.js b/static/js/front.js index 7944bd0af..58bed7093 100644 --- a/static/js/front.js +++ b/static/js/front.js @@ -1,385 +1,241 @@ -/* global $this: true */ -/* eslint no-unused-vars: ["error", { "varsIgnorePattern": "animationsSlider" }] */ +$(function () { -if ($.cookie('themeCSSpath')) { - $('link#theme-stylesheet').attr('href', $.cookie('themeCSSpath')) -} -if ($.cookie('themeLayout')) { - $('body').addClass($.cookie('themeLayout')) -} -$(function () { - sliderHomepage() - sliders() - fullScreenContainer() - productDetailGallery(4000) - menuSliding() - productDetailSizes() - utils() - animations() - counters() - demo() - contactFormAjax() -}) - -// Ajax contact -function contactFormAjax () { - var form = $('.contact-form-ajax') - if (typeof form === 'undefined') return false - form.submit(function () { - $this = $(this) - $.post($(this).attr('action'), - $this.serialize(), - function () { - $this[0].reset() // clear form - - $('#contact-message') - .html('') - .fadeIn() - } - , 'json') - return false - }) -} - -/* for demo purpose only - can be deleted */ -function demo () { - if ($.cookie('themeCSSpath')) { - $('link#theme-stylesheet').attr('href', $.cookie('themeCSSpath')) - } - - $('#colour').change(function () { - if ($(this).val() !== '') { - var themeCSSpath = 'css/style.' + $(this).val() + '.css' - - $('link#theme-stylesheet').attr('href', themeCSSpath) - - $.cookie('themeCSSpath', themeCSSpath, {expires: 365, path: '/'}) - } - return false - }) + // ------------------------------------------------------- // + // Navbar Sticky + // ------------------------------------------------------ // + $(window).on('scroll', function () { + if ($(window).scrollTop() > ($('.top-bar').outerHeight())) { + $('header.nav-holder.make-sticky').addClass('sticky'); + $('body').css('padding-top', '' + $('#navbar').outerHeight() + 'px'); - $('#layout').change(function () { - if ($(this).val() !== '') { - var themeLayout = $(this).val() + } else { + $('header.nav-holder.make-sticky').removeClass('sticky'); + $('body').css('padding-top', '0'); + } + }); - $('body').removeClass('wide') - $('body').removeClass('boxed') + // ------------------------------------------------------- // + // Multi-level dropdown + // ------------------------------------------------------ // - $('body').addClass(themeLayout) + $("ul.dropdown-menu [data-toggle='dropdown']").on("click", function (event) { + event.preventDefault(); + event.stopPropagation(); - $.cookie('themeLayout', themeLayout, {expires: 365, path: '/'}) - } + $(this).siblings().toggleClass("show"); - return false - }) -} - -/* slider homepage */ -function sliderHomepage () { - if ($('#slider').length) { - // var owl = $('#slider') - - $('#slider').owlCarousel({ - autoPlay: 3000, - items: 4, - itemsDesktopSmall: [900, 3], - itemsTablet: [600, 3], - itemsMobile: [500, 2] - }) - } -} - -/* sliders */ -function sliders () { - if ($('.owl-carousel').length) { - $('.customers').owlCarousel({ - items: 6, - itemsDesktopSmall: [990, 4], - itemsTablet: [768, 2], - itemsMobile: [480, 1] - }) - - $('.testimonials').owlCarousel({ - items: 4, - itemsDesktopSmall: [990, 3], - itemsTablet: [768, 2], - itemsMobile: [480, 1] - }) - $('.project').owlCarousel({ - navigation: true, // Show next and prev buttons - navigationText: ['', ''], - slideSpeed: 300, - paginationSpeed: 400, - autoPlay: true, - stopOnHover: true, - singleItem: true, - afterInit: '', - lazyLoad: true - }) + if (!$(this).next().hasClass('show')) { + $(this).parents('.dropdown-menu').first().find('.show').removeClass("show"); + } + $(this).parents('li.nav-item.dropdown.show').on('hidden.bs.dropdown', function (e) { + $('.dropdown-submenu .show').removeClass("show"); + }); + + }); + + // ------------------------------------------------------- // + // Scroll To + // ------------------------------------------------------ // + $('.scroll-to').on('click', function (e) { + + e.preventDefault(); + var full_url = this.href; + var parts = full_url.split("#"); + var target = parts[1]; + + if ($('header.nav-holder').hasClass('sticky')) { + var offset = -80; + } else { + var offset = -180; + } - $('.homepage').owlCarousel({ - navigation: false, // Show next and prev buttons - navigationText: ['', ''], - slideSpeed: 2000, - paginationSpeed: 1000, - autoPlay: true, - stopOnHover: true, - singleItem: true, - lazyLoad: false, - addClassActive: true, - afterInit: function () { - // animationsSlider() - }, - afterMove: function () { - // animationsSlider() - } - }) - } -} - -/* menu sliding */ -function menuSliding () { - $('.dropdown').on('show.bs.dropdown', function () { - if ($(window).width() > 750) { - $(this).find('.dropdown-menu').first().stop(true, true).slideDown() - } else { - $(this).find('.dropdown-menu').first().stop(true, true).show() - } - }) + var offset = $('header.nav-holder').outerHeight(); - $('.dropdown').on('hide.bs.dropdown', function () { - if ($(window).width() > 750) { - $(this).find('.dropdown-menu').first().stop(true, true).slideUp() - } else { - $(this).find('.dropdown-menu').first().stop(true, true).hide() - } - }) -} - -/* animations */ -function animations () { - var delayTime = 0 - $('[data-animate]').css({opacity: '0'}) - $('[data-animate]').waypoint(function () { - delayTime += 150 - $(this).delay(delayTime).queue(function (next) { - $(this).toggleClass('animated') - $(this).toggleClass($(this).data('animate')) - delayTime = 0 - next() - // $(this).removeClass('animated') - // $(this).toggleClass($(this).data('animate')) - }) - }, { - offset: '90%', - triggerOnce: true - }) - - $('[data-animate-hover]').hover(function () { - $(this).css({opacity: 1}) - $(this).addClass('animated') - $(this).removeClass($(this).data('animate')) - $(this).addClass($(this).data('animate-hover')) - }, function () { - $(this).removeClass('animated') - $(this).removeClass($(this).data('animate-hover')) - }) -} - -function animationsSlider () { - var delayTimeSlider = 400 - - $('.owl-item:not(.active) [data-animate-always]').each(function () { - $(this).removeClass('animated') - $(this).removeClass($(this).data('animate-always')) - $(this).stop(true, true, true).css({opacity: 0}) - }) - - $('.owl-item.active [data-animate-always]').each(function () { - delayTimeSlider += 500 - - $(this).delay(delayTimeSlider).queue(function () { - $(this).addClass('animated') - $(this).addClass($(this).data('animate-always')) - - console.log($(this).data('animate-always')) - }) - }) -} - -/* counters */ -function counters () { - $('.counter').counterUp({ - delay: 10, - time: 1000 - }) -} - -/* picture zoom */ -function pictureZoom () { - $('.product .image, .post .image, .photostream div').each(function () { - var imgHeight = $(this).find('img').height() - if (imgHeight) { - $(this).height(imgHeight) - } - }) -} - -/* full screen intro */ -function fullScreenContainer () { - var screenWidth = $(window).width() + 'px' - var screenHeight = '500px' - - if ($(window).height() > 500) { - screenHeight = $(window).height() + 'px' - } - - $('#intro, #intro .item').css({ - width: screenWidth, - height: screenHeight - }) -} - -function utils () { - /* tooltips */ - $('[data-toggle="tooltip"]').tooltip() - - /* click on the box activates the radio */ - $('#checkout').on('click', '.box.shipping-method, .box.payment-method', function () { - var radio = $(this).find(':radio') - radio.prop('checked', true) - }) - - /* click on the box activates the link in it */ - $('.box.clickable').on('click', function () { - window.location = $(this).find('a').attr('href') - }) - - /* external links in new window */ - $('.external').on('click', function (e) { - e.preventDefault() - window.open($(this).attr('href')) - }) - - /* animated scrolling */ - $('.scroll-to, .scroll-to-top').click(function (event) { - var fullUrl = this.href - var parts = fullUrl.split('#') - - if (parts.length > 1) { - scrollTo(fullUrl) - event.preventDefault() - } - }) + $('body').scrollTo($('#' + target), 800, { + offset: -offset + }); - function scrollTo (fullUrl) { - var parts = fullUrl.split('#') - var trgt = parts[1] - var targetOffset = $('#' + trgt).offset() - var targetTop = targetOffset.top - 100 + }); - if (targetTop < 0) { - targetTop = 0 - } - $('html, body').animate({ - scrollTop: targetTop - }, 1000) - } -} - -/* product detail gallery */ -function productDetailGallery (confDetailSwitch) { - $('.thumb:first').addClass('active') - var timer = setInterval(autoSwitch, confDetailSwitch) - - $('.thumb').click(function (e) { - switchImage($(this)) - clearInterval(timer) - timer = setInterval(autoSwitch, confDetailSwitch) - e.preventDefault() - }) - - $('#mainImage').hover(function () { - clearInterval(timer) - }, function () { - timer = setInterval(autoSwitch, confDetailSwitch) - }) - - function autoSwitch () { - var nextThumb = $('.thumb.active').closest('div').next('div').find('.thumb') - if (nextThumb.length === 0) { - nextThumb = $('.thumb:first') - } - switchImage(nextThumb) - } - - function switchImage (thumb) { - $('.thumb').removeClass('active') - var bigUrl = thumb.attr('href') - thumb.addClass('active') - $('#mainImage img').attr('src', bigUrl) - } -} - -/* product detail sizes */ -function productDetailSizes () { - $('.sizes a').click(function (e) { - e.preventDefault() - $('.sizes a').removeClass('active') - $('.size-input').prop('checked', false) - $(this).addClass('active') - $(this).next('input').prop('checked', true) - }) -} - -$.fn.alignElementsSameHeight = function () { - $('.same-height-row').each(function () { - var maxHeight = 0 - var children = $(this).find('.same-height') - children.height('auto') - - if ($(window).width() > 768) { - children.each(function () { - if ($(this).innerHeight() > maxHeight) { - maxHeight = $(this).innerHeight() + // ------------------------------------------------------- // + // Tooltip Initialization + // ------------------------------------------------------ // + $('[data-toggle="tooltip"]').tooltip(); + + + // ------------------------------------------------------- // + // Product Gallery Slider + // ------------------------------------------------------ // + function productDetailGallery() { + $('a.thumb').on('click', function (e) { + e.preventDefault(); + source = $(this).attr('href'); + $('#mainImage').find('img').attr('src', source); + }); + + for (i = 0; i < 3; i++) { + setTimeout(function () { + $('a.thumb').eq(i).trigger('click'); + }, 300); } - }) - children.innerHeight(maxHeight) } - maxHeight = 0 - children = $(this).find('.same-height-always') - children.height('auto') - children.each(function () { - if ($(this).height() > maxHeight) { - maxHeight = $(this).innerHeight() - } - }) - children.innerHeight(maxHeight) - }) -} - -var windowWidth -$(function () { - windowWidth = $(window).width() - - $(this).alignElementsSameHeight() - pictureZoom() -}) - -$(window).resize(function () { - var newWindowWidth = $(window).width() - - if (windowWidth !== newWindowWidth) { - setTimeout(function () { - $(this).alignElementsSameHeight() - fullScreenContainer() - pictureZoom() - }, 205) - windowWidth = newWindowWidth - } -}) + productDetailGallery(); + + + // ------------------------------------------------------- // + // Customers Slider + // ------------------------------------------------------ // + $(".customers").owlCarousel({ + responsiveClass: true, + responsive: { + 0: { + items: 2 + }, + 600: { + items: 3 + }, + 1000: { + items: 6 + } + } + }); + + + // ------------------------------------------------------- // + // Testimonials Slider + // ------------------------------------------------------ // + $(".testimonials").owlCarousel({ + items: 4, + responsiveClass: true, + responsive: { + 0: { + items: 1 + }, + 600: { + items: 2 + }, + 1000: { + items: 4 + } + } + }); + + + // ------------------------------------------------------- // + // Homepage Slider + // ------------------------------------------------------ // + $('.homepage').owlCarousel({ + loop: true, + margin: 0, + dots: true, + nav: false, + autoplay: true, + smartSpeed: 1000, + addClassActive: true, + navText: [ + "", + "" + ], + responsiveClass: true, + responsive: { + 0: { + items: 1 + }, + 600: { + items: 1 + }, + 1000: { + items: 1, + loop: true + } + } + }); + + + // ------------------------------------------------------- // + // Adding fade effect to dropdowns + // ------------------------------------------------------ // + $('.dropdown').on('show.bs.dropdown', function () { + $(this).find('.dropdown-menu').first().stop(true, true).fadeIn(100); + }); + $('.dropdown').on('hide.bs.dropdown', function () { + $(this).find('.dropdown-menu').first().stop(true, true).fadeOut(100); + }); + + + // ------------------------------------------------------- // + // Project Caroudel + // ------------------------------------------------------ // + $('.project').owlCarousel({ + loop: true, + margin: 0, + dots: true, + nav: true, + autoplay: true, + smartSpeed: 1000, + addClassActive: true, + lazyload: true, + navText: [ + "", + "" + ], + responsiveClass: true, + responsive: { + 0: { + items: 1 + }, + 600: { + items: 1 + }, + 1000: { + items: 1, + loop: true + } + } + }); + + + // ------------------------------------------------------- // + // jQuery Counter Up + // ------------------------------------------------------ // + $('.counter').counterUp({ + delay: 10, + time: 1000 + }); + + + // ------------------------------------------------------- // + // click on the box activates the radio + // ------------------------------------------------------ // + $('#checkout').on('click', '.box.shipping-method, .box.payment-method', function (e) { + var radio = $(this).find(':radio'); + radio.prop('checked', true); + }); + + + // ------------------------------------------------------- // + // Bootstrap Select + // ------------------------------------------------------ // + $('.bs-select').selectpicker({ + style: 'btn-light', + size: 4 + }); + + + // ------------------------------------------------------- // + // Shop Detail Carousel + // ------------------------------------------------------ // + $('.shop-detail-carousel').owlCarousel({ + items: 1, + thumbs: true, + nav: false, + dots: false, + autoplay: true, + thumbsPrerendered: true + }); +}); \ No newline at end of file diff --git a/static/js/owl.carousel.min.js b/static/js/owl.carousel.min.js deleted file mode 100644 index 98ae16ecf..000000000 --- a/static/js/owl.carousel.min.js +++ /dev/null @@ -1 +0,0 @@ -eval(function(p,a,c,k,e,r){e=function(c){return(c35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('7(A 3c.3q!=="9"){3c.3q=9(e){9 t(){}t.5S=e;p 5R t}}(9(e,t,n){h r={1N:9(t,n){h r=c;r.$k=e(n);r.6=e.4M({},e.37.2B.6,r.$k.v(),t);r.2A=t;r.4L()},4L:9(){9 r(e){h n,r="";7(A t.6.33==="9"){t.6.33.R(c,[e])}l{1A(n 38 e.d){7(e.d.5M(n)){r+=e.d[n].1K}}t.$k.2y(r)}t.3t()}h t=c,n;7(A t.6.2H==="9"){t.6.2H.R(c,[t.$k])}7(A t.6.2O==="2Y"){n=t.6.2O;e.5K(n,r)}l{t.3t()}},3t:9(){h e=c;e.$k.v("d-4I",e.$k.2x("2w")).v("d-4F",e.$k.2x("H"));e.$k.z({2u:0});e.2t=e.6.q;e.4E();e.5v=0;e.1X=14;e.23()},23:9(){h e=c;7(e.$k.25().N===0){p b}e.1M();e.4C();e.$S=e.$k.25();e.E=e.$S.N;e.4B();e.$G=e.$k.17(".d-1K");e.$K=e.$k.17(".d-1p");e.3u="U";e.13=0;e.26=[0];e.m=0;e.4A();e.4z()},4z:9(){h e=c;e.2V();e.2W();e.4t();e.30();e.4r();e.4q();e.2p();e.4o();7(e.6.2o!==b){e.4n(e.6.2o)}7(e.6.O===j){e.6.O=4Q}e.19();e.$k.17(".d-1p").z("4i","4h");7(!e.$k.2m(":3n")){e.3o()}l{e.$k.z("2u",1)}e.5O=b;e.2l();7(A e.6.3s==="9"){e.6.3s.R(c,[e.$k])}},2l:9(){h e=c;7(e.6.1Z===j){e.1Z()}7(e.6.1B===j){e.1B()}e.4g();7(A e.6.3w==="9"){e.6.3w.R(c,[e.$k])}},3x:9(){h e=c;7(A e.6.3B==="9"){e.6.3B.R(c,[e.$k])}e.3o();e.2V();e.2W();e.4f();e.30();e.2l();7(A e.6.3D==="9"){e.6.3D.R(c,[e.$k])}},3F:9(){h e=c;t.1c(9(){e.3x()},0)},3o:9(){h e=c;7(e.$k.2m(":3n")===b){e.$k.z({2u:0});t.18(e.1C);t.18(e.1X)}l{p b}e.1X=t.4d(9(){7(e.$k.2m(":3n")){e.3F();e.$k.4b({2u:1},2M);t.18(e.1X)}},5x)},4B:9(){h e=c;e.$S.5n(\'\').4a(\'\');e.$k.17(".d-1p").4a(\'\');e.1H=e.$k.17(".d-1p-49");e.$k.z("4i","4h")},1M:9(){h e=c,t=e.$k.1I(e.6.1M),n=e.$k.1I(e.6.2i);7(!t){e.$k.I(e.6.1M)}7(!n){e.$k.I(e.6.2i)}},2V:9(){h t=c,n,r;7(t.6.2Z===b){p b}7(t.6.48===j){t.6.q=t.2t=1;t.6.1h=b;t.6.1s=b;t.6.1O=b;t.6.22=b;t.6.1Q=b;t.6.1R=b;p b}n=e(t.6.47).1f();7(n>(t.6.1s[0]||t.2t)){t.6.q=t.2t}7(t.6.1h!==b){t.6.1h.5g(9(e,t){p e[0]-t[0]});1A(r=0;rt.E&&t.6.46===j){t.6.q=t.E}},4r:9(){h n=c,r,i;7(n.6.2Z!==j){p b}i=e(t).1f();n.3d=9(){7(e(t).1f()!==i){7(n.6.O!==b){t.18(n.1C)}t.5d(r);r=t.1c(9(){i=e(t).1f();n.3x()},n.6.45)}};e(t).44(n.3d)},4f:9(){h e=c;e.2g(e.m);7(e.6.O!==b){e.3j()}},43:9(){h t=c,n=0,r=t.E-t.6.q;t.$G.2f(9(i){h s=e(c);s.z({1f:t.M}).v("d-1K",3p(i));7(i%t.6.q===0||i===r){7(!(i>r)){n+=1}}s.v("d-24",n)})},42:9(){h e=c,t=e.$G.N*e.M;e.$K.z({1f:t*2,T:0});e.43()},2W:9(){h e=c;e.40();e.42();e.3Z();e.3v()},40:9(){h e=c;e.M=1F.4O(e.$k.1f()/e.6.q)},3v:9(){h e=c,t=(e.E*e.M-e.6.q*e.M)*-1;7(e.6.q>e.E){e.D=0;t=0;e.3z=0}l{e.D=e.E-e.6.q;e.3z=t}p t},3Y:9(){p 0},3Z:9(){h t=c,n=0,r=0,i,s,o;t.J=[0];t.3E=[];1A(i=0;i\').5m("5l",!t.F.15).5c(t.$k)}7(t.6.1v===j){t.3T()}7(t.6.2a===j){t.3S()}},3S:9(){h t=c,n=e(\'\');t.B.1o(n);t.1u=e("",{"H":"d-1n",2y:t.6.2U[0]||""});t.1q=e("",{"H":"d-U",2y:t.6.2U[1]||""});n.1o(t.1u).1o(t.1q);n.w("2X.B 21.B",\'L[H^="d"]\',9(e){e.1l()});n.w("2n.B 28.B",\'L[H^="d"]\',9(n){n.1l();7(e(c).1I("d-U")){t.U()}l{t.1n()}})},3T:9(){h t=c;t.1k=e(\'\');t.B.1o(t.1k);t.1k.w("2n.B 28.B",".d-1j",9(n){n.1l();7(3p(e(c).v("d-1j"))!==t.m){t.1g(3p(e(c).v("d-1j")),j)}})},3P:9(){h t=c,n,r,i,s,o,u;7(t.6.1v===b){p b}t.1k.2y("");n=0;r=t.E-t.E%t.6.q;1A(s=0;s",{"H":"d-1j"});u=e("<3N>",{4R:t.6.39===j?n:"","H":t.6.39===j?"d-59":""});o.1o(u);o.v("d-1j",r===s?i:s);o.v("d-24",n);t.1k.1o(o)}}t.35()},35:9(){h t=c;7(t.6.1v===b){p b}t.1k.17(".d-1j").2f(9(){7(e(c).v("d-24")===e(t.$G[t.m]).v("d-24")){t.1k.17(".d-1j").Z("2d");e(c).I("2d")}})},3e:9(){h e=c;7(e.6.2a===b){p b}7(e.6.2e===b){7(e.m===0&&e.D===0){e.1u.I("1b");e.1q.I("1b")}l 7(e.m===0&&e.D!==0){e.1u.I("1b");e.1q.Z("1b")}l 7(e.m===e.D){e.1u.Z("1b");e.1q.I("1b")}l 7(e.m!==0&&e.m!==e.D){e.1u.Z("1b");e.1q.Z("1b")}}},30:9(){h e=c;e.3P();e.3e();7(e.B){7(e.6.q>=e.E){e.B.3K()}l{e.B.3J()}}},55:9(){h e=c;7(e.B){e.B.3k()}},U:9(e){h t=c;7(t.1E){p b}t.m+=t.6.12===j?t.6.q:1;7(t.m>t.D+(t.6.12===j?t.6.q-1:0)){7(t.6.2e===j){t.m=0;e="2k"}l{t.m=t.D;p b}}t.1g(t.m,e)},1n:9(e){h t=c;7(t.1E){p b}7(t.6.12===j&&t.m>0&&t.m=i.D){e=i.D}l 7(e<=0){e=0}i.m=i.d.m=e;7(i.6.2o!==b&&r!=="4e"&&i.6.q===1&&i.F.1x===j){i.1t(0);7(i.F.1x===j){i.1L(i.J[e])}l{i.1r(i.J[e],1)}i.2r();i.4l();p b}s=i.J[e];7(i.F.1x===j){i.1T=b;7(n===j){i.1t("1w");t.1c(9(){i.1T=j},i.6.1w)}l 7(n==="2k"){i.1t(i.6.2v);t.1c(9(){i.1T=j},i.6.2v)}l{i.1t("1m");t.1c(9(){i.1T=j},i.6.1m)}i.1L(s)}l{7(n===j){i.1r(s,i.6.1w)}l 7(n==="2k"){i.1r(s,i.6.2v)}l{i.1r(s,i.6.1m)}}i.2r()},2g:9(e){h t=c;7(A t.6.1Y==="9"){t.6.1Y.R(c,[t.$k])}7(e>=t.D||e===-1){e=t.D}l 7(e<=0){e=0}t.1t(0);7(t.F.1x===j){t.1L(t.J[e])}l{t.1r(t.J[e],1)}t.m=t.d.m=e;t.2r()},2r:9(){h e=c;e.26.2D(e.m);e.13=e.d.13=e.26[e.26.N-2];e.26.5f(0);7(e.13!==e.m){e.35();e.3e();e.2l();7(e.6.O!==b){e.3j()}}7(A e.6.3y==="9"&&e.13!==e.m){e.6.3y.R(c,[e.$k])}},X:9(){h e=c;e.3A="X";t.18(e.1C)},3j:9(){h e=c;7(e.3A!=="X"){e.19()}},19:9(){h e=c;e.3A="19";7(e.6.O===b){p b}t.18(e.1C);e.1C=t.4d(9(){e.U(j)},e.6.O)},1t:9(e){h t=c;7(e==="1m"){t.$K.z(t.2z(t.6.1m))}l 7(e==="1w"){t.$K.z(t.2z(t.6.1w))}l 7(A e!=="2Y"){t.$K.z(t.2z(e))}},2z:9(e){p{"-1G-1a":"2C "+e+"1z 2s","-1W-1a":"2C "+e+"1z 2s","-o-1a":"2C "+e+"1z 2s",1a:"2C "+e+"1z 2s"}},3H:9(){p{"-1G-1a":"","-1W-1a":"","-o-1a":"",1a:""}},3I:9(e){p{"-1G-P":"1i("+e+"V, C, C)","-1W-P":"1i("+e+"V, C, C)","-o-P":"1i("+e+"V, C, C)","-1z-P":"1i("+e+"V, C, C)",P:"1i("+e+"V, C,C)"}},1L:9(e){h t=c;t.$K.z(t.3I(e))},3L:9(e){h t=c;t.$K.z({T:e})},1r:9(e,t){h n=c;n.29=b;n.$K.X(j,j).4b({T:e},{54:t||n.6.1m,3M:9(){n.29=j}})},4E:9(){h e=c,r="1i(C, C, C)",i=n.56("L"),s,o,u,a;i.2w.3O=" -1W-P:"+r+"; -1z-P:"+r+"; -o-P:"+r+"; -1G-P:"+r+"; P:"+r;s=/1i\\(C, C, C\\)/g;o=i.2w.3O.5i(s);u=o!==14&&o.N===1;a="5z"38 t||t.5Q.4P;e.F={1x:u,15:a}},4q:9(){h e=c;7(e.6.27!==b||e.6.1U!==b){e.3Q();e.3R()}},4C:9(){h e=c,t=["s","e","x"];e.16={};7(e.6.27===j&&e.6.1U===j){t=["2X.d 21.d","2N.d 3U.d","2n.d 3V.d 28.d"]}l 7(e.6.27===b&&e.6.1U===j){t=["2X.d","2N.d","2n.d 3V.d"]}l 7(e.6.27===j&&e.6.1U===b){t=["21.d","3U.d","28.d"]}e.16.3W=t[0];e.16.2K=t[1];e.16.2J=t[2]},3R:9(){h t=c;t.$k.w("5y.d",9(e){e.1l()});t.$k.w("21.3X",9(t){p e(t.1d).2m("5C, 5E, 5F, 5N")})},3Q:9(){9 s(e){7(e.2b!==W){p{x:e.2b[0].2c,y:e.2b[0].41}}7(e.2b===W){7(e.2c!==W){p{x:e.2c,y:e.41}}7(e.2c===W){p{x:e.52,y:e.53}}}}9 o(t){7(t==="w"){e(n).w(r.16.2K,a);e(n).w(r.16.2J,f)}l 7(t==="Q"){e(n).Q(r.16.2K);e(n).Q(r.16.2J)}}9 u(n){h u=n.3h||n||t.3g,a;7(u.5a===3){p b}7(r.E<=r.6.q){p}7(r.29===b&&!r.6.3f){p b}7(r.1T===b&&!r.6.3f){p b}7(r.6.O!==b){t.18(r.1C)}7(r.F.15!==j&&!r.$K.1I("3b")){r.$K.I("3b")}r.11=0;r.Y=0;e(c).z(r.3H());a=e(c).2h();i.2S=a.T;i.2R=s(u).x-a.T;i.2P=s(u).y-a.5o;o("w");i.2j=b;i.2L=u.1d||u.4c}9 a(o){h u=o.3h||o||t.3g,a,f;r.11=s(u).x-i.2R;r.2I=s(u).y-i.2P;r.Y=r.11-i.2S;7(A r.6.2E==="9"&&i.3C!==j&&r.Y!==0){i.3C=j;r.6.2E.R(r,[r.$k])}7((r.Y>8||r.Y<-8)&&r.F.15===j){7(u.1l!==W){u.1l()}l{u.5L=b}i.2j=j}7((r.2I>10||r.2I<-10)&&i.2j===b){e(n).Q("2N.d")}a=9(){p r.Y/5};f=9(){p r.3z+r.Y/5};r.11=1F.3v(1F.3Y(r.11,a()),f());7(r.F.1x===j){r.1L(r.11)}l{r.3L(r.11)}}9 f(n){h s=n.3h||n||t.3g,u,a,f;s.1d=s.1d||s.4c;i.3C=b;7(r.F.15!==j){r.$K.Z("3b")}7(r.Y<0){r.1y=r.d.1y="T"}l{r.1y=r.d.1y="3i"}7(r.Y!==0){u=r.4j();r.1g(u,b,"4e");7(i.2L===s.1d&&r.F.15!==j){e(s.1d).w("3a.4k",9(t){t.4S();t.4T();t.1l();e(t.1d).Q("3a.4k")});a=e.4N(s.1d,"4V").3a;f=a.4W();a.4X(0,0,f)}}o("Q")}h r=c,i={2R:0,2P:0,4Y:0,2S:0,2h:14,4Z:14,50:14,2j:14,51:14,2L:14};r.29=j;r.$k.w(r.16.3W,".d-1p",u)},4j:9(){h e=c,t=e.4m();7(t>e.D){e.m=e.D;t=e.D}l 7(e.11>=0){t=0;e.m=0}p t},4m:9(){h t=c,n=t.6.12===j?t.3E:t.J,r=t.11,i=14;e.2f(n,9(s,o){7(r-t.M/20>n[s+1]&&r-t.M/20(n[s+1]||n[s]-t.M)&&t.34()==="3i"){7(t.6.12===j){i=n[s+1]||n[n.N-1];t.m=e.4p(i,t.J)}l{i=n[s+1];t.m=s+1}}});p t.m},34:9(){h e=c,t;7(e.Y<0){t="3i";e.3u="U"}l{t="T";e.3u="1n"}p t},4A:9(){h e=c;e.$k.w("d.U",9(){e.U()});e.$k.w("d.1n",9(){e.1n()});e.$k.w("d.19",9(t,n){e.6.O=n;e.19();e.32="19"});e.$k.w("d.X",9(){e.X();e.32="X"});e.$k.w("d.1g",9(t,n){e.1g(n)});e.$k.w("d.2g",9(t,n){e.2g(n)})},2p:9(){h e=c;7(e.6.2p===j&&e.F.15!==j&&e.6.O!==b){e.$k.w("57",9(){e.X()});e.$k.w("58",9(){7(e.32!=="X"){e.19()}})}},1Z:9(){h t=c,n,r,i,s,o;7(t.6.1Z===b){p b}1A(n=0;n=t.m}l{o=j}7(o&&i=n.$S.N||r===-1){n.$S.1S(-1).5X(e)}l{n.$S.1S(r).5Y(e)}n.23()},5Z:9(e){h t=c,n;7(t.$k.25().N===0){p b}7(e===W||e===-1){n=-1}l{n=e}t.1V();t.$S.1S(n).3k();t.23()}};e.37.2B=9(t){p c.2f(9(){7(e(c).v("d-1N")===j){p b}e(c).v("d-1N",j);h n=3c.3q(r);n.1N(t,c);e.v(c,"2B",n)})};e.37.2B.6={q:5,1h:b,1s:[60,4],1O:[61,3],22:[62,2],1Q:b,1R:[63,1],48:b,46:b,1m:2M,1w:64,2v:65,O:b,2p:b,2a:b,2U:["1n","U"],2e:j,12:b,1v:j,39:b,2Z:j,45:2M,47:t,1M:"d-66",2i:"d-2i",1Z:b,4v:j,4x:"4y",1B:b,2O:b,33:b,3f:j,27:j,1U:j,2F:b,2o:b,3B:b,3D:b,2H:b,3s:b,1Y:b,3y:b,3w:b,2E:b,2T:b}})(67,68,69)',62,382,'||||||options|if||function||false|this|owl||||var||true|elem|else|currentItem|||return|items|||||data|on|||css|typeof|owlControls|0px|maximumItem|itemsAmount|browser|owlItems|class|addClass|positionsInArray|owlWrapper|div|itemWidth|length|autoPlay|transform|off|apply|userItems|left|next|px|undefined|stop|newRelativeX|removeClass||newPosX|scrollPerPage|prevItem|null|isTouch|ev_types|find|clearInterval|play|transition|disabled|setTimeout|target|loaded|width|goTo|itemsCustom|translate3d|page|paginationWrapper|preventDefault|slideSpeed|prev|append|wrapper|buttonNext|css2slide|itemsDesktop|swapSpeed|buttonPrev|pagination|paginationSpeed|support3d|dragDirection|ms|for|autoHeight|autoPlayInterval|visibleItems|isTransition|Math|webkit|wrapperOuter|hasClass|src|item|transition3d|baseClass|init|itemsDesktopSmall|origin|itemsTabletSmall|itemsMobile|eq|isCss3Finish|touchDrag|unWrap|moz|checkVisible|beforeMove|lazyLoad||mousedown|itemsTablet|setVars|roundPages|children|prevArr|mouseDrag|mouseup|isCssFinish|navigation|touches|pageX|active|rewindNav|each|jumpTo|position|theme|sliding|rewind|eachMoveUpdate|is|touchend|transitionStyle|stopOnHover|100|afterGo|ease|orignalItems|opacity|rewindSpeed|style|attr|html|addCssSpeed|userOptions|owlCarousel|all|push|startDragging|addClassActive|height|beforeInit|newPosY|end|move|targetElement|200|touchmove|jsonPath|offsetY|completeImg|offsetX|relativePos|afterLazyLoad|navigationText|updateItems|calculateAll|touchstart|string|responsive|updateControls|clearTransStyle|hoverStatus|jsonSuccess|moveDirection|checkPagination|endCurrent|fn|in|paginationNumbers|click|grabbing|Object|resizer|checkNavigation|dragBeforeAnimFinish|event|originalEvent|right|checkAp|remove|get|endPrev|visible|watchVisibility|Number|create|unwrap|afterInit|logIn|playDirection|max|afterAction|updateVars|afterMove|maximumPixels|apStatus|beforeUpdate|dragging|afterUpdate|pagesInArray|reload|clearEvents|removeTransition|doTranslate|show|hide|css2move|complete|span|cssText|updatePagination|gestures|disabledEvents|buildButtons|buildPagination|mousemove|touchcancel|start|disableTextSelect|min|loops|calculateWidth|pageY|appendWrapperSizes|appendItemsSizes|resize|responsiveRefreshRate|itemsScaleUp|responsiveBaseWidth|singleItem|outer|wrap|animate|srcElement|setInterval|drag|updatePosition|onVisibleItems|block|display|getNewPosition|disable|singleItemTransition|closestItem|transitionTypes|owlStatus|inArray|moveEvents|response|continue|buildControls|loading|lazyFollow|lazyPreload|lazyEffect|fade|onStartup|customEvents|wrapItems|eventTypes|naturalWidth|checkBrowser|originalClasses|outClass|inClass|originalStyles|abs|perspective|loadContent|extend|_data|round|msMaxTouchPoints|5e3|text|stopImmediatePropagation|stopPropagation|buttons|events|pop|splice|baseElWidth|minSwipe|maxSwipe|dargging|clientX|clientY|duration|destroyControls|createElement|mouseover|mouseout|numbers|which|lazyOwl|appendTo|clearTimeout|checked|shift|sort|removeAttr|match|fadeIn|400|clickable|toggleClass|wrapAll|top|prop|tagName|DIV|background|image|url|wrapperWidth|img|500|dragstart|ontouchstart|controls|out|input|relative|textarea|select|webkitAnimationEnd|oAnimationEnd|MSAnimationEnd|animationend|getJSON|returnValue|hasOwnProperty|option|onstartup|baseElement|navigator|new|prototype|destroy|removeData|reinit|addItem|after|before|removeItem|1199|979|768|479|800|1e3|carousel|jQuery|window|document'.split('|'),0,{})) \ No newline at end of file diff --git a/static/js/owl.carousel2.thumbs.min.js b/static/js/owl.carousel2.thumbs.min.js new file mode 100644 index 000000000..5f1fafb72 --- /dev/null +++ b/static/js/owl.carousel2.thumbs.min.js @@ -0,0 +1,2 @@ +/*! owl.carousel2.thumbs - v0.1.8 | (c) 2016 @gijsroge | MIT license | https://github.com/gijsroge/OwlCarousel2-Thumbs */ +!function(a,b,c,d){"use strict";var e=function(b){this.owl=b,this._thumbcontent=[],this._identifier=0,this.owl_currentitem=this.owl.options.startPosition,this.$element=this.owl.$element,this._handlers={"prepared.owl.carousel":a.proxy(function(b){if(!b.namespace||!this.owl.options.thumbs||this.owl.options.thumbImage||this.owl.options.thumbsPrerendered||this.owl.options.thumbImage){if(b.namespace&&this.owl.options.thumbs&&this.owl.options.thumbImage){var c=a(b.content).find("img");this._thumbcontent.push(c)}}else a(b.content).find("[data-thumb]").attr("data-thumb")!==d&&this._thumbcontent.push(a(b.content).find("[data-thumb]").attr("data-thumb"))},this),"initialized.owl.carousel":a.proxy(function(a){a.namespace&&this.owl.options.thumbs&&(this.render(),this.listen(),this._identifier=this.owl.$element.data("slider-id"),this.setActive())},this),"changed.owl.carousel":a.proxy(function(a){a.namespace&&"position"===a.property.name&&this.owl.options.thumbs&&(this._identifier=this.owl.$element.data("slider-id"),this.setActive())},this)},this.owl.options=a.extend({},e.Defaults,this.owl.options),this.owl.$element.on(this._handlers)};e.Defaults={thumbs:!0,thumbImage:!1,thumbContainerClass:"owl-thumbs",thumbItemClass:"owl-thumb-item",moveThumbsInside:!1},e.prototype.listen=function(){var b=this.owl.options;b.thumbsPrerendered&&(this._thumbcontent._thumbcontainer=a("."+b.thumbContainerClass)),a(this._thumbcontent._thumbcontainer).on("click",this._thumbcontent._thumbcontainer.children(),a.proxy(function(c){this._identifier=a(c.target).closest("."+b.thumbContainerClass).data("slider-id");var d=a(c.target).parent().is(this._thumbcontent._thumbcontainer)?a(c.target).index():a(c.target).closest("."+b.thumbItemClass).index();b.thumbsPrerendered?a("[data-slider-id="+this._identifier+"]").trigger("to.owl.carousel",[d,b.dotsSpeed,!0]):this.owl.to(d,b.dotsSpeed),c.preventDefault()},this))},e.prototype.render=function(){var b=this.owl.options;b.thumbsPrerendered?(this._thumbcontent._thumbcontainer=a("."+b.thumbContainerClass),b.moveThumbsInside&&this._thumbcontent._thumbcontainer.appendTo(this.$element)):this._thumbcontent._thumbcontainer=a("
      ").addClass(b.thumbContainerClass).appendTo(this.$element);var c;if(b.thumbImage)for(c=0;c');else for(c=0;c"+this._thumbcontent[c]+"")},e.prototype.setActive=function(){this.owl_currentitem=this.owl._current-this.owl._clones.length/2,this.owl_currentitem===this.owl._items.length&&(this.owl_currentitem=0);var b=this.owl.options,c=b.thumbsPrerendered?a("."+b.thumbContainerClass+'[data-slider-id="'+this._identifier+'"]'):this._thumbcontent._thumbcontainer;c.children().filter(".active").removeClass("active"),c.children().eq(this.owl_currentitem).addClass("active")},e.prototype.destroy=function(){var a,b;for(a in this._handlers)this.owl.$element.off(a,this._handlers[a]);for(b in Object.getOwnPropertyNames(this))"function"!=typeof this[b]&&(this[b]=null)},a.fn.owlCarousel.Constructor.Plugins.Thumbs=e}(window.Zepto||window.jQuery,window,document); \ No newline at end of file diff --git a/static/js/respond.min.js b/static/js/respond.min.js deleted file mode 100644 index 835b161d4..000000000 --- a/static/js/respond.min.js +++ /dev/null @@ -1,6 +0,0 @@ -/*! Respond.js v1.4.2: min/max-width media query polyfill - * Copyright 2014 Scott Jehl - * Licensed under MIT - * http://j.mp/respondjs */ - -!function(a){"use strict";a.matchMedia=a.matchMedia||function(a){var b,c=a.documentElement,d=c.firstElementChild||c.firstChild,e=a.createElement("body"),f=a.createElement("div");return f.id="mq-test-1",f.style.cssText="position:absolute;top:-100em",e.style.background="none",e.appendChild(f),function(a){return f.innerHTML='­',c.insertBefore(e,d),b=42===f.offsetWidth,c.removeChild(e),{matches:b,media:a}}}(a.document)}(this),function(a){"use strict";function b(){v(!0)}var c={};a.respond=c,c.update=function(){};var d=[],e=function(){var b=!1;try{b=new a.XMLHttpRequest}catch(c){b=new a.ActiveXObject("Microsoft.XMLHTTP")}return function(){return b}}(),f=function(a,b){var c=e();c&&(c.open("GET",a,!0),c.onreadystatechange=function(){4!==c.readyState||200!==c.status&&304!==c.status||b(c.responseText)},4!==c.readyState&&c.send(null))},g=function(a){return a.replace(c.regex.minmaxwh,"").match(c.regex.other)};if(c.ajax=f,c.queue=d,c.unsupportedmq=g,c.regex={media:/@media[^\{]+\{([^\{\}]*\{[^\}\{]*\})+/gi,keyframes:/@(?:\-(?:o|moz|webkit)\-)?keyframes[^\{]+\{(?:[^\{\}]*\{[^\}\{]*\})+[^\}]*\}/gi,comments:/\/\*[^*]*\*+([^/][^*]*\*+)*\//gi,urls:/(url\()['"]?([^\/\)'"][^:\)'"]+)['"]?(\))/g,findStyles:/@media *([^\{]+)\{([\S\s]+?)$/,only:/(only\s+)?([a-zA-Z]+)\s?/,minw:/\(\s*min\-width\s*:\s*(\s*[0-9\.]+)(px|em)\s*\)/,maxw:/\(\s*max\-width\s*:\s*(\s*[0-9\.]+)(px|em)\s*\)/,minmaxwh:/\(\s*m(in|ax)\-(height|width)\s*:\s*(\s*[0-9\.]+)(px|em)\s*\)/gi,other:/\([^\)]*\)/g},c.mediaQueriesSupported=a.matchMedia&&null!==a.matchMedia("only all")&&a.matchMedia("only all").matches,!c.mediaQueriesSupported){var h,i,j,k=a.document,l=k.documentElement,m=[],n=[],o=[],p={},q=30,r=k.getElementsByTagName("head")[0]||l,s=k.getElementsByTagName("base")[0],t=r.getElementsByTagName("link"),u=function(){var a,b=k.createElement("div"),c=k.body,d=l.style.fontSize,e=c&&c.style.fontSize,f=!1;return b.style.cssText="position:absolute;font-size:1em;width:1em",c||(c=f=k.createElement("body"),c.style.background="none"),l.style.fontSize="100%",c.style.fontSize="100%",c.appendChild(b),f&&l.insertBefore(c,l.firstChild),a=b.offsetWidth,f?l.removeChild(c):c.removeChild(b),l.style.fontSize=d,e&&(c.style.fontSize=e),a=j=parseFloat(a)},v=function(b){var c="clientWidth",d=l[c],e="CSS1Compat"===k.compatMode&&d||k.body[c]||d,f={},g=t[t.length-1],p=(new Date).getTime();if(b&&h&&q>p-h)return a.clearTimeout(i),i=a.setTimeout(v,q),void 0;h=p;for(var s in m)if(m.hasOwnProperty(s)){var w=m[s],x=w.minw,y=w.maxw,z=null===x,A=null===y,B="em";x&&(x=parseFloat(x)*(x.indexOf(B)>-1?j||u():1)),y&&(y=parseFloat(y)*(y.indexOf(B)>-1?j||u():1)),w.hasquery&&(z&&A||!(z||e>=x)||!(A||y>=e))||(f[w.media]||(f[w.media]=[]),f[w.media].push(n[w.rules]))}for(var C in o)o.hasOwnProperty(C)&&o[C]&&o[C].parentNode===r&&r.removeChild(o[C]);o.length=0;for(var D in f)if(f.hasOwnProperty(D)){var E=k.createElement("style"),F=f[D].join("\n");E.type="text/css",E.media=D,r.insertBefore(E,g.nextSibling),E.styleSheet?E.styleSheet.cssText=F:E.appendChild(k.createTextNode(F)),o.push(E)}},w=function(a,b,d){var e=a.replace(c.regex.comments,"").replace(c.regex.keyframes,"").match(c.regex.media),f=e&&e.length||0;b=b.substring(0,b.lastIndexOf("/"));var h=function(a){return a.replace(c.regex.urls,"$1"+b+"$2$3")},i=!f&&d;b.length&&(b+="/"),i&&(f=1);for(var j=0;f>j;j++){var k,l,o,p;i?(k=d,n.push(h(a))):(k=e[j].match(c.regex.findStyles)&&RegExp.$1,n.push(RegExp.$2&&h(RegExp.$2))),o=k.split(","),p=o.length;for(var q=0;p>q;q++)l=o[q],g(l)||m.push({media:l.split("(")[0].match(c.regex.only)&&RegExp.$2||"all",rules:n.length-1,hasquery:l.indexOf("(")>-1,minw:l.match(c.regex.minw)&&parseFloat(RegExp.$1)+(RegExp.$2||""),maxw:l.match(c.regex.maxw)&&parseFloat(RegExp.$1)+(RegExp.$2||"")})}v()},x=function(){if(d.length){var b=d.shift();f(b.href,function(c){w(c,b.href,b.media),p[b.href]=!0,a.setTimeout(function(){x()},0)})}},y=function(){for(var b=0;b Date: Tue, 17 Dec 2019 17:14:24 -0500 Subject: [PATCH 2/3] Address reviewer comments. --- exampleSite/config.toml | 8 ++++---- layouts/partials/map.html | 2 +- layouts/partials/scripts.html | 8 ++++---- 3 files changed, 9 insertions(+), 9 deletions(-) diff --git a/exampleSite/config.toml b/exampleSite/config.toml index e3692d7e5..69707c82a 100644 --- a/exampleSite/config.toml +++ b/exampleSite/config.toml @@ -140,19 +140,19 @@ paginate = 10 enable = true # All carousel items are defined in their own files. You can find example items # at 'exampleSite/data/carousel'. - # For more information take a look at the README. + # For more informtion take a look at the README. [params.features] enable = true # All features are defined in their own files. You can find example items # at 'exampleSite/data/features'. - # For more information take a look at the README. + # For more informtion take a look at the README. [params.testimonials] enable = true # All testimonials are defined in their own files. You can find example items # at 'exampleSite/data/testimonials'. - # For more information take a look at the README. + # For more informtion take a look at the README. title = "Testimonials" subtitle = "We have worked with many clients and we always like to hear they come out from the cooperation happy and satisfied. Have a look what our clients said about us." @@ -168,7 +168,7 @@ paginate = 10 enable = true # All clients are defined in their own files. You can find example items # at 'exampleSite/data/clients'. - # For more information take a look at the README. + # For more informtion take a look at the README. title = "Our Clients" subtitle = "" diff --git a/layouts/partials/map.html b/layouts/partials/map.html index d684a62c0..59ea6d7e7 100644 --- a/layouts/partials/map.html +++ b/layouts/partials/map.html @@ -3,7 +3,7 @@ - - - {{ end }} {{ end }} - -
      - - - {{ if isset .Site.Params "address" }} -
      - -

      {{ i18n "contactTitle" }}

      - - {{ .Site.Params.address | safeHTML }} - - {{ i18n "contactGoTo" }} - - -
    - - -