/********************************************************
Copyright (c)2012-2022 KOPAGE.COM
All Rights Reserved.
This file is for internal use only,
it should be minified before publishing.
********************************************************/
:root{
--kedit-fsx: 1;
--ui-color-accent: rgba(0,154,246,1); /*blue*/
--ui-color-accent-light: rgba(0,154,246,0.1);
--ui-color-leftmenu: rgba(40,45,55,1);
--ui-color-leftsubmenu: #f5f6f7;
--ui-color-stripes-accent:repeating-linear-gradient(
-45deg,
#1A6AC9,
#2B91E3 20px,
#1A6AC9 20px,
#1A6AC9 50px,
#2B91E3 50px,
#2B91E3 65px
);
--smoothGradient:hsla(0, 0%, 0%, 0) 0%,
hsla(0, 0%, 0%, 0.013) 8.1%,
hsla(0, 0%, 0%, 0.049) 15.5%,
hsla(0, 0%, 0%, 0.104) 22.5%,
hsla(0, 0%, 0%, 0.175) 29%,
hsla(0, 0%, 0%, 0.259) 35.3%,
hsla(0, 0%, 0%, 0.352) 41.2%,
hsla(0, 0%, 0%, 0.45) 47.1%,
hsla(0, 0%, 0%, 0.55) 52.9%,
hsla(0, 0%, 0%, 0.648) 58.8%,
hsla(0, 0%, 0%, 0.741) 64.7%,
hsla(0, 0%, 0%, 0.825) 71%,
hsla(0, 0%, 0%, 0.896) 77.5%,
hsla(0, 0%, 0%, 0.951) 84.5%,
hsla(0, 0%, 0%, 0.987) 91.9%,
hsl(0, 0%, 0%) 100%;
/* https://larsenwork.com/easing-gradients/ */
--smoothGradient_blackBottom:
linear-gradient(
to bottom,var(--smoothGradient)
);
}
/*
CSS pro tip:
:target {
scroll-margin-block-start: 2em;
}
Adds a nice bit of breathing room to stuff that's anchored via URL like example.com/#my-element
https://bsky.app/profile/bell.bz/post/3ltvwqogl7k22
:target {
scroll-margin-top: 2rem;
}
google translate:
.translated-ltr font {
background-color: inherit!important;
box-shadow: initial!important;
}
#goog-gt-tt {
display: none !important;
}
https://cloud.google.com/translate/attribution
https://stackoverflow.com/a/38812697
#google_translate_element{width:300px;float:right;text-align:right;display:block}
.goog-te-banner-frame.skiptranslate { display: none !important;}
body { top: 0px !important; }
#goog-gt-tt{display: none !important; top: 0px !important; }
.goog-tooltip skiptranslate{display: none !important; top: 0px !important; }
.activity-root { display: hide !important;}
.status-message { display: hide !important;}
.started-activity-container { display: hide !important;}
*/
html{scroll-behavior: smooth !important;}
body{
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
font-smooth: always;
text-rendering: optimizelegibility;
word-wrap: break-word;
overflow-x: hidden;
}
a:focus-visible {
outline-offset: 0.25em;
outline-width: 0.25em;
outline-color: currentColor;
}
/* fixing migration issues, from Bootstrap 4 to Bootstrap 5,
https://getbootstrap.com/docs/5.0/migration/
OLD/source
https://cdn.jsdelivr.net/npm/bootstrap@4/dist/css/bootstrap.css
*/
:root{
--red: #dc3545;
}
/*
.btn-block in group doesn't look well, in content block > duplicate
*/
.btn-block {
display: block;
width: 100%;
}
.btn-block + .btn-block {
margin-top: 0.5rem;
}
input[type="submit"].btn-block,
input[type="reset"].btn-block,
input[type="button"].btn-block {
width: 100%;
}
.form-text {
display: block;
margin-top: 0.25rem;
}
.close {
float: right;
font-size: 1.5rem;
font-weight: 700;
line-height: 1;
color: #000;
text-shadow: 0 1px 0 #fff;
text-decoration:none;
opacity: .5;
}
.float-left {
float: left !important;
}
.float-right {
float: right !important;
}
.text-left {
text-align: left !important;
}
.text-right {
text-align: right !important;
}
.text-justify{text-align: justify}
.font-weight-bold {
font-weight: 700 !important;
}
.ml-auto{
margin-left: auto !important;
}
.mr-auto{
margin-right: auto !important;
}
/*
mr-n2
me-n2
*/
.mr-0 {
margin-right: 0 !important;
}
.ml-0{
margin-left: 0 !important;
}
.mr-1 {
margin-right: 0.25rem !important;
}
.ml-1{
margin-left: 0.25rem !important;
}
.mr-2 {
margin-right: 0.5rem !important;
}
.ml-2{
margin-left: 0.5rem !important;
}
.mr-3{
margin-right: 1rem !important;
}
.ml-3 {
margin-left: 1rem !important;
}
.mr-4{
margin-right: 1.5rem !important;
}
.ml-4{
margin-left: 1.5rem !important;
}
.mr-5{
margin-right: 3rem !important;
}
.ml-5{
margin-left: 3rem !important;
}
.pr-0{
padding-right: 0 !important;
}
.pl-0{
padding-left: 0 !important;
}
.pr-1{
padding-right: 0.25rem !important;
}
.pl-1{
padding-left: 0.25rem !important;
}
.pr-2{
padding-right: 0.5rem !important;
}
.pl-2{
padding-left: 0.5rem !important;
}
.pr-3{
padding-right: 1rem !important;
}
.pl-3{
padding-left: 1rem !important;
}
.pr-4{
padding-right: 1.5rem !important;
}
.pl-4 {
padding-left: 1.5rem !important;
}
.pr-5{
padding-right: 3rem !important;
}
.pl-5{
padding-left: 3rem !important;
}
.no-gutters {
margin-right: 0;
margin-left: 0;
--bs-gutter-x: 0;
}
.no-gutters > .col,
.no-gutters > [class*="col-"] {
padding-right: 0;
padding-left: 0;
}
.col,[class*="col-"] {
position: relative;
}
[data-keditor] .row,.keditingBlock .row {
justify-content: space-around;
}
[data-keditor] .row:not([class*="g-"]),
.keditingBlock .row:not([class*="g-"]){
--bs-gutter-x: 3rem;
--bs-gutter-y: 3rem;
}
[data-keditor] .row.form-row{
--bs-gutter-x: 1.5rem;
--bs-gutter-y: 0rem;
justify-content: start;
}
[data-keditor] .g-6{
--bs-gutter-x: 4.5rem;
--bs-gutter-y: 4.5rem;
}
[data-keditor] .g-7{
--bs-gutter-x: 7rem;
--bs-gutter-y: 7rem;
}
/*this is just for single content block, older versions of 4061.2,
but it breaks layouts by the way - shop, form and in the admin area */
form:not(.cart_form) .row div:not(.col):not(.col-auto){
/*width:auto;*/
}
.form-group {
margin-bottom: 1rem;
}
/*
as Bootstrap 5 is wider than Bootstrap 4,
rules below are just to make sure websites will look the same after updating.
Themes like "mediterranean", "white" and "earth" themes look bad, when rules are in use as they're boxed, so there's additionally ".ko_ThemeBoxed #website .container" rule lower.
*/
@media (min-width: 576px) {
#website .container, .container-sm {
max-width: 540px;
}
}
@media (min-width: 768px) {
#website .container, .container-sm, .container-md {
max-width: 720px;
}
}
@media (min-width: 992px) {
#website .container, .container-sm, .container-md, .container-lg {
max-width: 960px;
}
}
@media (min-width: 1200px) {
#website .container, .container-sm, .container-md, .container-lg, .container-xl {
max-width: 1140px;
}
}
/*
this one is from official Bootstrap 5, but with #website, to overwrite rules above on larger screens, with little change 1444px instead of 1400px to make sure interface looks well when in admin mode on 1400px screen (there's 100px left menu)
*/
@media (min-width: 1444px) {
#website .container, .container-xxl, .container-xl, .container-lg, .container-md, .container-sm {
max-width: 1320px;
}
}
.mt-n5{
margin-top: -3rem !important;
}
@media (min-width: 768px) {
.text-md-left {
text-align: left !important;
}
.text-md-right {
text-align: right !important;
}
.text-md-center {
text-align: center !important;
}
.mr-md-0{
margin-right: 0 !important;
}
.pr-md-4{
padding-right: 1.5rem !important;
}
.pl-md-5{
padding-left: 3rem !important;
}
.ml-md-auto {
margin-left: auto !important;
}
.mr-md-auto {
margin-right: auto !important;
}
.col-md-6{max-width: 50%;}
}
@media (min-width: 992px) {
.pl-lg-4{
padding-left: 1.5rem !important;
}
.pl-lg-5{
padding-left: 3rem !important;
}
.pr-lg-5{
padding-right: 3rem !important;
}
.text-lg-left {
text-align: left !important;
}
.text-lg-right {
text-align: right !important;
}
.text-lg-center {
text-align: center !important;
}
/* backward compatibility for bakery, hairSalon and realEstate themes */
.col-lg-7.keditExpand{width: 58.33333333%;}
}
.font-weight-normal{ /*.fw-normal*/
font-weight: 400 !important;
}
.small, small {
font-weight: 400;
}
.badge{
text-decoration: none!important;
}
.badge-primary {
color: #fff;
background-color: #007bff;
}
.badge-secondary {
color: #fff;
background-color: #6c757d;
}
.badge-secondary:hover{
color: #fff;}
.badge-success {
color: #fff;
background-color: #28a745;
}
.badge-info {
color: #fff;
background-color: #17a2b8;
}
.badge-warning {
color: #212529;
background-color: #ffc107;
}
.badge-danger {
color: #fff;
background-color: #dc3545;
}
.badge-light {
color: #212529;
background-color: #f8f9fa;
}
.badge-dark {
color: #fff;
background-color: #343a40;
}
/* end of fixing migration issues, from Bootstrap 4 to Bootstrap 5 */
/*body {font-size: calc(1rem * var(--kedit-fsx,1)); text-shadow:5px 5px 0 blue}*/
#website{font-size:1.1rem;}
/*#website{font-size: calc(1.1rem * var(--kedit-fsx));}*/
/* old style_extra.css contents */
.koMenu ul, .koMenu li {margin:0;padding:0;list-style:none;}
.koMenu ul ul {margin:0 0 0 20px;}
.koMenu a:not(.alert-link) {text-decoration:none!important}
.koMenu a:hover {text-decoration:underline}
/*shop*/
.phide {position:absolute;top:-1000px;left:-1000px;}
.shopProductDescription {padding:10px;}
.shopProductOptions {margin: 20px auto;}
.shopProductOption {margin-top:25px;}
.shopProductOption.col {
flex-basis: content;
}
.shopProductPriceSuggested{font-weight:normal;text-decoration:line-through;font-size:90%;margin-left:5px;}
.shopProductSKU{font-size:90%;opacity:0.5;padding-bottom:10px;}
.shopProductSKU:empty{display:none;}
.shopRelatedBox {font-size: 13px;}
.shopRelatedBox:after {clear: both; display: block; height: 0; content: " "; visibility: hidden;}
.shopRelatedBox h4 {white-space:nowrap; text-align: left; font-size:18px;}
.shopRelatedBox a { position:relative;}
.shopRelatedBox a span { display:none; position:absolute; width:160px;left:-1px;bottom:105%;border:1px solid #000;padding:10px;background:#333;color:#fff;}
.shopRelatedBox a:hover span {display:block}
.shop-box a{display:block;text-decoration:none!important;}
.shop-box img{width:100%;margin-bottom:20px;}
.shop-box .shop-imageHolder{transition:0.15s all;
/*
box-shadow: 1px 1px 7px rgba(0,0,0,0.1);
change, october 2020:
*/
box-shadow: 0px 8px 11px -6px rgba(0, 0, 0, 0.2);
}
.shop-box:hover .shop-imageHolder{text-decoration:none;
/*
box-shadow:2px 2px 35px rgba(0,0,0,0.2);
change, october 2020:
*/
box-shadow: 0px 19px 35px -22px rgba(0, 0, 0, 0.5);transform:translateY(-3px);
}
.shop-box:hover a{text-decoration:none}
.shopSwiperLarge img,
.shopSwiperThumbnails img {
background:var(--shopImageBackground,#fff);
}
.whiteShadowContainer {padding:0; margin:0;
background-color: #fff;
box-shadow: 1px 1px 15px rgba(0,0,0,0.1),0 1px 3px rgba(0,0,0,0.3);
color:#333;
/* update October 2020 */
border-radius: .25rem;
}
.whiteShadowContainer a:not(.btn) { color:#000}
.whiteShadowContainer label a {text-decoration:underline}
#content .whiteShadowContainer p { color:#333}
.whiteShadowContainer h3, .whiteShadowContainer table th { color:#333;margin:0}
.whiteShadowContainer:after {clear: both; display: block; height: 0; content: " "; visibility: hidden;}
.whiteShadowContainer .breadcrumb {background:none;border:none;margin:0}
.thumbBar,.thumbBarEmpty {margin: 20px 0 0; padding: 10px 15px; background-color: #f2f2f2;}
.thumbBar:after,.thumbBarEmpty:after {clear: both; display: block; height: 0; content: " "; visibility: hidden;}
#content .thumbBar p {margin:0;overflow: hidden; word-wrap: break-word;font-size:13px; color:#333;}
.thumbBarEmpty {background-color: #fff; padding: 6px}
.thumbTitle {padding: 20px; border-bottom: 1px solid #d1cdcd; clear:both;
/*
an update October 2020. It may not look good with switched layout variant keditLayout_1 or keditLayout_2
*/
background: linear-gradient(to top,rgba(1,1,1,0.03),rgba(1,1,1,0) 30%);
}
.keditLayout_1 .thumbTitle,
.keditLayout_2 .thumbTitle{background:inherit}
div.thumbTitle {padding: 0 10px;margin-bottom: 10px;}
.thumbTitle .thumbTitleImage {float: left; margin-right: 9px; width: 50px;}
.thumbTitle .thumbTitleImage img {display: block; width: 50px; height: 50px;}
.thumbTitle h3 {font-size: 23px; line-height: 1em; margin-bottom: 2px;}
.thumbTitle h3 a {text-decoration: none; color:#333}
.thumbTitle h3 a:hover {text-decoration: underline;}
.thumbTitle p {display:block; clear:both; margin: 10px 0 0;}
.thumbTitle .fb-like {margin-top:-2px;}
.thumbList {margin: 15px auto;}
.thumbList#shopItemsGallery {margin:0 auto;}
.thumbList li {margin-left:0}
.thumb {position:relative; float:left; width: 161px; margin:0 5px 15px 0; padding:15px 15px 0; font-size:12px}
.thumb .thumbBadge {position: absolute; z-index: 2; top:0/* -15px*/; left:0;/* -15px*/; width: 110px; height: 110px; overflow: hidden;}
.thumb .thumbBadge strong {position: absolute; z-index: 2; top: 19px; left: -28px; width: 125px; height: 22px; padding-top: 8px; text-align: center; font-size: 11px; color: #524d4d; background-color: #f2f0f0; overflow: hidden; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg);}
.thumb .thumbBar {margin: 0 -15px;}
.thumb a.thumbBar {display:block;color:#666;text-decoration:none;}
.thumb a.thumbBar:hover {background:#e0e0e0}
.cart-box.thumb {width:auto;float:none;}
.cart-box.thumb .thumbBar {margin-top:15px;}
.cart-box .thumbImage {margin-right:15px;}
.shop-imageHolder{background:#fff;width:100%;display:block;position:relative;margin-bottom:20px;}
#website .shop-imageHolder img.lazy{position:absolute;left:5px;top:5px;right:5px;bottom:5px;width:calc(100% - 10px);max-width:100%;height:calc(100% - 10px);max-height:100%;object-fit:contain;background: #eee;}
#website .shop-imageHolder.kimgRatio{text-align:left}
#website .shop-imageHolder.kimgRatio img.lazy{position:relative;margin-bottom: 10px;}
/*
#website .shop-imageHolder.shop-imageOriginalRatio img {
object-fit: contain;
position: static;
display: block;
width:100%;
height:auto;
margin:0;
}
.shop-imageHolder.shop-imageOriginalRatio {
padding: 5px;
}
*/
/*
why this was here?
client reported bolds are not bold in shop's description,
removing (October 2020)
.shopProductsList strong{font-weight:normal}
*/
.shopProductsList .shop-box a{text-align:center}
.keditLayout_1 .shopProductsList .shop-box a{text-align:left}
.keditLayout_1 .shopProductsList .shop-box h3{font-size:22px;margin:0}
.categoryHeader {margin-bottom:50px;}
/* Comments */
.commentItemCheck{float:left;margin-bottom:15px}
#commentListDiv {clear:both; margin:100px 0 50px}
#commentListItem{margin-bottom:50px;position:relative;}
#commentListWroteItem img{display:inline-block; margin-right:15px; border-radius:4px;}
#commentListWroteItem{
margin-bottom:20px; background:#F2F2F2; color:#000;
border-radius: 5px;border:1px solid #DFDFDF; padding:0;
line-height:20px;
}
#commentListCommentItem{
display:block;background:url(../editor_images/quote.png) 50px 0 no-repeat;padding:25px 25px 25px 100px; overflow:auto;
}
#commentListDateItem{float:right;opacity:0.5;margin-right:10px;font-size:90%}
#admin #commentListDateItem{float:none;;margin:10px -10px 0 -10px;padding:5px 10px;clear:both;}
#admin #commentListCommentItem{padding-left:25px;background:#fff;}
#commentListNoItem{padding:10px;text-align:center;}
#commentListAdminMenu #commentListAdminMenuItem,#commentListAdminMenu a:link,
#commentListAdminMenu a:visited{
display:inline;padding:3px;border:1px solid #000;text-decoration:none;color:#000;
margin-right:1px
}
#commentListAdminMenu a:hover{
text-decoration:none;color:#FFF;
background-repeat:repeat-x;
}
#commentItemSubmit span{display:block;margin:5px 0}
input.commentsName {display:none}
.form-horizontal textarea {min-height:150px;}
.alert {
border-width:0;
box-shadow: 0 10px 15px -5px rgba(0,0,0,.15),0 1px 2px 0 rgba(0,0,0,.25),0 10px 25px rgba(0,0,0,.02);
border-left: 10px solid;
background: #fff !important;
}
/* in newsletters, main box is max 700px in width (via .ContactForm.whiteShadowContainer) */
.keditNewsletter .alert{max-width:700px;margin-left: auto;margin-right: auto}
.fixed-top{position:fixed;top:5px;left:5px;right:5px;z-index:1030;}
.fade{
transition:opacity 0.15s;
opacity:0;
}
.fade.in{opacity:1}
#adminToolbarControls{z-index:2;position:relative;margin:0 5px 2px 3px;}
/*google recaptcha badge*/
.grecaptcha-badge {
z-index: 79999;
}
/*.social,*/
.social_fa{list-style:none;padding:0;margin:0;text-align:center}
.social_fa li{position:relative;display:inline-block;}
.social_fa a {display:inline-block;background:#CCC;margin:0 3px 3px 0;text-align:center;padding:3px 0px 0px;border-radius:5px}
.social_fa.social_footer a {background:none;padding:0;margin:0;}
.social_footer,social_left{text-align:left}.social a.buttonFacebook,.social_bwh a.buttonFacebook:hover{background-position:-32px -127px}.social_bw a.buttonFacebook{background-position:-32px -158px}.social a.buttonTwitter,.social_bwh a.buttonTwitter:hover{background-position:-64px -127px}.social_bw a.buttonTwitter{background-position:-64px -158px}.social a.buttonGPlus,.social_bwh a.buttonGPlus:hover{background-position:-96px -127px}.social_bw a.buttonGPlus{background-position:-96px -158px}.social a.buttonYouTube,.social_bwh a.buttonYouTube:hover{background-position:-128px -127px}.social_bw a.buttonYouTube{background-position:-128px -158px}.social a.buttonInstagram,.social_bwh a.buttonInstagram:hover{background-position:-160px -127px}.social_bw a.buttonInstagram{background-position:-160px -158px}
/* Kopage 4+*/
.social_footer a{line-height:30px;height:30px;width:30px;text-align:center;border-radius:50px;opacity:0.7}
.social_footer a:hover{opacity:1}
.social_footer a i{font-size:22px;line-height:30px}
.keditLayout_1 .social_footer a{line-height:36px;height:36px;width:36px;background:rgba(0,0,0,0.5);margin:0 0 0 5px;opacity:1;color:rgba(255,255,255,0.8)!important}
.keditLayout_1 .social_footer a:hover{background:rgba(0,0,0,0.8);color:rgba(255,255,255,0.8)!important}
.keditLayout_1 .social_footer a i{font-size:18px;line-height:36px}
#footerHitCounter{
opacity:0;
font-size:smaller;
transition:0.2s opacity;
display: block;
}
#footerHitCounter.show{
opacity:1;
}
/* Sitemap START */
ul.sitemap,
ul.sitemap ul {
list-style:none;
margin:0;
padding:0;
}
ul.sitemap{float:left;min-width:50%}
ul.sitemap ul {
margin-left:10px;
position:relative;
margin-top:10px;
padding-top:10px;
}
ul.sitemap ul:before {
content:"";
display:block;
width:0;
position:absolute;
top:0;
bottom:20px;
left:0;
border-left:1px solid;
}
ul.sitemap li {
margin:0;
padding:10px 12px;
font-size:14px;
line-height:20px;
position:relative;
}
#website ul.sitemap li a {padding:5px 15px;border:none;background:linear-gradient(to bottom,#f5f6f7,#ccc);border-radius:3px;text-decoration:none;color:#666;transition:0.3s}
#website ul.sitemap li a:hover {background:#ccc;background:linear-gradient(to bottom,#eee,#cbcbcb);}
#contentArea .keditDark .sitemap a span {
color: #555;
}
#contentArea .sitemap a {
text-decoration:none!important
}
ul.sitemap ul li:before {
content:"";
display:block;
width:10px;
height:0;
border-top:1px solid;
position:absolute;
top:20px;
left:0;
}
ul.sitemap ul li:last-child:before {
height:auto;
top:20px;
bottom:0;
/*background:#fff;*/
}
/* Sitemap END */
#SearchResult li a {display:inline-block;padding:10px 0;text-align:left; list-style:square}
.keditModuleEditPlaceholder{height:300px;max-height:300px;overflow:hidden}
div.keditPlaceholderEdit{z-index:65000;right:0;left:0;color:#fff;padding:70px;font-size:18px;text-align:center;position:absolute;top:0;bottom:0;border:25px solid rgba(0,0,0,0.5);background:rgba(0,0,0,0.7);}
div.keditPlaceholderEdit a {color:#eee;text-decoration:underline}
div.keditPlaceholderEdit a.keditPlaceholderEdit {color:#eee;text-decoration:none;border:1px solid #ccc;padding:3px 10px;}
div.keditPlaceholderEdit a.keditPlaceholderEdit:hover {background:#ccc;color:#fff;}
div.keditPlaceholderEdit a i.icon-white {margin-top:5px;}
.mobileMenuOpen_Body{height:100%;overflow-x:hidden;}
.mobileMenuOpen_Body .logoHolder { width: 100%; text-align: center;}
.mobileMenuOpen,.mobileMenuOpen:hover{display:none;text-align:center;position:fixed;z-index:99999;top:0;left:0;font-size:20px;line-height:20px;width:50px;height:50px;line-height:50px;padding:0;color:#fff;text-decoration:none;background:#000}
.mobileMenuOpen.mobileMenuShop{display: block;}
.mobileMenuShop,.mobileMenuShop:hover{top:55px;left:5px;width:45px;
position: fixed;top:auto;bottom:100px;right:0;left:auto;display:block;z-index:1000;
}
.mobileMenuOpener a{font-size:22px;line-height:50px;display:block;position:relative;text-align:center;width:40px;color:var(--mobileMenuOpenerColor,#000);float:left;}
.mobileMenuOpener span a{font-size:15px}
.mobileMenuHeader{position:absolute;z-index:99998;left:0;top:0;max-width: 350px;width: calc(100% - 50px);}
.mobileMenuHeader:after{content:"";width:1px;background:linear-gradient(to bottom,rgba(0,0,0,0),rgba(0,0,0,0.15),rgba(0,0,0,0));height:100%;position:absolute;top:0;right:5px}
.mobileMenuHeader span{justify-content:end;display:flex;padding:5px 15px 0 5px;}
.mobileMenuHeader a{margin-right:5px;font-size:17px;padding:0!important;line-height:38px;width:38px;text-align:center;border:0;border-radius:30px;background:var(--bs-light);color:var(--bs-dark);background:linear-gradient(to bottom,rgba(0,0,0,0.05),rgba(0,0,0,0.1));color:rgba(0,0,0,0.75);}
.mobileMenu .mobileMenuHeader i{margin: 0!important}
.mobileMenuSubheader{color: rgba(0,0,0,0.5);padding: 25px 20px 5px 20px;text-transform:uppercase;font-size: 13px;letter-spacing:1px;font-weight:bold;}
.mobileMenuSearch{border-bottom: 1px solid #eee;}
.mobileMenuSearch .form-floating{--bs-body-bg:var(--bs-color-light);}
.mobileMenuSearch button{top: 7px;right: 7px;font-size: 20px;border: 1px solid rgba(0,0,0,0.1);border-radius: 50px;}
.mobileMenuSearch input:valid + button{display:block!important}
.mobileMenuSocial{position:relative;bottom:20px;left:0;right:0;margin: 100px 0 -100px !important}
.mobileMenu li.mobileMenuSocial span {display:flex;justify-content: center;padding: 20px; flex-wrap: wrap;}
.mobileMenuLang {max-width: 100%;overflow-x: auto;padding-bottom: 20px;}
.mobileMenu li.mobileMenuSocial a {text-align:center;padding:0;line-height:30px;height:30px;width:auto;padding:0 10px;display:block;border:0;margin-bottom:5px;position:relative}
.mobileMenu li.mobileMenuSocial a i {margin:0;display:block;line-height:30px;position:relative;left:0;}
.mobileMenu li.mobileMenuSocial a i.pull-right {left:auto;right:0}
.mobileMenuShop a{display:block;color:rgba(255,255,255,0.7);transition:color 0.2s;
}
.mobileMenuShop a span{display:block;color:rgba(255,255,255,1);margin-top:-3px;margin-right:-3px;}
.mobileMenuShop:hover a{color:rgba(255,255,255,1);}
.mobileMenu .mobileMenuClose,.mobileMenu .mobileMenuClose:hover{
display:block;text-align:center;position:absolute;z-index:99999;top:5px;right:5px;font-size:20px;;width:50px;height:40px;line-height:40px;padding:0;color:#000;text-decoration:none;border:0;background:#fff;text-indent:0;
}
.mobileMenuClose i{opacity:0.5}
.mobileMenuCloseHolder{background:#fff;border-bottom:1px solid rgba(0,0,0,0.1);height:50px;}
#mobileMenuHolder{
position:absolute;top:0;left:0;right:0;margin:0;padding:0;background:#fff;z-index:99997;visibility:hidden;opacity:0;transition:0.2s opacity;
pointer-events: none;
}
#mobileMenuHolder::before{content:"";position:fixed;top:0;left:0;right:0;bottom:0;z-index:99996;
background-image: radial-gradient(circle at right top,rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.9) 100%);}
.mobileMenu{margin:0;padding:0;z-index:99997;position:fixed;left:0;top:0;bottom:0;height:100vh;max-height:100vh;overflow-y: auto;overflow-x: hidden;background:#fff;box-shadow:10px 0 100px rgba(0,0,0,0.7);width:100%;max-width:400px;
visibility:hidden;opacity:0;margin-left:-10px;transition:0.2s all;
max-height: -webkit-fill-available;
}
.mobileMenu .dropmenudiv{
visibility: visible!important;
position: relative!important;
top:0!important;
left:0px!important;
display: block!important;
box-shadow:none;
margin: 0 !important;
background:none;
}
.mobileMenu ul .dropmenudiv{
margin-left:5px !important;
padding: 5px 0!important;
}
.mobileMenu .dropmenudiv li a {
border-bottom: none;
margin: 0 5px 0 0;
}
.mobileMenu .dropmenudiv li i {display:none!important;}
.mobileMenu .dropmenudiv li.item_active > a {
background: #ebebeb;
color: #333;
font-weight:bold;
}
.ko_ThemeMobileMenuOpen #mobileMenuHolder{
visibility:visible;
opacity:1;
pointer-events: auto;
}
.ko_ThemeMobileMenuOpen .mobileMenu{visibility:visible;opacity:1;margin-left:0;}
.ko_ThemeMobileMenuOpen .mobileMenuOpen {display:none;}
.koMenuActive .mobileMenu{left:100px;}
.mobileMenu::after {
content: "";
height: 100px;
display: block;
}
.mobileMenu ul,.mobileMenu li{display:block;margin:0;padding:0}
.mobileMenu li a{display:block;color:#222;font-size:16px;line-height:30px;padding:10px 25px 10px 50px;border-bottom:1px solid #eee;word-wrap: break-word; text-decoration:none;}
.mobileMenu li a.mobileMenuLevel_1{padding:10px 25px 10px 20px;}
.mobileMenu li a:hover{text-decoration:none;display:block;color:#222;background:#f8f8f8;}
.mobileMenu li a.mobileActive{font-weight:bold;background:#eee}
.mobileMenu li:not(.mobileMenuCloseHolder) a i{margin:8px 0 0 20px;opacity:0.5;display:inline}
.mobileMenu li a:hover i{opacity:1}
.mobileMenu li li a i{margin:2px 10px 0 0;position:absolute;left:0}
.mobileMenu li li a i.pull-right{left:auto;right::0}
.mobileMenu li li a {text-indent:0;}
.mobileMenu .mobileMenuSocial .dropdown {display:none;}
/* mobile menu on dark theme */
.koThemeDark .mobileMenuCloseHolder{background:#222;}
.koThemeDark .mobileMenuClose{color:#fff;background:#333;border:0;}
.koThemeDark .mobileMenu{background:#555}
.koThemeDark .mobileMenu li a {
color: #eee;
border-bottom-color: #444;
}
.koThemeDark .mobileMenu li a:hover {
color: #f8f8f8;
background: #222;
}
.koThemeDark .mobileMenu li a.mobileActive:hover,
.koThemeDark .mobileMenu li a.mobileActive {
color: #fff;
background: #333;
}
.kvideo-centered {
position: relative;
padding-bottom: 56.25%; /* 16:9 */
padding-top: 25px;
height: 0;
background:#eee;
/*background-image:url(../editor_images/video.png);*/
/*
icon: https://icons.getbootstrap.com/icons/clock-fill/
converter: https://yoksel.github.io/url-encoder/
*/
background-image: url("data:image/svg+xml,%3Csvg width='50px' height='50px' viewBox='0 0 16 16' class='bi bi-clock-fill' fill='currentColor' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' d='M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8 3.5a.5.5 0 0 0-1 0V9a.5.5 0 0 0 .252.434l3.5 2a.5.5 0 0 0 .496-.868L8 8.71V3.5z'/%3E%3C/svg%3E");
background-position: center center;
background-repeat:no-repeat
}
.kvideo-centered iframe,
.kvideo-centered video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
}
/*map*/
.kmapHolder{
background:#eee;
background-image: url("data:image/svg+xml,%3Csvg width='50px' height='50px' viewBox='0 0 16 16' class='bi bi-clock-fill' fill='currentColor' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' d='M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zM8 3.5a.5.5 0 0 0-1 0V9a.5.5 0 0 0 .252.434l3.5 2a.5.5 0 0 0 .496-.868L8 8.71V3.5z'/%3E%3C/svg%3E");
background-position: center center;
background-repeat:no-repeat;
box-shadow: inset 0 0 0 10px rgba(0,0,0,0.03)
}
.koVideoList a {font-weight: 300;overflow:auto;display:block; clear:both; text-decoration:none!important;padding:15px;max-width:600px;margin:0 auto}
.koVideoList a strong {margin-left:140px;font-weight: 500;display:block;color:#000;}
.koVideoList a em { font-style:normal;font-size:90%;display:block; font-weight: 300;color:#999; }
.koVideoList a:hover,
.koMenu .koVideoList a:hover{background:linear-gradient(to bottom,rgba(0,0,0,0.1),rgba(0,0,0,0.05));border-radius:5px;text-decoration:none!important}
.koVideoList a img {display:block;max-width:150px;float:left;border-radius:4px;}
.rss_title {font-size:22px;margin-bottom:10px;}
.rss_date {margin:-10px 0 20px;}
.rss_desc {font-size:14px;padding-bottom:50px}
.rss_desc img {margin:0 10px 10px 0;border-radius:2px;border:1px solid rgba(0,0,0,0.2);padding:1px;background:#fff;}
.koSwitch input {
cursor: pointer;
height: 100%;
opacity: 0;
position: absolute;
width: 100%;
z-index: 100;
}
/* Container */
.koSwitch {
height: 30px;
position: relative;
/*width: 65px;*/
line-height: 1em;
overflow: hidden;
border-radius: 50px;
}
/* Background unchecked */
.koSwitch label {
background: #e9513a;
background:rgba(255,255,255,0.3);
border-radius: 50px;
display: block;
height: 100%;
width: 100%;
position: relative;
height: 2.75em;
width: 5.5em;
transition: background-color .2s;
}
.koSwitchLive .koSwitch label{background:#ccc}
.koSwitchLabel label {display:block;font-size:14px;clear:both;color:#000;font-weight:normal}
.koSwitchLabel small {display:block;font-size:12px;color:rgba(0,0,0,0.5)}
/* Slider unchecked */
.koSwitch label div {
background: #fff;
border-radius: 50px;
display: block;
height: 2.25em;
left: .25em;
position: absolute;
top: .25em;
width: 2.5em;
z-index: 3;
transition: 0.15s cubic-bezier(0.175, 0.285, 0.2, 1.275) all;
}
/* Slider on touch */
.koSwitch:active label div {
/*box-shadow:0 0 25px rgba(0,0,0,0.5);
width: 2.5em; transform: scale(1.25, 1.25);
*/
width:3em;
}
/* Vertical lines on slider */
.koSwitch label div:before {
background: #e0dcdd;
bottom: 0;
box-shadow: -.33em 0 0 0 #e0dcdd, .33em 0 0 0 #e0dcdd;
content: '';
display: block;
height: 32%;
top: 0;
left: 0;
margin: auto;
position: absolute;
right: 0;
width: 5%;
transition: all .2s;
}
/* Subtle switch hover */
.koSwitch:hover label div:before {
background: #c7c3c4;
box-shadow: -.33em 0 0 0 #c7c3c4, .33em 0 0 0 #c7c3c4;
transition: all .2s;
}
/* Icon styles */
.koSwitch i {
font-size: 1.5em;
position: relative;
line-height: 1em;
z-index: 2;
}
.koSwitch i.fa-check {
color: #165CB2;
left: 15%;
top: 25%;
}
.koSwitch i.fa-times {
color: #c72f18;
color: #bbb;
left: 30%;
top: 23%;
}
#admin .koSwitch label {
background: linear-gradient(to bottom, #FF3019 0%, #CF0404 100%) repeat scroll 0% 0%;
font-size: 1em;
}
#admin .koSwitch i.fa-times {
color: #c72f18;
}
/* Checked States */
.koSwitch input:checked~label,#admin .koSwitch input:checked~label {
background: #1865C5;
background: linear-gradient(to bottom, #36A8F3 0%,#37ACF5 4%,#1865C5 100%);
transition: background-color .2s;
}.koSwitch.koSwitchDark input:checked~label {
background:rgba(255,255,255,0.1);
}
.koSwitch.koSwitchDark i.fa-check {
color: #fff;
}
.koSwitch input:checked~label div {
left: auto;right:.25em;;/* 3.25em;*/
}
.koSwitchInput .koSwitchMore{display:none;right:65px;top:10px;position:absolute;background:rgba(255,255,255,0.7);border-radius:50px;
top: 50%;
transform: translateY(-50%);}
.koSwitchInput .kSwitchMore{display:none;right:0;top:0;position:absolute;z-index:10;background:rgba(255,255,255,0.7);border-radius:50px;}
.koSwitchInput {padding:5px;text-align:left;clear:both;overflow:auto;}
.koSwitchInput.koSwitchLive{text-align:left;clear:both;padding:0;padding:10px 20px;position:relative;margin-bottom:1px}
.koSwitchInput.koSwitchLive:hover .koSwitchMore,
.koSwitchInput.koSwitchLive:hover .kSwitchMore{display:block}
.koSwitch {float:left}
.koSwitchLive .koSwitch{float:none;position:absolute;right:10px;padding:0;font-size:.75em;
top: 50%;
transform: translateY(-50%);
}
.koSwitchLabel {float:left;padding:4px 4px 4px 10px;}
.koSwitchLive .koSwitchLabel{padding:0;width:200px}
/* end of old style_extra.css contents */
.koInModuleToolbar{display:none}
/*
OLD:
#contentArea a:not(.btn):not(.page-link):not(.list-group-item),#contentArea a.btn-link{text-decoration: underline;}
apply default style for A only when it has no class */
#contentArea a:not([class])/*,#contentArea a.btn-link{text-decoration: underline;}*/
.nav a,.basicModal a{text-decoration:none}
.basicModal::before{
background:var(--ui-color-stripes-accent);
content:" ";
height:7px; width:auto; z-index:2; position:absolute; top:0;left:0;right:0;
border-radius: 5px 5px 0 0;
}
.spinner {
z-index: 2;
position: absolute;
top: 50%;
left: 50%;
margin: -15px 0 0 -15px;
width: 30px;
height: 30px;
}
.spinner .path {
stroke: rgba(255,255,255,0.75);
stroke-linecap: round;
}
.isLoading .spinner {
-webkit-animation: koLoadingRotation 2s linear infinite;
animation: koLoadingRotation 2s linear infinite;
/*will-change: transform;*/
}
.isLoading .spinner .path {
-webkit-animation: dash 1.5s ease-in-out infinite;
animation: dash 1.5s ease-in-out infinite;
}
.spinner.spinnerAccent .path { stroke: var(--ui-color-accent); }
.spinner.spinnerBlack .path { stroke: rgba(0,0,0,0.75); }
.spinnerHolder{position:relative;height:50px;display:none}
.spinnerHolder.active{display:block}
@-webkit-keyframes dash {
0% {
stroke-dasharray: 1, 150;
stroke-dashoffset: 0;
}
50% {
stroke-dasharray: 90, 150;
stroke-dashoffset: -35;
}
100% {
stroke-dasharray: 90, 150;
stroke-dashoffset: -124;
}
}
@keyframes dash {
0% {
stroke-dasharray: 1, 150;
stroke-dashoffset: 0;
}
50% {
stroke-dasharray: 90, 150;
stroke-dashoffset: -35;
}
100% {
stroke-dasharray: 90, 150;
stroke-dashoffset: -124;
}
}
.btn.btn-ghost{
background:rgba(0,0,0,0.1); color:#000;
/*box-shadow:inset 0 0 0 2px rgba(0,0,0,0.7);*/
border:2px solid rgba(0,0,0,0.7);
transition: 0.2s all;
}
.btn.btn-ghost:hover{background:rgba(0,0,0,0.9);color:#eee}
.keditDark .btn.btn-ghost{
background:rgba(255,255,255,0.1); color:#FFF;
/*box-shadow:inset 0 0 0 2px rgba(255,255,255,1);*/
border:2px solid rgba(255,255,255,1);
transition: 0.2s all;
}
.keditDark .btn.btn-ghost:hover{background:rgba(255,255,255,0.9);color:#000}
.btn.btn-xl{padding:16px 26px;font-size:24px;line-height:1.3333333;border-radius:6px}
.btn{text-shadow:none;}
.logo img#websiteLogo{margin-right:10px;height: 100%;}
/*#website:not(.logoCentered) #WebsiteLogo{display:block;float:left;line-height:80px;}*/
/*Dark*/
/* Kopage 3 */
body.koThemeDark {background:#333;color:#eee}
body.koThemeDark .menuHolder li a {color:#eee}
body.koThemeDark .logoHolder a {color:#fff}
/*kopage 4*/
/*.koThemeDark body, it was also applying to admin's interface*/
.koThemeDark body{background:#292C34}
.koThemeDark #website,.koThemeDark.ko_ThemeBoxed #website {background:#292C34;color:#ACB2BE}
.koThemeDark.ko_ThemeBoxed #website {background:#1D1F24}
.ko_Theme #header{
position:relative;
z-index:65405;
/*z-index:1; --> changes in 08.2019, when it was set to 1, dropdown menu with languages didn't work well. */
/*clear:both;/*overflow:auto; - doesn't show box-shadow */
/*z-index:65405 when it was lower, header module menu was lower than other interface elements, in admin...
but when set to z-index:65405, add-content separator was lost. Do it on hover. */
}
#headerMenu{position:relative;/*z-index:3;*/clear:both; top:0;left:0;right:0;padding:0;}
#headerContent{position:relative;clear:both;}
#headerContent:not(.koZeroPadding){padding:40px;}
/* kopage 4.0, on mobile: make logo centered */
@media (max-width: 768px){
.ko_Theme .logoHolder {
margin: 0 auto!important;
}
}
.ko_Theme .logoHolder img {
object-fit: contain;
}
.logoHolder{float:left;padding:10px 10px 10px 40px;line-height:80px;height:100px;
/* 2025 */
text-align:center;flex-shrink: 0;
}
/*.logoLeft .koMenu2 .logoHolder{padding-left:0}
.logoLeft .koMenu2 #logoReplacer{padding-left:15px}*/
.logoHolder img{max-height:80px;}
/* L#H2 .logoHolder h2{padding:0;margin:0;text-decoration:none;letter-spacing:-1px}*/
.logoContents{letter-spacing:-1px}
.logoHolder a{text-decoration:none !important;line-height:80px;color:rgba(0,0,0,0.8)}
.logoHolder a:hover{color:rgba(0,0,0,0.8)}
.menuHolder{margin:0;padding:0 40px 0 0;list-style:none;float:right}
.menuHolder li{display:inline-block;padding:25px 0;}
.menuHolder li a{text-decoration:none;display:block;color:#fff;font-size:18px;line-height:50px;text-shadow:1px 1px 1px rgba(0,0,0,0.1);padding:0 15px;
max-width: 300px;word-wrap: break-word;
}
@media (max-width: 750px){
ul.menuHolder:not(.menuStack){display:none!important;}
ul.menuHolder.menuStack{position:absolute;top:0;right:0;z-index:10}
}
/* in version 4, mobile menu (hamburger), hide main menu until hamburger is processed */
.ko_Theme.ko_ThemeMobileMenu .menuHolder:not(.menuStack){display:none;visibility:hidden;opacity:0;position:fixed;top:-9999px;overflow:hidden;height:1px;width:1px;}
.logoHolder,.menuHolder{position:relative;z-index:4}
.logoHolder .logoHelper,.menuHolder li.menuAddItem{position:absolute;display:none;bottom:-25px;padding:0;left:0;right:0;background:rgba(0,0,0,0);margin:0;line-height:30px;min-width:150px;}
.logoHolder .logoHelper a,.menuHolder li.menuAddItem a{margin:0;text-decoration:none;text-transform: none;color:#fff;height:30px;line-height:30px;padding:0;text-align:center;text-shadow:1px 1px 1px rgba(0,0,0,0.7);width:50%;display:inline-block;box-shadow:inset 0 10px 30px rgba(0,0,0,0.8);width:auto;padding:0 15px/*outline:1px solid rgba(255,255,255,0.5); outline-offset:-2px;*/}
.logoHolder .logoHelper a { white-space:nowrap}
.menuHolder li.menuAddItem a:hover{box-shadow:0 0 30px rgba(0,0,0,0.5);transition: 0.3s all ease;}
.logoHolder:hover .logoHelper,.menuHolder:hover li.menuAddItem{display:block;}
.footerHolder:not(:empty) {
min-height: 30px;
}
.keditFooterLineDarker{background:rgba(0,0,0,0.1);}
.kedit.keditFooter1{padding:0}
.keditFooterLine2 .kedit{padding:20px 0}
.keditFooter .keditImageWrap {display:block;}
/*#website .keditFooterLogo{max-height:100px;max-width:200px;}*/
#keditFooterModule{text-align:right}
.text-center #keditFooterModule{text-align:center}
.text-left #keditFooterModule{text-align:left}
#keditFooterModule.social_footer {
text-align: inherit;
}
#keditFooterModule .social, #keditFooterModule .social_fa {
text-align: inherit;
}
.keditFooterMenu{overflow:hidden}
.overflow-inherit{overflow:inherit!important}
.noScrollbars{overflow:hidden;}
@media (min-width: 767px) {
div.kedit{padding:50px;}
div.kedit .kedit{padding:25px;}
div.kedit.keditRow{padding-left:20px;padding-right:20px}
/* with Bootstrap4 */
section.kedit{padding:100px 0;/* overflow:hidden - it shouldn't be hidden when drag&drop in use*/}
section.kedit.keditRow{padding:0}
/*section.kedit .kedit{padding-left:25px;padding-right:25px}*/
section.kedit .kedit{padding-left:0;padding-right:0}
}
.kedit{width:100%;}
/*
ref to consider: https://dev.to/dailydevtips1/i-made-my-website-28ms-faster-with-content-visibility-466e
.kedit{
content-visibility:auto;
}
*/
/* Block bottom-borders/separators */
.keditBottomShadow{box-shadow:0 15px 50px -15px rgba(0,0,0,.1)}
.keditBottomBorder{border-bottom:1px solid rgba(0,0,0,0.1)}
.keditPointerEvents_off{pointer-events: none}
.keditPointerEvents_on{pointer-events: auto}
.keditExpand{
position:absolute;
z-index:1;
top:0;right:0;bottom:0;height:100%;width:100%;padding:0;
}
.float-left.keditExpand,
.float-start.keditExpand{right:auto;left:0}
.keditExpand .img-full{height:100%!important;width:100%;object-fit:cover}
.keditExpand.pb-5 img.img-full{height:calc(100% - 3rem)!important}
.keditExpand.pb-3 img.img-full{height:calc(100% - 1rem)!important}
.keditObjectCover{object-fit:cover}
.keditRelativeHigher{position:relative;z-index:2;}
.keditZIndex-1{z-index:1;}
.keditZIndex-2{z-index:2;}
.keditZIndex-3{z-index:3;}
.keditLayer_header,
.keditLayer_overlay{
position:absolute;
top:-1px;left:-1px;right:-1px;
z-index:0;
height:100px;pointer-events:none;
}
.keditLayer_footer{
position:absolute;
z-index:1;
bottom:-1px;left:-1px;right:-1px;
height:100px;
pointer-events:none;}
.keditLayer_header{
z-index:1;
}
.keditLayer_header.h-100,.keditLayer_footer.h-100 {
height: calc(100% + 2px) !important;
}
.keditLayer_header svg,
.keditLayer_footer svg{width:100%;height:100%;display:flex;vertical-align: bottom}
.kedit .kedit .keditLayer_header,
.kedit .kedit .keditLayer_footer{display:none}
.keditLayer_overlay{bottom:-1px;height:105%;}
.keditLayer_overlay *{pointer-events:none}
/*.kedit > .container {position:relative;z-index:1}*/
.kedit > .container,.kedit > .no-container {
position:relative;
z-index:3;
width: 100%;
align-self: start;
}
/*
.keditLayer{position:relative;z-index:1}
.inAdminMode .keditApp .keditLayer{position:static}
*/
.koIconHolder{
display:inline-block;margin:0 auto;border-radius:100%;padding:0;text-align:center;
/*april 2025*/
display: inline-flex;justify-content: center;align-items: center
}
.koIconHolder i{}
/* icon styles */
.koIconStyle0{width:50px;min-width:50px;height:50px;line-height:50px;font-size:25px}
.koIconStyle0 i{line-height:50px;}
.koIconStyle1{background:var(--color1_25);width:50px;min-width:50px;height:50px;line-height:50px;font-size:25px}
.koIconStyle1 i{line-height:50px;color:var(--color1);}
.koIconStyle2{background:linear-gradient(-135deg,var(--color1_50),var(--color1_75));width:50px;min-width:50px;height:50px;line-height:50px;font-size:25px}
.koIconStyle2 i{line-height:50px;color:var(--color1_25);text-shadow:1px 1px 5px rgba(0,0,0,0.1)}
.koIconStyle3{background:var(--color1);width:50px;min-width:50px;height:50px;line-height:50px;font-size:25px}
.koIconStyle3 i{line-height:50px;color:var(--color1_bw);}
.koIconStyle4{background:linear-gradient(-135deg,var(--color1),var(--color1_125));width:50px;min-width:50px;height:50px;line-height:50px;font-size:25px}
.koIconStyle4 i{line-height:50px;color:var(--color1_25);text-shadow:1px 1px 5px rgba(0,0,0,0.1)}
.koIconStyle5{background:#fff;width:50px;min-width:50px;height:50px;line-height:50px;font-size:25px;box-shadow: 0 7px 14px rgba(0,0,0,.1),0 3px 6px rgba(0,0,0,.08);}
.koIconStyle5 i,.koIconStyle8 i{line-height:50px;color:var(--color1);}
.koIconStyle6{background:var(--color1);width:50px;min-width:50px;height:50px;line-height:50px;font-size:25px;}
.koIconStyle6 i{line-height:50px;color:var(--color1_bw);}
.koIconStyle7{background:#111;width:50px;min-width:50px;height:50px;line-height:50px;font-size:25px;}
.koIconStyle7 i{line-height:50px;color:#f5f6f7;}
.koIconStyle8{background:#fff;width:50px;min-width:50px;height:50px;line-height:50px;font-size:25px;
box-shadow: 0 0 0 2px var(--color1),0 0 0 6px var(--color1_25);}
.koIconStyle11{background:var(--color2_25);width:50px;min-width:50px;height:50px;line-height:50px;font-size:25px}
.koIconStyle11 i{line-height:50px;color:var(--color2);}
.koIconStyle12{background:linear-gradient(-135deg,var(--color2_50),var(--color2_75));width:50px;min-width:50px;height:50px;line-height:50px;font-size:25px;}
.koIconStyle12 i{line-height:50px;color:var(--color2_125);text-shadow:1px 1px 5px rgba(0,0,0,0.1)}
.koIconStyle13{background:var(--color2);width:50px;min-width:50px;height:50px;line-height:50px;font-size:25px}
.koIconStyle13 i{line-height:50px;color:var(--color2_bw);}
.koIconStyle14{background:linear-gradient(-135deg,var(--color2_75),var(--color2_125));width:50px;min-width:50px;height:50px;line-height:50px;font-size:25px}
.koIconStyle14 i{line-height:50px;color:var(--color2_25);text-shadow:1px 1px 5px rgba(0,0,0,0.1)}
.koIconStyle15{background:#fff;width:50px;min-width:50px;height:50px;line-height:50px;font-size:25px;box-shadow: 0 7px 14px rgba(0,0,0,.1),0 3px 6px rgba(0,0,0,.08);}
.koIconStyle15 i{line-height:50px;color:var(--color2);}
.koIconStyle15{background:#fff;width:50px;min-width:50px;height:50px;line-height:50px;font-size:25px;box-shadow: 0 7px 14px rgba(0,0,0,.1),0 3px 6px rgba(0,0,0,.08);}
.koIconStyle15 i,.koIconStyle18 i{line-height:50px;color:var(--color2);}
.koIconStyle18{background:#fff;width:50px;min-width:50px;height:50px;line-height:50px;font-size:25px;
box-shadow: 0 0 0 2px var(--color2),0 0 0 6px var(--color2_25);}
.koIconStyle21{
width:50px;min-width:50px;height:50px;line-height:50px;font-size:25px;
color: rgba(0,0,0,0.5);
background: linear-gradient(300deg,#e6e6e6,#fcfcfc);
box-shadow: inset 0 -1px rgba(0,0,0,.1),0 .5em .6em -.5em rgba(0,0,0,.15);
}
.koIconStyle21 i{line-height:50px;color:rgba(0,0,0,0.5);}
.koIconStyle22{
width:50px;min-width:50px;height:50px;line-height:50px;font-size:25px;
color: rgba(255,255,255,0.5);
background: linear-gradient(300deg,#111,#666);
/*box-shadow: inset 0 -1px rgba(0,0,0,.1),0 .5em .6em -.5em rgba(0,0,0,.15);*/
box-shadow: -1px 2px rgba(0,0,0,.109804),-2px 12px 20px -7px rgba(0,0,0,.2);
border: 1px solid #292929;
}
.koIconStyle22 i{line-height:50px;color:rgba(255,255,255,0.5);}
.koIconSquare{border-radius:10px;}
.koIconSize125{width:75px;min-width:75px;height:75px;line-height:75px;font-size:37px}
.koIconSize150{width:100px;min-width:100px;height:100px;line-height:100px;font-size:50px;}
.koIconSize175{width:125px;min-width:125px;height:125px;line-height:125px;font-size:62px;}
.koIconSize200{width:150px;min-width:150px;height:150px;line-height:150px;font-size:75px;}
/* color 2
.koIconStyle2{background:linear-gradient(-135deg,var(--color2),var(--color2_125));width:50px;height:50px;line-height:50px;font-size:25px}
.koIconStyle2 .fa,
.koIconStyle2 .fas{line-height:50px;color:var(--color2_25);text-shadow:1px 1px 5px rgba(0,0,0,0.1)}
.koIconStyle3{background:linear-gradient(-135deg,var(--color2_25),var(--color2_75));width:50px;height:50px;line-height:50px;font-size:25px}
.koIconStyle3 .fa,
.koIconStyle3 .fas{line-height:50px;color:var(--color2);text-shadow:1px 1px 5px rgba(0,0,0,0.1)}
*/
/*
.koIconCircle{background:linear-gradient(-135deg,var(--color1_50),var(--color1_75));display:inline-block;margin:0 auto;width:100px;height:100px;line-height:100px;border-radius:100%;padding:0}
.koIconCircle .fa,
.koIconCircle .fas{line-height:100px;color:var(--color1_bw)}
*/
@media (max-width: 767px) {
div.kedit{padding:20px;}
div.kedit .kedit{padding:10px;}
/* with Bootstrap4 */
section.kedit{padding:40px 0;}
}
/* smaller than col-lg- */
@media (max-width: 992px) {
}
@media (min-width: 767px) {
.keditRight:not(.headerBanner){padding-left:40%}
.keditLeft:not(.headerBanner){padding-right:40%}
.keditRight.headerBanner{margin-left:40%}
.keditLeft.headerBanner{margin-right:40%}
/*Kopage 4+*/
section.keditRight{padding-left:30%}
section.keditLeft{padding-right:30%}
}
.ContactForm,.ContactForm.whiteShadowContainer{max-width:700px;margin:0 auto;font-size:16px}
.ContactForm .form-row{padding:3vw;text-align:left}
/* phone country code, country search, make it similar to bootstrap */
.iti__search-input {
margin: 5px;
width: calc(100% - 10px)!important;
padding: .375rem .75rem;
}
.keditLayout_1 .ContactForm .form-row{padding:0}
.keditLayout_1 .ContactForm .thumbTitle{padding:20px 0;margin-bottom:20px;border-bottom: 1px solid rgba(0,0,0,0.2);}
.keditLayout_1 .ContactForm.whiteShadowContainer {
background:transparent;
box-shadow: none;
}
.keditLayout_2 .ContactForm .form-label:not(.form-label-check) {display:none;}
/*.keditLayout_2 .ContactForm .btn {display:block;width: 100%;}*/
.keditLayout_2 .ContactForm .form-row{padding:0;}
.keditLayout_2 .ContactForm .thumbTitle{padding:20px 0;margin-bottom:20px;border-bottom: 1px solid rgba(0,0,0,0.2);}
.keditLayout_2 .ContactForm.whiteShadowContainer {
background:transparent;
box-shadow: none;
}
.keditFullHeight .keditInheritFullHeight{min-height:100vh}
.parallax-window{
background-attachment: fixed !important;
background-position: 50% 0px;
background-repeat: no-repeat;
background-size: cover !important;
}
@supports (-webkit-touch-callout : none) {
.parallax-window{
background-attachment:scroll !important;
}
}
.koBg1,.koBgHover1:hover{
background: #1865C5;
background: linear-gradient(to bottom, #36A8F3 0%,#37ACF5 4%,#1865C5 100%);
}
.koBg2,.koBgHover2:hover{
background: #fbdd32;
background: linear-gradient(to bottom, #fbdd32 0%,#ffeb34 4%,#fed430 50%,#ffcf31 100%);
}
.koBg3,.koBgHover3:hover{
background: #555;
background: linear-gradient(to bottom, #666 0%,#333 100%);
}
.koBg4,.koBgHover4:hover{
background: #BABEC7;
background: linear-gradient(to bottom, #999DA9 10%,#E5E4E9 100%);
}
.koBg5,.koBgHover5:hover{
background: rgb(255,48,25);
background: linear-gradient(to bottom, rgba(255,48,25,1) 0%,rgba(207,4,4,1) 100%);
}
.koBgHover-1:hover{
background: #1865C5;
background: linear-gradient(to bottom, #37ACF5 4%,#1865C5 50%);
}
.koBgHover-2:hover{
background: #ffeb34;
background: linear-gradient(to bottom, #ffeb34 4%, #fed430 50%);
}
.koBgHover-3:hover{
background: #555;
background: linear-gradient(to bottom, #666 0%,#333 50%);
}
.koBgHover-5:hover{
background: rgb(255,48,25);
background: linear-gradient(to bottom, rgba(255,48,25,1) 0%,rgba(207,4,4,1) 50%);
}
/*
.marketing .col-lg-4 {
margin-bottom: 20px;
text-align: center;
}
.marketing h2 {
font-weight: normal;
}
.marketing .col-lg-4 p {
margin-right: 10px;
margin-left: 10px;
}
*/
/* Content Blocks Style */
/* old:
#contentArea{min-height:75vh}
new:*/
#contentArea{ min-height: initial;margin-bottom:auto}
#website{
display: flex;
flex-direction: column;
min-height: 100vh;
}
/*#contentArea,#headerContent{font-size:18px;clear:both;}
#contentArea small {font-size:14px}
#contentArea .col-sm-3,#contentArea .col-sm-4 {font-size:17px}
#contentArea .col-sm-4 h3{margin-top:0}*/
/* apply default style for HR only when it has no class */
#contentArea hr:not([class]){margin: 20px 0}
#website .breadcrumb a { text-decoration:none!important; color:#000!important }
#website .breadcrumb a i {margin-right:10px;}
#website .breadcrumb>li+li:before,
#website .breadcrumb .js-draggable>li+li:before {content:var(--bs-breadcrumb-custom-divider,"\203a");color:rgba(0,0,0,0.2);width:20px;display:inline-block;text-align:center}
/*
#website .breadcrumb > .active,
#website .breadcrumb li:last-of-type{
color: rgba(0,0,0,0.4)
}
*/
#website .breadcrumb-item{
color: rgba(0,0,0,0.4);
}
#website .keditDark .breadcrumb-item,
.koThemeDark #website .breadcrumb-item
{
color: rgba(255,255,255,0.7);
}
/*
#contentArea .keditDark .breadcrumb {
color: rgba(255,255,255,0.9) !important;
}
*/
/*
keditDark
koThemeDark
*/
#website .breadcrumb li:first-child > a:not(.breadcrumb-link):before {
font-family: Font Awesome\ 5 Free;
content: "\f015";
display: inline-block; font-weight:900;
margin-right:10px;font-size:16px;padding:0;
}
#website .breadcrumb{background: linear-gradient(to bottom,rgba(0,0,0,0.07),rgba(0,0,0,0.1));
background: none;
padding: 0;
margin: 0;
}
.clear-before:before{content:none!important}
.clear-after:after{content:none!important}
/*
.koThemeDark #contentArea .breadcrumb,#contentArea .keditDark .breadcrumb{background: linear-gradient(to bottom,rgba(0,0,0,0.2),rgba(0,0,0,0.3));
background: none;
}
*/
.koThemeDark #contentArea .breadcrumb a,
#contentArea .keditDark .breadcrumb a {
color:rgba(255,255,255,0.9)!important;
}
.koThemeDark #contentArea .breadcrumb a:hover,
#contentArea .keditDark .breadcrumb a:hover {
color:rgba(255,255,255,1)!important;
}
.koThemeDark #contentArea .breadcrumb > .active,
#contentArea .keditDark .breadcrumb > .active{color:rgba(255,255,255,0.6);}
.koThemeDark #contentArea .breadcrumb>li+li:before,
#contentArea .keditDark .breadcrumb>li+li:before {color:rgba(255,255,255,0.4);}
/*#contentArea a:not(.btn):not(.page-link):not(.list-group-item), #contentArea a.btn-link {
text-decoration: underline;
}*/
.koButtons {margin:20px 0 10px;clear:both}
.kedit.koZeroPadding{
padding:0;
}
.kedit.koZeroPadding .row{
margin:0;
}
.kedit.koZeroPaddingRight{
padding-right:0;
}
.kedit.koZeroPaddingLeft{
padding-left:0;
}
.kedit.koZeroPaddingTop{
padding-top:0;
}
.kedit.koZeroPaddingBottom{
padding-bottom:0;
}
.keditPullRight:not(.kedit){padding-right:0;margin-right:0}
/* .kedit.keditPullRight{padding-right:0} removing in v4, oct2019, it was breaking page a little, making content block too wide for screen (and scrollbar is appearing) */
.keditPullLeft:not(.kedit) {margin-left:0;padding-left:0}
/* .kedit.keditPullLeft{padding-left:0} removing in v4, oct2019, it was breaking page a little, making content block too wide for screen (and scrollbar is appearing) */
img.boxShadow50{box-shadow: 0 0 50px rgba(0,0,0,0.5)}
.kedit.koBlock1{
/*min-height:100vh;*/
display: flex;
justify-content: center;
align-items: center;
}
.koBlock1 h2 {font-size:40px;margin:30px 0}
.koBlock1 .koButtons {margin-top:40px}
/*no padding*/
.kedit.koBlock2 {padding:0 15px}
.koBlock2_A .row {
overflow: hidden;
background-image: -moz-linear-gradient(
left,
rgba(0,0,0,0.03),
rgba(0,0,0,0.03) 33.33%,
rgba(0,0,0,0.06) 33.33%,
rgba(0,0,0,0.06) 66.66%,
rgba(0,0,0,0.09) 66.66%,
rgba(0,0,0,0.09) 100%
);
}
.koBlock2_A .col-sm-4{padding-top:30px;padding-bottom:30px;}
img.img-bw {-webkit-filter: grayscale(100%);filter: grayscale(100%);}
.koGreyLogos img {-webkit-filter: grayscale(100%);filter: grayscale(100%); max-height: 40px; max-width:200px; opacity:0.5; margin: 0 20px 40px;}
.koGreyLogos{text-align:center;}
.koGreyLogos{margin:-20px 0 -60px}
/* new, since inline-editables are in use */
.koGreyLogos-2 img {max-height: 40px; max-width:200px; opacity:0.5; margin: 0 20px 40px;}
.koGreyLogos-2{text-align:center;}
.koGreyLogos-2{margin:-20px 0 -60px}
.col-logos img {max-height: 40px;}
.koGreyLogos-3 img {max-height: 40px; max-width:200px; margin:15px 20px;}
.koGreyLogos-3 img.kimgfilter5,
.koGreyLogos-3 img.kimgfilter5.lazy[data-was-processed],
.koGreyLogos-3 img.kimgfilter5.lazy[data-ll-status="loaded"]
{
opacity:0.5!important;transition:0.2s opacity!important
}
.koGreyLogos-3 img.kimgfilter5:hover,
.koGreyLogos-3 img.kimgfilter5.lazy[data-was-processed]:hover,
.koGreyLogos-3 img.kimgfilter5.lazy[data-ll-status="loaded"]:hover{
opacity:1!important
}
.koGreyLogos-3{text-align:center;}
.koGreyLogos-3{margin:0}
.koGreyLogos-4 img {max-height: 30px;}
/* change from 0.5 to 0.55 to improve accessibility, but it should be 0.65 for WCAG AAA */
.koOpacity{opacity:0.55} /* it oveerwritten a little lower, needs a review */
/*negative margin*/
@media (min-width: 992px)/* LG only */{
.nm-l100{margin-left:-100px}
.nm-r100{margin-right:-100px}
.nm-t100{margin-top:-100px}
.nm-b100{margin-bottom:-100px}
/*not sure what is this, something from old Kopage, so it has to stay here for compatibility*/
div.koBlock1 .row{
max-width:60vw;
}
}
/*box shadows*/
.bs-1{box-shadow: 0 15px 25px -15px rgba(0,0,0,0.4)}
.bs-2,.btn.bs-2{box-shadow: 1px 1px 3px rgba(0,0,0,0.2);}
.bs-3,.btn.bs-3{box-shadow: 2px 2px 10px rgba(0,0,0,0.2),2px 2px 5px rgba(0,0,0,0.2),1px 1px 3px rgba(0,0,0,0.2),1px 1px 2px rgba(0,0,0,0.2),1px 1px 1px rgba(0,0,0,0.5);}
.bs-4{box-shadow:5px 15px 50px 0 rgba(0,0,0,.1);}
.hoverUp{transition:.2s transform ease-in;}
.hoverUp:hover{transform: translateY(-5px);}
.hoverUp.imageCard > div:first-of-type:has(img) {
border-radius: var(--bs-border-radius) var(--bs-border-radius) 0 0 !important;
margin-top: -3rem !important;
margin-left: -3rem;
margin-right: -3rem;
width: calc(100% + 6rem);
overflow:hidden;
}
/* bento */
.overflow-hidden.rounded-5 > div:last-of-type:has(img),
.overflow-hidden.rounded-5 > div:last-of-type:has(iframe) {
/*border-radius: var(--bs-border-radius) var(--bs-border-radius) 0 0 !important;*/
margin-bottom: -3rem !important;
margin-right: -3rem;
width: calc(100% + 6rem);
}
.overflow-hidden.rounded-5 > div:last-of-type:has(img) img,
.overflow-hidden.rounded-5 > div:last-of-type:has(iframe) iframe{
border-bottom-left-radius:0!important;
}
.minHeight{min-height:20px}
/* general content color */
#website{letter-spacing:-0.02em;
/* font-size:calc(1.1rem * var(--kedit-fsx)); */
}
#website h1,#website h2,#website h3,#website h4,#website h5,#website h6{letter-spacing:-0.03em;font-weight:700}
#website h1 b,#website h2 b,#website h3 b,#website h4 b,#website h5 b,#website h6 b{font-weight:100}
#contentArea,.koThemeDark #contentArea .whiteShadowContainer,
#contentArea .keditWhite {color:rgba(0,0,0,0.7)}
.keditQuote{position:relative}
.keditQuote:before{content:'❞';position:absolute;left:0;top:0;font-size:150px;font-family:serif;transform:translateX(-25%) translateY(-25%);color:#000}
.keditQuote.keditQuoteColor1:before{color:var(--color1)}
.keditQuote.keditQuoteColor2:before{color:var(--color2)}
/* dark theme? */
#contentArea h1,#contentArea h2,#contentArea h3,#contentArea h4,
.koThemeDark #contentArea .keditWhite strong,
.koThemeDark #contentArea .keditWhite h1,
.koThemeDark #contentArea .keditWhite h2,
.koThemeDark #contentArea .keditWhite h3,
.koThemeDark #contentArea .keditWhite h4,
.koThemeDark #contentArea .whiteShadowContainer strong,
.koThemeDark #contentArea .whiteShadowContainer h1,
.koThemeDark #contentArea .whiteShadowContainer h2,
.koThemeDark #contentArea .whiteShadowContainer h3,
.koThemeDark #contentArea .whiteShadowContainer h4,
#contentArea .keditDark .keditWhite strong,
#contentArea .keditDark .keditWhite h1,
#contentArea .keditDark .keditWhite h2,
#contentArea .keditDark .keditWhite h3,
#contentArea .keditDark .keditWhite h4 {color:rgba(0,0,0,1);}
/*#website #contentArea .keditDark .keditWhite a:not(.btn){color:var(--color1);}*/
.koThemeDark #contentArea .keditLayout_1 .ContactForm.whiteShadowContainer,
.keditLayout_1.keditDark .ContactForm.whiteShadowContainer{color:rgba(255,255,255,0.5)}
.koThemeDark #contentArea .keditLayout_1 .ContactForm.whiteShadowContainer strong,
.koThemeDark #contentArea .keditLayout_1 .ContactForm.whiteShadowContainer h1,
.koThemeDark #contentArea .keditLayout_1 .ContactForm.whiteShadowContainer h2,
.koThemeDark #contentArea .keditLayout_1 .ContactForm.whiteShadowContainer h3,
.koThemeDark #contentArea .keditLayout_1 .ContactForm.whiteShadowContainer h4,
#contentArea .keditLayout_1.keditDark .ContactForm.whiteShadowContainer strong,
#contentArea .keditLayout_1.keditDark .ContactForm.whiteShadowContainer h1,
#contentArea .keditLayout_1.keditDark .ContactForm.whiteShadowContainer h2,
#contentArea .keditLayout_1.keditDark .ContactForm.whiteShadowContainer h3,
#contentArea .keditLayout_1.keditDark .ContactForm.whiteShadowContainer h4,
#contentArea .keditLayout_1.keditDark .ContactForm.whiteShadowContainer h5,
#contentArea .keditLayout_2.keditDark .ContactForm.whiteShadowContainer h3,
#contentArea .keditLayout_2.keditDark .ContactForm.whiteShadowContainer h5,
.koThemeDark #contentArea .keditLayout_2 .ContactForm.whiteShadowContainer strong,
.koThemeDark #contentArea .keditLayout_2 .ContactForm.whiteShadowContainer h1,
.koThemeDark #contentArea .keditLayout_2 .ContactForm.whiteShadowContainer h2,
.koThemeDark #contentArea .keditLayout_2 .ContactForm.whiteShadowContainer h3,
.koThemeDark #contentArea .keditLayout_2 .ContactForm.whiteShadowContainer h4{color:rgba(255,255,255,1)}
.koThemeDark .keditLayout_1 .ContactForm .thumbTitle,
.koThemeDark .keditLayout_2 .ContactForm .thumbTitle {
border-bottom-color: rgba(255,255,255,0.2);
}
/*#contentArea h1 {letter-spacing: -1px;}*/
.h1, .h2, .h3, h1, h2, h3 {
margin-top: 10px;
margin-bottom: 10px;
}
.keditTextShadow {
text-shadow:2px 2px 10px rgba(0,0,0,0.2),2px 2px 5px rgba(0,0,0,0.2),1px 1px 3px rgba(0,0,0,0.2),1px 1px 2px rgba(0,0,0,0.2),1px 1px 1px rgba(0,0,0,0.5);
}
.keditTextShadow .kelement,
.keditTextShadow .keditWhite{text-shadow:none}
.koThemeDark #contentArea {color:rgba(255,255,255,0.5)}
.koThemeDark #contentArea strong {color:rgba(255,255,255,0.7)}
.koThemeDark #contentArea select {color:#000}
.koThemeDark #website {color:rgba(255,255,255,0.5)}
.koThemeDark #website h1,.koThemeDark #website h2,.koThemeDark #website h3:not(.thumbTitle),.koThemeDark #website h4:not(.thumbTitle) {color:rgba(255,255,255,1)}
#website .keditDark{color:rgba(255,255,255,0.7)}
#website .keditDark strong{color:rgba(255,255,255,0.9)}
#website .keditDark h1,#website .keditDark h2,#website .keditDark h3:not(.thumbTitle),#website .keditDark h4:not(.thumbTitle),
#website .keditDark h5:not(.thumbTitle)
#website #footerContent .keditDark h5:not(.thumbTitle),
.ko_Theme #website #footerContent .keditDark h5:not(.thumbTitle)
{color:rgba(255,255,255,1)}
#website .keditDark a:not(.btn):not(.page-link),
#website .keditDark a.btn.btn-link{color:rgba(255,255,255,0.7)}
#website .keditDark a:not(.btn):not(.page-link):hover,
#website .keditDark a.btn.btn-link:hover{color:rgba(255,255,255,1)}
#website .keditDark .keditWhite a:not(.btn):not(.page-link),
#website .keditDark .keditWhite a.btn.btn-link,
.koThemeDark #website .keditWhite a:not(.btn):not(.page-link){color:rgba(0,0,0,0.8)}
/*
break product names in shop if they're too long:
*/
.shopProductsList h3{
word-wrap: break-word;
}
/*#contentArea .btn.btn-ghost{color: #000;box-shadow:inset 0 0 0 1px rgba(0,0,0,1); }
#contentArea .btn.btn-ghost.btn-xl{box-shadow:inset 0 0 0 2px rgba(0,0,0,1); }
#contentArea .btn.btn-ghost:hover{background:rgba(255,255,255,0.7)}
*/
#contentArea .keditDark .btn.btn-ghost{color: #fff;/*box-shadow:inset 0 0 0 1px rgba(255,255,255,1);*/ border:1px solid #fff}
/*#contentArea .keditDark .btn.btn-ghost.btn-xl{box-shadow:inset 0 0 0 2px rgba(255,255,255,1); }*/
#contentArea .keditDark .btn.btn-ghost.btn-xl{border:2px solid #fff;box-sizing:border-box }
#contentArea .keditDark .btn.btn-ghost:hover{background:rgba(255,255,255,0.3)}
/*
- before version 3.1
#footerContent {color:rgba(0,0,0,0.5);}
#footerContent a {color:rgba(0,0,0,0.75);}
#footerContent h1,#footerContent h2,#footerContent h3,#footerContent h4,#footerContent a:hover {color:rgba(0,0,0,1);}
#footerContent h1,#footerContent h2,#footerContent h3,#footerContent h4{font-size:18px;}
*/
#footerContent {color:rgba(0,0,0,0.5);overflow: hidden;}
#footerContent a:not(.btn) {color:rgba(0,0,0,0.75);text-decoration:underline}
#footerContent ul.sitemap,
.keditFooter ul.sitemap {
min-width:inherit;
margin-bottom:30px;
}
#footerContent ul.sitemap:not(:last-of-type),
.keditFooter ul.sitemap:not(:last-of-type) {
margin-right:100px;
}
#footerContent ul.sitemap li,
.keditFooter ul.sitemap li {
padding: 0;
font-size: inherit;
line-height: 1.5;
font-weight: 700;
}
#footerContent ul.sitemap h5{ font-weight: normal; font-size:100%; }
#footerContent ul.sitemap ul,
.keditFooter ul.sitemap ul {
margin:10px 0 0;padding:0;
}
#footerContent ul.sitemap ul ul{margin:10px}
#footerContent ul.sitemap ul::before,
.keditFooter ul.sitemap ul::before {
content: unset;
/*display: none;*/
}
#footerContent ul.sitemap ul li::before,
.keditFooter ul.sitemap ul li::before {
content: unset;
}
#website #footerContent ul.sitemap li a,
#website .keditFooter ul.sitemap li a {
padding: 0;
border: none;
background: inherit;
border-radius: 0;
text-decoration: inherit;
color: inherit;
box-shadow: none;
font-weight:400;
opacity:0.7;
}
#website #footerContent ul.sitemap li a:hover,
#website .keditFooter ul.sitemap li a:hover {opacity:1}
/*.constant-width-to-height-ratio {
background: #333;
width: 50%;
}
.constant-width-to-height-ratio::before {
content: '';
padding-top: 100%;
float: left;
}
.constant-width-to-height-ratio::after {
content: '';
display: block;
clear: both;
}*/
#website .kimgcover img{
min-height:100%;max-height:100%;object-fit: cover; object-position: center;
width:100%;
}
.kimgRatio{
text-align: center;
}
.text-left .kimgRatio{text-align:left;}
.text-right .kimgRatio{text-align:right;}
.kimgRatio1,
.kimgRatio2,
.kimgRatio3,
.kimgRatio4,
.kimgRatio5,
.kimgRatio6,
.kimgRatio7,
.kimgRatio8{
width:100%;
position:relative;
text-align: center;
}
#website .kimgRatio1 img,
#website .kimgRatio2 img,
#website .kimgRatio3 img,
#website .kimgRatio4 img,
#website .kimgRatio5 img,
#website .kimgRatio6 img,
#website .kimgRatio7 img,
#website .kimgRatio8 img{
object-fit: cover;
width: 2000px;
height: 2000px;
position: absolute;
top: 0;
left: 0;
max-height:100%;
}
.kimgRatio1 .keditImageWrap,
.kedit .kimgRatio1 > a,
.kimgRatio2 .keditImageWrap,
.kedit .kimgRatio2 > a,
.kimgRatio3 .keditImageWrap,
.kedit .kimgRatio3 > a,
.kimgRatio4 .keditImageWrap,
.kedit .kimgRatio4 > a,
.kimgRatio5 .keditImageWrap,
.kedit .kimgRatio5 > a,
.kimgRatio6 .keditImageWrap,
.kedit .kimgRatio6 > a,
.kimgRatio7 .keditImageWrap,
.kedit .kimgRatio7 > a,
.kimgRatio8 .keditImageWrap,
.kedit .kimgRatio8 > a {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%; display: block;
}
.kimgRatio1::before,
.kimgRatio2::before,
.kimgRatio3::before,
.kimgRatio4::before,
.kimgRatio5::before,
.kimgRatio6::before,
.kimgRatio7::before,
.kimgRatio8::before{content: '';padding-top: 100%;float: left;}
/* 4:3 */ .kimgRatio2::before{padding-top: 75%}
/* 16:9 */ .kimgRatio3::before{padding-top: 56.25%}
/* 2:1 */ .kimgRatio4::before{padding-top: 50%}
/* 3:4 */ .kimgRatio6::before{padding-top: 125%}
/* 9:16 */ .kimgRatio7::before{padding-top: 143.75%}
/* 1:2 */ .kimgRatio8::before{padding-top: 150%}
.kimgRatio1::after,
.kimgRatio2::after,
.kimgRatio3::after,
.kimgRatio4::after,
.kimgRatio5::after,
.kimgRatio6::after,
.kimgRatio7::after,
.kimgRatio8::after{content: '';display: block;clear: both;}
.kimgfilter1{box-shadow:2px 2px 10px rgba(0,0,0,0.3);background:#f5f6f7;}
.kimgfilter2{border-radius:10px;}
.kimgfilter3{box-shadow:2px 2px 12px -2px rgba(0,0,0,0.1),1px 3px 5px rgba(0,0,0,0.05);border-radius:10px;background:#f5f6f7;
/* more subtle?
box-shadow: -8px 10px 25px 0 rgba(0,0,0,.05);
*/
}
.kimgfilter4{box-shadow:2px 2px 10px rgba(0,0,0,0.2);border-radius:5px;border:7px solid #fff;background:#f5f6f7;}
.kimgfilter5{-webkit-filter: grayscale(100%);filter: grayscale(100%);/*background:#f5f6f7;*/}
.kimgfilter6{/*.img-circle*/border-radius: 50%;background:#f5f6f7;}
.kimgfilter7{-webkit-filter: sepia(100%);filter: sepia(100%);background:#f5f6f7;}
.kimgfilter8{border-radius:10px;border-radius:calc(5rem + 10vw) 0}
.kfilterBgMove50{background-position:-50vw!important}
/*.kedit.kfilter,.keditActive.kedit.kfilter,.keditActive.kedit.kfilter:hover{
border:5px dotted blue;
box-shadow: inset 0 0 0 100vw rgba(0,0,0,0.4);
}*/
.kedit{position:relative;}
/*
.kfilter1::before,.kfilter2:before,.kfilter3::before,.kfilter4::before,.kfilter5::before,
.kfilter6::before,.kfilter11::before,.kfilter12::before,.kfilter13::before,.kfilter14::before,
.kfilter15::before,.kfilter16::before,.kfilter21::before,.kfilter22::before,.kfilter23::before{
content:'';display:block;position:absolute;top:0;left:0;bottom:0;right:0;pointer-events:none;
}
.kfilter1::before{box-shadow: inset 0 0 0 100vw rgba(0,0,0,0.5);}
.kfilter2::before{box-shadow: inset 0 0 100vw 10vw rgba(0,0,0,0.7);}
.kfilter3::before{box-shadow: inset 60vw 0 100vw rgba(0,0,0,0.7);}
.kfilter4::before{box-shadow: inset -60vw 0 100vw rgba(0,0,0,0.7);}
.kfilter5::before{box-shadow: inset 65vw 0 0 0 rgba(0,0,0,0.5);}
.kfilter6::before{box-shadow: inset -65vw 0 0 0 rgba(0,0,0,0.5);}
.kfilter11::before{box-shadow: inset 0 0 0 100vw rgba(255,255,255,0.8);}
.kfilter12::before{box-shadow: inset 0 0 100vw 10vw rgba(255,255,255,0.8);}
.kfilter13::before{box-shadow: inset 60vw 0 100vw rgba(255,255,255,0.8);}
.kfilter14::before{box-shadow: inset -60vw 0 100vw rgba(255,255,255,0.8);}
.kfilter15::before{box-shadow: inset 65vw 0 0 rgba(255,255,255,0.8);}
.kfilter16::before{box-shadow: inset -65vw 0 0 rgba(255,255,255,0.8);}
.kfilter21::before,.kfilter22::before{box-shadow: inset 0 0 0 100vw rgba(0,0,0,0.3);}
.kfilter23{border-radius:25px;}
.kfilter23::before{border-radius:25px;box-shadow: inset 0 0 0 100vw rgba(0,0,0,0.3), 0 0 30px rgba(0,0,0,0.4);}
*/
#website div.kfilter1,div.kfilter1,#website section.kfilter1,div.keditActive.kfilter1,div.keditActive.kfilter1:hover{
/*black*/
box-shadow: inset 0 0 0 100vw rgba(0,0,0,0.5);
}
#website div.kfilter2,#website section.kfilter2,div.keditActive.kfilter2,div.keditActive.kfilter2:hover{
box-shadow: inset 0 0 100vw 10vw rgba(0,0,0,0.7);}
#website div.kfilter3,#website section.kfilter3,div.keditActive.kfilter3,div.keditActive.kfilter3:hover{
box-shadow: inset 60vw 0 100vw rgba(0,0,0,0.7);}
#website div.kfilter4,#website section.kfilter4,div.keditActive.kfilter4,div.keditActive.kfilter4:hover{
box-shadow: inset -60vw 0 100vw rgba(0,0,0,0.7);}
#website div.kfilter5,#website section.kfilter5,div.keditActive.kfilter5,div.keditActive.kfilter5:hover{
box-shadow: inset 65vw 0 0 0 rgba(0,0,0,0.5);}
#website div.kfilter6,#website section.kfilter6,div.keditActive.kfilter6,div.keditActive.kfilter6:hover{
box-shadow: inset -65vw 0 0 0 rgba(0,0,0,0.5);
}
#website div.kfilter11,#website section.kfilter11,div.keditActive.kfilter11,div.keditActive.kfilter11:hover{
box-shadow: inset 0 0 0 100vw rgba(255,255,255,0.8);}
#website div.kfilter12,#website section.kfilter12,div.keditActive.kfilter12,div.keditActive.kfilter12:hover{
box-shadow: inset 0 0 100vw 10vw rgba(255,255,255,0.8);}
#website div.kfilter13,#website section.kfilter13,div.keditActive.kfilter13,div.keditActive.kfilter13:hover{
box-shadow: inset 60vw 0 100vw rgba(255,255,255,0.8);}
#website div.kfilter14,#website section.kfilter14,div.keditActive.kfilter14,div.keditActive.kfilter14:hover{
box-shadow: inset -60vw 0 100vw rgba(255,255,255,0.8);}
#website div.kfilter15,#website section.kfilter15,div.keditActive.kfilter15,div.keditActive.kfilter15:hover{
box-shadow: inset 65vw 0 0 rgba(255,255,255,0.8);}
#website div.kfilter16,#website section.kfilter16,div.keditActive.kfilter16,div.keditActive.kfilter16:hover{
box-shadow: inset -65vw 0 0 rgba(255,255,255,0.8);}
#website div.kfilter21 .keditHeader,div.keditActive.kfilter21 .keditHeader,div.keditActive.kfilter21:hover .keditHeader,
#website div.kfilter22 .keditHeader,div.keditActive.kfilter22 .keditHeader,div.keditActive.kfilter22:hover .keditHeader{
box-shadow: inset 0 0 0 100vw rgba(0,0,0,0.3);
}
#website div.kfilter22 .keditHeader,div.keditActive.kfilter22 .keditHeader,div.keditActive.kfilter22:hover .keditHeader,
#website div.kfilter23 .keditHeader,div.keditActive.kfilter23 .keditHeader,div.keditActive.kfilter23:hover .keditHeader,
#website div.kfilter23 .headerBanner,div.keditActive.kfilter23 .headerBanner,div.keditActive.kfilter23:hover .headerBanner,
#website div.headerBanner.kfilter23,div.headerBanner.keditActive.kfilter23,div.headerBanner.keditActive.kfilter23:hover
{
border-radius:25px;}
#website div.kfilter23 .keditHeader,div.keditActive.kfilter23 .keditHeader,div.keditActive.kfilter23:hover .keditHeader,
#website div.kfilter23 .headerBanner,div.keditActive.kfilter23 .headerBanner,div.keditActive.kfilter23:hover .headerBanner,
#website div.headerBanner.kfilter23,div.headerBanner.keditActive.kfilter23,div.keditActive.headerBanner.kfilter23:hover,div.kedit.headerBanner.kfilter23:hover
{
box-shadow: inset 0 0 0 100vw rgba(0,0,0,0.3), 0 0 30px rgba(0,0,0,0.4);
}
#website div.kfilterColor1,
#website section.kfilterColor1,
div.keditActive.kfilterColor1,
div.keditActive.kfilterColor1:hover{
/*color1*//*background-color: rgba(red($color), green($color), blue($color), 0.2);*/
--filtercolor:rgba(var(--color1_rgb),0.75);
box-shadow: inset 0 0 0 100vw var(--filtercolor);
}
#website div.kfilterColor2,div.kfilterColor2,#website section.kfilterColor2,div.keditActive.kfilterColor2,div.keditActive.kfilterColor2:hover{
/*color2*/
--filtercolor:rgba(var(--color2_rgb),0.75);
box-shadow: inset 0 0 0 100vw var(--filtercolor);
}
/*kedit headerBanner keditDark keditLeft kfilter23*/
.koPreTitle{
text-transform: uppercase;
letter-spacing: 2px;
font-size: 1rem;
font-weight: 700;
/* color: rgba(0,0,0,0.3); improve WCAG AA, should be 0.65 for AAA */
color: rgba(0,0,0,0.54);
}
.keditDark .koPreTitle {
/* color: rgba(255,255,255,0.3); improve WCAG AA, should be 0.59 for AAA */
color: rgba(255,255,255,0.46);
}
/* high contrast? */
@media (prefers-contrast) {
.koPreTitle{
color: #000!important;
background: #fff!important;
}
.keditDark .koPreTitle {
color: #fff!important;
background: #000!important;
}
}
/* header decoration */
.koHeader1 {
text-align: center;
position: relative;
line-height: 2;
overflow: hidden;
}
/*body:not(.koEditingMode)*/ .koHeader1:before,/*body:not(.koEditingMode)*/ .koHeader1:after {
content: "";
display: inline-block;
bottom: .6ex;
left: -2ex;
width: 100%;
margin-left: -100%;
height: 3px;
position: relative;
border-bottom:2px solid rgba(0,0,0,0.3);
}
/*body:not(.koEditingMode) */.koHeader1::after {
left: 2ex;
margin-right: -100%;margin-left:auto;
}
.koHeader2 {
text-align: center;
position: relative;
line-height: 2;
overflow: hidden;
}
.koHeader2:before,/*body:not(.koEditingMode)*/ .koHeader2:after {
content: "";
display: inline-block;
bottom: .6ex;
left: -2ex;
width: 100%;
margin-left: -100%;
height: 2px;
position: relative;
background: linear-gradient(to right, rgba(0,0,0,0) 75%,rgba(0,0,0,0.3));
/*border-bottom:3px solid rgba(0,0,0,0.3);*/
}
/*body:not(.koEditingMode) */.koHeader2::after {
left: 2ex;
margin-right: -100%;margin-left:auto;
background: linear-gradient(to left, rgba(0,0,0,0) 75%,rgba(0,0,0,0.3));
}
/*.kedit:before{
content:'';border:5px solid red;
z-index: 1;
position: absolute;top:10px;left:10px;bottom:0;right:0; overflow:auto;
background: rgba(255, 255, 255, 0.4); box-shadow:0 0 10px rgba(0,0,0,1);display:block;
width: 100%;height:100vh;
}*/
/*make images responsive by default*/
#website img {display: inline-block; height: auto; max-width: 100%; flex:none;}
#website footer img,
#website .keditFooterLogo {
max-height:100px;
max-width:200px;
}
#website .input-group-addon img {max-width:none}
/* for content blocks, where image is full height on of the sides..
var(--breakpoint-md)==768px*/
.col-autoheight{
height: 100%;
position: absolute;
z-index: 1;
top: 0;
bottom: 0;
}
.col-autoheight-right{
right: 0;
}
.col-autoheight-left{
left: 0;
}
#website .img-autoheight {
object-fit: cover;
height: 100%;
width: 100%;
}
.col-items-middle .col-container {
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
}
.col-items-bottom .col-container {
height: 100%;
display: flex;
flex-direction: column;
justify-content: end;
}
@media (max-width:768px){
#website footer * {
text-align: center;
}
#website footer li * {
text-align: left;
}
/*
.keditLayer_footer,.keditLayer_header{display:none}
instead of hiding decorations, make sure their height is set to "auto"
*/
.keditLayer_footer,.keditLayer_header{height:inherit!important}
.col-autoheight{
height: inherit;
position: relative;
top: inherit;
bottom: inherit;
max-height:50vh;
/* display:none;
position:static;
height:inherit;
position:relative;
height:inherit;
*/
}
.keditExpand{
position:static;
z-index: inherit;top:inherit;right:inherit;bottom:inherit;height:inherit;width:100%;
}
/* theme "hiking" and "business" before April 2021 */
.col-8.keditExpand{
display:none;
}
/*
.float-left.keditExpand{right:auto;left:0}
.keditExpand .img-full{height:100%!important;width:100%;object-fit:cover}
.keditExpand.pb-5 img.img-full{height:calc(100% - 3rem)!important}
.keditExpand.pb-3 img.img-full{height:calc(100% - 1rem)!important}
*/
}
.max-vh-100 {
max-height: 100vh;
}
.min-vh-75 {
min-height: 75vh;
}
@media (max-width: 991px) {
.keditExpand-lg{position:static;z-index: inherit;top:inherit;right:inherit;bottom:inherit;height:inherit;width:100%;}
.img-clip {
clip-path: none !important
}
}
.col-autoheight .keditImageWrap{height: 100%;width: 100%;}
@media (min-width: 768px) {
.img-perspective-right{
will-change: transform;
transition: all 0.3s ease-out!important;
box-shadow: 15px 25px 50px rgba(0,0,0,0.25);
transform: perspective(1000px) rotateY(-15deg) rotateX(5deg) rotateZ(5deg) scaleY(0.9) scaleX(0.95);
}
.img-perspective-right:hover,
.keditImageWrap:hover .img-perspective-right{
box-shadow: 5px 15px 50px rgba(0,0,0,0.3) !important;
transform: perspective(1000px) rotateY(0deg) rotateX(0deg) rotateZ(0deg) scale(1) !important;
}
.img-perspective-left{
will-change: transform;
transition: all 0.3s ease-out!important;
box-shadow: -15px 25px 50px rgba(0,0,0,0.25);
transform: perspective(1000px) rotateY(15deg) rotateX(5deg) rotateZ(-5deg) scaleY(0.9) scaleX(0.95);
}
.img-perspective-left:hover,
.keditImageWrap:hover .img-perspective-left{
box-shadow: -5px 15px 50px rgba(0,0,0,0.3) !important;
transform: perspective(1000px) rotateY(0deg) rotateX(0deg) rotateZ(0deg) scale(1) !important;
}
}
.loginWithPanel img {display:block;float:left;margin-right:20px;}
.btn.loginWithPanel {display:block;overflow:auto;padding:20px 30px;text-align:left;color:#666}
.loginWithPanel span {line-height:20px;padding:10px;display:block}
.btn-facebook:before{font-family: "Font Awesome 5 Brands";content:"\f082";margin-right:7%;}
.btn-twitter:before{font-family: "Font Awesome 5 Brands";content:"\e61b";margin-right:7%;}
.btn-google:before{font-family: "Font Awesome 5 Brands";content:"\f0d5";margin-right:7%;}
.btn-linkedin:before{font-family: "Font Awesome 5 Brands";content:"\f08c";margin-right:7%;}
.btn-youtube:before{font-family: "Font Awesome 5 Brands";content:"\f167";margin-right:7%;}
.btn-instagram:before{font-family: "Font Awesome 5 Brands";content:"\f16d";margin-right:7%;}
.btn-email:before{font-family: "Font Awesome 5 Free";content:"\f0e0";margin-right:7%;}
.btn-addtoany:before{font-family: "Font Awesome 5 Free";content:"\f1e0";text-indent:0px;font-weight:800}
/*
.btn-facebook{ background:#3B5998;color:#fff;text-decoration:none; margin-bottom:5px;}
.btn-facebook:hover{ background:#3A5795;color:#fff;text-decoration:none}
.btn-twitter,.btn-twitter:hover{ background:#55ACEE;color:#fff;text-decoration:none; margin-bottom:5px}
.btn-twitter:hover{ background:#0084B4}
.btn-google,.btn-google:hover{ background:#E53935;color:#fff;text-decoration:none; margin-bottom:5px}
.btn-google:hover{ background:#C9322E}
.btn-linkedin,.btn-linkedin:hover{ background:#1D87BD;color:#fff;text-decoration:none; margin-bottom:5px}
.btn-linkedin:hover{ background:#0077B5}
.btn-youtube,.btn-youtube:hover{ background:#E32524;color:#fff;text-decoration:none; margin-bottom:5px}
.btn-youtube:hover{ background:#CC181E}
.btn-email,.btn-addtoany,.btn-email:hover,.btn-addtoany:hover{ background:#8899A6;color:#fff;text-decoration:none; margin-bottom:5px}
.btn-email:hover,.btn-addtoany:hover{ background:#777}
.btn-addtoany span{display:none}
.btn-addtoany{font-family: "Font Awesome 5 Free";content:"\f1e0";font-weight:800; margin-bottom:5px;min-width:0!important}
*/
.btn-facebook{ background:#3B5998;color:#fff!important;text-decoration:none; margin-bottom:5px;}
.btn-facebook:hover{ background:#2A477D;;}
.btn-twitter,.btn-twitter:hover{ background:#000000;color:#fff!important;text-decoration:none; margin-bottom:5px}
.btn-twitter:hover{ background:#000000;}
.btn-google,.btn-google:hover{ background:#E53935;color:#fff!important;text-decoration:none; margin-bottom:5px}
.btn-google:hover{ background:#C9322E;}
.btn-linkedin,.btn-linkedin:hover{ background:#1D87BD;color:#fff!important;text-decoration:none; margin-bottom:5px}
.btn-linkedin:hover{ background:#0077B5;}
.btn-youtube,.btn-youtube:hover{ background:#E32524;color:#fff!important;text-decoration:none; margin-bottom:5px}
.btn-youtube:hover{ background:#CC181E;}
.btn-instagram,.btn-instagram:hover{ background:#4c89bb;color:#fff!important;text-decoration:none; margin-bottom:5px}
.btn-instagram:hover{ background:#3f729b;}
.btn-email,.btn-addtoany,.btn-email:hover,.btn-addtoany:hover{ background:#8899A6;color:#fff!important;text-decoration:none; margin-bottom:5px}
.btn-email:hover,.btn-addtoany:hover{ background:#777;}
.btn-addtoany span{display:none}
.btn-addtoany{font-family: "Font Awesome 5 Free";content:"\f1e0";font-weight:800;; margin-bottom:5px; min-width:0!important}
.topmenu{letter-spacing: -0.03em;}
.topmenu .topmenuSocial a{display:inline-block;padding:0;width:30px;height:30px;line-height:30px;text-align:center;text-shadow:none;}
#headerMenu.koMenu2 .topmenu .topmenuSocial a,
#headerMenu.koMenu7 .topmenu .topmenuSocial a{padding:0 15px;width:auto;}
html:not(.koTheme4) #headerMenu:not(.koMenu2):not(.koMenu7) .topmenuSocial span {margin-left:10px;padding-left:10px;display:inline-block;/*border-left:1px solid rgba(0,0,0,0.3)*/}
#headerMenu .topmenu .topmenuSocial span a:hover{border-radius:3px;opacity:1;}
#headerMenu .topmenu .topmenuSocial span a.koSocialFacebookHover:hover{color:#fff;background:#44619D}
#headerMenu .topmenu .topmenuSocial span a.koSocialTwitterHover:hover{color:#fff;background:#000000}
#headerMenu .topmenu .topmenuSocial span a.koSocialGoogleHover:hover{color:#fff;background:#DE5347}
#headerMenu .topmenu .topmenuSocial span a.koSocialYouTubeHover:hover{color:#fff;background:#CC181E}
#headerMenu .topmenu .topmenuSocial span a.koSocialSkypeHover:hover{color:#fff;background:#009EE5}
#headerMenu .topmenu .topmenuSocial span a.koSocialWhatsappHover:hover{color:#fff;background:#02E876}
#headerMenu .topmenu .topmenuSocial span a.koSocialInstagramHover:hover{color:#fff;background:#125688}
#headerMenu .topmenu .topmenuSocial span a.koSocialPinterestHover:hover{color:#fff;background:#BD1D23}
#headerMenu .topmenu .topmenuSocial span a.koSocialLinkedInHover:hover,
#headerMenu .topmenu .topmenuSocial span a.koSocialLinkedHover:hover{color:#fff;background:#1A85BC}
#headerMenu .topmenu .topmenuSocial span a.koSocialTelegramHover:hover{color:#fff;background:#34AEED}
#headerMenu .topmenu .topmenuSocial span a.koSocialDiscordHover:hover{color:#fff;background:#5865F2}
#headerMenu .topmenu .topmenuSocial span a.koSocialThreadsHover:hover{color:#fff;background:#000000}
#headerMenu .topmenu .topmenuSocial span a.koSocialBlueskyHover:hover{color:#fff;background:#0285ff}
#headerMenu .topmenu .topmenuSocial span a.koSocialMastodonHover:hover{color:#fff;background:#6364ff}
#headerMenu .topmenu .topmenuSocial span a.koSocialGithubHover:hover{color:#fff;background:#1f2329}
#headerMenu .topmenu .topmenuSocial span a.koSocialTwitchHover:hover{color:#fff;background:#9047FF}
#headerMenu .topmenu .topmenuSocial span a.koSocialVKHover:hover{color:#fff;background:#4B75A8}
#headerMenu .topmenu .topmenuSocial span a.koSocialOKHover:hover{color:#fff;background:#EE8213}
#headerMenu .topmenu .topmenuSocial span a.koSocialPhoneHover:hover{color:#fff;background:linear-gradient(to bottom,#999,#666)}
#headerMenu .topmenu .topmenuSocial span a.koSocialMailHover:hover{color:#fff;background:linear-gradient(to bottom,#999,#666)}
/*Kopage 4+*/
.ko_Theme .menuHolder li {align-items:center;display:flex!important}
.ko_Theme .menuHolder li.topmenuSocial a {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
vertical-align: baseline;
line-height: 30px;
text-shadow: none;
background:none;
opacity:0.7;
text-transform: inherit;
}
.ko_Theme .menuHolder li.topmenuSocial em {
display:block;
line-height: 18px;
margin-top:-7px;
opacity:0.7;font-weight:normal;font-style:normal;font-size:75%
}
.ko_Theme .menuHolder li.topmenuSocial#topmenuSocialShop a{
height:auto;background:inherit;
}
#topmenuSocialShop a{width:auto;padding-left:10px;padding-right:12px;position:relative}
#totalItems{border-radius:5px;position:absolute;top:0;right:0;height:18px;width:18px;text-align:center;line-height:18px;background:var(--color1);color:var(--color1_25);opacity:1;padding: 0 !important;font-size:12px}
[dir="rtl"] #totalItems {
left: 0;
right: auto;
}
#contentArea figure.image {
display: inline-block;
border: 1px solid #ccc;
margin: 10px 2px 10px 1px;
background: #f5f2f0;
}
#contentArea figure.align-left {
float: left;
}
#contentArea figure.align-right {
float: right;
}
#contentArea figure.image img {
margin: 10px 10px 0;
}
#contentArea figure.image figcaption {
margin: 6px 10px;
text-align: center;
font-size:12px;
}
.kedit .page-header {
margin-top: 0;
}
.WxEditableArea .pagination > .active > a,.WxEditableArea .pagination > .active > a:hover {color:#fff;}
ul.koCheckList {margin:0;padding:0;list-style:none;text-align:left}
ul.koCheckList li{color:#000;
position: relative;padding:0 0 0 50px;margin-bottom:10px;
}
.koThemeDark ul.koCheckList li,.keditDark ul.koCheckList li{color:#FFF}
ul.koCheckList li:before {
text-transform:none;
content:var(--koListIcon,"\f00c");
font-family:"Font Awesome 5 Free";
font-weight:600;
padding:0;margin-right:10px;background:#ccc;color:#fff;width:30px;height:30px;display:inline-block;text-align:center;;border-radius:50%;
background:transparent!important;
color:var(--koListColor,var(--color1));
top:0;
left:0;
width: 40px;
height: 40px;
position:absolute;
}
ul.koCheckList.koCheckList-f00c li:before{
content:"\f00c";
}
ul.koCheckList.koCheckList-f058 li:before{
content:"\f058";
}
ul.koCheckList.koCheckList-f14a li:before{
content:"\f14a";
}
ul.koCheckList.koCheckList-f00d li:before{
content:"\f00d";
}
ul.koCheckList.koCheckList-f057 li:before{
content:"\f057";
}
ul.koCheckList.koCheckList-f2d3 li:before{
content:"\f2d3";
}
ul.koCheckList.koCheckList-f061 li:before{
content:"\f061";
}
ul.koCheckList.koCheckList-f0a9 li:before{
content:"\f0a9";
}
ul.koCheckList.koCheckList-f105 li:before{
content:"\f105";
}
ul.koCheckList.koCheckList-f138 li:before{
content:"\f138";
}
ul.koCheckList.koCheckList-f06a li:before{
content:"\f06a";
}
ul.koCheckList.koCheckList-f05a li:before{
content:"\f05a";
}
ul.koCheckList.koCheckList-f059 li:before{
content:"\f059";
}
ul.koCheckList.koCheckList-f004 li:before{
content:"\f004";
}
ul.koCheckList.koCheckList-f7a9 li:before{
content:"\f7a9";
}
ul.koCheckList.koCheckList-f111 li:before{
content:"\f111";
}
ul.koCheckList.koCheckList-f0da li:before{
content:"\f0da";
}
ul.koCheckList.koCheckList-f164 li:before{
content:"\f164";
}
ul.koCheckList.koCheckList-f165 li:before{
content:"\f165";
}
ul.koCheckList.koCheckList-f0a4 li:before{
content:"\f0a4";
}
ul.koCheckList.koCheckList-f071 li:before{
content:"\f071";
}
.koThemeDark ul.koCheckList li:before,.keditDark ul.koCheckList li:before{
color:var(--koListColor,rgba(255,255,255,0.7));
}
/*koGrid Content Block (6 items grid, with icons)*/
.koGrid{display: flex; flex-wrap: wrap;}
.koGrid .col-sm-6{display: flex; flex-direction: column;justify-content: center}
.koGrid .col-sm-6:nth-of-type(1), .koGrid .col-sm-6:nth-of-type(2), .koGrid .col-sm-6.col-md-4:nth-of-type(3){
border-bottom: 1px solid rgba(0,0,0,0.1);
}
.koGrid .col-sm-6 {
border-right: 1px solid rgba(0,0,0,0.1);
position: relative;
}
/*b4: .col-md-6.col-lg-4*/
.keditDark .koGrid .col-sm-6.col-md-4:nth-of-type(1),.keditDark .koGrid .col-sm-6.col-md-4:nth-of-type(2),.keditDark .koGrid .col-sm-6.col-md-4:nth-of-type(3),
.koThemeDark .koGrid .col-sm-6.col-md-4:nth-of-type(1),.koThemeDark .koGrid .col-sm-6.col-md-4:nth-of-type(2),.koThemeDark .koGrid .col-sm-6.col-md-4:nth-of-type(3){
border-bottom: 1px solid rgba(255,255,255,0.2);
}
.keditDark .koGrid .col-sm-6.col-md-4,
.koThemeDark .koGrid .col-sm-6.col-md-4 {
border-right: 1px solid rgba(255,255,255,0.2);
position: relative;
}
.koGrid .col-sm-6:hover {
background: linear-gradient(to bottom,rgba(0,0,0,0) 0%,rgba(0,0,0,0.025) 100%);
}
.koGrid .col-sm-6.col-md-4:nth-of-type(3n) {
border-right: 0;
}
.koGrid .col-sm-6.col-md-6:nth-of-type(2n) {
border-right: 0;
}
.koGrid .col-sm-6 {
padding: 45px 20px 30px;
}
.koGrid h2 {
font-size: 120%;
font-weight: 500;
margin: 34px 0px 18px;
}
div.kedit .koGrid i:not(.fa-lg):not(.fa-2x):not(.fa-3x):not(.fa-4x):not(.fa-5x),div.kedit .koGrid span.fa {
font-size: 200%;
}
@media (max-width: 991px) {
.koGrid .col-sm-6.col-md-4:nth-of-type(n){
border-bottom:0;
border-right:0; border-top:0;
}
}
.text-black,
.text-black a{color:rgba(0,0,0,1)!important}
.koCard1{border:0;box-shadow: 3px 3px 13px rgba(0,0,0,0.1);}
.koCard1 .card-body,
.koMenu .koCard1 .card-body{padding: 1.25rem;}
.koSquares{overflow:auto}
.koSquares .koSquare{
float:left;
position: relative;
margin:0;
background-color:#000;
overflow:hidden;
}
.koSquares3 .koSquare{
width: 33.333333333%;
padding-bottom: 33.333333333%;
}
.koSquares4 .koSquare{
width: 25%;
padding-bottom: 25%;
}
.koSquareContent{position:absolute;
height:100%; /* = 100% - 2*5% padding */
width:100%; /* = 100% - 2*5% padding */
padding: 0;}
#website .koSquareContent a:not(.keditInlineEdit){
position:absolute;top:0;left:0;color:#555;text-decoration:none;display:block;bottom:0;right:0;text-align:left;padding:10% 5% 5%;background:linear-gradient(to bottom,rgba(255,255,255,1) 0%,rgba(255,255,255,0) 70%);transition: 0.2s all; margin-top:-5%
}
#website .koSquareContent a:not(.keditInlineEdit):hover{/*background:linear-gradient(to bottom,rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);*/padding-top:7%;margin-top:0}
.koSquareContent a strong {display:block;font-size:150%;color:#000}
/* for 3.1+ */
.koSquare_content{position:absolute;height:100%;width:100%;padding: 0;z-index:1}
.koSquare_content > a strong {display:block;font-size:150%;color:#000}
.koSquare_content > a{
position:absolute;top:0;left:0;text-decoration:none;display:block;bottom:0;right:0;text-align:left;height:100%;
}
.koSquare_content > a span {padding:10% 5% 5%;position:absolute;color:#555;z-index:2;top:0;left:0;right:0;bottom:0;display:block;transition: 0.2s all; margin-top:-5%;background:linear-gradient(to bottom,rgba(255,255,255,1) 0%,rgba(255,255,255,0) 70%); }
.koSquare_content > a em {position:absolute;z-index:1;top:0;left:0;right:0;bottom:0; background-size:cover}
.koSquare_content > a:hover span{padding-top:7%;margin-top:0}
#website .keditDark .koSquareContent > a:not(.keditInlineEdit){color:rgba(255,255,255,0.8);background:linear-gradient(to bottom,rgba(0,0,0,0.8) 10%,rgba(0,0,0,0) 50%);}
#website .keditDark .koSquareContent > a:not(.keditInlineEdit):hover{background:linear-gradient(to bottom,rgba(0,0,0,0.9) 10%,rgba(0,0,0,0) 70%);}
#website .keditDark .koSquareContent > a strong {color:#fff}
.keditDark .koSquare_content > a span{color:rgba(255,255,255,0.8);background:linear-gradient(to bottom,rgba(0,0,0,0.8) 10%,rgba(0,0,0,0) 50%);}
.keditDark .koSquare_content > a span:before{transition:0.33s opacity;content:"";z-index:-1;position:absolute;top:0;left:0;width:100%;height:70%;background:linear-gradient(to bottom,rgba(0,0,0,1),rgba(0,0,0,0));opacity:0}
.keditDark .koSquare_content > a:hover span:before{opacity:1}
.keditDark .koSquare_content > a strong {color:#fff}
#website .kedit.mce-content-body .koSquareContent a:not(.keditInlineEdit){
background: rgba(255,255,255,0.7);bottom:auto;}
#website .kedit.mce-content-body.keditDark .koSquareContent a:not(.keditInlineEdit){
background: rgba(0,0,0,0.5);bottom:auto;}
@media (max-width: 900px){
.koSquares .koSquare{
width: 50%;
padding-bottom : 50%;
}
}
@media (max-width: 600px){
.koSquares .koSquare{
width: 100%;
padding-bottom : 100%;
}
}
/*kedit koBlock2 koBlock2_A container-fluid text-center koZeroPadding keditActive mce-content-body mce-edit-focus*/
#website .koSquareContent img{
/*max-width:100%;
display: inline-block;
*/height: 100%; width: auto;
max-height: 100%; max-width:none
}
.koCount ol {
counter-reset: li;
margin: 20px 0;
padding: 0;
}
.koCount ol > li {
position: relative;
margin: 0 0 10px 30px;
padding: 4px 8px 4px 70px;
list-style: none;
overflow:hidden;min-height:50px
}
.koCount ol > li::before {
content:counter(li);
counter-increment:li;
position:absolute;
top:0;
left:0;
width: 40px;
height: 40px;
line-height: 40px;
margin-right: 8px;
padding: 0; /*font-size:150%;*/
text-align:center;
color: white;
background-color:var(--color1);
border-radius: 40px;
font-weight: 700;
}
.koCount ol ol li:last-child {
margin-bottom:0;
}
/*pricing tables:*/
.kopt_plan ul{
list-style: none;
/*font-size: 15px;
color: #9095aa;*/
padding: 0px;
margin: 0px;
}
.kopt_plan li{
border-bottom: 1px solid rgba(255,255,255,0.2);
padding: 10px;
margin: 0px;
text-align: center;
}
section .kopt_plan li:last-of-type{border:0}
section .kopt_plan .btn{display:block;margin:20px;width:auto;}
section.koPricingTableFlat .kopt_plan .btn{margin:20px 0;}
.kopt_plan{
background-color: var(--color2);
border-radius: 0px 0px 5px 5px;
color: var(--color2_bw);
text-align: center;
}
.kopt_header{
border-bottom: 1px solid rgba(255,255,255,0.2);
padding: 20px;
font-size: 90px;
}
.kopt_header sub{
font-size: 32px; margin-top:-30px;bottom:.25em
}
.kopt_header sup{
font-size: 40px;
}
.kopt_header small{
display:block;
font-size: 14px;
color: rgba(255,255,255,0.2);
padding: 0px;
margin:-20px 0 0;
}
.kopt_price{
padding:20px;
}
.koPricingTableClean .kopt_plan{ background:#fff; color: #555}
.koPricingTableClean .kopt_header,.koPricingTableClean .kopt_plan li{ border-bottom-color: rgba(0,0,0,0.2);}
.koPricingTableClean .kopt_header small{ color: rgba(0,0,0,0.2);}
.koPricingTableFlat .kopt_plan {background:transparent;color: #555}
.koPricingTableFlat .kopt_plan ul {color: rgba(0,0,0,0.6); }
.koPricingTableFlat .kopt_header,.koPricingTableFlat .kopt_plan li{ border-bottom-color: rgba(0,0,0,0.2);}
.koPricingTableFlat .kopt_plan li{text-align:left}
.koPricingTableFlat .kopt_header{padding-top:0!important}
.koPricingTableFlat .kopt_header small{ color: rgba(0,0,0,0.5);font-size:16px!important}
.koPricingTableFlat .kopt_type {background:transparent;color: #555}
.koPricingTableFlat .kopt_price {padding:20px 0 0}
.kopt_type {
display:block!important;
margin:0;
box-shadow: inset 0 -5px 0 0 var(--color1_bw);
border-radius: 5px 5px 0 0;
font-size: 29px;
color: #fff;
text-align: center;
padding: 20px;
}
.koPricingTable .col-md-4:nth-of-type(1) .kopt_type,
.koPricingTable .col-lg-4:nth-of-type(1) .kopt_type,
.koPricingTable .col-lg-6:nth-of-type(1) .kopt_type{ background: var(--color1_75);color: var(--color1_75_bw);}
.koPricingTable .col-md-4:nth-of-type(2) .kopt_type,
.koPricingTable .col-lg-4:nth-of-type(2) .kopt_type,
.koPricingTable .col-lg-6:nth-of-type(2) .kopt_type{ background: var(--color1);color: var(--color1_bw);}
.koPricingTable .col-md-4:nth-of-type(3) .kopt_type,
.koPricingTable .col-lg-4:nth-of-type(3) .kopt_type{ background: var(--color1_75);color: var(--color1_75_bw);}
.koPricingTable:not(.koPricingTableFlat) .col-md-4,.koPricingTable:not(.koPricingTableFlat) .col-lg-4,.koPricingTable:not(.koPricingTableFlat) .col-lg-6{
padding:0;margin-bottom:10px;border-radius: 5px;
/* old:
box-shadow:0 0 10px rgba(0,0,0,0.1);
*/
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.08);
transition: all .3s ease-in-out;
}
.koPricingTable:not(.koPricingTableFlat) .col-md-4:hover,.koPricingTable:not(.koPricingTableFlat) .col-lg-4:hover,.koPricingTable:not(.koPricingTableFlat) .col-lg-6:hover {
/*
old:
box-shadow:0 0 10px rgba(0,0,0,0.5); transform: scale(1.02);
*/
transform: scale(1.01);
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.08);
}
.koPricingTable:not(.koPricingTableFlat) .col-md-4:nth-of-type(2),
.koPricingTable:not(.koPricingTableFlat) .col-lg-4:nth-of-type(2),
.koPricingTable:not(.koPricingTableFlat) .col-lg-6:nth-of-type(2) {
z-index:2;
box-shadow:0 10px 25px rgba(0,0,0,0.12),0 5px 5px rgba(0,0,0,0.08);
transform: scale(1.05);
}
.koPricingTable:not(.koPricingTableFlat) .col-md-4:nth-of-type(2):hover,
.koPricingTable:not(.koPricingTableFlat) .col-lg-4:nth-of-type(2):hover,
.koPricingTable:not(.koPricingTableFlat) .col-lg-6:nth-of-type(2):hover {
box-shadow:0 0 30px rgba(0,0,0,0.5);
box-shadow:0 15px 30px rgba(0,0,0,0.22),0 5px 15px rgba(0,0,0,0.12);
transform: scale(1.07);
}
.koPricingTable {overflow:hidden}
/*submenu*/
.koMenuVertical,.koMenuHorizontal {text-align:center; overflow:auto }
.koMenuVertical ul,.koMenuHorizontal ul { list-style:none; margin:0; padding: 0; width:100%; max-width:400px; display:inline-block;}
.koMenuHorizontal ul{width:auto;max-width:100%;}
.koMenuVertical li{display:block;text-align:left;padding:0;margin:0}
.koMenuHorizontal li {display:inline-block;text-align:left;padding:0;margin:0}
#website .koMenuVertical li a,
#website .koMenuHorizontal li a {display:block;margin:0 0 3px;background:rgba(0,0,0,0.05); border-radius:5px; text-decoration:none!important; color:#555;transition:0.2s all;
/* fix for multi-line links:
line-height:40px;text-indent: 15px; padding:0;
*/
text-indent: 0;
line-height: 1.2;
padding: 10px 15px;
}
#website .koMenu{
width: 100%;
max-width: 400px;
}
#website .koMenuVertical li a:hover,
#website .koMenuHorizontal li a:hover {color:#333;background:rgba(0,0,0,0.1);}
.koThemeDark #website .koMenuVertical li a,
.koThemeDark #website .koMenuHorizontal li a,
#website .keditDark .koMenuHorizontal li a,
#website .keditDark .koMenuVertical li a {background:rgba(255,255,255,0.2);color:rgba(255,255,255,0.8);}
.koThemeDark .koMenuVertical li a span,
.koThemeDark .koMenuHorizontal li a span,
.keditDark .koMenuHorizontal li a span,
.keditDark .koMenuVertical li a span {color:rgba(255,255,255,0.8);}
.koMenuHorizontal li a {text-indent:0;padding:0 20px;line-height:40px;margin:0}
.koMenuVertical li a span,.koMenuHorizontal li a span {color:#555;}
.koMenuVertical li a:hover,.koMenuHorizontal li a:hover {background:#eee}
.koMenuVertical li a:hover span,.koMenuHorizontal li a:hover span {color:#333}
.koThemeDark .koMenuVertical li a:hover,.koThemeDark .koMenuHorizontal li a:hover,
.keditDark .koMenuVertical li a:hover,.keditDark .koMenuHorizontal li a:hover {background:rgba(255,255,255,0.3)}
.koThemeDark .koMenuVertical li a:hover span,.koThemeDark .koMenuHorizontal li a:hover span,
.keditDark .koMenuVertical li a:hover span,.keditDark .koMenuHorizontal li a:hover span {color:rgba(255,255,255,0.9);}
.koMenuVertical li ul li {margin-left:7%;}
.koMenuHorizontal li ul {position:absolute;display:none;width:200px}
.koMenuHorizontal li ul li {display:block;padding-top:5px;}
.koMenuHorizontal li:hover ul li ul {display:none;right:-200px;top:0}
.koMenuHorizontal li:hover ul {display:block;}
.koMenuHorizontal li:hover ul li:hover ul {display:block;}
audio.koAudio,audio.kopageAudio{display:block;text-align:center;margin:0 auto;border-radius:5px;box-shadow:1px 1px 5px rgba(0,0,0,0.1)}
audio.koAudio::-webkit-media-controls-enclosure,
audio.kopageAudio::-webkit-media-controls-enclosure{border-radius:5px}
/*
Kopage 3.2 changes (Bootstrap 4)
*/
.h-100{height:100%;}
.btn-default {
color: #333!important;
background-color: #f5f6f7;
border-color: #f5f6f7;
}
.btn-default:hover {
background-color: #eee;
border-color: #eee;
}
/*submenu style moved from menu.css*/
ul.dropmenudiv,.dropmenudiv ul,.dropmenudiv li ul{
visibility:hidden;position:absolute;z-index:66500;background: #fff;margin:0;padding:5px;min-width:200px;list-style: none;border: 0;
border-radius:6px;
box-shadow: 3px 3px 25px rgba(0, 0, 0, 0.20), 1px 1px 3px rgba(0, 0, 0, 0.25);margin-top:5px!important;
}
.dropmenudiv li a,
.topmenu .topmenuSocial .dropdown-item{
border-radius:3px;display:block;text-decoration:none;background:#fff;color:#555;padding: 7px 14px!important;margin:5px; font-size: 90%!important;
font-family:var(--ui-font-system);
}
.dropmenudiv li a:hover,
.topmenu .topmenuSocial .dropdown-item:hover{background:#ebebeb;color:#333;}
/* translations dropdown */
.topmenuSocial .dropdown-menu{
border-radius:6px;border:0;padding:5px!important;
box-shadow: 3px 3px 25px rgba(0, 0, 0, 0.20), 1px 1px 3px rgba(0, 0, 0, 0.25);
}
.topmenuSocial .dropdown-toggle:focus {
box-shadow: 0 0 10px -7px black;
}
#website {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
/*text-rendering: optimizelegibility;*/
}
/*
h1,h2,h3,h4,h5,h6,
.h1,.h2,.h3,.h4,.h5,.h6{
margin-bottom: .5em;
margin-top: .3em;
font-weight: 400;
}
h1,.h1{
font-size: 2.75rem;
}
h2,.h2{
font-size: 2rem;
}
h3,.h3{
font-size: 1.2rem;
}
h4,.h4{
font-size: 1rem;
}
*/
.koLine{background:rgba(0,0,0,0.1);min-height:5px;border-radius:50px;width:100%;margin:0 auto}
.keditDark .koLine{background:rgba(255,255,255,0.3);}
/*need a review with dark contents*/
section .koOpacity,section.keditDark .keditWhite .koOpacity{color:rgba(0,0,0,0.55);opacity:1;}
section.keditDark .koOpacity{color:rgba(255,255,255,0.55)}
section .koOpacity30,section.keditDark .keditWhite .koOpacity30{color:rgba(0,0,0,0.3);opacity:1;}
section.keditDark .koOpacity30{color:rgba(255,255,255,0.3)}
/* OLD:
#website .btn:not(.btn-link) {min-width: 160px;padding-left: 25px;padding-right: 25px;}
NEW:
*/
.koButtons .btn:not(.btn-link):not(.btn-compact) {min-width: 160px;padding-left: 30px;padding-right: 30px;}
.koButtons .btn-lg:not(.btn-link):not(.btn-compact) {padding-left: 40px;padding-right: 40px;}
.koButtons .btn-xl:not(.btn-link):not(.btn-compact) {padding-left: 60px;padding-right: 60px;}
/* on mobile devices, make them full-width elements
--bs-breakpoint-sm: 576px;
--bs-breakpoint-md: 768px;
*/
@media (max-width: 768px){
.koButtons{justify-content: center;}
.koButtons .btn:not(.btn-compact)/*:not(.btn-link)*/ {width:100%;}
}
/* the same behavior when "blocks" mode is set */
.koButtons.koButtonsBlocks{justify-content: center;}
.koButtons.koButtonsBlocks .btn:not(.btn-compact)/*:not(.btn-link)*/ {width:100%;}
h2 a {text-decoration: none!important}
/*#;;;4056;4054;4055;mobile-logo+koTheme3*/
/* css-tabs */
.koTabs {
display: flex;
flex-wrap: wrap;
}
.koTabs label {
order: 1;
display: block;
padding: 10px 25px;
margin: 0;
cursor: pointer;
}
.koTabs .koTab {
order: 99;
flex-grow: 1;
width: 100%;
display: none;
padding: 0;
}
.koTabs.koTabsVertical{width:180px;}
.koTabs.koTabsVertical label {
border-right:1px solid rgba(0,0,0,0.1); clear:both; width: 100%;
background:none; position: relative;
box-sizing: border-box; color:rgba(0,0,0,0.5);
text-align:left; font-size: 90%;
}
.koTabs.koTabsVertical label:hover {
background-image:linear-gradient(to right,rgba(0,0,0,0),rgba(0,0,0,0.03));
}
.koTabs.koTabsVertical label:first-of-type,.koTabs.koTabsVertical label:last-of-type {
height:50px;background:none; cursor: default; border:0; padding:0;
}
.koTabs.koMenuTabs{min-height:100%;padding:10px 0 10px 10px;float:left;position:relative;border-right:1px solid rgba(0,0,0,0.15);background:#fff;width:180px}
.koTabs.koMenuTabs label{
position: relative;
box-sizing: border-box;
clear:both;text-align:left;text-decoration:none;display:block;padding:5px 15px;color:rgba(0,0,0,0.5);border-radius:5px;font-size:16px; font-size:14px;;margin:0 8px 5px 0;
}
.koTabs.koMenuTabs label:hover{color:var(--ui-color-leftmenu);}
.koTabs.koMenuTabs input[type="radio"]:checked + label {
color:rgba(255,255,255,0.8);background:var(--ui-color-leftmenu);border-radius:4px 0 0 4px;margin-right:0
}
.koTabs.koMenuTabs .koTab {
width:520px; position:absolute; left:180px;padding:30px;
}
.koTabs.koTabsVertical label:first-of-type:before {
content:" "; position: absolute; right:0px;
height:50px; width: 1px;
background-image:linear-gradient(to bottom,rgba(0,0,0,0),rgba(0,0,0,0.1));
}
.koTabs.koTabsVertical label:last-of-type:before {
content:" "; position: absolute; right:0px;
height:50px; width: 1px;
background-image:linear-gradient(to top,rgba(0,0,0,0),rgba(0,0,0,0.1));
}
.koTabs.koTabsVertical input[type="radio"]:checked + label {
background-image:linear-gradient(to right,#fff,rgba(255,255,255,0));
border:1px solid rgba(0,0,0,0.1);
border-right:0px;
border-left:5px solid rgba(0,0,0,0.1);
color:#000;padding:9px 20px;
}
.koTabs.koTabsVertical .koTab {
width:520px; position:absolute; left:180px;padding:30px;
}
.koTabs.koTabsVertical .koTab {overflow-x:hidden; overflow-y: auto;height:calc(100% - 110px);}
.koTabs input[type="radio"] {
display: none;
}
.koTabs input[type="radio"]:checked + label {
}
.koTabs input[type="radio"]:checked + label + .koTab {
display: block;
}
@media (max-width: 45em) {
.koTabs .koTab,
.koTabs label {
order: initial;
}
.koTabs label {
width: 100%;
margin-right: 0;
margin-top: 0.2rem;
}
}
.kedit.keditFullHeight{
min-height:100vh;
align-items:center;
display:flex;
flex-direction: column;
}
.kedit.keditFullHeight > .container,
.kedit.keditFullHeight > .no-container {
align-self: center;
}
[data-balloon] {
position: relative; }
[data-balloon]::before {
opacity: 0;
pointer-events: none;
transition: all .18s ease-out;
background: rgba(17, 17, 17, 0.9);
border-radius: 4px;
color: #fff;text-shadow:none;text-align:center;
content: attr(data-balloon);
font-size: 12px;
font-family: var(--bs-font-sans-serif);
padding:10px 15px; line-height:1;
position: absolute;
white-space: nowrap;
pointer-events: none;
z-index: 10;
text-transform: initial;
letter-spacing: 0;
background: linear-gradient(to bottom, rgb(19, 19, 19) 0%,rgb(84, 84, 84) 100%);
color: #ccc;
text-shadow: 1px 0px 1px #000;
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
font-weight:normal;
}
.koInfoTip{cursor:default;}
.dot[data-balloon]::before,
.koInfoTip[data-balloon]::before,.balloonStyle[data-balloon]::before {box-shadow:2px 2px 15px rgba(0,0,0,0.2),inset 0 0 0 3px rgba(17, 17, 17, 0.9);background:linear-gradient(to bottom,#FEFBDC,#FFD847);color:rgba(0,0,0,.8);padding:15px;font-size:15px;font-weight:normal;text-shadow:none;}
[data-balloon]::after {
background: no-repeat url('data:image/svg+xml;utf8,');
background-size: 100% auto;
width: 18px;
height: 6px;
opacity: 0;
pointer-events: none;
transition: all .18s ease-out;
content: '';
position: absolute;
z-index: 10; }
[data-balloon-pos="downleft"][data-balloon]::after,
[data-balloon-pos="downright"][data-balloon]::after,
[data-balloon-pos="down"][data-balloon]::after {
background: no-repeat url('data:image/svg+xml;utf8,');
}
[data-balloon]:hover::before, [data-balloon]:hover::after,[data-balloon][data-balloon-visible]:before, [data-balloon][data-balloon-visible]:after{
opacity: 1;
pointer-events: none; }
[data-balloon][data-balloon-pos="up"]::before {
bottom: 100%;
left: 50%;
margin-bottom: 11px;
transform: translate3d(-50%, 10px, 0);
transform-origin: top; }
[data-balloon][data-balloon-pos="up"]::after {
bottom: 100%;
left: 50%;
margin-bottom: 5px;
transform: translate3d(-50%, 10px, 0);
transform-origin: top; }
[data-balloon][data-balloon-pos="up"]:hover::before {
transform: translate3d(-50%, 0, 0); }
[data-balloon][data-balloon-pos="up"]:hover::after {
transform: translate3d(-50%, 0, 0); }
[data-balloon][data-balloon-pos="upright"]::before {
margin-left: 0;
left: 0;
margin-bottom: 14px;
bottom: 100%;
}
[data-balloon][data-balloon-pos="upright"]::after {
bottom: 100%;
right: 50%;
margin-bottom: 8px;
transform: translate3d(50%, 0, 0);
}
[data-balloon][data-balloon-pos="upright"]:hover::before,[data-balloon][data-balloon-visible][data-balloon-pos="upright"]::before {
margin-bottom: 11px;
}
[data-balloon][data-balloon-pos="upright"]:hover::after,[data-balloon][data-balloon-visible][data-balloon-pos="upright"]::after {
margin-bottom: 5px; }
[data-balloon][data-balloon-pos="upleft"]::before {
margin-right: 0;
right: 0;
margin-bottom: 14px;
bottom: 100%;
right: 0;
/* bottom: 100%;
right: 100%;
margin-bottom: 11px;
transform: translate3d(-50%, 10px, 0);
transform-origin: top; */}
[data-balloon][data-balloon-pos="upleft"]::after {
bottom: 100%;
left: 50%;
margin-bottom: 8px;
transform: translate3d(-50%, 0, 0);
/* bottom: 100%;
left: 50%;
margin-bottom: 5px;
transform: translate3d(-50%, 10px, 0);
transform-origin: top;*/ }
[data-balloon][data-balloon-pos="upleft"]:hover::before {
margin-bottom: 11px;
/*transform: translate3d(-50%, 0, 0); */}
[data-balloon][data-balloon-pos="upleft"]:hover::after {
/*transform: translate3d(-50%, 0, 0);*/
margin-bottom: 5px; }
[data-balloon][data-balloon-pos='left']::before {
margin-right: 11px;
right: 100%;
top: 50%;
transform: translate3d(10px, -50%, 0); }
[data-balloon][data-balloon-pos='left']::after {
background: no-repeat url('data:image/svg+xml;utf8,');
background-size: 100% auto;
width: 6px;
height: 18px;
margin-right: 5px;
right: 100%;
top: 50%;
transform: translate3d(10px, -50%, 0); }
[data-balloon][data-balloon-pos='left']:hover::before {
transform: translate3d(0, -50%, 0); }
[data-balloon][data-balloon-pos='left']:hover::after {
transform: translate3d(0, -50%, 0); }
[data-balloon][data-balloon-length='large']::before {
white-space: normal;
width: 260px; }
.pull-right{float:right}
.pull-left{float:left}
#scrollToTop{background:var(--color1);color:var(--color1_25);text-decoration:none;position:fixed;bottom:20px;right:20px;font-size:20px;height:50px;width:50px;line-height:50px;text-align:center;display:block;border-radius:4px;transition:0.2s all;opacity:0;visibility:hidden}
#scrollToTop.active{display:block;margin-bottom:10px;opacity:1;visibility:visible;z-index:65401;}
#scrollToTop:hover{transform:scale(1.05);}
/* why this is here? removing...
#contentArea .container,
#footerContent .container {padding-left:3vw;padding-right:3vw;}
*/
.ko_ThemeBoxed #website{background:#fff;}
@media (min-width: 1100px){
.ko_ThemeBoxed #website .container {
max-width: 1000px;
}
.ko_ThemeBoxed #website{max-width:1110px;margin: 25px auto;box-shadow:0 0 35px rgba(0,0,0,0.15)}
}
@media (min-width: 768px){
}
/*@media (max-width: 768px){
.stack span{display:none!important}
}*/
.koBottomMessage,.koBottomMessageDraft{position:fixed;bottom:0;left:0;height:50px;background: var(--ui-color-leftmenu);line-height:50px;color:rgba(255,255,255,0.7);padding:0 20px;margin-left:-5px;opacity:0;visibility:hidden;transition:0.2s all ease-in-out;z-index: 65525/* so its below overlay 704400*/;}
.inAdminMode .koBottomMessage,
.inAdminMode .koBottomMessageDraft {
left: 0;
padding-left: 120px;
max-width: calc(100% - 50px);
/*left:100px;*/
}
.koBottomMessageDraft{background:none;}
.koBottomMessage strong{color:#fff;font-weight:900}
.koBottomMessage.active,
.koBottomMessageDraft.active{
opacity:1;margin-left:0;visibility:visible
}
.koBottomMessage .close{line-height:50px;width:50px;position:absolute;top:0;right:-50px;background: var(--ui-color-leftmenu)!important;box-shadow:inset 0 0 0 50px rgba(0,0,0,0.2) ;color:#fff!important;text-align:center;text-shadow:none;opacity:1!important}
.koBottomMessage .close:hover{box-shadow:inset 0 0 0 50px rgba(0,0,0,0.5)}
.koBottomMessage .btn{margin:0 -15px 0 10px;border-radius:0;}
@media (max-width: 575px) {
#demoInfo {padding-left: 10px!important;
display: flex;
align-items: center;
}
#demoInfo span {display:none!important;}
#demoInfo .btn-ui-primary {
box-shadow: none!important;
background: none!important;
margin: 0!important;
padding: 0!important;
text-decoration: underline!important;
}
}
/*loading*/
#spinnerHolder{text-align:center;}
/*#k_spinner {background:rgba(0,0,0,0.5);padding:5vw;display:inline-block;border-radius:100vw;margin-top:30vh;box-shadow:0 0 50px rgba(0,0,0,0.5)}*/
#k_spinnerImage {
position:fixed;top:0;left:calc(50% - 50px);;z-index:704900;margin-top:calc(15% + 10px);
display:inline-block;height:100px;width:100px;position:fixed;background:var(--ui-color-accent) center center no-repeat; background-size:75px; border-radius:100vw;z-index:1}
#k_spinnerImage::before {
content:attr(data-title);color:#fff;position:fixed;bottom:30px;right:-50px;white-space:nowrap;;text-align:center;text-shadow:1px 1px 1px rgba(0,0,0,0.5); background:#000; border-radius:100px;padding:10px 100px 10px 20px ;}
.koLoading #k_spinner {
background:rgba(0,0,0,0);width:120px;height:120px;display:inline-block;border-radius:100vw;margin-top:15%;box-shadow:0 0 50px rgba(0,0,0,0.5);
height: 120px;
width: 120px;
-webkit-animation: koLoadingRotation 1s infinite linear;
animation: koLoadingRotation 1s infinite linear;
border: 5px solid rgba(0,0,0,0);
border-top-color: var(--ui-color-accent);
border-radius: 50%;
}
@-webkit-keyframes koLoadingRotation {
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes koLoadingRotation {
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
/*section.kedit + section.kedit {border:none}*/
/*section.kedit:first-of-type + section.kedit{border:none}
+'.ko_Theme .menuHolder > li.topmenuSocial{margin-top:30px}.ko_Theme .menuHolder > li.topmenuSocial + li.topmenuSocial {margin-top:inherit}'
+'.ko_Theme .menuHolder li.topmenuSocial a{width:30px;}.ko_Theme .menuHolder li.topmenuSocial em{display:inline;}'
*/
.koQuote{position: relative;}
.koQuote::before,.koQuote::after {
content: "\f10d";
font-size: 30px;
line-height: 30px;
font-family: "Font Awesome 5 Free";
font-weight: 900;
position: absolute;
left: -45px;
top: -15px;
opacity: 0.3;
float: left;
}
.koQuote::after {
content: "\f10e";
left: inherit;
top: inherit;
bottom: 0;
opacity: 0.1;
right: 0;
font-size: 20px;
line-height: 20px;
}
/*
section.kedit.keditRow {
padding: inherit;
}
*/
section.kedit{overflow:hidden}
section.kedit.keditRow {
/*padding-top:50px;padding-bottom:0*/
/*test, Nov2019, no upper/lower padding at all, as content blocks inside will have padding added instead */
padding:0;
}
.keditColumn > .kedit{padding-top:50px;padding-bottom:50px}
/*.keditColumn > .kedit ~ .kedit{border:0}*/
.koSeparator{
min-height:1px;
height:5px;
width:50%;
max-width:100%;
clear:both;
margin-top:30px;
margin-bottom:30px;
font-size:0.1px;
margin-left:auto;
margin-right:auto;
}
/*.text-center .koSeparator{margin-left:auto;margin-right:auto;}*/
.koSeparator.koSeparatorLeft{margin-left:0;margin-right:auto}
.koSeparator.koSeparatorRight{margin-left:auto;margin-right:0}
.btn-ui-primary.btn-block i{margin-right:10px;}
.btn-ui-primary{
border:0;
margin-top:15px;text-shadow:1px 1px 1px rgba(0,0,0,0.1);font-weight:var(--ui-font-bold);outline: none;
}
.btn-ui-primary:not(.btn-success):not(.btn-secondary){
background:var(--ui-color-accent);
color:#fff;
}
.btn-ui-primary:hover{box-shadow:inset 0 0 100px rgba(255,255,255,0.25);color:#fff;}
.btn-ui-primary:active{ box-shadow:inset 0 0 100px rgba(255,255,255,0.5);}
#koHiddenEditor{position:fixed;left:0;bottom:50px;z-index:77777}
#koHiddenEditor a {padding:0;display:block;padding:0 15px;color:#fff;background:rgba(0,0,0,0.5);border-radius:0;text-decoration:none;line-height:70px;height:70px;font-size:20px;min-width:70px;text-align:center;
/*background: var(--ui-color-leftmenu);*/
background: linear-gradient(to bottom,var(--ui-color-leftmenu),#000);
/*background: linear-gradient(to bottom, #36A8F3 0%,#37ACF5 4%,#1865C5 100%);*/
}
#koHiddenEditor button {line-height:1;height:50px;min-width:10px;padding:0 20px;margin-top:10px;margin-bottom:10px;}
#koHiddenEditor button i {line-height:40px;}
#koHiddenEditor button.btn-secondary{background:rgba(255,255,255,0.1);border-color:rgba(0,0,0,0.4);}
#koHiddenEditor button.btn-secondary:hover{background:rgba(0,0,0,0.4);border-color:rgba(0,0,0,0.4);}
#koHiddenEditor a:hover,#koHiddenEditor.koHiddenToolbar a {box-shadow:inset 0 0 50px rgba(255,255,255,.1),5px 0 15px -10px #000;}
#koHiddenEditor.koHiddenToolbar a:hover{box-shadow:inset 0 0 50px rgba(0,0,0,0.7),5px 0 15px -10px #000}
#koHiddenEditor span{border-radius:0 5px 5px 0;vertical-align: middle;padding:0 20px 0 40px;margin:0;display:block;font-size:14px;z-index:-1;position:absolute;left:50px;top:7px;background:var(--ui-color-leftmenu);white-space:nowrap;margin-left:-10px; transition:0.2s all;visibility:hidden;opacity:0}
#koHiddenEditor a:hover span,#koHiddenEditor.koHiddenToolbar span{display:inline-block;margin-left:0;visibility:visible;opacity:1}
#koHiddenEditor span:hover {
box-shadow: inset 0 0 0 100px rgba(0, 0, 0,0.2);
}
#koHiddenEditor.koHiddenToolbar span{padding:0 10px 0 30px;}
#koHiddenEditor a i{vertical-align:middle;line-height:60px;display:inline-block;}
#koHiddenEditor::before {
content: "";
position: relative;
height: 7px;
bottom: 0px;
left: 0;
width: 100%;
display: block;
background: var(--ui-color-stripes-accent)
}
.alert-heading {
color: inherit!important;
}
#contentArea .keditLayout_1 .koMenu a {text-decoration:none!important;color:rgba(0,0,0,0.5);display:block;line-height: 1.1;padding: 10px 0;}
#contentArea .keditLayout_1 .koMenu a:hover {color:rgba(0,0,0,0.8)}
#contentArea .keditLayout_1 .koMenu li:not(:first-of-type) {border-top:1px solid rgba(0,0,0,0.2);}
#contentArea .keditLayout_2 .koMenu a {text-decoration:none!important;color:rgba(0,0,0,0.5);line-height: 1.1;padding: 10px 15px;display:block;background:rgba(0,0,0,0.05);border-radius:3px;margin-bottom:2px;}
#contentArea .keditLayout_2 .koMenu a:hover {color:rgba(0,0,0,0.8);background:rgba(0,0,0,0.1);}
#contentArea .keditLayout_2 .koMenu li:not(:first-of-type) {}
/*.keditLayout_1 .koMenu ul,.keditLayout_1 .koMenu li {margin:0;padding:0;list-style:none;}*/
.bg-color1_25 { background: var(--color1_25);}
.bg-color1_50 { background: var(--color1_50);}
.bg-color1_75 { background: var(--color1_75);}
.bg-color1 { background: var(--color1);}
.bg-color1_125 { background: var(--color1_125);}
.bg-color1_150 { background: var(--color1_150);}
.bg-color1_175 { background: var(--color1_175);}
.text-color1_25 { color: var(--color1_25);}
.text-color1_50 { color: var(--color1_50);}
.text-color1_75 { color: var(--color1_75);}
.text-color1 { color: var(--color1);}
.text-color1_125{ color: var(--color1_125);}
.text-color1_150{ color: var(--color1_150);}
.text-color1_175{ color: var(--color1_175);}
.bg-color2_25 { background: var(--color2_25);}
.bg-color2_50 { background: var(--color2_50);}
.bg-color2_75 { background: var(--color2_75);}
.bg-color2 { background: var(--color2);}
.bg-color2_125 { background: var(--color2_125);}
.bg-color2_150 { background: var(--color2_150);}
.bg-color2_175 { background: var(--color2_175);}
.text-color2_25 { color: var(--color2_25);}
.text-color2_50 { color: var(--color2_50);}
.text-color2_75 { color: var(--color2_75);}
.text-color2 { color: var(--color2);}
.text-color2_125{ color: var(--color2_125);}
.text-color2_150{ color: var(--color2_150);}
.text-color2_175{ color: var(--color2_175);}
.text-color2_25_bw { color: var(--color2_25_bw);}
.text-color2_50_bw { color: var(--color2_50_bw);}
.text-color2_75_bw { color: var(--color2_75_bw);}
.text-color2_bw { color: var(--color2_bw);}
.text-color2_125_bw{ color: var(--color2_125_bw);}
.text-color2_150_bw{ color: var(--color2_150_bw);}
.text-color2_175_bw{ color: var(--color2_175_bw);}
.text-color1_25_bw { color: var(--color1_25_bw);}
.text-color1_50_bw { color: var(--color1_50_bw);}
.text-color1_75_bw { color: var(--color1_75_bw);}
.text-color1_bw,#website .headers-color1_bw h1,#website .headers-color1_bw h2,#website .headers-color1_bw h3,#website .headers-color1_bw h4 { color: var(--color1_bw);}
.text-color1_125_bw{ color: var(--color1_125_bw);}
.text-color1_150_bw{ color: var(--color1_150_bw);}
.text-color1_175_bw{ color: var(--color1_175_bw);}
/*
.smoothBg_black {
background: linear-gradient(to bottom, black 0%, rgba(0, 0, 0, 0.738) 19%, rgba(0, 0, 0, 0.541) 34%, rgba(0, 0, 0, 0.382) 47%, rgba(0, 0, 0, 0.278) 56.5%, rgba(0, 0, 0, 0.194) 65%, rgba(0, 0, 0, 0.126) 73%, rgba(0, 0, 0, 0.075) 80.2%, rgba(0, 0, 0, 0.042) 86.1%, rgba(0, 0, 0, 0.021) 91%, rgba(0, 0, 0, 0.008) 95.2%, rgba(0, 0, 0, 0.002) 98.2%, transparent 100%);
}*/
.image-container{
position: relative;
}
.photo-container{
float: left;
position: relative;
overflow: hidden;
}
.image-thumb{
position: relative;
background-color: #eee;
}
/*radial-gradient(circle, #009AF6, #3274BA, #1F4772)*/
/*radial-gradient(circle, var(--color1), var(--color1_125), var(--color1_150))*/
/* Lightbox module (magnific-popup) */
img.mfp-img{
pointer-events:none}
.mfp-figure figure {
cursor: default;
}
/*
BROWSER/MOCKUP part, copy/paste to kopage.css
START---
*/
#koThemesList .browser-mockup{
margin-bottom:20px;
transition:0.2s all;
border-radius: 4px;
}
.koLightbox .browser-mockup{
width: 800px;
background: #fff;
border-radius: 5px;
height: 95vh;
top: 2.5vh;
}
.koLightbox .browser-mockup:hover{/*transform:scale(1.02);*/box-shadow:none;}
.browser-mockup strong{position:absolute;
top: -1.75em;
left: 5em;
font-weight: 900;
color: rgba(0,0,0,0.5);
}
.browser-mockup img{max-width:100%}
.browser-mockup span{overflow:hidden;height:300px;width:100%;display: block;border-radius: 0 0 4px 4px; }
.browser-mockup span a{border:0;box-shadow:none;padding:0}
.browser-preview{position:absolute;top:-2em;right:0px;left:0;bottom:0;
background:rgba(0,0,0,0.5);
background: radial-gradient(circle at center center,rgba(0,0,0,0.1) 0%,rgba(0,0,0,0.6) 100%);
text-align: center;opacity:0;transition:0.2s all;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
border-radius: 4px;
}
.browser-mockup:hover{/*transform:scale(1.02);*/box-shadow: rgba(0, 0, 0, 0.75) 0px 15px 45px -9px; z-index:2; position:relative;}
.browser-mockup:hover .browser-preview{opacity:1}
.browser-preview a{
margin-bottom: 5px;
margin-left:-10px;
opacity:0;
width: 200px;
padding: 15px 25px;
box-shadow: 1px 1px 15px rgba(0,0,0,0.4);
transition:0.2s all;transition-delay:0.2s
}
.browser-mockup:hover .browser-preview .btn-ui-primary{margin-left:0;opacity:1}
.browser-mockup {
box-shadow: 0 0.1em 0.5em 0 rgba(0, 0, 0, 0.1);
position: relative;
border-radius: 0 0 4px 4px;
border-top: 2em solid rgba(0, 0, 0, 0);
width:360px;
}
.browser-mockup:after { content: '';
display: block;
background:linear-gradient(to bottom, rgba(0,0,0,0.2),rgba(0,0,0,0.4));
position: absolute;
top: -2em;
left: 0;
height: 2em;width:100%; border-radius: 4px 4px 0 0;
}
.browser-mockup:before {
display: block;
position: absolute;
content: '';
top: -1.25em;
left: 1em;
width: 0.5em;
height: 0.5em;
border-radius: 50%;
background-color: rgba(0,0,0,0.4);
box-shadow: 0 0 0 2px rgba(0,0,0,0.4), 1.2em 0 0 2px rgba(0,0,0,0.4), 2.4em 0 0 2px rgba(0,0,0,0.4);
}
.browser-mockup .btn-ui-primary:hover{box-shadow:inset 0 0 100px rgba(255,255,255,0.25),1px 1px 15px rgba(0,0,0,0.4);color:#fff;}
.browser-mockup .btn-ui-primary:active{ box-shadow:inset 0 0 100px rgba(255,255,255,0.5),1px 1px 15px rgba(0,0,0,0.4);}
.browser-preview a.btn-ui-primary:not(.btn-ui-primary-install){
background:var(--ui-color-leftmenu);
transition-delay:0.1s
}
.phone-mockup{
position:relative;
width:auto;
display:inline-block;
filter: drop-shadow(0 0 20px rgba(0,0,0,0.5));
}
.phone-mockup img {
display:block;
}
.phone-mockup svg{
position:fixed;left:-9999px
}
.phone-mockup .keditIgnore:nth-of-type(1){
position:relative;
max-height:90vh;
}
.phone-mockup .keditIgnore{
pointer-events:none;
}
.phone-mockup .position-absolute-expand{
height:100%!important;
}
.phone-mockup .position-absolute-expand:not(.keditIgnore){
object-fit:cover;
-webkit-clip-path: url(#phone-mockup-path);
clip-path: url(#phone-mockup-path);
}
.koLightbox,.koPopup{position:fixed;z-index:904401;top:0;left:0;bottom:0;right:0;display: flex;justify-content: center; align-items: center;}
.koLightboxOverlay{position:absolute;background: radial-gradient(circle at center center,rgba(127,127,127,0.7) 0%,rgba(0,0,0,0.9) 100%);top: 0;right: 0;left: 0;bottom: 0;}
.koLightbox a{
position:absolute;z-index:10;color:#fff;opacity:0.7;font-size:50px;height:100px;width:100px;text-align:center;line-height:100px;right:0;top:0;text-decoration:none;transition: 0.2s all;
}
.koLightbox a:hover{background:#000;box-shadow: 0 0 100px 50px #000;opacity:1}
.koLightboxHolder{
position:absolute;
background:#fff;
box-shadow:5px 5px 35px rgba(0,0,0,0.7);
overflow-y: auto;
overflow-x: hidden;
height: 100%;
/*max-height:800px;*/
}
.koLightboxHolder img{display:block;max-width:100%;width:800px;}
.koLightboxModal{position:relative;z-index:10;border-radius:10px;}
/*
BROWSER/MOCKUP part, copy/paste to kopage.css
---END
*/
/* if Kopage installer is embeded here, don't add extra spacing */
#website #koThemes{
padding:0;
}
.videoLightbox{outline:none;overflow:auto;position:relative;text-align:center;display:inline-block}
.koThemesTab{
width:100%;flex-wrap:wrap;justify-content:space-around;opacity:0;margin-left:-10px;transition:0.2s opacity, 0.2s margin;position:absolute;top:-9999px;left:-9999px;
display: none;
}
.koThemesTab.active{
opacity:1;margin-left:0;position:static;
display:flex;
}
/*
$('body').append('')
*/
.koModalHolder{
display:flex;justify-content:center;align-items:center;font:17px sans-serif;height:100%;width:100%;top:0;left:0;bottom:0;right:0;position:fixed;z-index:99999;color:#555;background:rgba(0,0,0,0.5);
box-shadow:inset 0 0 150px rgba(0,0,0,0.5),inset 0 0 50px rgba(0,0,0,1);
}
.koModal{
max-width:1000px;flex-direction:row;display:flex;background:#fff;
position:relative;
box-shadow: 5px 5px 75px rgba(0,0,0,0.1),5px 6px 98px -31px rgba(0,0,0,1);
}
.koModal::before{
background:var(--ui-color-stripes-accent);
content:" ";
z-index:2; position:absolute; top:0;left:0;
width:7px;height:100%;
}
.koModal h4{text-transform:uppercase;opacity:0.4;font-size:12px;letter-spacing:2px}
/*.koModal h3{font-weight:800;font-size:30px;}*/
.koModal .tab-pane strong{display:none;font-size:20px;margin-bottom:5px;}
.koModal .tab-pane{padding:30px 15px;min-width:400px}
.koModalSide{
padding: 50px 100px 50px 107px;
background:var(--ui-color-accent);
display:flex;align-items:center;
}
.koModal .koModalBody{padding:100px;position:relative}
.nav-ko-modal .nav-link{
background: rgba(0,0,0,0.05);
border-radius: 4px;
margin-right: 4px;
margin-bottom: 4px;
padding:9px 15px;
color:#555;
}
.nav-ko-modal:hover .nav-link:not(.active){
color:#000;
border-color:transparent;
background: rgba(0,0,0,0.07);
}
.nav-tabs .nav-ko-modal .nav-link.active{
padding:12px 15px;
margin-bottom:-1px;
border-radius:4px 4px 0 0;
color:#000;
}
@media (max-width: 1050px){
.koModal .koModalClose{z-index:1;top:0;right:0;color:#555;;}
}
@media (max-width: 750px){
.koModalSide{display:none;}
.koModal{
width: 100vw;
max-height: 100vh;
max-width:100vw;
}
.koModal .tab-pane{padding:10px 0;min-width:0}
.koModal h2{font-size:20px;}
.koModal .nav-tabs .nav-ko-modal {display:block;width:100%;margin:0;border:0}
.koModal .nav-tabs .nav-ko-modal .nav-link{display:block;width:100%;margin:0 0 3px;border:0;background:#f8f8f8;border-radius:3px;}
.koModal .nav-tabs .nav-ko-modal .nav-link.active{background:#e5e5e5}
.koModal .koModalBody{padding:30px;}
.koModal .koModalClose{z-index:1;top:0;right:0;color:#555;width:30px;height:30px;line-height:30px;}
}
.koModalBody{transition:0.2s all;}
.koModalLinkBox{
border-radius:5px;background:#f5f6f7;display:block;padding:10px 20px;margin-right:10px;
color:rgba(0,0,0,0.5);overflow:auto;text-align:left;
}
.koModalLinkBox:hover{color:rgba(0,0,0,0.8);background:rgba(0,0,0,0.1)}
.koModalLinkBox{
display: flex;align-items: center;}
.koModalLinkBox img,.koModalLinkBox i{
margin-right: 20px;
padding-right: 15px;
border-right: 1px solid rgba(0,0,0,0.1);
display: block;
width: 100%;
height:50px;
max-width: 100px;
object-fit: contain;
}
.loginPanel{display:none;}
.loginPanel.active{display:block}
.kSwitch input {
display:none
}
.kSwitch {
cursor: pointer;
display: flex;
line-height: 22px;
/*padding: 10px 10px 10px 60px;*/
padding:10px;
position: relative;width:100%;justify-content: flex-end; align-items: center;
}
.kSwitch span {max-width:250px;font-weight:normal;color:#111}
.kSwitch span small {display:block;font-weight:normal;opacity:0.7;line-height:15px}
.koSwitchLive .kSwitch span {max-width:200px;}
.koSwitchLive .kSwitch {padding:0;margin:0;}
.koMenuSwitch .kSwitch span {max-width:calc(100% - 50px);line-height:1.1}
.koMenuSwitch .kSwitch {padding:0;margin:0}
.koMenuSwitch {margin:4px auto;padding:15px 13px 15px 5px;max-width:400px}
.koSwitchInput.koSwitchLive,.koToolbarInputItem{text-align:left;clear:both;padding:10px 15px;position:relative;margin-bottom:1px}
.kSwitch i {
background: #c5c5c5;
/*background: linear-gradient(to bottom, #ddd 0%,#999 100%);*/
border:0;border-radius:22px;
line-height: 22px;
height: 22px;
width: 36px!important;
padding: 0;
outline: none;
margin-left:auto; position:relative;
float:right;
}
.kSwitch i::after {
display: block;
position: absolute;
left: 2px;
top: 2px;
width: 18px;
height: 18px;
background: #fff;
border-radius: 18px;
text-align: center;
color: rgba(0, 0, 0, 0.3);
font-style: normal;
line-height: 18px;
/*transition: left .15s ease;*/
transition: left .3s cubic-bezier(0.85, 0.05, 0.18, 1.35),
width .3s cubic-bezier(0.85, 0.05, 0.18, 1.35);
font-family: Font Awesome\ 5 Free;
font-weight: 900;
font-size: 11px;
content: " ";
/*"\f00d";*/
/* it could be updated to look more like https://codepen.io/halvves/pen/ExjxaKj */
}
.koMenuSwitch:hover .kSwitch i::after{box-shadow:0px 0px 0 2px rgba(0,0,0,0.2);}
.kSwitch input:checked + i {
background: #1865C5;
background: linear-gradient(to bottom, #36A8F3 0%,#37ACF5 4%,#1865C5 100%);
}
.kSwitch input:checked + i::after {
left: 16px;
content: "\f00c"; color:#1865C5;
}
.kSwitch input:active + i::after,
.koMenuSwitch:hover .kSwitch input:active + i::after {
/*background: #efefef;*/ box-shadow:0 0 0 3px rgba(0,0,0,0.2);
}
/* switch improvements for Kopage Studio */
.inAdminPlus .kSwitch i::after {
left: 3px;
top: 3px;
width: 16px;
height: 16px;
border-radius: 8px;
}
.inAdminPlus .kSwitch:hover i::after {
width:18px;
}
.inAdminPlus .kSwitch i{
transition: 0.2s box-shadow;
}
.inAdminPlus .kSwitch:hover i{
box-shadow: inset 0 0 0 50px rgba(0,0,0,0.1);
}
.inAdminPlus .koMenuSwitch:hover .kSwitch i::after,
.inAdminPlus .kSwitch input:active + i::after,
.inAdminPlus .koMenuSwitch:hover .kSwitch input:active + i::after{
box-shadow:initial;/* 0px 0px 0 2px rgba(0,0,0,0.2); */
}
.inAdminPlus .kSwitch input:active + i::after,
.inAdminPlus .kSwitch:hover .kSwitch input:active + i::after{
width:20px;
}
.inAdminPlus .kSwitch:hover input:checked + i::after {
left: 14px;
}
.inAdminPlus .kSwitch:hover input:active:checked + i::after {
left: 12px;
}
.inAdminPlus .koMenuSwitch {
padding:0;
}
.inAdminPlus .kSwitch {
padding: 15px 13px 15px 5px;
}
/* end of switch improvements */
.kedit::selection {
background: #34495e;
}
.btn-color1 {
color: var(--color1_bw);
background-color: var(--color1);
border-color: var(--color1);
}
.btn-color1:hover,
.btn-color1:focus,
.btn-color1:active,
.btn-color1.active,
.open .dropdown-toggle.btn-color1 {
color: #FFFFFF;
background-color: var(--color1_125);
border-color: var(--color1_125);
}
.btn-color1:active,
.btn-color1.active,
.open .dropdown-toggle.btn-color1 {
background-image: none;
}
.btn-color1.disabled,
.btn-color1[disabled],
fieldset[disabled] .btn-color1,
.btn-color1.disabled:hover,
.btn-color1[disabled]:hover,
fieldset[disabled] .btn-color1:hover,
.btn-color1.disabled:focus,
.btn-color1[disabled]:focus,
fieldset[disabled] .btn-color1:focus,
.btn-color1.disabled:active,
.btn-color1[disabled]:active,
fieldset[disabled] .btn-color1:active,
.btn-color1.disabled.active,
.btn-color1[disabled].active,
fieldset[disabled] .btn-color1.active {
background-color: var(--color1);
border-color: var(--color1);
}
.btn-color1 .badge {
color: var(--color1);
background-color: var(--color1_bw);
}
.btn-outline-color1 {
color: var(--color1);
border-color: var(--color1);
}
.btn-outline-color1:hover {
color: var(--color1_bw);
background-color: var(--color1);
border-color: var(--color1);
}
.btn-outline-color1:focus, .btn-outline-color1.focus {
box-shadow: 0 0 0 0.2rem var(--color1_50);
box-shadow: none;
}
.btn-outline-color1.disabled, .btn-outline-color1:disabled {
color: var(--color1);
background-color: transparent;
}
.btn-outline-color1:not(:disabled):not(.disabled):active, .btn-outline-color1:not(:disabled):not(.disabled).active,
.show > .btn-outline-color1.dropdown-toggle {
color: var(--color1_bw);
background-color: var(--color1);
border-color: var(--color1);
}
.btn-outline-color1:not(:disabled):not(.disabled):active:focus, .btn-outline-color1:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-color1.dropdown-toggle:focus {
box-shadow: 0 0 0 0.2rem var(--color1_50);
box-shadow: none;
}
.btn-color2 {
color: var(--color2_bw);
background-color: var(--color2);
border-color: var(--color2);
}
.btn-color2:hover,
.btn-color2:focus,
.btn-color2:active,
.btn-color2.active,
.open .dropdown-toggle.btn-color2 {
color: var(--color2_bw);
background-color: var(--color2_125);
border-color: var(--color2_125);
}
.btn-color2:active,
.btn-color2.active,
.open .dropdown-toggle.btn-color2 {
background-image: none;
}
.btn-color2.disabled,
.btn-color2[disabled],
fieldset[disabled] .btn-color2,
.btn-color2.disabled:hover,
.btn-color2[disabled]:hover,
fieldset[disabled] .btn-color2:hover,
.btn-color2.disabled:focus,
.btn-color2[disabled]:focus,
fieldset[disabled] .btn-color2:focus,
.btn-color2.disabled:active,
.btn-color2[disabled]:active,
fieldset[disabled] .btn-color2:active,
.btn-color2.disabled.active,
.btn-color2[disabled].active,
fieldset[disabled] .btn-color2.active {
background-color: var(--color2);
border-color: var(--color2);
}
.btn-color2 .badge {
color: var(--color2);
background-color: var(--color2_bw);
}
.btn-outline-color2 {
color: var(--color2);
border-color: var(--color2);
}
.btn-outline-color2:hover {
color: var(--color2_bw);
background-color: var(--color2);
border-color: var(--color2);
}
.btn-outline-color2:focus, .btn-outline-color2.focus {
box-shadow: 0 0 0 0.2rem var(--color2_50);
box-shadow: none;
}
.btn-outline-color2.disabled, .btn-outline-color2:disabled {
color: var(--color2);
background-color: transparent;
}
.btn-outline-color2:not(:disabled):not(.disabled):active, .btn-outline-color2:not(:disabled):not(.disabled).active,
.show > .btn-outline-color2.dropdown-toggle {
color: var(--color1_bw);
background-color: var(--color2);
border-color: var(--color2);
}
.btn-outline-color2:not(:disabled):not(.disabled):active:focus, .btn-outline-color2:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-color2.dropdown-toggle:focus {
box-shadow: 0 0 0 0.2rem var(--color2_50);
box-shadow: none;
}
.cookie-consent {
font-size: 15px;
line-height: 1.5;
color: #000;
background-color: #fff;
position: fixed;
border-radius: 5px;
z-index: 10000000001; /* make it higher than smartsupp and tawkto */
box-shadow: 0 1px 3px 0 rgba(0,0,0,0.1)/*,0 0 0 1px rgba(0,0,0,0.1)*/,0 5px 30px rgba(0, 0, 0, 0.16);
/*width: calc(100% - 100px);*/
left: 15px;
bottom: 15px;
right: 15px;
}
.cookie-consent a {
white-space: nowrap;
}
.cookie-consent.cookie-closed{opacity:0;visibility:hidden;}
@media (min-width: 850px){
.cookie-consent {
left: 50%;
transform: translateX(-50%);
min-width: 500px;
max-width: 600px;
transition: transform .3s ease;
will-change: transform;
}
.cookie-consent:hover {
transform: translateX(-50%) scale(1.03);
}
}
.cookie-close {
padding:0;
margin-left: 45px;
cursor: pointer;
}
.cookie-close button{
transition:0.2s all;display:flex;white-space:nowrap;
padding:0 15px;height:35px;line-height:35px;top:0;right:0;border-radius:4px;font-size:13px;
}
.cookie-close {display:flex;flex-direction:column;text-align:center;}
.cookie-close a {display:block;margin-top:5px;font-size:80%;color:var(--gray)}
.cookie-consent {
padding: 25px;
display: flex;
align-items: center;
justify-content: space-between;
}
.cookie-close {
width:inherit;
position:relative;
}
input.border-0{outline:none;}
/*
Debug.
.container{max-width:800px;border:1px solid red}
*/
.koUnderline1{position:relative}
.koUnderline1::after,.koUnderline2::after {
content: "";
position: absolute;
display: block;
width: 110%;
height:120%;
--maskImage: url("data:image/svg+xml,%3Csvg viewBox='0 0 100 9' width='100' height='9' xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none'%3E%3Cpath d='M53.854.683c8.411.147 16.821.319 25.23.555 1.655.046 22.256-.053 20.847 1.916-4.069 5.685-16.33 4.225-22.796 4.034-19.455-.576-39.278-.114-58.744.668C12.046 8.11 6.057 10.831.412 6.86c-1.393-.981 1.066-3.733 2.663-4.336C11.457-.642 21.989.101 30.803.028 33.39.006 48.715.594 53.854.683Z' fill='currentColor'/%3E%3C/svg%3E%0A");
mask-image: var(--maskImage);
-webkit-mask-image: var(--maskImage);
mask-repeat: no-repeat;-webkit-mask-repeat: no-repeat;
mask-size: 100% 100%;-webkit-mask-size: 100% 100%;
background:var(--color2_25);
left: -5%;z-index:-1;
top:0;
}
.koUnderline2{position:relative}
.koUnderline2::after {
height:20%;
background:var(--color2);
width:100%;
left:0;
bottom: -10%;
top:auto;
z-index: 1;
}
.koUnderline_2_25::after{ background:var(--color2_25); }
.koUnderline_1_25::after{ background:var(--color1_25); }
ul.koCheckList1 {
list-style: none;margin:0;padding:0;
}
ul.koCheckList1 li{display:block;line-height:30px;;vertical-align:middle;padding:0 0 0 50px;margin:0 0 10px 0}
ul.koCheckList1 li:before {
content: '';
color:#28A845;padding:0;margin:0 0 0 -45px;font-size:150%;float:left;display:block;width:30px;height:30px;
background: url("data:image/svg+xml;utf8,") center center no-repeat;
}
/*when image was in lightbox-link, there were scrollbars due to AOS plugin.*/
.videoLightbox [data-aos]{transform:none!important;opacity:1!important;overflow:auto!important}
.videoLightbox {
overflow: visible; /* no box shadow when it was set to auto */
}
/* some customization of AOS script
- but it should apply to website only if user has enabled animation...
*/
.ko_Theme:not(.inAdminMode) [data-aos=fade-up]:not(.aos-animate){
transform:translate3d(0,10px,0);
}
.ko_Theme:not(.inAdminMode) [data-aos=fade-right]:not(.aos-animate){
transform:translate3d(-10px,0,0)
}
.ko_Theme:not(.inAdminMode) [data-aos=fade-left]:not(.aos-animate){
transform:translate3d(10px,0,0)
}
/*[data-aos=fade-left]{transform:translate3d(100px,0,0)}*/
/*
.inAdminMode [data-aos^="fade"][data-aos^="fade"]{
opacity: 1;
transform: translateZ(0);
}
*/
/* Date picker, used in FORMS */
.js_datepicker.form-control:disabled, .js_datepicker.form-control[readonly] {
background-color: #fff;
opacity: 1;
text-indent:20px;
}
/**/
.picker--opened .picker__frame {
top: 50px!important;
bottom: auto;
max-width: 555px;
}
#website .picker{z-index:75000;display:none;}
#website .picker.picker--opened{display:block;}
#website .picker__select--month, #website .picker__select--year {
border-radius:5px;
padding: 0 0.5em;
}
.js_datepicker_icon{position:absolute;left:0;top:0;;display:block;width:38px;height:38px;line-height:38px;text-align:center;}
.form-control::placeholder {
opacity: 0.5;
}
input[type="number"].form-control-number{
-moz-appearance:textfield;
padding-right:45px;
}
/* Spin Buttons modified */
input[type="number"].form-control-number::-webkit-outer-spin-button,
input[type="number"].form-control-number::-webkit-inner-spin-button {
-webkit-appearance: none;
position: absolute;
top: 0;
right: 0;
bottom: 0;
}
.form-control-number-up,.form-control-number-down{background:rgba(0,0,0,0.05);border:0;color:#555;text-align:center;width:30px;height:20px;line-height:20px;padding:0;margin:0;
position:absolute;right:3px;top:3px;border-radius:2px}
.form-control-number-up:hover,.form-control-number-down:hover{background:rgba(0,0,0,0.07);}
.form-control-number-up:active,.form-control-number-down:active{background:rgba(0,0,0,0.1);}
.form-control-number-down{top:auto;bottom:3px;}
/* images floated with text, left/right sided image */
#website .img-in-content{
max-width:20vw;
position: relative;
z-index: 2;
}
.img-in-content.float-left,
.img-in-content.float-start{margin:0 2vw 2vw 0}
.img-in-content.float-right,
.img-in-content.float-end{margin:0 0 2vw 2vw}
/*
SIMPLE LIGHTBOX CSS:
*/
.sl-overlay{position:fixed;left:0;right:0;top:0;bottom:0;background:#fff;opacity:.7;display:none;z-index:714400}
.sl-wrapper{z-index:1000}.sl-wrapper button{border:0;background:0 0;font-size:24px;padding:0;cursor:pointer}
.sl-wrapper .sl-navigation button:hover,
.sl-wrapper button:hover{
box-shadow:0 0 40px rgba(0,0,0,0.7);background:#444;color:#fff
}.sl-wrapper .sl-close{display:none;position:fixed;right:30px;top:30px;z-index:1015}.sl-wrapper .sl-counter{display:none;position:fixed;top:30px;left:30px;z-index:1015}.sl-wrapper .sl-navigation{width:100%;display:none}
.sl-wrapper .sl-navigation button{position:fixed;top:50%;margin-top:-10px;height:30px;width:30px;line-height:30px;text-algin:center;display:block;z-index:1015}.sl-wrapper .sl-navigation button.sl-next{right:40px}.sl-wrapper .sl-navigation button.sl-prev{left:40px}.sl-wrapper .sl-image{position:fixed;-ms-touch-action:none;touch-action:none;z-index:10000;}
.sl-wrapper .sl-image img{margin:0;padding:0;display:block;max-width: 100%;}
.sl-wrapper .sl-image .sl-caption{display:none;padding:10px;color:#fff;background:#000;opacity:.8;position:absolute;bottom:0;left:0;right:0}.sl-wrapper .sl-image .sl-download{display:none;position:absolute;bottom:5px;right:5px;color:#fff;z-index:1005}.sl-spinner{display:none;border:5px solid #333;border-radius:40px;height:40px;left:50%;margin:-20px 0 0 -20px;opacity:0;position:fixed;top:50%;width:40px;z-index:1007;-webkit-animation:pulsate 1s ease-out infinite;-moz-animation:pulsate 1s ease-out infinite;-ms-animation:pulsate 1s ease-out infinite;-o-animation:pulsate 1s ease-out infinite;animation:pulsate 1s ease-out infinite}@-webkit-keyframes pulsate{0%{transform:scale(.1);opacity:0}50%{opacity:1}100%{transform:scale(1.2);opacity:0}}@keyframes pulsate{0%{transform:scale(.1);opacity:0}50%{opacity:1}100%{transform:scale(1.2);opacity:0}}@-moz-keyframes pulsate{0%{transform:scale(.1);opacity:0}50%{opacity:1}100%{transform:scale(1.2);opacity:0}}@-o-keyframes pulsate{0%{transform:scale(.1);opacity:0}50%{opacity:1}100%{transform:scale(1.2);opacity:0}}@-ms-keyframes pulsate{0%,100%{opacity:0}0%{transform:scale(.1)}50%{opacity:1}100%{transform:scale(1.2)}}
/*kopage changes:*/
.sl-wrapper .sl-image {box-sizing:content-box}
.sl-wrapper .sl-image .sl-caption{margin-bottom:10px;margin-left:10px;padding:10px 20px;right:inherit;border-radius:0;}
.sl-counter{color:rgba(255,255,255,0.5)}
.sl-overlay{z-index:714400;background:#000;background-image: radial-gradient(circle at center center,rgba(127,127,127,0.5) 0%,rgba(0,0,0,0.7) 100%);opacity:0.8}
.sl-wrapper{z-index:714500}
.sl-wrapper .sl-close,.sl-wrapper .sl-counter,.sl-wrapper .sl-navigation button,.sl-wrapper .sl-image .sl-download{z-index:714700}
.sl-spinner{z-index:714600}
.sl-wrapper .sl-image{z-index:714600}
.sl-wrapper .sl-image,.sl-wrapper .sl-navigation button,.sl-wrapper .sl-close{box-shadow:0 0 30px rgba(0,0,0,0.5);background:#fff;padding:10px;color:#666;transition:0.2s all}
.sl-wrapper button.sl-close{background:#000;color:#f5f6f7}
.sl-wrapper .sl-navigation button,.sl-wrapper .sl-close{height:50px;width:50px;line-height:50px;border-radius:4px;padding:0}
.sl-wrapper .sl-close{right:40px;}
/*END OF SIMPLELIGHTBOX CSS*/
#searchHolder{position:fixed;z-index:704400;top:0;left:0;right:0;padding:20px;background:#fff;display:flex;;box-shadow:0 0 100px rgba(0,0,0,0.5),0 0 50px rgba(0,0,0,025),0 0 10px rgba(0,0,0,025);opacity:0;visibility:hidden; transition:0.2s all;margin-top:-5px}
.koMenuActive #searchHolder{padding-left:120px;}
#searchHolder.active{opacity:1;visibility:visible;margin-top:0}
#searchHolder form{display:flex;width:100%;align-items:center}
#searchHolder div{padding:0 10px;}
#searchHolder .btn-light{min-width:auto;margin-left:10px;}
#searchInput{margin:0 10px}
/* overwriting current lightbox script ("magnific-popup")*/
.ko_Theme .mfp-bg{z-index:704401}
.ko_Theme .mfp-wrap{z-index:704402}
img.lazy{opacity:0; transition: opacity 0.5s linear 0.2s;}
img.lazy[data-was-processed],
img.lazy[data-ll-status="loaded"],
img.lazy.loaded{opacity:1}
/* DEBUG ONLY:
overwriting it for tests
img.lazy{opacity:1; transition: none;} img.lazy[data-was-processed]{opacity:1}
[data-aos]{outline:2px solid red}
[data-aos-delay]{box-shadow:2px 2px 0 5px blue}
*/
#contentArea #BlogArea .itemShare a{line-height:36px;height:36px;width:36px;text-align:center;padding:0;margin:0;display:inline-block;color:#333;border-radius:36px;opacity:0.5;transition:0.3s all}
#contentArea #BlogArea .itemShare a:hover{
opacity:1;
background: linear-gradient(300deg,#e6e6e6,#fcfcfc);
box-shadow: inset 0 -1px rgba(0,0,0,.1),0 .5em .6em -.5em rgba(0,0,0,.15);
}
/* .kopage* is back here for backward compatibility on older themes/websites
(like Favorite App theme) */
.koBlock_mockup{text-align:center;}
[class$="Block_mockup "] > div,
[class$="Block_mockup"] > div{
background:#DFE1E5;border-radius:5px;box-shadow:0 0 0 1px #D3D4D6,-1px -1px 20px -5px rgba(0,0,0,0.2),-1px -1px 50px -15px rgba(0,0,0,0.2);overflow:hidden;
display:inline-block;max-width:90vw;
font-family:arial,sans-serif;font-size:14px;color:#3D4043;position:relative;
text-align:left;
}
[class$="Block_mockupHead"]{display:flex;height:41px;}
[class$="Block_mockupHead"] > span{
height:13px;width:13px;border-radius:13px;display:inline-block;box-shadow:inset 0 0 0 1px rgba(0,0,0,0.1);
margin-top:calc(13px * 1.1);margin-right:calc(13px / 2);
}
[class$="Block_mockupHead"] > span:first-child{margin-left:calc(13px / 1.1);background:#FF7870}
[class$="Block_mockupHead"] > span:nth-child(2){background:#FFD272}
[class$="Block_mockupHead"] > span:nth-child(3){background:#64C455;margin-right:13px;}
/**/
[class$="Block_mockupTab"]{
margin-top:calc(13px / 3);display:flex;align-items:center
}
[class$="Block_mockupTab"] > div{
background:#fff;border-radius:8px 8px 0 0;line-height:calc(13px * 2.65);display:inline-block;padding:0 10px;display:flex;align-items:center;margin-top:auto;position:relative;
}
[class*="Block_mockupTabStart"],
[class*="Block_mockupTabEnd"] {
position: absolute;
height: 8px;
width: 8px;
overflow: hidden;
bottom:0;
}
[class*="Block_mockupTabStart"] {
left: -8px;
}
[class*="Block_mockupTabEnd"] {
right: -8px;
}
[class*="Block_mockupTabStart"]::before,
[class*="Block_mockupTabEnd"]::before {
content: '';
position: absolute;
right: 0;
height: 200%;
width: 200%;
border-radius: 100%;
box-shadow: 8px 8px 5px 100px #fff;
}
[class*="Block_mockupTabStart"]::before {
top: -100%;
}
[class*="Block_mockupTabEnd"]::before {
top: -100%;
right: -100%;
}
[class*="Block_mockupContent"] {border-top:1px solid #D9DBDF;background:#fff;}
[class*="Block_mockupContent"] img{max-width:100%;display:block;border-radius:0 0 5px 5px;min-width:100%;}
[class*="Block_mockupTabTitle"]{padding:0 8px;min-width:100px;font-size:12px}
[class*="Block_mockupBar"]{margin-top:0;background:#fff;line-height:26px;display:flex;align-items:center;padding:4px 10px;
}
[class*="Block_mockupBar"] > div {
background:#F1F3F4;
line-height:28px;height:28px;padding:0 8px;margin-left:12px;border-radius:30px;flex-grow:1;color:#202124;align-items:center;display:flex;
}
[class*="Block_mockupBar"] > div > div {
padding:0 8px;
}
.koBlock_mockupLight > div{border-radius:12px;background:#F0F0F4;box-shadow:none;}
.koBlock_mockupLight .koBlock_mockupHead > span{background:#fff;margin-top:10px}
.koBlock_mockupLight .koBlock_mockupTab,
.koBlock_mockupLight .koBlock_mockupBar {display:none}
.koBlock_mockupLight .koBlock_mockupContent{
margin:-10px 10px 10px;box-shadow:0 2px 7px rgba(0,0,0,0.2);
border-radius:10px;
padding:10px;
}
.koBlock_mockupLight .koBlock_mockupContent img{
border-radius:7px;
}
.koBlock_mockupLight .koBlock_mockupContent.p-0 img{
border-radius:10px;
}
.koHoverZoom > * {
-webkit-transform: scale(1);
transform: scale(1);
transition: .2s ease-in-out;
}
.koHoverZoom:hover > * {
-webkit-transform: scale(1.05);
transform: scale(1.05);
}
.koHoverShine{
overflow: hidden;
}
.koHoverShine::before {
position: absolute;
top: 0;
left: -75%;
z-index: 2;
display: block;
content: '';
width: 50%;
height: 100%;
background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
-webkit-transform: skewX(-25deg);
transform: skewX(-25deg);
pointer-events:none;
}
.koHoverShine:hover::before {
-webkit-animation: koShine .75s;
animation: koShine .75s;
}
@-webkit-keyframes koShine {
100% {
left: 125%;
}
}
@keyframes koShine {
100% {
left: 125%;
}
}
.kapp[data-app="background"]{display:none}
.inAdminMode body:not(.koEditingMode) .kapp[data-app="background"]{display:block;position:absolute;top:0;left: 0;}
.kapp .instagram_private{padding:20px;text-align:center;display:block;}
.kedit-rotating-text{
display: inline-flex;
margin: 0;
vertical-align: top;
}
.kedit-rotating-text .word {
position: absolute;
display: flex;
opacity: 0;
}
.kedit-rotating-text .word .letter {
transform-origin: center center 25px;
}
.kedit-rotating-text .word .letter.out {
transform: rotateX(90deg);
transition: 0.2s cubic-bezier(0.6, 0, 0.7, 0.2);
}
.kedit-rotating-text .word .letter.in {
transition: 0.25s ease;
}
.kedit-rotating-text .word .letter.behind {
transform: rotateX(-90deg);
}
.keditDisplay-td,
.keditDisplay-mt,
.keditDisplay-md,
.keditDisplay-m,
.keditDisplay-t,
.keditDisplay-d{
display:none!important;
}
/*
potential problem when "full height" is set,
".kedit.keditFullHeight" rule is overwriting .keditDisplay-* "display:none",
adding "!important" suffix / 01.2023
*/
/*SM*/
/*@media (min-width:576px){*/
/* define individuals */
.keditDisplay-m{
display:block!important;
}
.keditDisplay-t{
display:none!important;
}
.keditDisplay-d{
display:none!important;
}
/* define groups */
.keditDisplay-mt,
.keditDisplay-md{
display:block!important;
}
.keditDisplay-td{
display:none!important;
}
.keditDisplay-none{
display:none!important;
}
/*}*/
/*MD*/
@media (min-width:768px){
/* define individuals */
.keditDisplay-m{
display:none!important;
}
.keditDisplay-t{
display:block!important;
}
.keditDisplay-d{
display:none!important;
}
/* define groups */
.keditDisplay-mt,
.keditDisplay-td{
display:block!important;
}
.keditDisplay-md{
display:none!important;
}
}
/*LG*/
@media (min-width:1200px){
/* define individuals */
.keditDisplay-m{
display:none!important;
}
.keditDisplay-t{
display:none!important;
}
.keditDisplay-d{
display:block!important;
}
/* define groups */
.keditDisplay-md,
.keditDisplay-td{
display:block!important;
}
.keditDisplay-mt{
display:none!important;
}
}
/*countdown widget*/
.tick {
font-size:1rem; white-space:nowrap;
}
.tick-flip,
.tick-text-inline{
font-size:3.5rem;
}
@media (max-width: 700px) {
.tick-flip,
.tick-text-inline {
font-size: calc(1em + (100vw / 25));
}
}
.tick-text:not(.tick-label){font-size:2em;}
.tick-label {
margin-top:1em;font-size:1em;
}
.tick-char {
width:1.5em;
}
.tick-text-inline {
display:inline-block;text-align:center;min-width:1em;
}
.tick-text-inline+.tick-text-inline {
margin-left:-.325em;
}
.tick-group {
margin:0.5em;text-align:center;
}
/*
#website div,
#website p {
--font-size: calc(1.1rem * var(--kedit-fsx));
}
*/
/*.keditable{border:2px solid black;}*/
/*.keditable div{border:2px solid green;}*/
/* overrwiting some Bootstrap's font-size default values, to make them work with modifier */
/*[style*="--kedit-fsx"]{border:10px solid red!important;}*/
.h1, h1{
font-size: calc(2.5rem * var(--kedit-fsx));
}
/*
.DISPLAY-1
normal:
font-size: calc(6rem * var(--kedit-fsx));
responsive:
--d-fs:calc(1.725rem + 5.7vw);
font-size: calc(var(--d-fs) * var(--kedit-fsx));
*/
@media (max-width: 1200px) {
.h1,h1 {
/*
calc values from Bootstrap:
https://project-rfs.github.io/docs/4.3/content/typography/
*/
--d-fs:calc(1.375rem + 1.5vw);
font-size: calc(var(--d-fs) * var(--kedit-fsx));
}
}
.h2, h2 {
font-size: calc(2rem * var(--kedit-fsx));
}
@media (max-width: 1200px) {
.h2,h2 {
--d-fs:calc(1.325rem + 0.9vw);
font-size: calc(var(--d-fs) * var(--kedit-fsx));
}
}
.h3, h3 {
font-size: calc(1.75rem * var(--kedit-fsx));
}
@media (max-width: 1200px) {
.h3,h3 {
--d-fs:calc(1.3rem + 0.6vw);
font-size: calc(var(--d-fs) * var(--kedit-fsx));
}
}
.h4, h4 {
font-size: calc(1.5rem * var(--kedit-fsx));
}
@media (max-width: 1200px) {
.h4,h4 {
--d-fs:calc(1.275rem + 0.3vw);
font-size: calc(var(--d-fs) * var(--kedit-fsx));
}
}
.h5, h5 {
/* no responsive value */
font-size: calc(1.25rem * var(--kedit-fsx));
}
.h6, h6 {
/* no responsive value */
font-size: calc(1rem * var(--kedit-fsx));
}
/*
.lead {
font-size: calc(.25rem * var(--kedit-fsx));
}
.koPreTitle {
font-size: calc(1rem * var(--kedit-fsx));
}
.koBlock1 h2 {
font-size: calc(40px * var(--kedit-fsx));
}
*/
.display-1 {
font-size: calc(6rem * var(--kedit-fsx));
font-weight: 300;
line-height: 1.2;
}
h2.display-1 {
font-size: calc(5.5rem * var(--kedit-fsx));
}
h3.display-1 {
font-size: calc(5.2rem * var(--kedit-fsx));
}
h4.display-1 {
font-size: calc(4.8rem * var(--kedit-fsx));
}
h5.display-1 {
font-size: calc(4.5rem * var(--kedit-fsx));
}
h6.display-1 {
font-size: calc(4.2rem * var(--kedit-fsx));
}
@media (max-width: 1200px) {
.display-1 {
--d-fs:calc(1.725rem + 5.7vw);
font-size: calc(var(--d-fs) * var(--kedit-fsx));
}
}
.display-2 {
font-size: calc(5.5rem * var(--kedit-fsx));
font-weight: 300;
line-height: 1.2;
}
h2.display-2 {
font-size: calc(5.2rem * var(--kedit-fsx));
}
h3.display-2 {
font-size: calc(5.0rem * var(--kedit-fsx));
}
h4.display-2 {
font-size: calc(4.8rem * var(--kedit-fsx));
}
h5.display-2 {
font-size: calc(4.3rem * var(--kedit-fsx));
}
h6.display-2 {
font-size: calc(4rem * var(--kedit-fsx));
}
@media (max-width: 1200px) {
.display-2 {
--d-fs:calc(1.675rem + 5.1vw);
font-size: calc(var(--d-fs) * var(--kedit-fsx));
}
}
.display-3 {
font-size: calc(4.5rem * var(--kedit-fsx));
font-weight: 300;
line-height: 1.2;
}
h2.display-3 {
font-size: calc(4.2rem * var(--kedit-fsx));
}
h3.display-3 {
font-size: calc(4.0rem * var(--kedit-fsx));
}
h4.display-3 {
font-size: calc(3.8rem * var(--kedit-fsx));
}
h5.display-3 {
font-size: calc(3.3rem * var(--kedit-fsx));
}
h6.display-3 {
font-size: calc(3rem * var(--kedit-fsx));
}
@media (max-width: 1200px) {
.display-3 {
--d-fs:calc(1.575rem + 3.9vw);
font-size: calc(var(--d-fs) * var(--kedit-fsx));
}
}
.display-4 {
font-size: calc(3.5rem * var(--kedit-fsx));
font-weight: 300;
line-height: 1.2;
}
h2.display-4 {
font-size: calc(3.2rem * var(--kedit-fsx));
}
h3.display-4 {
font-size: calc(3.0rem * var(--kedit-fsx));
}
h4.display-4 {
font-size: calc(2.8rem * var(--kedit-fsx));
}
h5.display-4 {
font-size: calc(2.3rem * var(--kedit-fsx));
}
h6.display-4 {
font-size: calc(2rem * var(--kedit-fsx));
}
@media (max-width: 1200px) {
.display-4 {
--d-fs:calc(1.475rem + 2.7vw);
font-size: calc(var(--d-fs) * var(--kedit-fsx));
}
}
/* + .display-1, etc */
/* update from content block maker */
.koButtons.d-flex,.koButtons.d-flex .js-draggable{
flex-wrap: wrap;
}
.koButtons.d-flex.text-left {
justify-content: start;
}
.koButtons.d-flex.text-center {
justify-content: center;
}
.koButtons.d-flex.text-right {
justify-content: end;
}
.koButtons.d-flex .btn{
margin:0 5px 5px 0;
align-self: center;
}
/* the same as .keditExpand?? */
.position-absolute-expand{
position:absolute;
top:0;left:0;
width: 100%;
height: 100%;
}
.position-absolute-expand-middle{
top:50%!important;transform:translateY(-50%);
}
.position-absolute-expand-middle-scale{
top:50%!important;transform:translateY(-50%) scale(1.2);
}
.position-relative{z-index:1}
.koPopup{user-select: none;pointer-events:none;}
.koPopup.active{user-select: none;pointer-events:inherit;}
.koPopup .koLightboxOverlay{opacity:0;transition:0.3s opacity;transition-delay:0.2s}
.koLightboxModal{opacity:0;transform:translateY(5px);transition:0.2s opacity,0.3s transform;transition-delay:0;color:#000;}
#website .koLightboxModal h1{color:#000;}
.koPopup.active .koLightboxOverlay{opacity:1;transition-delay:0}
.koPopup.active .koLightboxModal{opacity:1;transform:translateY(0);transition-delay:0.3s}
.keditLayer_video{height:100%;}
.keditLayer_video iframe {
transition: opacity 500ms ease-in-out;
transition-delay: 250ms;
height:100%;width:100%;border:0;pointer-events:none;
position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
}
/* slider/swiper */
/*.swiper-slide h2,.swiper-slide h3{display:flex;}*/
#website .swiper-slide h2,#website .swiper-slide h3{color:rgba(0,0,0,0.9);}
#website .swiper-slide h4{font-weight:400;color:rgba(0,0,0,0.5)}
#website .swiper-slide.swiper-white-text h2,
#website .swiper-slide.swiper-white-text h3{color:rgba(255,255,255,0.9);}
#website .swiper-slide.swiper-white-text h4{color:rgba(255,255,255,0.6);}
#website .swiper-slide .koButtons{margin-top:50px;}
#website .swiper-slide {
/*background: #fff;*/
/* Center slide text vertically */
display: flex;
justify-content: center;
align-items: center;
align-self: center;
}
#website .slide-caption {
position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,rgba(0,0,0,0.8),rgba(0,0,0,0.5));color:#fff;text-shadow:1px 0 1px rgba(0,0,0,0.8);padding:10px;
}
#website .slide-content {
padding: 100px 0;
height:100%;
text-align: center;
font-size: 18px;
/*background: #fff;*/
/* Center slide text vertically */
display: flex;
justify-content: center;
align-items: center;
align-self: center;
z-index:2;
}
#website .swiper-slide.swiper-fullheight{min-height:100vh;}
#website .swiper-slide.swiper-fullheight img{min-height:100vh;}
#website .swiper-slide.swiper-autoheight{min-height:200px;}
#website .swiper-button-prev::after,
#website .swiper-button-next::after{content:"";width:44px;height:44px;}
#website .swiper-button-prev,
#website .swiper-container-rtl .swiper-button-next {
background: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E") no-repeat center;
background-color: rgba(255,255,255,0);
border-radius: 5px;
background-size: 20px 20px; transition:0.2s all;
}
#website .swiper-button-next,
#website .swiper-container-rtl .swiper-button-prev {
background: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E") no-repeat center;
background-color: rgba(255,255,255,0);
border-radius: 5px;
background-size: 20px 20px; transition:0.2s all;
}
#website .swiper-button-prev,
#website .swiper-button-next{
opacity:0;visibility:hidden;width:44px;height:44px;
}
#website .swiper-container:hover .swiper-button-prev{background-color:#fff;margin-left:5px;box-shadow:1px 1px 12px rgba(0,0,0,0.1);opacity:1;visibility:visible}
#website .swiper-container:hover .swiper-button-next{background-color:#fff;margin-right:5px;box-shadow:1px 1px 12px rgba(0,0,0,0.1);opacity:1;visibility:visible}
#website .swiper-button-prev:hover,
#website .swiper-button-next:hover{transform:scale(1.05);box-shadow:2px 2px 32px rgba(0,0,0,0.4),2px 2px 5px rgba(0,0,0,0.3)}
#website .keditLayout_1 .swiper-button-next,
#website .keditLayout_1 .swiper-container-rtl .swiper-button-prev {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23FFFFFF'%2F%3E%3C%2Fsvg%3E");
background-color: rgba(0,0,0,0);
border-radius: 50px;
}
#website .keditLayout_1 .swiper-button-prev,
#website .keditLayout_1 .swiper-container-rtl .swiper-button-next {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23FFFFFF'%2F%3E%3C%2Fsvg%3E");
background-color: rgba(0,0,0,0);
border-radius: 50px;
}
#website .keditLayout_1 .swiper-container:hover .swiper-button-prev,
#website .keditLayout_1 .swiper-container:hover .swiper-button-next{background-color:rgba(0,0,0,0.5);}
/*headerMenu has 65405 when fixed*/
.ko_ThemeFixed,.ko_ThemeOn,.ko_ThemeOnSide{--bodyTop:50px;}
.ko_ThemeOn #headerMenu{top:var(--bodyTop,0)}
.ko_ThemeFixed #website,.ko_ThemeOnSide #website{padding-top:var(--bodyTop,0);}
.ko_Theme.ko_ThemeFixed #headerMenu{top:var(--bodyTop,0);}
#headerMenuBar{
line-height:22px;font-size:15px;
position:relative;z-index:65406;
background:var(--headerBanner_bg,#333);
color:var(--headerBanner_text,#fff);
height:50px;
}
.ko_ThemeFixed #headerMenuBar{
/*but for fixed menus..*/
position:fixed;top:0;left:0;right:0;
}
.ko_ThemeOnSide:not(.editingHeaderBanner) #headerMenuBar{
/*but for fixed menus..*/
position:absolute;top:0;left:0;right:0;width: 100vw;margin-top:calc(0px - var(--bodyTop,0));
}
.ko_ThemeOnSide .koMenuActive #headerMenuBar{max-width:calc(100vw - 100px)}
.websitePreviewMode #headerMenuBar,
.koMenuActive .websitePreviewMode #headerMenu{left:0}
.headerBanner_item{margin-right:20px;cursor:default;padding:0;align-items: center;display:flex;;height:100%;white-space: pre;} /* flex-flow:row nowrap */
a.headerBanner_item,.headerBanner_item a{color:var(--headerBanner_text,#fff);text-decoration:none;outline:none!important;cursor:pointer}
.headerBanner_item:before{content: "\f3c5";font-family: Font Awesome\ 5 Free;display: inline-block; font-weight:900;margin-right:10px;font-size:16px;padding:0;opacity:0.4;transition:0.2s opacity}
.headerBanner_item:hover:before{opacity:1}
.headerBanner_address:before{content: "\f3c5";}
.headerBanner_phone:before{content: "\f095";}
.headerBanner_phone:before{content: "\f879";}
.headerBanner_mail:before{content: "\f0e0";}
.headerBanner_hours:before{content: "\f54f";}
.headerBanner_html:before{content: none}
.headerBanner_mail,
.headerBanner_phone,
.headerBanner_address
{overflow:hidden;width:16px;}
@media (min-width: 992px) {
.headerBanner_mail,
.headerBanner_phone,
.headerBanner_address
{overflow:initial;width:initial;}
.headerBanner_close{position:absolute;top:0;right:0}
}
.headerBanner_close,#website .headerBanner_social a{text-decoration:none;display:block;line-height:50px;height:50px;;text-align:center;
color:var(--headerBanner_text,#fff);
background:none;
border:0;
font-size:18px;
opacity:0.5;transition:0.2s opacity}
.headerBanner_social i {font-size:1em}
.headerBanner_close{width:50px;}
.headerBanner_close:hover,#website .headerBanner_social a:hover{
color:var(--headerBanner_text,#fff);opacity:1
}
.headerBanner_social{display:flex}
.headerBanner_social a{width:30px}
.headerBanner_control:before{
content:"";height:7px;
width:100%;
background-size: auto 100%;
background: var(--ui-color-stripes-accent);
position:absolute;z-index:10;display:block;line-height:1;left:0;top:0;right:0;color:#fff;
}
.headerBanner_control{position:absolute;z-index:10;;display:block;line-height:1;padding:0 50px;left:0;top:100%;right:0;color:#fff;
height: 50px;
pointer-events:none;
width: 100%;
display: block;
text-align:center;
margin-top:-5px;opacity:0;transition:0.2s all;
overflow:hidden;
}
.headerBanner_control i{opacity:0.5;margin-right:5px;}
.headerBanner_control a{
pointer-events:none;
display:block;line-height:40px;display:inline-block;background-color: var(--ui-color-accent);color:#fff;
margin-top:0;font-family: var(--ui-font);padding:5px;border-radius:0 0 7px 7px;text-decoration:none;
box-shadow:0 0 15px -5px rgba(0,0,0,0.75);
margin-top:-10px;transition:0.2s all;z-index:11;position:relative;
}
.headerBanner_control a span{
background: var(--ui-color-leftmenu);
padding:0 20px 0 10px;
line-height:30px;
display:block;
border-radius:4px;
font-size:15px;
}
.headerBanner_control:hover{color:#fff}
.headerBanner_control a:hover span{box-shadow: inset 0 0 0 100px rgba(0,0,0,0.3);}
#headerMenuBar:hover .headerBanner_control{opacity:1;margin-top:0}
#headerMenuBar:hover .headerBanner_control a,
.headerBanner_control:hover a{pointer-events:auto;margin-top:0}
.editingHeaderBanner #headerMenuBar.d-none{display: block!important;}
/* blog/editor.js */
.editorjsH1:empty:before,.editorjsLead:empty:before{
content:attr(placeholder);
opacity:0.2;
pointer-events: none;
}
.editorjsH1,.editorjsLead{outline:none}
.editorjsH1{margin:30px 0;}
.editorjsLead{font-size: 1.66rem;margin:40px 0;}
.ce-paragraph[data-placeholder]:empty::before {color:inherit;}
.ce-block__content pre{padding:1.5vw;font-size:14px;}
.ce-block--stretched img{
display: block;
width: 100%;
margin: 0 auto;
}
.ce-toolbar__content{max-width: 720px;}
.ce-block__content,
.ce-block__headers {
position: relative;
max-width: 720px;
margin: 0 auto;
font-size: 1.25rem;
}
.ce-header,.ce-paragraph{
line-height:inherit;
margin:inherit;
padding:inherit;
}
.ce-header{
margin: .75em 0;
}
.ce-paragraph[data-placeholder]:empty:focus::before {
opacity: 0.5;pointer-events:none;
}
.ce-block{
margin: 25px 0;
}
html:not(.inAdminMode) .ce-paragraph,
html:not(.inAdminMode) .ce-block .cdx-alert{
margin: 25px 0;
}
/*
.ce-paragraph,.ce-block .cdx-alert{
margin: 25px 0;
}
*/
.ce-block .cdx-alert {
padding: 25px;
font-size:90%;
}
.cdx-alert-primary {
background-color: #ebf8ff;
border: 1px solid #4299e1;
color: #2b6cb0;
}
.cdx-alert-secondary {
background-color: #f7fafc;
border: 1px solid #cbd5e0;
color: #222731;
}
.cdx-alert-info {
background-color: #e6fdff;
border: 1px solid #4cd4ce;
color: #00727c;
}
.cdx-alert-success {
background-color: #f0fff4;
border: 1px solid #68d391;
color: #2f855a;
}
.cdx-alert-warning {
background-color: #fffaf0;
border: 1px solid #ed8936;
color: #c05621;
}
.cdx-alert-danger {
background-color: #fff5f5;
border: 1px solid #fc8181;
color: #c53030;
}
.cdx-alert-light {
background-color: #fff;
border: 1px solid #edf2f7;
color: #1a202c;
}
.cdx-alert-dark {
background-color: #2d3748;
border: 1px solid #1a202c;
color: #d3d3d3;
}
.addElfWidget svg {
fill: #F93162;
}
.addElfWidget button {
display: flex;
width: calc(100% - 8px);
box-sizing: border-box;
font-weight: normal;
margin-bottom:5px;
font-family:inherit
}
.addElfWidget button:hover{
background: var(--ui-color-leftsubmenu);
}
.koMenuButton .addElfWidget button{
height:75px;
font-size: 15px;
color: rgba(0,0,0,0.5);
background:none;
}
.koMenuButton .addElfWidget svg {
height: 30px;
width: 50px;
}
.koMenuButton .addElfWidget button span {
padding: 5px 0 0 30px;
}
.elfsight-embed-sdk-popup a {text-decoration:none!important}
.koparsed .alert{
max-width: 700px;
margin-left: auto;
margin-right: auto;
}
.koparsed .dashboard .alert {
max-width: inherit;
margin-bottom: 40px;
}
.isHidden,[rel="isHidden"]{display:none!important;visibility:hidden;}
/* update, image-links are not block? (client reported)*/
a:has(.img-fluid),.kimgRatio a {
display: block;
}
summary {
font-weight: bold;
list-style: none;
display: flex;
align-items: center;
padding: 1rem 0;
}
.koDetails .p-3 {
padding-left: 0 !important;
padding-right: 0 !important;
text-align:left;
}
summary:after {
content: '';
width: 18px;
height: 10px;
background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiIHN0eWxlPSJmaWxsLXJ1bGU6ZXZlbm9kZDtjbGlwLXJ1bGU6ZXZlbm9kZDtzdHJva2UtbGluZWpvaW46cm91bmQ7c3Ryb2tlLW1pdGVybGltaXQ6MiIgdmlld0JveD0iMCAwIDE4IDEwIj48cGF0aCBkPSJNMjU0LjYgNDc3LjQ3OWM1LjExMS00LjIwNyAzMDcuMTE3LTMwNy4yNTYgMzA3LjExNy0zMDcuMjU2czE0LjQ4OC0xNi4yNzIgMzYuMTIyLTE2LjI0YzIzLjM0Mi4wMzYgMzguNTg2IDE2LjExMyAzOC41ODYgMTYuMTEzUzkzOS4xNjcgNDc1Ljk0IDk0MC44NTQgNDc3LjQ2M2MyNi4zNDYgMjMuNzkyIDE1LjE1OCA1OS40NzYgMS45NzMgNzMuODkzLTE0LjIyMSAxNS41NS00Ni40OTcgMjQuMTQyLTc0LjUwOC0yLjI1NS0yLjk2OC0yLjc5Ny0yNjMuNDczLTI2My41ODUtMjYzLjQ3My0yNjMuNTg1cy0zLjcwOS00LjY5My03LjM2NS00Ljg1NWMtMy4yMzEtLjE0NC03Ljc5OCA0Ljc4OC03Ljc5OCA0Ljc4OFMzMzIuNzk0IDU0My44NTggMzI2LjQ3OCA1NDkuODAxYy0xMy44NjQgMTMuMDQ2LTUwLjAxNSAyNy4wOTQtNzQuMTk5IDIuMjE4LTM0LjAzOS0zNS4wMTMtMS41NTktNzEuMzQ2IDIuMzIxLTc0LjU0WiIgc3R5bGU9ImZpbGw6cmdiYSgwLDAsMCwwLjcpIiB0cmFuc2Zvcm09Im1hdHJpeCgtLjAyNDcxIDAgMCAtLjAyMzc0IDIzLjc1IDEzLjU1NykiLz48L3N2Zz4=");
background-size: cover;
transition: 0.2s;
margin-left: auto;
flex-shrink: 0;
display: block;
}
details[open] > summary::after {
transform: rotate(180deg);
}
summary::-webkit-details-marker {
display: none;
}
summary {
border-radius: 5px;
color:#000;
text-align:left;
}
.keditDark summary {
color:#fff;
}
.keditDark summary:after {
background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbDpzcGFjZT0icHJlc2VydmUiIHN0eWxlPSJmaWxsLXJ1bGU6ZXZlbm9kZDtjbGlwLXJ1bGU6ZXZlbm9kZDtzdHJva2UtbGluZWpvaW46cm91bmQ7c3Ryb2tlLW1pdGVybGltaXQ6MiIgdmlld0JveD0iMCAwIDE4IDEwIj48cGF0aCBkPSJNMjU0LjYgNDc3LjQ3OWM1LjExMS00LjIwNyAzMDcuMTE3LTMwNy4yNTYgMzA3LjExNy0zMDcuMjU2czE0LjQ4OC0xNi4yNzIgMzYuMTIyLTE2LjI0YzIzLjM0Mi4wMzYgMzguNTg2IDE2LjExMyAzOC41ODYgMTYuMTEzUzkzOS4xNjcgNDc1Ljk0IDk0MC44NTQgNDc3LjQ2M2MyNi4zNDYgMjMuNzkyIDE1LjE1OCA1OS40NzYgMS45NzMgNzMuODkzLTE0LjIyMSAxNS41NS00Ni40OTcgMjQuMTQyLTc0LjUwOC0yLjI1NS0yLjk2OC0yLjc5Ny0yNjMuNDczLTI2My41ODUtMjYzLjQ3My0yNjMuNTg1cy0zLjcwOS00LjY5My03LjM2NS00Ljg1NWMtMy4yMzEtLjE0NC03Ljc5OCA0Ljc4OC03Ljc5OCA0Ljc4OFMzMzIuNzk0IDU0My44NTggMzI2LjQ3OCA1NDkuODAxYy0xMy44NjQgMTMuMDQ2LTUwLjAxNSAyNy4wOTQtNzQuMTk5IDIuMjE4LTM0LjAzOS0zNS4wMTMtMS41NTktNzEuMzQ2IDIuMzIxLTc0LjU0WiIgc3R5bGU9ImZpbGw6cmdiYSgyNTUsMjU1LDI1NSwwLjcpIiB0cmFuc2Zvcm09Im1hdHJpeCgtLjAyNDcxIDAgMCAtLjAyMzc0IDIzLjc1IDEzLjU1NykiLz48L3N2Zz4=");
}
details[open] summary {border-radius: 5px 5px 0 0;}
details {
border-radius: 5px;
margin-bottom:5px;
font-size: 1.2rem;
}
/*summary ,summary * {outline:1px solid blue}*/
.inAdminMode summary .keditable{
min-width:160px;
cursor: text;
}
summary abbr{
color:transparent;
opacity:0;
/*visibility:hidden;*/
}
details + details:before {content:"";height:1px;display:block;background:rgba(0,0,0,0.1);margin-top:-5px;}
.keditDark details + details:before{background:rgba(255,255,255,0.25);}
[data-keditor] .col-lg:has(.col-container:empty) {
margin: 0;
}
/*
.kapp-logoItemsSlider::after,.kapp-logoItemsSlider::before {
background: linear-gradient(90deg,#fff 0,hsla(0,0%,100%,0));
content: "";
height: 100px;
position: absolute;
width: 10%;
z-index: 1;
}
.kapp-logoItemsSlider::before {
left: 0;
top: 0;
}
.kapp-logoItemsSlider::after {
right: 0;
top: 0;
transform: rotate(180deg);
}
.kapp-logoItemsSlider{
margin: auto;
overflow: hidden;
position: relative;
--logo-gap: 66px;
--slide-width: 134px;
--total-width: calc((var(--slide-width) + var(--logo-gap)) * var(--n-logos));
}
.kapp-logoItems{
align-items: center; column-gap: 66px; justify-content: start; display: flex;
animation: logoItemsScroll calc(var(--n-logos)*4s) linear infinite both;
column-gap: var(--logo-gap);
width: var(--total-width);
}
@keyframes logoItemsScroll {
0% {
transform:translateX(0)
}
to {
transform:translateX(calc(-1 * var(--total-width)))
}
}
.kapp-logoItem{
align-items: center; justify-content: start; display: flex; height: 88px
}
.kapp-logoItem img{
aspect-ratio: auto 134 / 48;
object-fit: contain;
width: 134px;
height: 48px;
}
*/
.text-center .koButtons {
justify-content: center;
}
.text-right .koButtons {
justify-content: end;
}
/*.text-left .koSeparator,*/
/*default: */
.col-container .koSeparator{
margin-left: 0;
margin-right: auto;
}/*koSeparatorLeft*/
.text-center .col-container .koSeparator {
margin-left: auto;
margin-right: auto;
}
.text-right .col-container .koSeparator {
margin-left: auto;
margin-right: 0;
}
section.keditRounded,
.keditRow.keditRounded section {
border-radius: 3vw;
width: calc(100% - 6vw);
margin: 1.5vw auto;
max-width: 1440px;
padding:calc(0.75rem + 3vw) 3vw;
}
section.keditRow.keditRounded,
section.keditRow.keditRounded .keditColumn{
padding:0;
}
.keditRow.keditRounded section{
margin: 0;
width: 100%;
}
section.keditRounded:hover {
border-radius: 0 3vw 3vw 3vw;
}
.keditRounded:hover::after {
border-radius: 0 3vw 3vw 3vw;
}/*CSS*dab84bf17316e31d040d0296ed0f1186*/:root{--ui-color-accent: #a84775;--ui-color-accent-75: rgba(168,71,117,0.7);--ui-color-accent-50: rgba(168,71,117,0.5);--ui-color-accent-25: rgba(168,71,117,0.25);--ui-color-accent-light: rgba(168,71,117,0.1);--ui-color-stripes-accent:repeating-linear-gradient(
-45deg,#6c0b39,#a84775 20px,#6c0b39 20px,#6c0b39 50px,#a84775 50px,#a84775 65px);--ui-color-leftmenu:#282C33;}.inAdminPlus #k_spinner {border: 5px solid rgba(0,0,0,0)!important;border-top-color: var(--ui-color-accent)!important;border-radius: 50%!important;background:rgba(0,0,0,0)!important;-webkit-animation: koLoadingRotation 1s infinite linear!important;animation: koLoadingRotation 1s infinite linear!important;}.inAdminPlus{--ui-color-stripes-accent:#a84775!important;}/*CSS*cfa16b9ecd8e86e5560be5e1ad36839f*/.ko_Theme .topmenu a:hover, .ko_Theme .topmenu .active a {background:inherit}.ko_Theme .menuHolder li a {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline;line-height: 1;color: inherit;text-shadow: none}.ko_Theme .menuHolder li {display: inline-block;padding:0}.ko_Theme .menuHolder{ flex-flow: row wrap}.ko_Theme .menuHolder,.ko_Theme #headerMenu{padding:0}.ko_Theme .logoHolder #logoReplacer h2,.ko_Theme .logoHolder a,.ko_Theme .logoHolder {line-height:1;padding:0;margin:0;height:auto}.ko_Theme .logoHolder img{max-height:auto}.ko_Theme #headerMenu .container {/*overflow:auto;*/display:flex;flex-direction: row;justify-content: space-between;align-items: center}:root{--color1:#fca311;--color2:#415a77;--color1_rgb: 252,163,17;--color1_hsl: 37,98%,53%;--color1_hs: 37,98%;--color1_h: 37;--color1_s: 98%;--color1_l: 53%;--color1_25:#fee8c4;--color1_50:#fed188;--color1_75:#fdba4d;--color1_125:#bd7a0d;--color1_150:#7e5209;--color1_175:#3f2904;--color2_rgb: 65,90,119;--color2_hsl: 212,29%,36%;--color2_hs: 212,29%;--color2_h: 212;--color2_s: 29%;--color2_l: 36%;--color2_25:#d0d6dd;--color2_50:#a0adbb;--color2_75:#718399;--color2_125:#314459;--color2_150:#212d3c;--color2_175:#10171e;--color1_bw:rgba(255,255,255,0.8);--color1_25_bw:rgba(0,0,0,0.8);--color1_50_bw:rgba(0,0,0,0.8);--color1_75_bw:rgba(0,0,0,0.8);--color1_125_bw:rgba(255,255,255,0.8);--color1_150_bw:rgba(255,255,255,0.8);--color1_175_bw:rgba(255,255,255,0.8);--color2_bw:rgba(255,255,255,0.8);--color2_25_bw:rgba(0,0,0,0.8);--color2_50_bw:rgba(255,255,255,0.8);--color2_75_bw:rgba(255,255,255,0.8);--color2_125_bw:rgba(255,255,255,0.8);--color2_150_bw:rgba(255,255,255,0.8);--color2_175_bw:rgba(255,255,255,0.8);;--font1:Plus Jakarta Sans;--font2:Inter;--font3:Helvetica Neue,sans-serif;--color1_rgb: 252,163,17;--color1_hsl: 37,98%,53%;--color1_hs: 37,98%;--color1_h: 37;--color1_s: 98%;--color1_l: 53%;--color1_25:#fee8c4;--color1_50:#fed188;--color1_75:#fdba4d;--color1_125:#bd7a0d;--color1_150:#7e5209;--color1_175:#3f2904;--color2_rgb: 65,90,119;--color2_hsl: 212,29%,36%;--color2_hs: 212,29%;--color2_h: 212;--color2_s: 29%;--color2_l: 36%;--color2_25:#d0d6dd;--color2_50:#a0adbb;--color2_75:#718399;--color2_125:#314459;--color2_150:#212d3c;--color2_175:#10171e;--color1_bw:rgba(255,255,255,0.8);--color1_25_bw:rgba(0,0,0,0.8);--color1_50_bw:rgba(0,0,0,0.8);--color1_75_bw:rgba(0,0,0,0.8);--color1_125_bw:rgba(255,255,255,0.8);--color1_150_bw:rgba(255,255,255,0.8);--color1_175_bw:rgba(255,255,255,0.8);--color2_bw:rgba(255,255,255,0.8);--color2_25_bw:rgba(0,0,0,0.8);--color2_50_bw:rgba(255,255,255,0.8);--color2_75_bw:rgba(255,255,255,0.8);--color2_125_bw:rgba(255,255,255,0.8);--color2_150_bw:rgba(255,255,255,0.8);--color2_175_bw:rgba(255,255,255,0.8);}#contentArea .koColor {color:#fca311;}ul.koCheckList li:before {background:#fca311;}.ko_Theme #website .btn-primary {background-color:var(--color2);border-color:var(--color2);}.ko_Theme #website .btn-outline-primary {color:var(--color2);border-color:var(--color2);}.ko_Theme #website .btn-outline-primary:hover {background-color:var(--color2);color:var(--color1_bw);border-color:var(--color2);}#website .page-item.active .page-link {background-color:#fca311;color:var(--color1_bw);border-color:var(--color2);}#contentArea a:not(.btn),#contentArea a.btn-link {color:var(--color2)}#website.koMenu .tab-pane:not(.tab-pane-menu):not(.tab-pane-footer) a:not(.btn):not(.koMenuButton),#website.koMenu a.btn-link {color:var(--color2)}#website .keditDark .keditWhite a:not(.btn):not(.page-link),#website .keditDark .keditWhite a.btn.btn-link{color:var(--color2)}.ko_Theme #contentArea, .ko_Theme .koThemeDark #contentArea .whiteShadowContainer {color:rgba(0,0,0,0.6)}#contentArea h1, #contentArea h2, #contentArea h3,#contentArea h1 a, #contentArea h2 a, #contentArea h3 a, .koThemeDark #contentArea .whiteShadowContainer strong, .koThemeDark #contentArea .whiteShadowContainer h1, .koThemeDark #contentArea .whiteShadowContainer h2, .koThemeDark #contentArea .whiteShadowContainer h3{color: rgb(0, 0, 0);}#contentArea h4, #contentArea h5, #contentArea h6,#contentArea h4 a, #contentArea h5 a, #contentArea h6 a, .koThemeDark #contentArea .whiteShadowContainer strong, .koThemeDark #contentArea .whiteShadowContainer h4, .koThemeDark #contentArea .whiteShadowContainer h5, .koThemeDark #contentArea .whiteShadowContainer h6 {color: rgb(0, 0, 0);}.ko_Theme #website #footerContent {color: rgba(0, 0, 0, .6);}.ko_Theme #website #footerContent h1,.ko_Theme #website #footerContent h2,.ko_Theme #website #footerContent h3,.ko_Theme #website #footerContent h4,.ko_Theme #website #footerContent h5,.ko_Theme #website #footerContent h6 {color: rgb(0, 0, 0);}.ko_Theme #website, .ko_Theme #website p{font-family:var(--font2),sans-serif;}.ko_Theme #website a.btn, .ko_Theme #website button.btn{font-family:var(--font1),sans-serif;}.ko_Theme #website h1,.ko_Theme #website h2,.ko_Theme #website h3{font-family:var(--font1),sans-serif;font-weight:700}.ko_Theme #website h4,.ko_Theme #website h5,.ko_Theme #website h6{font-family:var(--font1),sans-serif;font-weight:400}.ko_Theme #website .topmenu{font-family:var(--font1),sans-serif;font-weight:400}.ko_Theme #website .logoHolder .logoContents{font-family:var(--font1),sans-serif;font-weight:700}.ko_Theme #website #footerContent {font-family:var(--font2),sans-serif;}.ko_Theme #website #footerContent h1,.ko_Theme #website #footerContent h2,.ko_Theme #website #footerContent h3,.ko_Theme #website #footerContent h4,.ko_Theme #website #footerContent h5,.ko_Theme #website #footerContent h6 {font-family:var(--font1),sans-serif;}.ko_Theme .menuHolder li.topmenuSocial > span{margin-top:0px;}.ko_Theme #headerContent:not(.koZeroPadding),.ko_Theme #subpageHeaderContent:not(.koZeroPadding){}.ko_Theme #headerMenu{/*overflow:auto;*//*display:flex;flex-direction: row;justify-content: space-between;align-items: center;*/padding:20px;margin:0px;border:0px solid var(--color1);border-radius:0px;;}.ko_Theme .logoHolder{padding:0px;;white-space: nowrap;}.ko_Theme .logoHolder .logoContents{font-size:24px;color:var(--color1_175);display: flex;align-items: center;min-height:60px;}@media (max-width: 768px){.ko_Theme .logoHolder .logoContents{font-size:22px;}}.ko_Theme .menuHolder .accents_start {margin-left:30px}.ko_Theme .logoHolder img{max-height:60px;height:60px;min-height:60px;}.ko_Theme .menuHolder { display: flex;}.ko_Theme .menuHolder li{}.ko_Theme .menuHolder li a{font-size:18px;color:rgb(42, 42, 42);padding:5px 0px 5px 0px;margin:0px 5px 0px 15px;border-radius:0px;border:0px solid transparent;text-transform:uppercase;transition:0.2s all;}.ko_Theme .menuHolder li.active a,.ko_Theme .menuHolder li a:hover{color:var(--color1_175);border-color:rgb(255, 255, 255);}.ko_Theme .menuHolder li.accent1 a,.ko_Theme .menuHolder li.accent1.active a{font-size:18px;color:rgb(247, 247, 247);background:var(--color1);padding:11px 15px 11px 15px;margin:0px 0px 0px 5px;border-radius:6px;border:0px solid ;}.ko_Theme .menuHolder li.accent1.active a,.ko_Theme .menuHolder li.accent1 a:hover{color:rgb(255, 255, 255);background:var(--color2);}.ko_Theme .menuHolder li.accent2 a,.ko_Theme .menuHolder li.accent2.active a{font-size:17px;color:var(--color1_175);background:var(--color1);padding:13px;margin:0px 0px 0px 10px;border-radius:5px;border:0px solid rgb(255, 255, 255);}.ko_Theme .menuHolder li.accent2.active a,.ko_Theme .menuHolder li.accent2 a:hover{color:rgb(0, 0, 0);background:rgb(255, 255, 255);}.ko_Theme .menuHolder li.topmenuSocial a{color:var(--color1_175)}/*CSS*b7380a1854039350158a2d12f4af28dc*/#websiteLoading{display:none!important}body{visibility:visible!important;overflow:auto!important}/*CSS*9b21e5e678fd2f4ca893c88722536549*/body{overflow:hidden} body.body{visibility:visible;overflow:auto} #websiteLoading{visibility:visible;position:fixed;top:0;left:0;right:0;bottom:0;transition:0.5s all;z-index:100000;background: linear-gradient(135deg, rgba(255,255,255,.95) 20%, rgba(255,255,255,.5), rgba(255,255,255,.95) 80%);cursor:wait} #websiteLoading.isLoading-1{background:#fff;} #websiteLoading.isLoaded{opacity:0;cursor:default;pointer-events:none} @-webkit-keyframes koLoadingRotation { to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes koLoadingRotation { to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } .isLoading .spinner { -webkit-animation: koLoadingRotation 1.5s linear infinite; animation: koLoadingRotation 1.5s linear infinite; /*will-change: transform;*/ } .isLoading .spinner .path { -webkit-animation: dash 1.5s ease-in-out infinite; animation: dash 1.5s ease-in-out infinite; } @-webkit-keyframes dash { 0% { stroke-dasharray: 1, 150; stroke-dashoffset: 0; stroke:var(--color1); } 50% { stroke-dasharray: 90, 150; stroke-dashoffset: -35; stroke:var(--color2); } 100% { stroke-dasharray: 90, 150; stroke-dashoffset: -124; stroke:var(--color1); } } @keyframes dash { 0% { stroke-dasharray: 1, 150; stroke-dashoffset: 0; stroke:var(--color1); } 50% { stroke-dasharray: 90, 150; stroke-dashoffset: -35; stroke:var(--color2); } 100% { stroke-dasharray: 90, 150; stroke-dashoffset: -124; stroke:var(--color1); } } #websiteLoading::after { content:""; background: #fff; border-radius:100%; box-shadow: 5px 5px 50px rgba(0,0,0,0.1); position: absolute; top: 50%; left: 50%; margin: -57px 0 0 -57px; width: 114px; height: 114px; }/*CSS*2bbc32090969fb828aecf3a71f707d32*/#map_canvas1 img, #map_canvas1sidebar img,
#map_canvas1 div, #map_canvassidebar div,
#footer #map_canvas1sidebar div,
#footer #map_canvas1 div {max-width: none;margin:0;padding:0;}/*CSS*4d33658e497aad29a83894936437501d*/.ContactForm.whiteShadowContainer > .form-group{display:none;}/*CSS*f493c01b64a8ca81e642ce25cddb0946*/.keditLayout_1 .kmapHolder{-webkit-filter: grayscale(100%);filter: grayscale(100%);}
.keditLayout_2 .kmapHolder{-webkit-filter: grayscale(100%) invert(100%);filter: grayscale(100%) invert(100%);}