@charset "UTF-8";
 .label-new.menu-item>a:after,
.label-plus.menu-item>a:after {
background: linear-gradient(132deg, #9f6aec 0, #79c3fa 76.2%)
}
.blue,
.blue .material-icons,
.blue h1,
.blue h2,
.blue h3,
.blue h4,
.blue h5,
.blue p,
.dark .blue h1,
.dark .blue h2,
.dark .blue h3,
.dark .blue h4,
.dark .blue h5,
.dark .blue p,
.nav-vertical>li>ul li a {
color: #3381f7
}
.badge-pastel span,
.badge-pastel-dark span,
.badge-pink span,
.badge-turquoise span,
.badge-yellow span {
color: #171717;
border-radius: 99px;
margin: auto 5px auto auto;
padding: 10px 20px;
font-size: 90%
}
.button.button-pastel,
.button.white:not(.is-link):not(.is-underline),
.white.is-outline:hover {
color: #171717 !important
}
.badge-yellow span {
background: #ffe6b6
}
.badge-pink span {
background: #f2c8e2
}
.badge-turquoise span {
background: #b2fbe3
}
.badge-pastel span {
background: #dfdcd8
}
.badge-pastel-dark span {
background: #dad7d3
}
.badge-pastel-purple span {
background: #f1e9fc;
color: #aa70ff;
border-radius: 99px;
margin: auto 5px auto auto;
padding: 10px 20px;
font-size: 90%
}
.badge-black-transparant span,
.badge-white-transparant span {
color: #fff;
margin: auto 5px auto auto;
padding: 10px 20px;
font-size: 90%;
border-radius: 99px
}
.badge-white-transparant span {
background: rgb(255 255 255 / .2)
}
.badge-black-transparant span {
background: rgb(0 0 0 / .2)
}
.round-corners,
.round-corners .box-image,
.round-corners .col-inner,
.round-corners .fill,
.round-corners .flickity-viewport,
.round-corners .slider,
.single-post .entry-image img {
border-radius: 30px
}
.blog-wrapper .image-cover,
.custom-blog .box-image,
.round-corners-top,
.round-corners-top .box-image,
.round-corners-top .col-inner,
.round-corners-top .fill,
.round-corners-top .flickity-viewport,
.round-corners-top .slider,
.round-corners-top img {
border-radius: 30px 30px 0 0
}
.custom-blog .box-text.text-left,
.round-corners-bottom,
.round-corners-bottom .box-image,
.round-corners-bottom .fill,
.round-corners-bottom .flickity-viewport,
.round-corners-top .slider,
.round-corners-topo.col-inner {
border-radius: 0 0 30px 30px
}
.section-round-top .fill {
border-radius: 70px 70px 0 0 !important
}
.section-round-bottom .fill {
border-radius: 0 0 70px 70px !important
}
.section-round .fill {
border-radius: 70px !important
}
.button,
.button.alt,
.product-title,
body,
button,
input[type=button],
input[type=reset],
input[type=submit],
th {
font-family: remixicon, Manrope, Helvetica, sans-serif !important;
font-weight: 400 !important
}
.mobile-sidebar-levels-2 .nav>li>ul>li>a,
.nav-dropdown>li>a,
.nav>li>a,
.widget .current-cat>a {
font-family: remixicon, Manrope, Helvetica, sans-serif !important;
font-weight: 400 !important;
color: #343f4b
}
.heading-font,
.hero-vacatures .product-title,
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: remixicon, neulis-neue, sans-serif !important;
font-weight: 700 !important;
font-style: normal !important
}
#resizer:after,
.icon-certificate:before,
.icon-expand:before,
.icon-search:before {
font-family: remixicon !important
}
.accordion-title,
b,
span.widget-title,
strong {
font-family: Syne, Helvetica, sans-serif;
font-weight: 600;
opacity: 1;
line-height: 1.2
}
.accordion-title.active,
.badge-inner,
.breadcrumbs,
.button,
.button.alt,
.custom-breadcrumbs .icon-box-text,
b,
button,
input[type=button],
input[type=reset],
input[type=submit],
label,
legend,
span.amount,
span.widget-title,
th {
font-weight: 600
}
.alt,
.alt h1,
.alt h2,
.alt h3,
.alt h4 {
font-family: remixicon, manrope-medium, Helvetica, sans-serif !important;
font-weight: 400 !important
}
.h1,
.h2,
.h3,
.h4,
.headline {
font-weight: 700;
text-rendering: optimizeSpeed;
margin-top: 0
}
.tagline p,
p.tagline {
font-family: remixicon, Manrope, Helvetica, sans-serif !important;
font-weight: 400 !important;
text-transform: uppercase;
letter-spacing: .1em;
font-size: 80%;
margin-bottom: 10px
}
.headline,
.uppercase,
h6,
span.widget-title,
th {
letter-spacing: 0
}
.no-margin h1,
.no-margin h2,
.no-margin h3 {
margin: 0 !important
}
.collapse h1,
.collapse h2,
.collapse h3,
.collapse h4,
.collapse h5,
.collapse p,
.collapse.headline,
.headline.collapse {
margin-bottom: 0
}
.less-lineheight h1,
.less-lineheight h2,
.less-lineheight h3 {
line-height: 105%
}
.breadcrumbs,
.nav-vertical>li>ul li a:hover,
.searchform .button.icon i {
color: #1c284e
}
.headline {
font-family: remixicon, neulis-neue, sans-serif;
font-style: normal;
text-transform: none;
margin-bottom: .6em;
line-height: 1.2
}
.label-hot.menu-item>a:after,
.label-new.menu-item>a:after,
.label-plus.menu-item>a:after,
.label-popular.menu-item>a:after,
.label-sale.menu-item>a:after {
text-transform: uppercase;
font-size: 9px;
font-weight: bolder;
padding: 4px 10px;
border-radius: 99px;
line-height: 12px;
top: -2px;
letter-spacing: .05em;
margin-left: 4px;
display: inline-block;
position: relative
}
.label-new.menu-item>a:after {
content: "Hire Us" !important;
color: #fff
}
.label-hot.menu-item>a:after {
content: "Hot !important";
color: #fff
}
.label-sale.menu-item>a:after {
content: "Sale" !important;
color: #fff
}
.label-plus.menu-item>a:after {
content: "New";
color: #fff
}
.button {
border-color: #fff0;
letter-spacing: 0 !important
}
.icon-stacked i,
.icon-stacked-large i {
border-left: 1px solid;
min-height: max-content;
line-height: inherit
}
.button.is-large {
font-size: 100%;
padding: 5px 20px
}
.button.is-link.is-larger {
line-height: 0;
min-height: inherit
}
.button.button-pastel {
background-color: #dfdcd8 !important
}
.button.button-gradient,
.header-button .primary {
color: #fff !important;
border: 0;
background: linear-gradient(132deg, #9f6aec 0, #79c3fa 76.2%)
}
.button.secondary:not(.is-link):not(.is-underline) {
color: #171717
}
.checkout-button.button,
.checkout-button.button:hover {
background-color: #35ce9d !important;
color: #171717;
padding: 5px 0
}
.button,
button,
input[type=button],
input[type=reset],
input[type=submit] {
margin-right: .2em
}
.button.is-outline,
input[type=button].is-outline,
input[type=reset].is-outline,
input[type=submit].is-outline {
border: 1.5px solid
}
.accordion-item .toggle i {
font-size: 1em
}
.dark .accordion-item {
background: #262626
}
.accordion-item {
background: #dfdcd8;
margin-bottom: 10px;
border-radius: 10px;
padding: 20px
}
.accordion-title {
border-top: 0;
font-size: 100%
}
.accordion-title.active,
.mobile-sidebar-levels-2 .nav-slide>li>.sub-menu>li:not(.nav-slide-header).active,
.mobile-sidebar-levels-2 .nav-slide>li>.sub-menu>li:not(.nav-slide-header):hover,
.mobile-sidebar-levels-2 .nav-slide>li>ul.children>li:not(.nav-slide-header).active,
.mobile-sidebar-levels-2 .nav-slide>li>ul.children>li:not(.nav-slide-header):hover,
.nav-sidebar.nav-vertical>li.menu-item.active,
.nav-sidebar.nav-vertical>li.menu-item:hover {
background-color: #fff0
}
.accordion-inner {
padding: 1em
}
.custom-menu .ux-menu-link__link {
font-size: 95%;
background: #f3f9fd !important;
margin-bottom: 15px;
margin-right: 15px;
padding: 22px;
border-radius: 20px
}
.box-shadow-1,
.nav-dropdown-has-shadow .nav-dropdown,
.row-box-shadow-1>.col>.col-inner {
box-shadow: 2px 1px 20px rgb(41 52 98 / .08)
}
.text-gradient h3 {
background: #fff7eb;
background: linear-gradient(80deg, #3f8efc 0, #ad06bd 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: #fff0
}
.gradient-col .col-inner,
.gradient-section {
background: linear-gradient(180deg, #79c3fa 0, #9f6aec 100%)
}
.green-gradient>.col-inner {
background: linear-gradient(180deg, #35ce9d 0, #29a57d 100%)
}
.blue-gradient>.col-inner {
background: #3381f7;
background: linear-gradient(90deg, #3381f7 0, #1c284e 100%)
}
.purple-gradient>.col-inner {
background: #ecbbfa;
background: linear-gradient(180deg, #db7ffa 0, #370647 100%)
}
.yellow-gradient>.col-inner {
background: linear-gradient(180deg, #ffc353 0, #cf8700 100%)
}
ol li {
margin-bottom: 20px
}
ul.menu>li.current-menu-item>a {
color: #ccc !important
}
.section-bottom {
align-items: flex-end
}
.stroke span {
background: linear-gradient(0deg, #fff0 0, #fff0 16%, #f3654a 16%, #f3654a 41%, #fff0 41%);
padding: 0 .2em;
box-decoration-break: clone;
-webkit-box-decoration-break: clone
}
.nav li.has-icon-left>a>i,
.nav li.has-icon-left>a>img,
.nav li.has-icon-left>a>svg {
fill: currentColor
}
.col-round-shadow>* {
border-radius: 8px;
box-shadow: 1px 1px 39px 0 rgb(32 27 61 / .07)
}
.banner-round .banner-bg.fill,
.banner-round .banner-inner,
.banner-round .fill,
.banner.banner-round {
border-radius: 20px
}
.col-round>* {
border-radius: 8px
}
.dark,
.dark .nav-vertical li li.menu-item-has-children>a,
.dark .nav-vertical>li>ul li a,
.dark .nav>li.html,
.dark .nav>li>a,
.dark p,
.dark td,
.nav-dark .is-outline,
.nav-dark .nav>li>a,
.nav-dark .nav>li>button,
.nav-dropdown.dark .nav-column>li>a,
.nav-dropdown.dark>li>a {
color: #fff
}
ul li.bullet-arrow:before,
ul li.bullet-checkmark:before {
color: #898989;
font-weight: 400;
letter-spacing: normal;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
-webkit-font-feature-settings: liga;
-moz-osx-font-smoothing: grayscale;
font-family: 'Material Icons' !important;
text-transform: none;
font-style: normal;
-webkit-font-smoothing: antialiased
}
.absolute-footer,
html {
background-color: #fff
}
::selection {
background: #000;
color: #fff
}
.box-overlay.dark .box-text,
.box-shade.dark .box-text {
text-shadow: none
}
.box-text {
font-size: 100%
}
.index-up,
.index-up .col-inner {
z-index: 9
}
.col-move .col-inner:hover {
-ms-transform: translateY(-6px);
transform: translateY(-6px)
}
.nav-pagination>li>a,
.nav-pagination>li>span {
line-height: 2.25em;
border: 0
}
.nav-spacing-xlarge>li {
margin: 0 18px !important
}
.header-block {
width: auto
}
.header-shadow .header-wrapper,
.header-wrapper.stuck,
.layout-shadow #wrapper {
-webkit-box-shadow: none;
box-shadow: none
}
.header-main .social-icons i {
color: #6e6e70
}
.header-top {
background-color: #fff !important;
border-bottom: 1px solid #d1d9dd
}
.nav-line-bottom>li>a:before,
.nav-line-grow>li>a:before,
.nav-line>li>a:before {
height: .12em
}
span.header-vertical-menu__title {
text-transform: uppercase;
letter-spacing: 2px;
font-size: 72%;
text-align: center
}
.header-vertical-menu .sub-menu {
background: #f9f9f9;
height: -webkit-fill-available;
margin-top: 0 !important
}
li:not(.menu-item-design-full-width) .sub-menu {
margin-top: 9px
}
.header-vertical-menu__fly-out .nav-vertical-fly-out>li.menu-item>a {
padding: 15px
}
.v-align-bottom .col-inner {
display: flex;
flex-direction: column;
justify-content: space-between
}
.col-height-300 .col-inner {
min-height: 300px
}
.col-height-500 .col-inner {
min-height: 500px
}
input[type=search] {
border-radius: 20px 0 0 20px;
font-size: .97em
}
button.ux-search-submit {
border-radius: 0 20px 20px 0
}
.rotate {
animation: 10s linear infinite rotate
}
@keyframes rotate {
to {
transform: rotate(360deg)
}
}
.home-hero .searchform-wrapper {
width: 60%
}
.map-responsive {
overflow: hidden;
padding-bottom: 45%;
position: relative;
height: 200px
}
.map-responsive iframe {
left: 0;
top: 0;
height: 50%;
width: 100%;
position: absolute
}
.single-post .entry-header-text {
padding: 5% 10%;
text-align: center
}
.blog-wrapper .box-text {
background-color: #fff;
border-radius: 0 0 30px 30px;
padding: 40px 35px 10px
}
.blog-archive .box-text {
padding-top: 0 !important
}
.blog-archive .widget .is-divider,
.box-blog-post .is-divider,
.single-post .is-divider {
display: none;
visibility: hidden
}
.blog-single .social-icons {
color: #3381f7 !important
}
.custom-blog .box-text .box-text-inner {
height: 220px;
display: flex;
flex-direction: column;
justify-content: center
}
.badge-outline .badge-inner {
background-color: #3381f7 !important;
border: 0 solid currentColor;
color: #1c284e !important
}
.post-item .badge-inner {
color: #1c284e !important
}
.blog-wrapper .box-text .box-text-inner {
height: 180px;
display: flex;
flex-direction: column;
justify-content: center
}
.col.post-item {
display: -webkit-box;
display: -ms-flexbox;
display: flex
}
.blog-archive .large-10 {
max-width: 100%;
-ms-flex-preferred-size: 100%;
flex-basis: 100%
}
.post-item a:hover {
color: currentColor
}
.box-blog-post .post-title,
.custom-blog .post-title {
padding: 0 !important
}
.blog-single .post-title,
.box-blog-post .post-title {
padding: 10px 0;
font-size: 140%
}
.box-blog-post .from_the_blog_excerpt,
blog .from_the_blog_excerpt {
padding-top: 10px;
font-size: 90%
}
[data-animate=fadeInUp] {
-webkit-transform: none;
transform: none
}
[data-animate=bounceInUp] {
opacity: 0;
-webkit-transform: translate3d(0, 80px, 0);
transform: translate3d(0, 80px, 0);
-webkit-transition: opacity 1s cubic-bezier(.4, .6, .2, 1), -webkit-transform 1s cubic-bezier(.4, .6, .2, 1);
transition: opacity 1s cubic-bezier(.4, .6, .2, 1), transform 1s cubic-bezier(.4, .6, .2, 1), -webkit-transform 1s cubic-bezier(.4, .6, .2, 1)
}
[data-animated=true] {
opacity: 1;
-webkit-transform: translateZ(0);
transform: translateZ(0)
}
.label-hot.menu-item>a:after,
.label-new.menu-item>a:after,
.label-popular.menu-item>a:after,
.label-sale.menu-item>a:after {
font-size: 10px;
line-height: 12px;
padding: 5px;
top: 1px;
letter-spacing: .05em
}
.label-new.menu-item>a:after {
background-color: #18c08b
}
.label-hot.menu-item>a:after {
background-color: #27a1c8
}
.label-sale.menu-item>a:after {
background-color: #fc3864
}
.badge+.badge {
opacity: 1;
width: -webkit-fill-available;
height: 2.8em
}
ul li.bullet-arrow,
ul li.bullet-checkmark,
ul li.bullet-star {
border: 0
}
ul li.bullet-checkmark:before {
content: "\e86c" !important
}
ul li.bullet-arrow:before {
content: "\e5c8" !important
}
ul li.bullet-star:before {
color: #e838;
content: "\e838" !important;
font-family: 'Material Icons' !important;
font-weight: 400;
font-style: normal;
letter-spacing: normal;
text-transform: none;
display: inline-block;
white-space: nowrap;
word-wrap: normal;
direction: ltr;
-webkit-font-feature-settings: liga;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
.iconwithtext .material-icons {
vertical-align: -4px;
padding-right: 8px
}
.header .icon-menu:before {
content: "\e164" !important;
font-family: 'Material Icons' !important
}
.header .icon-user:before {
content: "" !important;
font-family: 'Material Icons' !important
}
.header .icon-shopping-cart:before {
content: "" !important;
font-family: 'Material Icons' !important
}
.material-icons,
.material-icons-round,
.remixicon,
material-icons-outlined {
font-size: inherit
}
.flatsome-cookies__buttons>a {
margin-right: 10px;
margin-bottom: 10px
}
.flatsome-cookies__buttons {
-ms-flex: 0 0 auto;
flex: 0 0 auto;
font-size: 85%
}
.icon-stacked {
min-height: 3em;
line-height: 3em;
border: 0 !important
}
.icon-stacked i {
padding-left: 1.2em;
margin: 0 0 -2px 15px !important
}
.icon-stacked-large {
min-height: 4em;
line-height: 4em;
border: 0 !important;
padding: 0 1.5em
}
.icon-stacked-large i {
padding-left: 1.5em;
margin: 0 0 -2px 1.5em !important
}
.absolute-footer {
display: none !important;
visibility: hidden !important
}
.custom-footer .col.widget {
padding: 0
}
.custom-footer li.widget {
margin-left: 0
}
.custom-footer .social-icons i {
color: #615d55
}
.custom-footer .ux-menu {
font-size: 90%
}
.mobile-sidebar-levels-2 .nav-slide>li>.sub-menu>li:not(.nav-slide-header)>a,
.mobile-sidebar-levels-2 .nav-slide>li>ul.children>li:not(.nav-slide-header)>a,
.nav-vertical li li.menu-item-has-children>a,
.off-canvas .nav-vertical li a {
font-size: 105%
}
a.sidebar-menu-tabs__tab-link {
font-size: 90% !important
}
.off-canvas-left .mfp-content,
.off-canvas-right .mfp-content {
background: #fff;
transition: transform .7s, -webkit-transform .7s;
box-shadow: none
}
.off-canvas .nav-vertical>li>a {
font-size: 22px;
color: #1c284e;
padding: 15px 0
}
.nav-vertical li li.menu-item-has-children>a {
color: #3381f7;
text-transform: none;
font-size: 100%
}
.off-canvas .nav-vertical li li>a {
padding: 10px 0
}
.nav-vertical li li {
padding-left: 0
}
.off-canvas .toggle {
color: #3381f7 !important;
opacity: 1
}
.off-canvas .toggle i {
font-size: 1.4em
}
.nav-slide-header .toggle {
text-align: center;
text-transform: uppercase;
font-weight: bolder;
min-height: auto;
margin-bottom: 10px
}
.nav-slide-header .toggle i {
position: absolute;
left: 20px;
top: -5px
}
.dark .nav-sidebar.nav-vertical>li+li,
.mobile-sidebar-levels-2 .nav-slide>li>.sub-menu>li:not(.nav-slide-header),
.mobile-sidebar-levels-2 .nav-slide>li>ul.children>li:not(.nav-slide-header),
.nav-sidebar.nav-vertical>li+li,
.nav-vertical li li.menu-item-has-children:not(:first-child),
.off-canvas-left .mfp-content,
.off-canvas-right .mfp-content {
border-top: 1px solid #d9d9d9
}
.mobile-sidebar-levels-1 .nav-slide-header {
margin-bottom: 10px
}
.mobile-sidebar-levels-1 .nav-slide>li>.sub-menu,
.mobile-sidebar-levels-1 .nav-slide>li>ul.children,
.mobile-sidebar-levels-2 .nav-slide>li>.sub-menu,
.mobile-sidebar-levels-2 .nav-slide>li>.sub-menu>li:not(.nav-slide-header)>.sub-menu,
.mobile-sidebar-levels-2 .nav-slide>li>.sub-menu>li:not(.nav-slide-header)>ul.children,
.mobile-sidebar-levels-2 .nav-slide>li>ul.children,
.mobile-sidebar-levels-2 .nav-slide>li>ul.children>li:not(.nav-slide-header)>.sub-menu,
.mobile-sidebar-levels-2 .nav-slide>li>ul.children>li:not(.nav-slide-header)>ul.children {
padding-top: 0
}
.is-current-slide {
padding-top: 10px !important
}
.nav-vertical li li.menu-item-has-children:not(:first-child) {
margin-top: 0
}
@media screen and (max-width:549px) {
.off-canvas-left .mfp-content,
.off-canvas-right .mfp-content {
width: 90%
}
.home-hero .searchform-wrapper {
width: 100%
}
.h1,
.h2 {
font-size: 1.2em
}
.h3 {
font-size: 1em
}
.h4 {
font-size: .9em
}
.yith-wcan-filters.filters-modal {
top: 0 !important
}
}
@media screen and (min-width:550px) {
.off-canvas-left .mfp-content,
.off-canvas-right .mfp-content {
width: 400px
}
}
@media screen and (min-width:1800px) {
.off-canvas-left .mfp-content,
.off-canvas-right .mfp-content {
width: 500px
}
}
@media (min-width:1200px) {
.section.squeeze {
border-left: 30px solid #fff;
border-right: 30px solid #fff
}
}
@media (min-width:849px) {
.header-inner .nav-left {
justify-content: center !important
}
}
@media (max-width:849px) {
.lightbox-content {
padding: 15px
}
.mfp-container {
padding: 80px 20px
}
input[type=search] {
font-size: .97em !important
}
}
@media (max-width:410px) {
input[type=email],
input[type=tel],
input[type=text],
legend,
textarea {
width: 97%
}
}
@media (max-width:390px) {
input[type=email],
input[type=tel],
input[type=text],
legend,
textarea {
width: 92%
}
}
@media (max-width:386px) {
input[type=email],
input[type=tel],
input[type=text],
legend,
textarea {
width: 92%
}
}
@media (max-width:376px) {
input[type=email],
input[type=tel],
input[type=text],
legend,
textarea {
width: 88%
}
}
@media (max-width:360px) {
input[type=email],
input[type=tel],
input[type=text],
legend,
textarea {
width: 84%
}
}
.header-inner.container {
margin-top: 30px;
max-width: 950px;
border-radius: 20px;
padding: 0 30px;
background: rgb(255 255 255 / .54);
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px)
}
.header-main {
padding: 0 15px
}
#resizer {
position: absolute;
display: flex;
align-items: center;
z-index: 5;
top: 0;
left: 50%;
height: 100%;
width: 2px;
background: #fff;
-ms-touch-action: pan-y;
touch-action: pan-y
}
#resizer:after {
background: #ffcd6d;
content: "";
font-style: normal;
-webkit-font-smoothing: antialiased;
display: flex;
justify-content: center;
align-items: center;
color: #171717;
position: absolute;
margin: 0 0 0 -20px;
width: 40px;
height: 40px;
border-radius: 50%;
border: 2px solid #fff
}
.icon-expand:before {
content: "" !important;
font-style: normal;
-webkit-font-smoothing: antialiased
}
.icon-certificate:before {
content: "";
font-style: normal;
-webkit-font-smoothing: antialiased
}
.icon-search:before {
content: "";
font-style: normal;
-webkit-font-smoothing: antialiased
}
@font-face {
font-family: Manrope;
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(https://fonts.gstatic.com/s/manrope/v15/xn7gYHE41ni1AdIRggqxSuXd.woff2) format('woff2');
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F
}
@font-face {
font-family: Manrope;
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(https://fonts.gstatic.com/s/manrope/v15/xn7gYHE41ni1AdIRggexSg.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD
}
.h1,
.h2,
.h3,
.h4 {
font-family: Lato, Helvetica, sans-serif !important;
color: #555;
width: 100%;
margin-bottom: .5em
}
.h1 {
font-size: 1.7em
}
.h2 {
font-size: 1.6em
}
.h3 {
font-size: 1.25em
}
.h4 {
font-size: 1.125em
}
.justify-text {
text-align: justify
}
.whatsapp-button {
position: fixed;
right: 25px;
bottom: 120px;
z-index: 1000;
display: flex;
align-items: center;
justify-content: center;
width: 60px;
height: 60px;
background-color: #25d366;
border-radius: 50%;
box-shadow: 0 4px 8px rgb(0 0 0 / .2);
transition: transform .3s ease-in-out
}
.whatsapp-button img {
width: 35px;
height: 35px
}
.whatsapp-button:hover {
transform: scale(1.1)
}
.container-form {
display: flex;
flex-direction: column;
align-items: flex-start;
width: 100%;
text-align: left
}
.container-form p {
font-size: .9rem;
color: #ccc;
margin-bottom: 1.5rem;
line-height: 1.5
}
.subscribe-form {
display: flex;
flex-direction: column;
gap: 1.5rem;
width: 100%
}
.form-group {
width: 100%
}
.form-input {
width: 100%;
padding: 1.5rem;
font-size: 1rem;
border-radius: 2rem;
background-color: #555;
color: #fff;
transition: background-color .3s;
box-sizing: border-box
}
.form-input::placeholder {
color: #aaa
}
.form-input:focus {
background-color: #666;
outline: 0;
border: none
}
.subscribe-button {
width: 100%;
padding: 1rem;
font-size: 1rem;
font-weight: 500;
color: #fff;
background-color: #000;
border: none;
border-radius: .5rem;
cursor: pointer;
transition: background-color .3s, transform .2s;
box-shadow: 0 4px 6px rgba(0, 0, 0, .2)
}
.subscribe-button:hover {
background-color: #222;
transform: translateY(-2px)
}
.subscribe-button:active {
transform: translateY(0)
}  .form-card-body *,
.form-card-body *::before,
.form-card-body *::after {
box-sizing: border-box;
} .form-card-body {
font-family: inherit;
font-size: 14px;
color: #333;
line-height: 1.6;
padding: 16px 0;
} .form-card-body .field-group {
width: 100%;
margin-bottom: 16px;
}
.form-card-body .field-label {
display: block;
margin-bottom: 5px;
font-size: 13px;
font-weight: 600;
color: #444;
text-transform: none;
letter-spacing: normal;
}
.form-card-body .field-label--bold {
font-weight: 700;
color: #222;
display: block;
margin-bottom: 8px;
} .form-card-body .field-input {
width: 100% !important;
padding: 9px 12px !important;
font-size: 14px !important;
font-family: inherit !important;
color: #333 !important;
background-color: #fff !important;
border: 1px solid #d0d5dd !important;
border-radius: 4px !important;
transition: border-color 0.15s ease, box-shadow 0.15s ease;
appearance: none;
-webkit-appearance: none;
margin: 0 !important;
box-shadow: none !important;
height: auto !important;
}
.form-card-body .field-input:focus {
border-color: #0066cc !important;
outline: none !important;
box-shadow: 0 0 0 3px rgba(0, 102, 204, 0.12) !important;
}
.form-card-body .field-input::placeholder {
color: #aab0ba;
font-size: 13px;
}
.form-card-body textarea.field-input {
resize: vertical !important;
min-height: 90px !important;
}
.form-card-body select.field-input {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23666' d='M6 8L1 3h10z'/%3E%3C/svg%3E") !important;
background-repeat: no-repeat !important;
background-position: right 12px center !important;
padding-right: 34px !important;
cursor: pointer;
} .form-card-body .section-card {
background: #f7f9fb;
border: 1px solid #e4e8ee;
border-radius: 5px;
padding: 18px;
margin-bottom: 14px;
} .form-card-body .check-grid {
display: flex;
flex-wrap: wrap;
gap: 0;
margin-bottom: 4px;
}
.form-card-body .check-col {
flex: 1;
min-width: 200px; padding: 0 12px 0 0;
}
.form-card-body .check-col--bordered {
padding-left: 16px;
border-left: 1px solid #dde2ea;
} @media (max-width: 600px) {
.form-card-body .check-grid {
flex-direction: column;
}
.form-card-body .check-col {
padding: 0;
margin-bottom: 12px;
}
.form-card-body .check-col--bordered {
padding-left: 0;
border-left: none;
border-top: 1px solid #dde2ea;
padding-top: 12px;
}
}
.form-card-body .check-item {
display: flex;
align-items: flex-start; gap: 10px;
margin-bottom: 10px;
line-height: 1;
}
.form-card-body .check-input {
width: 18px !important;
height: 18px !important;
cursor: pointer;
accent-color: #0066cc;
flex-shrink: 0;
border-radius: 4px;
margin: 0 !important; padding: 0 !important;
border: 1px solid #d0d5dd !important;
}
.form-card-body .check-label {
font-size: 14px;
color: #444;
cursor: pointer;
line-height: 1.3;
margin: 0 !important;
padding: 0 !important;
font-weight: 500;
display: inline-block;
padding-top: 1px !important; } .form-card-body .btn {
display: inline-block !important;
padding: 10px 22px !important;
font-size: 14px !important;
font-family: inherit !important;
font-weight: 600 !important;
text-align: center !important;
border: none !important;
border-radius: 4px !important;
cursor: pointer !important;
transition: background-color 0.15s ease, opacity 0.15s ease !important;
text-decoration: none !important;
line-height: 1.4 !important;
margin-right: 0 !important;
letter-spacing: normal !important;
text-transform: none !important;
box-shadow: none !important;
min-height: unset !important;
}
.form-card-body .btn-primary {
background: linear-gradient(132deg, #9f6aec 0, #79c3fa 76.2%) !important;
color: #fff !important;
border: 0 !important;
}
.form-card-body .btn-primary:hover {
background: linear-gradient(132deg, #8d55e0 0, #63b0f0 76.2%) !important;
color: #fff !important;
}
.form-card-body .btn-secondary {
background-color: #6c757d !important;
color: #fff !important;
}
.form-card-body .btn-secondary:hover {
background-color: #5a6268 !important;
color: #fff !important;
}
.form-card-body .btn-success {
background-color: #28a745 !important;
color: #fff !important;
}
.form-card-body .btn-success:hover {
background-color: #218838 !important;
color: #fff !important;
}
.form-card-body .btn-full {
width: 100% !important;
display: block !important;
margin-top: 12px;
}
.form-card-body .btn:disabled {
opacity: 0.6 !important;
cursor: not-allowed !important;
} .form-card-body .form-actions {
display: flex;
justify-content: space-between;
align-items: center;
gap: 12px;
} .form-card-body .hidden {
display: none !important;
}
.form-card-body .mt-3 {
margin-top: 16px;
} .form-card-body #message {
text-align: center;
padding: 10px 14px;
margin-top: 14px;
border-radius: 4px;
font-size: 14px;
}
.form-card-body .error-msg {
background-color: #fde8e8;
color: #9b1c1c;
border: 1px solid #f3b0b0;
border-radius: 4px;
padding: 10px 14px;
margin-top: 10px;
}
.form-card-body .success-msg {
background-color: #e3f9e5;
color: #1a6b2a;
border: 1px solid #a3d9a5;
border-radius: 4px;
padding: 10px 14px;
margin-top: 10px;
} .form-card-body .step-pagination {
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 28px;
padding: 0 20px;
}
.form-card-body .step-item {
display: flex;
flex-direction: column;
align-items: center;
gap: 6px;
position: relative;
z-index: 1;
}
.form-card-body .step-circle {
width: 36px;
height: 36px;
border-radius: 50%;
background-color: #e0e4ea;
color: #888;
font-size: 14px;
font-weight: 700;
display: flex;
align-items: center;
justify-content: center;
transition: background-color 0.3s ease, color 0.3s ease, box-shadow 0.3s ease;
border: 2px solid transparent;
}
.form-card-body .step-text {
font-size: 12px;
color: #999;
font-weight: 500;
transition: color 0.3s ease;
white-space: nowrap;
} .form-card-body .step-line {
flex: 1;
height: 3px;
background-color: #e0e4ea;
margin: 0 12px;
margin-bottom: 22px;
border-radius: 3px;
overflow: hidden;
}
.form-card-body .step-line-fill {
height: 100%;
width: 0%;
background-color: #0066cc;
border-radius: 3px;
transition: width 0.4s ease;
} .form-card-body .step-item.step-active .step-circle {
background-color: #0066cc !important;
color: #fff !important;
box-shadow: 0 2px 8px rgba(0, 102, 204, 0.3) !important;
}
.form-card-body .step-item.step-active .step-text {
color: #0066cc !important;
font-weight: 600 !important;
} .form-card-body .step-item.completed .step-circle {
background-color: #e0e4ea;
color: #888;
border-color: transparent;
box-shadow: none;
}
.form-card-body .step-item.completed .step-text {
color: #999;
font-weight: 500;
} .form-card-body .step-line.filled .step-line-fill {
width: 100%;
} @media (max-width: 549px) {
.form-card-body .check-grid {
flex-direction: column;
}
.form-card-body .check-col--bordered {
border-left: none;
border-top: 1px solid #dde2ea;
padding-left: 0;
padding-top: 8px;
margin-top: 4px;
}
.form-card-body .form-actions {
flex-direction: column-reverse;
gap: 8px;
}
.form-card-body .form-actions .btn {
width: 100% !important;
}
}