@charset "utf-8";

.light ~ div .s-mobile-view-editor-wrapper, .light.site-dashboard-content .s-mobile-view-editor-wrapper { background-color: rgb(226, 228, 231); }

.light ~ div .s-mobile-view-editor-wrapper .mobile-background.phone .phone-tips, .light.site-dashboard-content .s-mobile-view-editor-wrapper .mobile-background.phone .phone-tips { color: rgb(169, 174, 178); }

.dark ~ div .s-mobile-view-editor-wrapper, .dark.site-dashboard-content .s-mobile-view-editor-wrapper { background-color: rgb(83, 89, 104); }

.dark ~ div .s-mobile-view-editor-wrapper .mobile-background.phone .phone-tips, .dark.site-dashboard-content .s-mobile-view-editor-wrapper .mobile-background.phone .phone-tips { color: rgb(141, 148, 156); }

@media screen and (max-width: 727px) {
  .s-ecommerce .s-ecommerce-content .s-ecommerce-products-wrapper { width: 100%; }
  .s-ecommerce .s-ecommerce-content .s-ecommerce-empty-box { justify-content: center; align-items: center; display: flex !important; }
  .s-ecommerce .s-ecommerce-content .s-ecommerce-empty-box .text { line-height: 1.5 !important; }
}

.s-mobile-view-editor-wrapper { width: 100%; height: 100%; position: absolute; left: 0px; top: 0px; background-color: rgb(83, 89, 104); min-height: 864px; display: none; align-items: center; justify-content: center; overflow: auto; min-width: 850px; }

.s-mobile-view-editor-wrapper.show { display: flex; }

@media only screen and (max-height: 759px) {
  .s-mobile-view-editor-wrapper { min-height: 0px; overflow: auto hidden; }
}

.s-mobile-view-editor-wrapper .s-component.s-layout .s-component-editor { width: auto; white-space: nowrap; }

.s-mobile-view-editor-wrapper .s-component.s-layout .s-component-editor::before, .s-mobile-view-editor-wrapper .s-component.s-layout .s-component-editor::after { display: none; }

.s-mobile-view-editor-wrapper .s-component.s-layout .s-component-editor .status.clickable { padding: 10px 20px; cursor: auto; border-bottom: 1px solid rgb(71, 75, 86); }

.s-mobile-view-editor-wrapper .s-component.s-layout .s-component-editor .status.clickable.no-hover:hover { background: none; }

.s-mobile-view-editor-wrapper .s-component.s-layout .s-component-editor .layout-panel { max-width: 100%; }

.s-mobile-view-editor-wrapper .s-component.s-background.s-s6-background-editor .s-component-editor { overflow: unset; }

.s-mobile-view-editor-wrapper .s-component.s-background.s-s6-background-editor .s-component-editor .background-editor-image-panel .focus-panel { left: 203px; }

.editor-rtl-layout .s-mobile-view-editor-wrapper .s-component.s-background.s-s6-background-editor .s-component-editor .background-editor-image-panel .focus-panel { left: unset; right: 203px; }

.editor-rtl-layout .s-mobile-view-editor-wrapper .s-component.s-background.s-s6-background-editor .s-component-editor .background-editor-image-panel .focus-panel .focus-panel-draggable-wrapper { direction: ltr; }

.s-mobile-view-editor-wrapper .s-component.s-background.s-s6-background-editor .s-component-editor .background-editor-image-panel .focus-panel::before { right: 0px; left: -12px; transform: rotateZ(180deg); }

.editor-rtl-layout .s-mobile-view-editor-wrapper .s-component.s-background.s-s6-background-editor .s-component-editor .background-editor-image-panel .focus-panel::before { right: -12px; left: unset; }

.s-mobile-view-editor-wrapper .mobile-actions-tour-wrap { position: absolute; left: 50%; margin-left: 230px; bottom: 15px; min-width: 220px; border-radius: 3px; background: rgb(71, 75, 86); padding: 14px 15px; box-sizing: border-box; font-size: 12px; color: rgb(169, 174, 178); font-family: open_sans, "Open Sans", sans-serif; display: grid; grid-template-columns: repeat(2, auto); column-gap: 10px; align-items: center; justify-content: space-between; }

.s-mobile-view-editor-wrapper .mobile-actions-tour-wrap .mobile-actions-tips { font-weight: 600; line-height: 1.5; text-decoration: underline; cursor: pointer; }

.s-mobile-view-editor-wrapper .mobile-actions-tour-wrap .mobile-actions-close { font-size: 25px; font-weight: 300; cursor: pointer; }

.s-mobile-view-editor-wrapper .s-sub-editor-box { position: absolute; left: 50%; z-index: 1; margin-left: 205px; display: flex; flex-direction: column; justify-content: space-between; height: 864px; }

.editor-rtl-layout .s-mobile-view-editor-wrapper .s-sub-editor-box { left: unset; right: 50%; margin-left: unset; margin-right: 205px; }

@media only screen and (max-height: 759px) {
  .s-mobile-view-editor-wrapper .s-sub-editor-box { height: 100%; }
}

.s-mobile-view-editor-wrapper .s-sub-editor-box .s-sub-editor-content { position: absolute; max-width: 450px; z-index: 2; left: 8px; margin-top: 10px; background-color: transparent !important; }

.editor-rtl-layout .s-mobile-view-editor-wrapper .s-sub-editor-box .s-sub-editor-content { left: unset; right: 8px; }

@media only screen and (max-height: 759px) {
  .s-mobile-view-editor-wrapper .s-sub-editor-box .s-sub-editor-content { margin-top: 0px; }
}

.s-mobile-view-editor-wrapper .s-sub-editor-box .s-sub-editor-content .s-middle-div { width: 100%; }

.s-mobile-view-editor-wrapper .s-sub-editor-box .s-sub-editor-content .s-component-editor::before, .s-mobile-view-editor-wrapper .s-sub-editor-box .s-sub-editor-content .s-component-editor::after { right: 100%; top: 20px; border: solid transparent; content: " "; height: 0px; width: 0px; position: absolute; pointer-events: none; }

.editor-rtl-layout .s-mobile-view-editor-wrapper .s-sub-editor-box .s-sub-editor-content .s-component-editor::before, .editor-rtl-layout .s-mobile-view-editor-wrapper .s-sub-editor-box .s-sub-editor-content .s-component-editor::after { right: unset; left: 100%; }

.s-mobile-view-editor-wrapper .s-sub-editor-box .s-sub-editor-content .s-component-editor::after { border-color: rgba(47, 47, 47, 0) rgb(46, 46, 47) rgba(47, 47, 47, 0) rgba(47, 47, 47, 0); border-width: 8px; margin-top: -8px; }

.editor-rtl-layout .s-mobile-view-editor-wrapper .s-sub-editor-box .s-sub-editor-content .s-component-editor::after { border-right-color: transparent; border-left-color: rgb(46, 46, 47); }

.s-mobile-view-editor-wrapper .s-sub-editor-box .s-sub-editor-content .s-component-editor::before { border-color: rgba(102, 102, 102, 0) rgb(51, 51, 51) rgba(102, 102, 102, 0) rgba(102, 102, 102, 0); border-width: 9px; margin-top: -9px; }

.editor-rtl-layout .s-mobile-view-editor-wrapper .s-sub-editor-box .s-sub-editor-content .s-component-editor::before { border-right-color: transparent; border-left-color: rgb(51, 51, 51); }

.s-mobile-view-editor-wrapper .s-sub-editor-box .s-sub-editor-content .s-component.s-background .s-component-editor { width: 206px; transition: opacity 0.1s ease-in-out; }

.s-mobile-view-editor-wrapper .s-loading-iframe { background-color: rgb(255, 255, 255); z-index: 20; align-items: center; justify-content: center; }

.s-mobile-view-editor-wrapper .s-loading-iframe .s-loading { width: 28px; height: 28px; background: url("/images/blog/loading.gif") no-repeat rgb(255, 255, 255); text-align: center; }

.s-mobile-view-editor-wrapper .iframe-editor #mobile-view-editor { background-color: rgb(255, 255, 255); }

@media only screen and (max-height: 759px) {
  .s-mobile-view-editor-wrapper .iframe-editor { height: calc(100% + 0px); }
}

.s-mobile-view-editor-wrapper .navbar-drawer-bar { top: 10px; }

.s-mobile-view-editor-wrapper .s-iframe-wrapper { width: 390px; height: 844px; border-width: medium; border-style: none; border-color: currentcolor; border-image: none; display: flex; margin: 10px auto 0px; border-radius: 20px; }

@media only screen and (max-height: 759px) {
  .s-mobile-view-editor-wrapper .s-iframe-wrapper { height: 100%; margin: 0px 10px; border-radius: 0px; }
}

.s-mobile-view-editor-wrapper .mobile-background.phone { width: 410px; height: 864px; border-radius: 25px; background-color: rgb(30, 30, 31); box-shadow: rgba(46, 46, 47, 0.5) 0px 0px 10px; position: relative; }

@media only screen and (max-height: 759px) {
  .s-mobile-view-editor-wrapper .mobile-background.phone { height: 100%; border-radius: 0px; }
}

.s-mobile-view-editor-wrapper .mobile-background.phone .phone-tips { font-size: 14px; position: relative; top: 30px; text-align: center; font-family: open_sans, "Open Sans", sans-serif; }

@media only screen and (max-height: 759px) {
  .s-mobile-view-editor-wrapper .mobile-background.phone .phone-tips { display: none; }
}