/* Reset & Basics */

@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');


html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
code,
em,
img,
strong,
b,
u,
i,
center,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
section,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block
}

button::-moz-focus-inner {
  border: 0
}

img:-moz-loading {
  visibility: hidden
}

/* hide alt text while loading */

/* Clearing */

.clearfix:before,
.clearfix:after {
  content: " ";
  display: table
}

.clearfix:after {
  clear: both
}

/******************************************************
********************   Typography   *******************
******************************************************/

html {
  font-family: 'Poppins', sans-serif;
  font-size: 16px;
  line-height: 30px;
  color: #555c70
}

p {
  margin-bottom: 15px
}

p.small-text {
  font-size: 14px;
  line-height: 1.5;
}

p.big-text {
  font-size: 19px;
  line-height: 1.5;
  font-weight: 300;
}

strong {
  font-weight: 600
}

em {
  font-style: italic;
  font-weight: 300
}

b,
strong,
dt {
  font-weight: 700;
}

#menu,
.button,
#websites .website a,
#websites .results,
input.search,
.quote {
  font-family: 'Poppins', sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'Poppins', sans-serif;
  margin-bottom: 15px
}

h1 {
  font-size: 46px;
  line-height: 60px;
  font-weight: 500;
  color: #00032a;
}

.hero h1 {
  font-size: 60px;
  line-height: 70px;
  font-weight: 400;
}

h2,
.h1-wptheme {
  font-size: 40px;
  line-height: 50px;
  font-weight: 500;
  color: #00032a;
}

h3 {
  font-size: 26px;
  line-height: 36px;
  font-weight: 500;
  color: #00032a;
}

h4 {
  font-size: 24px;
  line-height: 38px;
  font-weight: 500;
  color: #00032a;
}

h5 {
  font-size: 18px;
  line-height: 30px;
  font-weight: 500;
  color: #00032a;
}

h6 {
  font-size: 16px;
  line-height: 30px;
  font-weight: 500;
  color: #00032a;
}


/******************************************************
*******************   Basic styles   ******************
******************************************************/

body {
  font-family: "Poppins", sans-serif;
  background-color: #fff;
  overflow-x: hidden;
}

body.modal-open {
  overflow: hidden
}

body.animate {
  transition: background-color .5s ease-in-out;
}

img {
  max-width: 100%;
  height: auto
}

a,
a:visited {
  color: #0130c6;
  text-decoration: none;
}

a:hover,
a:active {
  color: #0130c6;
  text-decoration: underline;
}

sup {
  vertical-align: baseline;
  position: relative;
  top: -0.4em;
}

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
  border-width: 1px 0 0;
  border-style: solid;
  border-color: rgba(48, 64, 80, .15);
  margin: 25px 0;
}

hr.hr-dark {
  border-color: rgba(255, 255, 255, .1);
}

hr.hr-medium {
  margin: 35px 0;
}

hr.hr-big {
  margin: 50px 0;
}

hr.hr-narrow {
  width: 45%;
  margin-left: auto;
  margin-right: auto;
}

.text-primary {
  color: #0089f7 !important;
}

.text-gradient-primary {
  color: #0130c6 !important;
}

.be {
  color: #0130c6;
}

.woo {
  display: inline-block;
  background-image: url(../svg/logo_woo.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  position: relative;
  transform: translateY(6%);
}

.woo .inside {
  visibility: hidden;
}

.woo-light {
  background-image: url(../svg/logo_woo_w.svg);
}

.woocommerce {
  color: #7f54b3;
}

/* Button */
a.button {
  display: inline-block;
  margin: 0 5px 15px;
  font-weight: 500;
  text-decoration: none;
  padding: 11px 80px;
  background-color: #dde7f0;
  color: #07070A;
  border-radius: 8px;
  font-size: 16px;
  text-align: center;
  box-sizing: border-box;
}

a:hover.button {
  background-color: #e5edf4;
}

a.button.primary {
  background-color: #0044d3;
  color: #fff
}

a:hover.button.primary {
  background-color: #0944ff;
}

a.button.secondary {
  background-color: #0130c6;
  color: #fff
}

a:hover.button.secondary {
  background-color: #0944ff;
}

a.button.black {
  background-color: #191a1f;
  color: #fff
}

a:hover.button.black {
  background-color: #0089F7;
}

a.button.green {
  background-color: #04654b;
  color: #fff
}

a:hover.button.green {
  background-color: #067456;
}

a.button.green-light {
  background-color: #4BC98F;
  color: #fff
}

a:hover.button.green-light {
  background-color: #55D59A;
}

a.button.brown {
  background-color: #742727;
  color: #fff
}

a:hover.button.brown {
  background-color: #7f2e2e;
}

a.button.violet {
  background-color: #5D3AC2;
  color: #fff
}

a:hover.button.violet {
  background-color: #6944D3;
}

a.button.steel {
  background-color: #3C455E;
  color: #fff
}

a:hover.button.steel {
  background-color: #4D566D;
}

a.button.gray {
  background-color: #3B393D;
  color: #fff
}

a:hover.button.gray {
  background-color: #444246;
}

a.button.coral {
  background-color: #FF794F;
  color: #07070A
}

a.button.coral del {
  color: #8B4B37;
}

a.button.coral ins {
  color: #fff;
}

a:hover.button.coral {
  background-color: #FF8547;
}

a.button.green-light2 {
  background-color: #87E64C;
  color: #353235
}

a.button.green-light2 del {
  color: #58873A;
}

a.button.green-light2 ins {
  color: #353235;
}

a:hover.button.green-light2 {
  background-color: #89D957;
}

a.button-outlined {
  background-color: transparent;
  border: 1px solid #dde7f0;
}

a:hover.button-outlined {
  background-color: #e5edf4;
}

a.button-outlined.primary {
  background-color: transparent;
  border: 1px solid #80b541;
  color: #80b541
}

a:hover.button-outlined.primary {
  background-color: #92c752;
  color: #fff
}

a.button-outlined.secondary {
  background-color: transparent;
  border: 1px solid #0089f7;
  color: #0089f7
}

a:hover.button-outlined.secondary {
  background-color: #0089f7;
  color: #fff
}

a.button.big {
  font-size: 16px;
  padding: 18px 100px
}

a.button.icon-left i {
  margin-right: 6px;
}

a.button.icon-right i {
  margin-left: 6px;
}

a.button del {
  text-decoration: line-through;
}

a.button ins {
  font-size: 130%;
  text-decoration: none;
}

a.button span {
  position: relative;
  margin-right: 25px;
}

a.button span:after {
  content: "";
  display: inline-block;
  position: absolute;
  right: -30px;
  top: -2px;
  width: 26px;
  height: 26px;
  background-image: url(../svg/link-icons/move-right.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 26px;
}

a.button.primary span:after {
  background-image: url(../svg/link-icons/move-right-white.svg);
}

a.button.secondary span:after {
  background-image: url(../svg/link-icons/move-right-white.svg);
}

a.button-arrow-white span:after {
  background-image: url(../svg/link-icons/move-right-white.svg);
}

a:hover.button span:after {
  right: -35px;
}

a.button.button-narrow {
  padding-left: 40px;
  padding-right: 40px;
}

a.button.button-sp {
  padding-left: 25px;
  padding-right: 25px;
}

/* small padding */

a.button.play-video span {
  margin-left: 30px;
  margin-right: 0;
}

a.button.play-video span:after {
  background-image: url(../svg/link-icons/play-white.svg);
  background-size: 10px;
  right: auto;
  left: -35px;
  top: -1px;
  width: 24px;
  height: 24px;
  background-color: #45464a;
  border-radius: 100%;
}

a:hover.button.play-video span:after {
  background-color: #0080e6;
}

a.button.scroll-down span:after {
  background-image: url(../svg/link-icons/move-down.svg);
}

a.button.scroll-down-light span:after {
  background-image: url(../svg/link-icons/move-down-white.svg);
}

a:hover.button.scroll-down span:after {
  right: -30px;
  top: 0px;
}

/* Splash link */
a.splash-link {
  color: #0130c6;
  display: inline-block;
  position: relative;
  font-weight: 500;
  margin: 0 25px 15px 0;
  border-bottom: 1px solid #0130c6;
  padding-bottom: 5px;
  text-decoration: none;
}

a.splash-link:after {
  content: "";
  display: block;
  position: absolute;
  right: -25px;
  top: 3px;
  width: 22px;
  height: 22px;
  background-image: url(../svg/link-icons/move-right-blue.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 22px;
}

a:hover.splash-link {}

a:hover.splash-link:after {
  right: -30px;
}

a.splash-link.with-icon {
  margin-left: 30px;
}

a.splash-link.with-icon:before {
  content: "";
  display: block;
  position: absolute;
  left: -30px;
  top: 3px;
  width: 22px;
  height: 22px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 22px;
}

a.splash-link.link-gallery:before {
  background-image: url(../svg/link-icons/gallery-blue.svg);
}

a.splash-link.link-documentation:before {
  background-image: url(../svg/link-icons/documentation-blue.svg);
}

a.splash-link.link-tutorial:before {
  background-image: url(../svg/link-icons/tutorial-blue.svg);
}

a.splash-link.link-prebuilt-websites:before {
  background-image: url(../svg/link-icons/prebuilt-websites-blue.svg);
}

a.splash-link.link-expand:after {
  background-image: url(../svg/link-icons/move-down-blue.svg);
}

a:hover.splash-link.link-expand:after {
  right: -25px;
  top: 5px;
}

.splash-link-sep {
  display: inline-block;
  width: 1px;
  height: 30px;
  background: rgba(48, 64, 80, .15);
  margin: 0 30px;
  position: relative;
  top: 10px;
}

.number {
  font-size: 70px;
  line-height: 70px;
  font-weight: 300;
  color: #00032a;
}

.number.small {
  font-size: 50px;
  line-height: 50px;
  font-weight: 600;
}

.number.medium {
  font-size: 110px;
  line-height: 110px;
  font-weight: 200;
  background: linear-gradient(to top right, #0130c6 0%, #09B4FD 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.number.big {
  font-size: 180px;
  line-height: 180px;
  font-weight: 500;
  background: linear-gradient(45deg, #ff9e05, #fcce07);
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.highlight {
  padding: 2px 5px;
  border-radius: 3px;
  background-color: #ccc;
  color: #000;
}

.highlight.item {
  background-color: rgba(96, 148, 200, .05);
  color: #6094c8;
}

.highlight.wrap {
  background-color: rgba(73, 101, 119, .03);
  color: #496577;
}

.highlight.section {
  background-color: rgba(60, 144, 98, .05);
  color: #3c9062;
}

.info-box {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 60px 6%;
}

.info-box .icon {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
}

.info-box .icon>img {
  margin-right: 15px;
}

.info-box .icon p {
  margin-bottom: 0;
}

.info-box .inner {
  margin: 0 40px;
}

.info-box .inner p {
  font-size: 16px;
  line-height: 24px;
  font-weight: 700;
}

.info-box .inner>*:last-child {
  margin-bottom: 0;
}

.info-box a.button {
  margin-bottom: 0px;
  flex-shrink: 0;
  padding: 11px 30px;
}

.info-box-green {
  background-color: #f4fbf6;
}

.info-box-green,
.info-box-green a:not(.button),
.info-box-green a:not(.button):hover,
.info-box-green .icon .number {
  color: #23a44b;
}

.info-box-green a.button {
  background-color: #23a44b;
}

.info-box-green a:hover.button {
  background-color: #31b65a;
}


.content-icon {
  margin-bottom: 20px;
  background: #edf4ff;
  padding: 10px;
  border-radius: 20px;
}

.content-image {
  margin-bottom: 20px;
}

#empresa .content-image {
  max-width: 550px !important;
}

.content-lottie {
  margin-bottom: 20px;
}

ul.content-list {
  margin: 30px 0;
  list-style: none;
}

ul.content-list li {
  position: relative;
  margin-bottom: 15px;
  padding-left: 40px;
}

ul.content-list li:before {
  content: "";
  display: inline-block;
  position: absolute;
  left: 0;
  top: 2px;
  width: 25px;
  height: 25px;
  border-radius: 100%;
  background-color: #0089f7;
  background-image: url(../svg/link-icons/move-right-white.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 20px;
}

ul.content-list li .heading {
  margin-bottom: 5px;
}

ol.content-list {
  margin: 30px 0;
  list-style: none;
  counter-reset: item
}

ol.content-list li {
  position: relative;
  margin-bottom: 15px;
  padding-left: 40px;
}

ol.content-list li:before {
  content: counters(item, ".") " ";
  counter-increment: item;
  display: inline-block;
  margin-right: 20px;
  position: absolute;
  left: 0;
  top: 2px;
  width: 25px;
  height: 25px;
  line-height: 25px;
  color: #fff;
  font-size: 12px;
  text-align: center;
  border-radius: 100%;
  background-color: #0089f7;
}

ol.content-list li .heading {
  margin-bottom: 5px;
}

.content-list.green li:before {
  background-color: #489C6D;
}

.content-list.green2 li:before {
  background-color: #25AC46;
}


code {
  font-family: monospace;
  font-size: 13px;
  color: #0089f7;
  white-space: nowrap;
  padding: 4px 8px;
  background: rgba(1, 137, 255, .05);
  border-radius: 3px;
}

pre {
  font-family: monospace;
  font-size: 13px;
  border-radius: 8px;
  box-sizing: border-box;
  width: 100%;
  padding: 0;
  margin: 30px 0;
  line-height: 26px;
  background: rgba(1, 137, 255, .05);
  padding: 20px;
  color: #00032a;
  white-space: pre-wrap;
}

.pre-with-copy {
  position: relative;
}

.pre-with-copy a.copyButton {
  display: block;
  opacity: 0;
  position: absolute;
  right: 10px;
  bottom: 10px;
  height: 20px;
  text-decoration: none;
  line-height: 20px;
  font-size: 13px;
  padding: 4px 10px;
  background: #fff;
  box-shadow: 0px 3px 6px 0px rgba(232, 239, 242, .5);
  color: #7b7d97;
  border-radius: 3px;
}

.pre-with-copy a:hover.copyButton {
  color: #00032a;
}

.pre-with-copy:hover a.copyButton {
  opacity: 1;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
  margin: 30px 0;
  border-radius: 8px;
  overflow: hidden;
}

table th {
  font-weight: 500;
  background-color: #f1f4f9;
  color: #00032a;
  text-align: left;
}

table td {}

table th,
table td {
  border-bottom: 1px solid rgba(48, 64, 80, .15);
  border-right: 1px solid rgba(48, 64, 80, .1);
  padding: 15px;
}

table tr:last-child td {
  border-bottom: 0;
}

table tr th:last-child,
table tr td:last-child {
  border-right: 0;
}

.table-doc {}

.table-doc th {
  font-size: 12px;
  font-weight: normal;
  color: #00032a;
  text-transform: uppercase;
  letter-spacing: 2px;
}

.table-doc td {}

.layouts-table {}

.layouts-table td,
.layouts-table th {
  text-align: center;
  vertical-align: middle;
}

.layouts-table .t1 {
  font-weight: 500;
  color: #00032a;
}

.examples-table .link {
  width: 35%;
  text-align: center;
}

.video-container {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 56.25%;
  /* 16:9 */
}

.video-container video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}

.content-video {
  text-align: center;
  margin: 50px -10%;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 6px 30px 60px 0px rgba(0, 0, 0, .18);
  line-height: 0;
  transform: translateZ(0);
}

.content-pic {
  border-bottom: 1px solid #e8eef7;
  text-align: center;
  margin: 50px -10%;
}

.content-pic img {
  display: block;
  margin-bottom: 20px;
}

.content-pic p {
  font-size: 14px;
  line-height: 25px;
  color: #a0aab9;
  padding-bottom: 5px;
}

.content-pic p a {
  color: #8793a6;
}

.content-gallery {
  position: relative;
  margin: 50px -280px;
}

.content-gallery .item {
  margin: 0 10px;
  text-align: center;
}

.content-gallery .item img {
  display: block;
  margin-bottom: 20px;
}

.content-gallery .item p {
  font-size: 14px;
  line-height: 25px;
  color: #a0aab9;
}

.content-gallery .slick-arrow {
  position: absolute;
  top: calc(50% - 60px);
}

.content-gallery .slick-prev {
  left: -20px;
}

.content-gallery .slick-next {
  right: -20px;
}

.content-box-shadow {
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 6px 30px 60px 0px rgba(0, 0, 0, .18);
  line-height: 0;
}

.video-wrapper {
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 6px 30px 60px 0px rgba(0, 0, 0, .18);
  line-height: 0;
  transform: translateZ(0);
}

.heading-with-icon {
  display: flex;
  align-items: center;
}

.heading-with-icon .icon {
  margin-right: 15px;
  flex-shrink: 0;
}

.column-with-link a {
  text-decoration: none;
  color: inherit;
}

.path {
  background: #f3f4f8;
  border-radius: 20px;
  padding: 7px 20px 7px 10px;
  font-size: 13px;
  width: auto;
  margin: 30px 0;
  display: inline-block;
}

.path .goto {
  padding: 1px 10px;
  border-radius: 20px;
  background: #bec1d0;
  display: inline-block;
  color: #fff;
  font-weight: 600;
  letter-spacing: 1px;
  margin-right: 10px;
}

.content-list .path {
  margin: 0 10px;
}

.tag {
  display: inline-block;
  margin: 0 10px 10px 0;
  color: #2d6dd7;
  background-color: rgba(170, 198, 245, .15);
  border-radius: 30px;
  padding: 2px 14px;
  font-size: 90%;
  font-weight: 200;
}

.tag-outlined {
  margin: 4px;
  color: inherit;
  background-color: unset;
  border: 1px solid;
  border-radius: 8px;
  font-weight: 300;
}

.badge {
  display: inline-block;
  font-size: 12px;
  line-height: 1.2;
  font-weight: 400;
  padding: 4px 8px;
  border-radius: 6px;
  vertical-align: middle;
}

.badge-filled {
  color: #fff;
  background-color: #555c70;
}

.badge-outlined {
  border: 1px solid #555c70;
  color: #555c70;
}

.badge-filled.blue {
  background-color: #0089f7;
}

.badge-outlined.blue {
  color: #0089f7;
  border-color: #0089f7;
}

.badge-filled.light-grey {
  background-color: #F0F0F0;
  color: #555C70;
}

.badge-outlined.light-grey {
  color: #94a3b8;
  border-color: #cbd5e1;
}


.badge-group {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 5px;
  position: relative;
  z-index: 1;
  padding: 8px 15px;
  border-radius: 6px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  font-size: 14px;
  line-height: 1.2;
  font-weight: 500;
}

.badge-group .info-icon {
  content: "";
  display: inline-block;
  position: relative;
  width: 6px;
  height: 6px;
  flex-shrink: 0;
  background: #0089F7;
  margin-right: 6px;
  border-radius: 100%;
}

.badge-group .info-icon:before,
.badge-group .info-icon:after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  background: inherit;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  animation: sf-badge-group-icon 2s infinite linear;
  opacity: 0.3;
  background-color: #0089F7;
}

.badge-group .info-icon:after {
  animation-delay: 1s;
}

.badge-group a {
  text-decoration: none;
}

.badge-group a:hover {
  text-decoration: underline;
}

.badge-group a:after {
  content: "\00BB";
  display: inline-block;
  margin-left: 10px;
}

@keyframes sf-badge-group-icon {
  0% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 0.6;
  }

  100% {
    transform: translate(-50%, -50%) scale(2.5);
    opacity: 0;
  }
}


a.play-button {
  position: absolute;
  left: 50%;
  top: 50%;
  margin: -35px 0 0 -35px;
  width: 70px;
  height: 70px;
  border-radius: 100%;
  background-color: #ffffff;
  box-shadow: 0px 0 46px 0px rgba(1, 7, 39, .4);
  background-image: url(../svg/link-icons/play.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 20px;
  text-indent: -9999px;
  overflow: hidden;
}

a:hover.play-button {
  transform: scale(1.1);
}

.search-wrapper {
  position: relative;
  display: inline-block;
  width: 50%
}

.search-wrapper input.search {
  outline: none;
  border-radius: 0;
  box-sizing: border-box;
  border: none;
  background: #fff;
  box-shadow: 0px 10px 46px 0px rgba(1, 7, 39, .1);
  border-radius: 4px;
  font-size: 17px;
  line-height: 20px;
  padding: 22px 20px 22px 65px;
  width: 100%;
  background: url('../svg/search.svg') no-repeat 25px center;
  background-size: 19px
}

.search-wrapper .close {
  position: absolute;
  top: 15px;
  left: 14px;
  display: none;
  width: 40px;
  height: 40px;
  cursor: pointer
}

.search-active .search-wrapper input.search {
  background-image: url('../svg/close.svg')
}

.search-active .search-wrapper .close {
  display: block
}



span.muffin-logo {
  display: inline-block;
  position: relative;
  top: 5px;
  width: 31px;
  height: 32px;
  background-image: url(../images/svg/logo_muffin_simple.html);
  background-position: center;
  background-repeat: no-repeat;
}

span.muffin-logo.big {
  top: 15px;
  width: 63px;
  height: 67px;
}

span.new-feature {
  display: inline-block;
  position: relative;
  top: 2px;
  width: 18px;
  height: 18px;
  background-image: url(../svg/new-pink.svg);
  background-position: center;
  background-size: 18px;
  background-repeat: no-repeat;
}

span.new-feature.big {
  width: 52px;
  height: 52px;
  background-size: 52px;
}



/* Tooltip */
[data-tooltip] {
  position: relative;
  text-decoration: none;
}

[data-tooltip]:hover:before,
[data-tooltip]:focus:before {
  opacity: 1;
  transform: translate(-50%, -10px);
}

[data-tooltip]:hover:after,
[data-tooltip]:focus:after {
  opacity: 1;
  transform: translate(-50%, -10px) rotate(45deg);
}

[data-tooltip]:before {
  content: attr(data-tooltip);
  position: absolute;
  z-index: 2;
  text-indent: 0;
  bottom: 100%;
  left: 50%;
  padding: 6px 12px;
  color: #fff;
  background-color: #304050;
  font-size: 13px;
  line-height: 20px;
  opacity: 0;
  transform: translate(-50%, 0);
  pointer-events: none;
  border-radius: 3px;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.15);
  white-space: nowrap;
}

[data-tooltip]:after {
  position: absolute;
  z-index: 3;
  display: block;
  bottom: 100%;
  left: 50%;
  content: '';
  width: 10px;
  height: 10px;
  border-radius: 2px;
  background-color: #304050;
  margin-bottom: -4px;
  transform: translate(-50%, 0) rotate(45deg);
  opacity: 0;
  pointer-events: none;
}

[data-tooltip][data-position="bottom"]:before {
  transform: translate(-50%, 0);
  top: 100%;
  bottom: auto;
}

[data-tooltip][data-position="bottom"]:hover:before,
.mfn-ui [data-tooltip][data-position="bottom"]:focus:before {
  opacity: 1;
  transform: translate(-50%, 10px);
}

[data-tooltip][data-position="bottom"]:after {
  transform: translate(-50%, 0) rotate(45deg);
  top: 100%;
  bottom: auto;
}

[data-tooltip][data-position="bottom"]:hover:after,
.mfn-ui [data-tooltip][data-position="bottom"]:focus:after {
  transform: translate(-50%, 10px) rotate(45deg);
  margin-top: -4px;
}

/* alert */

.alert-box {
  display: flex;
  align-items: center;
  margin-bottom: 30px;
  padding: 15px 25px;
  line-height: 1.6;
  font-size: 14px;
  box-sizing: border-box;
  position: relative;
  width: 100%
}

.alert-box .alert_icon {
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  margin-right: 20px;
}

.alert-box .alert_wrapper {
  margin-right: 20px;
}

.alert-box .alert_wrapper a {
  border-bottom: 1px solid;
  text-decoration: none;
}

.alert-box .alert_wrapper a.separated {
  margin-left: 10px
}

.alert-box a.close {
  flex-shrink: 0;
  margin-left: auto;
  margin-right: -10px;
  text-decoration: none;
}

.alert_warning {
  background: #fef8ea;
}

.alert_warning,
.alert_warning a,
.alert_warning a:hover,
.alert_warning a.close .icon {
  color: #8a5b20
}

.alert_warning .path {
  stroke: #8a5b20
}

.alert_error {
  background: #fae9e8;
}

.alert_error,
.alert_error a,
.alert_error a:hover,
.alert_error a.close .icon {
  color: #962317
}

.alert_error .path {
  stroke: #8a5b20
}

.alert_info {
  background: #efefef;
}

.alert_info,
.alert_info a,
.alert_info a:hover,
.alert_info a.close .icon {
  color: #57575b
}

.alert_info .path {
  stroke: #57575b
}

.alert_success {
  background: #eaf8ef;
}

.alert_success,
.alert_success a,
.alert_success a:hover,
.alert_success a.close .icon {
  color: #3a8b5b
}

.alert_success .path {
  stroke: #3a8b5b
}


/* Plugin: Magnific Popup */

.mfp-bg {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1042;
  overflow: hidden;
  position: fixed;
  background: #0b0b0b;
  opacity: .8
}

.mfp-wrap {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1043;
  position: fixed;
  outline: none !important;
  -webkit-backface-visibility: hidden
}

.mfp-container {
  text-align: center;
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  padding: 0 8px;
  box-sizing: border-box
}

.mfp-container:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle
}

.mfp-align-top .mfp-container:before {
  display: none
}

.mfp-content {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  margin: 0 auto;
  text-align: left;
  z-index: 1045
}

.mfp-inline-holder .mfp-content,
.mfp-ajax-holder .mfp-content {
  width: 100%;
  cursor: auto
}

.mfp-ajax-cur {
  cursor: progress
}

.mfp-zoom-out-cur,
.mfp-zoom-out-cur .mfp-image-holder .mfp-close {
  cursor: -moz-zoom-out;
  cursor: -webkit-zoom-out;
  cursor: zoom-out
}

.mfp-zoom {
  cursor: pointer;
  cursor: -webkit-zoom-in;
  cursor: -moz-zoom-in;
  cursor: zoom-in
}

.mfp-auto-cursor .mfp-content {
  cursor: auto
}

.mfp-close,
.mfp-arrow,
.mfp-preloader,
.mfp-counter {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none
}

.mfp-loading.mfp-figure {
  display: none
}

.mfp-hide {
  display: none !important
}

.mfp-preloader {
  color: #CCC;
  position: absolute;
  top: 50%;
  width: auto;
  text-align: center;
  margin-top: -.8em;
  left: 8px;
  right: 8px;
  z-index: 1044
}

.mfp-preloader a {
  color: #CCC
}

.mfp-preloader a:hover {
  color: #FFF
}

.mfp-s-ready .mfp-preloader {
  display: none
}

.mfp-s-error .mfp-content {
  display: none
}

button.mfp-close,
button.mfp-arrow {
  overflow: visible;
  cursor: pointer;
  background: transparent;
  border: 0;
  -webkit-appearance: none;
  display: block;
  outline: none;
  padding: 0;
  z-index: 1046;
  box-shadow: none;
  touch-action: manipulation
}

button::-moz-focus-inner {
  padding: 0;
  border: 0
}

.mfp-close {
  width: 44px;
  height: 44px;
  line-height: 44px;
  position: absolute;
  right: 0;
  top: 0;
  text-decoration: none;
  text-align: center;
  opacity: .65;
  padding: 0 0 18px 10px;
  color: #FFF;
  font-style: normal;
  font-size: 28px;
  font-family: Arial, Baskerville, monospace
}

.mfp-close:hover,
.mfp-close:focus {
  opacity: 1
}

.mfp-close:active {
  top: 1px
}

.mfp-close-btn-in .mfp-close {
  color: #333
}

.mfp-image-holder .mfp-close,
.mfp-iframe-holder .mfp-close {
  color: #FFF;
  right: -6px;
  text-align: right;
  padding-right: 6px;
  width: 100%
}

.mfp-counter {
  position: absolute;
  top: 0;
  right: 0;
  color: #CCC;
  font-size: 12px;
  line-height: 18px;
  white-space: nowrap
}

.mfp-arrow {
  position: absolute;
  opacity: .65;
  margin: 0;
  top: 50%;
  margin-top: -55px;
  padding: 0;
  width: 90px;
  height: 110px;
  -webkit-tap-highlight-color: transparent
}

.mfp-arrow:active {
  margin-top: -54px
}

.mfp-arrow:hover,
.mfp-arrow:focus {
  opacity: 1
}

.mfp-arrow:before,
.mfp-arrow:after {
  content: '';
  display: block;
  width: 0;
  height: 0;
  position: absolute;
  left: 0;
  top: 0;
  margin-top: 35px;
  margin-left: 35px;
  border: medium inset transparent
}

.mfp-arrow:after {
  border-top-width: 13px;
  border-bottom-width: 13px;
  top: 8px
}

.mfp-arrow:before {
  border-top-width: 21px;
  border-bottom-width: 21px;
  opacity: .7
}

.mfp-arrow-left {
  left: 0
}

.mfp-arrow-left:after {
  border-right: 17px solid #FFF;
  margin-left: 31px
}

.mfp-arrow-left:before {
  margin-left: 25px;
  border-right: 27px solid #3F3F3F
}

.mfp-arrow-right {
  right: 0
}

.mfp-arrow-right:after {
  border-left: 17px solid #FFF;
  margin-left: 39px
}

.mfp-arrow-right:before {
  border-left: 27px solid #3F3F3F
}

.mfp-iframe-holder {
  padding-top: 40px;
  padding-bottom: 40px
}

.mfp-iframe-holder .mfp-content {
  line-height: 0;
  width: 100%;
  max-width: 900px
}

.mfp-iframe-holder .mfp-close {
  top: -40px
}

.mfp-iframe-scaler {
  width: 100%;
  height: 0;
  overflow: hidden;
  padding-top: 56.25%
}

.mfp-iframe-scaler iframe {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  background: #000
}

img.mfp-img {
  width: auto;
  max-width: 100%;
  height: auto;
  display: block;
  line-height: 0;
  box-sizing: border-box;
  padding: 40px 0;
  margin: 0 auto
}

.mfp-figure {
  line-height: 0
}

.mfp-figure:after {
  content: '';
  position: absolute;
  left: 0;
  top: 40px;
  bottom: 40px;
  display: block;
  right: 0;
  width: auto;
  height: auto;
  z-index: -1;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
  background: #444
}

.mfp-figure small {
  color: #BDBDBD;
  display: block;
  font-size: 12px;
  line-height: 14px
}

.mfp-figure figure {
  margin: 0
}

.mfp-bottom-bar {
  margin-top: -36px;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  cursor: auto
}

.mfp-title {
  text-align: left;
  line-height: 18px;
  color: #F3F3F3;
  word-wrap: break-word;
  padding-right: 36px
}

.mfp-image-holder .mfp-content {
  max-width: 100%
}

.mfp-gallery .mfp-image-holder .mfp-figure {
  cursor: pointer
}

@media screen and (max-width: 800px) and (orientation: landscape),
screen and (max-height: 300px) {
  .mfp-img-mobile .mfp-image-holder {
    padding-left: 0;
    padding-right: 0
  }

  .mfp-img-mobile img.mfp-img {
    padding: 0
  }

  .mfp-img-mobile .mfp-figure:after {
    top: 0;
    bottom: 0
  }

  .mfp-img-mobile .mfp-figure small {
    display: inline;
    margin-left: 5px
  }

  .mfp-img-mobile .mfp-bottom-bar {
    background: rgba(0, 0, 0, 0.6);
    bottom: 0;
    margin: 0;
    top: auto;
    padding: 3px 5px;
    position: fixed;
    box-sizing: border-box
  }

  .mfp-img-mobile .mfp-bottom-bar:empty {
    padding: 0
  }

  .mfp-img-mobile .mfp-counter {
    right: 5px;
    top: 3px
  }

  .mfp-img-mobile .mfp-close {
    top: 0;
    right: 0;
    width: 35px;
    height: 35px;
    line-height: 35px;
    background: rgba(0, 0, 0, 0.6);
    position: fixed;
    text-align: center;
    padding: 0
  }
}

@media all and (max-width: 900px) {
  .mfp-arrow {
    -webkit-transform: scale(0.75);
    transform: scale(0.75)
  }

  .mfp-arrow-left {
    -webkit-transform-origin: 0;
    transform-origin: 0
  }

  .mfp-arrow-right {
    -webkit-transform-origin: 100%;
    transform-origin: 100%
  }

  .mfp-container {
    padding-left: 6px;
    padding-right: 6px
  }
}

/* Plugin: Slick slider */

.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -khtml-user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent
}

.slick-list {
  position: relative;
  display: block;
  overflow: hidden;
  margin: 0;
  padding: 0
}

.slick-list:focus {
  outline: none
}

.slick-list.dragging {
  cursor: pointer;
  cursor: hand
}

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0)
}

.slick-track {
  position: relative;
  top: 0;
  left: 0;
  display: block;
  margin-left: auto;
  margin-right: auto
}

.slick-track:before,
.slick-track:after {
  display: table;
  content: ''
}

.slick-track:after {
  clear: both
}

.slick-loading .slick-track {
  visibility: hidden
}

.slick-slide {
  display: none;
  float: left;
  min-height: 1px
}

.slick-slide img {
  display: block
}

.slick-slide.slick-loading img {
  display: none
}

.slick-slide.dragging img {
  pointer-events: none
}

.slick-initialized .slick-slide {
  display: block
}

.slick-loading .slick-slide {
  visibility: hidden
}

.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent
}

.slick-arrow.slick-hidden {
  display: none
}

.slick-dots {
  list-style: none;
  text-align: center;
  margin-top: 20px;
}

.slick-dots li {
  display: inline-block
}

.slick-dots li button {
  width: 10px;
  height: 10px;
  margin: 0 5px;
  padding: 0;
  border: none;
  border-radius: 50%;
  background: #f1f1f3;
  text-indent: -9999px;
  cursor: pointer
}

.slick-dots li.slick-active button {
  background: #0086ff
}

a.nav-arrow,
.slick-arrow {
  display: block;
  z-index: 1;
  cursor: pointer;
  width: 50px;
  height: 50px;
  border-radius: 100%;
  overflow: hidden;
  text-indent: -9999px;
  border: 0;
  background-color: #f0f0f2;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 26px;
}

a:hover.nav-arrow,
.slick-arrow:hover {
  transform: scale(1.15);
}

a.nav-arrow.prev,
.slick-prev {
  background-image: url(../svg/link-icons/move-left.svg);
}

a.nav-arrow.next,
.slick-next {
  background-image: url(../svg/link-icons/move-right.svg);
}

/* Popup */

body.mfn-modal-open {
  overflow: hidden
}

/* Dodac do body */

.mfn-popup {
  display: none;
  box-sizing: content-box;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(25, 37, 48, .6);
  z-index: 9991;
}

.show-popup-bebuilder .mfn-popup {
  display: block;
}

.mfn-popup-inner {
  display: flex;
  align-items: center;
  position: fixed;
  padding: 0;
  left: 50%;
  top: 50%;
  width: 600px;
  transform: translate(-50%, -50%);
  z-index: 9999;
}

.mfn-popup-inner .desc-wrapper {
  text-align: center;
  padding: 0 7%;
}

.mfn-popup-inner .desc-wrapper h2 {
  font-size: 42px;
  line-height: 52px;
  font-weight: 400;
  margin-bottom: 25px;
}

.mfn-popup-inner .desc-wrapper lottie-player {
  margin-bottom: 35px;
}

.mfn-popup-inner .pic-wrapper {
  width: 100%;
  flex-shrink: 0;
  overflow: hidden;
  line-height: 0;
}

.mfn-popup-inner .pic-wrapper a {
  display: block;
}

.mfn-popup-inner a.mfn-popup-close {
  position: absolute;
  right: -20px;
  top: -20px;
  width: 40px;
  height: 40px;
  overflow: hidden;
  text-indent: -9999px;
  border-radius: 100%;
  display: block;
  transition: transform .3s ease-in-out;
  background-color: #dce5ec;
  background-image: url(../svg/be-popup-close.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 20px;
}

.mfn-popup-inner a:hover.mfn-popup-close {
  background-color: #cbd6de;
  transform: rotate(-180deg);
}

/* Cookie popup */
.mfn-cookies {
  display: none;
  box-sizing: content-box;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  padding: 0 20px;
  box-sizing: border-box;
  background: rgba(25, 37, 48, .6);
  z-index: 9991;
  font-size: 15px;
  line-height: 1.8;
}

.mfn-cookies-open .mfn-cookies {
  display: block;
}

.mfn-cookies-popup {
  display: flex;
  flex-direction: column;
  position: fixed;
  box-sizing: border-box;
  padding: 15px;
  left: 50%;
  top: 50%;
  width: 750px;
  max-width: calc(100% - 40px);
  transform: translate(-50%, -50%);
  z-index: 9999;
  border-radius: 8px;
  background-color: #fff;
  box-shadow: 6px 30px 60px 0px rgba(0, 0, 0, .18);
}

.mfn-cookies .mfn-cookies-header {
  padding: 15px 0;
  text-align: center;
}

.mfn-cookies .mfn-cookies-header>* {
  margin: 0;
}

.mfn-cookies .mfn-cookies-wrapper {}

.mfn-cookies .mfn-cookies-footer {
  display: flex;
  gap: 10px;
  padding: 20px;
  background-color: #FBFBFB;
  border-radius: 8px;
  width: 100%;
  box-sizing: border-box;
}

.mfn-cookies .mfn-cookies-footer>.button {
  flex-grow: 1;
  margin: 0;
  padding: 11px 20px;
}

.mfn-cookies .mfn-cookies-footer #consent_selected {
  display: none
}

.mfn-cookies .cookies-tab-nav {
  width: 100%;
  list-style: none;
  border-bottom: 1px solid rgba(8, 8, 14, .1);
  display: flex;
  gap: 10px;
  padding: 0 20px;
  box-sizing: border-box;
}

.mfn-cookies .cookies-tab-nav .tab {
  flex-grow: 1;
}

.mfn-cookies .cookies-tab-nav .tab a {
  display: block;
  text-align: center;
  padding: 15px 0px;
  position: relative;
  text-decoration: none;
  color: #07070A;
  font-size: 14px;
  line-height: 1.2;
  font-weight: 600;
}

.mfn-cookies .cookies-tab-nav .tab a:after {
  display: none;
  content: "";
  width: 100%;
  height: 2px;
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: #0089F7;
}

.mfn-cookies .cookies-tab-nav .is-active a {
  color: #0089F7;
}

.mfn-cookies .cookies-tab-nav .is-active a:after {
  display: block;
}

.mfn-cookies .cookies-tab-content {
  display: none;
  padding: 20px;
  box-sizing: border-box;
  max-height: calc(100vh - 260px);
  overflow: auto;
}

.mfn-cookies .cookies-tab-content>*:last-child {
  margin-bottom: 0;
}

/* .mfn-cookies .cookies-tab-content.is-active { display: block; } */

.mfn-cookies[data-tab="consent"] .cookies-tab-content[data-id="consent"] {
  display: block
}

.mfn-cookies[data-tab="details"] .cookies-tab-content[data-id="details"] {
  display: block
}

.mfn-cookies[data-tab="about"] .cookies-tab-content[data-id="about"] {
  display: block
}

.mfn-cookies[data-tab="details"] .mfn-cookies-footer #consent_selected {
  display: inline-block
}

.mfn-cookies[data-tab="details"] .mfn-cookies-footer #consent_customize {
  display: none
}

@media (max-width: 550px) {
  .mfn-cookies .cookies-tab-nav {
    padding: 0;
  }

  .mfn-cookies .cookies-tab-nav .tab a span {
    display: none;
  }

  .mfn-cookies .mfn-cookies-footer {
    flex-direction: column;
  }
}

.mfn-cookies .cookie-consent {
  display: flex;
  flex-direction: column;
  gap: 15px;
}

.mfn-cookies .cookie-consent .cookie-type {
  flex-grow: 1;
  padding: 15px 20px;
  background-color: #FBFBFB;
  border-bottom: 1px solid rgba(8, 8, 14, .04);
}

.mfn-cookies .cookie-consent .cookie-type header {
  display: flex;
  align-items: center;
  margin-bottom: 5px;
}

.mfn-cookies .cookie-consent .cookie-type header .mfn-switch {
  margin-left: auto;
}

.mfn-cookies .cookie-consent .cookie-type h6 {
  margin: 0;
}

.mfn-cookies .cookie-consent .cookie-type>*:last-child {
  margin-bottom: 0;
}

.mfn-switch {
  display: inline-flex;
}

.mfn-switch label {
  display: block;
  position: relative;
  width: 60px;
  height: 30px;
  background-color: #00032A;
  border-radius: 30px;
  cursor: pointer;
  transition: all ease-in-out 0.3s;
}

.mfn-switch label:after {
  content: "";
  display: block;
  width: 22px;
  height: 22px;
  background-color: #fff;
  border-radius: 100%;
  cursor: pointer;
  position: absolute;
  left: 4px;
  top: 4px;
  transition: all ease-in-out 0.3s;
}

.mfn-switch input[type=checkbox] {
  display: none;
}

.mfn-switch input[type=checkbox]:checked~label {
  background-color: #5ACB65;
}

.mfn-switch input[type=checkbox]:checked~label:after {
  left: 32px;
}

.mfn-switch input[type=checkbox]:disabled~label {
  opacity: .5;
  cursor: not-allowed;
  filter: saturate(0%);
}

.mfn-switch input[type=checkbox]:disabled~label:after {
  cursor: not-allowed;
}

/******************************************************
***********************   Grid   **********************
******************************************************/

.mfn-row {
  display: flex;
  flex: 0 1 auto;
  flex-direction: row;
  flex-wrap: wrap;
  box-sizing: border-box;
  margin-left: -10px;
  margin-right: -10px;
  justify-content: space-evenly;
  align-items: center;
}

.mfn-row .row-column {
  box-sizing: border-box;
  flex: 0 0 auto;
  padding: 0 10px;
  margin-bottom: 15px;
}

.mfn-row-start {
  align-items: flex-start;
}

.mfn-row-center {
  align-items: center;
}

.mfn-row-end {
  align-items: flex-end;
}

.mfn-row-align-center {
  justify-content: center;
}

.mfn-row .row-column-padding-l5 {
  padding-left: 5%;
}

.mfn-row .row-column-padding-r5 {
  padding-right: 5%;
}

.mfn-row .row-column-padding-l3 {
  padding-left: 3%;
}

.mfn-row .row-column-padding-r3 {
  padding-right: 3%;
}

.mfn-row .row-column[data-size="0.14"] {
  flex-basis: 14%;
  max-width: 14%;
}

.mfn-row .row-column[data-size="0.1666"] {
  flex-basis: 16.66666666%;
  max-width: 16.66666666%;
}

.mfn-row .row-column[data-size="0.2"] {
  flex-basis: 20%;
  max-width: 20%;
}

.mfn-row .row-column[data-size="0.25"] {
  flex-basis: 25%;
  max-width: 25%;
}

.mfn-row .row-column[data-size="0.3"] {
  flex-basis: 30%;
  max-width: 30%;
}

.mfn-row .row-column[data-size="0.3333"] {
  flex-basis: 33.33333333%;
  max-width: 33.33333333%;
}

.mfn-row .row-column[data-size="0.4"] {
  flex-basis: 40%;
  max-width: 40%;
}

.mfn-row .row-column[data-size="0.5"] {
  flex-basis: 50%;
  max-width: 50%;
}

.mfn-row .row-column[data-size="0.6"] {
  flex-basis: 60%;
  max-width: 60%;
}

.mfn-row .row-column[data-size="0.6667"] {
  flex-basis: 66.66%;
  max-width: 66.66%;
}

.mfn-row .row-column[data-size="0.7"] {
  flex-basis: 70%;
  max-width: 70%;
}

.mfn-row .row-column[data-size="0.75"] {
  flex-basis: 75%;
  max-width: 75%;
}

.mfn-row .row-column[data-size="0.8"] {
  flex-basis: 80%;
  max-width: 80%;
}

.mfn-row .row-column[data-size="0.8333"] {
  flex-basis: 83.33333333%;
  max-width: 83.33333333%;
}

.mfn-row .row-column[data-size="1"] {
  flex-basis: 100%;
  max-width: 100%;
}







/******************************************************
**********************   Header   *********************
******************************************************/

#header {
  padding: 0 15px;
  box-sizing: border-box;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  text-align: center;
  line-height: 0;
  background-color: transparent;
  color: #131624;
  box-shadow: 0px 10px 10px 0px transparent;
  z-index: 100;
  display: flex;
  justify-content: center;
  align-items: center;
}

#logo {
  float: left;
  font-size: 20px;
  margin-bottom: 0;
  line-height: 0;
}

#logo a {
  display: inline-block;
  height: 35px;
  padding: 17px 0 18px
}

#header .submenu-close {
  display: none;
  float: left;
  padding: 22px 20px 21px;
  transform: rotateY(180deg);
  cursor: pointer
}

#header .search-wrapper {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: none
}

#header .search-wrapper input.search {
  font-size: 15px;
  border-bottom-width: 1px
}

/* menu */
#menu {
  display: block;
  margin-bottom: 10px;
}

#menu ul {
  list-style: none
}

#menu ul li {
  float: left
}

#menu ul li a {
  display: block;
  line-height: 20px;
  color: #08080e;
  text-decoration: none;
  font-size: 15px;
  position: relative;
  cursor: pointer
}

#menu ul li a.button {
  color: #fff !important;
  padding: 20px;
}

#menu ul li:hover>a,
#menu ul li.active:hover>a,
#menu ul li a:not(.button):hover {
  color: #0130c6;
}

#menu ul li.show-mobile {
  display: none
}

/* menu level 1 */
#menu>ul>li>a {
  padding: 25px 20px;
  height: 70px;
  font-weight: 500;
  box-sizing: border-box;
}

#menu>ul>li.has-menu:hover>a:after {
  content: "";
  display: block;
  position: absolute;
  z-index: 2;
  left: calc(50% - 6px);
  bottom: -1px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 6px 6px 6px;
  border-color: transparent transparent #f6f7f9 transparent;
}

#menu>ul>li.has-menu:hover>a:before {
  content: "";
  display: block;
  position: absolute;
  z-index: 1;
  left: calc(50% - 7px);
  bottom: -1px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 7px 7px 7px;
  border-color: transparent transparent #e3e6ee transparent;
}

#menu>ul>li>a .menu-new {
  content: "";
  display: block;
  position: absolute;
  right: 0px;
  top: 19px;
  width: 8px;
  height: 8px;
  flex-shrink: 0;
  background: #E51756;
  margin-right: 6px;
  border-radius: 100%;
}

#menu>ul>li>a .menu-new:before,
#menu>ul>li>a .menu-new:after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  background: inherit;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  opacity: 0.3;
  background-color: #E51756;
}


#menu>ul>li>a>sup {
  font-size: 11px;
  opacity: .5;
}

#menu>ul>li.active>a {
  color: #7a7c8d;
}

#menu>ul>li>a svg {
  display: none;
}

/* menu level 2 */
#menu ul>li>.submenu {
  display: none;
  position: absolute;
  left: 0;
  width: 100%;
  background-color: #f6f7f9;
  border-top: 1px solid #e3e6ee;
  box-shadow: 0px 10px 10px 0px rgba(58, 63, 67, 0.12)
}

#menu ul>li:hover>.submenu {
  display: block
}

#menu ul>li ul li a {
  color: #2a2b39;
}

#menu ul>li:hover>.submenu.one-page-only {
  display: none
}

#menu .submenu.one-page ul {
  display: flex;
  justify-content: center;
  align-items: center;
}

#menu .submenu.one-page ul li a {
  padding: 25px 20px;
  line-height: 20px;
}

#menu .submenu.one-page ul li.active a {
  color: #0130c6;
}

#menu .submenu.one-page ul li.active a:after {
  content: "";
  display: block;
  width: 100%;
  height: 2px;
  border-radius: 2px;
  position: absolute;
  left: 0;
  bottom: -1px;
  background-color: #0130c6;
}

#menu .submenu.with-tabs .wrapper {
  display: flex;
  text-align: left;
  padding: 40px 0 50px;
}

#menu .submenu.with-tabs .tabs-nav {
  width: 25%;
  flex-shrink: 0;
  border-right: 1px solid #e3e6ee;
  margin-right: 40px;
}

#menu .submenu.with-tabs .tabs-nav li {
  float: none !important;
  display: block;
  margin-bottom: 5px;
}

#menu .submenu.with-tabs .tabs-nav li a {
  display: block;
  padding: 7px 10px;
  font-weight: 500;
}

#menu .submenu.with-tabs .tabs-nav li.active a {
  color: #0089f7;
}

#menu .submenu.with-tabs .tabs-nav li a:after {
  content: "";
  display: none;
  width: 22px;
  height: 22px;
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  background-image: url(../svg/link-icons/move-right-blue.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 22px;
}

#menu .submenu.with-tabs .tabs-nav li.active a:after {
  display: block;
}

#menu .submenu.with-tabs .tab {
  width: calc(75% - 40px);
}

#menu .submenu.with-tabs .tab ul {}

#menu .submenu.with-tabs .tab ul li {
  width: 31.3333%;
  margin: 0 1%;
  margin-bottom: 5px;
}

#menu .submenu.with-tabs .tab ul li a {
  position: relative;
  padding: 7px 10px 7px 40px;
}

#menu .submenu.with-tabs .tab ul li a:before {
  content: "";
  display: block;
  width: 30px;
  height: 30px;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  margin-right: 10px;
  background-position: center;
  background-size: 24px;
}

#menu .submenu.with-tabs .tab ul li a:hover {}

#menu .submenu.visual-select .wrapper {
  padding: 40px 20px;
  display: flex;
  flex-wrap: wrap;
  text-align: left;
}

#menu .submenu.visual-select h3.heading {
  width: 100%;
  margin-bottom: 40px;
  text-align: center;
}

#menu .submenu.visual-select h6.heading {
  font-size: 13px;
  letter-spacing: 1px;
}

/*
#menu .submenu.visual-select ul.builders-old { display: flex; justify-content: center; align-items: flex-start; margin: 0 10%; }
#menu .submenu.visual-select ul.builders-old li { flex: 1; }
#menu .submenu.visual-select ul.builders-old li a { padding:35px 20px 20px; border-radius: 8px; transition: background-color .2s ease-in-out }
#menu .submenu.visual-select ul.builders-old li a:hover { background-color: rgba(255,255,255,.7); }
#menu .submenu.visual-select ul.builders-old li a .builder-icon { display: inline-block; position: relative; width: 70px; height: 70px; background-size: 70px; background-position: center; background-repeat: no-repeat; margin-bottom: 10px; }
#menu .submenu.visual-select ul.builders-old li a h5 { font-size: 17px; line-height: 1.3; }

#menu .submenu.visual-select ul.builders-old li.muffin-live-builder a .builder-icon { background-image: url(../svg/builders/muffin-live-builder.svg); }
#menu .submenu.visual-select ul.builders-old li.muffin-builder a .builder-icon { background-image: url(../svg/builders/muffin-builder.svg); }
#menu .submenu.visual-select ul.builders-old li.muffin-woo-builder a .builder-icon { background-image: url(../svg/builders/muffin-woo-builder.svg); }
#menu .submenu.visual-select ul.builders-old li.muffin-header-builder a .builder-icon { background-image: url(../svg/builders/muffin-header-builder.svg); }
#menu .submenu.visual-select ul.builders-old li.muffin-loop-builder a .builder-icon { background-image: url(../svg/builders/muffin-loop-builder.svg); }

#menu .submenu.visual-select ul.builders-old li.muffin-header-builder a .builder-icon:before,
#menu .submenu.visual-select ul.builders-old li.muffin-loop-builder a .builder-icon:before { content: "NEW"; display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; position: absolute; right: 0; top: -8px; font-size: 10px; border-radius: 100%; overflow: hidden; background-color: #e51756; color: #fff;  }
*/


#menu .submenu.visual-select ul.builders {
  display: flex;
  width: 45%;
  flex-direction: column;
}

#menu .submenu.visual-select ul.builders li a {
  padding: 13px 60px 13px 20px;
  display: flex;
  align-items: center;
  border-radius: 8px;
  transition: background-color .2s ease-in-out
}

#menu .submenu.visual-select ul.builders li a .builder-icon {
  display: inline-flex;
  flex-shrink: 0;
  position: relative;
  width: 50px;
  height: 50px;
  background-size: 50px;
  background-position: center;
  background-repeat: no-repeat;
  margin-right: 15px;
}

#menu .submenu.visual-select ul.builders li a .builder-desc {
  text-align: left;
}

#menu .submenu.visual-select ul.builders li a h5 {
  font-size: 16px;
  line-height: 1.3;
  margin-bottom: 5px;
  ;
}

#menu .submenu.visual-select ul.builders li a p {
  margin-bottom: 0;
  font-size: 14px;
  line-height: 1.3;
  color: #555C70;
}

#menu .submenu.visual-select ul.builders li a:after {
  content: "";
  display: block;
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  width: 26px;
  height: 26px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 26px;
  background-image: url(../svg/link-icons/move-right.svg);
}

#menu .submenu.visual-select ul.builders li a:hover {
  background-color: rgba(255, 255, 255, .7);
}

#menu .submenu.visual-select ul.builders li a:hover h5 {
  color: #0089f7
}

#menu .submenu.visual-select ul.builders li a:hover p {
  color: initial;
}

#menu .submenu.visual-select ul.builders li.muffin-live-builder a .builder-icon {
  background-image: url(../svg/builders/muffin-live-builder.svg);
}

#menu .submenu.visual-select ul.builders li.muffin-builder a .builder-icon {
  background-image: url(../svg/builders/muffin-builder.svg);
}

#menu .submenu.visual-select ul.builders li.muffin-woo-builder a .builder-icon {
  background-image: url(../svg/builders/muffin-woo-builder.svg);
}

#menu .submenu.visual-select ul.builders li.muffin-header-builder a .builder-icon {
  background-image: url(../svg/builders/muffin-header-builder.svg);
}

#menu .submenu.visual-select ul.builders li.muffin-loop-builder a .builder-icon {
  background-image: url(../svg/builders/muffin-loop-builder.svg);
}

#menu .submenu.visual-select ul.builders li.muffin-popup-builder a .builder-icon {
  background-image: url(../svg/builders/muffin-popup-builder.svg);
}

#menu .submenu.visual-select ul.builders li.muffin-sidebar-menu-builder a .builder-icon {
  background-image: url(../svg/builders/muffin-sidebar-menu-builder.svg);
}

/*
#menu .submenu.visual-select ul.builders li.muffin-sidebar-menu-builder a .builder-icon:before { content: "NEW"; display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; position: absolute; right: 0; top: -8px; font-size: 10px; border-radius: 100%; overflow: hidden; background-color: #e51756; color: #fff;  }
*/


#menu .submenu.visual-select .builders-info {
  flex: 1;
  margin-left: 40px;
  padding: 10px 0 0 40px;
  border-left: 1px solid rgba(0, 0, 0, .1);
}

#menu .submenu.visual-select .builders-info h5 {
  margin-bottom: 5px;
}

#menu .submenu.visual-select .builders-info .splash-link {
  display: inline-block;
  line-height: 30px;
  color: #0089f7;
}

#menu .submenu.visual-select ul.builders-help {
  display: flex;
  margin: 30px -10px;
}

#menu .submenu.visual-select ul.builders-help li {
  margin: 0 10px;
  flex: 1;
}

#menu .submenu.visual-select ul.builders-help li .content-icon {
  border-radius: 8px;
}

#menu .submenu.visual-select .short-info {
  margin-bottom: 0px;
}

#menu .submenu.visual-select .short-info .price {
  font-size: 26px;
  line-height: 30px;
}


.page-elements #header.sticky.down #menu>ul>li.active>.submenu.with-tabs,
.single-article #header.sticky.down #menu>ul>li.active>.submenu.with-tabs {
  display: none
}

/* menu level 3 */

#menu ul li ul li ul li {
  float: none
}

#header .menu-toggle {
  display: none;
  float: left;
  width: 22px;
  padding: 22px 20px
}

#header .menu-toggle .icon-close {
  display: none;
  margin-left: 3px
}

#header .right {
  float: right;
  display: flex;
  align-items: center;
}

#header .help {
  display: block;
  margin-right: 20px;
  ;
}

#header .right .buy {
  padding-left: 30px;
  padding-right: 30px;
  line-height: 26px;
  margin: 0;
}

#menu .buy {
  margin: 20px 30px
}

#header .search-toggle {
  display: block;
  float: right;
  padding: 20px 10px
}

.search-active .search-toggle path {
  fill: #0089f7 !important
}

#header .filters-toggle {
  display: none;
  position: relative;
  float: right;
  padding: 20px;
  color: #08080e;
  text-decoration: none
}

#header .filters-toggle span {
  position: relative;
  top: -3px;
  margin-right: 5px
}

#header .filters-toggle .icon-close {
  position: absolute;
  right: 22px;
  top: 50%;
  margin-top: -8px;
  opacity: 0
}

.filter-active .filters-toggle {
  color: #0089f7 !important
}

.filter-active .filters-toggle path {
  fill: #0089f7 !important
}

.page-main #header .filters-toggle,
.page-websites #header .filters-toggle {
  display: block;
}


/* header classes */
#header.sticky {
  position: fixed;
}

#header.search .search-wrapper {
  display: inline-block
}

#header.sticky.down {
  top: -70px
}

#header.sticky.down #menu>ul>li.active>.submenu {
  display: block
}

#header.sticky.down #menu>ul>li.active>.visual-select {
  display: none
}

#header.hide {
  opacity: 0
}

#header.hide #logo,
#header.hide .right {
  opacity: 0
}

#header.show {
  opacity: 1;
  box-shadow: 0px 10px 10px 0px rgba(58, 63, 67, 0.12)
}

#header.show #logo,
#header.show .right {
  opacity: 1
}

#header.animate {
  transition: box-shadow .2s ease-in-out;
}

#header.animate-bg {
  transition: background-color .2s ease-in-out;
}

#header.animate input.search {
  transition: font-size .2s ease-in-out, border .2s ease-in-out
}

#header.animate #logo,
#header.animate #logo path,
#header.animate .right {
  transition: all .2s ease-in-out
}

#header.search {
  background-color: #f6f7f9;
  height: 70px;
}

#header.search #logo,
#header.search #menu,
#header.search .right {
  display: none;
}

#header.search .search-wrapper input.search {
  padding-top: 13px;
  padding-bottom: 13px;
}


/******************************************************
*******************   Main content   ******************
******************************************************/

.center {
  text-align: center
}

.right {
  text-align: right
}

.content-center {
  justify-content: center;
}

main article {
  width: 100%;
  float: left;
  clear: both;
  padding: 70px 0 0px;
}

article header,
footer header {
  margin-bottom: 50px;
}

article section,
footer section {
  margin-bottom: 50px;
}

.wrapper {
  position: relative;
  box-sizing: border-box;
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 30px
}

.content .wrapper {
  max-width: 700px;
}

.wrapper-inner {
  border-radius: 32px;
  padding: 50px;
  margin: 0 10px;
}

.wrapper-inner .mfn-row {
  margin-left: 0;
  margin-right: 0;
}


.mb-small {
  margin-bottom: 50px;
}

.mb-medium {
  margin-bottom: 80px;
}

.mb-big {
  margin-bottom: 60px;
}

.pt-small {
  padding-top: 50px;
}

.pt-medium {
  padding-top: 80px;
}

.pt-big {
  padding-top: 130px;
}

.header-centered {
  padding-left: 18%;
  padding-right: 18%;
}

.header-with-desc {
  display: flex;
  align-items: center;
}

.header-with-desc .left-desc,
.header-with-desc .right-desc {
  width: 50%;
}

.header-with-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.header-with-nav .inner-content {
  border-width: 0 1px 0 1px;
  border-style: solid;
  border-color: rgba(48, 64, 80, .15);
  width: 80%;
  padding: 0 8%;
  box-sizing: border-box;
}

.header-with-nav.no-nav {
  display: block;
}

.header-with-nav.no-nav .inner-content {
  border: 0;
  margin: 0 auto;
}

.header-with-nav.no-nav a.nav-arrow {
  display: none;
}

.section-centered {
  padding-left: 18%;
  padding-right: 18%;
}

.no-padding-top {
  padding-top: 0;
}

.no-padding-bottom {
  padding-bottom: 0;
}

.submenu-padding-top {
  padding-top: 100px;
}


/******************************************************
***************   Sections backgrounds   **************
******************************************************/

.page-main .features {
  background-color: #3b4659;
}

.single-article .features {
  background-color: #fafbfc;
}

.layouts {
  background-color: #f9fbfd;
}

.elements .layouts {
  background-color: transparent;
}

.about {
  background-color: #171930;
  background-image: url(../images/bg-about.webp);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: contain;
  background-attachment: fixed;
}

.trusted-by {
  background-color: #171930;
  background-image: url(../images/bg-about.webp);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: contain;
  background-attachment: fixed;
}

.ecommerce {
  background-color: #f9fafd;
}

.questions {
  background-color: #f4f7fb;
}

.start-building {
  background-color: #0090fa;
  background: linear-gradient(to top right, #0089F7 0%, #09B4FD 100%);
}

.start-building-light {
  background: #ecf1f8;
}

.sections-library {
  background-color: #fafbfc;
}

.options {
  background-color: #243645;
}

.prebuilt-websites {
  background-color: rgb(70, 69, 73);
  background: radial-gradient(circle, rgba(70, 69, 73, 1) 0%, rgba(57, 57, 62, 1) 100%);
}

.muffin-options-info {
  background-color: #182431;
  background-image: url(../images/bg-about.webp);
  background-position: top center;
  background-repeat: no-repeat;
  background-size: contain;
  background-attachment: fixed;
}

.elements .builder-items {
  background-color: #fafbfc;
}

.icons-included {
  background-color: #f9fbfd;
}

.testimonials-list {
  background-color: #f4f6f9;
}

.websites-form {
  background-color: #101722;
}

.feature-voting {
  background-color: #364153;
}

#other-features {
  background-color: #ece6f4;
}

.woo-demos {
  background-color: #201929;
}

.be-woo {
  background-color: #27153d;
}

.quick-tutorials {
  background-color: #4e4659;
}

#woo-builder-cart-steps {
  background-color: #F1FCF6;
}

#product-swatches {
  background-color: #fefaf8;
}

.new-typography {
  background-color: #fafbfc;
  background-image: url(../images/bg-typography.webp);
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.setup-wizard {
  background: rgb(42, 66, 89);
  background: radial-gradient(circle, #002394 1%, #000927 100%);
  padding-bottom: 0;
}

.customers-section {
  background: linear-gradient(to top, #F2F4F7 50%, #ffffff 50%);
}


.page-bebuilder-blocks .hero {
  background-color: #489c6d;
}

.page-bebuilder-blocks .hero-image {
  background: linear-gradient(to top, #fafbfc 50%, #489c6d 50%);
}

.page-bebuilder-blocks .features {
  background-color: #fafbfc;
}

.page-theme-options .hero {
  background-color: #182431;
}

.page-theme-options .hero-image {
  background: linear-gradient(to top, #243645 50%, #182431 50%);
}

.page-theme-options .features {
  background-color: #fafbfc;
}

.page-live-builder-discover-more-features .hero {
  background-color: #515b72;
}

.page-live-builder-discover-more-features .hero-image {
  background: linear-gradient(to top, #fafbfc 50%, #515b72 50%);
}

.page-live-builder-discover-more-features .features {
  background-color: #fafbfc;
}

.page-feature-voting .hero {
  background-color: #364153;
  background-image: url(../images/bg-feature-voting.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.page-woo-builder .hero {
  background-color: #563281;
}

.page-woo-builder .hero-image {
  background: linear-gradient(to top, #ffffff 50%, #563281 50%);
}

.page-bebuilder .hero {
  background-color: rgb(70, 69, 73);
  background: radial-gradient(circle, rgba(70, 69, 73, 1) 0%, rgba(57, 57, 62, 1) 100%);
}

.page-bebuilder .hero-video {
  background: linear-gradient(to top, #fff 50%, transparent 50%);
}

.page-header-builder .hero {
  background-color: #c3e8de;
}

.page-pricinga .hero {
  background-color: #F2F4F7;
}

/* .page-header-builder .hero-image { background: linear-gradient(to top, #fff 50%, #c3e8de 50%); } */
.page-header-builder .hero-image {
  background-image: url(../images/features/header-builder-2/webp/bg-header-hero.jpg);
  background-position: top center;
  background-size: contain;
  background-repeat: no-repeat;
}

.page-loop-builder .hero {
  background-color: #FCF0DF;
}

.page-loop-builder .hero-image {
  background: linear-gradient(to top, #ffffff 50%, #FCF0DF 50%);
}

.page-popup-builder .hero {
  background-color: #F9E9E9;
}

.page-popup-builder .hero-image {
  background: linear-gradient(to top, #ffffff 50%, #F9E9E9 50%);
}

.page-sidebar-menu-builder .hero {
  background-color: #EDFAF4;
}

.page-sidebar-menu-builder .hero-image {
  background: linear-gradient(to top, #ffffff 50%, #EDFAF4 50%);
}

.page-websites .hero {
  background-color: #f5f5f7;
}

.page-websites .hero-image {
  background: linear-gradient(to top, #ffffff 50%, #f5f5f7 50%);
}


.single-article .hero {
  background-color: #fafbfc;
}

.single-article .hero-with-gradient {
  background: linear-gradient(to top, transparent 20%, #fafbfc 20%);
}

.single-article .hero-performance {
  background-color: #fbece0;
}

.single-article .hero-performance-with-gradient {
  background: linear-gradient(to top, transparent 20%, #fbece0 20%);
}

.single-article .hero-design {
  background-color: #f1ecf5;
}

.single-article .hero-design-with-gradient {
  background: linear-gradient(to top, transparent 20%, #f1ecf5 20%);
}

.single-article .hero-layout {
  background-color: #e8f4f4;
}

.single-article .hero-layout-with-gradient {
  background: linear-gradient(to top, transparent 20%, #e8f4f4 20%);
}

.single-article .hero-translation {
  background-color: #e8f0f9;
}

.single-article .hero-translation-with-gradient {
  background: linear-gradient(to top, transparent 20%, #e8f0f9 20%);
}

.single-article .hero-updates {
  background-color: #f5f5f7;
}

.single-article .hero-updates-with-gradient {
  background: linear-gradient(to top, transparent 20%, #f5f5f7 20%);
}

.single-article .hero-with-gradient-navy {
  background-image: linear-gradient(to top, #fff 20%, transparent 20%), url(../images/bg-slider.webp);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: local, fixed;
}

/******************************************************
*********************   Sections   ********************
******************************************************/

/* Slider */
.slider {
  position: relative;
  height: 100vh;
  width: 100%;
  padding-top: 20vh;
  box-sizing: border-box;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  background-color: #252626;
  background-image: url(../images/bg-slide.webp);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.slider .hero-content {
  position: relative;
  z-index: 1;
  box-sizing: border-box;
  width: 1280px;
  max-width: 100%;
  margin: 0 auto;
  padding: 0 30px;
  color: #9899A8;
}

.slider .hero-content>*:not(:last-child) {
  margin-bottom: 35px;
}

.slider .hero-content .badge-group {
  color: inherit;
  border: 1px solid rgba(255, 255, 255, 0.1);
  background-color: #252626;
  margin-bottom: 15px;
  ;
}

.slider .hero-content .badge-group a,
.slider .hero-content .badge-group a:after {
  color: #fff;
}

.slider .hero-content h1.heading {
  font-size: 5.5vh;
  line-height: 1.1;
  font-weight: 500;
  color: #CFCFD8;
}

.slider .hero-content h3.heading {
  font-size: 2.5vh;
  line-height: 1.2;
  color: #9899A8;
  font-weight: 400;
}

.slider .hero-content h3.heading .num-websites {
  display: inline-block;
  border: 1px solid;
  padding: 0 7px;
  border-radius: 8px;
}

.slider .hero-content .buttons a.button {
  margin-top: 4px;
  margin-bottom: 4px;
}

.slider .hero-content .hero-reviews {
  display: flex;
  align-items: center;
  gap: 10px;
}

.slider .hero-content .hero-reviews>img {
  width: 130px;
}

.slider .hero-content .hero-reviews>p {
  margin: 0;
  line-height: 1.2;
}

.slider .hero-builder {
  width: 68vw;
  position: absolute;
  right: -5%;
  bottom: -10%;
  display: flex;
  flex-wrap: wrap;
  transform-origin: center;
  transform: rotate(330deg) skew(30deg, 0deg);
  gap: 20px;
}

.slider .hero-builder>div {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-grow: 1;
  gap: 20px;
}

.slider .hero-builder img {
  transform-origin: center;
}

.slider .hero-builder img:nth-child(1) {
  width: 100%;
}

.slider .hero-builder>div .hero-builder-pic {
  animation: HeroImages 4s ease-in-out infinite;
}

.slider .hero-builder>div .hero-builder-pic2 {
  position: relative;
  z-index: 1;
  width: 24%;
  animation-delay: 0s;
}

.slider .hero-builder>div .hero-builder-pic2 .woo-item {
  position: absolute;
  right: -1.4%;
  top: 27.62%;
  width: 50%;
  animation: HeroImageWoo 4s ease-in-out infinite;
}

.slider .hero-builder>div .hero-builder-pic3 {
  width: 58%;
  animation-delay: 0.5s;
  line-height: 0;
}

.slider .hero-builder>div .hero-builder-pic3 .stores {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  opacity: 0
}

.slider .hero-builder>div .hero-builder-pic4 {
  width: 18%;
  animation-delay: 1s;
}

@keyframes HeroImages {
  0% {
    transform: translateY(0) translateX(0);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);
  }

  50% {
    transform: translateY(-10px) translateX(10px);
    box-shadow: 0 20px 30px rgba(0, 0, 0, 0.4);
  }

  100% {
    transform: translateY(0) translateX(0);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);
  }
}

@keyframes HeroImageWoo {
  0% {
    transform: translateY(-15px) translateX(15%);
  }

  50% {
    transform: translateY(-15px) translateX(30%);
  }

  100% {
    transform: translateY(-15px) translateX(15%);
  }
}

.slider .hero-content .badge-group,
.slider .hero-content h1.heading,
.slider .hero-content h3.heading,
.slider .hero-content .buttons,
.slider .hero-content .hero-reviews {
  opacity: 0;
}

.highlight-text {
  position: relative;
}

.highlight-text:before {
  content: "";
  display: block;
  width: 0%;
  height: 7%;
  position: absolute;
  left: 0%;
  bottom: 10%;
  z-index: -1;
  background: rgb(9, 178, 251);
  background: linear-gradient(90deg, #0987ff 0%, #0130c6 100%);
}

.highlight-frame {
  display: inline-block;
  color: #fff;
  border: 1px solid #fff;
  padding: 0 0.5em;
  line-height: 1.5em;
  border-radius: 6px;
}

.highlight-frame-dark {
  color: #00032a;
  border-color: #00032a;
}

.page-bebuilder .highlight-frame {
  color: #fff;
}

/* Intro */
#intro {}

#intro .about-be {
  padding: 20px 0% 0 5%;
}

#intro .about-be .heading {
  margin-bottom: 20px;
}

#intro .see-testimonials {
  padding-top: 20px;
}

#intro .see-testimonials a.splash-link {
  margin-left: 25px;
}

.page-main #intro {
  padding-bottom: 0;
}


/* Hero */
.hero {
  padding: 150px 0 20px;
}

.hero .update-heading {
  display: inline-block;
  background-color: #e51756;
  color: #fff;
  font-weight: 500;
  border-radius: 8px;
  padding: 3px 20px;
}

.hero h1.heading {
  margin-bottom: 30px;
}

.hero h4.heading {
  margin-bottom: 40px;
  font-weight: 300;
}

.hero h6.heading {
  display: inline-block;
  margin: 0 2px 15px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 3px;
  text-transform: uppercase;
  padding: 2px 13px;
  background-color: rgba(1, 137, 255, .1);
  color: #0089f7;
  border-radius: 8px;
}

.hero .hero-buttons {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 40px;
}

.hero .hero-buttons .button {
  padding-left: 40px;
  padding-right: 40px;
}

.hero .hero-buttons .button,
.hero .hero-buttons .fancy-button {
  margin: 0 20px 15px;
}

.hero .button {
  margin-bottom: 40px;
}

.hero .hero-icon {
  display: block;
  margin: 0 auto;
}

.hero .hero-image,
.hero .hero-video {
  line-height: 0;
  text-align: center;
  margin: 0 auto;
  padding: 0 4%;
}

.hero .hero-video .hero-video-inner {
  display: inline-block;
  position: relative;
  max-width: 1200px;
  border-radius: 0 0 8px 8px;
  overflow: hidden;
  box-shadow: 6px 30px 60px 0px rgba(0, 0, 0, .14);
  line-height: 0;
}

.hero .hero-video .hero-video-inner video {
  transform: translateZ(0);
}

.hero .hero-video .hero-video-inner:before {
  content: "";
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  height: 45px;
  background: #121212;
  background-image: url(../svg/browser.svg);
  background-size: 50px;
  background-position: 15px center;
  background-repeat: no-repeat;
  display: block;
  border-radius: 8px 8px 0 0;
}

.hero .article-pic {
  margin-bottom: 0;
  border-radius: 8px;
  overflow: hidden;
  text-align: center;
}

.hero .article-pic>img {
  max-width: 80%;
}

.hero .article-video {
  max-width: 850px;
  margin: 0 auto;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 6px 30px 60px 0px rgba(0, 0, 0, .18);
  line-height: 0;
  transform: translateZ(0);
}

.hero .article-gif {
  max-width: 800px;
  margin: 0 auto;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 6px 30px 60px 0px rgba(0, 0, 0, .18);
  line-height: 0;
  transform: translateZ(0);
}

.page-feature-voting .hero {
  height: 100vh;
  padding: 10vh 0 0;
  box-sizing: border-box;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.hero .update-heading,
.hero h1.heading,
.hero h4.heading,
.hero h5.heading,
.hero h6.heading,
.hero p,
.hero .button,
.hero .hero-icon,
.hero .hero-image img,
.hero .hero-video .hero-video-inner,
.hero .visual-tabs,
.hero .be-logo,
.hero .our-support-info {
  opacity: 0;
}


.page-bebuilder-blocks h1.heading,
.page-live-builder-discover-more-features h1.heading,
.page-theme-options h1.heading,
.page-feature-voting h1.heading,
.page-woo-builder h1.heading,
.page-bebuilder h1.heading {
  color: #fff;
}

.page-bebuilder-blocks h4.heading,
.page-live-builder-discover-more-features h4.heading,
.page-theme-options h4.heading,
.page-feature-voting h4.heading,
.page-woo-builder h4.heading {
  color: #fff;
}

.page-bebuilder .hero h4.heading {
  color: #9899a8;
  font-weight: 200;
}

.hero h4.included-with-betheme {
  color: #fff;
  font-weight: 200;
}

.page-bebuilder-blocks .hero .heading .text {
  color: #ade6c6;
}

.page-live-builder-discover-more-features .hero .heading .text {
  color: #afc1d3;
}

.page-theme-options .hero .heading .text {
  color: #afc1d3;
}

.page-core-features .hero .heading .text {
  color: #0089f7;
}

.page-elements .hero .heading .text {
  color: #0089f7;
}

.page-feature-voting .hero .heading .text {
  color: #b8c4db;
}

.page-woo-builder .hero .heading .text {
  color: #ccb9e4;
}

.page-header-builder .hero h4.included-with-betheme,
.page-loop-builder .hero h4.included-with-betheme,
.page-popup-builder .hero h4.included-with-betheme,
.page-sidebar-menu-builder .hero h4.included-with-betheme,
.page-websites .hero h4.included-with-betheme {
  color: rgba(0, 3, 42, .8);
}

.page-header-builder .hero h4.included-with-betheme .highlight-frame,
.page-loop-builder .hero h4.included-with-betheme .highlight-frame,
.page-popup-builder .hero h4.included-with-betheme .highlight-frame,
.page-sidebar-menu-builder .hero h4.included-with-betheme .highlight-frame,
.page-websites .hero h4.included-with-betheme .highlight-frame {
  border-color: rgba(0, 3, 42, .8);
  color: rgba(0, 3, 42, .8);
}

.hero-with-gradient-navy h1.heading {
  color: #fff;
}

.hero-with-gradient-navy p {
  color: #959fb9;
}

.page-elements .hero {
  padding-bottom: 70px;
}

.page-reviews .hero .be-logo {
  width: 230px;
  margin-bottom: 50px;
}

.page-feature-voting .hero .be-logo {
  width: 230px;
  margin-bottom: 50px;
}


/* Hero image */
.hero-image {
  box-sizing: border-box;
  padding: 0;
}

.hero-image .inner-wrapper {
  opacity: 0;
  line-height: 0;
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 2%;
}


/* Landing hero */
.landing-hero {
  min-height: 100vh;
  padding: 130px 7% 70px;
  box-sizing: border-box;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.landing-hero h1.heading {
  opacity: 0;
  margin-bottom: 30px;
}

.landing-hero h5.heading {
  opacity: 0;
  margin-bottom: 30px;
}

.landing-hero .hero-icon {
  opacity: 0;
  margin-bottom: 30px;
}

.landing-hero .button {
  opacity: 0;
}

.landing-hero .landing-pic {
  opacity: 0;
}

/*.page-landing-live-builder .landing-hero { background-color: #515b72; }
    .page-landing-live-builder .landing-hero h1.heading { color: #fff; }
    .page-landing-live-builder .landing-hero h5.heading { color: #afc1d3; }
    .page-landing-live-builder .landing-hero .text { color: #afc1d3; }*/
.page-live-builder .landing-hero {
  background-color: #515b72;
}

.page-live-builder .landing-hero h1.heading {
  color: #fff;
}

.page-live-builder .landing-hero h5.heading {
  color: #afc1d3;
}

.page-live-builder .landing-hero .text {
  color: #afc1d3;
}


/* Content */
.content {
  padding-top: 90px;
}

.content .two-ways {
  margin-bottom: 30px;
}

.content .mfn-item {}

.content .mfn-item .item-style {
  text-align: center;
  margin-bottom: 30px;
  color: #161922;
  font-weight: 500;
  clear: both;
}

.content .mfn-item .item-style:not(:first-child) {
  margin-top: 50px;
}

.content .mfn-item-full-width {
  width: 100vw;
  left: 50%;
  transform: translateX(-50%);
  position: relative;
  padding: 100px 40px 70px;
  box-sizing: border-box;
}

.content .mfn-item-full-width .inner-wrapper-big {
  margin: 0 auto;
  max-width: 1080px;
}

.content .inner-wrapper-big {
  margin: 0 -220px;
}

.content .inner-wrapper-full-width {
  margin: 0 -400px;
}


/* Our video */
.our-video {}

.our-video .our-video-slider .item {
  padding: 20px 30px;
  box-sizing: border-box;
}

.our-video .our-video-slider .video {
  position: relative;
  margin-bottom: 30px;
  opacity: 0.6;
  overflow: hidden;
  border-radius: 8px;
  box-shadow: 6px 30px 60px 0px rgba(0, 0, 0, .18);
}

.our-video .our-video-slider .slick-center .video {
  transform: scale(1.05);
  opacity: 1;
}

.our-video .our-video-slider .video a.play-button {
  opacity: 0;
}

.our-video .our-video-slider .slick-arrow {
  position: absolute;
  top: calc(50% - 65px);
  box-shadow: 0px 0px 20px 10px rgba(0, 3, 42, .05);
}

.our-video .our-video-slider .slick-prev {
  left: 15%;
}

.our-video .our-video-slider .slick-next {
  right: 15%;
}

.page-main .our-video {
  padding-bottom: 0;
}


/* Websites */

#websites .search-wrapper {
  margin: 30px 0;
}

/* #websites section:last-child { margin-bottom: 0; } */

#websites .filters {
  float: left;
  width: 270px;
  margin-left: 20px;
  box-sizing: border-box
}

#websites .filters .sidebar__inner {
  overflow: hidden;
  transform: translate(0, 0);
  transform: translate3d(0, 0, 0)
}

#websites .filters ul {
  margin-bottom: 40px;
  list-style: none;
  overflow: hidden
}

#websites .filters ul li {
  margin-bottom: 9px;
  padding-left: 30px;
  position: relative;
  box-sizing: border-box;
}

#websites .filters ul li a:before {
  content: "";
  display: block;
  position: absolute;
  left: -30px;
  top: 0px;
  width: 20px;
  height: 20px;
  border-radius: 3px;
  box-sizing: border-box;
  border: 1px solid #9c9c9d;
}

#websites .filters ul li.current a:before {
  background-color: #006edf;
  border: 0;
  background-image: url(../svg/check-white.svg);
  background-size: 20px;
  background-position: center;
  background-repeat: no-repeat;
}

#websites .filters ul li:after {
  content: attr(data-count);
  display: block;
  position: absolute;
  right: 0;
  top: 3px;
  padding: 2px 5px;
  border-radius: 3px;
  box-sizing: border-box;
  background: #f4f7fb;
  font-size: 11px;
  line-height: 20px;
}

#websites .filters ul li a {
  position: relative;
  text-decoration: none;
  font-size: 14px;
  font-weight: 400;
  color: #444
}

#websites .filters ul li a:hover {
  color: #006edf
}

#websites .filters ul li.current a {
  color: #006edf;
}

#websites .filters ul li[data-filter=".sho"] a {
  color: #7f54b3;
  background-image: url(../svg/logo_woo.svg);
  background-size: 21px;
  background-position: left 5px;
  background-repeat: no-repeat;
  padding-left: 27px;
}

#websites .filters ul li[data-filter=".ele"] a {
  color: #db3157;
  background-image: url(../images/websites/ele.svg);
  background-size: 20px;
  background-position: left center;
  background-repeat: no-repeat;
  padding-left: 27px;
}

#websites .websites {
  margin: 0 15px 50px 140px;
}

#websites .website {
  float: left;
  position: relative;
  width: 23%;
  max-width: 288px;
  margin: 0 1% 20px;
  text-align: center;
  text-align: center;
  font-weight: 400;
  transition: .3s ease-in-out;
}

#websites .website:hover {
    transform: scale(1.1);
}

#websites .website a {
  text-decoration: none;
  color: #525256;
  line-height: 40px
}

#websites .website img {
  display: block;
  border-radius: 10px;
  box-shadow: 0 0 20px #3333335c;
}


#websites .website:after {
  position: absolute;
  right: -7px;
  top: -7px;
  display: block;
  width: 26px;
  height: 26px;
  background-image: url(../images/websites/elementor.png);
  background-size: 26px 26px
}

#websites .website.new:after {
  right: -7px;
}

#websites .website.ele:after {
  content: "";
  background-image: url(../images/websites/ele.svg)
}

#websites .website.mfn:after {
  content: "";
  background-image: url(../images/websites/be.svg)
}

#websites .website.ele.mfn:after {
  content: "";
  width: 88px;
  background-image: url(../images/logo/logo-wip.svg);
  background-size: 88px 26px;
  background-repeat: no-repeat;
  background-color: #dde7f0;
  padding: 6px;
  background-position: center;
  border-radius: 20px;
}

#websites .website.mfn.sho:after {
  content: "";
  width: 57px;
  background-image: url(../images/websites/be-woo.svg);
  background-size: 57px 26px
}

#websites .website.mfn.ele.sho:after {
  content: "";
  width: 88px;
  background-image: url(../images/logo/logo-wip.svg);
  background-size: 88px 26px;
  background-color: #dde7f0;
  background-repeat: no-repeat;
  border-radius: 20px;
  background-position: center;
  padding: 6px;
}

#websites .website.ele:hover a:after {
  content: "Built with the free Elementor plugin";
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 100%;
  text-align: center;
  font-size: 10.5px;
  line-height: 10px;
  font-weight: 300;
  opacity: .7
}

#websites .website.ele.mfn:hover a:after {
  content: "Website may differ slightly in Elementor"
}

#websites .results {
  margin: 0 10px 25px;
  font-weight: 300
}

#websites .results .filter {
  cursor: pointer;
  background: #f4f7fb;
  padding: 2px 5px;
  border-radius: 3px;
  color: #00032a;
  font-size: 95%;
  margin: 0 3px;
  font-weight: 400;
}

#websites .results .filter:hover {
  text-decoration: line-through
}

#websites .websites-iso:after {
  content: "";
  width: 100%;
  height: 0;
  min-height: unset;
  position: absolute;
  top: -7px;
  left: 0;
  background: #fff url('../svg/preloader.svg') no-repeat center 270px;
  transition: opacity .2s ease-in-out;
  opacity: 0
}

#websites .websites-iso.loading:after {
  height: 2000px;
  min-height: 100%;
  opacity: 1
}

#websites .show-all {
  margin-top: 50px;
}

#player-main {
  width: 100%;
  height: auto;
  background-color: #151f2d;
}

#player-main-inner {
  width: 100%;
  float: left;
  height: 100vh;
  background-color: #151f2d;
  background-image: url(../images/bg-websites-video.webp);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  z-index: 1
}

#player-main h2,
#player-main p {
  color: #fff;
  margin-bottom: 30px
}

#player-main a {
  font-weight: 600;
  text-decoration: none
}

a#replay {
  opacity: 0;
  transition: opacity .3s;
  color: #0089f7;
  font-weight: 500;
  border-bottom: 1px solid #0089f7;
  padding-bottom: 5px;
  text-decoration: none;
}

#replay.showme {
  opacity: 1
}

#websites .container {
  max-width: 1140px;
  margin: 0 auto;
  width: 100%;
  position: relative;
  height: 100%
}

#websites .player-box {
  display: flex;
  align-items: center;
  width: 100%;
  box-sizing: border-box;
  padding: 0 30px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%)
}

#websites .player-box-left {
  width: 60%;
  float: left;
  margin-right: 4%;
  box-sizing: border-box
}

#websites .player-box-right {
  width: 36%;
  float: left;
  box-sizing: border-box
}

#websites .player-video video {
  width: 100%
}

#websites .player-desc-counter {
  float: left;
  position: relative
}

#websites .player-counter-number {
  display: inline-block;
  margin-bottom: 0;
  color: rgba(255, 255, 255, .4);
  font-size: 18px;
  font-weight: 600;
  padding-bottom: 10px;
  transition: .3s
}

#websites .player-counter-number.active {
  color: #0089f7
}

#websites .player-counter-number.one {
  width: 40px;
  text-align: left
}

#websites .player-counter-number.two {
  width: 40px;
  text-align: center
}

#websites .player-counter-number.three {
  width: 40px;
  text-align: right
}

#websites .player-desc-content {
  width: 100%;
  float: left;
  margin-top: 35px
}

#websites .player-desc-content-inner {
  display: none
}

#websites .player-desc-content-inner.show {
  display: block
}

#websites .duration {
  width: 0;
  height: 1px;
  background: #0089f7;
  max-width: 100%;
  position: relative;
  z-index: 55
}

#websites .duration-bg {
  width: 100%;
  height: 1px;
  background: rgba(255, 255, 255, .2);
  max-width: 100%;
  position: absolute;
  bottom: 0;
  left: 0
}


/*.page-main #websites { padding-bottom: 0; }*/
.page-websites .hero {
  padding-bottom: 0;
}

.page-websites #websites {
  padding-top: 70px;
}


/* Websites form */
.websites-form {
  padding-bottom: 100px;
  background-image: url(../images/bg-websites-form.jpg);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.websites-form h2.heading {
  color: #fff;
  margin-bottom: 20px;
}

.websites-form h5.heading {
  color: #b4b4c8;
}

.websites-form form {
  margin: 0 20%;
  position: relative;
}

.websites-form input[type="text"] {
  outline: none;
  border-radius: 0;
  box-sizing: border-box;
  border: none;
  box-shadow: 0px 10px 46px 0px rgba(2, 6, 13, 0.9);
  border-radius: 4px;
  font-size: 17px;
  line-height: 20px;
  padding: 22px;
  width: 100%;
  background: #fff;
}

.websites-form button.btn {
  display: block;
  position: absolute;
  right: 7px;
  top: 8px;
  font-weight: 600;
  padding: 15px 50px 15px 30px;
  background-color: #dde7f0;
  color: #07070A;
  background-image: url(../svg/link-icons/move-right.svg);
  background-repeat: no-repeat;
  background-size: 26px;
  background-position: right 20px center;
  border-radius: 4px;
  font-size: 16px;
  border: 0;
  letter-spacing: 0;
  cursor: pointer;
}

.websites-form button.btn:hover {
  background-color: #e5edf4;
  background-position: right 15px center;
}

.websites-form .alert {
  text-align: center;
  opacity: 0;
  color: #B9DB92;
}

.websites-form .alert .icon {
  display: block;
  width: 70px;
  height: 70px;
  margin: 0 auto 20px;
  border-radius: 100%;
  background: #8FC84D;
  color: #fefefe;
  background-image: url(../svg/check-white.svg);
  background-size: 40px;
  background-position: center;
  background-repeat: no-repeat;
}

.websites-form .help-block {
  opacity: 0;
  padding: 7px 20px;
  position: absolute;
  left: 40px;
  top: calc(100% + 5px);
  transform: translateX(-50%);
  background-color: #f24437;
  color: #fff;
  border-radius: 8px;
  font-size: 14px;
}

.websites-form .help-block:after {
  content: "";
  position: absolute;
  border: solid transparent;
  border-bottom-color: transparent;
  border-bottom-color: #f24437;
  border-width: 8px;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
}

/* Setup Wizard */
.setup-wizard h2 {
  color: #fff;
}

.setup-wizard h6 {
  color: #fff;
}

.setup-wizard p {
  color: rgba(255, 255, 255, .65);
}

.setup-wizard hr {
  margin: 35px 0;
  border-color: rgba(255, 255, 255, .08);
}

.setup-wizard .setup-wizard-testimonial {
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}

.setup-wizard .setup-wizard-testimonial p {
  margin-bottom: 7px;
  color: #fff;
}

.setup-wizard .setup-wizard-testimonial .stars {
  text-align: center;
  margin: 0 20px;
}

.setup-wizard .setup-wizard-testimonial .inner {
  flex: 1;
  text-align: left;
}

/* Testimonials */
.testimonials {}

.testimonials header .right-desc {
  margin-left: auto;
  width: auto;
}

.testimonials .support-info {
  display: flex;
}

.testimonials .support-info h5 {
  margin-right: 50px;
}

.testimonials .support-info p.stars {
  margin-bottom: 0;
  letter-spacing: 3px;
}

.testimonials-slider {
  background-color: #fafafa;
  border-radius: 8px;
  padding: 10px 20px;
}

.testimonials-slider li.slide {}

.testimonials-slider li.slide .item {
  padding: 40px 10% 20px;
}

.testimonials-slider li.slide .item .logo {
  display: flex;
  height: 40px;
  align-items: center;
  margin-bottom: 20px;
}

.testimonials-slider li.slide .item blockquote {
  min-height: 100px;
}

.testimonials-slider li.slide .item .heading {
  margin-bottom: 5px;
}

.testimonials-slider .slick-arrow {
  position: absolute;
  top: calc(50% - 25px);
}

.testimonials-slider .slick-prev {
  left: -20px;
}

.testimonials-slider .slick-next {
  right: -20px;
}

.page-main .testimonials {
  padding-bottom: 0;
}

.page-bebuilder-blocks .testimonials {
  padding-bottom: 0;
}

.page-live-builder .testimonials {
  padding-bottom: 0;
}

.page-theme-options .testimonials {
  padding-bottom: 0;
}


/* About */
.about {}

.about h2.heading,
.about h3.heading {
  color: #fff;
}

.about h5.heading {
  color: #8c8c9e;
}

.about p {
  color: #a5a5bb;
}

.about .envato {
  color: #9698aa;
}


/* Trusted by */
.trusted-by {}

.trusted-by h2.heading {
  color: #fff;
}

.trusted-by h6.heading {
  color: #fff;
  margin-bottom: 5px;
}

.trusted-by blockquote {
  color: #d0dce6;
}

.trusted-by {
  color: #a5a5bb;
}

/* Main features */
.main-features {}

.main-features .main-features-items {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
}

.main-features.col2 .main-features-items {
  grid-template-columns: 1fr 1fr;
}

.main-features .main-features-items .item {
  padding: 80px 10% 50px;
  overflow: hidden;
  text-align: center;
}

.main-features .main-features-items .item h4,
.main-features .main-features-items .item p {
  margin: 0 15% 20px;
}

.main-features .main-features-items .item a.splash-link {
  margin-bottom: 50px;
  margin-left: 25px;
}

.main-features .main-features-items .item .feature-icon {
  display: block;
  margin: 0 auto 50px;
  max-width: 300px;
  padding: 0 10%;
}

.main-features .main-features-items .item .feature-image {
  position: relative;
}

.main-features .item-builder {
  background-color: #e6ecf6;
}

.main-features .item-options {
  background-color: #dbe4ef;
}

.main-features .item-websites {
  background-color: #f1f6fa;
}

.main-features .item-elements {
  background-color: #e6ecf6;
}

.page-main .main-features {
  padding-bottom: 0;
}

.page-bebuilder-blocks .main-features {
  padding-bottom: 0;
}

.page-live-builder-discover-more-features .main-features {
  padding-bottom: 0;
}

.page-theme-options .main-features {
  padding-bottom: 0;
}

.page-elements .main-features {
  padding-bottom: 0;
}

.page-woo-builder .main-features {
  padding-top: 80px;
  padding-bottom: 0;
}


/* Made for everyone */
.made-for-everyone .wrapper {
  max-width: 1440px;
}

.made-for-everyone .made-for-everyone-box {
  display: block;
  position: relative;
  background-color: #f3f6f9;
  border-radius: 8px;
  padding: 40px;
  text-align: center;
  box-sizing: border-box;
}

.made-for-everyone .made-for-everyone-box .pic {
  line-height: 0;
  margin-bottom: 40px;
  border-radius: 8px;
  overflow: hidden;
}

.made-for-everyone .made-for-everyone-box .pic img {
  display: block;
  margin: 0 auto
}

.made-for-everyone .made-for-everyone-box.new:after {
  content: "";
  display: block;
  position: absolute;
  right: 20px;
  top: 20px;
  width: 36px;
  height: 36px;
  background-image: url(../svg/new-pink.svg);
  background-position: center;
  background-size: 36px;
  background-repeat: no-repeat;
}

.made-for-everyone-box.box-2 h3.heading {
  margin-top: 10px;
}

.made-for-everyone-box.box-2 .pic {
  margin-bottom: 0;
  margin-top: 40px;
}

.made-for-everyone-box.box-1 {
  background-color: #F8E8F8;
}

.made-for-everyone-box.box-2 {
  background-color: #F1F1F1;
}

.made-for-everyone-box.box-3 {
  background-color: #ECF4F8;
}

/*.page-landing-live-builder .made-for-everyone { padding-bottom: 0; }*/
.page-main .made-for-everyone {
  padding-top: 80px;
}

.page-live-builder .made-for-everyone {
  padding-bottom: 0;
}

/* Features */
.features {}

.features .features-items {
  display: grid;
  grid-column-gap: 40px;
  grid-template-columns: 1fr 1fr 1fr;
}

.features .features-items.col-2 {
  grid-template-columns: 1fr 1fr;
}

.features .features-items .item {
  text-align: center;
  margin-bottom: 40px;
}

.features .features-items .item a {
  display: block;
}

.features .features-items .item a .pic {
  line-height: 0;
  border-radius: 8px;
  overflow: hidden;
  margin-bottom: 20px;
}

.features .features-items .item a .heading {
  margin-bottom: 20px;
}

.features .features-items .item a p {
  color: #555c70;
  margin-bottom: 20px;
}

.features .features-items .item a .heading~p {
  margin-top: -5px;
}

.features .features-items .item a .see-more {
  display: block;
  margin: 0 auto;
  width: 50px;
  height: 50px;
  border-radius: 100%;
  background-color: rgba(8, 8, 14, .05);
  background-image: url(../svg/link-icons/move-right.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 26px;
}

.features .features-items .item a:hover {
  text-decoration: none;
}

.features .features-items .item a:hover .heading {
  color: inherit;
}

.features .features-items .item a:hover .see-more {
  transform: scale(1.1);
  background-color: rgba(0, 137, 247, .05);
  background-image: url(../svg/link-icons/move-right-blue.svg);
}

.features .features-items .item.browse-all a {
  display: flex;
  text-align: left;
  background-color: #0089f7;
  padding: 40px 40px 25px;
  border-radius: 8px;
  height: 100%;
  box-sizing: border-box;
  flex-direction: column;
  justify-content: center;
}

.features .features-items .item.browse-all a .heading {
  color: #fff;
}

.features .features-items .item.browse-all a img {
  margin-left: -10px;
}

.features .features-items .item.browse-all a:hover {
  background-color: #1999FF;
}

.features .features-items .item.browse-all a:hover .heading {
  color: #fff;
}

.features.dark {
  color: #b4b4c8;
}

.features.dark h2.heading {
  color: #fff;
}

.features.dark .tabs ul li a {
  color: #fff;
}

.features.dark .tabs ul li a:hover,
.features.dark .tabs>ul li.active a {
  color: #0089f7;
}

.features.dark .item a .heading {
  color: #fff;
}

.features.dark .item a .see-more {
  background-color: rgba(255, 255, 255, .05);
  background-image: url(../svg/link-icons/move-right-white.svg);
}

.features.dark .item a:hover .see-more {
  background-color: rgba(0, 137, 247, .05);
  background-image: url(../svg/link-icons/move-right-blue.svg);
}

.page-bebuilder-blocks .features {
  padding-top: 80px;
}

.page-live-builder .features {
  padding-top: 80px;
}


/* Features cards */
.features-cards {
  column-count: 2;
  column-gap: 40px;
}

.features-cards .item {
  display: block;
  position: relative;
  -webkit-column-break-inside: avoid;
  break-inside: avoid;
  background-color: #f3f6f9;
  border-radius: 8px;
  padding: 70px 40px 40px;
  text-align: center;
  box-sizing: border-box;
  margin-bottom: 40px;
}

.features-cards .item h6.heading {
  display: inline-block;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 3px;
  text-transform: uppercase;
  padding: 2px 13px;
  background-color: rgba(1, 137, 255, .1);
  color: #0089f7;
  border-radius: 8px;
}

.features-cards .item a.splash-link {
  margin-left: 25px;
}

.features-cards .item .pic {
  margin-top: 40px;
  line-height: 0;
}

.features-cards .item .pic img {
  display: block;
  margin: 0 auto
}

.features-cards .item.new:after {
  content: "";
  display: block;
  position: absolute;
  right: 20px;
  top: 20px;
  width: 36px;
  height: 36px;
  background-image: url(../svg/new-pink.svg);
  background-position: center;
  background-size: 36px;
  background-repeat: no-repeat;
}

.features-cards .item.performance {
  background-color: #fbece0;
}

.features-cards .item.design {
  background-color: #f1ecf5;
}

.features-cards .item.layout {
  background-color: #e8f4f4;
}

.features-cards .item.translation {
  background-color: #e8f0f9;
}

.features-cards .item.updates {
  background-color: #f5f5f7;
}


/* Plugins */
.plugins {
  padding-bottom: 30px;
}

.plugins .plugins-items {
  display: grid;
  grid-column-gap: 10px;
  grid-template-columns: 1fr 1fr 1fr;
}

.plugins .plugins-items .item {
  text-align: center;
  margin-bottom: 40px;
}

.plugins .plugins-items .item a {
  display: block;
  color: inherit;
  text-decoration: none;
}

.plugins .plugins-items .item .pic {
  width: 75px;
  height: 75px;
  line-height: 0;
  border-radius: 8px;
  margin-bottom: 20px;
  background-color: #fff;
  box-shadow: 0px 3px 6px 0px rgba(232, 239, 242, .5);
  border: 1px solid #f1f4f5;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.plugins .plugins-items .item .heading {
  margin-bottom: 2px;
}

.plugins .plugins-items .item p {
  margin-bottom: 5px;
}

.plugins .included-plugins {
  border-bottom: 1px solid rgba(8, 8, 14, .1);
  margin-bottom: 60px;
}



/* Layouts */
.layouts {}

.layouts .layouts-list {
  display: flex;
  list-style: none;
  justify-content: space-evenly;
}

.layouts .layouts-list li {
  text-align: center;
}

.page-elements .layouts {
  padding-bottom: 0;
}


/* Options */
.options {
  color: #a5a5bb;
}

.options .heading {
  color: #fff;
}

.options .options-info {
  border-right: 1px solid rgba(255, 255, 255, .1);
}

.options .options-items {
  display: grid;
  grid-column-gap: 10px;
  grid-template-columns: 1fr 1fr 1fr;
}

.options .options-items .item {
  text-align: center;
  margin-bottom: 40px;
}

.options .options-items .item .content-icon {
  margin-bottom: 10px;
  ;
}

.options .options-items .item .heading {
  margin-bottom: 2px;
}

.page-theme-options .options {
  padding-top: 120px;
}


/* Ecommerce */
.ecommerce .ecommerce-items .item {
  margin-bottom: 25px;
}

.ecommerce .ecommerce-info {
  border-bottom: 1px solid rgba(8, 8, 14, .1);
  margin-bottom: 70px;
  padding-bottom: 40px;
}


/* Support */
.support {}

.support .row-column {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.support .support-items .item {
  display: flex;
  margin-bottom: 25px;
}

.support .support-items .item img {
  margin-right: 30px;
}

.support .support-items .item .inner {
  padding-right: 15%;
}

.support .support-image {
  position: relative;
}

.support .support-image .inner-wrapper {
  width: calc(50vw - 20px);
  padding-bottom: 80px;
  overflow: hidden;
}

.support .support-image .inner-wrapper>img {
  display: block;
  max-width: calc(100% - (-200px));
}

.support .support-image .inner-wrapper .box {
  background: linear-gradient(45deg, #0130c6, #2559ff);
  color: #fff;
  text-align: center;
  max-width: 300px;
  position: absolute;
  left: 0;
  bottom: 0;
  box-sizing: border-box;
  padding: 40px 40px 25px;
  border-radius: 8px;
}

.support .support-image .inner-wrapper .box .heading {
  color: #fff;
}

.support .support-image .inner-wrapper .box p.stars {
  letter-spacing: 3px;
}

.page-main .support {
  padding-bottom: 0;
}

.page-bebuilder-blocks .support {
  padding-bottom: 0;
}

.page-live-builder .support {
  padding-bottom: 0;
}

.page-theme-options .support {
  padding-bottom: 0;
}


/* Blog */
.blog .blog-posts {}

.blog .blog-posts .item a {
  display: block;
}

.blog .blog-posts .item .photo {
  overflow: hidden;
  border-radius: 8px;
  margin-bottom: 20px;
}

.blog .blog-posts .item .photo img {
  display: block;
}

.blog .blog-posts .item .heading {
  margin-right: 5%;
  margin-bottom: 8px;
}

.blog .blog-posts .item .date {
  color: #aaadb7;
}

.start-building {
  color: #fff;
}

.start-building a {
  color: #f6fcff;
}

.start-building a:hover {
  color: #fff;
}

.start-building h1.heading,
.start-building h3.heading,
.start-building h4.heading {
  color: #fff;
}

.start-building h5.heading {
  color: #d5eaf5;
}

.start-building-light {
  color: #00032a;
}

.start-building-light a {
  color: #0089f7;
}

.start-building-light a:hover {
  color: #1999FF;
}

.start-building-light h1.heading,
.start-building-light h3.heading,
.start-building-light h4.heading {
  color: #00032a;
}

.start-building-light h5.heading {
  color: #00032a;
}

.start-building .buy-now {
  margin-bottom: 80px;
}

.start-building .buy-now .button {
  margin-bottom: 40px;
}


/* Sections library */
.sections-library {}

.sections-library ul.sections-library-tabber {
  margin-bottom: 40px;
  list-style: none;
}

.sections-library ul.sections-library-tabber li.step {
  counter-increment: ol-counter;
  position: relative;
  background-color: #fff;
  border-radius: 8px;
  margin-bottom: 8px;
  border: 1px solid #f2f6fa;
}

.sections-library ul.sections-library-tabber li.step.active {
  background-color: #1999FF;
  border-color: #1999FF;
  color: #fff;
}

.sections-library ul.sections-library-tabber li.step:after {
  content: "";
  display: inline-block;
  width: 24px;
  height: 24px;
  background-image: url(../svg/link-icons/arrow-down.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 24px;
  position: absolute;
  left: 15px;
  top: 20px;
}

.sections-library ul.sections-library-tabber li.step.active:after {
  background-image: url(../svg/link-icons/arrow-up.svg);
}

.sections-library ul.sections-library-tabber li.step .title {
  padding: 20px 20px 20px 60px;
  margin: 0;
  cursor: pointer;
}

.sections-library ul.sections-library-tabber li.step.active .title {
  color: #fff;
}

.sections-library ul.sections-library-tabber li.step .desc {
  padding: 0 20px 5px 60px;
}

.sections-library ul.sections-library-tabber li.step:not(.active) .desc {
  display: none;
}


/* Builder items */
.builder-items {}

.builder-items .builder-items-browser ul.items {
  margin: 0;
  padding: 20px 20px 10px;
  list-style: none;
  display: grid;
  grid-column-gap: 10px;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  background-color: #f6f9fa;
}

.builder-items .builder-items-browser ul.items li {
  margin-bottom: 10px;
}

.builder-items .builder-items-browser ul.items li a {
  display: block;
  text-align: center;
  padding: 10px 5px;
  text-decoration: none;
  background-color: #fff;
  border: 1px dashed #d3d5d8;
  border-radius: 3px;
  box-sizing: border-box;
}

.builder-items .builder-items-browser ul.items li a .mfn-icon {
  display: block;
  margin: 0 auto;
  width: 40px;
  height: 40px;
  opacity: .4;
  background-size: 40px;
  margin-bottom: 5px;
  background-position: center;
  background-repeat: no-repeat;
}

.builder-items .builder-items-browser ul.items li a .title {
  display: block;
  color: #00032a;
  font-size: 14px;
  white-space: nowrap;
  overflow: hidden;
}

.builder-items .builder-items-browser ul.items li a p {
  color: #555c70;
}

.builder-items .builder-items-browser ul.items li a:hover {
  border-color: #1999FF;
  border-style: solid;
  box-shadow: 0px 0px 4px 2px rgba(97, 100, 102, 0.05);
}

.builder-items .builder-items-browser ul.items li a:hover .mfn-icon {
  opacity: 1;
}

.builder-items .facts-in-numbers .row-column:not(:last-child) {
  border-right: 1px solid #dee7ee;
}

.builder-items.big .builder-items-browser ul.items {
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
}

.builder-items.big .builder-items-browser ul.items li a .mfn-icon {
  width: 60px;
  height: 60px;
  background-size: 60px;
}

.builder-items.big .builder-items-browser ul.items li a {
  padding: 30px 15px;
}

.builder-items.woo-items .builder-items-browser ul.items {
  grid-template-columns: 1fr 1fr 1fr 1fr;
}

.builder-items.woo-items .builder-items-browser ul.items li a {
  cursor: initial;
}

.builder-items.woo-items .builder-items-browser ul.items li a .mfn-icon {
  width: 70px;
  height: 70px;
  background-size: 70px;
}

.builder-items.woo-items .builder-items-browser ul.items li a .title {
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 5px;
}

.page-live-builder .builder-items {
  padding-bottom: 0;
}

.page-elements .builder-items.big {
  padding-top: 80px;
}


/* Beginner advanced */
.beginners-professionals {}

.beginners-professionals .info {
  box-sizing: border-box;
  padding: 40px 40px 25px;
  background: #0089f7;
  color: #fff;
  border-radius: 8px;
  position: absolute;
  text-align: center;
}

.beginners-professionals .info .number,
.beginners-professionals .info .heading {
  color: #fff;
}

.beginners-professionals .info-pic-left,
.beginners-professionals .info-pic-right {
  position: relative;
}

.beginners-professionals .info-pic-left .info {
  left: 0;
  top: 50%;
  transform: translate(-15%, -55%);
}

.beginners-professionals .info-pic-right .info {
  right: 0;
  top: 50%;
  transform: translate(15%, -55%);
}

.page-bebuilder-blocks .beginners-professionals {
  padding-bottom: 0;
}

.page-live-builder .beginners-professionals {
  padding-bottom: 0;
}

.page-theme-options .beginners-professionals {
  padding-bottom: 0;
}


/* Fullscreen article */
.fullscreen-article {
  height: 100vh;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
}

.fullscreen-article.betheme {
  background-color: #060814;
  background-image: url(../images/bg-fullscreen-betheme.webp);
}


/* Prebuilt websites */
.prebuilt-websites {
  color: #a5a5bb;
}

.prebuilt-websites .heading {
  color: #fff;
}

.prebuilt-websites .heading .border {
  display: inline-block;
  border: 2px solid #fff;
  padding: 0 7px;
  border-radius: 8px;
}

.prebuilt-websites .content-image {
  display: block;
  margin: 0 auto 50px;
}


/* Performance */
.performance {
  padding-bottom: 0;
}

.performance ul.content-list {
  display: grid;
  grid-column-gap: 10px;
  grid-template-columns: 1fr 1fr 1fr;
  margin-left: 10%;
  margin-right: 10%;
}

.performance .facts-in-numbers .row-column:not(:last-child) {
  border-right: 1px solid #dee7ee;
}

.performance .content-image {
  display: block;
  margin: 0;
}


/* Core features category */
.page-features .core-features-cat {
  padding-top: 80px;
  padding-bottom: 0;
}


/* Muffin Options info */
.muffin-options-info {}

.muffin-options-info h2.heading,
.muffin-options-info h3.heading {
  color: #fff;
  margin-bottom: 30px;
}

.muffin-options-info h5.heading {
  color: #8c8c9e;
}

.muffin-options-info p {
  color: #a5a5bb;
}

.muffin-options-info .content-image {
  width: 780px;
  margin: 40px auto;
}


/* Icons included */
.icons-included {}

.icons-included header h4.heading {
  margin-bottom: 40px;
}

.icons-included .content-image {
  max-width: 550px;
  margin: 0 auto 40px;
}

.font-library {
  margin: 0 20px;
  border-bottom: 1px dotted rgba(0, 0, 0, .5);
  color: #50738e;
}


/* Testimonials list */
.testimonials-list {}

.testimonials-list .testimonials-list-items {
  column-count: 3;
  column-gap: 30px;
}

.testimonials-list .testimonials-list-items .item {
  display: block;
  -webkit-column-break-inside: avoid;
  break-inside: avoid;
  opacity: 1;
  text-align: center;
  background-color: #fff;
  border-radius: 8px;
  padding: 40px 10% 20px;
  box-sizing: border-box;
  margin-bottom: 40px;
}

.testimonials-list .testimonials-list-items .item.hide {
  height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  opacity: 0
}

.testimonials-list .testimonials-list-items .item blockquote {
  font-size: 18px;
  line-height: 32px;
  color: #00032a;
}

.testimonials-list .testimonials-list-items .item .date {
  color: #a4aab9;
  margin-top: 15px;
  display: block;
  font-size: 13px;
}

.testimonials-list .testimonials-list-items .item .heading {
  margin-bottom: 5px;
}

.testimonials-list .testimonials-list-items .item {
  transition: opacity .3s ease-in-out
}

.testimonials-list .ready-to-start {}

.testimonials-list .ready-to-start .heading,
.testimonials-list .ready-to-start p {
  margin-bottom: 30px;
}

.testimonials-list .recommended-by {}

.testimonials-list .recommended-by .item {
  padding: 0 20px;
  text-align: center;
}

.testimonials-list .recommended-by .item blockquote {
  min-height: 150px;
}

/* .page-landing-live-builder .testimonials-list { background-color: #fcfcfd; } */
.page-live-builder .testimonials-list {
  background-color: #fcfcfd;
}


/* Feature voting list */
.feature-voting {
  background-image: url(../images/bg-feature-voting-list.webp);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}

.feature-voting .idea-pic {
  display: block;
  margin: 0 auto;
}

.feature-voting .voting-list {
  list-style: none;
  margin: 0 10%;
}

.feature-voting .voting-list li {
  display: flex;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0px 10px 46px 0px rgba(1, 7, 39, .1);
  margin-bottom: 20px;
}

.feature-voting .voting-list li:last-child {
  margin-bottom: 0;
}

.feature-voting .voting-list li:hover {
  transform: scale(1.02);
  box-shadow: 0px 10px 46px 0px rgba(1, 7, 39, .5);
}

.feature-voting .voting-list li .votes {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  font-size: 30px;
  line-height: 30px;
  font-weight: 500;
  width: 140px;
  padding: 20px;
  box-sizing: border-box;
  border-radius: 8px 0 0 8px;
  background-color: #cce4ff;
  color: #0089f7;
}

.feature-voting .voted .voting-list li.active .votes {
  background-color: #0089f7;
  color: #fff;
}

.feature-voting .voting-list li .done {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  line-height: 20px;
  text-align: center;
  width: 140px;
  padding: 20px;
  box-sizing: border-box;
  border-radius: 8px 0 0 8px;
  background-color: rgba(0, 0, 0, .05);
  color: rgba(0, 0, 0, .7);
}

.feature-voting .voting-list li .done p {
  margin-bottom: 7px;
}

.feature-voting .voting-list li .desc {
  flex: 1 1 auto;
  padding: 30px 30px 15px;
  box-sizing: border-box;
}

.feature-voting .voting-list li .desc h4 {
  margin-bottom: 7px;
}

.feature-voting .voting-list li .status-options {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  padding: 20px 30px;
}

.feature-voting .voting-list li .status {
  display: block;
  oveflow: hidden;
  width: 36px;
  height: 36px;
  background-image: url(../svg/in-progress.svg);
  background-size: 36px;
  background-repeat: no-repeat;
  text-indent: -9999px;
}

.feature-voting .voting-list li .vote-options {
  flex-shrink: 0;
  margin: 20px 0;
  padding: 0 30px;
  border-left: 1px solid rgba(8, 8, 14, .1);
  display: flex;
  align-items: center;
  justify-content: center;
}

.feature-voting .voting-list li .vote-options a.vote {
  display: block;
  oveflow: hidden;
  width: 36px;
  height: 36px;
  background-image: url(../svg/like.svg);
  background-size: 36px;
  background-repeat: no-repeat;
  text-indent: -9999px;
}

.feature-voting .voting-list li .vote-options a:hover.vote {
  background-image: url(../svg/like-blue.svg);
}

.feature-voting .alert {
  text-align: center;
  opacity: 0;
  color: #B9DB92;
  margin-bottom: 60px;
}

.feature-voting .alert .icon {
  display: block;
  width: 70px;
  height: 70px;
  margin: 0 auto 20px;
  border-radius: 100%;
  background: #8FC84D;
  color: #fefefe;
  background-image: url(../svg/check-white.svg);
  background-size: 40px;
  background-position: center;
  background-repeat: no-repeat;
}


.page-feature-voting .voting.voted .vote-options {
  display: none
}

.page-feature-voting .voting:not(.voted) .thanks {
  display: none
}

.page-feature-voting .feature-voting {
  padding-top: 0;
}

.feature-voting .voting-list li:nth-child(2) .votes,
.feature-voting .voting-list li:nth-child(8) .votes {
  background: #ebdff0;
  color: #9a59b5;
}

.feature-voting .voting-list li:nth-child(3) .votes,
.feature-voting .voting-list li:nth-child(9) .votes {
  background: #cbf1fc;
  color: #03c9fd;
}

.feature-voting .voting-list li:nth-child(4) .votes,
.feature-voting .voting-list li:nth-child(10) .votes {
  background: #fcf3d0;
  color: #f1c510;
}

.feature-voting .voting-list li:nth-child(5) .votes,
.feature-voting .voting-list li:nth-child(11) .votes {
  background: #d4f5e3;
  color: #2ccb70;
}

.feature-voting .voting-list li:nth-child(6) .votes,
.feature-voting .voting-list li:nth-child(12) .votes {
  background: #f9dcd9;
  color: #e74d3d;
}

.feature-voting .voting-list li:nth-child(7) .votes,
.feature-voting .voting-list li:nth-child(13) .votes {
  background: #fcebd1;
  color: #f39c13;
}

.feature-voting .view-changelog h2.heading {
  color: #fff;
  margin-bottom: 30px;
}



/* Woocommerce demos */
.woo-demos {
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  background-position: center;
  background-image: url(../images/bg-woo-demos.webp);
}

.woo-demos .heading {
  color: #fff;
}

.woo-demos p {
  color: #a5a5bb;
}

.woo-demos .number {
  color: #ac8fcf;
}

.woo-demos h4 {
  margin: 40px 0;
}

/* Be + Woo */
.be-woo {
  min-height: 100vh;
  display: flex;
  align-items: center;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  background-image: url(../images/bg-be-woo.webp);
}

.be-woo .heading {
  color: #fff;
}

.be-woo p {
  color: #d1bcea;
}

.be-woo .be-woo-wrapper {
  background-color: #7f54b3;
  padding: 60px 10%;
  box-sizing: border-box;
  max-width: 600px;
}

.be-woo .be-woo-wrapper img {
  max-width: 80%;
  margin: 0 auto;
}

/* Be + WP */
.be-wp {
  padding-top: 40px;
  padding-bottom: 0;
}

.be-wp-box {
  box-sizing: border-box;
  padding: 110px 40px 95px;
  background: #0089f7;
  color: #fff;
  border-radius: 8px;
  text-align: center;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url(../images/bg-be-wp.webp);
}

/* Quick tutorials */
.quick-tutorials .heading {
  color: #fff;
}

.quick-tutorials p {
  color: #a5a5bb;
}

.quick-tutorials .tabs>ul:first-child li a {
  color: #fff;
}

/* Lottie */
.lottie-sticky-wraps {
  width: 110%;
  height: auto;
  margin: -10% 0 0 -10%;
}

.lottie-one-page {
  width: 110%;
  height: auto;
  margin: -10% 0 -3% -10%;
}


/* Dynamic Data Content */
.dynamic-data-content {
  background-color: #626772;
  margin: 0 5%;
  width: calc(100% - 10%);
  border-radius: 30px;
}

.dynamic-data-content .heading,
.dynamic-data-content p {
  color: #fff;
}

/* Performance --- tabber */
.performance-tabber {
  padding-bottom: 110px;
}

.performance-tabber .logo-ps-gt {
  display: flex;
  justify-content: center;
  align-items: center;
}

.performance-tabber .logo-ps-gt .logos-sep {
  width: 1px;
  height: 80px;
  margin: 0 6%;
  background-color: rgba(0, 0, 0, .1);
}

.performance-tabber .performance-speed-result {
  position: relative;
  margin: 20px 10% 30px;
  line-height: 0;
  overflow: visible;
}

.performance-tabber .performance-speed-result img {
  border-radius: 8px;
}

.performance-tabber .performance-speed-result.before:before,
.performance-tabber .performance-speed-result.after:before {
  font-size: 12px;
  line-height: 1;
  font-weight: 500;
  padding: 8px 15px;
  background-color: #EAEAEA;
  border-radius: 8px 8px 0 0;
  color: #535C72;
  letter-spacing: 1px;
  position: absolute;
  left: 0;
  bottom: 100%;
}

.performance-tabber .performance-speed-result.before:before {
  content: "BEFORE";
}

.performance-tabber .performance-speed-result.after:before {
  content: "AFTER";
}

/* Performance --- features */
.performance-features {
  background-color: #ebf4ff;
  padding-top: 0;
}

/* Performance --- loading speed */
.performance-loading-speed {
  padding-top: 0;
  padding-bottom: 0;
  background: linear-gradient(to bottom, #ebf4ff 50%, transparent 50%);
}

.performance-loading-speed .box {
  background-color: #392F5A;
  padding: 60px 40px 20px;
  border-radius: 8px;
  overflow: hidden;
  margin-bottom: 0;
  color: #fff;
}

.performance-loading-speed .box .heading {
  color: #fff;
}

/* Performance --- bebuilder-improvements */
.performance-bebuilder-improvements {
  padding-bottom: 120px;
  color: rgba(255, 255, 255, .6);
  background-color: rgb(70, 69, 73);
  background: radial-gradient(circle, rgba(84, 83, 87, 1) 0%, rgba(57, 57, 62, 1) 100%);
}

.performance-bebuilder-improvements .heading {
  color: #fff;
}

.performance-bebuilder-improvements .powered-by-vanillajs {
  display: flex;
  justify-content: center;
  align-items: center;
}

.performance-bebuilder-improvements .powered-by-vanillajs img {
  margin-left: 20px
}

.performance-bebuilder-improvements .network-screen {
  position: relative;
  line-height: 0;
  box-shadow: 6px 30px 60px 0px rgba(0, 0, 0, .3);
  width: 70%;
  margin: auto;
}

.performance-bebuilder-improvements .network-load-time {
  position: absolute;
  right: -29px;
  bottom: -50px;
  padding: 18px 40px;
  background-color: #fff;
  border-radius: 8px;
  box-shadow: 6px 30px 60px 0px rgba(0, 0, 0, .18);
  line-height: 1.2;
}

.performance-bebuilder-improvements .network-load-time .heading {
  color: #00bfa9;
  margin-bottom: 5px;
}

.performance-bebuilder-improvements .network-load-time p {
  color: #535c72;
  margin-bottom: 0;
}

.performance-bebuilder-improvements .network-arrow {
  position: absolute;
  right: 330px;
  bottom: -50px;
}

/* Performance --- comparison table  */
.performance-comparison-table {
  line-height: 1.5;
}

.performance-comparison-table td {
  vertical-align: middle;
}

.performance-comparison-table td img {
  vertical-align: bottom;
}

.performance-comparison-table tbody tr:nth-child(odd) td {
  background-color: rgba(0, 137, 247, .05);
}

.performance-comparison-table .label {
  text-align: right;
  color: #00032a;
  font-weight: 500;
}

.performance-comparison-table .desc {
  text-align: center;
}

.performance-comparison-table .green {
  color: #489c6d;
}

.performance-comparison-table .orange {
  color: #FFA500;
}

.performance-comparison-table .red {
  color: #e94448;
}

/* Performance - hero */

.performance-rocket {
  position: absolute;
  right: -8%;
  bottom: 20%;
  z-index: 1;
}


/* Pricing --- comparison table  */

/* Comparison table */
.pricing-comparison-table {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 900px;
  margin: 0 auto;
}

.pricing-comparison-table .row-subtitle {
  color: #0089f7;
  margin: 0;
  padding: 20px;
}

.pricing-comparison-table .table-small-desc {
  display: block;
  font-size: 11px;
  line-height: 1.3;
  opacity: .6;
  margin-top: 5px;
}

.pricing-comparison-table .stars {
  margin-bottom: 5px;
}

.pricing-comparison-table ul.row {
  list-style: none;
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
  flex: 1;
  width: 100%;
  flex-wrap: wrap;
  min-height: 60px;
  padding: 10px 0;
  box-sizing: border-box;
}

.pricing-comparison-table ul.row li {
  flex: 1;
  padding: 0 20px;
  box-sizing: border-box;
  line-height: 1.2;
  margin: 0;
  text-align: center;
}

.pricing-comparison-table ul.row li.row-label {
  color: #00032a;
  border: none;
  width: 200px;
  text-align: left;
}

.pricing-comparison-table ul.row:nth-child(odd):not(.row-header, .row-footer) {
  background-color: #f6f7f9;
}

.pricing-comparison-table ul.row:first-of-type {
  align-items: flex-start;
}

.pricing-comparison-table ul.row:first-of-type li {
  padding: 0 15px;
}

.pricing-comparison-table ul.row:first-of-type li>*:last-child {
  margin-bottom: 0;
}

.pricing-comparison-table ul.row:last-of-type li {
  padding: 20px 10px 0;
}

.pricing-comparison-table ul.row:last-of-type li .button {
  display: flex;
  justify-content: center;
  flex-grow: 1;
  padding-left: 30px;
  padding-right: 30px;
  max-width: 100%;
}

.pricing-comparison-table ul.row:last-of-type li a:not(.button) {
  display: block;
}

@media only screen and (max-width: 777px) {

  .pricing-comparison-table h6.row-subtitle {
    text-align: center;
  }

  .pricing-comparison-table ul.row {
    flex-wrap: wrap;
    min-height: 60px;
    padding: 20px 0;
  }

  .pricing-comparison-table ul.row li.row-label {
    width: 100%;
    text-align: center;
    margin-bottom: 10px;
  }

  .pricing-comparison-table ul.row li {
    width: 33.3%;
    flex: auto;
    padding: 0 5px;
  }

  .pricing-comparison-table ul.row:first-of-type li.row-label,
  .pricing-comparison-table ul.row:last-of-type li:not(.be-buy-now) {
    display: none;
  }

  .pricing-comparison-table ul.row:last-of-type li .button {
    display: inline-flex;
  }

}

/* Pricing --- Be vs. Elementor */
.pricing-be-vs-el {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 20px;
}

.pricing-be-vs-el .vs {
  opacity: .5;
  margin: 0 20px
}


/* Pricing --- No hidden costs */
.pricing-number {
  position: relative;
}

.pricing-costs {
  position: absolute;
  left: 62%;
  top: 35%;
  text-align: left;
  opacity: 0;
}

.pricing-costs img {
  width: 90px;
}

.pricing-costs h6 {
  margin: 0 0 0 15px;
}

/******************************************************
**********************   Blocks   *********************
******************************************************/


/* Partnes */
.partnes {
  margin-left: 12%;
  margin-right: 12%;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
}

.partnes a {
  display: block;
  margin: 7px 15px;
}


/* Start easier */
.start-easier {}

.start-easier .heading {
  margin-bottom: 30px
}

.start-easier .button {
  margin-bottom: 40px
}

.start-easier p {
  margin-bottom: 40px
}

.start-easier img {
  margin: 0 5px
}


/* FAQ */
ul.faq {
  counter-reset: ol-counter;
  margin-bottom: 40px;
  list-style: none;
}

ul.faq li.question {
  counter-increment: ol-counter;
  position: relative;
  overflow: hidden;
  background-color: #fff;
  border-radius: 8px;
  margin-bottom: 8px;
  border: 1px solid #f2f6fa;
}

ul.faq li.question .title {
  position: relative;
  padding: 20px 60px 20px 20px;
  margin: 0;
  cursor: pointer;
}

ul.faq li.question .title:before {
  content: counter(ol-counter);
  display: inline-block;
  position: relative;
  top: -2px;
  width: 20px;
  height: 20px;
  border-radius: 20px;
  line-height: 20px;
  text-align: center;
  font-size: 11px;
  background-color: #0130c6;
  color: #fff;
  margin-right: 15px;
}

ul.faq li.question .title:after {
  content: "";
  display: inline-block;
  width: 24px;
  height: 24px;
  background-image: url(../svg/link-icons/arrow-down.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 24px;
  position: absolute;
  right: 15px;
  top: 20px;
}

ul.faq li.question.active .title:after {
  background-image: url(../svg/link-icons/arrow-up.svg);
}

ul.faq li.question .answer {
  padding: 0 20px;
  max-height: 300px;
}

ul.faq li.question:not(.active) .answer {
  max-height: 0;
  height: 0;
}

.faq-items {
  display: flex;
  flex-wrap: wrap;
}

.faq-item {
  width: calc(33.3% - 30px);
  margin: 20px 15px;
}

.faq-item h5 {
  display: flex;
}

.faq-item h5 .faq-num {
  display: inline-block;
  flex-shrink: 0;
  position: relative;
  top: 4px;
  width: 20px;
  height: 20px;
  border-radius: 20px;
  line-height: 20px;
  text-align: center;
  font-size: 11px;
  background-color: #0090fa;
  color: #fff;
  margin-right: 10px;
}

.faq-item p {
  margin-left: 30px;
}


/* Tabs */
.tabs {}

.tabs>ul:first-child {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 0 40px;
  list-style: none;
}

.tabs>ul:first-child li {
  margin: 0 15px;
}

.tabs>ul:first-child li a {
  display: block;
  color: #00032a;
  border-bottom: 1px solid transparent;
  padding: 10px 0;
  text-align: center;
  text-decoration: none;
  font-size: 16px;
  line-height: 22px;
  font-weight: 600;
}

.tabs>ul:first-child li a:hover {
  color: #0130c6;
}

.tabs>ul:first-child li.active a {
  color: #0130c6;
  border-color: #0130c6 !important;
}

.tabs.tabs-vertical {
  display: flex;
  align-items: start;
}

.tabs.tabs-vertical>ul {
  width: 25%;
  flex-direction: column;
  align-items: flex-end;
}

.tabs.tabs-vertical>ul li a {
  text-align: right;
  padding-right: 30px;
  border-bottom: 0;
  border-right: 1px solid transparent;
}

.tabs.tabs-vertical .tab {
  width: 75%;
}



/* Visual Tabs */
.visual-tabs {}

.visual-tabs>ul:first-child {
  display: flex;
  justify-content: center;
  margin: 0 0 40px;
  list-style: none;
}

.visual-tabs>ul:first-child li {
  margin: 0 2px 5px;
}

.visual-tabs>ul:first-child li a {
  display: block;
  text-align: center;
  position: relative;
  border-radius: 8px;
  color: #00032a;
  padding: 15px 20px;
  text-decoration: none;
  font-size: 16px;
  line-height: 30px;
  font-weight: 600;
}

.visual-tabs>ul:first-child li a .icon {
  display: inline-block;
  width: 30px;
  height: 30px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 30px;
}

.visual-tabs>ul:first-child li a .title {
  display: block;
  border-bottom: 1px solid transparent;
}

.visual-tabs>ul:first-child li a:hover {
  color: #0089f7;
}

.visual-tabs>ul:first-child li.active a {
  color: #0089f7;
  background-color: rgba(0, 137, 255, .1);
}

.visual-tabs>ul:first-child li.active a .title {
  border-color: #0089f7 !important;
}

.visual-tabs>ul li.all .icon {
  background-image: url(../svg/items-categories/all.svg);
}

.visual-tabs>ul li.typography .icon {
  background-image: url(../svg/items-categories/typography.svg);
}

.visual-tabs>ul li.blocks .icon {
  background-image: url(../svg/items-categories/blocks.svg);
}

.visual-tabs>ul li.boxes .icon {
  background-image: url(../svg/items-categories/boxes.svg);
}

.visual-tabs>ul li.elements .icon {
  background-image: url(../svg/items-categories/elements.svg);
}

.visual-tabs>ul li.loops .icon {
  background-image: url(../svg/items-categories/loops.svg);
}

.visual-tabs>ul li.other .icon {
  background-image: url(../svg/items-categories/other.svg);
}

.visual-tabs>ul li.core .icon {
  background-image: url(../svg/features-categories/core-features.svg);
}

.visual-tabs>ul li.muffin-builder .icon {
  background-image: url(../svg/features-categories/muffin-builder.svg);
}

.visual-tabs>ul li.live-builder .icon {
  background-image: url(../svg/features-categories/live-builder.svg);
}

.visual-tabs>ul li.muffin-options .icon {
  background-image: url(../svg/features-categories/muffin-options.svg);
}

.visual-tabs>ul li.builder-items .icon {
  background-image: url(../svg/elements-categories/builder-items.svg);
}

.visual-tabs>ul li.inline-shortcodes .icon {
  background-image: url(../svg/elements-categories/inline-shortcodes.svg);
}

.visual-tabs>ul li.various-layouts .icon {
  background-image: url(../svg/elements-categories/layouts.svg);
}

.visual-tabs>ul li.icons .icon {
  background-image: url(../svg/elements-categories/icons.svg);
}


/* Progress bars */
.progress-bars {
  margin: 0 0 20px;
  list-style: none;
}

.progress-bars li {
  margin-bottom: 40px;
  overflow: hidden
}

.progress-bars li:last-child {
  margin-bottom: 0
}

.progress-bars li .heading {
  margin-bottom: 7px;
}

.progress-bars li .bar {
  width: 100%;
  height: 20px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  overflow: hidden;
  box-sizing: border-box;
  background-color: rgba(0, 137, 255, .1);
}

.progress-bars li .bar .progress {
  display: block;
  position: relative;
  height: 100%;
  background-color: #0089f7;
}

.progress-bars li .bar .progress .label {
  display: block;
  font-size: 12px;
  line-height: 20px;
  padding: 0 8px;
  font-weight: 500;
  position: absolute;
  right: -3px;
  top: 0;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  background: #fff;
  color: #00032a;
}

.progress-bars li .bar .progress {
  transition: width 1s ease-in-out
}

.progress-bars:not(.hover) li .bar .progress {
  width: 0 !important
}


/* Icons list */
.icons-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.icons-list i {
  width: 50px;
  height: 50px;
  text-align: center;
  font-size: 20px;
  line-height: 50px;
  box-sizing: border-box;
  border-radius: 8px;
  margin: 5px;
  background-color: #fff;
  box-shadow: 0px 3px 6px 0px rgba(232, 239, 242, .5);
  border: 1px solid #f1f4f5;
}

/* Icons list */
.elements-icons {
  list-style: none
}

.elements-icons li {
  display: block;
  float: left;
  box-sizing: border-box;
  width: calc(20% - 14px);
  margin: 5px;
  color: #304050;
  text-align: center;
  background-color: rgba(114, 165, 216, 0.04);
  border-radius: 3px;
  padding: 10px
}

.elements-icons li:hover {
  background-color: rgba(114, 165, 216, 0.08)
}

.elements-icons p {
  color: #7987a2;
  margin: 0;
  font-size: 12px;
  line-height: 17px;
  white-space: nowrap;
  overflow: hidden;
  user-select: all;
  text-overflow: ellipsis
}

.elements-icons .mfn-icon {
  display: block;
  height: 50px;
  line-height: 50px
}

.elements-icons .mfn-icon>i {
  color: #304050;
  font-size: 22px
}

/* Layouts */
.hero .hero-layouts h6 {
  opacity: 0;
}

/* Layouts */
.layouts-items {
  display: grid;
  grid-column-gap: 10px;
  grid-template-columns: 1fr 1fr 1fr;
}

.layouts-items .item {
  text-align: center;
  margin-bottom: 40px;
}

.layouts-items .item .pic {
  display: inline-block;
  width: 180px;
  line-height: 0;
  padding: 10px;
  box-sizing: border-box;
  border-radius: 8px;
  margin-bottom: 20px;
  background-color: #fff;
  box-shadow: 0px 3px 6px 0px rgba(232, 239, 242, .5);
  border: 1px solid #f1f4f5;
}

.layouts-items .item .heading {
  margin-bottom: 2px;
}

.layouts-items .item p {
  margin-bottom: 5px;
}

.page-woo-builder .layouts-items.product-list {
  grid-template-columns: 1fr 1fr;
  margin: 0 7%;
}

.layouts-items-shape-dividers .item .pic {
  width: 80%;
  height: 140px;
}

.layouts-items-shape-dividers .item .pic .shape-placeholder {
  width: 100%;
  height: 50px;
  background: #DDE3E9;
}

.layouts-items-shape-dividers .item .pic svg {
  margin-top: -1px;
}

.performance-features .item {
  padding: 0 10%;
}

.performance-features .item .pic {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  height: 80px;
}


/* Shortcode icon */
.the-icons.span3 {
  float: left;
  line-height: 25px;
  position: relative;
  width: 25%;
  padding: 4px 0 4px 45px;
  margin-bottom: 7px;
  box-sizing: border-box;
}

.the-icons.span3 [class^="icon-"] {
  display: inline-block;
  color: #3e3e3e;
  cursor: default;
  font-size: 20px;
  left: 0;
  position: absolute;
  top: 0;
  width: 30px;
  height: 30px;
  text-align: center;
  font-size: 20px;
  line-height: 30px;
  box-sizing: border-box;
  border-radius: 3px;
  background-color: #fff;
  box-shadow: 0px 3px 6px 0px rgba(232, 239, 242, .5);
  border: 1px solid #f1f4f5;
}


/* Two ways */
.choose-the-way {
  display: flex;
  max-width: 800px;
  margin: 0 auto 60px;
  position: relative;
}

.choose-the-way .item {
  padding: 25px 50px 10px;
  width: 50%;
  box-sizing: border-box;
}

.choose-the-way .item .circle-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  border-radius: 100%;
  margin-bottom: 30px;
  font-size: 20px;
  color: #fff;
  background-color: #0089f7;
}

.choose-the-way .item a.splash-link {
  margin-left: 25px;
}

.choose-the-way .or {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.choose-the-way:before,
.choose-the-way:after {
  content: "";
  display: block;
  background-color: rgba(8, 8, 14, .1);
  position: absolute;
}

.choose-the-way:before {
  height: calc(50% - 20px);
  width: 1px;
  top: 0;
  left: 50%;
}

.choose-the-way:after {
  height: calc(50% - 20px);
  width: 1px;
  bottom: 0;
  left: 50%;
}

.page-woo-builder .choose-the-way .item:first-child .circle-number {
  background-color: #7f54b3;
}

/* Step by step */
ul.step-by-step {
  margin: 50px 30px 30px;
  list-style: none;
}

ul.step-by-step li {
  position: relative;
  border-radius: 8px;
  box-shadow: 0px 15px 30px 0px rgba(0, 0, 0, .12);
  background-color: #fff;
  color: #00032a;
  font-weight: 500;
  padding: 40px;
  font-size: 17px;
  line-height: 28px;
  margin-bottom: 80px;
}

ul.step-by-step li:before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 60px;
  height: 60px;
  border-radius: 100%;
  background-color: #0089f7;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 30px;
}

ul.step-by-step li:not(:last-child):after {
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  top: calc(100% + 20px);
  transform: translateX(-50%);
  width: 220px;
  height: 40px;
  background-image: url(../svg/step-by-step-sep-left.svg);
  background-size: 220px;
}

ul.step-by-step li:nth-child(2n):not(:last-child):after {
  background-image: url(../svg/step-by-step-sep-right.svg);
}

ul.step-by-step li:nth-child(2n):before {
  left: auto;
  right: 0;
  transform: translate(50%, -50%);
}

ul.step-by-step li.create-template:before {
  background-image: url(../svg/woo-builder/woo-builder-icon-template.svg);
}

ul.step-by-step li.set-conditions:before {
  background-image: url(../svg/woo-builder/woo-builder-icon-conditions.svg);
}

ul.step-by-step li.muffin-options:before {
  background-image: url(../svg/woo-builder/woo-builder-icon-options.svg);
}


/* Image content */
.full-image-right {
  position: relative;
}

.full-image-right .inner-wrapper {
  width: calc(50vw);
  box-sizing: border-box;
  padding-left: 10%;
}

.full-image-right .inner-wrapper>img {
  display: block;
  max-width: calc(100% - (-200px));
}


/* Builder items */
ul.items-with-desc {
  margin: 0;
  padding: 20px 20px 10px;
  list-style: none;
  display: grid;
  grid-column-gap: 10px;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  background-color: #f6f9fa;
}

ul.items-with-desc li {
  margin-bottom: 10px;
}

ul.items-with-desc li .item-desc {
  display: block;
  text-align: center;
  padding: 30px 15px;
  text-decoration: none;
  background-color: #fff;
  border: 1px dashed #d3d5d8;
  border-radius: 3px;
  box-sizing: border-box;
}

ul.items-with-desc li .item-desc .mfn-icon {
  display: block;
  margin: 0 auto;
  width: 60px;
  height: 60px;
  background-size: 60px;
  opacity: .4;
  margin-bottom: 5px;
  background-position: center;
  background-repeat: no-repeat;
}

ul.items-with-desc li .item-desc .title {
  display: block;
  color: #00032a;
  white-space: nowrap;
  overflow: hidden;
}

ul.items-with-desc li .item-desc:hover {
  border-color: #1999FF;
  border-style: solid;
  box-shadow: 0px 0px 4px 2px rgba(97, 100, 102, 0.05);
}

ul.items-with-desc li .item-desc:hover .mfn-icon {
  opacity: 1;
}


/* Slider with desc & photo */
ul.slider-photo-with-desc {
  background-color: #fafafa;
  border-radius: 8px;
  padding: 10px 20px;
}

ul.slider-photo-with-desc li.slick-slide .item {
  display: flex;
  align-items: center;
  padding: 50px 50px 30px;
}

ul.slider-photo-with-desc li.slick-slide .item .desc {
  width: 50%;
  padding-right: 10%;
  box-sizing: border-box;
}

ul.slider-photo-with-desc li.slick-slide .item .photo {
  width: 50%;
}

ul.slider-photo-with-desc .slick-arrow {
  position: absolute;
  top: calc(50% - 25px);
}

ul.slider-photo-with-desc .slick-prev {
  left: -20px;
}

ul.slider-photo-with-desc .slick-next {
  right: -20px;
}

/*  Shortcuts */
.shortcuts-wrapper {
  display: flex;
  position: relative;
  width: 100%;
}

.shortcuts-wrapper:after {
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  top: 0;
  width: 1px;
  height: 100%;
  background-color: #eceff5;
}

ul.shortcuts-list {
  flex: 1;
  margin: 10px 4%;
}

ul.shortcuts-list li.header {
  font-size: 13px;
  letter-spacing: 3px;
  font-weight: 600;
}

ul.shortcuts-list li.header .command {
  color: #7987a2;
  letter-spacing: 0;
  font-weight: 400;
}

ul.shortcuts-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 15px;
  font-size: 14px;
  color: #304050;
  border-radius: 4px;
}

ul.shortcuts-list li .keys {
  font-size: 12px;
  color: #7987a2;
}

ul.shortcuts-list li .keys .key {
  display: inline-block;
  margin: 0 2px;
  font-size: 11px;
  font-weight: 300;
  border-radius: 4px;
  line-height: 1;
  padding: 7px 9px;
  color: #304050;
  background-color: #fff;
  border: 1px solid #eceff5;
}

ul.shortcuts-list li .keys .or {
  display: inline-block;
  margin: 0 10px;
}

ul.shortcuts-list li:not(.header):hover {
  background-color: rgba(114, 165, 216, .1);
}

ul.shortcuts-list li:not(.header):hover .keys .key {
  color: #fff;
  background-color: #72a5d8;
  border-color: #72a5d8;
}


/* Icon box */
.box-with-icon {
  display: flex;
}

.box-with-icon .box-icon {
  margin-right: 30px;
  margin-bottom: 0;
}

.box-with-icon .box-inner>*:last-child {
  margin-bottom: 0;
}

.divide-page .box-with-icon {
  align-items: center;
}

.divide-page .box-with-icon:not(:last-child) {
  margin-bottom: 20px;
}

.divide-page .box-with-icon .box-icon {
  width: 40%;
}


/* Useful info */
.useful-info {
  position: relative;
  margin: 30px 0 15px;
  background-color: rgba(207, 222, 247, .2);
  border-radius: 10px;
  padding: 20px;
  font-size: 16px;
  line-height: 28px;
  color: #686b83;
  font-weight: 700;
}

.useful-info:before {
  content: "";
  position: absolute;
  left: 15px;
  top: -15px;
  width: 30px;
  height: 30px;
  border-radius: 10px;
  background-color: #cfdef7;
  background-image: url(../svg/info.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 26px;
}

/* short info */
.short-info {
  display: flex;
  font-size: 15px;
  line-height: 1.6;
  align-items: center;
  margin-bottom: 20px;
  border-radius: 8px;
  padding: 20px;
  background-color: #DDE7F0;
}

.short-info .short-icon {
  display: block;
  width: 36px;
  height: 36px;
  border-radius: 100%;
  flex-shrink: 0;
  background-size: 36px;
  background-image: url(../svg/info.svg);
  background-position: center;
  background-repeat: no-repeat;
  margin-right: 20px;
}

.short-info .short-content {
  text-align: left;
}

.short-info .short-content p:last-child {
  margin: 0;
}

.short-info .short-options {
  margin-left: 20px;
  flex-shrink: 0;
  padding-left: 20px;
  border-left: 1px solid rgba(0, 0, 0, .1);
}

/* Before after */
.bebuilder-before-after {
  padding: 0 40px;
}

.bebuilder-before-after .twentytwenty-wrapper {
  max-width: 1350px;
  margin: 0 auto;
  border: 3px solid #69c2ff;
  border-radius: 15px;
  overflow: hidden
}


/* Typo */
.new-typography {
  padding: 150px 0 90px;
}

.typo-font-sizes {
  display: inline-flex;
  align-items: center;
  padding: 12px 15px;
  border-radius: 10px;
  line-height: 1;
  background-color: #edf2fa;
  color: #304050;
  margin-top: 15px;
}

.typo-font-sizes .size {
  display: inline-block;
  margin: 0 4px;
  border-radius: 4px;
  padding: 7px 9px;
  color: #304050;
  background-color: #fff;
  border: 1px solid #eceff5;
}

.typo-font-sizes .size:first-child {
  margin-left: 20px;
}

.typo-option {
  display: block;
  position: relative;
  background-color: #fff;
  box-shadow: 0px 10px 46px 0px rgba(1, 7, 39, .1);
  font-size: 20px;
  letter-spacing: 1px;
  line-height: 1;
  padding: 15px;
  margin-bottom: 40px;
  font-weight: 600;
  color: #08080e;
  border-radius: 6px;
}

.typo-option:after {
  content: "";
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid #000;
}

/* Prebuilt elements */
.prebuilt-elements {
  column-count: 2;
  column-gap: 40px;
}

.prebuilt-elements li {
  display: block;
  -webkit-column-break-inside: avoid;
  break-inside: avoid;
  text-align: center;
  box-sizing: border-box;
  margin-bottom: 40px;
  box-shadow: 0px 10px 10px 4px rgba(1, 7, 39, .04);
  border-radius: 4px;
  overflow: hidden;
  transition: transform .3s ease-in-out;
}

.prebuilt-elements li a {
  display: block;
  line-height: 0;
}

.prebuilt-elements li:hover {
  transform: scale(1.25);
}

/* Cyber week sale */
.cyber-week-sale {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  background-color: #24ab5c;
  padding: 0 30px;
  box-sizing: border-box;
  text-align: center;
  line-height: 0;
}

.cyber-week-sale img {
  max-width: 100%;
  max-height: 160px;
  margin-bottom: 0;
}

.cyberweek2024 {
  position: absolute;
  left: 50vw;
  top: 7vh;
  transform: translateX(00px);
  height: 13vh;
  z-index: 1;
}

@media only screen and (max-width: 777px) {
  .cyberweek2024 {
    height: 13vh;
    left: 50vw;
    top: 50vh;
    transform: translateY(-28vh);
  }
}

/* Loop builder types */
.loop-builder-types {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.loop-builder-types li {
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin: 10px;
  background-color: rgba(0, 137, 247, .1);
  border-radius: 30px;
  width: 140px;
  height: 140px;
  box-sizing: border-box;
}

.loop-builder-types li img {
  width: 40px;
  margin-bottom: 10px;
}

.loop-builder-types li .heading {
  color: #006EDF;
  margin: 0;
}

/* Loop builder feature icons */
.loop-builder-features .content-icon {
  max-height: 200px;
}

/* Popup unlimited possibilities */
.popup-unlimited-possibilities {
  background-color: #F6FAFE;
}

.popup-unlimited-possibilities .try-me {
  position: absolute;
  left: 5px;
  top: 0;
}

/* Popup slider */
.popup-slider .item {
  padding: 0 20px;
  box-sizing: border-box;
}

.popup-slider .item img {}


/* Theme stats */
.theme-stats {
  list-style: none;
}

.theme-stats li {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-bottom: 15px;
}

.theme-stats li .heading,
.theme-stats li .number {
  flex: 1;
}

.theme-stats li .heading {
  line-height: 1.2;
  margin: 0;
  font-weight: 400;
  text-align: left;
}

.theme-stats li .number {
  margin-right: 30px;
  text-align: right;
}

.performance-bebuilder-improvements .theme-stats .number {
  color: #7fb540
}

/* Single website item */
.single-website-item img {
  margin-bottom: 5px;
}

.single-website-item p {
  margin-bottom: 8px;
}

.single-website-item a.builder {
  display: inline-block;
  width: 32px;
  height: 32px;
  margin: 0 2px;
  border-radius: 100%;
  overflow: hidden;
  text-indent: -9999px;
  background-image: url(../images/websites/be-ele.svg);
  background-size: 70px;
  transition: .3s ease-in-out;
}

.single-website-item a.builder:hover {
  transform: scale(1.1);
}

.single-website-item a.builder-bebuilder {
  background-position: left top;
}

.single-website-item a.builder-elementor {
  background-position: right top;
}

/* Pagespeed insight */
.pagespeed-insight {
  display: flex;
  list-style: none;
  margin: 60px 0;
}

.pagespeed-insight li {
  flex: 1;
}

.pagespeed-insight li .chart {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: 90px;
  height: 90px;
  border: 6px solid #00cc66;
  border-radius: 100%;
  font-size: 26px;
  line-height: 1;
  color: #008800;
  background-color: #e4f9ee;
  margin-bottom: 15px;
}

.pagespeed-insight li .heading {
  font-weight: 400;
}

/* Image Box */
.image-box {
  display: flex;
  align-items: center;
}

.image-box .image-wrapper {
  flex-shrink: 0;
  margin-right: 30px;
  line-height: 0;
  text-align: center;
}

.image-box .desc-wrapper {
  flex: 1;
}

.image-box .desc-wrapper>*:last-child {
  margin-bottom: 0;
}

.image-box .desc-wrapper .see-more {
  display: inline-block;
  width: 50px;
  height: 50px;
  border-radius: 100%;
  background-color: rgba(8, 8, 14, .05);
  background-image: url(../svg/link-icons/move-right.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 26px;
  overflow: hidden;
  text-indent: -9999px;
}

.image-box:hover .desc-wrapper .see-more {
  transform: scale(1.1);
  background-color: rgba(0, 137, 247, .05);
  background-image: url(../svg/link-icons/move-right-blue.svg);
}

.image-box-50-50 .image-wrapper {
  width: 50%;
}

a.image-box,
a:hover.image-box {
  color: inherit;
  text-decoration: none;
}

.addons-list .image-box {
  background-color: #fff;
  padding: 32px;
  border-radius: 24px;
}

.image-box .desc-wrapper .see-more {
  transition: transform 0.2s ease-in-out, background-color 0.2s ease-in-out
}


/* Boxes list */
.boxes-list {
  display: flex;
  flex-wrap: wrap;
  list-style-type: none;
}

.boxes-list .item {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: calc(33.33% - 20px);
  margin: 0 10px 20px;
  padding: 40px;
  border-radius: 24px;
  box-sizing: border-box;
}

.boxes-list .item.item-1-1 {
  width: calc(100% - 20px);
}

.boxes-list .item>*:last-child {
  margin-bottom: 0;
}

.boxes-list[data-col="2"] .item {
  width: calc(50% - 20px);
}

.workflow-list .boxes-list .item {
  background-color: #3D3D40;
}

.workflow-list .boxes-list .heading {
  color: #fff;
}

.workflow-list .item-1-1 {
  align-items: center;
}

.workflow-list .item-1-1 img {
  max-width: 820px;
  width: 100%;
}

.design-features .boxes-list .item {
  text-align: center;
}

.design-features .boxes-list .item .heading {
  margin-bottom: 8px;
}

.design-features .boxes-list .item p {
  margin-bottom: 30px;
}

.design-features .boxes-list .item:nth-child(1) {
  background-color: #fff;
}

.design-features .boxes-list .item:nth-child(2) {
  background-color: #3E3E42;
  color: #9F9FA8;
}

.design-features .boxes-list .item:nth-child(2) .heading {
  color: #fff
}


/* Small features list */
.small-features-list {
  display: flex;
  flex-wrap: wrap;
  list-style-type: none;
  text-align: left;
  margin: 0 -10px;
}

.small-features-list .item {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: calc(33.33% - 20px);
  margin: 0 10px 20px;
  padding: 32px;
  border-radius: 24px;
  box-sizing: border-box;
}

.small-features-list .item .heading {
  display: flex;
  align-items: center;
}

.small-features-list .item .heading:before {
  content: "+";
  display: inline-flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  width: 22px;
  height: 22px;
  border-radius: 100%;
  font-size: 14px;
  line-height: 1;
  margin-right: 10px;
  background-color: #304050;
  color: #fff;
}

.small-features-list .item .heading>span {
  flex: 1;
}

.small-features-list .item .desc>*:last-child {
  margin-bottom: 0;
}

.small-features-list[data-col="2"] .item {
  width: calc(50% - 20px);
}

.layout .wrapper-inner {
  background-color: #fff;
  padding-bottom: 30px;
}

.layout .small-features-list .item {
  background-color: #F8F8F8;
}

.layout .small-features-list .item .heading:before {
  background-color: #A663A3;
}

.history .wrapper-inner {
  background-color: #3B3B3D;
  padding-bottom: 30px;
}

.history .small-features-list .item {
  background-color: #454547;
}

.history .small-features-list .item .heading:before {
  background-color: #81818C;
}

.live-editing .wrapper-inner {
  background-color: #0089F7;
  color: #C0E3FF;
  padding-bottom: 30px;
}

.live-editing .small-features-list .item {
  background-color: #1497FF;
}

.live-editing .small-features-list .item .heading:before {
  background-color: #424080;
}


/* Steps */
.how-it-works {
  display: flex;
  width: 100%;
  list-style-type: none;
}

.how-it-works li {
  text-align: center;
}

.how-it-works li>*:last-child {
  margin-bottom: 0;
}

.how-it-works li:not(.arrow) {
  flex: 1;
  padding: 0 5%;
}

.how-it-works li.arrow {
  align-self: center;
}

/* Pricing switcher */
.pricing-switcher {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  position: relative;
}

.pricing-switcher a {
  color: #00032a;
  line-height: 1.2;
}

.pricing-switcher .toggle {
  position: relative;
  width: 60px;
  height: 32px;
  border-radius: 16px;
  background-color: #fff;
  border: 1px solid rgba(0, 0, 0, .12);
  cursor: pointer;
  flex-shrink: 0;
}

.pricing-switcher .toggle:after {
  content: "";
  width: 28px;
  height: 28px;
  border-radius: 100%;
  background-color: #0089F7;
  position: absolute;
  left: 2px;
  top: 2px;
}

.pricing-switcher .no-hidden-costs {
  position: absolute;
  left: -180px;
  top: 50%;
  transform: translateY(-50%);
}

.pricing-switcher .save-20 {
  position: absolute;
  right: -190px;
  top: 0;
  transform: translateY(-50%);
}

.pricing-switcher.annual a:first-of-type {
  font-weight: 500;
}

.pricing-switcher.onetime a:last-of-type {
  font-weight: 500;
}

.pricing-switcher.onetime .toggle:after {
  left: auto;
  right: 2px;
}

/* Pricing plans */
.pricing-plans {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
}

/* Pricing boxes */
.pricing-box {
  position: relative;
  background-color: #fff;
  border-radius: 8px;
  transition: all .5s;
}

.pricing-box:hover {
  box-shadow: 0px 10px 30px rgba(16, 24, 40, 0.1);
  border-color: transparent;
  transform: translateY(-10px);
}

.pricing-box:not(.has-label) {
  margin-top: 50px;
}

.pricing-box .box-label {
  display: flex;
  height: 50px;
  width: 100%;
  align-items: center;
  justify-content: center;
  background-color: #0089F7;
  color: #fff;
  border-radius: 8px 8px 0 0;
}

.pricing-box.box-3 .box-label {
  background-color: #B2977D;
}

.pricing-box .box-promo {
  display: flex;
  flex-direction: column;
  width: 60px;
  height: 60px;
  border-radius: 100%;
  justify-content: center;
  align-items: center;
  position: absolute;
  right: 20px;
  top: -20px;
  background-color: #1493FA;
  color: #fff;
  font-size: 12px;
  line-height: 1.2;
  font-weight: 500;
  box-shadow: 0px 15px 30px 0 rgba(0, 0, 0, 0.10);
}

.pricing-box .box-promo span {
  font-size: 16px;
}

.pricing-box.box-3 .box-promo {
  background-color: #BAA28C;
}

.pricing-box .box-header {
  text-align: center;
  padding: 32px 32px 0;
}

.pricing-box .box-content {
  padding: 24px 32px;
}

.pricing-box .box-footer {
  padding: 24px 32px;
}

.pricing-box .box-footer a.button {
  width: 100%;
  padding-left: 15px;
  padding-right: 15px;
  margin-bottom: 0;
}

.pricing-box h3 {
  font-size: 20px;
  line-height: 1.4;
  font-weight: 300;
  margin-bottom: 25px;
}

.pricing-box p {
  animation: unset !important;
  opacity: 1;
}

.pricing-box .price {
  font-size: 55px;
  line-height: 1;
  font-weight: 600;
  color: #00032a;
}

.pricing-box .price sub {
  font-size: 18px;
  vertical-align: baseline;
  font-weight: 400;
}

.pricing-box .tax {
  margin-bottom: 25px;
}

.pricing-box .license {
  padding: 10px 0;
  text-align: center;
  border-top: 1px solid #EBEBEB;
  border-bottom: 1px solid #EBEBEB;
}

.pricing-box .license p {
  font-size: 16px;
  font-weight: 500;
  color: #00032a;
  margin-bottom: 0;
}

.pricing-box .license-dropdown {
  position: relative;
  z-index: 1;
}

.pricing-box .license-dropdown p {
  display: inline-flex;
  align-items: center;
  gap: 12px;
}

.pricing-box .license-dropdown ul.license-select {
  display: none;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  padding: 16px;
  list-style: none;
  width: 100%;
  box-sizing: border-box;
  position: absolute;
  left: 0;
  top: calc(100% - 10px);
  background-color: #fff;
  box-shadow: 0px 8px 8px -4px rgba(16, 24, 40, 0.03), 0px 20px 24px -4px rgba(16, 24, 40, 0.08);
  border-radius: 4px;
}

.pricing-box .license-dropdown ul.license-select li a {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-decoration: none;
  width: 100%;
  border-radius: 4px;
  padding: 8px;
  box-sizing: border-box;
  font-size: 12px;
  line-height: 1.4;
  color: #999999;
  background-color: rgba(0, 0, 0, .03);
}

.pricing-box .license-dropdown ul.license-select li a:hover {
  background-color: rgba(0, 0, 0, .06);
}

.pricing-box .license-dropdown ul.license-select li a span {
  font-size: 16px;
  font-weight: 500;
  color: #00032a;
}

.pricing-box .license-dropdown:hover ul.license-select {
  display: grid;
}

.pricing-box .content-list {
  margin: 0;
}

/* Customers-slider */
.customers .wrapper-inner {
  background-color: #0089F7;
}

.customers {
  color: #C0E3FF;
}

.customers .heading,
.customers .number {
  color: #fff;
}

.customers-slider-wrapper {
  padding-left: 50px;
  border-left: 1px solid #2FA2FF
}

.customers-slider blockquote {
  font-size: 26px;
  line-height: 1.4;
  font-weight: 500;
  color: #fff;
  margin-bottom: 20px;
}

.customers-slider .heading {
  margin-bottom: 0px;
}

.customers-slider .slick-dots {
  text-align: left;
}

.customers-slider .slick-dots li.slick-active button {
  background: #fff;
}

.customers-slider .slick-dots li button {
  background: rgba(255, 255, 255, .5);
}

/******************************************************
**********************   Footer   *********************
******************************************************/

.footer {
  clear: both;
  background-color: #090a12;
  color: #b3b5ca;
  padding: 100px 0 40px;
}

.footer header {
  border-bottom: 1px solid rgba(255, 255, 255, .1);
  padding-bottom: 45px;
  margin-bottom: 60px;
}

.footer header .right-desc {
  margin-left: auto;
  width: auto;
  display: flex;
}

.footer header .right-desc .info {
  margin-right: 30px;
}

.footer header .right-desc p {
  margin-bottom: 0;
}

.footer header .right-desc a.button {
  padding-left: 30px;
  padding-right: 30px;
}

.footer .heading {
  color: #fff;
}

.footer a {
  color: #9093ac;
}

.footer a:hover {
  color: #fff;
}

.footer ul {
  list-style: none;
  margin: 10px 0;
}

.footer ul li a {
  padding: 5px 0;
  display: inline-block;
}

.footer .footer-links {
  display: grid;
  grid-column-gap: 10px;
  grid-template-columns: 1fr 1fr;
}

.footer .copy {
  display: flex;
  flex-direction: column;
}

.footer .copy p {
  background-image: url(../svg/logo-muffin.svg);
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 26px;
  padding-left: 40px;
  margin-top: auto;
  margin-bottom: 15px;
}




/******************************************************
********************   Responsive   *******************
******************************************************/

/* Desktop > 1400 */

@media only screen and (min-width: 1400px) {
  #shop {
    background-size: unset;
    padding-bottom: 600px
  }
}

/* Desktop < 1400 */

@media only screen and (max-width: 1400px) {
  .beginners-professionals .info-pic-left .info {
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
  }

  .beginners-professionals .info-pic-right .info {
    right: 50%;
    top: 50%;
    transform: translate(50%, -50%);
  }
}

/* Desktop < 1240 */

@media only screen and (max-width: 1239px) {
  .landing-hero {
    text-align: center;
  }

  .landing-hero .mfn-row .row-column[data-size="0.4"],
  .landing-hero .mfn-row .row-column[data-size="0.6"] {
    flex-basis: 100%;
    max-width: 100%;
  }

  /* Loop builder feature icons */
  .loop-builder-features .content-icon {
    max-height: 140px;
  }

  /* Popup unlimited possibilities */
  .popup-unlimited-possibilities .try-me {
    left: 15px;
    top: 0;
  }

}

@media only screen and (max-width: 1239px) and (min-width: 960px) {

  .mfn-text,
  #menu>ul>li>a>sup {
    display: none;
  }

  #menu>ul>li>a {
    padding-left: 14px;
    padding-right: 14px;
  }

  #menu .submenu.one-page ul li a {
    padding-left: 16px;
    padding-right: 16px;
  }

  #websites .website {
    width: 31.33%
  }

  .builder-items .builder-items-browser ul.items,
  .builder-items.big .builder-items-browser ul.items {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  }

  .content .inner-wrapper-big {
    margin: 0 -150px;
  }

}

/* Desktop > 961 */

@media only screen and (min-width: 960px) {
  .hide-desktop {
    display: none !important
  }

  #menu>ul>li>ul {
    width: 100% !important
  }

  #header.search #menu>ul {
    display: none
  }

}

/* Tablet < 960 */

@media only screen and (max-width: 959px) {

  /*h1{font-size:44px}
  h2{font-size:30px}
  h3{font-size:22px}
  h4{font-size:18px}
  h5{font-size:17px}
  h6{font-size:16px}*/

  .number.big {
    font-size: 140px;
    line-height: 140px;
  }

  .number.medium {
    font-size: 70px;
    line-height: 70px;
  }

  .tablet-center {
    text-align: center;
  }

  #header {
    padding-right: 0
  }

  #menu>ul {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    width: 100%;
    text-align: left;
    overflow: auto;
    height: calc(100vh - 70px);
    background-color: #fff;
  }

  #menu>ul>li {
    background-color: #f6f7f9;
  }

  .menu-open #menu>ul {
    display: block
  }

  .menu-open #menu .menu-toggle .icon-menu {
    display: none
  }

  .menu-open #menu .menu-toggle .icon-close {
    display: block
  }

  #menu>ul>li {
    position: relative
  }

  #menu>ul>li:last-of-type {
    padding-bottom: 10px;
  }

  #menu ul li.show-mobile {
    display: unset
  }

  #menu ul li.hide-mobile {
    display: none
  }

  #menu ul li {
    float: none
  }

  #menu ul li a:not(.button) {
    padding: 15px 30px
  }

  #header .menu-toggle {
    display: block
  }

  #header.submenu-open #menu>ul {
    left: -300px
  }

  #header.submenu-open #menu>ul li.open {
    position: static
  }

  #header.submenu-open #menu>ul li.open>ul {
    display: block;
    box-sizing: border-box;
    position: absolute;
    left: 100%;
    top: 0;
    width: 100%;
    overflow: auto
  }

  #header.submenu-open #logo {
    display: none
  }

  #header.submenu-open .submenu-close {
    display: block
  }

  #menu ul>li>.submenu {
    display: none !important;
  }

  #menu>ul>li>a {
    height: auto;
  }

  #menu>ul>li>a .menu-new {
    right: auto;
    transform: translateY(-50%);
    margin-left: 10px;
    top: 50%;
  }

  #menu>ul>li.mobile-submenu>a .menu-new {
    display: inline-block
  }

  #menu li.mobile-submenu.open .submenu {
    display: block !important;
  }

  #menu li.mobile-submenu .submenu-open {
    display: block;
    float: right;
    transition: transform .1s ease-in-out;
    transform: rotate(90deg)
  }

  #menu li.mobile-submenu.open .submenu-open {
    transform: rotate(-90deg)
  }

  /* #header.sticky #menu > ul{background-color:#F6F7F9} */
  #header.sticky .submenu-close polygon {
    fill: #08080e
  }

  #header .right {
    margin-left: auto;
  }

  #header .filters .search-wrapper {
    display: block;
    position: static;
    transform: unset;
    width: 100%
  }

  #header .filters .search-wrapper input.search {
    padding-top: 10px;
    padding-bottom: 10px;
    margin-bottom: 10px;
    background-color: #fff
  }

  #header .right .buy {
    padding-left: 24px;
    padding-right: 24px;
    line-height: 20px;
  }

  #menu ul>li>.submenu {
    position: unset;
    width: calc(100% - 40px);
    padding: 0 20px 20px;
    border-top: 0;
    box-shadow: unset;
  }

  #menu .submenu.visual-select .wrapper {
    border: 1px solid #e3e6ee;
    background-color: #fff;
    border-radius: 8px;
    padding: 25px 10px 10px;
    box-shadow: 0px 10px 10px 0px rgba(58, 63, 67, 0.06);
  }

  #menu .submenu.visual-select h3.heading {
    margin-bottom: 15px;
    font-size: 18px;
    line-height: 1;
  }

  #menu .submenu.visual-select ul.builders {
    width: 100%;
  }

  #menu .submenu.visual-select ul.builders li a h5 {
    font-size: 15px;
  }

  #menu .submenu.visual-select ul.builders li a p {
    font-size: 12px;
  }

  #menu .submenu.visual-select ul.builders li a:hover {
    background-color: rgba(0, 0, 0, .02);
  }

  #menu .submenu.visual-select .builders-info {
    margin-left: 0;
    padding: 10px 0 0;
    border-left: 0;
  }

  #menu .submenu.visual-select .builders-info h6.heading,
  #menu .submenu.visual-select .builders-info .builders-help {
    display: none;
  }

  #menu .submenu.visual-select .short-info {
    padding: 15px;
  }

  #menu .submenu.visual-select .short-info .short-content {
    font-size: 12px;
  }

  #menu .additional-links {
    display: flex;
    padding: 15px 30px 100px;
  }

  #menu .additional-links ul {
    flex-grow: 1;
  }

  #menu .additional-links ul li a:not(.button) {
    padding: 10px 0;
  }

  .slider .hero-builder,
  .slider .hero-builder>div {
    gap: 10px;
  }

  #websites .player-box {
    display: block;
    max-width: 750px
  }

  #websites .player-box-left {
    width: 100%;
    margin-right: 0
  }

  #websites .player-box-left video {
    max-height: 50vh
  }

  #websites .player-box-right {
    width: 100%;
    margin-top: 20px;
    position: relative;
    text-align: center;
  }

  #websites .player-counter-number {
    font-size: 16px
  }

  #websites .player-desc-counter {
    display: inline-block;
    float: none;
  }

  #player-main h2 {
    margin: 0;
    font-size: 28px;
    line-height: 34px
  }

  #player-main a {
    font-size: 14px
  }

  #replay {
    display: none
  }

  .our-video .our-video-slider .slick-next {
    right: 14%;
  }

  .our-video .our-video-slider .slick-prev {
    left: 14%;
  }

  .our-video .our-video-slider .slick-arrow {
    top: calc(50% - 75px);
  }

  .features-cards {
    column-gap: 20px;
  }

  .features-cards .item {
    margin-bottom: 20px;
  }

  /* Pagespeed insight */
  .pagespeed-insight li .chart {
    width: 60px;
    height: 60px;
    border: 4px solid #00cc66;
    font-size: 20px;
  }

  .pagespeed-insight li .heading {
    font-size: 16px;
  }

  /* Performance rocket */
  .performance-rocket {
    display: none;
  }

  /* Pricing --- No hidden costs */
  .pricing-costs {
    position: absolute;
    left: 64%;
    top: 35%;
  }

  .pricing-costs img {
    width: 50px;
  }

  .pricing-costs h6 {
    margin: 0 0 0 15px;
    font-size: 13px;
  }

  /* Steps */
  .how-it-works li:not(.arrow) {
    padding: 0 2%;
  }

  .how-it-works li.arrow {
    max-width: 40px;
  }

  /* Image box */
  .image-box {
    flex-direction: column;
  }

  .image-box .image-wrapper {
    margin-right: 0;
    margin-bottom: 20px;
    width: 100%;
  }

  .image-box .desc-wrapper {
    text-align: center;
  }

  .addons-list .image-wrapper {
    margin-bottom: 0;
  }

  /* Small features list */
  .small-features-list .item,
  .small-features-list[data-col="2"] .item {
    width: calc(50% - 20px);
  }

}

/* Tablet only 778 - 959 */

@media only screen and (max-width: 959px) and (min-width: 778px) {

  .mfn-row .row-column[tablet-data-size="0.5"] {
    flex-basis: 50%;
    max-width: 50%;
    width: 50%;
  }

  .mfn-row .row-column[tablet-data-size="1"] {
    flex-basis: 100%;
    max-width: 100%;
    width: 100%;
  }

  .hide-tablet {
    display: none !important
  }

  #websites .website {
    width: 31.33%
  }

  .builder-items .builder-items-browser ul.items {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  }

  .builder-items.big .builder-items-browser ul.items {
    grid-template-columns: 1fr 1fr 1fr 1fr;
  }

  .builder-items.woo-items .builder-items-browser ul.items {
    grid-template-columns: 1fr 1fr 1fr;
  }

  .testimonials-list .testimonials-list-items {
    column-count: 2;
  }

  .content .inner-wrapper-big {
    margin: 0 -34px;
  }

}

/* Desktop & Tablet > 778 */
@media only screen and (min-width: 778px) {

  .header-transparent #header:not(.sticky):not(.menu-open):hover {
    transition: background-color 0s ease-in-out;
  }

  .header-transparent #header:not(.sticky):not(.menu-open):not(:hover) {
    background-color: transparent
  }

  .header-transparent #header:not(.sticky):not(.menu-open):not(:hover) #menu ul li:not(.active) a {
    color: #fff
  }

  .header-transparent #header:not(.sticky):not(.menu-open):not(:hover) .logo-theme {
    fill: #fff
  }

  .header-transparent #header:not(.sticky):not(.menu-open):not(:hover) a.help path {
    fill: #fff;
  }

  .header-transparent #header:not(.sticky):not(.menu-open):not(:hover) a.menu-toggle path {
    fill: #fff;
  }

}

/* Mobile < 778 */
@media only screen and (max-width: 777px) {

  html {
    font-size: 15px
  }

  h1 {
    font-size: 35px;
    line-height: 45px;
  }

  h2,
  .h1-wptheme {
    font-size: 27px;
    line-height: 37px;
  }

  h3 {
    font-size: 22px;
    line-height: 32px;
  }

  h4 {
    font-size: 18px;
    line-height: 30px;
  }

  h5 {
    font-size: 16px;
    line-height: 29px;
  }

  h6 {
    font-size: 15px;
    line-height: 26px;
  }

  main article {
    padding: 90px 0 30px;
  }

  article header,
  footer header {
    margin-bottom: 30px;
  }

  article section,
  footer section {
    margin-bottom: 30px;
  }

  .wrapper-inner {
    margin: 0;
    padding: 30px;
  }

  .mb-small {
    margin-bottom: 30px;
  }

  /* 50px */
  .mb-medium {
    margin-bottom: 50px;
  }

  /* 80px */
  .mb-big {
    margin-bottom: 70px;
  }

  /* 130px */

  p.big-text {
    font-size: 16px;
    line-height: 29px;
  }

  .hero h1,
  .landing-hero h1 {
    font-size: 35px;
    line-height: 45px;
  }

  a.button {
    padding: 11px 40px;
  }

  a.button.big {
    padding: 18px 30px;
  }

  .splash-link-sep {
    display: none;
  }

  .mobile-center {
    text-align: center;
  }

  .section-centered,
  .header-centered {
    padding-left: 0;
    padding-right: 0;
  }

  .number,
  #intro .quote,
  .header-centered,
  .header-with-desc .left-desc,
  .header-with-desc .right-desc {
    text-align: center;
  }

  .number {
    font-size: 40px;
    line-height: 40px;
  }

  .number.big {
    font-size: 50px;
    line-height: 50px;
  }

  .number.medium {
    font-size: 65px;
    line-height: 65px;
  }

  .hide-mobile {
    display: none !important
  }

  .mfn-row .row-column[data-size="0.14"],
  .mfn-row .row-column[data-size="0.2"],
  .mfn-row .row-column[data-size="0.25"],
  .mfn-row .row-column[data-size="0.3"],
  .mfn-row .row-column[data-size="0.3333"],
  .mfn-row .row-column[data-size="0.4"],
  .mfn-row .row-column[data-size="0.5"],
  .mfn-row .row-column[data-size="0.6"],
  .mfn-row .row-column[data-size="0.6667"],
  .mfn-row .row-column[data-size="0.7"],
  .mfn-row .row-column[data-size="0.75"],
  .mfn-row .row-column[data-size="0.8"],
  .mfn-row .row-column[data-size="0.8333"],
  .mfn-row .row-column[data-size="1"] {
    flex-basis: 100%;
    max-width: 100%;
    width: 100%;
  }

  .mfn-row .row-column[mobile-data-size="0.5"] {
    flex-basis: 50%;
    max-width: 50%;
    width: 50%;
  }

  .mfn-row-reverse-mobile {
    flex-direction: column-reverse;
  }

  .content .inner-wrapper-big {
    margin: 0px;
  }

  .header-with-desc {
    display: block;
  }

  .header-with-desc .left-desc,
  .header-with-desc .right-desc {
    width: 100%;
  }

  .header-with-desc .left-desc {
    margin-bottom: 30px;
  }


  .header-with-nav {
    flex-wrap: wrap;
    justify-content: center;
  }

  .header-with-nav .inner-content {
    border-width: 0;
    width: 100%;
    order: 1;
    margin-bottom: 15px;
  }

  .header-with-nav a.nav-arrow {
    order: 2;
    margin: 0 5px;
  }

  .landing-hero {
    text-align: center;
  }


  #header.search,
  #header.search-open .search-wrapper {
    display: none !important
  }

  #header.search-open .filters-toggle,
  #header.search-open .search-toggle {
    display: none
  }

  #header.search-open .search-wrapper {
    display: inline-block;
    float: left;
    position: relative;
    top: 0;
    left: 0;
    width: calc(100% - 230px);
    margin-left: 20px;
    transform: none
  }

  #header.search-open .search-wrapper input.search {
    padding-top: 13px;
    padding-bottom: 13px;
    background-image: url('../svg/close.svg')
  }

  #header.search-open .search-wrapper .close {
    display: block
  }

  #header.search-open .search-wrapper .close path {
    fill: #fff
  }

  #header.sticky.search-open .search-wrapper input.search {
    border-color: #03040E;
    color: #03040E;
    background-image: url('../svg/close.svg')
  }

  #header .filters {
    display: none;
    box-sizing: border-box;
    padding: 15px 10px;
    position: absolute;
    left: 0;
    top: 100%;
    width: 100%;
    overflow: auto;
    background-color: #3b4659;
    color: #fff;
    line-height: initial;
    text-align: left
  }

  #header .filters .filters-group {
    float: left;
    border-left: 1px solid rgba(255, 255, 255, .05)
  }

  #header .filters .first {
    border-left-width: 0;
    width: 25%
  }

  #header .filters .second {
    width: 74%
  }

  #header .filters h6 {
    display: inline-block;
    margin-bottom: 0;
    padding: 8px 15px;
    font-size: 14px;
    color: #fff
  }

  #header .filters ul {
    list-style: none
  }

  #header .filters .second ul {
    column-count: 2
  }

  #header .filters ul li {
    padding: 7px 15px
  }

  #header .filters ul li a {
    position: relative;
    display: inline-block;
    border-bottom: 1px solid transparent;
    text-decoration: none;
    font-size: 14px;
    color: #fff;
    opacity: .7
  }

  #header .filters ul li a:hover {
    opacity: 1 !important
  }

  #header .filters ul li.current a {
    color: #006edf;
    border-bottom-color: #006edf;
    opacity: .9
  }

  #header .filters ul li.current a:after {
    content: "";
    position: absolute;
    top: 5px;
    right: -20px;
    padding-left: 10px;
    display: block;
    width: 10px;
    height: 10px;
    background: url('../svg/close.svg') no-repeat center right;
    opacity: .7
  }

  #header .filters ul li.current a:hover:after {
    opacity: 1
  }

  #header.sticky .filters {
    background-color: #fbfbfb
  }

  #header.sticky .filters .filters-group {
    border-color: rgba(0, 0, 0, .05)
  }

  #header.sticky .filters h6,
  #header.sticky .filters a {
    color: #131624
  }

  #header.sticky .filters ul li.current a:after {
    background-image: url('../svg/close.svg')
  }

  #header.filters-open .filters {
    display: block
  }

  #header.filters-open .filters-toggle .icon-close {
    opacity: 1
  }

  #header.filters-open .filters-toggle .icon-filters {
    opacity: 0
  }


  #websites .website {
    width: 31.33%
  }

  #websites header {
    margin: 0 30px
  }

  .search-wrapper {
    width: 90%
  }

  #websites .filters {
    display: none
  }

  #websites .websites {
    margin-left: 15px;
  }

  .hero .hero-video .hero-video-inner:before {
    height: 30px;
    background-size: 25px;
    background-position: 10px center;
    border-radius: 4px 4px 0 0;
  }


  .partnes {
    flex-direction: column;
  }

  .partnes a {
    margin-bottom: 20px;
  }

  .testimonials .support-info {
    display: block;
  }

  .testimonials .support-info h5 {
    margin-right: 0;
  }

  .tabs>ul:first-child {
    flex-direction: column;
  }

  .tabs.tabs-vertical {
    display: block;
  }

  .tabs.tabs-vertical>ul,
  .tabs.tabs-vertical .tab {
    width: 100%;
  }

  .tabs.tabs-vertical>ul li a {
    text-align: center;
    padding: 5px 0 5px;
    border-bottom: 1px solid transparent;
    border-right: 0;
  }

  .tabs.tabs-vertical>ul {
    align-items: center;
  }

  .visual-tabs>ul:first-child {
    flex-wrap: wrap;
  }


  .builder-items .builder-items-browser ul.items,
  .builder-items.big .builder-items-browser ul.items {
    grid-template-columns: 1fr 1fr;
  }

  .builder-items.woo-items .builder-items-browser ul.items {
    grid-template-columns: 1fr;
  }


  .beginners-professionals .info-pic-left .info,
  .beginners-professionals .info-pic-right .info {
    position: static;
    transform: none;
  }


  a.play-button {
    margin: -25px 0 0 -25px;
    width: 50px;
    height: 50px;
    background-size: 10px;
  }


  .features .features-items .item.browse-all a {
    text-align: center;
  }

  .features .features-items .item.browse-all a img {
    margin: 0 auto;
  }

  /* Slider */
  .slider {
    background-size: contain;
    background-position: top center;
    background-image: url(../images/bg-slider-mobile.png);
  }

  .slider {
    justify-content: center;
    min-height: 100vh;
    min-height: 100dvh;
    height: auto;
    padding: 100px 0 40px;
  }

  .slider .hero-content {
    text-align: center;
  }

  .slider .hero-content h1.heading {
    font-size: 30px;
    line-height: 40px;
  }

  .slider .hero-content h3.heading {
    font-size: 16px;
    line-height: 30px;
  }

  .slider .hero-content> :not(:last-child) {
    margin-bottom: 20px;
  }

  .slider .hero-reviews {
    flex-direction: column;
  }

  .slider .hero-reviews p {
    text-align: center;
  }

  .slider .hero-builder {
    width: 80vw;
    right: -8%;
    bottom: -2%;
  }



  .page-feature-voting .hero {
    padding: 150px 6% 10px;
    height: auto;
  }

  .feature-voting .voting-list {
    margin: 0;
  }

  .feature-voting .voting-list li {
    flex-direction: column;
  }

  .feature-voting .voting-list li .votes,
  .feature-voting .voting-list li .done {
    width: 100%;
    padding-top: 50px;
    padding-bottom: 50px;
    border-radius: 8px 8px 0 0;
  }

  .feature-voting .voting-list li .desc {
    text-align: center;
  }

  .feature-voting .voting-list li .status-options {
    padding-top: 0;
  }

  .feature-voting .voting-list li .vote-options {
    margin: 0 0 40px;
  }

  .feature-voting .idea-pic {
    width: 250px;
  }


  .main-features .main-features-items {
    display: block;
  }


  .features .features-items {
    display: block;
  }


  .plugins .plugins-items {
    display: block;
  }

  .plugins .favorite-tools-info,
  .plugins .save-money-info {
    text-align: center;
  }


  .layouts-items {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .layouts-items .item .pic {
    width: 100%;
  }


  .ecommerce .ecommerce-items .item {
    text-align: center;
  }


  .support .support-items .item {
    flex-direction: column;
    align-items: center;
  }

  .support .support-items .item img {
    margin-right: 0;
    margin-bottom: 20px;
  }

  .support .support-items .item .inner {
    padding-right: 0;
    text-align: center;
  }


  .support .support-image .inner-wrapper {
    width: 100%;
    margin: 0 -30px;
    padding: 0 0 0 30px;
  }

  .support .support-image .inner-wrapper>img {
    max-width: 100%;
    margin-bottom: 40px;
  }

  .support .support-image .inner-wrapper .box {
    position: static;
    width: 100%;
    max-width: 100%;
  }

  /* Full image right */
  .full-image-right .inner-wrapper {
    width: 100%;
    padding: 0 30px;
  }

  .full-image-right .inner-wrapper>img {
    max-width: 100%;
    margin-bottom: 40px;
  }


  .blog .blog-posts .item a {
    text-align: center;
  }


  .main-features header {
    padding: 0 10%;
  }


  .options .options-info {
    border-right: 0;
    text-align: center;
  }

  .options .options-items {
    grid-template-columns: 1fr 1fr;
  }


  .performance ul.content-list {
    display: block;
  }

  .performance .facts-in-numbers .row-column:not(:last-child) {
    border: 0;
  }


  .features-cards {
    column-count: inherit;
  }

  ul.faq li.question .answer {
    max-height: 450px;
  }

  .faq-item {
    width: 100%;
    margin: 0 0 20px;
  }

  .testimonials-list .testimonials-list-items {
    column-count: 1;
  }


  .footer .be-logo {
    display: block;
    margin: 0 auto 40px;
  }

  .footer .heading,
  .footer ul {
    text-align: center;
  }

  .footer .copy p {
    margin: 40px auto 0;
  }

  .footer header .right-desc {
    flex-direction: column;
    align-items: center;
  }

  .footer header .right-desc .info {
    margin-right: 0;
  }

  .footer header .right-desc .info {
    margin-bottom: 20px;
  }

  .websites-form form {
    margin: 0;
  }

  .websites-form button.btn {
    width: 50px;
    height: 50px;
    padding: 0;
    overflow: hidden;
    background-position: center center;
  }

  .websites-form button.btn:hover {
    background-position: center center;
  }

  .websites-form button.btn span {
    display: none;
  }

  .content-pic,
  .content-gallery {
    margin-left: 0;
    margin-right: 0;
  }

  /* Two ways */
  .choose-the-way {
    display: block;
  }

  .choose-the-way .item {
    width: 100%;
    padding: 30px 30px 15px;
  }

  .choose-the-way .or {
    position: static;
    text-align: center;
    transform: none;
  }

  .choose-the-way:before {
    width: calc(50% - 20px);
    height: 1px;
    top: 50%;
    left: 0;
  }

  .choose-the-way:after {
    width: calc(50% - 20px);
    height: 1px;
    top: 50%;
    right: 0;
    left: auto;
  }

  /* Woo demos */
  .woo-demos {
    background-image: none;
  }

  /* Elements icons list */
  .elements-icons li {
    width: calc(33.3% - 14px);
  }

  /* Slider with desc & photo */
  ul.slider-photo-with-desc {}

  ul.slider-photo-with-desc li.slick-slide .item {
    display: block;
    padding: 30px 30px 10px;
  }

  ul.slider-photo-with-desc li.slick-slide .item .desc {
    width: 100%;
    padding-right: 0%;
    text-align: center;
  }

  ul.slider-photo-with-desc li.slick-slide .item .photo {
    width: 100%;
  }

  ul.slider-photo-with-desc .slick-arrow {
    position: absolute;
    top: calc(50% - 25px);
  }

  ul.slider-photo-with-desc .slick-prev {
    left: -20px;
  }

  ul.slider-photo-with-desc .slick-next {
    right: -20px;
  }

  /* Info box */
  .info-box {
    flex-direction: column;
  }

  .info-box .icon,
  .info-box .inner {
    margin-bottom: 30px;
  }

  .info-box .inner {
    text-align: center;
  }

  /* Shortcuts-wrapper */
  .shortcuts-wrapper {
    flex-direction: column;
  }

  .shortcuts-wrapper:after {
    display: none;
  }

  .shortcuts-wrapper ul.shortcuts-list:first-child {
    margin-bottom: 40px;
  }

  /* Icon box */
  .box-with-icon {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .box-with-icon .box-icon {
    margin-right: 0;
    margin-bottom: 20px;
  }

  /* Typo */
  .typo-option-wrapper {
    margin-bottom: 0 !important;
  }

  .typo-option {
    margin-bottom: 20px;
  }

  /* Useful info */
  .useful-info:before {
    left: 50%;
    transform: translateX(-50%);
  }

  /* Lottie */
  .lottie-sticky-wraps {
    width: 100%;
    margin: 0;
  }

  .lottie-one-page {
    width: 100%;
    margin: 0;
  }

  /* Popup */
  .mfn-popup-inner {
    width: 80%;
  }

  .mfn-popup-inner .desc-wrapper h2 {
    font-size: 30px;
    line-height: 40px;
  }

  /* Loop builder types */
  .loop-builder-types li {
    width: 110px;
    height: 110px;
    margin: 5px;
  }

  /* Popup unlimited possibilities */
  .popup-unlimited-possibilities .try-me {
    left: 15px;
    top: -120px;
  }

  /* Content video */
  .content-video {
    margin-left: 0;
    margin-right: 0;
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
  }

  .content-video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  /* Article video */
  .hero .article-video {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
  }

  .hero .article-video iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  /* Pagespeed insight */
  .pagespeed-insight {
    margin: 40px -8%;
  }

  .pagespeed-insight li {
    margin: 0 10px;
  }

  .pagespeed-insight li .chart {
    width: 50px;
    height: 50px;
    border: 3px solid #00cc66;
    font-size: 18px;
  }

  .pagespeed-insight li .heading {
    font-size: 12px;
    line-height: 1.2;
  }

  /* Performance bebuilder improvements */
  .performance-bebuilder-improvements .theme-stats-wrapper {
    border-right: 0;
  }

  .performance-bebuilder-improvements .network-load-time {
    right: 20px;
    bottom: -50px;
    padding: 20px 30px;
  }

  .performance-bebuilder-improvements .network-arrow {
    right: 240px;
    bottom: -40px;
    width: 60px;
  }

  /* Boxes list */
  .boxes-list .item {
    width: 100% !important;
    margin: 0 0 15px;
    padding: 30px;
    align-items: center;
  }

  .workflow-list .boxes-list img {
    max-width: 300px;
  }

  /* Small features list */
  .small-features-list .item {
    width: 100% !important;
    margin: 0 0 15px;
  }

  .layout .wrapper-inner,
  .history .wrapper-inner,
  .live-editing .wrapper-inner {
    padding-bottom: 10px;
  }

  /* Steps */
  .how-it-works {
    flex-direction: column;
  }

  .how-it-works li {
    padding: 0;
    margin-bottom: 30px;
  }

  .how-it-works li.arrow img {
    transform: rotate(90deg);
  }

  /* Pricing plans */
  .pricing-plans {
    grid-template-columns: repeat(1, 1fr);
    gap: 32px;
  }

  .pricing-box:not(.has-label) {
    margin-top: 0;
  }

  /* Customers */
  .customers-slider-wrapper {
    padding-left: 0;
    border-left: 0;
  }

  .customers-slider blockquote {
    font-size: 18px;
  }

  /* Pricing switcher */
  .pricing-switcher .no-hidden-costs,
  .pricing-switcher .save-20 {
    display: none;
  }

}

/* Mobile < 480 */

@media only screen and (max-width: 550px) {


  .hero .hero-buttons {
    display: block;
  }

}


/* Mobile < 480 */

@media only screen and (max-width: 479px) {

  #websites .website {
    width: 48%
  }

  #logo {
    margin-right: -100px
  }

  #theme {
    display: none
  }

  #header.search-open .search-wrapper {
    width: calc(100% - 130px)
  }

  /* Elements icons list */
  .elements-icons li {
    width: calc(50% - 14px);
  }


  /* Pricing --- No hidden costs */
  .pricing-costs {
    position: static;
    text-align: center;
    margin: -40px 0 40px;
  }

  .pricing-costs img {
    display: none;
  }

  /* Boxes list */
  .workflow-list .boxes-list img {
    max-width: 100%;
  }

}

@media only screen and (max-height: 500px) {
  .slider .hero-content .badge-group {
    display: none;
  }
}



/******************************************************
********************   Animations   *******************
******************************************************/

a.button,
a.button span:after,
a.splash-link,
a.splash-link:after,
.websites-form button.btn {
  transition: all 0.2s ease-in-out;
}

a.nav-arrow,
.slick-arrow,
.features-items .item a .see-more {
  transition: transform 0.2s ease-in-out, background-color 0.2s ease-in-out;
  background-image: 0.2s ease-in-out;
}

.features-items .item a .heading {
  transition: color 0.2s ease-in-out;
}


.features-items .browse-all a {
  transition: background-color 0.2s ease-in-out;
}

#menu>ul>li>a .menu-new:before,
#menu>ul>li>a .menu-new:after {
  animation: big-update-pulse 2s infinite linear;
}

#menu>ul>li>a .menu-new:after {
  animation-delay: 1s;
}

.websites-form .content-icon {
  animation: leave-your-suggestion 0.9s infinite ease-in-out;
}

.slider .hero-content .badge-group {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 0.3s;
}

.slider .hero-content h1.heading {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 0.6s;
}

.slider .hero-content h3.heading {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 0.9s;
}

.slider .hero-content .buttons {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 1.2s;
}

.slider .hero-content .hero-reviews {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 1.5s;
}


.landing-hero h1.heading {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 0.2s;
}

.landing-hero h5.heading {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 0.4s;
}

.landing-hero .hero-icon {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 0.6s;
}

.landing-hero .button {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 0.8s;
}

.landing-hero .landing-pic {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 0.2s;
}

a.play-button {
  transition: transform 0.2s ease-in-out;
}

.our-video .our-video-slider .video {
  transition: transform 300ms ease-in-out;
}

.our-video .our-video-slider .slick-center .video a.play-button {
  animation: zoomIn 0.6s normal forwards;
  animation-delay: 0.2s;
}

.page-websites p.number {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 0.2s;
}

.page-reviews .be-logo,
.page-feature-voting .be-logo {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 0.2s;
}

.hero .update-heading {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 0.2s;
}

.page-pricing .hero h5.heading {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 0.2s;
}

.hero h6.heading {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 0.2s;
}

.hero h4.heading.included-with-betheme {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 0.2s;
}

.hero h1.heading {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 0.4s;
}

.hero h4.heading {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 0.6s;
}

.hero p {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 0.6s;
}

.page-pricing .pricing-costs {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 0.6s;
}

.hero .button,
.hero .fancy-button {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 0.8s;
}

.page-reviews .our-support-info {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 0.8s;
}

.hero .hero-layouts h6 {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 0.8s;
}

.hero .hero-icon {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 1s;
}

.hero .hero-image img,
.hero .hero-video .hero-video-inner,
.hero-image .inner-wrapper {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 1.2s;
}

.hero .visual-tabs {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
  animation-delay: 0.8s;
}

ul.faq li.question .answer {
  transition: max-height .1s ease-in-out
}

ul.faq li.question.active .answer {
  transition: max-height .5s ease-in-out
}

.websites-form .help-block,
.websites-form .alert,
.feature-voting .alert {
  animation: fadeInUp 0.6s normal forwards ease-in-out;
}

.feature-voting .voting-list li {
  transition: all 0.2s ease-in-out;
}

[data-tooltip]:before {
  transition: transform 0.2s ease-out;
}

[data-tooltip]:after {
  transition: transform 0.2s ease-out;
}



.slider header h1.heading .highlight-text:before {
  animation: BorderLine 0.6s normal forwards ease-in-out;
  animation-delay: 1.2s;
}

.highlight-text:before {
  animation: BorderLine 0.6s normal forwards ease-in-out;
  animation-delay: 1s;
}

@keyframes BorderLine {
  0% {
    width: 0;
  }

  100% {
    width: 100%;
  }
}


@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(20px);
  }

  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}

@keyframes big-update {
  0% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.2);
  }

  100% {
    transform: scale(1);
  }
}

@keyframes zoomIn {
  0% {
    opacity: 0;
    /*-webkit-transform:scale3d(.3,.3,.3);transform:scale3d(.3,.3,.3)*/
  }

  100% {
    opacity: 1;
  }
}

@keyframes big-update {
  0% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.2);
  }

  100% {
    transform: scale(1);
  }
}

@keyframes big-update-pulse {
  0% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 0.6;
  }

  100% {
    transform: translate(-50%, -50%) scale(2.8);
    opacity: 0;
  }
}

@keyframes leave-your-suggestion {
  0% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.03);
  }

  100% {
    transform: scale(1);
  }
}

.builder-items-browser ul.items li[data-type="inline-shortcode"] .mfn-icon,
.sc-shortcode a:before {
  background-image: url(../svg/items/shortcode.svg)
}

.builder-items-browser ul.items li[data-type="accordion"] .mfn-icon,
.sc-accordion a:before {
  background-image: url(../svg/items/accordion.svg)
}

.builder-items-browser ul.items li[data-type="article_box"] .mfn-icon,
.sc-article-box a:before {
  background-image: url(../svg/items/article-box.svg)
}

.builder-items-browser ul.items li[data-type="before_after"] .mfn-icon,
.sc-before-after a:before {
  background-image: url(../svg/items/before-after.svg)
}

.builder-items-browser ul.items li[data-type="banner_box"] .mfn-icon,
.sc-banner-box a:before {
  background-image: url(../svg/items/banner-box.svg)
}

.builder-items-browser ul.items li[data-type="blockquote"] .mfn-icon,
.sc-blockquote a:before {
  background-image: url(../svg/items/blockquote.svg)
}

.builder-items-browser ul.items li[data-type="blog"] .mfn-icon,
.sc-blog a:before {
  background-image: url(../svg/items/blog.svg)
}

.builder-items-browser ul.items li[data-type="blog_news"] .mfn-icon,
.sc-blog-news a:before {
  background-image: url(../svg/items/blog-news.svg);
}

.builder-items-browser ul.items li[data-type="blog_slider"] .mfn-icon,
.sc-blog-slider a:before {
  background-image: url(../svg/items/blog-slider.svg);
}

.builder-items-browser ul.items li[data-type="blog_teaser"] .mfn-icon,
.sc-blog-teaser a:before {
  background-image: url(../svg/items/blog-teaser.svg);
}

.builder-items-browser ul.items li[data-type="button"] .mfn-icon,
.sc-buttons a:before {
  background-image: url(../svg/items/button.svg);
}

.builder-items-browser ul.items li[data-type="call_to_action"] .mfn-icon,
.sc-call-to-action a:before {
  background-image: url(../svg/items/call-to-action.svg);
}

.builder-items-browser ul.items li[data-type="chart"] .mfn-icon,
.sc-chart a:before {
  background-image: url(../svg/items/chart.svg);
}

.builder-items-browser ul.items li[data-type="clients"] .mfn-icon,
.sc-clients a:before {
  background-image: url(../svg/items/clients.svg);
}

.builder-items-browser ul.items li[data-type="clients_slider"] .mfn-icon,
.sc-clients-slider a:before {
  background-image: url(../svg/items/clients-slider.svg);
}

.builder-items-browser ul.items li[data-type="code"] .mfn-icon,
.sc-code a:before {
  background-image: url(../svg/items/code.svg);
}

.builder-items-browser ul.items li[data-type="column"] .mfn-icon,
.sc-column a:before {
  background-image: url(../svg/items/column.svg);
}

.builder-items-browser ul.items li[data-type="contact_box"] .mfn-icon,
.sc-contact-box a:before {
  background-image: url(../svg/items/contact-box.svg);
}

.builder-items-browser ul.items li[data-type="content"] .mfn-icon,
.sc-content a:before {
  background-image: url(../svg/items/content.svg);
}

.builder-items-browser ul.items li[data-type="countdown"] .mfn-icon,
.sc-countdown a:before {
  background-image: url(../svg/items/countdown.svg);
}

.builder-items-browser ul.items li[data-type="counter"] .mfn-icon,
.sc-counter a:before {
  background-image: url(../svg/items/counter.svg);
}

.builder-items-browser ul.items li[data-type="divider"] .mfn-icon,
.sc-divider a:before {
  background-image: url(../svg/items/divider.svg);
}

.builder-items-browser ul.items li[data-type="divider-2"] .mfn-icon,
.sc-divider-2 a:before {
  background-image: url(../svg/items/divider-2.svg);
}

.builder-items-browser ul.items li[data-type="fancy_divider"] .mfn-icon,
.sc-fancy-divider a:before {
  background-image: url(../svg/items/fancy-divider.svg);
}

.builder-items-browser ul.items li[data-type="fancy_heading"] .mfn-icon,
.sc-fancy-heading a:before {
  background-image: url(../svg/items/fancy-heading.svg);
}

.builder-items-browser ul.items li[data-type="faq"] .mfn-icon,
.sc-faq a:before {
  background-image: url(../svg/items/faq.svg);
}

.builder-items-browser ul.items li[data-type="feature_box"] .mfn-icon,
.sc-feature-box a:before {
  background-image: url(../svg/items/feature-box.svg);
}

.builder-items-browser ul.items li[data-type="feature_list"] .mfn-icon,
.sc-features-list a:before {
  background-image: url(../svg/items/feature-list.svg);
}

.builder-items-browser ul.items li[data-type="flat_box"] .mfn-icon,
.sc-flat-box a:before {
  background-image: url(../svg/items/flat-box.svg);
}

.builder-items-browser ul.items li[data-type="helper"] .mfn-icon,
.sc-helper a:before {
  background-image: url(../svg/items/helper.svg);
}

.builder-items-browser ul.items li[data-type="hotspot"] .mfn-icon,
.sc-hotspot a:before {
  background-image: url(../svg/items/hotspot.svg);
}

.builder-items-browser ul.items li[data-type="hover_box"] .mfn-icon,
.sc-hover-box a:before {
  background-image: url(../svg/items/hover-box.svg);
}

.builder-items-browser ul.items li[data-type="hover_color"] .mfn-icon,
.sc-hover-color a:before {
  background-image: url(../svg/items/hover-color.svg);
}

.builder-items-browser ul.items li[data-type="how_it_works"] .mfn-icon,
.sc-how-it-works a:before {
  background-image: url(../svg/items/how-it-works.svg);
}

.builder-items-browser ul.items li[data-type="icon_box_basic"] .mfn-icon,
.sc-icon-box-basic a:before {
  background-image: url(../svg/items/icon-box.svg);
}

.builder-items-browser ul.items li[data-type="icon_box"] .mfn-icon,
.sc-icon-box a:before {
  background-image: url(../svg/items/icon-box-2.svg);
}

.builder-items-browser ul.items li[data-type="image"] .mfn-icon,
.sc-image a:before {
  background-image: url(../svg/items/image.svg);
}

.builder-items-browser ul.items li[data-type="image_gallery"] .mfn-icon,
.sc-image-gallery a:before {
  background-image: url(../svg/items/image-gallery.svg);
}

.builder-items-browser ul.items li[data-type="info_box"] .mfn-icon,
.sc-info-box a:before {
  background-image: url(../svg/items/info-box.svg);
}

.builder-items-browser ul.items li[data-type="list"] .mfn-icon,
.sc-list a:before {
  background-image: url(../svg/items/list.svg);
}

.builder-items-browser ul.items li[data-type="list-basic"] .mfn-icon,
.sc-list-basic a:before {
  background-image: url(../svg/items/list-basic.svg);
}

.builder-items-browser ul.items li[data-type="map_basic"] .mfn-icon,
.sc-map-basic a:before {
  background-image: url(../svg/items/map-basic.svg);
}

.builder-items-browser ul.items li[data-type="map"] .mfn-icon,
.sc-map a:before {
  background-image: url(../svg/items/map.svg);
}

.builder-items-browser ul.items li[data-type="offer"] .mfn-icon,
.sc-offer a:before {
  background-image: url(../svg/items/offer.svg);
}

.builder-items-browser ul.items li[data-type="offer_thumb"] .mfn-icon,
.sc-offer-thumb a:before {
  background-image: url(../svg/items/offer-thumb.svg);
}

.builder-items-browser ul.items li[data-type="opening_hours"] .mfn-icon,
.sc-opening-hours a:before {
  background-image: url(../svg/items/opening-hours.svg);
}

.builder-items-browser ul.items li[data-type="our_team"] .mfn-icon,
.sc-our-team a:before {
  background-image: url(../svg/items/our-team.svg);
}

.builder-items-browser ul.items li[data-type="our_team_list"] .mfn-icon,
.sc-our-team-list a:before {
  background-image: url(../svg/items/our-team-list.svg);
}

.builder-items-browser ul.items li[data-type="photo_box"] .mfn-icon,
.sc-photo-box a:before {
  background-image: url(../svg/items/photo-box.svg);
}

.builder-items-browser ul.items li[data-type="placeholder"] .mfn-icon,
.sc-placeholder a:before {
  background-image: url(../svg/items/placeholder.svg);
}

.builder-items-browser ul.items li[data-type="portfolio"] .mfn-icon,
.sc-portfolio a:before {
  background-image: url(../svg/items/portfolio.svg);
}

.builder-items-browser ul.items li[data-type="portfolio_grid"] .mfn-icon,
.sc-portfolio-grid a:before {
  background-image: url(../svg/items/portfolio-grid.svg);
}

.builder-items-browser ul.items li[data-type="portfolio_photo"] .mfn-icon,
.sc-portfolio-photo a:before {
  background-image: url(../svg/items/portfolio-photo.svg);
}

.builder-items-browser ul.items li[data-type="portfolio_slider"] .mfn-icon,
.sc-portfolio-slider a:before {
  background-image: url(../svg/items/portfolio-slider.svg);
}

.builder-items-browser ul.items li[data-type="pricing_item"] .mfn-icon,
.sc-pricing-item a:before {
  background-image: url(../svg/items/pricing-item.svg);
}

.builder-items-browser ul.items li[data-type="progress_bars"] .mfn-icon,
.sc-progress-bars a:before {
  background-image: url(../svg/items/progress-bars.svg);
}

.builder-items-browser ul.items li[data-type="promo_box"] .mfn-icon,
.sc-promo-box a:before {
  background-image: url(../svg/items/promo-box.svg);
}

.builder-items-browser ul.items li[data-type="quick_fact"] .mfn-icon,
.sc-quick-fact a:before {
  background-image: url(../svg/items/quick-fact.svg);
}

.builder-items-browser ul.items li[data-type="shop"] .mfn-icon,
.sc-shop a:before {
  background-image: url(../svg/items/shop.svg);
}

.builder-items-browser ul.items li[data-type="shop_slider"] .mfn-icon,
.sc-shop-slider a:before {
  background-image: url(../svg/items/shop-slider.svg);
}

.builder-items-browser ul.items li[data-type="sidebar_widget"] .mfn-icon,
.sc-sidebar-widget a:before {
  background-image: url(../svg/items/sidebar-widget.svg);
}

.builder-items-browser ul.items li[data-type="slider"] .mfn-icon,
.sc-slider a:before {
  background-image: url(../svg/items/slider.svg);
}

.builder-items-browser ul.items li[data-type="slider_plugin"] .mfn-icon,
.sc-slider-plugin a:before {
  background-image: url(../svg/items/slider-plugin.svg);
}

.builder-items-browser ul.items li[data-type="sliding_box"] .mfn-icon,
.sc-sliding-box a:before {
  background-image: url(../svg/items/sliding-box.svg);
}

.builder-items-browser ul.items li[data-type="story_box"] .mfn-icon,
.sc-story-box a:before {
  background-image: url(../svg/items/story-box.svg);
}

.builder-items-browser ul.items li[data-type="tabs"] .mfn-icon,
.sc-tabs a:before {
  background-image: url(../svg/items/tabs.svg);
}

.builder-items-browser ul.items li[data-type="testimonials"] .mfn-icon,
.sc-testimonials a:before {
  background-image: url(../svg/items/testimonials.svg);
}

.builder-items-browser ul.items li[data-type="testimonials_list"] .mfn-icon,
.sc-testimonials-list a:before {
  background-image: url(../svg/items/testimonials-list.svg);
}

.builder-items-browser ul.items li[data-type="timeline"] .mfn-icon,
.sc-timeline a:before {
  background-image: url(../svg/items/timeline.svg);
}

.builder-items-browser ul.items li[data-type="toggle"] .mfn-icon,
.sc-toggle a:before {
  background-image: url(../svg/items/toggle.svg);
}

.builder-items-browser ul.items li[data-type="trailer_box"] .mfn-icon,
.sc-trailer-box a:before {
  background-image: url(../svg/items/trailer-box.svg);
}

.builder-items-browser ul.items li[data-type="video"] .mfn-icon,
.sc-video a:before {
  background-image: url(../svg/items/video.svg);
}

.builder-items-browser ul.items li[data-type="visual"] .mfn-icon,
.sc-visual a:before {
  background-image: url(../svg/items/visual.svg);
}

.builder-items-browser ul.items li[data-type="zoom_box"] .mfn-icon,
.sc-zoom-box a:before {
  background-image: url(../svg/items/zoom-box.svg);
}

.builder-items-browser ul.items li[data-type="shop_categories"] .mfn-icon,
.sc-shop-categories a:before {
  background-image: url(../svg/items/shop-categories.svg);
}

.builder-items-browser ul.items li[data-type="shop_products"] .mfn-icon,
.sc-shop-products a:before {
  background-image: url(../svg/items/shop-products.svg);
}

.builder-items-browser ul.items li[data-type="shop_title"] .mfn-icon,
.sc-zoomshop-titlebox a:before {
  background-image: url(../svg/items/shop-title.svg);
}

.builder-items-browser ul.items li[data-type="product_title"] .mfn-icon,
.sc-product-title a:before {
  background-image: url(../svg/items/product-title.svg);
}

.builder-items-browser ul.items li[data-type="product_images"] .mfn-icon,
.sc-product-images a:before {
  background-image: url(../svg/items/product-images.svg);
}

.builder-items-browser ul.items li[data-type="product_price"] .mfn-icon,
.sc-product-price a:before {
  background-image: url(../svg/items/product-price.svg);
}

.builder-items-browser ul.items li[data-type="product_cart_button"] .mfn-icon,
.sc-product-cart_button a:before {
  background-image: url(../svg/items/product-cart-button.svg);
}

.builder-items-browser ul.items li[data-type="product_reviews"] .mfn-icon,
.sc-product-reviews a:before {
  background-image: url(../svg/items/product-reviews.svg);
}

.builder-items-browser ul.items li[data-type="product_rating"] .mfn-icon,
.sc-product-rating a:before {
  background-image: url(../svg/items/product-rating.svg);
}

.builder-items-browser ul.items li[data-type="product_stock"] .mfn-icon,
.sc-product-stock a:before {
  background-image: url(../svg/items/product-stock.svg);
}

.builder-items-browser ul.items li[data-type="product_meta"] .mfn-icon,
.sc-product-meta a:before {
  background-image: url(../svg/items/product-meta.svg);
}

.builder-items-browser ul.items li[data-type="product_short_description"] .mfn-icon,
.sc-product-short_description a:before {
  background-image: url(../svg/items/product-short-description.svg);
}

.builder-items-browser ul.items li[data-type="product_content"] .mfn-icon,
.sc-product-content a:before {
  background-image: url(../svg/items/product-content.svg);
}

.builder-items-browser ul.items li[data-type="product_additional_information"] .mfn-icon,
.sc-product-additional_information a:before {
  background-image: url(../svg/items/product-additional-information.svg);
}

.builder-items-browser ul.items li[data-type="product_related"] .mfn-icon,
.sc-product-related a:before {
  background-image: url(../svg/items/product-related.svg);
}

.builder-items-browser ul.items li[data-type="product_upsells"] .mfn-icon,
.sc-zoomproduct_upsellsbox a:before {
  background-image: url(../svg/items/product-upsells.svg);
}


/******************************************************
********************   Rotator   **********************
******************************************************/

.rotator-wrapper {
  position: relative;
}

.rotator-wrapper .rotator {
  display: inline-block;
  min-width: 170px;
  position: relative;
  top: 1px;
  vertical-align: top;
}

.rotator-wrapper .rotator span {
  position: absolute;
  top: 0px;
  right: 0;
  opacity: 0;
  animation: rotateWord 9s linear infinite 0s;
  color: #d4e4ee;
}

.rotator-wrapper .rotator span:nth-child(2) {
  animation-delay: 3s;
}

.rotator-wrapper .rotator span:nth-child(3) {
  animation-delay: 6s;
}

.rotator-wrapper .rotator span:nth-child(4) {
  animation-delay: 9s;
}

.rotator-wrapper .rotator span:nth-child(5) {
  animation-delay: 12s;
}

@keyframes rotateWord {
  0% {
    opacity: 0;
  }

  2% {
    opacity: 0;
    transform: translateY(-30px);
  }

  5% {
    opacity: 1;
    transform: translateY(0px);
  }

  15% {
    opacity: 1;
    transform: translateY(0px);
  }

  30% {
    opacity: 1;
    transform: translateY(0px);
  }

  33% {
    opacity: 0;
    transform: translateY(30px);
  }

  80% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}


/******************************************************
*****************   Fancy button   *******************
******************************************************/

a.fancy-button {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  text-decoration: none;
  width: 12rem;
  height: auto;
  opacity: 0;
}

a.fancy-button .circle {
  transition: all 0.3s cubic-bezier(0.65, 0, 0.076, 1);
  position: relative;
  display: block;
  margin: 0;
  width: 52px;
  height: 52px;
  background: rgba(0, 0, 0, .55);
  border-radius: 52px;
}

a.fancy-button .circle .icon {
  transition: all 0.3s cubic-bezier(0.65, 0, 0.076, 1);
  width: 20px;
  height: 20px;
  display: block;
  left: 27px;
  top: 50%;
  position: absolute;
  margin: -10px 0 0 -10px;
  background-image: url(../svg/link-icons/play-white.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 15px;
}

a.fancy-button .button-text {
  transition: all 0.3s cubic-bezier(0.65, 0, 0.076, 1);
  position: absolute;
  top: 0;
  left: 0;
  margin: 11px 0 0 60px;
  color: #fff;
  font-weight: 500;
  border-bottom: 1px dotted #dde7f0;
  padding-bottom: 5px;
  text-align: left;
}

a:hover.fancy-button .circle {
  width: 100%;
  border-radius: 8px;
}

a:hover.fancy-button .button-text {
  color: #fff;
  border-color: transparent;
}


a.fancy-button.green .circle {
  background: rgba(255, 255, 255, 1);
}

a.fancy-button.green .circle .icon {
  background-image: url(../svg/link-icons/play-green.svg);
}

a.fancy-button.green .button-text {
  color: #08080e;
  border-bottom: 1px dotted #08080e;
}

a:hover.fancy-button.green .button-text {
  border-color: transparent;
}

a.fancy-button.green-light .circle {
  background: rgba(255, 255, 255, 1);
}

a.fancy-button.green-light .circle .icon {
  background-image: url(../svg/link-icons/play-green-light.svg);
}

a.fancy-button.green-light .button-text {
  color: #08080e;
  border-bottom: 1px dotted #08080e;
}

a:hover.fancy-button.green-light .button-text {
  border-color: transparent;
}

a.fancy-button.brown .circle {
  background: rgba(255, 255, 255, 1);
}

a.fancy-button.brown .circle .icon {
  background-image: url(../svg/link-icons/play-brown.svg);
}

a.fancy-button.brown .button-text {
  color: #742727;
  border-bottom: 1px dotted #742727;
}

a:hover.fancy-button.brown .button-text {
  border-color: transparent;
}

a.fancy-button.violet .circle {
  background: rgba(255, 255, 255, 1);
}

a.fancy-button.violet .circle .icon {
  background-image: url(../svg/link-icons/play-violet.svg);
}

a.fancy-button.violet .button-text {
  color: #00032A;
  border-bottom: 1px dotted #00032A;
}

a:hover.fancy-button.violet .button-text {
  border-color: transparent;
}


/* Hover icon */
.hover-icon {
  transition: transform .3s cubic-bezier(0.075, 0.82, 0.165, 1);
  box-shadow: 0px 10px 46px 0px rgba(1, 7, 39, .1);
}

.hover-icon:hover {
  transform: scale(1.2);
}

img#Be {
  filter: contrast(0.5) grayscale(1) brightness(11);
  width: 70%;
}

#header.show img#Be {
  filter: unset;
}

#header.show {
  background: #fff;
}

/* sec-slide */

h1.heading {
  margin-bottom: 10px !important;
}

h3.heading {
  margin-bottom: 10px !important;
}
/* <------> */

/* sec-video */
article#our-video {
  padding-top: 60px;
}

img#icon-empresa {
  background: unset;
}
/* <------> */

/* logo-footer */
img.be-logo {
  width: 255px;
  filter: grayscale(1) brightness(11);
}
/* <----> */

/* sec-desempenho */
.info-desempenho {
  display: flex;
  justify-content: space-around;
}

.dados {
  text-align: center;
}
/* <------> */

/* site */
.vertical-scroll-container {
  width: 100%;
  height: 500px;
  overflow: hidden;
  position: relative;
}

.vertical-scroll-container img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  animation: scrollVertical 20s linear infinite;
}

@keyframes scrollVertical {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-3300px); /* 1500 - 500 = 1000px de movimentação */
  }
}
/* <----> */

/* modulos */

.mdi-information::before {
  content: "\F02FC";
  font-size: 50px;
  line-height: normal;
  color: #0030c6;
}

.mdi-cart::before {
  content: "\F0110";
  font-size: 50px;
  line-height: normal;
  color: #0030c6;
  
}

.mdi-briefcase::before {
  content: "\F00D6";
  font-size: 50px;
  line-height: normal;
  color: #0030c6;
}

.mdi-newspaper::before {
  content: "\F0395";
  font-size: 50px;
  line-height: normal;
  color: #0030c6;
}

.mdi-image-multiple::before {
  content: "\F02F9";
  font-size: 50px;
  line-height: normal;
  color: #0030c6;
}

.mdi-plus-circle::before {
  content: "\F0417";
  font-size: 50px;
  line-height: normal;
  color: #0030c6;
}

#about h3.heading {
  margin-bottom: 40px !important;
}

span.text-gradient-primary {
  color: #feac06 !important;
}

/* icon-suporte */
.icon-suporte img {
  position: absolute;
  width: 20%;
  top: 10%;
  left: 50px;
  background: #dde7f0;
  padding: 10px;
  border-radius: 80px;
}

#intro .wrapper {
  max-width: none;
}