/* ########################## */
/* Start Layout Styles */
/* ########################## */
html {
height:100%;
}
body {
height:100%;
width:100%;
padding:0;
margin:0;
overflow-x:hidden;
}
/* Container for All Sections */
.is-wrapper {width:100%;height:100%;box-sizing:border-box;margin:0 auto;max-width:100%;
-webkit-transition: all ease 0.5s;
-moz-transition: all ease 0.5s;
-ms-transition: all ease 0.5s;
-o-transition: all ease 0.5s;
transition: all ease 0.5s;
}
/* Sections */
.is-wrapper > div {
display:table;
width:100%;
height: auto;
float:left;
box-sizing:border-box;
margin:0;
padding:0;
position:relative;
background:#fff;
-webkit-transition: all ease 0.3s;
-moz-transition: all ease 0.3s;
-ms-transition: all ease 0.3s;
-o-transition: all ease 0.3s;
transition: all ease 0.3s;
}
/* Boxes */
.is-boxes { display:table; table-layout:fixed; width:100%; height:100%; position:relative; min-height:50px; float:left; }
.is-boxes-flex { display:flex; align-items: stretch;}
.is-boxes-flex .is-boxed-layout { height:auto; }
.is-boxes-flex .is-box-content,
.is-boxes-flex .is-container { height: 100%; }
.is-boxes-flex .is-box-centered {display: inline-flex;}
@media (max-width: 1000px) {
.is-boxes-flex .is-box {
display: block;
}
}
@media (max-width: 767px) {
.is-boxes-flex {
display: block;
}
//add some space around the box.
.is-wrapper .is-boxed-layout .is-container.is-content-380 {
max-width: 340px !important;
}
}
.is-box-0 { display:table-cell;width: 0%;height:100%;position:relative; }
.is-box-1 { display:table-cell;width: 8.333333%;height:100%;position:relative; }
.is-box-2 { display:table-cell;width: 16.666667%;height:100%;position:relative; }
.is-box-3 { display:table-cell;width: 25%;height:100%;position:relative; }
.is-box-4 { display:table-cell;width: 33.333333%;height:100%;position:relative; }
.is-box-5 { display:table-cell;width: 41.666667%;height:100%;position:relative; }
.is-box-6 { display:table-cell;width: 50%;height:100%;position:relative; }
.is-box-7 { display:table-cell;width: 58.333333%;height:100%;position:relative; }
.is-box-8 { display:table-cell;width: 66.666667%;height:100%;position:relative; }
.is-box-9 { display:table-cell;width: 75%;height:100%;position:relative; }
.is-box-10 { display:table-cell;width: 83.333333%;height:100%;position:relative; }
.is-box-11 { display:table-cell;width: 91.666667%;height:100%;position:relative; }
.is-box-12 { display:table-cell;width: 100%;height:100%;position:relative; }
.is-box-centered {display:table-cell;width: 100%;position:relative;vertical-align:middle;}
.is-boxes.is-section-width-380{ max-width:380px; float:none; margin-left:auto; margin-right:auto;}
.is-boxes.is-section-width-500{ max-width:500px; float:none; margin-left:auto; margin-right:auto;}
.is-boxes.is-section-width-640{ max-width:640px; float:none; margin-left:auto; margin-right:auto;}
.is-boxes.is-section-width-800{ max-width:800px; float:none; margin-left:auto; margin-right:auto;}
.is-boxes.is-section-width-980{ max-width:980px; float:none; margin-left:auto; margin-right:auto;}
.is-boxes.is-section-width-1050{ max-width:1050px; float:none; margin-left:auto; margin-right:auto;}
.is-boxes.is-section-width-1100{ max-width:1100px; float:none; margin-left:auto; margin-right:auto;}
.is-boxes.is-section-width-1200{ max-width:1200px; float:none; margin-left:auto; margin-right:auto;}
.is-stretch > div:not(.is-arrow-down) { /* Unlike .is-overlay (absolute positioned), this section is relative positioned. With this, flowing content is safe, and stretched content can be made absolute with class .flexi-position */
position:relative;left:0px;top:0px;width:100%;height:100%;display:table;
}
/*
.flexi-position is set relative by default, but will set absolute (stretched) if placed within section .is-stretch
*/
.flexi-position { position: relative; }
.is-stretch .flexi-position { position: absolute; }
.is-section.is-stretch {min-height:300px;} /* New */
@media all and (max-width: 960px) {
/* .is-section:not(.is-stretch), .is-section-100:not(.is-stretch) { height: auto !important; } is-stretch is an exception */
.is-section:not(.is-box) { height: auto !important; }
/* .is-boxes { height: auto !important; } */
.is-boxes { height: 100% !important; } /* new */
.is-box-img {height:300px !important;}
.is-box-img .is-boxes {height:100% !important;}
.is-box-1 { display:table;width: 100%;height:auto; }
.is-box-2 { display:table;width: 100%;height:auto; }
.is-box-3 { display:table;width: 100%;height:auto; }
.is-box-4 { display:table;width: 100%;height:auto; }
.is-box-5 { display:table;width: 100%;height:auto; }
.is-box-6 { display:table;width: 100%;height:auto; }
.is-box-7 { display:table;width: 100%;height:auto; }
.is-box-8 { display:table;width: 100%;height:auto; }
.is-box-9 { display:table;width: 100%;height:auto; }
.is-box-10 { display:table;width: 100%;height:auto; }
.is-box-11 { display:table;width: 100%;height:auto; }
.is-box-12 { display:table;width: 100%;height:auto; }
/* .is-box-centered {display:block;} */
.is-box-centered {display:table-cell;} /* new */
}
.is-container {
max-width:980px;margin:0 auto;padding:0 15px;
position:relative;margin-left:auto;margin-right:auto;box-sizing:border-box;
-webkit-transition: all ease 0.3s;
-moz-transition: all ease 0.3s;
-ms-transition: all ease 0.3s;
-o-transition: all ease 0.3s;
transition: all ease 0.3s;
}
@media all and (max-width: 960px) {
.is-container { padding: 0 15px; }
}
@media all and (max-width: 480px) {
.is-container { padding: 0 15px; }
}
.is-container .container-fluid,
.is-container.is-container-inner,
.container-fluid.is-container-inner{
padding-left:0px !important;
padding-right:0px !important;
}
/* Boxed Layout */
.is-wrapper .is-boxed-layout .is-container {padding:35px; background:#fff;} /* 80px */
@media all and (max-width: 1280px) {
.is-wrapper .is-boxed-layout .is-container { padding:20px; } /* 60px */
}
@media all and (max-width: 1024px) {
.is-wrapper .is-boxed-layout .is-container { padding:20px; }
.is-wrapper .is-boxed-layout .is-overlay {display:none !important;}
}
.is-wrapper .is-boxed-layout.is-thin-box-layout .is-container {padding:15px;padding-bottom:5px; background:#fff;}
/* Default Layout */
/* Middle */
.is-wrapper .is-box .is-container { margin-top:80px; margin-bottom:80px; }
/* No Margin Layout */
.is-wrapper .is-box .is-section-margin-0 .is-container { margin-bottom:0px; margin-top:0px; }
.is-wrapper .is-section-margin-0 .is-box-centered .is-container { margin-bottom:0px; margin-top:0px; }
.is-wrapper .is-box .is-section-margin-1 .is-container { margin-bottom:20px; margin-top:20px; }
.is-wrapper .is-section-margin-1 .is-box-centered .is-container { margin-bottom:20px; margin-top:20px; }
.is-wrapper .is-box .is-section-margin-2 .is-container { margin-bottom:40px; margin-top:40px; }
.is-wrapper .is-section-margin-2 .is-box-centered .is-container { margin-bottom:40px; margin-top:40px; }
.is-wrapper .is-box .is-section-margin-3 .is-container { margin-bottom:60px; margin-top:60px; }
.is-wrapper .is-section-margin-3 .is-box-centered .is-container { margin-bottom:60px; margin-top:60px; }
.is-wrapper .is-box .is-section-margin-4 .is-container { margin-bottom:80px; margin-top:80px; }
.is-wrapper .is-section-margin-4 .is-box-centered .is-container { margin-bottom:80px; margin-top:80px; }
@media all and (max-width: 1280px) {
.is-wrapper .is-box .is-container { margin-top:40px; margin-bottom:40px; }
.is-wrapper .is-box .is-section-margin-0 .is-container { margin-bottom:0px; margin-top:0px; }
.is-wrapper .is-section-margin-0 .is-box-centered .is-container { margin-bottom:0px; margin-top:0px; }
.is-wrapper .is-box .is-section-margin-1 .is-container { margin-bottom:10px; margin-top:10px; }
.is-wrapper .is-section-margin-1 .is-box-centered .is-container { margin-bottom:10px; margin-top:10px; }
.is-wrapper .is-box .is-section-margin-2 .is-container { margin-bottom:20px; margin-top:20px; }
.is-wrapper .is-section-margin-2 .is-box-centered .is-container { margin-bottom:20px; margin-top:20px; }
.is-wrapper .is-box .is-section-margin-3 .is-container { margin-bottom:30px; margin-top:30px; }
.is-wrapper .is-section-margin-3 .is-box-centered .is-container { margin-bottom:30px; margin-top:30px; }
.is-wrapper .is-box .is-section-margin-4 .is-container { margin-bottom:40px; margin-top:40px; }
.is-wrapper .is-section-margin-4 .is-box-centered .is-container { margin-bottom:40px; margin-top:40px; }
}
/* Margin on zig zag snippets */
.is-section-margin-1 .kol-paragraph-right .image-wrapper,
.is-section-margin-1 .kol-paragraph-left .image-wrapper {
margin-top: 20px;
margin-bottom: 20px;
}
.is-section-margin-2 .kol-paragraph-right .image-wrapper,
.is-section-margin-2 .kol-paragraph-left .image-wrapper {
margin-top: 30px;
margin-bottom: 30px;
}
.is-section-margin-3 .kol-paragraph-right .image-wrapper,
.is-section-margin-3 .kol-paragraph-left .image-wrapper {
margin-top: 40px;
margin-bottom: 40px;
}
.is-section-margin-4 .kol-paragraph-right .image-wrapper,
.is-section-margin-4 .kol-paragraph-left .image-wrapper {
margin-top: 50px;
margin-bottom: 50px;
}
@media (max-width: 767px) {
.is-section-margin-0 .kol-paragraph-right .text-wrapper,
.is-section-margin-0 .kol-paragraph-left .text-wrapper {
margin-top: 10px;
margin-bottom: 5px;
}
.is-section-margin-1 .kol-paragraph-right .text-wrapper,
.is-section-margin-1 .kol-paragraph-left .text-wrapper {
margin-top: 20px;
margin-bottom: 10px;
}
.is-section-margin-1 .kol-paragraph-right .image-wrapper,
.is-section-margin-1 .kol-paragraph-left .image-wrapper {
margin-top: 0;
}
.is-section-margin-2 .kol-paragraph-right .text-wrapper,
.is-section-margin-2 .kol-paragraph-left .text-wrapper {
margin-top: 30px;
margin-bottom: 10px;
}
.is-section-margin-2 .kol-paragraph-right .image-wrapper,
.is-section-margin-2 .kol-paragraph-left .image-wrapper {
margin-top: 0;
}
.is-section-margin-3 .kol-paragraph-right .text-wrapper,
.is-section-margin-3 .kol-paragraph-left .text-wrapper {
margin-top: 40px;
margin-bottom: 15px;
}
.is-section-margin-3 .kol-paragraph-right .image-wrapper,
.is-section-margin-3 .kol-paragraph-left .image-wrapper {
margin-top: 0px;
}
.is-section-margin-4 .kol-paragraph-right .text-wrapper,
.is-section-margin-4 .kol-paragraph-left .text-wrapper {
margin-top: 50px;
margin-bottom: 20px;
}
.is-section-margin-4 .kol-paragraph-right .image-wrapper,
.is-section-margin-4 .kol-paragraph-left .image-wrapper {
margin-top: 0px;
}
}
@media (min-width: 800px) {
.kol-paragraph-left .text-wrapper {
padding-left: 0;
padding-right: 30px;
}
}
@media (max-width: 767px) {
.kol-paragraph-left .img-wrapper-full .img-fullColumnWidth,
.kol-paragraph-right .img-wrapper-full .img-fullColumnWidth {
margin-right: -15px !important;
}
}
/* Scroll Down Icon */
.is-arrow-down { display: table; position:absolute;bottom:65px;width:50px;height:50px;left:50%;margin-left:-25px;cursor:pointer;z-index:2 }
@media all and (max-width: 1025px) {
.is-arrow-down { display:none !important; }
}
.is-arrow-down > a {
background: rgba(0, 0, 0, 0.18); border-radius: 500px;
color: rgba(255, 255, 255, 0.75);font-size: 22px; text-decoration:none;
text-align: center;
display: table-cell;
vertical-align: middle;}
.bounce {
-moz-animation: bounce 5s forwards;
-webkit-animation: bounce 5s forwards;
animation: bounce 5s forwards;
}
@-moz-keyframes bounce {
0%, 20%, 50%, 80%, 100% { -moz-transform: translateY(0); }
40% { -moz-transform: translateY(-30px); }
60% { -moz-transform: translateY(-15px); }
}
@-webkit-keyframes bounce {
0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); }
40% { -webkit-transform: translateY(-30px); }
60% { -webkit-transform: translateY(-15px); }
}
@keyframes bounce {
0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); }
40% { -webkit-transform: translateY(-30px); -moz-transform: translateY(-30px); -ms-transform: translateY(-30px); -o-transform: translateY(-30px); transform: translateY(-30px); }
60% { -webkit-transform: translateY(-15px); -moz-transform: translateY(-15px); -ms-transform: translateY(-15px); -o-transform: translateY(-15px); transform: translateY(-15px); }
}
.is-arrow-down.light a {
background: rgba(255, 255, 255, 0.18);color: #111;
}
/* Overlay */
.is-overlay {
position:absolute;
left:0px;
top:0px;
width:100%;
height:100%;
overflow:hidden;
}
/*.is-boxes, .is-box-centered {z-index:1}*/
.is-overlay .is-overlay-bg {
position:absolute;left:0px;top:0px;width:100%;height:100%;
background-size:cover;
background-repeat:no-repeat;
background-position:50% 60%;
}
.is-overlay .is-overlay-bg.is-scale-animated.is-appeared {
animation:is-scale 10s ease forwards;
-ms-animation:is-scale 10s ease forwards;
-webkit-animation:is-scale 10s ease forwards;
-o-animation:is-scale 10s ease forwards;
-moz-animation:is-scale 10s ease forwards;
}
@keyframes is-scale {
from {
transform: scale(1);
-ms-transform: scale(1);
-webkit-transform: scale(1);
-o-transform: scale(1);
-moz-transform: scale(1);
}
to {
transform: scale(1.2);
-ms-transform: scale(1.2);
-webkit-transform: scale(1.2);
-o-transform: scale(1.2);
-moz-transform: scale(1.2);
}
}
.is-overlay .is-overlay-color {
position:absolute;left:0px;top:0px;width:100%;height:100%;
background-color: rgb(0, 0, 0);opacity: 0.15;
}
.is-overlay .is-overlay-content {
position:absolute;left:0px;top:0px;width:100%;height:100%;
overflow:hidden;
}
/* Section & Content Styles */
/* Background Color */
.is-bg-grey {background-color:#eeeff0 !important}
.is-bg-dark {background-color:#111 !important}
.is-bg-light {background-color:#fff !important}
/* Text Color */
.is-light-text, .is-light-text h1, .is-light-text h2, .is-light-text h3, .is-light-text h4, .is-light-text h5, .is-light-text h6, .is-light-text p, .is-light-text li {
color: #fff;
}
.is-dark-text, .is-dark-text h1, .is-dark-text h2, .is-dark-text h3, .is-dark-text h4, .is-dark-text h5, .is-dark-text h6, .is-dark-text p, .is-dark-text li {
color: #111;
}
.is-dark-text .is-light-text * {color: #fff;}
.is-light-text .is-dark-text * {color: #000;}
/* Vertical Alignment */
.is-content-top {
vertical-align:top;
}
.is-content-bottom {
vertical-align:bottom
}
/* Horizontal Alignment */
.is-container.is-content-left {
margin-left:100px;
}
.is-container.is-content-right {
margin-right:100px;
}
@media all and (max-width: 1200px) {
.is-container.is-content-left {
margin-left:60px
}
.is-container.is-content-right {
margin-right:60px;
}
}
@media all and (max-width: 960px) {
.is-container.is-content-left {
margin-left:auto;
}
.is-container.is-content-right {
margin-right:auto;
}
}
.is-box-5 .is-content-left, .is-box-4 .is-content-left, .is-box-3 .is-content-left, .is-box-2 .is-content-left, .is-box-1 .is-content-left {
margin-left:auto
}
.is-box-5 .is-content-right, .is-box-4 .is-content-right, .is-box-3 .is-content-right, .is-box-2 .is-content-right, .is-box-1 .is-content-right {
margin-right:auto;
}
/* Edge Spacing */
.is-wrapper .is-box .is-content-top.edge-y--5 .is-container { margin-top:-200px; }
.is-wrapper .is-box .is-content-bottom.edge-y--5 .is-container { margin-bottom:-200px; }
.is-wrapper .is-box .is-content-top.edge-y--4 .is-container { margin-top:-160px; }
.is-wrapper .is-box .is-content-bottom.edge-y--4 .is-container { margin-bottom:-160px; }
.is-wrapper .is-box .is-content-top.edge-y--3 .is-container { margin-top:-120px; }
.is-wrapper .is-box .is-content-bottom.edge-y--3 .is-container { margin-bottom:-120px; }
.is-wrapper .is-box .is-content-top.edge-y--2 .is-container { margin-top:-80px; }
.is-wrapper .is-box .is-content-bottom.edge-y--2 .is-container { margin-bottom:-80px; }
.is-wrapper .is-box .is-content-top.edge-y--1 .is-container { margin-top:-40px; }
.is-wrapper .is-box .is-content-bottom.edge-y--1 .is-container { margin-bottom:-40px; }
.is-wrapper .is-box .is-content-top.edge-y-0 .is-container { margin-top:0; }
.is-wrapper .is-box .is-content-bottom.edge-y-0 .is-container { margin-bottom:0; }
.is-wrapper .is-box .is-content-top.edge-y-1 .is-container { margin-top:40px; }
.is-wrapper .is-box .is-content-bottom.edge-y-1 .is-container { margin-bottom:40px; }
.is-wrapper .is-box .is-content-top.edge-y-2 .is-container { margin-top:80px; }
.is-wrapper .is-box .is-content-bottom.edge-y-2 .is-container { margin-bottom:80px; }
.is-wrapper .is-box .is-content-top.edge-y-3 .is-container { margin-top:120px; }
.is-wrapper .is-box .is-content-bottom.edge-y-3 .is-container { margin-bottom:120px; }
.is-wrapper .is-box .is-content-top.edge-y-4 .is-container { margin-top:160px; }
.is-wrapper .is-box .is-content-bottom.edge-y-4 .is-container { margin-bottom:160px; }
.is-wrapper .is-box .is-content-top.edge-y-5 .is-container { margin-top:200px; }
.is-wrapper .is-box .is-content-bottom.edge-y-5 .is-container { margin-bottom:200px; }
@media all and (max-width: 960px) {
.is-wrapper .is-box .is-content-top.edge-y--5 .is-container { margin-top:-200px; }
.is-wrapper .is-box .is-content-bottom.edge-y--5 .is-container { margin-bottom:-200px; }
.is-wrapper .is-box .is-content-top.edge-y--4 .is-container { margin-top:-160px; }
.is-wrapper .is-box .is-content-bottom.edge-y--4 .is-container { margin-bottom:-160px; }
.is-wrapper .is-box .is-content-top.edge-y--3 .is-container { margin-top:-120px; }
.is-wrapper .is-box .is-content-bottom.edge-y--3 .is-container { margin-bottom:-120px; }
.is-wrapper .is-box .is-content-top.edge-y--2 .is-container { margin-top:-80px; }
.is-wrapper .is-box .is-content-bottom.edge-y--2 .is-container { margin-bottom:-80px; }
.is-wrapper .is-box .is-content-top.edge-y--1 .is-container { margin-top:-20px; }
.is-wrapper .is-box .is-content-bottom.edge-y--1 .is-container { margin-bottom:-40px; }
.is-wrapper .is-box .is-content-top.edge-y-1 .is-container { margin-top:40px; } /* old: 0px */
.is-wrapper .is-box .is-content-bottom.edge-y-1 .is-container { margin-bottom:40px; }
.is-wrapper .is-box .is-content-top.edge-y-2 .is-container { margin-top:40px; }
.is-wrapper .is-box .is-content-bottom.edge-y-2 .is-container { margin-bottom:40px; }
.is-wrapper .is-box .is-content-top.edge-y-3 .is-container { margin-top:40px; }
.is-wrapper .is-box .is-content-bottom.edge-y-3 .is-container { margin-bottom:40px; }
.is-wrapper .is-box .is-content-top.edge-y-4 .is-container { margin-top:40px; }
.is-wrapper .is-box .is-content-bottom.edge-y-4 .is-container { margin-bottom:40px; }
.is-wrapper .is-box .is-content-top.edge-y-5 .is-container { margin-top:40px; }
.is-wrapper .is-box .is-content-bottom.edge-y-5 .is-container { margin-bottom:40px; } /* old: 0px */
}
.is-content-left.edge-x-0 { margin-left:0 }
.is-content-right.edge-x-0 { margin-right:0 }
.is-content-left.edge-x-1 { margin-left:40px }
.is-content-right.edge-x-1 { margin-right:40px }
.is-content-left.edge-x-2 { margin-left:80px }
.is-content-right.edge-x-2 { margin-right:80px }
.is-content-left.edge-x-3 { margin-left:120px }
.is-content-right.edge-x-3 { margin-right:120px }
.is-content-left.edge-x-4 { margin-left:160px }
.is-content-right.edge-x-4 { margin-right:160px }
.is-content-left.edge-x-5 { margin-left:200px }
.is-content-right.edge-x-5 { margin-right:200px }
@media all and (max-width: 960px) {
.is-content-left.edge-x-1 { margin-left:auto }
.is-content-right.edge-x-1 { margin-right:auto }
.is-content-left.edge-x-2 { margin-left:auto }
.is-content-right.edge-x-2 { margin-right:auto }
.is-content-left.edge-x-3 { margin-left:auto }
.is-content-right.edge-x-3 { margin-right:auto }
.is-content-left.edge-x-4 { margin-left:auto }
.is-content-right.edge-x-4 { margin-right:auto }
.is-content-left.edge-x-5 { margin-left:auto }
.is-content-right.edge-x-5 { margin-right:auto }
}
/* Bootstrap 5ths - Used in Reward Level Tracker */
.col-xs-5ths,
.col-sm-5ths,
.col-md-5ths,
.col-lg-5ths {
position: relative;
min-height: 1px;
padding-right: 10px;
padding-left: 10px;
}
.col-xs-5ths {
width: 20% !important;
float: left !important;
}
@media (min-width: 768px) {
.col-sm-5ths {
width: 19% !important;
float: left !important;
}
}
@media (min-width: 992px) {
.col-md-5ths {
width: 19% !important;
float: left !important;
}
}
@media (min-width: 1200px) {
.col-lg-5ths {
width: 19% !important;
float: left !important;
}
}
/* Push and Pull Columns */
@media (min-width: 768px) {
.is-box-1.kol-first-col-on-desktop,
.col-md-1.kol-first-col-on-desktop,
.col-sm-1.kol-first-col-on-desktop {
right: 91.66666667%;
}
.is-box-11.kol-last-col-on-desktop,
.col-md-11.kol-last-col-on-desktop,
.col-sm-11.kol-last-col-on-desktop {
left: 8.33333333%;
}
.is-box-2.kol-first-col-on-desktop,
.col-md-2.kol-first-col-on-desktop,
.col-sm-2.kol-first-col-on-desktop {
right: 83.33333333%;
}
.is-box-10.kol-last-col-on-desktop,
.col-md-10.kol-last-col-on-desktop,
.col-sm-10.kol-last-col-on-desktop {
left: 16.66666667%;
}
.is-box-3.kol-first-col-on-desktop,
.col-md-3.kol-first-col-on-desktop,
.col-sm-3.kol-first-col-on-desktop {
right: 75%;
}
.is-box-9.kol-last-col-on-desktop,
.col-md-9.kol-last-col-on-desktop,
.col-sm-9.kol-last-col-on-desktop {
left: 25%;
}
.is-box-4.kol-first-col-on-desktop,
.col-md-4.kol-first-col-on-desktop,
.col-sm-4.kol-first-col-on-desktop {
right: 66.66666667%;
}
.is-box-8.kol-last-col-on-desktop,
.col-md-8.kol-last-col-on-desktop,
.col-sm-8.kol-last-col-on-desktop {
left: 33.33333333%;
}
.is-box-5.kol-first-col-on-desktop,
.col-md-5.kol-first-col-on-desktop,
.col-sm-5.kol-first-col-on-desktop {
right: 58.33333333%;
}
.is-box-7.kol-last-col-on-desktop,
.col-md-7.kol-last-col-on-desktop,
.col-sm-7.kol-last-col-on-desktop {
left: 41.66666667%;
}
.is-box-6.kol-first-col-on-desktop,
.col-md-6.kol-first-col-on-desktop,
.col-sm-6.kol-first-col-on-desktop {
right: 50%;
}
.is-box-6.kol-last-col-on-desktop,
.col-md-6.kol-last-col-on-desktop,
.col-sm-6.kol-last-col-on-desktop {
left: 50%;
}
.is-box-6.kol-first-col-on-desktop,
.col-md-7.kol-first-col-on-desktop,
.col-sm-7.kol-first-col-on-desktop {
right: 41.66666667%;
}
.is-box-5.kol-last-col-on-desktop,
.col-md-5.kol-last-col-on-desktop,
.col-sm-5.kol-last-col-on-desktop {
left: 58.33333333%;
}
.is-box-8.kol-first-col-on-desktop,
.col-md-8.kol-first-col-on-desktop,
.col-sm-8.kol-first-col-on-desktop {
right: 33.33333333%;
}
.is-box-4.kol-last-col-on-desktop,
.col-md-4.kol-last-col-on-desktop,
.col-sm-4.kol-last-col-on-desktop {
left: 66.66666667%;
}
.is-box-9.kol-first-col-on-desktop,
.col-md-9.kol-first-col-on-desktop,
.col-sm-9.kol-first-col-on-desktop {
right: 25%;
}
.is-box-3.kol-last-col-on-desktop,
.col-md-3.kol-last-col-on-desktop,
.col-sm-3.kol-last-col-on-desktop {
left: 75%;
}
.is-box-10.kol-first-col-on-desktop,
.col-md-10.kol-first-col-on-desktop,
.col-sm-10.kol-first-col-on-desktop {
right: 16.66666667%;
}
.is-box-2.kol-last-col-on-desktop,
.col-md-2.kol-last-col-on-desktop,
.col-sm-2.kol-last-col-on-desktop {
left: 83.33333333%;
}
.is-box-11.kol-first-col-on-desktop,
.col-md-11.kol-first-col-on-desktop,
.col-sm-11.kol-first-col-on-desktop {
right: 8.33333333%;
}
.is-box-1.kol-last-col-on-desktop,
.col-md-1.kol-last-col-on-desktop,
.col-sm-1.kol-last-col-on-desktop {
left: 91.66666667%;
}
}
/* Text Alignment */
.is-align-right {
text-align:right;
}
.is-align-center {
text-align:center;
}
.is-align-center .kol-checkbox label{
text-align: left;
}
.is-align-left {
text-align:left;
}
/* Content Alignment with Align Propertiest */
.is-align-center th{
text-align: center;
}
.is-align-right th{
text-align: right;
}
.is-align-left [class*="-offset-"]{
margin-left:0px !important
}
.is-align-right [class*="-offset-"]{
float: right !important
}
/* Content Size */
.is-content-380 {
max-width: 380px !important;
}
.is-content-500 {
max-width: 500px !important;
}
.is-content-640 {
max-width: 640px !important;
}
.is-content-800 {
max-width: 800px !important;
}
.is-content-970 {
max-width: 970px !important;
}
.is-content-980 {
max-width: 980px !important;
}
.is-content-1050 {
max-width: 1050px !important;
}
.is-content-1100 {
max-width: 1100px !important;
}
.is-content-1200 {
max-width: 1200px !important;
}
.is-content-0 {
max-width: 10000px !important;
}
/* Section Height */
.is-wrapper > div.is-section-20 {
height: 20%;
}
.is-wrapper > div.is-section-30 {
height: 30%;
}
.is-wrapper > div.is-section-40 {
height: 40%;
}
.is-wrapper > div.is-section-50 {
height: 50%;
}
.is-wrapper > div.is-section-60 {
height: 60%;
}
.is-wrapper > div.is-section-75 {
height: 75%;
}
.is-wrapper > div.is-section-100 {
height: 100%;
}
.is-wrapper > div.is-section-auto {
height: auto;
}
/* Others */
.is-shadow-1 { /* for section */
-webkit-box-shadow: 0 0 9px rgba(0, 0, 0, 0.07);
-moz-box-shadow: 0 0 9px rgba(0, 0, 0, 0.07);
box-shadow: 0 0 9px rgba(0, 0, 0, 0.07);
}
.is-lightbox img {cursor:pointer;
-webkit-transition: all ease 0.5s;
-moz-transition: all ease 0.5s;
-ms-transition: all ease 0.5s;
-o-transition: all ease 0.5s;
transition: all ease 0.5s;
}
.is-lightbox img:hover {opacity:0.8}
.is-hidden {display:none !important;}
/* Override File */
.is-wrapper > div {
background: inherit;
}
/* ########################## */
/* End Layout Styles */
/* ########################## */
/* #################################### */
/* Default Responisve Font Styles */
/* #################################### */
body {
color: #333;
font-weight: 400;
font-size: 1.22em;
line-height: 1.5;
}
/* Align 'Design' button relative to section */
.kol-editable-section, .kol-hideable-section {
position: relative;
}
h1 {
font-size: 2.5em;
line-height: 1.3;
}
h2 {
font-size: 2.15em;
line-height: 1.3;
}
h3 {
font-size: 2em;
line-height: 1.4;
}
h4 {
font-size: 1.7em;
line-height: 1.5;
}
h5 {
font-size: 1.3em;
text-transform: uppercase;
line-height: 1.6;
letter-spacing: 1px;
}
h6 {
font-size: 1.1em;
text-transform: uppercase;
letter-spacing: 1px;
line-height: 1.4;
}
blockquote {
border-left: 5px solid #eee !important;
color: inherit !important;
line-height: 1.5;
}
h1, .h1, h2, .h2, h3, .h3{
margin-top: 0px;
}
p, ol li, ul li {
font-size: 1.22em;
line-height: 1.5;
}
[data-kol-editor="froala"] p:last-of-type {
margin-bottom: 0px;
}
@media (max-width: 414px) {
h1 {
font-size: 2.3em;
}
h2 {
font-size: 2em;
}
h3 {
font-size: 1.8em;
}
h4 {
font-size: 1.6em;
line-height: 1.5;
}
blockquote {
font-size: 1.3em;
line-height: 1.5;
}
}
/* ###################################### */
/* Assigned Font Sizes - Responsive */
/* ###################################### */
.font-9-px{
font-size:9px !important;
}
.font-10-px{
font-size:10px !important;
}
.font-11-px{
font-size:11px !important;
}
.font-12-px{
font-size:12px !important;
}
.font-13-px{
font-size:13px !important;
}
.font-14-px{
font-size:14px !important;
}
.font-15-px{
font-size:15px !important;
}
.font-16-px{
font-size:16px !important;
}
.font-17-px{
font-size:17px !important;
}
.font-18-px{
font-size:18px !important;
}
.font-19-px{
font-size:19px !important;
}
.font-20-px{
font-size:20px !important;
}
.font-21-px{
font-size:21px !important;
}
.font-22-px{
font-size:22px !important;
}
.font-23-px{
font-size:23px !important;
}
.font-24-px{
font-size:24px !important;
line-height: 1.4;
}
.font-26-px{
font-size:26px !important;
}
.font-30-px{
font-size:30px !important;
line-height: 1.3;
}
.font-33-px{
font-size:33px !important;
}
.font-36-px{
font-size:36px !important;
line-height: 1.2;
}
.font-40-px{
font-size:40px !important;
line-height: 1.2;
}
.font-48-px{
font-size:48px !important;
line-height: 1.2;
}
.font-60-px{
font-size:60px !important;
line-height: 1.1;
}
.font-72-px{
font-size:72px !important;
line-height: 1.1;
}
.font-96-px{
font-size:96px !important;
line-height: 1;
}
@media (max-width: 768px) {
.font-9-px{
font-size:9px !important;
}
.font-10-px{
font-size:10px !important;
}
.font-11-px{
font-size:11px !important;
}
.font-12-px{
font-size:12px !important;
}
.font-13-px{
font-size:13px !important;
}
.font-14-px{
font-size:14px !important;
}
.font-15-px{
font-size:15px !important;
}
.font-16-px{
font-size:16px !important;
}
.font-17-px{
font-size:17px !important;
}
.font-18-px{
font-size:18px !important;
}
.font-19-px{
font-size:19px !important;
}
.font-20-px{
font-size:20px !important;
}
.font-21-px{
font-size:20px !important;
}
.font-22-px{
font-size:21px !important;
}
.font-23-px{
font-size:21px !important;
}
.font-24-px{
font-size:22px !important;
}
.font-26-px{
font-size:24px !important;
}
.font-30-px{
font-size:27px !important;
}
.font-33-px{
font-size:30px !important;
}
.font-36-px{
font-size:32px !important;
}
.font-40-px{
font-size:36px !important;
}
.font-48-px{
font-size:42px !important;
}
.font-60-px{
font-size:52px !important;
}
.font-72-px{
font-size:58px !important;
}
.font-96-px{
font-size:80px !important;
}
}
/* ####################### */
/* Fluid Font Styles */
/* ####################### */
/* Custom Properties */
:root {
/* Breakpoint variables */
--bp-small: 15;
--bp-large: 20;
--bp-xlarge: 100;
/* General Font Size Variables */
--h1-font-size-min: 2.2;
--h1-font-size-max: 4;
--h2-font-size-min: 2;
--h2-font-size-max: 3.3;
--h3-font-size-min: 1.8;
--h3-font-size-max: 2.8;
--h4-font-size-min: 1.4;
--h4-font-size-max: 2.3;
--h5-font-size-min: 1.1;
--h5-font-size-max: 1.8;
--h6-font-size-min: .9;
--h6-font-size-max: 1.3;
--blockquote-font-size-min: 1;
--blockquote-font-size-max: 1.6;
--text-font-size-min: 1.2;
--text-font-size-max: 1.5;
/* Assigned Font Size Variables */
--font-9px-min: .575;
--font-9px-max: .65;
--font-10px-min: .625;
--font-10px-max: .7;
--font-11px-min: .675;
--font-11px-max: .75;
--font-12px-min: .725;
--font-12px-max: .8;
--font-13px-min: .775;
--font-13px-max: .85;
--font-14px-min: .825;
--font-14px-max: .9;
--font-15px-min: .875;
--font-15px-max: .95;
--font-16px-min: .925;
--font-16px-max: 1;
--font-17px-min: .975;
--font-17px-max: 1.05;
--font-18px-min: 1.025;
--font-18px-max: 1.1;
--font-19px-min: 1.075;
--font-19px-max: 1.15;
--font-20px-min: 1.125;
--font-20px-max: 1.2;
--font-21px-min: 1.175;
--font-21px-max: 1.25;
--font-22px-min: 1.225;
--font-22px-max: 1.3;
--font-23px-min: 1.275;
--font-23px-max: 1.35;
--font-24px-min: 1.325;
--font-24px-max: 1.4;
--font-25px-min: 1.375;
--font-25px-max: 1.45;
--font-26px-min: 1.425;
--font-26px-max: 1.5;
--font-27px-min: 1.475;
--font-27px-max: 1.55;
--font-28px-min: 1.525;
--font-28px-max: 1.6;
--font-29px-min: 1.575;
--font-29px-max: 1.65;
--font-30px-min: 1.625;
--font-30px-max: 1.7;
--font-31px-min: 1.675;
--font-31px-max: 1.75;
--font-32px-min: 1.725;
--font-32px-max: 1.8;
--font-33px-min: 1.775;
--font-33px-max: 1.85;
--font-34px-min: 1.825;
--font-34px-max: 1.9;
--font-35px-min: 1.875;
--font-35px-max: 1.95;
--font-36px-min: 1.925;
--font-36px-max: 2;
--font-37px-min: 1.975;
--font-37px-max: 2.05;
--font-38px-min: 2.025;
--font-38px-max: 2.1;
--font-39px-min: 2.075;
--font-39px-max: 2.15;
--font-40px-min: 2.125;
--font-40px-max: 2.2;
--font-44px-min: 2.325;
--font-44px-max: 2.4;
--font-48px-min: 2.525;
--font-48px-max: 2.6;
--font-52px-min: 2.725;
--font-52px-max: 2.8;
--font-56px-min: 2.925;
--font-56px-max: 3;
--font-60px-min: 3.125;
--font-60px-max: 3.2;
--font-64px-min: 3.325;
--font-64px-max: 3.4;
--font-68px-min: 3.525;
--font-68px-max: 3.6;
--font-72px-min: 3.725;
--font-72px-max: 3.8;
--font-76px-min: 3.925;
--font-76px-max: 4;
--font-80px-min: 4.075;
--font-80px-max: 4.2;
--font-84px-min: 4.125;
--font-84px-max: 4.4;
--font-88px-min: 4.275;
--font-88px-max: 4.6;
--font-92px-min: 4.325;
--font-92px-max: 4.8;
--font-96px-min: 4.475;
--font-96px-max: 5;
--font-100px-min: 4.525;
--font-100px-max: 5.2;
--font-104px-min: 4.675;
--font-104px-max: 5.4;
--font-108px-min: 4.725;
--font-108px-max: 5.6;
--font-112px-min: 4.875;
--font-112px-max: 5.8;
--font-116px-min: 4.925;
--font-116px-max: 6;
--font-120px-min: 5.025;
--font-120px-max: 6.2;
--font-124px-min: 5.125;
--font-124px-max: 6.4;
--font-128px-min: 5.225;
--font-128px-max: 6.6;
--font-132px-min: 5.325;
--font-132px-max: 6.8;
--font-136px-min: 5.425;
--font-136px-max: 7;
--font-140px-min: 5.525;
--font-140px-max: 7.2;
--font-144px-min: 5.625;
--font-144px-max: 7.4;
--font-148px-min: 5.725;
--font-148px-max: 7.6;
}
/* General Fonts */
h1 {
font-size: calc(( var(--h1-font-size-min) * 16px ) + ( var(--h1-font-size-max) - var(--h1-font-size-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) )));
}
h2 {
font-size: calc(( var(--h2-font-size-min) * 16px ) + ( var(--h2-font-size-max) - var(--h2-font-size-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) )));
}
h3 {
font-size: calc(( var(--h3-font-size-min) * 16px ) + ( var(--h3-font-size-max) - var(--h3-font-size-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) )));
}
h4 {
font-size: calc(( var(--h4-font-size-min) * 16px ) + ( var(--h4-font-size-max) - var(--h4-font-size-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) )));
}
h5 {
font-size: calc(( var(--h5-font-size-min) * 16px ) + ( var(--h5-font-size-max) - var(--h5-font-size-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) )));
text-transform: uppercase;
letter-spacing: 1px;
}
h6 {
font-size: calc(( var(--h6-font-size-min) * 16px ) + ( var(--h6-font-size-max) - var(--h6-font-size-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) )));
text-transform: uppercase;
letter-spacing: 1px;
}
blockquote {
border-left: 5px solid #eee !important;
color: inherit !important;
font-size: calc(( var(--blockquote-font-size-min) * 12px ) + ( var(--blockquote-font-size-max) - var(--blockquote-font-size-min) ) * ((100vw - ( var(--bp-large) * 12px )) / ( var(--bp-xlarge) - var(--bp-large) )));
}
p, ol li, ul li {
font-size: calc(( var(--text-font-size-min) * 12px ) + ( var(--text-font-size-max) - var(--text-font-size-min) ) * ((100vw - ( var(--bp-large) * 12px )) / ( var(--bp-xlarge) - var(--bp-large) )));
}
/* Stop font size from growing continuously */
@media (min-width: 1200px) {
h1 {
font-size: calc( var(--h1-font-size-max) * 12px);
}
h2 {
font-size: calc( var(--h2-font-size-max) * 12px);
}
h3 {
font-size: calc( var(--h3-font-size-max) * 12px);
}
h4 {
font-size: calc( var(--h4-font-size-max) * 12px);
}
h5 {
font-size: calc( var(--h5-font-size-max) * 12px);
}
h6 {
font-size: calc( var(--h6-font-size-max) * 12px);
}
blockquote {
font-size: calc( var(--blockquote-font-size-max) * 12px);
}
p, ol li, ul li {
font-size: calc( var(--text-font-size-max) * 12px);
}
}
/* ################################# */
/* Assigned Font Sizes - Fluid */
/* ################################# */
span[style*="font-size: 9px"], .font-9-px {
font-size: 9px !important;
font-size: calc(( var(--font-9px-min) * 16px ) + ( var(--font-9px-max) - var(--font-9px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 10px"], .font-10-px {
font-size: 10px !important;
font-size: calc(( var(--font-10px-min) * 16px ) + ( var(--font-10px-max) - var(--font-10px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 11px"], .font-11-px {
font-size: 11px !important;
font-size: calc(( var(--font-11px-min) * 16px ) + ( var(--font-11px-max) - var(--font-11px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 12px"], .font-12-px {
font-size: 12px !important;
font-size: calc(( var(--font-12px-min) * 16px ) + ( var(--font-12px-max) - var(--font-12px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 13px"], .font-13-px {
font-size: 13px !important;
font-size: calc(( var(--font-13px-min) * 16px ) + ( var(--font-13px-max) - var(--font-13px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 14px"], .font-14-px {
font-size: 14px !important;
font-size: calc(( var(--font-14px-min) * 16px ) + ( var(--font-14px-max) - var(--font-14px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 15px"], .font-15-px {
font-size: 15px !important;
font-size: calc(( var(--font-15px-min) * 16px ) + ( var(--font-15px-max) - var(--font-15px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 16px"], .font-16-px {
font-size: 16px !important;
font-size: calc(( var(--font-16px-min) * 16px ) + ( var(--font-16px-max) - var(--font-16px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 17px"], .font-17-px {
font-size: 17px !important;
font-size: calc(( var(--font-17px-min) * 16px ) + ( var(--font-17px-max) - var(--font-17px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 18px"], .font-18-px {
font-size: 18px !important;
font-size: calc(( var(--font-18px-min) * 16px ) + ( var(--font-18px-max) - var(--font-18px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 19px"], .font-19-px {
font-size: 19px !important;
font-size: calc(( var(--font-19px-min) * 16px ) + ( var(--font-19px-max) - var(--font-19px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 20px"], .font-20-px {
font-size: 20px !important;
font-size: calc(( var(--font-20px-min) * 16px ) + ( var(--font-20px-max) - var(--font-20px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 21px"], .font-21-px {
font-size: 21px !important;
font-size: calc(( var(--font-21px-min) * 16px ) + ( var(--font-21px-max) - var(--font-21px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 22px"], .font-22-px {
font-size: 22px !important;
font-size: calc(( var(--font-22px-min) * 16px ) + ( var(--font-22px-max) - var(--font-22px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 23px"], .font-23-px {
font-size: 23px !important;
font-size: calc(( var(--font-23px-min) * 16px ) + ( var(--font-23px-max) - var(--font-23px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 24px"], .font-24-px {
font-size: 24px !important;
font-size: calc(( var(--font-24px-min) * 16px ) + ( var(--font-24px-max) - var(--font-24px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 25px"]{
font-size: 25px !important;
font-size: calc(( var(--font-25px-min) * 16px ) + ( var(--font-25px-max) - var(--font-25px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 26px"], .font-26-px {
font-size: 26px !important;
font-size: calc(( var(--font-26px-min) * 16px ) + ( var(--font-26px-max) - var(--font-26px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 27px"]{
font-size: 27px !important;
font-size: calc(( var(--font-27px-min) * 16px ) + ( var(--font-27px-max) - var(--font-27px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 28px"]{
font-size: 28px !important;
font-size: calc(( var(--font-28px-min) * 16px ) + ( var(--font-28px-max) - var(--font-28px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 29px"]{
font-size: 29px !important;
font-size: calc(( var(--font-29px-min) * 16px ) + ( var(--font-29px-max) - var(--font-29px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 30px"], .font-30-px {
font-size: 30px !important;
font-size: calc(( var(--font-30px-min) * 16px ) + ( var(--font-30px-max) - var(--font-30px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 31px"]{
font-size: 31px !important;
font-size: calc(( var(--font-31px-min) * 16px ) + ( var(--font-31px-max) - var(--font-31px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 32px"]{
font-size: 32px !important;
font-size: calc(( var(--font-32px-min) * 16px ) + ( var(--font-32px-max) - var(--font-32px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 33px"], .font-33-px {
font-size: 33px !important;
font-size: calc(( var(--font-33px-min) * 16px ) + ( var(--font-33px-max) - var(--font-33px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 34px"]{
font-size: 34px !important;
font-size: calc(( var(--font-34px-min) * 16px ) + ( var(--font-34px-max) - var(--font-34px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 35px"]{
font-size: 35px !important;
font-size: calc(( var(--font-35px-min) * 16px ) + ( var(--font-35px-max) - var(--font-35px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 36px"], .font-36-px {
font-size: 36px !important;
font-size: calc(( var(--font-36px-min) * 16px ) + ( var(--font-36px-max) - var(--font-36px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 37px"]{
font-size: 37px !important;
font-size: calc(( var(--font-37px-min) * 16px ) + ( var(--font-37px-max) - var(--font-37px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 38px"]{
font-size: 38px !important;
font-size: calc(( var(--font-38px-min) * 16px ) + ( var(--font-38px-max) - var(--font-38px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 39px"]{
font-size: 39px !important;
font-size: calc(( var(--font-39px-min) * 16px ) + ( var(--font-39px-max) - var(--font-39px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 40px"], .font-40-px {
font-size: 40px !important;
font-size: calc(( var(--font-40px-min) * 16px ) + ( var(--font-40px-max) - var(--font-40px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 44px"]{
font-size: 44px !important;
font-size: calc(( var(--font-44px-min) * 16px ) + ( var(--font-44px-max) - var(--font-44px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 48px"], .font-48-px {
font-size: 48px !important;
font-size: calc(( var(--font-48px-min) * 16px ) + ( var(--font-48px-max) - var(--font-48px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 52px"]{
font-size: 52px !important;
font-size: calc(( var(--font-52px-min) * 16px ) + ( var(--font-52px-max) - var(--font-52px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 56px"]{
font-size: 56px !important;
font-size: calc(( var(--font-56px-min) * 16px ) + ( var(--font-56px-max) - var(--font-56px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 60px"], .font-60-px {
font-size: 60px !important;
font-size: calc(( var(--font-60px-min) * 16px ) + ( var(--font-60px-max) - var(--font-60px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 64px"]{
font-size: 64px !important;
font-size: calc(( var(--font-64px-min) * 16px ) + ( var(--font-64px-max) - var(--font-64px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 68px"]{
font-size: 68px !important;
font-size: calc(( var(--font-68px-min) * 16px ) + ( var(--font-68px-max) - var(--font-68px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 72px"], .font-72-px {
font-size: 72px !important;
font-size: calc(( var(--font-72px-min) * 16px ) + ( var(--font-72px-max) - var(--font-72px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 76px"]{
font-size: 76px !important;
font-size: calc(( var(--font-76px-min) * 16px ) + ( var(--font-76px-max) - var(--font-76px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 80px"]{
font-size: 80px !important;
font-size: calc(( var(--font-80px-min) * 16px ) + ( var(--font-80px-max) - var(--font-80px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 84px"]{
font-size: 84px !important;
font-size: calc(( var(--font-84px-min) * 16px ) + ( var(--font-84px-max) - var(--font-84px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 88px"]{
font-size: 88px !important;
font-size: calc(( var(--font-88px-min) * 16px ) + ( var(--font-88px-max) - var(--font-88px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 92px"]{
font-size: 92px !important;
font-size: calc(( var(--font-92px-min) * 16px ) + ( var(--font-92px-max) - var(--font-92px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 96px"], .font-96-px {
font-size: 96px !important;
font-size: calc(( var(--font-96px-min) * 16px ) + ( var(--font-96px-max) - var(--font-96px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 100px"]{
font-size: 100px !important;
font-size: calc(( var(--font-100px-min) * 16px ) + ( var(--font-100px-max) - var(--font-100px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 104px"]{
font-size: 104px !important;
font-size: calc(( var(--font-104px-min) * 16px ) + ( var(--font-104px-max) - var(--font-104px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 108px"]{
font-size: 108px !important;
font-size: calc(( var(--font-108px-min) * 16px ) + ( var(--font-108px-max) - var(--font-108px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 112px"]{
font-size: 112px !important;
font-size: calc(( var(--font-112px-min) * 16px ) + ( var(--font-112px-max) - var(--font-112px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 116px"]{
font-size: 116px !important;
font-size: calc(( var(--font-116px-min) * 16px ) + ( var(--font-116px-max) - var(--font-116px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 120px"]{
font-size: 120px !important;
font-size: calc(( var(--font-120px-min) * 16px ) + ( var(--font-120px-max) - var(--font-120px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 124px"]{
font-size: 124px !important;
font-size: calc(( var(--font-124px-min) * 16px ) + ( var(--font-124px-max) - var(--font-124px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 128px"]{
font-size: 128px !important;
font-size: calc(( var(--font-128px-min) * 16px ) + ( var(--font-128px-max) - var(--font-128px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 132px"]{
font-size: 132px !important;
font-size: calc(( var(--font-132px-min) * 16px ) + ( var(--font-132px-max) - var(--font-132px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 136px"]{
font-size: 136px !important;
font-size: calc(( var(--font-136px-min) * 16px ) + ( var(--font-136px-max) - var(--font-136px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 140px"]{
font-size: 140px !important;
font-size: calc(( var(--font-140px-min) * 16px ) + ( var(--font-140px-max) - var(--font-140px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 144px"]{
font-size: 144px !important;
font-size: calc(( var(--font-144px-min) * 16px ) + ( var(--font-144px-max) - var(--font-144px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
span[style*="font-size: 148px"]{
font-size: 148px !important;
font-size: calc(( var(--font-148px-min) * 16px ) + ( var(--font-148px-max) - var(--font-148px-min) ) * ((100vw - ( var(--bp-large) * 16px )) / ( var(--bp-xlarge) - var(--bp-large) ))) !important;
}
/* Stop font size from growing continuously */
@media (min-width: 1200px) {
span[style*="font-size: 9px"], .font-9-px {
font-size: 9px !important;
font-size: calc( var(--font-9px-max) * 16px) !important;
}
span[style*="font-size: 10px"], .font-10-px {
font-size: 10px !important;
font-size: calc( var(--font-10px-max) * 16px) !important;
}
span[style*="font-size: 11px"], .font-11-px {
font-size: 11px !important;
font-size: calc( var(--font-11px-max) * 16px) !important;
}
span[style*="font-size: 12px"], .font-12-px {
font-size: 12px !important;
font-size: calc( var(--font-12px-max) * 16px) !important;
}
span[style*="font-size: 13px"], .font-13-px {
font-size: 13px !important;
font-size: calc( var(--font-13px-max) * 16px) !important;
}
span[style*="font-size: 14px"], .font-14-px {
font-size: 14px !important;
font-size: calc( var(--font-14px-max) * 16px) !important;
}
span[style*="font-size: 15px"], .font-15-px {
font-size: 15px !important;
font-size: calc( var(--font-15px-max) * 16px) !important;
}
span[style*="font-size: 16px"], .font-16-px {
font-size: 16px !important;
font-size: calc( var(--font-16px-max) * 16px) !important;
}
span[style*="font-size: 17px"], .font-17-px {
font-size: 17px !important;
font-size: calc( var(--font-17px-max) * 16px) !important;
}
span[style*="font-size: 18px"], .font-18-px {
font-size: 18px !important;
font-size: calc( var(--font-18px-max) * 16px) !important;
}
span[style*="font-size: 19px"], .font-19-px {
font-size: 19px !important;
font-size: calc( var(--font-19px-max) * 16px) !important;
}
span[style*="font-size: 20px"], .font-20-px {
font-size: 20px !important;
font-size: calc( var(--font-20px-max) * 16px) !important;
}
span[style*="font-size: 21px"], .font-21-px {
font-size: 21px !important;
font-size: calc( var(--font-21px-max) * 16px) !important;
}
span[style*="font-size: 22px"], .font-22-px {
font-size: 22px !important;
font-size: calc( var(--font-22px-max) * 16px) !important;
}
span[style*="font-size: 23px"], .font-23-px {
font-size: 23px !important;
font-size: calc( var(--font-23px-max) * 16px) !important;
}
span[style*="font-size: 24px"], .font-24-px {
font-size: 24px !important;
font-size: calc( var(--font-24px-max) * 16px) !important;
}
span[style*="font-size: 25px"]{
font-size: 25px !important;
font-size: calc( var(--font-25px-max) * 16px) !important;
}
span[style*="font-size: 26px"], .font-26-px {
font-size: 26px !important;
font-size: calc( var(--font-26px-max) * 16px) !important;
}
span[style*="font-size: 27px"]{
font-size: 27px !important;
font-size: calc( var(--font-27px-max) * 16px) !important;
}
span[style*="font-size: 28px"]{
font-size: 28px !important;
font-size: calc( var(--font-28px-max) * 16px) !important;
}
span[style*="font-size: 29px"]{
font-size: 29px !important;
font-size: calc( var(--font-29px-max) * 16px) !important;
}
span[style*="font-size: 30px"], .font-30-px {
font-size: 30px !important;
font-size: calc( var(--font-30px-max) * 16px) !important;
}
span[style*="font-size: 31px"]{
font-size: 31px !important;
font-size: calc( var(--font-31px-max) * 16px) !important;
}
span[style*="font-size: 32px"]{
font-size: 32px !important;
font-size: calc( var(--font-32px-max) * 16px) !important;
}
span[style*="font-size: 33px"], .font-33-px {
font-size: 33px !important;
font-size: calc( var(--font-33px-max) * 16px) !important;
}
span[style*="font-size: 34px"]{
font-size: 34px !important;
font-size: calc( var(--font-34px-max) * 16px) !important;
}
span[style*="font-size: 35px"]{
font-size: 35px !important;
font-size: calc( var(--font-35px-max) * 16px) !important;
}
span[style*="font-size: 36px"], .font-36-px {
font-size: 36px !important;
font-size: calc( var(--font-36px-max) * 16px) !important;
}
span[style*="font-size: 37px"]{
font-size: 37px !important;
font-size: calc( var(--font-37px-max) * 16px) !important;
}
span[style*="font-size: 38px"]{
font-size: 38px !important;
font-size: calc( var(--font-38px-max) * 16px) !important;
}
span[style*="font-size: 39px"]{
font-size: 39px !important;
font-size: calc( var(--font-39px-max) * 16px) !important;
}
span[style*="font-size: 40px"], .font-40-px {
font-size: 40px !important;
font-size: calc( var(--font-40px-max) * 16px) !important;
}
span[style*="font-size: 44px"]{
font-size: 44px !important;
font-size: calc( var(--font-44px-max) * 16px) !important;
}
span[style*="font-size: 48px"], .font-48-px {
font-size: 48px !important;
font-size: calc( var(--font-48px-max) * 16px) !important;
}
span[style*="font-size: 52px"]{
font-size: 52px !important;
font-size: calc( var(--font-52px-max) * 16px) !important;
}
span[style*="font-size: 56px"]{
font-size: 56px !important;
font-size: calc( var(--font-56px-max) * 16px) !important;
}
span[style*="font-size: 60px"], .font-60-px {
font-size: 60px !important;
font-size: calc( var(--font-60px-max) * 16px) !important;
}
span[style*="font-size: 64px"]{
font-size: 64px !important;
font-size: calc( var(--font-64px-max) * 16px) !important;
}
span[style*="font-size: 68px"]{
font-size: 68px !important;
font-size: calc( var(--font-68px-max) * 16px) !important;
}
span[style*="font-size: 72px"], .font-72-px {
font-size: 72px !important;
font-size: calc( var(--font-72px-max) * 16px) !important;
}
span[style*="font-size: 76px"]{
font-size: 76px !important;
font-size: calc( var(--font-76px-max) * 16px) !important;
}
span[style*="font-size: 80px"]{
font-size: 80px !important;
font-size: calc( var(--font-80px-max) * 16px) !important;
}
span[style*="font-size: 84px"]{
font-size: 84px !important;
font-size: calc( var(--font-84px-max) * 16px) !important;
}
span[style*="font-size: 88px"]{
font-size: 88px !important;
font-size: calc( var(--font-88px-max) * 16px) !important;
}
span[style*="font-size: 92px"]{
font-size: 92px !important;
font-size: calc( var(--font-92px-max) * 16px) !important;
}
span[style*="font-size: 96px"], .font-96-px {
font-size: 96px !important;
font-size: calc( var(--font-96px-max) * 16px) !important;
}
span[style*="font-size: 100px"]{
font-size: 100px !important;
font-size: calc( var(--font-100px-max) * 16px) !important;
}
span[style*="font-size: 104px"]{
font-size: 104px !important;
font-size: calc( var(--font-104px-max) * 16px) !important;
}
span[style*="font-size: 108px"]{
font-size: 108px !important;
font-size: calc( var(--font-108px-max) * 16px) !important;
}
span[style*="font-size: 112px"]{
font-size: 112px !important;
font-size: calc( var(--font-112px-max) * 16px) !important;
}
span[style*="font-size: 116px"]{
font-size: 116px !important;
font-size: calc( var(--font-116px-max) * 16px) !important;
}
span[style*="font-size: 120px"]{
font-size: 120px !important;
font-size: calc( var(--font-120px-max) * 16px) !important;
}
span[style*="font-size: 124px"]{
font-size: 124px !important;
font-size: calc( var(--font-124px-max) * 16px) !important;
}
span[style*="font-size: 128px"]{
font-size: 128px !important;
font-size: calc( var(--font-128px-max) * 16px) !important;
}
span[style*="font-size: 132px"]{
font-size: 132px !important;
font-size: calc( var(--font-132px-max) * 16px) !important;
}
span[style*="font-size: 136px"]{
font-size: 136px !important;
font-size: calc( var(--font-136px-max) * 16px) !important;
}
span[style*="font-size: 140px"]{
font-size: 140px !important;
font-size: calc( var(--font-140px-max) * 16px) !important;
}
span[style*="font-size: 144px"]{
font-size: 144px !important;
font-size: calc( var(--font-144px-max) * 16px) !important;
}
span[style*="font-size: 148px"]{
font-size: 148px !important;
font-size: calc( var(--font-148px-max) * 16px) !important;
}
}
@media (max-width: 767px) {
.text-center-xs {
text-align: center !important;
}
}
/* flex-helper classes */
.flex {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.flex .vertical-align {
align-self: center;
}
.flex-row{
flex-direction: row;
}
.flex-row-reverse{
flex-direction: row-reverse;
}
.flex-col{
flex-direction: column;
}
.flex-col-reverse{
flex-direction: column-reverse;
}
.flex-wrap{
flex-wrap: wrap;
}
.flex-wrap-reverse{
flex-wrap: wrap-reverse;
}
.flex-no-wrap{
flex-wrap: nowrap;
}
.flex-1{
flex: 1 1 0%;
}
.flex-auto{
flex: 1 1 auto;
}
.flex-initial{
flex: 0 1 auto;
}
.flex-none{
flex: none;
}
/* Flex hack for existing sections - do not remove */
@media (max-width: 767px) {
.kol-section-zig-zag-partially-transparent-image .flex,
.kol-section-app-features .flex,
.kol-section-zig-zag-square-image .flex {
display:block !important;
}
}
/* Responsive Video */
[data-kol-editor="froala"] iframe{
max-width: 100%;
}
/* ############################## */
/* START: NO OFFSET OVERRIDES */
/* ############################## */
.no-offsets .col-sm-4.col-sm-offset-4,
.no-offsets .col-sm-6.col-sm-offset-3,
.no-offsets .col-sm-8.col-sm-offset-2,
.no-offsets .col-sm-10.col-sm-offset-1 {
width: 100% !important;
margin-left: 0 !important;
}
.no-offsets .col-md-4.col-md-offset-4,
.no-offsets .col-md-6.col-md-offset-3,
.no-offsets .col-md-8.col-md-offset-2,
.no-offsets .col-md-10.col-md-offset-1 {
width: 100% !important;
margin-left: 0 !important;
}
.no-offsets .col-lg-4.col-lg-offset-4,
.no-offsets .col-lg-6.col-lg-offset-3,
.no-offsets .col-lg-8.col-lg-offset-2,
.no-offsets .col-lg-10.col-lg-offset-1 {
width: 100% !important;
margin-left: 0 !important;
}
/* Fix parallax images being zoomed in on mobile */
@media screen and (max-width: 480px) {
.kol-editable-section {
background-attachment: scroll !important;
}
}
/* REMOVE???? */
@media (max-width: 768px) {
h2, h3 {
text-align: center;
}
}
/* ############################## */
/* FROALA IMAGE STYLES */
/* ############################## */
img {
max-width: 100%;
}
img.fr-fin{
margin: auto;
padding: 1rem 0;
display: block;
}
img.fr-dib {
margin: auto;
display: block;
float: none;
}
img.fr-dib.fr-fil {
margin: 0 auto 0 0;
}
img.fr-fir{
float:right;
margin: 1rem .3rem 1rem 1rem;
}
img.fr-dib.fr-fir {
margin: 0 0 0 auto;
}
img.fr-dii {
margin: auto;
display: inline-block;
float: none;
margin-top: .5rem;
margin-bottom: .5rem;
}
img.fr-dii.fr-fil {
margin: .5rem 1rem .5rem 0;
left: .5rem;
float: left;
}
img.fr-dii.fr-fir {
margin: .5rem 0 .5rem 1rem;
right: .5rem;
float: right;
}
.kol-single-image-full p.image-wrapper,
.kol-single-image-full p.image-wrapper img.fr-dib {
padding:0;
margin:0;
}
.kol-single-image-full img.fr-dib {
min-width: 100%;
}
/* ########################## */
/* Default Snippet Styles */
/* ########################## */
/* Headline */
/* Paragraph */
/* Image */
.img-responsive {
height: auto !important;
}
img {
display: block;
margin-left:auto;
margin-right:auto;
}
.img-wrapper-full{
margin-top: 0px !important;
margin-bottom: 0px !important;
}
img.img-fullColumnWidth{
height: calc(100% + 10px) !important;
width: calc(100% + 30px) !important;
max-width: calc(100% + 30px) !important;
margin: 0px !important;
margin-left: -15px!important;
left: 0px !important;
}
.kol-background-image-fill{
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
}
.kol-background-image-center{
background-size: contain;
background-position: center center;
background-repeat: no-repeat;
}
.kol-background-image-tile{
background-size: auto;
background-position: 0 0;
background-repeat: repeat;
}
/* Card */
.kol-card .card {
border-radius: 3px;
box-shadow: 0 .5rem 1.5rem 0 rgba(0,0,0,0.25);
background-color: #ffffff;
}
.kol-card p {
padding: 1.5em;
font-size: 1.15em;
line-height: 1.6;
}
.kol-card img {
border-top-left-radius: 3px;
border-top-right-radius: 3px;
}
.kol-card .fr-element img {
max-width: 100%;
}
@media (max-width: 768px) {
.kol-card .card {
margin-left: 15%;
margin-right: 15%;
}
}
@media (max-width: 480px) {
.kol-card .card {
margin-left: 0;
margin-right: 0;
}
}
/* Image + Text & Text + Image */
/* Icon */
/* Video */
/* video background */
.kol-background-video {
width: 100%;
height: 100%;
position: absolute;
object-fit: cover;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: -1;
}
.kol-video-left .embed-responsive.embed-responsive-4by3, .kol-video-right .embed-responsive.embed-responsive-4by3 {
padding-bottom: 54%;
}
@media (max-width: 992px){
.kol-video-left, .kol-video-right {
text-align: center;
}
}
/* Countdown Timer Styles Below */
/* List */
.kol-list-simple .block {
display: block;
margin-left: auto;
margin-right: auto;
}
.kol-list-simple .list-wrapper {
width: 38rem;
}
.kol-list-simple ul {
list-style-type: none;
-webkit-padding-start: 1em;
}
.kol-list-simple ul {
list-style-type: disc;
-webkit-padding-start: 2em;
}
.kol-list-simple ul li {
line-height: 1.4;
margin-bottom: 1em;
margin-top: .5em;
font-size: 1.28em;
}
.kol-list-simple ul li i {
margin-right: .8rem;
}
@media (max-width: 767px) {
.kol-list-simple .list-wrapper {
display: block;
margin-left:auto;
margin-right:auto;
}
}
/* Stacked Form & Inline Form Styls Below */
/* Facebook Signup */
a.facebook-signup-btn {
text-decoration: none !important;
background-color: #3b5998 !important;
color: #fff !important;
display: inline-block;
opacity: 1;
margin: auto !important;
transition: .25s ease all !important;
position: relative;
letter-spacing: 0;
height: 36px;
font-size: 13px;
line-height: 36px;
min-width: 21rem;
}
a.facebook-signup-btn.kol-btn-xs {
height: 26px;
line-height: 26px;
font-size: 12px;
min-width: 19rem;
}
a.facebook-signup-btn.kol-btn-sm {
height: 30px;
line-height: 30px;
font-size: 12px;
min-width: 20rem;
}
a.facebook-signup-btn.kol-btn-lg {
height: 44px;
line-height: 44px;
font-size: 14px;
min-width: 22rem;
}
a.facebook-signup-btn.kol-btn-xlg {
height: 52px;
line-height: 52px;
font-size: 15px;
min-width: 23rem;
}
a.facebook-signup-btn.kol-btn-xxlg {
height: 60px;
line-height: 60px;
font-size: 16px;
min-width: 24rem;
}
.facebook-signup-btn:hover,
.facebook-signup-btn:active {
background-color: #2b4886 !important;
text-decoration: none !important;
}
.facebook-signup-btn i {
padding-right: 15px !important;
}
/* Button */
.kol-cta-btn {
letter-spacing: 1px;
display: inline-block;
margin-bottom: 0;
font-weight: normal;
text-align: center;
text-decoration: none;
vertical-align: middle;
cursor: pointer;
background-image: none;
white-space: nowrap;
transition: .3s;
}
/* hr */
.kol-line-divider-line{
margin-top: 0px;
margin-bottom: 0px;
border: 0;
border-top: none;
}
/* Custom HTML */
/* ############################## */
/* COUNTDOWN STYLES */
/* ############################## */
h4.countdown {
margin-top: 0;
margin-bottom: 0;
}
/* Inline */
.kol-countdown-container.inline .countdown-amount {
display: inline;
margin-right: .25em;
font-weight: bold;
}
.kol-countdown-container.inline .countdown-period {
display: inline;
font-size: 2.7rem;
text-transform: lowercase;
white-space: nowrap;
}
.kol-countdown-container.inline .countdown-section {
background-color: transparent;
margin-left: .25rem;
}
.row.kol-countdown-container,
.row.kol-countdown-container.form-active,
.kol-countdown-container,
.kol-container {
position: relative !important;
}
.kol-countdown-container {
text-align: center;
}
/* h4 */
.kol-countdown-container h4.countdown {
width: 100%;
word-wrap: break-word;
font-size: 18pt;
}
/* countdown-section */
.countdown .countdown-row {
display: block;
}
.countdown-section:first-of-type {
margin-left: 0;
}
.kol-countdown-container .countdown-section {
display: inline-block;
margin: 0;
border-radius: 2px;
padding: 0 1rem;
min-width: 9.9rem;
}
.kol-countdown-container .countdown-section {
background-color: #ffffff;
}
.kol-countdown-container.boxed .countdown-section {
background-color: whitesmoke;
}
.kol-countdown-container.minimal .countdown-section {
background-color: transparent;
}
/* minimal size to prevent jumping */
.kol-countdown-container.minimal:empty{
height: 63px;
}
/* countdown-amount */
.kol-countdown-container .countdown-amount,
.kol-countdown-container .kol-countdown-value {
display: block;
width: 100%;
font-size: 3rem;
font-weight: 400;
}
/* countdown period */
.kol-countdown-container .countdown-period,
.kol-countdown-container .kol-countdown-word {
display: block;
width: 100%;
font-size: 1.25rem;
white-space: nowrap;
}
/* Countdown Responsive Styling */
/* Minimal */
.is-content-500 .minimal .countdown-section {
margin-left: 0;
margin-right: 0;
}
.is-content-380 .minimal .countdown-section {
margin-left: 0;
margin-right: 0;
padding: 0;
min-width: 7rem;
}
.is-content-640 .inline .countdown-section {
padding: 0 .8rem;
}
.is-content-640 .inline .countdown-amount,
.is-content-640 .inline .countdown-period {
font-size: 2.5rem;
}
.is-content-500 .inline .countdown-section {
padding: 0 .75rem;
min-width: 10rem;
}
.is-content-500 .inline .countdown-amount,
.is-content-500 .inline .countdown-period {
font-size: 1.6rem;
}
.is-content-380 .inline .countdown-section {
margin-left: 0;
margin-right: 0;
padding: 0 .5rem;
min-width: 8rem;
}
.is-content-380 .inline .countdown-amount,
.is-content-380 .inline .countdown-period {
font-size: 1.4rem;
}
/* Boxed */
.boxed .countdown-section {
margin: 0 .6rem;
padding: .6rem;
}
@media (max-width: 424px) {
.boxed .countdown-section {
margin: 0 .5rem;
}
}
.is-content-500 .boxed .countdown-section {
margin: .5rem;
padding: .6rem;
min-width: 8rem;
}
.is-content-380 .boxed .countdown-section {
margin: .5rem .25rem;
margin-right: .25rem;
padding: 1rem;
min-width: 8rem;
}
@media (max-width: 768px) {
.is-content-500 .inline .countdown-section {
padding: .75rem;
}
.is-content-380 .inline .countdown-section {
padding: .5rem;
}
}
@media (max-width: 677px) {
.kol-countdown-container.inline .countdown-amount,
.kol-countdown-container.inline .countdown-period {
font-size: 2.25rem;
}
.is-content-500 .inline .countdown-amount,
.is-content-500 .inline .countdown-period {
font-size: 1.8rem;
}
.is-content-380 .inline .countdown-amount,
.is-content-380 .inline .countdown-period {
font-size: 1.4rem;
}
}
@media (max-width: 585px) {
.kol-countdown-container .countdown-section {
margin-left: .35rem;
margin-right: .35rem;
padding: 1.5rem;
min-width: 9rem;
}
.kol-countdown-container.inline .countdown-section {
padding: .5rem;
}
.kol-countdown-container.inline .countdown-section .countdown-amount,
.kol-countdown-container.inline .countdown-section .countdown-period {
font-size: 1.75rem;
}
.is-content-380 .inline .countdown-period,
.is-content-380 .inline .countdown-amount {
font-size: 1.35rem !important;
}
}
@media (max-width: 480px) {
.kol-countdown-container .countdown-section {
margin-left: .2rem;
margin-right: .2rem;
padding: 1rem;
min-width: 7.8rem;
max-width: 7.8rem;
}
.kol-countdown-container.minimal .countdown-section {
padding: .5rem;
}
.kol-countdown-container .countdown-section:first-of-type {
margin-left: 0;
}
.kol-countdown-container .countdown-amount {
font-size: 2.5rem;
}
.kol-countdown-container.inline .countdown-section {
padding: .35rem;
min-width: inherit;
max-width: none;
}
.kol-countdown-container.inline .countdown-section .countdown-amount,
.kol-countdown-container.inline .countdown-section .countdown-period {
font-size: 1.5rem;
}
.kol-countdown-container.boxed .countdown-section .countdown-period {
font-size: 1rem;
white-space: nowrap;
}
}
/* ########################### */
/* FORM STYLES */
/* ########################### */
/* ######## General Styles ######## */
.kol-form-group {
margin-bottom: 15px;
}
@media (max-width: 767px) {
.kol-form-group {
margin-bottom: 1rem;
}
.kol-form-label {
margin-top: 10px;
}
}
.form-inline .kol-form-group {
display: inline-flex;
align-items: center;
}
@media (min-width: 768px) {
.form-inline .kol-form-group .kol-form-label,
.form-inline .kol-form-group .kol-form-control,
.form-inline .kol-form-group .kol-help-block {
margin-right: 5px;
}
}
@media (max-width: 767px) {
.form-inline .form-group {
display: flex;
flex-direction: column;
}
.is-align-center .form-inline .form-group {
align-items: center;
}
.is-align-left .form-inline .form-group {
align-items: flex-start;
}
.is-align-right .form-inline .form-group {
align-items: flex-end;
}
}
.form-inline .form-group label {
margin-bottom: 0;
}
.kol-help-block {
margin: 0;
}
.kol-help-block {
font-size: 1.2rem;
display: inline-block;
margin-top: 0;
margin-bottom: 0;
}
@media (max-width: 767px) {
.kol-help-block {
display: block;
margin-bottom: 1rem;
padding-left: 2px;
}
}
fieldset.inline .kol-static-text {
margin-bottom: 4px;
margin-top: 0;
}
[data-layout="inline"] .kol-static-text {
padding-left: 2px;
}
@media (min-width: 768px) {
[data-layout="inline"] .kol-static-text {
padding-left: 7px;
}
}
.kol-form-group label {
display: block;
font-size: 1.1rem;
}
/* Input Styles */
.kol-signup-form fieldset {
position: relative;
}
.form-control {
height: auto;
box-shadow:none;
}
/* Radio and Checkbox Styles */
.kol-checkbox,
.kol-radio {
margin-top: 0;
}
.kol-form-group .kol-checkbox-label.kol-form-label,
.kol-form-group .kol-radio-label.kol-form-label {
margin-top: 0;
font-size: 1.2rem;
line-height: 1.8;
}
@media (min-width: 768px) {
[data-layout="stacked"] .kol-radio input[type="radio"],
[data-layout="stacked"] .kol-checkbox input[type="checkbox"] {
margin-top: 1px;
}
[data-layout="inline"] .kol-radio-input,
[data-layout="inline"] .kol-checkbox-input,
.form-inline .kol-radio-input,
.form-inline .kol-checkbox-input {
margin-right: 3px;
}
}
@media (max-width: 767px) {
.kol-checkbox input[type="checkbox"],
.kol-checkbox-wrapper input[type="checkbox"],
.kol-radio-wrapper input[type="radio"] {
margin-top: 4px;
}
.kol-form-group .checkbox,
.kol-form-group .radio {
margin-top: 0px;
}
}
/* Radio and Checkbox Individually assigned inline */
.kol-form-group label.checkbox-inline,
.kol-form-group label.radio-inline {
margin-left: 0;
}
@media (max-width: 479px) {
.kol-form-group label.checkbox-inline,
.kol-form-group label.radio-inline {
margin-left: -20px;
}
}
@media (min-width: 480px) {
.kol-form-group label.checkbox-inline,
.kol-form-group label.radio-inline {
display: inline-block;
}
}
.radio-inline input[type="radio"],
.checkbox-inline input[type="checkbox"] {
position: relative;
margin-left: 0;
}
.checkbox-inline input[type="checkbox"] {
margin-right: 0;
}
.radio-inline input[type="radio"] {
margin-right: 5px;
}
@media (min-width: 481px) {
.is-align-left [data-layout="stacked"] .radio-inline:first-of-type input[type="radio"],
.is-align-left [data-layout="stacked"] .checkbox-inline:first-of-type input[type="checkbox"] {
margin-left: -20px;
}
}
[data-layout="inline"] .kol-radio-label input[type="radio"],
[data-layout="inline"] .kol-checkbox-label input[type="checkbox"] {
margin-top: 2px;
}
[data-layout="inline"] .kol-radio-label input[type="radio"] {
margin-right: 5px;
}
/* Style Fieldset: Square */
@media (max-width: 767px) {
.kol-form-square [data-input-type="radio"] .kol-radio:first-of-type .kol-radio-label,
.kol-form-square [data-input-type="checkbox"] .kol-checkbox:first-of-type .kol-checkbox-label,
.kol-form-square [data-input-type="single-checkbox"] .kol-checkbox-label,
.kol-form-square [data-input-type="privacy-consent"] .kol-checkbox-label {
margin-top: 5px;
}
.kol-form-square [data-input-type="radio"] .kol-radio:last-of-type .kol-radio-label,
.kol-form-square [data-input-type="checkbox"] .kol-checkbox:last-of-type .kol-checkbox-label,
.kol-form-square [data-input-type="single-checkbox"] .kol-checkbox-label,
.kol-form-square [data-input-type="privacy-consent"] .kol-checkbox-label {
margin-bottom: 5px;
}
}
.kol-form-squared .kol-form-control {
border-radius: 1px;
}
.kol-form-square .kol-form-control {
border-radius: 0px;
}
.kol-form-square select.kol-form-control{
-webkit-appearance: none;
-webkit-border-radius: 0px;
border-radius: 0px;
background: url("data:image/svg+xml;utf8,");
background-position: 98% 50%;
background-repeat: no-repeat;
}
/* Style Fieldset: Rounded */
.kol-form-rounded .kol-form-control {
border-radius: 4px;
}
/* Style Fieldset: Pill */
.kol-form-pill .kol-form-control {
border-radius: 50px;
}
.kol-form-pill textarea.kol-form-control {
border-radius: 35px;
}
.kol-form-pill select.kol-form-control{
-webkit-appearance: none;
-webkit-border-radius: 50px;
border-radius: 50px;
background: url("data:image/svg+xml;utf8,");
background-position: 97% 65%;
background-repeat: no-repeat;
}
/* Hidden Fields */
.kol-has-hidden-fields {
margin: 0;
}
.kol-hidden-form-group {
margin: 0;
margin-top: 0 !important;
margin-bottom: 0 !important;
margin-right: 0 !important;
margin-left: 0 !important;
height: 0 !important;
width: 0 !important;
}
.kol-hidden-form-group label {
display: none !important;
}
/* ######## Stacked Form ######## */
/* Fieldset & Select Sizes */
.kol-form-squared fieldset .kol-form-group input.input-sm,
.kol-form-squared fieldset .kol-form-group select.input-sm {
padding: 0px 12px;
min-width: 16rem;
height: 30px;
font-size: 12px;
line-height: 15px;
}
.kol-form-squared .kol-form-group{
clear:both;
}
.kol-form-squared fieldset .kol-form-group input.input-md,
.kol-form-squared fieldset .kol-form-group select.input-md {
padding: 0px 15px;
min-width: 16rem;
height: 36px;
font-size: 14px;
line-height: 20px;
}
.kol-form-squared fieldset .kol-form-group input.input-lg,
.kol-form-squared fieldset .kol-form-group select.input-lg {
font-size: 16px;
padding: 0px 15px;
min-width: 16rem;
height: 44px;
line-height: 44px;
}
.kol-form-squared fieldset .kol-form-group input.input-xlg,
.kol-form-squared fieldset .kol-form-group select.input-xlg {
padding: 0px 15px;
min-width: 16rem;
height: 52px;
font-size: 15px;
line-height: 35px;
}
.kol-form-squared fieldset .kol-form-group select.input-xlg {
line-height: normal;
}
.kol-form-squared fieldset .kol-form-group input.input-xxlg,
.kol-form-squared fieldset .kol-form-group select.input-xxlg {
padding: 0 15px;
min-width: 16rem;
height: 60px;
font-size: 15px;
line-height: 44px;
}
.kol-form-squared fieldset .kol-form-group select.input-xxlg {
line-height: normal;
}
/* Button Sizes */
.kol-form-squared .kol-form-button-row input.kol-btn-xs {
height: 26px;
font-size: 12px;
}
.kol-form-squared .kol-form-button-row-inline input.kol-btn-xs {
font-size: 12px;
height: 26px;
}
.kol-form-squared .kol-form-button-row input.kol-btn-sm {
height: 30px;
font-size: 12px;
line-height: 15px;
}
.kol-form-squared .kol-form-button-row-inline input.kol-btn-sm {
height: 30px;
font-size: 12px;
line-height: 15px;
}
.kol-form-squared .kol-form-button-row input.kol-btn-md {
height: 36px;
font-size: 14px;
/* line-height: 20px; */
}
.kol-form-squared .kol-form-button-row-inline input.kol-btn-md {
height: 36px;
font-size: 14px;
/* line-height: 20px; */
}
.kol-form-squared .kol-form-button-row input.kol-btn-lg {
height: 44px;
font-size: 15px;
line-height: 30px;
}
.kol-form-squared .kol-form-button-row-inline input.kol-btn-lg {
height: 44px;
font-size: 15px;
line-height: 30px;
}
.kol-form-squared .kol-form-button-row input.kol-btn-xlg {
height: 52px;
font-size: 15px;
line-height: 35px;
}
.kol-form-squared .kol-form-button-row-inline input.kol-btn-xlg {
height: 52px;
font-size: 15px;
line-height: 35px;
}
.kol-form-squared .kol-form-button-row input.kol-btn-xxlg {
font-size: 15px;
height: 60px;
}
.kol-form-squared .kol-form-button-row-inline input.kol-btn-xxlg {
height: 60px;
font-size: 15px;
}
/* Label */
.kol-form-squared fieldset .kol-form-group input, .kol-form-squared fieldset .kol-form-group textarea {
background: rgba(255, 255, 255, 1);
border: 1px solid rgba(19, 72, 84, 0.4);
font-weight: 300;
letter-spacing: 1.5px;
}
/* Placeholder Text Color */
.kol-form-squared fieldset .kol-form-group input::-webkit-input-placeholder, .kol-form-squared fieldset .kol-form-group textarea::-webkit-input-placeholder {
color: #4D565A;
}
.kol-form-squared fieldset .kol-form-group input:-moz-placeholder, .kol-form-squared fieldset .kol-form-group textarea:-moz-placeholder { /* Firefox 18- */
color: #4D565A;
}
.kol-form-squared fieldset .kol-form-group input::-moz-placeholder, .kol-form-squared fieldset .kol-form-group textarea::-moz-placeholder { /* Firefox 19+ */
color: #4D565A;
}
.kol-form-squared fieldset .kol-form-group input:-ms-input-placeholder, .kol-form-squared fieldset .kol-form-group textarea:-ms-input-placeholder {
color: #4D565A;
}
.kol-form-squared fieldset .kol-form-group input::placeholder, .kol-form-squared fieldset .kol-form-group textarea::placeholder {
color: #4D565A;
}
/* Fieldset Elements */
.kol-form-squared fieldset .kol-form-group textarea {
margin-bottom: 2px;
margin-top: 2px;
}
.kol-form-squared fieldset .kol-form-group[data-input-type="checkbox"] {
vertical-align: middle;
}
@media (max-width: 767px) {
.kol-form-squared fieldset .kol-form-group {
width: 100%;
}
}
/* ######## Inline Form ######## */
/* Form Wrapper and Layout Styles */
.kol-signup-form.form-inline {
margin: auto;
display: inline-block;
}
@media (max-width: 767px) {
.kol-signup-form.form-inline {
display: block;
max-width: 40rem;
}
}
/* Label Styles and Checkbox/Radio Layout */
@media (min-width: 768px) {
fieldset.inline label,
fieldset.inline .kol-checkbox-wrapper,
fieldset.inline .kol-radio-wrapper {
display: inline-block;
margin-bottom: 0;
}
}
@media (max-width: 767px) {
fieldset.inline label,
fieldset.inline .kol-checkbox-wrapper,
fieldset.inline .kol-radio-wrapper {
display: block;
margin-bottom: 2px;
}
}
@media (max-width: 480px) {
fieldset.inline .kol-form-group[data-inline="on"] .kol-checkbox-wrapper,
fieldset.inline .kol-form-group[data-inline="on"] .kol-radio-wrapper {
width: 100%;
}
fieldset.inline .kol-checkbox-input,
fieldset.inline .kol-radio-input {
top: 3px;
}
}
/* Fieldset Styles */
fieldset.inline {
width: auto;
float: left;
}
@media (max-width: 767px) {
fieldset.inline {
display: block;
width: 100%;
}
}
fieldset.inline input {
min-width: 26rem;
}
fieldset.inline input.kol-radio-input {
min-width: inherit;
}
fieldset.inline input.kol-checkbox-input {
min-width: 20px;
}
@media (max-width: 767px) {
fieldset.inline input {
min-width: inherit;
}
}
fieldset.inline .kol-checkbox-wrapper .checkbox,
fieldset.inline [data-input-type="checkbox"] label,
fieldset.inline .checkbox .kol-checkbox-input,
fieldset.inline .kol-radio-wrapper .radio,
fieldset.inline .kol-radio-label,
fieldset.inline [data-input-type="radio"] label {
padding-left: 5px;
margin-right: 5px;
}
/* Firefox only style */
@-moz-document url-prefix() {
fieldset.inline .checkbox .kol-checkbox-input {
margin-right: 0;
}
}
fieldset.inline .radio .kol-radio-input {
margin-right: .5rem;
}
fieldset.inline .kol-form-group {
margin-right: .2rem;
}
@media (max-width: 767px) {
fieldset.inline .kol-form-group {
margin-left: 0;
margin-right: 0;
}
fieldset.inline .radio .kol-radio-input {
margin-left: -8px;
margin-right: .8rem;
position: relative;
}
fieldset.inline .checkbox .kol-checkbox-input {
margin-left: -10px;
position: relative;
}
@-moz-document url-prefix() {
fieldset.inline .checkbox .kol-checkbox-input {
margin-right: 2px;
}
}
}
fieldset.inline .kol-form-group[data-name="email"],
fieldset.inline .kol-form-group.kol-has-hidden-fields {
margin-right: 0;
}
@media (min-width: 768px) {
fieldset.inline .kol-form-group[data-input-type="single-checkbox"],
fieldset.inline .kol-form-group[data-input-type="static-text"],
fieldset.inline .kol-form-group[data-input-type="privacy-consent"],
fieldset.inline .kol-form-group[data-input-type="radio"],
fieldset.inline .kol-form-group[data-input-type="checkbox"] {
top: 50% !important;
}
}
@media (max-width: 767px) {
fieldset.inline .kol-form-group {
margin-right: 0 !important;
}
}
fieldset.inline select {
margin-left: 0;
}
@media (min-width: 768px) {
fieldset.inline select {
margin-bottom: 0;
margin-right: 3px;
}
}
/* Button Styles */
.kol-form-button-row,
.kol-form-button-row-inline {
margin-left: 0;
margin-right: 0;
}
.kol-form-button-row-inline {
align-self: center;
}
.kol-form-button-row-inline,
.kol-form-button-row-inline [data-kol-editor="button"] {
display: block;
width: 100%;
}
@media (max-width: 767px) {
.kol-form-button-row-inline,
.kol-form-button-row-inline [data-kol-editor="button"] {
display: inline;
position: static !important;
}
}
.kol-form-button-row-inline [data-kol-editor="button"]{
margin-left:auto;
margin-right:auto;
padding-left: 0;
padding-right: 0;
white-space:normal;
width: 100%;
}
@media (min-width: 768px) {
.kol-form-button-row-inline,
.kol-form-button-row-inline [data-kol-editor="button"] {
display: inline-block;
width: auto;
float: none;
}
}
@media (max-width: 767px) {
.kol-form-inline-centered .kol-form-button-row-inline {
width: 100%;
}
.kol-form-inline-centered .kol-checkbox,
.kol-form-inline-centered .kol-radio,
.kol-form-squared .kol-checkbox,
.kol-form-squared .kol-radio {
margin-left: 4px;
}
}
@media (max-width: 480px) {
.kol-form-inline-centered .kol-radio,
.kol-form-inline-centered .kol-checkbox {
margin-left: 0;
}
}
/* Column Width Responsiveness */
.is-content-380 .form-inline,
.is-content-380 fieldset.inline,
.is-content-380 fieldset.inline .kol-form-group,
.is-content-380 fieldset.inline .kol-form-control,
.is-content-380 .kol-form-button-row-inline,
.is-content-380 .kol-form-button-row-inline [data-kol-editor="button"],
.is-content-380 .kol-form-button-row-inline .form-control {
display: inline-block;
width: 100%;
}
/* Form Size 10px */
/* label */
.kol-form-group .kol-radio-label.kol-form-label[style*="font-size: 10px"],
.kol-form-group .kol-checkbox-label.kol-form-label[style*="font-size: 10px"] {
line-height: 1.3;
}
@media (min-width: 481px) {
[data-layout="stacked"] .kol-form-group .kol-radio-label.kol-form-label[style*="font-size: 10px"],
[data-layout="stacked"] .kol-form-group .kol-checkbox-label.kol-form-label[style*="font-size: 10px"] {
margin-left: -5px;
}
}
[data-layout="inline"] .kol-form-group .kol-radio-label.kol-form-label[style*="font-size: 10px"],
[data-layout="inline"] .kol-form-group .kol-checkbox-label.kol-form-label[style*="font-size: 10px"] {
margin-left: 0;
padding-left: 0;
}
.kol-form-group[data-inline="on"] .kol-radio-label.kol-form-label[style*="font-size: 10px"],
.kol-form-group[data-inline="on"] .kol-checkbox-label.kol-form-label[style*="font-size: 10px"] {
margin-left: 0;
margin-right: 5px;
}
@media (max-width: 767px) {
.kol-form-group .kol-radio-label.kol-form-label[style*="font-size: 10px"],
.kol-form-group .kol-checkbox-label.kol-form-label[style*="font-size: 10px"] {
line-height: 2;
}
}
@media (max-width: 480px) {
.kol-form-group .kol-radio-label.kol-form-label[style*="font-size: 10px"],
.kol-form-group .kol-checkbox-label.kol-form-label[style*="font-size: 10px"] {
line-height: 2.5;
}
}
/* Input */
@media (min-width: 481px) {
[data-layout="stacked"] .kol-form-group .kol-radio-label.kol-form-label[style*="font-size: 10px"] .kol-radio-input,
[data-layout="stacked"] .kol-form-group .kol-checkbox-label.kol-form-label[style*="font-size: 10px"] .kol-checkbox-input {
margin-left: -15px;
}
}
[data-layout="inline"] .kol-form-group .kol-radio-label.kol-form-label[style*="font-size: 10px"] .kol-radio-input,
[data-layout="inline"] .kol-form-group .kol-checkbox-label.kol-form-label[style*="font-size: 10px"] .kol-checkbox-input {
margin-right: 5px;
}
@media (max-width: 767px) {
[data-layout="inline"] .kol-form-group .kol-radio-label.kol-form-label[style*="font-size: 10px"] .kol-radio-input,
[data-layout="inline"] .kol-form-group .kol-checkbox-label.kol-form-label[style*="font-size: 10px"] .kol-checkbox-input {
margin-left: -5px;
}
}
[data-layout="inline"] .kol-form-group[data-inline="on"] .kol-radio-label.kol-form-label[style*="font-size: 10px"] .kol-radio-input,
[data-layout="inline"] .kol-form-group[data-inline="on"] .kol-checkbox-label.kol-form-label[style*="font-size: 10px"] .kol-checkbox-input {
margin-right: 5px;
}
.kol-form-group[data-inline="on"] .kol-radio-label.kol-form-label[style*="font-size: 10px"] .kol-radio-input,
.kol-form-group[data-inline="on"] .kol-checkbox-label.kol-form-label[style*="font-size: 10px"] .kol-checkbox-input {
position: relative;
bottom: 1px;
margin-left: -20px;
}
@media (max-width: 480px) {
.kol-form-group[data-inline="on"] .kol-radio-label.kol-form-label[style*="font-size: 10px"] .kol-radio-input,
.kol-form-group[data-inline="on"] .kol-checkbox-label.kol-form-label[style*="font-size: 10px"] .kol-checkbox-input {
bottom: -1px;
}
}
/* Form Size 12px */
.kol-form-group .kol-radio-label.kol-form-label[style*="font-size: 12px"],
.kol-form-group .kol-checkbox-label.kol-form-label[style*="font-size: 12px"] {
line-height: 24px;
}
[data-layout="stacked"] .kol-radio-label[style*="font-size: 12px"] .kol-radio-input,
[data-layout="stacked"] .kol-checkbox-label[style*="font-size: 12px"] .kol-checkbox-input,
.kol-form-default .kol-radio-label[style*="font-size: 12px"] .kol-radio-input,
.kol-form-default .kol-checkbox-label[style*="font-size: 12px"] .kol-checkbox-input {
margin-top: 5px;
}
/* Form Size 14px */
/* Label */
.kol-form-group .kol-radio-label.kol-form-label[style*="font-size: 14px"],
.kol-form-group .kol-checkbox-label.kol-form-label[style*="font-size: 14px"] {
line-height: 1.2;
}
@media (max-width: 480px) {
fieldset[data-layout="stacked"] .kol-radio-wrapper .kol-radio-label.kol-form-label[style*="font-size: 14px"] .kol-radio-input,
fieldset[data-layout="stacked"] .kol-checkbox-label.kol-form-label[style*="font-size: 14px"] .kol-checkbox-input {
margin-top: 0;
}
}
/* Form Size 16px */
/* Label */
.kol-form-group .kol-radio-label.kol-form-label[style*="font-size: 16px"],
.kol-form-group .kol-checkbox-label.kol-form-label[style*="font-size: 16px"] {
line-height: 1.2;
margin-bottom: 10px;
}
@-moz-document url-prefix() {
.kol-form-group .kol-radio-label.kol-form-label[style*="font-size: 16px"],
.kol-form-group .kol-checkbox-label.kol-form-label[style*="font-size: 16px"] {
line-height: 1;
}
}
@media (max-width: 767px) {
.kol-form-group .kol-radio-label.kol-form-label[style*="font-size: 16px"],
.kol-form-group .kol-checkbox-label.kol-form-label[style*="font-size: 16px"] {
line-height: 1.7;
margin-bottom: 5px;
}
}
@-moz-document url-prefix() {
@media (max-width: 767px) {
.kol-form-group .kol-radio-label.kol-form-label[style*="font-size: 16px"],
.kol-form-group .kol-checkbox-label.kol-form-label[style*="font-size: 16px"] {
line-height: 1.3;
}
}
}
[data-layout="inline"] .kol-form-group .kol-radio-label.kol-form-label[style*="font-size: 16px"],
[data-layout="inline"] .kol-form-group .kol-checkbox-label.kol-form-label[style*="font-size: 16px"] {
margin-bottom: 0;
}
/* Input */
@media (min-width: 481px) {
[data-layout="inline"] .kol-form-group .kol-radio-label.kol-form-label[style*="font-size: 16px"] .kol-radio-input,
[data-layout="inline"] .kol-form-group .kol-checkbox-label.kol-form-label[style*="font-size: 16px"] .kol-checkbox-input {
bottom: 3px;
}
}
/* Form size 18px */
/* Label */
.kol-form-group .kol-radio-label.kol-form-label[style*="font-size: 18px"],
.kol-form-group .kol-checkbox-label.kol-form-label[style*="font-size: 18px"] {
line-height: 1;
margin-bottom: 15px;
}
@media (max-width: 767px) {
.kol-form-group .kol-radio-label.kol-form-label[style*="font-size: 18px"],
.kol-form-group .kol-checkbox-label.kol-form-label[style*="font-size: 18px"] {
line-height: 1.5;
margin-bottom: 5px;
}
}
@-moz-document url-prefix() {
@media (max-width: 767px) {
.kol-form-group .kol-radio-label.kol-form-label[style*="font-size: 18px"],
.kol-form-group .kol-checkbox-label.kol-form-label[style*="font-size: 18px"] {
line-height: 1.2;
}
}
}
[data-layout="inline"] .kol-form-group .kol-radio-label.kol-form-label[style*="font-size: 18px"],
[data-layout="inline"] .kol-form-group .kol-checkbox-label.kol-form-label[style*="font-size: 18px"] {
margin-bottom: 0;
}
/* Input */
@media (min-width: 481px) {
[data-layout="inline"] .kol-form-group .kol-radio-label.kol-form-label[style*="font-size: 18px"] .kol-radio-input,
[data-layout="inline"] .kol-form-group .kol-checkbox-label.kol-form-label[style*="font-size: 18px"] .kol-checkbox-input {
bottom: 3px;
}
}
@media (max-width: 767px) {
[data-layout="inline"] [data-name="single_checkbox"] > .kol-form-label {
padding-left: 3px;
}
[data-layout="inline"] .kol-form-label {
padding-bottom: 5px;
}
.kol-radio,
.kol-checkbox {
margin-bottom: 0;
}
[data-layout="inline"] .checkbox label {
padding-left: 5px;
}
[data-name="privacy_consent"] .kol-checkbox {
margin-left: 2px;
}
[data-layout="inline"] .kol-checkbox input,
[data-layout="inline"] .kol-radio input {
bottom: 1px;
}
}
@-moz-document url-prefix() {
@media (max-width: 767px) {
[data-name="privacy_consent"] .kol-checkbox {
padding-left: 0 !important;
}
}
}
/* ######## Button Styles ######## */
.kol-form-squared .kol-form-button-row input {
margin-bottom: 1px !important;
border-radius: 1px !important;
}
[class^="kol-btn-"],
[class*=" kol-btn"] {
min-width: 15rem;
}
/* SIZE: Extra Small */
.kol-btn-xs {
height: 26px;
font-size: 12px;
line-height: 10px;
min-width: 12rem;
}
.kol-btn-sharing:hover{
text-decoration: none;
}
/* SIZE: Small */
.kol-btn-sm,
.kol-cta-btn-sm {
height: 30px;
font-size: 12px;
line-height: 15px;
}
.input-sm {
font-size: 12px;
height: 30px;
}
textarea.input-sm {
padding: 1.25rem 1.5rem !important;
}
select.input-sm {
height: 30px;
line-height: normal;
}
/* SIZE: Medium (Default size for most buttons and input fields) */
.kol-btn-md {
height: 36px;
font-size: 14px;
line-height: 20px;
}
.input-md {
font-size: 14px;
height: 36px;
line-height: 36px;
padding: 0px 15px;
min-width: 16rem;
}
select.input-md {
height: 36px;
line-height: 36px;
}
textarea.input-md {
padding: 1.5rem;
line-height: 1.5;
}
/* social sharing button styles */
.kol-share-links .kol-btn {
display: inline-block;
padding: 6px 12px;
margin-bottom: 0;
font-size: 14px;
font-weight: normal;
line-height: 22px;
text-align: center;
white-space: nowrap;
vertical-align: middle;
-ms-touch-action: manipulation;
touch-action: manipulation;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-image: none;
border: 1px solid transparent;
border-radius: 4px;
margin-left: 3px;
margin-right: 3px;
margin-bottom: 3px;
background-color: #394046;
color: #fff !important;
}
.kol-share-btns-sm .kol-btn-sharing {
padding: 8px 10px;
font-size: 13px;
min-width: 4.7rem;
min-height: 3.5rem;
}
.kol-share-btns-sm.kol-share-btns-pill .kol-btn-sharing {
min-height: 4.0rem;
line-height: 2rem;
}
.kol-share-btns-md .kol-share-links .kol-btn-sharing {
padding: 8px 20px;
font-size: 14px;
min-width: 5.6rem;
min-height: 2.4rem;
line-height: 26px;
}
.kol-share-btns-xs .kol-btn-sharing {
padding: 4px 10px;
font-size: 12px;
line-height: 20px;
min-width: 4rem;
min-height: 2rem;
}
.kol-share-btns-xs.kol-share-btns-pill .kol-btn-sharing {
min-height: 4rem;
line-height: 2.9rem;
}
.kol-activities-wrapper .kol-share-btns-md .kol-btn-sharing {
padding: 13px 10px;
background: none !important;
border: 0px !important;
min-width: 0px !important;
margin: 0px !important;
font-size:18px;
}
.kol-share-btns-md.kol-share-btns-pill .kol-share-links .kol-btn-sharing {
min-height: 4.4rem;
line-height: 2.5rem;
}
/* SIZE: Large */
.kol-btn-lg {
height: 44px;
font-size: 15px;
line-height: 36px;
}
/* SIZE: Large */
input.kol-btn-lg, .kol-btn-lg {
line-height: 30px;
}
.input-lg {
font-size: 15px;
height: 44px;
}
textarea.input-lg {
padding: 1rem 1.5rem;
}
select.input-lg {
height: 44px;
line-height: normal;
}
.kol-share-btns-lg .kol-share-links .kol-btn-sharing {
padding: 9px 22px;
font-size: 17px;
min-width: 6.8rem;
min-height: 4.8rem;
line-height: 32px;
}
.kol-share-btns-lg.kol-share-btns-pill .kol-share-links .kol-btn-sharing {
min-height: 4.8rem;
line-height: 3.4rem;
}
/* SIZE: X-Large */
.kol-btn-xlg {
height: 52px;
font-size: 15px;
line-height: 40px;
}
.input-xlg {
height: 52px;
font-size: 15px;
}
select.input-xlg {
height: 52px;
line-height: normal;
}
textarea.input-xlg {
padding: 1.5rem !important;
}
.kol-share-btns-xlg .kol-share-links .kol-btn-sharing {
padding: 9px 22px !important;
font-size: 24px !important;
min-width: 8rem;
min-height: 8rem;
}
.kol-share-btns-xlg.kol-share-btns-pill .kol-share-links .kol-btn-sharing {
min-height: 8rem;
line-height: 4rem;
}
/* SIZE: XX-Large */
.kol-btn-xxlg {
height: 60px;
font-size: 15px;
line-height: 44px;
}
.input-xxlg {
font-size: 15px;
height: 60px;
}
select.input-xxlg {
height: 60px;
line-height: normal;
font-size: 15px;
}
.kol-share-btns-xxlg .kol-btn-sharing {
padding: 24px 28px !important;
font-size: 24px !important;
min-width: 8rem;
min-height: 8rem;
}
.kol-share-btns-xxlg.kol-share-btns-pill .kol-share-links .kol-btn-sharing {
min-height: 8rem;
line-height: 4rem;
}
/* ########################## */
/* Viral Snippet Styles */
/* ########################## */
/* Friendly Greeting Styles Below */
/* Facebook Feed */
/* Point Tracker */
/* ############################## */
/* START: REFERRAL TRACKER STYLES */
/* ############################## */
.referral-tracker-rewards .reward-level-text {
font-size: 18px;
width: 50px;
height: 50px;
border-radius: 100px;
display: inline-block;
background-color: #AFB1B3;
color: #fff;
text-align: center;
line-height: 50px;
z-index: 9;
position: relative;
}
.reward-earned.reward-level-text {
background-color: #4A90E2;
color: white;
}
.reward-level-0 .left-handle {
display: none;
}
.reward-level-last .right-handle {
display: none !important;
}
.referral-tracker .left-handle,
.referral-tracker .right-handle {
top: 20px;
height: 10px;
z-index: 5;
background: #AFB1B3;
position: absolute;
width: 50%;
}
.referral-tracker .left-handle {
left: 0;
}
.referral-tracker .right-handle {
left: 50%;
}
.reward-earned .left-handle .progress-bar {
background-color: #4A90E2;
height: 10px;
width: 100%;
}
.reward-earned.reward-level.reward-right .right-handle .progress-bar {
background-color: #4A90E2;
height: 10px;
width: 100%;
}
/* Base Styles */
.referral-tracker {
display: none;
margin: 20px auto;
}
/* Prize Row Styles */
.referral-tracker-prizes {
margin-top: 10px;
}
.referral-tracker .reward-level-prize {
background-color: #AFB1B3;
padding: 15px;
border-top-right-radius: 3px;
border-top-left-radius: 3px;
}
.referral-tracker .reward-level-prize::before {
content: " ";
border: 0;
border-bottom: 20px solid #AFB1B3;
border-left: 20px solid transparent;
border-right: 20px solid transparent;
position: absolute;
display: inline-block;
top: -15px;
left: 50%;
transform: translateX(-50%);
}
.referral-tracker .prize-vertical .reward-level-prize::before {
content: " ";
transform: rotate(-90deg);
display: inline-block;
top: 15px;
left: -8px;
position: absolute;
}
@media screen and (max-width: 767px) {
.referral-tracker .referral-tracker-prizes {
margin: 20px auto;
}
}
.referral-tracker-vertical .left-handle {
height:100%;
width: 10px;
left: 50%;
top: -30px;
transform: translateX(-50%);
display: none;
}
.referral-tracker-vertical .right-handle {
height: 100%;
width: 10px;
left: 50%;
transform: translateX(-50%);
top: 2px;
}
.kol-referral-tracker {
animation-name: fadeIn;
animation-duration: 1s;
}
.kol-referral-tracker .referral-tracker-prizes {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.kol-referral-tracker .tracker-style-classic.referral-tracker-prizes.force-vertical-false {
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
}
.kol-referral-tracker .referral-tracker-prizes .reward-level-prize {
height: 100%;
}
.kol-referral-tracker .progress-bar{
background-color: #00a4d1;
}
.kol-reward-level-thanks.kol-referral-tracker .reward-level-prize{
background-color: #E5E5E5;
color: #333333;
}
.kol-reward-level-thanks.kol-referral-tracker .reward-level-prize::before {
border-bottom-color: #E5E5E5;
}
.kol-reward-level-thanks.kol-referral-tracker .reward-level-text:not(.reward-earned) {
background-color: #E5E5E5;
color: #333333;
}
@keyframes fadeIn {
0%{opacity: 0;}
66%{opacity: 0;}
100%{opacity: 1;}
}
.referral-tracker,
.kol-referral-tracker {
opacity: 1;
display: block;
}
/* Classic Vertical Reward Tracker Styles */
.tracker-style-classic.referral-tracker-rewards {
margin: 20px -15px;
}
.kol-referral-tracker.referral-tracker-vertical .referral-tracker-rewards {
display: -ms-grid;
display: grid;
grid-template-columns: 80px 1fr;
}
.kol-referral-tracker.referral-tracker-vertical .reward-earned {
width: 100%;
}
.referral-tracker .left-handle,
.referral-tracker .right-handle {
background-color: #AFB1B3;
}
/* New Classic Referral Tracker Styles */
@media (max-width: 767px) {
.kol-referral-tracker .tracker-style-classic.referral-tracker-prizes {
display: block;
}
}
.kol-referral-tracker .tracker-style-classic.referral-tracker-prizes .progress-bar,
.kol-referral-tracker .tracker-style-classic.referral-tracker-prizes .reward-prize-box-status {
display: flex;
justify-content: space-between;
}
@media (min-width: 768px) {
.kol-referral-tracker .tracker-style-classic.referral-tracker-prizes .progress-bar,
.kol-referral-tracker .tracker-style-classic.referral-tracker-prizes .reward-prize-box-status {
display: none;
}
}
@media (max-width: 767px) {
.kol-referral-tracker .tracker-style-classic .reward-level-prize-container {
margin: 2rem 0 4rem;
}
.kol-referral-tracker .tracker-style-classic.referral-tracker-rewards {
display: none;
}
.kol-referral-tracker .tracker-style-classic .reward-level-prize::before {
display: none;
}
.kol-referral-tracker .tracker-style-classic .reward-prize-box-progress {
height: 4px;
}
}
.kol-referral-tracker .tracker-style-classic .progress-bar {
border-top-left-radius: 2px;
border-top-right-radius: 2px;
}
.kol-referral-tracker .tracker-style-classic .reward-points-text {
line-height: 50px;
font-size: 1.5rem;
font-weight: bold;
padding-left: 1.5rem;
}
.kol-referral-tracker .tracker-style-classic .reward-points-visual {
padding-right: 0.25rem;
}
.kol-referral-tracker .tracker-style-classic .goal-complete .lock {
display: none;
}
.kol-referral-tracker .tracker-style-classic .goal-not-complete .check {
display: none;
}
/* Force Vertical */
.kol-referral-tracker .tracker-style-classic.referral-tracker-prizes.force-vertical-true {
display: block;
}
.kol-referral-tracker .tracker-style-classic.referral-tracker-prizes.force-vertical-true .progress-bar,
.kol-referral-tracker .tracker-style-classic.referral-tracker-prizes.force-vertical-true .reward-prize-box-status {
display: flex;
justify-content: space-between;
}
.kol-referral-tracker .tracker-style-classic.referral-tracker-rewards.force-vertical-true,
.kol-referral-tracker .tracker-style-classic.referral-tracker-prizes.force-vertical-true .reward-level-prize::before {
display: none;
}
.kol-referral-tracker .tracker-style-classic.force-vertical-true .reward-prize-box-progress {
height: 4px;
}
.kol-referral-tracker .tracker-style-classic.force-vertical-true .reward-level-prize-container {
width: 100% !important;
}
.kol-referral-tracker .tracker-style-classic.force-vertical-true .reward-level-prize-container {
margin: 2rem 0 4rem;
}
/* Minimal Referral Tracker Styles */
.kol-referral-tracker .tracker-style-minimal .reward-wrapper {
display: flex;
text-align: center;
}
.kol-referral-tracker .tracker-style-minimal .reward {
flex: 1;
width: 25px;
height: 25px;
position: relative;
height: 5px;
z-index: 1;
}
.kol-referral-tracker .tracker-style-minimal .reward span {
display: block;
margin-left: auto;
margin-right: auto;
margin-top: -10px;
width: 25px;
height: 25px;
border-radius: 50%;
}
.kol-referral-tracker .tracker-style-minimal .reward .left-handle,
.kol-referral-tracker .tracker-style-minimal .reward .right-handle {
height: 5px;
position: absolute;
top: 0;
width: 50%;
z-index: -1;
}
.kol-referral-tracker .tracker-style-minimal .reward .left-handle {
left: 0;
}
.kol-referral-tracker .tracker-style-minimal .reward .right-handle {
left: 50%;
}
.kol-referral-tracker .tracker-style-minimal .reward:first-of-type .left-handle {
background: transparent !important;
}
.kol-referral-tracker .tracker-style-minimal .reward:last-of-type .right-handle {
background: transparent !important;
}
.kol-referral-tracker .tracker-style-minimal .reward .progress-bar {
height: 5px;
}
.kol-referral-tracker .tracker-style-minimal .reward:first-of-type .left-handle .progress-bar,
.kol-referral-tracker .tracker-style-minimal .reward:last-of-type .right-handle .progress-bar {
background: transparent;
}
.kol-referral-tracker .tracker-style-minimal .reward p {
font-size: 21px;
margin-top: .75rem;
}
.kol-referral-tracker .tracker-style-minimal .reward-text {
margin: 6rem auto 0;
text-align: left;
}
@media (min-width: 768px) {
.kol-referral-tracker .tracker-style-minimal .reward-text {
max-width: 88%;
}
}
.kol-referral-tracker .tracker-style-minimal .reward-text .text {
margin-bottom: 1.5rem;
margin-top: 1rem;
display: flex;
padding-left: 15px;
padding-right: 15px;
align-items: center;
}
.kol-referral-tracker .tracker-style-minimal .reward-text p {
display: inline-block;
}
.kol-referral-tracker .tracker-style-minimal .reward-text .number {
position: relative;
margin-right: 15px;
font-weight: bold;
min-width: 60px;
font-size: 21px;
}
.kol-referral-tracker .tracker-style-minimal.force-vertical-false .reward-text .number {
text-align: right;
}
.kol-referral-tracker .tracker-style-minimal .reward-text .number span {
display: inline-block;
margin-left: 5px;
margin-bottom: 4px;
height: 8px;
width: 8px;
border-radius: 50%;
}
/* Modern Referral Tracker Styles */
.kol-referral-tracker .tracker-style-modern .reward-level-prize::before {
display:none;
}
.kol-referral-tracker .tracker-style-modern {
margin: 1rem -15px 0 -15px;
}
.kol-referral-tracker .tracker-style-modern .reward-level {
display: -ms-grid;
display: grid;
grid-template-rows: 0px 1fr 4px 40px;
box-shadow: 0 1px 3px rgba(0,0,0,.12), 0 1px 2px rgba(0,0,0,.24);
border-radius: 4px;
position: relative;
padding: 0;
flex: 1 1 150px;
margin: 2.0rem 1.5rem;
}
.kol-referral-tracker .tracker-style-modern.reward-levels-6 .reward-level{
flex: 1 1 225px;
margin: 2.75rem 1.5rem;
}
.kol-referral-tracker .tracker-style-modern.reward-levels-6 {
flex-wrap: wrap;
}
.kol-referral-tracker .tracker-style-modern.force-vertical-true .reward-level {
flex: auto;
}
.kol-referral-tracker .tracker-style-modern .modern-prize-box-progress,
.kol-referral-tracker .tracker-style-modern .modern-prize-box-progress .progress-bar {
height: 6px;
}
.kol-referral-tracker .tracker-style-modern .reward-earned .lock {
display: none;
}
.kol-referral-tracker .tracker-style-modern .reward-not-earned .check {
display: none;
}
.kol-referral-tracker .tracker-style-modern .check,
.kol-referral-tracker .tracker-style-modern .lock {
height: 50px;
width: 50px;
line-height: 40px;
top: -25px;
display: inline-block;
border-radius: 50%;
position: absolute;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
text-align: center;
}
.kol-referral-tracker .tracker-style-modern .check {
background: hsl(156, 54%, 55%);
line-height: 56px;
}
.kol-referral-tracker .tracker-style-modern .lock {
background: hsl(210, 3%, 69%);
line-height: 61px;
}
.kol-referral-tracker .tracker-style-modern .content-wrapper {
padding: 33px 15px 10px 15px;
}
.kol-referral-tracker .tracker-style-modern .points {
display: block;
text-align: center;
background: hsl(0, 0%, 96%);
font-weight: 700;
padding: 7px;
font-weight: 400;
font-size: 1.5rem;
text-transform: uppercase;
letter-spacing: .5px;
height: 40px;
}
.kol-referral-tracker .tracker-style-modern .points .reward-progress {
height: 3px;
background: hsl(156, 54%, 55%);
margin-bottom: 15px;
}
@media (max-width: 768px) {
.kol-referral-tracker .tracker-style-modern .check,
.kol-referral-tracker .tracker-style-modern .lock {
transform: scale(.70) translateX(-50px);
}
.kol-referral-tracker .tracker-style-modern .content-wrapper {
padding: 24px 10px 0px 10px;
font-size: 14px;
}
.kol-referral-tracker .tracker-style-modern .reward-level {
grid-template-rows: 0px 1fr 2px 30px;
}
.kol-referral-tracker .tracker-style-modern .modern-prize-box-progress,
.kol-referral-tracker .tracker-style-modern .modern-prize-box-progress .progress-bar {
height: 3px;
}
.kol-referral-tracker .tracker-style-modern .points {
font-size: 12px;
height: 30px;
padding:5px;
}
}
/* Force Vertical */
.kol-referral-tracker .tracker-style-modern.force-vertical-true {
flex-direction: column;
}
/* One Goal */
.one-goal-wrapper {
animation-name: fadeIn;
animation-duration: 1s;
}
@keyframes fadeIn {
0%{opacity: 0}
66%{opacity: 0}
100%{opacity: 0}
}
.one-goal-tracker-wrapper {
padding-bottom:3rem;
}
.one-goal-tracker-wrapper svg {
position: relative;
}
.one-goal-tracker-wrapper span {
position: absolute;
top: -17px;
font-size: 3rem;
}
.one-goal-tracker-wrapper span.start {
left: -7px;
}
.one-goal-tracker-wrapper div.earned-wrapper {
position: absolute;
height: 6px;
top: 7px;
border-radius: 5px;
transition: 1.5s ease all;
transition-delay: .5s;
}
.one-goal-tracker-wrapper span.earned {
right: 0;
height: 5rem;
width: 5rem;
top: -22px;
background: #ffffff;
border-radius: 50%;
text-align: center;
line-height: 4.5rem;
}
.one-goal-tracker-wrapper span.goal {
right: -24px;
}
@media (max-width: 768px) {
.one-goal-responsive-wrapper {
width: 85%;
margin-left:auto;
margin-right:auto;
}
}
/* Simplified One Goal Tracker */
.simple-one-goal-tracker-wrapper {
position: relative;
padding: 1rem 0 .25rem;
}
.simple-one-goal-tracker-wrapper .one-goal-bg,
.simple-one-goal-tracker-wrapper .one-goal-position {
position: absolute;
top: 0;
left: 0;
height: 10px;
}
.simple-one-goal-tracker-wrapper .one-goal-bg {
width: 100%;
background:#e5e5e5;
z-index: 1;
border-radius: 10px;
}
.simple-one-goal-tracker-wrapper .one-goal-position {
width: 70%;
background: #4eca98;
z-index: 2;
border-top-left-radius: 10px;
border-bottom-left-radius: 10px;
}
.simple-one-goal-tracker-wrapper .one-goal-position.goal-accomplished {
border-radius: 10px;
}
.one-goal-wrapper .one-goal-text {
font-size: 2.5rem;
}
/* Circular One Goal */
.one-goal-circle-wrapper {
background: hsl(0, 0%, 90%);
border-radius: 50%;
margin: 0 auto;
}
.one-goal-circle-wrapper.lg {
width: 300px;
height: 300px;
}
.one-goal-circle-wrapper.sm {
width: 150px;
height: 150px;
}
.is-align-center .one-goal-circle-wrapper {
margin: 0 auto;
}
.is-align-left .one-goal-circle-wrapper {
margin: 0 auto 0 0;
}
.is-align-right .one-goal-circle-wrapper {
margin: 0 0 0 auto;
}
.one-goal-circle-wrapper .fill,
.one-goal-circle-wrapper .mask {
position: absolute;
border-radius: 50%;
transition: transform 1s;
}
.one-goal-circle-wrapper.lg .fill,
.one-goal-circle-wrapper.lg .mask {
width: 300px;
height: 300px;
}
.one-goal-circle-wrapper.sm .fill,
.one-goal-circle-wrapper.sm .mask {
width: 150px;
height: 150px;
}
.one-goal-circle-wrapper.lg .mask {
clip: rect(0px, 300px, 300px, 150px);
}
.one-goal-circle-wrapper.sm .mask {
clip: rect(0px, 150px, 150px, 75px);
}
.one-goal-circle-wrapper.lg .fill {
background: hsl(290, 91%, 50%);
clip: rect(0px, 150px, 300px, 0px);
}
.one-goal-circle-wrapper.sm .fill {
background: hsl(290, 91%, 50%);
clip: rect(0px, 75px, 150px, 0px);
}
.one-goal-circle-wrapper.lg .mask.full {
clip: rect(0px, 300px, 300px, 150px);
}
.one-goal-circle-wrapper.sm .mask.full {
clip: rect(0px, 150px, 150px, 75px);
}
.one-goal-circle-wrapper .fill,
.one-goal-circle-wrapper .mask.full,
.one-goal-circle-wrapper .mask.fix {
transform: rotate(150deg);
}
.one-goal-circle-wrapper .goal {
position: absolute;
border-radius: 50%;
background: hsl(0, 0%, 95%);
display: grid;
place-items: center;
}
.one-goal-circle-wrapper.lg .goal {
height:280px;
width: 280px;
margin-left: 10px;
margin-top: 10px;
}
.one-goal-circle-wrapper.sm .goal {
height:136px;
width: 136px;
margin-left: 7px;
margin-top: 7px;
}
.one-goal-circle-wrapper .goal p {
text-align: center;
}
.one-goal-circle-wrapper.lg .goal p {
font-size: 50px;
}
.one-goal-circle-wrapper.sm .goal p {
font-size: 25px;
margin-bottom: 0;
}
.one-goal-circle-wrapper .goal p span.point-type {
display: block;
letter-spacing: 3px;
}
.one-goal-circle-wrapper.lg .goal p span.point-type {
font-size: 33px;
}
.one-goal-circle-wrapper.sm .goal p span.point-type {
font-size: 15px;
}
/* ########################## */
/* Old Score Box Editor */
/* ########################## */
.friend-count{
display: block;
text-align: center;
position: relative;
height: auto;
text-align: center;
margin-bottom: 20px;
/* margin-top: -100px; */
animation-name: fadeIn;
animation-duration: 1s;
}
.friend-count .fa{
display: none;
}
.friend-count .referred{
font-weight: 900;
font-size: 80px;
width: 160px;
height: 160px;
display: block;
text-align: center;
margin: 0 auto;
border: 6px solid #0094bd;
line-height: 124px;
border-radius: 50%;
color: #0094bd;
position: relative;
background: #fff;
box-shadow:0 0 2px 10px #fff;
}
.friend-count .referred:after{
content: 'points';
clear: both;
display: block !important;
font-size: 18px;
top: 0;
position: absolute;
text-align: center !important;
width: 100%;
margin-top: 54px;
font-weight: 900;
}
.referred-number {
font-weight: 900;
font-size: 80px;
width: 160px;
height: 160px;
display: block;
text-align: center;
margin: 0 auto;
line-height: 124px;
border-radius: 50%;
position: relative;
border-width: 5px;
border-style: solid;
border-color: #0094bd;
color: #0094bd;
background-color: #fff;
}
.referred-number.square {
border-radius: 0px;
}
.referred-number.rounded {
border-radius: 5px;
}
.referred-number .referred-label{
clear: both;
display: block !important;
font-size: 18px;
position: absolute;
text-align: center !important;
width: 100%;
font-weight: 900;
overflow: hidden;
top: 70%;
line-height: 1em;
}
/* ########################## */
/* New Score Box Editor */
/* ########################## */
.kol-score-counter {
animation-name: fadeIn;
animation-duration: 1s;
display: inline-block;
text-align: center;
margin: 0 auto;
border-width: 5px;
border-style: solid;
border-color: rgb(163, 152, 109);
background: white;
}
.kol-score-counter.circular {
border-radius: 80px;
}
.kol-score-counter.square {
border-radius: 0px;
}
.kol-score-counter.rounded {
border-radius: 8px;
}
.kol-score-counter .score {
padding: 2rem 4rem;
}
.kol-score-counter .score-points {
font-weight: 900;
line-height: 72px;
color: #333333;
}
.kol-score-counter .score-text {
font-weight: 900;
}
.is-align-left .kol-score-counter {
margin-left: 0;
}
.is-align-right .kol-score-counter {
margin-right: 0;
}
/* Leaderboard */
.kol-leaderboard {
animation-name: fadeIn;
animation-duration: 1s;
}
.kol-leaderboard table {
margin-bottom: 0;
}
.kol-leaderboard td,
.kol-leaderboard th {
border-bottom: none;
/* override bootstrap */
vertical-align: middle !important;
padding: 12px !important;
border-top: none !important;
}
/* override bootstrap */
.kol-leaderboard.table-hover>tbody>tr:hover {
background-color: inherit;
}
/* ########################## */
/* Default Leaderboard Styles */
/* ########################## */
.kickofflabs_leaderboard_standard_template tr:nth-of-type(odd) {
background-color: #F5F5F5;
}
/* ########################## */
/* Minimal Leaderboard Styles */
/* ########################## */
.kickofflabs_leaderboard_minimal_template td,
.kickofflabs_leaderboard_minimal_template th {
padding: 16px !important;
font-size: 150%;
}
.kickofflabs_leaderboard_minimal_template tr:nth-of-type(odd) {
background-color: transparent !important;
}
.kickofflabs_leaderboard_minimal_template th.rank,
.kickofflabs_leaderboard_minimal_template td.rank {
width: 5%;
}
.kickofflabs_leaderboard_minimal_template th.user,
.kickofflabs_leaderboard_minimal_template td.user {
text-align: right;
}
/* ###################################### */
/* Minimal with Avatar Leaderboard Styles */
/* ###################################### */
.kickofflabs_leaderboard_minimal_avatar_template td,
.kickofflabs_leaderboard_minimal_avatar_template th {
padding: 10px 14px !important;
font-size: 150%;
vertical-align: middle;
}
.kickofflabs_leaderboard_minimal_avatar_template tr:nth-of-type(odd) {
background-color: transparent !important;
}
.kickofflabs_leaderboard_minimal_avatar_template th.avatar img,
.kickofflabs_leaderboard_minimal_avatar_template td.avatar img {
border-radius: 50%;
border: 1px solid #E4E4E5;
padding: 2px;
margin: 10px auto;
display: block;
height: 55px;
}
.kickofflabs_leaderboard_minimal_avatar_template th.avatar,
.kickofflabs_leaderboard_minimal_avatar_template td.avatar {
width: 22%;
}
.kickofflabs_leaderboard_minimal_avatar_template th.rank-score,
.kickofflabs_leaderboard_minimal_avatar_template td.rank-score {
text-align: center;
width: 30%;
}
.kickofflabs_leaderboard_minimal_avatar_template th.user,
.kickofflabs_leaderboard_minimal_avatar_template td.user {
text-align: right;
}
/* ######################################### */
/* Minimal Avatar Compact Leaderboard Styles */
/* ######################################### */
.kickofflabs_leaderboard_minimal_avatar_compact_template td,
.kickofflabs_leaderboard_minimal_avatar_compact_template th {
padding: 2px !important;
font-size: 150%;
vertical-align: middle;
}
.kickofflabs_leaderboard_minimal_avatar_compact_template tr:nth-of-type(odd) {
background-color: transparent !important;
}
.kickofflabs_leaderboard_minimal_avatar_compact_template th.avatar img,
.kickofflabs_leaderboard_minimal_avatar_compact_template td.avatar img {
border-radius: 50%;
border: 1px solid #E4E4E5;
padding: 2px;
margin: 10px auto;
display: block;
height: 40px;
}
.kickofflabs_leaderboard_minimal_avatar_compact_template th.avatar,
.kickofflabs_leaderboard_minimal_avatar_compact_template td.avatar {
width: 16%;
}
.kickofflabs_leaderboard_minimal_avatar_compact_template th.rank,
.kickofflabs_leaderboard_minimal_avatar_compact_template td.rank {
width: 10%;
font-weight: bold;
max-width: 12px;
}
.kickofflabs_leaderboard_minimal_avatar_compact_template th.score,
.kickofflabs_leaderboard_minimal_avatar_compact_template td.score {
font-size: 100%;
}
.kickofflabs_leaderboard_minimal_avatar_compact_template th.user,
.kickofflabs_leaderboard_minimal_avatar_compact_template td.user {
text-align: right;
font-size: 100%;
}
/* Contest Rank (waitlist) */
.kol-waitlist {
animation-name: fadeIn;
animation-duration: 1s;
}
.kol-waitlist .ticket {
background-color: #f4f4f4;
color: #676A6D;
padding-top: 1rem;
padding-bottom: 1rem;
border: 1px solid transparent;
border-radius: 4px;
}
.kol-waitlist .ticket-container {
float: left;
padding-left: 1.5rem;
padding-right: 1.5rem;
text-align: center;
}
.kol-waitlist .ticket h1 {
margin-top: 0rem;
margin-bottom: 0px;
}
.kol-waitlist .ticket p {
margin-top: 0rem;
margin-bottom: 0px;
}
/* Contest Rank Boxes (waitlist) */
.kol-rank-boxes {
animation-name: fadeIn;
animation-duration: 1s;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.kol-rank-boxes .ticket-container {
margin-right: 2rem;
}
.kol-rank-boxes .ticket-container.visible {
margin-right: 3rem;
padding-right: 0rem;
}
.kol-rank-boxes .ticket-container.last-visible {
margin-right: 0rem;
padding-right: 0rem;
}
.is-boxed-rank.kol-rank-boxes .ticket {
background-color: #f4f4f4;
padding-top: 1rem;
padding-bottom: 1rem;
padding-left: 1rem;
padding-right: 1rem;
border: 1px solid transparent;
border-radius: 4px;
}
.kol-rank-boxes .ticket p {
margin-top: 0rem;
margin-bottom: 0px;
}
@media (max-width: 480px) {
.kol-rank-boxes .ticket-container.visible {
margin-right: 1rem;
padding-right: 0rem;
}
}
/* Referral Points */
/* Refer a Friend Buttons Styles Below */
.kol-share-links-wrapper, .kol-share-links-wrapper.text-center {
text-align: center;
}
.kol-share-links-wrapper.text-left {
text-align: left;
}
.kol-share-links-wrapper.text-right {
text-align: right;
}
.kol-share-links-wrapper.text-half-width #kol_share_links {
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.kol-share-links-wrapper.text-half-width .kol-social-share-link {
-ms-flex: 1 1 200px;
flex: 1 1 200px;
}
.kol-share-links-wrapper.text-full-width .kol-social-share-link {
display: block;
}
.kol-share-links-wrapper .share_button:hover {
text-decoration: none;
}
.kol-social-share-link:focus{
text-decoration: none;
}
.kol-share-btns-rounded .kol-btn-sharing,
.kol-share-btns-rounded .has-set-radius {
-moz-border-radius: 4px !important;
-webkit-border-radius: 4px !important;
border-radius: 4px !important;
}
.kol-share-btns-pill .kol-btn-sharing,
.kol-share-btns-pill .has-set-radius {
-moz-border-radius: 50px !important;
-webkit-border-radius: 50px !important;
border-radius: 50px !important;
}
.kol-share-btns-square .kol-btn-sharing,
.kol-share-btns-square .has-set-radius {
-moz-border-radius: 0px !important;
-webkit-border-radius: 0px !important;
border-radius: 0px !important;
}
/* Copy & Paste to Share */
input.form-control-appended, textarea.form-control-appended, select.form-control-appended, .form-control-appended {
margin-bottom: 0 !important;
}
.kol-copy-and-paste-sharelink-container {
max-width: 450px;
}
.kol-copy-and-paste-sharelink {
border: 1px solid rgb(204, 204, 204);
background-color: #fff;
color: #4a4a4a;
line-height: 14px;
}
/* Start: Sizes */
.kol-copy-and-paste-sharelink-container.kol-share-btns-sm input {
padding: 9px 20px 9px;
font-size: 13px;
height: 36px;
}
.kol-copy-and-paste-sharelink-container.kol-share-btns-sm .kol-copy-and-paste-icon {
height: 36px;
font-size: 15px;
}
.kol-copy-and-paste-sharelink-container.kol-share-btns-md input {
padding: 12px 20px 13px;
font-size: 14px;
height: 44px;
}
.kol-copy-and-paste-sharelink-container.kol-share-btns-md .kol-copy-and-paste-icon {
height: 44px;
font-size: 16px;
padding-left: 15px;
padding-right: 15px;
}
.kol-copy-and-paste-sharelink-container.kol-share-btns-lg input {
padding: 16px 20px 17px;
font-size: 15px;
height: 52px;
}
.kol-copy-and-paste-sharelink-container.kol-share-btns-lg .kol-copy-and-paste-icon {
height: 52px;
font-size: 18px;
padding-left: 20px;
padding-right: 20px;
}
/* End: Sizes */
/* Start: Alignment */
.kol-copy-and-paste-sharelink-container.kol-center {
margin-right: auto;
margin-left: auto;
}
.kol-copy-and-paste-sharelink-container.kol-right{
margin-right: 0;
margin-left: auto;
}
.kol-copy-and-paste-sharelink-container.kol-left{
margin-right: auto;
margin-left: 0;
}
.kol-copy-and-paste-sharelink-container.kol-full{
margin-right: auto;
margin-left: auto;
display: block;
}
.kol-copy-and-paste-sharelink-container.kol-full .kol-copy-and-paste-icon {
width: 100%;
margin-left: 0 !important;
margin-top: 3px;
}
/* End: Alignment */
.kol-copy-and-paste-icon {
background-color: #2095F2;
text-align: center;
color: #fff;
line-height: 14px;
border: 1px solid #2095F2;
margin-left: 5px !important;
}
.kol-copy-and-paste-icon:hover {
color: #fff;
}
.kol-copy-and-paste-icon i {
display: block;
}
.kol-hidden-copy-and-paste input {
text-align: center;
}
.is-content-500 .col-sm-offset-2[data-kol-editor="copy-and-paste"] {
margin-left: 5%;
width: 90%;
}
@media (max-width: 414px) {
.is-content-500 .col-sm-offset-2[data-kol-editor="copy-and-paste"] {
margin-left: 0;
width: 100%;
}
}
.is-content-380 .col-sm-offset-2[data-kol-editor="copy-and-paste"] {
margin-left: 0;
width: 100%;
}
.kol-activities-wrapper .kol-copy-and-paste-sharelink-container{
display: inherit;
margin: 10px auto;
max-width: 300px;
}
.kol-activities-wrapper .kol-copy-and-paste-sharelink-container .kol-copy-and-paste-sharelink{
display: inherit;
float:none;
padding: 9px 50px 9px 10px;
border: 2px solid #F3F3F3;
background-color: #F3F3F3;
pointer-events:none;
}
.kol-activities-wrapper .kol-copy-and-paste-sharelink-container .kol-copy-and-paste-sharelink:focus{
box-shadow: none !important;
}
.kol-activities-wrapper .kol-copy-and-paste-sharelink-container .input-group-btn {
position: absolute;
top: 0px;
right: 0px;
width:auto;
z-index: 3;
}
.kol-activities-wrapper .kol-copy-and-paste-sharelink-container .kol-copy-and-paste-icon{
border: 1px solid #F3F3F3;
background-color: #F3F3F3;
color: #333333
}
/* Facebook Like, Twitter Follow, Google +, LinkedIn Share all under Socialite styles here: */
.socialite-network-center .socialite-live,
.socialite-live {
text-align: center;
}
.socialite-network-left .socialite-live {
text-align: left;
}
.socialite-network-right .socialite-live {
text-align: right;
}
.kol-socialite-container {
max-width: 400px;
margin: auto;
}
.socialite-panel {
display: none;
padding-top: 15px;
padding-bottom: 15px;
border-left: 1px solid #e6e6e6;
border-right: 1px solid #e6e6e6;
border-bottom: 1px solid #e6e6e6;
margin-top: -1px;
background-color: #fff;
}
.socialite-row .btn-facebook,
.socialite-row .btn-twitter,
.socialite-row .btn-google-plus,
.socialite-row .btn-linkedin,
.socialite-row .btn-instagram,
.socialite-row .btn-youtube,
.socialite-row .btn-apps {
padding-top: 16px;
padding-bottom: 16px;
color: #fff !important;
}
/*added to force Facebook to Show Up */
.kol-socialite-container .fb_iframe_widget span,
.kol-socialite-container iframe.fb_iframe_widget_lift,
.kol-socialite-container .fb_iframe_widget iframe {
width:60px !important;
height:40px !important;
position:relative;
}
.socialite-row .btn-facebook .fa.fa-facebook,
.socialite-row .btn-twitter .fa.fa-twitter,
.socialite-row .btn-google-plus .fa.fa-google-plus,
.socialite-row .btn-linkedin .fa.fa-linkedin,
.socialite-row .btn-instagram .fa.fa-instagram,
.socialite-row .btn-youtube .fa.fa-youtube,
.socialite-row .btn-apps .fa.fa-download
{
margin-right: 15px;
display: inline-block;
}
.youtube-follow-container .inline-socialite > div:not(.clearfix),
.youtube-follow-container .inline-socialite,
.youtube-follow-container .inline-socialite iframe {
height: 50px !important;
min-height: 50px;
text-align: center !important;
width: auto !important;
margin: auto !important;
max-width: 200px;
}
.inline-socialite {
display: inline-block;
margin: auto;
}
.kol-instagram-follow-btn {
display: block;
width: 100%;
max-width: 500px;
margin: auto;
}
.kol-instagram-follow-name {
padding: 10px 30px;
border: 1px solid #dedede;
border-radius: 3px 0 0 3px;
display: inline-block;
font-size: 10pt;
line-height: 10pt;
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
}
.kol-instagram-follow-link {
padding: 10px 30px;
color: #fff;
background-color: #3897f0;
border: 1px solid #3897f0;
border-radius: 0 3px 3px 0;
font-size: 10pt;
text-transform: uppercase;
line-height: 10pt;
display: inline-block;
text-decoration: none !important;
margin-left: -5px;
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,"Helvetica Neue",sans-serif;
}
.kol-instagram-follow-link:hover,
.kol-instagram-follow-link:active,
.kol-instagram-follow-link:visited,
.kol-instagram-follow-link:active:focus,
.kol-instagram-follow-link:focus{
padding: 10px 30px;
color: #fff !important;
background-color: #318ce2 !important;
text-decoration: none !important;
}
@media screen and (max-width: 480px) {
.kol-editable-section {
background-attachment: scroll !important;
}
}
/* ############################### */
/* FRIENDLY GREETING STYLES */
/* ############################### */
.referred-by-box {
background-color: rgba(89, 204, 152, 1);
border-radius: 0;
display: none;
text-align: center;
margin: auto;
position: relative;
}
.referred-by-full .referred-by-box{
width: 100%;
}
.referred-by-half .referred-by-box{
width: 50%;
margin: auto;
}
.referred-by-three-fourths .referred-by-box{
width: 75%;
margin: auto;
}
.referred-by-one-fourth .referred-by-box{
width: 25%;
margin: auto;
}
.referred-by-box #avatar {
border-color: rgba(74, 194, 140, 1);
border-width: 7px;
border-style: solid;
}
.referred-by-rounded-box .referred-by-box{
border-radius: 4px;
}
.referred-by-cache {
display: none !important;
}
.referred-by-box h3 {
color: rgba(255, 255, 255, 1);
}
.referred-by-box #avatar,
.image-center .referred-by-box #avatar {
max-width: 70px;
}
.image-none .referred-by-box #avatar {
display: none;
}
/* Image Left & Right */
.image-left .referred-by-box, .image-right .referred-by-box {
text-align: center;
}
.image-left .referred-by-box .content-wrapper, .image-right .referred-by-box .content-wrapper {
display: inline-block;
padding-top: 25px;
}
.image-left .referred-by-box #avatar {
margin-right: 2rem;
float: left;
transform: translateY(-33%);
}
.image-right .referred-by-box #avatar {
margin-left: 2rem;
float: right;
transform: translateY(-33%);
}
.image-left .referred-by-box h3, .image-right .referred-by-box h3 {
display: inline;
}
@media (max-width: 767px) {
.image-left .referred-by-box #avatar, .image-right .referred-by-box #avatar {
float: none;
transform: none;
margin-left:auto;
margin-right:auto;
}
.image-left .referred-by-box h3, .image-right .referred-by-box h3 {
display: block;
}
}
/* Responsive Styles for Small Referred by Boxes */
@media (max-width: 992px) {
.referred-by-one-fourth .referred-by-box {
width: 40%;
}
.referred-by-half .referred-by-box {
width: 60%;
}
.referred-by-three-fourths .referred-by-box {
width: 80%;
}
}
@media (max-width: 767px) {
.referred-by-one-fourth .referred-by-box {
width: 50%;
}
.referred-by-half .referred-by-box {
width: 65%;
}
.referred-by-three-fourths .referred-by-box {
width: 85%;
}
}
@media (max-width: 480px) {
.referred-by-one-fourth .referred-by-box, .referred-by-half .referred-by-box, .referred-by-three-fourths .referred-by-box {
width: 100%;
}
}
/* ############################## */
/* Icon Stuff */
/* ############################## */
.ui-draggable .kol-icon-container:hover {
outline: 1px solid #2095F2; /* $blue */
cursor: pointer;
}
.kol-container-background-rounded,
.kol-container-background-circle,
.kol-container-background-square
{
position: relative;
display: inline-block;
height: calc(1.5em * 2);
width: calc(1.5em * 2);
}
/*hack for icon done between 2/14 and 3/18 */
.kol-icon.kol-icon-background-circle,
.kol-icon.kol-icon-background-square,
.kol-icon.kol-icon-background-rounded
{
position: relative;
transform: none;
border-radius: 50%;
padding: 24px;
width: 100%;
height: 100%;
text-align: center;
}
/* end hack */
.kol-container-background-circle .kol-icon.kol-icon-background-circle{
border-radius: 50%;
padding: 33.333333333%;
width: 100%;
height: 100%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center;
}
.kol-container-background-rounded .kol-icon.kol-icon-background-rounded{
border-radius: 4px;
padding: 33.333333333%;
width: 100%;
height: 100%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center;
}
.kol-container-background-square .kol-icon.kol-icon-background-square{
border-radius: 0px;
padding: 33.333333333%;
width: 100%;
height: 100%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center;
}
/* ############################## */
/* REFER A FRIEND BUTTONS */
/* ############################## */
.btn-sharing, .btn-sharing:hover{
color: white;
}
.btn-telegram {
background-color: #0088cc;
border-color: #0088cc;
}
.btn-telegram:hover{
background-color: #3ca2d9;
border-color: #3ca2d9;
}
.btn-whatsapp {
background-color: #69ca3b;
border-color: #69ca3b;
}
.btn-whatsapp:hover{
background-color: #56a61e;
border-color: #56a61e;
}
.btn-facebook {
background-color: #3b5998;
border-color: #3b5998;
}
.btn-facebook:hover{
background-color: #082665;
border-color: #082665;
}
.btn-twitter{
background-color: #00aced;
border-color: #00aced;
}
.btn-twitter:hover{
background-color: #0079ba;
border-color: #0079ba;
}
.btn-pinterest {
background-color: #cb2027;
border-color: #cb2027;
}
.btn-pinterest:hover{
background-color: #980000;
border-color: #980000;
}
.btn-gplus, .btn-google-plus, .btn-google_plus {
background-color:#dd4b39;
border-color: #dd4b39;
}
.btn-gplus:hover, .btn-google-plus:hover, .btn-google_plus:hover{
background-color: #aa1806;
border-color: #aa1806;
}
.btn-linkedin {
background-color:#007bb6;
border-color: #007bb6;
}
.btn-linkedin:hover{
background-color: #004883;
border-color: #004883;
}
.btn-email {
background-color: #3f3f3f;
border-color: #3f3f3f;
}
.btn-email:hover{
background-color: #0c0c0c;
border-color: #0c0c0c;
}
.btn-reddit{
background-color: #5f99cf;
border-color: #5f99cf;
}
.btn-reddit:hover{
background-color: #2c669c;
border-color: #2c669c;
}
.btn-wordpress{
background-color: #21759b;
border-color: #21759b;
}
.btn-wordpress:hover{
background-color: #004268;
border-color: #004268;
}
.btn-tumblr{
background-color: #35465c;
border-color: #35465c;
}
.btn-tumblr:hover{
background-color: #021329;
border-color: #021329;
}
.btn-digg{
background-color: #000000;
border-color: #000000;
}
.btn-digg:hover{
background-color: #000000;
border-color: #000000;
}
.btn-instagram{
background-color: #4c68d7;
border-color: #4c68d7;
}
.btn-instagram:hover{
background-color: #445fc9;
border-color: #445fc9;
}
.btn-apps{
background-color: #000000;
border-color: #000000;
}
.btn-apps:hover{
background-color: #000000;
border-color: #000000;
}
.app-download-image-button{
width: 200px;
margin-bottom: 10px;
}
.app-download-image-button.android-button{
margin-bottom: 0px;
}
.btn-youtube {
background-color: #FF0000;
border-color: #FF0000;
}
.btn-youtube:hover {
background-color: #e40606;
border-color: #e40606;
}
.btn-sms {
background-color: #4CD964;
border-color: #4CD964;
color: white;
}
.btn-sms:hover{
background-color: #00A130;
border-color: #00A130;
}
/* ########################### */
/* Video Snippet Styles */
/* ########################### */
.video-embed-script iframe {
max-width: 100% !important;
}
.popup-video-modal .modal-body {
padding: 15px;
}
.popup-video-modal .close {
position: absolute;
top: 10px;
right: 10px;
}
/* ########################### */
/* Preview Mode Styles */
/* ########################### */
.kol-preview-warning-wrapper{
position: fixed;
bottom: 0px;
background-color: #2095F2;
text-align:center;
width:100% !important;
z-index: 99999;
padding-left:10px;
padding-right:10px;
padding-top:5px;
padding-bottom:5px;
}
.kol-preview-text{
font-size:14px;
color: white !important;
font-family: Arial, Helvetica, sans-serif !important;
}
.kol-preview-text a,
.kol-preview-text a:hover{
color: white;
text-decoration: underline;
}
/* Branding Styles work with the branding.js from the Kickoff Scripts project */
.kickoff_logo_v2 {
float: left;
padding-top: 5px;
}
.kickoff_logo_v2 a.kol_branding_logo_v2 {
background-image: url("../../static.kickoffpages.com/images/logo_on_dark_262x46.png");
display: block;
height: 23px;
text-indent: -9999px;
width: 131px;
background-size: 131px 23px;
background-repeat: no-repeat;
margin: 0 0 0 0;
}
@media (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 1.5dppx) {
.kickoff_logo_v2 a.kol_branding_logo_v2 {
background-image: url("../../static.kickoffpages.com/images/logo_on_dark_262x46.png");
}
}
.branding_bar_v2 {
text-align: center;
background-color: #2095f2;
background-image: linear-gradient(90deg, #2095f2, #50ca9a);
height: 36px;
cursor: pointer;
z-index: 999;
padding-left: 10px;
padding-right: 10px;
box-shadow: 0 4px 6px 0 rgba(0, 0, 0, 0.2), 0 6px 10px 0 rgba(0, 0, 0, 0.19);
position: fixed;
left: 0px;
right: 0px;
top:0px;
}
.branding_bar_v2:before {
border-radius: inherit;
background-image: linear-gradient(90deg, #2095f2, #2095f2);
content: '';
display: block;
height: 100%;
position: absolute;
top: 0;
left: 0;
opacity: 0;
width: 100%;
z-index: -100;
transition: opacity 0.45s;
}
.branding_bar_v2:hover:before {
opacity: 1;
}
a#kickoff_branding_bar_v2 {
font-size: 16px !important;
line-height: 36px;
font-weight: normal !important;
letter-spacing: .6px;
color: #FFF !important;
text-decoration: none;
font-family: Helvetica, Verdana, sans-serif !important;
}
.mobile_kickofflabs_link_v2 {
display: none;
}
.kickoff_link_v2 {
width: 575px;
margin-left: auto;
margin-right: auto;
}
@media (max-width: 767px) {
.mobile_kickofflabs_link_v2 {
display: block;
float: left;
}
.kickoff_link_v2 {
display: none;
}
.kickoff_logo_v2 {
float: right;
}
}
/* Widget Bar Classess */
.footer-number-description{
white-space: nowrap;
}
/* Network Share Buttons */
.kol-share-links .kol-btn.kol-btn-sharing, .kol-share-links .kol-btn.kol-btn-sharing:hover{
color: white;
background-image: none;
}
.kol-share-links .kol-btn.kol-btn-weibo {
background-color: #EF3E26;
border-color: #EF3E26;
}
.kol-share-links .kol-btn.kol-btn-weibo:hover{
background-color: #ef2509;
border-color: #ef2509;
}
.kol-share-links .kol-btn.kol-btn-telegram {
background-color: #0088cc;
border-color: #0088cc;
}
.kol-share-links .kol-btn.kol-btn-telegram:hover{
background-color: #3ca2d9;
border-color: #3ca2d9;
}
.kol-share-links .kol-btn.kol-btn-fbmessenger {
background-color: #0184ff;
border-color: #0184ff;
}
.kol-share-links .kol-btn.kol-btn-fbmessenger:hover{
background-color: #0477c5;
border-color: #0477c5;
}
.kol-share-links .kol-btn.kol-btn-whatsapp {
background-color: #69ca3b;
border-color: #69ca3b;
}
.kol-share-links .kol-btn.kol-btn-whatsapp:hover{
background-color: #56a61e;
border-color: #56a61e;
}
.kol-share-links .kol-btn.kol-btn-sms {
background-color: #4CD964;
border-color: #4CD964;
}
.kol-share-links .kol-btn.kol-btn-sms:hover{
background-color: #00A130;
border-color: #00A130;
}
.kol-share-links .kol-btn.kol-btn-facebook {
background-color: #3b5998;
border-color: #3b5998;
}
.kol-share-links .kol-btn.kol-btn-facebook:hover{
background-color: #082665;
border-color: #082665;
}
.kol-share-links .kol-btn.kol-btn-twitter{
background-color: #00aced;
border-color: #00aced;
}
.kol-share-links .kol-btn.kol-btn-twitter:hover{
background-color: #0079ba;
border-color: #0079ba;
}
.kol-share-links .kol-btn.kol-btn-pinterest {
background-color: #cb2027;
border-color: #cb2027;
}
.kol-share-links .kol-btn.kol-btn-pinterest:hover{
background-color: #980000;
border-color: #980000;
}
.kol-share-links .kol-btn.kol-btn-gplus, .kol-share-links .kol-btn.kol-btn-google-plus, .kol-share-links .kol-btn.kol-btn-google_plus {
background-color:#dd4b39;
border-color: #dd4b39;
}
.kol-share-links .kol-btn.kol-btn-gplus:hover, .kol-share-links .kol-btn.kol-btn-google-plus:hover, .kol-share-links .kol-btn.kol-btn-google_plus:hover{
background-color: #aa1806;
border-color: #aa1806;
}
.kol-share-links .kol-btn.kol-btn-linkedin {
background-color:#007bb6;
border-color: #007bb6;
}
.kol-share-links .kol-btn.kol-btn-linkedin:hover{
background-color: #004883;
border-color: #004883;
}
.kol-share-links .kol-btn.kol-btn-email {
background-color: #3f3f3f;
border-color: #3f3f3f;
}
.kol-share-links .kol-btn.kol-btn-email:hover{
background-color: #0c0c0c;
border-color: #0c0c0c;
}
.kol-share-links .kol-btn.kol-btn-reddit{
background-color: #5f99cf;
border-color: #5f99cf;
}
.kol-share-links .kol-btn.kol-btn-reddit:hover{
background-color: #2c669c;
border-color: #2c669c;
}
.kol-share-links .kol-btn.kol-btn-wordpress{
background-color: #21759b;
border-color: #21759b;
}
.kol-share-links .kol-btn.kol-btn-wordpress:hover{
background-color: #004268;
border-color: #004268;
}
.kol-share-links .kol-btn.kol-btn-tumblr{
background-color: #35465c;
border-color: #35465c;
}
.kol-share-links .kol-btn.kol-btn-tumblr:hover{
background-color: #021329;
border-color: #021329;
}
.kol-share-links .kol-btn.kol-btn-digg{
background-color: #000000;
border-color: #000000;
}
.kol-share-links .kol-btn.kol-btn-digg:hover{
background-color: #000000;
border-color: #000000;
}
/* Activities Snippet from Koljs */
.kol-activity{
background: white;
margin-bottom: 10px;
box-shadow: 0 1px 3px rgba(0,0,0,.12), 0 1px 2px rgba(0,0,0,.24);
border-radius: 4px;
font-size: 14px;
transition: all 0.3s ease-in-out;
}
.kol-activity::before {
content: '';
position: absolute;
z-index: -1;
max-width: 100%;
height: 100%;
opacity: 0;
border-radius: 5px;
box-shadow: 0 2px 6px rgba(0,0,0,.12), 0 1px 2px rgba(0,0,0,.24);
transition: opacity 0.3s ease-in-out;
}
.kol-activity-expanded-icon-wrapper, .kol-activity-points{
padding: 10px;
font-weight: bold;
text-align: right;
color: #2095F2;
}
.kol-activity-status{
padding: 10px;
color:#2095F2;
}
.kol-activity-completed .kol-activity-status-completed{
display:inline-block;
}
.kol-activity-completed .kol-activity-status-not-completed{
display:none;
}
.kol-activity-not-completed .kol-activity-status-completed{
display:none;
}
.kol-activity-not-completed .kol-activity-status-not-completed{
display:inline-block;
}
/* When things are expanded */
.kol-activity-expanded .kol-activity-header{
background-color: #F3f3f3;
border-top-right-radius: 4px;
border-top-left-radius: 4px;
}
/* Scale up the box */
.kol-activity:hover {
transform: scale(1.025, 1.025);
}
/* Fade in the pseudo-element with the bigger shadow */
.kol-activity:hover::after {
opacity: 1;
}
.kol-activity-header{
cursor: pointer;
display: flex;
flex-wrap: nowrap;
}
.kol-activity .fa-weibo{
color: #df2029;
}
.kol-activity .fa-telegram{
color: #0088cc;
}
.kol-activity .fa-reddit{
color: #FF4500;
}
.kol-activity .fa-wordpress{
color: #00749c;
}
.kol-activity .fa-digg{
color: #005be2;
}
.kol-activity .fa-tumblr{
color: #34526f;
}
.kol-activity .fa-pinterest{
color: #c8232c;
}
.kol-activity .fa-commenting{
color: #4CD964;
}
.kol-activity .fa-whatsapp{
color: #56a61e;
}
.kol-activity .fa-facebook-messenger{
color: #0477c5;
}
.kol-activity .fa-discord{
color: #7289DA;
}
.kol-activity .fa-tiktok{
color: #fe2c55;
}
.kol-activity .fa-envelope{
color: #333333;
}
.kol-activity .fa-twitter{
color: rgba(29,161,242,1.00);
}
.kol-activity .fa-facebook-f {
color: #4267B2;
}
.kol-activity .fa-facebook{
color: #4267B2;
}
.kol-activity .fa-youtube{
color: #FF0000;
}
.kol-activity .fa-linkedin-in{
color: #0073b1;
}
.kol-activity .fab-apple{
color: #000000;
}
.kol-activity .fa-android{
color: #3ddc84;
}
.kol-activity-type{
padding: 10px;
width: 50px;
}
.kol-activity-description{
flex: 1;
padding: 10px 10px 10px 0px;
text-align: left;
}
.kol-activity-like_facebook .kol-activity-details,
.kol-activity-refer_friends .kol-activity-details
{
text-align: center;
}
.kol-activity-details {
padding: 10px;
width: 100%;
display:none;
}
.kol-activity-expanded .kol-activity-details {
display:inline-block;
}
.kol-activity-expanded-icon-wrapper{
display:none;
}
.kol-activity-expanded .kol-activity-expanded-icon-wrapper {
display:inline;
}
.kol-activity .btn.btn-twitter{
color: white;
}
.kol-activity-form-item{
padding-top:10px;
padding-bottom: 5px;
}
/* Specific Activity Styles */
.kol-activity-view_tiktok blockquote {
border: none;
padding: 0px;
}
/* Rules Popup snippet */
.basicLightbox{position:fixed;display:flex;justify-content:center;align-items:center;top:0;left:0;width:100%;height:100vh;background:rgba(0,0,0,.8);opacity:.01;transition:opacity .4s ease;z-index:1000;will-change:opacity}.basicLightbox--visible{opacity:1}.basicLightbox__placeholder{max-width:100%;transform:scale(.9);transition:transform .4s ease;z-index:1;will-change:transform}.basicLightbox__placeholder>iframe:first-child:last-child,.basicLightbox__placeholder>img:first-child:last-child,.basicLightbox__placeholder>video:first-child:last-child{display:block;position:absolute;top:0;right:0;bottom:0;left:0;margin:auto;max-width:95%;max-height:95%}.basicLightbox__placeholder>iframe:first-child:last-child,.basicLightbox__placeholder>video:first-child:last-child{pointer-events:auto}.basicLightbox__placeholder>img:first-child:last-child,.basicLightbox__placeholder>video:first-child:last-child{width:auto;height:auto}.basicLightbox--iframe .basicLightbox__placeholder,.basicLightbox--img .basicLightbox__placeholder,.basicLightbox--video .basicLightbox__placeholder{width:100%;height:100%;pointer-events:none}.basicLightbox--visible .basicLightbox__placeholder{transform:scale(1)}
.basicLightbox__placeholder{
overflow:hidden;
color: white;
}
.kol-pop-up-wrapper{
height: 100%;
}
.kol-pop-up-dialog{
height: calc(100%);
overflow: scroll;
}
.kol-pop-up-body{
overflow: scroll;
height: calc(100% - 40px);
color: white !important;
}
.kol-pop-up-header .close{
color: white;
opacity: 1;
}
.kol-pop-up-content{
height:100%;
max-width:960px;
}
.basicLightbox__placeholder{
height: 100%;
padding: 20px;
}
.kol-pop-up-title, .kol-pop-up-body p{
color: white;
}
/* kol Sidebar styles adjustments*/
.kol-onpage-contestbox .kol-countdown-container .countdown-period {
text-transform: none !important;
font-weight: 400;
}
.kol-onpage-contestbox .referral-tracker{
margin-bottom: 10px;
margin-top:0px;
}
.kol-onpage-contestbox #contest-footer-numbers .is-container {
padding: 0px;
}
.kol-onpage-contestbox #contest-footer-numbers .footer-number {
display: block;
width: 100%;
font-size: 3rem;
font-weight: 400;
line-height: 1.5;
}
.kol-onpage-contestbox #contest-footer-numbers .footer-number-wrapper {
margin-top: 2px; margin-bottom: 6px;
}
.kol-onpage-contestbox #contest-footer-numbers .footer-number-description {
display: block;
width: 100%;
font-size: 1.25rem;
line-height: 1.5;
text-transform: lowercase;
}
@media (max-width: 480px){
.kol-onpage-contestbox #contest-footer-numbers .footer-number {
font-size: 2.5rem;
}
}
.kol-onpage-contestbox hr {
margin-top: 10px;
margin-bottom: 10px;
}
.kol-onpage-contestbox .is-boxes {
min-height: auto;
}
.kol-onpage-contestbox #contest-footer-numbers.show-branding-true{
bottom: 36px;
}
.kol-onpage-contestbox #contest-footer-numbers.show-branding-false{
bottom: 0px;
}
.kol-onpage-contestbox #branding-row.show-branding-false{
display:none;
}
.kol-onpage-contestbox #on-page-branding {
text-align: center;
background-color: white;
height: 36px;
cursor: pointer;
z-index: 999;
padding-left: 10px;
padding-right: 10px;
border-top: 1px solid rgb(240, 243, 246);
position: fixed;
left: 0px;
right: 0px;
bottom: 0px;
display: block;
}
.kol-onpage-contestbox #on-page-branding a{
font-size: 14px !important;
line-height: 36px;
color: #676A6D !important;
font-weight: normal !important;
letter-spacing: .6px;
text-decoration: none;
font-family: Helvetica, Verdana, sans-serif !important;
display: inline-block;
width: 100%;
}
.kol-reward-tracker .reward-tracker-prizes {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
/* If no rewards */
.kol-no-rewards{
width: 100%;
}
/* Update to reward tracker */
.reward-tracker, .kol-reward-tracker {
opacity: 1;
display: block;
}
.kol-reward-tracker {
animation-name: fadeIn;
animation-duration: 1s;
}
.reward-tracker {
display: none;
margin: 20px auto;
}
.kol-reward-tracker .reward-tracker-prizes {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.kol-reward-tracker .tracker-style-modern.force-vertical-true {
flex-direction: column;
}
.kol-reward-tracker .tracker-style-modern {
margin: 0rem -15px 0 -15px;
}
.kol-onpage-contestbox .kol-reward-tracker .tracker-style-modern {
margin: 1rem -15px 0 -15px;
}
.kol-reward-tracker .tracker-style-modern.force-vertical-true .reward-level {
flex: auto;
}
.kol-reward-tracker .tracker-style-modern .reward-level {
display: -ms-grid;
display: grid;
grid-template-rows: 0px 1fr 2px 30px;
box-shadow: 0 1px 3px rgba(0,0,0,.12), 0 1px 2px rgba(0,0,0,.24);
border-radius: 4px;
position: relative;
padding: 0;
flex: 1 1 150px;
margin: 1.0rem 1.5rem;
min-width: 175px;
}
.kol-reward-tracker .tracker-style-modern .reward-level-prize {
background: #FFFFFF;
padding: 15px;
border-top-right-radius: 3px;
border-top-left-radius: 3px;
}
.kol-reward-tracker .tracker-style-modern .content-wrapper {
padding: 10px 10px 10px 10px;
font-size: 14px;
}
.kol-reward-tracker .reward-tracker-prizes .reward-level-prize {
height: 100%;
}
.kol-reward-tracker .tracker-style-modern .reward-earned .lock {
display: none;
}
.kol-reward-tracker .tracker-style-modern .reward-not-earned .check {
display: none;
}
.kol-reward-tracker .tracker-style-modern .check,
.kol-reward-tracker .tracker-style-modern .lock {
height: 50px;
width: 50px;
line-height: 40px;
padding-left:3px;
display: inline-block;
position: absolute;
-webkit-transform: translateX(-50%);
transform: scale(.50) translateX(-50px);
text-align: center;
right: -38px;
bottom: 7px;
border-top-left-radius: 50%;
border-bottom-left-radius: 50%;
}
.kol-reward-tracker .tracker-style-modern .check {
background: hsl(156, 54%, 55%);
line-height: 56px;
}
.kol-reward-tracker .tracker-style-modern .lock {
background: hsl(210, 3%, 69%);
line-height: 61px;
}
.kol-reward-tracker .tracker-style-modern .reward-level-prize {
background: #FFFFFF;
padding: 15px;
border-top-right-radius: 3px;
border-top-left-radius: 3px;
height: 100%;
}
.kol-reward-tracker .tracker-style-modern .content-wrapper {
padding: 10px 10px 10px 10px;
font-size: 14px;
}
.kol-reward-tracker .modern-prize-box-progress {
background: #AFB1B3;
}
.kol-reward-tracker .tracker-style-modern .modern-prize-box-progress,
.kol-reward-tracker .tracker-style-modern .modern-prize-box-progress .progress-bar {
height: 3px;
}
.kol-reward-tracker .tracker-style-modern .progress-bar {
background: hsl(156, 54%, 55%);
}
.kol-reward-tracker .tracker-style-modern .points {
display: block;
text-align: center;
background: #FFFFFF;
font-weight: 700;
padding: 5px;
font-weight: 400;
font-size: 1.2rem;
text-transform: uppercase;
letter-spacing: .5px;
height: 30px;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
}
.kol-reward-tracker .tracker-style-modern .points {
background: #FFFFFF;
}
/* on Page Form Adjustmnets for contestbox */
.kol-onpage-contestbox .kol-form-default{
text-align:left;
}
/* Helper for iframe embeds in contest box */
.kol-onpage-contestbox [data-kol-editor="froala"] iframe {
max-width: 100%;
max-height: 195px;
}
/* Hide/Show Data Replacements So you Always Get Real Number */
[data-replace-with-lead-data].pending{
visibility: hidden;
}
[data-replace-with-lead-data].pending:after{
content: "-";
visibility: visible;
display: block;
margin: auto;
position: absolute;
top: 0; left: 0; bottom: 0; right: 0;
padding: 5px;
text-align: center;
}
/* Styles for Cookie Consent */
.cookie-consent {
display: flex;
flex-direction: row;
justify-content: flex-end;
align-items: center;
position: fixed; /* Ensure nothing overflows on page or flex + fixed position does not work. */
padding: 0.4em;
bottom: 0.75%;
left: 0.5%;
background-color:inherit;
border-radius: 10px;
}
.cookie-consent__text {
padding-right:0.6em;
border-right: 1px solid #a9a9b3;
}
.cookie-consent__buttons {
display: flex;
flex-direction:row;
justify-content: flex-end;
text-align: center;
align-items:center;
padding-left:0.6em;
}
.cookie-consent__buttons-button
{
cursor: pointer;
border-radius: 3px;
padding:0.5em;
}
.cookie-consent__buttons__close {
background: #a9a9b3;
color: black;
padding-left:1em;
padding-right:1em;
}
.cookie-consent__buttons__read-more > a {
margin-right:1em;
color: inherit;
text-decoration: underline;
}