diff options
| author | Zach van Rijn <me@zv.io> | 2021-05-24 16:43:48 -0500 |
|---|---|---|
| committer | Zach van Rijn <me@zv.io> | 2021-05-24 16:43:48 -0500 |
| commit | 0a5015eec26eeebb205e860c64b5472f1f16ab41 (patch) | |
| tree | 9a80182a815538093d757aa08bff93d39cf0093a /assets/css | |
| download | site-ng-0a5015eec26eeebb205e860c64b5472f1f16ab41.tar.gz site-ng-0a5015eec26eeebb205e860c64b5472f1f16ab41.tar.bz2 site-ng-0a5015eec26eeebb205e860c64b5472f1f16ab41.tar.xz site-ng-0a5015eec26eeebb205e860c64b5472f1f16ab41.zip | |
Initial commit. Still missing pages/content.
Diffstat (limited to 'assets/css')
47 files changed, 9317 insertions, 0 deletions
diff --git a/assets/css/.DS_Store b/assets/css/.DS_Store Binary files differnew file mode 100644 index 0000000..cf2d14b --- /dev/null +++ b/assets/css/.DS_Store diff --git a/assets/css/scss/.DS_Store b/assets/css/scss/.DS_Store Binary files differnew file mode 100644 index 0000000..9af2ff9 --- /dev/null +++ b/assets/css/scss/.DS_Store diff --git a/assets/css/scss/basic/.DS_Store b/assets/css/scss/basic/.DS_Store Binary files differnew file mode 100644 index 0000000..b0192fe --- /dev/null +++ b/assets/css/scss/basic/.DS_Store diff --git a/assets/css/scss/basic/_background.scss b/assets/css/scss/basic/_background.scss new file mode 100644 index 0000000..564497c --- /dev/null +++ b/assets/css/scss/basic/_background.scss @@ -0,0 +1,40 @@ +// +// Background Styles // +// +.bg-image { + position: relative; + background-position: center center; + background-attachment: scroll; + @include background-size(cover); + background-repeat: no-repeat; + &[class^="bg-image-gradient-"], &[class*=" bg-image-gradient-"] { + &:before { + content: ''; + position: absolute; + width: 100%; + height: 100%; + } + } + &.bg-image-gradient-top { &:before { background-image: linear-gradient(to top, $color-white, $color-white-02); } } + &.bg-image-gradient-right { &:before { background-image: linear-gradient(to right, $color-white, $color-white-02); } } + &.bg-image-gradient-bottom { &:before { background-image: linear-gradient(to bottom, $color-white, $color-white-02); } } + &.bg-image-gradient-left { &:before { background-image: linear-gradient(to left, $color-white, $color-white-02); } } + &.bg-image-gradient-black-top { &:before { background-image: linear-gradient(to top, $color-black, $color-black-02); } } + &.bg-image-gradient-black-right { &:before { background-image: linear-gradient(to right, $color-black, $color-black-02); } } + &.bg-image-gradient-black-bottom { &:before { background-image: linear-gradient(to bottom, $color-black, $color-black-02); } } + &.bg-image-gradient-black-left { &:before { background-image: linear-gradient(to left, $color-black, $color-black-02); } } +} + +.bg-video { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + z-index: -1; + video { + object-fit: cover; + width: 100%; + height: 100%; + } +}
\ No newline at end of file diff --git a/assets/css/scss/basic/_base.scss b/assets/css/scss/basic/_base.scss new file mode 100644 index 0000000..4c63bc2 --- /dev/null +++ b/assets/css/scss/basic/_base.scss @@ -0,0 +1,785 @@ +// +// Base Styles // +// +html, body { + width: 100%; + height: 100%; +} +body { + overflow-x: hidden; +} + +// +// Container, Row // +// +.container, .container-fluid { + position: relative; + padding: 0 30px; +} +.row { + margin-bottom: -30px; + div[class^="col-"]:not(.row) { + margin-bottom: 30px; + } + .form-row { + div[class^="col-"]:not(.row) { + margin-bottom: 0; + padding-right: 8px; + padding-left: 8px; + } + } +} + +// +// Column Spacing // +// +@include breakpoint-above(md) { + .col-spacing-70, + .col-spacing-60, + .col-spacing-50, + .col-spacing-40 { + .row { + &:not([class^="col-spacing-"], [class*=" col-spacing-"]) { + margin-right: -15px; + margin-bottom: -30px; + margin-left: -15px; + div[class^="col-"]:not(.row) { + margin-bottom: 30px; + padding: 0 15px; + } + } + } + } + .col-spacing-70 { + margin-right: -35px; + margin-bottom: -70px; + margin-left: -35px; + div[class^="col-"]:not(.row) { + margin-bottom: 70px; + padding: 0 35px; + } + } + .col-spacing-60 { + margin-right: -30px; + margin-bottom: -60px; + margin-left: -30px; + div[class^="col-"]:not(.row) { + margin-bottom: 60px; + padding: 0 30px; + } + } + .col-spacing-50 { + margin-right: -25px; + margin-bottom: -50px; + margin-left: -25px; + div[class^="col-"]:not(.row) { + margin-bottom: 50px; + padding: 0 25px; + } + } + .col-spacing-40 { + margin-right: -20px; + margin-bottom: -40px; + margin-left: -20px; + div[class^="col-"]:not(.row) { + margin-bottom: 40px; + padding: 0 20px; + } + } + .container-fluid { + .col-spacing-70 { + margin-right: 5px; + margin-left: 5px; + } + .col-spacing-60 { + margin-right: 0; + margin-left: 0; + } + .col-spacing-50 { + margin-right: -5px; + margin-left: -5px; + } + .col-spacing-40 { + margin-right: -10px; + margin-left: -10px; + } + } +} + +.col-spacing-20, +.col-spacing-10, +.col-spacing-0 { + .row { + margin-right: -15px; + margin-bottom: -30px; + margin-left: -15px; + div[class^="col-"]:not(.row) { + margin-bottom: 30px; + padding: 0 15px; + } + } +} +.col-spacing-20 { + margin-right: -10px; + margin-bottom: -20px; + margin-left: -10px; + div[class^="col-"]:not(.row) { + margin-bottom: 20px; + padding: 0 10px; + } +} +.col-spacing-10 { + margin-right: -5px; + margin-bottom: -10px; + margin-left: -5px; + div[class^="col-"]:not(.row) { + margin-bottom: 10px; + padding: 0 5px; + } +} +.col-spacing-0 { + margin-right: 0; + margin-bottom: 0; + margin-left: 0; + div[class^="col-"]:not(.row) { + margin-bottom: 0; + padding: 0; + } +} +.container-fluid { + .col-spacing-20 { + margin-right: -20px; + margin-left: -20px; + } + .col-spacing-10 { + margin-right: -25px; + margin-left: -25px; + } + .col-spacing-0 { + margin-right: -30px; + margin-left: -30px; + } +} + + +// +// Positioning // +// +.position-center { + position: absolute; + top: 50%; + left: 50%; + @include transform(translate(-50%,-50%)); +} +.position-middle { + position: relative; + top: 50%; + @include transform(translateY(-50%)); + margin: 0 auto; +} +.position-top, .position-bottom { + position: absolute; + left: 0; + width: 100%; +} +.position-top { + top: 30px; +} +.position-bottom { + bottom: 30px; +} +.container, .container-fluid { + .position-top, .position-bottom { + padding: 0 30px; + } +} + +// +// Mark // +// +mark { + background: $bg-grey; + color: $color-dark; +} + +// +// iframe // +// +iframe { + width: 100%; + border: 0; +} + +// +// Pre(Preformatted text) // +// +pre { + border: 1px solid $color-black-01; + border-radius: 0.375em; + padding: 6px 20px; + color: $color-primary; +} +div[class^='bg-black'], div[class*=' bg-black'], div[class^='bg-dark'], div[class*=' bg-dark'] { + pre { + border-color: $color-white-02; + color: $color-white-06; + } +} + +// +// Badge Styles // +// +.badge { padding: 4px 6px; vertical-align: middle; } +.badge-xs { padding: 4px 6px } +.badge-sm { padding: 8px 12px } +.badge-md { padding: 10px 16px; font-size: 80%; } +.badge-lg { padding: 14px 20px; font-size: 90%; } +.badge-xl { padding: 18px 30px; font-size: 100%; } + +// +// Blockquote Styles // +// +.blockquote { + background: $bg-grey-lighter; + margin-bottom: 20px; + border-left: 4px solid $color-black-01; + padding: 24px 30px; + @include breakpoint-less(sm) { + padding: 16px 20px; + } + p { + font-size: 16px; + line-height: 30px; + &.font-small { + font-size: 14px; + line-height: 26px; + } + &.font-large { + font-size: 20px; + line-height: 36px; + } + } + .blockquote-footer { + margin-top: 10px; + color: $color-dark; + &:before { + padding-right: 5px; + } + h1, h2, h3, h4, h5, h6 { + display: inline-block; + margin: 0; + } + p { + font-size: 16px; + line-height: 30px; + } + } + &.style-2 { + background: transparent; + padding: 16px 30px; + @include breakpoint-less(sm) { + padding: 16px 20px; + } + } + &.style-3 { + position: relative; + background: transparent; + border: 0; + padding: 20px 20px 20px 40px; + @include breakpoint-less(sm) { + padding: 16px 16px 16px 36px; + } + &:before { + content: '\f10d'; + position: absolute; + top: 0; + left: 0; + color: $color-black-01; + font-family: "Font Awesome 5 Free"; + font-size: 24px; + font-weight: 900; + } + } +} +div[class^='bg-black'], div[class*=' bg-black'], div[class^='bg-dark'], div[class*=' bg-dark'] { + .blockquote { + background: $color-white-01; + border-color: $color-white-02; + .blockquote-footer { + color: $color-white; + } + &.style-2 { + background: transparent; + border-color: $color-white-02; + } + &.style-3 { + background: transparent; + &:before { + color: $color-white-02; + } + } + } +} + +// +// Breadcrumb Styles // +// +.breadcrumb { + display: inline-block; + background: transparent; + margin: 0 0 -10px; + padding: 0; + .breadcrumb-item { + display: inline-block; + font: 400 13px $font-family-primary; + letter-spacing: 1px; + text-transform: uppercase; + &:before { + color: $color-black-02; + } + &.active { + color: $color-primary-lighter; + } + a { + @include transition(linear 0.1s); + } + } +} +div[class^='bg-black'], div[class*=' bg-black'], div[class^='bg-dark'], div[class*=' bg-dark'] { + .breadcrumb { + .breadcrumb-item { + &:before { + color: $color-white-03; + } + &.active { + color: $color-white-05; + } + } + } +} + +// +// Card // +// +.card { + border: 1px solid $color-black-01; +} + +// +// Dropdown Styles // +// +.dropdown, .btn-group { + .dropdown-menu { + border: 0; + border-radius: 0; + @include box-shadow(0 6px 36px -4px rgba(22,24,26,0.14)); + padding: 15px 20px; + .dropdown-item { + margin-bottom: 10px; + padding: 0; + color: $color-dark; + font: 300 15px $font-family-primary; + letter-spacing: 0; + text-transform: none; + @include transition(linear 0.1s); + &:last-child { + margin: 0; + } + &:hover, &:focus, &:active { + background: transparent; + color: $color-primary; + } + } + } +} + +// +// Modal Styles // +// +.modal { + &.fade { + .modal-dialog { + @include transition(ease-out 0.2s); + @include transform(translate(0) scale(0.98)); + } + } + &.show { + .modal-dialog { + @include transform(translate(0) scale(1.0)); + } + } + .modal-content { + @include box-shadow(0 6px 36px -4px rgba(22,24,26,0.3)); + border: 0; + .modal-header { border-bottom: 1px solid $color-black-01; } + .modal-footer { border-top: 1px solid $color-black-01; } + } +} + +// +// Nav Styles // +// +.nav { + margin: 0; + padding: 0; + .nav-item { + margin: 0 30px 0 0; + &:last-child { + margin-right: 0; + } + .nav-link { + padding: 0; + color: $color-primary; + @include transition(linear 0.1s); + h1, h2, h3, h4, h5, h6 { + margin: 0; + color: $color-primary; + @include transition(linear 0.1s); + } + &.active, &:hover { + color: $color-dark; + h1, h2, h3, h4, h5, h6 { + color: $color-dark; + } + } + &.disabled { + color: $color-primary-lighter; + } + } + } + &.nav-tabs { + border-bottom: 1px solid $border-grey; + .nav-item { + margin: 0 0 -1px; + .nav-link { + background: transparent; + padding: 10px 20px; + color: $color-primary; + &:hover { + border-color: $border-grey; + } + &.active { + border-color: $border-grey $border-grey $color-white; + color: $color-dark; + } + &.disabled { + &:hover { + border-color: transparent; + } + } + } + } + } + &.nav-pills { + .nav-item { + margin: 0; + .nav-link { + padding: 10px 20px; + } + .nav-link.active, + .show .nav-link { + background: $color-dark; + color: $color-white; + } + h1, h2, h3, h4, h5, h6 { + margin: 0; + } + } + } + &.tabs { + display: inline-block; + border: 1px solid $border-grey; + border-radius: 0.375em; + .nav-item { + display: inline-block; + margin: 0; + .nav-link { + padding: 10px 20px; + border-right: 1px solid $border-grey; + } + &:last-child { + .nav-link { + border: 0; + } + } + } + } + &.nav-custom { + .nav-item { + .nav-link { + position: relative; + overflow: visible; + &:after { + content: ''; + position: absolute; + right: 0; + bottom: -1px; + left: 0; + background: $color-dark; + height: 1px; + @include animation(button-line-out 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both); + } + &.active { + &:after { + width: 100%; + @include animation(button-line-in 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both); + } + } + } + } + } +} +div[class^='bg-black'], div[class*=' bg-black'], div[class^='bg-dark'], div[class*=' bg-dark'] { + .nav { + .nav-item { + .nav-link { + color: $color-white-08; + &.active, &:hover { + color: $color-white; + } + } + } + &.nav-tabs { + border-color: $color-white-02; + .nav-item { + .nav-link { + color: $color-white-08; + &.active, &:hover { + border-color: $color-white-02 $color-white-02 transparent; + } + &.active { + color: $color-white; + } + } + } + } + &.nav-pills { + .nav-item { + .nav-link.active, + .show .nav-link { + background: $color-white; + color: $color-dark; + } + } + } + &.tabs { + border: 1px solid $color-white-02; + .nav-item { + .nav-link { + border-right: 1px solid $color-white-02; + } + } + } + &.nav-custom { + .nav-item { + .nav-link { + &:after { background: $color-white; } + } + } + } + } +} + +// +// Pagination Styles // +// +.pagination { + margin: 0; + padding: 0; + .page-item { + margin: 0 6px 0 0; + text-align: center; + &:last-child { + margin-right: 0; + } + .page-link { + background: transparent; + min-width: 31px; + height: 31px; + border: 0; + border-radius: 20px; + padding: 0; + color: $color-primary; + font-size: 14px; + line-height: 31px; + @include transition(ease-out 0.12s); + &:hover { + background: $button-grey; + } + } + &.active { + .page-link { + background: $button-grey; + color: $color-dark; + } + } + } + &.pagination-sm { + .page-item { + .page-link { + min-width: 27px; + height: 27px; + border-radius: 20px; + padding: 0; + line-height: 27px; + } + } + } + &.pagination-lg { + .page-item { + .page-link { + min-width: 35px; + height: 35px; + border-radius: 20px; + padding: 0; + line-height: 35px; + } + } + } + // + // Pagination - Hover style 2 // + // + &.hover-style-2 { + .page-item { + .page-link { + &:hover { + background: $border-grey; + border-color: $border-grey; + } + } + &.active { + .page-link { + background: $color-dark; + border-color: $color-dark; + color: $color-white; + } + } + } + } +} +div[class^='bg-black'], div[class*=' bg-black'], div[class^='bg-dark'], div[class*=' bg-dark'] { + .pagination { + .page-item { + .page-link { + color: $color-white-07; + &:hover { + background: $color-white-01; + } + } + &.active { + .page-link { + background: $color-white-01; + color: $color-white; + } + } + } + &.hover-style-2 { + .page-item { + .page-link { + &:hover { + background: $color-white; + border-color: $color-white; + color: $color-black-09; + } + } + &.active { + .page-link { + background: $color-white; + border-color: $color-white; + color: $color-black-09; + } + } + } + } + } +} + +// +// Popover Styles // +// +.popover { + border: 0; + @include box-shadow(0 0 12px 0 rgba(0,0,0,0.08)); + .arrow { + &:before { border: 0; } + } + .popover-header { + background: transparent; + padding: 15px 20px; + font-size: 16px; + line-height: 32px; + } + .popover-body { + padding: 20px; + } +} + +// +// Table Styles // +// +.table { + td, th { border-top: 1px solid $border-grey; } + thead { + th { border-bottom: 2px solid $border-grey; } + } + + &.table-dark { + background: $bg-dark-lighter; + thead { + th { border-bottom: 2px solid $color-white-01; } + } + td, th { border-top: 1px solid $color-white-01; } + } + &.table-bordered { + td, th { border: 1px solid $border-grey; } + &.table-dark { + td, th { border: 1px solid $color-white-01; } + } + } + + .thead-dark { + th { background: $bg-dark-lighter; border-color: $color-white-01; } + } + .thead-light { + th { background: $button-grey-lighter; } + } + + .table-active { + td, th { background: $button-grey-darker; } + } + .table-secondary { + td, th { background: $button-grey; } + } + .table-light { + td, th { background: $bg-grey-lighter; } + } + .table-dark { + td, th { background: $button-grey; } + } +} + +// +// Scroll To Top button // +// +.scrolltotop { + position: fixed; + right: 20px; + bottom: 20px; + @include transform(translateY(20px)); + z-index: 992; + visibility: hidden; + opacity: 0; + @include transition(ease-out 0.12s); + &.scrolltotop-show { + @include transform(translateY(0)); + visibility: visible; + opacity: 1; + } +} + +// +// Scroll Animations Libary // +// +[data-sal] { + @include transition-duration(0.5s); +} diff --git a/assets/css/scss/basic/_form.scss b/assets/css/scss/basic/_form.scss new file mode 100644 index 0000000..d04fdc9 --- /dev/null +++ b/assets/css/scss/basic/_form.scss @@ -0,0 +1,211 @@ +// +// Form Styles // +// +.form-row { + margin-right: -8px; + margin-left: -8px; + div[class^="col-"], div[class*=" col-"], .col { + margin: 0; + padding-right: 8px; + padding-left: 8px; + } +} +input, +textarea { + background: transparent; + width: 100%; + border: 1px solid $color-black-01; + margin-bottom: 1rem; + padding: 15px 20px; + box-shadow: none; + font: 400 15px $font-family-primary; + line-height: 1.4; + @include transition(ease-out 0.16s); + &:focus, &:active { + outline: 0; + box-shadow: none; + } +} +textarea { + height: 140px; +} +input, textarea, .form-control { + color: $color-primary; + &::-webkit-input-placeholder { color: $color-primary-lighter; } + &::-moz-placeholder { color: $color-primary-lighter; } + &:-ms-placeholder { color: $color-primary-lighter; } + &::-ms-placeholder { color: $color-primary-lighter; } + &::placeholder { color: $color-primary-lighter; } + &:focus { + border-color: $color-black-02; + } +} +input { + &[type="checkbox"], + &[type="radio"] { + width: auto; + } +} +.form-control { + background: transparent; + height: auto; + border: 1px solid $color-black-01; + border-radius: 0; + padding: 15px 20px; + font: 400 15px $font-family-primary; + line-height: 1.4; + &:focus { + background: transparent; + box-shadow: none; + } + &:read-only { + background: $button-grey; + border: 0; + } + &.form-control-sm { + padding: 10px 15px; + font-size: 0.875rem; + } + &.form-control-lg { + font-size: 1.25rem; + } +} +.form-control-plaintext { + border: 0; +} +.form-check-input:disabled ~ .form-check-label { + color: $color-primary-lighter; +} +.required { + &:after { + content: '*'; + padding-left: 3px; + } +} + +// +// Select // +// +select { + margin-bottom: 16px; +} +.custom-select { + background-color: transparent; + width: auto; + min-width: 160px; + height: auto; + border-radius: 0; + padding: 15px 20px; + border-color: $color-black-01; + color: $color-primary; + font: 400 15px $font-family-primary; + line-height: 1.4; + @include transition(ease-out 0.16s); + &:focus { + border-color: $color-black-02; + outline: 0; + box-shadow: none; + } + &.custom-select-sm { + height: auto; + padding: 10px 15px; + font-size: 0.875rem; + } + &.custom-select-lg { + height: auto; + padding: 15px 20px; + font-size: 1.25rem; + } + &.select-fullwidth { + width: 100%; + } +} +// +// Form Styles 2,3,4 // +// +form.form-style-3, .form-style-3, +form.form-style-4, .form-style-4 { + input, textarea, .custom-select, .form-control { + margin-bottom: 20px; + padding: 0 0 10px; + border-top-width: 0; + border-right-width: 0; + border-bottom-width: 1px; + border-left-width: 0; + } +} +form.form-style-2, .form-style-2, +form.form-style-4, .form-style-4 { + input, textarea, .custom-select, .form-control { + &:focus { + border-color: $color-black-09; + } + } +} + +// +// Form Style 5 // +// +form.form-style-5, .form-style-5 { + input, textarea, .custom-select, .form-control { + background: $bg-grey; + border: 0; + &:focus { + background: $button-grey-lighter; + } + } +} +div[class^='bg-grey'], div[class*=' bg-grey'] { + form.form-style-5, .form-style-5 { + input, textarea, .custom-select, .form-control { + background: $color-white; + &:focus { + background: $color-white; + } + } + } +} + +// +// Forms on Dark background // +// +div[class^='bg-black'], div[class*=' bg-black'], div[class^='bg-dark'], div[class*=' bg-dark'] { + input, textarea, .form-control { + background: transparent; + border-color: $color-white-02; + color: $color-white-07; + &::-webkit-input-placeholder { color: $color-white-05; } + &::-moz-placeholder { color: $color-white-05; } + &:-ms-placeholder { color: $color-white-05; } + &::-ms-placeholder { color: $color-white-05; } + &::placeholder { color: $color-white-05; } + &:focus { + border-color: $color-white-03; + } + } + .custom-select { + background: transparent; + border-color: $color-white-02; + color: $color-white-07; + &:focus { + border-color: $color-white-03; + } + } + form.form-style-2, .form-style-2, + form.form-style-4, .form-style-4 { + input, textarea, .custom-select, .form-control { + &:focus { + border-color: $color-white; + } + } + } + form.form-style-5, .form-style-5 { + input, textarea, .custom-select, .form-control { + background: $color-white-01; + border: 0; + &:focus { + background: $color-white-02; + } + } + } +}
\ No newline at end of file diff --git a/assets/css/scss/basic/_image.scss b/assets/css/scss/basic/_image.scss new file mode 100644 index 0000000..0f8ca3d --- /dev/null +++ b/assets/css/scss/basic/_image.scss @@ -0,0 +1,46 @@ +// +// Image Styles // +// +img { + width: auto; + max-width: 100%; + height: auto; + &[class^='img-circle'], &[class*=' img-circle'] { + border-radius: 50%; + } + &.img-circle-xs { + min-width: 60px; + width: 60px; + height: 60px; + } + &.img-circle-sm { + min-width: 80px; + width: 80px; + height: 80px; + } + &.img-circle-md { + min-width: 100px; + width: 100px; + height: 100px; + } + &.img-circle-lg { + min-width: 120px; + width: 120px; + height: 120px; + } + &.img-circle-xl { + min-width: 140px; + width: 140px; + height: 140px; + } + &.img-circle-2xl { + min-width: 160px; + width: 160px; + height: 160px; + } + &.img-circle-3xl { + min-width: 180px; + width: 180px; + height: 180px; + } +}
\ No newline at end of file diff --git a/assets/css/scss/basic/_list.scss b/assets/css/scss/basic/_list.scss new file mode 100644 index 0000000..cc4b472 --- /dev/null +++ b/assets/css/scss/basic/_list.scss @@ -0,0 +1,315 @@ +// +// List styles // +// +ul { + margin: 0 0 -7px; + li { + margin: 0 0 7px; + ul, ol { + margin-top: 7px; + } + a { + @include transition(linear 0.1s); + } + } + &[class*=' list-'], &[class^='list-'] { + padding: 0; + } + &.list-unstyled, + &.list-dash, + &.list-icon { + li { + list-style-type: none; + } + } + &.list-dash { + li { + &:before { + content: '-'; + padding-right: 7px; + } + a { + &:hover { + padding-left: 2px; + } + } + ul, ol { + padding-left: 40px; + } + } + } + // + // Horizontal List // + // + &[class*=' list-inline'], &[class^='list-inline'] { + li { + display: inline-block; + } + } + &.list-inline { + margin-right: -7px; + margin-left: -7px; + li { + padding: 0 7px; + } + } + &.list-inline-sm { + margin-right: -3px; + margin-left: -3px; + li { + padding: 0 3px; + } + } + &.list-inline-lg { + margin-right: -14px; + margin-left: -14px; + li { + padding: 0 14px; + } + } + &.list-inline-dash { + li { &:after { content: '-'; } } + } + &.list-inline-slash { + li { &:after { content: '/'; } } + } + &.list-inline-vbar { + li { &:after { content: '|'; } } + } + &.list-inline-dash, + &.list-inline-slash, + &.list-inline-vbar { + li { + &:after { + padding: 0 3px 0 6px; + } + &:last-child { + &:after { + content: ''; + padding: 0; + } + } + } + } + // + // Icon List // + // + &.list-icon { + li { + position: relative; + padding-left: 24px; + &:before { + position: absolute; + top: 0; + left: 0; + font-family: "Font Awesome 5 Free"; + font-weight: 900; + } + a { + &:hover { + padding-left: 2px; + } + } + ul, ol { + padding-left: 40px; + } + } + &.list-icon-check { + li { &:before { content: "\f00c"; } } + } + &.list-icon-close { + li { &:before { content: "\f00d"; } } + } + &.list-icon-plus { + li { &:before { content: "\f067"; } } + } + &.list-icon-arrow { + li { padding-left: 16px; &:before { content: "\f105"; } } + } + &.list-icon-caret { + li { padding-left: 16px; &:before { content: "\f0da"; } } + } + &.list-icon-globe { + li { &:before { content: "\f0ac"; } } + } + &.list-icon-circle-check { + li { &:before { content: "\f058"; } } + } + &.list-icon-circle-plus { + li { &:before { content: "\f055"; } } + } + &.list-icon-circle-arrow { + li { &:before { content: "\f138"; } } + } + } +} +ol { + margin: 0 0 -7px; + li { + margin: 0 0 7px; + } + li { + ul, ol { + margin-top: 7px; + } + } + &.list-ordered { + list-style: none; + counter-reset: custom-counter; + padding-left: 0; + li { + position: relative; + padding-left: 34px; + counter-increment: custom-counter; + &::before { + content: counter(custom-counter); + } + ol { + list-style: none; + padding-left: 0; + } + } + &.style-2, + &.style-3, + &.style-4, + &.style-5 { + li { + &::before { + position: absolute; + top: 0; + left: 0; + width: 24px; + height: 24px; + border-radius: 50%; + font-size: 13px; + line-height: 24px; + text-align: center; + } + } + } + &.style-2 { + li { + &::before { + background: $color-black-01; + color: $color-black; + } + } + } + &.style-3 { + li { + &::before { + background: $color-black-09; + color: $color-white; + } + } + } + &.style-4 { + li { + &::before { + border: 1px solid $color-black-02; + color: $color-black-05; + } + } + } + &.style-5 { + li { + &::before { + border: 1px solid $color-black-09; + color: $color-black; + } + } + } + } +} +div[class^='bg-black'], div[class*=' bg-black'], div[class^='bg-dark'], div[class*=' bg-dark'] { + ol { + &.list-ordered { + &.style-2 { + li { + &::before { + background: $color-white-02; + color: $color-white; + } + } + } + &.style-3 { + li { + &::before { + background: $color-white; + color: $color-black; + } + } + } + &.style-4 { + li { + &::before { + border-color: $color-white-03; + color: $color-white-06; + } + } + } + &.style-5 { + li { + &::before { + border-color: $color-white; + color: $color-white; + } + } + } + } + } +} +@include breakpoint-less(md) { + ol { + margin: 0 0 -5px; + li { + margin: 0 0 5px; + } + } + ul { + margin: 0 0 -5px; + li { + margin: 0 0 5px; + ul, ol { + margin-top: 5px; + } + } + &.list-dash { + li { + &:before { + content: '-'; + padding-right: 6px; + } + a { + &:hover { + padding-left: 2px; + } + } + ul, ol { + padding-left: 30px; + } + } + } + &.list-inline-lg { + margin-right: -12px; + margin-left: -12px; + li { + padding: 0 12px; + } + } + &.list-inline { + margin-right: -6px; + margin-left: -6px; + li { + padding: 0 6px; + } + } + &.list-inline-sm { + margin-right: -2px; + margin-left: -2px; + li { + padding: 0 2px; + } + } + } +}
\ No newline at end of file diff --git a/assets/css/scss/basic/_typography.scss b/assets/css/scss/basic/_typography.scss new file mode 100644 index 0000000..66ea287 --- /dev/null +++ b/assets/css/scss/basic/_typography.scss @@ -0,0 +1,156 @@ +// +// Typography Styles // +// +body { + color: $color-primary; + font-family: $font-family-primary; + font-size: 15px; + font-weight: 400; + letter-spacing: 0; + @include breakpoint-less(md) { + font-size: 14px; + } +} +h1,h2,h3,h4,h5,h6 { + margin: 0 0 10px; + letter-spacing: -0.3px; + color: $color-dark; + font-family: $font-family-tertiary; + font-weight: $font-weight-semi-bold; +} +h1 { + font-size: 2.66em; /* 40px */ + line-height: 1.5; /* 60px */ +} +h2 { + font-size: 2.13em; /* 32px */ + line-height: 1.625; /* 52px */ +} +h3 { + font-size: 1.86em; /* 28px */ + line-height: 1.65; /* 46px */ +} +h4 { + font-size: 1.6em; /* 24px */ + line-height: 1.7; /* 40px */ +} +h5 { + font-size: 1.33em; /* 20px */ + line-height: 1.8; /* 36px */ +} +h6 { + font-size: 1.06em; /* 16px */ + line-height: 1.87; /* 30px */ +} + +p { + margin: 0; + line-height: 1.86; /* 28px */ + @include breakpoint-less(md) { + line-height: 1.75; /* 24.5px */ + } +} + +.display-1 { font-size: 6.4em; } /* 96px */ +.display-2 { font-size: 5.86em; } /* 88px */ +.display-3 { font-size: 4.8em; } /* 72px */ +.display-4 { font-size: 3.73em; } /* 56px */ +@include breakpoint-less(sm) { + .display-1 { font-size: 5.73em; } /* 86px */ + .display-2 { font-size: 5.33em; } /* 80px */ + .display-3 { font-size: 4.26em; } /* 64px */ + .display-4 { font-size: 3.2em; } /* 48px */ +} +@include breakpoint-less(xs) { + .display-1 { font-size: 5.33em; } /* 80px */ + .display-2 { font-size: 4.8em; } /* 72px */ + .display-3 { font-size: 3.73em; } /* 56px */ + .display-4 { font-size: 3.2em; } /* 48px */ +} + +.uppercase { + letter-spacing: 1px; + text-transform: uppercase; +} + +.font-small { + font-size: 0.875em; /* 13px */ + line-height: 1.85; /* 24px */ + @include breakpoint-less(md) { + font-size: 0.85em; /* 12px */ + line-height: 1.66; /* 20px */ + } +} +.font-large { + font-size: 1.13em; /* 17px */ + line-height: 1.8; /* 30px */ + @include breakpoint-less(md) { + font-size: 1.145em; /* 16px */ + } +} +@include breakpoint-above(lg) { + .font-lg-large { + font-size: 1.13em; /* 17px */ + line-height: 1.8; /* 30px */ + } + .font-lg-small { + font-size: 0.875em; /* 13px */ + line-height: 1.85; /* 24px */ + } +} + +// +// Letter Spacing // +// +.letter-spacing-1, .letter-spacing-1px { letter-spacing: 1px; } +.letter-spacing-2, .letter-spacing-2px { letter-spacing: 2px; } +.letter-spacing-3, .letter-spacing-3px { letter-spacing: 3px; } +.letter-spacing-4, .letter-spacing-4px { letter-spacing: 4px; } +.letter-spacing-5, .letter-spacing-5px { letter-spacing: 5px; } + +// +// Line Heights // +// +.line-height-100 { line-height: 100%; } +.line-height-110 { line-height: 110%; } +.line-height-120 { line-height: 120%; } +.line-height-130 { line-height: 130%; } +.line-height-140 { line-height: 140%; } +.line-height-150 { line-height: 150%; } +.line-height-160 { line-height: 160%; } +.line-height-170 { line-height: 170%; } +.line-height-180 { line-height: 180%; } +.line-height-190 { line-height: 190%; } +.line-height-200 { line-height: 200%; } + +// +// Font Icon Styles // +// +i { + display: inline-block; +} + +// +// Icon sizes // +// +.icon-5xl { + i { font-size: 2.8em; } /* 42px */ +} +.icon-4xl { + i { font-size: 2.4em; } /* 36px */ +} +.icon-3xl { + i { font-size: 2.13em; } /* 32px */ +} +.icon-2xl { + i { font-size: 1.86em; } /* 28px */ +} +.icon-xl { + i { font-size: 1.6em; } /* 24px */ +} +.icon-lg { + i { font-size: 1.33em; } /* 20px */ +} +.icon-sm { + i { font-size: 0.86em; } /* 13px */ +}
\ No newline at end of file diff --git a/assets/css/scss/components/.DS_Store b/assets/css/scss/components/.DS_Store Binary files differnew file mode 100644 index 0000000..db24788 --- /dev/null +++ b/assets/css/scss/components/.DS_Store diff --git a/assets/css/scss/components/_blog.scss b/assets/css/scss/components/_blog.scss new file mode 100644 index 0000000..22264ec --- /dev/null +++ b/assets/css/scss/components/_blog.scss @@ -0,0 +1,148 @@ +// +// Blog Styles // +// +@include breakpoint-less(md) { + .sidebar-wrapper { + display: none; + } +} + +.sidebar-box { + border: 1px solid $border-grey; + margin-bottom: 20px; + padding: 30px; + &:last-child { + margin-bottom: 0; + } + h1, h2, h3, h4, h5, h6 { + margin-bottom: 30px; + text-align: center; + } + .list-category { + list-style-type: none; + padding: 0; + li { + margin: 0; + padding: 7px 0; + border-bottom: 1px solid $border-grey; + &:first-child { + padding-top: 0; + } + &:last-child { + padding-bottom: 0; + border: 0; + } + a { + display: block; + span { + float: right; + font-size: 14px; + } + } + } + } + .popular-post { + position: relative; + margin-bottom: 15px; + &:last-child { + margin-bottom: 0; + } + img { + float: left; + width: 80px; + } + div { + padding-left: 100px; + h1, h2, h3, h4, h5, h6 { + margin-bottom: 0; + text-align: left; + } + a { + @include transition(linear 0.1s); + } + span { + font-size: 14px; + } + } + &:after { + content: ''; + display: block; + clear: both; + } + } + .tags { + padding: 0; + li { + display: inline-block; + margin: 0 3px 6px 0; + a { + display: inline-block; + background: $button-grey-lighter; + padding: 5px 10px; + font-size: 14px; + &:hover, &:focus { + background: $button-grey; + color: $color-dark; + } + } + } + } +} +div[class^='bg-black'], div[class*=' bg-black'], div[class^='bg-dark'], div[class*=' bg-dark'] { + .sidebar-box { + border-color: $color-white-02; + .list-category { + li { + border-color: $color-white-02; + } + } + .tags { + li { + a { + background: $color-black-08; + color: $color-white-07; + &:hover, &:focus { + background: $color-black-09; + color: $color-white; + } + } + } + } + } +} + +// +// Comment box // +// +.comment-box { + position: relative; + margin-bottom: 30px; + padding-left: 80px; + .comment-user-avatar { + position: absolute; + top: 0; + left: 0; + background: $bg-grey; + width: 60px; + height: 60px; + border-radius: 50%; + text-align: center; + line-height: 60px; + img { + width: 60px; + height: 60px; + } + } + .comment-content { + position: relative; + .comment-time { + position: absolute; + top: 0; + right: 0; + text-align: right; + color: $color-primary-lighter; + font-style: italic; + font-size: 14px; + } + } +}
\ No newline at end of file diff --git a/assets/css/scss/components/_cookie-consent.scss b/assets/css/scss/components/_cookie-consent.scss new file mode 100644 index 0000000..6ce2f5b --- /dev/null +++ b/assets/css/scss/components/_cookie-consent.scss @@ -0,0 +1,17 @@ +// +// Cookie Consent // +// +#cookie-consent { + position: fixed; + right: 0; + bottom: 0; + left: 0; + z-index: 997; + visibility: visible; + opacity: 1; + @include transition(ease-out 0.2s); + &.consent-hidden { + visibility: hidden; + opacity: 0; + } +}
\ No newline at end of file diff --git a/assets/css/scss/components/_fullscreen-menu.scss b/assets/css/scss/components/_fullscreen-menu.scss new file mode 100644 index 0000000..c77c23b --- /dev/null +++ b/assets/css/scss/components/_fullscreen-menu.scss @@ -0,0 +1,165 @@ +// +// Fullscreen Menu Styles // +// +.fm-toggle { + margin-left: auto; + cursor: pointer; + @include transition(ease-out 0.2s); + .lines { + position: relative; + display: inline-block; + background: $color-black; + width: 25px; + height: 2px; + margin: 0; + padding: 0; + vertical-align: middle; + @include transition(linear 0.12s); + &:before, &:after { + content: ''; + position: absolute; + left: 0; + background: $color-black; + width: 25px; + height: 2px; + display: inline-block; + @include transition(linear 0.12s); + } + &:before { top: -7px;} + &:after { bottom: -7px;} + } + @include breakpoint-above(lg) { + .lines { + &:before { @include transform(scaleX(0.8)); @include transform-origin(100% 50%); } + &:after { @include transform(scaleX(0.6)); @include transform-origin(100% 50%); } + } + &:hover { + .lines { + &:before { @include transform(scaleX(1)); } + &:after { @include transform(scaleX(1)); } + } + } + } +} +.header { + &.dark, &.black, &.absolute-light { + .fm-toggle { + .lines, .lines:before, .lines:after { background: $color-white; } + } + } +} + +// +// Fullscreen Menu // +// +.fullscreen-menu { + position: fixed; + top: 0; + left: 0; + z-index: 996; + visibility: hidden; + opacity: 0; + width: 100%; + height: 100%; + @include transition(ease-out 0.2s); + .fm-wrapper { + @include transform(scale(0.98)); + height: 100%; + @include transition(ease-out 0.2s); + .position-top, + .position-middle, + .position-bottom { + padding: 0 30px; + } + @include breakpoint-above(md) { + .position-top, + .position-middle, + .position-bottom { + padding: 0 50px; + } + .position-top { top: 50px; } + .position-bottom { bottom: 50px; } + } + .fm-close { + position: absolute; + top: 50px; + right: 50px; + cursor: pointer; + span { + position: relative; + display: inline-block; + opacity: 0.8; + width: 60px; + height: 60px; + border-radius: 50%; + @include transition(ease-out 0.18s); + &:before, &:after { + content: ''; + position: absolute; + top: 50%; + left: 50%; + width: 14px; + height: 2px; + border-radius: 2px; + @include transition(ease-out 0.18s); + } + &:before { @include transform(translate(-50%, -50%) rotate(45deg)) } + &:after { @include transform(translate(-50%, -50%) rotate(-45deg)) } + } + &:hover { + span { + opacity: 1; + &:before { @include transform(translate(-50%, -50%) rotate(180deg)) } + &:after { @include transform(translate(-50%, -50%) rotate(180deg)) } + } + } + } + @include breakpoint-less(md) { + .fm-close { + top: 30px; + right: 30px; + } + } + @include breakpoint-less(sm) { + .fm-close { + top: 20px; + right: 20px; + span { + width: 50px; + height: 50px; + } + } + } + } + &.fm-show { + visibility: visible; + opacity: 1; + .fm-wrapper { + @include transform(scale(1)); + } + } +} +div[class^='bg-black'], div[class*=' bg-black'], div[class^='bg-dark'], div[class*=' bg-dark'] { + &.fullscreen-menu { + .fm-wrapper { + .fm-close { + span { + background: $color-white-01; + &:before, &:after { background: $color-white; } + } + } + } + } +} +.bg-grey, .bg-grey-lighter, .bg-grey-lightest, div[class^='bg-white'], div[class*=' bg-white'] { + &.fullscreen-menu { + .fm-wrapper { + .fm-close { + span { + background: $color-black-01; + &:before, &:after { background: $color-black; } + } + } + } + } +}
\ No newline at end of file diff --git a/assets/css/scss/components/_gallery.scss b/assets/css/scss/components/_gallery.scss new file mode 100644 index 0000000..11509b6 --- /dev/null +++ b/assets/css/scss/components/_gallery.scss @@ -0,0 +1,155 @@ +// +// Gallery Styles // +// +.gallery-wrapper { + margin: 0; + div[class^="col-"], div[class*=" col-"] { + margin: 0; + } + .gallery-box { + .gallery-img { + position: relative; + overflow: hidden; + a { + display: block; + &:before { + content: ''; + position: absolute; + top: 0; + left: 0; + z-index: 1; + opacity: 0; + background: $color-white-01; + width: 100%; + height: 100%; + @include transition(ease-out 0.12s); + } + img { + @include transform(scale(1)); + width: 100%; + @include transition(transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1)); + } + &:hover { + &:before { + opacity: 1; + } + img { + @include transform(scale(1.04)); + } + } + .gallery-title { + position: absolute; + top: 50%; + left: 50%; + @include transform(translate(-50%,-50%)); + z-index: 2; + background: $color-white; + padding: 10px 20px; + h1, h2, h3, h4, h5, h6 { + display: inline-block; + margin: 0; + } + } + } + } + } + // + // Gallery box Spacings // + // + &.spacing-0, &.no-spacing { + div[class^="col-"]:not(.row) { + margin-bottom: 0; + padding: 0; + } + } + &.spacing-6 { + div[class^="col-"]:not(.row) { + margin-bottom: 6px; + padding: 0 3px; + } + } + &.spacing-10 { + div[class^="col-"]:not(.row) { + margin-bottom: 10px; + padding: 0 5px; + } + } + &.spacing-20 { + div[class^="col-"]:not(.row) { + margin-bottom: 20px; + padding: 0 10px; + } + } + &.spacing-30 { + div[class^="col-"]:not(.row) { + margin-bottom: 30px; + padding: 0 15px; + } + } + // + // Gallery Image Hover Styles // + // + &.hover-style-2 { + .gallery-box { + .gallery-img { + a { + &:before { background: $color-black-01; } + } + } + } + } + // + // Gallery Image border-radius // + // + &[class*=' border-radius'], &[class^='border-radius'] { + .gallery-box { + .gallery-img { + @include transform(translate3d(0,0,0)); + overflow: hidden; + } + } + } + &.border-radius-025 { + .gallery-box .gallery-img { border-radius: 0.25em; } + } + &.border-radius-0375 { + .gallery-box .gallery-img { border-radius: 0.375em; } + } + &.border-radius-05 { + .gallery-box .gallery-img { border-radius: 0.5em; } + } + &.border-radius-10 { + .gallery-box .gallery-img { border-radius: 1.0em; } + } + &.border-radius-15 { + .gallery-box .gallery-img { border-radius: 1.5em; } + } + &.border-radius-20 { + .gallery-box .gallery-img { border-radius: 2.0em; } + } + &.border-radius-25 { + .gallery-box .gallery-img { border-radius: 2.5em; } + } + &.border-radius-30 { + .gallery-box .gallery-img { border-radius: 3.0em; } + } +} + +.container { + .gallery-wrapper { + &.spacing-0, &.no-spacing { margin: 0; } + &.spacing-6 { margin: 0 -3px -6px; } + &.spacing-10 { margin: 0 -5px -10px; } + &.spacing-20 { margin: 0 -10px -20px; } + &.spacing-30 { margin: 0 -15px -30px; } + } +} +.container-fluid { + .gallery-wrapper { + &.spacing-0, &.no-spacing { margin: 0 -30px; } + &.spacing-6 { margin: 0 -27px; } + &.spacing-10 { margin: 0 -25px; } + &.spacing-20 { margin: 0 -20px; } + &.spacing-30 { margin: 0 -15px; } + } +}
\ No newline at end of file diff --git a/assets/css/scss/components/_header.scss b/assets/css/scss/components/_header.scss new file mode 100644 index 0000000..444bf94 --- /dev/null +++ b/assets/css/scss/components/_header.scss @@ -0,0 +1,772 @@ +// +// Header Menu // +// +.header { + top: 0; + z-index: 993; + overflow: visible; + background: $color-white; + width: 100%; + height: 80px; + @include transition(ease-in-out 0.2s); + &.hide { + @include transform(translateY(-100%)); + } + .container, .container-fluid { + @include display-flex; + align-items: center; + height: 100%; + } + .header-logo { + display: inline-block; + .logo-light { + display: none; + } + * { + @include transition(linear 0.1s); + } + h1,h2,h3,h4,h5,h6 { + margin: 0; + } + img { + width: auto; + height: 54px; + max-height: 54px; + } + a { + color: $color-dark; + &:hover { color: $color-dark; } + } + } + .header-toggle { + position: relative; + display: inline-block; + width: 28px; + height: 28px; + margin-left: auto; + cursor: pointer; + span { + position: absolute; + top: 50%; + left: 0; + @include transform(translateY(-50%)); + background: $color-dark; + width: 100%; + height: 2px; + border-radius: 2px; + @include transition(linear 0.1s); + &:before, &:after { + content: ''; + position: absolute; + left: 0; + background: $color-dark; + width: 100%; + height: 2px; + border-radius: 2px; + @include transition(linear 0.1s); + } + &:before { top: -7px; } + &:after { bottom: -7px; } + } + &.toggle-close { + span { + background: transparent; + &:before { top: 0; bottom: 0; @include transform(rotate(-45deg)); } + &:after { top: 0; bottom: 0; @include transform(rotate(45deg)); } + } + } + } + .header-menu { + display: inline-block; + font-size: 14px; + z-index: 995; + .nav { + display: block; + margin: 0; + padding: 0; + list-style-type: none; + margin: 0; + padding: 0; + ul { + list-style-type: none; + margin: 0; + padding: 0; + } + .nav-item { + text-align: left; + .nav-link { + padding: 0; + font-family: $font-family-tertiary; + letter-spacing: -0.2px; + color: $color-dark; + &:hover, &.active { + color: $color-dark; + } + } + .nav-dropdown-toggle { + position: relative; + display: inline-block; + &:after { + content: '\f107'; + font-family: "Font Awesome 5 Free"; + font-weight: 900; + font-size: 12px; + } + } + .nav-dropdown { + background: $color-white; + h1,h2,h3,h4,h5,h6 { color: $color-dark; } + a { + &:not(.button, .button-circle) { + color: $color-primary; + &:hover, &:focus { color: $color-dark; } + } + } + .nav-dropdown-item { + .nav-subdropdown-toggle { + position: absolute; + &:after { + content: '\f105'; + font-family: "Font Awesome 5 Free"; + font-weight: 900; + font-size: 12px; + } + } + } + } + } + } + &.font-2 { + .nav { + .nav-item { + .nav-link { + font-size: 13px; + font-weight: 500; + letter-spacing: 1px; + text-transform: uppercase; + } + } + } + } + } + .header-menu-extra { + a { + &:not(.button, .button-circle) { + color: $color-dark; + &:hover, &:focus { color: $color-dark; } + } + } + } + // + // Positions // + // + &.sticky-autohide, &.sticky { + position: fixed; + top: 0; + left: 0; + @include box-shadow(0 0 36px 0 rgba(22,25,28,0.17)); + } +} + +// +// Header BG Colors // +// +.header { + &.absolute-dark, &.absolute-light, + &.absolute-dark.dark, &.absolute-light.dark, + &.absolute-dark.black, &.absolute-light.black { + &:not(.sticky-autohide, .sticky) { + position: absolute; + top: 0; + left: 0; + } + background: transparent; + @include box-shadow(none); + } + &.dark, &.black, &.absolute-light { + &.border-top, &.border-bottom { + border-color: $color-white-01; + } + } + &.absolute-light { + .header-logo { + .logo-dark { + display: none; + } + .logo-light { + display: inline-block; + } + h1,h2,h3,h4,h5,h6 { color: $color-white; } + a { + color: $color-white; + &:hover { color: $color-white; } + } + } + .header-toggle { + span { + background: $color-white; + &:before, &:after { background: $color-white; } + } + &.toggle-close { + span { + background: transparent; + } + } + } + @include breakpoint-above(lg) { + .header-menu { + .nav { + .nav-item { + .nav-link, .nav-dropdown-toggle { + color: $color-white; + &:hover, &:focus, &.active { color: $color-white; } + } + .nav-link { + &:before { + background: $color-white-015; + } + } + } + } + } + } + .header-menu-extra { + a { + &:not(.button, .button-circle) { + color: $color-white; + &:hover, &:focus { color: $color-white; } + } + } + } + } + &.dark, &.black { + &:not(.absolute-dark) { + .header-logo { + .logo-dark { + display: none; + } + .logo-light { + display: inline-block; + } + h1,h2,h3,h4,h5,h6 { color: $color-white; } + a { + color: $color-white; + &:hover { color: $color-white; } + } + } + @include breakpoint-above(lg) { + .header-menu { + .nav { + .nav-item { + .nav-link, .nav-dropdown-toggle { + color: $color-white; + &:hover, &:focus, &.active { color: $color-white; } + } + .nav-link { + &:before { + background: $color-white-015; + } + } + } + } + } + } + .header-menu-extra { + a { + &:not(.button, .button-circle) { + color: $color-white; + &:hover, &:focus { color: $color-white; } + } + } + } + .header-toggle { + span { + background: $color-white; + &:before, &:after { background: $color-white; } + } + &.toggle-close { + span { + background: transparent; + } + } + } + } + } + &.dark { background: $bg-dark; } + &.black { background: $color-black; } +} + +@include breakpoint-above(lg) { + .header { + // + // Sizes // + // + .header-menu { + height: 80px; + } + &.header-lg { + .header-logo { + img { + height: 64px; + max-height: 64px; + } + } + .header-menu { + height: 90px; + } + } + &.header-xl { + .header-logo { + img { + height: 74px; + max-height: 74px; + } + } + .header-menu { + height: 100px; + } + } + // + // Alignments // + // + &:not(.left, .center) { + .header-menu { + margin-left: auto; + } + } + &.left { + .header-logo { + margin-right: 30px; + } + .header-menu { + margin-right: auto; + } + } + &.center { + .header-logo { + margin-right: auto; + } + .header-menu { + .nav { + position: absolute; + top: 0; + left: 50%; + @include transform(translateX(-50%)); + width: auto; + text-align: center; + } + } + } + .header-menu { + .nav { + .nav-item { + position: relative; + display: inline-block; + height: 100%; + margin: 0 0 0 20px; + &:first-child { + margin-left: 0; + } + .nav-link { + display: inline-block; + line-height: 80px; + &:before { + position: absolute; + right: 0; + bottom: 22px; + left: 0; + content: ''; + background: $bg-grey; + height: 0; + @include transition(all 0.14s cubic-bezier(0.165, 0.84, 0.44, 1)); + } + &.d-toggle { + padding-right: 14px; + } + } + .nav-dropdown-toggle { + position: absolute; + top: 50%; + right: 0; + @include transform(translateY(-50%)); + color: $color-dark; + &:hover { + color: $color-dark; + } + } + .nav-dropdown { + position: absolute; + top: 83px; + left: 0; + @include transform(translateY(10px)); + z-index: 995; + visibility: hidden; + opacity: 0; + background: $color-white; + width: 240px; + border-radius: 0.375em; + @include box-shadow(0 10px 40px -4px rgba(22,25,28,0.17)); + padding: 15px 0; + @include transition(ease-out 0.14s); + .nav-dropdown-item { + position: relative; + display: block; + margin: 0; + padding: 0 15px; + .nav-dropdown-link { + position: relative; + display: block; + border-radius: 0.375em; + padding: 7px 15px; + @include transition(linear 0.06s); + &:hover { + background: $bg-grey; + } + &.sd-toggle { + &:after { + position: absolute; + top: 50%; + right: 15px; + @include transform(translateY(-50%)); + content: '\f105'; + font-family: "Font Awesome 5 Free"; + font-weight: 900; + font-size: 12px; + } + } + } + .nav-subdropdown-toggle { + display: none; + } + .nav-subdropdown { + position: absolute; + top: -15px; + left: 243px; + visibility: hidden; + opacity: 0; + background: $color-white; + width: 240px; + border-radius: 0.375em; + @include box-shadow(0 10px 40px -4px rgba(22,25,28,0.17)); + padding: 15px; + @include transition(linear 0.06s); + .nav-subdropdown-item { + display: block; + margin: 0; + .nav-subdropdown-link { + display: block; + border-radius: 0.375em; + padding: 7px 15px; + @include transition(linear 0.06s); + &:hover { + background: $bg-grey; + } + } + } + } + &:hover { + .nav-subdropdown { + visibility: visible; + opacity: 1; + } + } + } + } + &:hover { + .nav-link { + &:before { + height: 6px; + } + } + .nav-dropdown { + @include transform(translateY(0)); + visibility: visible; + opacity: 1; + } + } + } + } + &.dropdown-dark, &.dropdown-black { + .nav { + .nav-item { + .nav-dropdown { + h1,h2,h3,h4,h5,h6 { color: $color-white; } + a { + &:not(.button, .button-circle) { + color: $color-white-08; + &:hover, &:focus { color: $color-white; } + } + } + .nav-dropdown-item { + .nav-dropdown-link { + &:hover { + background: $color-white-01; + } + } + .nav-subdropdown { + .nav-subdropdown-item { + .nav-subdropdown-link { + &:hover { + background: $color-white-01; + } + } + } + } + } + } + } + } + } + &.dropdown-dark { + .nav { + .nav-item { + .nav-dropdown { + background: $color-dark; + .nav-dropdown-item { + .nav-subdropdown { + background: $color-dark; + } + } + } + } + } + } + &.dropdown-black { + .nav { + .nav-item { + .nav-dropdown { + background: $color-black; + .nav-dropdown-item { + .nav-subdropdown { + background: $color-black; + } + } + } + } + } + } + } + &.absolute-dark { + .header-menu { + .nav { + .nav-item { + .nav-link { + &:before { + background: $color-black-005; + } + } + } + } + } + } + .header-menu-extra { + display: inline-block; + margin-left: 30px; + } + .header-toggle { + display: none; + } + &:not(.center, .left) { + .header-menu { + .nav { + .nav-item { + &:last-child, + &:nth-last-child(2) { + .nav-dropdown { + right: 0; + left: auto; + .nav-dropdown-item { + .nav-subdropdown { + right: 243px; + left: auto; + } + } + } + } + } + } + } + .container-fluid { + .header-menu { + .nav { + .nav-item { + .nav-dropdown { + right: 0; + left: auto; + .nav-dropdown-item { + .nav-subdropdown { + right: 243px; + left: auto; + } + } + } + } + } + } + } + } + } +} +@include breakpoint-less(md) { + .header { + height: 70px; + .header-menu { + position: fixed; + top: 0; + left: -100%; + overflow-y: auto; + background: $color-white; + width: 300px; + height: 100%; + @include box-shadow(0 0 36px 0 rgba(22,25,28,0.17)); + padding: 20px 30px; + @include transition(all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1)); + &.show { + left: 0; + } + .nav { + width: 100%; + margin: 0; + padding: 0; + .nav-item { + position: relative; + display: block; + width: 100%; + height: auto; + margin: 0; + border-bottom: 1px solid $border-grey; + padding: 14px 0; + &:last-child { + border: 0; + } + .nav-link { + display: inline-block; + width: auto; + height: auto; + color: $color-primary; + &:hover, &:focus, &.active { color: $color-dark; } + } + .nav-dropdown-toggle { + position: absolute; + top: 14px; + right: 0; + width: 22px; + height: 22px; + text-align: right; + &.active { + color: $color-dark; + } + } + .nav-dropdown { + display: none; + background: $color-white; + padding: 8px 0 0 20px; + &.show { + display: block; + } + .nav-dropdown-item { + position: relative; + margin: 0 0 8px; + &:last-child { + margin: 0; + } + .nav-dropdown-link { + &.active { + color: $color-dark; + } + } + .nav-subdropdown-toggle { + top: 0; + right: 0; + width: 21px; + height: 21px; + text-align: right; + &:after { + content: '\f107'; + } + } + .nav-subdropdown { + display: none; + padding: 8px 0 0 20px; + &.show { + display: block; + } + li { + margin: 0 0 8px; + &:last-child { + margin: 0; + } + } + } + } + } + } + } + } + .header-menu-extra { + position: absolute; + top: 50%; + right: 80px; + left: auto; + @include transform(translateY(-50%)); + } + } +} + +// +// Header Sizes // +// +@include breakpoint-above(lg) { + .header-lg { + height: 90px; + .container-fluid { + padding: 0 40px; + } + .header-menu { + .nav { + .nav-item { + .nav-link { + line-height: 90px; + &:before { + bottom: 27px; + } + } + .nav-dropdown { + top: 93px; + } + } + } + } + } + .header-xl { + height: 100px; + .container-fluid { + padding: 0 50px; + } + .header-menu { + .nav { + .nav-item { + .nav-link { + line-height: 100px; + &:before { + bottom: 32px; + } + } + .nav-dropdown { + top: 103px; + } + } + } + } + } +} + +// +// Placeholders for Sticky Header // +// +.header-placeholder { height: 80px; } +.header-placeholder-lg { height: 90px; } +.header-placeholder-xl { height: 100px; } +@include breakpoint-less(md) { + .header-placeholder, .header-placeholder-lg, .header-placeholder-xl { height: 70px; } +}
\ No newline at end of file diff --git a/assets/css/scss/components/_masonry.scss b/assets/css/scss/components/_masonry.scss new file mode 100644 index 0000000..7952612 --- /dev/null +++ b/assets/css/scss/components/_masonry.scss @@ -0,0 +1,97 @@ +// +// Masonry Styles // +// +.masonry { + margin: 0 -15px -30px; + .masonry-item { + margin-bottom: 30px; + padding: 0 15px; + } + // + // Masonry - Columns // + // + &.masonry-column-1 { + .masonry-item { width: 100%; } + } + &.masonry-column-2 { + @include breakpoint-above(md) { + .masonry-item { width: 50%; } + } + } + &.masonry-column-3 { + @include breakpoint-above(md) { + .masonry-item { width: 50%; } + } + @include breakpoint-above(lg) { + .masonry-item { width: 33.33%; } + } + } + &.masonry-column-4 { + @include breakpoint-above(sm) { + .masonry-item { width: 50%; } + } + @include breakpoint-above(md) { + .masonry-item { width: 33.33%; } + } + @include breakpoint-above(lg) { + .masonry-item { width: 25%; } + } + } + &.masonry-column-5 { + @extend .column-4; + @include breakpoint-above(xl) { + .masonry-item { width: 20%; } + } + } + &.masonry-column-6 { + @extend .column-4; + @include breakpoint-above(xl) { + .masonry-item { width: 16.66%; } + } + } + // + // Masonry - Item Spacings // + // + &.masonry-spacing-0 { + margin: 0; + .masonry-item { + margin: 0; + padding: 0; + } + } + &.masonry-spacing-6 { + margin: 0 -3px -6px; + .masonry-item { + margin-bottom: 6px; + padding: 0 3px; + } + } + &.masonry-spacing-10 { + margin: 0 -5px -10px; + .masonry-item { + margin-bottom: 10px; + padding: 0 5px; + } + } + &.masonry-spacing-20 { + margin: 0 -10px -20px; + .masonry-item { + margin-bottom: 20px; + padding: 0 10px; + } + } + &.masonry-spacing-40 { + margin: 0 -20px -40px; + .masonry-item { + margin-bottom: 40px; + padding: 0 20px; + } + } + &.masonry-spacing-50 { + margin: 0 -25px -50px; + .masonry-item { + margin-bottom: 50px; + padding: 0 25px; + } + } +}
\ No newline at end of file diff --git a/assets/css/scss/components/_portfolio.scss b/assets/css/scss/components/_portfolio.scss new file mode 100644 index 0000000..4b8d002 --- /dev/null +++ b/assets/css/scss/components/_portfolio.scss @@ -0,0 +1,563 @@ +// +// Portfolio Styles // +// +.portfolio-wrapper { + &.row { + margin: 0; + div[class^="col-"], div[class*=" col-"] { + margin: 0; + } + } + .portfolio-item { + width: 100%; + text-align: left; + } + // + // Portfolio Columns // + // + &.column-1 { + .portfolio-item { width: 100%; } + } + &.column-2 { + @include breakpoint-above(md) { + .portfolio-item { width: 50%; } + } + } + &.column-3 { + @include breakpoint-above(md) { + .portfolio-item { width: 50%; } + } + @include breakpoint-above(lg) { + .portfolio-item { width: 33.33%; } + } + } + &.column-4 { + @include breakpoint-above(sm) { + .portfolio-item { width: 50%; } + } + @include breakpoint-above(md) { + .portfolio-item { width: 33.33%; } + } + @include breakpoint-above(lg) { + .portfolio-item { width: 25%; } + } + } + &.column-5 { + @extend .column-4; + @include breakpoint-above(xl) { + .portfolio-item { width: 20%; } + } + } + &.column-6 { + @extend .column-4; + @include breakpoint-above(xl) { + .portfolio-item { width: 16.66%; } + } + } + // + // Portfolio box spacings // + // + &.spacing-0, &.no-spacing { + .portfolio-item { padding: 0; } + } + &.spacing-6 { + .portfolio-item { padding: 3px; } + } + &.spacing-10 { + .portfolio-item { padding: 5px; } + } + &.spacing-20 { + .portfolio-item { padding: 10px; } + } + &.spacing-30 { + .portfolio-item { padding: 15px; } + } + &.spacing-40 { + .portfolio-item { padding: 20px; } + } + &.spacing-50 { + .portfolio-item { padding: 25px; } + } + // + // Portfolio box border-radius // + // + &[class*=' border-radius'], &[class^='border-radius'] { + .portfolio-item { + .portfolio-box { + @include transform(translate3d(0,0,0)); + overflow: hidden; + } + } + } + &.border-radius-025 { + .portfolio-item .portfolio-box { border-radius: 0.25em; } + } + &.border-radius-0375 { + .portfolio-item .portfolio-box { border-radius: 0.375em; } + } + &.border-radius-05 { + .portfolio-item .portfolio-box { border-radius: 0.5em; } + } + &.border-radius-10 { + .portfolio-item .portfolio-box { border-radius: 1.0em; } + } + &.border-radius-15 { + .portfolio-item .portfolio-box { border-radius: 1.5em; } + } + &.border-radius-20 { + .portfolio-item .portfolio-box { border-radius: 2.0em; } + } + &.border-radius-25 { + .portfolio-item .portfolio-box { border-radius: 2.5em; } + } + &.border-radius-30 { + .portfolio-item .portfolio-box { border-radius: 3.0em; } + } +} +.text-center { + .portfolio-item { text-align: center; } +} +.text-right { + .portfolio-item { text-align: right; } +} + +.container { + .portfolio-wrapper { + &.spacing-0, &.no-spacing { margin: 0; } + &.spacing-6 { margin: -3px; } + &.spacing-10 { margin: -5px; } + &.spacing-20 { margin: -10px; } + &.spacing-30 { margin: -15px; } + &.spacing-40 { margin: -20px; } + &.spacing-50 { margin: -25px; } + } +} +.container-fluid { + .portfolio-wrapper { + margin: 0 -30px; + &.spacing-0, &.no-spacing { margin: 0 -30px; } + &.spacing-6 { margin: -3px -27px 3px; } + &.spacing-10 { margin: -5px -25px 5px; } + &.spacing-20 { margin: -10px -20px 10px; } + &.spacing-30 { margin: -15px -15px 15px; } + &.spacing-40 { margin: -20px -10px 20px; } + &.spacing-50 { margin: -25px -5px 25px; } + } +} + +// +// Portfolio Filter Styles // +// +.filter { + margin-bottom: 70px; + ul { + margin: 0 -5px; + padding: 0; + li { + display: inline-block; + background: $button-grey-lighter; + border-radius: 30px; + margin: 0 5px; + padding: 7px 15px; + font: 400 13px $font-family-tertiary; + letter-spacing: 1px; + text-transform: uppercase; + cursor: pointer; + @include transition(linear 0.1s); + &:hover { + background: $button-grey; + } + &.active, &.mixitup-control-active { + background: $bg-dark; + color: $color-white; + } + } + } + // + // Filter Font Styles // + // + &.filter-font-2 { + ul { + li { + font-size: 15px; + letter-spacing: -0.2px; + text-transform: none; + } + } + } + // + // Filter Styles // + // + &.filter-style-2 { + ul { + margin: 0 -2px; + li { + background: transparent; + margin: 0 2px; + color: $color-primary; + &:hover, &.active, &.mixitup-control-active { + color: $color-dark; + } + &.active, &.mixitup-control-active { + background: $button-grey-lighter; + } + } + } + } + &.filter-style-3 { + ul { + margin: 0 -14px -8px; + li { + position: relative; + background: transparent; + margin: 0 14px 8px; + padding: 0; + color: $color-primary; + &:after { + content: ''; + position: absolute; + right: 0; + bottom: -1px; + left: 0; + background: $color-dark; + height: 1px; + @include animation(button-line-out 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both); + } + &:hover, &.active, &.mixitup-control-active { + color: $color-dark; + } + &.active, &.mixitup-control-active { + &:after { + width: 100%; + @include animation(button-line-in 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both); + } + } + } + } + } + &.filter-style-4 { + ul { + margin: 0 -14px -7px; + li { + background: transparent; + margin: 0 14px 7px; + padding: 0; + color: $color-primary-lighter; + &:hover, &.active, &.mixitup-control-active { + background: transparent; + color: $color-dark; + } + } + } + } +} +div[class^='bg-black'], div[class*=' bg-black'], div[class^='bg-dark'], div[class*=' bg-dark'] { + .filter { + ul { + li { + background: transparent; + color: $color-white-07; + &:hover { + background: transparent; + color: $color-white; + } + &.active, &.mixitup-control-active { + background: $color-white; + color: $color-dark; + } + } + } + &.filter-style-2 { + ul { + li { + color: $color-white-07; + &:hover, &.active, &.mixitup-control-active { + color: $color-white; + } + &.active, &.mixitup-control-active { + background: $color-white; + color: $color-dark; + } + } + } + } + &.filter-style-3 { + ul { + li { + color: $color-white-07; + &:after { + background: $color-white; + } + &:hover, &.active, &.mixitup-control-active { + color: $color-white; + } + &.active, &.mixitup-control-active { + background: transparent; + } + } + } + } + &.filter-style-4 { + ul { + li { + background: transparent; + color: $color-white-07; + &:hover, &.active, &.mixitup-control-active { + background: transparent; + color: $color-white; + } + } + } + } + } +} + +// +// Hover Styles // +// +.portfolio-item { + .portfolio-box { + position: relative; + .portfolio-img { + position: relative; + overflow: hidden; + img { + @include transform(scale(1)); + width: 100%; + @include transition(transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1)); + } + } + a { + position: absolute; + top: 0; + left: 0; + z-index: 2; + display: block; + width: 100%; + height: 100%; + } + .portfolio-title { + position: absolute; + top: 0; + left: 0; + opacity: 0; + background: $color-black-04; + width: 100%; + height: 100%; + color: $color-white-07; + @include transition(ease-out 0.12s); + div { + position: absolute; + left: 30px; + bottom: 30px; + * { + opacity: 0; + @include transform(translateY(5px)); + margin-bottom: 7px; + @include transition(ease-out 0.12s); + &:first-child { @include transition-delay(0.05s); } + &:last-child { @include transition-delay(0.10s); margin-bottom: 0; } + } + h1,h2,h3,h4,h5,h6 { + color: $color-white; + } + span { + display: inline-block; + } + } + } + &:hover { + .portfolio-img { + img { + @include transform(scale(1.04)); + @include filter(blur(1.5px)); + } + } + .portfolio-title { + opacity: 1; + * { + opacity: 1; + @include transform(translateY(0)); + } + } + } + } +} + +// +// Hover Style 2 // +// +.hover-style-2 { + .portfolio-item { + .portfolio-box { + .portfolio-title { + opacity: 1; + background: $color-black-01; + div { + top: 30px; + bottom: auto; + * { + opacity: 1; + @include transform(translateY(0)); + @include transition(ease-out 0.12s); + } + } + i { + position: absolute; + right: 30px; + bottom: 30px; + @include transform(translateY(5px)); + opacity: 0; + color: $color-white; + @include transition(ease-out 0.12s); + } + } + &:hover { + .portfolio-title { + background: $color-black-03; + i { + @include transform(translateY(0)); + opacity: 1; + } + } + } + } + } +} + +// +// Hover Style 3 // +// +.hover-style-3 { + .portfolio-item { + .portfolio-box { + overflow: hidden; + .portfolio-title { + top: auto; + right: auto; + bottom: 0; + left: 0; + @include transform(translateY(100%)); + opacity: 1; + background: $bg-dark; + height: auto; + padding: 15px 30px; + @include transition(transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1)); + div { + position: static; + opacity: 1; + * { + @include transform(translateY(0)); + opacity: 1; + margin-bottom: 0; + } + h1,h2,h3,h4,h5,h6 { + float: left; + } + span { + float: right; + display: initial; + } + } + } + &:hover { + .portfolio-img { + img { + @include transform(translateY(-20px)); + @include filter(blur(0)); + } + } + .portfolio-title { + @include transform(translateY(0)); + } + } + } + } +} + +// +// Hover Style 4 // +// +.hover-style-4 { + .portfolio-item { + .portfolio-box { + overflow: hidden; + .portfolio-title { + background: $color-white-01; + color: $color-primary; + &:after { + content: ''; + position: absolute; + top: 20px; + right: 20px; + bottom: 20px; + left: 20px; + background: $color-white; + @include transition(ease-out 0.12s); + } + div { + top: 50%; + bottom: auto; + left: 0; + @include transform(translateY(-50%)); + z-index: 1; + opacity: 0; + width: 100%; + padding: 0 50px; + text-align: center; + @include transition(ease-out 0.12s); + h1,h2,h3,h4,h5,h6 { + color: $color-dark; + } + span { + margin: 0; + } + } + } + &:hover { + .portfolio-img { + img { + @include transform(scale(1)); + @include filter(blur(0)); + } + } + .portfolio-title { + div { + opacity: 1; + } + } + } + } + } +} + +// +// Hover Style 5 // +// +.hover-style-5 { + .portfolio-item { + .portfolio-box { + .portfolio-title { + background: $color-white-09; + color: $color-primary; + div { + top: 50%; + left: 50%; + bottom: auto; + @include transform(translate(-50%,-50%)); + text-align: center; + h1,h2,h3,h4,h5,h6 { + color: $color-dark; + } + } + } + &:hover { + .portfolio-title { + div { + @include transform(translate(-50%,-50%)); + } + } + } + } + } +}
\ No newline at end of file diff --git a/assets/css/scss/components/_preloader.scss b/assets/css/scss/components/_preloader.scss new file mode 100644 index 0000000..93f28d0 --- /dev/null +++ b/assets/css/scss/components/_preloader.scss @@ -0,0 +1,219 @@ +// +// Preloader Styles // +// +body { + &:after { + content: ''; + position: fixed; + top: 0; + left: 0; + z-index: 998; + background: $color-white; + width: 100%; + height: 100%; + } + &.loaded { + &:after { + display: none; + } + } +} + +.preloader { + position: fixed; + top: 0; + left: 0; + z-index: 999; + visibility: visible; + opacity: 1; + background: $color-white; + width: 100%; + height: 100%; + text-align: center; + div { + position: absolute; + top: 50%; + left: 50%; + @include transform(translate(-50%,-50%)); + } + &.dark { + background: $color-black; + } +} +.loaded { + .preloader { + visibility: hidden; + opacity: 0; + @include transition(ease-out 0.3s); + } +} + +// +// Preloader 1 // +// +.preloader-1 { + div { + position: relative; + width: 70px; + height: 70px; + .loader-circular { + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + transform-origin: center center; + width: 70px; + height: 70px; + margin: auto; + animation: loader-one-rotate 2s linear infinite; + } + .loader-path { + fill: none; + stroke: $color-dark; + stroke-width: 2.5; + stroke-dasharray: 1, 200; + stroke-dashoffset: 0; + stroke-linecap: round; + stroke-miterlimit: 10; + animation: loader-one-dash 1.5s ease-in-out infinite; + } + } + &.dark { + div { + .loader-path { + stroke: $color-white; + } + } + } +} + +@keyframes loader-one-rotate { + 100% { transform: rotate(360deg); } +} +@keyframes loader-one-dash { + 0% { + stroke-dasharray: 1, 200; + stroke-dashoffset: 0; + } + 50% { + stroke-dasharray: 89, 200; + stroke-dashoffset: -35px; + } + 100% { + stroke-dasharray: 89, 200; + stroke-dashoffset: -124px; + } +} + +// +// Preloader 2 // +// +.preloader-2 { + div { + span { + display: inline-block; + opacity: 0.2; + background: $color-black; + background: linear-gradient(to right, $color-black 10%, transparent 40%); + width: 60px; + height: 60px; + border-radius: 50%; + @include animation(loader-two 0.6s infinite linear); + &:before, &:after { + content: ''; + position: absolute; + top: 0; + left: 0; + } + &:before { + background: $color-black; + width: 50%; + height: 50%; + border-radius: 100% 0 0 0; + } + &:after { + right: 0; + bottom: 0; + background: $color-white; + width: 90%; + height: 90%; + margin: auto; + border-radius: 50%; + } + } + } + &.dark { + div { + span { + background: $color-white; + background: linear-gradient(to right, $color-white 10%, transparent 40%); + &:before { + background: $color-white; + } + &:after { + background: $color-black; + } + } + } + } +} +@keyframes loader-two { + 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } + 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } +} +@-webkit-keyframes loader-two { + 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } + 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } +} + +// +// Preloader 3 // +// +.preloader-3 { + div { + width: 50px; + height: 50px; + span { + position: relative; + display: block; + &:before, &:after { + content: ''; + position: absolute; + top: 0; + left: 0; + background: $color-black-01; + width: 50px; + height: 50px; + border-radius: 50%; + } + &:before { @include animation(loader-three-bounceIn 1.2s infinite ease-in-out); } + &:after { @include animation(loader-three-bounceOut 1.2s infinite ease-in-out); } + } + } + &.dark { + div { + span { + &:before, &:after { + background: $color-white-01; + } + } + } + } +} +@-webkit-keyframes loader-three-bounceIn { + 0%, 100% { -webkit-transform: scale(0); } + 50% { -webkit-transform: scale(1.0); } +} +@keyframes loader-three-bounceIn { + 0%, 100% { -webkit-transform: scale(0); transform: scale(0); } + 50% { -webkit-transform: scale(1.0); transform: scale(1.0); } +} +@-webkit-keyframes loader-three-bounceOut { + 0%, 100% { -webkit-transform: scale(1.0); } + 50% { -webkit-transform: scale(0); } +} +@keyframes loader-three-bounceOut { + 0%, 100% { -webkit-transform: scale(1.0); transform: scale(1.0); } + 50% { -webkit-transform: scale(0); transform: scale(0); } +}
\ No newline at end of file diff --git a/assets/css/scss/components/_section.scss b/assets/css/scss/components/_section.scss new file mode 100644 index 0000000..efc3b95 --- /dev/null +++ b/assets/css/scss/components/_section.scss @@ -0,0 +1,125 @@ +// +// Sections Styles // +// +.section-xs { + padding: 50px 0; + &.bg-image { + .container, .container-fluid { padding: 50px 30px; } + } +} +.section-sm { + padding: 70px 0; + &.bg-image { + .container, .container-fluid { padding: 70px 30px; } + } +} +.section, .section-md { + padding: 100px 0; + &.bg-image { + .container, .container-fluid { padding: 100px 30px; } + } +} +.section-lg { + padding: 160px 0; + &.bg-image { + .container, .container-fluid { padding: 160px 30px; } + } +} +.section-xl { + padding: 200px 0; + &.bg-image { + .container, .container-fluid { padding: 200px 30px; } + } +} +.section-2xl { + padding: 240px 0; + &.bg-image { + .container, .container-fluid { padding: 240px 30px; } + } +} +@include breakpoint-less(sm) { + .section-xs { + padding: 30px 0; + &.bg-image { + .container, .container-fluid { padding: 30px 30px; } + } + } + .section-sm { + padding: 50px 0; + &.bg-image { + .container, .container-fluid { padding: 50px 30px; } + } + } + .section, .section-md { + padding: 80px 0; + &.bg-image { + .container, .container-fluid { padding: 80px 30px; } + } + } + .section-lg { + padding: 120px 0; + &.bg-image { + .container, .container-fluid { padding: 120px 30px; } + } + } + .section-xl { + padding: 160px 0; + &.bg-image { + .container, .container-fluid { padding: 160px 30px; } + } + } + .section-2xl { + padding: 180px 0; + &.bg-image { + .container, .container-fluid { padding: 180px 30px; } + } + } +} +@include breakpoint-less(xs) { + .section, .section-md { + padding: 70px 0; + &.bg-image { + .container, .container-fluid { padding: 70px 30px; } + } + } + .section-lg { + padding: 100px 0; + &.bg-image { + .container, .container-fluid { padding: 100px 30px; } + } + } + .section-xl { + padding: 140px 0; + &.bg-image { + .container, .container-fluid { padding: 120px 30px; } + } + } + .section-2xl { + padding: 160px 0; + &.bg-image { + .container, .container-fluid { padding: 140px 30px; } + } + } +} +.section-xs, +.section-sm, +.section, .section-md, +.section-lg, +.section-xl, +.section-2xl { + &.bg-image { + padding: 0; + } +} + +.section-fullscreen { + width: 100%; + height: 100vh; + div[class^='bg-black'], div[class*=' bg-black'], + div[class^='bg-white'], div[class*=' bg-white'], + div[class^='bg-dark'], div[class*=' bg-dark'], + div[class^='bg-grey'], div[class*=' bg-grey'], + .container, .container-fluid { + height: 100%; + } +}
\ No newline at end of file diff --git a/assets/css/scss/components/_shop.scss b/assets/css/scss/components/_shop.scss new file mode 100644 index 0000000..2bd5faf --- /dev/null +++ b/assets/css/scss/components/_shop.scss @@ -0,0 +1,323 @@ +// +// Shop styles // +// +.product-box { + .product-img { + position: relative; + @include transform(translate3d(0,0,0)); + overflow: hidden; + .product-img-link { + display: block; + } + img { + @include transform(scale(1)); + @include transition(transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1)); + } + .product-badge-left, .product-badge-right { + position: absolute; + top: 16px; + z-index: 2; + font-size: 14px; + background: $color-black-04; + padding: 8px 11px; + border-radius: 40px; + font: 500 12px $font-family-tertiary; + line-height: 1; + letter-spacing: 1px; + text-transform: uppercase; + * { + color: $color-white; + } + h1,h2,h3,h4,h5,h6 { + margin: 0; + } + &.red { + background: $color-red; + } + &.green { + background: $color-green; + } + } + .product-badge-left { + left: 16px; + } + .product-badge-right { + right: 16px; + } + .add-to-cart { + position: absolute; + right: 16px; + bottom: 16px; + left: 16px; + @include transform(translateY(4px)); + z-index: 2; + visibility: hidden; + opacity: 0; + background: $color-white; + padding: 16px; + text-align: center; + @include transition(ease-out 0.16s); + a { + &:not([class*=' button'], [class^='button']) { + color: $color-primary; + font: 500 13px $font-family-tertiary; + letter-spacing: 1px; + text-transform: uppercase; + &:hover, &:focus { color: $color-dark; } + } + } + } + &:hover, &:focus { + img { + @include transform(scale(1.04)); + } + .add-to-cart { + @include transform(translateY(0)); + visibility: visible; + opacity: 1; + } + } + } + .product-title { + position: relative; + padding: 24px 0 20px; + h1,h2,h3,h4,h5,h6 { + margin-bottom: 4px; + line-height: 1.4; + } + .price { + span { + display: inline-block; + } + del { + opacity: 0.7; + margin-right: 4px; + } + ins { + text-decoration: none; + } + } + } +} + +.product-carousel-thumbnails { + padding: 6px 0 0; + li { + list-style-type: none; + display: inline-block; + margin-right: 2px; + a { + display: inline-block; + opacity: 0.6; + @include transition(ease-out 0.16s); + img { + max-width: 100px; + } + &:hover { + opacity: 1; + } + } + } +} + +.product-price { + del { + opacity: 0.7; + margin-right: 8px; + } + ins { + text-decoration: none; + } +} + +.product-quantity { + .qnt { + position: relative; + display: inline-block; + width: auto; + margin-right: 30px; + input { + width: 100px; + height: 34px; + border: 0; + padding: 0; + text-align: center; + &::-webkit-outer-spin-button, + &::-webkit-inner-spin-button { + display: none; + -webkit-appearance: none; + margin: 0; + } + &[type=number] { + -moz-appearance: textfield; + } + } + .dec, .inc { + position: absolute; + top: 0; + background: $bg-grey; + width: 34px; + height: 34px; + border-radius: 50%; + color: transparent; + text-align: center; + @include transition(linear 0.1s); + &:before { + content: ''; + position: absolute; + top: 50%; + left: 50%; + @include transform(translate(-50%,-50%)); + background: $color-dark; + width: 11px; + height: 1px; + } + &:hover { + background: $button-grey; + } + } + .dec { + left: 0; + } + .inc { + right: 0; + &:after { + content: ''; + position: absolute; + top: 50%; + left: 50%; + @include transform(translate(-50%,-50%)); + background: $color-dark; + width: 1px; + height: 11px; + } + } + } +} +.product-info-box { + border: 1px solid $border-grey; + padding: 40px; + @include breakpoint-less(md) { + padding: 30px; + } + .nav { + justify-content: center; + margin: 0 -15px 30px; + .nav-item { + margin: 0 15px; + .nav-link { + position: relative; + padding: 0 0 1px; + font-weight: 400; + font-family: $font-family-tertiary; + letter-spacing: -0.2px; + &:before { + content: ''; + position: absolute; + right: 0; + bottom: 0; + left: 0; + background: $color-dark; + height: 1px; + @include transition(ease-out 0.24s); + @include animation(button-line-out 0.24s ease-out both); + } + &.active { + color: $color-dark; + &:before { + width: 100%; + @include animation(button-line-in 0.24s ease-out both); + } + } + } + } + } + .table { + margin: 0; + border-collapse: separate; + border-spacing: 0; + border: 0; + font-size: 15px; + tr { + &:first-child { + th, td { + border: 0; + } + } + } + th, td { + border-top: 1px solid $border-grey; + padding: 14px 20px 14px 0; + } + th { + font-weight: $font-weight-regular; + } + td { + color: $color-primary; + } + } +} + +.cart-table { + margin: 0; + border-collapse: separate; + border-spacing: 0; + border: 0; + font-size: 14px; + thead { + th,td { + border-bottom: 1px solid $border-grey; + font-weight: 600; + } + } + th, td { + border-top: 0; + border-bottom: 1px solid $border-grey; + padding: 20px 20px 20px 0; + vertical-align: middle; + } + th { + font-weight: $font-weight-regular; + } + td { + color: $color-primary; + } + .product-thumbnail { + img { + max-width: 100px; + } + } + .product-quantity { + .qnt { + margin: 0; + input { + margin: 0; + } + } + } +} + +.cart-totals { + margin: 0; + border-collapse: separate; + border-spacing: 0; + border: 0; + font-size: 14px; + tr { + &:first-child { + th, td { + border: 0; + } + } + } + th, td { + border-top: 1px solid $border-grey; + padding: 20px 20px 20px 0; + } + th { + font-weight: $font-weight-regular; + } + td { + color: $color-primary; + } +}
\ No newline at end of file diff --git a/assets/css/scss/elements/.DS_Store b/assets/css/scss/elements/.DS_Store Binary files differnew file mode 100644 index 0000000..57a1652 --- /dev/null +++ b/assets/css/scss/elements/.DS_Store diff --git a/assets/css/scss/elements/_accordion.scss b/assets/css/scss/elements/_accordion.scss new file mode 100644 index 0000000..d64a06a --- /dev/null +++ b/assets/css/scss/elements/_accordion.scss @@ -0,0 +1,225 @@ +// +// Accordion styles // +// +.accordion { + list-style-type: none; + padding: 0; + li { + border: 0; + margin-bottom: 8px; + padding: 0; + @include transition(linear 0.1s); + &:last-child { + margin-bottom: 0; + } + .accordion-title { + position: relative; + border: 1px solid $color-black-01; + padding: 14px 24px; + cursor: pointer; + @include transition(linear 0.1s); + &:before, &:after { + content: ''; + position: absolute; + top: 50%; + @include transform(translateY(-50%)); + background: $color-black; + } + &:before { + right: 24px; + width: 11px; + height: 1px; + } + &:after { + right: 29px; + width: 1px; + height: 11px; + @include transition(linear 0.1s); + } + h1,h2,h3,h4,h5,h6 { + margin: 0; + } + * { + @include transition(linear 0.1s); + } + } + .accordion-content { + overflow: hidden; + max-height: 0; + padding: 0 25px; + @include transition(ease-out 0.2s); + &:before { + content: ''; + display: block; + width: 100%; + height: 20px; + } + &:after { + content: ''; + display: block; + width: 100%; + height: 12px; + } + ul, ol { + li { + border: 0; + padding: 0; + &:last-child { + border: 0; + } + } + } + ul { + list-style-type: disc; + ul { list-style-type: circle; } + } + ol { + &.list-ordered { + li { + margin-bottom: 8px; + padding-left: 34px; + &:last-child { + margin: 0; + } + } + } + } + .nav { + list-style-type: none; + } + } + &.active { + .accordion-title { + border-color: $color-black-09; + &:after { + @include transform(translateY(-50%) rotate(-90deg)); + } + } + } + } + // + // Accordion - Style 2 // + // + &.style-2 { + li { + margin-bottom: 14px; + padding: 0; + &:last-child { + margin-bottom: 0; + } + .accordion-title { + border: 0; + border-bottom: 1px solid $color-black-02; + padding: 0 0 10px; + @include transition(linear 0.1s); + &:before, &:after { + margin-top: -6px; + } + &:before { right: 0; } + &:after { right: 5px; } + } + .accordion-content { + padding: 0 20px; + } + &.active { + .accordion-title { + border-bottom-color: $color-black-09; + } + } + } + } + // + // Accordion - Style 3 // + // + &.style-3 { + li { + .accordion-title { + background: $bg-grey-lighter; + border: 0; + } + .accordion-content { + padding: 0 24px; + } + &.active { + .accordion-title { + background: $bg-dark; + color: $color-white-08; + &:before, &:after { + background: $color-white; + } + h1,h2,h3,h4,h5,h6 { + color: $color-white; + } + } + } + } + } + // + // Border Radius // + // + &.border-radius { + &:not(.style-2) { + li { + .accordion-title { + border-radius: 0.375em; + } + } + } + } + &.rounded { + &:not(.style-2) { + li { + .accordion-title { + border-radius: 50px; + } + } + } + } +} +.bg-gray, .bg-light-gray { + .accordion { + &.style-3 { + li { + .accordion-title { + background: $color-white; + } + } + } + } +} +div[class^='bg-black'], div[class*=' bg-black'], div[class^='bg-dark'], div[class*=' bg-dark'] { + .accordion { + li { + .accordion-title { + border-color: $color-white-02; + &:before, &:after { + background: $color-white; + } + } + &.active { + .accordion-title { + border-color: $color-white; + } + } + } + &.style-3 { + li { + .accordion-title { + background: $color-white-01; + } + &.active { + .accordion-title { + background: $color-white; + color: $color-primary; + &:before, &:after { + background: $color-black; + } + h1,h2,h3,h4,h5,h6 { + color: $color-black; + } + } + } + } + } + } +}
\ No newline at end of file diff --git a/assets/css/scss/elements/_box.scss b/assets/css/scss/elements/_box.scss new file mode 100644 index 0000000..218cb15 --- /dev/null +++ b/assets/css/scss/elements/_box.scss @@ -0,0 +1,193 @@ +// +// Box Styles // +// +.box-shadow { + @include box-shadow(0 10px 36px 0 rgba(22,24,26,0.13)); +} +.box-shadow-with-hover { + @include box-shadow(0 10px 36px 0 rgba(22,24,26,0.13)); + @include transition(ease-out 0.16s); + &:hover { + @include box-shadow(0 10px 40px 0 rgba(22,24,26,0.19)); + } +} +.hover-shadow { + @include transition(ease-out 0.16s); + &:hover { + @include box-shadow(0 10px 36px 0 rgba(22,24,26,0.13)); + } +} +.hover-float { + @include transition(ease-out 0.16s); + &:hover { + @include transform(translateY(-4px)); + } +} +.hover-scale { + @include transition(ease-out 0.16s); + &:hover { + @include transform(scale(1.015)); + } +} +.hover-shrink { + @include transition(ease-out 0.16s); + &:hover { + @include transform(scale(0.985)); + } +} + +// +// Square box // +// +div[class^="square-box"], div[class*=" square-box"], +div[class^="circle-box"], div[class*=" circle-box"] { + display: inline-block; + text-align: center; + * { + margin: 0; + vertical-align: middle; + } +} +.square-box-xs { + width: 40px; + height: 40px; + line-height: 40px; + * { + line-height: 40px; + } +} +.square-box-sm { + width: 50px; + height: 50px; + line-height: 50px; + * { + line-height: 50px; + } +} +.square-box, .square-box-md { + width: 60px; + height: 60px; + line-height: 60px; + * { + line-height: 60px; + } +} +.square-box-lg { + width: 70px; + height: 70px; + line-height: 70px; + * { + line-height: 70px; + } +} +.square-box-xl { + width: 80px; + height: 80px; + line-height: 80px; + * { + line-height: 80px; + } +} + +// +// Circle Box // +// +div[class^="circle-box"], div[class*=" circle-box"] { + border-radius: 50%; +} +.circle-box-xs { + width: 40px; + height: 40px; + line-height: 40px; + * { + line-height: 40px; + } +} +.circle-box-sm { + width: 50px; + height: 50px; + line-height: 50px; + * { + line-height: 50px; + } +} +.circle-box, .circle-box-md { + width: 60px; + height: 60px; + line-height: 60px; + * { + line-height: 60px; + } +} +.circle-box-lg { + width: 70px; + height: 70px; + line-height: 70px; + * { + line-height: 70px; + } +} +.circle-box-xl { + width: 80px; + height: 80px; + line-height: 80px; + * { + line-height: 80px; + } +} + +// +// Box border radius // +// +.border-radius, .border-radius-0375 { border-radius: 0.375em; } +.border-radius-025 { border-radius: 0.25em; } +.border-radius-05 { border-radius: 0.5em; } +.border-radius-10 { border-radius: 1em; } +.border-radius-15 { border-radius: 1.5em; } +.border-radius-20 { border-radius: 2em; } +.border-radius-25 { border-radius: 2.5em; } +.border-radius-30 { border-radius: 3em; } + +// +// Move boxes // +// +.move-top-100 { + @include transform(translateY(-100px)); + margin-bottom: -100px; +} +.move-top-90 { + @include transform(translateY(-90px)); + margin-bottom: -90px; +} +.move-top-80 { + @include transform(translateY(-80px)); + margin-bottom: -80px; +} +.move-top-70 { + @include transform(translateY(-70px)); + margin-bottom: -70px; +} +.move-top-60 { + @include transform(translateY(-60px)); + margin-bottom: -60px; +} +.move-top-50 { + @include transform(translateY(-50px)); + margin-bottom: -50px; +} +.move-top-40 { + @include transform(translateY(-40px)); + margin-bottom: -40px; +} +.move-top-30 { + @include transform(translateY(-30px)); + margin-bottom: -30px; +} +.move-top-20 { + @include transform(translateY(-20px)); + margin-bottom: -20px; +} +.move-top-10 { + @include transform(translateY(-10px)); + margin-bottom: -10px; +}
\ No newline at end of file diff --git a/assets/css/scss/elements/_button.scss b/assets/css/scss/elements/_button.scss new file mode 100644 index 0000000..1b4436c --- /dev/null +++ b/assets/css/scss/elements/_button.scss @@ -0,0 +1,1285 @@ +// +// Button styles // +// +a { + color: $color-primary; + @include transition(linear 0.1s); + &:hover { + color: $color-dark; + text-decoration: none; + } +} +button { + background: transparent; + box-shadow: none; + border: 0; + padding: 0; + cursor: pointer; +} +a, button { + &:focus, &:active { + box-shadow: none; + outline: 0; + } +} + +.button { + font: 400 13px $font-family-tertiary; + letter-spacing: 1px; + text-transform: uppercase; +} + +.button { + position: relative; + display: inline-block; + overflow: hidden; + background: $button-grey; + border: 1px solid $button-grey; + padding: 5px 10px; + color: $color-dark; + @include transition(ease-out 0.12s); + i { + margin-right: 8px; + font-size: 15px; + } + &:hover { + color: $color-dark; + } +} + +// +// Template Button - Sizes // +// +.button-xs { padding: 7px 16px; } +.button-sm { padding: 10px 22px; } +.button-md { padding: 14px 34px; } +.button-lg { padding: 16px 42px; } +.button-xl { padding: 18px 50px; } +.button-fullwidth { width: 100%; text-align: center; } + +.button-grey, a.button-grey { + background: $button-grey; + border: 0; + &:hover, &:focus { + background: $button-grey-darker; + color: $color-dark; + } +} +.button-dark, a.button-dark { + background: $button-dark-lighter; + border: 0; + color: $color-white; + &:hover, &:focus { + background: $button-dark; + color: $color-white; + } +} +.button-white, a.button-white { + background: $color-white; + border: 0; + color: $color-dark; + &:hover, &:focus { + background: $color-white-09; + border: 0; + color: $color-dark; + } +} +.button-white-2, a.button-white-2 { + background: $color-white; + border-color: $color-white; + color: $color-dark; + &:hover, &:focus { + background: transparent; + border-color: $color-white; + color: $color-white; + } +} +.button-white-3, a.button-white-3 { + background: $color-white-015; + border: 0; + color: $color-white; + &:hover, &:focus { + background: $color-white-02; + color: $color-white; + } +} + +// +// Template Button - Outline // +// +.button-outline-grey, a.button-outline-grey { + background: transparent; + border-color: $color-black-015; + &:hover, &:focus { + border-color: $button-dark; + color: $color-dark; + } +} +.button-outline-grey-2, a.button-outline-grey-2 { + background: transparent; + border-color: $color-black-015; + &:hover, &:focus { + background: $color-black-01; + border-color: transparent; + color: $color-dark; + } +} +.button-outline-dark, a.button-outline-dark { + background: transparent; + border-color: $button-dark; + &:hover, &:focus { + border-color: $color-black-015; + color: $color-dark; + } +} +.button-outline-dark-2, a.button-outline-dark-2 { + background: transparent; + border-color: $button-dark; + &:hover, &:focus { + background: $button-dark; + border-color: transparent; + color: $color-white; + } +} +.button-outline-white, a.button-outline-white { + background: transparent; + border-color: $color-white-03; + color: $color-white; + &:hover, &:focus { + border-color: $color-white; + color: $color-white; + } +} +.button-outline-white-2, a.button-outline-white-2 { + background: transparent; + border-color: $color-white; + color: $color-white; + &:hover, &:focus { + background: $color-white; + color: $color-dark; + } +} + +// +// Template Button - Outline Fill // +// +a, button { + &[class*=' button-fill-'], &[class^='button-fill-'] { + z-index: 1; + background: transparent; + &:before { + content: ''; + position: absolute; + z-index: -1; + @include transition(all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1)); + } + } +} +.button-fill-left-outline, a.button-fill-left-outline, +.button-fill-top-outline, a.button-fill-top-outline, +.button-fill-right-outline, a.button-fill-right-outline, +.button-fill-bottom-outline, a.button-fill-bottom-outline { + border-color: $button-dark; + &:before { + background: $button-dark; + } + &:hover { + color: $color-white; + } +} +.button-fill-left-outline-white, a.button-fill-left-outline-white, +.button-fill-top-outline-white, a.button-fill-top-outline-white, +.button-fill-right-outline-white, a.button-fill-right-outline-white, +.button-fill-bottom-outline-white, a.button-fill-bottom-outline-white { + border-color: $color-white; + color: $color-white; + &:before { + background: $color-white; + } + &:hover { + color: $color-dark; + } +} +.button-fill-left-outline, a.button-fill-left-outline, +.button-fill-left-outline-white, a.button-fill-left-outline-white { + &:before { + top: 0; + left: 0; + width: 0%; + height: 100%; + } + &:hover { + &:before { + width: 100%; + } + } +} +.button-fill-top-outline, a.button-fill-top-outline, +.button-fill-top-outline-white, a.button-fill-top-outline-white { + &:before { + top: 0; + left: 0; + width: 100%; + height: 0%; + } + &:hover { + &:before { + height: 100%; + } + } +} +.button-fill-right-outline, a.button-fill-right-outline, +.button-fill-right-outline-white, a.button-fill-right-outline-white { + &:before { + top: 0; + right: 0; + width: 0%; + height: 100%; + } + &:hover { + &:before { + width: 100%; + } + } +} +.button-fill-bottom-outline, a.button-fill-bottom-outline, +.button-fill-bottom-outline-white, a.button-fill-bottom-outline-white { + &:before { + bottom: 0; + left: 0; + width: 100%; + height: 0%; + } + &:hover { + &:before { + height: 100%; + } + } +} + +// +// Template Button - Reveal Icon // +// +a, button { + &[class*=' button-reveal'], &[class^='button-reveal'] { + span, i { + @include transition(all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1)); + } + span { + position: relative; + } + i { + position: absolute; + top: 50%; + @include transform(translateY(-50%)); + opacity: 0; + margin: 0; + } + &:hover, &:focus { + i { + opacity: 1; + } + } + } +} +.button-reveal-left-grey, a.button-reveal-left-grey, +.button-reveal-left-dark, a.button-reveal-left-dark, +.button-reveal-left-white, a.button-reveal-left-white { + span { left: 0; } + &:hover, &:focus { + span { left: 12px; } + } +} +.button-reveal-right-grey, a.button-reveal-right-grey, +.button-reveal-right-dark, a.button-reveal-right-dark, +.button-reveal-right-white, a.button-reveal-right-white { + span { right: 0; } + &:hover, &:focus { + span { right: 12px; } + } +} +.button-reveal-left-grey, a.button-reveal-left-grey, +.button-reveal-right-grey, a.button-reveal-right-grey { + background: $button-grey; + border: 0; + &:hover, &:focus { + background: $button-grey-darker; + color: $color-dark; + } +} +.button-reveal-left-dark, a.button-reveal-left-dark, +.button-reveal-right-dark, a.button-reveal-right-dark { + background: $button-dark-lighter; + border: 0; + color: $color-white; + &:hover, &:focus { + background: $button-dark; + color: $color-white; + } +} +.button-reveal-left-white, a.button-reveal-left-white, +.button-reveal-right-white, a.button-reveal-right-white { + background: $color-white; + border: 0; + color: $color-dark; + &:hover, &:focus { + background: $color-white; + color: $color-dark; + } +} + +.button-xs { + &.button-reveal-left-grey, + &.button-reveal-left-dark, + &.button-reveal-left-white { + i { left: 10px; } + &:hover, &:focus { + i { left: 0; } + } + } + &.button-reveal-right-grey, + &.button-reveal-right-dark, + &.button-reveal-right-white { + i { right: 10px; } + &:hover, &:focus { + i { right: 0; } + } + } +} +.button-sm { + &.button-reveal-left-grey, + &.button-reveal-left-dark, + &.button-reveal-left-white { + i { left: 20px; } + &:hover, &:focus { + i { left: 10px; } + } + } + &.button-reveal-right-grey, + &.button-reveal-right-dark, + &.button-reveal-right-white { + i { right: 20px; } + &:hover, &:focus { + i { right: 10px; } + } + } +} +.button-md { + &.button-reveal-left-grey, + &.button-reveal-left-dark, + &.button-reveal-left-white { + i { left: 30px; } + &:hover, &:focus { + i { left: 18px; } + } + } + &.button-reveal-right-grey, + &.button-reveal-right-dark, + &.button-reveal-right-white { + i { right: 30px; } + &:hover, &:focus { + i { right: 18px; } + } + } +} +.button-lg { + &.button-reveal-left-grey, + &.button-reveal-left-dark, + &.button-reveal-left-white { + i { left: 40px; } + &:hover, &:focus { + i { left: 28px; } + } + } + &.button-reveal-right-grey, + &.button-reveal-right-dark, + &.button-reveal-right-white { + i { right: 40px; } + &:hover, &:focus { + i { right: 28px; } + } + } +} +.button-xl { + &.button-reveal-left-grey, + &.button-reveal-left-dark, + &.button-reveal-left-white { + i { left: 50px; } + &:hover, &:focus { + i { left: 38px; } + } + } + &.button-reveal-right-grey, + &.button-reveal-right-dark, + &.button-reveal-right-white { + i { right: 50px; } + &:hover, &:focus { + i { right: 38px; } + } + } +} + +// +// Template Button - Reveal Icon Outline // +// +.button-reveal-left-outline-grey, a.button-reveal-left-outline-grey, +.button-reveal-right-outline-grey, a.button-reveal-right-outline-grey { + background: transparent; + border-color: $color-black-015; + &:hover, &:focus { + border-color: $button-dark; + color: $color-dark; + } +} +.button-reveal-left-outline-grey, a.button-reveal-left-outline-grey, +.button-reveal-left-outline-dark, a.button-reveal-left-outline-dark, +.button-reveal-left-outline-white, a.button-reveal-left-outline-white { + span { left: 0; } + &:hover, &:focus { + span { left: 12px; } + } +} +.button-reveal-right-outline-grey, a.button-reveal-right-outline-grey, +.button-reveal-right-outline-dark, a.button-reveal-right-outline-dark, +.button-reveal-right-outline-white, a.button-reveal-right-outline-white { + span { right: 0; } + &:hover, &:focus { + span { right: 12px; } + } +} +.button-reveal-left-outline-dark, a.button-reveal-left-outline-dark, +.button-reveal-right-outline-dark, a.button-reveal-right-outline-dark { + background: transparent; + border-color: $button-dark; + &:hover, &:focus { + border-color: $color-black-015; + color: $color-dark; + } +} +.button-reveal-left-outline-white, a.button-reveal-left-outline-white, +.button-reveal-right-outline-white, a.button-reveal-right-outline-white { + background: transparent; + border-color: $color-white-03; + color: $color-white; + &:hover, &:focus { + border-color: $color-white; + color: $color-white; + } +} + +.button-xs { + &.button-reveal-left-outline-grey, + &.button-reveal-left-outline-dark, + &.button-reveal-left-outline-white { + i { left: 10px; } + &:hover, &:focus { + i { left: 0; } + } + } + &.button-reveal-right-outline-grey, + &.button-reveal-right-outline-dark, + &.button-reveal-right-outline-white { + i { right: 10px; } + &:hover, &:focus { + i { right: 0; } + } + } +} +.button-sm { + &.button-reveal-left-outline-grey, + &.button-reveal-left-outline-dark, + &.button-reveal-left-outline-white { + i { left: 20px; } + &:hover, &:focus { + i { left: 10px; } + } + } + &.button-reveal-right-outline-grey, + &.button-reveal-right-outline-dark, + &.button-reveal-right-outline-white { + i { right: 20px; } + &:hover, &:focus { + i { right: 10px; } + } + } +} +.button-md { + &.button-reveal-left-outline-grey, + &.button-reveal-left-outline-dark, + &.button-reveal-left-outline-white { + i { left: 30px; } + &:hover, &:focus { + i { left: 18px; } + } + } + &.button-reveal-right-outline-grey, + &.button-reveal-right-outline-dark, + &.button-reveal-right-outline-white { + i { right: 30px; } + &:hover, &:focus { + i { right: 18px; } + } + } +} +.button-lg { + &.button-reveal-left-outline-grey, + &.button-reveal-left-outline-dark, + &.button-reveal-left-outline-white { + i { left: 40px; } + &:hover, &:focus { + i { left: 28px; } + } + } + &.button-reveal-right-outline-grey, + &.button-reveal-right-outline-dark, + &.button-reveal-right-outline-white { + i { right: 40px; } + &:hover, &:focus { + i { right: 28px; } + } + } +} +.button-xl { + &.button-reveal-left-outline-grey, + &.button-reveal-left-outline-dark, + &.button-reveal-left-outline-white { + i { left: 50px; } + &:hover, &:focus { + i { left: 38px; } + } + } + &.button-reveal-right-outline-grey, + &.button-reveal-right-outline-dark, + &.button-reveal-right-outline-white { + i { right: 50px; } + &:hover, &:focus { + i { right: 38px; } + } + } +} + + +// +// Fancy buttons // +// +a, button { + &[class*=' button-fancy-1'], &[class^='button-fancy-1'] { + z-index: 1; + overflow: visible; + background: transparent; + border: 0; + &:before { + content: ''; + position: absolute; + top: 0; + left: 0; + @include transform(scaleY(1)); + z-index: -1; + opacity: 1; + width: 100%; + height: 100%; + @include transition(all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1)); + } + &:after { + content: ''; + position: absolute; + top: 0; + left: 0; + @include transform(scaleY(0.2)); + opacity: 0; + width: 100%; + height: 100%; + border: 1px solid $color-black-09; + @include transition(all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1)); + } + &:hover { + &:before { + @include transform(scaleY(0.2)); + opacity: 0; + } + &:after { + @include transform(scaleY(1)); + opacity: 1; + } + } + } +} +.button-fancy-1, a.button-fancy-1 { + &:before { + background: $button-grey; + } +} +.button-fancy-1-dark, a.button-fancy-1-dark { + color: $color-white; + &:before { + background: $button-dark; + } +} +.button-fancy-1-white, a.button-fancy-1-white { + color: $color-dark; + &:before { + background: $color-white; + } + &:after { + border-color: $color-white; + } + &:hover { + color: $color-white; + } +} +.button-fancy-1-outline, a.button-fancy-1-outline { + &:before { + border: 1px solid $color-black-015; + } + &:after { + z-index: -1; + background: $color-dark; + border: 0; + } + &:hover { + color: $color-white; + } +} +.button-fancy-1-outline-dark, a.button-fancy-1-outline-dark { + &:before { + border: 1px solid $color-black-09; + } + &:after { + z-index: -1; + background: $color-dark; + } + &:hover { + color: $color-white; + } +} +.button-fancy-1-outline-white, a.button-fancy-1-outline-white { + color: $color-white; + &:before { + border: 1px solid $color-white-09; + } + &:after { + z-index: -1; + background: $color-white; + } + &:hover { + color: $color-dark; + } +} + +a, button { + &[class*=' button-fancy-2'], &[class^='button-fancy-2'] { + z-index: 1; + overflow: visible; + background: transparent; + border: 0; + &:before { + content: ''; + position: absolute; + top: 0; + left: 0; + @include transform(scaleX(1)); + z-index: -1; + opacity: 1; + width: 100%; + height: 100%; + @include transition(all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1)); + } + &:after { + content: ''; + position: absolute; + top: 0; + left: 0; + @include transform(scaleX(0.6)); + opacity: 0; + width: 100%; + height: 100%; + border: 1px solid $color-black-09; + border-right: 0; + border-left: 0; + @include transition(all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1)); + } + &:hover { + &:before { + @include transform(scaleX(0.6)); + opacity: 0; + } + &:after { + @include transform(scaleX(1)); + opacity: 1; + } + } + } +} +.button-fancy-2, a.button-fancy-2 { + &:before { + background: $button-grey; + } +} +.button-fancy-2-dark, a.button-fancy-2-dark { + color: $color-white; + &:before { + background: $button-dark; + } +} +.button-fancy-2-white, a.button-fancy-2-white { + color: $color-dark; + &:before { + background: $color-white; + } + &:after { + border-color: $color-white; + } + &:hover { + color: $color-white; + } +} +.button-fancy-2-outline, a.button-fancy-2-outline { + &:before { + border: 1px solid $color-black-015; + } +} +.button-fancy-2-outline-white, a.button-fancy-2-outline-white { + color: $color-white; + &:before { + border: 1px solid $color-white-02; + } + &:after { + border-color: $color-white; + } + &:hover { + color: $color-white; + } +} + + +// +// Text Buttons // +// +.button-text-1, +.button-text-2, +.button-text-3 { + position: relative; + display: inline-block; + color: $color-black; + font-family: $font-family-tertiary; + letter-spacing: -0.2px; +} +.button-text-1 { + &:before { + content: ''; + position: absolute; + bottom: -1px; + left: 0; + background: $color-black-02; + width: 100%; + height: 1px; + } + &:after { + content: ''; + position: absolute; + right: 0; + bottom: -1px; + left: 0; + background: $color-black; + height: 1px; + @include animation(button-line-out 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both); + } + &:hover { + &:after { + width: 100%; + @include animation(button-line-in 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both); + } + } +} +.button-text-2 { + &:before { + content: ''; + position: absolute; + top: 40%; + right: 0; + left: 0; + background: $color-black-02; + height: 40%; + @include animation(button-line-out 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both); + } + &:after { + content: ''; + position: absolute; + bottom: -1px; + right: 0; + left: 0; + background: $color-black; + height: 1px; + @include animation(button-line-in 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both); + } + &:hover { + &:before { @include animation(button-line-in 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both); } + &:after { @include animation(button-line-out 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both); } + } +} +.button-text-3 { + padding-left: 30px; + @include transition(all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1)); + &:before { + content: ''; + position: absolute; + top: 50%; + left: 0; + @include transform(translateY(-50%)); + background: $color-black; + width: 20px; + height: 1px; + @include transition(all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1)); + } + &:hover { + padding-left: 40px; + &:before { + width: 30px; + } + } +} +@-webkit-keyframes button-line-out { + 0% { + @include transform(scaleX(1)); + @include transform-origin(100% 50%); + } + 100% { + @include transform(scaleX(0)); + @include transform-origin(100% 50%); + } +} +@keyframes button-line-out { + 0% { + @include transform(scaleX(1)); + @include transform-origin(100% 50%); + } + 100% { + @include transform(scaleX(0)); + @include transform-origin(100% 50%); + } +} +@-webkit-keyframes button-line-in { + 0% { + @include transform(scaleX(0)); + @include transform-origin(0 50%); + } + 100% { + @include transform(scale(1)); + @include transform-origin(0 50%); + } +} +@keyframes button-line-in { + 0% { + @include transform(scaleX(0)); + @include transform-origin(0 50%); + } + 100% { + @include transform(scale(1)); + @include transform-origin(0 50%); + } +} + +div[class^='bg-dark'], div[class*=' bg-dark'], div[class^='bg-black'], div[class*=' bg-black'] { + .button-text-1, + .button-text-2, + .button-text-3 { + color: $color-white-08; + &:hover { + color: $color-white; + } + } + .button-text-1 { + &:before { background: $color-white-03; } + &:after { background: $color-white; } + } + .button-text-2 { + &:before { background: $color-white-04; } + &:after { background: $color-white; } + } + .button-text-3 { + &:before { background: $color-white-08; } + &:hover { + &:before { background: $color-white; } + } + } +} + + +// +// Template Circle Button // +// +.button-circle, a.button-circle { + background: $button-grey; + display: inline-block; + border: 1px solid $button-grey; + border-radius: 50%; + color: $color-dark; + text-align: center; + @include transition(ease-out 0.12s); + &:hover { + color: $color-primary; + } +} + + +// +// Template Circle Button - Sizes // +// +.button-circle-xs { + width: 32px; + height: 32px; + line-height: 32px; + i { line-height: 32px; } +} +.button-circle-sm { + width: 40px; + height: 40px; + line-height: 40px; + i { line-height: 40px; } +} +.button-circle-md { + width: 50px; + height: 50px; + line-height: 50px; + i { line-height: 50px; } +} +.button-circle-lg { + width: 60px; + height: 60px; + line-height: 60px; + i { line-height: 60px; } +} +.button-circle-xl { + width: 70px; + height: 70px; + line-height: 70px; + i { line-height: 70px; } +} + + +// +// Template Circle Button - Hover Slide // +// +.button-circle-hover-slide { + position: relative; + display: inline-block; + overflow: hidden; + i { + position: absolute; + left: 50%; + &:first-child { + top: 50%; + @include transform(translateX(-50%) translateY(-50%)); + } + &:last-child { + top: 100%; + @include transform(translateX(-50%)); + } + } + &:hover { + i { + &:first-child { + @include animation(button-slide-out 0.24s ease-out both); + } + &:last-child { + @include animation(button-slide-in 0.24s ease-out both); + } + } + } +} +@-webkit-keyframes button-slide-out { + 0% { + top: 50%; + @include transform(translateX(-50%) translateY(-50%)); + opacity: 1; + } + 100% { + top: -100%; + @include transform(translateX(-50%) translateY(0)); + opacity: 0; + } +} +@keyframes button-slide-out { + 0% { + top: 50%; + @include transform(translateX(-50%) translateY(-50%)); + opacity: 1; + } + 100% { + top: -100%; + @include transform(translateX(-50%) translateY(0)); + opacity: 0; + } +} +@-webkit-keyframes button-slide-in { + 0% { + top: 100%; + @include transform(translateX(-50%)); + opacity: 0; + } + 100% { + top: 50%; + @include transform(translateX(-50%) translateY(-50%)); + opacity: 1; + } +} +@keyframes button-slide-in { + 0% { + top: 100%; + @include transform(translateX(-50%)); + opacity: 0; + } + 100% { + top: 50%; + @include transform(translateX(-50%) translateY(-50%)); + opacity: 1; + } +} + + +// +// Template Circle Button // +// +.button-circle-grey, a.button-circle-grey { + background: $button-grey; + border: 0; + &:hover, &:focus { + background: $button-grey-darker; + color: $color-dark; + } +} +.button-circle-dark, a.button-circle-dark { + background: $button-dark-lighter; + border: 0; + color: $color-white; + &:hover, &:focus { + background: $button-dark; + color: $color-white; + } +} +.button-circle-white, a.button-circle-white { + background: $color-white; + border: 0; + color: $color-dark; + &:hover, &:focus { + background: $color-white-09; + color: $color-dark; + } +} +.button-circle-white-2, a.button-circle-white-2 { + background: $color-white; + border-color: $color-white; + color: $color-dark; + &:hover, &:focus { + background: transparent; + border-color: $color-white; + color: $color-white; + } +} +.button-circle-white-3, a.button-circle-white-3 { + background: $color-white-015; + border: 0; + color: $color-white; + &:hover, &:focus { + background: $color-white-02; + color: $color-white; + } +} + + +// +// Template Circle Button - Outline // +// +.button-circle-outline-grey, a.button-circle-outline-grey { + background: transparent; + border-color: $color-black-015; + &:hover, &:focus { + border-color: $button-dark; + color: $color-dark; + } +} +.button-circle-outline-grey-2, a.button-circle-outline-grey-2 { + background: transparent; + border-color: $color-black-015; + &:hover, &:focus { + background: $color-black-015; + border-color: transparent; + color: $color-dark; + } +} +.button-circle-outline-dark, a.button-circle-outline-dark { + background: transparent; + border-color: $button-dark; + &:hover, &:focus { + border-color: $color-black-015; + color: $color-dark; + } +} +.button-circle-outline-dark-2, a.button-circle-outline-dark-2 { + background: transparent; + border-color: $button-dark; + &:hover, &:focus { + background: $button-dark; + border-color: transparent; + color: $color-white; + } +} +.button-circle-outline-white, a.button-circle-outline-white { + background: transparent; + border-color: $color-white-03; + color: $color-white; + &:hover, &:focus { + border-color: $color-white; + color: $color-white; + } +} +.button-circle-outline-white-2, a.button-circle-outline-white-2 { + background: transparent; + border-color: $color-white; + color: $color-white; + &:hover, &:focus { + background: $color-white; + color: $color-dark; + } +} + + +// +// Button Animations // +// +.button-circle-animation-drop { + position: relative; + &:before { + content: ''; + position: absolute; + top: 50%; + left: 50%; + @include transform(translate(-50%, -50%)); + opacity: 1; + width: 100%; + height: 100%; + border: 2px solid $color-black-01; + border-radius: 50%; + @include animation(button-drop 2s ease-out infinite); + } + &.button-circle-dark { + &:before { + border-color: $color-black-015; + } + } + &.button-circle-white, &.button-circle-white-2, &.button-circle-white-3 { + &:before { + border-color: $color-white-04; + } + } + &.button-circle-outline-white, &.button-circle-outline-white-2 { + &:before { + border-color: $color-white-03; + } + } +} +@-webkit-keyframes button-drop { + 0% { + opacity: 1; + width: 100%; + height: 100%; + } + 60% { + opacity: 0; + width: 160%; + height: 160%; + } + 100% { + opacity: 0; + width: 100%; + height: 100%; + } +} +@keyframes button-drop { + 0% { + opacity: 1; + width: 100%; + height: 100%; + } + 60% { + opacity: 0; + width: 160%; + height: 160%; + } + 100% { + opacity: 0; + width: 100%; + height: 100%; + } +} + +// +// Buttons Font Styles // +// +.button-font-2 { + font-size: 14px; + letter-spacing: -0.2px; + text-transform: none; +} + +// +// Template Button - Radius // +// +.button-radius { + border-radius: 0.375em; +} +.button-rounded { + border-radius: 50px; +} + +// +// Template Button - Border // +// +.button-border-2, +.button-border-2.button-circle { + border-width: 2px; +} + +// +// Template Button Hover - Float // +// +.button-hover-float, a.button-hover-float { + &:hover, &:focus { + @include transform(translateY(-3px)); + } +} +// +// Template Button Hover - Scale // +// +.button-hover-scale, a.button-hover-scale { + &:hover, &:focus { + @include transform(scale(1.03)); + } + &.button-circle { + &:hover, &:focus { + @include transform(scale(1.04)); + } + } +} +// +// Template Button Hover - Shrink // +// +.button-hover-shrink, a.button-hover-shrink { + &:hover, &:focus { + @include transform(scale(0.97)); + } + &.button-circle { + &:hover, &:focus { + @include transform(scale(0.96)); + } + } +} +// +// Template Button - Shadow // +// +.button-shadow, a.button-shadow { + @include box-shadow(0 6px 30px 0 rgba(22,24,26,0.13)); + &:hover, &:focus { + @include box-shadow(0 6px 36px 0 rgba(22,24,26,0.19)); + } +}
\ No newline at end of file diff --git a/assets/css/scss/elements/_clients.scss b/assets/css/scss/elements/_clients.scss new file mode 100644 index 0000000..0b8cfb6 --- /dev/null +++ b/assets/css/scss/elements/_clients.scss @@ -0,0 +1,132 @@ +// +// Clients Styles // +// +.client-box { + text-align: center; + a { + img { + opacity: 0.4; + @include transition(ease-out 0.16s); + } + &:hover, &:focus { + img { + opacity: 1; + } + } + } +} +.owl-carousel { + .client-box { + img { display: inline-block; } + } +} +// +// Clients Grid // +// +.clients-grid { + list-style-type: none; + overflow: hidden; + margin: 0; + padding: 0; + text-align: center; + li { + position: relative; + float: left; + width: 16.6%; + margin: 0; + padding: 30px; + &:before, &:after { + content: ''; + position: absolute; + } + &:before { + top: 0; + left: -1px; + height: 100%; + border-left: 1px dashed $color-black-01; + } + &:after { + left: 0; + bottom: -1px; + width: 100%; + border-bottom: 1px dashed $color-black-01; + } + a { + img { + opacity: 0.4; + @include transition(ease-out 0.16s); + } + &:hover, &:focus { + img { + opacity: 1; + } + } + } + } + @include breakpoint-less(md) { + li { width: 25%; } + } + @include breakpoint-less(sm) { + li { width: 33.3%; } + } + @include breakpoint-less(xs) { + li { width: 50%; } + } + &.column-5 { + li { width: 20%; } + @include breakpoint-less(md) { + li { width: 25%; } + } + @include breakpoint-less(sm) { + li { width: 33.3%; } + } + @include breakpoint-less(xs) { + li { width: 50%; } + } + } + &.column-4 { + li { width: 25%; } + @include breakpoint-less(sm) { + li { width: 33.3%; } + } + @include breakpoint-less(xs) { + li { width: 50%; } + } + } + &.column-3 { + li { width: 33.3%; } + @include breakpoint-less(sm) { + li { width: 50%; } + } + } + &.column-2 { + li { width: 50%; } + } + // + // Border Style - Solid // + // + &.border-style-solid { + border: 0; + li { + &:before { border-left-style: solid; } + &:after { border-bottom-style: solid; } + } + } + // + // Border Style - Dotted // + // + &.border-style-dotted { + border: 0; + li { + &:before { border-left-style: dotted; } + &:after { border-bottom-style: dotted; } + } + } +} +div[class^='bg-black'], div[class*=' bg-black'], div[class^='bg-dark'], div[class*=' bg-dark'] { + .clients-grid { + li { + &:before, &:after { border-color: $color-white-02; } + } + } +}
\ No newline at end of file diff --git a/assets/css/scss/elements/_contact-form.scss b/assets/css/scss/elements/_contact-form.scss new file mode 100644 index 0000000..c206e2b --- /dev/null +++ b/assets/css/scss/elements/_contact-form.scss @@ -0,0 +1,16 @@ +// +// Contact Form Styles // +// +.submit-result { + span { + display: none; + @include transition(ease-out 0.2s); + &.show-result { + margin-top: 30px; + display: block; + } + &#success { color: $color-green; } + &#error { color: $color-red; } + .error-color { background: rgba(255, 0, 0, 0.1); } + } +}
\ No newline at end of file diff --git a/assets/css/scss/elements/_countdown.scss b/assets/css/scss/elements/_countdown.scss new file mode 100644 index 0000000..b3c4640 --- /dev/null +++ b/assets/css/scss/elements/_countdown.scss @@ -0,0 +1,10 @@ +// +// Countdown Styles // +// +.countdown { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + div { width: 25%; } +}
\ No newline at end of file diff --git a/assets/css/scss/elements/_divider.scss b/assets/css/scss/elements/_divider.scss new file mode 100644 index 0000000..c9b3fcb --- /dev/null +++ b/assets/css/scss/elements/_divider.scss @@ -0,0 +1,241 @@ +// +// Divider Style // +// +hr { + background: $color-black-01; + height: 1px; + border: 0; + margin-right: 0; + margin-left: 0; +} +.text-center { + hr { + margin-right: auto; + margin-left: auto; + } +} +.text-right { + hr { + margin-left: auto; + } +} + +// +// Divider - Width // +// +.divider-width-10px { + hr { width: 10px; } +} +.divider-width-20px { + hr { width: 20px; } +} +.divider-width-30px { + hr { width: 30px; } +} +.divider-width-40px { + hr { width: 40px; } +} +.divider-width-50px { + hr { width: 50px; } +} +.divider-width-60px { + hr { width: 60px; } +} +.divider-width-70px { + hr { width: 70px; } +} + +// +// Divider - Height // +// +.divider-height-2px { + hr { height: 2px; } +} +.divider-height-3px { + hr { height: 3px; } +} + +// +// Divider on dark // +// +div[class^='bg-black'], div[class*=' bg-black'], div[class^='bg-dark'], div[class*=' bg-dark'] { + hr { background: $color-white-01; } +} + +// +// Divider - Dots // +// +.divider-dots { + span { + display: inline-block; + background: $color-black-01; + width: 6px; + height: 6px; + margin-right: 8px; + border-radius: 50%; + &:last-child { + margin-right: 0; + } + } + // + // Sizes // + // + &.divider-dots-sm { + span { + width: 4px; + height: 4px; + margin-right: 6px; + &:last-child { + margin-right: 0; + } + } + } + &.divider-dots-lg { + span { + width: 8px; + height: 8px; + margin-right: 10px; + &:last-child { + margin-right: 0; + } + } + } +} +div[class^='bg-black'], div[class*=' bg-black'], div[class^='bg-dark'], div[class*=' bg-dark'] { + .divider-dots { + span { + background: $color-white-01; + } + } +} + +// +// Divider - ZigZag // +// +.divider-zigzag { + height: 16px; + span { + position: relative; + display: inline-block; + width: 17px; + height: 16px; + margin-right: -3px; + &:before, &:after { + content: ''; + position: absolute; + top: 50%; + @include transform(translateY(-50%)); + background: $color-black-02; + width: 10px; + height: 1px; + } + &:before { + left: 0; + @include transform(rotate(45deg)); + } + &:after { + right: 0; + @include transform(rotate(-45deg)); + } + &:last-child { + margin-right: 0; + } + } + // + // Sizes // + // + &.divider-zigzag-sm { + height: 14px; + span { + width: 12px; + height: 14px; + margin-right: -2px; + &:before, &:after { + width: 7px; + } + &:last-child { + margin-right: 0; + } + } + } + &.divider-zigzag-lg { + height: 18px; + span { + width: 24px; + height: 18px; + margin-right: -4px; + &:before, &:after { + width: 14px; + } + &:last-child { + margin-right: 0; + } + } + } +} + +// +// ZigZag Colors // +// +.divider-zigzag { + &.divider-zigzag-color-black { + span { &:before, &:after { background: $color-black; } } + } + &.divider-zigzag-color-black-09 { + span { &:before, &:after { background: $color-black-09; } } + } + &.divider-zigzag-color-black-08 { + span { &:before, &:after { background: $color-black-08; } } + } + &.divider-zigzag-color-black-07 { + span { &:before, &:after { background: $color-black-07; } } + } + &.divider-zigzag-color-black-06 { + span { &:before, &:after { background: $color-black-06; } } + } + &.divider-zigzag-color-black-05 { + span { &:before, &:after { background: $color-black-05; } } + } + &.divider-zigzag-color-black-04 { + span { &:before, &:after { background: $color-black-04; } } + } + &.divider-zigzag-color-black-03 { + span { &:before, &:after { background: $color-black-03; } } + } + &.divider-zigzag-color-black-02 { + span { &:before, &:after { background: $color-black-02; } } + } + &.divider-zigzag-color-black-01 { + span { &:before, &:after { background: $color-black-01; } } + } + &.divider-zigzag-color-white { + span { &:before, &:after { background: $color-white; } } + } + &.divider-zigzag-color-white-09 { + span { &:before, &:after { background: $color-white-09; } } + } + &.divider-zigzag-color-white-08 { + span { &:before, &:after { background: $color-white-08; } } + } + &.divider-zigzag-color-white-07 { + span { &:before, &:after { background: $color-white-07; } } + } + &.divider-zigzag-color-white-06 { + span { &:before, &:after { background: $color-white-06; } } + } + &.divider-zigzag-color-white-05 { + span { &:before, &:after { background: $color-white-05; } } + } + &.divider-zigzag-color-white-04 { + span { &:before, &:after { background: $color-white-04; } } + } + &.divider-zigzag-color-white-03 { + span { &:before, &:after { background: $color-white-03; } } + } + &.divider-zigzag-color-white-02 { + span { &:before, &:after { background: $color-white-02; } } + } + &.divider-zigzag-color-white-01 { + span { &:before, &:after { background: $color-white-01; } } + } +}
\ No newline at end of file diff --git a/assets/css/scss/elements/_feature-box.scss b/assets/css/scss/elements/_feature-box.scss new file mode 100644 index 0000000..99377b6 --- /dev/null +++ b/assets/css/scss/elements/_feature-box.scss @@ -0,0 +1,177 @@ +// +// Feature box // +// +.feature-box { + @include display-flex; + flex-wrap: wrap; + align-items: center; + position: relative; + min-height: 50px; + padding-left: 74px; + @include breakpoint-less(md) { + padding-left: 66px; + } + .feature-box-icon { + position: absolute; + top: 0; + left: 0; + background: $button-grey; + width: 50px; + height: 50px; + border-radius: 50%; + text-align: center; + @include transition(ease-out 0.16s); + * { + margin: 0; + line-height: 50px; + vertical-align: middle; + color: $color-black-09; + @include transition(ease-out 0.16s); + } + a { + display: block; + } + // + // Positions // + // + &.middle { + top: 50%; + @include transform(translateY(-50%)); + } + } + h1,h2,h3,h4,h5,h6 { + width: 100%; + } + &:hover { + .feature-box-icon { + background: $button-grey-darker; + } + } + // + // Sizes // + // + &.feature-box-xl { + min-height: 70px; + padding-left: 94px; + @include breakpoint-less(md) { + padding-left: 86px; + } + .feature-box-icon { + width: 70px; + height: 70px; + * { + line-height: 70px; + } + } + } + &.feature-box-lg { + min-height: 60px; + padding-left: 84px; + @include breakpoint-less(md) { + padding-left: 80px; + } + .feature-box-icon { + width: 60px; + height: 60px; + * { + line-height: 60px; + } + } + } + &.feature-box-sm { + min-height: 40px; + padding-left: 64px; + @include breakpoint-less(md) { + padding-left: 56px; + } + .feature-box-icon { + width: 40px; + height: 40px; + * { + line-height: 40px; + } + } + } + &.feature-box-xs { + min-height: 32px; + padding-left: 54px; + @include breakpoint-less(md) { + padding-left: 48px; + } + .feature-box-icon { + width: 32px; + height: 32px; + * { + line-height: 32px; + } + } + } + // + // Colors // + // + &.dark { + .feature-box-icon { + background: $button-dark-lighter; + * { + color: $color-white-09; + } + } + &:hover { + .feature-box-icon { + background: $button-dark; + } + } + } + &.white { + .feature-box-icon { + background: $color-white; + } + &:hover { + .feature-box-icon { + background: $color-white-09; + } + } + } + &.outline-gray, &.outline-grey { + .feature-box-icon { + background: transparent; + border: 1px solid $button-grey; + } + &:hover { + .feature-box-icon { + background: $button-grey; + } + } + } + &.outline-dark { + .feature-box-icon { + background: transparent; + border: 1px solid $color-black-08; + } + &:hover { + .feature-box-icon { + background: $color-dark; + * { + color: $color-white; + } + } + } + } + &.outline-white { + .feature-box-icon { + background: transparent; + border: 1px solid $color-white-09; + * { + color: $color-white-09; + } + } + &:hover { + .feature-box-icon { + background: $color-white; + * { + color: $color-dark; + } + } + } + } +}
\ No newline at end of file diff --git a/assets/css/scss/elements/_hoverbox.scss b/assets/css/scss/elements/_hoverbox.scss new file mode 100644 index 0000000..1ae5c01 --- /dev/null +++ b/assets/css/scss/elements/_hoverbox.scss @@ -0,0 +1,482 @@ +// +// Hover box Styles // +// +div[class^="hoverbox"] { + overflow: hidden; + position: relative; + @include transform(translate3d(0,0,0)); + display: inline-block; + img { + @include transition(transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1)); + } +} + +// +// Hover box - Style 1, 2 // +// +.hoverbox-1, +.hoverbox-2 { + &:before { + content: ''; + position: absolute; + top: 0; + left: 0; + z-index: 1; + visibility: hidden; + opacity: 0; + background: $color-black-05; + width: 100%; + height: 100%; + @include transition(ease-out 0.12s); + } + .hover-content { + position: absolute; + z-index: 2; + visibility: hidden; + opacity: 0; + color: $color-white-07; + @include transition(ease-out 0.12s); + h1,h2,h3,h4,h5,h6 { + color: $color-white; + } + } + &:hover, &:focus { + &:before { + visibility: visible; + opacity: 1; + } + img { + @include transform(scale(1.04)); + } + .hover-content { + visibility: visible; + opacity: 1; + } + } +} +.hoverbox-1 { + .hover-content { + top: 50%; + right: 0; + left: 0; + @include transform(translateY(-50%)); + width: 100%; + margin-top: 5px; + padding: 0 30px; + + } + &:hover, &:focus { + .hover-content { + margin-top: 0; + } + } +} +.hoverbox-2 { + .hover-content { + right: 0; + bottom: 0; + left: 0; + @include transform(translateY(5px)); + width: 100%; + padding: 30px; + } + &:hover, &:focus { + .hover-content { + @include transform(translateY(0)); + } + } +} + +// +// Hover box - Style 3 // +// +.hoverbox-3 { + &:before { + content: ''; + position: absolute; + top: 16px; + right: 16px; + bottom: 16px; + left: 16px; + @include transform(scale(0.99)); + z-index: 1; + visibility: hidden; + opacity: 0; + background: $color-white; + @include transition(ease-out 0.12s); + } + .hover-content { + position: absolute; + top: 50%; + right: 16px; + left: 16px; + @include transform(translateY(-50%)); + z-index: 2; + visibility: hidden; + opacity: 0; + margin-top: 4px; + padding: 0 30px; + @include transition(ease-out 0.12s); + @include breakpoint-less(md) { + padding: 0 20px; + } + } + &:hover, &:focus { + &:before { + @include transform(scale(1)); + visibility: visible; + opacity: 1; + } + img { + @include transform(scale(1.04)); + } + .hover-content { + visibility: visible; + opacity: 1; + margin-top: 0; + } + } +} + +// +// Hover box - Style 4 // +// +.hoverbox-4 { + .hover-content { + position: absolute; + right: 16px; + bottom: 16px; + left: 16px; + @include transform(translateY(4px)); + z-index: 1; + visibility: hidden; + opacity: 0; + background: $color-white; + padding: 30px; + @include transition(ease-out 0.12s); + @include breakpoint-less(md) { + padding: 20px; + } + } + &:hover, &:focus { + img { + @include transform(scale(1.04)); + } + .hover-content { + @include transform(translateY(0)); + visibility: visible; + opacity: 1; + } + } +} + +// +// Hover box - Style 5, 6 // +// +.hoverbox-5, +.hoverbox-6 { + &:after { + content: ''; + position: absolute; + top: 0; + left: 0; + background: $color-black-04; + width: 100%; + height: 100%; + @include transition(ease-out 0.12s); + } + .content, + .hover-content { + position: absolute; + z-index: 1; + color: $color-white-07; + @include transition(ease-out 0.12s); + h1,h2,h3,h4,h5,h6 { + color: $color-white; + } + } + .hover-content { + visibility: hidden; + opacity: 0; + } + &:hover, &:focus { + &:after { + background: $color-black-05; + } + img { + @include transform(scale(1.04)); + } + .content { + visibility: hidden; + opacity: 0; + } + .hover-content { + visibility: visible; + opacity: 1; + } + } +} +.hoverbox-5 { + .content, + .hover-content { + top: 50%; + left: 0; + @include transform(translateY(-50%)); + width: 100%; + padding: 0 30px; + } + .hover-content { + margin-top: 5px; + } + &:hover, &:focus { + .content { + margin-top: -5px; + } + .hover-content { + margin-top: 0; + } + } +} +.hoverbox-6 { + .content, + .hover-content { + bottom: 0; + left: 0; + width: 100%; + padding: 30px; + } + .hover-content { + @include transform(translateY(5px)); + } + &:hover, &:focus { + .content { + @include transform(translateY(-5px)); + } + .hover-content { + @include transform(translateY(0)); + } + } +} + +// +// Hover box - Style 7 // +// +.hoverbox-7 { + &:after { + content: ''; + position: absolute; + top: 0; + left: 0; + background: $color-black-04; + width: 100%; + height: 100%; + @include transition(ease-out 0.12s); + } + .content, + .hover-content { + position: absolute; + z-index: 1; + left: 0; + width: 100%; + padding: 30px; + color: $color-white-07; + h1,h2,h3,h4,h5,h6 { + color: $color-white; + } + } + .content { + top: 0; + } + .hover-content { + bottom: 0; + @include transform(translateY(5px)); + visibility: hidden; + opacity: 0; + @include transition(ease-out 0.12s); + } + &:hover, &:focus { + &:after { + background: $color-black-05; + } + img { + @include transform(scale(1.04)); + } + .hover-content { + @include transform(translateY(0)); + visibility: visible; + opacity: 1; + } + } +} + +// +// Hover box - Style 8, 9, 10 // +// +.hoverbox-8, +.hoverbox-9, +.hoverbox-10 { + a { + display: block; + &:before { + content: ''; + position: absolute; + top: 0; + left: 0; + z-index: 1; + opacity: 0; + background: $color-white-01; + width: 100%; + height: 100%; + @include transition(ease-out 0.12s); + } + } + .content { + position: absolute; + z-index: 2; + display: inline-block; + background: $color-white; + padding: 10px 16px; + color: $color-black-09; + h1,h2,h3,h4,h5,h6 { + margin: 0; + color: $color-black-09; + } + } + &:hover, &:focus { + a { + &:before { + opacity: 1; + } + } + img { + @include transform(scale(1.04)); + } + } +} +.hoverbox-8 { + .content { + top: 50%; + left: 50%; + @include transform(translate(-50%, -50%)); + } +} +.hoverbox-9 { + .content { + top: 16px; + left: 16px; + } +} +.hoverbox-10 { + .content { + bottom: 16px; + left: 16px; + } +} + +.hoverbox-11 { + &:before { + content: ''; + position: absolute; + top: 0; + left: 0; + z-index: 1; + visibility: hidden; + opacity: 0; + background: $color-black-05; + width: 100%; + height: 100%; + @include transition(ease-out 0.12s); + } + .hover-content { + position: absolute; + top: 0; + left: 0; + z-index: 2; + width: 100%; + height: 100%; + color: $color-white-07; + h1,h2,h3,h4,h5,h6 { + color: $color-white; + } + .top { + position: absolute; + top: 0; + right: 0; + left: 0; + -webkit-transform: translateY(5px); + transform: translateY(5px); + opacity: 0; + padding: 30px; + @include transition(ease-out 0.12s); + } + .bottom { + position: absolute; + right: 0; + bottom: 0; + left: 0; + -webkit-transform: translateY(5px); + transform: translateY(5px); + opacity: 0; + padding: 30px; + @include transition(ease-out 0.12s); + } + } + &:hover, &:focus { + &:before { + visibility: visible; + opacity: 1; + } + img { + @include transform(scale(1.04)); + } + .hover-content { + visibility: visible; + opacity: 1; + .top, .bottom { + -webkit-transform: translateY(0); + transform: translateY(0); + opacity: 1; + } + .top { @include transition-delay(0.05s); } + .bottom { @include transition-delay(0.10s); } + } + } +} + +.hoverbox-1, +.hoverbox-2, +.hoverbox-5, +.hoverbox-6, +.hoverbox-7, +.hoverbox-11 { + a { + &:not(.button, .button-circle, .button-text) { + color: $color-white-07; + &:hover, &:focus { color: $color-white; } + } + } + a { + &.button-text-1, + &.button-text-2, + &.button-text-3 { + color: $color-white-08; + &:hover { + color: $color-white; + } + } + &.button-text-1 { + &:before { background: $color-white-03; } + &:after { background: $color-white; } + } + &.button-text-2 { + &:before { background: $color-white-04; } + &:after { background: $color-white; } + } + &.button-text-3 { + &:before { background: $color-white-08; } + &:hover { + &:before { background: $color-white; } + } + } + } +}
\ No newline at end of file diff --git a/assets/css/scss/elements/_lightbox.scss b/assets/css/scss/elements/_lightbox.scss new file mode 100644 index 0000000..7273c96 --- /dev/null +++ b/assets/css/scss/elements/_lightbox.scss @@ -0,0 +1,179 @@ +// +// Lightbox Styles // +// +.lightbox-image-box, +.lightbox-media-box { + position: relative; + overflow: hidden; + display: block; + &[class*=' border-radius-'], &[class^='border-radius-'] { + @include transform(translate3d(0,0,0)); + } + &:after { + content: ''; + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + opacity: 0; + background: $color-black-01; + @include transition(ease-out 0.12s); + } + img { + @include transform(scale(1)); + @include transition(transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1)); + } + i { + z-index: 1; + position: absolute; + top: 50%; + left: 50%; + @include transform(translate(-50%, -50%)); + background: $color-black-06; + width: 60px; + height: 60px; + border-radius: 50%; + text-align: center; + line-height: 60px; + color: $color-white-09; + @include transition(ease-out 0.16s); + } + &.icon-xl, &.icon-2xl { + i { + width: 70px; + height: 70px; + line-height: 70px; + } + } + &.icon-3xl, &.icon-4xl, &.icon-5xl { + i { + width: 80px; + height: 80px; + line-height: 80px; + } + } + &:hover { + &:after { + opacity: 1; + } + img { + @include transform(scale(1.04)); + } + i { + @include transform(translate(-50%, -50%) scale(0.94)); + } + } +} + +.mfp-bg { + background: $color-black; +} +.mfp-container, +.mfp-bg { + opacity: 0; + -webkit-backface-visibility: hidden; + @include transition(ease-out 0.16s); +} +.mfp-container { + @include transform(scale(0.98)); + padding: 0 20px; +} +.mfp-ready { + .mfp-container { + @include transform(scale(1)); + opacity: 1; + } + &.mfp-bg { + opacity: 0.97; + } +} +.mfp-removing { + .mfp-container, + &.mfp-bg { + opacity: 0; + } + .mfp-container { + @include transform(scale(0.98)); + } +} + +button { + &.mfp-close { + display: block; + top: -5px; + opacity: 1; + width: auto; + height: auto; + line-height: auto; + font-size: 24px; + @include transition(linear 0.1s); + &:hover { + top: -5px; + opacity: 1; + color: #fff; + } + } +} +.mfp-iframe-holder { + .mfp-close { + top: -45px; + &:hover { top: -45px; } + } +} +.mfp-close-btn-in { + .mfp-close { + color: rgba(255, 255, 255, 0.7); + } +} + +.mfp-arrow { + @include transition(linear 0.1s); +} +.mfp-arrow-left { + &:before { border-right: 0; } +} +.mfp-arrow-right { + &:before { border-left: 0; } +} + +@include breakpoint-less(xs) { + button.mfp-arrow { + background: $color-black-05; + width: 70px; + height: 70px; + margin-top: -35px; + &:active { + margin-top: -35px; + } + } + button.mfp-arrow-left { + margin-left: 20px; + &:before, &:after { + margin-top: 15px; + margin-left: 20px; + } + } + button.mfp-arrow-right { + margin-right: 20px; + &:before, &:after { + margin-top: 15px; + margin-left: 30px; + } + } +} + +.mfp-bottom-bar { + margin-top: -30px; + .mfp-title { + color: $color-white-07; + } + .mfp-counter { + color: $color-white-06; + font-size: 14px; + } +} + +.mfp-iframe-scaler iframe, .mfp-figure::after { + @include box-shadow(0 0 14px 0 rgba(0,0,0,0.3)); +}
\ No newline at end of file diff --git a/assets/css/scss/elements/_map.scss b/assets/css/scss/elements/_map.scss new file mode 100644 index 0000000..ca0e516 --- /dev/null +++ b/assets/css/scss/elements/_map.scss @@ -0,0 +1,16 @@ +// +// Google Map Styles // +// +.gmap { width: 100%; } +.gmap-xs { height: 300px; } +.gmap-sm { height: 350px; } +.gmap-md { height: 400px; } +.gmap-lg { height: 470px; } +.gmap-xl { height: 550px; } +@include breakpoint-less(md) { + .gmap-xs { height: 250px; } + .gmap-sm { height: 300px; } + .gmap-md { height: 350px; } + .gmap-lg { height: 400px; } + .gmap-xl { height: 450px; } +}
\ No newline at end of file diff --git a/assets/css/scss/elements/_pie-chart.scss b/assets/css/scss/elements/_pie-chart.scss new file mode 100644 index 0000000..4a341fe --- /dev/null +++ b/assets/css/scss/elements/_pie-chart.scss @@ -0,0 +1,22 @@ +// +// Pie Chart styles // +// +.pie-chart { + position: relative; + display: inline-block; +} +.pie-chart-content { + position: absolute; + top: 50%; + left: 0; + @include transform(translateY(-50%)); + width: 100%; + margin-top: -3px; + padding: 0 20px; + text-align: center; +} +.pie-chart-content .percent { + &::after { + content: '%'; + } +}
\ No newline at end of file diff --git a/assets/css/scss/elements/_prices.scss b/assets/css/scss/elements/_prices.scss new file mode 100644 index 0000000..2329cb9 --- /dev/null +++ b/assets/css/scss/elements/_prices.scss @@ -0,0 +1,57 @@ +// +// Prices Styles // +// +.prices-box { + border: 1px solid $color-black-01; + padding: 30px; + text-align: center; + .price { + margin: 20px 0; + span { + display: block; + font: 300 14px $font-family-primary; + color: $color-primary-lighter; + } + h1, h2, h3, h4, h5, h6 { + position: relative; + display: inline-block; + margin: 0; + &:before { + content: '\f155'; + font-family: 'Font Awesome 5 Free'; + position: absolute; + top: 10px; + left: -10px; + font-size: 14px; + line-height: 14px; + } + span { + display: inline-block; + font: 300 14px $font-family-primary; + color: $color-primary-lighter; + } + } + } + .price-features { + ul { + list-style-type: none; + margin: 0; + padding: 0; + } + } + .btn, .button, .button-circle, .button-text-1, .button-text-2, .button-text-3 { + margin-top: 30px; + } + &.prices-box-recommended { + border-color: $color-black; + } +} +div[class^='bg-black'], div[class*=' bg-black'], div[class^='bg-dark'], div[class*=' bg-dark'] { + .prices-box { + border-color: $color-white-02; + color: $color-white-05; + &.prices-box-recommended { + border-color: $color-white; + } + } +}
\ No newline at end of file diff --git a/assets/css/scss/elements/_progress-bar.scss b/assets/css/scss/elements/_progress-bar.scss new file mode 100644 index 0000000..a0066cb --- /dev/null +++ b/assets/css/scss/elements/_progress-bar.scss @@ -0,0 +1,70 @@ +// +// Progress bar Styles // +// +.progress-box { + margin-bottom: 20px; + &:last-child { + margin-bottom: 0; + } + h1,h2,h3,h4,h5,h6 { + margin-bottom: 0; + } + .progress, + .progress-bar { + height: 1px; + box-shadow: none; + border-radius: 0; + } + .progress { + overflow: visible; + background: $color-black-015; + margin: 0; + padding: 0; + .progress-bar { + overflow: visible; + position: relative; + background: $color-black-09; + width: 30%; + border: none; + color: $color-black-09; + span { + position: absolute; + top: -13px; + right: 0; + font-size: 14px; + font-weight: $font-weight-regular; + } + } + &.progress-radius { + border-radius: 10px; + .progress-bar { border-radius: 10px; } + } + &.progress-height-2px { + height: 2px; + .progress-bar { height: 2px; } + } + &.progress-height-3px { + height: 3px; + .progress-bar { height: 3px; } + } + &.progress-height-4px { + height: 4px; + .progress-bar { height: 4px; } + } + &.progress-height-5px { + height: 5px; + .progress-bar { height: 5px; } + } + } +} +div[class^='bg-black'], div[class*=' bg-black'], div[class^='bg-dark'], div[class*=' bg-dark'] { + .progress-box { + .progress { + background: $color-white-02; + .progress-bar { + background: $color-white; + color: $color-white; + } + } + } +}
\ No newline at end of file diff --git a/assets/css/scss/elements/_slider.scss b/assets/css/scss/elements/_slider.scss new file mode 100644 index 0000000..3deaad9 --- /dev/null +++ b/assets/css/scss/elements/_slider.scss @@ -0,0 +1,713 @@ +// +// Slider styles // +// +.owl-carousel { + &[data-owl-nav="true"] { + &:not(.owl-nav-left, .owl-nav-right, .owl-nav-overlay, .owl-nav-overlay-left, .owl-nav-overlay-right, .owl-nav-overlap, .owl-nav-overlap-left, .owl-nav-overlap-right) { + padding: 0 56px; + @include breakpoint-less(md) { + padding: 0 48px; + } + } + } + .owl-item { + img { width: auto; } + } + .owl-nav { + position: absolute; + top: 50%; + right: 0; + left: 0; + @include transform(translateY(-50%)); + z-index: -1; + height: 36px; + button { + &.owl-prev { left: 0; } + &.owl-next { right: 0; } + &.owl-next, &.owl-prev { + position: absolute; + width: 36px; + height: 36px; + border-radius: 50%; + color: $color-black-06; + @include transition(ease-out 0.16s); + i { + font-size: 16px; + line-height: 36px; + } + &:hover, &:focus { + background: $bg-grey; + color: $color-black; + } + } + } + @include breakpoint-less(md) { + height: 32px; + button { + &.owl-next, &.owl-prev { + width: 32px; + height: 32px; + i { + font-size: 13px; + line-height: 32px; + } + } + } + } + } + &.owl-nav-left, &.owl-nav-right { + .owl-nav { + padding-bottom: 0; + } + } + .owl-dots { + margin-top: 20px; + margin-right: -2px; + margin-left: -2px; + text-align: center; + line-height: 0; + @include breakpoint-less(md) { + margin-top: 16px; + } + .owl-dot { + position: relative; + display: inline-block; + width: 20px; + height: 20px; + margin: 0 2px; + vertical-align: middle; + &:before, &:after { + content: ''; + position: absolute; + border-radius: 50%; + @include transition(ease-out 0.16s); + } + &:before { + top: 2px; + right: 2px; + bottom: 2px; + left: 2px; + opacity: 0; + background: transparent; + border: 1px solid $color-black; + } + &:after { + top: 50%; + left: 50%; + @include transform(translate(-50%,-50%)); + opacity: 0.4; + background: $color-black; + width: 4px; + height: 4px; + } + &:hover, &:focus, &.active { + &:after { + opacity: 1; + } + } + &.active { + &:before, &:after { + opacity: 1; + } + &:before { + top: 0; + right: 0; + bottom: 0; + left: 0; + } + } + } + } + &:not([data-owl-dots="false"], .owl-dots-overlay, .owl-dots-overlay-left, .owl-dots-overlay-right, .owl-dots-overlap, .owl-dots-overlap-left, .owl-dots-overlap-right) { + .owl-nav { + margin-top: -20px; + @include breakpoint-less(md) { + margin-top: -18px; + } + } + } +} +div[class^='bg-dark'], div[class*=' bg-dark'], div[class^='bg-black'], div[class*=' bg-black'] { + .owl-carousel { + .owl-nav { + button { + &.owl-next, &.owl-prev { + color: $color-white-07; + &:hover, &:focus { + background: $color-white-015; + color: $color-white; + } + } + } + } + .owl-dots { + .owl-dot { + &:before { border-color: $color-white; } + &:after { background: $color-white; } + &:hover, &:focus, &.active { + &:after { + opacity: 1; + } + } + } + } + } +} +.bg-grey, .bg-grey-lighter, .bg-grey-lightest { + .owl-carousel { + .owl-nav { + button { + &.owl-next, &.owl-prev { + &:hover, &:focus { + background: $color-black-005; + } + } + } + } + } +} + +// +// Owl Nav - Left, Right // +// +.owl-carousel { + &.owl-nav-left, + &.owl-nav-right { + .owl-nav { + height: auto; + button { + position: static; + display: block; + margin: 8px 0; + &.owl-prev, &.owl-next { + right: auto; + left: auto; + } + } + } + } + &.owl-nav-left { + padding: 0 0 0 56px; + @include breakpoint-less(md) { + padding: 0 0 0 48px; + } + .owl-nav { + right: auto; + } + } + &.owl-nav-right { + padding: 0 56px 0 0; + @include breakpoint-less(md) { + padding: 0 48px 0 0; + } + .owl-nav { + left: auto; + } + } +} + +// +// Owl Nav Overlay // +// +.owl-carousel { + &.owl-nav-overlay, + &.owl-nav-overlay-left, + &.owl-nav-overlay-right { + .owl-nav { + z-index: 1; + padding-bottom: 0; + button { + &.owl-next, &.owl-prev { + opacity: 1; + background: $color-black-03; + width: 50px; + height: 50px; + border: 0; + border-radius: 50%; + color: $color-white-08; + text-align: center; + i { + line-height: 50px; + } + &:hover, &:focus { + opacity: 1; + background: $color-black-04; + color: $color-white; + } + } + } + } + @include breakpoint-above(lg) { + .owl-nav { + opacity: 0; + @include transition(ease-out 0.16s); + } + &:hover { + .owl-nav { opacity: 1; } + } + } + @include breakpoint-less(md) { + .owl-nav { + display: none; + } + } + } + &.owl-nav-overlay { + .owl-nav { + height: 50px; + button { + &.owl-prev { left: 20px; } + &.owl-next { right: 20px; } + } + } + &:not([data-owl-dots="false"], .owl-dots-overlay, .owl-dots-overlay-left, .owl-dots-overlay-right, .owl-dots-overlap, .owl-dots-overlap-left, .owl-dots-overlap-right) { + .owl-nav { + margin-top: -20px; + } + } + } + &.owl-nav-overlay-left, + &.owl-nav-overlay-right { + .owl-nav { + height: auto; + button { + &.owl-next, &.owl-prev { + position: static; + top: auto; + right: auto; + bottom: auto; + left: auto; + display: block; + margin: 4px 0; + } + } + } + &:not([data-owl-dots="false"], .owl-dots-overlay, .owl-dots-overlay-left, .owl-dots-overlay-right, .owl-dots-overlap, .owl-dots-overlap-left, .owl-dots-overlap-right) { + .owl-nav { + height: 50px; + } + } + } + &.owl-nav-overlay-left { + .owl-nav { + right: auto; + left: 20px; + } + } + &.owl-nav-overlay-right { + .owl-nav { + right: 20px; + left: auto; + } + } +} + +// +// Owl Dots - Left, Right // +// +.owl-carousel { + &.owl-dots-left { + .owl-dots { text-align: left; } + } + &.owl-dots-right { + .owl-dots { text-align: right; } + } +} + +// +// Owl Dots Overlay // +// +.owl-carousel { + &.owl-dots-overlay, + &.owl-dots-overlay-left, + &.owl-dots-overlay-right { + .owl-dots { + position: absolute; + bottom: 20px; + background: $color-black-03; + border-radius: 20px; + margin: 0; + padding: 5px; + @include breakpoint-less(md) { + bottom: 16px; + } + .owl-dot { + &:before { border-color: $color-white; } + &:after { background: $color-white; } + &:hover, &:focus, &.active { + &:after { + opacity: 1; + } + } + } + } + } + &.owl-dots-overlay { + .owl-dots { + right: auto; + left: 50%; + @include transform(translateX(-50%)); + } + &.owl-nav-overlap-right { + .owl-dots { + margin-left: -12.5px; + } + } + &.owl-nav-left { + .owl-dots { + margin-left: 28px; + } + } + &.owl-nav-right { + .owl-dots { + margin-left: -28px; + } + } + @include breakpoint-above(lg) { + &.owl-nav-overlap-left { + .owl-dots { + margin-left: 12.5px; + } + } + } + @include breakpoint-less(md) { + &.owl-nav-overlap-left, &.owl-nav-overlap-right { + .owl-dots { + margin-left: -10px; + } + } + } + } + &.owl-dots-overlay-left { + .owl-dots { + right: auto; + left: 20px; + @include breakpoint-less(md) { + left: 16px; + } + } + &[data-owl-nav="true"], &.owl-nav-left { + &:not(.owl-nav-right, .owl-nav-overlay, .owl-nav-overlay-left, .owl-nav-overlay-right, .owl-nav-overlap, .owl-nav-overlap-left, .owl-nav-overlap-right) { + .owl-dots { + left: 76px; + @include breakpoint-less(md) { + left: 64px; + } + } + } + } + &.owl-nav-overlap { + .owl-dots { + left: 45px; + @include breakpoint-less(md) { + left: 36px; + } + } + } + @include breakpoint-above(lg) { + &.owl-nav-overlap-left { + .owl-dots { + left: 45px; + } + } + } + } + &.owl-dots-overlay-right { + .owl-dots { + right: 20px; + left: auto; + @include breakpoint-less(md) { + right: 16px; + } + } + &[data-owl-nav="true"] { + &:not(.owl-nav-left, .owl-nav-overlay, .owl-nav-overlay-left, .owl-nav-overlay-right, .owl-nav-overlap, .owl-nav-overlap-left, .owl-nav-overlap-right) { + .owl-dots { + right: 76px; + @include breakpoint-less(md) { + right: 64px; + } + } + } + } + &.owl-nav-overlap, &.owl-nav-overlap-right { + .owl-dots { + right: 45px; + } + } + @include breakpoint-above(lg) { + &.owl-nav-overlap-left { + .owl-dots { + right: 20px; + } + } + } + @include breakpoint-less(md) { + &.owl-nav-overlap, &.owl-nav-overlap-left, &.owl-nav-overlap-right { + .owl-dots { + right: 36px; + } + } + } + } +} + +// +// Owl Dots Overlap // +// +.owl-carousel { + &.owl-dots-overlap, + &.owl-dots-overlap-left, + &.owl-dots-overlap-right { + .owl-dots { + position: absolute; + bottom: 0; + background: $color-black; + border-radius: 20px; + margin: 0; + padding: 5px; + .owl-dot { + &:before { border-color: $color-white; } + &:after { background: $color-white; } + &:hover, &:focus, &.active { + &:after { + opacity: 1; + } + } + } + } + } + &.owl-dots-overlap { + .owl-dots { + right: auto; + left: 50%; + @include transform(translateY(50%) translateX(-50%)); + } + &.owl-nav-left { + .owl-dots { + margin-left: 28px; + } + } + &.owl-nav-right { + .owl-dots { + margin-left: -28px; + } + } + &.owl-nav-overlap-right { + .owl-dots { + margin-left: -12.5px; + } + } + @include breakpoint-above(lg) { + &.owl-nav-overlap-left { + .owl-dots { + margin-left: 12.5px; + } + } + } + } + + &.owl-dots-overlap-left, + &.owl-dots-overlap-right { + .owl-dots { + @include transform(translateY(50%)); + } + } + &.owl-dots-overlap-left { + .owl-dots { + right: auto; + left: 20px; + @include breakpoint-less(md) { + left: 16px; + } + } + &[data-owl-nav="true"], &.owl-nav-left { + &:not(.owl-nav-right, .owl-nav-overlay, .owl-nav-overlay-left, .owl-nav-overlay-right, .owl-nav-overlap, .owl-nav-overlap-left, .owl-nav-overlap-right) { + .owl-dots { + left: 76px; + @include breakpoint-less(md) { + left: 64px; + } + } + } + } + &.owl-nav-overlap { + .owl-dots { + left: 45px; + } + } + @include breakpoint-above(lg) { + &.owl-nav-overlap-left { + .owl-dots { + left: 45px; + } + } + } + } + &.owl-dots-overlap-right { + .owl-dots { + right: 20px; + left: auto; + @include breakpoint-less(md) { + right: 16px; + } + } + &[data-owl-nav="true"], &.owl-nav-right { + &:not(.owl-nav-left, .owl-nav-overlay, .owl-nav-overlay-left, .owl-nav-overlay-right, .owl-nav-overlap, .owl-nav-overlap-left, .owl-nav-overlap-right) { + .owl-dots { + right: 76px; + @include breakpoint-less(md) { + right: 64px; + } + } + } + } + &.owl-nav-overlap, &.owl-nav-overlap-right { + .owl-dots { + right: 45px; + @include breakpoint-less(md) { + right: 36px; + } + } + } + } +} + +// +// Owl Nav Overlap // +// +.owl-carousel { + &.owl-nav-overlap { + padding: 0 25px; + .owl-nav { + right: 25px; + left: 25px; + z-index: 1; + height: 50px; + button { + opacity: 0.9; + background: $color-black; + width: 50px; + height: 50px; + border-radius: 50%; + color: $color-white; + &.owl-prev { + right: auto; + left: 0; + @include transform(translateX(-50%)); + } + &.owl-next { + right: 0; + left: auto; + @include transform(translateX(50%)); + } + &:hover { + opacity: 1; + color: $color-white; + } + } + @include breakpoint-above(lg) { + button { + &:hover { + &.owl-prev { @include transform(translateX(-50%) scale(0.94)); } + &.owl-next { @include transform(translateX(50%) scale(0.94)); } + } + } + } + } + &:not([data-owl-dots="false"], .owl-dots-overlay, .owl-dots-overlay-left, .owl-dots-overlay-right, .owl-dots-overlap, .owl-dots-overlap-left, .owl-dots-overlap-right) { + .owl-nav { + margin-top: -20px; + @include breakpoint-less(md) { + margin-top: -18px; + } + } + } + @include breakpoint-less(md) { + padding: 0 20px; + .owl-nav { + right: 20px; + left: 20px; + height: 40px; + button.owl-prev, + button.owl-next { + width: 40px; + height: 40px; + } + } + } + } + &.owl-nav-overlap-left { + @include breakpoint-above(lg) { + padding: 0 0 0 25px; + .owl-nav { + left: 25px; + right: auto; + @include transform(translateY(-50%) translateX(-50%)); + } + } + } + &.owl-nav-overlap-right { + padding: 0 25px 0 0; + .owl-nav { + left: auto; + right: 25px; + @include transform(translateY(-50%) translateX(50%)); + } + } + &.owl-nav-overlap-left, + &.owl-nav-overlap-right { + .owl-nav { + z-index: 1; + width: 50px; + height: auto; + padding-bottom: 0; + button.owl-prev, + button.owl-next { + position: static; + right: 0; + left: 0; + opacity: 0.9; + background: $color-black; + width: 50px; + height: 50px; + margin: 4px 0; + border-radius: 50%; + color: $color-white; + &:hover { + opacity: 1; + color: $color-white; + } + } + @include breakpoint-above(lg) { + button { + &:hover { + @include transform(scale(0.94)); + } + } + } + } + &:not([data-owl-dots="false"], .owl-dots-overlay, .owl-dots-overlay-left, .owl-dots-overlay-right, .owl-dots-overlap, .owl-dots-overlap-left, .owl-dots-overlap-right) { + .owl-nav { + margin-top: -20px; + @include breakpoint-less(md) { + margin-top: -18px; + } + } + } + @include breakpoint-less(md) { + padding: 0 20px 0 0; + .owl-nav { + left: auto; + right: 20px; + @include transform(translateY(-50%) translateX(50%)); + width: 40px; + button.owl-prev, + button.owl-next { + width: 40px; + height: 40px; + } + } + } + } +}
\ No newline at end of file diff --git a/assets/css/scss/elements/_team.scss b/assets/css/scss/elements/_team.scss new file mode 100644 index 0000000..f2b098c --- /dev/null +++ b/assets/css/scss/elements/_team.scss @@ -0,0 +1,118 @@ +// +// Team Styles // +// +.team-wrapper { + .team-box { + text-align: center; + .team-img { + position: relative; + overflow: hidden; + margin-bottom: 20px; + img { + @include transform(scale(1)); + width: 100%; + @include transition(transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1)); + } + div { + position: absolute; + top: 0; + left: 0; + opacity: 0; + background: $color-black-04; + width: 100%; + height: 100%; + text-align: center; + @include transition(ease-out 0.12s); + ul { + list-style-type: none; + position: absolute; + top: 50%; + right: 0; + left: 0; + @include transform(translateY(-50%) scale(0.96)); + margin: 0 -7px; + padding: 0 30px; + @include transition(ease-out 0.12s); + li { + display: inline-block; + margin: 0 7px; + a { + &:not([class*=' button'], [class^='button']) { + color: $color-white; + &:hover { + color: $color-white-07; + } + } + } + } + } + } + &:hover { + img { + @include transform(scale(1.04)); + @include filter(blur(1.5px)); + } + div { + opacity: 1; + ul { + @include transform(translateY(-50%) scale(1)); + } + } + } + } + h1,h2,h3,h4,h5,h6 { + margin-bottom: 5px; + } + span { + color: $color-primary-lighter; + } + } + &.team-box-hover-2 { + .team-box { + .team-img { + div { + top: auto; + bottom: 16px; + right: 16px; + left: 16px; + @include transform(translateY(5px)); + background: $color-white; + width: auto; + height: auto; + padding: 15px 20px; + ul { + position: static; + top: auto; + @include transform(translateY(0) scale(1)); + padding: 0; + li { + a { + &:not([class*=' button'], [class^='button']) { + color: $color-primary; + &:hover, &:focus { color: $color-dark; } + } + } + } + } + } + &:hover { + img { + @include filter(blur(0)); + } + div { + @include transform(translateY(0)); + ul { + @include transform(translateY(0) scale(1)); + } + } + } + } + } + } +} +.text-left { + .team-box { text-align: left; } +} +.text-right { + .team-box { text-align: right; } +}
\ No newline at end of file diff --git a/assets/css/scss/elements/_testimonial.scss b/assets/css/scss/elements/_testimonial.scss new file mode 100644 index 0000000..9b12318 --- /dev/null +++ b/assets/css/scss/elements/_testimonial.scss @@ -0,0 +1,122 @@ +// +// Testimonial Styles // +// +.testimonial-box { + max-width: 730px; + margin: 0 auto; + text-align: center; + img { + width: 80px; + height: 80px; + border-radius: 50%; + margin-right: auto; + margin-left: auto; + } +} +// +// Testimonial Grid // +// +.testimonial-grid { + overflow: hidden; + + &.column-2 { + @include breakpoint-above(lg) { + .testimonial-grid-box { + width: 50%; + } + } + } + &.column-1 { + .testimonial-grid-box { + width: 100%; + padding: 30px 0; + } + } + + .testimonial-grid-box { + position: relative; + float: left; + width: 33.3%; + padding: 30px; + &:before, &:after { + content: ''; + position: absolute; + } + &:before { + top: 0; + left: -1px; + height: 100%; + border-left: 1px dashed $color-black-01; + } + &:after { + left: 0; + bottom: -1px; + width: 100%; + border-bottom: 1px dashed $color-black-01; + } + .testimonial-img { + float: left; + margin-right: 20px; + img { + width: 80px; + height: 80px; + border-radius: 50%; + } + } + .testimonial-content { + overflow: hidden; + } + } + @include breakpoint-less(md) { + .testimonial-grid-box { + width: 50%; + } + } + @include breakpoint-less(sm) { + .testimonial-grid-box { + width: 100%; + padding: 30px 0; + } + } + // + // Border Style - Solid // + // + &.border-style-solid { + border: 0; + .testimonial-grid-box { + &:before { border-left-style: solid; } + &:after { border-bottom-style: solid; } + } + } + // + // Border Style - Dotted // + // + &.border-style-dotted { + border: 0; + .testimonial-grid-box { + &:before { border-left-style: dotted; } + &:after { border-bottom-style: dotted; } + } + } + // + // Borderless // + // + &.border-0 { + margin: -15px; + .testimonial-grid-box { + padding: 15px; + &:before, &:after { border: 0; } + } + } + @include breakpoint-less(sm) { + &.border-0 { + margin: -15px 0; + .testimonial-grid-box { padding: 15px 0; } + } + } +} +div[class^='bg-black'], div[class*=' bg-black'], div[class^='bg-dark'], div[class*=' bg-dark'] { + .testimonial-grid-box { + &:before, &:after { border-color: $color-white-02; } + } +}
\ No newline at end of file diff --git a/assets/css/scss/elements/_text-link.scss b/assets/css/scss/elements/_text-link.scss new file mode 100644 index 0000000..bec0ffb --- /dev/null +++ b/assets/css/scss/elements/_text-link.scss @@ -0,0 +1,163 @@ +// +// Text Link Styles // +// +*[class^='text-link-'], *[class*=' text-link-'] { + color: $color-black-09; + &:hover, &:focus { + color: $color-black-09; + } +} +.text-link-1 { + &:hover { text-decoration: underline; } +} +.text-link-2 { + &:hover { text-decoration: line-through; } +} +.text-link-3 { + &:hover { text-decoration: overline; } +} +.text-link-4 { + &:hover { text-decoration: underline overline; } +} +.text-link-5, +.text-link-6 { + position: relative; + &:before { + content: ''; + position: absolute; + bottom: -2px; + background: $color-black-09; + width: 0; + height: 1px; + @include transition(all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1)); + } + &:hover { + &:before { + width: 100%; + } + } +} +.text-link-5 { + &:before { left: 0; } +} +.text-link-6 { + &:before { right: 0; } +} +.text-link-7 { + position: relative; + &:before { + content: ''; + position: absolute; + bottom: -2px; + left: 0; + @include transform(translateY(3px)); + opacity: 0; + background: $color-black-09; + width: 100%; + height: 1px; + @include transition(linear 0.1s); + } + &:hover { + &:before { + @include transform(translateY(0)); + opacity: 1; + } + } +} +.text-link-8, +.text-link-9 { + position: relative; + &:before, &:after { + content: ''; + position: absolute; + bottom: -2px; + height: 1px; + @include transition(all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1)); + } + &:before { + left: 0; + background: $color-black-02; + width: 100%; + } + &:after { + background: $color-black-09; + width: 0; + } + &:hover { + &:after { + width: 100%; + } + } +} +.text-link-8 { + &:after { left: 0; } +} +.text-link-9 { + &:after { right: 0; } +} +.text-link-10 { + position: relative; + &:before, &:after { + content: ''; + position: absolute; + bottom: -2px; + left: 0; + width: 100%; + height: 1px; + @include transition(linear 0.1s); + } + &:before { + background: $color-black-02; + } + &:after { + opacity: 0; + @include transform(translateY(3px)); + background: $color-black-09; + } + &:hover { + &:before { + opacity: 0; + } + &:after { + @include transform(translateY(0)); + opacity: 1; + } + } +} +.text-link-11 { + position: relative; + &:before { + content: ''; + position: absolute; + bottom: 4px; + left: 0; + background: $color-black-02; + width: 0; + height: 6px; + @include transition(all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1)); + } + &:hover { + &:before { + width: 100%; + } + } +} + +div[class^='bg-black'], div[class*=' bg-black'], div[class^='bg-dark'], div[class*=' bg-dark'] { + *[class^='text-link-'], *[class*=' text-link-'] { + color: $color-white; + &:hover, &:focus { + color: $color-white; + } + } + .text-link-5, .text-link-6, .text-link-7 { + &:before { background: $color-white; } + } + .text-link-8, .text-link-9, .text-link-10 { + &:before { background: $color-white-03; } + &:after { background: $color-white; } + } + .text-link-11 { + &:before { background: $color-white-03; } + } +}
\ No newline at end of file diff --git a/assets/css/scss/elements/_timeline.scss b/assets/css/scss/elements/_timeline.scss new file mode 100644 index 0000000..9fc2980 --- /dev/null +++ b/assets/css/scss/elements/_timeline.scss @@ -0,0 +1,243 @@ +// +// Timeline Styles // +// +.timeline-wrapper { + position: relative; + &:before { + content: ''; + position: absolute; + top: 0; + background: $border-grey; + width: 1px; + height: 100%; + } + .timeline { + .timeline-date { + position: relative; + &:before { + content: ''; + position: absolute; + top: 31px; + background: $border-grey; + width: 20px; + height: 20px; + border-radius: 50%; + } + &:after { + content: ''; + position: absolute; + top: 37px; + background: $color-dark; + width: 8px; + height: 8px; + border-radius: 50%; + } + } + } +} +@include breakpoint-above(lg) { + .timeline-wrapper { + position: relative; + &:before { + left: 50%; + @include transform(translateX(-50%)); + } + .timeline { + position: relative; + .timeline-date, .timeline-content { + width: 50%; + padding: 30px; + } + .timeline-date { + position: absolute; + top: 0; + left: 0; + text-align: right; + &:before { + right: -10px; + } + &:after { + right: -4px; + } + h1,h2,h3,h4,h5,h6 { + position: relative; + text-align: right; + } + } + .timeline-content { + margin-left: 50%; + } + &:nth-child(even) { + .timeline-date { + left: 50%; + text-align: left; + &:before { + right: auto; + left: -10px; + } + &:after { + right: auto; + left: -4px; + } + h1,h2,h3,h4,h5,h6 { + text-align: left; + } + } + .timeline-content { + margin-left: 0; + text-align: right; + } + } + } + // + // Timeline left // + // + &.timeline-left { + &:before { + left: 200px; + @include transform(translateX(0)); + } + .timeline { + .timeline-date { + width: 200px; + padding: 30px 30px 0 0; + } + .timeline-content { + width: auto; + margin: 0 0 0 200px; + padding: 30px 0 0 30px; + text-align: left; + } + &:nth-child(even) { + .timeline-date { + left: auto; + text-align: right; + &:before { + right: -10px; + left: auto; + } + &:after { + right: -4px; + left: auto; + } + h1,h2,h3,h4,h5,h6 { + text-align: right; + } + } + } + &:last-child { + .timeline-date, .timeline-content { + padding-bottom: 30px; + } + } + } + } + // + // Timeline Right // + // + &.timeline-right { + &:before { + right: 200px; + left: auto; + @include transform(translateX(0)); + } + .timeline { + .timeline-date { + right: 0; + left: auto; + width: 200px; + padding: 30px 0 0 30px; + text-align: left; + &:before { + right: auto; + left: -10px; + } + &:after { + right: auto; + left: -4px; + } + h1,h2,h3,h4,h5,h6 { + text-align: left; + } + } + .timeline-content { + width: auto; + margin: 0 200px 0 0; + padding: 30px 30px 0 0; + text-align: right; + } + &:nth-child(even) { + .timeline-date { + left: auto; + text-align: left; + &:before { + left: -10px; + } + &:after { + left: -4px; + } + h1,h2,h3,h4,h5,h6 { + text-align: left; + } + } + } + &:last-child { + .timeline-date, .timeline-content { + padding-bottom: 30px; + } + } + } + } // end Timeline Right // + } +} +@include breakpoint-less(md) { + .timeline-wrapper { + padding-left: 30px; + &:before { + left: 0; + } + .timeline { + margin-bottom: 30px; + &:first-child { + padding-top: 30px; + } + &:last-child { + margin-bottom: 0; + padding-bottom: 30px; + } + .timeline-date { + &:before { + top: 1px; + left: -40px; + } + &:after { + top: 7px; + left: -34px; + } + } + } + } +} +@include breakpoint-less(xs) { + .timeline-wrapper { + padding-left: 20px; + .timeline { + .timeline-date { + &:before { left: -30px; } + &:after { left: -24px; } + } + } + } +} + +div[class^='bg-black'], div[class*=' bg-black'], div[class^='bg-dark'], div[class*=' bg-dark'] { + .timeline-wrapper { + &:before { background: $color-white-02; } + .timeline { + .timeline-date { + &:before { background: $color-white-02; } + &:after { background: $color-white; } + } + } + } +}
\ No newline at end of file diff --git a/assets/css/scss/helpers/.DS_Store b/assets/css/scss/helpers/.DS_Store Binary files differnew file mode 100644 index 0000000..3774adc --- /dev/null +++ b/assets/css/scss/helpers/.DS_Store diff --git a/assets/css/scss/helpers/_custom.scss b/assets/css/scss/helpers/_custom.scss new file mode 100644 index 0000000..d1701d5 --- /dev/null +++ b/assets/css/scss/helpers/_custom.scss @@ -0,0 +1,3 @@ +// +// Your Custom Styles // +//
\ No newline at end of file diff --git a/assets/css/scss/helpers/_mixins.scss b/assets/css/scss/helpers/_mixins.scss new file mode 100644 index 0000000..912ad47 --- /dev/null +++ b/assets/css/scss/helpers/_mixins.scss @@ -0,0 +1,97 @@ +// +// Mixins // +// +@mixin display-flex { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; +} + +@mixin background-size($background-size) { + -webkit-background-size: $background-size; + -moz-background-size: $background-size; + background-size: $background-size; +} + +@mixin box-shadow($box-shadow) { + -webkit-box-shadow: $box-shadow; + box-shadow: $box-shadow; +} + +@mixin text-shadow($text-shadow) { + -webkit-text-shadow: $text-shadow; + text-shadow: $text-shadow; +} + +@mixin filter($filter) { + -webkit-filter: $filter; + filter: $filter; +} + +@mixin transition($transition) { + -webkit-transition: $transition; + transition: $transition; +} +@mixin transition-delay($transition-delay) { + -webkit-transition-delay: $transition-delay; + transition-delay: $transition-delay; +} +@mixin transition-duration($transition-duration) { + -webkit-transition-duration: $transition-duration; + transition-duration: $transition-duration; +} + +@mixin transform($transform) { + -webkit-transform: $transform; + transform: $transform; +} +@mixin transform-origin($transform-origin) { + -webkit-transform-origin: $transform-origin; + transform-origin: $transform-origin; +} + +@mixin animation($animation) { + -webkit-animation: $animation; + animation: $animation; +} +@mixin animation-delay($animation-delay) { + -webkit-animation-delay: $animation-delay; + animation-delay: $animation-delay; +} +@mixin animation-fill-mode($animation-fill-mode) { + -webkit-animation-fill-mode: $animation-fill-mode; + animation-fill-mode: $animation-fill-mode; +} + +@mixin breakpoint-above($class) { + @if $class == xs { + @media (min-width: 0) { @content; } + } + @else if $class == sm { + @media (min-width: 576px) { @content; } + } + @else if $class == md { + @media (min-width: 768px) { @content; } + } + @else if $class == lg { + @media (min-width: 992px) { @content; } + } + @else if $class == xl { + @media (min-width: 1200px) { @content; } + } +} +@mixin breakpoint-less($class) { + @if $class == xs { + @media (max-width: 575.98px) { @content; } + } + @else if $class == sm { + @media (max-width: 767.98px) { @content; } + } + @else if $class == md { + @media (max-width: 991.98px) { @content; } + } + @else if $class == lg { + @media (max-width: 1199.98px) { @content; } + } +}
\ No newline at end of file diff --git a/assets/css/scss/helpers/_utilities.scss b/assets/css/scss/helpers/_utilities.scss new file mode 100644 index 0000000..ec59fe1 --- /dev/null +++ b/assets/css/scss/helpers/_utilities.scss @@ -0,0 +1,455 @@ +// +// Background colors // +// +.bg-white { background: $color-white !important; } +.bg-white-09 { background: $color-white-09 !important; } +.bg-white-08 { background: $color-white-08 !important; } +.bg-white-07 { background: $color-white-07 !important; } +.bg-white-06 { background: $color-white-06 !important; } +.bg-white-05 { background: $color-white-05 !important; } +.bg-white-04 { background: $color-white-04 !important; } +.bg-white-03 { background: $color-white-03 !important; } +.bg-white-02 { background: $color-white-02 !important; } +.bg-white-01 { background: $color-white-01 !important; } +.bg-black { background: $color-black !important; } +.bg-black-09 { background: $color-black-09 !important; } +.bg-black-08 { background: $color-black-08 !important; } +.bg-black-07 { background: $color-black-07 !important; } +.bg-black-06 { background: $color-black-06 !important; } +.bg-black-05 { background: $color-black-05 !important; } +.bg-black-04 { background: $color-black-04 !important; } +.bg-black-03 { background: $color-black-03 !important; } +.bg-black-02 { background: $color-black-02 !important; } +.bg-black-01 { background: $color-black-01 !important; } +.bg-dark { background: $bg-dark !important; } +.bg-dark-lighter { background: $bg-dark-lighter !important; } +.bg-dark-lightest { background: $bg-dark-lightest !important; } +.bg-dark-grey { background: $bg-dark-grey !important; } +.bg-dark-grey-09 { background: $bg-dark-grey-09 !important; } +.bg-dark-grey-08 { background: $bg-dark-grey-08 !important; } +.bg-dark-grey-07 { background: $bg-dark-grey-07 !important; } +.bg-dark-grey-06 { background: $bg-dark-grey-06 !important; } +.bg-dark-grey-05 { background: $bg-dark-grey-05 !important; } +.bg-dark-grey-04 { background: $bg-dark-grey-04 !important; } +.bg-dark-grey-03 { background: $bg-dark-grey-03 !important; } +.bg-dark-grey-02 { background: $bg-dark-grey-02 !important; } +.bg-dark-grey-01 { background: $bg-dark-grey-01 !important; } +.bg-grey { background: $bg-grey !important; } +.bg-grey-lighter { background: $bg-grey-lighter !important; } +.bg-grey-lightest { background: $bg-grey-lightest !important; } +.bg-transparent { background: transparent !important; } + +.bg-white-content { + color: $color-primary; + h1,h2,h3,h4,h5,h6 { color: $color-dark; } + a { + &:not([class*=' button'], [class^='button']) { + color: $color-primary; + &:hover, &:focus { color: $color-dark; } + } + } +} +.bg-dark-content { + color: $color-white-07; + h1, h2, h3, h4, h5, h6 { color: $color-white; } + a { + &:not([class*=' button'], [class^='button']) { + color: $color-white-08; + &:hover, &:focus { color: $color-white; } + } + } +} +div[class^='bg-white'], div[class*=' bg-white'] { + @extend .bg-white-content; +} +div[class^='bg-black'], div[class*=' bg-black'], div[class^='bg-dark'], div[class*=' bg-dark'] { + @extend .bg-dark-content; +} +div[class^='bg-black'], div[class*=' bg-black'], div[class^='bg-dark'], div[class*=' bg-dark'] { + div[class^='bg-white'], div[class*=' bg-white'] { + @extend .bg-white-content; + } +} + +// +// Font Families // +// +.font-family-primary { font-family: $font-family-primary } +.font-family-secondary, .font-family-playfair { font-family: $font-family-secondary } +.font-family-tertiary { font-family: $font-family-tertiary } + +// +// Font Weights // +// +.font-weight-thin { font-weight: $font-weight-thin; } +.font-weight-extra-light { font-weight: $font-weight-extra-light; } +.font-weight-medium { font-weight: $font-weight-medium; } +.font-weight-semi-bold { font-weight: $font-weight-semi-bold; } +.font-weight-extra-bold { font-weight: $font-weight-extra-bold; } +.font-weight-black { font-weight: $font-weight-black; } + +// +// Text Colors // +// +*.text-white-09 { color: $color-white-09; } +*.text-white-08 { color: $color-white-08; } +*.text-white-07 { color: $color-white-07; } +*.text-white-06 { color: $color-white-06; } +*.text-white-05 { color: $color-white-05; } +*.text-white-04 { color: $color-white-04; } +*.text-white-03 { color: $color-white-03; } +*.text-white-02 { color: $color-white-02; } +*.text-white-01 { color: $color-white-01; } + +*.text-black { color: $color-black; } +*.text-black-09 { color: $color-black-09; } +*.text-black-08 { color: $color-black-08; } +*.text-black-07 { color: $color-black-07; } +*.text-black-06 { color: $color-black-06; } +*.text-black-05 { color: $color-black-05; } +*.text-black-04 { color: $color-black-04; } +*.text-black-03 { color: $color-black-03; } +*.text-black-02 { color: $color-black-02; } +*.text-black-01 { color: $color-black-01; } + +*.text-dark { color: $color-dark !important; } +*.text-yellow { color: $color-warning-lighter; } +*.text-red { color: $color-red-lighter; } +*.text-green { color: $color-green-lighter; } +*.text-blue { color: $color-blue; } + +// +// Text Decorations // +// +.text-decoration-overline { text-decoration: overline; } +.text-decoration-line-through { text-decoration: line-through; } +.text-decoration-underline { text-decoration: underline; } +.text-decoration-underline-overline { text-decoration: underline overline; } +a, button { + &.text-decoration-overline { + &:hover { text-decoration: overline; } + } + &.text-decoration-line-through { + &:hover { text-decoration: line-through; } + } + &.text-decoration-underline { + &:hover { text-decoration: underline; } + } + &.text-decoration-underline-overline { + &:hover { text-decoration: underline overline; } + } +} + +// +// Stroke Text // +// +.stroke-text { + color: $color-dark; + -webkit-text-fill-color: transparent; + -webkit-text-stroke-width: 1.0px; + -webkit-text-stroke-color: $color-dark; + @include breakpoint-above(md) { + -webkit-text-stroke-width: 1.2px; + } + @include breakpoint-above(lg) { + -webkit-text-stroke-width: 1.4px; + } +} +div[class^='bg-black'], div[class*=' bg-black'], div[class^='bg-dark'], div[class*=' bg-dark'] { + .stroke-text { + color: $color-white; + -webkit-text-stroke-color: $color-white; + } + div[class^='bg-white'], div[class*=' bg-white'] { + color: $color-dark; + -webkit-text-stroke-color: $color-dark; + } +} + +// +// Fancy Text // +// +.fancy-text { + -webkit-text-fill-color: transparent; + -webkit-text-stroke-width: 1.0px; + -webkit-text-stroke-color: $color-dark; + @include text-shadow(3px 3px 0 rgb(219, 221, 223)); + @include breakpoint-above(md) { -webkit-text-stroke-width: 1.2px; } + @include breakpoint-above(lg) { -webkit-text-stroke-width: 1.4px; } + &.display-1, &.display-2, &.display-3 { + @include text-shadow(4px 4px 0 rgb(219, 221, 223)); + } + @include breakpoint-above(md) { + &.display-1, &.display-2, &.display-3 { + @include text-shadow(5px 5px 0 rgb(219, 221, 223)); + } + &.display-4 { + @include text-shadow(4px 4px 0 rgb(219, 221, 223)); + } + } +} +div[class^='bg-black'], div[class*=' bg-black'], div[class^='bg-dark'], div[class*=' bg-dark'] { + .fancy-text { + color: $color-white; + -webkit-text-stroke-color: $color-white; + @include text-shadow(3px 3px 0 rgb(46, 48, 50)); + &.display-1, &.display-2, &.display-3 { + @include text-shadow(4px 4px 0 rgb(46, 48, 50)); + } + @include breakpoint-above(md) { + &.display-1, &.display-2, &.display-3 { + @include text-shadow(5px 5px 0 rgb(46, 48, 50)); + } + &.display-4 { + @include text-shadow(4px 4px 0 rgb(46, 48, 50)); + } + } + } + div[class^='bg-white'], div[class*=' bg-white'] { + .fancy-text { + color: $color-dark; + -webkit-text-stroke-color: $color-dark; + @include text-shadow(3px 3px 0 rgb(219, 221, 223)); + &.display-1, &.display-2, &.display-3 { + @include text-shadow(4px 4px 0 rgb(219, 221, 223)); + } + @include breakpoint-above(md) { + &.display-1, &.display-2, &.display-3 { + @include text-shadow(5px 5px 0 rgb(219, 221, 223)); + } + &.display-4 { + @include text-shadow(4px 4px 0 rgb(219, 221, 223)); + } + } + } + } +} + +// +// Borders // +// +.border-all, +.border-top, +.border-right, +.border-bottom, +.border-left { + border-width: 0; + border-style: solid; + border-color: $color-black-01 !important; +} +.border-all { border-width: 1px; } +.border-top { border-top-width: 1px; } +.border-right { border-right-width: 1px; } +.border-bottom { border-bottom-width: 1px; } +.border-left { border-left-width: 1px; } + +div[class^='bg-black'], div[class*=' bg-black'], div[class^='bg-dark'], div[class*=' bg-dark'] { + .border-all, .border-top, .border-right, .border-bottom, .border-left { + border-color: $color-white-02 !important; + } +} + +// +// Border Styles // +// +.border-style-dotted { border-style: dotted !important; } +.border-style-dashed { border-style: dashed !important; } + +// +// Spacing - Margin // +// +.margin-top-10 { margin-top: 10px; } +.margin-top-20 { margin-top: 20px; } +.margin-top-30 { margin-top: 30px; } +.margin-top-40 { margin-top: 40px; } +.margin-top-50 { margin-top: 50px; } +.margin-top-60 { margin-top: 60px; } +.margin-top-70 { margin-top: 70px; } +.margin-right-10 { margin-right: 10px; } +.margin-right-20 { margin-right: 20px; } +.margin-right-30 { margin-right: 30px; } +.margin-left-10 { margin-left: 10px; } +.margin-left-20 { margin-left: 20px; } +.margin-left-30 { margin-left: 30px; } +.margin-bottom-10 { margin-bottom: 10px; } +.margin-bottom-20 { margin-bottom: 20px; } +.margin-bottom-30 { margin-bottom: 30px; } +.margin-bottom-40 { margin-bottom: 40px; } +.margin-bottom-50 { margin-bottom: 50px; } +.margin-bottom-60 { margin-bottom: 60px; } +.margin-bottom-70 { margin-bottom: 70px; } +@include breakpoint-above(md) { + .margin-md-top-10 { margin-top: 10px; } + .margin-md-top-20 { margin-top: 20px; } + .margin-md-top-30 { margin-top: 30px; } + .margin-md-top-40 { margin-top: 40px; } + .margin-md-top-50 { margin-top: 50px; } + .margin-md-top-60 { margin-top: 60px; } + .margin-md-top-70 { margin-top: 70px; } + .margin-md-right-10 { margin-right: 10px; } + .margin-md-right-20 { margin-right: 20px; } + .margin-md-right-30 { margin-right: 30px; } + .margin-md-left-10 { margin-left: 10px; } + .margin-md-left-20 { margin-left: 20px; } + .margin-md-left-30 { margin-left: 30px; } + .margin-md-bottom-10 { margin-bottom: 10px; } + .margin-md-bottom-20 { margin-bottom: 20px; } + .margin-md-bottom-30 { margin-bottom: 30px; } + .margin-md-bottom-40 { margin-bottom: 40px; } + .margin-md-bottom-50 { margin-bottom: 50px; } + .margin-md-bottom-60 { margin-bottom: 60px; } + .margin-md-bottom-70 { margin-bottom: 70px; } +} +@include breakpoint-above(lg) { + .margin-lg-top-10 { margin-top: 10px; } + .margin-lg-top-20 { margin-top: 20px; } + .margin-lg-top-30 { margin-top: 30px; } + .margin-lg-top-40 { margin-top: 40px; } + .margin-lg-top-50 { margin-top: 50px; } + .margin-lg-top-60 { margin-top: 60px; } + .margin-lg-top-70 { margin-top: 70px; } + .margin-lg-right-10 { margin-right: 10px; } + .margin-lg-right-20 { margin-right: 20px; } + .margin-lg-right-30 { margin-right: 30px; } + .margin-lg-left-10 { margin-left: 10px; } + .margin-lg-left-20 { margin-left: 20px; } + .margin-lg-left-30 { margin-left: 30px; } + .margin-lg-bottom-10 { margin-bottom: 10px; } + .margin-lg-bottom-20 { margin-bottom: 20px; } + .margin-lg-bottom-30 { margin-bottom: 30px; } + .margin-lg-bottom-40 { margin-bottom: 40px; } + .margin-lg-bottom-50 { margin-bottom: 50px; } + .margin-lg-bottom-60 { margin-bottom: 60px; } + .margin-lg-bottom-70 { margin-bottom: 70px; } +} +@include breakpoint-above(xl) { + .margin-xl-top-10 { margin-top: 10px; } + .margin-xl-top-20 { margin-top: 20px; } + .margin-xl-top-30 { margin-top: 30px; } + .margin-xl-top-40 { margin-top: 40px; } + .margin-xl-top-50 { margin-top: 50px; } + .margin-xl-top-60 { margin-top: 60px; } + .margin-xl-top-70 { margin-top: 70px; } + .margin-xl-right-10 { margin-right: 10px; } + .margin-xl-right-20 { margin-right: 20px; } + .margin-xl-right-30 { margin-right: 30px; } + .margin-xl-left-10 { margin-left: 10px; } + .margin-xl-left-20 { margin-left: 20px; } + .margin-xl-left-30 { margin-left: 30px; } + .margin-xl-bottom-10 { margin-bottom: 10px; } + .margin-xl-bottom-20 { margin-bottom: 20px; } + .margin-xl-bottom-30 { margin-bottom: 30px; } + .margin-xl-bottom-40 { margin-bottom: 40px; } + .margin-xl-bottom-50 { margin-bottom: 50px; } + .margin-xl-bottom-60 { margin-bottom: 60px; } + .margin-xl-bottom-70 { margin-bottom: 70px; } +} +.margin-0 { margin: 0 !important; } +@include breakpoint-above(md) { + .margin-md-0 { margin: 0 !important; } +} +@include breakpoint-above(lg) { + .margin-lg-0 { margin: 0 !important; } +} +@include breakpoint-above(xl) { + .margin-xl-0 { margin: 0 !important; } +} + +// +// Spacing - Padding // +// +.padding-10 { padding: 10px; } +.padding-20 { padding: 20px; } +.padding-30 { padding: 30px; } +.padding-40 { padding: 40px; } +.padding-50 { padding: 50px; } +.padding-60 { padding: 60px; } +.padding-70 { padding: 70px; } +.padding-x-10 { padding-left: 10px; padding-right: 10px; } +.padding-x-20 { padding-left: 20px; padding-right: 20px; } +.padding-x-30 { padding-left: 30px; padding-right: 30px; } +.padding-x-40 { padding-left: 40px; padding-right: 40px; } +.padding-x-50 { padding-left: 50px; padding-right: 50px; } +.padding-x-60 { padding-left: 60px; padding-right: 60px; } +.padding-x-70 { padding-left: 70px; padding-right: 70px; } +.padding-y-10 { padding-top: 10px; padding-bottom: 10px; } +.padding-y-20 { padding-top: 20px; padding-bottom: 20px; } +.padding-y-30 { padding-top: 30px; padding-bottom: 30px; } +.padding-y-40 { padding-top: 40px; padding-bottom: 40px; } +.padding-y-50 { padding-top: 50px; padding-bottom: 50px; } +.padding-y-60 { padding-top: 60px; padding-bottom: 60px; } +.padding-y-70 { padding-top: 70px; padding-bottom: 70px; } +@include breakpoint-above(md) { + .padding-md-10 { padding: 10px; } + .padding-md-20 { padding: 20px; } + .padding-md-30 { padding: 30px; } + .padding-md-40 { padding: 40px; } + .padding-md-50 { padding: 50px; } + .padding-md-60 { padding: 60px; } + .padding-md-70 { padding: 70px; } + .padding-x-md-10 { padding-left: 10px; padding-right: 10px; } + .padding-x-md-20 { padding-left: 20px; padding-right: 20px; } + .padding-x-md-30 { padding-left: 30px; padding-right: 30px; } + .padding-x-md-40 { padding-left: 40px; padding-right: 40px; } + .padding-x-md-50 { padding-left: 50px; padding-right: 50px; } + .padding-x-md-60 { padding-left: 60px; padding-right: 60px; } + .padding-x-md-70 { padding-left: 70px; padding-right: 70px; } + .padding-y-md-10 { padding-top: 10px; padding-bottom: 10px; } + .padding-y-md-20 { padding-top: 20px; padding-bottom: 20px; } + .padding-y-md-30 { padding-top: 30px; padding-bottom: 30px; } + .padding-y-md-40 { padding-top: 40px; padding-bottom: 40px; } + .padding-y-md-50 { padding-top: 50px; padding-bottom: 50px; } + .padding-y-md-60 { padding-top: 60px; padding-bottom: 60px; } + .padding-y-md-70 { padding-top: 70px; padding-bottom: 70px; } +} +@include breakpoint-above(lg) { + .padding-lg-10 { padding: 10px; } + .padding-lg-20 { padding: 20px; } + .padding-lg-30 { padding: 30px; } + .padding-lg-40 { padding: 40px; } + .padding-lg-50 { padding: 50px; } + .padding-lg-60 { padding: 60px; } + .padding-lg-70 { padding: 70px; } + .padding-x-lg-10 { padding-left: 10px; padding-right: 10px; } + .padding-x-lg-20 { padding-left: 20px; padding-right: 20px; } + .padding-x-lg-30 { padding-left: 30px; padding-right: 30px; } + .padding-x-lg-40 { padding-left: 40px; padding-right: 40px; } + .padding-x-lg-50 { padding-left: 50px; padding-right: 50px; } + .padding-x-lg-60 { padding-left: 60px; padding-right: 60px; } + .padding-x-lg-70 { padding-left: 70px; padding-right: 70px; } + .padding-y-lg-10 { padding-top: 10px; padding-bottom: 10px; } + .padding-y-lg-20 { padding-top: 20px; padding-bottom: 20px; } + .padding-y-lg-30 { padding-top: 30px; padding-bottom: 30px; } + .padding-y-lg-40 { padding-top: 40px; padding-bottom: 40px; } + .padding-y-lg-50 { padding-top: 50px; padding-bottom: 50px; } + .padding-y-lg-60 { padding-top: 60px; padding-bottom: 60px; } + .padding-y-lg-70 { padding-top: 70px; padding-bottom: 70px; } +} +@include breakpoint-above(xl) { + .padding-xl-10 { padding: 10px; } + .padding-xl-20 { padding: 20px; } + .padding-xl-30 { padding: 30px; } + .padding-xl-40 { padding: 40px; } + .padding-xl-50 { padding: 50px; } + .padding-xl-60 { padding: 60px; } + .padding-xl-70 { padding: 70px; } + .padding-x-xl-10 { padding-left: 10px; padding-right: 10px; } + .padding-x-xl-20 { padding-left: 20px; padding-right: 20px; } + .padding-x-xl-30 { padding-left: 30px; padding-right: 30px; } + .padding-x-xl-40 { padding-left: 40px; padding-right: 40px; } + .padding-x-xl-50 { padding-left: 50px; padding-right: 50px; } + .padding-x-xl-60 { padding-left: 60px; padding-right: 60px; } + .padding-x-xl-70 { padding-left: 70px; padding-right: 70px; } + .padding-y-xl-10 { padding-top: 10px; padding-bottom: 10px; } + .padding-y-xl-20 { padding-top: 20px; padding-bottom: 20px; } + .padding-y-xl-30 { padding-top: 30px; padding-bottom: 30px; } + .padding-y-xl-40 { padding-top: 40px; padding-bottom: 40px; } + .padding-y-xl-50 { padding-top: 50px; padding-bottom: 50px; } + .padding-y-xl-60 { padding-top: 60px; padding-bottom: 60px; } + .padding-y-xl-70 { padding-top: 70px; padding-bottom: 70px; } +} +.padding-0 { padding: 0 !important; } +.padding-top-0 { padding-top: 0 !important; } +.padding-right-0 { padding-right: 0 !important; } +.padding-bottom-0 { padding-bottom: 0 !important; } +.padding-left-0 { padding-left: 0 !important; }
\ No newline at end of file diff --git a/assets/css/scss/helpers/_variables.scss b/assets/css/scss/helpers/_variables.scss new file mode 100644 index 0000000..0eadb79 --- /dev/null +++ b/assets/css/scss/helpers/_variables.scss @@ -0,0 +1,91 @@ +// +// Font // +// +$font-family-primary: 'Open Sans', sans-serif; +$font-family-secondary: 'Playfair Display', serif; +$font-family-tertiary: 'Poppins', sans-serif; +$font-weight-black: 900; +$font-weight-extra-bold: 800; +$font-weight-bold: 700; +$font-weight-semi-bold: 600; +$font-weight-medium: 500; +$font-weight-regular: 400; +$font-weight-light: 300; +$font-weight-extra-light: 200; +$font-weight-thin: 100; + +// +// Colors // +// +$color-white: #fff; +$color-black: #000; +$color-black-09: rgba(0, 0, 0, 0.9); +$color-black-08: rgba(0, 0, 0, 0.8); +$color-black-07: rgba(0, 0, 0, 0.7); +$color-black-06: rgba(0, 0, 0, 0.6); +$color-black-05: rgba(0, 0, 0, 0.5); +$color-black-04: rgba(0, 0, 0, 0.4); +$color-black-03: rgba(0, 0, 0, 0.3); +$color-black-02: rgba(0, 0, 0, 0.2); +$color-black-015: rgba(0, 0, 0, 0.15); +$color-black-01: rgba(0, 0, 0, 0.1); +$color-black-005: rgba(0, 0, 0, 0.05); +$color-white-09: rgba(255, 255, 255, 0.9); +$color-white-08: rgba(255, 255, 255, 0.8); +$color-white-07: rgba(255, 255, 255, 0.7); +$color-white-06: rgba(255, 255, 255, 0.6); +$color-white-05: rgba(255, 255, 255, 0.5); +$color-white-04: rgba(255, 255, 255, 0.4); +$color-white-03: rgba(255, 255, 255, 0.3); +$color-white-02: rgba(255, 255, 255, 0.2); +$color-white-015: rgba(255, 255, 255, 0.15); +$color-white-01: rgba(255, 255, 255, 0.1); +$color-primary: #7C7C7C; +$color-primary-lighter: #AAAAAA; +$color-green: #24963e; +$color-green-lighter: #28a745; +$color-red: #c62f3e; +$color-red-lighter: #dc3545; +$color-warning: #e5ad06; +$color-warning-lighter: #ffc107; +$color-info: #1491a5; +$color-info-lighter: #17a2b8; +$color-dark: rgb(19, 21, 23); +$color-dark-lighter: rgb(26, 28, 30); +$color-blue: #007bff; + +// +// Background colors // +// +$bg-dark: rgb(19, 21, 23); +$bg-dark-lighter: rgb(26, 28, 30); +$bg-dark-lightest: rgb(33, 35, 37); +$bg-dark-grey: rgb(48, 50, 52); +$bg-dark-grey-09: rgba(48, 50, 52, 0.9); +$bg-dark-grey-09: rgba(48, 50, 52, 0.9); +$bg-dark-grey-08: rgba(48, 50, 52, 0.8); +$bg-dark-grey-07: rgba(48, 50, 52, 0.7); +$bg-dark-grey-06: rgba(48, 50, 52, 0.6); +$bg-dark-grey-05: rgba(48, 50, 52, 0.5); +$bg-dark-grey-04: rgba(48, 50, 52, 0.4); +$bg-dark-grey-03: rgba(48, 50, 52, 0.3); +$bg-dark-grey-02: rgba(48, 50, 52, 0.2); +$bg-dark-grey-01: rgba(48, 50, 52, 0.1); +$bg-grey: rgb(239, 242, 245); +$bg-grey-lighter: rgb(242, 245, 248); +$bg-grey-lightest: rgb(245, 248, 251); + +// +// Border colors // +// +$border-dark: $color-dark; +$border-grey: rgb(227, 230, 233); + +// +// Button colors // +// +$button-dark: $color-dark; +$button-dark-lighter: rgb(29, 32, 35); +$button-grey: rgb(229, 232, 235); +$button-grey-lighter: rgb(239, 242, 245); +$button-grey-darker: rgb(221, 224, 227);
\ No newline at end of file diff --git a/assets/css/scss/theme.scss b/assets/css/scss/theme.scss new file mode 100644 index 0000000..d6c6b7d --- /dev/null +++ b/assets/css/scss/theme.scss @@ -0,0 +1,69 @@ +// +// Import Helpers // +// +@import "helpers/variables"; +@import "helpers/mixins"; + +// +// Import Google Fonts // +// +@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800'); +@import url('https://fonts.googleapis.com/css?family=Playfair+Display:400,700,900'); +@import url('https://fonts.googleapis.com/css?family=Poppins:100,200,300,400,500,600,700,800,900'); + +// +// Import Basic styles // +// +@import "basic/base"; +@import "basic/background"; +@import "basic/form"; +@import "basic/image"; +@import "basic/list"; +@import "basic/typography"; + +// +// Import Elements // +// +@import "elements/accordion"; +@import "elements/box"; +@import "elements/button"; +@import "elements/clients"; +@import "elements/contact-form"; +@import "elements/countdown"; +@import "elements/divider"; +@import "elements/feature-box"; +@import "elements/hoverbox"; +@import "elements/lightbox"; +@import "elements/map"; +@import "elements/pie-chart"; +@import "elements/prices"; +@import "elements/progress-bar"; +@import "elements/slider"; +@import "elements/team"; +@import "elements/testimonial"; +@import "elements/text-link"; +@import "elements/timeline"; + +// +// Import Components // +// +@import "components/blog"; +@import "components/cookie-consent"; +@import "components/fullscreen-menu"; +@import "components/gallery"; +@import "components/header"; +@import "components/masonry"; +@import "components/portfolio"; +@import "components/preloader"; +@import "components/section"; +@import "components/shop"; + +// +// Import Utilities // +// +@import "helpers/utilities"; + +// +// Import Custom Styles // +// +@import "helpers/custom";
\ No newline at end of file diff --git a/assets/css/theme.css b/assets/css/theme.css new file mode 100644 index 0000000..209110e --- /dev/null +++ b/assets/css/theme.css @@ -0,0 +1 @@ +@import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800");@import url("https://fonts.googleapis.com/css?family=Playfair+Display:400,700,900");@import url("https://fonts.googleapis.com/css?family=Poppins:100,200,300,400,500,600,700,800,900");html,body{width:100%;height:100%}body{overflow-x:hidden}.container,.container-fluid{position:relative;padding:0 30px}.row{margin-bottom:-30px}.row div[class^="col-"]:not(.row){margin-bottom:30px}.row .form-row div[class^="col-"]:not(.row){margin-bottom:0;padding-right:8px;padding-left:8px}@media (min-width: 768px){.col-spacing-70 .row:not([class^="col-spacing-"],[class*=" col-spacing-"]),.col-spacing-60 .row:not([class^="col-spacing-"],[class*=" col-spacing-"]),.col-spacing-50 .row:not([class^="col-spacing-"],[class*=" col-spacing-"]),.col-spacing-40 .row:not([class^="col-spacing-"],[class*=" col-spacing-"]){margin-right:-15px;margin-bottom:-30px;margin-left:-15px}.col-spacing-70 .row:not([class^="col-spacing-"],[class*=" col-spacing-"]) div[class^="col-"]:not(.row),.col-spacing-60 .row:not([class^="col-spacing-"],[class*=" col-spacing-"]) div[class^="col-"]:not(.row),.col-spacing-50 .row:not([class^="col-spacing-"],[class*=" col-spacing-"]) div[class^="col-"]:not(.row),.col-spacing-40 .row:not([class^="col-spacing-"],[class*=" col-spacing-"]) div[class^="col-"]:not(.row){margin-bottom:30px;padding:0 15px}.col-spacing-70{margin-right:-35px;margin-bottom:-70px;margin-left:-35px}.col-spacing-70 div[class^="col-"]:not(.row){margin-bottom:70px;padding:0 35px}.col-spacing-60{margin-right:-30px;margin-bottom:-60px;margin-left:-30px}.col-spacing-60 div[class^="col-"]:not(.row){margin-bottom:60px;padding:0 30px}.col-spacing-50{margin-right:-25px;margin-bottom:-50px;margin-left:-25px}.col-spacing-50 div[class^="col-"]:not(.row){margin-bottom:50px;padding:0 25px}.col-spacing-40{margin-right:-20px;margin-bottom:-40px;margin-left:-20px}.col-spacing-40 div[class^="col-"]:not(.row){margin-bottom:40px;padding:0 20px}.container-fluid .col-spacing-70{margin-right:5px;margin-left:5px}.container-fluid .col-spacing-60{margin-right:0;margin-left:0}.container-fluid .col-spacing-50{margin-right:-5px;margin-left:-5px}.container-fluid .col-spacing-40{margin-right:-10px;margin-left:-10px}}.col-spacing-20 .row,.col-spacing-10 .row,.col-spacing-0 .row{margin-right:-15px;margin-bottom:-30px;margin-left:-15px}.col-spacing-20 .row div[class^="col-"]:not(.row),.col-spacing-10 .row div[class^="col-"]:not(.row),.col-spacing-0 .row div[class^="col-"]:not(.row){margin-bottom:30px;padding:0 15px}.col-spacing-20{margin-right:-10px;margin-bottom:-20px;margin-left:-10px}.col-spacing-20 div[class^="col-"]:not(.row){margin-bottom:20px;padding:0 10px}.col-spacing-10{margin-right:-5px;margin-bottom:-10px;margin-left:-5px}.col-spacing-10 div[class^="col-"]:not(.row){margin-bottom:10px;padding:0 5px}.col-spacing-0{margin-right:0;margin-bottom:0;margin-left:0}.col-spacing-0 div[class^="col-"]:not(.row){margin-bottom:0;padding:0}.container-fluid .col-spacing-20{margin-right:-20px;margin-left:-20px}.container-fluid .col-spacing-10{margin-right:-25px;margin-left:-25px}.container-fluid .col-spacing-0{margin-right:-30px;margin-left:-30px}.position-center{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}.position-middle{position:relative;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);margin:0 auto}.position-top,.position-bottom{position:absolute;left:0;width:100%}.position-top{top:30px}.position-bottom{bottom:30px}.container .position-top,.container .position-bottom,.container-fluid .position-top,.container-fluid .position-bottom{padding:0 30px}mark{background:#eff2f5;color:#131517}iframe{width:100%;border:0}pre{border:1px solid rgba(0,0,0,0.1);border-radius:0.375em;padding:6px 20px;color:#7C7C7C}div[class^='bg-black'] pre,div[class*=' bg-black'] pre,div[class^='bg-dark'] pre,div[class*=' bg-dark'] pre{border-color:rgba(255,255,255,0.2);color:rgba(255,255,255,0.6)}.badge{padding:4px 6px;vertical-align:middle}.badge-xs{padding:4px 6px}.badge-sm{padding:8px 12px}.badge-md{padding:10px 16px;font-size:80%}.badge-lg{padding:14px 20px;font-size:90%}.badge-xl{padding:18px 30px;font-size:100%}.blockquote{background:#f2f5f8;margin-bottom:20px;border-left:4px solid rgba(0,0,0,0.1);padding:24px 30px}@media (max-width: 767.98px){.blockquote{padding:16px 20px}}.blockquote p{font-size:16px;line-height:30px}.blockquote p.font-small{font-size:14px;line-height:26px}.blockquote p.font-large{font-size:20px;line-height:36px}.blockquote .blockquote-footer{margin-top:10px;color:#131517}.blockquote .blockquote-footer:before{padding-right:5px}.blockquote .blockquote-footer h1,.blockquote .blockquote-footer h2,.blockquote .blockquote-footer h3,.blockquote .blockquote-footer h4,.blockquote .blockquote-footer h5,.blockquote .blockquote-footer h6{display:inline-block;margin:0}.blockquote .blockquote-footer p{font-size:16px;line-height:30px}.blockquote.style-2{background:transparent;padding:16px 30px}@media (max-width: 767.98px){.blockquote.style-2{padding:16px 20px}}.blockquote.style-3{position:relative;background:transparent;border:0;padding:20px 20px 20px 40px}@media (max-width: 767.98px){.blockquote.style-3{padding:16px 16px 16px 36px}}.blockquote.style-3:before{content:'\f10d';position:absolute;top:0;left:0;color:rgba(0,0,0,0.1);font-family:"Font Awesome 5 Free";font-size:24px;font-weight:900}div[class^='bg-black'] .blockquote,div[class*=' bg-black'] .blockquote,div[class^='bg-dark'] .blockquote,div[class*=' bg-dark'] .blockquote{background:rgba(255,255,255,0.1);border-color:rgba(255,255,255,0.2)}div[class^='bg-black'] .blockquote .blockquote-footer,div[class*=' bg-black'] .blockquote .blockquote-footer,div[class^='bg-dark'] .blockquote .blockquote-footer,div[class*=' bg-dark'] .blockquote .blockquote-footer{color:#fff}div[class^='bg-black'] .blockquote.style-2,div[class*=' bg-black'] .blockquote.style-2,div[class^='bg-dark'] .blockquote.style-2,div[class*=' bg-dark'] .blockquote.style-2{background:transparent;border-color:rgba(255,255,255,0.2)}div[class^='bg-black'] .blockquote.style-3,div[class*=' bg-black'] .blockquote.style-3,div[class^='bg-dark'] .blockquote.style-3,div[class*=' bg-dark'] .blockquote.style-3{background:transparent}div[class^='bg-black'] .blockquote.style-3:before,div[class*=' bg-black'] .blockquote.style-3:before,div[class^='bg-dark'] .blockquote.style-3:before,div[class*=' bg-dark'] .blockquote.style-3:before{color:rgba(255,255,255,0.2)}.breadcrumb{display:inline-block;background:transparent;margin:0 0 -10px;padding:0}.breadcrumb .breadcrumb-item{display:inline-block;font:400 13px "Open Sans",sans-serif;letter-spacing:1px;text-transform:uppercase}.breadcrumb .breadcrumb-item:before{color:rgba(0,0,0,0.2)}.breadcrumb .breadcrumb-item.active{color:#aaa}.breadcrumb .breadcrumb-item a{-webkit-transition:linear 0.1s;transition:linear 0.1s}div[class^='bg-black'] .breadcrumb .breadcrumb-item:before,div[class*=' bg-black'] .breadcrumb .breadcrumb-item:before,div[class^='bg-dark'] .breadcrumb .breadcrumb-item:before,div[class*=' bg-dark'] .breadcrumb .breadcrumb-item:before{color:rgba(255,255,255,0.3)}div[class^='bg-black'] .breadcrumb .breadcrumb-item.active,div[class*=' bg-black'] .breadcrumb .breadcrumb-item.active,div[class^='bg-dark'] .breadcrumb .breadcrumb-item.active,div[class*=' bg-dark'] .breadcrumb .breadcrumb-item.active{color:rgba(255,255,255,0.5)}.card{border:1px solid rgba(0,0,0,0.1)}.dropdown .dropdown-menu,.btn-group .dropdown-menu{border:0;border-radius:0;-webkit-box-shadow:0 6px 36px -4px rgba(22,24,26,0.14);box-shadow:0 6px 36px -4px rgba(22,24,26,0.14);padding:15px 20px}.dropdown .dropdown-menu .dropdown-item,.btn-group .dropdown-menu .dropdown-item{margin-bottom:10px;padding:0;color:#131517;font:300 15px "Open Sans",sans-serif;letter-spacing:0;text-transform:none;-webkit-transition:linear 0.1s;transition:linear 0.1s}.dropdown .dropdown-menu .dropdown-item:last-child,.btn-group .dropdown-menu .dropdown-item:last-child{margin:0}.dropdown .dropdown-menu .dropdown-item:hover,.dropdown .dropdown-menu .dropdown-item:focus,.dropdown .dropdown-menu .dropdown-item:active,.btn-group .dropdown-menu .dropdown-item:hover,.btn-group .dropdown-menu .dropdown-item:focus,.btn-group .dropdown-menu .dropdown-item:active{background:transparent;color:#7C7C7C}.modal.fade .modal-dialog{-webkit-transition:ease-out 0.2s;transition:ease-out 0.2s;-webkit-transform:translate(0) scale(0.98);transform:translate(0) scale(0.98)}.modal.show .modal-dialog{-webkit-transform:translate(0) scale(1);transform:translate(0) scale(1)}.modal .modal-content{-webkit-box-shadow:0 6px 36px -4px rgba(22,24,26,0.3);box-shadow:0 6px 36px -4px rgba(22,24,26,0.3);border:0}.modal .modal-content .modal-header{border-bottom:1px solid rgba(0,0,0,0.1)}.modal .modal-content .modal-footer{border-top:1px solid rgba(0,0,0,0.1)}.nav{margin:0;padding:0}.nav .nav-item{margin:0 30px 0 0}.nav .nav-item:last-child{margin-right:0}.nav .nav-item .nav-link{padding:0;color:#7C7C7C;-webkit-transition:linear 0.1s;transition:linear 0.1s}.nav .nav-item .nav-link h1,.nav .nav-item .nav-link h2,.nav .nav-item .nav-link h3,.nav .nav-item .nav-link h4,.nav .nav-item .nav-link h5,.nav .nav-item .nav-link h6{margin:0;color:#7C7C7C;-webkit-transition:linear 0.1s;transition:linear 0.1s}.nav .nav-item .nav-link.active,.nav .nav-item .nav-link:hover{color:#131517}.nav .nav-item .nav-link.active h1,.nav .nav-item .nav-link.active h2,.nav .nav-item .nav-link.active h3,.nav .nav-item .nav-link.active h4,.nav .nav-item .nav-link.active h5,.nav .nav-item .nav-link.active h6,.nav .nav-item .nav-link:hover h1,.nav .nav-item .nav-link:hover h2,.nav .nav-item .nav-link:hover h3,.nav .nav-item .nav-link:hover h4,.nav .nav-item .nav-link:hover h5,.nav .nav-item .nav-link:hover h6{color:#131517}.nav .nav-item .nav-link.disabled{color:#aaa}.nav.nav-tabs{border-bottom:1px solid #e3e6e9}.nav.nav-tabs .nav-item{margin:0 0 -1px}.nav.nav-tabs .nav-item .nav-link{background:transparent;padding:10px 20px;color:#7C7C7C}.nav.nav-tabs .nav-item .nav-link:hover{border-color:#e3e6e9}.nav.nav-tabs .nav-item .nav-link.active{border-color:#e3e6e9 #e3e6e9 #fff;color:#131517}.nav.nav-tabs .nav-item .nav-link.disabled:hover{border-color:transparent}.nav.nav-pills .nav-item{margin:0}.nav.nav-pills .nav-item .nav-link{padding:10px 20px}.nav.nav-pills .nav-item .nav-link.active,.nav.nav-pills .nav-item .show .nav-link{background:#131517;color:#fff}.nav.nav-pills .nav-item h1,.nav.nav-pills .nav-item h2,.nav.nav-pills .nav-item h3,.nav.nav-pills .nav-item h4,.nav.nav-pills .nav-item h5,.nav.nav-pills .nav-item h6{margin:0}.nav.tabs{display:inline-block;border:1px solid #e3e6e9;border-radius:0.375em}.nav.tabs .nav-item{display:inline-block;margin:0}.nav.tabs .nav-item .nav-link{padding:10px 20px;border-right:1px solid #e3e6e9}.nav.tabs .nav-item:last-child .nav-link{border:0}.nav.nav-custom .nav-item .nav-link{position:relative;overflow:visible}.nav.nav-custom .nav-item .nav-link:after{content:'';position:absolute;right:0;bottom:-1px;left:0;background:#131517;height:1px;-webkit-animation:button-line-out 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both;animation:button-line-out 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both}.nav.nav-custom .nav-item .nav-link.active:after{width:100%;-webkit-animation:button-line-in 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both;animation:button-line-in 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both}div[class^='bg-black'] .nav .nav-item .nav-link,div[class*=' bg-black'] .nav .nav-item .nav-link,div[class^='bg-dark'] .nav .nav-item .nav-link,div[class*=' bg-dark'] .nav .nav-item .nav-link{color:rgba(255,255,255,0.8)}div[class^='bg-black'] .nav .nav-item .nav-link.active,div[class^='bg-black'] .nav .nav-item .nav-link:hover,div[class*=' bg-black'] .nav .nav-item .nav-link.active,div[class*=' bg-black'] .nav .nav-item .nav-link:hover,div[class^='bg-dark'] .nav .nav-item .nav-link.active,div[class^='bg-dark'] .nav .nav-item .nav-link:hover,div[class*=' bg-dark'] .nav .nav-item .nav-link.active,div[class*=' bg-dark'] .nav .nav-item .nav-link:hover{color:#fff}div[class^='bg-black'] .nav.nav-tabs,div[class*=' bg-black'] .nav.nav-tabs,div[class^='bg-dark'] .nav.nav-tabs,div[class*=' bg-dark'] .nav.nav-tabs{border-color:rgba(255,255,255,0.2)}div[class^='bg-black'] .nav.nav-tabs .nav-item .nav-link,div[class*=' bg-black'] .nav.nav-tabs .nav-item .nav-link,div[class^='bg-dark'] .nav.nav-tabs .nav-item .nav-link,div[class*=' bg-dark'] .nav.nav-tabs .nav-item .nav-link{color:rgba(255,255,255,0.8)}div[class^='bg-black'] .nav.nav-tabs .nav-item .nav-link.active,div[class^='bg-black'] .nav.nav-tabs .nav-item .nav-link:hover,div[class*=' bg-black'] .nav.nav-tabs .nav-item .nav-link.active,div[class*=' bg-black'] .nav.nav-tabs .nav-item .nav-link:hover,div[class^='bg-dark'] .nav.nav-tabs .nav-item .nav-link.active,div[class^='bg-dark'] .nav.nav-tabs .nav-item .nav-link:hover,div[class*=' bg-dark'] .nav.nav-tabs .nav-item .nav-link.active,div[class*=' bg-dark'] .nav.nav-tabs .nav-item .nav-link:hover{border-color:rgba(255,255,255,0.2) rgba(255,255,255,0.2) transparent}div[class^='bg-black'] .nav.nav-tabs .nav-item .nav-link.active,div[class*=' bg-black'] .nav.nav-tabs .nav-item .nav-link.active,div[class^='bg-dark'] .nav.nav-tabs .nav-item .nav-link.active,div[class*=' bg-dark'] .nav.nav-tabs .nav-item .nav-link.active{color:#fff}div[class^='bg-black'] .nav.nav-pills .nav-item .nav-link.active,div[class^='bg-black'] .nav.nav-pills .nav-item .show .nav-link,div[class*=' bg-black'] .nav.nav-pills .nav-item .nav-link.active,div[class*=' bg-black'] .nav.nav-pills .nav-item .show .nav-link,div[class^='bg-dark'] .nav.nav-pills .nav-item .nav-link.active,div[class^='bg-dark'] .nav.nav-pills .nav-item .show .nav-link,div[class*=' bg-dark'] .nav.nav-pills .nav-item .nav-link.active,div[class*=' bg-dark'] .nav.nav-pills .nav-item .show .nav-link{background:#fff;color:#131517}div[class^='bg-black'] .nav.tabs,div[class*=' bg-black'] .nav.tabs,div[class^='bg-dark'] .nav.tabs,div[class*=' bg-dark'] .nav.tabs{border:1px solid rgba(255,255,255,0.2)}div[class^='bg-black'] .nav.tabs .nav-item .nav-link,div[class*=' bg-black'] .nav.tabs .nav-item .nav-link,div[class^='bg-dark'] .nav.tabs .nav-item .nav-link,div[class*=' bg-dark'] .nav.tabs .nav-item .nav-link{border-right:1px solid rgba(255,255,255,0.2)}div[class^='bg-black'] .nav.nav-custom .nav-item .nav-link:after,div[class*=' bg-black'] .nav.nav-custom .nav-item .nav-link:after,div[class^='bg-dark'] .nav.nav-custom .nav-item .nav-link:after,div[class*=' bg-dark'] .nav.nav-custom .nav-item .nav-link:after{background:#fff}.pagination{margin:0;padding:0}.pagination .page-item{margin:0 6px 0 0;text-align:center}.pagination .page-item:last-child{margin-right:0}.pagination .page-item .page-link{background:transparent;min-width:31px;height:31px;border:0;border-radius:20px;padding:0;color:#7C7C7C;font-size:14px;line-height:31px;-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}.pagination .page-item .page-link:hover{background:#e5e8eb}.pagination .page-item.active .page-link{background:#e5e8eb;color:#131517}.pagination.pagination-sm .page-item .page-link{min-width:27px;height:27px;border-radius:20px;padding:0;line-height:27px}.pagination.pagination-lg .page-item .page-link{min-width:35px;height:35px;border-radius:20px;padding:0;line-height:35px}.pagination.hover-style-2 .page-item .page-link:hover{background:#e3e6e9;border-color:#e3e6e9}.pagination.hover-style-2 .page-item.active .page-link{background:#131517;border-color:#131517;color:#fff}div[class^='bg-black'] .pagination .page-item .page-link,div[class*=' bg-black'] .pagination .page-item .page-link,div[class^='bg-dark'] .pagination .page-item .page-link,div[class*=' bg-dark'] .pagination .page-item .page-link{color:rgba(255,255,255,0.7)}div[class^='bg-black'] .pagination .page-item .page-link:hover,div[class*=' bg-black'] .pagination .page-item .page-link:hover,div[class^='bg-dark'] .pagination .page-item .page-link:hover,div[class*=' bg-dark'] .pagination .page-item .page-link:hover{background:rgba(255,255,255,0.1)}div[class^='bg-black'] .pagination .page-item.active .page-link,div[class*=' bg-black'] .pagination .page-item.active .page-link,div[class^='bg-dark'] .pagination .page-item.active .page-link,div[class*=' bg-dark'] .pagination .page-item.active .page-link{background:rgba(255,255,255,0.1);color:#fff}div[class^='bg-black'] .pagination.hover-style-2 .page-item .page-link:hover,div[class*=' bg-black'] .pagination.hover-style-2 .page-item .page-link:hover,div[class^='bg-dark'] .pagination.hover-style-2 .page-item .page-link:hover,div[class*=' bg-dark'] .pagination.hover-style-2 .page-item .page-link:hover{background:#fff;border-color:#fff;color:rgba(0,0,0,0.9)}div[class^='bg-black'] .pagination.hover-style-2 .page-item.active .page-link,div[class*=' bg-black'] .pagination.hover-style-2 .page-item.active .page-link,div[class^='bg-dark'] .pagination.hover-style-2 .page-item.active .page-link,div[class*=' bg-dark'] .pagination.hover-style-2 .page-item.active .page-link{background:#fff;border-color:#fff;color:rgba(0,0,0,0.9)}.popover{border:0;-webkit-box-shadow:0 0 12px 0 rgba(0,0,0,0.08);box-shadow:0 0 12px 0 rgba(0,0,0,0.08)}.popover .arrow:before{border:0}.popover .popover-header{background:transparent;padding:15px 20px;font-size:16px;line-height:32px}.popover .popover-body{padding:20px}.table td,.table th{border-top:1px solid #e3e6e9}.table thead th{border-bottom:2px solid #e3e6e9}.table.table-dark{background:#1a1c1e}.table.table-dark thead th{border-bottom:2px solid rgba(255,255,255,0.1)}.table.table-dark td,.table.table-dark th{border-top:1px solid rgba(255,255,255,0.1)}.table.table-bordered td,.table.table-bordered th{border:1px solid #e3e6e9}.table.table-bordered.table-dark td,.table.table-bordered.table-dark th{border:1px solid rgba(255,255,255,0.1)}.table .thead-dark th{background:#1a1c1e;border-color:rgba(255,255,255,0.1)}.table .thead-light th{background:#eff2f5}.table .table-active td,.table .table-active th{background:#dde0e3}.table .table-secondary td,.table .table-secondary th{background:#e5e8eb}.table .table-light td,.table .table-light th{background:#f2f5f8}.table .table-dark td,.table .table-dark th{background:#e5e8eb}.scrolltotop{position:fixed;right:20px;bottom:20px;-webkit-transform:translateY(20px);transform:translateY(20px);z-index:992;visibility:hidden;opacity:0;-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}.scrolltotop.scrolltotop-show{-webkit-transform:translateY(0);transform:translateY(0);visibility:visible;opacity:1}[data-sal]{-webkit-transition-duration:.5s;transition-duration:.5s}.bg-image{position:relative;background-position:center center;background-attachment:scroll;-webkit-background-size:cover;-moz-background-size:cover;background-size:cover;background-repeat:no-repeat}.bg-image[class^="bg-image-gradient-"]:before,.bg-image[class*=" bg-image-gradient-"]:before{content:'';position:absolute;width:100%;height:100%}.bg-image.bg-image-gradient-top:before{background-image:linear-gradient(to top, #fff, rgba(255,255,255,0.2))}.bg-image.bg-image-gradient-right:before{background-image:linear-gradient(to right, #fff, rgba(255,255,255,0.2))}.bg-image.bg-image-gradient-bottom:before{background-image:linear-gradient(to bottom, #fff, rgba(255,255,255,0.2))}.bg-image.bg-image-gradient-left:before{background-image:linear-gradient(to left, #fff, rgba(255,255,255,0.2))}.bg-image.bg-image-gradient-black-top:before{background-image:linear-gradient(to top, #000, rgba(0,0,0,0.2))}.bg-image.bg-image-gradient-black-right:before{background-image:linear-gradient(to right, #000, rgba(0,0,0,0.2))}.bg-image.bg-image-gradient-black-bottom:before{background-image:linear-gradient(to bottom, #000, rgba(0,0,0,0.2))}.bg-image.bg-image-gradient-black-left:before{background-image:linear-gradient(to left, #000, rgba(0,0,0,0.2))}.bg-video{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1}.bg-video video{object-fit:cover;width:100%;height:100%}.form-row{margin-right:-8px;margin-left:-8px}.form-row div[class^="col-"],.form-row div[class*=" col-"],.form-row .col{margin:0;padding-right:8px;padding-left:8px}input,textarea{background:transparent;width:100%;border:1px solid rgba(0,0,0,0.1);margin-bottom:1rem;padding:15px 20px;box-shadow:none;font:400 15px "Open Sans",sans-serif;line-height:1.4;-webkit-transition:ease-out 0.16s;transition:ease-out 0.16s}input:focus,input:active,textarea:focus,textarea:active{outline:0;box-shadow:none}textarea{height:140px}input,textarea,.form-control{color:#7C7C7C}input::-webkit-input-placeholder,textarea::-webkit-input-placeholder,.form-control::-webkit-input-placeholder{color:#aaa}input::-moz-placeholder,textarea::-moz-placeholder,.form-control::-moz-placeholder{color:#aaa}input:-ms-placeholder,textarea:-ms-placeholder,.form-control:-ms-placeholder{color:#aaa}input::-ms-placeholder,textarea::-ms-placeholder,.form-control::-ms-placeholder{color:#aaa}input::placeholder,textarea::placeholder,.form-control::placeholder{color:#aaa}input:focus,textarea:focus,.form-control:focus{border-color:rgba(0,0,0,0.2)}input[type="checkbox"],input[type="radio"]{width:auto}.form-control{background:transparent;height:auto;border:1px solid rgba(0,0,0,0.1);border-radius:0;padding:15px 20px;font:400 15px "Open Sans",sans-serif;line-height:1.4}.form-control:focus{background:transparent;box-shadow:none}.form-control:read-only{background:#e5e8eb;border:0}.form-control.form-control-sm{padding:10px 15px;font-size:0.875rem}.form-control.form-control-lg{font-size:1.25rem}.form-control-plaintext{border:0}.form-check-input:disabled~.form-check-label{color:#aaa}.required:after{content:'*';padding-left:3px}select{margin-bottom:16px}.custom-select{background-color:transparent;width:auto;min-width:160px;height:auto;border-radius:0;padding:15px 20px;border-color:rgba(0,0,0,0.1);color:#7C7C7C;font:400 15px "Open Sans",sans-serif;line-height:1.4;-webkit-transition:ease-out 0.16s;transition:ease-out 0.16s}.custom-select:focus{border-color:rgba(0,0,0,0.2);outline:0;box-shadow:none}.custom-select.custom-select-sm{height:auto;padding:10px 15px;font-size:0.875rem}.custom-select.custom-select-lg{height:auto;padding:15px 20px;font-size:1.25rem}.custom-select.select-fullwidth{width:100%}form.form-style-3 input,form.form-style-3 textarea,form.form-style-3 .custom-select,form.form-style-3 .form-control,.form-style-3 input,.form-style-3 textarea,.form-style-3 .custom-select,.form-style-3 .form-control,form.form-style-4 input,form.form-style-4 textarea,form.form-style-4 .custom-select,form.form-style-4 .form-control,.form-style-4 input,.form-style-4 textarea,.form-style-4 .custom-select,.form-style-4 .form-control{margin-bottom:20px;padding:0 0 10px;border-top-width:0;border-right-width:0;border-bottom-width:1px;border-left-width:0}form.form-style-2 input:focus,form.form-style-2 textarea:focus,form.form-style-2 .custom-select:focus,form.form-style-2 .form-control:focus,.form-style-2 input:focus,.form-style-2 textarea:focus,.form-style-2 .custom-select:focus,.form-style-2 .form-control:focus,form.form-style-4 input:focus,form.form-style-4 textarea:focus,form.form-style-4 .custom-select:focus,form.form-style-4 .form-control:focus,.form-style-4 input:focus,.form-style-4 textarea:focus,.form-style-4 .custom-select:focus,.form-style-4 .form-control:focus{border-color:rgba(0,0,0,0.9)}form.form-style-5 input,form.form-style-5 textarea,form.form-style-5 .custom-select,form.form-style-5 .form-control,.form-style-5 input,.form-style-5 textarea,.form-style-5 .custom-select,.form-style-5 .form-control{background:#eff2f5;border:0}form.form-style-5 input:focus,form.form-style-5 textarea:focus,form.form-style-5 .custom-select:focus,form.form-style-5 .form-control:focus,.form-style-5 input:focus,.form-style-5 textarea:focus,.form-style-5 .custom-select:focus,.form-style-5 .form-control:focus{background:#eff2f5}div[class^='bg-grey'] form.form-style-5 input,div[class^='bg-grey'] form.form-style-5 textarea,div[class^='bg-grey'] form.form-style-5 .custom-select,div[class^='bg-grey'] form.form-style-5 .form-control,div[class^='bg-grey'] .form-style-5 input,div[class^='bg-grey'] .form-style-5 textarea,div[class^='bg-grey'] .form-style-5 .custom-select,div[class^='bg-grey'] .form-style-5 .form-control,div[class*=' bg-grey'] form.form-style-5 input,div[class*=' bg-grey'] form.form-style-5 textarea,div[class*=' bg-grey'] form.form-style-5 .custom-select,div[class*=' bg-grey'] form.form-style-5 .form-control,div[class*=' bg-grey'] .form-style-5 input,div[class*=' bg-grey'] .form-style-5 textarea,div[class*=' bg-grey'] .form-style-5 .custom-select,div[class*=' bg-grey'] .form-style-5 .form-control{background:#fff}div[class^='bg-grey'] form.form-style-5 input:focus,div[class^='bg-grey'] form.form-style-5 textarea:focus,div[class^='bg-grey'] form.form-style-5 .custom-select:focus,div[class^='bg-grey'] form.form-style-5 .form-control:focus,div[class^='bg-grey'] .form-style-5 input:focus,div[class^='bg-grey'] .form-style-5 textarea:focus,div[class^='bg-grey'] .form-style-5 .custom-select:focus,div[class^='bg-grey'] .form-style-5 .form-control:focus,div[class*=' bg-grey'] form.form-style-5 input:focus,div[class*=' bg-grey'] form.form-style-5 textarea:focus,div[class*=' bg-grey'] form.form-style-5 .custom-select:focus,div[class*=' bg-grey'] form.form-style-5 .form-control:focus,div[class*=' bg-grey'] .form-style-5 input:focus,div[class*=' bg-grey'] .form-style-5 textarea:focus,div[class*=' bg-grey'] .form-style-5 .custom-select:focus,div[class*=' bg-grey'] .form-style-5 .form-control:focus{background:#fff}div[class^='bg-black'] input,div[class^='bg-black'] textarea,div[class^='bg-black'] .form-control,div[class*=' bg-black'] input,div[class*=' bg-black'] textarea,div[class*=' bg-black'] .form-control,div[class^='bg-dark'] input,div[class^='bg-dark'] textarea,div[class^='bg-dark'] .form-control,div[class*=' bg-dark'] input,div[class*=' bg-dark'] textarea,div[class*=' bg-dark'] .form-control{background:transparent;border-color:rgba(255,255,255,0.2);color:rgba(255,255,255,0.7)}div[class^='bg-black'] input::-webkit-input-placeholder,div[class^='bg-black'] textarea::-webkit-input-placeholder,div[class^='bg-black'] .form-control::-webkit-input-placeholder,div[class*=' bg-black'] input::-webkit-input-placeholder,div[class*=' bg-black'] textarea::-webkit-input-placeholder,div[class*=' bg-black'] .form-control::-webkit-input-placeholder,div[class^='bg-dark'] input::-webkit-input-placeholder,div[class^='bg-dark'] textarea::-webkit-input-placeholder,div[class^='bg-dark'] .form-control::-webkit-input-placeholder,div[class*=' bg-dark'] input::-webkit-input-placeholder,div[class*=' bg-dark'] textarea::-webkit-input-placeholder,div[class*=' bg-dark'] .form-control::-webkit-input-placeholder{color:rgba(255,255,255,0.5)}div[class^='bg-black'] input::-moz-placeholder,div[class^='bg-black'] textarea::-moz-placeholder,div[class^='bg-black'] .form-control::-moz-placeholder,div[class*=' bg-black'] input::-moz-placeholder,div[class*=' bg-black'] textarea::-moz-placeholder,div[class*=' bg-black'] .form-control::-moz-placeholder,div[class^='bg-dark'] input::-moz-placeholder,div[class^='bg-dark'] textarea::-moz-placeholder,div[class^='bg-dark'] .form-control::-moz-placeholder,div[class*=' bg-dark'] input::-moz-placeholder,div[class*=' bg-dark'] textarea::-moz-placeholder,div[class*=' bg-dark'] .form-control::-moz-placeholder{color:rgba(255,255,255,0.5)}div[class^='bg-black'] input:-ms-placeholder,div[class^='bg-black'] textarea:-ms-placeholder,div[class^='bg-black'] .form-control:-ms-placeholder,div[class*=' bg-black'] input:-ms-placeholder,div[class*=' bg-black'] textarea:-ms-placeholder,div[class*=' bg-black'] .form-control:-ms-placeholder,div[class^='bg-dark'] input:-ms-placeholder,div[class^='bg-dark'] textarea:-ms-placeholder,div[class^='bg-dark'] .form-control:-ms-placeholder,div[class*=' bg-dark'] input:-ms-placeholder,div[class*=' bg-dark'] textarea:-ms-placeholder,div[class*=' bg-dark'] .form-control:-ms-placeholder{color:rgba(255,255,255,0.5)}div[class^='bg-black'] input::-ms-placeholder,div[class^='bg-black'] textarea::-ms-placeholder,div[class^='bg-black'] .form-control::-ms-placeholder,div[class*=' bg-black'] input::-ms-placeholder,div[class*=' bg-black'] textarea::-ms-placeholder,div[class*=' bg-black'] .form-control::-ms-placeholder,div[class^='bg-dark'] input::-ms-placeholder,div[class^='bg-dark'] textarea::-ms-placeholder,div[class^='bg-dark'] .form-control::-ms-placeholder,div[class*=' bg-dark'] input::-ms-placeholder,div[class*=' bg-dark'] textarea::-ms-placeholder,div[class*=' bg-dark'] .form-control::-ms-placeholder{color:rgba(255,255,255,0.5)}div[class^='bg-black'] input::placeholder,div[class^='bg-black'] textarea::placeholder,div[class^='bg-black'] .form-control::placeholder,div[class*=' bg-black'] input::placeholder,div[class*=' bg-black'] textarea::placeholder,div[class*=' bg-black'] .form-control::placeholder,div[class^='bg-dark'] input::placeholder,div[class^='bg-dark'] textarea::placeholder,div[class^='bg-dark'] .form-control::placeholder,div[class*=' bg-dark'] input::placeholder,div[class*=' bg-dark'] textarea::placeholder,div[class*=' bg-dark'] .form-control::placeholder{color:rgba(255,255,255,0.5)}div[class^='bg-black'] input:focus,div[class^='bg-black'] textarea:focus,div[class^='bg-black'] .form-control:focus,div[class*=' bg-black'] input:focus,div[class*=' bg-black'] textarea:focus,div[class*=' bg-black'] .form-control:focus,div[class^='bg-dark'] input:focus,div[class^='bg-dark'] textarea:focus,div[class^='bg-dark'] .form-control:focus,div[class*=' bg-dark'] input:focus,div[class*=' bg-dark'] textarea:focus,div[class*=' bg-dark'] .form-control:focus{border-color:rgba(255,255,255,0.3)}div[class^='bg-black'] .custom-select,div[class*=' bg-black'] .custom-select,div[class^='bg-dark'] .custom-select,div[class*=' bg-dark'] .custom-select{background:transparent;border-color:rgba(255,255,255,0.2);color:rgba(255,255,255,0.7)}div[class^='bg-black'] .custom-select:focus,div[class*=' bg-black'] .custom-select:focus,div[class^='bg-dark'] .custom-select:focus,div[class*=' bg-dark'] .custom-select:focus{border-color:rgba(255,255,255,0.3)}div[class^='bg-black'] form.form-style-2 input:focus,div[class^='bg-black'] form.form-style-2 textarea:focus,div[class^='bg-black'] form.form-style-2 .custom-select:focus,div[class^='bg-black'] form.form-style-2 .form-control:focus,div[class^='bg-black'] .form-style-2 input:focus,div[class^='bg-black'] .form-style-2 textarea:focus,div[class^='bg-black'] .form-style-2 .custom-select:focus,div[class^='bg-black'] .form-style-2 .form-control:focus,div[class^='bg-black'] form.form-style-4 input:focus,div[class^='bg-black'] form.form-style-4 textarea:focus,div[class^='bg-black'] form.form-style-4 .custom-select:focus,div[class^='bg-black'] form.form-style-4 .form-control:focus,div[class^='bg-black'] .form-style-4 input:focus,div[class^='bg-black'] .form-style-4 textarea:focus,div[class^='bg-black'] .form-style-4 .custom-select:focus,div[class^='bg-black'] .form-style-4 .form-control:focus,div[class*=' bg-black'] form.form-style-2 input:focus,div[class*=' bg-black'] form.form-style-2 textarea:focus,div[class*=' bg-black'] form.form-style-2 .custom-select:focus,div[class*=' bg-black'] form.form-style-2 .form-control:focus,div[class*=' bg-black'] .form-style-2 input:focus,div[class*=' bg-black'] .form-style-2 textarea:focus,div[class*=' bg-black'] .form-style-2 .custom-select:focus,div[class*=' bg-black'] .form-style-2 .form-control:focus,div[class*=' bg-black'] form.form-style-4 input:focus,div[class*=' bg-black'] form.form-style-4 textarea:focus,div[class*=' bg-black'] form.form-style-4 .custom-select:focus,div[class*=' bg-black'] form.form-style-4 .form-control:focus,div[class*=' bg-black'] .form-style-4 input:focus,div[class*=' bg-black'] .form-style-4 textarea:focus,div[class*=' bg-black'] .form-style-4 .custom-select:focus,div[class*=' bg-black'] .form-style-4 .form-control:focus,div[class^='bg-dark'] form.form-style-2 input:focus,div[class^='bg-dark'] form.form-style-2 textarea:focus,div[class^='bg-dark'] form.form-style-2 .custom-select:focus,div[class^='bg-dark'] form.form-style-2 .form-control:focus,div[class^='bg-dark'] .form-style-2 input:focus,div[class^='bg-dark'] .form-style-2 textarea:focus,div[class^='bg-dark'] .form-style-2 .custom-select:focus,div[class^='bg-dark'] .form-style-2 .form-control:focus,div[class^='bg-dark'] form.form-style-4 input:focus,div[class^='bg-dark'] form.form-style-4 textarea:focus,div[class^='bg-dark'] form.form-style-4 .custom-select:focus,div[class^='bg-dark'] form.form-style-4 .form-control:focus,div[class^='bg-dark'] .form-style-4 input:focus,div[class^='bg-dark'] .form-style-4 textarea:focus,div[class^='bg-dark'] .form-style-4 .custom-select:focus,div[class^='bg-dark'] .form-style-4 .form-control:focus,div[class*=' bg-dark'] form.form-style-2 input:focus,div[class*=' bg-dark'] form.form-style-2 textarea:focus,div[class*=' bg-dark'] form.form-style-2 .custom-select:focus,div[class*=' bg-dark'] form.form-style-2 .form-control:focus,div[class*=' bg-dark'] .form-style-2 input:focus,div[class*=' bg-dark'] .form-style-2 textarea:focus,div[class*=' bg-dark'] .form-style-2 .custom-select:focus,div[class*=' bg-dark'] .form-style-2 .form-control:focus,div[class*=' bg-dark'] form.form-style-4 input:focus,div[class*=' bg-dark'] form.form-style-4 textarea:focus,div[class*=' bg-dark'] form.form-style-4 .custom-select:focus,div[class*=' bg-dark'] form.form-style-4 .form-control:focus,div[class*=' bg-dark'] .form-style-4 input:focus,div[class*=' bg-dark'] .form-style-4 textarea:focus,div[class*=' bg-dark'] .form-style-4 .custom-select:focus,div[class*=' bg-dark'] .form-style-4 .form-control:focus{border-color:#fff}div[class^='bg-black'] form.form-style-5 input,div[class^='bg-black'] form.form-style-5 textarea,div[class^='bg-black'] form.form-style-5 .custom-select,div[class^='bg-black'] form.form-style-5 .form-control,div[class^='bg-black'] .form-style-5 input,div[class^='bg-black'] .form-style-5 textarea,div[class^='bg-black'] .form-style-5 .custom-select,div[class^='bg-black'] .form-style-5 .form-control,div[class*=' bg-black'] form.form-style-5 input,div[class*=' bg-black'] form.form-style-5 textarea,div[class*=' bg-black'] form.form-style-5 .custom-select,div[class*=' bg-black'] form.form-style-5 .form-control,div[class*=' bg-black'] .form-style-5 input,div[class*=' bg-black'] .form-style-5 textarea,div[class*=' bg-black'] .form-style-5 .custom-select,div[class*=' bg-black'] .form-style-5 .form-control,div[class^='bg-dark'] form.form-style-5 input,div[class^='bg-dark'] form.form-style-5 textarea,div[class^='bg-dark'] form.form-style-5 .custom-select,div[class^='bg-dark'] form.form-style-5 .form-control,div[class^='bg-dark'] .form-style-5 input,div[class^='bg-dark'] .form-style-5 textarea,div[class^='bg-dark'] .form-style-5 .custom-select,div[class^='bg-dark'] .form-style-5 .form-control,div[class*=' bg-dark'] form.form-style-5 input,div[class*=' bg-dark'] form.form-style-5 textarea,div[class*=' bg-dark'] form.form-style-5 .custom-select,div[class*=' bg-dark'] form.form-style-5 .form-control,div[class*=' bg-dark'] .form-style-5 input,div[class*=' bg-dark'] .form-style-5 textarea,div[class*=' bg-dark'] .form-style-5 .custom-select,div[class*=' bg-dark'] .form-style-5 .form-control{background:rgba(255,255,255,0.1);border:0}div[class^='bg-black'] form.form-style-5 input:focus,div[class^='bg-black'] form.form-style-5 textarea:focus,div[class^='bg-black'] form.form-style-5 .custom-select:focus,div[class^='bg-black'] form.form-style-5 .form-control:focus,div[class^='bg-black'] .form-style-5 input:focus,div[class^='bg-black'] .form-style-5 textarea:focus,div[class^='bg-black'] .form-style-5 .custom-select:focus,div[class^='bg-black'] .form-style-5 .form-control:focus,div[class*=' bg-black'] form.form-style-5 input:focus,div[class*=' bg-black'] form.form-style-5 textarea:focus,div[class*=' bg-black'] form.form-style-5 .custom-select:focus,div[class*=' bg-black'] form.form-style-5 .form-control:focus,div[class*=' bg-black'] .form-style-5 input:focus,div[class*=' bg-black'] .form-style-5 textarea:focus,div[class*=' bg-black'] .form-style-5 .custom-select:focus,div[class*=' bg-black'] .form-style-5 .form-control:focus,div[class^='bg-dark'] form.form-style-5 input:focus,div[class^='bg-dark'] form.form-style-5 textarea:focus,div[class^='bg-dark'] form.form-style-5 .custom-select:focus,div[class^='bg-dark'] form.form-style-5 .form-control:focus,div[class^='bg-dark'] .form-style-5 input:focus,div[class^='bg-dark'] .form-style-5 textarea:focus,div[class^='bg-dark'] .form-style-5 .custom-select:focus,div[class^='bg-dark'] .form-style-5 .form-control:focus,div[class*=' bg-dark'] form.form-style-5 input:focus,div[class*=' bg-dark'] form.form-style-5 textarea:focus,div[class*=' bg-dark'] form.form-style-5 .custom-select:focus,div[class*=' bg-dark'] form.form-style-5 .form-control:focus,div[class*=' bg-dark'] .form-style-5 input:focus,div[class*=' bg-dark'] .form-style-5 textarea:focus,div[class*=' bg-dark'] .form-style-5 .custom-select:focus,div[class*=' bg-dark'] .form-style-5 .form-control:focus{background:rgba(255,255,255,0.2)}img{width:auto;max-width:100%;height:auto}img[class^='img-circle'],img[class*=' img-circle']{border-radius:50%}img.img-circle-xs{min-width:60px;width:60px;height:60px}img.img-circle-sm{min-width:80px;width:80px;height:80px}img.img-circle-md{min-width:100px;width:100px;height:100px}img.img-circle-lg{min-width:120px;width:120px;height:120px}img.img-circle-xl{min-width:140px;width:140px;height:140px}img.img-circle-2xl{min-width:160px;width:160px;height:160px}img.img-circle-3xl{min-width:180px;width:180px;height:180px}ul{margin:0 0 -7px}ul li{margin:0 0 7px}ul li ul,ul li ol{margin-top:7px}ul li a{-webkit-transition:linear 0.1s;transition:linear 0.1s}ul[class*=' list-'],ul[class^='list-']{padding:0}ul.list-unstyled li,ul.list-dash li,ul.list-icon li{list-style-type:none}ul.list-dash li:before{content:'-';padding-right:7px}ul.list-dash li a:hover{padding-left:2px}ul.list-dash li ul,ul.list-dash li ol{padding-left:40px}ul[class*=' list-inline'] li,ul[class^='list-inline'] li{display:inline-block}ul.list-inline{margin-right:-7px;margin-left:-7px}ul.list-inline li{padding:0 7px}ul.list-inline-sm{margin-right:-3px;margin-left:-3px}ul.list-inline-sm li{padding:0 3px}ul.list-inline-lg{margin-right:-14px;margin-left:-14px}ul.list-inline-lg li{padding:0 14px}ul.list-inline-dash li:after{content:'-'}ul.list-inline-slash li:after{content:'/'}ul.list-inline-vbar li:after{content:'|'}ul.list-inline-dash li:after,ul.list-inline-slash li:after,ul.list-inline-vbar li:after{padding:0 3px 0 6px}ul.list-inline-dash li:last-child:after,ul.list-inline-slash li:last-child:after,ul.list-inline-vbar li:last-child:after{content:'';padding:0}ul.list-icon li{position:relative;padding-left:24px}ul.list-icon li:before{position:absolute;top:0;left:0;font-family:"Font Awesome 5 Free";font-weight:900}ul.list-icon li a:hover{padding-left:2px}ul.list-icon li ul,ul.list-icon li ol{padding-left:40px}ul.list-icon.list-icon-check li:before{content:"\f00c"}ul.list-icon.list-icon-close li:before{content:"\f00d"}ul.list-icon.list-icon-plus li:before{content:"\f067"}ul.list-icon.list-icon-arrow li{padding-left:16px}ul.list-icon.list-icon-arrow li:before{content:"\f105"}ul.list-icon.list-icon-caret li{padding-left:16px}ul.list-icon.list-icon-caret li:before{content:"\f0da"}ul.list-icon.list-icon-globe li:before{content:"\f0ac"}ul.list-icon.list-icon-circle-check li:before{content:"\f058"}ul.list-icon.list-icon-circle-plus li:before{content:"\f055"}ul.list-icon.list-icon-circle-arrow li:before{content:"\f138"}ol{margin:0 0 -7px}ol li{margin:0 0 7px}ol li ul,ol li ol{margin-top:7px}ol.list-ordered{list-style:none;counter-reset:custom-counter;padding-left:0}ol.list-ordered li{position:relative;padding-left:34px;counter-increment:custom-counter}ol.list-ordered li::before{content:counter(custom-counter)}ol.list-ordered li ol{list-style:none;padding-left:0}ol.list-ordered.style-2 li::before,ol.list-ordered.style-3 li::before,ol.list-ordered.style-4 li::before,ol.list-ordered.style-5 li::before{position:absolute;top:0;left:0;width:24px;height:24px;border-radius:50%;font-size:13px;line-height:24px;text-align:center}ol.list-ordered.style-2 li::before{background:rgba(0,0,0,0.1);color:#000}ol.list-ordered.style-3 li::before{background:rgba(0,0,0,0.9);color:#fff}ol.list-ordered.style-4 li::before{border:1px solid rgba(0,0,0,0.2);color:rgba(0,0,0,0.5)}ol.list-ordered.style-5 li::before{border:1px solid rgba(0,0,0,0.9);color:#000}div[class^='bg-black'] ol.list-ordered.style-2 li::before,div[class*=' bg-black'] ol.list-ordered.style-2 li::before,div[class^='bg-dark'] ol.list-ordered.style-2 li::before,div[class*=' bg-dark'] ol.list-ordered.style-2 li::before{background:rgba(255,255,255,0.2);color:#fff}div[class^='bg-black'] ol.list-ordered.style-3 li::before,div[class*=' bg-black'] ol.list-ordered.style-3 li::before,div[class^='bg-dark'] ol.list-ordered.style-3 li::before,div[class*=' bg-dark'] ol.list-ordered.style-3 li::before{background:#fff;color:#000}div[class^='bg-black'] ol.list-ordered.style-4 li::before,div[class*=' bg-black'] ol.list-ordered.style-4 li::before,div[class^='bg-dark'] ol.list-ordered.style-4 li::before,div[class*=' bg-dark'] ol.list-ordered.style-4 li::before{border-color:rgba(255,255,255,0.3);color:rgba(255,255,255,0.6)}div[class^='bg-black'] ol.list-ordered.style-5 li::before,div[class*=' bg-black'] ol.list-ordered.style-5 li::before,div[class^='bg-dark'] ol.list-ordered.style-5 li::before,div[class*=' bg-dark'] ol.list-ordered.style-5 li::before{border-color:#fff;color:#fff}@media (max-width: 991.98px){ol{margin:0 0 -5px}ol li{margin:0 0 5px}ul{margin:0 0 -5px}ul li{margin:0 0 5px}ul li ul,ul li ol{margin-top:5px}ul.list-dash li:before{content:'-';padding-right:6px}ul.list-dash li a:hover{padding-left:2px}ul.list-dash li ul,ul.list-dash li ol{padding-left:30px}ul.list-inline-lg{margin-right:-12px;margin-left:-12px}ul.list-inline-lg li{padding:0 12px}ul.list-inline{margin-right:-6px;margin-left:-6px}ul.list-inline li{padding:0 6px}ul.list-inline-sm{margin-right:-2px;margin-left:-2px}ul.list-inline-sm li{padding:0 2px}}body{color:#7C7C7C;font-family:"Open Sans",sans-serif;font-size:15px;font-weight:400;letter-spacing:0}@media (max-width: 991.98px){body{font-size:14px}}h1,h2,h3,h4,h5,h6{margin:0 0 10px;letter-spacing:-0.3px;color:#131517;font-family:"Poppins",sans-serif;font-weight:600}h1{font-size:2.66em;line-height:1.5}h2{font-size:2.13em;line-height:1.625}h3{font-size:1.86em;line-height:1.65}h4{font-size:1.6em;line-height:1.7}h5{font-size:1.33em;line-height:1.8}h6{font-size:1.06em;line-height:1.87}p{margin:0;line-height:1.86}@media (max-width: 991.98px){p{line-height:1.75}}.display-1{font-size:6.4em}.display-2{font-size:5.86em}.display-3{font-size:4.8em}.display-4{font-size:3.73em}@media (max-width: 767.98px){.display-1{font-size:5.73em}.display-2{font-size:5.33em}.display-3{font-size:4.26em}.display-4{font-size:3.2em}}@media (max-width: 575.98px){.display-1{font-size:5.33em}.display-2{font-size:4.8em}.display-3{font-size:3.73em}.display-4{font-size:3.2em}}.uppercase{letter-spacing:1px;text-transform:uppercase}.font-small{font-size:0.875em;line-height:1.85}@media (max-width: 991.98px){.font-small{font-size:0.85em;line-height:1.66}}.font-large{font-size:1.13em;line-height:1.8}@media (max-width: 991.98px){.font-large{font-size:1.145em}}@media (min-width: 992px){.font-lg-large{font-size:1.13em;line-height:1.8}.font-lg-small{font-size:0.875em;line-height:1.85}}.letter-spacing-1,.letter-spacing-1px{letter-spacing:1px}.letter-spacing-2,.letter-spacing-2px{letter-spacing:2px}.letter-spacing-3,.letter-spacing-3px{letter-spacing:3px}.letter-spacing-4,.letter-spacing-4px{letter-spacing:4px}.letter-spacing-5,.letter-spacing-5px{letter-spacing:5px}.line-height-100{line-height:100%}.line-height-110{line-height:110%}.line-height-120{line-height:120%}.line-height-130{line-height:130%}.line-height-140{line-height:140%}.line-height-150{line-height:150%}.line-height-160{line-height:160%}.line-height-170{line-height:170%}.line-height-180{line-height:180%}.line-height-190{line-height:190%}.line-height-200{line-height:200%}i{display:inline-block}.icon-5xl i{font-size:2.8em}.icon-4xl i{font-size:2.4em}.icon-3xl i{font-size:2.13em}.icon-2xl i{font-size:1.86em}.icon-xl i{font-size:1.6em}.icon-lg i{font-size:1.33em}.icon-sm i{font-size:0.86em}.accordion{list-style-type:none;padding:0}.accordion li{border:0;margin-bottom:8px;padding:0;-webkit-transition:linear 0.1s;transition:linear 0.1s}.accordion li:last-child{margin-bottom:0}.accordion li .accordion-title{position:relative;border:1px solid rgba(0,0,0,0.1);padding:14px 24px;cursor:pointer;-webkit-transition:linear 0.1s;transition:linear 0.1s}.accordion li .accordion-title:before,.accordion li .accordion-title:after{content:'';position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);background:#000}.accordion li .accordion-title:before{right:24px;width:11px;height:1px}.accordion li .accordion-title:after{right:29px;width:1px;height:11px;-webkit-transition:linear 0.1s;transition:linear 0.1s}.accordion li .accordion-title h1,.accordion li .accordion-title h2,.accordion li .accordion-title h3,.accordion li .accordion-title h4,.accordion li .accordion-title h5,.accordion li .accordion-title h6{margin:0}.accordion li .accordion-title *{-webkit-transition:linear 0.1s;transition:linear 0.1s}.accordion li .accordion-content{overflow:hidden;max-height:0;padding:0 25px;-webkit-transition:ease-out 0.2s;transition:ease-out 0.2s}.accordion li .accordion-content:before{content:'';display:block;width:100%;height:20px}.accordion li .accordion-content:after{content:'';display:block;width:100%;height:12px}.accordion li .accordion-content ul li,.accordion li .accordion-content ol li{border:0;padding:0}.accordion li .accordion-content ul li:last-child,.accordion li .accordion-content ol li:last-child{border:0}.accordion li .accordion-content ul{list-style-type:disc}.accordion li .accordion-content ul ul{list-style-type:circle}.accordion li .accordion-content ol.list-ordered li{margin-bottom:8px;padding-left:34px}.accordion li .accordion-content ol.list-ordered li:last-child{margin:0}.accordion li .accordion-content .nav{list-style-type:none}.accordion li.active .accordion-title{border-color:rgba(0,0,0,0.9)}.accordion li.active .accordion-title:after{-webkit-transform:translateY(-50%) rotate(-90deg);transform:translateY(-50%) rotate(-90deg)}.accordion.style-2 li{margin-bottom:14px;padding:0}.accordion.style-2 li:last-child{margin-bottom:0}.accordion.style-2 li .accordion-title{border:0;border-bottom:1px solid rgba(0,0,0,0.2);padding:0 0 10px;-webkit-transition:linear 0.1s;transition:linear 0.1s}.accordion.style-2 li .accordion-title:before,.accordion.style-2 li .accordion-title:after{margin-top:-6px}.accordion.style-2 li .accordion-title:before{right:0}.accordion.style-2 li .accordion-title:after{right:5px}.accordion.style-2 li .accordion-content{padding:0 20px}.accordion.style-2 li.active .accordion-title{border-bottom-color:rgba(0,0,0,0.9)}.accordion.style-3 li .accordion-title{background:#f2f5f8;border:0}.accordion.style-3 li .accordion-content{padding:0 24px}.accordion.style-3 li.active .accordion-title{background:#131517;color:rgba(255,255,255,0.8)}.accordion.style-3 li.active .accordion-title:before,.accordion.style-3 li.active .accordion-title:after{background:#fff}.accordion.style-3 li.active .accordion-title h1,.accordion.style-3 li.active .accordion-title h2,.accordion.style-3 li.active .accordion-title h3,.accordion.style-3 li.active .accordion-title h4,.accordion.style-3 li.active .accordion-title h5,.accordion.style-3 li.active .accordion-title h6{color:#fff}.accordion.border-radius:not(.style-2) li .accordion-title{border-radius:0.375em}.accordion.rounded:not(.style-2) li .accordion-title{border-radius:50px}.bg-gray .accordion.style-3 li .accordion-title,.bg-light-gray .accordion.style-3 li .accordion-title{background:#fff}div[class^='bg-black'] .accordion li .accordion-title,div[class*=' bg-black'] .accordion li .accordion-title,div[class^='bg-dark'] .accordion li .accordion-title,div[class*=' bg-dark'] .accordion li .accordion-title{border-color:rgba(255,255,255,0.2)}div[class^='bg-black'] .accordion li .accordion-title:before,div[class^='bg-black'] .accordion li .accordion-title:after,div[class*=' bg-black'] .accordion li .accordion-title:before,div[class*=' bg-black'] .accordion li .accordion-title:after,div[class^='bg-dark'] .accordion li .accordion-title:before,div[class^='bg-dark'] .accordion li .accordion-title:after,div[class*=' bg-dark'] .accordion li .accordion-title:before,div[class*=' bg-dark'] .accordion li .accordion-title:after{background:#fff}div[class^='bg-black'] .accordion li.active .accordion-title,div[class*=' bg-black'] .accordion li.active .accordion-title,div[class^='bg-dark'] .accordion li.active .accordion-title,div[class*=' bg-dark'] .accordion li.active .accordion-title{border-color:#fff}div[class^='bg-black'] .accordion.style-3 li .accordion-title,div[class*=' bg-black'] .accordion.style-3 li .accordion-title,div[class^='bg-dark'] .accordion.style-3 li .accordion-title,div[class*=' bg-dark'] .accordion.style-3 li .accordion-title{background:rgba(255,255,255,0.1)}div[class^='bg-black'] .accordion.style-3 li.active .accordion-title,div[class*=' bg-black'] .accordion.style-3 li.active .accordion-title,div[class^='bg-dark'] .accordion.style-3 li.active .accordion-title,div[class*=' bg-dark'] .accordion.style-3 li.active .accordion-title{background:#fff;color:#7C7C7C}div[class^='bg-black'] .accordion.style-3 li.active .accordion-title:before,div[class^='bg-black'] .accordion.style-3 li.active .accordion-title:after,div[class*=' bg-black'] .accordion.style-3 li.active .accordion-title:before,div[class*=' bg-black'] .accordion.style-3 li.active .accordion-title:after,div[class^='bg-dark'] .accordion.style-3 li.active .accordion-title:before,div[class^='bg-dark'] .accordion.style-3 li.active .accordion-title:after,div[class*=' bg-dark'] .accordion.style-3 li.active .accordion-title:before,div[class*=' bg-dark'] .accordion.style-3 li.active .accordion-title:after{background:#000}div[class^='bg-black'] .accordion.style-3 li.active .accordion-title h1,div[class^='bg-black'] .accordion.style-3 li.active .accordion-title h2,div[class^='bg-black'] .accordion.style-3 li.active .accordion-title h3,div[class^='bg-black'] .accordion.style-3 li.active .accordion-title h4,div[class^='bg-black'] .accordion.style-3 li.active .accordion-title h5,div[class^='bg-black'] .accordion.style-3 li.active .accordion-title h6,div[class*=' bg-black'] .accordion.style-3 li.active .accordion-title h1,div[class*=' bg-black'] .accordion.style-3 li.active .accordion-title h2,div[class*=' bg-black'] .accordion.style-3 li.active .accordion-title h3,div[class*=' bg-black'] .accordion.style-3 li.active .accordion-title h4,div[class*=' bg-black'] .accordion.style-3 li.active .accordion-title h5,div[class*=' bg-black'] .accordion.style-3 li.active .accordion-title h6,div[class^='bg-dark'] .accordion.style-3 li.active .accordion-title h1,div[class^='bg-dark'] .accordion.style-3 li.active .accordion-title h2,div[class^='bg-dark'] .accordion.style-3 li.active .accordion-title h3,div[class^='bg-dark'] .accordion.style-3 li.active .accordion-title h4,div[class^='bg-dark'] .accordion.style-3 li.active .accordion-title h5,div[class^='bg-dark'] .accordion.style-3 li.active .accordion-title h6,div[class*=' bg-dark'] .accordion.style-3 li.active .accordion-title h1,div[class*=' bg-dark'] .accordion.style-3 li.active .accordion-title h2,div[class*=' bg-dark'] .accordion.style-3 li.active .accordion-title h3,div[class*=' bg-dark'] .accordion.style-3 li.active .accordion-title h4,div[class*=' bg-dark'] .accordion.style-3 li.active .accordion-title h5,div[class*=' bg-dark'] .accordion.style-3 li.active .accordion-title h6{color:#000}.box-shadow{-webkit-box-shadow:0 10px 36px 0 rgba(22,24,26,0.13);box-shadow:0 10px 36px 0 rgba(22,24,26,0.13)}.box-shadow-with-hover{-webkit-box-shadow:0 10px 36px 0 rgba(22,24,26,0.13);box-shadow:0 10px 36px 0 rgba(22,24,26,0.13);-webkit-transition:ease-out 0.16s;transition:ease-out 0.16s}.box-shadow-with-hover:hover{-webkit-box-shadow:0 10px 40px 0 rgba(22,24,26,0.19);box-shadow:0 10px 40px 0 rgba(22,24,26,0.19)}.hover-shadow{-webkit-transition:ease-out 0.16s;transition:ease-out 0.16s}.hover-shadow:hover{-webkit-box-shadow:0 10px 36px 0 rgba(22,24,26,0.13);box-shadow:0 10px 36px 0 rgba(22,24,26,0.13)}.hover-float{-webkit-transition:ease-out 0.16s;transition:ease-out 0.16s}.hover-float:hover{-webkit-transform:translateY(-4px);transform:translateY(-4px)}.hover-scale{-webkit-transition:ease-out 0.16s;transition:ease-out 0.16s}.hover-scale:hover{-webkit-transform:scale(1.015);transform:scale(1.015)}.hover-shrink{-webkit-transition:ease-out 0.16s;transition:ease-out 0.16s}.hover-shrink:hover{-webkit-transform:scale(0.985);transform:scale(0.985)}div[class^="square-box"],div[class*=" square-box"],div[class^="circle-box"],div[class*=" circle-box"]{display:inline-block;text-align:center}div[class^="square-box"] *,div[class*=" square-box"] *,div[class^="circle-box"] *,div[class*=" circle-box"] *{margin:0;vertical-align:middle}.square-box-xs{width:40px;height:40px;line-height:40px}.square-box-xs *{line-height:40px}.square-box-sm{width:50px;height:50px;line-height:50px}.square-box-sm *{line-height:50px}.square-box,.square-box-md{width:60px;height:60px;line-height:60px}.square-box *,.square-box-md *{line-height:60px}.square-box-lg{width:70px;height:70px;line-height:70px}.square-box-lg *{line-height:70px}.square-box-xl{width:80px;height:80px;line-height:80px}.square-box-xl *{line-height:80px}div[class^="circle-box"],div[class*=" circle-box"]{border-radius:50%}.circle-box-xs{width:40px;height:40px;line-height:40px}.circle-box-xs *{line-height:40px}.circle-box-sm{width:50px;height:50px;line-height:50px}.circle-box-sm *{line-height:50px}.circle-box,.circle-box-md{width:60px;height:60px;line-height:60px}.circle-box *,.circle-box-md *{line-height:60px}.circle-box-lg{width:70px;height:70px;line-height:70px}.circle-box-lg *{line-height:70px}.circle-box-xl{width:80px;height:80px;line-height:80px}.circle-box-xl *{line-height:80px}.border-radius,.border-radius-0375{border-radius:0.375em}.border-radius-025{border-radius:0.25em}.border-radius-05{border-radius:0.5em}.border-radius-10{border-radius:1em}.border-radius-15{border-radius:1.5em}.border-radius-20{border-radius:2em}.border-radius-25{border-radius:2.5em}.border-radius-30{border-radius:3em}.move-top-100{-webkit-transform:translateY(-100px);transform:translateY(-100px);margin-bottom:-100px}.move-top-90{-webkit-transform:translateY(-90px);transform:translateY(-90px);margin-bottom:-90px}.move-top-80{-webkit-transform:translateY(-80px);transform:translateY(-80px);margin-bottom:-80px}.move-top-70{-webkit-transform:translateY(-70px);transform:translateY(-70px);margin-bottom:-70px}.move-top-60{-webkit-transform:translateY(-60px);transform:translateY(-60px);margin-bottom:-60px}.move-top-50{-webkit-transform:translateY(-50px);transform:translateY(-50px);margin-bottom:-50px}.move-top-40{-webkit-transform:translateY(-40px);transform:translateY(-40px);margin-bottom:-40px}.move-top-30{-webkit-transform:translateY(-30px);transform:translateY(-30px);margin-bottom:-30px}.move-top-20{-webkit-transform:translateY(-20px);transform:translateY(-20px);margin-bottom:-20px}.move-top-10{-webkit-transform:translateY(-10px);transform:translateY(-10px);margin-bottom:-10px}a{color:#7C7C7C;-webkit-transition:linear 0.1s;transition:linear 0.1s}a:hover{color:#131517;text-decoration:none}button{background:transparent;box-shadow:none;border:0;padding:0;cursor:pointer}a:focus,a:active,button:focus,button:active{box-shadow:none;outline:0}.button{font:400 13px "Poppins",sans-serif;letter-spacing:1px;text-transform:uppercase}.button{position:relative;display:inline-block;overflow:hidden;background:#e5e8eb;border:1px solid #e5e8eb;padding:5px 10px;color:#131517;-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}.button i{margin-right:8px;font-size:15px}.button:hover{color:#131517}.button-xs{padding:7px 16px}.button-sm{padding:10px 22px}.button-md{padding:14px 34px}.button-lg{padding:16px 42px}.button-xl{padding:18px 50px}.button-fullwidth{width:100%;text-align:center}.button-grey,a.button-grey{background:#e5e8eb;border:0}.button-grey:hover,.button-grey:focus,a.button-grey:hover,a.button-grey:focus{background:#dde0e3;color:#131517}.button-dark,a.button-dark{background:#1d2023;border:0;color:#fff}.button-dark:hover,.button-dark:focus,a.button-dark:hover,a.button-dark:focus{background:#131517;color:#fff}.button-white,a.button-white{background:#fff;border:0;color:#131517}.button-white:hover,.button-white:focus,a.button-white:hover,a.button-white:focus{background:rgba(255,255,255,0.9);border:0;color:#131517}.button-white-2,a.button-white-2{background:#fff;border-color:#fff;color:#131517}.button-white-2:hover,.button-white-2:focus,a.button-white-2:hover,a.button-white-2:focus{background:transparent;border-color:#fff;color:#fff}.button-white-3,a.button-white-3{background:rgba(255,255,255,0.15);border:0;color:#fff}.button-white-3:hover,.button-white-3:focus,a.button-white-3:hover,a.button-white-3:focus{background:rgba(255,255,255,0.2);color:#fff}.button-outline-grey,a.button-outline-grey{background:transparent;border-color:rgba(0,0,0,0.15)}.button-outline-grey:hover,.button-outline-grey:focus,a.button-outline-grey:hover,a.button-outline-grey:focus{border-color:#131517;color:#131517}.button-outline-grey-2,a.button-outline-grey-2{background:transparent;border-color:rgba(0,0,0,0.15)}.button-outline-grey-2:hover,.button-outline-grey-2:focus,a.button-outline-grey-2:hover,a.button-outline-grey-2:focus{background:rgba(0,0,0,0.1);border-color:transparent;color:#131517}.button-outline-dark,a.button-outline-dark{background:transparent;border-color:#131517}.button-outline-dark:hover,.button-outline-dark:focus,a.button-outline-dark:hover,a.button-outline-dark:focus{border-color:rgba(0,0,0,0.15);color:#131517}.button-outline-dark-2,a.button-outline-dark-2{background:transparent;border-color:#131517}.button-outline-dark-2:hover,.button-outline-dark-2:focus,a.button-outline-dark-2:hover,a.button-outline-dark-2:focus{background:#131517;border-color:transparent;color:#fff}.button-outline-white,a.button-outline-white{background:transparent;border-color:rgba(255,255,255,0.3);color:#fff}.button-outline-white:hover,.button-outline-white:focus,a.button-outline-white:hover,a.button-outline-white:focus{border-color:#fff;color:#fff}.button-outline-white-2,a.button-outline-white-2{background:transparent;border-color:#fff;color:#fff}.button-outline-white-2:hover,.button-outline-white-2:focus,a.button-outline-white-2:hover,a.button-outline-white-2:focus{background:#fff;color:#131517}a[class*=' button-fill-'],a[class^='button-fill-'],button[class*=' button-fill-'],button[class^='button-fill-']{z-index:1;background:transparent}a[class*=' button-fill-']:before,a[class^='button-fill-']:before,button[class*=' button-fill-']:before,button[class^='button-fill-']:before{content:'';position:absolute;z-index:-1;-webkit-transition:all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1);transition:all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1)}.button-fill-left-outline,a.button-fill-left-outline,.button-fill-top-outline,a.button-fill-top-outline,.button-fill-right-outline,a.button-fill-right-outline,.button-fill-bottom-outline,a.button-fill-bottom-outline{border-color:#131517}.button-fill-left-outline:before,a.button-fill-left-outline:before,.button-fill-top-outline:before,a.button-fill-top-outline:before,.button-fill-right-outline:before,a.button-fill-right-outline:before,.button-fill-bottom-outline:before,a.button-fill-bottom-outline:before{background:#131517}.button-fill-left-outline:hover,a.button-fill-left-outline:hover,.button-fill-top-outline:hover,a.button-fill-top-outline:hover,.button-fill-right-outline:hover,a.button-fill-right-outline:hover,.button-fill-bottom-outline:hover,a.button-fill-bottom-outline:hover{color:#fff}.button-fill-left-outline-white,a.button-fill-left-outline-white,.button-fill-top-outline-white,a.button-fill-top-outline-white,.button-fill-right-outline-white,a.button-fill-right-outline-white,.button-fill-bottom-outline-white,a.button-fill-bottom-outline-white{border-color:#fff;color:#fff}.button-fill-left-outline-white:before,a.button-fill-left-outline-white:before,.button-fill-top-outline-white:before,a.button-fill-top-outline-white:before,.button-fill-right-outline-white:before,a.button-fill-right-outline-white:before,.button-fill-bottom-outline-white:before,a.button-fill-bottom-outline-white:before{background:#fff}.button-fill-left-outline-white:hover,a.button-fill-left-outline-white:hover,.button-fill-top-outline-white:hover,a.button-fill-top-outline-white:hover,.button-fill-right-outline-white:hover,a.button-fill-right-outline-white:hover,.button-fill-bottom-outline-white:hover,a.button-fill-bottom-outline-white:hover{color:#131517}.button-fill-left-outline:before,a.button-fill-left-outline:before,.button-fill-left-outline-white:before,a.button-fill-left-outline-white:before{top:0;left:0;width:0%;height:100%}.button-fill-left-outline:hover:before,a.button-fill-left-outline:hover:before,.button-fill-left-outline-white:hover:before,a.button-fill-left-outline-white:hover:before{width:100%}.button-fill-top-outline:before,a.button-fill-top-outline:before,.button-fill-top-outline-white:before,a.button-fill-top-outline-white:before{top:0;left:0;width:100%;height:0%}.button-fill-top-outline:hover:before,a.button-fill-top-outline:hover:before,.button-fill-top-outline-white:hover:before,a.button-fill-top-outline-white:hover:before{height:100%}.button-fill-right-outline:before,a.button-fill-right-outline:before,.button-fill-right-outline-white:before,a.button-fill-right-outline-white:before{top:0;right:0;width:0%;height:100%}.button-fill-right-outline:hover:before,a.button-fill-right-outline:hover:before,.button-fill-right-outline-white:hover:before,a.button-fill-right-outline-white:hover:before{width:100%}.button-fill-bottom-outline:before,a.button-fill-bottom-outline:before,.button-fill-bottom-outline-white:before,a.button-fill-bottom-outline-white:before{bottom:0;left:0;width:100%;height:0%}.button-fill-bottom-outline:hover:before,a.button-fill-bottom-outline:hover:before,.button-fill-bottom-outline-white:hover:before,a.button-fill-bottom-outline-white:hover:before{height:100%}a[class*=' button-reveal'] span,a[class*=' button-reveal'] i,a[class^='button-reveal'] span,a[class^='button-reveal'] i,button[class*=' button-reveal'] span,button[class*=' button-reveal'] i,button[class^='button-reveal'] span,button[class^='button-reveal'] i{-webkit-transition:all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1);transition:all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1)}a[class*=' button-reveal'] span,a[class^='button-reveal'] span,button[class*=' button-reveal'] span,button[class^='button-reveal'] span{position:relative}a[class*=' button-reveal'] i,a[class^='button-reveal'] i,button[class*=' button-reveal'] i,button[class^='button-reveal'] i{position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);opacity:0;margin:0}a[class*=' button-reveal']:hover i,a[class*=' button-reveal']:focus i,a[class^='button-reveal']:hover i,a[class^='button-reveal']:focus i,button[class*=' button-reveal']:hover i,button[class*=' button-reveal']:focus i,button[class^='button-reveal']:hover i,button[class^='button-reveal']:focus i{opacity:1}.button-reveal-left-grey span,a.button-reveal-left-grey span,.button-reveal-left-dark span,a.button-reveal-left-dark span,.button-reveal-left-white span,a.button-reveal-left-white span{left:0}.button-reveal-left-grey:hover span,.button-reveal-left-grey:focus span,a.button-reveal-left-grey:hover span,a.button-reveal-left-grey:focus span,.button-reveal-left-dark:hover span,.button-reveal-left-dark:focus span,a.button-reveal-left-dark:hover span,a.button-reveal-left-dark:focus span,.button-reveal-left-white:hover span,.button-reveal-left-white:focus span,a.button-reveal-left-white:hover span,a.button-reveal-left-white:focus span{left:12px}.button-reveal-right-grey span,a.button-reveal-right-grey span,.button-reveal-right-dark span,a.button-reveal-right-dark span,.button-reveal-right-white span,a.button-reveal-right-white span{right:0}.button-reveal-right-grey:hover span,.button-reveal-right-grey:focus span,a.button-reveal-right-grey:hover span,a.button-reveal-right-grey:focus span,.button-reveal-right-dark:hover span,.button-reveal-right-dark:focus span,a.button-reveal-right-dark:hover span,a.button-reveal-right-dark:focus span,.button-reveal-right-white:hover span,.button-reveal-right-white:focus span,a.button-reveal-right-white:hover span,a.button-reveal-right-white:focus span{right:12px}.button-reveal-left-grey,a.button-reveal-left-grey,.button-reveal-right-grey,a.button-reveal-right-grey{background:#e5e8eb;border:0}.button-reveal-left-grey:hover,.button-reveal-left-grey:focus,a.button-reveal-left-grey:hover,a.button-reveal-left-grey:focus,.button-reveal-right-grey:hover,.button-reveal-right-grey:focus,a.button-reveal-right-grey:hover,a.button-reveal-right-grey:focus{background:#dde0e3;color:#131517}.button-reveal-left-dark,a.button-reveal-left-dark,.button-reveal-right-dark,a.button-reveal-right-dark{background:#1d2023;border:0;color:#fff}.button-reveal-left-dark:hover,.button-reveal-left-dark:focus,a.button-reveal-left-dark:hover,a.button-reveal-left-dark:focus,.button-reveal-right-dark:hover,.button-reveal-right-dark:focus,a.button-reveal-right-dark:hover,a.button-reveal-right-dark:focus{background:#131517;color:#fff}.button-reveal-left-white,a.button-reveal-left-white,.button-reveal-right-white,a.button-reveal-right-white{background:#fff;border:0;color:#131517}.button-reveal-left-white:hover,.button-reveal-left-white:focus,a.button-reveal-left-white:hover,a.button-reveal-left-white:focus,.button-reveal-right-white:hover,.button-reveal-right-white:focus,a.button-reveal-right-white:hover,a.button-reveal-right-white:focus{background:#fff;color:#131517}.button-xs.button-reveal-left-grey i,.button-xs.button-reveal-left-dark i,.button-xs.button-reveal-left-white i{left:10px}.button-xs.button-reveal-left-grey:hover i,.button-xs.button-reveal-left-grey:focus i,.button-xs.button-reveal-left-dark:hover i,.button-xs.button-reveal-left-dark:focus i,.button-xs.button-reveal-left-white:hover i,.button-xs.button-reveal-left-white:focus i{left:0}.button-xs.button-reveal-right-grey i,.button-xs.button-reveal-right-dark i,.button-xs.button-reveal-right-white i{right:10px}.button-xs.button-reveal-right-grey:hover i,.button-xs.button-reveal-right-grey:focus i,.button-xs.button-reveal-right-dark:hover i,.button-xs.button-reveal-right-dark:focus i,.button-xs.button-reveal-right-white:hover i,.button-xs.button-reveal-right-white:focus i{right:0}.button-sm.button-reveal-left-grey i,.button-sm.button-reveal-left-dark i,.button-sm.button-reveal-left-white i{left:20px}.button-sm.button-reveal-left-grey:hover i,.button-sm.button-reveal-left-grey:focus i,.button-sm.button-reveal-left-dark:hover i,.button-sm.button-reveal-left-dark:focus i,.button-sm.button-reveal-left-white:hover i,.button-sm.button-reveal-left-white:focus i{left:10px}.button-sm.button-reveal-right-grey i,.button-sm.button-reveal-right-dark i,.button-sm.button-reveal-right-white i{right:20px}.button-sm.button-reveal-right-grey:hover i,.button-sm.button-reveal-right-grey:focus i,.button-sm.button-reveal-right-dark:hover i,.button-sm.button-reveal-right-dark:focus i,.button-sm.button-reveal-right-white:hover i,.button-sm.button-reveal-right-white:focus i{right:10px}.button-md.button-reveal-left-grey i,.button-md.button-reveal-left-dark i,.button-md.button-reveal-left-white i{left:30px}.button-md.button-reveal-left-grey:hover i,.button-md.button-reveal-left-grey:focus i,.button-md.button-reveal-left-dark:hover i,.button-md.button-reveal-left-dark:focus i,.button-md.button-reveal-left-white:hover i,.button-md.button-reveal-left-white:focus i{left:18px}.button-md.button-reveal-right-grey i,.button-md.button-reveal-right-dark i,.button-md.button-reveal-right-white i{right:30px}.button-md.button-reveal-right-grey:hover i,.button-md.button-reveal-right-grey:focus i,.button-md.button-reveal-right-dark:hover i,.button-md.button-reveal-right-dark:focus i,.button-md.button-reveal-right-white:hover i,.button-md.button-reveal-right-white:focus i{right:18px}.button-lg.button-reveal-left-grey i,.button-lg.button-reveal-left-dark i,.button-lg.button-reveal-left-white i{left:40px}.button-lg.button-reveal-left-grey:hover i,.button-lg.button-reveal-left-grey:focus i,.button-lg.button-reveal-left-dark:hover i,.button-lg.button-reveal-left-dark:focus i,.button-lg.button-reveal-left-white:hover i,.button-lg.button-reveal-left-white:focus i{left:28px}.button-lg.button-reveal-right-grey i,.button-lg.button-reveal-right-dark i,.button-lg.button-reveal-right-white i{right:40px}.button-lg.button-reveal-right-grey:hover i,.button-lg.button-reveal-right-grey:focus i,.button-lg.button-reveal-right-dark:hover i,.button-lg.button-reveal-right-dark:focus i,.button-lg.button-reveal-right-white:hover i,.button-lg.button-reveal-right-white:focus i{right:28px}.button-xl.button-reveal-left-grey i,.button-xl.button-reveal-left-dark i,.button-xl.button-reveal-left-white i{left:50px}.button-xl.button-reveal-left-grey:hover i,.button-xl.button-reveal-left-grey:focus i,.button-xl.button-reveal-left-dark:hover i,.button-xl.button-reveal-left-dark:focus i,.button-xl.button-reveal-left-white:hover i,.button-xl.button-reveal-left-white:focus i{left:38px}.button-xl.button-reveal-right-grey i,.button-xl.button-reveal-right-dark i,.button-xl.button-reveal-right-white i{right:50px}.button-xl.button-reveal-right-grey:hover i,.button-xl.button-reveal-right-grey:focus i,.button-xl.button-reveal-right-dark:hover i,.button-xl.button-reveal-right-dark:focus i,.button-xl.button-reveal-right-white:hover i,.button-xl.button-reveal-right-white:focus i{right:38px}.button-reveal-left-outline-grey,a.button-reveal-left-outline-grey,.button-reveal-right-outline-grey,a.button-reveal-right-outline-grey{background:transparent;border-color:rgba(0,0,0,0.15)}.button-reveal-left-outline-grey:hover,.button-reveal-left-outline-grey:focus,a.button-reveal-left-outline-grey:hover,a.button-reveal-left-outline-grey:focus,.button-reveal-right-outline-grey:hover,.button-reveal-right-outline-grey:focus,a.button-reveal-right-outline-grey:hover,a.button-reveal-right-outline-grey:focus{border-color:#131517;color:#131517}.button-reveal-left-outline-grey span,a.button-reveal-left-outline-grey span,.button-reveal-left-outline-dark span,a.button-reveal-left-outline-dark span,.button-reveal-left-outline-white span,a.button-reveal-left-outline-white span{left:0}.button-reveal-left-outline-grey:hover span,.button-reveal-left-outline-grey:focus span,a.button-reveal-left-outline-grey:hover span,a.button-reveal-left-outline-grey:focus span,.button-reveal-left-outline-dark:hover span,.button-reveal-left-outline-dark:focus span,a.button-reveal-left-outline-dark:hover span,a.button-reveal-left-outline-dark:focus span,.button-reveal-left-outline-white:hover span,.button-reveal-left-outline-white:focus span,a.button-reveal-left-outline-white:hover span,a.button-reveal-left-outline-white:focus span{left:12px}.button-reveal-right-outline-grey span,a.button-reveal-right-outline-grey span,.button-reveal-right-outline-dark span,a.button-reveal-right-outline-dark span,.button-reveal-right-outline-white span,a.button-reveal-right-outline-white span{right:0}.button-reveal-right-outline-grey:hover span,.button-reveal-right-outline-grey:focus span,a.button-reveal-right-outline-grey:hover span,a.button-reveal-right-outline-grey:focus span,.button-reveal-right-outline-dark:hover span,.button-reveal-right-outline-dark:focus span,a.button-reveal-right-outline-dark:hover span,a.button-reveal-right-outline-dark:focus span,.button-reveal-right-outline-white:hover span,.button-reveal-right-outline-white:focus span,a.button-reveal-right-outline-white:hover span,a.button-reveal-right-outline-white:focus span{right:12px}.button-reveal-left-outline-dark,a.button-reveal-left-outline-dark,.button-reveal-right-outline-dark,a.button-reveal-right-outline-dark{background:transparent;border-color:#131517}.button-reveal-left-outline-dark:hover,.button-reveal-left-outline-dark:focus,a.button-reveal-left-outline-dark:hover,a.button-reveal-left-outline-dark:focus,.button-reveal-right-outline-dark:hover,.button-reveal-right-outline-dark:focus,a.button-reveal-right-outline-dark:hover,a.button-reveal-right-outline-dark:focus{border-color:rgba(0,0,0,0.15);color:#131517}.button-reveal-left-outline-white,a.button-reveal-left-outline-white,.button-reveal-right-outline-white,a.button-reveal-right-outline-white{background:transparent;border-color:rgba(255,255,255,0.3);color:#fff}.button-reveal-left-outline-white:hover,.button-reveal-left-outline-white:focus,a.button-reveal-left-outline-white:hover,a.button-reveal-left-outline-white:focus,.button-reveal-right-outline-white:hover,.button-reveal-right-outline-white:focus,a.button-reveal-right-outline-white:hover,a.button-reveal-right-outline-white:focus{border-color:#fff;color:#fff}.button-xs.button-reveal-left-outline-grey i,.button-xs.button-reveal-left-outline-dark i,.button-xs.button-reveal-left-outline-white i{left:10px}.button-xs.button-reveal-left-outline-grey:hover i,.button-xs.button-reveal-left-outline-grey:focus i,.button-xs.button-reveal-left-outline-dark:hover i,.button-xs.button-reveal-left-outline-dark:focus i,.button-xs.button-reveal-left-outline-white:hover i,.button-xs.button-reveal-left-outline-white:focus i{left:0}.button-xs.button-reveal-right-outline-grey i,.button-xs.button-reveal-right-outline-dark i,.button-xs.button-reveal-right-outline-white i{right:10px}.button-xs.button-reveal-right-outline-grey:hover i,.button-xs.button-reveal-right-outline-grey:focus i,.button-xs.button-reveal-right-outline-dark:hover i,.button-xs.button-reveal-right-outline-dark:focus i,.button-xs.button-reveal-right-outline-white:hover i,.button-xs.button-reveal-right-outline-white:focus i{right:0}.button-sm.button-reveal-left-outline-grey i,.button-sm.button-reveal-left-outline-dark i,.button-sm.button-reveal-left-outline-white i{left:20px}.button-sm.button-reveal-left-outline-grey:hover i,.button-sm.button-reveal-left-outline-grey:focus i,.button-sm.button-reveal-left-outline-dark:hover i,.button-sm.button-reveal-left-outline-dark:focus i,.button-sm.button-reveal-left-outline-white:hover i,.button-sm.button-reveal-left-outline-white:focus i{left:10px}.button-sm.button-reveal-right-outline-grey i,.button-sm.button-reveal-right-outline-dark i,.button-sm.button-reveal-right-outline-white i{right:20px}.button-sm.button-reveal-right-outline-grey:hover i,.button-sm.button-reveal-right-outline-grey:focus i,.button-sm.button-reveal-right-outline-dark:hover i,.button-sm.button-reveal-right-outline-dark:focus i,.button-sm.button-reveal-right-outline-white:hover i,.button-sm.button-reveal-right-outline-white:focus i{right:10px}.button-md.button-reveal-left-outline-grey i,.button-md.button-reveal-left-outline-dark i,.button-md.button-reveal-left-outline-white i{left:30px}.button-md.button-reveal-left-outline-grey:hover i,.button-md.button-reveal-left-outline-grey:focus i,.button-md.button-reveal-left-outline-dark:hover i,.button-md.button-reveal-left-outline-dark:focus i,.button-md.button-reveal-left-outline-white:hover i,.button-md.button-reveal-left-outline-white:focus i{left:18px}.button-md.button-reveal-right-outline-grey i,.button-md.button-reveal-right-outline-dark i,.button-md.button-reveal-right-outline-white i{right:30px}.button-md.button-reveal-right-outline-grey:hover i,.button-md.button-reveal-right-outline-grey:focus i,.button-md.button-reveal-right-outline-dark:hover i,.button-md.button-reveal-right-outline-dark:focus i,.button-md.button-reveal-right-outline-white:hover i,.button-md.button-reveal-right-outline-white:focus i{right:18px}.button-lg.button-reveal-left-outline-grey i,.button-lg.button-reveal-left-outline-dark i,.button-lg.button-reveal-left-outline-white i{left:40px}.button-lg.button-reveal-left-outline-grey:hover i,.button-lg.button-reveal-left-outline-grey:focus i,.button-lg.button-reveal-left-outline-dark:hover i,.button-lg.button-reveal-left-outline-dark:focus i,.button-lg.button-reveal-left-outline-white:hover i,.button-lg.button-reveal-left-outline-white:focus i{left:28px}.button-lg.button-reveal-right-outline-grey i,.button-lg.button-reveal-right-outline-dark i,.button-lg.button-reveal-right-outline-white i{right:40px}.button-lg.button-reveal-right-outline-grey:hover i,.button-lg.button-reveal-right-outline-grey:focus i,.button-lg.button-reveal-right-outline-dark:hover i,.button-lg.button-reveal-right-outline-dark:focus i,.button-lg.button-reveal-right-outline-white:hover i,.button-lg.button-reveal-right-outline-white:focus i{right:28px}.button-xl.button-reveal-left-outline-grey i,.button-xl.button-reveal-left-outline-dark i,.button-xl.button-reveal-left-outline-white i{left:50px}.button-xl.button-reveal-left-outline-grey:hover i,.button-xl.button-reveal-left-outline-grey:focus i,.button-xl.button-reveal-left-outline-dark:hover i,.button-xl.button-reveal-left-outline-dark:focus i,.button-xl.button-reveal-left-outline-white:hover i,.button-xl.button-reveal-left-outline-white:focus i{left:38px}.button-xl.button-reveal-right-outline-grey i,.button-xl.button-reveal-right-outline-dark i,.button-xl.button-reveal-right-outline-white i{right:50px}.button-xl.button-reveal-right-outline-grey:hover i,.button-xl.button-reveal-right-outline-grey:focus i,.button-xl.button-reveal-right-outline-dark:hover i,.button-xl.button-reveal-right-outline-dark:focus i,.button-xl.button-reveal-right-outline-white:hover i,.button-xl.button-reveal-right-outline-white:focus i{right:38px}a[class*=' button-fancy-1'],a[class^='button-fancy-1'],button[class*=' button-fancy-1'],button[class^='button-fancy-1']{z-index:1;overflow:visible;background:transparent;border:0}a[class*=' button-fancy-1']:before,a[class^='button-fancy-1']:before,button[class*=' button-fancy-1']:before,button[class^='button-fancy-1']:before{content:'';position:absolute;top:0;left:0;-webkit-transform:scaleY(1);transform:scaleY(1);z-index:-1;opacity:1;width:100%;height:100%;-webkit-transition:all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1);transition:all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1)}a[class*=' button-fancy-1']:after,a[class^='button-fancy-1']:after,button[class*=' button-fancy-1']:after,button[class^='button-fancy-1']:after{content:'';position:absolute;top:0;left:0;-webkit-transform:scaleY(0.2);transform:scaleY(0.2);opacity:0;width:100%;height:100%;border:1px solid rgba(0,0,0,0.9);-webkit-transition:all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1);transition:all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1)}a[class*=' button-fancy-1']:hover:before,a[class^='button-fancy-1']:hover:before,button[class*=' button-fancy-1']:hover:before,button[class^='button-fancy-1']:hover:before{-webkit-transform:scaleY(0.2);transform:scaleY(0.2);opacity:0}a[class*=' button-fancy-1']:hover:after,a[class^='button-fancy-1']:hover:after,button[class*=' button-fancy-1']:hover:after,button[class^='button-fancy-1']:hover:after{-webkit-transform:scaleY(1);transform:scaleY(1);opacity:1}.button-fancy-1:before,a.button-fancy-1:before{background:#e5e8eb}.button-fancy-1-dark,a.button-fancy-1-dark{color:#fff}.button-fancy-1-dark:before,a.button-fancy-1-dark:before{background:#131517}.button-fancy-1-white,a.button-fancy-1-white{color:#131517}.button-fancy-1-white:before,a.button-fancy-1-white:before{background:#fff}.button-fancy-1-white:after,a.button-fancy-1-white:after{border-color:#fff}.button-fancy-1-white:hover,a.button-fancy-1-white:hover{color:#fff}.button-fancy-1-outline:before,a.button-fancy-1-outline:before{border:1px solid rgba(0,0,0,0.15)}.button-fancy-1-outline:after,a.button-fancy-1-outline:after{z-index:-1;background:#131517;border:0}.button-fancy-1-outline:hover,a.button-fancy-1-outline:hover{color:#fff}.button-fancy-1-outline-dark:before,a.button-fancy-1-outline-dark:before{border:1px solid rgba(0,0,0,0.9)}.button-fancy-1-outline-dark:after,a.button-fancy-1-outline-dark:after{z-index:-1;background:#131517}.button-fancy-1-outline-dark:hover,a.button-fancy-1-outline-dark:hover{color:#fff}.button-fancy-1-outline-white,a.button-fancy-1-outline-white{color:#fff}.button-fancy-1-outline-white:before,a.button-fancy-1-outline-white:before{border:1px solid rgba(255,255,255,0.9)}.button-fancy-1-outline-white:after,a.button-fancy-1-outline-white:after{z-index:-1;background:#fff}.button-fancy-1-outline-white:hover,a.button-fancy-1-outline-white:hover{color:#131517}a[class*=' button-fancy-2'],a[class^='button-fancy-2'],button[class*=' button-fancy-2'],button[class^='button-fancy-2']{z-index:1;overflow:visible;background:transparent;border:0}a[class*=' button-fancy-2']:before,a[class^='button-fancy-2']:before,button[class*=' button-fancy-2']:before,button[class^='button-fancy-2']:before{content:'';position:absolute;top:0;left:0;-webkit-transform:scaleX(1);transform:scaleX(1);z-index:-1;opacity:1;width:100%;height:100%;-webkit-transition:all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1);transition:all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1)}a[class*=' button-fancy-2']:after,a[class^='button-fancy-2']:after,button[class*=' button-fancy-2']:after,button[class^='button-fancy-2']:after{content:'';position:absolute;top:0;left:0;-webkit-transform:scaleX(0.6);transform:scaleX(0.6);opacity:0;width:100%;height:100%;border:1px solid rgba(0,0,0,0.9);border-right:0;border-left:0;-webkit-transition:all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1);transition:all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1)}a[class*=' button-fancy-2']:hover:before,a[class^='button-fancy-2']:hover:before,button[class*=' button-fancy-2']:hover:before,button[class^='button-fancy-2']:hover:before{-webkit-transform:scaleX(0.6);transform:scaleX(0.6);opacity:0}a[class*=' button-fancy-2']:hover:after,a[class^='button-fancy-2']:hover:after,button[class*=' button-fancy-2']:hover:after,button[class^='button-fancy-2']:hover:after{-webkit-transform:scaleX(1);transform:scaleX(1);opacity:1}.button-fancy-2:before,a.button-fancy-2:before{background:#e5e8eb}.button-fancy-2-dark,a.button-fancy-2-dark{color:#fff}.button-fancy-2-dark:before,a.button-fancy-2-dark:before{background:#131517}.button-fancy-2-white,a.button-fancy-2-white{color:#131517}.button-fancy-2-white:before,a.button-fancy-2-white:before{background:#fff}.button-fancy-2-white:after,a.button-fancy-2-white:after{border-color:#fff}.button-fancy-2-white:hover,a.button-fancy-2-white:hover{color:#fff}.button-fancy-2-outline:before,a.button-fancy-2-outline:before{border:1px solid rgba(0,0,0,0.15)}.button-fancy-2-outline-white,a.button-fancy-2-outline-white{color:#fff}.button-fancy-2-outline-white:before,a.button-fancy-2-outline-white:before{border:1px solid rgba(255,255,255,0.2)}.button-fancy-2-outline-white:after,a.button-fancy-2-outline-white:after{border-color:#fff}.button-fancy-2-outline-white:hover,a.button-fancy-2-outline-white:hover{color:#fff}.button-text-1,.button-text-2,.button-text-3{position:relative;display:inline-block;color:#000;font-family:"Poppins",sans-serif;letter-spacing:-0.2px}.button-text-1:before{content:'';position:absolute;bottom:-1px;left:0;background:rgba(0,0,0,0.2);width:100%;height:1px}.button-text-1:after{content:'';position:absolute;right:0;bottom:-1px;left:0;background:#000;height:1px;-webkit-animation:button-line-out 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both;animation:button-line-out 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both}.button-text-1:hover:after{width:100%;-webkit-animation:button-line-in 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both;animation:button-line-in 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both}.button-text-2:before{content:'';position:absolute;top:40%;right:0;left:0;background:rgba(0,0,0,0.2);height:40%;-webkit-animation:button-line-out 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both;animation:button-line-out 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both}.button-text-2:after{content:'';position:absolute;bottom:-1px;right:0;left:0;background:#000;height:1px;-webkit-animation:button-line-in 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both;animation:button-line-in 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both}.button-text-2:hover:before{-webkit-animation:button-line-in 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both;animation:button-line-in 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both}.button-text-2:hover:after{-webkit-animation:button-line-out 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both;animation:button-line-out 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both}.button-text-3{padding-left:30px;-webkit-transition:all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1);transition:all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1)}.button-text-3:before{content:'';position:absolute;top:50%;left:0;-webkit-transform:translateY(-50%);transform:translateY(-50%);background:#000;width:20px;height:1px;-webkit-transition:all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1);transition:all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1)}.button-text-3:hover{padding-left:40px}.button-text-3:hover:before{width:30px}@-webkit-keyframes button-line-out{0%{-webkit-transform:scaleX(1);transform:scaleX(1);-webkit-transform-origin:100% 50%;transform-origin:100% 50%}100%{-webkit-transform:scaleX(0);transform:scaleX(0);-webkit-transform-origin:100% 50%;transform-origin:100% 50%}}@keyframes button-line-out{0%{-webkit-transform:scaleX(1);transform:scaleX(1);-webkit-transform-origin:100% 50%;transform-origin:100% 50%}100%{-webkit-transform:scaleX(0);transform:scaleX(0);-webkit-transform-origin:100% 50%;transform-origin:100% 50%}}@-webkit-keyframes button-line-in{0%{-webkit-transform:scaleX(0);transform:scaleX(0);-webkit-transform-origin:0 50%;transform-origin:0 50%}100%{-webkit-transform:scale(1);transform:scale(1);-webkit-transform-origin:0 50%;transform-origin:0 50%}}@keyframes button-line-in{0%{-webkit-transform:scaleX(0);transform:scaleX(0);-webkit-transform-origin:0 50%;transform-origin:0 50%}100%{-webkit-transform:scale(1);transform:scale(1);-webkit-transform-origin:0 50%;transform-origin:0 50%}}div[class^='bg-dark'] .button-text-1,div[class^='bg-dark'] .button-text-2,div[class^='bg-dark'] .button-text-3,div[class*=' bg-dark'] .button-text-1,div[class*=' bg-dark'] .button-text-2,div[class*=' bg-dark'] .button-text-3,div[class^='bg-black'] .button-text-1,div[class^='bg-black'] .button-text-2,div[class^='bg-black'] .button-text-3,div[class*=' bg-black'] .button-text-1,div[class*=' bg-black'] .button-text-2,div[class*=' bg-black'] .button-text-3{color:rgba(255,255,255,0.8)}div[class^='bg-dark'] .button-text-1:hover,div[class^='bg-dark'] .button-text-2:hover,div[class^='bg-dark'] .button-text-3:hover,div[class*=' bg-dark'] .button-text-1:hover,div[class*=' bg-dark'] .button-text-2:hover,div[class*=' bg-dark'] .button-text-3:hover,div[class^='bg-black'] .button-text-1:hover,div[class^='bg-black'] .button-text-2:hover,div[class^='bg-black'] .button-text-3:hover,div[class*=' bg-black'] .button-text-1:hover,div[class*=' bg-black'] .button-text-2:hover,div[class*=' bg-black'] .button-text-3:hover{color:#fff}div[class^='bg-dark'] .button-text-1:before,div[class*=' bg-dark'] .button-text-1:before,div[class^='bg-black'] .button-text-1:before,div[class*=' bg-black'] .button-text-1:before{background:rgba(255,255,255,0.3)}div[class^='bg-dark'] .button-text-1:after,div[class*=' bg-dark'] .button-text-1:after,div[class^='bg-black'] .button-text-1:after,div[class*=' bg-black'] .button-text-1:after{background:#fff}div[class^='bg-dark'] .button-text-2:before,div[class*=' bg-dark'] .button-text-2:before,div[class^='bg-black'] .button-text-2:before,div[class*=' bg-black'] .button-text-2:before{background:rgba(255,255,255,0.4)}div[class^='bg-dark'] .button-text-2:after,div[class*=' bg-dark'] .button-text-2:after,div[class^='bg-black'] .button-text-2:after,div[class*=' bg-black'] .button-text-2:after{background:#fff}div[class^='bg-dark'] .button-text-3:before,div[class*=' bg-dark'] .button-text-3:before,div[class^='bg-black'] .button-text-3:before,div[class*=' bg-black'] .button-text-3:before{background:rgba(255,255,255,0.8)}div[class^='bg-dark'] .button-text-3:hover:before,div[class*=' bg-dark'] .button-text-3:hover:before,div[class^='bg-black'] .button-text-3:hover:before,div[class*=' bg-black'] .button-text-3:hover:before{background:#fff}.button-circle,a.button-circle{background:#e5e8eb;display:inline-block;border:1px solid #e5e8eb;border-radius:50%;color:#131517;text-align:center;-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}.button-circle:hover,a.button-circle:hover{color:#7C7C7C}.button-circle-xs{width:32px;height:32px;line-height:32px}.button-circle-xs i{line-height:32px}.button-circle-sm{width:40px;height:40px;line-height:40px}.button-circle-sm i{line-height:40px}.button-circle-md{width:50px;height:50px;line-height:50px}.button-circle-md i{line-height:50px}.button-circle-lg{width:60px;height:60px;line-height:60px}.button-circle-lg i{line-height:60px}.button-circle-xl{width:70px;height:70px;line-height:70px}.button-circle-xl i{line-height:70px}.button-circle-hover-slide{position:relative;display:inline-block;overflow:hidden}.button-circle-hover-slide i{position:absolute;left:50%}.button-circle-hover-slide i:first-child{top:50%;-webkit-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%)}.button-circle-hover-slide i:last-child{top:100%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.button-circle-hover-slide:hover i:first-child{-webkit-animation:button-slide-out 0.24s ease-out both;animation:button-slide-out 0.24s ease-out both}.button-circle-hover-slide:hover i:last-child{-webkit-animation:button-slide-in 0.24s ease-out both;animation:button-slide-in 0.24s ease-out both}@-webkit-keyframes button-slide-out{0%{top:50%;-webkit-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%);opacity:1}100%{top:-100%;-webkit-transform:translateX(-50%) translateY(0);transform:translateX(-50%) translateY(0);opacity:0}}@keyframes button-slide-out{0%{top:50%;-webkit-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%);opacity:1}100%{top:-100%;-webkit-transform:translateX(-50%) translateY(0);transform:translateX(-50%) translateY(0);opacity:0}}@-webkit-keyframes button-slide-in{0%{top:100%;-webkit-transform:translateX(-50%);transform:translateX(-50%);opacity:0}100%{top:50%;-webkit-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%);opacity:1}}@keyframes button-slide-in{0%{top:100%;-webkit-transform:translateX(-50%);transform:translateX(-50%);opacity:0}100%{top:50%;-webkit-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%);opacity:1}}.button-circle-grey,a.button-circle-grey{background:#e5e8eb;border:0}.button-circle-grey:hover,.button-circle-grey:focus,a.button-circle-grey:hover,a.button-circle-grey:focus{background:#dde0e3;color:#131517}.button-circle-dark,a.button-circle-dark{background:#1d2023;border:0;color:#fff}.button-circle-dark:hover,.button-circle-dark:focus,a.button-circle-dark:hover,a.button-circle-dark:focus{background:#131517;color:#fff}.button-circle-white,a.button-circle-white{background:#fff;border:0;color:#131517}.button-circle-white:hover,.button-circle-white:focus,a.button-circle-white:hover,a.button-circle-white:focus{background:rgba(255,255,255,0.9);color:#131517}.button-circle-white-2,a.button-circle-white-2{background:#fff;border-color:#fff;color:#131517}.button-circle-white-2:hover,.button-circle-white-2:focus,a.button-circle-white-2:hover,a.button-circle-white-2:focus{background:transparent;border-color:#fff;color:#fff}.button-circle-white-3,a.button-circle-white-3{background:rgba(255,255,255,0.15);border:0;color:#fff}.button-circle-white-3:hover,.button-circle-white-3:focus,a.button-circle-white-3:hover,a.button-circle-white-3:focus{background:rgba(255,255,255,0.2);color:#fff}.button-circle-outline-grey,a.button-circle-outline-grey{background:transparent;border-color:rgba(0,0,0,0.15)}.button-circle-outline-grey:hover,.button-circle-outline-grey:focus,a.button-circle-outline-grey:hover,a.button-circle-outline-grey:focus{border-color:#131517;color:#131517}.button-circle-outline-grey-2,a.button-circle-outline-grey-2{background:transparent;border-color:rgba(0,0,0,0.15)}.button-circle-outline-grey-2:hover,.button-circle-outline-grey-2:focus,a.button-circle-outline-grey-2:hover,a.button-circle-outline-grey-2:focus{background:rgba(0,0,0,0.15);border-color:transparent;color:#131517}.button-circle-outline-dark,a.button-circle-outline-dark{background:transparent;border-color:#131517}.button-circle-outline-dark:hover,.button-circle-outline-dark:focus,a.button-circle-outline-dark:hover,a.button-circle-outline-dark:focus{border-color:rgba(0,0,0,0.15);color:#131517}.button-circle-outline-dark-2,a.button-circle-outline-dark-2{background:transparent;border-color:#131517}.button-circle-outline-dark-2:hover,.button-circle-outline-dark-2:focus,a.button-circle-outline-dark-2:hover,a.button-circle-outline-dark-2:focus{background:#131517;border-color:transparent;color:#fff}.button-circle-outline-white,a.button-circle-outline-white{background:transparent;border-color:rgba(255,255,255,0.3);color:#fff}.button-circle-outline-white:hover,.button-circle-outline-white:focus,a.button-circle-outline-white:hover,a.button-circle-outline-white:focus{border-color:#fff;color:#fff}.button-circle-outline-white-2,a.button-circle-outline-white-2{background:transparent;border-color:#fff;color:#fff}.button-circle-outline-white-2:hover,.button-circle-outline-white-2:focus,a.button-circle-outline-white-2:hover,a.button-circle-outline-white-2:focus{background:#fff;color:#131517}.button-circle-animation-drop{position:relative}.button-circle-animation-drop:before{content:'';position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);opacity:1;width:100%;height:100%;border:2px solid rgba(0,0,0,0.1);border-radius:50%;-webkit-animation:button-drop 2s ease-out infinite;animation:button-drop 2s ease-out infinite}.button-circle-animation-drop.button-circle-dark:before{border-color:rgba(0,0,0,0.15)}.button-circle-animation-drop.button-circle-white:before,.button-circle-animation-drop.button-circle-white-2:before,.button-circle-animation-drop.button-circle-white-3:before{border-color:rgba(255,255,255,0.4)}.button-circle-animation-drop.button-circle-outline-white:before,.button-circle-animation-drop.button-circle-outline-white-2:before{border-color:rgba(255,255,255,0.3)}@-webkit-keyframes button-drop{0%{opacity:1;width:100%;height:100%}60%{opacity:0;width:160%;height:160%}100%{opacity:0;width:100%;height:100%}}@keyframes button-drop{0%{opacity:1;width:100%;height:100%}60%{opacity:0;width:160%;height:160%}100%{opacity:0;width:100%;height:100%}}.button-font-2{font-size:14px;letter-spacing:-0.2px;text-transform:none}.button-radius{border-radius:0.375em}.button-rounded{border-radius:50px}.button-border-2,.button-border-2.button-circle{border-width:2px}.button-hover-float:hover,.button-hover-float:focus,a.button-hover-float:hover,a.button-hover-float:focus{-webkit-transform:translateY(-3px);transform:translateY(-3px)}.button-hover-scale:hover,.button-hover-scale:focus,a.button-hover-scale:hover,a.button-hover-scale:focus{-webkit-transform:scale(1.03);transform:scale(1.03)}.button-hover-scale.button-circle:hover,.button-hover-scale.button-circle:focus,a.button-hover-scale.button-circle:hover,a.button-hover-scale.button-circle:focus{-webkit-transform:scale(1.04);transform:scale(1.04)}.button-hover-shrink:hover,.button-hover-shrink:focus,a.button-hover-shrink:hover,a.button-hover-shrink:focus{-webkit-transform:scale(0.97);transform:scale(0.97)}.button-hover-shrink.button-circle:hover,.button-hover-shrink.button-circle:focus,a.button-hover-shrink.button-circle:hover,a.button-hover-shrink.button-circle:focus{-webkit-transform:scale(0.96);transform:scale(0.96)}.button-shadow,a.button-shadow{-webkit-box-shadow:0 6px 30px 0 rgba(22,24,26,0.13);box-shadow:0 6px 30px 0 rgba(22,24,26,0.13)}.button-shadow:hover,.button-shadow:focus,a.button-shadow:hover,a.button-shadow:focus{-webkit-box-shadow:0 6px 36px 0 rgba(22,24,26,0.19);box-shadow:0 6px 36px 0 rgba(22,24,26,0.19)}.client-box{text-align:center}.client-box a img{opacity:0.4;-webkit-transition:ease-out 0.16s;transition:ease-out 0.16s}.client-box a:hover img,.client-box a:focus img{opacity:1}.owl-carousel .client-box img{display:inline-block}.clients-grid{list-style-type:none;overflow:hidden;margin:0;padding:0;text-align:center}.clients-grid li{position:relative;float:left;width:16.6%;margin:0;padding:30px}.clients-grid li:before,.clients-grid li:after{content:'';position:absolute}.clients-grid li:before{top:0;left:-1px;height:100%;border-left:1px dashed rgba(0,0,0,0.1)}.clients-grid li:after{left:0;bottom:-1px;width:100%;border-bottom:1px dashed rgba(0,0,0,0.1)}.clients-grid li a img{opacity:0.4;-webkit-transition:ease-out 0.16s;transition:ease-out 0.16s}.clients-grid li a:hover img,.clients-grid li a:focus img{opacity:1}@media (max-width: 991.98px){.clients-grid li{width:25%}}@media (max-width: 767.98px){.clients-grid li{width:33.3%}}@media (max-width: 575.98px){.clients-grid li{width:50%}}.clients-grid.column-5 li{width:20%}@media (max-width: 991.98px){.clients-grid.column-5 li{width:25%}}@media (max-width: 767.98px){.clients-grid.column-5 li{width:33.3%}}@media (max-width: 575.98px){.clients-grid.column-5 li{width:50%}}.clients-grid.column-4 li,.clients-grid.portfolio-wrapper.column-6 li,.clients-grid.portfolio-wrapper.column-5 li,.clients-grid.masonry.masonry-column-6 li,.clients-grid.masonry.masonry-column-5 li{width:25%}@media (max-width: 767.98px){.clients-grid.column-4 li,.clients-grid.portfolio-wrapper.column-6 li,.clients-grid.portfolio-wrapper.column-5 li,.clients-grid.masonry.masonry-column-6 li,.clients-grid.masonry.masonry-column-5 li{width:33.3%}}@media (max-width: 575.98px){.clients-grid.column-4 li,.clients-grid.portfolio-wrapper.column-6 li,.clients-grid.portfolio-wrapper.column-5 li,.clients-grid.masonry.masonry-column-6 li,.clients-grid.masonry.masonry-column-5 li{width:50%}}.clients-grid.column-3 li{width:33.3%}@media (max-width: 767.98px){.clients-grid.column-3 li{width:50%}}.clients-grid.column-2 li{width:50%}.clients-grid.border-style-solid{border:0}.clients-grid.border-style-solid li:before{border-left-style:solid}.clients-grid.border-style-solid li:after{border-bottom-style:solid}.clients-grid.border-style-dotted{border:0}.clients-grid.border-style-dotted li:before{border-left-style:dotted}.clients-grid.border-style-dotted li:after{border-bottom-style:dotted}div[class^='bg-black'] .clients-grid li:before,div[class^='bg-black'] .clients-grid li:after,div[class*=' bg-black'] .clients-grid li:before,div[class*=' bg-black'] .clients-grid li:after,div[class^='bg-dark'] .clients-grid li:before,div[class^='bg-dark'] .clients-grid li:after,div[class*=' bg-dark'] .clients-grid li:before,div[class*=' bg-dark'] .clients-grid li:after{border-color:rgba(255,255,255,0.2)}.submit-result span{display:none;-webkit-transition:ease-out 0.2s;transition:ease-out 0.2s}.submit-result span.show-result{margin-top:30px;display:block}.submit-result span#success{color:#24963e}.submit-result span#error{color:#c62f3e}.submit-result span .error-color{background:rgba(255,0,0,0.1)}.countdown{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}.countdown div{width:25%}hr{background:rgba(0,0,0,0.1);height:1px;border:0;margin-right:0;margin-left:0}.text-center hr{margin-right:auto;margin-left:auto}.text-right hr{margin-left:auto}.divider-width-10px hr{width:10px}.divider-width-20px hr{width:20px}.divider-width-30px hr{width:30px}.divider-width-40px hr{width:40px}.divider-width-50px hr{width:50px}.divider-width-60px hr{width:60px}.divider-width-70px hr{width:70px}.divider-height-2px hr{height:2px}.divider-height-3px hr{height:3px}div[class^='bg-black'] hr,div[class*=' bg-black'] hr,div[class^='bg-dark'] hr,div[class*=' bg-dark'] hr{background:rgba(255,255,255,0.1)}.divider-dots span{display:inline-block;background:rgba(0,0,0,0.1);width:6px;height:6px;margin-right:8px;border-radius:50%}.divider-dots span:last-child{margin-right:0}.divider-dots.divider-dots-sm span{width:4px;height:4px;margin-right:6px}.divider-dots.divider-dots-sm span:last-child{margin-right:0}.divider-dots.divider-dots-lg span{width:8px;height:8px;margin-right:10px}.divider-dots.divider-dots-lg span:last-child{margin-right:0}div[class^='bg-black'] .divider-dots span,div[class*=' bg-black'] .divider-dots span,div[class^='bg-dark'] .divider-dots span,div[class*=' bg-dark'] .divider-dots span{background:rgba(255,255,255,0.1)}.divider-zigzag{height:16px}.divider-zigzag span{position:relative;display:inline-block;width:17px;height:16px;margin-right:-3px}.divider-zigzag span:before,.divider-zigzag span:after{content:'';position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);background:rgba(0,0,0,0.2);width:10px;height:1px}.divider-zigzag span:before{left:0;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.divider-zigzag span:after{right:0;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.divider-zigzag span:last-child{margin-right:0}.divider-zigzag.divider-zigzag-sm{height:14px}.divider-zigzag.divider-zigzag-sm span{width:12px;height:14px;margin-right:-2px}.divider-zigzag.divider-zigzag-sm span:before,.divider-zigzag.divider-zigzag-sm span:after{width:7px}.divider-zigzag.divider-zigzag-sm span:last-child{margin-right:0}.divider-zigzag.divider-zigzag-lg{height:18px}.divider-zigzag.divider-zigzag-lg span{width:24px;height:18px;margin-right:-4px}.divider-zigzag.divider-zigzag-lg span:before,.divider-zigzag.divider-zigzag-lg span:after{width:14px}.divider-zigzag.divider-zigzag-lg span:last-child{margin-right:0}.divider-zigzag.divider-zigzag-color-black span:before,.divider-zigzag.divider-zigzag-color-black span:after{background:#000}.divider-zigzag.divider-zigzag-color-black-09 span:before,.divider-zigzag.divider-zigzag-color-black-09 span:after{background:rgba(0,0,0,0.9)}.divider-zigzag.divider-zigzag-color-black-08 span:before,.divider-zigzag.divider-zigzag-color-black-08 span:after{background:rgba(0,0,0,0.8)}.divider-zigzag.divider-zigzag-color-black-07 span:before,.divider-zigzag.divider-zigzag-color-black-07 span:after{background:rgba(0,0,0,0.7)}.divider-zigzag.divider-zigzag-color-black-06 span:before,.divider-zigzag.divider-zigzag-color-black-06 span:after{background:rgba(0,0,0,0.6)}.divider-zigzag.divider-zigzag-color-black-05 span:before,.divider-zigzag.divider-zigzag-color-black-05 span:after{background:rgba(0,0,0,0.5)}.divider-zigzag.divider-zigzag-color-black-04 span:before,.divider-zigzag.divider-zigzag-color-black-04 span:after{background:rgba(0,0,0,0.4)}.divider-zigzag.divider-zigzag-color-black-03 span:before,.divider-zigzag.divider-zigzag-color-black-03 span:after{background:rgba(0,0,0,0.3)}.divider-zigzag.divider-zigzag-color-black-02 span:before,.divider-zigzag.divider-zigzag-color-black-02 span:after{background:rgba(0,0,0,0.2)}.divider-zigzag.divider-zigzag-color-black-01 span:before,.divider-zigzag.divider-zigzag-color-black-01 span:after{background:rgba(0,0,0,0.1)}.divider-zigzag.divider-zigzag-color-white span:before,.divider-zigzag.divider-zigzag-color-white span:after{background:#fff}.divider-zigzag.divider-zigzag-color-white-09 span:before,.divider-zigzag.divider-zigzag-color-white-09 span:after{background:rgba(255,255,255,0.9)}.divider-zigzag.divider-zigzag-color-white-08 span:before,.divider-zigzag.divider-zigzag-color-white-08 span:after{background:rgba(255,255,255,0.8)}.divider-zigzag.divider-zigzag-color-white-07 span:before,.divider-zigzag.divider-zigzag-color-white-07 span:after{background:rgba(255,255,255,0.7)}.divider-zigzag.divider-zigzag-color-white-06 span:before,.divider-zigzag.divider-zigzag-color-white-06 span:after{background:rgba(255,255,255,0.6)}.divider-zigzag.divider-zigzag-color-white-05 span:before,.divider-zigzag.divider-zigzag-color-white-05 span:after{background:rgba(255,255,255,0.5)}.divider-zigzag.divider-zigzag-color-white-04 span:before,.divider-zigzag.divider-zigzag-color-white-04 span:after{background:rgba(255,255,255,0.4)}.divider-zigzag.divider-zigzag-color-white-03 span:before,.divider-zigzag.divider-zigzag-color-white-03 span:after{background:rgba(255,255,255,0.3)}.divider-zigzag.divider-zigzag-color-white-02 span:before,.divider-zigzag.divider-zigzag-color-white-02 span:after{background:rgba(255,255,255,0.2)}.divider-zigzag.divider-zigzag-color-white-01 span:before,.divider-zigzag.divider-zigzag-color-white-01 span:after{background:rgba(255,255,255,0.1)}.feature-box{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;flex-wrap:wrap;align-items:center;position:relative;min-height:50px;padding-left:74px}@media (max-width: 991.98px){.feature-box{padding-left:66px}}.feature-box .feature-box-icon{position:absolute;top:0;left:0;background:#e5e8eb;width:50px;height:50px;border-radius:50%;text-align:center;-webkit-transition:ease-out 0.16s;transition:ease-out 0.16s}.feature-box .feature-box-icon *{margin:0;line-height:50px;vertical-align:middle;color:rgba(0,0,0,0.9);-webkit-transition:ease-out 0.16s;transition:ease-out 0.16s}.feature-box .feature-box-icon a{display:block}.feature-box .feature-box-icon.middle{top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.feature-box h1,.feature-box h2,.feature-box h3,.feature-box h4,.feature-box h5,.feature-box h6{width:100%}.feature-box:hover .feature-box-icon{background:#dde0e3}.feature-box.feature-box-xl{min-height:70px;padding-left:94px}@media (max-width: 991.98px){.feature-box.feature-box-xl{padding-left:86px}}.feature-box.feature-box-xl .feature-box-icon{width:70px;height:70px}.feature-box.feature-box-xl .feature-box-icon *{line-height:70px}.feature-box.feature-box-lg{min-height:60px;padding-left:84px}@media (max-width: 991.98px){.feature-box.feature-box-lg{padding-left:80px}}.feature-box.feature-box-lg .feature-box-icon{width:60px;height:60px}.feature-box.feature-box-lg .feature-box-icon *{line-height:60px}.feature-box.feature-box-sm{min-height:40px;padding-left:64px}@media (max-width: 991.98px){.feature-box.feature-box-sm{padding-left:56px}}.feature-box.feature-box-sm .feature-box-icon{width:40px;height:40px}.feature-box.feature-box-sm .feature-box-icon *{line-height:40px}.feature-box.feature-box-xs{min-height:32px;padding-left:54px}@media (max-width: 991.98px){.feature-box.feature-box-xs{padding-left:48px}}.feature-box.feature-box-xs .feature-box-icon{width:32px;height:32px}.feature-box.feature-box-xs .feature-box-icon *{line-height:32px}.feature-box.dark .feature-box-icon{background:#1d2023}.feature-box.dark .feature-box-icon *{color:rgba(255,255,255,0.9)}.feature-box.dark:hover .feature-box-icon{background:#131517}.feature-box.white .feature-box-icon{background:#fff}.feature-box.white:hover .feature-box-icon{background:rgba(255,255,255,0.9)}.feature-box.outline-gray .feature-box-icon,.feature-box.outline-grey .feature-box-icon{background:transparent;border:1px solid #e5e8eb}.feature-box.outline-gray:hover .feature-box-icon,.feature-box.outline-grey:hover .feature-box-icon{background:#e5e8eb}.feature-box.outline-dark .feature-box-icon{background:transparent;border:1px solid rgba(0,0,0,0.8)}.feature-box.outline-dark:hover .feature-box-icon{background:#131517}.feature-box.outline-dark:hover .feature-box-icon *{color:#fff}.feature-box.outline-white .feature-box-icon{background:transparent;border:1px solid rgba(255,255,255,0.9)}.feature-box.outline-white .feature-box-icon *{color:rgba(255,255,255,0.9)}.feature-box.outline-white:hover .feature-box-icon{background:#fff}.feature-box.outline-white:hover .feature-box-icon *{color:#131517}div[class^="hoverbox"]{overflow:hidden;position:relative;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);display:inline-block}div[class^="hoverbox"] img{-webkit-transition:transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);transition:transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1)}.hoverbox-1:before,.hoverbox-2:before{content:'';position:absolute;top:0;left:0;z-index:1;visibility:hidden;opacity:0;background:rgba(0,0,0,0.5);width:100%;height:100%;-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}.hoverbox-1 .hover-content,.hoverbox-2 .hover-content{position:absolute;z-index:2;visibility:hidden;opacity:0;color:rgba(255,255,255,0.7);-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}.hoverbox-1 .hover-content h1,.hoverbox-1 .hover-content h2,.hoverbox-1 .hover-content h3,.hoverbox-1 .hover-content h4,.hoverbox-1 .hover-content h5,.hoverbox-1 .hover-content h6,.hoverbox-2 .hover-content h1,.hoverbox-2 .hover-content h2,.hoverbox-2 .hover-content h3,.hoverbox-2 .hover-content h4,.hoverbox-2 .hover-content h5,.hoverbox-2 .hover-content h6{color:#fff}.hoverbox-1:hover:before,.hoverbox-1:focus:before,.hoverbox-2:hover:before,.hoverbox-2:focus:before{visibility:visible;opacity:1}.hoverbox-1:hover img,.hoverbox-1:focus img,.hoverbox-2:hover img,.hoverbox-2:focus img{-webkit-transform:scale(1.04);transform:scale(1.04)}.hoverbox-1:hover .hover-content,.hoverbox-1:focus .hover-content,.hoverbox-2:hover .hover-content,.hoverbox-2:focus .hover-content{visibility:visible;opacity:1}.hoverbox-1 .hover-content{top:50%;right:0;left:0;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:100%;margin-top:5px;padding:0 30px}.hoverbox-1:hover .hover-content,.hoverbox-1:focus .hover-content{margin-top:0}.hoverbox-2 .hover-content{right:0;bottom:0;left:0;-webkit-transform:translateY(5px);transform:translateY(5px);width:100%;padding:30px}.hoverbox-2:hover .hover-content,.hoverbox-2:focus .hover-content{-webkit-transform:translateY(0);transform:translateY(0)}.hoverbox-3:before{content:'';position:absolute;top:16px;right:16px;bottom:16px;left:16px;-webkit-transform:scale(0.99);transform:scale(0.99);z-index:1;visibility:hidden;opacity:0;background:#fff;-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}.hoverbox-3 .hover-content{position:absolute;top:50%;right:16px;left:16px;-webkit-transform:translateY(-50%);transform:translateY(-50%);z-index:2;visibility:hidden;opacity:0;margin-top:4px;padding:0 30px;-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}@media (max-width: 991.98px){.hoverbox-3 .hover-content{padding:0 20px}}.hoverbox-3:hover:before,.hoverbox-3:focus:before{-webkit-transform:scale(1);transform:scale(1);visibility:visible;opacity:1}.hoverbox-3:hover img,.hoverbox-3:focus img{-webkit-transform:scale(1.04);transform:scale(1.04)}.hoverbox-3:hover .hover-content,.hoverbox-3:focus .hover-content{visibility:visible;opacity:1;margin-top:0}.hoverbox-4 .hover-content{position:absolute;right:16px;bottom:16px;left:16px;-webkit-transform:translateY(4px);transform:translateY(4px);z-index:1;visibility:hidden;opacity:0;background:#fff;padding:30px;-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}@media (max-width: 991.98px){.hoverbox-4 .hover-content{padding:20px}}.hoverbox-4:hover img,.hoverbox-4:focus img{-webkit-transform:scale(1.04);transform:scale(1.04)}.hoverbox-4:hover .hover-content,.hoverbox-4:focus .hover-content{-webkit-transform:translateY(0);transform:translateY(0);visibility:visible;opacity:1}.hoverbox-5:after,.hoverbox-6:after{content:'';position:absolute;top:0;left:0;background:rgba(0,0,0,0.4);width:100%;height:100%;-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}.hoverbox-5 .content,.hoverbox-5 .hover-content,.hoverbox-6 .content,.hoverbox-6 .hover-content{position:absolute;z-index:1;color:rgba(255,255,255,0.7);-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}.hoverbox-5 .content h1,.hoverbox-5 .content h2,.hoverbox-5 .content h3,.hoverbox-5 .content h4,.hoverbox-5 .content h5,.hoverbox-5 .content h6,.hoverbox-5 .hover-content h1,.hoverbox-5 .hover-content h2,.hoverbox-5 .hover-content h3,.hoverbox-5 .hover-content h4,.hoverbox-5 .hover-content h5,.hoverbox-5 .hover-content h6,.hoverbox-6 .content h1,.hoverbox-6 .content h2,.hoverbox-6 .content h3,.hoverbox-6 .content h4,.hoverbox-6 .content h5,.hoverbox-6 .content h6,.hoverbox-6 .hover-content h1,.hoverbox-6 .hover-content h2,.hoverbox-6 .hover-content h3,.hoverbox-6 .hover-content h4,.hoverbox-6 .hover-content h5,.hoverbox-6 .hover-content h6{color:#fff}.hoverbox-5 .hover-content,.hoverbox-6 .hover-content{visibility:hidden;opacity:0}.hoverbox-5:hover:after,.hoverbox-5:focus:after,.hoverbox-6:hover:after,.hoverbox-6:focus:after{background:rgba(0,0,0,0.5)}.hoverbox-5:hover img,.hoverbox-5:focus img,.hoverbox-6:hover img,.hoverbox-6:focus img{-webkit-transform:scale(1.04);transform:scale(1.04)}.hoverbox-5:hover .content,.hoverbox-5:focus .content,.hoverbox-6:hover .content,.hoverbox-6:focus .content{visibility:hidden;opacity:0}.hoverbox-5:hover .hover-content,.hoverbox-5:focus .hover-content,.hoverbox-6:hover .hover-content,.hoverbox-6:focus .hover-content{visibility:visible;opacity:1}.hoverbox-5 .content,.hoverbox-5 .hover-content{top:50%;left:0;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:100%;padding:0 30px}.hoverbox-5 .hover-content{margin-top:5px}.hoverbox-5:hover .content,.hoverbox-5:focus .content{margin-top:-5px}.hoverbox-5:hover .hover-content,.hoverbox-5:focus .hover-content{margin-top:0}.hoverbox-6 .content,.hoverbox-6 .hover-content{bottom:0;left:0;width:100%;padding:30px}.hoverbox-6 .hover-content{-webkit-transform:translateY(5px);transform:translateY(5px)}.hoverbox-6:hover .content,.hoverbox-6:focus .content{-webkit-transform:translateY(-5px);transform:translateY(-5px)}.hoverbox-6:hover .hover-content,.hoverbox-6:focus .hover-content{-webkit-transform:translateY(0);transform:translateY(0)}.hoverbox-7:after{content:'';position:absolute;top:0;left:0;background:rgba(0,0,0,0.4);width:100%;height:100%;-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}.hoverbox-7 .content,.hoverbox-7 .hover-content{position:absolute;z-index:1;left:0;width:100%;padding:30px;color:rgba(255,255,255,0.7)}.hoverbox-7 .content h1,.hoverbox-7 .content h2,.hoverbox-7 .content h3,.hoverbox-7 .content h4,.hoverbox-7 .content h5,.hoverbox-7 .content h6,.hoverbox-7 .hover-content h1,.hoverbox-7 .hover-content h2,.hoverbox-7 .hover-content h3,.hoverbox-7 .hover-content h4,.hoverbox-7 .hover-content h5,.hoverbox-7 .hover-content h6{color:#fff}.hoverbox-7 .content{top:0}.hoverbox-7 .hover-content{bottom:0;-webkit-transform:translateY(5px);transform:translateY(5px);visibility:hidden;opacity:0;-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}.hoverbox-7:hover:after,.hoverbox-7:focus:after{background:rgba(0,0,0,0.5)}.hoverbox-7:hover img,.hoverbox-7:focus img{-webkit-transform:scale(1.04);transform:scale(1.04)}.hoverbox-7:hover .hover-content,.hoverbox-7:focus .hover-content{-webkit-transform:translateY(0);transform:translateY(0);visibility:visible;opacity:1}.hoverbox-8 a,.hoverbox-9 a,.hoverbox-10 a{display:block}.hoverbox-8 a:before,.hoverbox-9 a:before,.hoverbox-10 a:before{content:'';position:absolute;top:0;left:0;z-index:1;opacity:0;background:rgba(255,255,255,0.1);width:100%;height:100%;-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}.hoverbox-8 .content,.hoverbox-9 .content,.hoverbox-10 .content{position:absolute;z-index:2;display:inline-block;background:#fff;padding:10px 16px;color:rgba(0,0,0,0.9)}.hoverbox-8 .content h1,.hoverbox-8 .content h2,.hoverbox-8 .content h3,.hoverbox-8 .content h4,.hoverbox-8 .content h5,.hoverbox-8 .content h6,.hoverbox-9 .content h1,.hoverbox-9 .content h2,.hoverbox-9 .content h3,.hoverbox-9 .content h4,.hoverbox-9 .content h5,.hoverbox-9 .content h6,.hoverbox-10 .content h1,.hoverbox-10 .content h2,.hoverbox-10 .content h3,.hoverbox-10 .content h4,.hoverbox-10 .content h5,.hoverbox-10 .content h6{margin:0;color:rgba(0,0,0,0.9)}.hoverbox-8:hover a:before,.hoverbox-8:focus a:before,.hoverbox-9:hover a:before,.hoverbox-9:focus a:before,.hoverbox-10:hover a:before,.hoverbox-10:focus a:before{opacity:1}.hoverbox-8:hover img,.hoverbox-8:focus img,.hoverbox-9:hover img,.hoverbox-9:focus img,.hoverbox-10:hover img,.hoverbox-10:focus img{-webkit-transform:scale(1.04);transform:scale(1.04)}.hoverbox-8 .content{top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}.hoverbox-9 .content{top:16px;left:16px}.hoverbox-10 .content{bottom:16px;left:16px}.hoverbox-11:before{content:'';position:absolute;top:0;left:0;z-index:1;visibility:hidden;opacity:0;background:rgba(0,0,0,0.5);width:100%;height:100%;-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}.hoverbox-11 .hover-content{position:absolute;top:0;left:0;z-index:2;width:100%;height:100%;color:rgba(255,255,255,0.7)}.hoverbox-11 .hover-content h1,.hoverbox-11 .hover-content h2,.hoverbox-11 .hover-content h3,.hoverbox-11 .hover-content h4,.hoverbox-11 .hover-content h5,.hoverbox-11 .hover-content h6{color:#fff}.hoverbox-11 .hover-content .top{position:absolute;top:0;right:0;left:0;-webkit-transform:translateY(5px);transform:translateY(5px);opacity:0;padding:30px;-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}.hoverbox-11 .hover-content .bottom{position:absolute;right:0;bottom:0;left:0;-webkit-transform:translateY(5px);transform:translateY(5px);opacity:0;padding:30px;-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}.hoverbox-11:hover:before,.hoverbox-11:focus:before{visibility:visible;opacity:1}.hoverbox-11:hover img,.hoverbox-11:focus img{-webkit-transform:scale(1.04);transform:scale(1.04)}.hoverbox-11:hover .hover-content,.hoverbox-11:focus .hover-content{visibility:visible;opacity:1}.hoverbox-11:hover .hover-content .top,.hoverbox-11:hover .hover-content .bottom,.hoverbox-11:focus .hover-content .top,.hoverbox-11:focus .hover-content .bottom{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}.hoverbox-11:hover .hover-content .top,.hoverbox-11:focus .hover-content .top{-webkit-transition-delay:.05s;transition-delay:.05s}.hoverbox-11:hover .hover-content .bottom,.hoverbox-11:focus .hover-content .bottom{-webkit-transition-delay:.1s;transition-delay:.1s}.hoverbox-1 a:not(.button,.button-circle,.button-text),.hoverbox-2 a:not(.button,.button-circle,.button-text),.hoverbox-5 a:not(.button,.button-circle,.button-text),.hoverbox-6 a:not(.button,.button-circle,.button-text),.hoverbox-7 a:not(.button,.button-circle,.button-text),.hoverbox-11 a:not(.button,.button-circle,.button-text){color:rgba(255,255,255,0.7)}.hoverbox-1 a:not(.button,.button-circle,.button-text):hover,.hoverbox-1 a:not(.button,.button-circle,.button-text):focus,.hoverbox-2 a:not(.button,.button-circle,.button-text):hover,.hoverbox-2 a:not(.button,.button-circle,.button-text):focus,.hoverbox-5 a:not(.button,.button-circle,.button-text):hover,.hoverbox-5 a:not(.button,.button-circle,.button-text):focus,.hoverbox-6 a:not(.button,.button-circle,.button-text):hover,.hoverbox-6 a:not(.button,.button-circle,.button-text):focus,.hoverbox-7 a:not(.button,.button-circle,.button-text):hover,.hoverbox-7 a:not(.button,.button-circle,.button-text):focus,.hoverbox-11 a:not(.button,.button-circle,.button-text):hover,.hoverbox-11 a:not(.button,.button-circle,.button-text):focus{color:#fff}.hoverbox-1 a.button-text-1,.hoverbox-1 a.button-text-2,.hoverbox-1 a.button-text-3,.hoverbox-2 a.button-text-1,.hoverbox-2 a.button-text-2,.hoverbox-2 a.button-text-3,.hoverbox-5 a.button-text-1,.hoverbox-5 a.button-text-2,.hoverbox-5 a.button-text-3,.hoverbox-6 a.button-text-1,.hoverbox-6 a.button-text-2,.hoverbox-6 a.button-text-3,.hoverbox-7 a.button-text-1,.hoverbox-7 a.button-text-2,.hoverbox-7 a.button-text-3,.hoverbox-11 a.button-text-1,.hoverbox-11 a.button-text-2,.hoverbox-11 a.button-text-3{color:rgba(255,255,255,0.8)}.hoverbox-1 a.button-text-1:hover,.hoverbox-1 a.button-text-2:hover,.hoverbox-1 a.button-text-3:hover,.hoverbox-2 a.button-text-1:hover,.hoverbox-2 a.button-text-2:hover,.hoverbox-2 a.button-text-3:hover,.hoverbox-5 a.button-text-1:hover,.hoverbox-5 a.button-text-2:hover,.hoverbox-5 a.button-text-3:hover,.hoverbox-6 a.button-text-1:hover,.hoverbox-6 a.button-text-2:hover,.hoverbox-6 a.button-text-3:hover,.hoverbox-7 a.button-text-1:hover,.hoverbox-7 a.button-text-2:hover,.hoverbox-7 a.button-text-3:hover,.hoverbox-11 a.button-text-1:hover,.hoverbox-11 a.button-text-2:hover,.hoverbox-11 a.button-text-3:hover{color:#fff}.hoverbox-1 a.button-text-1:before,.hoverbox-2 a.button-text-1:before,.hoverbox-5 a.button-text-1:before,.hoverbox-6 a.button-text-1:before,.hoverbox-7 a.button-text-1:before,.hoverbox-11 a.button-text-1:before{background:rgba(255,255,255,0.3)}.hoverbox-1 a.button-text-1:after,.hoverbox-2 a.button-text-1:after,.hoverbox-5 a.button-text-1:after,.hoverbox-6 a.button-text-1:after,.hoverbox-7 a.button-text-1:after,.hoverbox-11 a.button-text-1:after{background:#fff}.hoverbox-1 a.button-text-2:before,.hoverbox-2 a.button-text-2:before,.hoverbox-5 a.button-text-2:before,.hoverbox-6 a.button-text-2:before,.hoverbox-7 a.button-text-2:before,.hoverbox-11 a.button-text-2:before{background:rgba(255,255,255,0.4)}.hoverbox-1 a.button-text-2:after,.hoverbox-2 a.button-text-2:after,.hoverbox-5 a.button-text-2:after,.hoverbox-6 a.button-text-2:after,.hoverbox-7 a.button-text-2:after,.hoverbox-11 a.button-text-2:after{background:#fff}.hoverbox-1 a.button-text-3:before,.hoverbox-2 a.button-text-3:before,.hoverbox-5 a.button-text-3:before,.hoverbox-6 a.button-text-3:before,.hoverbox-7 a.button-text-3:before,.hoverbox-11 a.button-text-3:before{background:rgba(255,255,255,0.8)}.hoverbox-1 a.button-text-3:hover:before,.hoverbox-2 a.button-text-3:hover:before,.hoverbox-5 a.button-text-3:hover:before,.hoverbox-6 a.button-text-3:hover:before,.hoverbox-7 a.button-text-3:hover:before,.hoverbox-11 a.button-text-3:hover:before{background:#fff}.lightbox-image-box,.lightbox-media-box{position:relative;overflow:hidden;display:block}.lightbox-image-box[class*=' border-radius-'],.lightbox-image-box[class^='border-radius-'],.lightbox-media-box[class*=' border-radius-'],.lightbox-media-box[class^='border-radius-']{-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0)}.lightbox-image-box:after,.lightbox-media-box:after{content:'';position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;background:rgba(0,0,0,0.1);-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}.lightbox-image-box img,.lightbox-media-box img{-webkit-transform:scale(1);transform:scale(1);-webkit-transition:transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);transition:transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1)}.lightbox-image-box i,.lightbox-media-box i{z-index:1;position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);background:rgba(0,0,0,0.6);width:60px;height:60px;border-radius:50%;text-align:center;line-height:60px;color:rgba(255,255,255,0.9);-webkit-transition:ease-out 0.16s;transition:ease-out 0.16s}.lightbox-image-box.icon-xl i,.lightbox-image-box.icon-2xl i,.lightbox-media-box.icon-xl i,.lightbox-media-box.icon-2xl i{width:70px;height:70px;line-height:70px}.lightbox-image-box.icon-3xl i,.lightbox-image-box.icon-4xl i,.lightbox-image-box.icon-5xl i,.lightbox-media-box.icon-3xl i,.lightbox-media-box.icon-4xl i,.lightbox-media-box.icon-5xl i{width:80px;height:80px;line-height:80px}.lightbox-image-box:hover:after,.lightbox-media-box:hover:after{opacity:1}.lightbox-image-box:hover img,.lightbox-media-box:hover img{-webkit-transform:scale(1.04);transform:scale(1.04)}.lightbox-image-box:hover i,.lightbox-media-box:hover i{-webkit-transform:translate(-50%, -50%) scale(0.94);transform:translate(-50%, -50%) scale(0.94)}.mfp-bg{background:#000}.mfp-container,.mfp-bg{opacity:0;-webkit-backface-visibility:hidden;-webkit-transition:ease-out 0.16s;transition:ease-out 0.16s}.mfp-container{-webkit-transform:scale(0.98);transform:scale(0.98);padding:0 20px}.mfp-ready .mfp-container{-webkit-transform:scale(1);transform:scale(1);opacity:1}.mfp-ready.mfp-bg{opacity:0.97}.mfp-removing .mfp-container,.mfp-removing.mfp-bg{opacity:0}.mfp-removing .mfp-container{-webkit-transform:scale(0.98);transform:scale(0.98)}button.mfp-close{display:block;top:-5px;opacity:1;width:auto;height:auto;line-height:auto;font-size:24px;-webkit-transition:linear 0.1s;transition:linear 0.1s}button.mfp-close:hover{top:-5px;opacity:1;color:#fff}.mfp-iframe-holder .mfp-close{top:-45px}.mfp-iframe-holder .mfp-close:hover{top:-45px}.mfp-close-btn-in .mfp-close{color:rgba(255,255,255,0.7)}.mfp-arrow{-webkit-transition:linear 0.1s;transition:linear 0.1s}.mfp-arrow-left:before{border-right:0}.mfp-arrow-right:before{border-left:0}@media (max-width: 575.98px){button.mfp-arrow{background:rgba(0,0,0,0.5);width:70px;height:70px;margin-top:-35px}button.mfp-arrow:active{margin-top:-35px}button.mfp-arrow-left{margin-left:20px}button.mfp-arrow-left:before,button.mfp-arrow-left:after{margin-top:15px;margin-left:20px}button.mfp-arrow-right{margin-right:20px}button.mfp-arrow-right:before,button.mfp-arrow-right:after{margin-top:15px;margin-left:30px}}.mfp-bottom-bar{margin-top:-30px}.mfp-bottom-bar .mfp-title{color:rgba(255,255,255,0.7)}.mfp-bottom-bar .mfp-counter{color:rgba(255,255,255,0.6);font-size:14px}.mfp-iframe-scaler iframe,.mfp-figure::after{-webkit-box-shadow:0 0 14px 0 rgba(0,0,0,0.3);box-shadow:0 0 14px 0 rgba(0,0,0,0.3)}.gmap{width:100%}.gmap-xs{height:300px}.gmap-sm{height:350px}.gmap-md{height:400px}.gmap-lg{height:470px}.gmap-xl{height:550px}@media (max-width: 991.98px){.gmap-xs{height:250px}.gmap-sm{height:300px}.gmap-md{height:350px}.gmap-lg{height:400px}.gmap-xl{height:450px}}.pie-chart{position:relative;display:inline-block}.pie-chart-content{position:absolute;top:50%;left:0;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:100%;margin-top:-3px;padding:0 20px;text-align:center}.pie-chart-content .percent::after{content:'%'}.prices-box{border:1px solid rgba(0,0,0,0.1);padding:30px;text-align:center}.prices-box .price{margin:20px 0}.prices-box .price span{display:block;font:300 14px "Open Sans",sans-serif;color:#aaa}.prices-box .price h1,.prices-box .price h2,.prices-box .price h3,.prices-box .price h4,.prices-box .price h5,.prices-box .price h6{position:relative;display:inline-block;margin:0}.prices-box .price h1:before,.prices-box .price h2:before,.prices-box .price h3:before,.prices-box .price h4:before,.prices-box .price h5:before,.prices-box .price h6:before{content:'\f155';font-family:'Font Awesome 5 Free';position:absolute;top:10px;left:-10px;font-size:14px;line-height:14px}.prices-box .price h1 span,.prices-box .price h2 span,.prices-box .price h3 span,.prices-box .price h4 span,.prices-box .price h5 span,.prices-box .price h6 span{display:inline-block;font:300 14px "Open Sans",sans-serif;color:#aaa}.prices-box .price-features ul{list-style-type:none;margin:0;padding:0}.prices-box .btn,.prices-box .button,.prices-box .button-circle,.prices-box .button-text-1,.prices-box .button-text-2,.prices-box .button-text-3{margin-top:30px}.prices-box.prices-box-recommended{border-color:#000}div[class^='bg-black'] .prices-box,div[class*=' bg-black'] .prices-box,div[class^='bg-dark'] .prices-box,div[class*=' bg-dark'] .prices-box{border-color:rgba(255,255,255,0.2);color:rgba(255,255,255,0.5)}div[class^='bg-black'] .prices-box.prices-box-recommended,div[class*=' bg-black'] .prices-box.prices-box-recommended,div[class^='bg-dark'] .prices-box.prices-box-recommended,div[class*=' bg-dark'] .prices-box.prices-box-recommended{border-color:#fff}.progress-box{margin-bottom:20px}.progress-box:last-child{margin-bottom:0}.progress-box h1,.progress-box h2,.progress-box h3,.progress-box h4,.progress-box h5,.progress-box h6{margin-bottom:0}.progress-box .progress,.progress-box .progress-bar{height:1px;box-shadow:none;border-radius:0}.progress-box .progress{overflow:visible;background:rgba(0,0,0,0.15);margin:0;padding:0}.progress-box .progress .progress-bar{overflow:visible;position:relative;background:rgba(0,0,0,0.9);width:30%;border:none;color:rgba(0,0,0,0.9)}.progress-box .progress .progress-bar span{position:absolute;top:-13px;right:0;font-size:14px;font-weight:400}.progress-box .progress.progress-radius{border-radius:10px}.progress-box .progress.progress-radius .progress-bar{border-radius:10px}.progress-box .progress.progress-height-2px{height:2px}.progress-box .progress.progress-height-2px .progress-bar{height:2px}.progress-box .progress.progress-height-3px{height:3px}.progress-box .progress.progress-height-3px .progress-bar{height:3px}.progress-box .progress.progress-height-4px{height:4px}.progress-box .progress.progress-height-4px .progress-bar{height:4px}.progress-box .progress.progress-height-5px{height:5px}.progress-box .progress.progress-height-5px .progress-bar{height:5px}div[class^='bg-black'] .progress-box .progress,div[class*=' bg-black'] .progress-box .progress,div[class^='bg-dark'] .progress-box .progress,div[class*=' bg-dark'] .progress-box .progress{background:rgba(255,255,255,0.2)}div[class^='bg-black'] .progress-box .progress .progress-bar,div[class*=' bg-black'] .progress-box .progress .progress-bar,div[class^='bg-dark'] .progress-box .progress .progress-bar,div[class*=' bg-dark'] .progress-box .progress .progress-bar{background:#fff;color:#fff}.owl-carousel[data-owl-nav="true"]:not(.owl-nav-left,.owl-nav-right,.owl-nav-overlay,.owl-nav-overlay-left,.owl-nav-overlay-right,.owl-nav-overlap,.owl-nav-overlap-left,.owl-nav-overlap-right){padding:0 56px}@media (max-width: 991.98px){.owl-carousel[data-owl-nav="true"]:not(.owl-nav-left,.owl-nav-right,.owl-nav-overlay,.owl-nav-overlay-left,.owl-nav-overlay-right,.owl-nav-overlap,.owl-nav-overlap-left,.owl-nav-overlap-right){padding:0 48px}}.owl-carousel .owl-item img{width:auto}.owl-carousel .owl-nav{position:absolute;top:50%;right:0;left:0;-webkit-transform:translateY(-50%);transform:translateY(-50%);z-index:-1;height:36px}.owl-carousel .owl-nav button.owl-prev{left:0}.owl-carousel .owl-nav button.owl-next{right:0}.owl-carousel .owl-nav button.owl-next,.owl-carousel .owl-nav button.owl-prev{position:absolute;width:36px;height:36px;border-radius:50%;color:rgba(0,0,0,0.6);-webkit-transition:ease-out 0.16s;transition:ease-out 0.16s}.owl-carousel .owl-nav button.owl-next i,.owl-carousel .owl-nav button.owl-prev i{font-size:16px;line-height:36px}.owl-carousel .owl-nav button.owl-next:hover,.owl-carousel .owl-nav button.owl-next:focus,.owl-carousel .owl-nav button.owl-prev:hover,.owl-carousel .owl-nav button.owl-prev:focus{background:#eff2f5;color:#000}@media (max-width: 991.98px){.owl-carousel .owl-nav{height:32px}.owl-carousel .owl-nav button.owl-next,.owl-carousel .owl-nav button.owl-prev{width:32px;height:32px}.owl-carousel .owl-nav button.owl-next i,.owl-carousel .owl-nav button.owl-prev i{font-size:13px;line-height:32px}}.owl-carousel.owl-nav-left .owl-nav,.owl-carousel.owl-nav-right .owl-nav{padding-bottom:0}.owl-carousel .owl-dots{margin-top:20px;margin-right:-2px;margin-left:-2px;text-align:center;line-height:0}@media (max-width: 991.98px){.owl-carousel .owl-dots{margin-top:16px}}.owl-carousel .owl-dots .owl-dot{position:relative;display:inline-block;width:20px;height:20px;margin:0 2px;vertical-align:middle}.owl-carousel .owl-dots .owl-dot:before,.owl-carousel .owl-dots .owl-dot:after{content:'';position:absolute;border-radius:50%;-webkit-transition:ease-out 0.16s;transition:ease-out 0.16s}.owl-carousel .owl-dots .owl-dot:before{top:2px;right:2px;bottom:2px;left:2px;opacity:0;background:transparent;border:1px solid #000}.owl-carousel .owl-dots .owl-dot:after{top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);opacity:0.4;background:#000;width:4px;height:4px}.owl-carousel .owl-dots .owl-dot:hover:after,.owl-carousel .owl-dots .owl-dot:focus:after,.owl-carousel .owl-dots .owl-dot.active:after{opacity:1}.owl-carousel .owl-dots .owl-dot.active:before,.owl-carousel .owl-dots .owl-dot.active:after{opacity:1}.owl-carousel .owl-dots .owl-dot.active:before{top:0;right:0;bottom:0;left:0}.owl-carousel:not([data-owl-dots="false"],.owl-dots-overlay,.owl-dots-overlay-left,.owl-dots-overlay-right,.owl-dots-overlap,.owl-dots-overlap-left,.owl-dots-overlap-right) .owl-nav{margin-top:-20px}@media (max-width: 991.98px){.owl-carousel:not([data-owl-dots="false"],.owl-dots-overlay,.owl-dots-overlay-left,.owl-dots-overlay-right,.owl-dots-overlap,.owl-dots-overlap-left,.owl-dots-overlap-right) .owl-nav{margin-top:-18px}}div[class^='bg-dark'] .owl-carousel .owl-nav button.owl-next,div[class^='bg-dark'] .owl-carousel .owl-nav button.owl-prev,div[class*=' bg-dark'] .owl-carousel .owl-nav button.owl-next,div[class*=' bg-dark'] .owl-carousel .owl-nav button.owl-prev,div[class^='bg-black'] .owl-carousel .owl-nav button.owl-next,div[class^='bg-black'] .owl-carousel .owl-nav button.owl-prev,div[class*=' bg-black'] .owl-carousel .owl-nav button.owl-next,div[class*=' bg-black'] .owl-carousel .owl-nav button.owl-prev{color:rgba(255,255,255,0.7)}div[class^='bg-dark'] .owl-carousel .owl-nav button.owl-next:hover,div[class^='bg-dark'] .owl-carousel .owl-nav button.owl-next:focus,div[class^='bg-dark'] .owl-carousel .owl-nav button.owl-prev:hover,div[class^='bg-dark'] .owl-carousel .owl-nav button.owl-prev:focus,div[class*=' bg-dark'] .owl-carousel .owl-nav button.owl-next:hover,div[class*=' bg-dark'] .owl-carousel .owl-nav button.owl-next:focus,div[class*=' bg-dark'] .owl-carousel .owl-nav button.owl-prev:hover,div[class*=' bg-dark'] .owl-carousel .owl-nav button.owl-prev:focus,div[class^='bg-black'] .owl-carousel .owl-nav button.owl-next:hover,div[class^='bg-black'] .owl-carousel .owl-nav button.owl-next:focus,div[class^='bg-black'] .owl-carousel .owl-nav button.owl-prev:hover,div[class^='bg-black'] .owl-carousel .owl-nav button.owl-prev:focus,div[class*=' bg-black'] .owl-carousel .owl-nav button.owl-next:hover,div[class*=' bg-black'] .owl-carousel .owl-nav button.owl-next:focus,div[class*=' bg-black'] .owl-carousel .owl-nav button.owl-prev:hover,div[class*=' bg-black'] .owl-carousel .owl-nav button.owl-prev:focus{background:rgba(255,255,255,0.15);color:#fff}div[class^='bg-dark'] .owl-carousel .owl-dots .owl-dot:before,div[class*=' bg-dark'] .owl-carousel .owl-dots .owl-dot:before,div[class^='bg-black'] .owl-carousel .owl-dots .owl-dot:before,div[class*=' bg-black'] .owl-carousel .owl-dots .owl-dot:before{border-color:#fff}div[class^='bg-dark'] .owl-carousel .owl-dots .owl-dot:after,div[class*=' bg-dark'] .owl-carousel .owl-dots .owl-dot:after,div[class^='bg-black'] .owl-carousel .owl-dots .owl-dot:after,div[class*=' bg-black'] .owl-carousel .owl-dots .owl-dot:after{background:#fff}div[class^='bg-dark'] .owl-carousel .owl-dots .owl-dot:hover:after,div[class^='bg-dark'] .owl-carousel .owl-dots .owl-dot:focus:after,div[class^='bg-dark'] .owl-carousel .owl-dots .owl-dot.active:after,div[class*=' bg-dark'] .owl-carousel .owl-dots .owl-dot:hover:after,div[class*=' bg-dark'] .owl-carousel .owl-dots .owl-dot:focus:after,div[class*=' bg-dark'] .owl-carousel .owl-dots .owl-dot.active:after,div[class^='bg-black'] .owl-carousel .owl-dots .owl-dot:hover:after,div[class^='bg-black'] .owl-carousel .owl-dots .owl-dot:focus:after,div[class^='bg-black'] .owl-carousel .owl-dots .owl-dot.active:after,div[class*=' bg-black'] .owl-carousel .owl-dots .owl-dot:hover:after,div[class*=' bg-black'] .owl-carousel .owl-dots .owl-dot:focus:after,div[class*=' bg-black'] .owl-carousel .owl-dots .owl-dot.active:after{opacity:1}.bg-grey .owl-carousel .owl-nav button.owl-next:hover,.bg-grey .owl-carousel .owl-nav button.owl-next:focus,.bg-grey .owl-carousel .owl-nav button.owl-prev:hover,.bg-grey .owl-carousel .owl-nav button.owl-prev:focus,.bg-grey-lighter .owl-carousel .owl-nav button.owl-next:hover,.bg-grey-lighter .owl-carousel .owl-nav button.owl-next:focus,.bg-grey-lighter .owl-carousel .owl-nav button.owl-prev:hover,.bg-grey-lighter .owl-carousel .owl-nav button.owl-prev:focus,.bg-grey-lightest .owl-carousel .owl-nav button.owl-next:hover,.bg-grey-lightest .owl-carousel .owl-nav button.owl-next:focus,.bg-grey-lightest .owl-carousel .owl-nav button.owl-prev:hover,.bg-grey-lightest .owl-carousel .owl-nav button.owl-prev:focus{background:rgba(0,0,0,0.05)}.owl-carousel.owl-nav-left .owl-nav,.owl-carousel.owl-nav-right .owl-nav{height:auto}.owl-carousel.owl-nav-left .owl-nav button,.owl-carousel.owl-nav-right .owl-nav button{position:static;display:block;margin:8px 0}.owl-carousel.owl-nav-left .owl-nav button.owl-prev,.owl-carousel.owl-nav-left .owl-nav button.owl-next,.owl-carousel.owl-nav-right .owl-nav button.owl-prev,.owl-carousel.owl-nav-right .owl-nav button.owl-next{right:auto;left:auto}.owl-carousel.owl-nav-left{padding:0 0 0 56px}@media (max-width: 991.98px){.owl-carousel.owl-nav-left{padding:0 0 0 48px}}.owl-carousel.owl-nav-left .owl-nav{right:auto}.owl-carousel.owl-nav-right{padding:0 56px 0 0}@media (max-width: 991.98px){.owl-carousel.owl-nav-right{padding:0 48px 0 0}}.owl-carousel.owl-nav-right .owl-nav{left:auto}.owl-carousel.owl-nav-overlay .owl-nav,.owl-carousel.owl-nav-overlay-left .owl-nav,.owl-carousel.owl-nav-overlay-right .owl-nav{z-index:1;padding-bottom:0}.owl-carousel.owl-nav-overlay .owl-nav button.owl-next,.owl-carousel.owl-nav-overlay .owl-nav button.owl-prev,.owl-carousel.owl-nav-overlay-left .owl-nav button.owl-next,.owl-carousel.owl-nav-overlay-left .owl-nav button.owl-prev,.owl-carousel.owl-nav-overlay-right .owl-nav button.owl-next,.owl-carousel.owl-nav-overlay-right .owl-nav button.owl-prev{opacity:1;background:rgba(0,0,0,0.3);width:50px;height:50px;border:0;border-radius:50%;color:rgba(255,255,255,0.8);text-align:center}.owl-carousel.owl-nav-overlay .owl-nav button.owl-next i,.owl-carousel.owl-nav-overlay .owl-nav button.owl-prev i,.owl-carousel.owl-nav-overlay-left .owl-nav button.owl-next i,.owl-carousel.owl-nav-overlay-left .owl-nav button.owl-prev i,.owl-carousel.owl-nav-overlay-right .owl-nav button.owl-next i,.owl-carousel.owl-nav-overlay-right .owl-nav button.owl-prev i{line-height:50px}.owl-carousel.owl-nav-overlay .owl-nav button.owl-next:hover,.owl-carousel.owl-nav-overlay .owl-nav button.owl-next:focus,.owl-carousel.owl-nav-overlay .owl-nav button.owl-prev:hover,.owl-carousel.owl-nav-overlay .owl-nav button.owl-prev:focus,.owl-carousel.owl-nav-overlay-left .owl-nav button.owl-next:hover,.owl-carousel.owl-nav-overlay-left .owl-nav button.owl-next:focus,.owl-carousel.owl-nav-overlay-left .owl-nav button.owl-prev:hover,.owl-carousel.owl-nav-overlay-left .owl-nav button.owl-prev:focus,.owl-carousel.owl-nav-overlay-right .owl-nav button.owl-next:hover,.owl-carousel.owl-nav-overlay-right .owl-nav button.owl-next:focus,.owl-carousel.owl-nav-overlay-right .owl-nav button.owl-prev:hover,.owl-carousel.owl-nav-overlay-right .owl-nav button.owl-prev:focus{opacity:1;background:rgba(0,0,0,0.4);color:#fff}@media (min-width: 992px){.owl-carousel.owl-nav-overlay .owl-nav,.owl-carousel.owl-nav-overlay-left .owl-nav,.owl-carousel.owl-nav-overlay-right .owl-nav{opacity:0;-webkit-transition:ease-out 0.16s;transition:ease-out 0.16s}.owl-carousel.owl-nav-overlay:hover .owl-nav,.owl-carousel.owl-nav-overlay-left:hover .owl-nav,.owl-carousel.owl-nav-overlay-right:hover .owl-nav{opacity:1}}@media (max-width: 991.98px){.owl-carousel.owl-nav-overlay .owl-nav,.owl-carousel.owl-nav-overlay-left .owl-nav,.owl-carousel.owl-nav-overlay-right .owl-nav{display:none}}.owl-carousel.owl-nav-overlay .owl-nav{height:50px}.owl-carousel.owl-nav-overlay .owl-nav button.owl-prev{left:20px}.owl-carousel.owl-nav-overlay .owl-nav button.owl-next{right:20px}.owl-carousel.owl-nav-overlay:not([data-owl-dots="false"],.owl-dots-overlay,.owl-dots-overlay-left,.owl-dots-overlay-right,.owl-dots-overlap,.owl-dots-overlap-left,.owl-dots-overlap-right) .owl-nav{margin-top:-20px}.owl-carousel.owl-nav-overlay-left .owl-nav,.owl-carousel.owl-nav-overlay-right .owl-nav{height:auto}.owl-carousel.owl-nav-overlay-left .owl-nav button.owl-next,.owl-carousel.owl-nav-overlay-left .owl-nav button.owl-prev,.owl-carousel.owl-nav-overlay-right .owl-nav button.owl-next,.owl-carousel.owl-nav-overlay-right .owl-nav button.owl-prev{position:static;top:auto;right:auto;bottom:auto;left:auto;display:block;margin:4px 0}.owl-carousel.owl-nav-overlay-left:not([data-owl-dots="false"],.owl-dots-overlay,.owl-dots-overlay-left,.owl-dots-overlay-right,.owl-dots-overlap,.owl-dots-overlap-left,.owl-dots-overlap-right) .owl-nav,.owl-carousel.owl-nav-overlay-right:not([data-owl-dots="false"],.owl-dots-overlay,.owl-dots-overlay-left,.owl-dots-overlay-right,.owl-dots-overlap,.owl-dots-overlap-left,.owl-dots-overlap-right) .owl-nav{height:50px}.owl-carousel.owl-nav-overlay-left .owl-nav{right:auto;left:20px}.owl-carousel.owl-nav-overlay-right .owl-nav{right:20px;left:auto}.owl-carousel.owl-dots-left .owl-dots{text-align:left}.owl-carousel.owl-dots-right .owl-dots{text-align:right}.owl-carousel.owl-dots-overlay .owl-dots,.owl-carousel.owl-dots-overlay-left .owl-dots,.owl-carousel.owl-dots-overlay-right .owl-dots{position:absolute;bottom:20px;background:rgba(0,0,0,0.3);border-radius:20px;margin:0;padding:5px}@media (max-width: 991.98px){.owl-carousel.owl-dots-overlay .owl-dots,.owl-carousel.owl-dots-overlay-left .owl-dots,.owl-carousel.owl-dots-overlay-right .owl-dots{bottom:16px}}.owl-carousel.owl-dots-overlay .owl-dots .owl-dot:before,.owl-carousel.owl-dots-overlay-left .owl-dots .owl-dot:before,.owl-carousel.owl-dots-overlay-right .owl-dots .owl-dot:before{border-color:#fff}.owl-carousel.owl-dots-overlay .owl-dots .owl-dot:after,.owl-carousel.owl-dots-overlay-left .owl-dots .owl-dot:after,.owl-carousel.owl-dots-overlay-right .owl-dots .owl-dot:after{background:#fff}.owl-carousel.owl-dots-overlay .owl-dots .owl-dot:hover:after,.owl-carousel.owl-dots-overlay .owl-dots .owl-dot:focus:after,.owl-carousel.owl-dots-overlay .owl-dots .owl-dot.active:after,.owl-carousel.owl-dots-overlay-left .owl-dots .owl-dot:hover:after,.owl-carousel.owl-dots-overlay-left .owl-dots .owl-dot:focus:after,.owl-carousel.owl-dots-overlay-left .owl-dots .owl-dot.active:after,.owl-carousel.owl-dots-overlay-right .owl-dots .owl-dot:hover:after,.owl-carousel.owl-dots-overlay-right .owl-dots .owl-dot:focus:after,.owl-carousel.owl-dots-overlay-right .owl-dots .owl-dot.active:after{opacity:1}.owl-carousel.owl-dots-overlay .owl-dots{right:auto;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.owl-carousel.owl-dots-overlay.owl-nav-overlap-right .owl-dots{margin-left:-12.5px}.owl-carousel.owl-dots-overlay.owl-nav-left .owl-dots{margin-left:28px}.owl-carousel.owl-dots-overlay.owl-nav-right .owl-dots{margin-left:-28px}@media (min-width: 992px){.owl-carousel.owl-dots-overlay.owl-nav-overlap-left .owl-dots{margin-left:12.5px}}@media (max-width: 991.98px){.owl-carousel.owl-dots-overlay.owl-nav-overlap-left .owl-dots,.owl-carousel.owl-dots-overlay.owl-nav-overlap-right .owl-dots{margin-left:-10px}}.owl-carousel.owl-dots-overlay-left .owl-dots{right:auto;left:20px}@media (max-width: 991.98px){.owl-carousel.owl-dots-overlay-left .owl-dots{left:16px}}.owl-carousel.owl-dots-overlay-left[data-owl-nav="true"]:not(.owl-nav-right,.owl-nav-overlay,.owl-nav-overlay-left,.owl-nav-overlay-right,.owl-nav-overlap,.owl-nav-overlap-left,.owl-nav-overlap-right) .owl-dots,.owl-carousel.owl-dots-overlay-left.owl-nav-left:not(.owl-nav-right,.owl-nav-overlay,.owl-nav-overlay-left,.owl-nav-overlay-right,.owl-nav-overlap,.owl-nav-overlap-left,.owl-nav-overlap-right) .owl-dots{left:76px}@media (max-width: 991.98px){.owl-carousel.owl-dots-overlay-left[data-owl-nav="true"]:not(.owl-nav-right,.owl-nav-overlay,.owl-nav-overlay-left,.owl-nav-overlay-right,.owl-nav-overlap,.owl-nav-overlap-left,.owl-nav-overlap-right) .owl-dots,.owl-carousel.owl-dots-overlay-left.owl-nav-left:not(.owl-nav-right,.owl-nav-overlay,.owl-nav-overlay-left,.owl-nav-overlay-right,.owl-nav-overlap,.owl-nav-overlap-left,.owl-nav-overlap-right) .owl-dots{left:64px}}.owl-carousel.owl-dots-overlay-left.owl-nav-overlap .owl-dots{left:45px}@media (max-width: 991.98px){.owl-carousel.owl-dots-overlay-left.owl-nav-overlap .owl-dots{left:36px}}@media (min-width: 992px){.owl-carousel.owl-dots-overlay-left.owl-nav-overlap-left .owl-dots{left:45px}}.owl-carousel.owl-dots-overlay-right .owl-dots{right:20px;left:auto}@media (max-width: 991.98px){.owl-carousel.owl-dots-overlay-right .owl-dots{right:16px}}.owl-carousel.owl-dots-overlay-right[data-owl-nav="true"]:not(.owl-nav-left,.owl-nav-overlay,.owl-nav-overlay-left,.owl-nav-overlay-right,.owl-nav-overlap,.owl-nav-overlap-left,.owl-nav-overlap-right) .owl-dots{right:76px}@media (max-width: 991.98px){.owl-carousel.owl-dots-overlay-right[data-owl-nav="true"]:not(.owl-nav-left,.owl-nav-overlay,.owl-nav-overlay-left,.owl-nav-overlay-right,.owl-nav-overlap,.owl-nav-overlap-left,.owl-nav-overlap-right) .owl-dots{right:64px}}.owl-carousel.owl-dots-overlay-right.owl-nav-overlap .owl-dots,.owl-carousel.owl-dots-overlay-right.owl-nav-overlap-right .owl-dots{right:45px}@media (min-width: 992px){.owl-carousel.owl-dots-overlay-right.owl-nav-overlap-left .owl-dots{right:20px}}@media (max-width: 991.98px){.owl-carousel.owl-dots-overlay-right.owl-nav-overlap .owl-dots,.owl-carousel.owl-dots-overlay-right.owl-nav-overlap-left .owl-dots,.owl-carousel.owl-dots-overlay-right.owl-nav-overlap-right .owl-dots{right:36px}}.owl-carousel.owl-dots-overlap .owl-dots,.owl-carousel.owl-dots-overlap-left .owl-dots,.owl-carousel.owl-dots-overlap-right .owl-dots{position:absolute;bottom:0;background:#000;border-radius:20px;margin:0;padding:5px}.owl-carousel.owl-dots-overlap .owl-dots .owl-dot:before,.owl-carousel.owl-dots-overlap-left .owl-dots .owl-dot:before,.owl-carousel.owl-dots-overlap-right .owl-dots .owl-dot:before{border-color:#fff}.owl-carousel.owl-dots-overlap .owl-dots .owl-dot:after,.owl-carousel.owl-dots-overlap-left .owl-dots .owl-dot:after,.owl-carousel.owl-dots-overlap-right .owl-dots .owl-dot:after{background:#fff}.owl-carousel.owl-dots-overlap .owl-dots .owl-dot:hover:after,.owl-carousel.owl-dots-overlap .owl-dots .owl-dot:focus:after,.owl-carousel.owl-dots-overlap .owl-dots .owl-dot.active:after,.owl-carousel.owl-dots-overlap-left .owl-dots .owl-dot:hover:after,.owl-carousel.owl-dots-overlap-left .owl-dots .owl-dot:focus:after,.owl-carousel.owl-dots-overlap-left .owl-dots .owl-dot.active:after,.owl-carousel.owl-dots-overlap-right .owl-dots .owl-dot:hover:after,.owl-carousel.owl-dots-overlap-right .owl-dots .owl-dot:focus:after,.owl-carousel.owl-dots-overlap-right .owl-dots .owl-dot.active:after{opacity:1}.owl-carousel.owl-dots-overlap .owl-dots{right:auto;left:50%;-webkit-transform:translateY(50%) translateX(-50%);transform:translateY(50%) translateX(-50%)}.owl-carousel.owl-dots-overlap.owl-nav-left .owl-dots{margin-left:28px}.owl-carousel.owl-dots-overlap.owl-nav-right .owl-dots{margin-left:-28px}.owl-carousel.owl-dots-overlap.owl-nav-overlap-right .owl-dots{margin-left:-12.5px}@media (min-width: 992px){.owl-carousel.owl-dots-overlap.owl-nav-overlap-left .owl-dots{margin-left:12.5px}}.owl-carousel.owl-dots-overlap-left .owl-dots,.owl-carousel.owl-dots-overlap-right .owl-dots{-webkit-transform:translateY(50%);transform:translateY(50%)}.owl-carousel.owl-dots-overlap-left .owl-dots{right:auto;left:20px}@media (max-width: 991.98px){.owl-carousel.owl-dots-overlap-left .owl-dots{left:16px}}.owl-carousel.owl-dots-overlap-left[data-owl-nav="true"]:not(.owl-nav-right,.owl-nav-overlay,.owl-nav-overlay-left,.owl-nav-overlay-right,.owl-nav-overlap,.owl-nav-overlap-left,.owl-nav-overlap-right) .owl-dots,.owl-carousel.owl-dots-overlap-left.owl-nav-left:not(.owl-nav-right,.owl-nav-overlay,.owl-nav-overlay-left,.owl-nav-overlay-right,.owl-nav-overlap,.owl-nav-overlap-left,.owl-nav-overlap-right) .owl-dots{left:76px}@media (max-width: 991.98px){.owl-carousel.owl-dots-overlap-left[data-owl-nav="true"]:not(.owl-nav-right,.owl-nav-overlay,.owl-nav-overlay-left,.owl-nav-overlay-right,.owl-nav-overlap,.owl-nav-overlap-left,.owl-nav-overlap-right) .owl-dots,.owl-carousel.owl-dots-overlap-left.owl-nav-left:not(.owl-nav-right,.owl-nav-overlay,.owl-nav-overlay-left,.owl-nav-overlay-right,.owl-nav-overlap,.owl-nav-overlap-left,.owl-nav-overlap-right) .owl-dots{left:64px}}.owl-carousel.owl-dots-overlap-left.owl-nav-overlap .owl-dots{left:45px}@media (min-width: 992px){.owl-carousel.owl-dots-overlap-left.owl-nav-overlap-left .owl-dots{left:45px}}.owl-carousel.owl-dots-overlap-right .owl-dots{right:20px;left:auto}@media (max-width: 991.98px){.owl-carousel.owl-dots-overlap-right .owl-dots{right:16px}}.owl-carousel.owl-dots-overlap-right[data-owl-nav="true"]:not(.owl-nav-left,.owl-nav-overlay,.owl-nav-overlay-left,.owl-nav-overlay-right,.owl-nav-overlap,.owl-nav-overlap-left,.owl-nav-overlap-right) .owl-dots,.owl-carousel.owl-dots-overlap-right.owl-nav-right:not(.owl-nav-left,.owl-nav-overlay,.owl-nav-overlay-left,.owl-nav-overlay-right,.owl-nav-overlap,.owl-nav-overlap-left,.owl-nav-overlap-right) .owl-dots{right:76px}@media (max-width: 991.98px){.owl-carousel.owl-dots-overlap-right[data-owl-nav="true"]:not(.owl-nav-left,.owl-nav-overlay,.owl-nav-overlay-left,.owl-nav-overlay-right,.owl-nav-overlap,.owl-nav-overlap-left,.owl-nav-overlap-right) .owl-dots,.owl-carousel.owl-dots-overlap-right.owl-nav-right:not(.owl-nav-left,.owl-nav-overlay,.owl-nav-overlay-left,.owl-nav-overlay-right,.owl-nav-overlap,.owl-nav-overlap-left,.owl-nav-overlap-right) .owl-dots{right:64px}}.owl-carousel.owl-dots-overlap-right.owl-nav-overlap .owl-dots,.owl-carousel.owl-dots-overlap-right.owl-nav-overlap-right .owl-dots{right:45px}@media (max-width: 991.98px){.owl-carousel.owl-dots-overlap-right.owl-nav-overlap .owl-dots,.owl-carousel.owl-dots-overlap-right.owl-nav-overlap-right .owl-dots{right:36px}}.owl-carousel.owl-nav-overlap{padding:0 25px}.owl-carousel.owl-nav-overlap .owl-nav{right:25px;left:25px;z-index:1;height:50px}.owl-carousel.owl-nav-overlap .owl-nav button{opacity:0.9;background:#000;width:50px;height:50px;border-radius:50%;color:#fff}.owl-carousel.owl-nav-overlap .owl-nav button.owl-prev{right:auto;left:0;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.owl-carousel.owl-nav-overlap .owl-nav button.owl-next{right:0;left:auto;-webkit-transform:translateX(50%);transform:translateX(50%)}.owl-carousel.owl-nav-overlap .owl-nav button:hover{opacity:1;color:#fff}@media (min-width: 992px){.owl-carousel.owl-nav-overlap .owl-nav button.owl-prev:hover{-webkit-transform:translateX(-50%) scale(0.94);transform:translateX(-50%) scale(0.94)}.owl-carousel.owl-nav-overlap .owl-nav button.owl-next:hover{-webkit-transform:translateX(50%) scale(0.94);transform:translateX(50%) scale(0.94)}}.owl-carousel.owl-nav-overlap:not([data-owl-dots="false"],.owl-dots-overlay,.owl-dots-overlay-left,.owl-dots-overlay-right,.owl-dots-overlap,.owl-dots-overlap-left,.owl-dots-overlap-right) .owl-nav{margin-top:-20px}@media (max-width: 991.98px){.owl-carousel.owl-nav-overlap:not([data-owl-dots="false"],.owl-dots-overlay,.owl-dots-overlay-left,.owl-dots-overlay-right,.owl-dots-overlap,.owl-dots-overlap-left,.owl-dots-overlap-right) .owl-nav{margin-top:-18px}}@media (max-width: 991.98px){.owl-carousel.owl-nav-overlap{padding:0 20px}.owl-carousel.owl-nav-overlap .owl-nav{right:20px;left:20px;height:40px}.owl-carousel.owl-nav-overlap .owl-nav button.owl-prev,.owl-carousel.owl-nav-overlap .owl-nav button.owl-next{width:40px;height:40px}}@media (min-width: 992px){.owl-carousel.owl-nav-overlap-left{padding:0 0 0 25px}.owl-carousel.owl-nav-overlap-left .owl-nav{left:25px;right:auto;-webkit-transform:translateY(-50%) translateX(-50%);transform:translateY(-50%) translateX(-50%)}}.owl-carousel.owl-nav-overlap-right{padding:0 25px 0 0}.owl-carousel.owl-nav-overlap-right .owl-nav{left:auto;right:25px;-webkit-transform:translateY(-50%) translateX(50%);transform:translateY(-50%) translateX(50%)}.owl-carousel.owl-nav-overlap-left .owl-nav,.owl-carousel.owl-nav-overlap-right .owl-nav{z-index:1;width:50px;height:auto;padding-bottom:0}.owl-carousel.owl-nav-overlap-left .owl-nav button.owl-prev,.owl-carousel.owl-nav-overlap-left .owl-nav button.owl-next,.owl-carousel.owl-nav-overlap-right .owl-nav button.owl-prev,.owl-carousel.owl-nav-overlap-right .owl-nav button.owl-next{position:static;right:0;left:0;opacity:0.9;background:#000;width:50px;height:50px;margin:4px 0;border-radius:50%;color:#fff}.owl-carousel.owl-nav-overlap-left .owl-nav button.owl-prev:hover,.owl-carousel.owl-nav-overlap-left .owl-nav button.owl-next:hover,.owl-carousel.owl-nav-overlap-right .owl-nav button.owl-prev:hover,.owl-carousel.owl-nav-overlap-right .owl-nav button.owl-next:hover{opacity:1;color:#fff}@media (min-width: 992px){.owl-carousel.owl-nav-overlap-left .owl-nav button:hover,.owl-carousel.owl-nav-overlap-right .owl-nav button:hover{-webkit-transform:scale(0.94);transform:scale(0.94)}}.owl-carousel.owl-nav-overlap-left:not([data-owl-dots="false"],.owl-dots-overlay,.owl-dots-overlay-left,.owl-dots-overlay-right,.owl-dots-overlap,.owl-dots-overlap-left,.owl-dots-overlap-right) .owl-nav,.owl-carousel.owl-nav-overlap-right:not([data-owl-dots="false"],.owl-dots-overlay,.owl-dots-overlay-left,.owl-dots-overlay-right,.owl-dots-overlap,.owl-dots-overlap-left,.owl-dots-overlap-right) .owl-nav{margin-top:-20px}@media (max-width: 991.98px){.owl-carousel.owl-nav-overlap-left:not([data-owl-dots="false"],.owl-dots-overlay,.owl-dots-overlay-left,.owl-dots-overlay-right,.owl-dots-overlap,.owl-dots-overlap-left,.owl-dots-overlap-right) .owl-nav,.owl-carousel.owl-nav-overlap-right:not([data-owl-dots="false"],.owl-dots-overlay,.owl-dots-overlay-left,.owl-dots-overlay-right,.owl-dots-overlap,.owl-dots-overlap-left,.owl-dots-overlap-right) .owl-nav{margin-top:-18px}}@media (max-width: 991.98px){.owl-carousel.owl-nav-overlap-left,.owl-carousel.owl-nav-overlap-right{padding:0 20px 0 0}.owl-carousel.owl-nav-overlap-left .owl-nav,.owl-carousel.owl-nav-overlap-right .owl-nav{left:auto;right:20px;-webkit-transform:translateY(-50%) translateX(50%);transform:translateY(-50%) translateX(50%);width:40px}.owl-carousel.owl-nav-overlap-left .owl-nav button.owl-prev,.owl-carousel.owl-nav-overlap-left .owl-nav button.owl-next,.owl-carousel.owl-nav-overlap-right .owl-nav button.owl-prev,.owl-carousel.owl-nav-overlap-right .owl-nav button.owl-next{width:40px;height:40px}}.team-wrapper .team-box{text-align:center}.team-wrapper .team-box .team-img{position:relative;overflow:hidden;margin-bottom:20px}.team-wrapper .team-box .team-img img{-webkit-transform:scale(1);transform:scale(1);width:100%;-webkit-transition:transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);transition:transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1)}.team-wrapper .team-box .team-img div{position:absolute;top:0;left:0;opacity:0;background:rgba(0,0,0,0.4);width:100%;height:100%;text-align:center;-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}.team-wrapper .team-box .team-img div ul{list-style-type:none;position:absolute;top:50%;right:0;left:0;-webkit-transform:translateY(-50%) scale(0.96);transform:translateY(-50%) scale(0.96);margin:0 -7px;padding:0 30px;-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}.team-wrapper .team-box .team-img div ul li{display:inline-block;margin:0 7px}.team-wrapper .team-box .team-img div ul li a:not([class*=' button'],[class^='button']){color:#fff}.team-wrapper .team-box .team-img div ul li a:not([class*=' button'],[class^='button']):hover{color:rgba(255,255,255,0.7)}.team-wrapper .team-box .team-img:hover img{-webkit-transform:scale(1.04);transform:scale(1.04);-webkit-filter:blur(1.5px);filter:blur(1.5px)}.team-wrapper .team-box .team-img:hover div{opacity:1}.team-wrapper .team-box .team-img:hover div ul{-webkit-transform:translateY(-50%) scale(1);transform:translateY(-50%) scale(1)}.team-wrapper .team-box h1,.team-wrapper .team-box h2,.team-wrapper .team-box h3,.team-wrapper .team-box h4,.team-wrapper .team-box h5,.team-wrapper .team-box h6{margin-bottom:5px}.team-wrapper .team-box span{color:#aaa}.team-wrapper.team-box-hover-2 .team-box .team-img div{top:auto;bottom:16px;right:16px;left:16px;-webkit-transform:translateY(5px);transform:translateY(5px);background:#fff;width:auto;height:auto;padding:15px 20px}.team-wrapper.team-box-hover-2 .team-box .team-img div ul{position:static;top:auto;-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1);padding:0}.team-wrapper.team-box-hover-2 .team-box .team-img div ul li a:not([class*=' button'],[class^='button']){color:#7C7C7C}.team-wrapper.team-box-hover-2 .team-box .team-img div ul li a:not([class*=' button'],[class^='button']):hover,.team-wrapper.team-box-hover-2 .team-box .team-img div ul li a:not([class*=' button'],[class^='button']):focus{color:#131517}.team-wrapper.team-box-hover-2 .team-box .team-img:hover img{-webkit-filter:blur(0);filter:blur(0)}.team-wrapper.team-box-hover-2 .team-box .team-img:hover div{-webkit-transform:translateY(0);transform:translateY(0)}.team-wrapper.team-box-hover-2 .team-box .team-img:hover div ul{-webkit-transform:translateY(0) scale(1);transform:translateY(0) scale(1)}.text-left .team-box{text-align:left}.text-right .team-box{text-align:right}.testimonial-box{max-width:730px;margin:0 auto;text-align:center}.testimonial-box img{width:80px;height:80px;border-radius:50%;margin-right:auto;margin-left:auto}.testimonial-grid{overflow:hidden}@media (min-width: 992px){.testimonial-grid.column-2 .testimonial-grid-box{width:50%}}.testimonial-grid.column-1 .testimonial-grid-box{width:100%;padding:30px 0}.testimonial-grid .testimonial-grid-box{position:relative;float:left;width:33.3%;padding:30px}.testimonial-grid .testimonial-grid-box:before,.testimonial-grid .testimonial-grid-box:after{content:'';position:absolute}.testimonial-grid .testimonial-grid-box:before{top:0;left:-1px;height:100%;border-left:1px dashed rgba(0,0,0,0.1)}.testimonial-grid .testimonial-grid-box:after{left:0;bottom:-1px;width:100%;border-bottom:1px dashed rgba(0,0,0,0.1)}.testimonial-grid .testimonial-grid-box .testimonial-img{float:left;margin-right:20px}.testimonial-grid .testimonial-grid-box .testimonial-img img{width:80px;height:80px;border-radius:50%}.testimonial-grid .testimonial-grid-box .testimonial-content{overflow:hidden}@media (max-width: 991.98px){.testimonial-grid .testimonial-grid-box{width:50%}}@media (max-width: 767.98px){.testimonial-grid .testimonial-grid-box{width:100%;padding:30px 0}}.testimonial-grid.border-style-solid{border:0}.testimonial-grid.border-style-solid .testimonial-grid-box:before{border-left-style:solid}.testimonial-grid.border-style-solid .testimonial-grid-box:after{border-bottom-style:solid}.testimonial-grid.border-style-dotted{border:0}.testimonial-grid.border-style-dotted .testimonial-grid-box:before{border-left-style:dotted}.testimonial-grid.border-style-dotted .testimonial-grid-box:after{border-bottom-style:dotted}.testimonial-grid.border-0{margin:-15px}.testimonial-grid.border-0 .testimonial-grid-box{padding:15px}.testimonial-grid.border-0 .testimonial-grid-box:before,.testimonial-grid.border-0 .testimonial-grid-box:after{border:0}@media (max-width: 767.98px){.testimonial-grid.border-0{margin:-15px 0}.testimonial-grid.border-0 .testimonial-grid-box{padding:15px 0}}div[class^='bg-black'] .testimonial-grid-box:before,div[class^='bg-black'] .testimonial-grid-box:after,div[class*=' bg-black'] .testimonial-grid-box:before,div[class*=' bg-black'] .testimonial-grid-box:after,div[class^='bg-dark'] .testimonial-grid-box:before,div[class^='bg-dark'] .testimonial-grid-box:after,div[class*=' bg-dark'] .testimonial-grid-box:before,div[class*=' bg-dark'] .testimonial-grid-box:after{border-color:rgba(255,255,255,0.2)}*[class^='text-link-'],*[class*=' text-link-']{color:rgba(0,0,0,0.9)}*[class^='text-link-']:hover,*[class^='text-link-']:focus,*[class*=' text-link-']:hover,*[class*=' text-link-']:focus{color:rgba(0,0,0,0.9)}.text-link-1:hover{text-decoration:underline}.text-link-2:hover{text-decoration:line-through}.text-link-3:hover{text-decoration:overline}.text-link-4:hover{text-decoration:underline overline}.text-link-5,.text-link-6{position:relative}.text-link-5:before,.text-link-6:before{content:'';position:absolute;bottom:-2px;background:rgba(0,0,0,0.9);width:0;height:1px;-webkit-transition:all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1);transition:all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1)}.text-link-5:hover:before,.text-link-6:hover:before{width:100%}.text-link-5:before{left:0}.text-link-6:before{right:0}.text-link-7{position:relative}.text-link-7:before{content:'';position:absolute;bottom:-2px;left:0;-webkit-transform:translateY(3px);transform:translateY(3px);opacity:0;background:rgba(0,0,0,0.9);width:100%;height:1px;-webkit-transition:linear 0.1s;transition:linear 0.1s}.text-link-7:hover:before{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}.text-link-8,.text-link-9{position:relative}.text-link-8:before,.text-link-8:after,.text-link-9:before,.text-link-9:after{content:'';position:absolute;bottom:-2px;height:1px;-webkit-transition:all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1);transition:all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1)}.text-link-8:before,.text-link-9:before{left:0;background:rgba(0,0,0,0.2);width:100%}.text-link-8:after,.text-link-9:after{background:rgba(0,0,0,0.9);width:0}.text-link-8:hover:after,.text-link-9:hover:after{width:100%}.text-link-8:after{left:0}.text-link-9:after{right:0}.text-link-10{position:relative}.text-link-10:before,.text-link-10:after{content:'';position:absolute;bottom:-2px;left:0;width:100%;height:1px;-webkit-transition:linear 0.1s;transition:linear 0.1s}.text-link-10:before{background:rgba(0,0,0,0.2)}.text-link-10:after{opacity:0;-webkit-transform:translateY(3px);transform:translateY(3px);background:rgba(0,0,0,0.9)}.text-link-10:hover:before{opacity:0}.text-link-10:hover:after{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}.text-link-11{position:relative}.text-link-11:before{content:'';position:absolute;bottom:4px;left:0;background:rgba(0,0,0,0.2);width:0;height:6px;-webkit-transition:all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1);transition:all 0.24s cubic-bezier(0.165, 0.84, 0.44, 1)}.text-link-11:hover:before{width:100%}div[class^='bg-black'] *[class^='text-link-'],div[class^='bg-black'] *[class*=' text-link-'],div[class*=' bg-black'] *[class^='text-link-'],div[class*=' bg-black'] *[class*=' text-link-'],div[class^='bg-dark'] *[class^='text-link-'],div[class^='bg-dark'] *[class*=' text-link-'],div[class*=' bg-dark'] *[class^='text-link-'],div[class*=' bg-dark'] *[class*=' text-link-']{color:#fff}div[class^='bg-black'] *[class^='text-link-']:hover,div[class^='bg-black'] *[class^='text-link-']:focus,div[class^='bg-black'] *[class*=' text-link-']:hover,div[class^='bg-black'] *[class*=' text-link-']:focus,div[class*=' bg-black'] *[class^='text-link-']:hover,div[class*=' bg-black'] *[class^='text-link-']:focus,div[class*=' bg-black'] *[class*=' text-link-']:hover,div[class*=' bg-black'] *[class*=' text-link-']:focus,div[class^='bg-dark'] *[class^='text-link-']:hover,div[class^='bg-dark'] *[class^='text-link-']:focus,div[class^='bg-dark'] *[class*=' text-link-']:hover,div[class^='bg-dark'] *[class*=' text-link-']:focus,div[class*=' bg-dark'] *[class^='text-link-']:hover,div[class*=' bg-dark'] *[class^='text-link-']:focus,div[class*=' bg-dark'] *[class*=' text-link-']:hover,div[class*=' bg-dark'] *[class*=' text-link-']:focus{color:#fff}div[class^='bg-black'] .text-link-5:before,div[class^='bg-black'] .text-link-6:before,div[class^='bg-black'] .text-link-7:before,div[class*=' bg-black'] .text-link-5:before,div[class*=' bg-black'] .text-link-6:before,div[class*=' bg-black'] .text-link-7:before,div[class^='bg-dark'] .text-link-5:before,div[class^='bg-dark'] .text-link-6:before,div[class^='bg-dark'] .text-link-7:before,div[class*=' bg-dark'] .text-link-5:before,div[class*=' bg-dark'] .text-link-6:before,div[class*=' bg-dark'] .text-link-7:before{background:#fff}div[class^='bg-black'] .text-link-8:before,div[class^='bg-black'] .text-link-9:before,div[class^='bg-black'] .text-link-10:before,div[class*=' bg-black'] .text-link-8:before,div[class*=' bg-black'] .text-link-9:before,div[class*=' bg-black'] .text-link-10:before,div[class^='bg-dark'] .text-link-8:before,div[class^='bg-dark'] .text-link-9:before,div[class^='bg-dark'] .text-link-10:before,div[class*=' bg-dark'] .text-link-8:before,div[class*=' bg-dark'] .text-link-9:before,div[class*=' bg-dark'] .text-link-10:before{background:rgba(255,255,255,0.3)}div[class^='bg-black'] .text-link-8:after,div[class^='bg-black'] .text-link-9:after,div[class^='bg-black'] .text-link-10:after,div[class*=' bg-black'] .text-link-8:after,div[class*=' bg-black'] .text-link-9:after,div[class*=' bg-black'] .text-link-10:after,div[class^='bg-dark'] .text-link-8:after,div[class^='bg-dark'] .text-link-9:after,div[class^='bg-dark'] .text-link-10:after,div[class*=' bg-dark'] .text-link-8:after,div[class*=' bg-dark'] .text-link-9:after,div[class*=' bg-dark'] .text-link-10:after{background:#fff}div[class^='bg-black'] .text-link-11:before,div[class*=' bg-black'] .text-link-11:before,div[class^='bg-dark'] .text-link-11:before,div[class*=' bg-dark'] .text-link-11:before{background:rgba(255,255,255,0.3)}.timeline-wrapper{position:relative}.timeline-wrapper:before{content:'';position:absolute;top:0;background:#e3e6e9;width:1px;height:100%}.timeline-wrapper .timeline .timeline-date{position:relative}.timeline-wrapper .timeline .timeline-date:before{content:'';position:absolute;top:31px;background:#e3e6e9;width:20px;height:20px;border-radius:50%}.timeline-wrapper .timeline .timeline-date:after{content:'';position:absolute;top:37px;background:#131517;width:8px;height:8px;border-radius:50%}@media (min-width: 992px){.timeline-wrapper{position:relative}.timeline-wrapper:before{left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.timeline-wrapper .timeline{position:relative}.timeline-wrapper .timeline .timeline-date,.timeline-wrapper .timeline .timeline-content{width:50%;padding:30px}.timeline-wrapper .timeline .timeline-date{position:absolute;top:0;left:0;text-align:right}.timeline-wrapper .timeline .timeline-date:before{right:-10px}.timeline-wrapper .timeline .timeline-date:after{right:-4px}.timeline-wrapper .timeline .timeline-date h1,.timeline-wrapper .timeline .timeline-date h2,.timeline-wrapper .timeline .timeline-date h3,.timeline-wrapper .timeline .timeline-date h4,.timeline-wrapper .timeline .timeline-date h5,.timeline-wrapper .timeline .timeline-date h6{position:relative;text-align:right}.timeline-wrapper .timeline .timeline-content{margin-left:50%}.timeline-wrapper .timeline:nth-child(even) .timeline-date{left:50%;text-align:left}.timeline-wrapper .timeline:nth-child(even) .timeline-date:before{right:auto;left:-10px}.timeline-wrapper .timeline:nth-child(even) .timeline-date:after{right:auto;left:-4px}.timeline-wrapper .timeline:nth-child(even) .timeline-date h1,.timeline-wrapper .timeline:nth-child(even) .timeline-date h2,.timeline-wrapper .timeline:nth-child(even) .timeline-date h3,.timeline-wrapper .timeline:nth-child(even) .timeline-date h4,.timeline-wrapper .timeline:nth-child(even) .timeline-date h5,.timeline-wrapper .timeline:nth-child(even) .timeline-date h6{text-align:left}.timeline-wrapper .timeline:nth-child(even) .timeline-content{margin-left:0;text-align:right}.timeline-wrapper.timeline-left:before{left:200px;-webkit-transform:translateX(0);transform:translateX(0)}.timeline-wrapper.timeline-left .timeline .timeline-date{width:200px;padding:30px 30px 0 0}.timeline-wrapper.timeline-left .timeline .timeline-content{width:auto;margin:0 0 0 200px;padding:30px 0 0 30px;text-align:left}.timeline-wrapper.timeline-left .timeline:nth-child(even) .timeline-date{left:auto;text-align:right}.timeline-wrapper.timeline-left .timeline:nth-child(even) .timeline-date:before{right:-10px;left:auto}.timeline-wrapper.timeline-left .timeline:nth-child(even) .timeline-date:after{right:-4px;left:auto}.timeline-wrapper.timeline-left .timeline:nth-child(even) .timeline-date h1,.timeline-wrapper.timeline-left .timeline:nth-child(even) .timeline-date h2,.timeline-wrapper.timeline-left .timeline:nth-child(even) .timeline-date h3,.timeline-wrapper.timeline-left .timeline:nth-child(even) .timeline-date h4,.timeline-wrapper.timeline-left .timeline:nth-child(even) .timeline-date h5,.timeline-wrapper.timeline-left .timeline:nth-child(even) .timeline-date h6{text-align:right}.timeline-wrapper.timeline-left .timeline:last-child .timeline-date,.timeline-wrapper.timeline-left .timeline:last-child .timeline-content{padding-bottom:30px}.timeline-wrapper.timeline-right:before{right:200px;left:auto;-webkit-transform:translateX(0);transform:translateX(0)}.timeline-wrapper.timeline-right .timeline .timeline-date{right:0;left:auto;width:200px;padding:30px 0 0 30px;text-align:left}.timeline-wrapper.timeline-right .timeline .timeline-date:before{right:auto;left:-10px}.timeline-wrapper.timeline-right .timeline .timeline-date:after{right:auto;left:-4px}.timeline-wrapper.timeline-right .timeline .timeline-date h1,.timeline-wrapper.timeline-right .timeline .timeline-date h2,.timeline-wrapper.timeline-right .timeline .timeline-date h3,.timeline-wrapper.timeline-right .timeline .timeline-date h4,.timeline-wrapper.timeline-right .timeline .timeline-date h5,.timeline-wrapper.timeline-right .timeline .timeline-date h6{text-align:left}.timeline-wrapper.timeline-right .timeline .timeline-content{width:auto;margin:0 200px 0 0;padding:30px 30px 0 0;text-align:right}.timeline-wrapper.timeline-right .timeline:nth-child(even) .timeline-date{left:auto;text-align:left}.timeline-wrapper.timeline-right .timeline:nth-child(even) .timeline-date:before{left:-10px}.timeline-wrapper.timeline-right .timeline:nth-child(even) .timeline-date:after{left:-4px}.timeline-wrapper.timeline-right .timeline:nth-child(even) .timeline-date h1,.timeline-wrapper.timeline-right .timeline:nth-child(even) .timeline-date h2,.timeline-wrapper.timeline-right .timeline:nth-child(even) .timeline-date h3,.timeline-wrapper.timeline-right .timeline:nth-child(even) .timeline-date h4,.timeline-wrapper.timeline-right .timeline:nth-child(even) .timeline-date h5,.timeline-wrapper.timeline-right .timeline:nth-child(even) .timeline-date h6{text-align:left}.timeline-wrapper.timeline-right .timeline:last-child .timeline-date,.timeline-wrapper.timeline-right .timeline:last-child .timeline-content{padding-bottom:30px}}@media (max-width: 991.98px){.timeline-wrapper{padding-left:30px}.timeline-wrapper:before{left:0}.timeline-wrapper .timeline{margin-bottom:30px}.timeline-wrapper .timeline:first-child{padding-top:30px}.timeline-wrapper .timeline:last-child{margin-bottom:0;padding-bottom:30px}.timeline-wrapper .timeline .timeline-date:before{top:1px;left:-40px}.timeline-wrapper .timeline .timeline-date:after{top:7px;left:-34px}}@media (max-width: 575.98px){.timeline-wrapper{padding-left:20px}.timeline-wrapper .timeline .timeline-date:before{left:-30px}.timeline-wrapper .timeline .timeline-date:after{left:-24px}}div[class^='bg-black'] .timeline-wrapper:before,div[class*=' bg-black'] .timeline-wrapper:before,div[class^='bg-dark'] .timeline-wrapper:before,div[class*=' bg-dark'] .timeline-wrapper:before{background:rgba(255,255,255,0.2)}div[class^='bg-black'] .timeline-wrapper .timeline .timeline-date:before,div[class*=' bg-black'] .timeline-wrapper .timeline .timeline-date:before,div[class^='bg-dark'] .timeline-wrapper .timeline .timeline-date:before,div[class*=' bg-dark'] .timeline-wrapper .timeline .timeline-date:before{background:rgba(255,255,255,0.2)}div[class^='bg-black'] .timeline-wrapper .timeline .timeline-date:after,div[class*=' bg-black'] .timeline-wrapper .timeline .timeline-date:after,div[class^='bg-dark'] .timeline-wrapper .timeline .timeline-date:after,div[class*=' bg-dark'] .timeline-wrapper .timeline .timeline-date:after{background:#fff}@media (max-width: 991.98px){.sidebar-wrapper{display:none}}.sidebar-box{border:1px solid #e3e6e9;margin-bottom:20px;padding:30px}.sidebar-box:last-child{margin-bottom:0}.sidebar-box h1,.sidebar-box h2,.sidebar-box h3,.sidebar-box h4,.sidebar-box h5,.sidebar-box h6{margin-bottom:30px;text-align:center}.sidebar-box .list-category{list-style-type:none;padding:0}.sidebar-box .list-category li{margin:0;padding:7px 0;border-bottom:1px solid #e3e6e9}.sidebar-box .list-category li:first-child{padding-top:0}.sidebar-box .list-category li:last-child{padding-bottom:0;border:0}.sidebar-box .list-category li a{display:block}.sidebar-box .list-category li a span{float:right;font-size:14px}.sidebar-box .popular-post{position:relative;margin-bottom:15px}.sidebar-box .popular-post:last-child{margin-bottom:0}.sidebar-box .popular-post img{float:left;width:80px}.sidebar-box .popular-post div{padding-left:100px}.sidebar-box .popular-post div h1,.sidebar-box .popular-post div h2,.sidebar-box .popular-post div h3,.sidebar-box .popular-post div h4,.sidebar-box .popular-post div h5,.sidebar-box .popular-post div h6{margin-bottom:0;text-align:left}.sidebar-box .popular-post div a{-webkit-transition:linear 0.1s;transition:linear 0.1s}.sidebar-box .popular-post div span{font-size:14px}.sidebar-box .popular-post:after{content:'';display:block;clear:both}.sidebar-box .tags{padding:0}.sidebar-box .tags li{display:inline-block;margin:0 3px 6px 0}.sidebar-box .tags li a{display:inline-block;background:#eff2f5;padding:5px 10px;font-size:14px}.sidebar-box .tags li a:hover,.sidebar-box .tags li a:focus{background:#e5e8eb;color:#131517}div[class^='bg-black'] .sidebar-box,div[class*=' bg-black'] .sidebar-box,div[class^='bg-dark'] .sidebar-box,div[class*=' bg-dark'] .sidebar-box{border-color:rgba(255,255,255,0.2)}div[class^='bg-black'] .sidebar-box .list-category li,div[class*=' bg-black'] .sidebar-box .list-category li,div[class^='bg-dark'] .sidebar-box .list-category li,div[class*=' bg-dark'] .sidebar-box .list-category li{border-color:rgba(255,255,255,0.2)}div[class^='bg-black'] .sidebar-box .tags li a,div[class*=' bg-black'] .sidebar-box .tags li a,div[class^='bg-dark'] .sidebar-box .tags li a,div[class*=' bg-dark'] .sidebar-box .tags li a{background:rgba(0,0,0,0.8);color:rgba(255,255,255,0.7)}div[class^='bg-black'] .sidebar-box .tags li a:hover,div[class^='bg-black'] .sidebar-box .tags li a:focus,div[class*=' bg-black'] .sidebar-box .tags li a:hover,div[class*=' bg-black'] .sidebar-box .tags li a:focus,div[class^='bg-dark'] .sidebar-box .tags li a:hover,div[class^='bg-dark'] .sidebar-box .tags li a:focus,div[class*=' bg-dark'] .sidebar-box .tags li a:hover,div[class*=' bg-dark'] .sidebar-box .tags li a:focus{background:rgba(0,0,0,0.9);color:#fff}.comment-box{position:relative;margin-bottom:30px;padding-left:80px}.comment-box .comment-user-avatar{position:absolute;top:0;left:0;background:#eff2f5;width:60px;height:60px;border-radius:50%;text-align:center;line-height:60px}.comment-box .comment-user-avatar img{width:60px;height:60px}.comment-box .comment-content{position:relative}.comment-box .comment-content .comment-time{position:absolute;top:0;right:0;text-align:right;color:#aaa;font-style:italic;font-size:14px}#cookie-consent{position:fixed;right:0;bottom:0;left:0;z-index:997;visibility:visible;opacity:1;-webkit-transition:ease-out 0.2s;transition:ease-out 0.2s}#cookie-consent.consent-hidden{visibility:hidden;opacity:0}.fm-toggle{margin-left:auto;cursor:pointer;-webkit-transition:ease-out 0.2s;transition:ease-out 0.2s}.fm-toggle .lines{position:relative;display:inline-block;background:#000;width:25px;height:2px;margin:0;padding:0;vertical-align:middle;-webkit-transition:linear 0.12s;transition:linear 0.12s}.fm-toggle .lines:before,.fm-toggle .lines:after{content:'';position:absolute;left:0;background:#000;width:25px;height:2px;display:inline-block;-webkit-transition:linear 0.12s;transition:linear 0.12s}.fm-toggle .lines:before{top:-7px}.fm-toggle .lines:after{bottom:-7px}@media (min-width: 992px){.fm-toggle .lines:before{-webkit-transform:scaleX(0.8);transform:scaleX(0.8);-webkit-transform-origin:100% 50%;transform-origin:100% 50%}.fm-toggle .lines:after{-webkit-transform:scaleX(0.6);transform:scaleX(0.6);-webkit-transform-origin:100% 50%;transform-origin:100% 50%}.fm-toggle:hover .lines:before{-webkit-transform:scaleX(1);transform:scaleX(1)}.fm-toggle:hover .lines:after{-webkit-transform:scaleX(1);transform:scaleX(1)}}.header.dark .fm-toggle .lines,.header.dark .fm-toggle .lines:before,.header.dark .fm-toggle .lines:after,.header.black .fm-toggle .lines,.header.black .fm-toggle .lines:before,.header.black .fm-toggle .lines:after,.header.absolute-light .fm-toggle .lines,.header.absolute-light .fm-toggle .lines:before,.header.absolute-light .fm-toggle .lines:after{background:#fff}.fullscreen-menu{position:fixed;top:0;left:0;z-index:996;visibility:hidden;opacity:0;width:100%;height:100%;-webkit-transition:ease-out 0.2s;transition:ease-out 0.2s}.fullscreen-menu .fm-wrapper{-webkit-transform:scale(0.98);transform:scale(0.98);height:100%;-webkit-transition:ease-out 0.2s;transition:ease-out 0.2s}.fullscreen-menu .fm-wrapper .position-top,.fullscreen-menu .fm-wrapper .position-middle,.fullscreen-menu .fm-wrapper .position-bottom{padding:0 30px}@media (min-width: 768px){.fullscreen-menu .fm-wrapper .position-top,.fullscreen-menu .fm-wrapper .position-middle,.fullscreen-menu .fm-wrapper .position-bottom{padding:0 50px}.fullscreen-menu .fm-wrapper .position-top{top:50px}.fullscreen-menu .fm-wrapper .position-bottom{bottom:50px}}.fullscreen-menu .fm-wrapper .fm-close{position:absolute;top:50px;right:50px;cursor:pointer}.fullscreen-menu .fm-wrapper .fm-close span{position:relative;display:inline-block;opacity:0.8;width:60px;height:60px;border-radius:50%;-webkit-transition:ease-out 0.18s;transition:ease-out 0.18s}.fullscreen-menu .fm-wrapper .fm-close span:before,.fullscreen-menu .fm-wrapper .fm-close span:after{content:'';position:absolute;top:50%;left:50%;width:14px;height:2px;border-radius:2px;-webkit-transition:ease-out 0.18s;transition:ease-out 0.18s}.fullscreen-menu .fm-wrapper .fm-close span:before{-webkit-transform:translate(-50%, -50%) rotate(45deg);transform:translate(-50%, -50%) rotate(45deg)}.fullscreen-menu .fm-wrapper .fm-close span:after{-webkit-transform:translate(-50%, -50%) rotate(-45deg);transform:translate(-50%, -50%) rotate(-45deg)}.fullscreen-menu .fm-wrapper .fm-close:hover span{opacity:1}.fullscreen-menu .fm-wrapper .fm-close:hover span:before{-webkit-transform:translate(-50%, -50%) rotate(180deg);transform:translate(-50%, -50%) rotate(180deg)}.fullscreen-menu .fm-wrapper .fm-close:hover span:after{-webkit-transform:translate(-50%, -50%) rotate(180deg);transform:translate(-50%, -50%) rotate(180deg)}@media (max-width: 991.98px){.fullscreen-menu .fm-wrapper .fm-close{top:30px;right:30px}}@media (max-width: 767.98px){.fullscreen-menu .fm-wrapper .fm-close{top:20px;right:20px}.fullscreen-menu .fm-wrapper .fm-close span{width:50px;height:50px}}.fullscreen-menu.fm-show{visibility:visible;opacity:1}.fullscreen-menu.fm-show .fm-wrapper{-webkit-transform:scale(1);transform:scale(1)}div.fullscreen-menu[class^='bg-black'] .fm-wrapper .fm-close span,div.fullscreen-menu[class*=' bg-black'] .fm-wrapper .fm-close span,div.fullscreen-menu[class^='bg-dark'] .fm-wrapper .fm-close span,div.fullscreen-menu[class*=' bg-dark'] .fm-wrapper .fm-close span{background:rgba(255,255,255,0.1)}div.fullscreen-menu[class^='bg-black'] .fm-wrapper .fm-close span:before,div.fullscreen-menu[class^='bg-black'] .fm-wrapper .fm-close span:after,div.fullscreen-menu[class*=' bg-black'] .fm-wrapper .fm-close span:before,div.fullscreen-menu[class*=' bg-black'] .fm-wrapper .fm-close span:after,div.fullscreen-menu[class^='bg-dark'] .fm-wrapper .fm-close span:before,div.fullscreen-menu[class^='bg-dark'] .fm-wrapper .fm-close span:after,div.fullscreen-menu[class*=' bg-dark'] .fm-wrapper .fm-close span:before,div.fullscreen-menu[class*=' bg-dark'] .fm-wrapper .fm-close span:after{background:#fff}.bg-grey.fullscreen-menu .fm-wrapper .fm-close span,.bg-grey-lighter.fullscreen-menu .fm-wrapper .fm-close span,.bg-grey-lightest.fullscreen-menu .fm-wrapper .fm-close span,div.fullscreen-menu[class^='bg-white'] .fm-wrapper .fm-close span,div.fullscreen-menu[class*=' bg-white'] .fm-wrapper .fm-close span{background:rgba(0,0,0,0.1)}.bg-grey.fullscreen-menu .fm-wrapper .fm-close span:before,.bg-grey.fullscreen-menu .fm-wrapper .fm-close span:after,.bg-grey-lighter.fullscreen-menu .fm-wrapper .fm-close span:before,.bg-grey-lighter.fullscreen-menu .fm-wrapper .fm-close span:after,.bg-grey-lightest.fullscreen-menu .fm-wrapper .fm-close span:before,.bg-grey-lightest.fullscreen-menu .fm-wrapper .fm-close span:after,div.fullscreen-menu[class^='bg-white'] .fm-wrapper .fm-close span:before,div.fullscreen-menu[class^='bg-white'] .fm-wrapper .fm-close span:after,div.fullscreen-menu[class*=' bg-white'] .fm-wrapper .fm-close span:before,div.fullscreen-menu[class*=' bg-white'] .fm-wrapper .fm-close span:after{background:#000}.gallery-wrapper{margin:0}.gallery-wrapper div[class^="col-"],.gallery-wrapper div[class*=" col-"]{margin:0}.gallery-wrapper .gallery-box .gallery-img{position:relative;overflow:hidden}.gallery-wrapper .gallery-box .gallery-img a{display:block}.gallery-wrapper .gallery-box .gallery-img a:before{content:'';position:absolute;top:0;left:0;z-index:1;opacity:0;background:rgba(255,255,255,0.1);width:100%;height:100%;-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}.gallery-wrapper .gallery-box .gallery-img a img{-webkit-transform:scale(1);transform:scale(1);width:100%;-webkit-transition:transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);transition:transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1)}.gallery-wrapper .gallery-box .gallery-img a:hover:before{opacity:1}.gallery-wrapper .gallery-box .gallery-img a:hover img{-webkit-transform:scale(1.04);transform:scale(1.04)}.gallery-wrapper .gallery-box .gallery-img a .gallery-title{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);z-index:2;background:#fff;padding:10px 20px}.gallery-wrapper .gallery-box .gallery-img a .gallery-title h1,.gallery-wrapper .gallery-box .gallery-img a .gallery-title h2,.gallery-wrapper .gallery-box .gallery-img a .gallery-title h3,.gallery-wrapper .gallery-box .gallery-img a .gallery-title h4,.gallery-wrapper .gallery-box .gallery-img a .gallery-title h5,.gallery-wrapper .gallery-box .gallery-img a .gallery-title h6{display:inline-block;margin:0}.gallery-wrapper.spacing-0 div[class^="col-"]:not(.row),.gallery-wrapper.no-spacing div[class^="col-"]:not(.row){margin-bottom:0;padding:0}.gallery-wrapper.spacing-6 div[class^="col-"]:not(.row){margin-bottom:6px;padding:0 3px}.gallery-wrapper.spacing-10 div[class^="col-"]:not(.row){margin-bottom:10px;padding:0 5px}.gallery-wrapper.spacing-20 div[class^="col-"]:not(.row){margin-bottom:20px;padding:0 10px}.gallery-wrapper.spacing-30 div[class^="col-"]:not(.row){margin-bottom:30px;padding:0 15px}.gallery-wrapper.hover-style-2 .gallery-box .gallery-img a:before{background:rgba(0,0,0,0.1)}.gallery-wrapper[class*=' border-radius'] .gallery-box .gallery-img,.gallery-wrapper[class^='border-radius'] .gallery-box .gallery-img{-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);overflow:hidden}.gallery-wrapper.border-radius-025 .gallery-box .gallery-img{border-radius:0.25em}.gallery-wrapper.border-radius-0375 .gallery-box .gallery-img{border-radius:0.375em}.gallery-wrapper.border-radius-05 .gallery-box .gallery-img{border-radius:0.5em}.gallery-wrapper.border-radius-10 .gallery-box .gallery-img{border-radius:1.0em}.gallery-wrapper.border-radius-15 .gallery-box .gallery-img{border-radius:1.5em}.gallery-wrapper.border-radius-20 .gallery-box .gallery-img{border-radius:2.0em}.gallery-wrapper.border-radius-25 .gallery-box .gallery-img{border-radius:2.5em}.gallery-wrapper.border-radius-30 .gallery-box .gallery-img{border-radius:3.0em}.container .gallery-wrapper.spacing-0,.container .gallery-wrapper.no-spacing{margin:0}.container .gallery-wrapper.spacing-6{margin:0 -3px -6px}.container .gallery-wrapper.spacing-10{margin:0 -5px -10px}.container .gallery-wrapper.spacing-20{margin:0 -10px -20px}.container .gallery-wrapper.spacing-30{margin:0 -15px -30px}.container-fluid .gallery-wrapper.spacing-0,.container-fluid .gallery-wrapper.no-spacing{margin:0 -30px}.container-fluid .gallery-wrapper.spacing-6{margin:0 -27px}.container-fluid .gallery-wrapper.spacing-10{margin:0 -25px}.container-fluid .gallery-wrapper.spacing-20{margin:0 -20px}.container-fluid .gallery-wrapper.spacing-30{margin:0 -15px}.header{top:0;z-index:993;overflow:visible;background:#fff;width:100%;height:80px;-webkit-transition:ease-in-out 0.2s;transition:ease-in-out 0.2s}.header.hide{-webkit-transform:translateY(-100%);transform:translateY(-100%)}.header .container,.header .container-fluid{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;align-items:center;height:100%}.header .header-logo{display:inline-block}.header .header-logo .logo-light{display:none}.header .header-logo *{-webkit-transition:linear 0.1s;transition:linear 0.1s}.header .header-logo h1,.header .header-logo h2,.header .header-logo h3,.header .header-logo h4,.header .header-logo h5,.header .header-logo h6{margin:0}.header .header-logo img{width:auto;height:54px;max-height:54px}.header .header-logo a{color:#131517}.header .header-logo a:hover{color:#131517}.header .header-toggle{position:relative;display:inline-block;width:28px;height:28px;margin-left:auto;cursor:pointer}.header .header-toggle span{position:absolute;top:50%;left:0;-webkit-transform:translateY(-50%);transform:translateY(-50%);background:#131517;width:100%;height:2px;border-radius:2px;-webkit-transition:linear 0.1s;transition:linear 0.1s}.header .header-toggle span:before,.header .header-toggle span:after{content:'';position:absolute;left:0;background:#131517;width:100%;height:2px;border-radius:2px;-webkit-transition:linear 0.1s;transition:linear 0.1s}.header .header-toggle span:before{top:-7px}.header .header-toggle span:after{bottom:-7px}.header .header-toggle.toggle-close span{background:transparent}.header .header-toggle.toggle-close span:before{top:0;bottom:0;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.header .header-toggle.toggle-close span:after{top:0;bottom:0;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.header .header-menu{display:inline-block;font-size:14px;z-index:995}.header .header-menu .nav{display:block;margin:0;padding:0;list-style-type:none;margin:0;padding:0}.header .header-menu .nav ul{list-style-type:none;margin:0;padding:0}.header .header-menu .nav .nav-item{text-align:left}.header .header-menu .nav .nav-item .nav-link{padding:0;font-family:"Poppins",sans-serif;letter-spacing:-0.2px;color:#131517}.header .header-menu .nav .nav-item .nav-link:hover,.header .header-menu .nav .nav-item .nav-link.active{color:#131517}.header .header-menu .nav .nav-item .nav-dropdown-toggle{position:relative;display:inline-block}.header .header-menu .nav .nav-item .nav-dropdown-toggle:after{content:'\f107';font-family:"Font Awesome 5 Free";font-weight:900;font-size:12px}.header .header-menu .nav .nav-item .nav-dropdown{background:#fff}.header .header-menu .nav .nav-item .nav-dropdown h1,.header .header-menu .nav .nav-item .nav-dropdown h2,.header .header-menu .nav .nav-item .nav-dropdown h3,.header .header-menu .nav .nav-item .nav-dropdown h4,.header .header-menu .nav .nav-item .nav-dropdown h5,.header .header-menu .nav .nav-item .nav-dropdown h6{color:#131517}.header .header-menu .nav .nav-item .nav-dropdown a:not(.button,.button-circle){color:#7C7C7C}.header .header-menu .nav .nav-item .nav-dropdown a:not(.button,.button-circle):hover,.header .header-menu .nav .nav-item .nav-dropdown a:not(.button,.button-circle):focus{color:#131517}.header .header-menu .nav .nav-item .nav-dropdown .nav-dropdown-item .nav-subdropdown-toggle{position:absolute}.header .header-menu .nav .nav-item .nav-dropdown .nav-dropdown-item .nav-subdropdown-toggle:after{content:'\f105';font-family:"Font Awesome 5 Free";font-weight:900;font-size:12px}.header .header-menu.font-2 .nav .nav-item .nav-link{font-size:13px;font-weight:500;letter-spacing:1px;text-transform:uppercase}.header .header-menu-extra a:not(.button,.button-circle){color:#131517}.header .header-menu-extra a:not(.button,.button-circle):hover,.header .header-menu-extra a:not(.button,.button-circle):focus{color:#131517}.header.sticky-autohide,.header.sticky{position:fixed;top:0;left:0;-webkit-box-shadow:0 0 36px 0 rgba(22,25,28,0.17);box-shadow:0 0 36px 0 rgba(22,25,28,0.17)}.header.absolute-dark,.header.absolute-light,.header.absolute-dark.dark,.header.absolute-light.dark,.header.absolute-dark.black,.header.absolute-light.black{background:transparent;-webkit-box-shadow:none;box-shadow:none}.header.absolute-dark:not(.sticky-autohide,.sticky),.header.absolute-light:not(.sticky-autohide,.sticky),.header.absolute-dark.dark:not(.sticky-autohide,.sticky),.header.absolute-light.dark:not(.sticky-autohide,.sticky),.header.absolute-dark.black:not(.sticky-autohide,.sticky),.header.absolute-light.black:not(.sticky-autohide,.sticky){position:absolute;top:0;left:0}.header.dark.border-top,.header.dark.border-bottom,.header.black.border-top,.header.black.border-bottom,.header.absolute-light.border-top,.header.absolute-light.border-bottom{border-color:rgba(255,255,255,0.1)}.header.absolute-light .header-logo .logo-dark{display:none}.header.absolute-light .header-logo .logo-light{display:inline-block}.header.absolute-light .header-logo h1,.header.absolute-light .header-logo h2,.header.absolute-light .header-logo h3,.header.absolute-light .header-logo h4,.header.absolute-light .header-logo h5,.header.absolute-light .header-logo h6{color:#fff}.header.absolute-light .header-logo a{color:#fff}.header.absolute-light .header-logo a:hover{color:#fff}.header.absolute-light .header-toggle span{background:#fff}.header.absolute-light .header-toggle span:before,.header.absolute-light .header-toggle span:after{background:#fff}.header.absolute-light .header-toggle.toggle-close span{background:transparent}@media (min-width: 992px){.header.absolute-light .header-menu .nav .nav-item .nav-link,.header.absolute-light .header-menu .nav .nav-item .nav-dropdown-toggle{color:#fff}.header.absolute-light .header-menu .nav .nav-item .nav-link:hover,.header.absolute-light .header-menu .nav .nav-item .nav-link:focus,.header.absolute-light .header-menu .nav .nav-item .nav-link.active,.header.absolute-light .header-menu .nav .nav-item .nav-dropdown-toggle:hover,.header.absolute-light .header-menu .nav .nav-item .nav-dropdown-toggle:focus,.header.absolute-light .header-menu .nav .nav-item .nav-dropdown-toggle.active{color:#fff}.header.absolute-light .header-menu .nav .nav-item .nav-link:before{background:rgba(255,255,255,0.15)}}.header.absolute-light .header-menu-extra a:not(.button,.button-circle){color:#fff}.header.absolute-light .header-menu-extra a:not(.button,.button-circle):hover,.header.absolute-light .header-menu-extra a:not(.button,.button-circle):focus{color:#fff}.header.dark:not(.absolute-dark) .header-logo .logo-dark,.header.black:not(.absolute-dark) .header-logo .logo-dark{display:none}.header.dark:not(.absolute-dark) .header-logo .logo-light,.header.black:not(.absolute-dark) .header-logo .logo-light{display:inline-block}.header.dark:not(.absolute-dark) .header-logo h1,.header.dark:not(.absolute-dark) .header-logo h2,.header.dark:not(.absolute-dark) .header-logo h3,.header.dark:not(.absolute-dark) .header-logo h4,.header.dark:not(.absolute-dark) .header-logo h5,.header.dark:not(.absolute-dark) .header-logo h6,.header.black:not(.absolute-dark) .header-logo h1,.header.black:not(.absolute-dark) .header-logo h2,.header.black:not(.absolute-dark) .header-logo h3,.header.black:not(.absolute-dark) .header-logo h4,.header.black:not(.absolute-dark) .header-logo h5,.header.black:not(.absolute-dark) .header-logo h6{color:#fff}.header.dark:not(.absolute-dark) .header-logo a,.header.black:not(.absolute-dark) .header-logo a{color:#fff}.header.dark:not(.absolute-dark) .header-logo a:hover,.header.black:not(.absolute-dark) .header-logo a:hover{color:#fff}@media (min-width: 992px){.header.dark:not(.absolute-dark) .header-menu .nav .nav-item .nav-link,.header.dark:not(.absolute-dark) .header-menu .nav .nav-item .nav-dropdown-toggle,.header.black:not(.absolute-dark) .header-menu .nav .nav-item .nav-link,.header.black:not(.absolute-dark) .header-menu .nav .nav-item .nav-dropdown-toggle{color:#fff}.header.dark:not(.absolute-dark) .header-menu .nav .nav-item .nav-link:hover,.header.dark:not(.absolute-dark) .header-menu .nav .nav-item .nav-link:focus,.header.dark:not(.absolute-dark) .header-menu .nav .nav-item .nav-link.active,.header.dark:not(.absolute-dark) .header-menu .nav .nav-item .nav-dropdown-toggle:hover,.header.dark:not(.absolute-dark) .header-menu .nav .nav-item .nav-dropdown-toggle:focus,.header.dark:not(.absolute-dark) .header-menu .nav .nav-item .nav-dropdown-toggle.active,.header.black:not(.absolute-dark) .header-menu .nav .nav-item .nav-link:hover,.header.black:not(.absolute-dark) .header-menu .nav .nav-item .nav-link:focus,.header.black:not(.absolute-dark) .header-menu .nav .nav-item .nav-link.active,.header.black:not(.absolute-dark) .header-menu .nav .nav-item .nav-dropdown-toggle:hover,.header.black:not(.absolute-dark) .header-menu .nav .nav-item .nav-dropdown-toggle:focus,.header.black:not(.absolute-dark) .header-menu .nav .nav-item .nav-dropdown-toggle.active{color:#fff}.header.dark:not(.absolute-dark) .header-menu .nav .nav-item .nav-link:before,.header.black:not(.absolute-dark) .header-menu .nav .nav-item .nav-link:before{background:rgba(255,255,255,0.15)}}.header.dark:not(.absolute-dark) .header-menu-extra a:not(.button,.button-circle),.header.black:not(.absolute-dark) .header-menu-extra a:not(.button,.button-circle){color:#fff}.header.dark:not(.absolute-dark) .header-menu-extra a:not(.button,.button-circle):hover,.header.dark:not(.absolute-dark) .header-menu-extra a:not(.button,.button-circle):focus,.header.black:not(.absolute-dark) .header-menu-extra a:not(.button,.button-circle):hover,.header.black:not(.absolute-dark) .header-menu-extra a:not(.button,.button-circle):focus{color:#fff}.header.dark:not(.absolute-dark) .header-toggle span,.header.black:not(.absolute-dark) .header-toggle span{background:#fff}.header.dark:not(.absolute-dark) .header-toggle span:before,.header.dark:not(.absolute-dark) .header-toggle span:after,.header.black:not(.absolute-dark) .header-toggle span:before,.header.black:not(.absolute-dark) .header-toggle span:after{background:#fff}.header.dark:not(.absolute-dark) .header-toggle.toggle-close span,.header.black:not(.absolute-dark) .header-toggle.toggle-close span{background:transparent}.header.dark{background:#131517}.header.black{background:#000}@media (min-width: 992px){.header .header-menu{height:80px}.header.header-lg .header-logo img{height:64px;max-height:64px}.header.header-lg .header-menu{height:90px}.header.header-xl .header-logo img{height:74px;max-height:74px}.header.header-xl .header-menu{height:100px}.header:not(.left,.center) .header-menu{margin-left:auto}.header.left .header-logo{margin-right:30px}.header.left .header-menu{margin-right:auto}.header.center .header-logo{margin-right:auto}.header.center .header-menu .nav{position:absolute;top:0;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);width:auto;text-align:center}.header .header-menu .nav .nav-item{position:relative;display:inline-block;height:100%;margin:0 0 0 20px}.header .header-menu .nav .nav-item:first-child{margin-left:0}.header .header-menu .nav .nav-item .nav-link{display:inline-block;line-height:80px}.header .header-menu .nav .nav-item .nav-link:before{position:absolute;right:0;bottom:22px;left:0;content:'';background:#eff2f5;height:0;-webkit-transition:all 0.14s cubic-bezier(0.165, 0.84, 0.44, 1);transition:all 0.14s cubic-bezier(0.165, 0.84, 0.44, 1)}.header .header-menu .nav .nav-item .nav-link.d-toggle{padding-right:14px}.header .header-menu .nav .nav-item .nav-dropdown-toggle{position:absolute;top:50%;right:0;-webkit-transform:translateY(-50%);transform:translateY(-50%);color:#131517}.header .header-menu .nav .nav-item .nav-dropdown-toggle:hover{color:#131517}.header .header-menu .nav .nav-item .nav-dropdown{position:absolute;top:83px;left:0;-webkit-transform:translateY(10px);transform:translateY(10px);z-index:995;visibility:hidden;opacity:0;background:#fff;width:240px;border-radius:0.375em;-webkit-box-shadow:0 10px 40px -4px rgba(22,25,28,0.17);box-shadow:0 10px 40px -4px rgba(22,25,28,0.17);padding:15px 0;-webkit-transition:ease-out 0.14s;transition:ease-out 0.14s}.header .header-menu .nav .nav-item .nav-dropdown .nav-dropdown-item{position:relative;display:block;margin:0;padding:0 15px}.header .header-menu .nav .nav-item .nav-dropdown .nav-dropdown-item .nav-dropdown-link{position:relative;display:block;border-radius:0.375em;padding:7px 15px;-webkit-transition:linear 0.06s;transition:linear 0.06s}.header .header-menu .nav .nav-item .nav-dropdown .nav-dropdown-item .nav-dropdown-link:hover{background:#eff2f5}.header .header-menu .nav .nav-item .nav-dropdown .nav-dropdown-item .nav-dropdown-link.sd-toggle:after{position:absolute;top:50%;right:15px;-webkit-transform:translateY(-50%);transform:translateY(-50%);content:'\f105';font-family:"Font Awesome 5 Free";font-weight:900;font-size:12px}.header .header-menu .nav .nav-item .nav-dropdown .nav-dropdown-item .nav-subdropdown-toggle{display:none}.header .header-menu .nav .nav-item .nav-dropdown .nav-dropdown-item .nav-subdropdown{position:absolute;top:-15px;left:243px;visibility:hidden;opacity:0;background:#fff;width:240px;border-radius:0.375em;-webkit-box-shadow:0 10px 40px -4px rgba(22,25,28,0.17);box-shadow:0 10px 40px -4px rgba(22,25,28,0.17);padding:15px;-webkit-transition:linear 0.06s;transition:linear 0.06s}.header .header-menu .nav .nav-item .nav-dropdown .nav-dropdown-item .nav-subdropdown .nav-subdropdown-item{display:block;margin:0}.header .header-menu .nav .nav-item .nav-dropdown .nav-dropdown-item .nav-subdropdown .nav-subdropdown-item .nav-subdropdown-link{display:block;border-radius:0.375em;padding:7px 15px;-webkit-transition:linear 0.06s;transition:linear 0.06s}.header .header-menu .nav .nav-item .nav-dropdown .nav-dropdown-item .nav-subdropdown .nav-subdropdown-item .nav-subdropdown-link:hover{background:#eff2f5}.header .header-menu .nav .nav-item .nav-dropdown .nav-dropdown-item:hover .nav-subdropdown{visibility:visible;opacity:1}.header .header-menu .nav .nav-item:hover .nav-link:before{height:6px}.header .header-menu .nav .nav-item:hover .nav-dropdown{-webkit-transform:translateY(0);transform:translateY(0);visibility:visible;opacity:1}.header .header-menu.dropdown-dark .nav .nav-item .nav-dropdown h1,.header .header-menu.dropdown-dark .nav .nav-item .nav-dropdown h2,.header .header-menu.dropdown-dark .nav .nav-item .nav-dropdown h3,.header .header-menu.dropdown-dark .nav .nav-item .nav-dropdown h4,.header .header-menu.dropdown-dark .nav .nav-item .nav-dropdown h5,.header .header-menu.dropdown-dark .nav .nav-item .nav-dropdown h6,.header .header-menu.dropdown-black .nav .nav-item .nav-dropdown h1,.header .header-menu.dropdown-black .nav .nav-item .nav-dropdown h2,.header .header-menu.dropdown-black .nav .nav-item .nav-dropdown h3,.header .header-menu.dropdown-black .nav .nav-item .nav-dropdown h4,.header .header-menu.dropdown-black .nav .nav-item .nav-dropdown h5,.header .header-menu.dropdown-black .nav .nav-item .nav-dropdown h6{color:#fff}.header .header-menu.dropdown-dark .nav .nav-item .nav-dropdown a:not(.button,.button-circle),.header .header-menu.dropdown-black .nav .nav-item .nav-dropdown a:not(.button,.button-circle){color:rgba(255,255,255,0.8)}.header .header-menu.dropdown-dark .nav .nav-item .nav-dropdown a:not(.button,.button-circle):hover,.header .header-menu.dropdown-dark .nav .nav-item .nav-dropdown a:not(.button,.button-circle):focus,.header .header-menu.dropdown-black .nav .nav-item .nav-dropdown a:not(.button,.button-circle):hover,.header .header-menu.dropdown-black .nav .nav-item .nav-dropdown a:not(.button,.button-circle):focus{color:#fff}.header .header-menu.dropdown-dark .nav .nav-item .nav-dropdown .nav-dropdown-item .nav-dropdown-link:hover,.header .header-menu.dropdown-black .nav .nav-item .nav-dropdown .nav-dropdown-item .nav-dropdown-link:hover{background:rgba(255,255,255,0.1)}.header .header-menu.dropdown-dark .nav .nav-item .nav-dropdown .nav-dropdown-item .nav-subdropdown .nav-subdropdown-item .nav-subdropdown-link:hover,.header .header-menu.dropdown-black .nav .nav-item .nav-dropdown .nav-dropdown-item .nav-subdropdown .nav-subdropdown-item .nav-subdropdown-link:hover{background:rgba(255,255,255,0.1)}.header .header-menu.dropdown-dark .nav .nav-item .nav-dropdown{background:#131517}.header .header-menu.dropdown-dark .nav .nav-item .nav-dropdown .nav-dropdown-item .nav-subdropdown{background:#131517}.header .header-menu.dropdown-black .nav .nav-item .nav-dropdown{background:#000}.header .header-menu.dropdown-black .nav .nav-item .nav-dropdown .nav-dropdown-item .nav-subdropdown{background:#000}.header.absolute-dark .header-menu .nav .nav-item .nav-link:before{background:rgba(0,0,0,0.05)}.header .header-menu-extra{display:inline-block;margin-left:30px}.header .header-toggle{display:none}.header:not(.center,.left) .header-menu .nav .nav-item:last-child .nav-dropdown,.header:not(.center,.left) .header-menu .nav .nav-item:nth-last-child(2) .nav-dropdown{right:0;left:auto}.header:not(.center,.left) .header-menu .nav .nav-item:last-child .nav-dropdown .nav-dropdown-item .nav-subdropdown,.header:not(.center,.left) .header-menu .nav .nav-item:nth-last-child(2) .nav-dropdown .nav-dropdown-item .nav-subdropdown{right:243px;left:auto}.header:not(.center,.left) .container-fluid .header-menu .nav .nav-item .nav-dropdown{right:0;left:auto}.header:not(.center,.left) .container-fluid .header-menu .nav .nav-item .nav-dropdown .nav-dropdown-item .nav-subdropdown{right:243px;left:auto}}@media (max-width: 991.98px){.header{height:70px}.header .header-menu{position:fixed;top:0;left:-100%;overflow-y:auto;background:#fff;width:300px;height:100%;-webkit-box-shadow:0 0 36px 0 rgba(22,25,28,0.17);box-shadow:0 0 36px 0 rgba(22,25,28,0.17);padding:20px 30px;-webkit-transition:all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);transition:all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1)}.header .header-menu.show{left:0}.header .header-menu .nav{width:100%;margin:0;padding:0}.header .header-menu .nav .nav-item{position:relative;display:block;width:100%;height:auto;margin:0;border-bottom:1px solid #e3e6e9;padding:14px 0}.header .header-menu .nav .nav-item:last-child{border:0}.header .header-menu .nav .nav-item .nav-link{display:inline-block;width:auto;height:auto;color:#7C7C7C}.header .header-menu .nav .nav-item .nav-link:hover,.header .header-menu .nav .nav-item .nav-link:focus,.header .header-menu .nav .nav-item .nav-link.active{color:#131517}.header .header-menu .nav .nav-item .nav-dropdown-toggle{position:absolute;top:14px;right:0;width:22px;height:22px;text-align:right}.header .header-menu .nav .nav-item .nav-dropdown-toggle.active{color:#131517}.header .header-menu .nav .nav-item .nav-dropdown{display:none;background:#fff;padding:8px 0 0 20px}.header .header-menu .nav .nav-item .nav-dropdown.show{display:block}.header .header-menu .nav .nav-item .nav-dropdown .nav-dropdown-item{position:relative;margin:0 0 8px}.header .header-menu .nav .nav-item .nav-dropdown .nav-dropdown-item:last-child{margin:0}.header .header-menu .nav .nav-item .nav-dropdown .nav-dropdown-item .nav-dropdown-link.active{color:#131517}.header .header-menu .nav .nav-item .nav-dropdown .nav-dropdown-item .nav-subdropdown-toggle{top:0;right:0;width:21px;height:21px;text-align:right}.header .header-menu .nav .nav-item .nav-dropdown .nav-dropdown-item .nav-subdropdown-toggle:after{content:'\f107'}.header .header-menu .nav .nav-item .nav-dropdown .nav-dropdown-item .nav-subdropdown{display:none;padding:8px 0 0 20px}.header .header-menu .nav .nav-item .nav-dropdown .nav-dropdown-item .nav-subdropdown.show{display:block}.header .header-menu .nav .nav-item .nav-dropdown .nav-dropdown-item .nav-subdropdown li{margin:0 0 8px}.header .header-menu .nav .nav-item .nav-dropdown .nav-dropdown-item .nav-subdropdown li:last-child{margin:0}.header .header-menu-extra{position:absolute;top:50%;right:80px;left:auto;-webkit-transform:translateY(-50%);transform:translateY(-50%)}}@media (min-width: 992px){.header-lg{height:90px}.header-lg .container-fluid{padding:0 40px}.header-lg .header-menu .nav .nav-item .nav-link{line-height:90px}.header-lg .header-menu .nav .nav-item .nav-link:before{bottom:27px}.header-lg .header-menu .nav .nav-item .nav-dropdown{top:93px}.header-xl{height:100px}.header-xl .container-fluid{padding:0 50px}.header-xl .header-menu .nav .nav-item .nav-link{line-height:100px}.header-xl .header-menu .nav .nav-item .nav-link:before{bottom:32px}.header-xl .header-menu .nav .nav-item .nav-dropdown{top:103px}}.header-placeholder{height:80px}.header-placeholder-lg{height:90px}.header-placeholder-xl{height:100px}@media (max-width: 991.98px){.header-placeholder,.header-placeholder-lg,.header-placeholder-xl{height:70px}}.masonry{margin:0 -15px -30px}.masonry .masonry-item{margin-bottom:30px;padding:0 15px}.masonry.masonry-column-1 .masonry-item{width:100%}@media (min-width: 768px){.masonry.masonry-column-2 .masonry-item{width:50%}}@media (min-width: 768px){.masonry.masonry-column-3 .masonry-item{width:50%}}@media (min-width: 992px){.masonry.masonry-column-3 .masonry-item{width:33.33%}}@media (min-width: 576px){.masonry.masonry-column-4 .masonry-item{width:50%}}@media (min-width: 768px){.masonry.masonry-column-4 .masonry-item{width:33.33%}}@media (min-width: 992px){.masonry.masonry-column-4 .masonry-item{width:25%}}@media (min-width: 1200px){.masonry.masonry-column-5 .masonry-item{width:20%}}@media (min-width: 1200px){.masonry.masonry-column-6 .masonry-item{width:16.66%}}.masonry.masonry-spacing-0{margin:0}.masonry.masonry-spacing-0 .masonry-item{margin:0;padding:0}.masonry.masonry-spacing-6{margin:0 -3px -6px}.masonry.masonry-spacing-6 .masonry-item{margin-bottom:6px;padding:0 3px}.masonry.masonry-spacing-10{margin:0 -5px -10px}.masonry.masonry-spacing-10 .masonry-item{margin-bottom:10px;padding:0 5px}.masonry.masonry-spacing-20{margin:0 -10px -20px}.masonry.masonry-spacing-20 .masonry-item{margin-bottom:20px;padding:0 10px}.masonry.masonry-spacing-40{margin:0 -20px -40px}.masonry.masonry-spacing-40 .masonry-item{margin-bottom:40px;padding:0 20px}.masonry.masonry-spacing-50{margin:0 -25px -50px}.masonry.masonry-spacing-50 .masonry-item{margin-bottom:50px;padding:0 25px}.portfolio-wrapper.row{margin:0}.portfolio-wrapper.row div[class^="col-"],.portfolio-wrapper.row div[class*=" col-"]{margin:0}.portfolio-wrapper .portfolio-item{width:100%;text-align:left}.portfolio-wrapper.column-1 .portfolio-item{width:100%}@media (min-width: 768px){.portfolio-wrapper.column-2 .portfolio-item{width:50%}}@media (min-width: 768px){.portfolio-wrapper.column-3 .portfolio-item{width:50%}}@media (min-width: 992px){.portfolio-wrapper.column-3 .portfolio-item{width:33.33%}}@media (min-width: 576px){.portfolio-wrapper.column-4 .portfolio-item,.portfolio-wrapper.column-6 .portfolio-item,.portfolio-wrapper.column-5 .portfolio-item,.portfolio-wrapper.masonry.masonry-column-5 .portfolio-item,.portfolio-wrapper.masonry.masonry-column-6 .portfolio-item{width:50%}}@media (min-width: 768px){.portfolio-wrapper.column-4 .portfolio-item,.portfolio-wrapper.column-6 .portfolio-item,.portfolio-wrapper.column-5 .portfolio-item,.portfolio-wrapper.masonry.masonry-column-5 .portfolio-item,.portfolio-wrapper.masonry.masonry-column-6 .portfolio-item{width:33.33%}}@media (min-width: 992px){.portfolio-wrapper.column-4 .portfolio-item,.portfolio-wrapper.column-6 .portfolio-item,.portfolio-wrapper.column-5 .portfolio-item,.portfolio-wrapper.masonry.masonry-column-5 .portfolio-item,.portfolio-wrapper.masonry.masonry-column-6 .portfolio-item{width:25%}}@media (min-width: 1200px){.portfolio-wrapper.column-5 .portfolio-item{width:20%}}@media (min-width: 1200px){.portfolio-wrapper.column-6 .portfolio-item{width:16.66%}}.portfolio-wrapper.spacing-0 .portfolio-item,.portfolio-wrapper.no-spacing .portfolio-item{padding:0}.portfolio-wrapper.spacing-6 .portfolio-item{padding:3px}.portfolio-wrapper.spacing-10 .portfolio-item{padding:5px}.portfolio-wrapper.spacing-20 .portfolio-item{padding:10px}.portfolio-wrapper.spacing-30 .portfolio-item{padding:15px}.portfolio-wrapper.spacing-40 .portfolio-item{padding:20px}.portfolio-wrapper.spacing-50 .portfolio-item{padding:25px}.portfolio-wrapper[class*=' border-radius'] .portfolio-item .portfolio-box,.portfolio-wrapper[class^='border-radius'] .portfolio-item .portfolio-box{-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);overflow:hidden}.portfolio-wrapper.border-radius-025 .portfolio-item .portfolio-box{border-radius:0.25em}.portfolio-wrapper.border-radius-0375 .portfolio-item .portfolio-box{border-radius:0.375em}.portfolio-wrapper.border-radius-05 .portfolio-item .portfolio-box{border-radius:0.5em}.portfolio-wrapper.border-radius-10 .portfolio-item .portfolio-box{border-radius:1.0em}.portfolio-wrapper.border-radius-15 .portfolio-item .portfolio-box{border-radius:1.5em}.portfolio-wrapper.border-radius-20 .portfolio-item .portfolio-box{border-radius:2.0em}.portfolio-wrapper.border-radius-25 .portfolio-item .portfolio-box{border-radius:2.5em}.portfolio-wrapper.border-radius-30 .portfolio-item .portfolio-box{border-radius:3.0em}.text-center .portfolio-item{text-align:center}.text-right .portfolio-item{text-align:right}.container .portfolio-wrapper.spacing-0,.container .portfolio-wrapper.no-spacing{margin:0}.container .portfolio-wrapper.spacing-6{margin:-3px}.container .portfolio-wrapper.spacing-10{margin:-5px}.container .portfolio-wrapper.spacing-20{margin:-10px}.container .portfolio-wrapper.spacing-30{margin:-15px}.container .portfolio-wrapper.spacing-40{margin:-20px}.container .portfolio-wrapper.spacing-50{margin:-25px}.container-fluid .portfolio-wrapper{margin:0 -30px}.container-fluid .portfolio-wrapper.spacing-0,.container-fluid .portfolio-wrapper.no-spacing{margin:0 -30px}.container-fluid .portfolio-wrapper.spacing-6{margin:-3px -27px 3px}.container-fluid .portfolio-wrapper.spacing-10{margin:-5px -25px 5px}.container-fluid .portfolio-wrapper.spacing-20{margin:-10px -20px 10px}.container-fluid .portfolio-wrapper.spacing-30{margin:-15px -15px 15px}.container-fluid .portfolio-wrapper.spacing-40{margin:-20px -10px 20px}.container-fluid .portfolio-wrapper.spacing-50{margin:-25px -5px 25px}.filter{margin-bottom:70px}.filter ul{margin:0 -5px;padding:0}.filter ul li{display:inline-block;background:#eff2f5;border-radius:30px;margin:0 5px;padding:7px 15px;font:400 13px "Poppins",sans-serif;letter-spacing:1px;text-transform:uppercase;cursor:pointer;-webkit-transition:linear 0.1s;transition:linear 0.1s}.filter ul li:hover{background:#e5e8eb}.filter ul li.active,.filter ul li.mixitup-control-active{background:#131517;color:#fff}.filter.filter-font-2 ul li{font-size:15px;letter-spacing:-0.2px;text-transform:none}.filter.filter-style-2 ul{margin:0 -2px}.filter.filter-style-2 ul li{background:transparent;margin:0 2px;color:#7C7C7C}.filter.filter-style-2 ul li:hover,.filter.filter-style-2 ul li.active,.filter.filter-style-2 ul li.mixitup-control-active{color:#131517}.filter.filter-style-2 ul li.active,.filter.filter-style-2 ul li.mixitup-control-active{background:#eff2f5}.filter.filter-style-3 ul{margin:0 -14px -8px}.filter.filter-style-3 ul li{position:relative;background:transparent;margin:0 14px 8px;padding:0;color:#7C7C7C}.filter.filter-style-3 ul li:after{content:'';position:absolute;right:0;bottom:-1px;left:0;background:#131517;height:1px;-webkit-animation:button-line-out 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both;animation:button-line-out 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both}.filter.filter-style-3 ul li:hover,.filter.filter-style-3 ul li.active,.filter.filter-style-3 ul li.mixitup-control-active{color:#131517}.filter.filter-style-3 ul li.active:after,.filter.filter-style-3 ul li.mixitup-control-active:after{width:100%;-webkit-animation:button-line-in 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both;animation:button-line-in 0.24s cubic-bezier(0.165, 0.84, 0.44, 1) both}.filter.filter-style-4 ul{margin:0 -14px -7px}.filter.filter-style-4 ul li{background:transparent;margin:0 14px 7px;padding:0;color:#aaa}.filter.filter-style-4 ul li:hover,.filter.filter-style-4 ul li.active,.filter.filter-style-4 ul li.mixitup-control-active{background:transparent;color:#131517}div[class^='bg-black'] .filter ul li,div[class*=' bg-black'] .filter ul li,div[class^='bg-dark'] .filter ul li,div[class*=' bg-dark'] .filter ul li{background:transparent;color:rgba(255,255,255,0.7)}div[class^='bg-black'] .filter ul li:hover,div[class*=' bg-black'] .filter ul li:hover,div[class^='bg-dark'] .filter ul li:hover,div[class*=' bg-dark'] .filter ul li:hover{background:transparent;color:#fff}div[class^='bg-black'] .filter ul li.active,div[class^='bg-black'] .filter ul li.mixitup-control-active,div[class*=' bg-black'] .filter ul li.active,div[class*=' bg-black'] .filter ul li.mixitup-control-active,div[class^='bg-dark'] .filter ul li.active,div[class^='bg-dark'] .filter ul li.mixitup-control-active,div[class*=' bg-dark'] .filter ul li.active,div[class*=' bg-dark'] .filter ul li.mixitup-control-active{background:#fff;color:#131517}div[class^='bg-black'] .filter.filter-style-2 ul li,div[class*=' bg-black'] .filter.filter-style-2 ul li,div[class^='bg-dark'] .filter.filter-style-2 ul li,div[class*=' bg-dark'] .filter.filter-style-2 ul li{color:rgba(255,255,255,0.7)}div[class^='bg-black'] .filter.filter-style-2 ul li:hover,div[class^='bg-black'] .filter.filter-style-2 ul li.active,div[class^='bg-black'] .filter.filter-style-2 ul li.mixitup-control-active,div[class*=' bg-black'] .filter.filter-style-2 ul li:hover,div[class*=' bg-black'] .filter.filter-style-2 ul li.active,div[class*=' bg-black'] .filter.filter-style-2 ul li.mixitup-control-active,div[class^='bg-dark'] .filter.filter-style-2 ul li:hover,div[class^='bg-dark'] .filter.filter-style-2 ul li.active,div[class^='bg-dark'] .filter.filter-style-2 ul li.mixitup-control-active,div[class*=' bg-dark'] .filter.filter-style-2 ul li:hover,div[class*=' bg-dark'] .filter.filter-style-2 ul li.active,div[class*=' bg-dark'] .filter.filter-style-2 ul li.mixitup-control-active{color:#fff}div[class^='bg-black'] .filter.filter-style-2 ul li.active,div[class^='bg-black'] .filter.filter-style-2 ul li.mixitup-control-active,div[class*=' bg-black'] .filter.filter-style-2 ul li.active,div[class*=' bg-black'] .filter.filter-style-2 ul li.mixitup-control-active,div[class^='bg-dark'] .filter.filter-style-2 ul li.active,div[class^='bg-dark'] .filter.filter-style-2 ul li.mixitup-control-active,div[class*=' bg-dark'] .filter.filter-style-2 ul li.active,div[class*=' bg-dark'] .filter.filter-style-2 ul li.mixitup-control-active{background:#fff;color:#131517}div[class^='bg-black'] .filter.filter-style-3 ul li,div[class*=' bg-black'] .filter.filter-style-3 ul li,div[class^='bg-dark'] .filter.filter-style-3 ul li,div[class*=' bg-dark'] .filter.filter-style-3 ul li{color:rgba(255,255,255,0.7)}div[class^='bg-black'] .filter.filter-style-3 ul li:after,div[class*=' bg-black'] .filter.filter-style-3 ul li:after,div[class^='bg-dark'] .filter.filter-style-3 ul li:after,div[class*=' bg-dark'] .filter.filter-style-3 ul li:after{background:#fff}div[class^='bg-black'] .filter.filter-style-3 ul li:hover,div[class^='bg-black'] .filter.filter-style-3 ul li.active,div[class^='bg-black'] .filter.filter-style-3 ul li.mixitup-control-active,div[class*=' bg-black'] .filter.filter-style-3 ul li:hover,div[class*=' bg-black'] .filter.filter-style-3 ul li.active,div[class*=' bg-black'] .filter.filter-style-3 ul li.mixitup-control-active,div[class^='bg-dark'] .filter.filter-style-3 ul li:hover,div[class^='bg-dark'] .filter.filter-style-3 ul li.active,div[class^='bg-dark'] .filter.filter-style-3 ul li.mixitup-control-active,div[class*=' bg-dark'] .filter.filter-style-3 ul li:hover,div[class*=' bg-dark'] .filter.filter-style-3 ul li.active,div[class*=' bg-dark'] .filter.filter-style-3 ul li.mixitup-control-active{color:#fff}div[class^='bg-black'] .filter.filter-style-3 ul li.active,div[class^='bg-black'] .filter.filter-style-3 ul li.mixitup-control-active,div[class*=' bg-black'] .filter.filter-style-3 ul li.active,div[class*=' bg-black'] .filter.filter-style-3 ul li.mixitup-control-active,div[class^='bg-dark'] .filter.filter-style-3 ul li.active,div[class^='bg-dark'] .filter.filter-style-3 ul li.mixitup-control-active,div[class*=' bg-dark'] .filter.filter-style-3 ul li.active,div[class*=' bg-dark'] .filter.filter-style-3 ul li.mixitup-control-active{background:transparent}div[class^='bg-black'] .filter.filter-style-4 ul li,div[class*=' bg-black'] .filter.filter-style-4 ul li,div[class^='bg-dark'] .filter.filter-style-4 ul li,div[class*=' bg-dark'] .filter.filter-style-4 ul li{background:transparent;color:rgba(255,255,255,0.7)}div[class^='bg-black'] .filter.filter-style-4 ul li:hover,div[class^='bg-black'] .filter.filter-style-4 ul li.active,div[class^='bg-black'] .filter.filter-style-4 ul li.mixitup-control-active,div[class*=' bg-black'] .filter.filter-style-4 ul li:hover,div[class*=' bg-black'] .filter.filter-style-4 ul li.active,div[class*=' bg-black'] .filter.filter-style-4 ul li.mixitup-control-active,div[class^='bg-dark'] .filter.filter-style-4 ul li:hover,div[class^='bg-dark'] .filter.filter-style-4 ul li.active,div[class^='bg-dark'] .filter.filter-style-4 ul li.mixitup-control-active,div[class*=' bg-dark'] .filter.filter-style-4 ul li:hover,div[class*=' bg-dark'] .filter.filter-style-4 ul li.active,div[class*=' bg-dark'] .filter.filter-style-4 ul li.mixitup-control-active{background:transparent;color:#fff}.portfolio-item .portfolio-box{position:relative}.portfolio-item .portfolio-box .portfolio-img{position:relative;overflow:hidden}.portfolio-item .portfolio-box .portfolio-img img{-webkit-transform:scale(1);transform:scale(1);width:100%;-webkit-transition:transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);transition:transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1)}.portfolio-item .portfolio-box a{position:absolute;top:0;left:0;z-index:2;display:block;width:100%;height:100%}.portfolio-item .portfolio-box .portfolio-title{position:absolute;top:0;left:0;opacity:0;background:rgba(0,0,0,0.4);width:100%;height:100%;color:rgba(255,255,255,0.7);-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}.portfolio-item .portfolio-box .portfolio-title div{position:absolute;left:30px;bottom:30px}.portfolio-item .portfolio-box .portfolio-title div *{opacity:0;-webkit-transform:translateY(5px);transform:translateY(5px);margin-bottom:7px;-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}.portfolio-item .portfolio-box .portfolio-title div *:first-child{-webkit-transition-delay:.05s;transition-delay:.05s}.portfolio-item .portfolio-box .portfolio-title div *:last-child{-webkit-transition-delay:.1s;transition-delay:.1s;margin-bottom:0}.portfolio-item .portfolio-box .portfolio-title div h1,.portfolio-item .portfolio-box .portfolio-title div h2,.portfolio-item .portfolio-box .portfolio-title div h3,.portfolio-item .portfolio-box .portfolio-title div h4,.portfolio-item .portfolio-box .portfolio-title div h5,.portfolio-item .portfolio-box .portfolio-title div h6{color:#fff}.portfolio-item .portfolio-box .portfolio-title div span{display:inline-block}.portfolio-item .portfolio-box:hover .portfolio-img img{-webkit-transform:scale(1.04);transform:scale(1.04);-webkit-filter:blur(1.5px);filter:blur(1.5px)}.portfolio-item .portfolio-box:hover .portfolio-title{opacity:1}.portfolio-item .portfolio-box:hover .portfolio-title *{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}.hover-style-2 .portfolio-item .portfolio-box .portfolio-title{opacity:1;background:rgba(0,0,0,0.1)}.hover-style-2 .portfolio-item .portfolio-box .portfolio-title div{top:30px;bottom:auto}.hover-style-2 .portfolio-item .portfolio-box .portfolio-title div *{opacity:1;-webkit-transform:translateY(0);transform:translateY(0);-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}.hover-style-2 .portfolio-item .portfolio-box .portfolio-title i{position:absolute;right:30px;bottom:30px;-webkit-transform:translateY(5px);transform:translateY(5px);opacity:0;color:#fff;-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}.hover-style-2 .portfolio-item .portfolio-box:hover .portfolio-title{background:rgba(0,0,0,0.3)}.hover-style-2 .portfolio-item .portfolio-box:hover .portfolio-title i{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}.hover-style-3 .portfolio-item .portfolio-box{overflow:hidden}.hover-style-3 .portfolio-item .portfolio-box .portfolio-title{top:auto;right:auto;bottom:0;left:0;-webkit-transform:translateY(100%);transform:translateY(100%);opacity:1;background:#131517;height:auto;padding:15px 30px;-webkit-transition:transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);transition:transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1)}.hover-style-3 .portfolio-item .portfolio-box .portfolio-title div{position:static;opacity:1}.hover-style-3 .portfolio-item .portfolio-box .portfolio-title div *{-webkit-transform:translateY(0);transform:translateY(0);opacity:1;margin-bottom:0}.hover-style-3 .portfolio-item .portfolio-box .portfolio-title div h1,.hover-style-3 .portfolio-item .portfolio-box .portfolio-title div h2,.hover-style-3 .portfolio-item .portfolio-box .portfolio-title div h3,.hover-style-3 .portfolio-item .portfolio-box .portfolio-title div h4,.hover-style-3 .portfolio-item .portfolio-box .portfolio-title div h5,.hover-style-3 .portfolio-item .portfolio-box .portfolio-title div h6{float:left}.hover-style-3 .portfolio-item .portfolio-box .portfolio-title div span{float:right;display:initial}.hover-style-3 .portfolio-item .portfolio-box:hover .portfolio-img img{-webkit-transform:translateY(-20px);transform:translateY(-20px);-webkit-filter:blur(0);filter:blur(0)}.hover-style-3 .portfolio-item .portfolio-box:hover .portfolio-title{-webkit-transform:translateY(0);transform:translateY(0)}.hover-style-4 .portfolio-item .portfolio-box{overflow:hidden}.hover-style-4 .portfolio-item .portfolio-box .portfolio-title{background:rgba(255,255,255,0.1);color:#7C7C7C}.hover-style-4 .portfolio-item .portfolio-box .portfolio-title:after{content:'';position:absolute;top:20px;right:20px;bottom:20px;left:20px;background:#fff;-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}.hover-style-4 .portfolio-item .portfolio-box .portfolio-title div{top:50%;bottom:auto;left:0;-webkit-transform:translateY(-50%);transform:translateY(-50%);z-index:1;opacity:0;width:100%;padding:0 50px;text-align:center;-webkit-transition:ease-out 0.12s;transition:ease-out 0.12s}.hover-style-4 .portfolio-item .portfolio-box .portfolio-title div h1,.hover-style-4 .portfolio-item .portfolio-box .portfolio-title div h2,.hover-style-4 .portfolio-item .portfolio-box .portfolio-title div h3,.hover-style-4 .portfolio-item .portfolio-box .portfolio-title div h4,.hover-style-4 .portfolio-item .portfolio-box .portfolio-title div h5,.hover-style-4 .portfolio-item .portfolio-box .portfolio-title div h6{color:#131517}.hover-style-4 .portfolio-item .portfolio-box .portfolio-title div span{margin:0}.hover-style-4 .portfolio-item .portfolio-box:hover .portfolio-img img{-webkit-transform:scale(1);transform:scale(1);-webkit-filter:blur(0);filter:blur(0)}.hover-style-4 .portfolio-item .portfolio-box:hover .portfolio-title div{opacity:1}.hover-style-5 .portfolio-item .portfolio-box .portfolio-title{background:rgba(255,255,255,0.9);color:#7C7C7C}.hover-style-5 .portfolio-item .portfolio-box .portfolio-title div{top:50%;left:50%;bottom:auto;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);text-align:center}.hover-style-5 .portfolio-item .portfolio-box .portfolio-title div h1,.hover-style-5 .portfolio-item .portfolio-box .portfolio-title div h2,.hover-style-5 .portfolio-item .portfolio-box .portfolio-title div h3,.hover-style-5 .portfolio-item .portfolio-box .portfolio-title div h4,.hover-style-5 .portfolio-item .portfolio-box .portfolio-title div h5,.hover-style-5 .portfolio-item .portfolio-box .portfolio-title div h6{color:#131517}.hover-style-5 .portfolio-item .portfolio-box:hover .portfolio-title div{-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}body:after{content:'';position:fixed;top:0;left:0;z-index:998;background:#fff;width:100%;height:100%}body.loaded:after{display:none}.preloader{position:fixed;top:0;left:0;z-index:999;visibility:visible;opacity:1;background:#fff;width:100%;height:100%;text-align:center}.preloader div{position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}.preloader.dark{background:#000}.loaded .preloader{visibility:hidden;opacity:0;-webkit-transition:ease-out 0.3s;transition:ease-out 0.3s}.preloader-1 div{position:relative;width:70px;height:70px}.preloader-1 div .loader-circular{position:absolute;top:0;bottom:0;left:0;right:0;transform-origin:center center;width:70px;height:70px;margin:auto;animation:loader-one-rotate 2s linear infinite}.preloader-1 div .loader-path{fill:none;stroke:#131517;stroke-width:2.5;stroke-dasharray:1, 200;stroke-dashoffset:0;stroke-linecap:round;stroke-miterlimit:10;animation:loader-one-dash 1.5s ease-in-out infinite}.preloader-1.dark div .loader-path{stroke:#fff}@keyframes loader-one-rotate{100%{transform:rotate(360deg)}}@keyframes loader-one-dash{0%{stroke-dasharray:1, 200;stroke-dashoffset:0}50%{stroke-dasharray:89, 200;stroke-dashoffset:-35px}100%{stroke-dasharray:89, 200;stroke-dashoffset:-124px}}.preloader-2 div span{display:inline-block;opacity:0.2;background:#000;background:linear-gradient(to right, #000 10%, transparent 40%);width:60px;height:60px;border-radius:50%;-webkit-animation:loader-two 0.6s infinite linear;animation:loader-two 0.6s infinite linear}.preloader-2 div span:before,.preloader-2 div span:after{content:'';position:absolute;top:0;left:0}.preloader-2 div span:before{background:#000;width:50%;height:50%;border-radius:100% 0 0 0}.preloader-2 div span:after{right:0;bottom:0;background:#fff;width:90%;height:90%;margin:auto;border-radius:50%}.preloader-2.dark div span{background:#fff;background:linear-gradient(to right, #fff 10%, transparent 40%)}.preloader-2.dark div span:before{background:#fff}.preloader-2.dark div span:after{background:#000}@keyframes loader-two{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes loader-two{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.preloader-3 div{width:50px;height:50px}.preloader-3 div span{position:relative;display:block}.preloader-3 div span:before,.preloader-3 div span:after{content:'';position:absolute;top:0;left:0;background:rgba(0,0,0,0.1);width:50px;height:50px;border-radius:50%}.preloader-3 div span:before{-webkit-animation:loader-three-bounceIn 1.2s infinite ease-in-out;animation:loader-three-bounceIn 1.2s infinite ease-in-out}.preloader-3 div span:after{-webkit-animation:loader-three-bounceOut 1.2s infinite ease-in-out;animation:loader-three-bounceOut 1.2s infinite ease-in-out}.preloader-3.dark div span:before,.preloader-3.dark div span:after{background:rgba(255,255,255,0.1)}@-webkit-keyframes loader-three-bounceIn{0%,100%{-webkit-transform:scale(0)}50%{-webkit-transform:scale(1)}}@keyframes loader-three-bounceIn{0%,100%{-webkit-transform:scale(0);transform:scale(0)}50%{-webkit-transform:scale(1);transform:scale(1)}}@-webkit-keyframes loader-three-bounceOut{0%,100%{-webkit-transform:scale(1)}50%{-webkit-transform:scale(0)}}@keyframes loader-three-bounceOut{0%,100%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(0);transform:scale(0)}}.section-xs{padding:50px 0}.section-xs.bg-image .container,.section-xs.bg-image .container-fluid{padding:50px 30px}.section-sm{padding:70px 0}.section-sm.bg-image .container,.section-sm.bg-image .container-fluid{padding:70px 30px}.section,.section-md{padding:100px 0}.section.bg-image .container,.section.bg-image .container-fluid,.section-md.bg-image .container,.section-md.bg-image .container-fluid{padding:100px 30px}.section-lg{padding:160px 0}.section-lg.bg-image .container,.section-lg.bg-image .container-fluid{padding:160px 30px}.section-xl{padding:200px 0}.section-xl.bg-image .container,.section-xl.bg-image .container-fluid{padding:200px 30px}.section-2xl{padding:240px 0}.section-2xl.bg-image .container,.section-2xl.bg-image .container-fluid{padding:240px 30px}@media (max-width: 767.98px){.section-xs{padding:30px 0}.section-xs.bg-image .container,.section-xs.bg-image .container-fluid{padding:30px 30px}.section-sm{padding:50px 0}.section-sm.bg-image .container,.section-sm.bg-image .container-fluid{padding:50px 30px}.section,.section-md{padding:80px 0}.section.bg-image .container,.section.bg-image .container-fluid,.section-md.bg-image .container,.section-md.bg-image .container-fluid{padding:80px 30px}.section-lg{padding:120px 0}.section-lg.bg-image .container,.section-lg.bg-image .container-fluid{padding:120px 30px}.section-xl{padding:160px 0}.section-xl.bg-image .container,.section-xl.bg-image .container-fluid{padding:160px 30px}.section-2xl{padding:180px 0}.section-2xl.bg-image .container,.section-2xl.bg-image .container-fluid{padding:180px 30px}}@media (max-width: 575.98px){.section,.section-md{padding:70px 0}.section.bg-image .container,.section.bg-image .container-fluid,.section-md.bg-image .container,.section-md.bg-image .container-fluid{padding:70px 30px}.section-lg{padding:100px 0}.section-lg.bg-image .container,.section-lg.bg-image .container-fluid{padding:100px 30px}.section-xl{padding:140px 0}.section-xl.bg-image .container,.section-xl.bg-image .container-fluid{padding:120px 30px}.section-2xl{padding:160px 0}.section-2xl.bg-image .container,.section-2xl.bg-image .container-fluid{padding:140px 30px}}.section-xs.bg-image,.section-sm.bg-image,.section.bg-image,.section-md.bg-image,.section-lg.bg-image,.section-xl.bg-image,.section-2xl.bg-image{padding:0}.section-fullscreen{width:100%;height:100vh}.section-fullscreen div[class^='bg-black'],.section-fullscreen div[class*=' bg-black'],.section-fullscreen div[class^='bg-white'],.section-fullscreen div[class*=' bg-white'],.section-fullscreen div[class^='bg-dark'],.section-fullscreen div[class*=' bg-dark'],.section-fullscreen div[class^='bg-grey'],.section-fullscreen div[class*=' bg-grey'],.section-fullscreen .container,.section-fullscreen .container-fluid{height:100%}.product-box .product-img{position:relative;-webkit-transform:translate3d(0, 0, 0);transform:translate3d(0, 0, 0);overflow:hidden}.product-box .product-img .product-img-link{display:block}.product-box .product-img img{-webkit-transform:scale(1);transform:scale(1);-webkit-transition:transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);transition:transform 0.4s cubic-bezier(0.165, 0.84, 0.44, 1)}.product-box .product-img .product-badge-left,.product-box .product-img .product-badge-right{position:absolute;top:16px;z-index:2;font-size:14px;background:rgba(0,0,0,0.4);padding:8px 11px;border-radius:40px;font:500 12px "Poppins",sans-serif;line-height:1;letter-spacing:1px;text-transform:uppercase}.product-box .product-img .product-badge-left *,.product-box .product-img .product-badge-right *{color:#fff}.product-box .product-img .product-badge-left h1,.product-box .product-img .product-badge-left h2,.product-box .product-img .product-badge-left h3,.product-box .product-img .product-badge-left h4,.product-box .product-img .product-badge-left h5,.product-box .product-img .product-badge-left h6,.product-box .product-img .product-badge-right h1,.product-box .product-img .product-badge-right h2,.product-box .product-img .product-badge-right h3,.product-box .product-img .product-badge-right h4,.product-box .product-img .product-badge-right h5,.product-box .product-img .product-badge-right h6{margin:0}.product-box .product-img .product-badge-left.red,.product-box .product-img .product-badge-right.red{background:#c62f3e}.product-box .product-img .product-badge-left.green,.product-box .product-img .product-badge-right.green{background:#24963e}.product-box .product-img .product-badge-left{left:16px}.product-box .product-img .product-badge-right{right:16px}.product-box .product-img .add-to-cart{position:absolute;right:16px;bottom:16px;left:16px;-webkit-transform:translateY(4px);transform:translateY(4px);z-index:2;visibility:hidden;opacity:0;background:#fff;padding:16px;text-align:center;-webkit-transition:ease-out 0.16s;transition:ease-out 0.16s}.product-box .product-img .add-to-cart a:not([class*=' button'],[class^='button']){color:#7C7C7C;font:500 13px "Poppins",sans-serif;letter-spacing:1px;text-transform:uppercase}.product-box .product-img .add-to-cart a:not([class*=' button'],[class^='button']):hover,.product-box .product-img .add-to-cart a:not([class*=' button'],[class^='button']):focus{color:#131517}.product-box .product-img:hover img,.product-box .product-img:focus img{-webkit-transform:scale(1.04);transform:scale(1.04)}.product-box .product-img:hover .add-to-cart,.product-box .product-img:focus .add-to-cart{-webkit-transform:translateY(0);transform:translateY(0);visibility:visible;opacity:1}.product-box .product-title{position:relative;padding:24px 0 20px}.product-box .product-title h1,.product-box .product-title h2,.product-box .product-title h3,.product-box .product-title h4,.product-box .product-title h5,.product-box .product-title h6{margin-bottom:4px;line-height:1.4}.product-box .product-title .price span{display:inline-block}.product-box .product-title .price del{opacity:0.7;margin-right:4px}.product-box .product-title .price ins{text-decoration:none}.product-carousel-thumbnails{padding:6px 0 0}.product-carousel-thumbnails li{list-style-type:none;display:inline-block;margin-right:2px}.product-carousel-thumbnails li a{display:inline-block;opacity:0.6;-webkit-transition:ease-out 0.16s;transition:ease-out 0.16s}.product-carousel-thumbnails li a img{max-width:100px}.product-carousel-thumbnails li a:hover{opacity:1}.product-price del{opacity:0.7;margin-right:8px}.product-price ins{text-decoration:none}.product-quantity .qnt{position:relative;display:inline-block;width:auto;margin-right:30px}.product-quantity .qnt input{width:100px;height:34px;border:0;padding:0;text-align:center}.product-quantity .qnt input::-webkit-outer-spin-button,.product-quantity .qnt input::-webkit-inner-spin-button{display:none;-webkit-appearance:none;margin:0}.product-quantity .qnt input[type=number]{-moz-appearance:textfield}.product-quantity .qnt .dec,.product-quantity .qnt .inc{position:absolute;top:0;background:#eff2f5;width:34px;height:34px;border-radius:50%;color:transparent;text-align:center;-webkit-transition:linear 0.1s;transition:linear 0.1s}.product-quantity .qnt .dec:before,.product-quantity .qnt .inc:before{content:'';position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);background:#131517;width:11px;height:1px}.product-quantity .qnt .dec:hover,.product-quantity .qnt .inc:hover{background:#e5e8eb}.product-quantity .qnt .dec{left:0}.product-quantity .qnt .inc{right:0}.product-quantity .qnt .inc:after{content:'';position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);background:#131517;width:1px;height:11px}.product-info-box{border:1px solid #e3e6e9;padding:40px}@media (max-width: 991.98px){.product-info-box{padding:30px}}.product-info-box .nav{justify-content:center;margin:0 -15px 30px}.product-info-box .nav .nav-item{margin:0 15px}.product-info-box .nav .nav-item .nav-link{position:relative;padding:0 0 1px;font-weight:400;font-family:"Poppins",sans-serif;letter-spacing:-0.2px}.product-info-box .nav .nav-item .nav-link:before{content:'';position:absolute;right:0;bottom:0;left:0;background:#131517;height:1px;-webkit-transition:ease-out 0.24s;transition:ease-out 0.24s;-webkit-animation:button-line-out 0.24s ease-out both;animation:button-line-out 0.24s ease-out both}.product-info-box .nav .nav-item .nav-link.active{color:#131517}.product-info-box .nav .nav-item .nav-link.active:before{width:100%;-webkit-animation:button-line-in 0.24s ease-out both;animation:button-line-in 0.24s ease-out both}.product-info-box .table{margin:0;border-collapse:separate;border-spacing:0;border:0;font-size:15px}.product-info-box .table tr:first-child th,.product-info-box .table tr:first-child td{border:0}.product-info-box .table th,.product-info-box .table td{border-top:1px solid #e3e6e9;padding:14px 20px 14px 0}.product-info-box .table th{font-weight:400}.product-info-box .table td{color:#7C7C7C}.cart-table{margin:0;border-collapse:separate;border-spacing:0;border:0;font-size:14px}.cart-table thead th,.cart-table thead td{border-bottom:1px solid #e3e6e9;font-weight:600}.cart-table th,.cart-table td{border-top:0;border-bottom:1px solid #e3e6e9;padding:20px 20px 20px 0;vertical-align:middle}.cart-table th{font-weight:400}.cart-table td{color:#7C7C7C}.cart-table .product-thumbnail img{max-width:100px}.cart-table .product-quantity .qnt{margin:0}.cart-table .product-quantity .qnt input{margin:0}.cart-totals{margin:0;border-collapse:separate;border-spacing:0;border:0;font-size:14px}.cart-totals tr:first-child th,.cart-totals tr:first-child td{border:0}.cart-totals th,.cart-totals td{border-top:1px solid #e3e6e9;padding:20px 20px 20px 0}.cart-totals th{font-weight:400}.cart-totals td{color:#7C7C7C}.bg-white{background:#fff !important}.bg-white-09{background:rgba(255,255,255,0.9) !important}.bg-white-08{background:rgba(255,255,255,0.8) !important}.bg-white-07{background:rgba(255,255,255,0.7) !important}.bg-white-06{background:rgba(255,255,255,0.6) !important}.bg-white-05{background:rgba(255,255,255,0.5) !important}.bg-white-04{background:rgba(255,255,255,0.4) !important}.bg-white-03{background:rgba(255,255,255,0.3) !important}.bg-white-02{background:rgba(255,255,255,0.2) !important}.bg-white-01{background:rgba(255,255,255,0.1) !important}.bg-black{background:#000 !important}.bg-black-09{background:rgba(0,0,0,0.9) !important}.bg-black-08{background:rgba(0,0,0,0.8) !important}.bg-black-07{background:rgba(0,0,0,0.7) !important}.bg-black-06{background:rgba(0,0,0,0.6) !important}.bg-black-05{background:rgba(0,0,0,0.5) !important}.bg-black-04{background:rgba(0,0,0,0.4) !important}.bg-black-03{background:rgba(0,0,0,0.3) !important}.bg-black-02{background:rgba(0,0,0,0.2) !important}.bg-black-01{background:rgba(0,0,0,0.1) !important}.bg-dark{background:#131517 !important}.bg-dark-lighter{background:#1a1c1e !important}.bg-dark-lightest{background:#212325 !important}.bg-dark-grey{background:#303234 !important}.bg-dark-grey-09{background:rgba(48,50,52,0.9) !important}.bg-dark-grey-08{background:rgba(48,50,52,0.8) !important}.bg-dark-grey-07{background:rgba(48,50,52,0.7) !important}.bg-dark-grey-06{background:rgba(48,50,52,0.6) !important}.bg-dark-grey-05{background:rgba(48,50,52,0.5) !important}.bg-dark-grey-04{background:rgba(48,50,52,0.4) !important}.bg-dark-grey-03{background:rgba(48,50,52,0.3) !important}.bg-dark-grey-02{background:rgba(48,50,52,0.2) !important}.bg-dark-grey-01{background:rgba(48,50,52,0.1) !important}.bg-grey{background:#eff2f5 !important}.bg-grey-lighter{background:#f2f5f8 !important}.bg-grey-lightest{background:#f5f8fb !important}.bg-transparent{background:transparent !important}.bg-white-content,div[class^='bg-black'] div[class^='bg-white'],div[class^='bg-black'] div[class*=' bg-white'],div[class*=' bg-black'] div[class^='bg-white'],div[class*=' bg-black'] div[class*=' bg-white'],div[class^='bg-dark'] div[class^='bg-white'],div[class^='bg-dark'] div[class*=' bg-white'],div[class*=' bg-dark'] div[class^='bg-white'],div[class*=' bg-dark'] div[class*=' bg-white'],div[class^='bg-white'],div[class*=' bg-white']{color:#7C7C7C}.bg-white-content h1,div[class^='bg-black'] div[class^='bg-white'] h1,div[class^='bg-black'] div[class*=' bg-white'] h1,div[class*=' bg-black'] div[class^='bg-white'] h1,div[class*=' bg-black'] div[class*=' bg-white'] h1,div[class^='bg-dark'] div[class^='bg-white'] h1,div[class^='bg-dark'] div[class*=' bg-white'] h1,div[class*=' bg-dark'] div[class^='bg-white'] h1,div[class*=' bg-dark'] div[class*=' bg-white'] h1,div[class^='bg-white'] h1,div[class*=' bg-white'] h1,.bg-white-content h2,div[class^='bg-black'] div[class^='bg-white'] h2,div[class^='bg-black'] div[class*=' bg-white'] h2,div[class*=' bg-black'] div[class^='bg-white'] h2,div[class*=' bg-black'] div[class*=' bg-white'] h2,div[class^='bg-dark'] div[class^='bg-white'] h2,div[class^='bg-dark'] div[class*=' bg-white'] h2,div[class*=' bg-dark'] div[class^='bg-white'] h2,div[class*=' bg-dark'] div[class*=' bg-white'] h2,div[class^='bg-white'] h2,div[class*=' bg-white'] h2,.bg-white-content h3,div[class^='bg-black'] div[class^='bg-white'] h3,div[class^='bg-black'] div[class*=' bg-white'] h3,div[class*=' bg-black'] div[class^='bg-white'] h3,div[class*=' bg-black'] div[class*=' bg-white'] h3,div[class^='bg-dark'] div[class^='bg-white'] h3,div[class^='bg-dark'] div[class*=' bg-white'] h3,div[class*=' bg-dark'] div[class^='bg-white'] h3,div[class*=' bg-dark'] div[class*=' bg-white'] h3,div[class^='bg-white'] h3,div[class*=' bg-white'] h3,.bg-white-content h4,div[class^='bg-black'] div[class^='bg-white'] h4,div[class^='bg-black'] div[class*=' bg-white'] h4,div[class*=' bg-black'] div[class^='bg-white'] h4,div[class*=' bg-black'] div[class*=' bg-white'] h4,div[class^='bg-dark'] div[class^='bg-white'] h4,div[class^='bg-dark'] div[class*=' bg-white'] h4,div[class*=' bg-dark'] div[class^='bg-white'] h4,div[class*=' bg-dark'] div[class*=' bg-white'] h4,div[class^='bg-white'] h4,div[class*=' bg-white'] h4,.bg-white-content h5,div[class^='bg-black'] div[class^='bg-white'] h5,div[class^='bg-black'] div[class*=' bg-white'] h5,div[class*=' bg-black'] div[class^='bg-white'] h5,div[class*=' bg-black'] div[class*=' bg-white'] h5,div[class^='bg-dark'] div[class^='bg-white'] h5,div[class^='bg-dark'] div[class*=' bg-white'] h5,div[class*=' bg-dark'] div[class^='bg-white'] h5,div[class*=' bg-dark'] div[class*=' bg-white'] h5,div[class^='bg-white'] h5,div[class*=' bg-white'] h5,.bg-white-content h6,div[class^='bg-black'] div[class^='bg-white'] h6,div[class^='bg-black'] div[class*=' bg-white'] h6,div[class*=' bg-black'] div[class^='bg-white'] h6,div[class*=' bg-black'] div[class*=' bg-white'] h6,div[class^='bg-dark'] div[class^='bg-white'] h6,div[class^='bg-dark'] div[class*=' bg-white'] h6,div[class*=' bg-dark'] div[class^='bg-white'] h6,div[class*=' bg-dark'] div[class*=' bg-white'] h6,div[class^='bg-white'] h6,div[class*=' bg-white'] h6{color:#131517}.bg-white-content a:not([class*=' button'],[class^='button']),div[class^='bg-white'] a:not([class*=' button'],[class^='button']),div[class*=' bg-white'] a:not([class*=' button'],[class^='button']){color:#7C7C7C}.bg-white-content a:not([class*=' button'],[class^='button']):hover,div[class^='bg-white'] a:not([class*=' button'],[class^='button']):hover,div[class*=' bg-white'] a:not([class*=' button'],[class^='button']):hover,.bg-white-content a:not([class*=' button'],[class^='button']):focus,div[class^='bg-white'] a:not([class*=' button'],[class^='button']):focus,div[class*=' bg-white'] a:not([class*=' button'],[class^='button']):focus{color:#131517}.bg-dark-content,div[class^='bg-black'],div[class*=' bg-black'],div[class^='bg-dark'],div[class*=' bg-dark']{color:rgba(255,255,255,0.7)}.bg-dark-content h1,div[class^='bg-black'] h1,div[class*=' bg-black'] h1,div[class^='bg-dark'] h1,div[class*=' bg-dark'] h1,.bg-dark-content h2,div[class^='bg-black'] h2,div[class*=' bg-black'] h2,div[class^='bg-dark'] h2,div[class*=' bg-dark'] h2,.bg-dark-content h3,div[class^='bg-black'] h3,div[class*=' bg-black'] h3,div[class^='bg-dark'] h3,div[class*=' bg-dark'] h3,.bg-dark-content h4,div[class^='bg-black'] h4,div[class*=' bg-black'] h4,div[class^='bg-dark'] h4,div[class*=' bg-dark'] h4,.bg-dark-content h5,div[class^='bg-black'] h5,div[class*=' bg-black'] h5,div[class^='bg-dark'] h5,div[class*=' bg-dark'] h5,.bg-dark-content h6,div[class^='bg-black'] h6,div[class*=' bg-black'] h6,div[class^='bg-dark'] h6,div[class*=' bg-dark'] h6{color:#fff}.bg-dark-content a:not([class*=' button'],[class^='button']),div[class^='bg-black'] a:not([class*=' button'],[class^='button']),div[class*=' bg-black'] a:not([class*=' button'],[class^='button']),div[class^='bg-dark'] a:not([class*=' button'],[class^='button']),div[class*=' bg-dark'] a:not([class*=' button'],[class^='button']){color:rgba(255,255,255,0.8)}.bg-dark-content a:not([class*=' button'],[class^='button']):hover,div[class^='bg-black'] a:not([class*=' button'],[class^='button']):hover,div[class*=' bg-black'] a:not([class*=' button'],[class^='button']):hover,div[class^='bg-dark'] a:not([class*=' button'],[class^='button']):hover,div[class*=' bg-dark'] a:not([class*=' button'],[class^='button']):hover,.bg-dark-content a:not([class*=' button'],[class^='button']):focus,div[class^='bg-black'] a:not([class*=' button'],[class^='button']):focus,div[class*=' bg-black'] a:not([class*=' button'],[class^='button']):focus,div[class^='bg-dark'] a:not([class*=' button'],[class^='button']):focus,div[class*=' bg-dark'] a:not([class*=' button'],[class^='button']):focus{color:#fff}.font-family-primary{font-family:"Open Sans",sans-serif}.font-family-secondary,.font-family-playfair{font-family:"Playfair Display",serif}.font-family-tertiary{font-family:"Poppins",sans-serif}.font-weight-thin{font-weight:100}.font-weight-extra-light{font-weight:200}.font-weight-medium{font-weight:500}.font-weight-semi-bold{font-weight:600}.font-weight-extra-bold{font-weight:800}.font-weight-black{font-weight:900}*.text-white-09{color:rgba(255,255,255,0.9)}*.text-white-08{color:rgba(255,255,255,0.8)}*.text-white-07{color:rgba(255,255,255,0.7)}*.text-white-06{color:rgba(255,255,255,0.6)}*.text-white-05{color:rgba(255,255,255,0.5)}*.text-white-04{color:rgba(255,255,255,0.4)}*.text-white-03{color:rgba(255,255,255,0.3)}*.text-white-02{color:rgba(255,255,255,0.2)}*.text-white-01{color:rgba(255,255,255,0.1)}*.text-black{color:#000}*.text-black-09{color:rgba(0,0,0,0.9)}*.text-black-08{color:rgba(0,0,0,0.8)}*.text-black-07{color:rgba(0,0,0,0.7)}*.text-black-06{color:rgba(0,0,0,0.6)}*.text-black-05{color:rgba(0,0,0,0.5)}*.text-black-04{color:rgba(0,0,0,0.4)}*.text-black-03{color:rgba(0,0,0,0.3)}*.text-black-02{color:rgba(0,0,0,0.2)}*.text-black-01{color:rgba(0,0,0,0.1)}*.text-dark{color:#131517 !important}*.text-yellow{color:#ffc107}*.text-red{color:#dc3545}*.text-green{color:#28a745}*.text-blue{color:#007bff}.text-decoration-overline{text-decoration:overline}.text-decoration-line-through{text-decoration:line-through}.text-decoration-underline{text-decoration:underline}.text-decoration-underline-overline{text-decoration:underline overline}a.text-decoration-overline:hover,button.text-decoration-overline:hover{text-decoration:overline}a.text-decoration-line-through:hover,button.text-decoration-line-through:hover{text-decoration:line-through}a.text-decoration-underline:hover,button.text-decoration-underline:hover{text-decoration:underline}a.text-decoration-underline-overline:hover,button.text-decoration-underline-overline:hover{text-decoration:underline overline}.stroke-text{color:#131517;-webkit-text-fill-color:transparent;-webkit-text-stroke-width:1.0px;-webkit-text-stroke-color:#131517}@media (min-width: 768px){.stroke-text{-webkit-text-stroke-width:1.2px}}@media (min-width: 992px){.stroke-text{-webkit-text-stroke-width:1.4px}}div[class^='bg-black'] .stroke-text,div[class*=' bg-black'] .stroke-text,div[class^='bg-dark'] .stroke-text,div[class*=' bg-dark'] .stroke-text{color:#fff;-webkit-text-stroke-color:#fff}div[class^='bg-black'] div[class^='bg-white'],div[class^='bg-black'] div[class*=' bg-white'],div[class*=' bg-black'] div[class^='bg-white'],div[class*=' bg-black'] div[class*=' bg-white'],div[class^='bg-dark'] div[class^='bg-white'],div[class^='bg-dark'] div[class*=' bg-white'],div[class*=' bg-dark'] div[class^='bg-white'],div[class*=' bg-dark'] div[class*=' bg-white']{color:#131517;-webkit-text-stroke-color:#131517}.fancy-text{-webkit-text-fill-color:transparent;-webkit-text-stroke-width:1.0px;-webkit-text-stroke-color:#131517;-webkit-text-shadow:3px 3px 0 #dbdddf;text-shadow:3px 3px 0 #dbdddf}@media (min-width: 768px){.fancy-text{-webkit-text-stroke-width:1.2px}}@media (min-width: 992px){.fancy-text{-webkit-text-stroke-width:1.4px}}.fancy-text.display-1,.fancy-text.display-2,.fancy-text.display-3{-webkit-text-shadow:4px 4px 0 #dbdddf;text-shadow:4px 4px 0 #dbdddf}@media (min-width: 768px){.fancy-text.display-1,.fancy-text.display-2,.fancy-text.display-3{-webkit-text-shadow:5px 5px 0 #dbdddf;text-shadow:5px 5px 0 #dbdddf}.fancy-text.display-4{-webkit-text-shadow:4px 4px 0 #dbdddf;text-shadow:4px 4px 0 #dbdddf}}div[class^='bg-black'] .fancy-text,div[class*=' bg-black'] .fancy-text,div[class^='bg-dark'] .fancy-text,div[class*=' bg-dark'] .fancy-text{color:#fff;-webkit-text-stroke-color:#fff;-webkit-text-shadow:3px 3px 0 #2e3032;text-shadow:3px 3px 0 #2e3032}div[class^='bg-black'] .fancy-text.display-1,div[class^='bg-black'] .fancy-text.display-2,div[class^='bg-black'] .fancy-text.display-3,div[class*=' bg-black'] .fancy-text.display-1,div[class*=' bg-black'] .fancy-text.display-2,div[class*=' bg-black'] .fancy-text.display-3,div[class^='bg-dark'] .fancy-text.display-1,div[class^='bg-dark'] .fancy-text.display-2,div[class^='bg-dark'] .fancy-text.display-3,div[class*=' bg-dark'] .fancy-text.display-1,div[class*=' bg-dark'] .fancy-text.display-2,div[class*=' bg-dark'] .fancy-text.display-3{-webkit-text-shadow:4px 4px 0 #2e3032;text-shadow:4px 4px 0 #2e3032}@media (min-width: 768px){div[class^='bg-black'] .fancy-text.display-1,div[class^='bg-black'] .fancy-text.display-2,div[class^='bg-black'] .fancy-text.display-3,div[class*=' bg-black'] .fancy-text.display-1,div[class*=' bg-black'] .fancy-text.display-2,div[class*=' bg-black'] .fancy-text.display-3,div[class^='bg-dark'] .fancy-text.display-1,div[class^='bg-dark'] .fancy-text.display-2,div[class^='bg-dark'] .fancy-text.display-3,div[class*=' bg-dark'] .fancy-text.display-1,div[class*=' bg-dark'] .fancy-text.display-2,div[class*=' bg-dark'] .fancy-text.display-3{-webkit-text-shadow:5px 5px 0 #2e3032;text-shadow:5px 5px 0 #2e3032}div[class^='bg-black'] .fancy-text.display-4,div[class*=' bg-black'] .fancy-text.display-4,div[class^='bg-dark'] .fancy-text.display-4,div[class*=' bg-dark'] .fancy-text.display-4{-webkit-text-shadow:4px 4px 0 #2e3032;text-shadow:4px 4px 0 #2e3032}}div[class^='bg-black'] div[class^='bg-white'] .fancy-text,div[class^='bg-black'] div[class*=' bg-white'] .fancy-text,div[class*=' bg-black'] div[class^='bg-white'] .fancy-text,div[class*=' bg-black'] div[class*=' bg-white'] .fancy-text,div[class^='bg-dark'] div[class^='bg-white'] .fancy-text,div[class^='bg-dark'] div[class*=' bg-white'] .fancy-text,div[class*=' bg-dark'] div[class^='bg-white'] .fancy-text,div[class*=' bg-dark'] div[class*=' bg-white'] .fancy-text{color:#131517;-webkit-text-stroke-color:#131517;-webkit-text-shadow:3px 3px 0 #dbdddf;text-shadow:3px 3px 0 #dbdddf}div[class^='bg-black'] div[class^='bg-white'] .fancy-text.display-1,div[class^='bg-black'] div[class^='bg-white'] .fancy-text.display-2,div[class^='bg-black'] div[class^='bg-white'] .fancy-text.display-3,div[class^='bg-black'] div[class*=' bg-white'] .fancy-text.display-1,div[class^='bg-black'] div[class*=' bg-white'] .fancy-text.display-2,div[class^='bg-black'] div[class*=' bg-white'] .fancy-text.display-3,div[class*=' bg-black'] div[class^='bg-white'] .fancy-text.display-1,div[class*=' bg-black'] div[class^='bg-white'] .fancy-text.display-2,div[class*=' bg-black'] div[class^='bg-white'] .fancy-text.display-3,div[class*=' bg-black'] div[class*=' bg-white'] .fancy-text.display-1,div[class*=' bg-black'] div[class*=' bg-white'] .fancy-text.display-2,div[class*=' bg-black'] div[class*=' bg-white'] .fancy-text.display-3,div[class^='bg-dark'] div[class^='bg-white'] .fancy-text.display-1,div[class^='bg-dark'] div[class^='bg-white'] .fancy-text.display-2,div[class^='bg-dark'] div[class^='bg-white'] .fancy-text.display-3,div[class^='bg-dark'] div[class*=' bg-white'] .fancy-text.display-1,div[class^='bg-dark'] div[class*=' bg-white'] .fancy-text.display-2,div[class^='bg-dark'] div[class*=' bg-white'] .fancy-text.display-3,div[class*=' bg-dark'] div[class^='bg-white'] .fancy-text.display-1,div[class*=' bg-dark'] div[class^='bg-white'] .fancy-text.display-2,div[class*=' bg-dark'] div[class^='bg-white'] .fancy-text.display-3,div[class*=' bg-dark'] div[class*=' bg-white'] .fancy-text.display-1,div[class*=' bg-dark'] div[class*=' bg-white'] .fancy-text.display-2,div[class*=' bg-dark'] div[class*=' bg-white'] .fancy-text.display-3{-webkit-text-shadow:4px 4px 0 #dbdddf;text-shadow:4px 4px 0 #dbdddf}@media (min-width: 768px){div[class^='bg-black'] div[class^='bg-white'] .fancy-text.display-1,div[class^='bg-black'] div[class^='bg-white'] .fancy-text.display-2,div[class^='bg-black'] div[class^='bg-white'] .fancy-text.display-3,div[class^='bg-black'] div[class*=' bg-white'] .fancy-text.display-1,div[class^='bg-black'] div[class*=' bg-white'] .fancy-text.display-2,div[class^='bg-black'] div[class*=' bg-white'] .fancy-text.display-3,div[class*=' bg-black'] div[class^='bg-white'] .fancy-text.display-1,div[class*=' bg-black'] div[class^='bg-white'] .fancy-text.display-2,div[class*=' bg-black'] div[class^='bg-white'] .fancy-text.display-3,div[class*=' bg-black'] div[class*=' bg-white'] .fancy-text.display-1,div[class*=' bg-black'] div[class*=' bg-white'] .fancy-text.display-2,div[class*=' bg-black'] div[class*=' bg-white'] .fancy-text.display-3,div[class^='bg-dark'] div[class^='bg-white'] .fancy-text.display-1,div[class^='bg-dark'] div[class^='bg-white'] .fancy-text.display-2,div[class^='bg-dark'] div[class^='bg-white'] .fancy-text.display-3,div[class^='bg-dark'] div[class*=' bg-white'] .fancy-text.display-1,div[class^='bg-dark'] div[class*=' bg-white'] .fancy-text.display-2,div[class^='bg-dark'] div[class*=' bg-white'] .fancy-text.display-3,div[class*=' bg-dark'] div[class^='bg-white'] .fancy-text.display-1,div[class*=' bg-dark'] div[class^='bg-white'] .fancy-text.display-2,div[class*=' bg-dark'] div[class^='bg-white'] .fancy-text.display-3,div[class*=' bg-dark'] div[class*=' bg-white'] .fancy-text.display-1,div[class*=' bg-dark'] div[class*=' bg-white'] .fancy-text.display-2,div[class*=' bg-dark'] div[class*=' bg-white'] .fancy-text.display-3{-webkit-text-shadow:5px 5px 0 #dbdddf;text-shadow:5px 5px 0 #dbdddf}div[class^='bg-black'] div[class^='bg-white'] .fancy-text.display-4,div[class^='bg-black'] div[class*=' bg-white'] .fancy-text.display-4,div[class*=' bg-black'] div[class^='bg-white'] .fancy-text.display-4,div[class*=' bg-black'] div[class*=' bg-white'] .fancy-text.display-4,div[class^='bg-dark'] div[class^='bg-white'] .fancy-text.display-4,div[class^='bg-dark'] div[class*=' bg-white'] .fancy-text.display-4,div[class*=' bg-dark'] div[class^='bg-white'] .fancy-text.display-4,div[class*=' bg-dark'] div[class*=' bg-white'] .fancy-text.display-4{-webkit-text-shadow:4px 4px 0 #dbdddf;text-shadow:4px 4px 0 #dbdddf}}.border-all,.border-top,.border-right,.border-bottom,.border-left{border-width:0;border-style:solid;border-color:rgba(0,0,0,0.1) !important}.border-all{border-width:1px}.border-top{border-top-width:1px}.border-right{border-right-width:1px}.border-bottom{border-bottom-width:1px}.border-left{border-left-width:1px}div[class^='bg-black'] .border-all,div[class^='bg-black'] .border-top,div[class^='bg-black'] .border-right,div[class^='bg-black'] .border-bottom,div[class^='bg-black'] .border-left,div[class*=' bg-black'] .border-all,div[class*=' bg-black'] .border-top,div[class*=' bg-black'] .border-right,div[class*=' bg-black'] .border-bottom,div[class*=' bg-black'] .border-left,div[class^='bg-dark'] .border-all,div[class^='bg-dark'] .border-top,div[class^='bg-dark'] .border-right,div[class^='bg-dark'] .border-bottom,div[class^='bg-dark'] .border-left,div[class*=' bg-dark'] .border-all,div[class*=' bg-dark'] .border-top,div[class*=' bg-dark'] .border-right,div[class*=' bg-dark'] .border-bottom,div[class*=' bg-dark'] .border-left{border-color:rgba(255,255,255,0.2) !important}.border-style-dotted{border-style:dotted !important}.border-style-dashed{border-style:dashed !important}.margin-top-10{margin-top:10px}.margin-top-20{margin-top:20px}.margin-top-30{margin-top:30px}.margin-top-40{margin-top:40px}.margin-top-50{margin-top:50px}.margin-top-60{margin-top:60px}.margin-top-70{margin-top:70px}.margin-right-10{margin-right:10px}.margin-right-20{margin-right:20px}.margin-right-30{margin-right:30px}.margin-left-10{margin-left:10px}.margin-left-20{margin-left:20px}.margin-left-30{margin-left:30px}.margin-bottom-10{margin-bottom:10px}.margin-bottom-20{margin-bottom:20px}.margin-bottom-30{margin-bottom:30px}.margin-bottom-40{margin-bottom:40px}.margin-bottom-50{margin-bottom:50px}.margin-bottom-60{margin-bottom:60px}.margin-bottom-70{margin-bottom:70px}@media (min-width: 768px){.margin-md-top-10{margin-top:10px}.margin-md-top-20{margin-top:20px}.margin-md-top-30{margin-top:30px}.margin-md-top-40{margin-top:40px}.margin-md-top-50{margin-top:50px}.margin-md-top-60{margin-top:60px}.margin-md-top-70{margin-top:70px}.margin-md-right-10{margin-right:10px}.margin-md-right-20{margin-right:20px}.margin-md-right-30{margin-right:30px}.margin-md-left-10{margin-left:10px}.margin-md-left-20{margin-left:20px}.margin-md-left-30{margin-left:30px}.margin-md-bottom-10{margin-bottom:10px}.margin-md-bottom-20{margin-bottom:20px}.margin-md-bottom-30{margin-bottom:30px}.margin-md-bottom-40{margin-bottom:40px}.margin-md-bottom-50{margin-bottom:50px}.margin-md-bottom-60{margin-bottom:60px}.margin-md-bottom-70{margin-bottom:70px}}@media (min-width: 992px){.margin-lg-top-10{margin-top:10px}.margin-lg-top-20{margin-top:20px}.margin-lg-top-30{margin-top:30px}.margin-lg-top-40{margin-top:40px}.margin-lg-top-50{margin-top:50px}.margin-lg-top-60{margin-top:60px}.margin-lg-top-70{margin-top:70px}.margin-lg-right-10{margin-right:10px}.margin-lg-right-20{margin-right:20px}.margin-lg-right-30{margin-right:30px}.margin-lg-left-10{margin-left:10px}.margin-lg-left-20{margin-left:20px}.margin-lg-left-30{margin-left:30px}.margin-lg-bottom-10{margin-bottom:10px}.margin-lg-bottom-20{margin-bottom:20px}.margin-lg-bottom-30{margin-bottom:30px}.margin-lg-bottom-40{margin-bottom:40px}.margin-lg-bottom-50{margin-bottom:50px}.margin-lg-bottom-60{margin-bottom:60px}.margin-lg-bottom-70{margin-bottom:70px}}@media (min-width: 1200px){.margin-xl-top-10{margin-top:10px}.margin-xl-top-20{margin-top:20px}.margin-xl-top-30{margin-top:30px}.margin-xl-top-40{margin-top:40px}.margin-xl-top-50{margin-top:50px}.margin-xl-top-60{margin-top:60px}.margin-xl-top-70{margin-top:70px}.margin-xl-right-10{margin-right:10px}.margin-xl-right-20{margin-right:20px}.margin-xl-right-30{margin-right:30px}.margin-xl-left-10{margin-left:10px}.margin-xl-left-20{margin-left:20px}.margin-xl-left-30{margin-left:30px}.margin-xl-bottom-10{margin-bottom:10px}.margin-xl-bottom-20{margin-bottom:20px}.margin-xl-bottom-30{margin-bottom:30px}.margin-xl-bottom-40{margin-bottom:40px}.margin-xl-bottom-50{margin-bottom:50px}.margin-xl-bottom-60{margin-bottom:60px}.margin-xl-bottom-70{margin-bottom:70px}}.margin-0{margin:0 !important}@media (min-width: 768px){.margin-md-0{margin:0 !important}}@media (min-width: 992px){.margin-lg-0{margin:0 !important}}@media (min-width: 1200px){.margin-xl-0{margin:0 !important}}.padding-10{padding:10px}.padding-20{padding:20px}.padding-30{padding:30px}.padding-40{padding:40px}.padding-50{padding:50px}.padding-60{padding:60px}.padding-70{padding:70px}.padding-x-10{padding-left:10px;padding-right:10px}.padding-x-20{padding-left:20px;padding-right:20px}.padding-x-30{padding-left:30px;padding-right:30px}.padding-x-40{padding-left:40px;padding-right:40px}.padding-x-50{padding-left:50px;padding-right:50px}.padding-x-60{padding-left:60px;padding-right:60px}.padding-x-70{padding-left:70px;padding-right:70px}.padding-y-10{padding-top:10px;padding-bottom:10px}.padding-y-20{padding-top:20px;padding-bottom:20px}.padding-y-30{padding-top:30px;padding-bottom:30px}.padding-y-40{padding-top:40px;padding-bottom:40px}.padding-y-50{padding-top:50px;padding-bottom:50px}.padding-y-60{padding-top:60px;padding-bottom:60px}.padding-y-70{padding-top:70px;padding-bottom:70px}@media (min-width: 768px){.padding-md-10{padding:10px}.padding-md-20{padding:20px}.padding-md-30{padding:30px}.padding-md-40{padding:40px}.padding-md-50{padding:50px}.padding-md-60{padding:60px}.padding-md-70{padding:70px}.padding-x-md-10{padding-left:10px;padding-right:10px}.padding-x-md-20{padding-left:20px;padding-right:20px}.padding-x-md-30{padding-left:30px;padding-right:30px}.padding-x-md-40{padding-left:40px;padding-right:40px}.padding-x-md-50{padding-left:50px;padding-right:50px}.padding-x-md-60{padding-left:60px;padding-right:60px}.padding-x-md-70{padding-left:70px;padding-right:70px}.padding-y-md-10{padding-top:10px;padding-bottom:10px}.padding-y-md-20{padding-top:20px;padding-bottom:20px}.padding-y-md-30{padding-top:30px;padding-bottom:30px}.padding-y-md-40{padding-top:40px;padding-bottom:40px}.padding-y-md-50{padding-top:50px;padding-bottom:50px}.padding-y-md-60{padding-top:60px;padding-bottom:60px}.padding-y-md-70{padding-top:70px;padding-bottom:70px}}@media (min-width: 992px){.padding-lg-10{padding:10px}.padding-lg-20{padding:20px}.padding-lg-30{padding:30px}.padding-lg-40{padding:40px}.padding-lg-50{padding:50px}.padding-lg-60{padding:60px}.padding-lg-70{padding:70px}.padding-x-lg-10{padding-left:10px;padding-right:10px}.padding-x-lg-20{padding-left:20px;padding-right:20px}.padding-x-lg-30{padding-left:30px;padding-right:30px}.padding-x-lg-40{padding-left:40px;padding-right:40px}.padding-x-lg-50{padding-left:50px;padding-right:50px}.padding-x-lg-60{padding-left:60px;padding-right:60px}.padding-x-lg-70{padding-left:70px;padding-right:70px}.padding-y-lg-10{padding-top:10px;padding-bottom:10px}.padding-y-lg-20{padding-top:20px;padding-bottom:20px}.padding-y-lg-30{padding-top:30px;padding-bottom:30px}.padding-y-lg-40{padding-top:40px;padding-bottom:40px}.padding-y-lg-50{padding-top:50px;padding-bottom:50px}.padding-y-lg-60{padding-top:60px;padding-bottom:60px}.padding-y-lg-70{padding-top:70px;padding-bottom:70px}}@media (min-width: 1200px){.padding-xl-10{padding:10px}.padding-xl-20{padding:20px}.padding-xl-30{padding:30px}.padding-xl-40{padding:40px}.padding-xl-50{padding:50px}.padding-xl-60{padding:60px}.padding-xl-70{padding:70px}.padding-x-xl-10{padding-left:10px;padding-right:10px}.padding-x-xl-20{padding-left:20px;padding-right:20px}.padding-x-xl-30{padding-left:30px;padding-right:30px}.padding-x-xl-40{padding-left:40px;padding-right:40px}.padding-x-xl-50{padding-left:50px;padding-right:50px}.padding-x-xl-60{padding-left:60px;padding-right:60px}.padding-x-xl-70{padding-left:70px;padding-right:70px}.padding-y-xl-10{padding-top:10px;padding-bottom:10px}.padding-y-xl-20{padding-top:20px;padding-bottom:20px}.padding-y-xl-30{padding-top:30px;padding-bottom:30px}.padding-y-xl-40{padding-top:40px;padding-bottom:40px}.padding-y-xl-50{padding-top:50px;padding-bottom:50px}.padding-y-xl-60{padding-top:60px;padding-bottom:60px}.padding-y-xl-70{padding-top:70px;padding-bottom:70px}}.padding-0{padding:0 !important}.padding-top-0{padding-top:0 !important}.padding-right-0{padding-right:0 !important}.padding-bottom-0{padding-bottom:0 !important}.padding-left-0{padding-left:0 !important} |