| Current File : /home/kelaby89/www/wp/wp-content/plugins/trx_addons/components/api/elementor/elementor.scss |
@import "../../../css/_mixins.scss";
@import "../../../css/_trx_addons.vars.scss";
@import "../../../css/_trx_addons.colors.scss";
/* Fix for Elementor 3.5.0+:
paddings are moved from the .elementor-column-wrap to the .elementor-widget-wrap
----------------------------------------------------------- */
.elementor-container[class*="elementor-column-gap-"] > .elementor-row > .elementor-column > .elementor-element-populated > .elementor-widget-wrap {
padding: 0;
}
/* Fix for Elementor Edit Page submenu in admin bar
----------------------------------------------------------- */
#wp-admin-bar-elementor_edit_page.menupop {
.ab-submenu .ab-item {
width: auto;
max-width: 320px;
}
&:hover {
.ab-sub-wrapper {
display: block;
}
}
}
/* Fix for stretched rows in the header on the boxed page
----------------------------------------------------------- */
.body_style_boxed .top_panel .elementor-section-stretched {
left: 0 !important;
width: 100vw !important;
}
/* Style Preview in the Elementor Editor
----------------------------------------------------------- */
#e-styleguide-preview-dialog {
z-index: 999999 !important;
}
/* Edit area settings
----------------------------------- */
.elementor-edit-area {
z-index: 10000;
}
/* Controls */
.elementor-editor-active .elementor-edit-area .elementor-element > .elementor-element-overlay {
z-index: 100000 !important; /* To bring up over all absolute elements */
}
.elementor-editor-active.single-cpt_layouts .elementor-edit-area .elementor-element.elementor-widget-empty.sc_layouts_item .elementor-widget-empty-icon {
padding: 10px;
}
/* Row type: Narrow */
.elementor-editor-active .elementor-edit-area .elementor-top-section.sc_layouts_row_type_narrow > .elementor-container > .elementor-row, // Elm 2.9-
.elementor-editor-active .elementor-edit-area .elementor-top-section.sc_layouts_row_type_narrow > .elementor-container { // Elm 3.0+
min-height: 40px;
}
.elementor-editor-active .sc_layouts_row_type_narrow .elementor-column-wrap.elementor-element-empty .elementor-widget-wrap, // Elm 2.9-
.elementor-editor-active .sc_layouts_row_type_narrow .elementor-widget-wrap.elementor-element-empty { // Elm 3.0+
min-height: 30px;
}
/* Elementor's Grid
---------------------------------- */
.elementor-editor-active .elementor-edit-area {
.hide_on_wide, .sc_layouts_hide_on_wide,
.hide_on_desktop, .sc_layouts_hide_on_desktop,
.hide_on_notebook, .sc_layouts_hide_on_notebook {
&:before {
content: "";
display: block;
@include abs-cover(9997);
background-color: rgba(255, 255, 255, 0.6);
pointer-events: none;
}
&:after {
content: ' ';
display: block;
@include abs-cover(0);
background: repeating-linear-gradient(125deg, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05) 1px, transparent 2px, transparent 9px) rgba(128, 128,128,0.15);
pointer-events: none;
}
}
}
.elementor-editor-active .elementor-edit-area {
--hide-on-xxx-display: block;
.e-con {
--hide-on-xxx-display: flex;
}
.hide_on_wide, .sc_layouts_hide_on_wide,
.hide_on_desktop, .sc_layouts_hide_on_desktop,
.hide_on_notebook, .sc_layouts_hide_on_notebook,
.hide_on_tablet, .sc_layouts_hide_on_tablet,
.hide_on_mobile, .sc_layouts_hide_on_mobile {
display: var(--hide-on-xxx-display) !important;
}
}
.elementor-editor-active[class*="cpt_layouts-template"] .elementor-edit-area {
.sc_layouts_hide_on_wide,
.sc_layouts_hide_on_desktop,
.sc_layouts_hide_on_notebook,
.sc_layouts_hide_on_tablet,
.sc_layouts_hide_on_mobile {
display: var(--hide-on-xxx-display) !important;
}
}
.elementor-editor-active .elementor-edit-area .sc_layouts_column .sc_layouts_item {
--hide-on-xxx-display: inline-block;
&.e-con {
--hide-on-xxx-display: flex;
}
&.hide_on_wide, &.sc_layouts_hide_on_wide,
&.hide_on_desktop, &.sc_layouts_hide_on_desktop,
&.hide_on_notebook, &.sc_layouts_hide_on_notebook,
&.hide_on_tablet, &.sc_layouts_hide_on_tablet,
&.hide_on_mobile, &.sc_layouts_hide_on_mobile {
display: var(--hide-on-xxx-display) !important;
}
}
.elementor-edit-area .sc_layouts_item.elementor-hidden-desktop,
.elementor-edit-area .sc_layouts_item.elementor-hidden-tablet,
.elementor-edit-area .sc_layouts_item.elementor-hidden-phone {
--hide-on-xxx-display: inline-block;
&.e-con {
--hide-on-xxx-display: flex;
}
display: var(--hide-on-xxx-display) !important;
}
.elementor-container > .elementor-row > .elementor-column > .elementor-element-populated, // Elm 2.9-
.elementor-container > .elementor-column > .elementor-element-populated { // Elm 3.0+
padding-top: 0;
padding-bottom: 0;
}
/* Shortcode is not available */
.trx_addons_sc_not_exists {
@include border-box;
padding: 1.5em;
border: 3px solid #b7084e;
background-image: -webkit-gradient(linear,left top,left bottom,from(#f3f3f3),to(#fff));
background-image: -webkit-linear-gradient(top,#f3f3f3,#fff);
background-image: -o-linear-gradient(top,#f3f3f3,#fff);
background-image: linear-gradient(180deg,#f3f3f3,#fff);
}
.trx_addons_sc_not_exists_title {
margin-top: 0;
}
.trx_addons_sc_not_exists_description p:last-child {
margin-bottom: 0;
}
.sc_layouts_featured_title_preview {
margin: 0;
@include abs-cc;
}
/* Scrolling animation ( aka Parallax & Entrance )
---------------------------------------------------- */
:root {
--trx-addons-parallax-x-anchor: center;
--trx-addons-parallax-y-anchor: center;
}
.sc_parallax {
@include transform-origin( var(--trx-addons-parallax-y-anchor) var(--trx-addons-parallax-x-anchor) );
//Display Parallax in the editor
.elementor-editor-active & {
overflow: visible !important;
}
}
// Hide parallax objects until inited
.sc_parallax,
.sc_parallax_mouse {
&:not(.trx_addons_parallax_layers_inited),
&:not(.trx_addons_parallax_blocks_inited) {
opacity: 0;
}
}
.trx_addons_parallax_blocks_need_start:not(.trx_addons_parallax_blocks_on_start) {
opacity: 0;
}
// To avoid conflict animation with parallax
.sc_parallax.animated {
-webkit-animation-fill-mode: unset;
animation-fill-mode: unset;
}
// Parallax Flow: Sticky
.sc_parallax_sticky {
&,
// Elementor 3.24.0+ move his styles down and override our style.
// Increase a weight to fix problem:
&.e-con,
&.elementor-section,
&.elementor-column {
position: sticky;
}
}
// Parallax in the Image
.elementor-image.sc_parallax_wrap {
&,
& > .wp-caption {
overflow: hidden;
@include flex;
@include flex-align-items(center);
}
}
// Parallax in the Featured image
.post_featured.sc_parallax_wrap > img {
@include transition-property(opacity);
}
.post_featured.sc_parallax_wrap:not(.parallax_inited) > img {
opacity: 0;
}
// Parallax in the Titles (item by item)
.sc_parallax_text_block {
display: inline-block;
vertical-align: top;
}
.sc_parallax_word_wrap {
white-space: nowrap;
}
@media screen and (min-width: 768px) {
.sc_parallax_text_nowrap_on {
white-space: nowrap;
}
}
// Animated titles (item by item) with Elementor motion effects
.sc_item_title,
.elementor-heading-title,
.trx-addons-advanced-title {
.sc_item_animated_block {
display: inline-block;
vertical-align: baseline;
}
}
/* Fly elements */
[class*="sc_fly_"]:not(.sc_fly_static) {
position: absolute !important;
}
.sc_fly_tl { @include abs-lt; }
.sc_fly_tc { @include abs-ct; }
.sc_fly_tr { @include abs-rt; }
.sc_fly_ml { @include abs-lc; }
.sc_fly_mc { @include abs-cc; }
.sc_fly_mr { @include abs-rc; }
.sc_fly_bl { @include abs-lb; }
.sc_fly_bc { @include abs-cb; }
.sc_fly_br { @include abs-rb; }
/* Position 'Sticky' for common elements */
.elementor-element.elementor-sticky {
position: sticky;
top: var(--fixed-rows-height);
&.elementor-element-edit-mode {
position: sticky !important;
}
}
/* Align fixed (sticky) columns and containers */
body:not(.fixed_blocks_sticky) {
.e-con.sc_column_fixed,
.elementor-column.sc_column_fixed {
@include flex-align-self(flex-start);
}
.sc_column_fixed_placeholder {
min-height: 1px;
}
}
/* Fix: Vertical align items in columns */
.elementor-section-content-middle .elementor-widget-wrap {
@include flex-align-items(center);
}
.elementor-section-content-top .elementor-widget-wrap {
@include flex-align-items(flex-start);
}
.elementor-section-content-bottom .elementor-widget-wrap {
@include flex-align-items(flex-end);
}
/* Horizontal align items in columns */
.sc_content_align_center[class*="sc_inner_width_"],
.sc_content_align_center.elementor-column .elementor-widget-wrap {
@include flex-justify-content(center);
}
.sc_content_align_left[class*="sc_inner_width_"],
.sc_content_align_left.elementor-column .elementor-widget-wrap {
@include flex-justify-content(flex-start);
}
.sc_content_align_right[class*="sc_inner_width_"],
.sc_content_align_right.elementor-column .elementor-widget-wrap {
@include flex-justify-content(flex-end);
}
/* Elm 3.16.0+ Content Area. Attention! A theme-specific CSS-var "--theme-var-page" is used */
.e-con.sc_inner_width_1_1 > .e-con-inner, .e-con.sc_inner_width_1_1 > .elementor-element { width: var(--theme-var-page); }
.e-con.sc_inner_width_1_2 > .e-con-inner, .e-con.sc_inner_width_1_2 > .elementor-element { width: calc( var(--theme-var-page ) / 2 ); }
.e-con.sc_inner_width_1_3 > .e-con-inner, .e-con.sc_inner_width_1_3 > .elementor-element { width: calc( var(--theme-var-page ) / 3 ); }
.e-con.sc_inner_width_2_3 > .e-con-inner, .e-con.sc_inner_width_2_3 > .elementor-element { width: calc( var(--theme-var-page ) / 3 * 2 ); }
.e-con.sc_inner_width_1_4 > .e-con-inner, .e-con.sc_inner_width_1_4 > .elementor-element { width: calc( var(--theme-var-page ) / 4 ); }
.e-con.sc_inner_width_3_4 > .e-con-inner, .e-con.sc_inner_width_3_4 > .elementor-element { width: calc( var(--theme-var-page ) / 4 * 3 ); }
/* Elm 3.16.0+ Container max width. Attention! A theme-specific CSS-var "--theme-var-page" is used */
body.elementor-use-container {
.e-con {
--container-max-width: var(--theme-var-page);
}
}
/* Elm 3.16.0+ Containers with a row type (narrow, normal, compact) */
.e-con {
&.sc_layouts_row_type_narrow {
--padding-block-start: 6px;
--padding-block-end: 6px;
--padding-inline-start: 0;
--padding-inline-end: 0;
}
&.sc_layouts_row_type_compact {
--padding-block-start: 0.75em;
--padding-block-end: 0.75em;
--padding-inline-start: 0;
--padding-inline-end: 0;
}
&.sc_layouts_row_type_normal {
--padding-block-start: 2em;
--padding-block-end: 2em;
--padding-inline-start: 0;
--padding-inline-end: 0;
}
&.sc_layouts_row {
padding-block-start: var(--padding-block-start);
padding-block-end: var(--padding-block-end);
padding-inline-start: var(--padding-inline-start);
padding-inline-end: var(--padding-inline-end);
}
}
/* Widget: Tabs */
.elementor-widget-tabs.sc_tabs_icon_position_left .elementor-tab-title > [class*="icon-"]:before {
margin-right: 0.5em;
}
.elementor-widget-tabs.sc_tabs_icon_position_top .elementor-tab-title > [class*="icon-"] {
text-align: center;
&:before {
display: block;
margin-bottom: 0.5em;
}
}
/* Widget Text Editor */
.elementor-text-editor,
.elementor-widget-text-editor {
& > *:first-child,
.elementor-widget-container > *:first-child {
margin-top: 0;
}
}
.elementor-text-editor,
.elementor-widget-text-editor {
& > *:last-child,
.elementor-widget-container > *:last-child {
margin-bottom: 0;
}
}
/* Widget Spacer: Alternative height variants */
.elementor-editor-active .elementor-spacer-inner {
background-color: rgba(255,255,0,0.05);
}
.elementor-widget-spacer.sc_height_tiny .elementor-spacer-inner { height: var(--sc-space-tiny) !important; }
.elementor-widget-spacer.sc_height_small .elementor-spacer-inner { height: var(--sc-space-small) !important; }
.elementor-widget-spacer.sc_height_medium .elementor-spacer-inner { height: var(--sc-space-medium) !important; }
.elementor-widget-spacer.sc_height_large .elementor-spacer-inner,
.elementor-widget-spacer.sc_height_big .elementor-spacer-inner { height: var(--sc-space-large) !important; }
.elementor-widget-spacer.sc_height_huge .elementor-spacer-inner { height: var(--sc-space-huge) !important; }
/* Widget Divider: Alternative gap variants */
.elementor-widget-divider.sc_height_tiny .elementor-divider { padding: var(--sc-space-tiny) 0 !important; }
.elementor-widget-divider.sc_height_small .elementor-divider { padding: var(--sc-space-small) 0 !important; }
.elementor-widget-divider.sc_height_medium .elementor-divider { padding: var(--sc-space-medium) 0 !important; }
.elementor-widget-divider.sc_height_large .elementor-divider,
.elementor-widget-divider.sc_height_big .elementor-divider { padding: var(--sc-space-large) 0 !important; }
.elementor-widget-divider.sc_height_huge .elementor-divider { padding: var(--sc-space-huge) 0 !important; }
/* Extra bg for rows, columns and widgets "Text Editor" */
.elementor-section[class*="sc_extra_bg_"],
.elementor-section[class*="sc_bg_mask_"] {
position:relative;
&:not(.sc_layouts_row_fixed_on) {
z-index: 0;
}
}
.e-con[class*="sc_extra_bg_"], // Elm 3.16.0+
.e-con[class*="sc_bg_mask_"] { // Elm 3.16.0+
position:relative;
z-index: var(--z-index);
}
.elementor-column[class*="sc_extra_bg_"] > .elementor-column-wrap, // Elm 2.9-
.elementor-column[class*="sc_extra_bg_"] > .elementor-widget-wrap, // Elm 3.0+
.elementor-column[class*="sc_bg_mask_"] > .elementor-column-wrap, // Elm 2.9-
.elementor-column[class*="sc_bg_mask_"] > .elementor-widget-wrap, // Elm 3.0+
.elementor-widget-text-editor[class*="sc_extra_bg_"],
.elementor-widget-text-editor[class*="sc_bg_mask_"] {
position:relative;
z-index: 0;
}
.elementor-widget-text-editor[class*="sc_bg_mask_"] > .wpb_wrapper {
position:relative;
z-index:2;
}
.e-con[class*="sc_extra_bg_"]:after, // Elm 3.16.0+
.elementor-section[class*="sc_extra_bg_"]:after,
.elementor-column[class*="sc_extra_bg_"] > .elementor-column-wrap:after, // Elm 2.9-
.elementor-column[class*="sc_extra_bg_"] > .elementor-widget-wrap:after, // Elm 3.0+
.elementor-widget-text-editor[class*="sc_extra_bg_"]:after {
content:' ';
display: block;
position: absolute;
z-index:-1;
background:inherit;
}
.e-con[class*="sc_bg_mask_"]:before, // Elm 3.16.0+
.elementor-section[class*="sc_bg_mask_"]:before,
.elementor-column[class*="sc_bg_mask_"] > .elementor-column-wrap:before, // Elm 2.9-
.elementor-column[class*="sc_bg_mask_"] > .elementor-widget-wrap:before, // Elm 3.0+
.elementor-widget-text-editor[class*="sc_bg_mask_"]:before {
content:' ';
display: block !important;
background-color:inherit;
@include abs-cover(0);
}
.e-con[class*="sc_extra_bg_"]:after, // Elm 3.16.0+
.e-con[class*="sc_bg_mask_"]:before { // Elm 3.16.0+
@include box(auto, auto);
}
.e-con.vc_parallax[class*="sc_bg_mask_"]:before, // Elm 3.16.0+
.elementor-section.vc_parallax[class*="sc_bg_mask_"]:before {
z-index:1;
}
.e-con.sc_extra_bg_tiny[class*="sc_bg_mask_"]:before, // Elm 3.16.0+
.e-con.sc_extra_bg_tiny:after, // Elm 3.16.0+
.elementor-section.sc_extra_bg_tiny[class*="sc_bg_mask_"]:before,
.elementor-section.sc_extra_bg_tiny:after,
.elementor-column.sc_extra_bg_tiny[class*="sc_bg_mask_"] > .elementor-column-wrap:before, // Elm 2.9-
.elementor-column.sc_extra_bg_tiny > .elementor-column-wrap:after, // Elm 2.9-
.elementor-column.sc_extra_bg_tiny[class*="sc_bg_mask_"] > .elementor-widget-wrap:before, // Elm 3.0+
.elementor-column.sc_extra_bg_tiny > .elementor-widget-wrap:after, // Elm 3.0+
.elementor-widget-text-editor.sc_extra_bg_tiny[class*="sc_bg_mask_"]:before,
.elementor-widget-text-editor.sc_extra_bg_tiny:after {
@include abs-pos(-2em, -2em, -2em, -2em, '');
}
.e-con.sc_extra_bg_small[class*="sc_bg_mask_"]:before, // Elm 3.16.0+
.e-con.sc_extra_bg_small:after, // Elm 3.16.0+
.elementor-section.sc_extra_bg_small[class*="sc_bg_mask_"]:before,
.elementor-section.sc_extra_bg_small:after,
.elementor-column.sc_extra_bg_small[class*="sc_bg_mask_"] > .elementor-column-wrap:before, // Elm 2.9-
.elementor-column.sc_extra_bg_small > .elementor-column-wrap:after, // Elm 2.9-
.elementor-column.sc_extra_bg_small[class*="sc_bg_mask_"] > .elementor-widget-wrap:before, // Elm 3.0+
.elementor-column.sc_extra_bg_small > .elementor-widget-wrap:after, // Elm 3.0+
.elementor-widget-text-editor.sc_extra_bg_small[class*="sc_bg_mask_"]:before,
.elementor-widget-text-editor.sc_extra_bg_small:after {
@include abs-pos(-4em, -4em, -4em, -4em, '');
}
.e-con.sc_extra_bg_medium[class*="sc_bg_mask_"]:before, // Elm 3.16.0+
.e-con.sc_extra_bg_medium:after, // Elm 3.16.0+
.elementor-section.sc_extra_bg_medium[class*="sc_bg_mask_"]:before,
.elementor-section.sc_extra_bg_medium:after,
.elementor-column.sc_extra_bg_medium[class*="sc_bg_mask_"] > .elementor-column-wrap:before, // Elm 2.9-
.elementor-column.sc_extra_bg_medium > .elementor-column-wrap:after, // Elm 2.9-
.elementor-column.sc_extra_bg_medium[class*="sc_bg_mask_"] > .elementor-widget-wrap:before, // Elm 3.0+
.elementor-column.sc_extra_bg_medium > .elementor-widget-wrap:after, // Elm 3.0+
.elementor-widget-text-editor.sc_extra_bg_medium[class*="sc_bg_mask_"]:before,
.elementor-widget-text-editor.sc_extra_bg_medium:after {
@include abs-pos(-6em, -6em, -6em, -6em, '');
}
.e-con.sc_extra_bg_large[class*="sc_bg_mask_"]:before, // Elm 3.16.0+
.e-con.sc_extra_bg_large:after, // Elm 3.16.0+
.elementor-section.sc_extra_bg_large[class*="sc_bg_mask_"]:before,
.elementor-section.sc_extra_bg_large:after,
.elementor-column.sc_extra_bg_large[class*="sc_bg_mask_"] > .elementor-column-wrap:before, // Elm 2.9-
.elementor-column.sc_extra_bg_large > .elementor-column-wrap:after, // Elm 2.9-
.elementor-column.sc_extra_bg_large[class*="sc_bg_mask_"] > .elementor-widget-wrap:before, // Elm 3.0+
.elementor-column.sc_extra_bg_large > .elementor-widget-wrap:after, // Elm 3.0+
.elementor-widget-text-editor.sc_extra_bg_large[class*="sc_bg_mask_"]:before,
.elementor-widget-text-editor.sc_extra_bg_large:after {
@include abs-pos(-8em, -8em, -8em, -8em, '');
}
.e-con.sc_bg_mask_bg_color:before, // Elm 3.16.0+
.elementor-section.sc_bg_mask_bg_color:before,
.elementor-column.sc_bg_mask_bg_color > .elementor-column-wrap:before, // Elm 2.9-
.elementor-column.sc_bg_mask_bg_color > .elementor-widget-wrap:before, // Elm 3.0+
.elementor-widget-text-editor.sc_bg_mask_bg_color:before { background-color:inherit; }
.e-con.sc_bg_mask_1:before, // Elm 3.16.0+
.elementor-section.sc_bg_mask_1:before,
.elementor-column.sc_bg_mask_1 > .elementor-column-wrap:before, // Elm 2.9-
.elementor-column.sc_bg_mask_1 > .elementor-widget-wrap:before, // Elm 3.0+
.elementor-widget-text-editor.sc_bg_mask_1:before { opacity: 0.1; }
.e-con.sc_bg_mask_2:before, // Elm 3.16.0+
.elementor-section.sc_bg_mask_2:before,
.elementor-column.sc_bg_mask_2 > .elementor-column-wrap:before, // Elm 2.9-
.elementor-column.sc_bg_mask_2 > .elementor-widget-wrap:before, // Elm 3.0+
.elementor-widget-text-editor.sc_bg_mask_2:before { opacity: 0.2; }
.e-con.sc_bg_mask_3:before, // Elm 3.16.0+
.elementor-section.sc_bg_mask_3:before,
.elementor-column.sc_bg_mask_3 > .elementor-column-wrap:before, // Elm 2.9-
.elementor-column.sc_bg_mask_3 > .elementor-widget-wrap:before, // Elm 3.0+
.elementor-widget-text-editor.sc_bg_mask_3:before { opacity: 0.3; }
.e-con.sc_bg_mask_4:before, // Elm 3.16.0+
.elementor-section.sc_bg_mask_4:before,
.elementor-column.sc_bg_mask_4 > .elementor-column-wrap:before, // Elm 2.9-
.elementor-column.sc_bg_mask_4 > .elementor-widget-wrap:before, // Elm 3.0+
.elementor-widget-text-editor.sc_bg_mask_4:before { opacity: 0.4; }
.e-con.sc_bg_mask_5:before, // Elm 3.16.0+
.elementor-section.sc_bg_mask_5:before,
.elementor-column.sc_bg_mask_5 > .elementor-column-wrap:before, // Elm 2.9-
.elementor-column.sc_bg_mask_5 > .elementor-widget-wrap:before, // Elm 3.0+
.elementor-widget-text-editor.sc_bg_mask_5:before { opacity: 0.5; }
.e-con.sc_bg_mask_6:before, // Elm 3.16.0+
.elementor-section.sc_bg_mask_6:before,
.elementor-column.sc_bg_mask_6 > .elementor-column-wrap:before, // Elm 2.9-
.elementor-column.sc_bg_mask_6 > .elementor-widget-wrap:before, // Elm 3.0+
.elementor-widget-text-editor.sc_bg_mask_6:before { opacity: 0.6; }
.e-con.sc_bg_mask_7:before, // Elm 3.16.0+
.elementor-section.sc_bg_mask_7:before,
.elementor-column.sc_bg_mask_7 > .elementor-column-wrap:before, // Elm 2.9-
.elementor-column.sc_bg_mask_7 > .elementor-widget-wrap:before, // Elm 3.0+
.elementor-widget-text-editor.sc_bg_mask_7:before { opacity: 0.7; }
.e-con.sc_bg_mask_8:before, // Elm 3.16.0+
.elementor-section.sc_bg_mask_8:before,
.elementor-column.sc_bg_mask_8 > .elementor-column-wrap:before, // Elm 2.9-
.elementor-column.sc_bg_mask_8 > .elementor-widget-wrap:before, // Elm 3.0+
.elementor-widget-text-editor.sc_bg_mask_8:before { opacity: 0.8; }
.e-con.sc_bg_mask_9:before, // Elm 3.16.0+
.elementor-section.sc_bg_mask_9:before,
.elementor-column.sc_bg_mask_9 > .elementor-column-wrap:before, // Elm 2.9-
.elementor-column.sc_bg_mask_9 > .elementor-widget-wrap:before, // Elm 3.0+
.elementor-widget-text-editor.sc_bg_mask_9:before { opacity: 0.9; }
/* Google map */
.elementor-widget-trx_sc_googlemap .sc_googlemap_marker[data-icon]:before {
display: none;
}
/* Revslider in the stretch section */
body.body_style_boxed .elementor-element-edit-mode.elementor-section-stretched.elementor-section-full_width .rev_slider > ul,
body.body_style_boxed .elementor-element-edit-mode.elementor-section-stretched.elementor-section-full_width .tp-simpleresponsive > ul {
width: 100% !important;
}
/* Background text */
.trx_addons_bg_text {
@include abs-cover(0);
@include flex;
@include flex-direction(row);
@include flex-justify-content(flex-start);
@include flex-align-items(flex-start);
white-space: nowrap;
body.body_style_boxed & {
overflow: hidden;
}
&.trx_addons_marquee_reverse {
@include flex-justify-content(flex-end);
}
&.trx_addons_marquee_wrap {
overflow: hidden;
white-space: nowrap;
.trx_addons_marquee_element {
position: relative;
//display: block;
}
&:not(.trx_addons_marquee_reverse) .trx_addons_marquee_element {
padding-right: 50px;
}
body.rtl &:not(.trx_addons_marquee_reverse) .trx_addons_marquee_element {
padding-right: 0;
padding-left: 50px;
}
&.trx_addons_marquee_reverse .trx_addons_marquee_element {
padding-left: 50px;
}
body.rtl &.trx_addons_marquee_reverse .trx_addons_marquee_element {
padding-left: 0;
padding-right: 50px;
}
}
.trx_addons_bg_text_overlay {
@include abs-cover();
background-size: 100%;
background-repeat: no-repeat;
}
.trx_addons_bg_text_inner {
//white-space: nowrap;
@include flex;
@include flex-justify-content(flex-start);
@include flex-align-items(center);
@include flex-wrap(nowrap);
@include flex-shrink(0);
@include flex-grow(0);
.trx_addons_bg_text_item {
display: inline-block;
vertical-align: top;
opacity: 0;
z-index: 0;
}
.trx_addons_bg_text_char {
color: rgba(0, 0, 0, 0.05);
font-size: 15em;
font-weight: bold;
line-height: 0.8em;
}
.trx_addons_bg_text_delimiter {
margin: 0 0.75em;
img, svg {
display: block;
max-height: 100%;
height: 1em;
max-width: none;
width: auto;
}
}
&.trx_addons_showed_on_scroll {
.trx_addons_bg_text_item {
opacity: 1;
@include transition-delay(3.0s);
}
.trx_addons_bg_text_item:nth-child(1) { @include transition-delay(0.1s); }
.trx_addons_bg_text_item:nth-child(2) { @include transition-delay(0.2s); }
.trx_addons_bg_text_item:nth-child(3) { @include transition-delay(0.3s); }
.trx_addons_bg_text_item:nth-child(4) { @include transition-delay(0.4s); }
.trx_addons_bg_text_item:nth-child(5) { @include transition-delay(0.5s); }
.trx_addons_bg_text_item:nth-child(6) { @include transition-delay(0.6s); }
.trx_addons_bg_text_item:nth-child(7) { @include transition-delay(0.7s); }
.trx_addons_bg_text_item:nth-child(8) { @include transition-delay(0.8s); }
.trx_addons_bg_text_item:nth-child(9) { @include transition-delay(0.9s); }
.trx_addons_bg_text_item:nth-child(10){ @include transition-delay(1.0s); }
.trx_addons_bg_text_item:nth-child(11){ @include transition-delay(1.1s); }
.trx_addons_bg_text_item:nth-child(12){ @include transition-delay(1.2s); }
.trx_addons_bg_text_item:nth-child(13){ @include transition-delay(1.3s); }
.trx_addons_bg_text_item:nth-child(14){ @include transition-delay(1.4s); }
.trx_addons_bg_text_item:nth-child(15){ @include transition-delay(1.5s); }
.trx_addons_bg_text_item:nth-child(16){ @include transition-delay(1.6s); }
.trx_addons_bg_text_item:nth-child(17){ @include transition-delay(1.7s); }
.trx_addons_bg_text_item:nth-child(18){ @include transition-delay(1.8s); }
.trx_addons_bg_text_item:nth-child(19){ @include transition-delay(1.9s); }
.trx_addons_bg_text_item:nth-child(20){ @include transition-delay(2.0s); }
.trx_addons_bg_text_item:nth-child(21){ @include transition-delay(2.1s); }
.trx_addons_bg_text_item:nth-child(22){ @include transition-delay(2.2s); }
.trx_addons_bg_text_item:nth-child(23){ @include transition-delay(2.3s); }
.trx_addons_bg_text_item:nth-child(24){ @include transition-delay(2.4s); }
.trx_addons_bg_text_item:nth-child(25){ @include transition-delay(2.5s); }
.trx_addons_bg_text_item:nth-child(26){ @include transition-delay(2.6s); }
.trx_addons_bg_text_item:nth-child(27){ @include transition-delay(2.7s); }
.trx_addons_bg_text_item:nth-child(28){ @include transition-delay(2.8s); }
.trx_addons_bg_text_item:nth-child(29){ @include transition-delay(2.9s); }
.trx_addons_bg_text_item:nth-child(30){ @include transition-delay(3.0s); }
}
&.trx_addons_bg_text_effect_rotate {
.trx_addons_bg_text_item {
@include transform(matrix3d(1,0,0,0,0,0,1,0,0,-1,0,0,0,-50,-1,1));
@include transform-origin(50% 50% 0);
@include perspective(600px);
@include transition-duration(0.5s);
@include transition-timing(.455,.03,.515,.955);
@include transition-delay(0s);
}
&.trx_addons_showed_on_scroll {
.trx_addons_bg_text_item {
@include transform(matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1));
}
}
}
&.trx_addons_bg_text_effect_slide {
.trx_addons_bg_text_item {
@include transition-duration(0.5s);
@include transition-delay(0s);
@include translateX(-100%);
}
&.trx_addons_showed_on_scroll {
.trx_addons_bg_text_item {
@include translateX(0);
}
}
}
&.trx_addons_bg_text_effect_none,
&.trx_addons_bg_text_effect_none.trx_addons_showed_on_scroll {
.trx_addons_bg_text_item {
opacity: 1;
@include transition-delay(0s);
}
&.trx_addons_bg_text_effect_rotate {
.trx_addons_bg_text_item {
@include transform(matrix3d(1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1));
}
}
&.trx_addons_bg_text_effect_slide {
.trx_addons_bg_text_item {
@include translateX(0);
}
}
}
}
}
/* Disable hover and click inside Layouts in Edit mode
------------------------------------------------------- */
.elementor-widget-trx_sc_layouts.elementor-element-edit-mode .sc_layouts,
.elementor-widget-trx_sc_blogger.elementor-element-edit-mode .sc_blogger {
position: relative;
}
.elementor-widget-trx_sc_layouts.elementor-element-edit-mode .sc_layouts:after,
.elementor-widget-trx_sc_blogger.elementor-element-edit-mode .sc_blogger:after {
content: ' ';
@include abs-cover(10);
}
/* Link to Edit layout in the new tab
------------------------------------------ */
.trx_addons_layout_editor_mask {
@include abs-cover(999999);
@include flex;
@include flex-align-items(center);
@include flex-justify-content(center);
@include transition-property(opacity);
opacity: 0;
&:before {
content: ' ';
@include bg-mask(#000, 0.3);
}
&:hover {
opacity: 1;
.trx_addons_layout_editor_selector {
opacity: 1;
}
}
.trx_addons_layout_editor_selector {
position: relative;
z-index: 2;
@include box-shadow(0px 0px 10px rgba(0,0,0,0.25));
@include transition-property(opacity);
opacity: 0;
max-width: 90%;
.trx_addons_layout_editor_link,
.trx_addons_layout_editor_selector_trigger {
display: block;
@include font(14px, 18px, 500);
@include content-box;
height: 18px;
background-color: #37bb7a;
color: #fff;
@include transition-properties(color, background-color);
&:hover {
background-color: #2eaf70;
color: #fff;
}
}
.trx_addons_layout_editor_link {
padding: 16px 56px 16px 16px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
// text-transform: uppercase;
// @include border-radius(2px 0 0 2px);
}
.trx_addons_layout_editor_selector_trigger {
@include abs-rt;
padding: 16px;
// @include border-radius(0 2px 2px 0);
&:before {
content: '\e857';
font-family: $trx_addons_icons;
}
}
&.trx_addons_layout_editor_selector_opened .trx_addons_layout_editor_selector_trigger:before {
content: '\e85a';
}
.trx_addons_layout_editor_selector_list {
display: none;
@include abs-lt(0, 56px);
@include border-box;
width: 100%;
max-height: 200px;
overflow-x: hidden;
overflow-y: auto;
background-color: #fff;
color: #000;
// @include border-radius(0 0 2px 2px);
@include box-shadow(0px 0px 10px rgba(0,0,0,0.5));
.trx_addons_layout_editor_selector_list_item {
display: block;
padding: 16px;
@include font(14px, 18px, normal);
cursor: pointer;
@include transition-properties(color, background-color);
&:hover {
background-color: #f6f7f1;
color: #000;
}
}
}
}
}
// Bring a header and a footer to the top to place the layout editor selector above over page content
body.elementor-editor-active {
header.top_panel:hover,
footer.footer_wrap:hover {
z-index: 999999;
}
}
/* Toggle sections*/
.sc_section_toggle_on {
will-change: height;
&.sc_section_toggle_state_hide:not(.elementor-element-edit-mode) {
height: 0;
overflow: hidden;
// .elementor-container {
// opacity: 0;
// }
}
&.sc_section_toggle_state_hide.elementor-element-edit-mode:after {
content: ' ';
display: block;
@include bg-mask( #00a8a8, 0.15, 0 );
pointer-events: none;
}
.sc_section_toggle_close_button {
@include square(3em);
@include border-round;
@include abs-rt( 1em, 1em, 9999);
background: rgba(255,255,255,0.75);
opacity: 0;
@include transition-property(opacity);
.trx_addons_button_close_icon:before,
.trx_addons_button_close_icon:after {
border-color: #333;
@include transition-properties(border-color,transform);
@include rotate(0);
}
&:hover {
.trx_addons_button_close_icon:before,
.trx_addons_button_close_icon:after {
border-color: #000;
}
}
}
&.sc_section_toggle_animated_show,
&.sc_section_toggle_state_show {
.sc_section_toggle_close_button {
opacity: 1;
}
.trx_addons_button_close_icon:before {
@include rotate(45deg);
}
.trx_addons_button_close_icon:after {
@include rotate(-45deg);
}
}
&.sc_section_toggle_animated_hide {
.sc_section_toggle_close_button {
opacity: 0;
}
.trx_addons_button_close_icon:before,
.trx_addons_button_close_icon:after {
@include rotate(0);
}
}
}
/* Device-specific responsive must be inside main CSS, not in responsive
-------------------------------------------------------------------------- */
@media #{$media_desktop} {
/* Elementor */
body.elementor-editor-active .elementor-hidden-desktop:not(.elementor-element-edit-mode) { display: none !important; }
.e-con.hide_bg_image_on_desktop, // Elm 3.16.0+
.elementor-section.hide_bg_image_on_desktop,
.elementor-column.hide_bg_image_on_desktop > .elementor-column-wrap, // Elm 2.9-
.elementor-column.hide_bg_image_on_desktop > .elementor-widget-wrap { // Elm 3.0+
background-image: none !important;
}
.e-con.hide_bg_image_on_desktop[class*="sc_bg_mask_"]:before, // Elm 3.16.0+
.elementor-section.hide_bg_image_on_desktop[class*="sc_bg_mask_"]:before,
.elementor-column.hide_bg_image_on_desktop[class*="sc_bg_mask_"] > .elementor-column-wrap:before, // Elm 2.9-
.elementor-column.hide_bg_image_on_desktop[class*="sc_bg_mask_"] > .elementor-widget-wrap:before { // Elm 3.0+
display:none !important;
}
}
@media #{$media_notebook} {
/* Elementor */
body.elementor-editor-active .elementor-hidden-desktop:not(.elementor-element-edit-mode) { display: none !important; }
}
@media #{$media_tablet} {
/* Elementor */
body.elementor-editor-active .elementor-hidden-tablet:not(.elementor-element-edit-mode) { display: none !important; }
}
@media #{$media_mobile} {
/* Elementor */
body.elementor-editor-active .elementor-hidden-phone:not(.elementor-element-edit-mode) { display: none !important; }
}
@media #{$media_not_mobile} {
/* Elementor */
.elementor-section.elementor-section-height-full { // Add .elementor-section to override Elementor's rule
height: calc( 100vh - var(--fixed-rows-height) );
@include transition-property(height);
}
.e-con.e-con.e-con-height-full { // Add .e-con twice to override Elementor's rule
--min-height: calc( 100vh - var(--fixed-rows-height) );
@include transition-property(min-height);
}
// Fix for sticky sections and header over or under
body.header_position_over,
body.header_position_under {
.elementor-section-height-full.sc_stack_section_on {
height: 100vh;
}
.e-con-height-full.sc_stack_section_on {
--min-height: 100vh;
}
&.fixed_blocks_sticky {
.sc_stack_section_effect_slide:not(.elementor-element-edit-mode) {
top: 0;
}
&.admin-bar {
.sc_stack_section_effect_slide:not(.elementor-element-edit-mode) {
top: 32px;
}
.elementor-section-height-full.sc_stack_section_on {
height: calc(100vh - 32px);
}
.e-con-height-full.sc_stack_section_on {
--min-height: calc(100vh - 32px);
}
}
}
}
}
/* Additional Animations
-------------------------------------------------------------------------- */
/* slideInDownSmooth */
.trx_ani_slideInDownSmooth {
-webkit-animation-name: trx_ani_slideInDownSmooth;
animation-name: trx_ani_slideInDownSmooth;
-webkit-animation-timing-function: cubic-bezier(0.175, 1, 0.275, 1);
animation-timing-function: cubic-bezier(0.175, 1, 0.275, 1);
-webkit-animation-duration: 0.85s;
animation-duration: 0.85s;
}
@-webkit-keyframes trx_ani_slideInDownSmooth {
from {
// opacity: 0;
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
to {
// opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes trx_ani_slideInDownSmooth {
from {
// opacity: 0;
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
to {
// opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
/* slideOutUpSmooth */
.trx_ani_slideOutUpSmooth {
-webkit-animation-name: trx_ani_slideOutUpSmooth;
animation-name: trx_ani_slideOutUpSmooth;
-webkit-animation-timing-function: cubic-bezier(0.175, 1, 0.275, 1);
animation-timing-function: cubic-bezier(0.175, 1, 0.275, 1);
-webkit-animation-duration: 0.85s;
animation-duration: 0.85s;
}
@-webkit-keyframes trx_ani_slideOutUpSmooth {
from {
// opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
to {
// opacity: 0;
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
}
@keyframes trx_ani_slideOutUpSmooth {
from {
// opacity: 1;
-webkit-transform: translateY(0);
transform: translateY(0);
}
to {
// opacity: 0;
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
}
}
/* Fix for Elementor Widget Menu Anchor - scroll error
-------------------------------------------------------------------------- */
.elementor-menu-anchor {
position: relative;
scroll-margin-top: 0.1px;
}