Current File : /home/kelaby89/cartel.express/wp-content/themes/detailx/skins/default/css/style.scss |
/* TABLE OF CONTENTS
1. Theme-specific variables and classes
2. Default tag's settings
3. Form fields settings
4. WP styles and Screen readers
5. Theme grid
6. Page layouts
7. Section's decorations
7.1 Header: Logo and Menu
7.2 Sliders
7.3 Post info (page/post title, category or tag name, author, meta, etc.)
7.4 Post Formats
7.5 Paginations
8. Single page parts
8.1 Post header
8.2 Post footer
8.3 Post author
8.4 Related posts
8.5 Comments
8.6 Page 404
8.7 Page 'No search results' and 'No archive results'
8.8 Author's page
9. Sidebars
10. Footer areas
11. Utils
12. Registration and Login popups
13. Third part plugins
-------------------------------------------------------------- */
@import "../../../css/_mixins.scss";
@import "../../../css/_theme-vars.scss";
@import "_skin-vars.scss";
/* 1. Theme-specific variables and classes
-------------------------------------------------------------- */
:root {
// Constants
--theme-var-koef_narrow: 0.75; // Narrow content width multiplier
--theme-var-menu_side: 6rem; // Width of the side menu
// Permanent values
--theme-var-rad50: calc( 50% * var(--theme-var-rad_koef) );
--theme-var-rad1em: calc( 1em * var(--theme-var-rad_koef) );
--theme-var-rad4: calc( 4px * var(--theme-var-rad_koef) );
--theme-var-rad3: calc( 3px * var(--theme-var-rad_koef) );
--theme-var-rad2: calc( 2px * var(--theme-var-rad_koef) );
// Calculations
--theme-var-page: var(--theme-var-page_width); // Page width
--theme-var-sidebar_width_max: 500px; // Max width of the sidebar.
// Dev can use var(--theme-var-sidebar_width) instead digits
// to limit a max value with a current value of the option
--theme-var-sidebar_width_min: 150px; // Min width of the sidebar
--theme-var-sidebar_gap_width_max: 100px; // Max gap between the content and sidebar
--theme-var-sidebar_gap_width_min: 0px; // Min gap between the content and sidebar
@include page_dimensions;
// JS vars
--fixed-rows-height: 0px;
}
.body_style_boxed {
--theme-var-page_boxed: calc( var(--theme-var-page_width) + var(--theme-var-page_boxed_extra) * 2 ); // Width of the whole page (boxed)
--theme-var-page: calc( var(--theme-var-page_boxed) - var(--theme-var-page_boxed_extra) * 2 ); // Page width
@include page_dimensions;
}
.accent1 { color: var(--theme-color-text_link); }
.accent2 { color: var(--theme-color-text_link2); }
.accent3 { color: var(--theme-color-text_link3); }
.accent1_bg { background-color: var(--theme-color-text_link); color: var(--theme-color-inverse_text); }
.accent2_bg { background-color: var(--theme-color-text_link2); color: var(--theme-color-inverse_text); }
.accent3_bg { background-color: var(--theme-color-text_link3); color: var(--theme-color-inverse_text); }
.alter_bg { background-color: var(--theme-color-alter_bg_color); }
.alter_text { color: var(--theme-color-alter_text); }
.alter_link { color: var(--theme-color-alter_link); }
.alter_link2 { color: var(--theme-color-alter_link2); }
.alter_link3 { color: var(--theme-color-alter_link3); }
.extra_bg { background-color: var(--theme-color-extra_bg_color); }
.extra_text { color: var(--theme-color-extra_text); }
.extra_link { color: var(--theme-color-extra_link); }
.extra_link2 { color: var(--theme-color-extra_link2); }
.extra_link3 { color: var(--theme-color-extra_link3); }
/* 2. Default tag's settings
-------------------------------------------------------------- */
html {
font-size: 18px;
}
html[style*="overflow: hidden"] {
overflow: hidden !important;
width: auto;
}
body {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
body,
body[class*="scheme_"],
.body_style_boxed .page_wrap {
background-color: var(--theme-color-bg_color);
}
[class*="scheme_"],
body[class*="scheme_"] {
color: var(--theme-color-text);
}
.stylish_paddings .body_wrap {
padding: 0 70px 70px 70px;
}
/* // old way
body.body_style_fullscreen.ua_safari:not(.sc_stack_section_present):not(.elementor-editor-active) .content_wrap_fullscreen,
body.body_style_fullscreen.ua_ios:not(.sc_stack_section_present):not(.elementor-editor-active) .content_wrap_fullscreen {
overflow: hidden; // Used to prevent the horizontal scroll bar appears on IOS.
// But this rule broke sticky effect for sections - they are jumping down when any rows become fixed
}
*/
// new way
body.body_style_fullscreen .content_wrap_fullscreen {
overflow: clip;
}
article, aside, details, footer, header, hgroup, nav, section {
display: block;
}
/* Lists */
li > p+p {
margin-top:0.5em;
}
ol, ul {
padding-left:1.5em;
}
li > ol, li > ul, li > dl, dl > dl {
margin-bottom:0 !important;
}
li > p {
margin-bottom:0;
}
ul[class*="wp-block-"] {
margin-bottom: 0;
}
ul.wp-block-archives-list,
ul.wp-block-categories-list {
padding-left:1.5em;
}
ul > li:before {
color: var(--theme-color-text_link);
}
/* Links */
a {
text-decoration:none;
background:transparent;
color: var(--theme-color-text_link);
}
a:hover {
color: var(--theme-color-text_hover);
}
.color_style_link2 a {
color: var(--theme-color-text_link2);
}
.color_style_link2 a:hover {
color: var(--theme-color-text_hover2);
}
.color_style_link3 a {
color: var(--theme-color-text_link3);
}
.color_style_link3 a:hover {
color: var(--theme-color-text_hover3);
}
.color_style_dark a {
color: var(--theme-color-text_dark);
}
.color_style_dark a:hover {
color: var(--theme-color-text_link);
}
a,
a:hover,
:focus, a:focus,
:active, a:active {
outline: 0;
}
body.show_outline :focus, body.show_outline a:focus {
outline: thin dotted !important;
}
a[href="javascript:void(0)"] {
cursor: default;
}
a img {
border: none;
}
a,
button,
input[type="button"],
input[type="submit"] {
//@include transition-colors;
@include transition-all;
}
h1 > a, h2 > a, h3 > a, h4 > a, h5 > a, h6 > a {
display:block;
}
h1, h2, h3, h4, h5, h6,
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a,
li a,
[class*="color_style_"] h1 a, [class*="color_style_"] h2 a, [class*="color_style_"] h3 a, [class*="color_style_"] h4 a, [class*="color_style_"] h5 a, [class*="color_style_"] h6 a, [class*="color_style_"] li a {
color: var(--theme-color-text_dark);
}
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover,
li a:hover {
color: var(--theme-color-text_link);
}
.color_style_link2 h1 a:hover, .color_style_link2 h2 a:hover, .color_style_link2 h3 a:hover, .color_style_link2 h4 a:hover, .color_style_link2 h5 a:hover, .color_style_link2 h6 a:hover, .color_style_link2 li a:hover {
color: var(--theme-color-text_link2);
}
.color_style_link3 h1 a:hover, .color_style_link3 h2 a:hover, .color_style_link3 h3 a:hover, .color_style_link3 h4 a:hover, .color_style_link3 h5 a:hover, .color_style_link3 h6 a:hover, .color_style_link3 li a:hover {
color: var(--theme-color-text_link3);
}
.color_style_dark h1 a:hover, .color_style_dark h2 a:hover, .color_style_dark h3 a:hover, .color_style_dark h4 a:hover, .color_style_dark h5 a:hover, .color_style_dark h6 a:hover, .color_style_dark li a:hover {
color: var(--theme-color-text_link);
}
/* Tables */
table {
border-collapse: collapse;
}
.sc_table table th,
table th {
padding: 0.8em;
}
.sc_table table td,
table td {
padding: 1em 0.8em;
}
table th+th, table th+td, table td+th, table td+td {
border-left: none;
}
table > p {
margin: 0 !important;
}
.sc_table table tr:first-child th, .sc_table table tr:first-child td {
font-weight: 600;
}
table th {
@include font(21px, '', 600, normal);
text-transform: uppercase;
text-align: center;
}
caption {
font-weight: 700;
text-align: center;
}
table td, table th + td, table td + td {
color: var(--theme-color-text);
}
table td {
font-size: 16px;
}
table th {
color: var(--theme-color-extra_dark);
background-color: var(--theme-color-extra_bg_color);
}
table th b, table th strong {
color: var(--theme-color-extra_dark);
}
table > tbody > tr:nth-child(2n+1) > td {
background-color: var(--theme-color-bg_color);
}
table > tbody > tr:nth-child(2n) > td {
background-color: var(--theme-color-alter_bg_color);
}
table th a:hover {
color: var(--theme-color-extra_dark);
}
/* Blockquotes*/
blockquote {
position:relative;
overflow: hidden;
border: none;
}
blockquote:not(.has-text-align-right):not(.has-text-align-center) {
text-align:left;
}
blockquote,
blockquote[class*="wp-block-quote"][class*="is-"],
.wp-block-quote:not(.is-large):not(.is-style-large),
.wp-block-quote.is-large:not(.is-style-plain),
.wp-block-quote.is-style-large:not(.is-style-plain),
.wp-block-freeform.block-library-rich-text__tinymce blockquote {
padding: 2.75em 2.9em;
@include border-box;
}
blockquote[class*="wp-block-quote"][class*="is-style-large"],
blockquote[class*="wp-block-quote"][class*="is-large"] {
margin: 0 0 2em 0;
}
.wp-block-pullquote.is-style-solid-color > blockquote,
.wp-block-column blockquote {
margin: 0 !important;
max-width: none !important;
}
.blog_mode_post blockquote,
.blog_mode_page blockquote {
margin: 1.8em 0;
}
.blog_mode_post .comments_list blockquote,
.blog_mode_page .comments_list blockquote {
margin: 1.5em 0;
}
blockquote:after,
q:before, q:after {
content: "";
}
blockquote, q {
quotes: "" "";
}
blockquote p {
margin: 0;
@include font(18px, 30px, 400);
}
.wp-block-pullquote.is-style-solid-color blockquote p {
line-height: 1.5;
}
blockquote.has-text-align-right,
blockquote.has-text-align-center {
> .wp-block-quote__citation,
> cite {
display: inline-block;
}
}
.wp-block-quote.is-style-large > cite {
padding-left: 0;
&:before {
display: none;
}
}
blockquote > cite, blockquote > p > cite,
blockquote > .wp-block-pullquote__citation,
.wp-block-quote .wp-block-quote__citation {
display: block;
@include font(21px, 28px, 600, normal);
letter-spacing: 0;
margin-bottom: 3px;
margin-top: 1.1em;
padding-left: 60px;
position: relative;
text-transform: uppercase;
&:before {
background-color: currentColor;
content: "";
display: block;
height: 2px;
left: 0;
margin-top: 1px;
position: absolute;
top: 50%;
width: 40px;
}
}
blockquote .block-library-pullquote__content {
margin-bottom: 2.5em;
}
.wp-block-quote.is-large .wp-block-quote__citation {
text-align: right;
font-size: inherit;
}
.wp-block-pullquote {
padding: 0;
border-width: 0;
}
.wp-block-pullquote[class*="align"] blockquote {
margin-left: 0;
margin-right: 0;
}
section,
div:not(.has-background),
figure:not(.has-background) {
& > blockquote:not(.has-background):not(.is-style-plain) {
background-color: var(--theme-color-alter_bg_color);
}
}
.wp-block-quote .wp-block-quote__citation {
color: var(--theme-color-alter_dark) !important;
}
section,
div:not(.has-text-color),
figure:not(.has-text-color) {
& > blockquote:not(.has-text-color):not(.is-style-plain) {
&,
p {
color: var(--theme-color-alter_dark) !important;
}
a {
color: var(--theme-color-text_link);
&:hover {
color: var(--theme-color-text_hover);
}
}
dt,
b,
strong,
i,
em,
mark,
ins {
color: var(--theme-color-alter_dark);
}
s,
strike,
del {
color: var(--theme-color-alter_light);
}
code {
color: var(--theme-color-text_dark);
background-color: var(--theme-color-bg_color);
border-color: var(--theme-color-bd_color);
}
&:not([class*="trx_addons_"]) > cite,
&:not([class*="trx_addons_"]) > p > cite,
&:not([class*="trx_addons_"]) > .wp-block-pullquote__citation,
&:not([class*="trx_addons_"]) .wp-block-quote__citation {
&:before {
background-color: var(--theme-color-alter_link);
}
}
}
}
[class*="type-cpt_"] [class*="_page_content"] blockquote {
margin-left: 0;
margin-right: 0;
}
/* drop-cap */
.has-drop-cap:not(:focus):first-letter {
font-weight: 600;
background-color: transparent;
color: var(--theme-color-text_dark);
font-size: 57px;
margin: 11px 14px 0 0;
text-align: left;
min-width: 55px;
}
/* Other tags */
dd {
margin-left: 1.5em;
}
dt, b, strong {
font-weight: bold;
}
dfn, em, i {
font-style: italic;
}
pre, code, kbd, tt, var, samp {
font-family: "Courier New", Courier, monospace;
font-size: 1em;
letter-spacing:0;
}
pre {
overflow: auto;
max-width: 100%;
}
code {
overflow: auto;
max-width: 100%;
padding: 0 1em;
display: inline-block;
vertical-align: middle;
word-wrap:break-word;
color: var(--theme-color-alter_text);
background-color: var(--theme-color-alter_bg_color);
border: 1px solid var(--theme-color-alter_bd_color);
}
pre > code {
display: block;
vertical-align: top;
padding: 1em;
}
code a {
color: var(--theme-color-alter_link);
}
code a:hover {
color: var(--theme-color-alter_hover);
}
abbr, acronym {
cursor: help;
}
mark, ins {
background-color:transparent;
text-decoration: none;
}
mark {
color: var(--theme-color-text_dark);
}
sup,
sub {
font-size: 75%;
height: 0;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup { bottom: 1ex; }
sub { top: .5ex; }
small { font-size: 80%; }
big { font-size: 120%; }
[hidden], template {
display: none;
}
hr {
@include content-box;
height: 0;
border: none;
border-top: 1px solid var(--theme-color-bd_color);
margin-top: 6.7857em !important;
margin-bottom: 6.7857em !important;
}
.wp-block-separator:not([class*="is-style"]) {
width: 15%;
}
/* Fontello icons */
[class^="icon-"]:before,
[class*=" icon-"]:before {
@include font(inherit, inherit !important, inherit, inherit);
display: inline-block; // Don't use vertical-align: top because meta row can be a tall when large author avatar is used;
width:auto;
margin:0;
}
/* Buttons in WP Editor */
.wp-editor-container {
border-width: 0 !important;
.quicktags-toolbar {
border: 1px solid var(--theme-color-bd_color);
&:empty {
display: none;
}
input[type="button"] {
background-color: var(--theme-color-alter_bg_color);
border-color: var(--theme-color-alter_bd_color);
color: var(--theme-color-alter_dark);
@include box-shadow( 0 1px 0 0 var(--theme-color-alter_bd_hover) );
}
input[type="button"]:hover,
input[type="button"]:focus {
background-color: var(--theme-color-alter_bg_hover);
border-color: var(--theme-color-alter_bd_hover);
color: var(--theme-color-alter_link);
}
}
}
/* Images */
img {
max-width: 100%;
height: auto; /* Only height: auto; not both! */
vertical-align:top;
}
/* Fix for WordPress 5.9+ */
/*.wp-block-gallery.has-nested-images,*/
figure.wp-block-gallery {
@include flex;
@include flex-direction(row);
@include flex-wrap(wrap);
@include flex-justify-content(flex-start);
@include flex-align-items(stretch);
}
.wp-block-gallery {
margin-top: 0;
margin-bottom: 1.2em;
.blocks-gallery-grid {
margin-top: 0;
margin-bottom: 0 !important;
}
.widget & .blocks-gallery-grid {
font-size: inherit;
padding-left: 0;
}
}
.wp-block-gallery .blocks-gallery-image figure,
.wp-block-gallery .blocks-gallery-item figure {
@include flex;
@include flex-direction(column);
@include flex-align-items(flex-start); // Old value is center
@include flex-justify-content(flex-start);
}
figure,
.wp-caption,
.wp-caption-overlay .wp-caption {
border: 0;
margin: 0;
padding: 0;
overflow: hidden;
position: relative;
max-width:100%;
@include flex;
@include flex-direction(column);
@include flex-align-items(center);
@include flex-justify-content(flex-start);
}
figure,
.wp-caption {
margin-bottom: 1em;
}
p figure,
p .wp-caption {
margin-bottom: 0;
}
figure figcaption,
.wp-block-image figcaption,
.wp-block-audio figcaption,
.wp-block-video figcaption,
.wp-block-embed figcaption,
.wp-block-gallery .blocks-gallery-image figcaption,
.wp-block-gallery .blocks-gallery-item figcaption,
.wp-block-gallery.has-nested-images figure.wp-block-image figcaption,
.wp-block-gallery:not(.has-nested-images) .blocks-gallery-item figcaption,
.blocks-gallery-grid:not(.has-nested-images) .blocks-gallery-item figcaption,
.wp-caption .wp-caption-text,
.wp-caption .wp-caption-dd,
.wp-caption-overlay .wp-caption .wp-caption-text,
.wp-caption-overlay .wp-caption .wp-caption-dd {
@include font(16px, 20px, 400, normal);
@include border-box;
background: none;
bottom: auto;
color: var(--theme-color-text);
display: block;
left: auto;
margin: 0;
max-height: 6em;
overflow-x: hidden;
overflow-y: auto;
scrollbar-gutter: stable;
padding: 14px 0 5px !important;
position: relative;
right: auto;
text-align: left;
top: auto;
@include flex-grow(0);
@include flex-basis(auto);
@include thin-scrollbar(6px);
a {
color: var(--theme-color-text_dark);
&:hover {
color: var(--theme-color-text_hover);
}
}
}
.blocks-gallery-grid figcaption,
.wp-block-gallery figcaption {
flex-grow: 0;
}
.wp-block-image .alignleft figcaption, img.alignleft figcaption,
.wp-block-image .alignright figcaption, img.alignright figcaption,
.wp-block-image .aligncenter figcaption, img.aligncenter figcaption,
.wp-block-image.is-resized figcaption {
display: block;
color: var(--theme-color-text_dark) !important;
}
.wp-block-freeform.block-library-rich-text__tinymce dd.wp-caption-dd a {
display: inline;
}
svg:not(:root) { overflow: hidden; }
/* Gallery */
.gallery {
margin: 0 -5px;
@include flex;
@include flex-direction(row);
@include flex-align-items(flex-start);
@include flex-justify-content(center);
@include flex-wrap(wrap);
}
.gallery-item {
overflow:hidden;
@include border-box;
padding: 0 5px;
}
figure.gallery-item {
@include flex-align-items(center);
}
@for $i from 9 through 1 {
.gallery-columns-#{$i} .gallery-item { width: 100% / $i !important; }
}
.gallery-item a {
display: block;
}
.gallery-item a img {
border: none;
display: block;
width: 100%;
}
.gallery-columns-9 .gallery-caption { font-size: 0.625em; line-height: 1.75em; }
.gallery-columns-8 .gallery-caption { font-size: 0.6875em; line-height: 1.75em; }
.gallery-columns-7 .gallery-caption { font-size: 0.75em; line-height: 1.75em; }
.gallery-columns-6 .gallery-caption { font-size: 0.8125em; line-height: 1.75em; }
/* Audio and Video */
audio,
canvas,
progress,
video {
display: inline-block;
vertical-align: baseline;
}
video {
width: 100%;
height: auto;
}
audio:not([controls]) {
display: none;
height: 0;
}
iframe, video, embed {
max-width: 100%;
min-height: 100px;
vertical-align: top;
}
.wp-block-embed.alignwide iframe,
.wp-block-embed.alignfull iframe {
width: 100%;
}
figure.wp-block-audio,
figure.wp-block-video,
figure.wp-block-embed {
overflow: visible;
}
figure.wp-block-audio {
display: block;
}
figure.wp-block-audio figcaption,
figure.wp-block-video figcaption,
figure.wp-block-embed figcaption {
margin: 1em 0 0 !important;
padding: 0 !important;
}
/* Embed blocks */
.wp-block-embed.wp-has-aspect-ratio {
display: block;
}
.wp-block-embed .wp-block-embed__wrapper {
position: relative;
max-width: 100%;
}
.wp-block-embed.alignwide .wp-block-embed__wrapper iframe,
.wp-block-embed.alignfull .wp-block-embed__wrapper iframe,
.wp-block-embed[class*="wp-embed-aspect-"] .wp-block-embed__wrapper iframe {
@include abs-cover;
@include box(100%, 100%);
}
.wp-block-embed.is-type-video.alignwide .wp-block-embed__wrapper:before,
.wp-block-embed.is-type-video.alignfull .wp-block-embed__wrapper:before,
.wp-block-embed.is-type-video[class*="wp-embed-aspect-"] .wp-block-embed__wrapper:before {
content: "";
display: block;
width: 0;
}
.wp-block-embed.is-type-video.alignwide .wp-block-embed__wrapper:before,
.wp-block-embed.is-type-video.alignfull .wp-block-embed__wrapper:before,
.wp-block-embed.is-type-video.wp-embed-aspect-16-9 .wp-block-embed__wrapper:before { padding-top: 56.25%; }
.wp-block-embed.is-type-video.wp-embed-aspect-21-9 .wp-block-embed__wrapper:before { padding-top: 42.85%; }
.wp-block-embed.is-type-video.wp-embed-aspect-18-9 .wp-block-embed__wrapper:before,
.wp-block-embed.is-type-video.wp-embed-aspect-2-1 .wp-block-embed__wrapper:before { padding-top: 50%; }
.wp-block-embed.is-type-video.wp-embed-aspect-4-3 .wp-block-embed__wrapper:before { padding-top: 75%; }
.wp-block-embed.is-type-video.wp-embed-aspect-1-1 .wp-block-embed__wrapper:before { padding-top: 100%; }
.wp-block-embed.is-type-video.wp-embed-aspect-3-4 .wp-block-embed__wrapper:before { padding-top: 133.33%; }
.wp-block-embed.is-type-video.wp-embed-aspect-9-16 .wp-block-embed__wrapper:before { padding-top: 177.77%; }
.wp-block-embed.is-type-video.wp-embed-aspect-9-18 .wp-block-embed__wrapper:before,
.wp-block-embed.is-type-video.wp-embed-aspect-1-2 .wp-block-embed__wrapper:before { padding-top: 200%; }
.wp-block-embed.is-type-video.wp-embed-aspect-9-21 .wp-block-embed__wrapper:before { padding-top: 233.33%; }
/* WordPress Playlist */
.wp-playlist-light {
background: none;
color: var(--theme-color-alter_dark);
.wp-playlist-current-item {
background: var(--theme-color-alter_bg_color);
}
}
.wp-playlist-light .wp-playlist-caption {
color: var(--theme-color-text_dark);
}
.wp-playlist-light .wp-playlist-playing {
background: none;
color: var(--theme-color-alter_link);
* {
color: var(--theme-color-alter_link) !important;
}
}
.wp-playlist-item {
border-color: var(--theme-color-bd_color);
}
.wp-playlist .wp-playlist-current-item img {
background-color: #fff;
}
.wp-playlist .mejs-container .mejs-controls {
background: var(--theme-color-alter_bg_color);
}
/* Cover image */
.wp-block-cover-image,
.wp-block-cover {
color: #fff;
@include border-box;
}
.wp-block-cover-image .wp-block-cover-text,
.wp-block-cover .wp-block-cover-text {
max-width: 90%;
@include border-box;
}
.wp-block-cover-image p,
.wp-block-cover p {
margin-bottom: 0 !important;
line-height: 1.5em !important;
}
.wp-block-cover-image p + p,
.wp-block-cover p + p {
margin-top: 1em !important;
}
.wp-block-cover-image a,
.wp-block-cover a {
color: inherit;
}
/* Media & Text */
.wp-block-media-text .has-medium-font-size {
line-height: 1.5em;
}
.wp-block-media-text .has-large-font-size {
line-height: 1.4em;
}
.wp-block-media-text .has-huge-font-size {
line-height: 1.3em;
}
/* Calendar */
.wp-block-calendar table th {
color: var(--theme-color-alter_dark);
background-color: var(--theme-color-alter_bg_color);
}
/* Custom font size in blocks */
.has-large-font-size,
.has-huge-font-size {
line-height: 1.4em;
}
/* Core columns */
.wp-block-columns {
@include flex-wrap(nowrap);
margin-bottom: 0;
}
.wp-block-column:nth-child(odd) { margin-right: 0; }
.wp-block-column:nth-child(even) { margin-left: 0; }
.wp-block-column:not(:first-child) { margin-left: calc( var(--theme-var-grid_gap) / 2 ); }
.wp-block-column:not(:last-child) { margin-right: calc( var(--theme-var-grid_gap) / 2 ); }
/* Kadence columns in the editor */
.kt-gutter-default > .innerblocks-wrap > .editor-inner-blocks > .editor-block-list__layout > [data-type="kadence/column"] {
margin-right: var(--theme-var-grid_gap);
}
/* Kadence columns in the frontend */
.kt-gutter-default > .wp-block-kadence-column {
margin-right: var(--theme-var-grid_gap);
}
/* CoBlocks columns in the frontend */
.has-small-gutter > [class*="wp-block-coblocks-"]:not(:first-child) {
margin-left: calc( var(--theme-var-grid_gap) / 2 );
}
.has-small-gutter > [class*="wp-block-coblocks-"]:not(:last-child) {
margin-right: calc( var(--theme-var-grid_gap) / 2 );
}
/* Groups */
.wp-block-group.has-background {
padding: 1.5em 2em;
margin-bottom: 1.5em;
}
.wp-block-group.has-background .wp-block-group__inner-container > :last-child {
margin-bottom: 0;
}
/* Alignment */
.alignleft {
display: inline-block;
vertical-align: top;
float: left;
margin-right: 1.7em !important;
margin-bottom: 1em !important;
margin-top: 0.5em !important;
}
.alignright {
display: inline-block;
vertical-align: top;
float: right;
margin-left: 1.7em !important;
margin-bottom: 1em !important;
margin-top: 0.5em !important;
}
.aligncenter {
display: block;
text-align:center;
clear: both;
margin-left: auto !important;
margin-right:auto !important;
margin-bottom: 1em !important;
}
figure.alignleft,
figure.alignright {
margin-top:0.5em !important;
}
.wp-block-gallery[class*="align"] {
@include flex;
}
.has-left-content {
text-align: left;
@include flex-justify-content(flex-start);
}
.has-center-content {
text-align: center;
@include flex-justify-content(center);
}
.has-right-content {
text-align: right;
@include flex-justify-content(flex-end);
}
/* Align left and right inside narrow content without sidebars */
.sidebar_hide.narrow_content .alignleft.is-style-alignfar,
.sidebar_hide.narrow_content .is-style-alignfar > .alignleft,
.sidebar_hide.narrow_content .alignright.is-style-alignfar,
.sidebar_hide.narrow_content .is-style-alignfar > .alignright {
max-width: calc( ( var(--theme-var-page) - var(--theme-var-content_narrow) ) / 2 - var(--theme-var-grid_gap) );
}
.sidebar_hide.narrow_content .alignleft.is-style-alignfar,
.sidebar_hide.narrow_content .is-style-alignfar > .alignleft {
float: left;
margin: 1em 1em 1em calc( ( var(--theme-var-page) - var(--theme-var-content_narrow) ) / -2 );
}
.sidebar_hide.narrow_content .alignright.is-style-alignfar,
.sidebar_hide.narrow_content .is-style-alignfar > .alignright {
float: right;
margin: 1em calc( ( var(--theme-var-page) - var(--theme-var-content_narrow) ) / -2 ) 1em 2em;
}
.sidebar_hide.narrow_content .wp-block-image > .alignleft.is-style-alignfar,
.sidebar_hide.narrow_content .wp-block-image.is-style-alignfar > .alignleft,
.sidebar_hide.narrow_content .wp-block-image > .alignright.is-style-alignfar,
.sidebar_hide.narrow_content .wp-block-image.is-style-alignfar > .alignright {
max-width: none !important;
}
/* Align left and right inside normal content without sidebars */
.sidebar_hide.normal_content .alignleft.is-style-alignfar,
.sidebar_hide.normal_content .is-style-alignfar > .alignleft {
float: left;
margin: 1em 1em 1em calc( ( var(--theme-var-page) - var(--theme-var-content) ) / -2 );
}
.sidebar_hide.normal_content .post_info_vertical_present .alignleft.is-style-alignfar,
.sidebar_hide.normal_content .post_info_vertical_present .is-style-alignfar > .alignleft {
margin-left: calc( -1 * ( 17.647% + ( var(--theme-var-page) - var(--theme-var-content) ) / 2 ) );
}
.sidebar_hide.normal_content .alignright.is-style-alignfar,
.sidebar_hide.normal_content .is-style-alignfar >.alignright {
float: right;
margin: 1em calc( ( var(--theme-var-page) - var(--theme-var-content) ) / -2 ) 1em 2em;
}
.sidebar_hide.normal_content .wp-block-image > .alignleft.is-style-alignfar,
.sidebar_hide.normal_content .wp-block-image.is-style-alignfar > .alignleft,
.sidebar_hide.normal_content .wp-block-image > .alignright.is-style-alignfar,
.sidebar_hide.normal_content .wp-block-image.is-style-alignfar > .alignright {
max-width: none !important;
}
/* Wide and Full blocks */
.alignfull > img,
.alignwide > img {
max-width: none;
width: 100%;
}
body.sidebar_hide .alignwide {
position: relative;
z-index: 1;
left: calc( -88vw / 2 + 100% / 2 );
width: 88vw;
max-width: none;
}
body.sidebar_hide.narrow_content .alignwide,
body.sidebar_hide.normal_content .alignwide {
left: calc( var(--theme-var-page) / -2 + 50% );
width: var(--theme-var-page);
}
.sidebar_hide.normal_content .post_info_vertical_present .alignwide {
left: calc( var(--theme-var-page) / -2 + 50% - 8.8235% );
}
.sidebar_hide.expand_content .post_info_vertical_present .alignwide {
left: calc( -88vw / 2 + 100% / 2 - 8.8235% );
}
body.sidebar_hide .alignfull {
position: relative;
z-index: 1;
margin-left : calc( -100vw / 2 + 100% / 2 + 8px );
margin-right : calc( -100vw / 2 + 100% / 2 + 8px );
width: calc( 100vw - 16px );
max-width : calc( 100vw - 16px );
}
.sidebar_hide:not(.narrow_content) .post_info_vertical_present .alignfull {
margin-left: calc( -100vw / 2 + 100% / 2 + 8px - 8.8235% );
}
/* 3. Form fields settings
-------------------------------------------------------------- */
/* Common rules */
form {
margin-bottom:0;
}
button, input, optgroup, select, textarea, textarea.wp-editor-area {
font-family: inherit;
font-size: 1em; /* Corrects font size not being inherited in all browsers */
margin: 0; /* Addresses margins set differently in IE6/7, F3/4, S5, Chrome */
vertical-align: baseline; /* Improves appearance and consistency in all browsers */
}
button:not(.components-button) {
overflow: visible;
}
/* Buttons */
form button:not(.components-button),
input[type="button"],
input[type="reset"],
input[type="submit"],
.theme_button,
.post_item .more-link,
.wp-block-button__link,
/* ThemeREX Addons*/
.sc_button:not(.sc_button_simple),
.sc_form button,
.sc_portfolio_preview_show .post_readmore {
@include theme_button_filled;
}
.wp-block-button__link {
white-space: normal;
}
.sidebar_small_screen_above .sidebar_control {
@include theme_button_colors;
padding: 17px 50px;
align-items: center;
vertical-align: top;
@include font(14px, 21px, 500);
text-transform: uppercase;
position: relative;
border-width: 0 !important;
text-align: center;
}
.sidebar_small_screen_above .sidebar_control:after {
content: '\e828';
font-family: $theme_icons;
display: inline-block;
@include square( 2em);
@include transition-properties(color,background-color,transform);
@include abs-rt(1em, 0.7em);
}
.sidebar_small_screen_above .sidebar.opened .sidebar_control:after {
@include rotate(180deg);
}
.sidebar_small_screen_above .sidebar_control {
color: var(--theme-color-inverse_link) !important;
background-color: var(--theme-color-text_link) !important;
&:focus,
&:hover {
color: var(--theme-color-inverse_link) !important;
background-color: var(--theme-color-text_hover) !important;
}
}
/* Square Buttons */
.wp-block-button.is-style-squared .wp-block-button__link {
@include border-radius(0);
}
/* Buttons Shadow */
.wpcf7 .wpcf7-submit {
@include box-shadow(none);
}
/* Buttons */
.sc_button_wrap {
.sc_button {
margin-bottom: 10px;
}
margin-bottom: -10px;
}
/* Buttons hover */
form button:not(.components-button):hover,
form button:not(.components-button):focus,
input[type="submit"]:hover,
input[type="submit"]:focus,
input[type="reset"]:hover,
input[type="reset"]:focus,
input[type="button"]:hover,
input[type="button"]:focus,
.post_item .more-link:hover,
.comments_wrap .form-submit input[type="submit"]:hover,
.comments_wrap .form-submit input[type="submit"]:focus,
.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
.wp-block-button:not(.is-style-outline) .wp-block-button__link:focus,
/* ThemeREX Addons */
.sc_button_default:hover,
.sc_button_default:focus,
.sc_button:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image):hover,
.sc_button:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image):focus,
.socials_share.socials_type_block .social_icon:hover,
.socials_share.socials_type_block .social_icon:focus {
@include theme_button_colors_hover;
}
/* icon */
.sc_button_icon {
font-size: 0.9em;
line-height: 1em;
}
.sc_button_decoration .sc_button_icon {
font-size: 1em;
}
.sc_button_icon_left .sc_button_icon {
margin-right: 0.55em;
}
.sc_button_icon_right .sc_button_icon {
float: none;
margin-left: 0.55em;
order: 2;
}
.sc_button_icon_top {
@include flex-direction(column);
}
.sc_button + .sc_button {
margin-left: 0;
}
.sc_button {
margin-right: 2.3em;
&:last-child {
margin-right: 0;
}
}
/* Style hover */
.sc_button_hover {
position: relative;
.sc_button_icon,
.sc_button_text {
@include transition(transform 0.3s ease-out);
will-change: transform;
}
}
.sc_button_hover:hover .sc_button_icon,
.sc_button_hover:hover .sc_button_text {
@include transform(translateX(-1.65rem));
}
.sc_button_hover:before {
content: '\e9a4';
font-family: $theme_icons;
font-size: 10px;
font-weight: 400;
margin: 0;
position: absolute;
z-index: 1;
right: 0 !important;
left: auto !important;
top: 50% !important;
@include transform(translateY(-50%));
@include transition(opacity 0.3s ease-out,right 0.3s ease-out);
background-color: transparent !important;
color: inherit !important;
opacity: 0;
will-change: right,opacity;
}
.sc_button_hover:hover:before,
.sc_button_hover.active:before {
right: 3.2em !important;
opacity: 1;
}
/* style hover small */
.sc_button_hover.sc_button_size_small:hover .sc_button_icon,
.sc_button_hover.sc_button_size_small:hover .sc_button_text {
@include transform(translateX(-1.1rem));
}
.sc_button_hover.sc_button_size_small:hover:before,
.sc_button_hover.sc_button_size_small.active:before {
right: 2.5em !important;
}
/* Disabled buttons */
button[disabled],
input[type="submit"][disabled],
input[type="button"][disabled],
a.sc_button[disabled],
a.theme_button[disabled],
button[disabled]:hover,
input[type="submit"][disabled]:hover,
input[type="button"][disabled]:hover,
a.sc_button[disabled]:hover,
a.theme_button[disabled]:hover {
@include theme_button_disabled(!important);
}
/* Small button */
.sc_button.sc_button_size_small:not(.sc_button_simple),
.theme_button.theme_button_small {
padding: 12px 40px;
font-size: 13px;
}
.sc_button.sc_button_bordered.sc_button_size_small {
padding: 10px 38px;
}
/* Large button */
.sc_button.sc_button_size_large:not(.sc_button_simple) {
font-size: 15px;
padding: 20px 56px;
}
.sc_button_bordered.sc_button.sc_button_size_large {
padding: 18px 54px;
}
/* Color Styles */
/* shadow */
.color_style_link2 .sc_button.sc_button_shadow:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image) {
@include box-shadow(0 7px 25px var(--theme-color-text_link2_02));
}
.color_style_link3 .sc_button.sc_button_shadow:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image) {
@include box-shadow(0 7px 25px var(--theme-color-text_link3_02));
}
.color_style_dark .sc_button.sc_button_shadow:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image) {
@include box-shadow(0 7px 25px var(--theme-color-text_dark_02));
}
.sc_button_default.color_style_link2,
.color_style_link2 .sc_button_default,
.sc_button.color_style_link2:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image),
.color_style_link2 .sc_button:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image) {
@include theme_button_colors_style_link2;
}
.sc_button_default.color_style_link2:hover,
.sc_button_default.color_style_link2:focus,
.color_style_link2 .sc_button_default:hover,
.color_style_link2 .sc_button_default:focus,
.sc_button.color_style_link2:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image):hover,
.sc_button.color_style_link2:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image):focus,
.color_style_link2 .sc_button:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image):hover,
.color_style_link2 .sc_button:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image):focus {
@include theme_button_colors_hover_style_link2;
}
.sc_button_default.color_style_link3,
.color_style_link3 .sc_button_default,
.sc_button.color_style_link3:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image),
.color_style_link3 .sc_button:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image) {
@include theme_button_colors_style_link3;
}
.sc_button_default.color_style_link3:hover,
.sc_button_default.color_style_link3:focus,
.color_style_link3 .sc_button_default:hover,
.color_style_link3 .sc_button_default:focus,
.sc_button.color_style_link3:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image):hover,
.sc_button.color_style_link3:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image):focus,
.color_style_link3 .sc_button:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image):hover,
.color_style_link3 .sc_button:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image):focus {
@include theme_button_colors_hover_style_link3;
}
.sc_button_default.color_style_dark,
.color_style_dark .sc_button_default,
.sc_button.color_style_dark:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image),
.color_style_dark .sc_button:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image) {
@include theme_button_colors_style_dark;
}
.sc_button_default.color_style_dark:hover,
.sc_button_default.color_style_dark:focus,
.color_style_dark .sc_button_default:hover,
.color_style_dark .sc_button_default:focus,
.sc_button.color_style_dark:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image):hover,
.sc_button.color_style_dark:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image):focus,
.color_style_dark .sc_button:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image):hover,
.color_style_dark .sc_button:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image):focus {
@include theme_button_colors_hover_style_dark;
}
.search_wrap .search_submit:before {
color: var(--theme-color-input_text);
content: '\E9B6';
font-family: $theme_icons;
padding: 1px;
}
.search_wrap .search_submit:hover:before,
.search_wrap .search_submit:focus:before {
color: var(--theme-color-input_dark);
}
/* Decoration button */
.sc_button.sc_button_decoration {
position: relative;
padding-left: 37px;
padding-right: 35px;
&.sc_button_icon_top:not(.sc_button_with_icon):not(.sc_button_with_image) {
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
}
&.sc_button_size_small {
padding-left: 33px;
padding-right: 30px;
}
&:not(.sc_button_with_icon):not(.sc_button_with_image):after {
content: '\e9a4';
font-family: $theme_icons;
font-size: 10px;
font-weight: 400;
margin-left: 50px;
}
&.sc_button_size_small:not(.sc_button_with_icon):not(.sc_button_with_image):after {
margin-left: 24px;
}
&:hover {
color:var(--theme-color-inverse_hover) !important;
border-color:var(--theme-color-text_dark) !important;
background-color:var(--theme-color-text_dark) !important;
}
&.sc_button_shadow:hover {
@include box-shadow(0 7px 25px var(--theme-color-text_dark_02) !important);
}
&.color_style_dark:hover {
color: var(--theme-color-bg_color) !important;
border-color: var(--theme-color-text_dark_blend) !important;
background-color: var(--theme-color-text_dark_blend) !important;
}
}
/* Bordered button */
.sc_button.sc_button_bordered,
.wp-block-button.is-style-outline > .wp-block-button__link {
@include theme_button_bordered;
@include box-shadow(none);
}
.sc_layouts_row_type_narrow .sc_button.sc_button_bordered,
.sc_layouts_row_type_narrow .wp-block-button.is-style-outline > .wp-block-button__link {
padding: 12px 40px;
}
.sc_button_bordered:not(.sc_button_bg_image),
.wp-block-button.is-style-outline .wp-block-button__link,
.wp-block-button.is-style-outline > .wp-block-button__link:not(.has-text-color) {
color:var(--theme-color-text_link);
border-color:var(--theme-color-text_link);
}
.sc_button_bordered:not(.sc_button_bg_image):hover,
.sc_button_bordered:not(.sc_button_bg_image):focus,
.wp-block-button.is-style-outline .wp-block-button__link:hover,
.wp-block-button.is-style-outline .wp-block-button__link:focus {
color:var(--theme-color-inverse_link) !important;
border-color:var(--theme-color-text_hover) !important;
background-color:var(--theme-color-text_hover) !important;
}
.sc_button_bordered.color_style_link2:not(.sc_button_bg_image),
.color_style_link2 .sc_button_bordered:not(.sc_button_bg_image) {
color:var(--theme-color-text_link2);
border-color:var(--theme-color-text_link2);
}
.sc_button_bordered.color_style_link2:not(.sc_button_bg_image):hover,
.sc_button_bordered.color_style_link2:not(.sc_button_bg_image):focus,
.color_style_link2 .sc_button_bordered:not(.sc_button_bg_image):hover,
.color_style_link2 .sc_button_bordered:not(.sc_button_bg_image):focus {
color:var(--theme-color-inverse_link) !important;
border-color:var(--theme-color-text_link2) !important;
background-color:var(--theme-color-text_link2) !important;
}
.sc_button_bordered.color_style_link3:not(.sc_button_bg_image),
.color_style_link3 .sc_button_bordered:not(.sc_button_bg_image) {
color:var(--theme-color-text_link3);
border-color:var(--theme-color-text_link3);
}
.sc_button_bordered.color_style_link3:not(.sc_button_bg_image):hover,
.sc_button_bordered.color_style_link3:not(.sc_button_bg_image):focus,
.color_style_link3 .sc_button_bordered:not(.sc_button_bg_image):hover,
.color_style_link3 .sc_button_bordered:not(.sc_button_bg_image):focus {
color:var(--theme-color-inverse_link) !important;
border-color:var(--theme-color-text_link3) !important;
background-color:var(--theme-color-text_link3) !important;
}
.sc_button_bordered.color_style_dark:not(.sc_button_bg_image),
.color_style_dark .sc_button_bordered:not(.sc_button_bg_image) {
color:var(--theme-color-text_dark);
border-color:var(--theme-color-text_dark);
}
.sc_button_bordered.color_style_dark:not(.sc_button_bg_image):hover,
.sc_button_bordered.color_style_dark:not(.sc_button_bg_image):focus,
.color_style_dark .sc_button_bordered:not(.sc_button_bg_image):hover,
.color_style_dark .sc_button_bordered:not(.sc_button_bg_image):focus {
color:var(--theme-color-inverse_hover) !important;
border-color:var(--theme-color-text_dark) !important;
background-color:var(--theme-color-text_dark) !important;
}
/* Button Slide */
.sc_button.sc_button_slide {
--theme-var-button_slide_color: var(--theme-color-text_link);
--theme-var-button_slide_color_hover_text: var(--theme-color-inverse_link);
background: none !important;
position: relative;
z-index: 1;
overflow: hidden;
.color_style_link2 &,
&.color_style_link2 {
--theme-var-button_slide_color: var(--theme-color-text_link2);
}
.color_style_link3 &,
&.color_style_link3 {
--theme-var-button_slide_color: var(--theme-color-text_link3);
}
.color_style_dark &,
&.color_style_dark {
--theme-var-button_slide_color: var(--theme-color-text_dark);
--theme-var-button_slide_color_hover_text: var(--theme-color-inverse_hover);
}
color: var(--theme-var-button_slide_color) !important;
> span {
position: relative;
z-index: 2;
color: currentColor;
}
&:before {
content: "";
@include border-radius(inherit);
@include abs-cover();
@include box-shadow(inset 0 0 0 2px var(--theme-var-button_slide_color));
}
&:after {
content: "";
position: absolute;
z-index: 1;
display: block;
width: 100%;
height: 120%;
top: -10%;
left: 0;
background-color: currentColor;
transform: translateX(-100%);
}
&.hovered,
&:hover {
&:after {
animation: button-slide-animation 1.2s cubic-bezier(.34,.43,.13,.96) forwards;
}
> span {
animation: button-slide-text-animation 1.2s forwards;
}
}
}
@keyframes button-slide-text-animation {
0%,
100%,
75% {
color: currentColor
}
30%,
50% {
color: var(--theme-var-button_slide_color_hover_text)
}
}
@keyframes button-slide-animation {
0% {
transform:translateX(-101%)
}
50% {
transform:translateX(0)
}
100% {
transform:translateX(101%)
}
}
/* Button Flow */
.sc_button.sc_button_flow {
position: relative;
z-index: 1;
overflow: hidden;
--theme-var-button_flow_color_text_hover: var(--theme-color-inverse_link);
--theme-var-button_flow_color: var(--theme-color-text_dark);
--theme-var-button_flow_color_hover: var(--theme-color-text_link);
.color_style_link2 &,
&.color_style_link2 {
--theme-var-button_flow_color_hover: var(--theme-color-text_link2);
}
.color_style_link3 &,
&.color_style_link3 {
--theme-var-button_flow_color_hover: var(--theme-color-text_link3);
}
.color_style_dark &,
&.color_style_dark {
--theme-var-button_flow_color_hover: var(--theme-color-text_dark_blend);
--theme-var-button_flow_color_text_hover: var(--theme-color-inverse_hover);
}
color: var(--theme-color-inverse_hover) !important;
background-color: var(--theme-var-button_flow_color_hover) !important;
> span {
position: relative;
z-index: 2;
}
&:before {
content: "";
@include border-radius(inherit);
@include abs-cover();
@include box-shadow(inset 0 100px 0 0 var(--theme-var-button_flow_color) !important);
@include transition-all(0.3s);
}
&:hover,
&:focus,
&:active {
color: var(--theme-var-button_flow_color_text_hover) !important;
&:before {
@include box-shadow(inset 0 100px 0 -100px var(--theme-var-button_flow_color) !important);
}
}
&.sc_button_shadow {
@include box-shadow(0 7px 25px var(--theme-color-text_dark_02) !important);
}
}
/* Button Veil */
.sc_button.sc_button_veil {
--theme-var-button_veil_color: var(--theme-color-text_link);
--theme-var-button_veil_color_hover_text: var(--theme-color-inverse_link);
background: none !important;
position: relative;
z-index: 1;
overflow: hidden;
.color_style_link2 &,
&.color_style_link2 {
--theme-var-button_veil_color: var(--theme-color-text_link2);
}
.color_style_link3 &,
&.color_style_link3 {
--theme-var-button_veil_color: var(--theme-color-text_link3);
}
.color_style_dark &,
&.color_style_dark {
--theme-var-button_veil_color: var(--theme-color-text_dark);
--theme-var-button_veil_color_hover_text: var(--theme-color-inverse_hover);
}
color: var(--theme-var-button_veil_color) !important;
> span {
position: relative;
z-index: 2;
}
&:before {
content: "";
@include border-radius(inherit);
@include abs-cover();
@include box-shadow(inset 0 0 0 2px var(--theme-var-button_veil_color));
}
&:after {
content: "";
position: absolute;
z-index: 1;
display: block;
width: 600px;
height: 800px;
bottom: 100%;
left: 50%;
background-color: var(--theme-var-button_veil_color);
@include border-radius(50%);
transform: translateX(-50%);
@include transition(all 0.3s ease-out);
}
&:hover,
&:focus,
&:active {
color: var(--theme-var-button_veil_color_hover_text) !important;
&:after {
bottom: -100%;
}
}
}
/* Button Curtain */
.sc_button.sc_button_curtain {
position: relative;
z-index: 1;
overflow: hidden;
--theme-var-button_curtain_color: var(--theme-color-text_link);
--theme-var-button_curtain_color_text: var(--theme-color-inverse_link);
.color_style_link2 &,
&.color_style_link2 {
--theme-var-button_curtain_color: var(--theme-color-text_link2);
}
.color_style_link3 &,
&.color_style_link3 {
--theme-var-button_curtain_color: var(--theme-color-text_link3);
}
.color_style_dark &,
&.color_style_dark {
--theme-var-button_curtain_color: var(--theme-color-text_dark);
--theme-var-button_curtain_color_text: var(--theme-color-inverse_hover);
--theme-var-button_curtain_color_text_hover: var(--theme-color-inverse_hover);
}
color: var(--theme-var-button_curtain_color_text) !important;
background-color: var(--theme-color-alter_bg_color) !important;
> span {
position: relative;
z-index: 3;
}
&:before {
content: "";
@include border-radius(inherit);
@include abs-cover(1);
@include box-shadow(inset 0 0 0 2px var(--theme-var-button_curtain_color));
}
&:after {
content: "";
@include abs-cover(2);
background-color: var(--theme-var-button_curtain_color);
@include transition(bottom 0.3s cubic-bezier(0.7, 0, 0.2, 1));
}
&:hover,
&:focus,
&:active {
color: var(--theme-var-button_curtain_color) !important;
&:after {
bottom: 100%;
}
}
}
/* Button Slant */
.sc_button.sc_button_slant {
position: relative;
z-index: 1;
overflow: hidden;
--theme-var-button_curtain_color: var(--theme-color-text_link);
--theme-var-button_curtain_color_text: var(--theme-color-inverse_link);
.color_style_link2 &,
&.color_style_link2 {
--theme-var-button_curtain_color: var(--theme-color-text_link2);
}
.color_style_link3 &,
&.color_style_link3 {
--theme-var-button_curtain_color: var(--theme-color-text_link3);
}
.color_style_dark &,
&.color_style_dark {
--theme-var-button_curtain_color: var(--theme-color-text_dark);
--theme-var-button_curtain_color_text: var(--theme-color-inverse_hover);
--theme-var-button_curtain_color_text_hover: var(--theme-color-inverse_hover);
}
color: var(--theme-var-button_curtain_color_text) !important;
background-color: var(--theme-color-alter_bg_color) !important;
> span {
position: relative;
z-index: 2;
}
&:before {
content: "";
width: 120%;
background-color: var(--theme-var-button_curtain_color);
@include abs-pos(0, 0, 0, -10%, 1);
@include transform(skew(30deg));
@include transition(transform 0.4s cubic-bezier(0.3, 1, 0.8, 1));
}
&:hover,
&:focus,
&:active {
color: var(--theme-var-button_curtain_color) !important;
&:before {
@include transform(translate3d(100%, 0, 0));
}
}
}
/* Simple button */
.sc_button.sc_button.sc_button_simple {
@include font(14px, 20px, 700, normal);
background: transparent !important;
border: none !important;
letter-spacing: 1px;
padding: 0 2.2em 2px 0;
text-transform: uppercase;
&:not(.sc_button_with_icon) .sc_button_text {
vertical-align: top;
}
&.sc_button_size_large {
font-size: 15px;
padding-bottom: 3px;
}
&.sc_button_size_small {
font-size: 13px;
&:after,
&:before {
font-size: 11px;
top: -1px;
}
}
}
.sc_button.sc_button.sc_button_simple:before,
.sc_button.sc_button.sc_button_simple:after {
content:'\e9a4';
font-family:$theme_icons;
font-style:normal;
font-size: 12px;
font-weight: 400;
top: 0;
padding-right: 1px;
@include transition(right .3s ease, opacity .3s ease);
}
.sc_button.sc_button.sc_button_simple.sc_button_with_icon {
display: inline-flex;
@include flex-align-items(center);
padding: 0;
&.sc_button_icon_right {
.sc_button_icon {
margin-left: 0.6em;
}
}
.sc_button_icon {
position: relative;
font-size: 20px;
width: 55px;
height: 55px;
line-height: 55px;
text-align: center;
@include border-radius(50%);
@include box-sizing(border-box);
border: 1px solid var(--theme-color-bd_color);
> span {
@include abs-cc();
width: 30px;
height: 30px;
line-height: 29px;
}
}
&:before,
&:after {
display: none;
}
}
/* Simple Small */
.sc_button_simple.sc_button_icon_left .sc_button_icon {
margin-right: 0.6em;
}
.sc_button_size_small.sc_button.sc_button_simple.sc_button_icon_left .sc_button_icon {
margin-right: 0;
}
.sc_button_size_small.sc_button.sc_button_simple.sc_button_icon_left .sc_button_icon + .sc_button_text {
margin-left: 0.5em;
}
.sc_button_size_small.sc_button.sc_button_simple.sc_button_icon_right .sc_button_icon {
margin-left: 0;
}
.sc_button_size_small.sc_button.sc_button_simple.sc_button_icon_right .sc_button_icon + .sc_button_text {
margin-right: 0.5em;
}
.sc_button_size_small.sc_button.sc_button.sc_button_simple.sc_button_with_icon .sc_button_icon {
font-size: 12px;
@include square(36px);
}
.sc_button.sc_button_simple:not(.sc_button_bg_image) {
color:var(--theme-color-text_link);
}
.sc_button.sc_button_simple:not(.sc_button_bg_image):hover,
.sc_button.sc_button_simple:not(.sc_button_bg_image):focus {
color:var(--theme-color-text_hover) !important;
}
.sc_button.sc_button_simple.color_style_link2:not(.sc_button_bg_image),
.color_style_link2 .sc_button.sc_button_simple:not(.sc_button_bg_image) {
color:var(--theme-color-text_link2);
}
.sc_button.sc_button_simple.color_style_link2:not(.sc_button_bg_image):hover,
.sc_button.sc_button_simple.color_style_link2:not(.sc_button_bg_image):focus,
.color_style_link2 .sc_button.sc_button_simple:not(.sc_button_bg_image):hover,
.color_style_link2 .sc_button.sc_button_simple:not(.sc_button_bg_image):focus {
color:var(--theme-color-text_hover2) !important;
}
.sc_button.sc_button_simple.color_style_link3:not(.sc_button_bg_image),
.color_style_link3 .sc_button.sc_button_simple:not(.sc_button_bg_image) {
color:var(--theme-color-text_link3);
}
.sc_button.sc_button_simple.color_style_link3:not(.sc_button_bg_image):hover,
.sc_button.sc_button_simple.color_style_link3:not(.sc_button_bg_image):focus,
.color_style_link3 .sc_button.sc_button_simple:not(.sc_button_bg_image):hover,
.color_style_link3 .sc_button.sc_button_simple:not(.sc_button_bg_image):focus {
color:var(--theme-color-text_hover3) !important;
}
.sc_button.sc_button_simple.color_style_dark:not(.sc_button_bg_image),
.color_style_dark .sc_button.sc_button_simple:not(.sc_button_bg_image) {
color:var(--theme-color-text_dark);
}
.sc_button.sc_button_simple.color_style_dark:not(.sc_button_bg_image):hover,
.sc_button.sc_button_simple.color_style_dark:not(.sc_button_bg_image):focus,
.color_style_dark .sc_button.sc_button_simple:not(.sc_button_bg_image):hover,
.color_style_dark .sc_button.sc_button_simple:not(.sc_button_bg_image):focus {
color:var(--theme-color-text_dark) !important;
}
/* Theme button */
.theme_button {
@include theme_button_colors(!important);
}
.theme_button:hover,
.theme_button:focus {
@include theme_button_colors_hover(!important);
}
.theme_button.color_style_link2,
.color_style_link2 .theme_button {
@include theme_button_colors_style_link2(!important);
}
.theme_button.color_style_link2:hover,
.theme_button.color_style_link2:focus,
.color_style_link2 .theme_button:hover,
.color_style_link2 .theme_button:focus {
@include theme_button_colors_hover_style_link2(!important);
}
.theme_button.color_style_link3,
.color_style_link3 .theme_button {
@include theme_button_colors_style_link3(!important);
}
.theme_button.color_style_link3:hover,
.theme_button.color_style_link3:focus,
.color_style_link3 .theme_button:hover,
.color_style_link3 .theme_button:focus {
@include theme_button_colors_hover_style_link3(!important);
}
.theme_button.color_style_dark,
.color_style_dark .theme_button {
@include theme_button_colors_style_dark(!important);
}
.theme_button.color_style_dark:hover,
.theme_button.color_style_dark:focus,
.color_style_dark .theme_button:hover,
.color_style_dark .theme_button:focus {
@include theme_button_colors_hover_style_dark(!important);
}
/* Buttons in sidebars */
/* Simple button */
[class*="scheme_"].sidebar .sc_button_simple:not(.sc_button_bg_image) {
color:var(--theme-color-alter_link);
}
[class*="scheme_"].sidebar .sc_button_simple:not(.sc_button_bg_image):hover,
[class*="scheme_"].sidebar .sc_button_simple:not(.sc_button_bg_image):focus {
color:var(--theme-color-alter_hover) !important;
}
/* Bordered button */
[class*="scheme_"].sidebar .sc_button_bordered:not(.sc_button_bg_image) {
color:var(--theme-color-alter_link);
border-color:var(--theme-color-alter_link);
}
[class*="scheme_"].sidebar .sc_button_bordered:not(.sc_button_bg_image):hover,
[class*="scheme_"].sidebar .sc_button_bordered:not(.sc_button_bg_image):focus {
color:var(--theme-color-alter_hover) !important;
border-color:var(--theme-color-alter_hover) !important;
}
/* All other buttons */
[class*="scheme_"].sidebar button,
[class*="scheme_"].sidebar input[type="reset"],
[class*="scheme_"].sidebar input[type="submit"],
[class*="scheme_"].sidebar input[type="button"],
/* ThemeREX Addons */
[class*="scheme_"].sidebar .sc_button_default,
[class*="scheme_"].sidebar .sc_button:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image),
[class*="scheme_"].sidebar .socials_share.socials_type_block .social_icon {
@include theme_button_colors_style_alter();
}
/* All other buttons hovered */
[class*="scheme_"].sidebar button:hover,
[class*="scheme_"].sidebar button:focus,
[class*="scheme_"].sidebar input[type="reset"]:hover,
[class*="scheme_"].sidebar input[type="reset"]:focus,
[class*="scheme_"].sidebar input[type="submit"]:hover,
[class*="scheme_"].sidebar input[type="submit"]:focus,
[class*="scheme_"].sidebar input[type="button"]:hover,
[class*="scheme_"].sidebar input[type="button"]:focus,
/* ThemeREX Addons */
[class*="scheme_"].sidebar .sc_button_default:hover,
[class*="scheme_"].sidebar .sc_button_default:focus,
[class*="scheme_"].sidebar .sc_button:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image):hover,
[class*="scheme_"].sidebar .sc_button:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image):focus,
[class*="scheme_"].sidebar .socials_share.socials_type_block .social_icon:hover,
[class*="scheme_"].sidebar .socials_share.socials_type_block .social_icon:focus {
@include theme_button_colors_hover_style_alter();
}
/* Text fields */
input[type="text"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="tel"],
input[type="password"],
input[type="search"],
select,
textarea,
textarea.wp-editor-area {
@include theme_field_template;
}
/* Text fields */
input[type="text"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="tel"],
input[type="search"],
input[type="password"],
.select2-container.select2-container--default span.select2-choice,
.select2-container.select2-container--default span.select2-selection,
.select2-container.select2-container--default .select2-selection--single .select2-selection__rendered,
.select2-container.select2-container--default .select2-selection--multiple,
textarea,
textarea.wp-editor-area
{
@include theme_field_colors;
text-overflow: ellipsis;
}
input[type="text"]:focus,
input[type="text"].filled,
input[type="number"]:focus,
input[type="number"].filled,
input[type="email"]:focus,
input[type="email"].filled,
input[type="url"]:focus,
input[type="url"].filled,
input[type="tel"]:focus,
input[type="tel"].filled,
input[type="search"]:focus,
input[type="search"].filled,
input[type="password"]:focus,
input[type="password"].filled,
.select_container:hover,
select option:hover,
select option:focus,
.select2-container.select2-container--default span.select2-selection--single:hover,
.select2-container.select2-container--default span.select2-choice:hover,
.select2-container.select2-container--default span.select2-selection--multiple:hover,
.select2-container--default.select2-container--open .select2-selection--multiple,
.select2-container--default.select2-container--open .select2-selection--single,
select.select2-hidden-accessible.filled + .select2-container.select2-container--default.select2-container--open span.select2-selection--multiple,
select.select2-hidden-accessible.filled + .select2-container.select2-container--default.select2-container--open span.select2-selection--single,
select.select2-hidden-accessible.filled + .select2-container.select2-container--default.select2-container--open span.select2-choice,
.select2-container.select2-container--focus span.select2-choice,
.select2-container.select2-container--open span.select2-choice,
.select2-container.select2-container--focus span.select2-selection--single,
.select2-container.select2-container--open span.select2-selection--single,
.select2-container.select2-container--focus span.select2-selection--multiple,
.select2-container.select2-container--open span.select2-selection--multiple,
select.select2-hidden-accessible.filled + .select2-container.select2-container--default span.select2-selection--multiple,
select.select2-hidden-accessible.filled + .select2-container.select2-container--default span.select2-selection--single,
select.select2-hidden-accessible.filled + .select2-container.select2-container--default span.select2-choice,
select.select2-hidden-accessible.filled + .select2-container.select2-container--default span.select2-selection--single .select2-selection__rendered,
textarea:focus,
textarea.filled,
textarea.wp-editor-area:focus,
textarea.wp-editor-area.filled {
@include theme_field_colors_hover;
}
textarea,
textarea.wp-editor-area {
overflow: auto; /* Removes default vertical scrollbar in IE6/7/8/9 */
vertical-align: top; /* Improves readability and alignment in all browsers */
min-height:10em;
}
textarea.wp-editor-area {
@include border-radius(0);
}
/* Text fields in widgets */
.widget input[type="text"],
.widget input[type="number"],
.widget input[type="email"],
.widget input[type="url"],
.widget input[type="tel"],
.widget input[type="password"],
.widget input[type="search"],
.widget select,
.widget textarea,
.widget textarea.wp-editor-area {
padding: 0.77em 1.2em;
}
/* Placeholders */
input[placeholder]::-webkit-input-placeholder { text-overflow:ellipsis; opacity: 1; color: var(--theme-color-input_light); @include transition-color(0.3s); }
textarea[placeholder]::-webkit-input-placeholder { text-overflow:ellipsis; opacity: 1; color: var(--theme-color-input_light); @include transition-color(0.3s); }
input[placeholder]::-moz-placeholder { text-overflow:ellipsis; opacity: 1; color: var(--theme-color-input_light); @include transition-color(0.3s); }
textarea[placeholder]::-moz-placeholder { text-overflow:ellipsis; opacity: 1; color: var(--theme-color-input_light); @include transition-color(0.3s); }
input[placeholder]:-ms-input-placeholder { text-overflow:ellipsis; opacity: 1; color: var(--theme-color-input_light); @include transition-color(0.3s); }
textarea[placeholder]:-ms-input-placeholder { text-overflow:ellipsis; opacity: 1; color: var(--theme-color-input_light); @include transition-color(0.3s); }
input[placeholder]::placeholder { text-overflow:ellipsis; opacity: 1; color: var(--theme-color-input_light); @include transition-color(0.3s); }
textarea[placeholder]::placeholder { text-overflow:ellipsis; opacity: 1; color: var(--theme-color-input_light); @include transition-color(0.3s); }
input[placeholder]:focus::-webkit-input-placeholder { opacity: 1; color: var(--theme-color-input_dark); }
textarea[placeholder]:focus::-webkit-input-placeholder { opacity: 1; color: var(--theme-color-input_dark); }
input[placeholder]:focus::-moz-placeholder { opacity: 1; color: var(--theme-color-input_dark); }
textarea[placeholder]:focus::-moz-placeholder { opacity: 1; color: var(--theme-color-input_dark); }
input[placeholder]:focus:-ms-input-placeholder { opacity: 1; color: var(--theme-color-input_dark); }
textarea[placeholder]:focus:-ms-input-placeholder { opacity: 1; color: var(--theme-color-input_dark); }
input[placeholder]:focus::placeholder { opacity: 1; color: var(--theme-color-input_dark); }
textarea[placeholder]:focus::placeholder { opacity: 1; color: var(--theme-color-input_dark); }
input[placeholder]:active::-webkit-input-placeholder { opacity: 1; color: var(--theme-color-input_dark); }
textarea[placeholder]:active::-webkit-input-placeholder { opacity: 1; color: var(--theme-color-input_dark); }
input[placeholder]:active::-moz-placeholder { opacity: 1; color: var(--theme-color-input_dark); }
textarea[placeholder]:active::-moz-placeholder { opacity: 1; color: var(--theme-color-input_dark); }
input[placeholder]:active:-ms-input-placeholder { opacity: 1; color: var(--theme-color-input_dark); }
textarea[placeholder]:active:-ms-input-placeholder { opacity: 1; color: var(--theme-color-input_dark); }
input[placeholder]:active::placeholder { opacity: 1; color: var(--theme-color-input_dark); }
textarea[placeholder]:active::placeholder { opacity: 1; color: var(--theme-color-input_dark); }
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
transition: background-color 50000s ease-in-out 90000s, color 50000s ease-in-out 90000s;
}
/* EDGE autofill */
input[type="password"].edge-autofilled,
input[type="email"].edge-autofilled,
input[type="text"].edge-autofilled {
color: var(--theme-color-input_dark) !important;
border-color: var(--theme-color-input_bd_hover) !important;
background-color: var(--theme-color-input_bg_hover) !important;
}
textarea, textarea.wp-editor-area,
select,
input[type="text"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="tel"],
input[type="search"],
input[type="password"],
input[type="checkbox"],
input[type="radio"] {
@include transition-colors;
@include border-box;
@include border-sharp;
}
option {
@include border-box;
@include border-sharp;
color: var(--theme-color-text_dark);
background-color: var(--theme-color-bg_color);
font-size: inherit;
font-weight: inherit;
}
optgroup {
font-style: normal;
> option {
font-weight: normal;
}
}
input[type="checkbox"],
input[type="radio"] {
padding: 0; /* Addresses excess padding in IE8/9 */
}
input[type="number"]::-webkit-outer-spin-button {
height: 50%;
}
input[type="number"],
input[type="search"] {
-webkit-appearance: none; /* Addresses appearance set to searchfield in S5, Chrome */
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none; /* Corrects inner padding displayed oddly in S5, Chrome on OSX */
}
button::-moz-focus-inner,
input::-moz-focus-inner { /* Corrects inner padding and border displayed oddly in FF3/4 www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/ */
border: 0;
padding: 0;
}
button[disabled],
html input[disabled] {
cursor: default !important;
}
input[type="text"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="tel"],
input[type="password"],
input[type="search"],
select,
textarea,
textarea.wp-editor-area {
-webkit-appearance: none;
outline: none;
resize: none;
}
button:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
select:focus,
textarea:focus,
textarea.wp-editor-area:focus {
outline: 0;
}
body.show_outline {
button:focus,
input:focus,
select:focus,
textarea:focus,
textarea.wp-editor-area:focus {
outline: thin dotted !important;
}
}
/* Radio buttons and checkboxes */
h3#ship-to-different-address label .input-checkbox,
input[type="radio"],
input[type="checkbox"],
.edd_price_options ul > li > label > input[type="radio"],
.edd_price_options ul > li > label > input[type="checkbox"],
.wpcf7-radio input[type="radio"],
.wpcf7-checkbox input[type="checkbox"],
.wpcf7-acceptance input[type="checkbox"] {
clip: rect(1px, 1px, 1px, 1px);
position: absolute !important;
margin:0 !important;
padding:0 !important;
}
label > input[type="radio"],
label > input[type="checkbox"],
input[type="checkbox"].wpcf7-acceptance {
display: inline-block;
vertical-align:baseline;
position: static !important;
clip: auto;
}
.wpcf7-radio .wpcf7-list-item-label,
.wpcf7-checkbox .wpcf7-list-item-label {
cursor: pointer;
}
.edd_price_options ul > li > label > input[type="radio"] + span,
.edd_price_options ul > li > label > input[type="checkbox"] + span {
display: inline-block;
vertical-align:baseline;
}
h3#ship-to-different-address label > span,
input[type="radio"] + label,
input[type="checkbox"] + label,
input[type="radio"]+.wpcf7-list-item-label,
input[type="checkbox"]+.wpcf7-list-item-label,
.edd_price_options ul > li > label > input[type="radio"] + span,
.edd_price_options ul > li > label > input[type="checkbox"] + span {
position:relative;
font-size: 14px;
padding-left:1.8em;
line-height: 22px;
display: inline-block;
vertical-align: top;
a {
color: inherit;
border-bottom: 1px solid var(--theme-color-text);
line-height: 1em;
display: inline-block;
@include transition-all(0.3s);
&:hover {
color: var(--theme-color-text_dark);
border-color: var(--theme-color-text_dark);
}
}
[class*="scheme_"].footer_wrap & a:hover {
color: var(--theme-color-text_dark);
border-color: var(--theme-color-text_dark);
}
}
.wpcf7-list-item-label.wpcf7-list-item-right {
position:relative;
padding-right:1.4em;
display: inline-block;
vertical-align: top;
}
h3#ship-to-different-address label > span:before,
input[type="radio"] + label:before,
input[type="checkbox"] + label:before,
input[type="radio"]+.wpcf7-list-item-label:before,
input[type="checkbox"]+.wpcf7-list-item-label:before,
.wpcf7-list-item-label.wpcf7-list-item-right:before,
.edd_price_options ul > li > label > input[type="radio"] + span:before,
.edd_price_options ul > li > label > input[type="checkbox"] + span:before {
content:' ';
font-family: $theme_icons;
font-size: 7px;
font-weight: 400;
letter-spacing: -0.2px;
display:block;
text-align:center;
border: 1px solid var(--theme-color-bd_color);
@include box(16px, 16px, 15px);
@include abs-lt(0, 0.45em);
@include border-box;
@include border-radius(4px);
color: var(--theme-color-text_dark);
cursor: pointer;
@include transition-all(0.3s);
}
.payment_methods input[type="radio"] + label:before {
top: 0.45em;
}
input[type="radio"] + label,
input[type="checkbox"] + label,
input[type="radio"]+.wpcf7-list-item-label,
input[type="checkbox"]+.wpcf7-list-item-label,
.wpcf7-list-item-label.wpcf7-list-item-right,
.edd_price_options ul > li > label > input[type="radio"] + span,
.edd_price_options ul > li > label > input[type="checkbox"] + span {
&:hover:before {
border-color: var(--theme-color-text_dark);
}
}
body.show_outline {
input[type="radio"]:focus + label:before,
input[type="checkbox"]:focus + label:before,
input[type="radio"]:focus + .wpcf7-list-item-label:before,
input[type="checkbox"]:focus + .wpcf7-list-item-label:before,
//.wpcf7-list-item-label.wpcf7-list-item-right:before,
.edd_price_options ul > li > label > input[type="radio"]:focus + span:before,
.edd_price_options ul > li > label > input[type="checkbox"]:focus + span:before {
outline: 0 !important;
box-shadow: 0 0 0 1px #000;
}
}
.wpcf7-list-item-label.wpcf7-list-item-right:before {
left: auto;
right: 0;
}
h3#ship-to-different-address label input[type="checkbox"]:checked + span:before,
input[type="checkbox"]:checked + label:before,
input[type="checkbox"]:checked+.wpcf7-list-item-label:before,
.wpcf7-checkbox .wpcf7-list-item-checked.wpcf7-list-item-right:before,
.edd_price_options ul > li > label > input[type="checkbox"]:checked + span:before {
content:'\e9f6';
}
input[type="radio"]:checked + label:before,
input[type="radio"]:checked+.wpcf7-list-item-label:before,
.wpcf7-radio .wpcf7-list-item-checked.wpcf7-list-item-right:before,
.edd_price_options ul > li > label > input[type="radio"]:checked + span:before {
content:'\e9f6';
}
input[type="radio"] + label:before,
input[type="checkbox"] + label:before,
.wpcf7-list-item-label.wpcf7-list-item-right:before {
border-color: var(--theme-color-input_bd_color) !important;
}
input[type="radio"] + label:hover:before,
input[type="checkbox"] + label:hover:before,
.wpcf7-list-item-label.wpcf7-list-item-right:hover:before {
border-color: var(--theme-color-text_dark) !important;
}
/* Select container (dropdown) */
select {
text-overflow:ellipsis;
white-space:nowrap;
}
select::-ms-expand {
display: none;
}
/* Hide all select fields while page loading */
select:not(.esg-sorting-select):not([class*="trx_addons_attrib_"]) {
visibility:hidden;
}
/* Show all select fields when they inside an our wrapper */
.select_container select:not(.esg-sorting-select):not([class*="trx_addons_attrib_"]) {
visibility:visible;
}
/* Our wrapper to decorate select fields */
.select_container {
width:100%;
position:relative;
}
.select_container,
.select_container:after,
.select_container select {
@include transition-all;
}
.select_container:before {
content:' ';
display:block;
@include abs-pos(2px, 2px, 2px, auto);
width: 3em;
z-index:1;
pointer-events: none;
cursor:pointer;
@include border-radius(0);
color: var(--theme-color-input_text);
background-color: var(--theme-color-input_bg_color);
}
.select_container:focus:before,
.select_container:hover:before {
color: var(--theme-color-input_dark);
background-color: var(--theme-color-input_bg_hover);
}
.sc_input_hover_accent .select_container:before {
right:2px;
top:2px;
bottom: 2px;
@include border-sharp;
}
.select_container:after {
content:'\e828';
font-family: $theme_icons;
display:block;
@include abs-rt(0, 50%, 2);
@include square(1em);
margin-top:-0.5em;
pointer-events: none;
cursor:pointer;
color: var(--theme-color-input_text);
}
.select_container:focus:after,
.select_container:hover:after {
color: var(--theme-color-input_dark);
}
.select_container select {
width: 100% !important;
max-width: none !important;
padding-right: 3em !important;
@include border-box;
color: var(--theme-color-input_text);
background: var(--theme-color-input_bg_color) !important;
border-color: var(--theme-color-input_bd_color);
}
.select_container select:focus {
color: var(--theme-color-input_dark);
background-color: var(--theme-color-input_bg_hover) !important;
}
.widget .select_container select {
padding-right: 2em !important;
padding-left: 0;
padding-top:0.75em;
padding-bottom:0.75em;
}
.widget .select_container:before {
width: 2em;
}
.widget .select_container:after {
right: 0;
}
/* Select2 - Advanced select with search */
.select2-container {
width: 100% !important;
}
.select2-container.select2-container--default span.select2-choice,
.select2-container.select2-container--default span.select2-selection {
height: auto;
border: none;
border-bottom: 1px solid var(--theme-color-input_bd_color);
padding: 0;
@include border-sharp;
@include transition-all(0.3s);
}
.select2-container .select2-selection--single .select2-selection__rendered {
padding-left: 0;
font-weight: inherit;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder {
display: inline-block;
}
.select2-container--default .select2-selection--single span.select2-selection__rendered {
color: inherit;
line-height: 2.7em;
padding-top: 0;
padding-bottom: 0;
@include transition-all(0.3s);
}
.select2-selection .select2-selection__arrow {
position: relative;
text-align: right;
b {
display: none !important;
}
&:before {
content: '\e942';
font-family: $theme_icons;
}
}
.select2-container.select2-container--default .select2-selection .select2-selection__arrow {
top: 50%;
@include box(20px, 20px);
@include translateY;
}
.select2-drop-active {
border: none;
}
.select2-dropdown {
border: 1px solid var(--theme-color-input_bd_color) !important;
@include border-radius(0 !important);
}
.select2-search {
padding: 8px;
}
.select2-dropdown,
.select2-container.select2-container--focus span.select2-selection,
.select2-container.select2-container--open span.select2-selection {
color: var(--theme-color-text_dark);
border-color: var(--theme-color-input_bd_color);
background: var(--theme-color-bg_color);
}
.select2-container .select2-results__option {
color: var(--theme-color-input_dark);
background: var(--theme-color-input_bg_hover);
}
.select2-dropdown .select2-highlighted,
.select2-container .select2-results__option--highlighted[aria-selected] {
color: var(--theme-color-inverse_link);
background: var(--theme-color-text_link);
}
.select2-container--default .select2-results__option[aria-selected="true"] {
color: var(--theme-color-alter_dark);
background-color: var(--theme-color-alter_bg_color);
}
.select2-container--default .select2-results__option[data-selected="true"] {
color: var(--theme-color-inverse_link);
background-color: var(--theme-color-text_link);
}
.select2-container--default .select2-search--dropdown .select2-search__field {
border-color: var(--theme-color-input_bd_color);
&:focus {
border-color: var(--theme-color-input_bd_hover);
}
}
/* Required fields */
label.required:after {
content:'*';
display: none;
vertical-align:text-top;
font-size:80%;
color:#da6f5b;
}
/* 4. WP styles and Screen readers
-------------------------------------------------------------- */
.screen-reader-text {
clip: rect(1px, 1px, 1px, 1px);
position: absolute !important;
margin:0 !important;
padding:0 !important;
}
.screen-reader-text:hover,
.screen-reader-text:active,
.screen-reader-text:focus {
display: block;
top: 5px;
left: 5px;
@include box(auto, auto);
@include font(0.8em, normal);
padding: 1em 1.5em;
color: #21759b;
background-color: #f1f1f1;
border-radius: 3px;
clip: auto !important;
text-decoration: none;
/* Above WP toolbar */
z-index: 100000;
@include box-shadow(0 0 2px 2px rgba(0, 0, 0, 0.6));
}
.detailx_skip_link {
@include abs-lt(6px, 6px, 999999);
@include translateY(-400px);
@include transition-property(transform);
}
.detailx_skip_link:focus {
@include translateY(0);
outline-offset: -1px;
display: block;
@include box(auto, auto);
font-size: 1em;
font-weight: 400;
padding: 1em 1.5em;
background: #f1f1f1;
color: #0073aa;
line-height: normal;
box-shadow: 0 0 2px 2px rgba(0,0,0,.6);
}
a.detailx_skip_link_anchor {
position: absolute;
@include box(0,0);
}
/* 5. Theme grid
-------------------------------------------------------------- */
.container, .container-fluid {
margin-right: auto;
margin-left: auto;
padding-left: calc( var(--theme-var-grid_gap) / 2 );
padding-right: calc( var(--theme-var-grid_gap) / 2 );
}
.row, .columns_wrap {
margin-left: 0;
margin-right: calc( -1 * var(--theme-var-grid_gap) );
}
.row > [class*="column-"],
.columns_wrap > [class*="column-"] {
display:inline-block;
vertical-align:top;
position: relative;
z-index: 20;
min-height: 1px;
padding-left: 0;
padding-right: var(--theme-var-grid_gap);
@include border-box;
}
.row.columns_padding_left, .columns_wrap.columns_padding_left, .vc_row.columns_padding_left {
margin-left: calc( -1 * var(--theme-var-grid_gap) );
margin-right: 0;
}
.vc_row.columns_padding_left .vc_column_container > .vc_column-inner,
.row.columns_padding_left > [class*="column-"], .columns_wrap.columns_padding_left > [class*="column-"],
.row > [class*="column-"].columns_padding_left, .columns_wrap > [class*="column-"].columns_padding_left {
padding-left:var(--theme-var-grid_gap);
padding-right:0;
}
.vc_row.columns_padding_right,
.row.columns_padding_right,
.columns_wrap.columns_padding_right {
margin-left: 0;
margin-right: calc( -1 * var(--theme-var-grid_gap) );
}
.vc_row.columns_padding_right .vc_column_container > .vc_column-inner,
.row.columns_padding_right > [class*="column-"], .columns_wrap.columns_padding_right > [class*="column-"],
.row > [class*="column-"].columns_padding_right, .columns_wrap > [class*="column-"].columns_padding_right {
padding-left:0;
padding-right:var(--theme-var-grid_gap);
}
.vc_row,
.row.columns_padding_center,
.columns_wrap.columns_padding_center {
margin-left: calc( -1 * var(--theme-var-grid_gap) / 2 );
margin-right: calc( -1 * var(--theme-var-grid_gap) / 2 );
}
.vc_column_container > .vc_column-inner,
.row.columns_padding_center > [class*="column-"], .columns_wrap.columns_padding_center > [class*="column-"],
.row > [class*="column-"].columns_padding_center, .columns_wrap > [class*="column-"].columns_padding_center {
padding-left:calc( var(--theme-var-grid_gap) / 2 );
padding-right:calc( var(--theme-var-grid_gap) / 2 );
}
.row.columns_padding_bottom > [class*="column-"], .columns_wrap.columns_padding_bottom > [class*="column-"],
.row > [class*="column-"].columns_padding_bottom, .columns_wrap > [class*="column-"].columns_padding_bottom {
padding-bottom: var(--theme-var-grid_gap);
}
.row.columns_padding_bottom.columns_in_single_row > [class*="column-"],
.columns_wrap.columns_padding_bottom.columns_in_single_row > [class*="column-"] {
padding-bottom: 0;
}
.sc_blogger.no_margin .row, .sc_blogger.no_margin .columns_wrap,
.row.no_margin, .columns_wrap.no_margin {
margin-left: 0 !important;
margin-right: 0 !important;
}
.sc_blogger.no_margin .row > [class*="column-"], .sc_blogger.no_margin .columns_wrap > [class*="column-"],
.row.no_margin > [class*="column-"], .columns_wrap.no_margin > [class*="column-"] {
padding: 0 !important;
}
/* Columns, push, pull and offset sizes */
@for $i from 1 through 12 {
@for $j from $i through 12 {
$s: 100% / $j * $i;
@if $j == 1 {
.column-#{$i},
.column-#{$i}_#{$j} { width: $s; }
} @else {
.column-#{$i}_#{$j} { width: $s; }
@if ($i < $j) {
.push-#{$i}_#{$j} { left: $s }
.pull-#{$i}_#{$j} { right: $s; }
.offset-#{$i}_#{$j} { margin-left: $s; }
}
}
}
}
/* Utils */
.clearfix:after,
.container:after,
.container-fluid:after,
.row:after {
content: " ";
@include clear;
}
.center-block {
display: block;
margin-left: auto;
margin-right: auto;
}
.pull-right {
float: right !important;
}
.pull-left {
float: left !important;
}
.affix {
position: fixed;
@include translate3d(0, 0, 0);
}
.visible {
visibility: visible;
}
.invisible {
visibility: hidden;
}
.show {
display: block !important;
}
.hide {
display: none !important;
}
.hidden {
display: none !important;
visibility: hidden !important;
}
.text-hide {
@include font(0, 0);
color: transparent;
text-shadow: none;
background-color: transparent;
border: 0;
}
.vertical-centered {
overflow:hidden;
}
.vertical-centered:before {
content:' ';
@include box(0, 100%);
margin-left:-0.3em;
}
.vertical-centered:before,
.vertical-centered > * {
display: inline-block;
vertical-align:middle;
}
.detailx_loading,
.trx_addons_loading {
background-image:url(../../../images/preloader.png) !important;
background-position:center !important;
background-repeat:no-repeat !important;
}
.theme_button_close,
.trx_addons_button_close,
.review-form a.close,
#cancel-comment-reply-link {
display:block;
cursor:pointer;
@include square(3rem);
@include abs-rt;
margin: 0 !important;
}
.sc_layouts_panel_close.trx_addons_button_close {
width: 47px;
height: 47px;
line-height: 47px;
@include border-radius(50%);
background-color: var(--theme-color-alter_bg_hover);
color: var(--theme-color-alter_dark);
right: 50px;
top: 48px;
font-size: 16px;
}
.sc_layouts_panel_left {
.sc_layouts_panel_close.trx_addons_button_close {
right: auto;
left: 50px;
}
}
.review-form a.close,
#cancel-comment-reply-link,
.sc_layouts_cart_widget_close {
@include square(2rem);
font-size: 16px;
}
.mfp-close-icon {
width: 100% !important;
}
.mfp-close-icon,
.review-form a.close,
#cancel-comment-reply-link {
text-indent: -300px;
overflow: hidden !important;
@include transition-property(transform);
@include transform-origin(center center);
will-change: transform;
@include transform(translate(-50%, -50%) rotate(0deg));
}
#cancel-comment-reply-link {
top: 0.9rem;
right: -1.2rem;
width: 2rem;
height: 2rem;
line-height: 2rem;
}
.mfp-close-icon,
.theme_button_close_icon,
.trx_addons_button_close_icon {
@include border-box;
@include rotate(0);
position: absolute;
z-index: 1;
top: 50% !important;
left: 50% !important;
@include transform(translate(-50%, -50%) rotate(0deg));
transform-origin: center center;
width: auto;
height: auto;
font-size: 15px;
}
.theme_button_close_icon:after,
.trx_addons_button_close_icon:after,
.mfp-close-icon:after,
.review-form a.close:after,
#cancel-comment-reply-link:after {
display: none;
}
.mfp-close-icon:before,
.theme_button_close_icon:before,
.trx_addons_button_close_icon:before,
.mfp-close-icon:before,
.review-form a.close:before,
#cancel-comment-reply-link:before {
position: relative;
top:0;
left: 0;
content:'\e9e1';
font-family:$theme_icons;
line-height: 1;
text-align: center;
border: none;
}
.mfp-close-icon:before,
.review-form a.close:before,
#cancel-comment-reply-link:before {
position: absolute;
right: 0;
text-indent: 0;
line-height: inherit;
}
.theme_button_close:hover .theme_button_close_icon,
.trx_addons_button_close:hover .trx_addons_button_close_icon,
.mfp-close:hover .mfp-close-icon,
.review-form a.close:hover,
#cancel-comment-reply-link:hover {
@include transform(translate(-50%, -50%) rotate(180deg));
}
/* Mfp Wrap */
.mfp-close-icon {
font-size: 23px;
}
.mfp-wrap .mfp-close {
margin: -50px -50px 0 0;
}
/* 6. Page layouts
-------------------------------------------------------------- */
.page_wrap {
min-height:100vh;
@include border-box;
}
.page_wrap,
.content_wrap {
margin:0 auto;
}
.body_style_boxed {
background-color:#f0f0f0;
background-attachment: fixed;
@include bg-cover(center top);
}
.body_style_boxed .page_wrap {
width: var(--theme-var-page_boxed);
max-width: 100%;
}
.page_content_wrap {
padding-top: 7.1rem;
padding-bottom: 7.4rem;
}
.remove_margins .page_content_wrap {
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.content_wrap,
.content_container {
width: var(--theme-var-page);
max-width: 100%;
margin:0 auto;
}
.content_wrap .content_wrap,
.content_wrap .content_container,
.content_container .content_wrap,
.content_container .content_container {
width:100%;
}
.content_wrap:after,
.content_container:after {
content:" ";
@include clear;
}
.body_style_fullwide .content_wrap {
max-width: var(--theme-var-page_fullwide_max); // To prevent stretching content on the extra wide screen
margin: 0 auto;
width: 100% !important;
padding-left: var(--theme-var-page_fullwide_extra);
padding-right: var(--theme-var-page_fullwide_extra);
@include border-box;
}
.content, .sidebar, .sidebar_inner {
@include border-box;
}
.page_content_wrap .content_wrap,
.page_content_wrap .content_wrap_fullscreen {
position:relative;
}
#page_preloader,
.page_content_wrap,
.custom-background .content_wrap > .content,
.background_banner_wrap ~ .content_wrap > .content {
background-color: var(--theme-color-bg_color);
}
.preloader_wrap > div {
background-color: var(--theme-color-text_link);
}
/* Content and Sidebar */
body.body_style_wide:not(.expand_content) [class*="content_wrap"] > .content,
body.body_style_boxed:not(.expand_content) [class*="content_wrap"] > .content { width: var(--theme-var-content); }
[class*="content_wrap"] > .sidebar { width: var(--theme-var-sidebar); }
.sidebar_hide [class*="content_wrap"] > .content { margin-left: auto; margin-right: auto; }
.sidebar_right [class*="content_wrap"] > .content { float: left; }
.sidebar_right [class*="content_wrap"] > .sidebar { float: right; }
.sidebar_left [class*="content_wrap"] > .content { float: right; }
.sidebar_left [class*="content_wrap"] > .sidebar { float: left; }
/* Fullwide or Fullscreen with sidebar */
.body_style_fullwide [class*="content_wrap"] > .content,
.body_style_fullscreen [class*="content_wrap"] > .content { width: 100%; }
.body_style_fullwide.sidebar_right [class*="content_wrap"] > .content,
.body_style_fullscreen.sidebar_right [class*="content_wrap"] > .content { padding-right: var(--theme-var-sidebar_and_gap); }
.body_style_fullwide.sidebar_right [class*="content_wrap"] > .sidebar,
.body_style_fullscreen.sidebar_right [class*="content_wrap"] > .sidebar { margin-left: calc( -1 * var(--theme-var-sidebar) ); }
.body_style_fullwide.sidebar_left [class*="content_wrap"] > .content,
.body_style_fullscreen.sidebar_left [class*="content_wrap"] > .content { padding-left: var(--theme-var-sidebar_and_gap); }
.body_style_fullwide.sidebar_left [class*="content_wrap"] > .sidebar,
.body_style_fullscreen.sidebar_left [class*="content_wrap"] > .sidebar { margin-right: calc( -1 * var(--theme-var-sidebar) ); }
.body_style_fullscreen .page_content_wrap {
padding:0;
position:relative; /* Need to correct 'sticky' sidebar position */
}
/* Boxed style for articles and sidebar */
.body_style_fullscreen [class*="content_wrap"] > .content > article.page {
padding:0;
}
/* Sticky sidebar */
.fixed_blocks_sticky .sidebar {
@include sticky-top(var(--fixed-rows-height));
@include transition(top ease-in-out 0.3s);
}
.sidebar_fixed_placeholder {
min-height: 1px;
}
/* Sidebar control to show/hide sidebar on mobile devices */
.sidebar_control {
display: none;
color: var(--theme-color-alter_dark) !important;
background-color: var(--theme-color-alter_bg_color);
border-color: var(--theme-color-alter_bd_color);
}
.sidebar_control:hover {
color: var(--theme-color-alter_link) !important;
background-color: var(--theme-color-alter_bg_color);
border-color: var(--theme-color-alter_bd_hover);
}
.sidebar .sidebar_control,
.sidebar .sidebar_control:after {
@include border-radius(0);
}
/* Float Sidebar */
@media #{$media_md} {
.sidebar_custom.sidebar_float,
.sidebar_default.sidebar_float:not([class*="scheme_"]) {
@include box-shadow(10px 10px 10px rgba(0,0,0, 0.05));
.sidebar_small_screen_float.sidebar_left & { @include translateX(calc(-100% - 20px)); }
.sidebar_small_screen_float.sidebar_right & { @include translateX(calc(100% + 20px)); }
.sidebar_small_screen_float.sidebar_show &.opened { @include translateX(0); }
.sidebar_inner {
background-color: var(--theme-color-bg_color);
padding: 20px;
}
}
}
/* Banners */
[class*="_banner_wrap"]:not(.background_banner_wrap) {
background-color: var(--theme-color-alter_bg_color);
}
.banner_wrap_title,
.sidebar .banner_wrap_title {
color: var(--theme-color-alter_light);
}
.widget_banner:not(.widget_fullwidth) {
.image_wrap {
padding: 15px;
background-color: var(--theme-color-alter_bg_hover);
@include box-sizing(border-box);
text-align: center;
}
}
/* Fullheight sections */
.detailx-full-height {
min-height: calc( 100vh - var(--fixed-rows-height) );
}
/* 7. Section's decorations
=============================================================== */
/* 7.1 Header
-------------------------------------------------------------- */
/* Top panel */
.top_panel {
position:relative;
z-index:8000; // Essential grid lightbox use 8010
padding: 0.02px 0; // Incapsulate margins inside the block without 'overflow: hidden'. Min value is 0.01 for Firefox, 0.02 for Chrome
@include bg-cover;
}
.top_panel,
[class*="scheme_"].top_panel,
[class*="scheme_"].footer_wrap {
color: var(--theme-color-text);
background-color: var(--theme-color-bg_color);
}
.top_panel .row > [class*="column-"],
.top_panel .columns_wrap > [class*="column-"] {
vertical-align:middle;
}
.top_panel.with_bg_image:before {
content: ' ';
@include bg-mask(#000, 0.7, -1);
}
[class*="scheme_"].top_panel.with_bg_image:before {
background-color: var(--theme-color-bg_color_07);
}
[class*="scheme_"].top_panel .slider_engine_revo .slide_subtitle,
.top_panel .slider_engine_revo .slide_subtitle {
color: var(--theme-color-text_link);
}
.top_panel_default .top_panel_navi,
[class*="scheme_"].top_panel_default .top_panel_navi {
background-color: var(--theme-color-bg_color);
}
.top_panel_default .top_panel_title,
[class*="scheme_"].top_panel_default .top_panel_title {
background-color: var(--theme-color-alter_bg_color);
}
.top_panel_default {
.sc_layouts_row_type_normal {
padding: 4em 0 5.3em;
}
.sc_layouts_row_type_compact {
padding: 0.8em 0;
}
&.with_bg_image .sc_layouts_row:not(.sc_layouts_row_fixed_on) {
background-color: transparent;
}
}
/* Background video in the header */
#background_video {
object-fit: cover;
overflow:hidden;
@include abs-cc(-1 !important);
@include box(100%, 100%);
}
div#background_video {
position: absolute !important;
}
div#background_video:after {
content: ' ';
@include abs-lt(0, 0, 2);
@include box(100%, 100%);
background-color:rgba(255, 255, 255, 0.3);
}
div#background_video iframe,
div#background_video video {
@include abs-cc(1, !important);
max-width: none;
}
#tubular-container {
display:none;
}
.top_panel.with_bg_video {
background: #000;
}
/* Header positions */
.header_position_over .page_wrap {
position:relative;
}
.header_position_over .top_panel {
@include abs-lt(0, 0, 8000);
width: 100%;
background: rgba(0,0,0,0) !important;
.sc_layouts_row[class*="scheme_"] {
@include transition-property(background-color);
}
}
.header_position_over:not(.trx_addons_page_scrolled) .top_panel .sc_layouts_row[class*="scheme_"],
.header_position_over .top_panel .sc_layouts_row[class*="scheme_"]:not(.sc_layouts_row_fixed_on) {
background-color:transparent;
}
@media #{$media_not_mobile} {
// 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;
}
&.fixed_blocks_sticky .sc_stack_section_effect_slide:not(.elementor-element-edit-mode) {
top: 0;
}
&.admin-bar.fixed_blocks_sticky {
.elementor-section-height-full.sc_stack_section_on {
height: calc(100vh - 32px);
}
.sc_stack_section_effect_slide:not(.elementor-element-edit-mode) {
top: 32px;
}
}
}
}
.header_position_under .top_panel {
position:relative;
z-index:2;
@include border-box;
}
.header_position_under .top_panel_mask {
display:none;
background-color:#000;
opacity: 0;
pointer-events: none;
@include abs-cover(9999);
}
.header_position_under .page_content_wrap {
position:relative;
z-index:4;
}
.header_position_under .footer_wrap {
position:relative;
z-index:3;
}
.header_position_under .page_wrap {
padding-bottom: 0.1px; /* Fix for Chrome and Safari to allow margin-bottom in the .page_content_wrap when footer is fixed */
}
/* Default header layouts
---------------------------------------------- */
/* Main menu in the default header */
.top_panel_default .sc_layouts_menu_nav > li.menu-item-has-children > a:after {
content: '\e828';
font-family: $theme_icons;
}
.top_panel_default .sc_layouts_menu_nav li li.menu-item-has-children > a:after {
content: '\e836';
font-family: $theme_icons;
}
.top_panel_default .sc_layouts_menu_mobile_button .sc_layouts_item_icon:before {
content: '\e8ba';
font-family: $theme_icons;
}
/* Mobile Button */
.sc_layouts_menu_mobile_button,
.sc_layouts_menu_mobile_button_burger {
.sc_layouts_item_icon {
color: var(--theme-color-text_dark);
font-size: 16px;
&:before {
font-family: $theme_icons;
content: '\e9d7';
}
}
}
/* Custom layouts
--------------------------------- */
[class*="scheme_"].sc_layouts_row {
color: var(--theme-color-text);
background-color: var(--theme-color-bg_color);
}
.sc_layouts_row_delimiter,
[class*="scheme_"].sc_layouts_row_delimiter {
border-color: var(--theme-color-bd_color);
}
.footer_wrap [class*="scheme_"].vc_row .sc_layouts_row_delimiter,
.footer_wrap [class*="scheme_"].sc_layouts_row_delimiter,
[class*="scheme_"].footer_wrap .sc_layouts_row_delimiter {
border-color: var(--theme-color-alter_bd_color);
}
.sc_layouts_item_icon {
color: var(--theme-color-text_light);
}
.sc_layouts_item_details_line1 {
color: var(--theme-color-text_link);
}
.sc_layouts_item_details_line2 {
color: var(--theme-color-text_dark);
}
span.trx_addons_login_menu,
span.trx_addons_login_menu:after {
color: var(--theme-color-alter_text);
background-color: var(--theme-color-alter_bg_color);
border-color: var(--theme-color-alter_bd_color);
}
span.trx_addons_login_menu .trx_addons_login_menu_delimiter {
border-color: var(--theme-color-alter_bd_color);
}
span.trx_addons_login_menu .trx_addons_login_menu_item {
color: var(--theme-color-alter_text);
}
span.trx_addons_login_menu .trx_addons_login_menu_item:hover,
span.trx_addons_login_menu .trx_addons_login_menu_item:focus {
color: var(--theme-color-alter_dark);
background-color: var(--theme-color-alter_bg_hover);
}
.sc_layouts_row_fixed_on {
background-color: var(--theme-color-bg_color);
}
/* Row type: Narrow */
.sc_layouts_row.sc_layouts_row_type_narrow,
[class*="scheme_"].sc_layouts_row.sc_layouts_row_type_narrow {
color: var(--theme-color-alter_text);
background-color: var(--theme-color-alter_bg_color);
}
.sc_layouts_row_type_narrow .sc_layouts_item,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_layouts_item {
color: var(--theme-color-alter_text);
}
.sc_layouts_row_type_narrow .sc_layouts_item a:not(.sc_button):not([class*="button"]),
[class*="scheme_"].sc_layouts_row_type_narrow .sc_layouts_item a:not(.sc_button):not([class*="button"]) {
color: var(--theme-color-alter_text);
}
.sc_layouts_row_type_narrow .sc_layouts_item a:not(.sc_button):not([class*="button"]):hover,
.sc_layouts_row_type_narrow .sc_layouts_item a:not(.sc_button):not([class*="button"]):focus,
.sc_layouts_row_type_narrow .sc_layouts_item a:not(.sc_button):not([class*="button"]):hover .sc_layouts_item_icon,
.sc_layouts_row_type_narrow .sc_layouts_item a:not(.sc_button):not([class*="button"]):focus .sc_layouts_item_icon,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_layouts_item a:not(.sc_button):not([class*="button"]):hover,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_layouts_item a:not(.sc_button):not([class*="button"]):focus,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_layouts_item a:not(.sc_button):not([class*="button"]):hover .sc_layouts_item_icon,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_layouts_item a:not(.sc_button):not([class*="button"]):focus .sc_layouts_item_icon {
color: var(--theme-color-alter_text);
}
.sc_layouts_row_type_narrow .sc_layouts_item_icon,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_layouts_item_icon {
color: var(--theme-color-alter_text);
}
.sc_layouts_row_type_narrow .sc_layouts_item_details_line1,
.sc_layouts_row_type_narrow .sc_layouts_item_details_line2,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_layouts_item_details_line1,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_layouts_item_details_line2 {
color: var(--theme-color-alter_text);
}
.sc_layouts_row_type_narrow .socials_wrap .social_item .social_icon,
[class*="scheme_"].sc_layouts_row_type_narrow .socials_wrap .social_item .social_icon,
.sc_layouts_row_type_narrow .socials_wrap:not([class*="socials_type_"]) .social_item .social_icon,
[class*="scheme_"].sc_layouts_row_type_narrow .socials_wrap:not([class*="socials_type_"]) .social_item .social_icon {
background-color: transparent !important;
color: var(--theme-color-alter_dark);
}
.sc_layouts_row_type_narrow .socials_wrap .social_item:hover .social_icon,
.sc_layouts_row_type_narrow .socials_wrap .social_item:focus .social_icon,
[class*="scheme_"].sc_layouts_row_type_narrow .socials_wrap .social_item:hover .social_icon,
[class*="scheme_"].sc_layouts_row_type_narrow .socials_wrap .social_item:focus .social_icon,
.sc_layouts_row_type_narrow .socials_wrap:not([class*="socials_type_"]) .social_item:hover .social_icon,
.sc_layouts_row_type_narrow .socials_wrap:not([class*="socials_type_"]) .social_item:focus .social_icon,
[class*="scheme_"].sc_layouts_row_type_narrow .socials_wrap:not([class*="socials_type_"]) .social_item:hover .social_icon,
[class*="scheme_"].sc_layouts_row_type_narrow .socials_wrap:not([class*="socials_type_"]) .social_item:focus .social_icon {
color: var(--theme-color-alter_link);
}
.sc_layouts_row_type_narrow .sc_button_default,
.sc_layouts_row_type_narrow .sc_button:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image),
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button_default,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image) {
background-color: var(--theme-color-alter_link);
color: var(--theme-color-inverse_link);
}
.sc_layouts_row_type_narrow .sc_button_default:hover,
.sc_layouts_row_type_narrow .sc_button_default:focus,
.sc_layouts_row_type_narrow .sc_button:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image):hover,
.sc_layouts_row_type_narrow .sc_button:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image):focus,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button_default:hover,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button_default:focus,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image):hover,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button:not(.sc_button_simple):not(.sc_button_bordered):not(.sc_button_bg_image):focus {
background-color: var(--theme-color-alter_link);
color: var(--theme-color-inverse_link);
}
.sc_layouts_row_type_narrow .sc_button.color_style_link2,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button.color_style_link2 {
background-color: var(--theme-color-alter_link2);
color: var(--theme-color-inverse_link);
}
.sc_layouts_row_type_narrow .sc_button.color_style_link2:hover,
.sc_layouts_row_type_narrow .sc_button.color_style_link2:focus,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button.color_style_link2:hover,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button.color_style_link2:focus {
background-color: var(--theme-color-alter_hover2);
color: var(--theme-color-inverse_link) !important;
}
.sc_layouts_row_type_narrow .sc_button.color_style_link3,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button.color_style_link3 {
background-color: var(--theme-color-alter_link3);
color: var(--theme-color-inverse_link);
}
.sc_layouts_row_type_narrow .sc_button.color_style_link3:hover,
.sc_layouts_row_type_narrow .sc_button.color_style_link3:focus,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button.color_style_link3:hover,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button.color_style_link3:focus {
background-color: var(--theme-color-alter_hover3);
color: var(--theme-color-inverse_link) !important;
}
.sc_layouts_row_type_narrow .sc_button.color_style_dark,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button.color_style_dark {
background-color: var(--theme-color-alter_dark);
color: var(--theme-color-inverse_link);
}
.sc_layouts_row_type_narrow .sc_button.color_style_dark:hover,
.sc_layouts_row_type_narrow .sc_button.color_style_dark:focus,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button.color_style_dark:hover,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button.color_style_dark:focus {
background-color: var(--theme-color-alter_link);
color: var(--theme-color-inverse_link) !important;
}
.sc_layouts_row_type_narrow .sc_button_bordered:not(.sc_button_bg_image),
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button_bordered:not(.sc_button_bg_image) {
color:var(--theme-color-alter_link);
border-color:var(--theme-color-alter_link);
}
.sc_layouts_row_type_narrow .sc_button_bordered:not(.sc_button_bg_image):hover,
.sc_layouts_row_type_narrow .sc_button_bordered:not(.sc_button_bg_image):focus,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button_bordered:not(.sc_button_bg_image):hover,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button_bordered:not(.sc_button_bg_image):focus {
color:var(--theme-color-alter_hover) !important;
border-color:var(--theme-color-alter_hover) !important;
}
.sc_layouts_row_type_narrow .sc_button_bordered.color_style_link2:not(.sc_button_bg_image),
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button_bordered.color_style_link2:not(.sc_button_bg_image) {
color:var(--theme-color-alter_link2);
border-color:var(--theme-color-alter_link2);
}
.sc_layouts_row_type_narrow .sc_button_bordered.color_style_link2:not(.sc_button_bg_image):hover,
.sc_layouts_row_type_narrow .sc_button_bordered.color_style_link2:not(.sc_button_bg_image):focus,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button_bordered.color_style_link2:not(.sc_button_bg_image):hover,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button_bordered.color_style_link2:not(.sc_button_bg_image):focus {
color:var(--theme-color-alter_hover2) !important;
border-color:var(--theme-color-alter_hover2) !important;
}
.sc_layouts_row_type_narrow .sc_button_bordered.color_style_link3:not(.sc_button_bg_image),
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button_bordered.color_style_link3:not(.sc_button_bg_image) {
color:var(--theme-color-alter_link3);
border-color:var(--theme-color-alter_link3);
}
.sc_layouts_row_type_narrow .sc_button_bordered.color_style_link3:not(.sc_button_bg_image):hover,
.sc_layouts_row_type_narrow .sc_button_bordered.color_style_link3:not(.sc_button_bg_image):focus,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button_bordered.color_style_link3:not(.sc_button_bg_image):hover,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button_bordered.color_style_link3:not(.sc_button_bg_image):focus {
color:var(--theme-color-alter_hover3) !important;
border-color:var(--theme-color-alter_hover3) !important;
}
.sc_layouts_row_type_narrow .sc_button_bordered.color_style_dark:not(.sc_button_bg_image),
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button_bordered.color_style_dark:not(.sc_button_bg_image) {
color:var(--theme-color-alter_dark);
border-color:var(--theme-color-alter_dark);
}
.sc_layouts_row_type_narrow .sc_button_bordered.color_style_dark:not(.sc_button_bg_image):hover,
.sc_layouts_row_type_narrow .sc_button_bordered.color_style_dark:not(.sc_button_bg_image):focus,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button_bordered.color_style_dark:not(.sc_button_bg_image):hover,
[class*="scheme_"].sc_layouts_row_type_narrow .sc_button_bordered.color_style_dark:not(.sc_button_bg_image):focus {
color:var(--theme-color-alter_link) !important;
border-color:var(--theme-color-alter_link) !important;
}
.sc_layouts_row_type_narrow .search_wrap .search_submit,
[class*="scheme_"].sc_layouts_row_type_narrow .search_wrap .search_submit {
background-color: transparent;
color: var(--theme-color-alter_link);
}
.sc_layouts_row_type_narrow .search_wrap .search_field,
[class*="scheme_"].sc_layouts_row_type_narrow .search_wrap .search_field {
color: var(--theme-color-alter_text);
}
.sc_layouts_row_type_narrow .search_wrap .search_field::-webkit-input-placeholder,
[class*="scheme_"].sc_layouts_row_type_narrow .search_wrap .search_field::-webkit-input-placeholder {
color: var(--theme-color-alter_text);
}
.sc_layouts_row_type_narrow .search_wrap .search_field::-moz-placeholder,
[class*="scheme_"].sc_layouts_row_type_narrow .search_wrap .search_field::-moz-placeholder {
color: var(--theme-color-alter_text);
}
.sc_layouts_row_type_narrow .search_wrap .search_field:-ms-input-placeholder,
[class*="scheme_"].sc_layouts_row_type_narrow .search_wrap .search_field:-ms-input-placeholder {
color: var(--theme-color-alter_text);
}
.sc_layouts_row_type_narrow .search_wrap .search_field:focus,
[class*="scheme_"].sc_layouts_row_type_narrow .search_wrap .search_field:focus {
color: var(--theme-color-alter_dark);
}
/* Row type: Compact */
.sc_layouts_row_type_compact .sc_layouts_item,
[class*="scheme_"].sc_layouts_row_type_compact .sc_layouts_item {
color: var(--theme-color-text);
}
.sc_layouts_row_type_compact .sc_layouts_item a:not(.sc_button):not([class*="button"]),
[class*="scheme_"].sc_layouts_row_type_compact .sc_layouts_item a:not(.sc_button):not([class*="button"]) {
color: var(--theme-color-text_dark);
}
.sc_layouts_row_type_compact .sc_layouts_item a:not(.sc_button):not([class*="button"]):hover,
.sc_layouts_row_type_compact .sc_layouts_item a:not(.sc_button):not([class*="button"]):focus,
.sc_layouts_row_type_compact .sc_layouts_item a:hover .sc_layouts_item_icon,
.sc_layouts_row_type_compact .sc_layouts_item a:focus .sc_layouts_item_icon,
[class*="scheme_"].sc_layouts_row_type_compact .sc_layouts_item a:not(.sc_button):not([class*="button"]):hover,
[class*="scheme_"].sc_layouts_row_type_compact .sc_layouts_item a:not(.sc_button):not([class*="button"]):focus,
[class*="scheme_"].sc_layouts_row_type_compact .sc_layouts_item a:hover .sc_layouts_item_icon,
[class*="scheme_"].sc_layouts_row_type_compact .sc_layouts_item a:focus .sc_layouts_item_icon {
color: var(--theme-color-text_dark);
}
.sc_layouts_row_type_compact .sc_layouts_item_icon,
[class*="scheme_"].sc_layouts_row_type_compact .sc_layouts_item_icon {
color: var(--theme-color-text_dark);
}
.sc_layouts_row_type_compact .sc_layouts_item_details_line1,
.sc_layouts_row_type_compact .sc_layouts_item_details_line2,
[class*="scheme_"].sc_layouts_row_type_compact .sc_layouts_item_details_line1,
[class*="scheme_"].sc_layouts_row_type_compact .sc_layouts_item_details_line2 {
color: var(--theme-color-text_dark);
}
.sc_layouts_row_type_compact .socials_wrap .social_item .social_icon,
[class*="scheme_"].sc_layouts_row_type_compact .socials_wrap .social_item .social_icon,
.sc_layouts_row_type_compact .socials_wrap:not([class*="socials_type_"]) .social_item .social_icon,
[class*="scheme_"].sc_layouts_row_type_compact .socials_wrap:not([class*="socials_type_"]) .social_item .social_icon {
background-color: transparent;
color: var(--theme-color-text_dark);
}
.sc_layouts_row_type_compact .socials_wrap .social_item:hover .social_icon,
[class*="scheme_"].sc_layouts_row_type_compact .socials_wrap .social_item:hover .social_icon,
.sc_layouts_row_type_compact .socials_wrap:not([class*="socials_type_"]) .social_item:hover .social_icon,
[class*="scheme_"].sc_layouts_row_type_compact .socials_wrap:not([class*="socials_type_"]) .social_item:hover .social_icon {
background-color: transparent;
color: var(--theme-color-text_hover);
}
.sc_layouts_row_type_compact .search_wrap .search_submit,
[class*="scheme_"].sc_layouts_row_type_compact .search_wrap .search_submit {
background-color: transparent;
color: var(--theme-color-text_dark);
&:before {
color: var(--theme-color-text_dark);
}
}
.sc_layouts_row_type_compact .search_wrap .search_submit:hover,
.sc_layouts_row_type_compact .search_wrap .search_submit:focus,
[class*="scheme_"].sc_layouts_row_type_compact .search_wrap .search_submit:hover,
[class*="scheme_"].sc_layouts_row_type_compact .search_wrap .search_submit:focus {
background-color: transparent;
color: var(--theme-color-text_hover);
}
.sc_layouts_row_type_compact .search_wrap.search_style_normal .search_submit,
[class*="scheme_"].sc_layouts_row_type_compact .search_wrap.search_style_normal .search_submit {
color: var(--theme-color-text_link);
}
.sc_layouts_row_type_compact .search_wrap.search_style_normal .search_submit:hover,
.sc_layouts_row_type_compact .search_wrap.search_style_normal .search_submit:focus,
[class*="scheme_"].sc_layouts_row_type_compact .search_wrap.search_style_normal .search_submit:hover,
[class*="scheme_"].sc_layouts_row_type_compact .search_wrap.search_style_normal .search_submit:focus {
color: var(--theme-color-text_hover);
}
.sc_layouts_row_type_compact .search_wrap .search_field::-webkit-input-placeholder,
[class*="scheme_"].sc_layouts_row_type_compact .search_wrap .search_field::-webkit-input-placeholder {
color: var(--theme-color-text);
}
.sc_layouts_row_type_compact .search_wrap .search_field::-moz-placeholder,
[class*="scheme_"].sc_layouts_row_type_compact .search_wrap .search_field::-moz-placeholder {
color: var(--theme-color-text);
}
.sc_layouts_row_type_compact .search_wrap .search_field:-ms-input-placeholder,
[class*="scheme_"].sc_layouts_row_type_compact .search_wrap .search_field:-ms-input-placeholder {
color: var(--theme-color-text);
}
/* Row type: Normal */
.sc_layouts_row_type_normal .sc_layouts_item,
[class*="scheme_"].sc_layouts_row_type_normal .sc_layouts_item {
color: var(--theme-color-text);
}
.sc_layouts_row_type_normal .sc_layouts_item a:not(.sc_button):not([class*="button"]),
[class*="scheme_"].sc_layouts_row_type_normal .sc_layouts_item a:not(.sc_button):not([class*="button"]) {
color: var(--theme-color-text);
}
.sc_layouts_row_type_normal .sc_layouts_item a:not(.sc_button):not([class*="button"]):hover,
.sc_layouts_row_type_normal .sc_layouts_item a:not(.sc_button):not([class*="button"]):focus,
.sc_layouts_row_type_normal .sc_layouts_item a:not(.sc_button):not([class*="button"]):hover .sc_layouts_item_icon,
.sc_layouts_row_type_normal .sc_layouts_item a:not(.sc_button):not([class*="button"]):focus .sc_layouts_item_icon,
[class*="scheme_"].sc_layouts_row_type_normal .sc_layouts_item a:not(.sc_button):not([class*="button"]):hover,
[class*="scheme_"].sc_layouts_row_type_normal .sc_layouts_item a:not(.sc_button):not([class*="button"]):focus,
[class*="scheme_"].sc_layouts_row_type_normal .sc_layouts_item a:not(.sc_button):not([class*="button"]):hover .sc_layouts_item_icon,
[class*="scheme_"].sc_layouts_row_type_normal .sc_layouts_item a:not(.sc_button):not([class*="button"]):focus .sc_layouts_item_icon {
color: var(--theme-color-text_dark);
}
.sc_layouts_row_type_normal .search_wrap .search_submit,
[class*="scheme_"].sc_layouts_row_type_normal .search_wrap .search_submit {
background-color: transparent;
color: var(--theme-color-input_text);
}
.sc_layouts_row_type_normal .search_wrap .search_submit:hover,
.sc_layouts_row_type_normal .search_wrap .search_submit:focus,
[class*="scheme_"].sc_layouts_row_type_normal .search_wrap .search_submit:hover,
[class*="scheme_"].sc_layouts_row_type_normal .search_wrap .search_submit:focus {
background-color: transparent;
color: var(--theme-color-input_dark);
}
/* Logo */
.sc_layouts_logo b {
color: var(--theme-color-text_dark);
}
.sc_layouts_logo i {
color: var(--theme-color-text_link);
}
.sc_layouts_logo_text,
.sc_layouts_logo .logo_text {
color: var(--theme-color-text_dark) !important;
}
.sc_layouts_logo_text:hover,
.sc_layouts_logo:hover .logo_text {
color: var(--theme-color-text_link) !important;
}
.sc_layouts_logo_slogan,
.sc_layouts_logo .logo_slogan {
color: var(--theme-color-text) !important;
}
.sc_layouts_logo .logo_slogan {
@include font(14px, 18px);
}
/* Search style 'Normal' */
.search_style_normal {
&.search_wrap {
.search_form {
top: 2px;
}
.search_field {
padding: 5px 0 5px 2em !important;
&[placeholder]::-webkit-input-placeholder {
color: var(--theme-color-input_text);
}
&[placeholder]::-moz-placeholder {
color: var(--theme-color-input_text);
}
&[placeholder]:-ms-input-placeholder {
color: var(--theme-color-input_text);
}
&[placeholder]::placeholder {
color: var(--theme-color-input_text);
}
}
.search_submit {
&:before {
color: var(--theme-color-text);
@include transition(color .3s ease);
}
&:hover:before,
&:focus:before {
color: var(--theme-color-text_dark);
}
}
}
}
/* Search style 'Expand' */
.search_style_expand {
&.search_wrap {
.search_form {
top: 2px;
}
.search_field {
padding: 5px 0 5px 2em !important;
&[placeholder]::-webkit-input-placeholder {
color: var(--theme-color-input_text);
}
&[placeholder]::-moz-placeholder {
color: var(--theme-color-input_text);
}
&[placeholder]:-ms-input-placeholder {
color: var(--theme-color-input_text);
}
&[placeholder]::placeholder {
color: var(--theme-color-input_text);
}
}
.search_submit {
&:before {
color: var(--theme-color-text);
@include transition(color .3s ease);
}
&:hover:before,
&:focus:before {
color: var(--theme-color-text_dark);
}
}
}
&.search_opened {
background-color: transparent;
border-color: transparent;
.search_submit {
color: var(--theme-color-text);
&:hover,
&:focus {
color: var(--theme-color-text_dark);
}
}
}
}
/* Search style 'Fullscreen' */
.search_style_fullscreen .search_results {
width: 67vw;
}
.search_style_fullscreen.search_wrap {
min-width: 1.55em;
min-height: 1.55em;
.search_field {
padding: 0 0 0 1.55em !important;
}
.search_submit {
bottom: -5px;
}
}
.search_style_fullscreen.search_wrap.search_ajax .search_field {
padding-left: 1.55em !important;
}
.search_style_fullscreen.search_wrap.search_ajax.search_opened .search_field {
padding-left: 0 !important;
}
.search_style_fullscreen.search_opened .search_form_wrap {
background-color: var(--theme-color-alter_bg_color);
}
.search_style_fullscreen.search_opened .search_form {
border-color: var(--theme-color-alter_dark_05);
}
.search_style_fullscreen.search_opened .search_field,
.search_style_fullscreen.search_opened .search_close,
.search_style_fullscreen.search_opened .search_submit {
color: var(--theme-color-alter_dark);
}
.search_style_fullscreen.search_opened .search_close:hover,
.search_style_fullscreen.search_opened .search_close:focus,
.search_style_fullscreen.search_opened .search_field:hover,
.search_style_fullscreen.search_opened .search_field:focus,
.search_style_fullscreen.search_opened .search_submit:hover,
.search_style_fullscreen.search_opened .search_submit:focus {
color: var(--theme-color-alter_dark);
}
.search_style_fullscreen.search_opened .search_field::-webkit-input-placeholder {color:var(--theme-color-alter_text) !important; opacity: 1 !important;}
.search_style_fullscreen.search_opened .search_field::-moz-placeholder {color:var(--theme-color-alter_text) !important; opacity: 1 !important;}/* Firefox 19+ */
.search_style_fullscreen.search_opened .search_field:-moz-placeholder {color:var(--theme-color-alter_text) !important; opacity: 1 !important;}/* Firefox 18- */
.search_style_fullscreen.search_opened .search_field:-ms-input-placeholder {color:var(--theme-color-alter_text) !important; opacity: 1 !important;}
.search_style_fullscreen.search_opened .search_form {
width: 68%;
}
.search_style_fullscreen.search_opened .search_field,
.sc_layouts_row_type_normal .sc_layouts_column .search_style_fullscreen.search_opened .search_field {
padding: 0 1.5em 0 0 !important;
@include font(1.944rem !important, normal !important, 400 !important);
height: 3em;
letter-spacing: 0;
}
.search_style_fullscreen.search_opened .search_field[placeholder]::-webkit-input-placeholder,
.search_style_fullscreen.search_opened .search_field[placeholder]::-moz-placeholder,
.search_style_fullscreen.search_opened .search_field[placeholder]:-ms-input-placeholder,
.search_style_fullscreen.search_opened .search_field[placeholder]::placeholder,
.sc_layouts_row_type_normal .sc_layouts_column .search_style_fullscreen.search_opened .search_field[placeholder]::-webkit-input-placeholder,
.sc_layouts_row_type_normal .sc_layouts_column .search_style_fullscreen.search_opened .search_field[placeholder]::-moz-placeholder,
.sc_layouts_row_type_normal .sc_layouts_column .search_style_fullscreen.search_opened .search_field[placeholder]:-ms-input-placeholder,
.sc_layouts_row_type_normal .sc_layouts_column .search_style_fullscreen.search_opened .search_field[placeholder]::placeholder {
line-height: normal !important;
height: 3em !important;
}
.search_style_fullscreen.search_opened .search_submit,
.sc_layouts_row_type_normal .sc_layouts_column .search_style_fullscreen.search_opened .search_submit {
font-size: 1.5rem;
}
.search_style_fullscreen.search_opened.search_ajax .search_submit,
.sc_layouts_row_type_normal .sc_layouts_column .search_style_fullscreen.search_opened.search_ajax .search_submit {
margin-top: -1.5em;
}
.search_style_fullscreen.search_opened .search_close {
@include font(1.3rem, '', 400);
top: -4em;
@include transition(transform .3s ease);
&:hover {
@include transform(rotate(180deg));
}
}
.search_style_fullscreen.search_opened .search_submit,
.sc_layouts_row_type_normal .sc_layouts_column .search_style_fullscreen.search_opened .search_submit {
left: auto !important;
right: 0 !important;
}
.search_style_fullscreen.search_opened .search_field,
.search_style_fullscreen.search_opened .search_submit,
.search_style_fullscreen.search_opened .search_submit:before {
@include transition(none);
}
.search_wrap.search_progress .search_submit:before {
content: '\E830';
font-family: $theme_icons;
}
/* Search field */
.search_wrap .search_field {
padding: 0 0 0 1.7em !important;
}
/* Search submit */
.search_wrap .search_submit {
padding: 1px;
bottom: 0;
}
/* Search close */
.search_close:before {
content: '\e9e1';
font-family: $theme_icons;
}
/* Search Style "Modern" */
.admin-bar .search_modern .search_wrap.search_opened {
top: 32px;
}
@media (max-width: 782px) {
.admin-bar .search_modern .search_wrap.search_opened {
top: 46px;
}
}
@media (max-width: 600px) {
.admin-bar .search_modern .search_wrap.search_opened {
top: 0;
}
}
body.search_active .top_panel {
z-index: 8002;
}
body.sc_layouts_search_opened .top_panel {
z-index: 8003;
}
.search_modern {
position: relative;
z-index: 2000;
display: inline-block;
vertical-align: middle;
&.search_active {
z-index: 100005;
}
> .search_submit {
display: block;
@include box(1.4em, 1.4em, 1.4em);
text-align: center;
position: relative;
top: -1px;
@include transition(all 0.3s cubic-bezier(.46,.03,.52,.96));
opacity: 1;
cursor: pointer;
padding: 1px;
color: var(--theme-color-text_dark);
background-color: transparent;
&:before {
padding: 1px;
font-size: 24px !important;
font-family: $theme_icons;
content: '\E9B6';
margin: 0;
@include transition-color(0.3s);
}
}
.sc_layouts_row_type_compact & .search_wrap .search_submit {
font-size: inherit;
}
.search_wrap {
position: fixed;
left: 0;
top: -500px;
z-index: 100;
@include box(100%, 500px);
overflow: hidden;
will-change: top, box-shadow;
@include transition(top .5s cubic-bezier(.46,.03,.52,.96), box-shadow .3s ease-out);
@include box-shadow(0 1px 6px rgba(0,0,0,0));
background-color: var(--theme-color-alter_bg_color);
&.search_ajax {
overflow: visible;
}
&.search_progress .search_submit {
@include animation(spin 2s infinite linear);
&:before {
content: '\E830';
}
}
.search_form {
font-size: 1em;
position: absolute;
z-index: 1;
top: 55%;
left: 50%;
@include transform(translate(-50%, -50%));
width: 100%;
border: none;
&:after {
content: '';
display: block;
width: 100%;
height: 1px;
background-color: var(--theme-color-text_dark);
@include transform(scale3d(0, 1, 1));
@include transform-origin(left center);
}
}
.search_field,
.search_submit,
.search_submit:before {
@include transition-none;
}
}
.search_form_wrap {
@include abs-cc;
width: var(--theme-var-page);
height: 100%;
.search_field {
width:0;
visibility:hidden;
padding: 0 0 0 1.25em;
vertical-align:middle;
@include border-box;
border: none;
background-color: transparent;
&[placeholder]::-webkit-input-placeholder {
color: var(--theme-color-text);
}
&[placeholder]::-moz-placeholder {
color: var(--theme-color-text);
}
&[placeholder]:-ms-input-placeholder {
color: var(--theme-color-text);
}
&[placeholder]::placeholder {
color: var(--theme-color-text);
}
}
.search_submit {
@include font(inherit, inherit, inherit);
position: absolute;
left: auto;
right: 0;
top: 50%;
@include translateY(-50%);
background-color:transparent;
padding: 0;
&:before {
font-size: 24px !important;
font-family: $theme_icons;
content: '\E9B6';
margin: 0;
@include transition-color(0.3s);
color: var(--theme-color-text_dark);
}
}
}
.search_wrap .search_results {
padding: 3em;
}
.search_results,
.sc_layouts_column_align_right & .search_results {
top: 6.5em;
left: 0;
right: auto;
width: 100%;
}
.search_results:after,
.sc_layouts_column_align_right & .search_results:after {
left: 3em;
right: auto;
}
.search_results .search_results_content {
max-height: 30vh;
overflow-y: auto;
}
.search_header_wrap {
@include abs-lt;
width: 100%;
height: auto;
z-index: 2;
.logo_image {
position: absolute;
left: 60px;
top: 70px;
display: inline-block;
max-height: 100px;
width: auto;
}
.search_close {
position: absolute;
right: 60px;
top: 60px;
@include flex;
@include flex-justify-content(center);
@include flex-align-items(center);
@include box(1.2em, 1.2em, 1.2em);
@include font(2rem, '', 400);
text-align: center;
cursor:pointer;
@include transition(none);
color: var(--theme-color-text_dark);
&:before {
position: relative;
display: inline-block;
content: '\e9e1';
font-family: $theme_icons;
font-size: 24px;
@include transition(transform .3s ease, color .3s ease);
@include transform-origin(50% 50%);
}
&:hover:before {
@include transform(rotate(180deg));
}
}
}
.search_overlay {
display: none;
@include fixed-pos();
z-index: 1;
@include box(1000%, 1000%);
background-color: var(--theme-color-alter_bg_color);
opacity: .2;
}
/* search in content */
.content & .search_wrap {
max-width: 100%;
.search_form_wrap {
width: var(--theme-var-page);
}
}
}
/* Search Opened */
.search_modern {
.search_wrap.search_opened {
top: 0;
@include transition(top .5s cubic-bezier(.46,.03,.52,.96), box-shadow .3s ease-out);
@include box-shadow(0 1px 6px rgba(0,0,0,0.05));
&.search_ajax .search_submit {
@include transform(none);
margin-top: -1.5em;
}
.search_field {
@include font(1.9rem !important, normal !important, 400 !important);
@include box(100%, 3em);
letter-spacing: 0;
margin: 0;
padding: 0 1.5em 0 0;
border: none;
white-space: pre-wrap;
word-wrap: break-word;
resize: none;
overflow: hidden;
display: block;
visibility: visible;
}
.search_field[placeholder]::-webkit-input-placeholder,
.search_field[placeholder]::-moz-placeholder,
.search_field[placeholder]:-ms-input-placeholder,
.search_field[placeholder]::placeholder {
line-height: normal !important;
height: 3em !important;
}
.search_submit {
position: absolute;
left: auto;
right: 0;
top: 50%;
@include translateY(-50%);
&:before {
font-size: 1.5rem;
@include transition-color(0.3s);
}
}
.search_field {
padding: 0 1.5em 0 0 !important;
}
.search_field,
.search_field:hover,
.search_field:focus {
background-color: transparent;
}
.search_field::-ms-clear {
display: none;
}
}
}
/* Animation Search */
.search_modern {
.search_form {
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility:hidden;
&:after {
-webkit-animation-delay: 0.8s;
-moz-animation-delay: 0.8s;
-o-animation-delay: 0.8s;
animation-delay: 0.8s;
visibility:hidden;
}
}
.search_opened .search_form {
-webkit-animation-name: fadeIn;
animation-name: fadeIn;
-webkit-animation-duration: 0.7s;
animation-duration: 0.7s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
&:after {
-webkit-animation-name: fadeInMove;
animation-name: fadeInMove;
-webkit-animation-duration: 0.7s;
animation-duration: 0.7s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
}
/* out animation */
.search_out_anim & .search_form {
-webkit-animation-name: fadeOut;
animation-name: fadeOut;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
&:after {
-webkit-animation-name: fadeOutMove2;
animation-name: fadeOutMove2;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
}
}
/* Logo animation */
.logo_image {
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
visibility:hidden;
}
.search_opened .logo_image {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
.search_out_anim & .logo_image {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility:visible;
}
/* Close button animation */
.search_close:before {
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
visibility:hidden;
}
.search_opened .search_close:before {
-webkit-animation-name: fadeInAnimScale;
animation-name: fadeInAnimScale;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: backwards;
animation-fill-mode: backwards;
visibility:visible;
}
.search_out_anim & .search_close:before {
-webkit-animation-name: fadeOutAnimScale;
animation-name: fadeOutAnimScale;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility:visible;
}
}
/* Search results */
.search_wrap {
.search_results {
background-color: var(--theme-color-bg_color);
border-color: var(--theme-color-bd_color);
&:after {
background-color: var(--theme-color-bg_color);
border-left-color: var(--theme-color-bd_color);
border-top-color: var(--theme-color-bd_color);
}
.search_results_close {
@include flex;
@include flex-justify-content(center);
@include flex-align-items(center);
@include square(1.4em);
font-size: 14px;
top: 8px;
right: 8px;
color: var(--theme-color-text_dark);
&:hover {
color: var(--theme-color-text_dark);
}
&:before {
font-family: $theme_icons;
content: '\e9e1';
@include transition(transform .3s ease);
}
&:hover:before{
@include transform(rotate(180deg));
}
}
&.widget_area .post_item + .post_item {
border-top-color: var(--theme-color-bd_color);
}
}
}
/* Search field inside content
--------------------------------------- */
.content .search_wrap {
margin:0;
.search_form_wrap {
width: 100%;
}
.search_form_wrap .search_field {
width:100%;
}
.search_submit {
background-color:transparent;
}
.search_results {
width:100%;
}
}
.post_item_none_search .search_wrap,
.post_item_none_archive .search_wrap {
max-width: 410px;
margin: 0 auto;
.search_field {
padding: 0.77em 1.2em 0.77em 3.3em !important;
border-width: 1px !important;
border-style: solid !important;
@include border-radius(0);
}
.search_submit {
left: 0;
right: auto;
top: 0;
padding: 0 1em;
@include border-radius(0);
&:before {
@include transition-all(0.3s);
}
}
}
/* Page title and breadcrumbs */
.sc_layouts_title .sc_layouts_title_meta,
.sc_layouts_title .sc_layouts_title_breadcrumbs,
.sc_layouts_title .sc_layouts_title_breadcrumbs a,
.sc_layouts_title .sc_layouts_title_description,
.sc_layouts_title .post_meta,
.sc_layouts_title .post_meta_item,
.sc_layouts_title .post_meta .vc_inline-link,
.sc_layouts_title .post_meta_item a,
.sc_layouts_title .post_meta_item:after,
.sc_layouts_title .post_meta_item:hover:after,
.sc_layouts_title .post_meta_item.post_meta_edit:after,
.sc_layouts_title .post_meta_item.post_meta_edit:hover:after,
.sc_layouts_title .post_meta_item.post_categories,
.sc_layouts_title .post_meta_item.post_categories a,
.sc_layouts_title .post_info .post_info_item,
.sc_layouts_title .post_info .post_info_item a,
.sc_layouts_title .post_info_counters .post_meta_item {
color: var(--theme-color-text_dark);
}
.sc_layouts_title .post_meta_item a:hover,
.sc_layouts_title .post_meta_item a:focus,
.sc_layouts_title .sc_layouts_title_breadcrumbs a:hover,
.sc_layouts_title .sc_layouts_title_breadcrumbs a:focus,
.sc_layouts_title .post_meta .vc_inline-link:hover,
.sc_layouts_title .post_meta .vc_inline-link:focus,
.sc_layouts_title a.post_meta_item:hover,
.sc_layouts_title a.post_meta_item:focus,
.sc_layouts_title .post_meta_item.post_categories a:hover,
.sc_layouts_title .post_meta_item.post_categories a:focus,
.sc_layouts_title .post_info .post_info_item a:hover,
.sc_layouts_title .post_info .post_info_item a:focus,
.sc_layouts_title .post_info_counters .post_meta_item:hover,
.sc_layouts_title .post_info_counters .post_meta_item:focus {
color: var(--theme-color-text_hover);
}
/* Menu
--------------------------------- */
.sc_layouts_menu_nav > li > a {
color: var(--theme-color-text_dark);
}
.sc_layouts_menu_nav > li > a:hover,
.sc_layouts_menu_nav > li.sfHover > a {
color: var(--theme-color-text_link) !important;
}
.sc_layouts_menu_nav > li.current-menu-item > a,
.sc_layouts_menu_nav > li.current-menu-parent > a,
.sc_layouts_menu_nav > li.current-menu-ancestor > a {
color: var(--theme-color-text_link) !important;
}
.sc_layouts_menu_nav .menu-collapse > a:before {
color: var(--theme-color-alter_dark);
font-weight: 400;
}
.sc_layouts_menu_nav .menu-collapse > a:after {
display: none;
@include transition-all(0.3s);
background-color: var(--theme-color-alter_bg_color);
}
.sc_layouts_menu_nav .menu-collapse > a:hover:before,
.sc_layouts_menu_nav .menu-collapse > a:focus:before {
color: var(--theme-color-alter_dark);
}
.sc_layouts_menu_nav .menu-collapse > a:hover:after,
.sc_layouts_menu_nav .menu-collapse > a:focus:after {
background-color: var(--theme-color-alter_bg_hover);
}
/* Submenu */
.sc_layouts_menu_popup .sc_layouts_menu_nav,
.sc_layouts_menu_popup .sc_layouts_menu_nav > li > ul,
.sc_layouts_menu_nav > li > ul ul,
.sc_layouts_menu_nav > li ul:not(.sc_item_filters_tabs) {
background-color: var(--theme-color-extra_bg_color);
}
.widget_nav_menu li.menu-delimiter,
.sc_layouts_menu_nav > li li.menu-delimiter {
border-color: var(--theme-color-extra_bd_color);
}
.sc_layouts_menu_popup .sc_layouts_menu_nav > li > a,
.sc_layouts_menu_nav > li li > a {
color: var(--theme-color-extra_text) !important;
}
.sc_layouts_menu_popup .sc_layouts_menu_nav > li > a:hover,
.sc_layouts_menu_popup .sc_layouts_menu_nav > li.sfHover > a,
.sc_layouts_menu_nav > li li > a:hover,
.sc_layouts_menu_nav > li li.sfHover > a {
color: var(--theme-color-extra_hover) !important;
}
.sc_layouts_menu_nav > li li > a:hover:after {
color: var(--theme-color-extra_hover) !important;
}
.sc_layouts_menu_nav li[class*="columns-"] li.menu-item-has-children > a:hover,
.sc_layouts_menu_nav li[class*="columns-"] li.menu-item-has-children.sfHover > a {
color: var(--theme-color-extra_text) !important;
background-color: transparent;
}
.sc_layouts_menu_nav > li li[class*="icon-"]:before {
color: var(--theme-color-extra_hover);
}
.sc_layouts_menu_nav > li li[class*="icon-"]:hover:before,
.sc_layouts_menu_nav > li li[class*="icon-"].shHover:before {
color: var(--theme-color-extra_hover);
}
.sc_layouts_menu_nav > li li.current-menu-item > a,
.sc_layouts_menu_nav > li li.current-menu-parent > a,
.sc_layouts_menu_nav > li li.current-menu-ancestor > a {
color: var(--theme-color-extra_hover) !important;
}
.sc_layouts_menu_nav > li li.current-menu-item:before,
.sc_layouts_menu_nav > li li.current-menu-parent:before,
.sc_layouts_menu_nav > li li.current-menu-ancestor:before {
color: var(--theme-color-extra_hover) !important;
}
/* Description in the menu */
.sc_layouts_menu_item_description {
color: var(--theme-color-extra_light);
}
.menu_main_nav > li ul [class*="current-menu-"] > a .sc_layouts_menu_item_description,
.sc_layouts_menu_nav > li ul li[class*="current-menu-"] > a .sc_layouts_menu_item_description,
.menu_main_nav > li ul a:hover .sc_layouts_menu_item_description,
.sc_layouts_menu_nav > li ul a:hover .sc_layouts_menu_item_description {
color: var(--theme-color-text_light);
}
.menu_main_nav > li[class*="current-menu-"] > a .sc_layouts_menu_item_description,
.sc_layouts_menu_nav > li[class*="current-menu-"] > a .sc_layouts_menu_item_description,
.menu_main_nav > li > a:hover .sc_layouts_menu_item_description,
.sc_layouts_menu_nav > li > a:hover .sc_layouts_menu_item_description {
color: var(--theme-color-text);
}
/* Menu hovers
----------------------------------------- */
/* fade box */
.menu_hover_fade_box .sc_layouts_menu_nav > a:hover,
.menu_hover_fade_box .sc_layouts_menu_nav > li:not(.menu-collapse) > a:hover,
.menu_hover_fade_box .sc_layouts_menu_nav > li:not(.menu-collapse).sfHover > a {
color: var(--theme-color-alter_link);
background-color: var(--theme-color-alter_bg_color);
}
/* slide_box */
.menu_hover_slide_box .sc_layouts_menu_nav > li#blob {
background-color: var(--theme-color-alter_bg_color);
}
/* slide_line */
.menu_hover_slide_line .sc_layouts_menu_nav > li#blob {
background-color: var(--theme-color-text_link);
}
/* color_line */
.menu_hover_color_line .sc_layouts_menu_nav > li:not(.menu-collapse) > a:before {
background-color: var(--theme-color-text_dark);
}
.menu_hover_color_line .sc_layouts_menu_nav > li:not(.menu-collapse) > a:after,
.menu_hover_color_line .sc_layouts_menu_nav > li:not(.menu-collapse).menu-item-has-children > a:after {
background-color: var(--theme-color-text_link);
display: block;
}
.menu_hover_color_line .sc_layouts_menu_nav > li:not(.menu-collapse).sfHover > a,
.menu_hover_color_line .sc_layouts_menu_nav > li:not(.menu-collapse) > a:hover,
.menu_hover_color_line .sc_layouts_menu_nav > li:not(.menu-collapse) > a:focus {
color: var(--theme-color-text_link);
}
/* zoom_line */
.menu_hover_zoom_line .sc_layouts_menu_nav > li:not(.menu-collapse) > a:after {
background-color: var(--theme-color-text_dark);
}
.menu_hover_zoom_line {
.sc_layouts_menu_nav > li > a:hover,
.sc_layouts_menu_nav > li.sfHover > a {
color: var(--theme-color-text_dark) !important;
}
> ul > li:not(.menu-collapse) > a:before {
display: none;
}
> ul > li:not(.menu-collapse) > a:after {
content: "" !important;
display: block !important;
position: absolute;
z-index: 1;
top: auto;
bottom: 7px;
left: 5%;
right: auto;
@include transform(none);
width: 0;
height: 2px;
@include transition-all(0.2s);
}
> ul > li:not(.menu-collapse) > a:hover:after,
> ul > li:not(.menu-collapse).sfHover > a:after,
> ul > li:not(.menu-collapse).current-menu-item > a:after,
> ul > li:not(.menu-collapse).current-menu-parent > a:after,
> ul > li:not(.menu-collapse).current-menu-ancestor > a:after {
width: 90%;
}
.sc_layouts_menu_nav > li.current-menu-item > a,
.sc_layouts_menu_nav > li.current-menu-parent > a,
.sc_layouts_menu_nav > li.current-menu-ancestor > a {
color: var(--theme-color-text_dark) !important;
}
}
/* path_line */
.menu_hover_path_line .sc_layouts_menu_nav > li:not(.menu-collapse):before,
.menu_hover_path_line .sc_layouts_menu_nav > li:not(.menu-collapse):after,
.menu_hover_path_line .sc_layouts_menu_nav > li:not(.menu-collapse) > a:before,
.menu_hover_path_line .sc_layouts_menu_nav > li:not(.menu-collapse) > a:after {
background-color: var(--theme-color-text_link);
}
/* roll_down */
.menu_hover_roll_down .sc_layouts_menu_nav > li:not(.menu-collapse) > a:before {
background-color: var(--theme-color-text_link);
}
/* Layouts as submenu
--------------------------------- */
.sc_layouts_menu li > ul.sc_layouts_submenu .elementor-section,
.sc_layouts_menu li > ul.sc_layouts_submenu .vc_row,
.sc_layouts_menu li > ul.sc_layouts_submenu .sc_layouts_item,
.sc_layouts_menu li > ul.sc_layouts_submenu .post_item,
.sc_layouts_menu li > ul.sc_layouts_submenu .amount,
.sc_layouts_menu li > ul.sc_layouts_submenu li {
color: var(--theme-color-extra_text);
}
.sc_layouts_menu li > ul.sc_layouts_submenu .elementor-section a:not(.sc_button):not([class*="button"]),
.sc_layouts_menu li > ul.sc_layouts_submenu .vc_row a:not(.sc_button):not([class*="button"]),
.sc_layouts_menu li > ul.sc_layouts_submenu .sc_layouts_item a:not(.sc_button):not([class*="button"]) {
color: var(--theme-color-extra_dark);
}
.sc_layouts_menu li > ul.sc_layouts_submenu .elementor-section a:not(.sc_button):not([class*="button"]):hover,
.sc_layouts_menu li > ul.sc_layouts_submenu .elementor-section a:not(.sc_button):not([class*="button"]):focus,
.sc_layouts_menu li > ul.sc_layouts_submenu .vc_row a:not(.sc_button):not([class*="button"]):hover,
.sc_layouts_menu li > ul.sc_layouts_submenu .vc_row a:not(.sc_button):not([class*="button"]):focus,
.sc_layouts_menu li > ul.sc_layouts_submenu .sc_layouts_item a:not(.sc_button):not([class*="button"]):hover,
.sc_layouts_menu li > ul.sc_layouts_submenu .sc_layouts_item a:not(.sc_button):not([class*="button"]):focus,
.sc_layouts_menu li > ul.sc_layouts_submenu .elementor-section a:hover .sc_layouts_item_icon,
.sc_layouts_menu li > ul.sc_layouts_submenu .elementor-section a:focus .sc_layouts_item_icon,
.sc_layouts_menu li > ul.sc_layouts_submenu .vc_row a:hover .sc_layouts_item_icon,
.sc_layouts_menu li > ul.sc_layouts_submenu .vc_row a:focus .sc_layouts_item_icon,
.sc_layouts_menu li > ul.sc_layouts_submenu .sc_layouts_item a:hover .sc_layouts_item_icon,
.sc_layouts_menu li > ul.sc_layouts_submenu .sc_layouts_item a:focus .sc_layouts_item_icon {
color: var(--theme-color-extra_link);
}
ul.sc_layouts_submenu h1,
ul.sc_layouts_submenu h2,
ul.sc_layouts_submenu h3,
ul.sc_layouts_submenu h4,
ul.sc_layouts_submenu h5,
ul.sc_layouts_submenu h6,
ul.sc_layouts_submenu h1 a,
ul.sc_layouts_submenu h2 a,
ul.sc_layouts_submenu h3 a,
ul.sc_layouts_submenu h4 a,
ul.sc_layouts_submenu h5 a,
ul.sc_layouts_submenu h6 a,
ul.sc_layouts_submenu [class*="color_style_"] h1 a,
ul.sc_layouts_submenu [class*="color_style_"] h2 a,
ul.sc_layouts_submenu [class*="color_style_"] h3 a,
ul.sc_layouts_submenu [class*="color_style_"] h4 a,
ul.sc_layouts_submenu [class*="color_style_"] h5 a,
ul.sc_layouts_submenu [class*="color_style_"] h6 a {
color: var(--theme-color-extra_dark);
}
ul.sc_layouts_submenu h1 a:hover, ul.sc_layouts_submenu h1 a:focus,
ul.sc_layouts_submenu h2 a:hover, ul.sc_layouts_submenu h2 a:focus,
ul.sc_layouts_submenu h3 a:hover, ul.sc_layouts_submenu h3 a:focus,
ul.sc_layouts_submenu h4 a:hover, ul.sc_layouts_submenu h4 a:focus,
ul.sc_layouts_submenu h5 a:hover, ul.sc_layouts_submenu h5 a:focus,
ul.sc_layouts_submenu h6 a:hover, ul.sc_layouts_submenu h6 a:focus {
color: var(--theme-color-extra_link);
}
ul.sc_layouts_submenu .color_style_link2 h1 a:hover, ul.sc_layouts_submenu .color_style_link2 h1 a:focus,
ul.sc_layouts_submenu .color_style_link2 h2 a:hover, ul.sc_layouts_submenu .color_style_link2 h2 a:focus,
ul.sc_layouts_submenu .color_style_link2 h3 a:hover, ul.sc_layouts_submenu .color_style_link2 h3 a:focus,
ul.sc_layouts_submenu .color_style_link2 h4 a:hover, ul.sc_layouts_submenu .color_style_link2 h4 a:focus,
ul.sc_layouts_submenu .color_style_link2 h5 a:hover, ul.sc_layouts_submenu .color_style_link2 h5 a:focus,
ul.sc_layouts_submenu .color_style_link2 h6 a:hover, ul.sc_layouts_submenu .color_style_link2 h6 a:focus {
color: var(--theme-color-extra_link2);
}
ul.sc_layouts_submenu .color_style_link3 h1 a:hover, ul.sc_layouts_submenu .color_style_link3 h1 a:focus,
ul.sc_layouts_submenu .color_style_link3 h2 a:hover, ul.sc_layouts_submenu .color_style_link3 h2 a:focus,
ul.sc_layouts_submenu .color_style_link3 h3 a:hover, ul.sc_layouts_submenu .color_style_link3 h3 a:focus,
ul.sc_layouts_submenu .color_style_link3 h4 a:hover, ul.sc_layouts_submenu .color_style_link3 h4 a:focus,
ul.sc_layouts_submenu .color_style_link3 h5 a:hover, ul.sc_layouts_submenu .color_style_link3 h5 a:focus,
ul.sc_layouts_submenu .color_style_link3 h6 a:hover, ul.sc_layouts_submenu .color_style_link3 h6 a:focus {
color: var(--theme-color-extra_link3);
}
ul.sc_layouts_submenu .color_style_dark h1 a:hover, ul.sc_layouts_submenu .color_style_dark h1 a:focus,
ul.sc_layouts_submenu .color_style_dark h2 a:hover, ul.sc_layouts_submenu .color_style_dark h2 a:focus,
ul.sc_layouts_submenu .color_style_dark h3 a:hover, ul.sc_layouts_submenu .color_style_dark h3 a:focus,
ul.sc_layouts_submenu .color_style_dark h4 a:hover, ul.sc_layouts_submenu .color_style_dark h4 a:focus,
ul.sc_layouts_submenu .color_style_dark h5 a:hover, ul.sc_layouts_submenu .color_style_dark h5 a:focus,
ul.sc_layouts_submenu .color_style_dark h6 a:hover, ul.sc_layouts_submenu .color_style_dark h6 a:focus {
color: var(--theme-color-extra_link);
}
ul.sc_layouts_submenu dt,
ul.sc_layouts_submenu b,
ul.sc_layouts_submenu strong,
ul.sc_layouts_submenu i,
ul.sc_layouts_submenu em,
ul.sc_layouts_submenu mark,
ul.sc_layouts_submenu ins {
color: var(--theme-color-extra_dark);
}
ul.sc_layouts_submenu s,
ul.sc_layouts_submenu strike,
ul.sc_layouts_submenu del,
ul.sc_layouts_submenu .post_meta {
color: var(--theme-color-extra_light);
}
ul.sc_layouts_submenu .sc_recent_news_header {
border-color: var(--theme-color-extra_bd_color);
}
/* Layouts submenu in the Custom Menu */
.widget_nav_menu .sc_layouts_menu li > ul.sc_layouts_submenu .elementor-section,
.widget_nav_menu .sc_layouts_menu li > ul.sc_layouts_submenu .vc_row,
.widget_nav_menu .sc_layouts_menu li > ul.sc_layouts_submenu .sc_layouts_item,
.widget_nav_menu .sc_layouts_menu li > ul.sc_layouts_submenu .post_item{
color: var(--theme-color-text);
}
.widget_nav_menu .sc_layouts_menu li > ul.sc_layouts_submenu .elementor-section a:not(.sc_button):not([class*="button"]),
.widget_nav_menu .sc_layouts_menu li > ul.sc_layouts_submenu .vc_row a:not(.sc_button):not([class*="button"]),
.widget_nav_menu .sc_layouts_menu li > ul.sc_layouts_submenu .sc_layouts_item a:not(.sc_button):not([class*="button"]) {
color: var(--theme-color-text_link);
}
.widget_nav_menu .sc_layouts_menu li > ul.sc_layouts_submenu .elementor-section a:not(.sc_button):not([class*="button"]):hover,
.widget_nav_menu .sc_layouts_menu li > ul.sc_layouts_submenu .elementor-section a:not(.sc_button):not([class*="button"]):focus,
.widget_nav_menu .sc_layouts_menu li > ul.sc_layouts_submenu .elementor-section a:hover .sc_layouts_item_icon,
.widget_nav_menu .sc_layouts_menu li > ul.sc_layouts_submenu .elementor-section a:focus .sc_layouts_item_icon,
.widget_nav_menu .sc_layouts_menu li > ul.sc_layouts_submenu .vc_row a:not(.sc_button):not([class*="button"]):hover,
.widget_nav_menu .sc_layouts_menu li > ul.sc_layouts_submenu .vc_row a:not(.sc_button):not([class*="button"]):focus,
.widget_nav_menu .sc_layouts_menu li > ul.sc_layouts_submenu .vc_row a:hover .sc_layouts_item_icon,
.widget_nav_menu .sc_layouts_menu li > ul.sc_layouts_submenu .vc_row a:focus .sc_layouts_item_icon,
.widget_nav_menu .sc_layouts_menu li > ul.sc_layouts_submenu .sc_layouts_item a:not(.sc_button):not([class*="button"]):hover,
.widget_nav_menu .sc_layouts_menu li > ul.sc_layouts_submenu .sc_layouts_item a:not(.sc_button):not([class*="button"]):focus,
.widget_nav_menu .sc_layouts_menu li > ul.sc_layouts_submenu .sc_layouts_item a:hover .sc_layouts_item_icon,
.widget_nav_menu .sc_layouts_menu li > ul.sc_layouts_submenu .sc_layouts_item a:focus .sc_layouts_item_icon {
color: var(--theme-color-text_hover);
}
.widget_nav_menu ul.sc_layouts_submenu h1,
.widget_nav_menu ul.sc_layouts_submenu h2,
.widget_nav_menu ul.sc_layouts_submenu h3,
.widget_nav_menu ul.sc_layouts_submenu h4,
.widget_nav_menu ul.sc_layouts_submenu h5,
.widget_nav_menu ul.sc_layouts_submenu h6,
.widget_nav_menu ul.sc_layouts_submenu h1 a,
.widget_nav_menu ul.sc_layouts_submenu h2 a,
.widget_nav_menu ul.sc_layouts_submenu h3 a,
.widget_nav_menu ul.sc_layouts_submenu h4 a,
.widget_nav_menu ul.sc_layouts_submenu h5 a,
.widget_nav_menu ul.sc_layouts_submenu h6 a,
.widget_nav_menu ul.sc_layouts_submenu [class*="color_style_"] h1 a,
.widget_nav_menu ul.sc_layouts_submenu [class*="color_style_"] h2 a,
.widget_nav_menu ul.sc_layouts_submenu [class*="color_style_"] h3 a,
.widget_nav_menu ul.sc_layouts_submenu [class*="color_style_"] h4 a,
.widget_nav_menu ul.sc_layouts_submenu [class*="color_style_"] h5 a,
.widget_nav_menu ul.sc_layouts_submenu [class*="color_style_"] h6 a {
color: var(--theme-color-text_dark);
}
.widget_nav_menu ul.sc_layouts_submenu h1 a:hover, .widget_nav_menu ul.sc_layouts_submenu h1 a:focus,
.widget_nav_menu ul.sc_layouts_submenu h2 a:hover, .widget_nav_menu ul.sc_layouts_submenu h2 a:focus,
.widget_nav_menu ul.sc_layouts_submenu h3 a:hover, .widget_nav_menu ul.sc_layouts_submenu h3 a:focus,
.widget_nav_menu ul.sc_layouts_submenu h4 a:hover, .widget_nav_menu ul.sc_layouts_submenu h4 a:focus,
.widget_nav_menu ul.sc_layouts_submenu h5 a:hover, .widget_nav_menu ul.sc_layouts_submenu h5 a:focus,
.widget_nav_menu ul.sc_layouts_submenu h6 a:hover, .widget_nav_menu ul.sc_layouts_submenu h6 a:focus {
color: var(--theme-color-text_link);
}
.widget_nav_menu ul.sc_layouts_submenu .color_style_link2 h1 a:hover, .widget_nav_menu ul.sc_layouts_submenu .color_style_link2 h1 a:focus,
.widget_nav_menu ul.sc_layouts_submenu .color_style_link2 h2 a:hover, .widget_nav_menu ul.sc_layouts_submenu .color_style_link2 h2 a:focus,
.widget_nav_menu ul.sc_layouts_submenu .color_style_link2 h3 a:hover, .widget_nav_menu ul.sc_layouts_submenu .color_style_link2 h3 a:focus,
.widget_nav_menu ul.sc_layouts_submenu .color_style_link2 h4 a:hover, .widget_nav_menu ul.sc_layouts_submenu .color_style_link2 h4 a:focus,
.widget_nav_menu ul.sc_layouts_submenu .color_style_link2 h5 a:hover, .widget_nav_menu ul.sc_layouts_submenu .color_style_link2 h5 a:focus,
.widget_nav_menu ul.sc_layouts_submenu .color_style_link2 h6 a:hover, .widget_nav_menu ul.sc_layouts_submenu .color_style_link2 h6 a:focus {
color: var(--theme-color-text_link2);
}
.widget_nav_menu ul.sc_layouts_submenu .color_style_link3 h1 a:hover, .widget_nav_menu ul.sc_layouts_submenu .color_style_link3 h1 a:focus,
.widget_nav_menu ul.sc_layouts_submenu .color_style_link3 h2 a:hover, .widget_nav_menu ul.sc_layouts_submenu .color_style_link3 h2 a:focus,
.widget_nav_menu ul.sc_layouts_submenu .color_style_link3 h3 a:hover, .widget_nav_menu ul.sc_layouts_submenu .color_style_link3 h3 a:focus,
.widget_nav_menu ul.sc_layouts_submenu .color_style_link3 h4 a:hover, .widget_nav_menu ul.sc_layouts_submenu .color_style_link3 h4 a:focus,
.widget_nav_menu ul.sc_layouts_submenu .color_style_link3 h5 a:hover, .widget_nav_menu ul.sc_layouts_submenu .color_style_link3 h5 a:focus,
.widget_nav_menu ul.sc_layouts_submenu .color_style_link3 h6 a:hover, .widget_nav_menu ul.sc_layouts_submenu .color_style_link3 h6 a:focus {
color: var(--theme-color-text_link3);
}
.widget_nav_menu ul.sc_layouts_submenu .color_style_dark h1 a:hover, .widget_nav_menu ul.sc_layouts_submenu .color_style_dark h1 a:focus,
.widget_nav_menu ul.sc_layouts_submenu .color_style_dark h2 a:hover, .widget_nav_menu ul.sc_layouts_submenu .color_style_dark h2 a:focus,
.widget_nav_menu ul.sc_layouts_submenu .color_style_dark h3 a:hover, .widget_nav_menu ul.sc_layouts_submenu .color_style_dark h3 a:focus,
.widget_nav_menu ul.sc_layouts_submenu .color_style_dark h4 a:hover, .widget_nav_menu ul.sc_layouts_submenu .color_style_dark h4 a:focus,
.widget_nav_menu ul.sc_layouts_submenu .color_style_dark h5 a:hover, .widget_nav_menu ul.sc_layouts_submenu .color_style_dark h5 a:focus,
.widget_nav_menu ul.sc_layouts_submenu .color_style_dark h6 a:hover, .widget_nav_menu ul.sc_layouts_submenu .color_style_dark h6 a:focus {
color: var(--theme-color-text_link);
}
.widget_nav_menu ul.sc_layouts_submenu dt,
.widget_nav_menu ul.sc_layouts_submenu b,
.widget_nav_menu ul.sc_layouts_submenu strong,
.widget_nav_menu ul.sc_layouts_submenu i,
.widget_nav_menu ul.sc_layouts_submenu em,
.widget_nav_menu ul.sc_layouts_submenu mark,
.widget_nav_menu ul.sc_layouts_submenu ins {
color: var(--theme-color-text_dark);
}
.widget_nav_menu ul.sc_layouts_submenu s,
.widget_nav_menu ul.sc_layouts_submenu strike,
.widget_nav_menu ul.sc_layouts_submenu del,
.widget_nav_menu ul.sc_layouts_submenu .post_meta{
color: var(--theme-color-text_light);
}
.widget_nav_menu ul.sc_layouts_submenu .sc_recent_news_header {
border-color: var(--theme-color-bd_color);
}
/* Side menu
----------------------------------------------------------- */
body.menu_side_present {
width: auto;
@include content-box;
}
body.menu_side_left {
margin-left:6rem;
}
body.menu_side_right {
margin-right:6rem;
}
.menu_side_present .body_wrap {
position:relative;
overflow: hidden;
max-width:100%;
}
.menu_side_present .menu_side_wrap {
@include fixed-pos(0, auto, 0, 0, 20000);
width: 6rem;
@include transition-properties(left, right);
}
.menu_side_right .menu_side_wrap {
left: auto;
right: 0;
}
.admin-bar .menu_side_wrap {
top: 32px;
}
@media (max-width: 782px) {
.admin-bar .menu_side_wrap {
top: 46px;
}
}
@media (max-width: 600px) {
.admin-bar .menu_side_wrap {
top: 0;
}
}
.menu_side_wrap .menu_side_inner {
display:block;
@include abs-cover;
@include border-box;
}
.menu_side_inner {
color: var(--theme-color-alter_text);
background-color: var(--theme-color-alter_bg_color);
}
.menu_side_present .menu_side_wrap .sc_layouts_logo {
display: block;
padding:25% 10%;
text-align:center;
border-bottom: 1px solid #ddd;
position:relative;
z-index:1;
}
.menu_side_inner .sc_layouts_logo {
background-color: var(--theme-color-alter_bg_color);
border-color: var(--theme-color-alter_bd_color);
}
[class*="scheme_"].menu_side_icons .sc_layouts_logo {
background-color: var(--theme-color-bg_color);
border-color: var(--theme-color-bd_color);
}
.menu_side_present .menu_side_wrap .logo_text {
font-size: 1em;
letter-spacing:0;
text-align:center;
@include rotate(-90deg);
}
.menu_side_present .menu_side_wrap .logo_slogan {
display:none;
}
.menu_side_wrap .menu_mobile_button {
display:block;
position:relative;
left: 0;
right: auto;
top: 0;
}
.menu_side_wrap .menu_side_button {
display: none;
font-size: 16px;
margin-top:-1.5em;
overflow:hidden;
cursor: pointer;
@include abs-lt(-1.5em, 50%);
@include square(3em);
@include border-box;
@include transition-properties(left, right);
}
.menu_side_right .menu_side_wrap .menu_side_button {
text-align:left;
padding-left: 10px;
@include border-radius(4px 0 0 4px);
}
.menu_side_left .menu_side_wrap .menu_side_button {
left: auto;
right: -1.5em;
text-align:right;
padding-right: 10px;
@include border-radius(0 4px 4px 0);
}
.menu_side_right .menu_side_wrap .menu_side_button:before { content: '\e837'; }
.menu_side_right .menu_side_wrap.opened .menu_side_button:before { content: '\e836'; }
.menu_side_left .menu_side_wrap .menu_side_button:before { content: '\e836'; }
.menu_side_left .menu_side_wrap.opened .menu_side_button:before { content: '\e837'; }
[class*="scheme_"].menu_side_wrap .menu_side_button {
color: var(--theme-color-alter_dark);
border-color: var(--theme-color-alter_bd_color);
background-color: var(--theme-color-alter_bg_color_07);
}
[class*="scheme_"].menu_side_wrap .menu_side_button:hover {
color: var(--theme-color-inverse_hover);
border-color: var(--theme-color-alter_hover);
background-color: var(--theme-color-alter_link);
}
// TOC menu items
#toc_menu {
display: none;
@include abs-lt(50%, 50%, '');
width: 100%;
margin:-50% 0 0 -50%;
}
.toc_menu_item {
position:relative;
z-index:1;
}
.toc_menu_item .toc_menu_icon {
display:block;
position:relative;
color: #888;
height:1.5em;
line-height:1.5em;
text-align:center;
}
.toc_menu_item .toc_menu_icon:before {
display:inline-block;
line-height: inherit;
color:inherit;
}
.toc_menu_item .toc_menu_icon_default:before {
content: ' ';
margin-top: 0.75em;
@include box(0.5em, 1px);
background-color: #888;
}
.toc_menu_item:hover .toc_menu_icon,
.toc_menu_item_active .toc_menu_icon {
color: #292929;
}
.toc_menu_item:hover .toc_menu_icon_default:before,
.toc_menu_item_active .toc_menu_icon_default:before {
background-color: #292929;
}
.toc_menu_item_active .toc_menu_icon_default:before {
width: 1.5em;
}
.toc_menu_item .toc_menu_description {
@include abs-rt(-20em, 0, '');
opacity:0;
white-space:nowrap;
@include transition-all(.6s, ease-out);
}
.toc_menu_item:hover .toc_menu_description {
right: 100%;
margin-right: 1.5em;
opacity:1;
}
// TOC menu in the side menu
.menu_side_inner #toc_menu {
display:block;
position:relative;
z-index:0;
@include transition-property(top);
}
.menu_side_icons #toc_menu {
left:0;
top:0;
margin:0;
}
.menu_side_icons .toc_menu_item .toc_menu_description {
height: 6rem;
@include font(1.0667em, 6rem, bold);
text-transform:uppercase;
top: 0;
}
.menu_side_icons .toc_menu_item:hover .toc_menu_description {
margin-right:0;
}
.menu_side_icons .toc_menu_item .toc_menu_description span {
display:inline-block;
vertical-align:middle;
padding: 0 3em;
letter-spacing:1px;
}
.menu_side_icons .toc_menu_item .toc_menu_icon {
@include box(100%, 6rem, 6rem);
@include content-box;
border-bottom: 1px solid #ddd;
}
.menu_side_icons .toc_menu_item .toc_menu_icon:before {
@include font(2rem, inherit, normal);
}
.menu_side_dots #toc_menu .toc_menu_item .toc_menu_icon {
text-align:center;
}
.menu_side_dots #toc_menu .toc_menu_item .toc_menu_icon_default:before {
content: ' ';
@include box(5px, 5px, inherit);
@include border-round;
}
.menu_side_dots #toc_menu .toc_menu_item_active .toc_menu_icon_default:before {
@include square(9px);
}
.menu_side_left .toc_menu_item .toc_menu_description {
left: -20em;
right: auto;
}
.menu_side_left .toc_menu_item:hover .toc_menu_description {
left: 100%;
right: auto;
}
[class*="scheme_"].menu_side_icons .toc_menu_item .toc_menu_icon,
.menu_side_inner > .toc_menu_item .toc_menu_icon {
background-color: var(--theme-color-bg_color);
border-color: var(--theme-color-bd_color);
color: var(--theme-color-text_link);
}
[class*="scheme_"].menu_side_icons .toc_menu_item:hover .toc_menu_icon,
[class*="scheme_"].menu_side_icons .toc_menu_item_active .toc_menu_icon,
.menu_side_inner > .toc_menu_item:hover .toc_menu_icon,
.menu_side_inner > .toc_menu_item_active .toc_menu_icon {
background-color: var(--theme-color-text_link);
color: var(--theme-color-inverse_link);
}
[class*="scheme_"].menu_side_icons .toc_menu_icon_default:before,
.menu_side_inner > .toc_menu_icon_default:before {
background-color: var(--theme-color-text_link);
}
[class*="scheme_"].menu_side_icons .toc_menu_item:hover .toc_menu_icon_default:before,
[class*="scheme_"].menu_side_icons .toc_menu_item_active .toc_menu_icon_default:before,
.menu_side_inner > .toc_menu_item:hover .toc_menu_icon_default:before,
.menu_side_inner > .toc_menu_item_active .toc_menu_icon_default:before {
background-color: var(--theme-color-text_dark);
}
[class*="scheme_"].menu_side_icons .toc_menu_item .toc_menu_description,
.menu_side_inner > .toc_menu_item .toc_menu_description {
color: var(--theme-color-inverse_link);
background-color: var(--theme-color-text_link);
}
[class*="scheme_"].menu_side_dots #toc_menu .toc_menu_item .toc_menu_icon {
background-color: var(--theme-color-alter_bg_color);
color: var(--theme-color-alter_text);
}
[class*="scheme_"].menu_side_dots #toc_menu .toc_menu_item:hover .toc_menu_icon,
[class*="scheme_"].menu_side_dots #toc_menu .toc_menu_item_active .toc_menu_icon {
color: var(--theme-color-alter_link);
}
[class*="scheme_"].menu_side_dots #toc_menu .toc_menu_item .toc_menu_icon:before {
background-color: var(--theme-color-alter_link);
}
[class*="scheme_"].menu_side_dots #toc_menu .toc_menu_item:hover .toc_menu_icon:before {
background-color: var(--theme-color-alter_hover);
}
/* Mobile header
---------------------------------------- */
/* Animation */
@-webkit-keyframes fadeInAnim {
0% {opacity: 0;}
100% {opacity: 1;}
}
@keyframes fadeInAnim {
0% {opacity: 0;}
100% {opacity: 1;}
}
@-webkit-keyframes fadeOutAnim {
0% {opacity: 1;}
100% {opacity: 0;}
}
@keyframes fadeOutAnim {
0% {opacity: 1;}
100% {opacity: 0;}
}
@-webkit-keyframes fadeInAnimScale {
0% {opacity: 0; -webkit-transform:scale(0.2) rotate(0);}
100% {opacity: 1; -webkit-transform:scale(1) rotate(180deg);}
}
@keyframes fadeInAnimScale {
0% {opacity: 0; transform:scale(0.2) rotate(0);}
100% {opacity: 1; transform:scale(1) rotate(180deg);}
}
@-webkit-keyframes fadeOutAnimScale {
0% {opacity: 1; -webkit-transform:scale(1) rotate(180deg);}
100% {opacity: 0; -webkit-transform:scale(0.2) rotate(0);}
}
@keyframes fadeOutAnimScale {
0% {opacity: 1; transform:scale(1) rotate(180deg);}
100% {opacity: 0; transform:scale(0.2) rotate(0);}
}
@-webkit-keyframes fadeInRightPanel {
0% {opacity: 0; -webkit-transform: translateX(30px) ;}
100% {opacity: 1; -webkit-transform: translateX(0) ;}
}
@keyframes fadeInRightPanel {
0% {opacity: 0; transform: translateX(30px) ;}
100% {opacity: 1; transform: translateX(0) ;}
}
@-webkit-keyframes fadeOutRightPanel {
0% {opacity: 1; -webkit-transform: translateX(0) ;}
100% {opacity: 0;-webkit-transform: translateX(20px) ;}
}
@keyframes fadeOutRightPanel {
0% {opacity: 1; transform: translateX(0) ;}
100% {opacity: 0; transform: translateX(20px) ;}
}
@-webkit-keyframes fadeInMove {
0% {opacity: 0; -webkit-transform: scale3d(0, 1, 1);}
10% {opacity: 1; -webkit-transform: scale3d(0.1, 1, 1); }
100% {opacity: 0.14; -webkit-transform: scale3d(1, 1, 1); }
}
@keyframes fadeInMove {
0% {opacity: 0; transform: scale3d(0, 1, 1); }
10% {opacity: 1; transform: scale3d(0.1, 1, 1); }
100% {opacity: 0.14; transform: scale3d(1, 1, 1); }
}
@-webkit-keyframes fadeOutMove {
0% {opacity: 0.14; -webkit-transform: scale3d(1, 1, 1); }
100% {opacity: 0.14; -webkit-transform: scale3d(0, 1, 1); }
}
@keyframes fadeOutMove {
0% {opacity: 0.14; transform: scale3d(1, 1, 1); }
100% {opacity: 0.14; transform: scale3d(0, 1, 1); }
}
@-webkit-keyframes fadeOutMove2 {
0% {opacity: 0.8; -webkit-transform: scale3d(1, 1, 1); }
100% {opacity: 0.14; -webkit-transform: scale3d(0, 1, 1); }
}
@keyframes fadeOutMove2 {
0% {opacity: 0.8; transform: scale3d(1, 1, 1); }
100% {opacity: 0.14; transform: scale3d(0, 1, 1); }
}
.top_panel_mobile_info p {
margin:0;
}
/* Panel Mobile Menu
+++++++++++++++++++++++++++++++++++ */
/* Admin Bar Panel Menu */
.admin-bar .sc_layouts_panel_menu {
top: 32px;
&.opened,
&.sc_layouts_panel_menu_fullscreen.opened {
height: calc(100% - 32px) !important;
}
&.sc_layouts_panel_menu_narrow.opened {
height: calc(75% - 32px) !important;
}
}
@media (max-width: 782px) {
.admin-bar .sc_layouts_panel_menu {
top: 46px;
&.opened,
&.sc_layouts_panel_menu_fullscreen.opened {
height: calc(100% - 46px) !important;
}
&.sc_layouts_panel_menu_narrow.opened {
height: calc(75% - 46px) !important;
}
}
}
@media (max-width: 600px) {
.admin-bar .sc_layouts_panel_menu {
top: 0;
&.opened,
&.sc_layouts_panel_menu_fullscreen.opened {
height: 100% !important;
}
&.sc_layouts_panel_menu_narrow.opened {
height: 100% !important;
}
}
}
.sc_layouts_panel_menu_overlay {
display:none;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index:8001;
@include box(100%, 100%);
background-color: var(--theme-color-alter_bg_color);
opacity: .1;
}
.sc_layouts_panel_menu {
.elementor-section.elementor-section-height-full > .elementor-container {
height: 100%;
}
@include fixed-lt(0, 0, 100002);
@include box(100%, 0);
will-change: height;
@include transition(height .5s cubic-bezier(0.5, 1, 0.89, 1));
&.sc_layouts_panel_menu_fullscreen.opened {
height:100%;
}
&.sc_layouts_panel_menu_narrow.opened {
height: 75%;
}
&.sc_layouts_panel_menu_narrow .sc_layouts_panel_menu_inner {
overflow-x: hidden;
overflow-y: scroll;
-ms-overflow-style: none;
scrollbar-width:none;
&::-webkit-scrollbar { width:0 }
}
.sc_layouts_panel_menu_inner {
@include abs-cover;
height: 100%;
width: 100%;
overflow:hidden;
@include border-box;
color: var(--theme-color-alter_text);
background-color: var(--theme-color-alter_bg_color);
> .elementor,
.elementor-section-wrap,
.elementor-inner,
.elementor-section.elementor-section-height-full {
height: 100%;
min-height: auto;
}
}
.sc_layouts_panel_menu_inner > p {
margin: 0;
}
/* Panel Menu Header */
.panel_menu_header {
padding: 60px 50px;
}
/* Close Button */
&.scheme_default .sc_layouts_panel_menu_close .sc_layouts_panel_menu_close_text,
&.scheme_light .sc_layouts_panel_menu_close .sc_layouts_panel_menu_close_text {
color: var(--theme-color-alter_dark);
}
.sc_layouts_panel_menu_close {
display: inline-block;
@include abs-rt(65px, 60px);
margin: 0 !important;
line-height: 1em;
@include flex;
@include flex-justify-content(center);
@include flex-align-items(center);
cursor: pointer;
color: var(--theme-color-alter_dark);
@include transition(color .3s ease);
&:hover {
color: var(--theme-color-alter_dark);
}
.sc_layouts_panel_menu_close_icon {
@include font(19px, '', 400);
position: relative;
z-index: 1;
@include border-box;
@include transform(rotate(0));
@include transition(transform .3s ease-out);
color: var(--theme-color-alter_dark);
&:before {
position: relative;
z-index: 1;
content:'\e9e1';
font-family:$theme_icons;
line-height: 1;
text-align: center;
}
}
&:hover .sc_layouts_panel_menu_close_icon {
@include transform(rotate(180deg));
}
.sc_layouts_panel_menu_close_text {
@include font(17px, 1em, 400);
margin-right: 0.9em;
color: var(--theme-color-alter_light);
}
}
/* Menu */
/* specific scheme colors */
&.scheme_default .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown .sc_layouts_menu_nav li > a,
&.scheme_default .sc_layouts_menu_dir_horizontal .sc_layouts_menu_nav li > a,
&.scheme_light .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown .sc_layouts_menu_nav li > a,
&.scheme_light .sc_layouts_menu_dir_horizontal .sc_layouts_menu_nav li > a {
color: var(--theme-color-alter_dark);
&:hover {
color: var(--theme-color-alter_dark) !important;
}
}
&.scheme_default .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown .sc_layouts_menu_nav li[class*="icon-"]:before,
&.scheme_default .sc_layouts_menu_dir_horizontal .sc_layouts_menu_nav li[class*="icon-"]:before,
&.scheme_light .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown .sc_layouts_menu_nav li[class*="icon-"]:before,
&.scheme_light .sc_layouts_menu_dir_horizontal .sc_layouts_menu_nav li[class*="icon-"]:before {
color: var(--theme-color-alter_dark);
}
&.scheme_default .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown .sc_layouts_menu_nav > li li > a,
&.scheme_default .sc_layouts_menu_dir_horizontal .sc_layouts_menu_nav > li li > a,
&.scheme_light .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown .sc_layouts_menu_nav > li li > a,
&.scheme_light .sc_layouts_menu_dir_horizontal .sc_layouts_menu_nav > li li > a {
color: var(--theme-color-alter_dark) !important;
&:hover {
color: var(--theme-color-alter_link) !important;
}
}
&.scheme_default .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown .sc_layouts_menu_nav > li li.opened > a,
&.scheme_default .sc_layouts_menu_dir_horizontal .sc_layouts_menu_nav > li li.opened > a,
&.scheme_light .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown .sc_layouts_menu_nav > li li.opened > a,
&.scheme_light .sc_layouts_menu_dir_horizontal .sc_layouts_menu_nav > li li.opened > a {
color: var(--theme-color-alter_link) !important;
}
/* Vertical Dropdown */
/* align center */
.sc_layouts_column_align_center .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown {
.sc_layouts_menu_nav {
> li > a,
> li[class*="icon-"] > a,
> li.menu-item-has-children > a {
padding: 5px 4.4rem;
}
li[class*="icon-"]:before {
left: 50%;
@include transform(translateX(-12rem));
}
> li ul li > a,
> li li li[class*="icon-"] > a,
> li:last-child ul li > a {
padding: 0.4rem 3.9rem;
}
> li li[class*="icon-"]:before {
margin-left: 0;
}
}
}
/* align right */
.sc_layouts_column_align_right .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown {
.sc_layouts_menu_nav {
li.menu-item-has-children > a > .open_child_menu {
right: auto;
left: 0;
&:before {
content: '\EA07';
left: 10px;
right: auto;
@include transition(left .3s ease-out, color .3s ease, opacity .3s ease-out);
}
}
li.opened > a > .open_child_menu:before,
li > a:hover > .open_child_menu:before {
right: auto;
left: 0;
opacity: 1;
}
> li > a,
> li.menu-item-has-children > a {
padding-right: 0 !important;
padding-left: 2rem;
}
li[class*="icon-"]:before {
left: auto;
right: 0;
}
> li[class*="icon-"].menu-item-has-children > a {
padding-right: 2.2rem !important;
}
li[class*="icon-"] > a {
padding-right: 2.2rem !important;
}
> li.menu-item-has-children > a {
padding-left: 4.4rem ;
}
> li li[class*="icon-"] > a {
padding-right: 3.4rem !important;
}
> li li[class*="icon-"]:before {
margin-right: 1.8rem;
margin-left: 0;
}
> li ul li.menu-item-has-children > a,
> li:last-child ul li.menu-item-has-children > a {
padding-right: 1.7rem;
padding-left: 3.9rem;
}
> li li li > a {
padding-right: 3.9rem;
padding-left: 3.9rem;
}
> li ul li li.menu-item-has-children > a {
padding-right: 3.9rem;
}
> li li li[class*="icon-"] > a {
padding-right: 5.3rem !important;
}
> li li li[class*="icon-"]:before {
margin-left: 0;
margin-right: 3.8rem;
}
> li li li li > a {
padding-right: 5.8rem;
padding-left: 3.9rem;
}
> li ul li li li.menu-item-has-children > a {
padding-right: 5.8rem;
}
li li li li[class*="icon-"] > a {
padding-right: 7.3rem !important;
padding-left: 3.9rem;
}
li li li li[class*="icon-"]:before {
margin-left: 0;
margin-right: 5.8rem;
}
}
}
/* Vertical Menu Extra */
&.sc_layouts_vertical_menu_extra .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown,
&.sc_layouts_vertical_menu_extra .sc_layouts_column_align_left .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown {
.sc_layouts_menu_nav {
> li > a,
> li.menu-item-has-children > a {
padding: 5px 0;
}
> li ul li > a,
> li:last-child ul li > a {
padding: 0.4rem 0;
}
li[class*="icon-"]:before,
> li li[class*="icon-"]:before {
display: none;
}
ul > li > ul {
font-size: 17px;
padding: 0.2em 0;
}
> li.menu-item-has-children > a {
padding-left: 0 !important;
padding-right: 0 !important;
}
li.menu-item-has-children > a > .open_child_menu {
display: none !important;
}
> li ul li.menu-item-has-children > a,
> li:last-child ul li.menu-item-has-children > a {
padding-left: 0 !important;
padding-right: 0 !important;
}
> li li li > a {
padding: 0.25em 0;
}
}
}
&.sc_layouts_vertical_menu_extra .sc_layouts_column_align_center .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown {
.sc_layouts_menu_nav {
> li li li[class*="icon-"] > a,
> li:last-child ul li > a {
padding: 0.25em 0;
}
}
}
&.sc_layouts_vertical_menu_extra .sc_layouts_column_align_right .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown {
.sc_layouts_menu_nav {
> li > a,
> li.menu-item-has-children > a,
> li[class*="icon-"].menu-item-has-children > a {
padding-left: 0 !important;
padding-right: 0 !important;
}
> li li > a{
padding-right: 0;
padding-left: 0;
}
> li li[class*="icon-"] > a {
padding-left: 0;
padding-right: 0 !important;
}
> li ul li.menu-item-has-children > a {
padding-right: 0;
}
> li ul li li.menu-item-has-children > a {
padding-right: 0;
}
> li li li > a {
padding-right: 0;
}
> li li li li > a {
padding-right: 0;
}
> li ul li li li.menu-item-has-children > a {
padding-right: 0;
}
}
}
/* Vertical Menu Default */
.sc_layouts_menu_dir_vertical.sc_layouts_submenu_popup {
.sc_layouts_menu_nav {
> li > a,
> li.menu-item-has-children > a {
padding: 0.25em 0;
}
> li li > a {
color: var(--theme-color-extra_text) !important;
}
> li li > a:hover,
> li li.sfHover > a {
color: var(--theme-color-extra_hover) !important;
}
}
}
.sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown {
display: block;
overflow-x: hidden;
overflow-y: scroll;
max-height: 45vH;
-ms-overflow-style: none;
scrollbar-width:none;
&::-webkit-scrollbar { width:0 }
.sc_layouts_menu_nav {
@include font(38px, 1.5em, 500);
letter-spacing: 0.6px;
text-align: inherit;
ul {
padding: 1em 0;
margin: 0;
}
> li {
display: block;
float: none;
width: 100%;
}
> li ul {
text-align: inherit;
}
li > a {
position: relative;
width: auto;
display: inline-block;
@include border-box;
@include transition(color .3s ease);
color: var(--theme-color-alter_text);
}
li > a:hover {
color: var(--theme-color-alter_dark) !important;
}
> li li > a {
color: var(--theme-color-alter_text) !important;
}
> li li.opened > a,
> li li > a:hover {
color: var(--theme-color-alter_dark) !important;
}
> li > ul {
padding: 1em 0 0.6em;
@include font(19px, 1.5em, 500);
letter-spacing: 0.6px;
text-align: inherit;
}
> li > a,
> li.menu-item-has-children > a {
padding: 5px 2rem 5px 0;
}
> li.menu-item-has-children > a {
padding-right: 4.4rem !important;
}
> li ul li > a,
> li:last-child ul li > a {
padding: 0.4rem 1.7rem;
}
> li ul > li > a {
letter-spacing: 0.6px;
}
> li ul li.menu-item-has-children > a,
> li:last-child ul li.menu-item-has-children > a {
padding-right: 3.9rem;
}
> li li li > a {
padding-left: 3.9rem;
}
> li li li li > a {
padding-left: 5.8rem;
}
li.menu-item-has-children > a > .open_child_menu {
display: block;
width: auto;
position: absolute;
z-index: 1;
top: 0;
right: 0;
bottom: auto;
padding: 0;
@include transition(color .3s ease, background-color .3s ease, border-color .3s ease);
line-height: inherit;
}
li > a > .open_child_menu:before,
li.menu-item-has-children > a > .open_child_menu:before {
font-family: $theme_icons;
content: '\E9A4';
display: inline-block;
@include font(16px, '', 400);
position: relative;
right: 10px;
opacity: 0;
@include transition(right 0.3s ease-out, color 0.3s ease, opacity 0.3s ease);
}
> li ul li.menu-item-has-children > a > .open_child_menu {
top: 4px;
}
> li ul li > a > .open_child_menu:before,
> li ul li.menu-item-has-children > a > .open_child_menu:before {
@include font(8px, '', 400);
}
li.opened > a > .open_child_menu:before,
li > a:hover > .open_child_menu:before {
right: 0;
opacity: 1;
}
> li[class*="icon-"] > a {
padding-left: 2.2rem;
}
li[class*="icon-"]:before {
@include font(24px, inherit, 400);
display: inline-block;
padding: 0;
width: 1em;
position: absolute;
top: 9px;
left: 0;
@include transition(color .3s ease);
color: inherit;
}
> li li[class*="icon-"] > a {
padding-left: 3.3rem;
}
> li li[class*="icon-"]:before {
font-size: 18px;
margin-left: 1.8rem;
top: 8px;
}
> li li li[class*="icon-"] > a {
padding-left: 5.5rem;
}
> li li li[class*="icon-"]:before {
margin-left: 3.9rem;
}
> li li li li[class*="icon-"] > a {
padding-left: 7.3rem;
}
> li li li li[class*="icon-"]:before {
margin-left: 5.7rem;
}
}
}
/* Horizontal */
.sc_layouts_menu_dir_horizontal {
.sc_layouts_menu_nav {
@include font(30px, 1.5em, 500);
margin-left: -0.75em;
li > a {
@include transition(color .3s ease);
color: var(--theme-color-alter_text);
}
> li ul,
> li:last-child ul {
background-color: transparent;
@include box-shadow(none);
}
> li > ul {
@include font(18px, 1.5em, 400);
top: 3.6em;
left: -0.2em;
}
> li ul:not(.sc_item_filters_tabs) {
width: 12em;
background-color: var(--theme-color-alter_bg_color);
}
> li > ul ul {
left: 12em;
margin: 0;
}
> li > a,
> li.menu-item-has-children > a {
padding: 0.5em 0.75em;
}
> li > a {
color: var(--theme-color-alter_text);
}
> li > a:hover,
> li.sfHover > a {
color: var(--theme-color-alter_dark) !important;
}
> li li > a {
padding: 0.45em 1.6em;
letter-spacing: 0.7px;
color: var(--theme-color-alter_text) !important;
}
> li li > a:hover,
> li li.sfHover > a,
> li li.current-menu-item > a,
> li li.current-menu-parent > a,
> li li.current-menu-ancestor > a {
color: var(--theme-color-alter_dark) !important;
}
li li.menu-item-has-children > a:after {
content: '\E9DF';
@include font(9px, '', 400);
top: 1em;
right: 0;
color: inherit !important;
}
> li[class*="icon-"] + li[class*="icon-"],
> li + li[class*="icon-"],
> li[class*="icon-"] + li {
margin-left: 1em;
}
> li[class*="icon-"] > a {
padding-left: 1.3em;
}
> li[class*="icon-"]:before {
font-size: 24px;
color: inherit;
padding: 0.8em 0;
top: 0;
left: 0;
}
> li li[class*="icon-"] > a {
padding-left: 3em;
}
> li li[class*="icon-"]:before {
position: absolute;
z-index: 1;
top: 50%;
left: 1.5em;
@include translateY(-50%);
color: inherit;
}
}
&.menu_hover_color_line > ul > li:not(.menu-collapse) > a:before,
&.menu_hover_color_line > ul > li:not(.menu-collapse) > a:after,
&.menu_hover_color_line > ul > li:not(.menu-collapse).menu-item-has-children > a:after {
top: 2.3em;
}
&.menu_hover_color_line > ul > li:not(.menu-collapse).menu-item-has-children > a:before,
&.menu_hover_color_line > ul > li:not(.menu-collapse).menu-item-has-children > a:after {
right: 1em !important;
}
&.menu_hover_color_line .sc_layouts_menu_nav > li:not(.menu-collapse) > a:after,
&.menu_hover_color_line .sc_layouts_menu_nav > li:not(.menu-collapse).menu-item-has-children > a:after {
background-color: var(--theme-color-text_dark);
}
}
.sc_layouts_column_align_right .sc_layouts_menu_dir_horizontal,
.sc_layouts_column_align_center .sc_layouts_menu_dir_horizontal {
.sc_layouts_menu_nav > li:first-child > a,
.sc_layouts_menu_nav > li.menu-item-has-children:first-child > a {
padding-left: 0.75em;
}
}
.sc_layouts_column_align_right .sc_layouts_menu_dir_horizontal {
.sc_layouts_menu_nav > li:last-child > a,
.sc_layouts_menu_nav > li.menu-item-has-children:last-child > a {
padding-right: 0;
}
}
/* Socials */
.sc_socials.sc_socials_default .socials_wrap .social_item {
margin-right: 4px;
@include transition(color .3s ease);
.social_icon {
color: var(--theme-color-alter_dark);
border-color: var(--theme-color-alter_dark_015);
}
&:hover .social_icon[class*="facebook"] {
color: #4F5FBF !important;
}
&:hover .social_icon[class*="twitter"] {
color: #48BDE9 !important;
}
&:hover .social_icon[class*="dribble"] {
color: #EA4C89 !important;
}
&:hover .social_icon[class*="instagram"] {
color: #C41BD1 !important;
}
}
/* Widget Socials */
.sc_widget_socials .socials_wrap .social_item {
font-size: 17px;
margin-right: 32px;
@include transition(color .3s ease);
.social_icon {
padding: 0 1px;
@include box(auto, auto, inherit);
text-align: left;
color: var(--theme-color-alter_dark) !important;
background-color: transparent !important;
&:hover {
background-color: transparent !important;
}
&[class*="facebook"]:hover {
color: #4F5FBF !important;
}
&[class*="twitter"]:hover {
color: #48BDE9 !important;
}
&[class*="dribble"]:hover {
color: #EA4C89 !important;
}
&[class*="instagram"]:hover {
color: #C41BD1 !important;
}
}
}
/* Socials with names */
.sc_layouts_column_align_center .sc_socials.sc_socials_icons_names .socials_wrap {
@include flex-justify-content(center);
}
.sc_layouts_column_align_right .sc_socials.sc_socials_icons_names .socials_wrap {
@include flex-justify-content(flex-end);
}
.sc_socials.sc_socials_icons_names .socials_wrap {
@include flex;
@include flex-justify-content(flex-start);
.social_item {
padding: 0 1px;
@include flex;
@include flex-align-items(center);
margin-right: 1.3em;
@include transition(color .3s ease);
color: var(--theme-color-alter_dark);
&:hover .social_icon {
color: var(--theme-color-alter_dark);
&[class*="facebook"] {
color: #4F5FBF !important;
}
&[class*="twitter"] {
color: #48BDE9 !important;
}
&[class*="dribble"] {
color: #EA4C89 !important;
}
&[class*="instagram"] {
color: #C41BD1 !important;
}
}
&:hover .social_name {
color: var(--theme-color-alter_dark);
}
&:last-child{
margin-right: 0;
}
.social_icon {
padding: 0 1px;
@include box(auto, auto, inherit);
text-align: left;
+ .social_name {
@include font(13px, 17px, 500);
margin: 0 0 0 8px;
}
}
}
}
.section_divider .elementor-container {
padding-top: 30px;
padding-bottom: 30px;
}
.section_divider .elementor-container:before {
content: '';
display: block;
height: 1px;
width: 100%;
@include abs-lt;
background-color: var(--theme-color-alter_dark);
}
/* Animation
+++++++++++++++++++++++++++ */
/* Close button animation */
.sc_layouts_panel_menu_close .sc_layouts_panel_menu_close_icon,
.sc_layouts_panel_menu_close .sc_layouts_panel_menu_close_text {
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
visibility:hidden;
}
&.opened .sc_layouts_panel_menu_close .sc_layouts_panel_menu_close_icon,
&.opened .sc_layouts_panel_menu_close .sc_layouts_panel_menu_close_text {
-webkit-animation-name: fadeIn;
animation-name: fadeIn;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.opened .sc_layouts_panel_menu_close .sc_layouts_panel_menu_close_icon {
-webkit-animation-name: fadeInAnimScale;
animation-name: fadeInAnimScale;
-webkit-animation-fill-mode: backwards;
animation-fill-mode: backwards;
transform-origin: 50% 54%;
}
&.out_anim .sc_layouts_panel_menu_close .sc_layouts_panel_menu_close_icon,
&.out_anim .sc_layouts_panel_menu_close .sc_layouts_panel_menu_close_text {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility:visible;
}
&.out_anim .sc_layouts_panel_menu_close .sc_layouts_panel_menu_close_icon {
-webkit-animation-name: fadeOutAnimScale;
animation-name: fadeOutAnimScale;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
/* Panel with menu style 1 */
/* Logo animation */
.ps1-anim1 .sc_layouts_logo {
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
visibility:hidden;
@include transition(color .3s ease);
}
&.opened .ps1-anim1 .sc_layouts_logo {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps1-anim1 .sc_layouts_logo {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
-o-animation-delay: 0.7s;
animation-delay: 0.7s;
visibility:visible;
}
/* Vertical dropdown menu animation */
.ps1-anim2 .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown > ul > li {
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility:hidden;
&:nth-child(2) {
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
-o-animation-delay: 0.6s;
animation-delay: 0.6s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
-o-animation-delay: 0.7s;
animation-delay: 0.7s;
}
&:nth-child(4) {
-webkit-animation-delay: 0.8s;
-moz-animation-delay: 0.8s;
-o-animation-delay: 0.8s;
animation-delay: 0.8s;
}
&:nth-child(5) {
-webkit-animation-delay: 0.9s;
-moz-animation-delay: 0.9s;
-o-animation-delay: 0.9s;
animation-delay: 0.9s;
}
&:nth-child(6) {
-webkit-animation-delay: 1s;
-moz-animation-delay: 1s;
-o-animation-delay: 1s;
animation-delay: 1s;
}
&:nth-child(7) {
-webkit-animation-delay: 1.1s;
-moz-animation-delay: 1.1s;
-o-animation-delay: 1.1s;
animation-delay: 1.1s;
}
}
&.opened .ps1-anim2 .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown > ul > li {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps1-anim2 .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown > ul > li {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
-o-animation-delay: 0.6s;
animation-delay: 0.6s;
visibility:visible;
&:nth-child(2) {
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.4s;
-moz-animation-delay: 0.4s;
-o-animation-delay: 0.4s;
animation-delay: 0.4s;
}
&:nth-child(4) {
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
}
&:nth-child(5) {
-webkit-animation-delay: 0.2s;
-moz-animation-delay: 0.2s;
-o-animation-delay: 0.2s;
animation-delay: 0.2s;
}
&:nth-child(6) {
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
}
&:nth-child(7) {
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
}
}
/* Elementor heading title animation */
.ps1-anim3 .elementor-heading-title {
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility:hidden;
}
&.opened .ps1-anim3 .elementor-heading-title {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps1-anim3 .elementor-heading-title {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
-o-animation-delay: 0.7s;
animation-delay: 0.7s;
visibility: visible;
}
/* Text Editor title animation */
.ps1-anim4.elementor-widget-text-editor h1,
.ps1-anim4.elementor-widget-text-editor h2,
.ps1-anim4.elementor-widget-text-editor h3,
.ps1-anim4.elementor-widget-text-editor h4,
.ps1-anim4.elementor-widget-text-editor h5,
.ps1-anim4.elementor-widget-text-editor h6 {
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
-o-animation-delay: 0.6s;
animation-delay: 0.6s;
visibility:hidden;
}
&.opened .ps1-anim4.elementor-widget-text-editor h1,
&.opened .ps1-anim4.elementor-widget-text-editor h2,
&.opened .ps1-anim4.elementor-widget-text-editor h3,
&.opened .ps1-anim4.elementor-widget-text-editor h4,
&.opened .ps1-anim4.elementor-widget-text-editor h5,
&.opened .ps1-anim4.elementor-widget-text-editor h6 {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps1-anim4.elementor-widget-text-editor h1,
&.out_anim .ps1-anim4.elementor-widget-text-editor h2,
&.out_anim .ps1-anim4.elementor-widget-text-editor h3,
&.out_anim .ps1-anim4.elementor-widget-text-editor h4,
&.out_anim .ps1-anim4.elementor-widget-text-editor h5,
&.out_anim .ps1-anim4.elementor-widget-text-editor h6 {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
-o-animation-delay: 0.6s;
animation-delay: 0.6s;
visibility: visible;
}
/* Paragraph animation */
.ps1-anim5.elementor-widget-text-editor p > a {
@include transition(color .3s ease);
}
.ps1-anim5.elementor-widget-text-editor p {
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
-o-animation-delay: 0.7s;
animation-delay: 0.7s;
visibility:hidden;
}
&.opened .ps1-anim5.elementor-widget-text-editor p {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps1-anim5.elementor-widget-text-editor p {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility: visible;
}
/* Socials animation */
.ps1-anim6 .sc_socials .socials_wrap .social_item,
.ps1-anim6 .sc_widget_socials .socials_wrap .social_item {
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility:hidden;
&:nth-child(2) {
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
-o-animation-delay: 0.6s;
animation-delay: 0.6s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
-o-animation-delay: 0.7s;
animation-delay: 0.7s;
}
&:nth-child(4) {
-webkit-animation-delay: 0.8s;
-moz-animation-delay: 0.8s;
-o-animation-delay: 0.8s;
animation-delay: 0.8s;
}
&:nth-child(5) {
-webkit-animation-delay: 0.9s;
-moz-animation-delay: 0.9s;
-o-animation-delay: 0.9s;
animation-delay: 0.9s;
}
}
&.opened .ps1-anim6 .sc_socials .socials_wrap .social_item,
&.opened .ps1-anim6 .sc_widget_socials .socials_wrap .social_item {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps1-anim6 .sc_socials .socials_wrap .social_item,
&.out_anim .ps1-anim6 .sc_widget_socials .socials_wrap .social_item {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
-o-animation-delay: 0.6s;
animation-delay: 0.6s;
visibility: visible;
&:nth-child(2) {
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.4s;
-moz-animation-delay: 0.4s;
-o-animation-delay: 0.4s;
animation-delay: 0.4s;
}
&:nth-child(4) {
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
}
&:nth-child(5) {
-webkit-animation-delay: 0.2s;
-moz-animation-delay: 0.2s;
-o-animation-delay: 0.2s;
animation-delay: 0.2s;
}
}
/* Panel with menu style 2 */
.ps2-anim1 .sc_layouts_logo {
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
visibility:hidden;
@include transition(color .3s ease);
}
&.opened .ps2-anim1 .sc_layouts_logo {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps2-anim1 .sc_layouts_logo {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
-o-animation-delay: 0.7s;
animation-delay: 0.7s;
visibility:visible;
}
/* Horizontal & vertical menu */
.ps2-anim2 .sc_layouts_menu_dir_vertical > ul > li,
.ps2-anim2 .sc_layouts_menu_dir_horizontal > ul > li {
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility:hidden;
&:nth-child(2) {
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
-o-animation-delay: 0.6s;
animation-delay: 0.6s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
-o-animation-delay: 0.7s;
animation-delay: 0.7s;
}
&:nth-child(4) {
-webkit-animation-delay: 0.8s;
-moz-animation-delay: 0.8s;
-o-animation-delay: 0.8s;
animation-delay: 0.8s;
}
&:nth-child(5) {
-webkit-animation-delay: 0.9s;
-moz-animation-delay: 0.9s;
-o-animation-delay: 0.9s;
animation-delay: 0.9s;
}
&:nth-child(6) {
-webkit-animation-delay: 1s;
-moz-animation-delay: 1s;
-o-animation-delay: 1s;
animation-delay: 1s;
}
&:nth-child(7) {
-webkit-animation-delay: 1.1s;
-moz-animation-delay: 1.1s;
-o-animation-delay: 1.1s;
animation-delay: 1.1s;
}
}
&.opened .ps2-anim2 .sc_layouts_menu_dir_vertical > ul > li,
&.opened .ps2-anim2 .sc_layouts_menu_dir_horizontal > ul > li {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps2-anim2 .sc_layouts_menu_dir_vertical > ul > li,
&.out_anim .ps2-anim2 .sc_layouts_menu_dir_horizontal > ul > li {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
-o-animation-delay: 0.6s;
animation-delay: 0.6s;
visibility:visible;
&:nth-child(2) {
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.4s;
-moz-animation-delay: 0.4s;
-o-animation-delay: 0.4s;
animation-delay: 0.4s;
}
&:nth-child(4) {
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
}
&:nth-child(5) {
-webkit-animation-delay: 0.2s;
-moz-animation-delay: 0.2s;
-o-animation-delay: 0.2s;
animation-delay: 0.2s;
}
&:nth-child(6) {
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
}
&:nth-child(7) {
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
}
}
/* Divider */
.ps2-anim3 .elementor-divider-separator {
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility:hidden;
@include transform-origin(left center);
--divider-border-color: var(--theme-color-alter_dark);
--divider-color: var(--theme-color-alter_dark);
}
&.opened .ps2-anim3 .elementor-divider-separator {
-webkit-animation-name: fadeInMove;
animation-name: fadeInMove;
-webkit-animation-duration: 0.7s;
animation-duration: 0.7s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps2-anim3 .elementor-divider-separator {
-webkit-animation-name: fadeOutMove;
animation-name: fadeOutMove;
-webkit-animation-duration: 0.8s;
animation-duration: 0.8s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
visibility:visible;
}
/* Socials animation */
.ps2-anim4 .sc_socials .socials_wrap .social_item,
.ps2-anim4 .sc_widget_socials .socials_wrap .social_item {
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
-o-animation-delay: 0.6s;
animation-delay: 0.6s;
visibility:hidden;
&:nth-child(2) {
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
-o-animation-delay: 0.7s;
animation-delay: 0.7s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.8s;
-moz-animation-delay: 0.8s;
-o-animation-delay: 0.8s;
animation-delay: 0.8s;
}
&:nth-child(4) {
-webkit-animation-delay: 0.9s;
-moz-animation-delay: 0.9s;
-o-animation-delay: 0.9s;
animation-delay: 0.9s;
}
&:nth-child(5) {
-webkit-animation-delay: 1s;
-moz-animation-delay: 1s;
-o-animation-delay: 1s;
animation-delay: 1s;
}
}
&.opened .ps2-anim4 .sc_socials .socials_wrap .social_item,
&.opened .ps2-anim4 .sc_widget_socials .socials_wrap .social_item {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps2-anim4 .sc_socials .socials_wrap .social_item,
&.out_anim .ps2-anim4 .sc_widget_socials .socials_wrap .social_item {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility: visible;
&:nth-child(2) {
-webkit-animation-delay: 0.4s;
-moz-animation-delay: 0.4s;
-o-animation-delay: 0.4s;
animation-delay: 0.4s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
}
&:nth-child(4) {
-webkit-animation-delay: 0.2s;
-moz-animation-delay: 0.2s;
-o-animation-delay: 0.2s;
animation-delay: 0.2s;
}
&:nth-child(5) {
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
}
}
/* Panel with menu style 3 */
/* Logo animation */
.ps3-anim1 .sc_layouts_logo {
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
visibility:hidden;
@include transition(color .3s ease);
}
&.opened .ps3-anim1 .sc_layouts_logo {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps3-anim1 .sc_layouts_logo {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
-o-animation-delay: 0.7s;
animation-delay: 0.7s;
visibility:visible;
}
/* Vertical dropdown menu animation */
.ps3-anim2 .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown > ul > li {
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility:hidden;
&:nth-child(2) {
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
-o-animation-delay: 0.6s;
animation-delay: 0.6s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
-o-animation-delay: 0.7s;
animation-delay: 0.7s;
}
&:nth-child(4) {
-webkit-animation-delay: 0.8s;
-moz-animation-delay: 0.8s;
-o-animation-delay: 0.8s;
animation-delay: 0.8s;
}
&:nth-child(5) {
-webkit-animation-delay: 0.9s;
-moz-animation-delay: 0.9s;
-o-animation-delay: 0.9s;
animation-delay: 0.9s;
}
&:nth-child(6) {
-webkit-animation-delay: 1s;
-moz-animation-delay: 1s;
-o-animation-delay: 1s;
animation-delay: 1s;
}
&:nth-child(7) {
-webkit-animation-delay: 1.1s;
-moz-animation-delay: 1.1s;
-o-animation-delay: 1.1s;
animation-delay: 1.1s;
}
}
&.opened .ps3-anim2 .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown > ul > li {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps3-anim2 .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown > ul > li {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
-o-animation-delay: 0.6s;
animation-delay: 0.6s;
visibility:visible;
&:nth-child(2) {
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.4s;
-moz-animation-delay: 0.4s;
-o-animation-delay: 0.4s;
animation-delay: 0.4s;
}
&:nth-child(4) {
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
}
&:nth-child(5) {
-webkit-animation-delay: 0.2s;
-moz-animation-delay: 0.2s;
-o-animation-delay: 0.2s;
animation-delay: 0.2s;
}
&:nth-child(6) {
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
}
&:nth-child(7) {
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
}
}
/* Divider */
.ps3-anim3 .elementor-divider-separator {
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility:hidden;
@include transform-origin(left center);
--divider-border-color: var(--theme-color-alter_dark);
--divider-color: var(--theme-color-alter_dark);
}
&.opened .ps3-anim3 .elementor-divider-separator {
-webkit-animation-name: fadeInMove;
animation-name: fadeInMove;
-webkit-animation-duration: 0.7s;
animation-duration: 0.7s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps3-anim3 .elementor-divider-separator {
-webkit-animation-name: fadeOutMove;
animation-name: fadeOutMove;
-webkit-animation-duration: 0.8s;
animation-duration: 0.8s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
visibility:visible;
}
/* Socials animation */
.ps3-anim4 .sc_socials .socials_wrap .social_item,
.ps3-anim4 .sc_widget_socials .socials_wrap .social_item {
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
-o-animation-delay: 0.6s;
animation-delay: 0.6s;
visibility:hidden;
&:nth-child(2) {
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
-o-animation-delay: 0.7s;
animation-delay: 0.7s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.8s;
-moz-animation-delay: 0.8s;
-o-animation-delay: 0.8s;
animation-delay: 0.8s;
}
&:nth-child(4) {
-webkit-animation-delay: 0.9s;
-moz-animation-delay: 0.9s;
-o-animation-delay: 0.9s;
animation-delay: 0.9s;
}
&:nth-child(5) {
-webkit-animation-delay: 1s;
-moz-animation-delay: 1s;
-o-animation-delay: 1s;
animation-delay: 1s;
}
}
&.opened .ps3-anim4 .sc_socials .socials_wrap .social_item,
&.opened .ps3-anim4 .sc_widget_socials .socials_wrap .social_item {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps3-anim4 .sc_socials .socials_wrap .social_item,
&.out_anim .ps3-anim4 .sc_widget_socials .socials_wrap .social_item {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility: visible;
&:nth-child(2) {
-webkit-animation-delay: 0.4s;
-moz-animation-delay: 0.4s;
-o-animation-delay: 0.4s;
animation-delay: 0.4s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
}
&:nth-child(4) {
-webkit-animation-delay: 0.2s;
-moz-animation-delay: 0.2s;
-o-animation-delay: 0.2s;
animation-delay: 0.2s;
}
&:nth-child(5) {
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
}
}
/* Panel with menu style 4 */
/* Logo animation */
.ps4-anim1 .sc_layouts_logo {
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
visibility:hidden;
@include transition(color .3s ease);
}
&.opened .ps4-anim1 .sc_layouts_logo {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps4-anim1 .sc_layouts_logo {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
-o-animation-delay: 0.7s;
animation-delay: 0.7s;
visibility:visible;
}
/* Vertical dropdown menu animation */
.ps4-anim2 .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown > ul > li {
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility:hidden;
&:nth-child(2) {
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
-o-animation-delay: 0.6s;
animation-delay: 0.6s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
-o-animation-delay: 0.7s;
animation-delay: 0.7s;
}
&:nth-child(4) {
-webkit-animation-delay: 0.8s;
-moz-animation-delay: 0.8s;
-o-animation-delay: 0.8s;
animation-delay: 0.8s;
}
&:nth-child(5) {
-webkit-animation-delay: 0.9s;
-moz-animation-delay: 0.9s;
-o-animation-delay: 0.9s;
animation-delay: 0.9s;
}
&:nth-child(6) {
-webkit-animation-delay: 1s;
-moz-animation-delay: 1s;
-o-animation-delay: 1s;
animation-delay: 1s;
}
&:nth-child(7) {
-webkit-animation-delay: 1.1s;
-moz-animation-delay: 1.1s;
-o-animation-delay: 1.1s;
animation-delay: 1.1s;
}
}
&.opened .ps4-anim2 .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown > ul > li {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps4-anim2 .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown > ul > li {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
-o-animation-delay: 0.6s;
animation-delay: 0.6s;
visibility:visible;
&:nth-child(2) {
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.4s;
-moz-animation-delay: 0.4s;
-o-animation-delay: 0.4s;
animation-delay: 0.4s;
}
&:nth-child(4) {
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
}
&:nth-child(5) {
-webkit-animation-delay: 0.2s;
-moz-animation-delay: 0.2s;
-o-animation-delay: 0.2s;
animation-delay: 0.2s;
}
&:nth-child(6) {
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
}
&:nth-child(7) {
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
}
}
/* Section Divider */
.ps4-anim3 .elementor-divider-separator,
.ps4-anim3.section_divider .elementor-container:before {
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility:hidden;
@include transform-origin(left center);
--divider-border-color: var(--theme-color-alter_dark);
--divider-color: var(--theme-color-alter_dark);
}
&.opened .ps4-anim3 .elementor-divider-separator,
&.opened .ps4-anim3.section_divider .elementor-container:before {
-webkit-animation-name: fadeInMove;
animation-name: fadeInMove;
-webkit-animation-duration: 0.7s;
animation-duration: 0.7s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps4-anim3 .elementor-divider-separator,
&.out_anim .ps4-anim3.section_divider .elementor-container:before {
-webkit-animation-name: fadeOutMove;
animation-name: fadeOutMove;
-webkit-animation-duration: 0.8s;
animation-duration: 0.8s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
visibility:visible;
}
/* Paragraph animation */
.ps4-anim4.elementor-widget-text-editor p > a {
@include transition(color .3s ease);
}
.ps4-anim4.elementor-widget-text-editor p {
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
-o-animation-delay: 0.6s;
animation-delay: 0.6s;
visibility:hidden;
}
&.opened .ps4-anim4.elementor-widget-text-editor p {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps4-anim4.elementor-widget-text-editor p {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.4s;
-moz-animation-delay: 0.4s;
-o-animation-delay: 0.4s;
animation-delay: 0.4s;
visibility: visible;
}
/* Socials animation */
.ps4-anim5 .sc_socials .socials_wrap .social_item,
.ps4-anim5 .sc_widget_socials .socials_wrap .social_item {
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
-o-animation-delay: 0.6s;
animation-delay: 0.6s;
visibility:hidden;
&:nth-child(2) {
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
-o-animation-delay: 0.7s;
animation-delay: 0.7s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.8s;
-moz-animation-delay: 0.8s;
-o-animation-delay: 0.8s;
animation-delay: 0.8s;
}
&:nth-child(4) {
-webkit-animation-delay: 0.9s;
-moz-animation-delay: 0.9s;
-o-animation-delay: 0.9s;
animation-delay: 0.9s;
}
&:nth-child(5) {
-webkit-animation-delay: 1s;
-moz-animation-delay: 1s;
-o-animation-delay: 1s;
animation-delay: 1s;
}
}
&.opened .ps4-anim5 .sc_socials .socials_wrap .social_item,
&.opened .ps4-anim5 .sc_widget_socials .socials_wrap .social_item {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps4-anim5 .sc_socials .socials_wrap .social_item,
&.out_anim .ps4-anim5 .sc_widget_socials .socials_wrap .social_item {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
visibility: visible;
&:nth-child(2) {
-webkit-animation-delay: 0.25s;
-moz-animation-delay: 0.25s;
-o-animation-delay: 0.25s;
animation-delay: 0.25s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.2s;
-moz-animation-delay: 0.2s;
-o-animation-delay: 0.2s;
animation-delay: 0.2s;
}
&:nth-child(4) {
-webkit-animation-delay: 0.15s;
-moz-animation-delay: 0.15s;
-o-animation-delay: 0.15s;
animation-delay: 0.15s;
}
&:nth-child(5) {
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
}
}
/* Panel with menu style 5 */
/* Logo animation */
.ps5-anim1 .sc_layouts_logo {
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
visibility:hidden;
@include transition(color .3s ease);
}
&.opened .ps5-anim1 .sc_layouts_logo {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps5-anim1 .sc_layouts_logo {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
-o-animation-delay: 0.7s;
animation-delay: 0.7s;
visibility:visible;
}
/* Paragraph animation */
.ps5-anim2.elementor-widget-text-editor p > a {
@include transition(color .3s ease);
}
.ps5-anim2.elementor-widget-text-editor p {
-webkit-animation-delay: 0.4s;
-moz-animation-delay: 0.4s;
-o-animation-delay: 0.4s;
animation-delay: 0.4s;
visibility:hidden;
}
&.opened .ps5-anim2.elementor-widget-text-editor p {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps5-anim2.elementor-widget-text-editor p {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
-o-animation-delay: 0.6s;
animation-delay: 0.6s;
visibility: visible;
}
.ps5-anim3.elementor-widget-text-editor p > a {
@include transition(color .3s ease);
}
.ps5-anim3.elementor-widget-text-editor p {
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility:hidden;
}
&.opened .ps5-anim3.elementor-widget-text-editor p {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps5-anim3.elementor-widget-text-editor p {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility: visible;
}
/* Text Editor title animation */
.ps5-anim4.elementor-widget-text-editor h1,
.ps5-anim4.elementor-widget-text-editor h2,
.ps5-anim4.elementor-widget-text-editor h3,
.ps5-anim4.elementor-widget-text-editor h4,
.ps5-anim4.elementor-widget-text-editor h5,
.ps5-anim4.elementor-widget-text-editor h6 {
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
-o-animation-delay: 0.6s;
animation-delay: 0.6s;
visibility:hidden;
}
&.opened .ps5-anim4.elementor-widget-text-editor h1,
&.opened .ps5-anim4.elementor-widget-text-editor h2,
&.opened .ps5-anim4.elementor-widget-text-editor h3,
&.opened .ps5-anim4.elementor-widget-text-editor h4,
&.opened .ps5-anim4.elementor-widget-text-editor h5,
&.opened .ps5-anim4.elementor-widget-text-editor h6 {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps5-anim4.elementor-widget-text-editor h1,
&.out_anim .ps5-anim4.elementor-widget-text-editor h2,
&.out_anim .ps5-anim4.elementor-widget-text-editor h3,
&.out_anim .ps5-anim4.elementor-widget-text-editor h4,
&.out_anim .ps5-anim4.elementor-widget-text-editor h5,
&.out_anim .ps5-anim4.elementor-widget-text-editor h6 {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.4s;
-moz-animation-delay: 0.4s;
-o-animation-delay: 0.4s;
animation-delay: 0.4s;
visibility: visible;
}
/* Vertical dropdown menu animation */
.ps5-anim5 .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown > ul > li {
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility:hidden;
&:nth-child(2) {
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
-o-animation-delay: 0.6s;
animation-delay: 0.6s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
-o-animation-delay: 0.7s;
animation-delay: 0.7s;
}
&:nth-child(4) {
-webkit-animation-delay: 0.8s;
-moz-animation-delay: 0.8s;
-o-animation-delay: 0.8s;
animation-delay: 0.8s;
}
&:nth-child(5) {
-webkit-animation-delay: 0.9s;
-moz-animation-delay: 0.9s;
-o-animation-delay: 0.9s;
animation-delay: 0.9s;
}
&:nth-child(6) {
-webkit-animation-delay: 1s;
-moz-animation-delay: 1s;
-o-animation-delay: 1s;
animation-delay: 1s;
}
&:nth-child(7) {
-webkit-animation-delay: 1.1s;
-moz-animation-delay: 1.1s;
-o-animation-delay: 1.1s;
animation-delay: 1.1s;
}
}
&.opened .ps5-anim5 .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown > ul > li {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps5-anim5 .sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown > ul > li {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
-o-animation-delay: 0.6s;
animation-delay: 0.6s;
visibility:visible;
&:nth-child(2) {
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.4s;
-moz-animation-delay: 0.4s;
-o-animation-delay: 0.4s;
animation-delay: 0.4s;
}
&:nth-child(4) {
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
}
&:nth-child(5) {
-webkit-animation-delay: 0.2s;
-moz-animation-delay: 0.2s;
-o-animation-delay: 0.2s;
animation-delay: 0.2s;
}
&:nth-child(6) {
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
}
&:nth-child(7) {
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
}
}
/* Divider */
.ps5-anim6 .elementor-divider-separator {
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility:hidden;
@include transform-origin(left center);
--divider-border-color: var(--theme-color-alter_dark);
--divider-color: var(--theme-color-alter_dark);
}
&.opened .ps5-anim6 .elementor-divider-separator {
-webkit-animation-name: fadeInMove;
animation-name: fadeInMove;
-webkit-animation-duration: 0.7s;
animation-duration: 0.7s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps5-anim6 .elementor-divider-separator {
-webkit-animation-name: fadeOutMove;
animation-name: fadeOutMove;
-webkit-animation-duration: 0.8s;
animation-duration: 0.8s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
visibility:visible;
}
/* Socials animation */
.ps5-anim7 .sc_socials .socials_wrap .social_item,
.ps5-anim7 .sc_widget_socials .socials_wrap .social_item {
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
-o-animation-delay: 0.6s;
animation-delay: 0.6s;
visibility:hidden;
&:nth-child(2) {
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
-o-animation-delay: 0.7s;
animation-delay: 0.7s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.8s;
-moz-animation-delay: 0.8s;
-o-animation-delay: 0.8s;
animation-delay: 0.8s;
}
&:nth-child(4) {
-webkit-animation-delay: 0.9s;
-moz-animation-delay: 0.9s;
-o-animation-delay: 0.9s;
animation-delay: 0.9s;
}
&:nth-child(5) {
-webkit-animation-delay: 1s;
-moz-animation-delay: 1s;
-o-animation-delay: 1s;
animation-delay: 1s;
}
}
&.opened .ps5-anim7 .sc_socials .socials_wrap .social_item,
&.opened .ps5-anim7 .sc_widget_socials .socials_wrap .social_item {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .ps5-anim7 .sc_socials .socials_wrap .social_item,
&.out_anim .ps5-anim7 .sc_widget_socials .socials_wrap .social_item {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
visibility: visible;
&:nth-child(2) {
-webkit-animation-delay: 0.25s;
-moz-animation-delay: 0.25s;
-o-animation-delay: 0.25s;
animation-delay: 0.25s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.2s;
-moz-animation-delay: 0.2s;
-o-animation-delay: 0.2s;
animation-delay: 0.2s;
}
&:nth-child(4) {
-webkit-animation-delay: 0.15s;
-moz-animation-delay: 0.15s;
-o-animation-delay: 0.15s;
animation-delay: 0.15s;
}
&:nth-child(5) {
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
}
}
}
/* Mobile menu
---------------------------------------- */
body.mobile_layout.menu_side_left { margin-left: 0; }
body.mobile_layout.menu_side_right { margin-right: 0; }
body.mobile_layout.menu_side_right .menu_side_wrap { right: -6rem; }
body.mobile_layout.menu_side_left .menu_side_wrap { left: -6rem; }
body.mobile_layout.menu_side_right .menu_side_wrap.opened {right: 0; }
body.mobile_layout.menu_side_left .menu_side_wrap.opened { left: 0; }
body.mobile_layout.menu_side_present .menu_side_wrap .menu_side_button { display:block; }
body.mobile_layout.menu_side_left .menu_side_wrap .menu_side_button:hover { right: -2em; }
body.mobile_layout.menu_side_right .menu_side_wrap .menu_side_button:hover { left: -2em; }
/* Admin Bar Mobile Menu */
.admin-bar .menu_mobile {
top: 32px;
}
.admin-bar .menu_mobile.opened {
height: calc(100% - 32px);
}
@media (max-width: 782px) {
.admin-bar .menu_mobile {
top: 46px;
}
.admin-bar .menu_mobile.opened {
height: calc(100% - 46px);
}
}
@media (max-width: 600px) {
.admin-bar .menu_mobile {
top: 0;
}
.admin-bar .menu_mobile.opened {
height: 100%;
}
}
.menu_mobile_overlay {
display:none;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index:8001;
@include box(100%, 100%);
background-color: var(--theme-color-alter_bg_color);
opacity: .1;
}
.menu_mobile {
@include fixed-lt(0, 0, 100002);
@include box(100%, 0);
will-change: height;
@include transition(height .45s cubic-bezier(0.5, 1, 0.89, 1));
&.opened {
height:100%;
}
.menu_mobile_inner {
@include abs-cover;
text-align:center;
overflow:hidden;
color: var(--theme-color-alter_text);
background-color: var(--theme-color-alter_bg_color);
}
.menu_mobile_header_wrap {
@include abs-lt(0, 0, 10);
width: 100%;
padding: 60px 65px;
@include flex;
@include flex-align-items(center);
@include flex-justify-content(space-between);
@include border-box;
}
.menu_mobile_content_wrap.content_wrap {
position: relative;
z-index: 1;
height: 100%;
max-height: 100%;
@include border-box;
}
.menu_mobile_content_wrap_inner {
position: relative;
z-index: 1;
height: 100%;
max-height: 100%;
@include border-box;
}
.menu_mobile_button {
color: var(--theme-color-text_dark);
&:hover {
color: var(--theme-color-text_link);
}
}
.menu-item > a {
display:block;
}
.menu_mobile_inner a,
.menu_mobile_inner .menu_mobile_nav_area li:before {
color: var(--theme-color-alter_text);
}
.menu_mobile_inner a:hover,
.menu_mobile_inner .current-menu-ancestor > a,
.menu_mobile_inner .current-menu-item > a,
.menu_mobile_inner .menu_mobile_nav_area li:hover:before,
.menu_mobile_inner .menu_mobile_nav_area li.current-menu-ancestor:before,
.menu_mobile_inner .menu_mobile_nav_area li.current-menu-item:before {
color: var(--theme-color-alter_dark);
}
.menu_mobile_inner .menu-item.opened > a {
color: var(--theme-color-alter_dark);
}
[class*="sc_fly_"]:not(.sc_fly_static) {
position: static !important;
@include transform-none;
left: auto;
top: auto;
right: auto;
bottom: auto;
}
.menu_mobile_nav_area {
@include abs-lt(0, 27%);
@include box(100%, auto);
max-height: 53%;
overflow-x: hidden;
overflow-y: auto;
}
.menu_mobile_content_wrap_inner.without_socials .menu_mobile_nav_area {
max-height: 65%;
}
.menu_mobile_nav_area { -ms-overflow-style: none; } /* hide scrollbar Explorer */
.menu_mobile_nav_area { scrollbar-width:none; } /* hide scrollbar FireFox */
.menu_mobile_nav_area::-webkit-scrollbar { width:0 } /* hide scrollbar Chrome */
.menu_mobile_nav_area ul {
margin:0 auto;
padding:0;
list-style:none;
width: auto;
}
.menu_mobile_nav_area ul ul {
padding: 1em 0;
margin: 0;
display:none;
}
.menu_mobile_nav_area > ul > li > ul {
padding: 1em 0 0.6em;
}
.menu_mobile_nav_area li {
margin-bottom:0;
width:100%;
}
.menu_mobile_nav_area .menu-item > a {
@include font(19px, 1.5em, 400);
letter-spacing: 0.6px;
padding: 5px 2em;
position:relative;
display: inline-block;
width: auto;
text-align:left;
@include border-box;
@include transition(color .3s ease);
}
.menu_mobile_nav_area .menu-item[class*="icon-"] {
position: relative;
display: block;
}
.menu_mobile_nav_area .menu-item[class*="icon-"]:before {
@include font(24px, inherit, 400);
display:inline-block;
padding: 0;
width: 1em;
position: absolute;
z-index: 1;
top: 24px;
left: 50%;
@include transform(translateX(-12rem));
@include transition-color;
}
.menu_mobile_nav_area .menu-item .menu-item[class*="icon-"]:before {
top: 6px;
font-size: 18px;
}
.menu_mobile_nav_area > ul {
@include flex;
@include flex-direction(column);
@include flex-align-items(center);
width: 100%;
> .menu-item:last-child > ul {
padding-bottom: 0;
}
> .menu-item > a {
@include font(38px, 1.5em, 600);
letter-spacing: 0;
text-transform: uppercase;
}
> .menu-item .menu-item > a {
padding: 0.4em 3.7em;
}
}
.menu_mobile_nav_area .open_child_menu {
display: block;
@include abs-rt(0, -2px);
padding: 0;
@include transition-colors;
}
.menu_mobile_nav_area .menu-item .menu-item .open_child_menu {
top: 3px;
background-color:transparent;
padding: 0;
}
.menu_mobile_nav_area li > a > .open_child_menu:before {
@include font(16px, '', 400);
font-family:$theme_icons;
content:'\E9A4';
position: relative;
right: 10px;
opacity: 0;
@include transition(right .3s ease-out, color .3s ease, opacity .3s ease);
}
.menu_mobile_nav_area li.opened > a > .open_child_menu:before,
.menu_mobile_nav_area li > a:hover > .open_child_menu:before {
right: 0;
opacity: 1;
}
.menu_mobile_nav_area > ul > li li > a > .open_child_menu:before {
font-size: 8px;
}
/* Layouts as submenu */
.menu_mobile_nav_area {
ul.sc_layouts_submenu {
display: none;
width: auto;
text-align: left;
padding: 1em;
margin: 0 auto;
.sc_content {
width: 100% !important;
}
.columns_wrap [class*="column-"],
.wpb_column:not([class*="vc_col-xs-"]),
.elementor-column:not([class*="elementor-xs-"]) {
width: 100%;
float: none;
}
.wpb_column:not([class*="vc_col-xs-"]) + .wpb_column:not([class*="vc_col-xs-"]),
.elementor-column:not([class*="elementor-xs-"]) + .elementor-column:not([class*="elementor-xs-"]) {
margin-top: 2em;
}
}
li > ul.sc_layouts_submenu ul {
display: block;
}
}
/* Search Mobile */
.search_mobile {
@include abs-lb(0, 8rem);
width: 28rem;
margin-left: 0;
form {
position:relative;
}
.search_field {
width:100%;
padding: 1.5em 3em 1.5em 1.5em !important;
}
.search_submit {
@include abs-pos(0, 0, auto, auto);
font-size:0.8667em;
padding:2em 1.8em;
color: var(--theme-color-input_light);
background-color:transparent;
&:focus, &:hover {
color: var(--theme-color-input_dark);
}
}
}
/* Socials Mobile */
.socials_mobile {
@include abs-lb(0, 2rem);
display:block;
width: 100%;
padding-top: 2.6em;
&:before {
@include abs-lt;
display: block;
content: '';
width: 100%;
height: 1px;
@include transform(scale3d(0, 1, 1));
background-color: var(--theme-color-alter_dark);
}
}
.social_item {
display:inline-block;
margin: 0 2em 0 0;
@include transition(color .3s ease);
.social_icon {
@include font(16px, '', 400);
padding: 0 1px;
display:block;
@include box(auto, auto, inherit);
color: var(--theme-color-alter_dark);
@include transition(color .3s ease);
opacity: 1;
&[class*="facebook"]:hover {
color: #4F5FBF !important;
}
&[class*="twitter"]:hover {
color: #48BDE9 !important;
}
&[class*="dribble"]:hover {
color: #EA4C89 !important;
}
&[class*="instagram"]:hover {
color: #C41BD1 !important;
}
}
&:last-child {
margin-right: 0;
}
}
/* Close Button */
.menu_mobile_close {
position: relative;
z-index: 1;
margin: 0 0 0 10px !important;
line-height: 1em;
@include flex;
@include flex-justify-content(center);
@include flex-align-items(center);
cursor: pointer;
color: var(--theme-color-alter_dark);
@include transition(color .3s ease);
&:hover {
color: var(--theme-color-alter_dark);
}
.menu_button_close_icon {
@include font(19px, '', 400);
position: relative;
z-index: 1;
@include border-box;
@include transform(rotate(0));
@include transition(transform .3s ease-out);
color: var(--theme-color-alter_dark);
&:before {
position: relative;
z-index: 1;
content:'\e9e1';
font-family:$theme_icons;
line-height: 1;
text-align: center;
}
}
&:hover .menu_button_close_icon {
@include transform(rotate(180deg));
}
.menu_button_close_text {
@include font(17px, 1em, 400);
margin-right: 0.9em;
color: var(--theme-color-alter_light);
}
}
&:not(.opened) .menu_button_close_icon {
@include transform(none);
}
/* Menu Mobile With Widgets */
.menu_mobile_inner.with_widgets {
text-align: left;
.menu_mobile_content_wrap_inner {
margin-right: 15%;
}
.menu_mobile_nav_area .menu-item > a {
padding: 5px 2em 5px 0;
}
.menu_mobile_nav_area > ul {
@include flex-align-items(flex-start);
}
.menu_mobile_nav_area > ul > .menu-item .menu-item > a {
padding: 0.4em 3.7em 0.4em 1.7em;
}
.menu_mobile_nav_area .menu-item[class*="icon-"] {
position: relative;
}
.menu_mobile_nav_area .menu-item[class*="icon-"]:before {
left: 0;
@include transform(none);
}
.menu_mobile_nav_area .menu-item[class*="image-"] > a {
background-position: 1em center;
background-repeat:no-repeat;
background-size: 1em;
padding-left: 2.3em;
}
.menu_mobile_nav_area > ul {
> .menu-item[class*="icon-"] > a {
padding-left: 1.2em;
}
> .menu-item .menu-item[class*="icon-"]:before {
font-size: 18px;
margin-left: 1.9em;
top: 8px;
}
> .menu-item .menu-item[class*="icon-"] > a {
padding-left: 3.3em;
}
> .menu-item .menu-item[class*="image-"] > a {
background-position: 1.6667em center;
padding-left: 3.3em;
}
> .menu-item[class*="columns-"][class*="icon-"]:before {
position:static;
margin:0 0 0 0.5em;
float:left;
}
> .menu-item[class*="columns-"][class*="icon-"] > a {
float:left;
margin-left: -1.5em;
}
> .menu-item .menu-item .menu-item[class*="icon-"]:before {
margin-left: 3.9em;
}
> .menu-item .menu-item .menu-item[class*="icon-"] > a {
padding-left:5.3em;
}
> .menu-item .menu-item .menu-item[class*="image-"] > a {
background-position: 1.6667em center;
padding-left: 5.3em;
}
> .menu-item .menu-item .menu-item .menu-item[class*="icon-"]:before {
margin-left: 6em;
}
> .menu-item .menu-item .menu-item .menu-item[class*="icon-"] > a {
padding-left: 7.3em;
}
> .menu-item .menu-item .menu-item .menu-item[class*="image-"] > a {
background-position: 1.6667em center;
padding-left: 7.3em;
}
> .menu-item .menu-item .menu-item > a {
padding-left: 3.7em;
}
> .menu-item .menu-item .menu-item .menu-item > a {
padding-left: 5.7em;
}
> .menu-item .menu-item.menu-delimiter {
margin-top: 0 !important;
padding-top: 0 !important;
text-align: center;
overflow: hidden;
}
> .menu-item .menu-item.menu-delimiter > a {
overflow: hidden;
padding-top: 0.25em;
padding-bottom: 0.25em;
padding-right: 0.5em;
height: 1px;
}
> .menu-item .menu-item.menu-delimiter > a:before {
content: ' ';
display: block;
border-top: 1px solid var(--theme-color-alter_bd_color);
@include box(100%, 0);
}
> .menu-item .menu-item.menu-delimiter > a {
border-color: var(--theme-color-alter_bd_color);
}
> .menu-item .menu-item.menu-delimiter > a > * {
display: none;
}
}
}
.menu_mobile_inner.with_widgets .socials_mobile:before {
@include transform-origin(left center);
}
/* Widgets Area */
.menu_mobile_widgets_area {
padding: 100px 70px;
@include flex;
@include flex-justify-content(flex-start);
@include flex-align-items(center);
@include abs-rt(0, 0, 5);
@include box(24%, 100%);
background-color: var(--theme-color-bg_color);
@include border-box;
/* Global Styles in Widget Area */
a {
@include transition(color .3s ease);
}
.columns_wrap [class*="column-"] {
width: 100%;
}
.columns_wrap .widget + .widget {
margin-top: 2em;
}
.widgets_additional_menu_mobile_fullscreen_wrap {
position: relative;
z-index: 1;
max-height: 90%;
height: auto;
@include border-box;
overflow-y: scroll;
overflow-x: hidden;
padding-top: 2px;
padding-bottom: 2px;
}
.widgets_additional_menu_mobile_fullscreen_wrap { -ms-overflow-style: none; } /* hide scrollbar Explorer */
.widgets_additional_menu_mobile_fullscreen_wrap { scrollbar-width: none; } /* hide scrollbar FireFox */
.widgets_additional_menu_mobile_fullscreen_wrap::-webkit-scrollbar { width: 0; } /* hide scrollbar Chrome */
/* Custom Html Widget */
.widget_custom_html {
.extra_item + .extra_item {
margin-top: 4em;
}
.extra_item h6 {
@include font(1em, 1.3em, 500);
margin: 0;
color: var(--theme-color-text_dark);
}
.extra_item a {
display: inline-block;
@include font(1.667em, 1.3em, 600);
letter-spacing: 0;
text-transform: uppercase;
color: var(--theme-color-text_dark);
}
.extra_item a[href*="mailto"] {
padding-bottom: 0.2em;
}
.extra_item a:not([href*="mailto"]) {
position: relative;
padding-right: calc(1.9em + 8px);
}
.extra_item a:not([href*="mailto"]):after {
font-family: $theme_icons;
content: '\E9E2';
@include font(8px, '', 400);
position: absolute;
top: calc(50% + 2px);
right: 8px;
color: var(--theme-color-text_link);
@include transform(translateY(-50%));
@include transition(right .3s ease-out, color .3s ease, opacity .3s ease );
}
.extra_item a:not([href*="mailto"]):hover:after {
right: 1px;
}
.extra_item h6 + a {
margin-top: 0.5em;
}
}
}
/* Animation
+++++++++++++++++++++++++++ */
.menu_mobile_close .menu_button_close_icon,
.menu_mobile_close .menu_button_close_text {
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
visibility:hidden;
}
&.opened .menu_mobile_close .menu_button_close_icon,
&.opened .menu_mobile_close .menu_button_close_text {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.opened .menu_mobile_close .menu_button_close_icon {
-webkit-animation-name: fadeInAnimScale;
animation-name: fadeInAnimScale;
-webkit-animation-fill-mode: backwards;
animation-fill-mode: backwards;
transform-origin: 50% 54%;
}
&.out_anim .menu_mobile_close .menu_button_close_icon,
&.out_anim .menu_mobile_close .menu_button_close_text {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility:visible;
}
&.out_anim .menu_mobile_close .menu_button_close_icon {
-webkit-animation-name: fadeOutAnimScale;
animation-name: fadeOutAnimScale;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
/* logo */
.sc_layouts_logo {
display: inline-block;
vertical-align: top;
text-align:left;
margin: 0;
font-size: 1em !important; /* Remove this rule if you want to zoom this logo too */
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
visibility:hidden;
@include transition(color .3s ease);
}
&.opened .sc_layouts_logo {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .sc_layouts_logo {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
-o-animation-delay: 0.7s;
animation-delay: 0.7s;
visibility:visible;
}
/* menu */
.menu_mobile_nav_area > ul > li {
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility:hidden;
&:nth-child(2) {
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
-o-animation-delay: 0.6s;
animation-delay: 0.6s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
-o-animation-delay: 0.7s;
animation-delay: 0.7s;
}
&:nth-child(4) {
-webkit-animation-delay: 0.8s;
-moz-animation-delay: 0.8s;
-o-animation-delay: 0.8s;
animation-delay: 0.8s;
}
&:nth-child(5) {
-webkit-animation-delay: 0.9s;
-moz-animation-delay: 0.9s;
-o-animation-delay: 0.9s;
animation-delay: 0.9s;
}
&:nth-child(6) {
-webkit-animation-delay: 1s;
-moz-animation-delay: 1s;
-o-animation-delay: 1s;
animation-delay: 1s;
}
&:nth-child(7) {
-webkit-animation-delay: 1.1s;
-moz-animation-delay: 1.1s;
-o-animation-delay: 1.1s;
animation-delay: 1.1s;
}
&:nth-child(8) {
-webkit-animation-delay: 1.2s;
-moz-animation-delay: 1.2s;
-o-animation-delay: 1.2s;
animation-delay: 1.2s;
}
&:nth-child(9) {
-webkit-animation-delay: 1.3s;
-moz-animation-delay: 1.3s;
-o-animation-delay: 1.3s;
animation-delay: 1.3s;
}
&:nth-child(10) {
-webkit-animation-delay: 1.4s;
-moz-animation-delay: 1.4s;
-o-animation-delay: 1.4s;
animation-delay: 1.4s;
}
}
&.opened .menu_mobile_nav_area > ul > li {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .menu_mobile_nav_area > ul > li {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
-o-animation-delay: 0.6s;
animation-delay: 0.6s;
visibility:visible;
&:nth-child(2) {
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.4s;
-moz-animation-delay: 0.4s;
-o-animation-delay: 0.4s;
animation-delay: 0.4s;
}
&:nth-child(4) {
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
}
&:nth-child(5) {
-webkit-animation-delay: 0.2s;
-moz-animation-delay: 0.2s;
-o-animation-delay: 0.2s;
animation-delay: 0.2s;
}
&:nth-child(6) {
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
}
&:nth-child(7) {
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
}
&:nth-child(8),
&:nth-child(9),
&:nth-child(10) {
-webkit-animation-delay: 0s;
-moz-animation-delay: 0s;
-o-animation-delay: 0s;
animation-delay: 0s;
}
}
/* Socials */
.menu_mobile_inner .socials_mobile .social_item {
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility:hidden;
&:nth-child(2) {
-webkit-animation-delay: 0.6s;
-moz-animation-delay: 0.6s;
-o-animation-delay: 0.6s;
animation-delay: 0.6s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
-o-animation-delay: 0.7s;
animation-delay: 0.7s;
}
&:nth-child(4) {
-webkit-animation-delay: 0.8s;
-moz-animation-delay: 0.8s;
-o-animation-delay: 0.8s;
animation-delay: 0.8s;
}
&:nth-child(5) {
-webkit-animation-delay: 0.9s;
-moz-animation-delay: 0.9s;
-o-animation-delay: 0.9s;
animation-delay: 0.9s;
}
}
&.opened .menu_mobile_inner .socials_mobile .social_item {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
&.out_anim .menu_mobile_inner .socials_mobile .social_item {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility: visible;
&:nth-child(2) {
-webkit-animation-delay: 0.4s;
-moz-animation-delay: 0.4s;
-o-animation-delay: 0.4s;
animation-delay: 0.4s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
}
&:nth-child(4) {
-webkit-animation-delay: 0.2s;
-moz-animation-delay: 0.2s;
-o-animation-delay: 0.2s;
animation-delay: 0.2s;
}
&:nth-child(5) {
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
}
}
/* socials mobile */
.menu_mobile_inner .socials_mobile {
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility:hidden;
&:before {
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility:hidden;
}
}
&.opened .menu_mobile_inner .socials_mobile {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
&:before {
-webkit-animation-name: fadeInMove;
animation-name: fadeInMove;
-webkit-animation-duration: 0.7s;
animation-duration: 0.7s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
}
&.out_anim .menu_mobile_inner .socials_mobile {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
visibility:visible;
&:before {
-webkit-animation-name: fadeOutMove;
animation-name: fadeOutMove;
-webkit-animation-duration: 0.8s;
animation-duration: 0.8s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
visibility:visible;
}
}
/* widgets area */
.menu_mobile_inner .menu_mobile_widgets_area {
-webkit-animation-delay: .2s;
-moz-animation-delay: .2s;
-o-animation-delay: .2s;
animation-delay: .2s;
visibility:hidden;
.widget {
+ .widget {
margin-top: var(--theme-var-grid_gap);
}
-webkit-animation-delay: .3s;
-moz-animation-delay: .3s;
-o-animation-delay: .3s;
animation-delay: .3s;
visibility:hidden;
&.widget_custom_html {
.extra_item {
-webkit-animation-delay: .3s;
-moz-animation-delay: .3s;
-o-animation-delay: .3s;
animation-delay: .3s;
visibility:hidden;
}
}
}
}
&.opened .menu_mobile_inner .menu_mobile_widgets_area {
visibility:visible;
.widgets_additional_menu_mobile_fullscreen_wrap {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
visibility:visible;
}
.widget {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: .8s;
animation-duration: .8s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility:visible;
&.widget_custom_html {
.extra_item {
-webkit-animation-name: fadeInAnim;
animation-name: fadeInAnim;
-webkit-animation-duration: .8s;
animation-duration: .8s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.5s;
-moz-animation-delay: 0.5s;
-o-animation-delay: 0.5s;
animation-delay: 0.5s;
visibility:visible;
&:nth-child(2) {
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
-o-animation-delay: 0.7s;
animation-delay: 0.7s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.9s;
-moz-animation-delay: 0.9s;
-o-animation-delay: 0.9s;
animation-delay: 0.9s;
}
}
}
&:nth-child(2) {
-webkit-animation-delay: 0.7s;
-moz-animation-delay: 0.7s;
-o-animation-delay: 0.7s;
animation-delay: 0.7s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.9s;
-moz-animation-delay: 0.9s;
-o-animation-delay: 0.9s;
animation-delay: 0.9s;
}
}
}
&.out_anim .menu_mobile_inner .menu_mobile_widgets_area {
-webkit-animation-name: fadeOutRightPanel;
animation-name: fadeOutRightPanel;
-webkit-animation-duration: 0.6s;
animation-duration: 0.6s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
visibility:visible;
.widget {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.8s;
animation-duration: 0.8s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
visibility:visible;
&.widget_custom_html {
.extra_item {
-webkit-animation-name: fadeOutAnim;
animation-name: fadeOutAnim;
-webkit-animation-duration: 0.8s;
animation-duration: 0.8s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-delay: 0.3s;
-moz-animation-delay: 0.3s;
-o-animation-delay: 0.3s;
animation-delay: 0.3s;
visibility:visible;
&:nth-child(2) {
-webkit-animation-delay: 0.2s;
-moz-animation-delay: 0.2s;
-o-animation-delay: 0.2s;
animation-delay: 0.2s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
}
}
}
&:nth-child(2) {
-webkit-animation-delay: 0.2s;
-moz-animation-delay: 0.2s;
-o-animation-delay: 0.2s;
animation-delay: 0.2s;
}
&:nth-child(3) {
-webkit-animation-delay: 0.1s;
-moz-animation-delay: 0.1s;
-o-animation-delay: 0.1s;
animation-delay: 0.1s;
}
}
}
}
/* Menu mobile 'Narrow' */
.menu_mobile_narrow {
margin-top:0;
margin-left: -320px;
@include box(320px, 100%);
@include transition-properties(margin-left, margin-right);
}
.menu_mobile_narrow.opened {
margin-left: 0;
}
.menu_side_right .menu_mobile_narrow {
margin-right: -320px;
margin-left: 0;
left: auto;
right: 0;
}
.menu_side_right .menu_mobile_narrow.opened {
margin-right: 0;
}
.menu_mobile_narrow .menu_mobile_close {
@include square(4em);
}
.menu_mobile_narrow .menu_mobile_nav_area ul.sc_layouts_submenu .vc_row,
.menu_mobile_narrow .menu_mobile_nav_area ul.sc_layouts_submenu .elementor-section {
display: block;
}
.menu_mobile_narrow .menu_mobile_nav_area .menu-item > a {
@include font(1em, 1.5em);
text-transform: none;
letter-spacing:0;
width: 18rem;
}
.menu_mobile_narrow .menu_mobile_nav_area .menu-item[class*="icon-"]:before {
@include translateX(-9rem);
}
.menu_mobile_narrow .menu_mobile_nav_area > ul > .menu-item > a {
@include font(1.25em, 1.5em);
}
.menu_mobile_narrow .menu_mobile_nav_area > ul > .menu-item > a > .open_child_menu:before {
@include font(1em, inherit);
}
.menu_mobile_narrow .menu_mobile_nav_area .menu-item .menu-item .open_child_menu {
padding: 0.4em;
}
.menu_mobile_narrow .search_mobile {
width: 18rem;
margin-left: -9rem;
}
/* Widgets in the Header
------------------------------------------------------------- */
.header_widgets_wrap {
position:relative;
z-index:2;
}
.header_widgets_wrap.header_fullwidth {
overflow:hidden;
}
.header_widgets_wrap.header_fullwidth .widget {
margin-bottom:0;
}
/* Custom layouts elements
------------------------------------------------------------- */
/* VC Separator */
[class*="scheme_"].sc_layouts_row .vc_separator.vc_sep_color_grey .vc_sep_line,
.sc_layouts_row .vc_separator.vc_sep_color_grey .vc_sep_line {
border-color: var(--theme-color-alter_bd_color);
}
/* Cart */
.sc_layouts_cart_items_short {
background-color: var(--theme-color-text_link);
color: var(--theme-color-inverse_link);
}
.sc_layouts_cart .sc_layouts_cart_widget {
background-color: var(--theme-color-extra_bg_color);
color: var(--theme-color-extra_dark);
ul.cart_list li a,
ul.cart_list li > b,
.total,
.total *,
.quantity,
.quantity * {
color: var(--theme-color-extra_dark) !important;
}
.widget_shopping_cart_content .buttons a.checkout {
border-color: var(--theme-color-extra_dark) !important;
color: var(--theme-color-extra_dark) !important;
&:hover {
border-color: var(--theme-color-text_link) !important;
color: var(--theme-color-text_link) !important;
}
}
}
.sc_layouts_cart_widget .sc_layouts_cart_widget_close {
color: var(--theme-color-text_light);
}
.sc_layouts_cart_widget .sc_layouts_cart_widget_close:hover {
color: var(--theme-color-text_dark);
}
/* Currency Switcher */
.sc_layouts_currency .woocommerce-currency-switcher-form .wSelect-selected {
color: var(--theme-color-alter_text);
}
.sc_layouts_currency .woocommerce-currency-switcher-form .wSelect-selected:hover {
color: var(--theme-color-alter_dark);
}
.sc_layouts_currency .chosen-container .chosen-results,
.sc_layouts_currency .woocommerce-currency-switcher-form .wSelect-options-holder,
.sc_layouts_currency .woocommerce-currency-switcher-form .dd-options,
.sc_layouts_currency .woocommerce-currency-switcher-form .dd-option {
background: var(--theme-color-alter_bg_color);
color: var(--theme-color-alter_dark);
}
.sc_layouts_currency .chosen-container .chosen-results li,
.sc_layouts_currency .woocommerce-currency-switcher-form .wSelect-option {
color: var(--theme-color-alter_dark);
}
.sc_layouts_currency .chosen-container .active-result.highlighted,
.sc_layouts_currency .chosen-container .active-result.result-selected,
.sc_layouts_currency .woocommerce-currency-switcher-form .wSelect-option:hover,
.sc_layouts_currency .woocommerce-currency-switcher-form .wSelect-options-holder .wSelect-option-selected,
.sc_layouts_currency .woocommerce-currency-switcher-form .dd-option:hover,
.sc_layouts_currency .woocommerce-currency-switcher-form .dd-option-selected {
color: var(--theme-color-alter_link) !important;
}
.sc_layouts_currency .woocommerce-currency-switcher-form .dd-option-description {
color: var(--theme-color-alter_text);
}
/* 7.2 Sliders
-------------------------------------------------------------- */
/* Revolution slider */
.slider_wrap .rev_slider_wrapper {
z-index:0;
}
/* 7.3 Post info (page/post title, category or tag name, author, meta, etc.)
-------------------------------------------------------------- */
/* Common styles */
.blog_archive {
padding-bottom: 4em;
}
.post_item {
color: var(--theme-color-text);
}
.post_item > .post_title {
margin-top:0;
}
.post_item .post_title a:hover,
.post_item .post_title a:focus {
color: var(--theme-color-text_dark);
}
.post_item .post-more-link,
.post_item .more-link,
.sc_portfolio_preview_show .post_readmore {
margin-top: 1.6em;
}
/* Post with password */
.post-password-form label {
display: inline-block;
vertical-align: top;
}
.post-password-form input[type="password"],
.post-password-form input[type="submit"] {
height: 50px;
}
.post-password-form input[type="submit"] {
padding: 0 40px;
display: inline-block;
margin-left: 0.2em;
}
/* Post info block */
.post_meta,
.post_meta_item,
.post_meta_item:after,
.post_meta_item:hover:after,
.post_meta .vc_inline-link,
.post_meta .vc_inline-link:after,
.post_meta .vc_inline-link:hover:after,
.post_meta_item a,
.post_info .post_info_item,
.post_info .post_info_item a,
.post_info_counters .post_meta_item {
color: var(--theme-color-text_light);
}
.post_info_item.post_categories a,
.post_info_item.post_categories {
color: var(--theme-color-text_dark);
}
.post_date a:hover, .post_date a:focus,
a.post_meta_item:hover, a.post_meta_item:focus,
.post_meta_item a:hover, .post_meta_item a:focus,
.post_meta .vc_inline-link:hover, .post_meta .vc_inline-link:focus,
.post_info .post_info_item a:hover, .post_info .post_info_item a:focus,
.post_info_meta .post_meta_item:hover, .post_info_meta .post_meta_item:focus {
color: var(--theme-color-text_dark);
}
.post_meta .post_meta_item,
.post_meta .vc_inline-link {
font-size: inherit; // Need for Gutenberg editor
display: inline-block;
margin-left:0;
@include transition-property(color);
}
.post_meta .post_meta_item .post_meta_item_value > .post_meta_item_icon {
margin-right: 5px;
}
.post_meta .post_meta_item > .post_meta_item_title + .post_meta_item_value {
margin-left: 8px;
}
.post_info .post_info_item:after,
.post_meta .post_meta_item:after,
.post_meta .post_meta_item.post_edit:after,
.post_meta .vc_inline-link:after {
content: '\e83c';
font-family:$theme_icons;
display:inline-block;
vertical-align:baseline;
@include font(14px, '', 400, normal);
margin: 0 0.75em;
}
.post_info .post_info_item:last-child:after,
.post_meta .post_meta_item:last-child:after,
.post_meta .post_meta_item.post_edit:last-child:after,
.post_meta .vc_inline-link:last-child:after {
display:none;
}
.post_meta a.post_meta_item:before,
.post_meta .vc_inline-link:before,
.post_meta a.post_meta_item > .post_counters_number {
margin-right: 0.3em;
}
.post_meta .post_meta_item:before {
display: none;
}
.post_meta .vc_inline-link:before {
content: '\e8bb';
font-family: $theme_icons;
}
.post_meta .post_meta_item_label {
margin-right: 0.3em;
}
.post_meta .post_meta_item .post_author_by {
margin-right: 0.3em;
display: none;
}
.post_meta .post_meta_item .post_author_avatar {
display: inline-block;
vertical-align: middle;
line-height: inherit;
margin-right: 0.3em;
}
.post_meta .post_meta_item .post_author_avatar > img {
@include border-round;
@include box(1.25em, 1.25em);
@include transform(scale(1, 1) !important);
}
.post_meta .post_meta_item .post_meta_number + .post_meta_label {
margin-left: 0.3em;
}
.post_meta_item.post_categories:not(.cat_sep) {
color: transparent !important;
}
.post_meta_item.post_categories:not(.cat_sep) > a {
margin-right: 0.5em;
margin-top: 2px;
margin-bottom: 2px;
display: inline-block;
}
.post_meta_item.post_categories:not(.cat_sep) > a:last-child {
margin-right: 0;
}
.post_meta_item.post_categories,
.post_meta_item.post_categories a {
color: var(--theme-color-text_link);
}
.post_meta_item.post_categories a:hover, .post_meta_item.post_categories a:focus {
color: var(--theme-color-text_hover);
}
.post_meta_item.post_author,
.post_info_item.post_info_posted_by,
.post_info_item.post_categories {
text-transform: uppercase !important;
letter-spacing: 1px !important;
font-weight: 500;
}
/* Sponsored content */
.post_meta .post_meta_item .post_sponsored_label {
text-transform: uppercase;
font-weight: 700;
letter-spacing: 1px;
color: var(--theme-color-text_link);
}
.post_meta .post_meta_item a.post_sponsored_label:hover {
color: var(--theme-color-text_dark);
}
.single-post .post_meta_item a.post_sponsored_label,
.single-post .post_meta_item .post_sponsored_label {
display: inline-block;
padding: 5px 16px 6px;
@include font(11px, 14px, 700);
letter-spacing: 1px;
text-transform: uppercase;
@include border-radius(0);
background-color: var(--theme-color-text_link);
color: var(--theme-color-inverse_link);
margin-top: 3px;
margin-bottom: 3px;
}
.single-post .post_meta_item a.post_sponsored_label:hover {
background-color: var(--theme-color-text_hover2);
color: var(--theme-color-inverse_link);
}
/* single */
.post_header_single .post_meta.post_meta_categories a:not(.post_sponsored_label) {
@include border-radius(0);
background-color: var(--theme-color-text_link2);
color: var(--theme-color-inverse_link);
text-transform: uppercase;
padding: 5px 16px 6px;
@include box-sizing(border-box);
font-size: 11px;
line-height: 14px;
font-weight: 700;
letter-spacing: 1px;
@include transition-all(0.3s);
margin: 3px 3px 3px 0;
&:last-child {
margin-right: 0;
}
&:hover {
background-color: var(--theme-color-text_hover2);
color: var(--theme-color-inverse_link);
}
}
/* Socials share in the post meta */
.post_meta_item .social_items {
font-size:1em;
}
.post_meta_item .social_items .social_item .social_icon i {
font-style:normal;
text-transform:capitalize;
}
.post_meta_item .socials_share {
display:inline-block;
vertical-align:baseline;
}
.socials_share.socials_type_drop .social_items {
padding:0.8em 1em;
}
.post_meta_item .socials_share.socials_type_drop .social_items {
bottom:auto;
top: 2.5em;
}
.post_meta_item .socials_share.socials_type_drop .social_items:before {
bottom: auto;
top: -5px;
@include rotate(135deg);
}
// for pull in blogger
.sc_blogger .hover_pull .post_meta_item .socials_share.socials_type_drop .social_items {
bottom: 2.5em;
top: auto;
&:before {
display: none;
}
}
.socials_share.socials_type_drop .social_items,
.socials_share.socials_type_drop .social_items:before {
background-color: var(--theme-color-bg_color);
border-color: var(--theme-color-bd_color);
color: var(--theme-color-text_light);
}
.socials_share.socials_type_drop .social_items .social_item {
color: var(--theme-color-text_light);
}
.socials_share.socials_type_drop .social_items .social_item:hover {
color: var(--theme-color-text_dark);
}
/* Tabs (internal and Essential Grid) */
.mptt-navigation-tabs,
div.detailx_tabs .detailx_tabs_titles {
list-style-type:none;
padding:0;
text-align:center;
letter-spacing:0;
margin: 0 0 3em;
}
div.esg-filter-wrapper .esg-filterbutton,
.mptt-navigation-tabs li,
div.detailx_tabs .detailx_tabs_titles li {
display: inline-block;
margin: 0 0 3px;
@include font(12px, 1.4em, normal);
text-transform:uppercase;
padding: 0;
border: none;
@include border-radius(0);
}
div.esg-filter-wrapper .esg-filterbutton:hover,
div.esg-filter-wrapper .esg-filterbutton.selected {
@include box-shadow(none);
}
div.esg-filter-wrapper .esg-filterbutton+.esg-filterbutton,
.mptt-navigation-tabs li+li,
div.detailx_tabs .detailx_tabs_titles li+li {
margin-left:3px;
}
div.esg-filter-wrapper .esg-filterbutton > span,
.mptt-navigation-tabs li a,
div.detailx_tabs .detailx_tabs_titles li a,
div.detailx_tabs .detailx_tabs_titles li a.ui-tabs-anchor {
display:block;
float: none;
padding: 1.75em 3em;
@include transition-colors;
color: var(--theme-color-alter_dark);
background-color: var(--theme-color-alter_bg_color);
}
div.esg-filter-wrapper .esg-filterbutton > span:hover,
.mptt-navigation-tabs li a:hover,
.mptt-navigation-tabs li a:focus,
.detailx_tabs .detailx_tabs_titles li a:hover,
.detailx_tabs .detailx_tabs_titles li a:focus,
.detailx_tabs .detailx_tabs_titles li a.ui-tabs-anchor:hover,
.detailx_tabs .detailx_tabs_titles li a.ui-tabs-anchor:focus {
color: var(--theme-color-inverse_link);
background-color: var(--theme-color-text_link);
}
div.esg-filter-wrapper .esg-filterbutton.selected > span,
.mptt-navigation-tabs li.active a,
.detailx_tabs .detailx_tabs_titles li.ui-state-active a,
.detailx_tabs .detailx_tabs_titles li.ui-state-active a.ui-tabs-anchor {
color: var(--theme-color-bg_color);
background-color: var(--theme-color-text_dark);
}
div.detailx_tabs .detailx_tabs_content {
padding: 0;
}
div.detailx_tabs .detailx_tab_content_remove {
opacity: 0;
}
div.detailx_tabs .nav-links {
margin-top:1em;
}
[class*="scheme_"].sidebar div.esg-filter-wrapper .esg-filterbutton > span,
[class*="scheme_"].sidebar .mptt-navigation-tabs li a,
[class*="scheme_"].sidebar .detailx_tabs .detailx_tabs_titles li a {
color: var(--theme-color-alter_dark);
background-color: var(--theme-color-alter_bg_hover);
}
[class*="scheme_"].sidebar div.esg-filter-wrapper .esg-filterbutton > span:hover,
[class*="scheme_"].sidebar .mptt-navigation-tabs li a:hover, [class*="scheme_"].sidebar .mptt-navigation-tabs li a:focus,
[class*="scheme_"].sidebar .detailx_tabs .detailx_tabs_titles li a:hover, [class*="scheme_"].sidebar .detailx_tabs .detailx_tabs_titles li a:focus {
color: var(--theme-color-inverse_link);
background-color: var(--theme-color-alter_link);
}
[class*="scheme_"].sidebar div.esg-filter-wrapper .esg-filterbutton.selected > span,
[class*="scheme_"].sidebar .mptt-navigation-tabs li.active a,
[class*="scheme_"].sidebar .detailx_tabs .detailx_tabs_titles li.ui-state-active a {
color: var(--theme-color-alter_bg_color);
background-color: var(--theme-color-alter_dark);
}
/* Post's banners */
.page_content_wrap {
position: relative;
}
.content .before_post_header_banner_wrap { margin-bottom: 2em; }
.content .after_post_header_banner_wrap { margin-bottom: 2em; }
/*
.custom-background .page_content_wrap {
background-color: transparent !important;
}
*/
.custom-background .content_wrap > .content,
.background_banner_wrap ~ .content_wrap > .content {
padding: 4rem;
@include border-box;
}
/* Post featured block */
.post_featured {
overflow:hidden;
position:relative;
margin-bottom:1.8em;
}
.post_featured.with_thumb.post_featured_bg {
background-size: cover;
background-position: center center;
}
body.sidebar_hide .post_featured.alignwide,
body.sidebar_hide .post_featured.alignfull {
z-index: 100;
}
.post_featured.with_gallery {
overflow: visible;
}
.post_featured.with_video {
z-index: 2000 !important;
&.with_video_sticky_on {
z-index: 100100 !important;
}
&.with_thumb:after {
content: ' ';
@include abs-cover;
background: -moz-linear-gradient(top, rgba(0,0,0,0) 25%, rgba(0,0,0,0.13) 50%, rgba(0,0,0,0.25) 66%, rgba(0,0,0,0.75) 100%);
background: -webkit-linear-gradient(top, rgba(0,0,0,0) 25%,rgba(0,0,0,0.13) 50%,rgba(0,0,0,0.25) 66%,rgba(0,0,0,0.75) 100%);
background: linear-gradient(to bottom, rgba(0,0,0,0) 25%,rgba(0,0,0,0.13) 50%,rgba(0,0,0,0.25) 66%,rgba(0,0,0,0.75) 100%);
pointer-events: none;
}
.post_info_video {
@include abs-lb;
@include transform-none;
z-index: 3;
top: auto;
right: 0;
display: block;
opacity: 1;
margin: 0;
width: 100%;
@include border-box;
padding: 3em 1.5em 1.5em;
text-align: center;
pointer-events: none;
& > * {
color: #fff;
}
.post_info_meta .post_meta,
.post_info_meta .post_meta > .post_meta_item,
.post_info_meta .post_meta > .post_meta_item > *,
.post_info_subtitle .post_meta,
.post_info_subtitle .post_meta > .post_meta_item,
.post_info_subtitle .post_meta > .post_meta_item > * {
color: inherit;
}
.post_info_title {
margin: 0.25em 0;
}
}
}
.post_featured.with_audio {
.post_info_audio {
text-align: left;
}
}
.post_featured > p {
margin: 0;
height: 0;
}
.post_featured_bg {
position: relative;
&:before {
content: ' ';
@include box(0, 0);
padding-top: 56.25%;
display:inline-block;
vertical-align: top;
margin-left:-0.3em;
}
& > .post_featured_bg_image,
& .post_thumb {
@include abs-cover;
@include bg-cover;
}
}
// Uncomment this if you want to stretch images to the block's width
//.post_featured[class*="hover_"] {
// display: block;
//}
//.post_featured img {
// width:100%;
// height:auto;
//}
.post_featured_right {
float: right;
width: 50%;
margin-left: 4.3478%;
}
.post_featured_left {
float: left;
width: 50%;
margin-right: 4.3478%;
}
.post_featured .mask {
background-color: rgba(0,0,0,0.5);
}
/* 7.4 Post Formats
-------------------------------------------------------------- */
/* Sticky posts */
.sticky {
position:relative;
&:not(.post_layout_custom) {
border: 1px solid var(--theme-color-bd_color);
padding: 2em;
.label_sticky {
display:block;
@include abs-rt(-13px, -13px);
@include box(0, 0);
border: 12px solid transparent;
border-top-color:var(--theme-color-text_link);
@include rotate(225deg);
}
}
}
.sidebar_hide .sticky_wrap .sticky,
.body_style_fullwide .sticky_wrap .sticky,
.body_style_fullscreen .sticky_wrap .sticky {
text-align:center;
}
ul.sc_layouts_submenu .sticky {
border: none;
padding: 0;
.label_sticky {
display: none;
}
}
.sticky_wrap {
margin-bottom: 5em;
position: relative;
z-index: 1; // Need to place share menu over next post
.sticky {
.post_featured {
display: inline-block;
margin-bottom: 1.5em;
}
.post_categories {
margin-top: 0.5em;
}
.post_title {
margin-top: 0;
margin-bottom:0;
}
}
}
.sticky_wrap .sticky.format-gallery .post_featured {
display: block;
}
/* Media elements
-------------------------------------- */
// Media elements hook for Safary
.me-plugin {
position: absolute;
@include box(0, 0);
}
.mejs-container:not(.mejs-video) {
height: 60px !important;
}
.mejs-controls {
height: 60px;
padding: 10px 18px;
}
.trx_addons_audio_player_wrap .mejs-controls,
.wp-playlist .mejs-controls {
padding: 0;
height: 42px;
}
.trx_addons_audio_player_wrap .mejs-container,
.wp-playlist .mejs-container {
height: 42px !important;
}
.mejs-container,
.mejs-container .mejs-controls,
.wp-playlist .mejs-container .mejs-controls {
background: var(--theme-color-alter_bg_color);
}
[class*="scheme_"].footer_wrap,
.sidebar_default[class*="scheme_"] {
.mejs-container,
.mejs-container .mejs-controls,
.wp-playlist .mejs-container .mejs-controls {
background: var(--theme-color-bg_color);
}
}
// Icons instead bg image
.mejs-controls .mejs-button > button {
color: var(--theme-color-text_dark);
background: none !important;
padding: 0 !important;
text-align:center;
@include font(1.5em, 20px);
@include border-sharp;
}
.mejs-controls .mejs-button > button:hover,
.mejs-controls .mejs-button > button:focus {
color: var(--theme-color-text_link);
}
.mejs-controls .mejs-playpause-button.mejs-play > button:before,
.mejs-controls .mejs-playpause-button.mejs-replay > button:before {
content: '\e9e9';
font-family:$theme_icons;
letter-spacing: -3px;
}
.mejs-controls .mejs-playpause-button.mejs-pause > button:before {
content: '\e8e3';
font-family:$theme_icons;
}
.mejs-controls .mejs-volume-button.mejs-mute > button:before {
content: '\e9b0';
font-family:$theme_icons;
}
.mejs-controls .mejs-volume-button.mejs-unmute > button:before {
content: '\e9af';
font-family:$theme_icons;
}
.mejs-controls .mejs-button.mejs-fullscreen-button {
margin-left: 8px;
}
.mejs-controls .mejs-button.mejs-fullscreen-button > button:before {
content: '\f0b2';
font-family:$theme_icons;
letter-spacing: 0;
}
.mejs-controls .mejs-button.mejs-unfullscreen > button:before {
content: '\e918';
font-family:$theme_icons;
}
.mejs-controls .mejs-time-rail .mejs-time-total,
.mejs-controls .mejs-time-rail .mejs-time-loaded,
.mejs-controls .mejs-time-rail .mejs-time-hovered,
.mejs-controls .mejs-volume-slider .mejs-volume-total,
.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-total {
background: var(--theme-color-alter_bd_color);
}
.mejs-controls .mejs-time-rail .mejs-time-current,
.mejs-controls .mejs-volume-slider .mejs-volume-current,
.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {
background: var(--theme-color-text_link);
}
.mejs-controls .mejs-time-rail .mejs-time-handle-content {
border-color: var(--theme-color-text_link);
}
.mejs-controls .mejs-volume-slider .mejs-volume-handle,
.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-handle {
background: var(--theme-color-text_link);
}
.mejs-controls .mejs-time {
overflow: visible;
margin-top: -1px;
padding-left: 0;
padding-right: 0;
}
.post_featured.with_thumb .mejs-container,
.post_featured.with_thumb .mejs-controls,
.post_featured > div > .mejs-container,
.post_featured > div > .mejs-container .mejs-controls,
.post_featured > div > div > .mejs-container,
.post_featured > div > div > .mejs-container .mejs-controls,
.trx_addons_audio_player.with_cover .mejs-container,
.trx_addons_audio_player.with_cover .mejs-controls {
background: none;
}
.sidebar .mejs-controls .mejs-time,
.footer_wrap .mejs-controls .mejs-time {
display:none;
}
/* Audio */
.format-audio .post_featured {
position:relative;
max-height: unset;
}
.format-audio .post_featured .post_info {
display: none !important;
}
.format-audio .post_featured img {
position:relative;
}
.format-audio .post_featured.with_thumb .mask {
background-color: rgba(0,0,0,0.6);
}
.format-audio .post_featured .mask {
opacity: 1;
}
.format-audio .post_featured .post_audio.with_iframe .post_audio_author,
.format-audio .post_featured .post_audio.with_iframe .post_audio_title,
.single-format-audio .post_featured .post_audio.with_iframe .post_audio_author,
.single-format-audio .post_featured .post_audio.with_iframe .post_audio_title,
.sc_layouts_blog_item_featured .post_featured .post_audio.with_iframe .post_audio_author,
.sc_layouts_blog_item_featured .post_featured .post_audio.with_iframe .post_audio_title {
display:none;
}
.format-audio .post_featured .post_audio_author,
.single-format-audio .post_featured .post_audio_author,
.sc_layouts_blog_item_featured .post_featured .post_audio_author {
@include font(14px, '', 600, normal);
text-transform: uppercase;
line-height: 1.3em;
letter-spacing: 1px;
}
.sc_layouts_blog_item_featured .audio_author {
margin-left: 0;
margin-right:0;
text-transform:none;
}
.format-audio .post_featured .post_audio_title,
.single-format-audio .post_featured .post_audio_title,
.trx_addons_audio_player .audio_caption,
.sc_layouts_blog_item_featured .post_featured .post_audio_title {
@include font(1em, 1.35em, 600);
text-transform:uppercase;
}
.format-audio .post_featured .post_audio_title,
.single-format-audio .post_featured .post_audio_title {
@include font(28px, 1.3em, 600);
margin-top: 0.4em;
margin-bottom: 0.8em;
}
.format-audio .post_featured.with_thumb .post_audio_title {
margin-top: 0.2em;
margin-bottom: 0.9em;
}
.format-audio .post_featured.with_thumb .post_audio_author,
.single-format-audio .post_featured.with_thumb .post_audio_author,
.format-audio .post_featured.with_thumb .post_audio_description,
.single-format-audio .post_featured.with_thumb .post_audio_description,
.format-audio .post_featured.with_thumb .post_audio_title,
.single-format-audio .post_featured.with_thumb .post_audio_title,
.sc_layouts_blog_item_featured .post_featured.with_thumb .post_audio_author,
.sc_layouts_blog_item_featured .post_featured.with_thumb .post_audio_description,
.sc_layouts_blog_item_featured .post_featured.with_thumb .post_audio_title {
color: var(--theme-color-extra_dark);
}
.format-audio .post_featured .post_audio_description,
.single-format-audio .post_featured .post_audio_description,
.sc_layouts_blog_item_featured .post_featured .post_audio_description {
@include font(14px, '', 500);
margin-bottom: 1em;
}
.format-audio .post_featured.with_thumb .post_audio,
.sc_layouts_blog_item_featured .post_featured.with_thumb .post_audio {
@include abs-pos(auto, 15px, 15px, 15px, 1000);
text-align:left;
.mejs-controls {
padding-left: 15px;
padding-right: 15px;
background-color: var(--theme-color-alter_bg_color);
}
}
.related_wrap .post_featured.with_thumb .post_audio {
.audio_wrap {
margin-top: 10px;
}
.mejs-controls {
padding-left: 8px;
padding-right: 8px;
}
}
.format-audio .post_featured,
.single-format-audio .post_featured:not(.with_video),
.sc_layouts_blog_item_featured .post_featured {
.mejs-controls {
padding-left: 0;
padding-right: 0;
}
}
.format-audio .post_featured.without_thumb .post_audio:not(.with_iframe),
.single-format-audio .post_featured.without_thumb .post_audio:not(.with_iframe),
.sc_layouts_blog_item_featured .post_featured.without_thumb .post_audio:not(.with_iframe) {
padding: 3.2em 2.8em;
.post_info_audio {
margin-top: 10px;
}
}
.format-audio .post_featured.without_thumb .post_audio,
.single-format-audio .post_featured.without_thumb .post_audio {
background-color: var(--theme-color-alter_bg_color);
}
.format-audio .post_featured.without_thumb .post_audio_author,
.single-format-audio .post_featured.without_thumb .post_audio_author {
color: var(--theme-color-alter_dark);
}
.format-audio .post_featured.without_thumb .post_audio_title,
.single-format-audio .post_featured.without_thumb .post_audio_title {
color: var(--theme-color-alter_dark);
}
.format-audio .post_featured.without_thumb .post_audio_description,
.single-format-audio .post_featured.without_thumb .post_audio_description {
color: var(--theme-color-alter_text);
}
.format-audio .post_featured.with_thumb,
.single-format-audio .post_header_wrap .post_featured.with_thumb {
position: relative;
&:after {
content: ' ';
display: block !important;
@include abs-cover(2);
width:auto;
height:auto;
padding: 0;
margin:0;
background: -moz-linear-gradient(top, rgba(0,0,0,0.15) 0%, rgba(0,0,0,0.2) 50%, rgba(0,0,0,0.3) 66%, rgba(0,0,0,0.5) 100%);
background: -webkit-linear-gradient(top, rgba(0,0,0,0.15) 0%,rgba(0,0,0,0.2) 50%,rgba(0,0,0,0.3) 66%,rgba(0,0,0,0.5) 100%);
background: linear-gradient(to bottom, rgba(0,0,0,0.15) 0%,rgba(0,0,0,0.2) 50%,rgba(0,0,0,0.3) 66%,rgba(0,0,0,0.5) 100%);
}
}
.single-format-audio .post_header_wrap .post_featured.with_thumb:not(.with_audio):after {
display: none !important;
}
.single-format-audio .post_header_wrap .post_featured.with_thumb {
.post_audio {
@include abs-cb(2em, 10);
min-width: 460px;
margin: 0;
.post_audio_author,
.post_audio_title,
.post_audio_description {
color: var(--theme-color-extra_dark);
}
}
.post_audio.with_iframe {
min-width: 760px;
}
}
.single-format-audio {
.post_header_wrap_in_content,
.post_header_wrap_in_header {
.post_featured.with_thumb {
.post_audio {
width: 100%;
left: 0;
right: 0;
bottom: 0;
transform: none;
}
> div > div > .mejs-container .mejs-controls {
background-color: var(--theme-color-alter_bg_color);
padding-left: 10px;
padding-right: 10px;
}
}
}
}
[class*="single_style_style-"]:not(.single_style_style-1):not(.single_style_style-3) .post_header_wrap_in_header .post_featured.with_audio.with_thumb.audio_inited {
.post_audio {
opacity: 0;
bottom: -100px;
@include transition-all(0.3s);
}
.post_audio.show {
opacity: 1;
bottom: 0;
}
}
/* Btn for hide audio control on single post */
.post_audio_btn {
@include border-round;
@include box(4.72rem, 4.72rem, 4.8rem);
@include transition(all ease 0.3s);
background-color: var(--theme-color-alter_bg_color);
color: var(--theme-color-text_dark);
cursor: pointer;
font-size: 1.2rem;
margin-bottom: 1.7em;
text-align: center;
box-sizing: border-box;
padding-right: 0.2em;
position: absolute;
top: 50%;
left: 50%;
transform: translate( -50%, -50% );
display: block;
z-index: 3;
box-shadow: 0 0 5px 1px var(--theme-color-inverse_text_03);
}
.post_audio_btn:hover {
background-color: var(--theme-color-alter_bg_color);
color: var(--theme-color-alter_hover);
cursor: pointer;
}
.post_audio_btn:before {
content: '\EA10';
font-family: $theme_icons;
}
/* Shortcode "Audio" */
.trx_addons_audio_wrap.resized.list .trx_addons_audio_player {
opacity: 0;
}
.trx_addons_audio_wrap.resized.list .trx_addons_audio_player.current {
opacity: 1;
}
.trx_addons_audio_player {
border: none;
padding: 0;
.audio_info {
overflow: visible;
}
&.without_cover {
background: none;
border: none;
}
.audio_author + .audio_caption,
.audio_author + .audio_description {
margin-top: 5px;
}
.audio_info + .audio_embed,
.audio_info + .audio_frame {
margin-top: 25px;
}
.trx_addons_audio_player_wrap {
padding: 3.3em 3em;
background: var(--theme-color-alter_bg_color);
.audio_author {
color: var(--theme-color-text_dark);
margin: 0;
font-size: 14px;
line-height: 18px;
letter-spacing: 1.4px;
}
.audio_caption {
font-weight: 600;
font-size: 28px;
line-height: 1.2em;
margin: 0;
color: var(--theme-color-text_dark);
}
.audio_description {
font-size: 17px;
font-weight: 400;
line-height: 20px;
color: var(--theme-color-alter_text);
margin: 4px 0 0 0;
}
.audio_now_playing {
display: inline-block;
padding: 6px 16px;
@include font(11px, 14px, 700);
margin-top: 0;
margin-bottom: 1.55em;
letter-spacing: 1px;
text-transform: uppercase;
@include border-radius(0);
background-color: var(--theme-color-text_dark);
color: var(--theme-color-inverse_hover);
}
}
div.mejs-controls .mejs-time {
font-size: 16px;
font-weight: 600;
letter-spacing: 0;
color: var(--theme-color-text_dark);
}
&.with_cover {
padding: 0;
@include flex;
@include flex-direction(row);
@include flex-align-items(center);
&:after {
display: none;
}
.trx_addons_audio_player_image {
width: 27.5%;
max-height: 100%;
background-position: center center;
background-size: cover;
flex-shrink: 0;
@include border-box;
@include flex-align-self(stretch);
}
.trx_addons_audio_player_wrap {
@include flex;
@include flex-direction(column);
@include flex-justify-content(space-between);
@include border-box;
flex-grow: 1;
}
}
.trx_addons_audio_navigation {
top: 2.5em;
}
div.mejs-controls div.mejs-button {
width: 42px;
}
div.mejs-controls div.mejs-button > button {
font-size: 12px;
background-color: transparent !important;
@include box(42px, 42px, 37px);
letter-spacing: -2px;
margin: 0;
border: 2px solid var(--theme-color-text_dark);
@include border-radius(50%);
@include box-shadow(none);
@include transition-color(0.3s);
}
div.mejs-controls div.mejs-button.mejs-pause > button {
letter-spacing: 1px;
}
div.mejs-controls div.mejs-button.mejs-volume-button > button {
border: none !important;
font-size: 18px;
letter-spacing: 0;
}
div.mejs-controls div.mejs-button.mejs-volume-button.mejs-unmute > button {
letter-spacing: 8px;
}
.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {
background: var(--theme-color-text_dark);
}
div.mejs-controls .mejs-horizontal-volume-slider {
margin-left: 5px;
}
div.mejs-controls .mejs-time.mejs-duration-container {
margin-right: 25px;
}
div.mejs-controls .mejs-time-rail {
padding-top: 15px;
margin: 0 27px;
}
.sidebar & {
@include flex-direction(column);
.trx_addons_audio_player_wrap {
width: 100%;
padding: 1.8em;
background: var(--theme-color-bg_color);
@include border-box;
.audio_caption {
@include font(22px, 1.4em);
}
.trx_addons_audio_navigation {
top: 3em;
right: 2em;
@include font(13px, 1.3em);
> span span {
font-size: 1rem;
}
}
}
&.with_cover {
.trx_addons_audio_player_image {
height: 150px;
width: 100%;
}
}
}
}
.trx_addons_audio_wrap.resized.list .audio_frame {
bottom: auto;
position: relative;
}
.trx_addons_audio_wrap {
.trx_addons_audio_navigation {
z-index: 3;
@include font(15px, 1.75em, 500);
color: var(--theme-color-alter_dark);
> span {
opacity: 1;
}
}
}
/* WP Playlist */
.wp-playlist.wp-audio-playlist {
border: none;
margin: 0;
padding: 0;
.mejs-container {
padding: 0 2.7em 0 2.7em;
@include border-box;
min-height: 92px;
background: var(--theme-color-alter_bg_color);
}
.mejs-container .mejs-controls {
padding: 0 2.7em;
min-height: 42px;
margin-bottom: 50px;
}
div.mejs-controls div.mejs-button > button {
border-width: 2px;
border-color: var(--theme-color-alter_dark);
width: 42px;
height: 42px;
line-height: 37.5px;
letter-spacing: -2px;
}
div.mejs-controls div.mejs-button.mejs-pause > button {
letter-spacing: 0;
}
div.mejs-controls div.mejs-button.mejs-volume-button > button {
border: none !important;
font-size: 18px;
letter-spacing: 0;
}
div.mejs-controls div.mejs-button.mejs-volume-button.mejs-unmute > button {
letter-spacing: 8px;
}
.mejs-controls .mejs-horizontal-volume-slider .mejs-horizontal-volume-current {
background: var(--theme-color-text_dark);
}
div.mejs-controls .mejs-horizontal-volume-slider {
margin-left: 3px;
}
div.mejs-controls .mejs-time.mejs-duration-container {
margin-right: 15px;
}
div.mejs-controls .mejs-time-rail {
padding-top: 15px;
margin: 0 27px;
}
}
.wp-playlist.wp-audio-playlist .wp-playlist-current-item {
height: auto;
padding: 3.1em 2.8em 1.7em;
margin-bottom: 0;
@include border-box;
}
.wp-playlist.wp-audio-playlist .wp-playlist-current-item img {
display: none;
}
.wp-playlist.wp-audio-playlist .wp-playlist-item-title {
@include font(28px, 1.2em, 600);
text-transform: uppercase;
}
.wp-playlist.wp-audio-playlist .wp-playlist-item-artist {
@include font(17px, 22px, 400);
padding-bottom: 2px;
text-transform: none;
color: var(--theme-color-alter_text);
}
.wp-playlist.wp-audio-playlist .wp-playlist-item-title + .wp-playlist-item-artist {
margin-top: 5px;
}
.wp-playlist.wp-audio-playlist .wp-playlist-tracks {
margin-top: 2.3em;
}
.wp-playlist.wp-audio-playlist .wp-playlist-tracks .wp-playlist-caption,
.wp-playlist.wp-audio-playlist .wp-playlist-tracks .wp-playlist-item-length,
.wp-playlist.wp-audio-playlist .wp-playlist-tracks .wp-playlist-item-title {
line-height: 1.3em;
font-size: 19px;
}
.wp-playlist.wp-audio-playlist .wp-playlist-tracks .wp-playlist-item-artist {
line-height: 1.3em;
font-size: 18px;
}
.wp-playlist.wp-audio-playlist .wp-playlist-tracks .wp-playlist-item .wp-playlist-item-length {
right: 0;
top: 20px;
}
.wp-playlist.wp-audio-playlist .wp-playlist-tracks .wp-playlist-item {
padding: 20px 0;
}
.wp-playlist.wp-audio-playlist .wp-playlist-tracks {
font-size: 19px;
line-height: 1.3em;
.wp-playlist-item-artist {
padding: 0;
margin: 0;
color: var(--theme-color-alter_text);
}
.wp-playlist-item-title {
font-weight: 600;
text-transform: uppercase;
}
.wp-playlist-caption {
font-weight: 600;
}
.wp-playlist-item-length {
font-weight: 600;
}
}
.wp-playlist.wp-audio-playlist .wp-playlist-tracks .wp-playlist-playing .wp-playlist-item-length,
.wp-playlist.wp-audio-playlist .wp-playlist-tracks .wp-playlist-playing .wp-playlist-item-title,
.wp-playlist.wp-audio-playlist .wp-playlist-tracks .wp-playlist-playing .wp-playlist-item-artist {
text-decoration: none;
}
.wp-playlist.wp-audio-playlist .wp-playlist-tracks .wp-playlist-item:first-child {
padding-top: 0;
}
.wp-playlist.wp-audio-playlist .wp-playlist-tracks .wp-playlist-item:first-child .wp-playlist-item-length {
top: 0;
}
.wp-playlist.wp-audio-playlist .wp-playlist-tracks .wp-playlist-item:last-child {
padding-bottom: 0;
}
.ua_edge .wp-playlist.wp-audio-playlist .wp-playlist-current-item {
margin-bottom: -1px;
}
// Media elements
.post_featured.with_thumb .trx_addons_video_player .mejs-controls {
background: var(--theme-color-alter_bg_color);
}
.post_featured > div > .mejs-container {
background: var(--theme-color-extra_bg_color_05);
}
.post_featured > div > .mejs-container .mejs-controls {
background: var(--theme-color-alter_bg_color);
body.ua_firefox & {
bottom: -1px;
}
}
div.mejs-controls .mejs-time-rail {
padding-top: 15px;
margin: 0 22px;
}
div.mejs-controls .mejs-time-handle-content {
top: -7px;
@include border-radius(2px !important);
}
div.mejs-controls .mejs-time-float {
color: #0d0d12;
background: #ffffff;
}
div.mejs-controls .mejs-time-float-corner {
border-top-color: #0d0d12;
}
div.mejs-controls .mejs-time {
@include font(16px, '', 600);
padding-top: 16px;
height: 30px;
color: var(--theme-color-text_dark);
}
.sidebar .mejs-controls .mejs-time,
.footer_wrap .mejs-controls .mejs-time {
display:none;
}
div.mejs-button > button {
@include border-round;
background-image: none !important;
}
div.mejs-button > button:focus {
outline: none;
}
div.mejs-controls div.mejs-button {
width: 40px;
flex-shrink: 0;
}
div.mejs-controls div.mejs-button > button {
font-size: 12px;
background: none !important;
border: 1px solid var(--theme-color-alter_bd_color);
@include square(40px);
line-height: 38px;
margin: 0;
@include border-radius(50%);
letter-spacing: -4px;
@include transition-color(0.3s);
}
[class*="scheme_"].sidebar {
div.mejs-controls div.mejs-button > button,
div.mejs-controls div.mejs-button > button:focus,
div.mejs-controls div.mejs-button > button:hover {
border-color: var(--theme-color-bd_color);
}
}
div.mejs-controls div.mejs-button.mejs-pause > button {
letter-spacing: -1px;
}
div.mejs-controls div.mejs-button.mejs-volume-button > button {
font-size: 12px;
letter-spacing: -1px;
}
div.mejs-controls div.mejs-button.mejs-volume-button.mejs-unmute > button {
letter-spacing: 4px;
}
div.mejs-controls .mejs-horizontal-volume-total {
top: 19px;
}
div.mejs-controls .mejs-horizontal-volume-slider {
margin-left: 20px;
}
div.mejs-controls .mejs-time {
padding-top: 16px;
}
div.mejs-controls .mejs-time.mejs-currenttime-container {
margin-left: 18px;
}
div.mejs-controls .mejs-time.mejs-duration-container {
margin-right: 17px;
}
.mejs-horizontal-volume-total,
.mejs-time-buffering, .mejs-time-current,
.mejs-time-float-corner, .mejs-time-hovered,
.mejs-time-loaded,
.mejs-time-marker,
.mejs-time-total {
height: 4px !important;
}
.mejs-time-total {
margin: 5px 0 0;
will-change: transform;
}
.mejs-horizontal-volume-total {
margin-top: 1px;
}
/* Video */
.post_featured.without_thumb {
display: block;
}
.post_featured.with_thumb {
position:relative;
}
.post_featured.with_thumb .post_video,
.sc_layouts_blog_item_featured .post_featured.with_thumb .post_video {
// Next 3 rows added to avoid using translate(-50%, -50%) on the inner iframe
// because it move video to the left top corner in the fullscreen mode
@include flex;
@include flex-align-items(center);
@include flex-justify-content(center);
@include abs-cover(2);
@include transition-all;
text-align:center;
opacity:0;
overflow:hidden;
}
.post_featured.with_thumb .post_video:before,
.sc_layouts_blog_item_featured .post_featured.with_thumb .post_video:before {
content:' ';
display:inline-block;
padding-top:55%;
@include box(0, 0);
}
.post_featured.with_thumb img,
.sc_layouts_blog_item_featured .post_featured.with_thumb img {
position:relative;
z-index:2;
}
.post_featured.with_thumb.with_audio img,
.sc_layouts_blog_item_featured .post_featured.with_thumb.with_audio img {
z-index:1;
}
.post_featured.with_thumb .mask,
.sc_layouts_blog_item_featured .post_featured.with_thumb .mask {
z-index:3;
background-color: rgba(0,0,0,0.5);
opacity:0;
}
.post_featured.with_thumb:hover .mask,
.sc_layouts_blog_item_featured .post_featured.with_thumb:hover .mask {
opacity:1;
}
.trx_addons_video_player.with_cover .video_hover,
.post_featured.with_thumb .post_video_hover,
.sc_layouts_blog_item_featured .post_featured.with_thumb .post_video_hover {
@include square(85px);
@include border-round;
@include transition-all;
@include abs-lt(50%, 50%, 2000);
@include transform(none);
// translate make the bad antialias on Webkit, use the negative margin instead
// @include translate(-50%, -50%);
margin: -42px 0 0 -42px;
font-size: 21px;
letter-spacing: -6px;
opacity: 1;
cursor: pointer;
overflow:hidden;
color: var(--theme-color-inverse_dark);
background-color: var(--theme-color-inverse_link);
border: none;
}
.post_header_wrap .post_featured.with_thumb .post_video_hover {
opacity: 1;
margin-top: -42px;
}
.trx_addons_video_player.with_cover:hover .video_hover {
opacity: 1;
margin-top: -42px;
}
.trx_addons_video_player.with_cover .video_mask {
display: none;
}
.trx_addons_video_player.with_cover.video_play {
background-color: var(--theme-color-inverse_dark);
}
.trx_addons_video_player.with_cover.video_play img {
opacity: 0;
}
.trx_addons_video_player.with_cover .video_hover:hover,
.post_featured.with_thumb .post_video_hover:hover,
.sc_layouts_blog_item_featured .post_featured.with_thumb .post_video_hover:hover {
color: var(--theme-color-inverse_link);
background-color: var(--theme-color-text_link);
}
[class*="scheme_"].sidebar .trx_addons_video_player.with_cover .video_hover {
color: var(--theme-color-alter_link);
}
[class*="scheme_"].sidebar .trx_addons_video_player.with_cover .video_hover:hover {
color: var(--theme-color-inverse_hover);
background-color: var(--theme-color-alter_link);
}
.trx_addons_video_player.with_cover .video_hover,
.post_header_wrap .post_featured.with_thumb .post_video_hover,
.body_style_fullwide .post_featured.with_thumb .post_video_hover,
.post_layout_excerpt .post_featured.with_thumb .post_video_hover {
font-size: 21px;
@include square(85px);
}
.widget_video .trx_addons_video_player.with_cover .video_hover {
font-size: 21px;
}
.sidebar_show .post_content_single .trx_addons_video_player.with_cover {
&:hover .video_hover,
.video_hover {
@include square(65px);
font-size: 15px;
margin: -32px 0 0 -32px;
}
}
.sidebar .trx_addons_video_player.with_cover .video_hover,
.footer_wrap .trx_addons_video_player.with_cover .video_hover {
font-size: 1.8em;
}
.trx_addons_video_player.with_cover .video_hover:before,
.post_featured.with_thumb .post_video_hover:before,
.sc_layouts_blog_item_featured .post_featured.with_thumb .post_video_hover:before {
content: '\e9e9';
font-family:$theme_icons;
}
.post_featured.with_thumb .post_video_hover > a,
.sc_layouts_blog_item_featured .post_featured.with_thumb .post_video_hover > a {
display: block;
@include abs-cover;
}
.post_featured.post_video_play .post_video,
.sc_layouts_blog_item_featured .post_featured.post_video_play .post_video {
opacity:1;
z-index:100;
background-color:#000;
}
.post_featured.post_video_play .mask,
.sc_layouts_blog_item_featured .post_featured.post_video_play .mask {
opacity: 1;
background-color:#000;
}
.post_featured.post_video_play .post_video_hover,
.sc_layouts_blog_item_featured .post_featured.post_video_play .post_video_hover {
display:none;
}
/* Gallery */
.format-gallery .post_featured.with_thumb,
.single-format-gallery .post_header_wrap .post_featured.with_thumb {
> img {
//opacity: 0;
@include scale(0.998, 0.998);
}
.slider_outer {
@include abs-cc(1000);
width: 100%;
height: 100% !important;
.slider_container {
height: 100% !important;
}
}
}
/* Aside, Link, Status, Quote */
.format-quote .post_content,
.format-aside .post_content,
.format-link .post_content,
.format-status .post_content {
padding: 0;
text-align:left;
}
.format-aside .post_content_inner, .post_item_single.format-aside .post_content > p,
.format-link .post_content_inner, .post_item_single.format-link .post_content > p,
.format-status .post_content_inner, .post_item_single.format-status .post_content > p {
@include font(1.6667rem, 1.4em);
}
.format-aside .post_content_inner {
padding: 1em 1.3158em;
}
.format-aside .post_content_inner {
color: var(--theme-color-alter_dark);
background-color: var(--theme-color-alter_bg_color);
}
.format-aside .post_content_inner:after {
display:none;
}
.format-aside .post_content_inner + .post_meta,
.format-link .post_content_inner + .post_meta,
.format-status .post_content_inner + .post_meta {
margin-top:1.6em;
}
.format-link .post_content_inner,
.format-status .post_content_inner {
color: var(--theme-color-text_dark);
}
/* Chat */
.format-chat p > em,
.format-chat p > b,
.format-chat p > strong {
display:inline-block;
margin-top:1.7em;
}
.format-chat p:first-child > em,
.format-chat p:first-child > b,
.format-chat p:first-child > strong {
margin-top:0;
}
.format-chat p > b,
.format-chat p > strong {
color: var(--theme-color-text_dark);
}
/* 7.5 Paginations
-------------------------------------------------------------- */
/* Blog pagination: Load more and Infinite */
.sc_item_pagination_load_more,
.nav-links-more,
.woocommerce-links-more {
letter-spacing: 0;
text-align: center;
margin-top: 2.8em;
.nav-links,
.nav-load-more,
.woocommerce-load-more {
@include theme_button_filled;
&:hover {
@include theme_button_colors_hover;
}
}
&.loading {
span {
opacity: 0;
}
.nav-links:before,
.nav-load-more:before,
.woocommerce-load-more:before {
opacity: 1 !important;
}
}
}
// Widget pagination
nav.sc_item_pagination {
margin-top: 2.5em;
}
.woocommerce-links-more {
margin-top: 1em;
}
.nav-links-more.nav-links-infinite,
.woocommerce-links-more.woocommerce-links-infinite {
display:none;
}
.nav-links-more a,
.woocommerce-links-more a {
display:inline-block;
padding-top: 2em;
position:relative;
}
.sc_item_pagination_load_more a:before,
.nav-links-more a:before,
.woocommerce-links-more a:before {
content: '\e929';
font-family:$theme_icons;
font-size:1em;
font-weight:normal;
display:block;
text-align:center;
margin-left:-0.5em;
margin-top:-0.5em;
@include abs-lt(50%, 50%);
@include square(1em);
opacity: 0;
}
.nav-links-more.loading a:before,
.woocommerce-links-more.loading a:before {
content: '\e82d';
@include animation(spin 2s infinite linear);
}
.nav-links-infinite a span,
.woocommerce-links-infinite a span {
opacity: 0;
}
.nav-links-infinite.loading,
.woocommerce-links-infinite.loading {
display: block;
}
/* Blog pagination: Prev/Next links */
.nav-links-old {
overflow:hidden;
@include font(14px, 20px, 700);
text-transform: uppercase;
letter-spacing: 1px;
margin-top: 3em;
color: var(--theme-color-text_dark);
a {
color: var(--theme-color-text_dark) !important;
}
}
.nav-links-old a:hover {
color: var(--theme-color-text_link) !important;
}
.nav-links-old .nav-prev a:before,
.nav-links-old .nav-next a:after {
font-family:$theme_icons;
font-weight:normal;
display:inline;
@include abs-lt;
font-size: 11px;
font-weight: 500;
}
.nav-links-old .nav-prev {
float:left;
position:relative;
padding-left: 2em;
}
.nav-links-old .nav-prev a:before {
content: '\EA07';
}
.nav-links-old .nav-next {
float:right;
position:relative;
padding-right:2em;
}
.nav-links-old .nav-next a:after {
content: '\E9A4';
left: auto;
right: 0;
}
/* Blog pagination: Page numbers */
div.esg-filters,
.woocommerce nav.woocommerce-pagination ul,
.comments_pagination,
.nav-links,
.page_links {
font-size: 17px;
font-weight: 600;
text-transform: none;
margin-top: 2.8em;
text-align:left;
border:none;
list-style-type:none;
clear: both;
}
.woocommerce nav.woocommerce-pagination ul {
margin-top: 1em;
}
.page_links .page_links_title {
display: inline-block;
vertical-align: top;
margin: 0.75em 0.5em 0 0;
}
.esg-filters div.esg-navigationbutton,
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span.current,
.page_links > span:not(.page_links_title),
.page_links > a,
.comments_pagination .page-numbers,
.nav-links .page-numbers {
display:inline-block;
vertical-align:top;
font-size:inherit;
font-weight: inherit;
margin: 2px 5px 2px 0;
padding: 0;
border: 1px solid var(--theme-color-bd_color);
color: var(--theme-color-text_dark);
@include box-sizing(border-box);
@include square(52px);
line-height: 50px;
@include border-radius(0);
@include transition-properties(color, background-color, border-color, background-position);
&.dots {
border: none;
width: 46px;
}
}
.esg-filters div.esg-navigationbutton,
.woocommerce nav.woocommerce-pagination ul li a,
.page_links > a,
.comments_pagination .page-numbers,
.nav-links .page-numbers {
color: var(--theme-color-text_dark);
background-color: var(--theme-color-input_bg_color);
}
.nav-links .page-numbers.current,
.comments_pagination .page-numbers.current,
.woocommerce nav.woocommerce-pagination ul li span.current,
.esg-filters div.esg-navigationbutton.selected {
color: var(--theme-color-inverse_hover);
background-color: var(--theme-color-text_dark);
border-color: var(--theme-color-text_dark);
}
.esg-filters div.esg-navigationbutton:hover,
.woocommerce nav.woocommerce-pagination ul li a:hover,
.woocommerce nav.woocommerce-pagination ul li a:focus,
.page_links > a:hover,
.page_links > span:not(.page_links_title),
.comments_pagination a.page-numbers:hover,
.nav-links a.page-numbers:hover {
color: var(--theme-color-text_dark);
background-color: var(--theme-color-alter_bg_color);
}
.esg-filters .esg-navigationbutton i[class*="eg-icon-"] {
color: inherit;
}
.esg-filters .esg-navigationbutton i.eg-icon-left-open:before {
content: '\e939';
font-family: $theme_icons;
}
.esg-filters .esg-navigationbutton i.eg-icon-right-open:before {
content: '\e93a';
font-family: $theme_icons;
}
.woocommerce nav.woocommerce-pagination {
text-align: left;
}
.woocommerce nav.woocommerce-pagination ul li {
border: none;
display:inline-block;
margin: 0;
}
.esg-filters div.esg-navigationbutton:hover,
.esg-filters div.esg-navigationbutton.selected {
@include box-shadow(none);
}
.nav-links .page-numbers.first,
.nav-links .page-numbers.prev,
.nav-links .page-numbers.next,
.nav-links .page-numbers.last,
.comments_pagination .page-numbers.first,
.comments_pagination .page-numbers.prev,
.comments_pagination .page-numbers.next,
.comments_pagination .page-numbers.last,
.woocommerce nav.woocommerce-pagination ul li a.first,
.woocommerce nav.woocommerce-pagination ul li a.prev,
.woocommerce nav.woocommerce-pagination ul li a.next,
.woocommerce nav.woocommerce-pagination ul li a.last {
text-indent: -200px;
overflow: hidden;
position: relative;
}
.nav-links .page-numbers.first:before,
.nav-links .page-numbers.prev:before,
.nav-links .page-numbers.next:before,
.nav-links .page-numbers.last:before,
.comments_pagination .page-numbers.first:before,
.comments_pagination .page-numbers.prev:before,
.comments_pagination .page-numbers.next:before,
.comments_pagination .page-numbers.last:before,
.woocommerce nav.woocommerce-pagination ul li a.first:before,
.woocommerce nav.woocommerce-pagination ul li a.prev:before,
.woocommerce nav.woocommerce-pagination ul li a.next:before,
.woocommerce nav.woocommerce-pagination ul li a.last:before {
font-family: $theme_icons;
@include abs-lt;
top: 1px;
width: 100%;
text-align: center;
text-indent: 0;
font-size: 14px;
font-weight: 400;
}
.nav-links .page-numbers.first:before,
.comments_pagination .page-numbers.first:before,
.woocommerce nav.woocommerce-pagination ul li a.first:before {
content:'\e8af';
}
.nav-links .page-numbers.prev:before,
.comments_pagination .page-numbers.prev:before,
.woocommerce nav.woocommerce-pagination ul li a.prev:before {
content:'\e907';
}
.nav-links .page-numbers.next:before,
.comments_pagination .page-numbers.next:before,
.woocommerce nav.woocommerce-pagination ul li a.next:before {
content:'\e908';
}
.nav-links .page-numbers.last:before,
.comments_pagination .page-numbers.last:before,
.woocommerce nav.woocommerce-pagination ul li a.last:before {
content:'\e8b0';
}
/* Attachments navigation */
.image-navigation .nav-previous,
.image-navigation .nav-next {
float:none;
width:auto;
text-align:left;
padding:0;
margin:0;
@include abs-lc(1.5em);
}
.image-navigation .nav-next {
left: auto;
right: 1.5em;
text-align:right;
}
.image-navigation .nav-previous a,
.image-navigation .nav-next a {
display:block;
padding: 1.1em 1em;
width: 0;
max-width:20em;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
background-color:rgba(0,0,0,0);
border:1px solid rgba(0,0,0,0);
color: #fff;
@include border-radius(50%);
}
.image-navigation .nav-previous a:hover,
.image-navigation .nav-next a:hover {
width: auto;
color: #fff;
background-color:rgba(0,0,0,0.6);
border-color:rgba(0,0,0,0.6);
@include border-radius(2em);
}
.image-navigation .nav-previous a:hover {
padding-left:3.5em;
}
.image-navigation .nav-next a:hover {
padding-right:3.5em;
}
.image-navigation .nav-previous a:after,
.image-navigation .nav-next a:after {
content: '\e8ef';
font-family: $theme_icons;
@include abs-lc;
@include square(4em);
@include border-round;
border: 1px solid #000;
background-color: #333;
color: #fff;
}
.image-navigation .nav-next a:after {
content: '\e8f0';
left: auto;
right: 0;
}
.image-navigation .nav-previous a:hover:after,
.image-navigation .nav-next a:hover:after {
border-color: transparent;
background-color: transparent;
}
/* 7.6 Full post in the blog
------------------------------------------------------ */
.full_post_loading {
position: relative;
}
.full_post_loading:after {
content: ' ';
@include bg-mask(#fff, 0.7, 9999);
background-color: var(--theme-color-bg_color_07);
background-image:url(../../../images/preloader2.png);
background-position:center;
background-repeat:no-repeat;
}
.full_post_content {
position: relative;
.post_header_wrap {
.post_header {
+ .post_featured {
margin-top: 30px;
}
}
+ .post_content {
margin-top: 30px !important;
}
}
}
.posts_container .full_post_content {
margin-top: 7em;
padding-top: 7em;
border-top: 1px solid var(--theme-color-bd_color);
}
.posts_container .full_post_content:not(:last-child) {
margin-bottom: 7em;
padding-bottom: 7em;
border-bottom: 1px solid var(--theme-color-bd_color);
}
.posts_container {
.post_item_container {
+ .full_post_content {
@include flex;
flex-direction: column;
align-items: flex-end;
.full_post_close {
margin-bottom: -50px;
z-index: 2001;
}
}
&.post_format_audio {
.post_featured.with_thumb {
.post_audio {
.post_info_audio {
.post_audio_description,
.post_audio_title,
.post_audio_author {
overflow: hidden;
text-overflow: ellipsis;
max-width: 100%;
display: -webkit-box;
-webkit-box-orient: vertical;
display: -moz-box;
-moz-box-orient: vertical;
box-orient: vertical;
}
.post_audio_author {
-webkit-line-clamp: 1;
-moz-line-clamp: 1;
line-clamp: 1;
}
.post_audio_title {
-webkit-line-clamp: 2;
-moz-line-clamp: 2;
line-clamp: 2;
}
.post_audio_description {
-webkit-line-clamp: 3;
-moz-line-clamp: 3;
line-clamp: 3;
}
}
}
}
}
}
}
.sc_item_posts_container .full_post_content,
.sc_item_posts_container .full_post_content:not(:last-child) {
margin-bottom: 2em;
padding-bottom: 2em;
border-bottom: 1px solid var(--theme-color-bd_color);
}
.full_post_opened:first-child + .full_post_content {
margin-top: 0;
padding-top: 0;
border-top: none;
}
.full_post_read {
overflow: visible;
}
.sc_blogger_item.full_post_read .entry-title, // posts in shortcode Blogger
.full_post_read .post_title, // blog posts
.full_post_read .sc_layouts_blog_item_title { // custom posts layouts
position: relative;
}
.full_post_read .sc_layouts_blog_item_title {
display: inline-block;
vertical-align: top;
}
.sc_blogger_item.full_post_read .entry-title:after, // posts in shortcode Blogger
.full_post_read .post_title:after, // blog posts
.full_post_read .sc_layouts_blog_item_title:after { // custom posts layouts
content: ' ';
@include box(2em, 1em);
@include abs-lt(-0.5em,-0.2em);
@include rotate(-20deg);
opacity: 0.7;
background-image: url(../../../images/read.png);
background-size: contain;
background-repeat: no-repeat;
background-position: center;
pointer-events: none;
display: none; // Hide read marker by default
}
.full_post_read .sc_layouts_blog_item_title .post_title:after {
display: none;
}
button.full_post_close {
@include sticky-top(12em, 1000);
@include square(50px);
@include border-box;
border-radius: 50% !important;
float: right;
margin: 0 0 1em 2em;
cursor: pointer;
color: var(--theme-color-text_link);
background-color: var(--theme-color-bg_color);
@include box-shadow(0 2px 4px 0 rgba(0,0,0,0.2));
}
button.full_post_close:hover {
color: var(--theme-color-text_hover);
}
button.full_post_close:after {
content: '\e916';
font-family: $theme_icons;
}
.full_post_progress {
@include abs-lt(0,0,-1);
pointer-events: none;
display: block;
@include square(100%);
@include border-round;
@include rotate(-90deg);
-webkit-backface-visibility: hidden;
}
.full_post_progress svg {
fill: currentColor;
}
.full_post_progress_bar {
fill: transparent;
stroke: var(--theme-color-text_link);
stroke-width: 2px;
stroke-dashoffset: 0;
stroke-dasharray: 137.4;
}
button.full_post_read_complete:after {
content: '\e8ab';
}
.full_post_read_complete .full_post_progress {
display: none;
}
/* 8. Single page parts
-------------------------------------------------------------- */
.structured_data_snippets {
display: none;
}
.post_item_single a.post_meta_item:hover,
.post_item_single .post_meta_item > a:hover,
.post_item_single .post_meta_item .socials_caption:hover,
.post_item_single .post_edit a:hover {
color: var(--theme-color-text_hover);
}
.post_item_single:after {
content: ' ';
display: block;
width: 100%;
height: 0;
clear: both;
}
.post_content > p:last-child {
margin-bottom: 0;
}
.post_item_single.format-aside .post_content,
.post_item_single.format-link .post_content,
.post_item_single.format-status .post_content {
padding: 0;
text-align:left;
}
.post_item_single.format-quote .post_content {
background-color:transparent;
padding-top:0;
}
.post_item_single.format-quote .post_content > blockquote:first-child {
margin-top: 0;
}
.section_title {
margin:0 0 1em;
text-align:left;
}
.sidebar_hide.narrow_content .post_item_single.post_type_post {
width: 75%;
margin: 0 auto;
~ .show_comments_single,
~ section {
width: 75%;
margin-left: auto;
margin-right: auto;
}
}
.post_content_single:after {
content: ' ';
display: block;
@include box(100%, 0);
clear: both;
}
/* Vertical share */
.sidebar_hide.narrow_content .post_info_vertical {
@include abs-lt( calc( -1 * var(--theme-var-padding_narrow) ), 0 );
}
.sidebar_show .post_info_vertical,
.sidebar_hide:not(.narrow_content) .post_info_vertical,
.sidebar_hide.narrow_content .previous_post_content.sidebar_show .post_info_vertical {
@include abs-lt;
}
.sidebar_show .post_info_vertical_present,
.sidebar_show .post_info_vertical_present + .post_footer,
.sidebar_hide:not(.narrow_content) .post_info_vertical_present,
.sidebar_hide:not(.narrow_content) .post_info_vertical_present + .post_footer {
padding-left: 15%;
}
.post_info_vertical_present {
position: relative;
}
.sidebar_show .post_info_vertical_fixed_on,
.sidebar_hide.narrow_content .post_info_vertical_fixed_on,
.sidebar_hide:not(.narrow_content) .post_info_vertical_fixed_on,
.sidebar_hide.narrow_content .previous_post_content.sidebar_show .post_info_vertical_fixed_on {
position: fixed !important;
z-index: 2;
}
/* 8.1 Post header
------------------------------------------------------ */
.post_item_single > .post_featured {
margin-bottom:3em;
text-align:center; // Align the featured image to the center if its width less then width of the content area
}
.post_item_single > .post_featured > img {
width: auto;
max-height: 80vh;
}
.post_featured.post_attachment {
margin-bottom: 0.5em;
}
.entry-caption {
text-align:center;
font-style:italic;
}
.post_item_single .post_content > h1:first-child,
.post_item_single .post_content > h2:first-child,
.post_item_single .post_content > h3:first-child,
.post_item_single .post_content > h4:first-child,
.post_item_single .post_content > h5:first-child,
.post_item_single .post_content > h6:first-child,
.post_item_single .post_content > .vc_row:first-child h1:first-child,
.post_item_single .post_content > .vc_row:first-child h2:first-child,
.post_item_single .post_content > .vc_row:first-child h3:first-child,
.post_item_single .post_content > .vc_row:first-child h4:first-child,
.post_item_single .post_content > .vc_row:first-child h5:first-child,
.post_item_single .post_content > .vc_row:first-child h6:first-child,
.post_item_single .post_content .elementor-text-editor > h1:first-child,
.post_item_single .post_content .elementor-text-editor > h2:first-child,
.post_item_single .post_content .elementor-text-editor > h3:first-child,
.post_item_single .post_content .elementor-text-editor > h4:first-child,
.post_item_single .post_content .elementor-text-editor > h5:first-child,
.post_item_single .post_content .elementor-text-editor > h6:first-child,
.post_item_single .post_title {
margin-top: 0;
}
.post_item_single .post_header_single .post_title {
margin-bottom: 0;
}
/* 8.2 Post footer
------------------------------------------------------ */
/* Tags */
.post_item_single .post_tags_single {
margin-top: 2.8em;
@include flex;
@include flex-direction(row);
@include flex-justify-content(flex-start);
@include flex-wrap(wrap);
}
.post_item_single .post_tags_single .post_meta_label {
display: none;
vertical-align: middle;
margin-right: 0.5em;
}
.post_item_single .post_tags_single a {
display: inline-block;
vertical-align: top;
padding: 8px 18px;
margin: 0.25em 0.5em 0.25em 0;
font-size: 13px;
font-weight: 400;
line-height: 16px;
letter-spacing: 0;
background-color: var(--theme-color-alter_bg_color);
color: var(--theme-color-text);
border: 1px solid var(--theme-color-bd_color);
@include box-sizing(border-box);
@include border-radius(0);
@include transition-properties(color);
}
.scheme_dark .post_item_single .post_tags_single a {
background-color: transparent;
}
.post_item_single .post_tags_single a:hover {
color: var(--theme-color-text_link);
}
/* Emotions */
.post_item_single .trx_addons_emotions {
margin-top: 3em;
}
/* Likes and share in the single post */
.post_item_single .post_meta_single {
margin-top: 4em;
padding-top: 2.2em;
border-top: 1px solid var(--theme-color-bd_color);
text-align: right;
@include flex;
@include flex-direction(row);
@include flex-justify-content(space-between);
@include flex-align-items(center);
}
.post_item_single .post_content > .trx_addons_emotions + .post_meta_single {
@include flex-justify-content(flex-start);
}
/* Likes */
.post_meta_likes.disabled, .comment_counters_likes.disabled {
color: var(--theme-color-text_link);
}
.post_item_single .post_meta_single .post_meta_likes {
margin-right: 10px;
flex-shrink: 0;
&:before {
display: inline-block;
font-size: 14px;
@include box(43px,43px,46px !important);
letter-spacing: -1px;
@include border-round;
border: 1px solid var(--theme-color-bd_color);
color: var(--theme-color-text_dark);
@include transition-property(color);
content: '\e9cc';
font-family: $theme_icons;
margin: 0 0.6em 0 0;
}
&.trx_addons_icon-heart:before {
content: '\e8aa';
font-size: 16px;
}
&.disabled:before {
color: var(--theme-color-text_link);
}
&:hover:before {
color: var(--theme-color-text_hover);
}
&:after {
display: none;
}
.post_meta_label {
display: none;
}
}
/* Share */
.post_item_single .post_meta_single .post_share {
&:after {
display: none;
}
.socials_share.socials_type_block .social_item {
margin: 3px 0 3px 7px;
&:first-child {
margin-left: 0;
}
&:hover {
.social_icon {
@include transform(translateY(-5px));
}
}
.social_icon {
font-size: 16px;
position: relative;
display:block;
will-change: transform;
@include transform(translateY(0px));
@include transition-all(0.3s);
@include square(45px);
letter-spacing: -1px;
@include border-radius(50%);
background-color: var(--theme-color-alter_bg_color) !important;
color: var(--theme-color-text_dark) !important;
&[class*="twitter"] { background-color: #48BDE9 !important; color: #fff !important; }
&[class*="facebook"] { background-color: #4F5FBF !important; color: #fff !important; }
&[class*="dribble"] { background-color: #EA4C89 !important; color: #fff !important; }
&[class*="email"] { background-color: #7A7E83 !important; color: #fff !important; }
.icon-twitter-new:before {
position: relative;
top: -1px;
}
}
}
}
/* Single page Prev/Next navigation */
.nav-links-single {
margin-top: 1.8em;
padding-top: 3em;
border-top: 1px solid var(--theme-color-bd_color);
}
.nav-links-single .nav-links {
margin-top: 0;
text-align: left;
overflow:hidden;
text-transform:none;
a {
display:block;
}
.nav-arrow-label {
display: block;
text-transform: uppercase;
@include font(13px, 18px, 700);
letter-spacing: 1.4px;
}
.nav-arrow-label:before,
.nav-arrow-label:after {
font-family: $theme_icons;
display: inline-block;
vertical-align: top;
font-size: 9px;
position: relative;
top: 0;
font-weight: 400;
right: 1px;
}
.nav-previous,
.nav-next {
width:50%;
@include border-box;
}
.nav-previous {
float:left;
text-align:left;
padding-right:15px;
}
.nav-previous .nav-arrow-label:before {
content: '\e9e5';
margin-right: 10px;
right: auto;
left: 1px;
}
.nav-previous .post-title {
text-align:left;
}
.nav-next {
float:right;
text-align:right;
padding-left:15px;
}
.nav-next .nav-arrow-label:after {
content: '\e9e6';
margin-left: 10px;
}
.nav-next .post-title {
text-align:right;
}
.nav-arrow-label,
.post-title,
.post_date {
@include transition-colors;
}
.post-title {
margin: 12px 0 0;
font-size: 19px;
line-height: 1.3em;
font-weight: 600;
}
.meta-nav,
.post_date {
display: block;
font-size:16px;
font-weight:normal;
}
.post_date {
display: none;
}
.nav-arrow-label,
.meta-nav,
.post_date {
color: var(--theme-color-text_light);
}
a:hover .post-title {
color: var(--theme-color-text_dark);
}
}
.nav-links-single.nav-links-with-thumbs .nav-links {
a {
position:relative;
min-height: 6em;
z-index:1;
}
a .nav-arrow {
@include square(6em);
overflow:hidden;
text-align:center;
@include abs-lt;
@include bg-cover;
}
a .nav-arrow:before {
content: ' ';
display:block;
background-color:#fff;
opacity:0;
@include abs-cover;
@include transition-all;
}
a:hover .nav-arrow:before {
opacity:0.5;
}
a .nav-arrow:after {
content: '\e939';
font-family: $theme_icons;
display:inline-block;
position:relative;
z-index:2;
top: 3em;
opacity:0;
color: #292929;
@include transition-all;
}
a:hover .nav-arrow:after {
top: 0;
opacity:1;
}
.nav-previous a {
padding-left: 8.5em;
}
.nav-next a {
padding-right: 8.5em;
}
.nav-next a .nav-arrow {
right: 0;
left: auto;
}
.nav-next a .nav-arrow:after {
content: '\e93a';
}
.post-title {
margin:0.1em 0;
}
}
.nav-links-single.nav-links-fixed {
position: fixed;
z-index: 10;
bottom: 100px;
left: 20px;
right: 20px;
opacity: 0;
@include transition-property(opacity);
margin-top: 0;
padding-top: 0;
border-top: none;
}
.menu_side_left .nav-links-single.nav-links-fixed {
margin-left: var(--theme-var-menu_side);
}
.menu_side_right .nav-links-single.nav-links-fixed {
margin-right: var(--theme-var-menu_side);
}
.nav-links-single.nav-links-fixed.nav-links-visible {
opacity: 1;
}
.nav-links-single.nav-links-fixed .nav-links {
padding: 0;
margin: 0;
border-width: 0;
border-color: var(--theme-color-bd_color);
}
.nav-links-single.nav-links-fixed .nav-links .nav-previous,
.nav-links-single.nav-links-fixed .nav-links .nav-next {
@include abs-lb;
width: 280px;
padding: 15px;
border: 1px solid var(--theme-color-bd_color);
background-color: var(--theme-color-bg_color);
@include transition-properties(left, right);
}
.nav-links-single.nav-links-fixed .nav-links .nav-previous {
left: -300px;
}
.nav-links-single.nav-links-fixed.nav-links-visible .nav-links .nav-previous {
left: 0;
}
.nav-links-single.nav-links-fixed .nav-links .nav-next {
left: auto;
right: -300px;
}
.nav-links-single.nav-links-fixed.nav-links-visible .nav-links .nav-next {
right: 0;
}
.nav-links-single-scroll.detailx_loading {
min-height: 3em;
margin-top: 4em;
}
.previous_post_content {
margin-top: 6em;
padding-top: 6em;
border-top: 1px solid var(--theme-color-bd_color);
}
/* 8.3 Post author
------------------------------------------------------ */
.author_info {
margin-top: 3em;
padding: 40px;
position:relative;
background-color: var(--theme-color-alter_bg_color);
.author_avatar {
@include square(78px);
@include abs-lt(30px, 30px);
@include border-round;
overflow: hidden;
}
.author_avatar img {
@include box(100%, auto);
}
.author_description {
padding-left: 88px;
}
.author_label {
text-transform: uppercase;
@include font(13px, 18px, 700);
letter-spacing: 1.4px;
color: var(--theme-color-text_light);
}
.author_title {
margin: 0 0 10px;
font-size: 19px;
line-height: 1.3em;
font-weight: 600;
a {
display: inline;
}
}
.author_bio {
margin-top: 15px;
font-size: 17px;
line-height: 1.62em;
p {
margin:0;
}
p+p {
margin-top:0.6em;
}
.author_links {
margin-top: 15px;
margin-bottom: -13px;
@include flex;
@include flex-direction(row);
@include flex-justify-content(space-between);
@include flex-align-items(center);
}
.socials_wrap {
margin-top: 0;
margin-left: -0.3em;
line-height: 0;
.social_item {
margin: 0 20px 0 0;
.social_icon {
background-color: transparent !important;
@include box(auto, auto, inherit);
width: 1.5em;
height: 1.5em;
line-height: 1.5em;
text-align: center;
font-size: 13px;
}
}
}
}
}
/* 8.4 Related posts
------------------------------------------------------ */
.related_wrap {
margin-top: 5em;
}
.content_wrap > .related_position_below_page:first-child {
margin-top: 0 !important;
}
.related_wrap {
.slider_container:not(.slider_multi):not(.slider_type_images),
.slider_container:not(.slider_multi):not(.slider_type_images) .slider-slide {
min-height: 130px;
}
.sc_item_slider.slider_outer_controls_top > .slider_controls_wrap {
top: -4.2em;
}
.slider_outer_controls_bottom > .slider_controls_wrap {
margin-top: 2em;
}
}
.post_content .related_wrap {
margin: 2em 0 1em;
padding: 0.02px 0;
border-top: none;
}
.post_content .related_wrap_slider {
margin-bottom: 1em;
}
.post_content .related_wrap.related_position_inside_left {
float: left;
margin: 1em 2em 1em 0;
max-width: 18em;
}
.post_content .related_wrap.related_position_inside_right {
float: right;
margin: 1em 0 1em 2em;
max-width: 18em;
}
.post_content .related_wrap.related_position_inside_left .slider_container:not(.slider_multi):not(.slider_type_images),
.post_content .related_wrap.related_position_inside_left .slider_container:not(.slider_multi):not(.slider_type_images) .slider-slide,
.post_content .related_wrap.related_position_inside_right .slider_container:not(.slider_multi):not(.slider_type_images),
.post_content .related_wrap.related_position_inside_right .slider_container:not(.slider_multi):not(.slider_type_images) .slider-slide {
min-height: 5em;
}
.related_wrap {
.related_item {
text-align:center;
}
.post_meta .post_meta_item {
.post_sponsored_label {
font-weight: 700;
letter-spacing: 1px;
font-size: 14px;
color: var(--theme-color-text_link);
background: none;
@include border-radius(0);
padding: 0;
}
a.post_sponsored_label:hover {
background: none;
color: var(--theme-color-text_dark);
}
}
.post_categories {
font-size: 14px;
font-weight: 700;
letter-spacing: 1px;
text-transform: uppercase;
ul {
margin: 0;
padding:0;
list-style:none;
display:inline-block;
vertical-align: top;
}
li,
> a {
display:inline-block;
vertical-align: top;
margin: 0;
color: var(--theme-color-text_dark);
}
li + li,
> a + a {
margin-left: 0;
}
}
.post_meta_item.post_categories,
.post_meta_item.post_categories a {
color: var(--theme-color-text_dark);
}
.post_meta_item.post_categories a:hover {
color: var(--theme-color-text_link);
}
.post_title {
margin: 0;
}
.post_meta [class^="icon-"] {
@include font(1.2em, inherit);
margin-right: .3em;
margin-left: 0;
vertical-align: top;
display: none;
}
}
.post_content.post_info_vertical_present .related_wrap,
.narrow_content .related_wrap {
.post_featured {
.post_title {
font-size: 1.25em;
}
.post_descr {
display: none;
}
}
}
/* Style 1: Modern */
.related_wrap.related_style_modern .post_featured {
margin-bottom: 0;
}
.related_wrap.related_style_modern .post_featured .post_header {
display:block;
width: 70%;
padding: 1.5em;
@include abs-cc(8);
@include border-box;
@include transition-all;
}
.related_wrap.related_style_modern .format-audio .post_featured .post_header {
display: none;
}
.related_wrap.related_style_modern .post_title {
margin: 0.5em 0;
letter-spacing:0;
line-height:1.25em;
}
.related_wrap.related_style_modern .post_meta {
@include flex-justify-content(center);
}
.related_wrap.related_style_modern .post_header {
background-color: var(--theme-color-bg_color_08);
}
.related_wrap.related_style_modern .related_item:hover .post_header {
background-color: var(--theme-color-bg_color);
}
.related_wrap.related_style_modern .post_meta a {
color: var(--theme-color-text);
}
.related_wrap.related_style_modern .related_item:hover .post_meta a {
color: var(--theme-color-text_light);
}
.related_wrap.related_style_modern .related_item:hover .post_meta a:hover {
color: var(--theme-color-text_dark);
}
/* Style 2: Classic */
.related_wrap.team_page_related,
.related_wrap.related_style_classic {
text-align: left;
.related_item {
text-align: left;
}
.post_title {
font-size: 24px;
line-height: 1.2em;
font-weight: 600;
a:hover,
a {
color: var(--theme-color-text_dark);
}
}
/* slider */
.slider_container .swiper-pagination, .slider_outer .swiper-pagination {
display: none;
}
.slider_container.slider_controls_side .slider_controls_wrap > a,
.slider_outer_controls_side .slider_controls_wrap > a,
.slider_container.slider_controls_side:hover .slider_controls_wrap > a,
.slider_outer_controls_side:hover .slider_controls_wrap > a {
opacity: 1;
&.slider_prev {
margin-left: 20px;
}
&.slider_next {
margin-right: 20px;
}
}
}
.related_wrap.related_style_classic .related_item:not(.format-image):not(.format-gallery):not(.format-audio):not(.format-video):not(.has-post-thumbnail) {
margin-top: -6px;
}
.related_wrap.related_style_classic .post_featured {
margin-bottom: 1em;
}
.related_wrap.related_style_classic .post_featured[class*="hover_"] {
display: inline-block;
vertical-align: top;
}
.related_wrap.related_style_classic .post_featured img {
max-width:100%;
height: auto;
}
.related_wrap.related_style_classic .post_meta {
text-transform: uppercase;
margin-top: 0;
margin-bottom: 0.85em;
}
.team_page_related,
.related_wrap.related_style_classic {
.trx_addons_video_player.with_cover .video_hover, .post_featured.with_thumb .post_video_hover, .sc_layouts_blog_item_featured .post_featured.with_thumb .post_video_hover {
font-size: 14px;
width: 50px;
height: 50px;
line-height: 51px;
margin: -25px 0 0 -25px;
letter-spacing: -4px;
}
.format-video {
.mejs-time.mejs-currenttime-container,
.mejs-time.mejs-duration-container {
display: none;
}
}
/* audio */
.format-audio .post_featured.without_thumb .post_audio:not(.with_iframe), .single-format-audio .post_featured.without_thumb .post_audio:not(.with_iframe), .sc_layouts_blog_item_featured .post_featured.without_thumb .post_audio:not(.with_iframe) {
padding: 1em;
}
.format-audio .post_featured .post_audio_title, .single-format-audio .post_featured .post_audio_title {
font-size: 18px;
margin-top: 0.3em;
margin-bottom: 0.1em;
}
.format-audio {
.mejs-time.mejs-currenttime-container,
.mejs-time.mejs-duration-container {
display: none;
}
div.mejs-controls .mejs-time-rail {
margin: 0 12px;
}
div.mejs-controls .mejs-horizontal-volume-slider {
margin-left: 8px;
}
.mejs-container:not(.mejs-video) {
height: 50px !important;
}
.mejs-controls {
height: 50px;
padding: 5px 0;
}
div.mejs-controls .mejs-time.mejs-duration-container {
margin-right: 8px;
}
div.mejs-controls .mejs-time.mejs-currenttime-container {
margin-left: 8px;
}
}
}
/* Style 3: Wide */
.related_wrap.related_style_wide .related_item {
@include flex;
@include flex-direction(row);
@include flex-justify-content(flex-start);
@include flex-align-items(flex-start);
text-align: left;
.post_featured {
margin: 0 1em 0 0;
width: 6em;
&[class*="hover_"] {
display: block;
}
img {
width:100%;
}
}
.post_title {
margin: -0.25em 0 0;
}
&.format-video,
&.format-audio,
&.format-gallery {
@include flex-direction(column);
.post_featured {
margin: 0 0 1em 0;
width: 100%;
}
}
}
.post_content .related_wrap.related_style_wide .columns_wrap.columns_padding_bottom > [class*="column-"],
.post_content .related_wrap.related_style_wide .columns_wrap > [class*="column-"].columns_padding_bottom {
padding-bottom: 1em;
}
/* Style 4: List */
.related_wrap.related_style_list .related_item {
text-align: left;
padding: 0 0 0 1.5em;
position: relative;
}
.related_wrap.related_style_list .related_item:before {
content: ' ';
@include abs-lt(0, 0.75em);
@include square(6px);
@include border-round;
background-color: var(--theme-color-text_link);
}
.post_content .related_wrap.related_style_list .columns_wrap.columns_padding_bottom > [class*="column-"],
.post_content .related_wrap.related_style_list .columns_wrap > [class*="column-"].columns_padding_bottom {
padding-bottom: 1em;
}
/* Style 5: Short */
.related_wrap.related_style_short .related_item {
text-align: left;
padding-bottom: 1em;
border-bottom: 1px solid #c1c1c1;
margin-bottom: 1em;
}
.related_wrap .related_wrap_slider .related_item_style_short.related_item {
border-bottom: none;
}
.related_wrap.related_style_short .columns_wrap .column-1_4:last-child .related_item,
.related_wrap.related_style_short .columns_wrap .column-1_4:nth-last-child(2) .related_item,
.related_wrap.related_style_short .columns_wrap .column-1_4:nth-last-child(3) .related_item,
.related_wrap.related_style_short .columns_wrap .column-1_4:nth-last-child(4) .related_item,
.related_wrap.related_style_short .columns_wrap .column-1_3:last-child .related_item,
.related_wrap.related_style_short .columns_wrap .column-1_3:nth-last-child(2) .related_item,
.related_wrap.related_style_short .columns_wrap .column-1_3:nth-last-child(3) .related_item,
.related_wrap.related_style_short .columns_wrap .column-1_2:last-child .related_item,
.related_wrap.related_style_short .columns_wrap .column-1_2:nth-last-child(2) .related_item,
.related_wrap.related_style_short .columns_wrap .column-1_1:last-child .related_item {
border-bottom: none;
}
.post_content .related_wrap.related_style_short .columns_wrap.columns_padding_bottom > [class*="column-"],
.post_content .related_wrap.related_style_short .columns_wrap > [class*="column-"].columns_padding_bottom {
padding-bottom: 1em;
}
/* 8.5 Comments
-------------------------------------------------------- */
/* Contact form */
.page_contact_form {
border-color: var(--theme-color-bd_color);
}
/* Comments */
.body_style_fullscreen .comments_wrap {
margin-bottom: 3em;
}
.comments_wrap {
display:none;
&.opened {
display: block;
}
}
/* Show comments button in full post */
.show_comments_single {
text-align: center;
margin-top: 5em;
.full_post_content & {
width: 100%;
}
.show_comments_button {
display: block;
padding: 1.2em;
@include border-box;
border: 2px solid var(--theme-color-text_dark);
color: var(--theme-color-text_dark);
text-transform: none;
@include font(16px, 21px, 500);
letter-spacing: 0;
}
.show_comments_button:after {
content: '\e828';
font-family: $theme_icons;
display: inline-block;
vertical-align: top;
margin-left: 1em;
}
.show_comments_button.opened:after {
content: '\e835';
}
.show_comments_button:hover,
.show_comments_button:focus {
color: var(--theme-color-text_hover);
border-color: var(--theme-color-text_hover);
}
}
/* Comment list */
.comments_list_wrap {
margin-top: 5em;
overflow:hidden;
}
.comments_list_wrap .comments_closed {
margin-top:2em;
color: var(--theme-color-text_dark);
}
.comments_list_wrap > ul {
padding: 0;
margin:0;
list-style: none;
}
.comments_list_wrap ul > li {
display: block; // If set to 'list-item' - in Chrome author's name is shifting down (below the top of the avatar). In Firefox - all OK
overflow:visible;
position:relative;
min-height: 100px;
}
.comments_list_wrap ul > li:before {
display:none;
}
.comments_list_wrap ul ul.children {
padding-left: 100px;
}
.comments_list_wrap ul ul ul.children {
padding-left: 50px;
}
.comments_list_wrap ul ul ul ul ul {
padding-left: 0;
border-left: none;
}
body.narrow_content .comments_list_wrap ul ul ul ul {
padding-left: 0;
}
.comments_list_wrap li + li,
.comments_list_wrap li ul {
margin-top: 35px;
}
.comments_list_wrap .comment_author_avatar {
@include abs-lt;
@include square(78px);
@include border-round;
overflow:hidden;
}
.comments_list_wrap .comment_author_avatar img {
width: 100%;
}
.comments_list_wrap .comment_content {
padding-left: 100px;
overflow:hidden;
}
.comments_list_wrap .comment_info {
margin-bottom: 0.8em;
margin-top: 0.3em;
position:relative;
color: var(--theme-color-text_dark);
}
.comments_list_wrap .bypostauthor .comment_bypostauthor {
padding: 0.1em 1em;
@include border-radius(0);
border: 1px solid var(--theme-color-text_dark);
color: var(--theme-color-text_dark);
display: inline-block;
vertical-align: middle;
margin: 0 10px 0 0;
@include font(13px, 19px, normal);
}
.comments_list_wrap .bypostauthor > .comment_body .comment_author_avatar:after {
will-change: transform;
}
.comments_list_wrap .comment_author {
margin: -2px 10px 0 0;
font-size: 19px;
line-height: 23px;
font-weight: 600;
display: inline-block;
vertical-align: middle;
}
.comments_list_wrap .comment_posted {
display: inline-block;
position:relative;
letter-spacing:0;
margin-bottom: -2px;
vertical-align: middle;
color: var(--theme-color-alter_text);
font-size: 14px;
line-height: 20px;
font-weight: 400;
}
.comments_list_wrap .comment_posted_label {
display:none;
}
.comments_list_wrap .comment_date,
.comments_list_wrap .comment_time,
.comments_list_wrap .comment_time_label {
display:inline-block;
vertical-align:baseline;
margin-right:0.2em;
}
.comments_list_wrap .comment_not_approved {
padding: 0.2em 0 0.5em 0;
font-style:italic;
}
.comments_list_wrap .trx_addons_reviews_text {
font-weight: bold;
}
.comments_list_wrap .comment_text {
margin-bottom: 0.6em;
font-size: 17px;
line-height: 1.65em;
color: var(--theme-color-text);
}
.comments_list_wrap .comment_text p {
margin:0;
}
.comments_list_wrap .comment_text p+p {
margin-top: 0.6em;
}
.comments_list_wrap .comment_text ul,
.comments_list_wrap .comment_text ol {
margin:0;
padding: 0 0 0 1.5em;
}
.comments_list_wrap .comment_text ul > li,
.comments_list_wrap .comment_text ol > li {
display: list-item;
}
.comments_list_wrap .comment_text ul {
list-style: disc outside;
}
.comments_list_wrap .comment_text ul ul {
list-style-type: circle;
}
.comments_list_wrap .comment_text ul ul ul {
list-style-type: square;
}
.comments_list_wrap .comment_text ul ul ul ul {
list-style-type: disc;
}
.comments_list_wrap .comment_text ol {
list-style: decimal outside;
}
.comments_list_wrap .comment_text ol ol {
list-style-type: lower-alpha;
}
.comments_list_wrap .comment_text ol ol ol {
list-style-type: upper-roman;
}
.comments_list_wrap .comment_text ul > li > ul,
.comments_list_wrap .comment_text ol > li > ol {
margin-top: 0.5em;
}
.comments_list_wrap .comment_text ul > li,
.comments_list_wrap .comment_text ol > li {
min-height:0;
padding:0;
margin:0 0 0.5em 0;
overflow:visible;
}
.comments_list_wrap .comment_text ul,
.comments_list_wrap .comment_text ul > li,
.comments_list_wrap .comment_text ol,
.comments_list_wrap .comment_text ol > li {
border:none;
}
.comments_list_wrap .comment_text blockquote > a,
.comments_list_wrap .comment_text blockquote > p > a {
padding-left: 0;
margin-top: 0;
}
.comments_list_wrap .comment_counters {
display: none;
vertical-align:middle;
margin-right: 1em;
}
.comments_list_wrap .comment_counters_item:before {
margin: 0 0.3em 0 0;
font-style: normal;
}
.comments_list_wrap .comment_counters .comment_counters_label {
display: none;
}
.comments_list_wrap .comment_counters_item .comment_counters_number_separator {
margin: 0 0.2em;
}
.comments_list_wrap .comment_reply {
display:inline-block;
vertical-align:middle;
@include font(13px, 18px, 700);
letter-spacing: 1.4px;
text-transform: uppercase;
}
.comments_list_wrap .comment_reply a:after {
content:'\e9df';
font-family:$theme_icons;
font-weight: 400;
font-size: 9px;
display: inline-block;
vertical-align: middle;
margin-left: 10px;
position: relative;
top: -2px;
}
.comments_list_wrap .comment_footer a {
color: var(--theme-color-text_dark);
}
.comments_list_wrap .comment_footer a:hover {
color: var(--theme-color-text_hover);
}
.comments_wrap .comments_notes {
color: var(--theme-color-text_light);
}
/* Trackbacks and pingbacks */
.comments_list > li.pingback,
.comments_list > li.trackback {
list-style:none;
margin-left:0;
padding-left:0;
padding-right:4em;
padding-top: 1em;
min-height: 0;
position:relative;
}
.comments_list > li.pingback + li,
.comments_list > li.trackback + li {
margin-top: 1em;
}
.comments_list > li.pingback p,
.comments_list > li.trackback p {
font-style:italic;
padding-bottom:0.8em;
}
.comments_list > li.pingback p a,
.comments_list > li.trackback p a {
font-style:normal;
}
.comments_list > li.pingback .edit-link,
.comments_list > li.trackback .edit-link {
@include abs-rt(0, 1em);
}
/* Comments form */
.section_title.comments_form_title {
margin-bottom: 0.5em;
}
.comment-form p[style*="font-size"] {
margin: 0 !important;
}
.comments_form_wrap {
margin-top: 5em;
overflow: visible;
.wpgdprc-checkbox {
margin-bottom: 10px;
}
}
.comments_form_wrap form {
position:relative;
}
.comments_wrap .comments_list_wrap .comments_form_title {
margin-top: 1.5em;
position:relative;
padding-right: 2rem;
font-size: 1.5em;
}
.comments_wrap .comments_notes {
font-size:0.8667em;
}
.comments_wrap .comments_field {
margin-bottom: 2em;
&.comments_i_agree_privacy_policy input[type="checkbox"] + label {
display: inline-block;
}
}
.comments_wrap .comments_author,
.comments_wrap .comments_email {
width: 48%;
float:left;
}
.comments_wrap .comments_email {
float:right;
}
.comments_wrap .comments_url {
clear:both;
}
.comments_wrap .comments_comment:before {
content: ' ';
@include clear;
}
.comments_wrap .comments_field label {
display:none;
}
.comments_wrap .comments_field input[type="checkbox"] + label,
.comments_wrap .comments_field input[type="radio"] + label {
display: block;
}
.comments_wrap .comments_field input,
.comments_wrap .comments_field textarea {
width:100%;
padding: 0.6em 0;
@include box-shadow(0 15px 15px -14px rgba(0, 0, 0, 0.015));
}
.comments_wrap .comments_field textarea {
min-height: 6.2em;
}
/* Submit button */
.comments_wrap .form-submit {
margin: 2.3em 0 0;
position: relative;
}
.comments_wrap .form-submit:before {
content: '';
@include clear;
}
.comments_wrap .form-submit input[type="submit"] {
display:inline-block;
padding: 16px 40px;
@include box-shadow(none);
}
form .error_field {
border-color: #F22F2F !important;
}
/* Rating in the comment form */
.comments_wrap .trx_addons_reviews_mark {
display: block;
}
.comments_wrap form .trx_addons_reviews_mark {
margin: -0.5em 0 1em;
}
/* Social login in the comment form */
.comments_form_wrap form .wp-social-login-widget {
@include abs-rt(0, -6.2em);
}
.comments_form_wrap form .wp-social-login-widget .wp-social-login-connect-with {
display:none;
}
.comments_form_wrap form .wp-social-login-widget .wp-social-login-provider-list {
padding:0;
}
/* 8.6 Page 404
-------------------------------------------------------------- */
.post_item_404 .post_content {
padding: 10.5em 0 11.5em;
overflow:hidden;
}
.post_item_404 .page_title {
float: none;
width: 100%;
@include font(270px, 1em);
margin: 0;
margin-top:0 !important;
letter-spacing:0;
text-align: center;
hyphens: none;
color: var(--theme-color-text_dark);
position: relative;
z-index: 2;
}
.post_item_404 .page_info {
float: none;
width: 100%;
text-align: center;
padding: 0;
@include border-box;
position: relative;
z-index: 2;
}
.post_item_404 .page_subtitle {
margin: 20px 0 0;
font-size: 47px;
line-height: 1.1em;
}
.post_item_404 .page_description {
margin-top: 17px;
margin-bottom: 43px;
font-weight: 400;
text-transform:none;
letter-spacing: 0;
color: var(--theme-color-text);
}
.post_item_404 .go_home {
@include box-shadow(none);
}
.search-no-results .page_content_wrap,
.error404 .page_content_wrap {
padding: 0 !important;
background-color: var(--theme-color-bg_color);
}
/* Anim Parallax */
.post_item_404 .post_content {
position: relative;
.all-svg {
left: 0;
position: absolute;
top: 0;
width: 100%;
height: 100%;
z-index: 1;
.svg-1 {
display: block;
width: 95px;
height: 95px;
z-index: 20;
left: 40%;
position: absolute;
top: 15%;
svg {
width: 100%;
height: 100%;
fill: #E1D0C6;
opacity: 1;
}
}
.svg-2 {
left: 38%;
position: absolute;
bottom: 14%;
width: 140px;
height: 140px;
z-index: 10;
svg {
width: 100%;
height: 100%;
fill: transparent;
stroke: #F4F0ED;
stroke-width: 12px;
opacity: 0.4;
}
}
.svg-3 {
right: 23%;
position: absolute;
top: 24%;
width: 60px;
height: 60px;
z-index: 10;
svg {
width: 100%;
height: 100%;
fill: var(--theme-color-text_link2);
opacity: 1;
}
}
.svg-4 {
left: 23%;
position: absolute;
top: 47%;
width: 36px;
height: 36px;
z-index: 10;
svg {
width: 100%;
height: 100%;
fill: var(--theme-color-text_link);
opacity: 1;
}
}
}
}
/* 8.7 Page 'No search results' and 'No archive results'
-------------------------------------------------------- */
.search-no-results.woocommerce-page .content,
.post_item_none_search .post_content {
padding: 6em 0;
}
.post_item_none_search .page_title {
font-size: 7em;
line-height: 1.2em;
}
.post_item_none_search {
.page_info {
width: 70%;
margin: 0 auto;
.page_subtitle {
margin: 0;
font-size: 57px;
line-height: 1em;
}
.page_description {
margin-top: 39px;
margin-bottom: 43px;
padding: 0 17%;
}
}
}
.post_item_none_archive .search_wrap {
margin: 0
}
/* 8.8 Author's page
------------------------------------------------------ */
.author_page {
@include flex;
@include flex-direction(column);
@include flex-align-items(center);
margin-bottom: 6em;
.author_avatar {
@include border-round;
margin-bottom:1em;
overflow: hidden;
}
.author_title {
margin-top: 0;
margin-bottom:0.5em;
}
.author_bio {
text-align: center;
margin-bottom:1em;
}
.author_bio p {
margin:0;
}
.author_bio p+p {
margin-top:0.6em;
}
.author_details {
text-align: center;
.author_posts_total,
.author_socials {
display: inline-block;
vertical-align: top;
text-transform: capitalize;
}
.author_posts_total_value {
font-weight: bold;
color: var(--theme-color-text_dark);
}
.author_posts_total + .author_socials {
&:before {
content: '|';
display: inline-block;
vertical-align: baseline;
margin: 0 1em;
}
.socials_wrap {
display: inline-block;
vertical-align: baseline;
margin-left: 0.75em;
.social_item {
margin: 0 0.75em 0 0;
.social_icon {
font-size: 17px;
padding: 0 1px;
background-color: transparent;
@include box(auto, auto, inherit);
text-align: left;
@include border-radius(0);
}
}
}
}
}
}
/* 9. Sidebars
-------------------------------------------------------------- */
/* Common rules */
.sidebar_default[class*="scheme_"] .sidebar_inner {
padding: 4.1em 0;
background-color: var(--theme-color-alter_bg_color);
color: var(--theme-color-alter_text);
}
.sidebar_default[class*="scheme_"] .widget {
padding: 0 40px;
}
.sidebar_default[class*="scheme_"] .widget .widget {
padding: 0;
}
.sidebar .widget + .widget,
.sidebar_default[class*="scheme_"] .widget + .widget {
margin-top: 2.4rem;
}
.sidebar .widget + .widget.widget_bg_image,
.sidebar_default[class*="scheme_"] .widget + .widget.widget_bg_image,
.sidebar .widget + .widget.widget_fullwidth,
.sidebar_default[class*="scheme_"] .widget + .widget.widget_fullwidth {
border-top: none;
padding-top: 4rem;
padding-bottom: 4rem;
}
.sidebar .widget.widget_bg_image + .widget,
.sidebar_default[class*="scheme_"] .widget.widget_bg_image + .widget,
.sidebar .widget.widget_fullwidth + .widget,
.sidebar_default[class*="scheme_"] .widget.widget_fullwidth + .widget {
border-top: none;
}
[class*="scheme_"].sidebar a {
color: var(--theme-color-alter_link);
}
[class*="scheme_"].sidebar a:hover {
color: var(--theme-color-alter_hover);
}
[class*="scheme_"].sidebar h1, [class*="scheme_"].sidebar h2, [class*="scheme_"].sidebar h3, [class*="scheme_"].sidebar h4, [class*="scheme_"].sidebar h5, [class*="scheme_"].sidebar h6,
[class*="scheme_"].sidebar h1 a, [class*="scheme_"].sidebar h2 a, [class*="scheme_"].sidebar h3 a, [class*="scheme_"].sidebar h4 a, [class*="scheme_"].sidebar h5 a, [class*="scheme_"].sidebar h6 a {
color: var(--theme-color-alter_dark);
}
[class*="scheme_"].sidebar h1 a:hover, [class*="scheme_"].sidebar h2 a:hover, [class*="scheme_"].sidebar h3 a:hover, [class*="scheme_"].sidebar h4 a:hover, [class*="scheme_"].sidebar h5 a:hover, [class*="scheme_"].sidebar h6 a:hover {
color: var(--theme-color-alter_link);
}
.widget p {
margin:0;
}
.widget p+p,
.widget p+div,
.widget p+form {
margin-top:1em;
}
.widget .widget_title,
.widget .widgettitle {
margin-bottom: 1.5em;
@include font(21px, 1.3em, 600);
letter-spacing: 0;
margin-top: -7px;
}
.widget_fullwidth .widget_title,
.widget_fullwidth .widgettitle {
text-align:center;
}
.widget ol,
.widget ul {
font-size: 17px;
margin:0;
padding-left:1.2em;
list-style-type:none;
ul {
margin-top: 10px;
}
li + li {
margin-top: 10px;
}
}
ul[class*="wp-block-"],
ol[class*="wp-block-"] {
margin-bottom: 0;
}
ul.wp-block-archives-list,
ul.wp-block-categories-list,
ul.wp-block-rss {
padding-left: 1.5em;
list-style-type: none;
}
.widget ol,
.widget ul,
ul.wp-block-archives-list,
ul.wp-block-categories-list,
ul.wp-block-rss {
> li {
position:relative;
a:first-child:before {
content: ' ';
display:block;
@include square(6px);
@include border-radius(50%);
@include abs-lt(-1.1em, 0.75em);
@include transition-all(0.3s);
background-color: var(--theme-color-text_dark);
}
a:first-child:hover:before {
background-color: var(--theme-color-text_link);
}
}
}
.wp-block-latest-comments__comment {
line-height: inherit;
list-style: none;
margin-bottom: 0;
}
.wp-block-latest-comments,
.widget_recent_comments ul {
> li {
position:relative;
&:before {
content: ' ';
display:block;
@include square(6px);
@include border-radius(50%);
@include abs-lt(-1.1em, 0.75em);
@include transition-all(0.3s);
background-color: var(--theme-color-text_dark);
}
a:before {
display: none !important;
}
}
}
.wp-block-latest-comments__comment-excerpt p {
font-size: 1em;
line-height: inherit;
}
.wp-block-latest-comments__comment-date {
font-size: 0.9em;
color: var(--theme-color-text_light);
}
.wp-block-latest-comments.has-avatars {
padding-left: 0;
> li:before {
display: none;
}
}
.widget li a img {
vertical-align:baseline;
}
.widget li a > img,
.widget li span > img {
@include border-radius(50%);
}
[class*="scheme_"].sidebar li > a,
[class*="scheme_"].sidebar .post_title > a {
color: var(--theme-color-alter_dark);
}
[class*="scheme_"].sidebar li > a:hover,
[class*="scheme_"].sidebar .post_title > a:hover {
color: var(--theme-color-alter_link);
}
/* Images in widgets */
.widget_area .post_item .post_thumb img,
aside .post_item .post_thumb img {
@include border-radius(0);
}
.widget_area .post_item,
aside .post_item {
@include flex;
flex-direction: row;
align-items: center;
}
.widget_area .post_item .post_thumb,
aside .post_item .post_thumb {
width: 100px;
height: 100px;
margin: 0 25px 0 0;
flex: 100px 0 0;
}
/* Info in widgets */
.widget_area .post_item .post_categories,
aside .post_item .post_categories {
display: inline;
font-size: inherit;
line-height: inherit;
font-weight: inherit;
margin-top: 0;
margin-bottom: 0;
position: relative;
padding-right: 0;
text-transform: inherit;
}
.widget_area .post_item .post_categories {
font-weight: 700;
}
.post_info_item.post_info_counters .post_meta {
font-size: inherit;
font-weight: inherit;
font-style: normal;
line-height: inherit;
text-decoration: none;
text-transform: none;
letter-spacing: 0;
margin-top: 0;
display: inherit;
}
.widget_area .post_item .post_info, aside .post_item .post_info {
font-size: 13px;
line-height: 16px;
+ .post_title {
margin-top: 8px;
}
}
.widget_area .post_item .post_info .post_info_item + .post_info_item:before,
aside .post_item .post_info .post_info_item + .post_info_item:before {
display: table-caption;
margin: 0;
}
.widget_area .post_item .post_title, aside .post_item .post_title {
margin: 0;
text-align: left;
line-height: 1.3em;
font-weight: 600;
}
/* Posts in widgets */
[class*="scheme_"].sidebar .post_meta,
[class*="scheme_"].sidebar .post_meta_item,
[class*="scheme_"].sidebar .post_meta_item:after,
[class*="scheme_"].sidebar .post_meta_item:hover:after,
[class*="scheme_"].sidebar .post_meta .vc_inline-link,
[class*="scheme_"].sidebar .post_meta .vc_inline-link:after,
[class*="scheme_"].sidebar .post_meta .vc_inline-link:hover:after,
[class*="scheme_"].sidebar .post_meta_item a,
[class*="scheme_"].sidebar .post_info .post_info_item,
[class*="scheme_"].sidebar .post_info .post_info_item a,
[class*="scheme_"].sidebar .post_info_counters .post_meta_item {
color: var(--theme-color-alter_light);
}
[class*="scheme_"].sidebar .post_info_item.post_categories a {
color: var(--theme-color-alter_dark);
}
[class*="scheme_"].sidebar .post_date a:hover,
[class*="scheme_"].sidebar a.post_meta_item:hover,
[class*="scheme_"].sidebar .post_meta_item a:hover,
[class*="scheme_"].sidebar .post_meta .vc_inline-link:hover,
[class*="scheme_"].sidebar .post_info .post_info_item a:hover,
[class*="scheme_"].sidebar .post_info_counters .post_meta_item:hover {
color: var(--theme-color-alter_dark);
}
[class*="scheme_"].sidebar .post_info_item.post_categories a:hover {
color: var(--theme-color-alter_link);
}
[class*="scheme_"].sidebar .post_item .post_title a:hover {
color: var(--theme-color-alter_text);
}
[class*="scheme_"].sidebar .post_meta_item.post_categories,
[class*="scheme_"].sidebar .post_meta_item.post_categories a {
color: var(--theme-color-alter_link);
}
[class*="scheme_"].sidebar .post_meta_item.post_categories a:hover {
color: var(--theme-color-alter_hover);
}
[class*="scheme_"].sidebar .socials_share.socials_type_drop .social_items {
background-color: var(--theme-color-alter_bg_color);
}
[class*="scheme_"].sidebar .socials_share.socials_type_drop .social_items,
[class*="scheme_"].sidebar .socials_share.socials_type_drop .social_items:before {
background-color: var(--theme-color-alter_bg_color);
border-color: var(--theme-color-alter_bd_color);
color: var(--theme-color-alter_light);
}
/* Widgets above and below the page (content and sidebar) */
.widgets_above_page_wrap,
.widgets_above_content_wrap {
font-size:1em;
margin-bottom:5em;
}
.widgets_below_content_wrap,
.widgets_below_page_wrap {
font-size:1em;
margin-top:5em;
}
.widgets_below_page_wrap {
clear:both;
}
/* Widget: Latest Posts */
.wp-block-latest-posts.wp-block-latest-posts__list {
padding-left: 0;
&:not(.is-grid) li + li {
margin-top: 1em;
}
li a:first-child:before {
display: none;
}
img {
@include border-radius(0 !important);
}
.wp-block-latest-posts__post-author,
.wp-block-latest-posts__post-date {
color: var(--theme-color-text_light);
font-size: 0.9em;
line-height: 1.55em;
}
.wp-block-latest-posts__post-excerpt {
margin: 3px 0 0 0;
}
.wp-block-latest-posts__featured-image {
margin-bottom: 0.5em !important;
}
.alignleft {
margin-right: 1em !important;
}
.alignright {
margin-left: 1em !important;
}
}
/* Widget: Archive */
.widget_archive li,
.wp-block-archives li {
color: var(--theme-color-text_dark);
}
[class*="scheme_"].footer_wrap .widget_archive li,
[class*="scheme_"].sidebar .widget_archive li {
color: var(--theme-color-alter_dark);
}
/* Widget: Calendar */
.widget_calendar, .wp-block-calendar {
a {
text-decoration: none;
}
table {
width: 100%;
position: relative;
}
caption {
padding-bottom: 0.8em;
font-weight: 500;
}
table > thead > tr {
background-color: transparent !important;
}
caption,
tbody td a,
th {
color: var(--theme-color-text_dark);
}
[class*="scheme_"].sidebar & {
caption,
tbody td a,
th {
color: var(--theme-color-alter_dark);
}
}
th,
td {
@include font(1em !important, 1.7em, 400 !important, normal);
text-align: center;
text-transform: capitalize;
padding: 2px;
border: none !important;
background-color: transparent !important;
width: 14.2857%;
@include border-box;
}
th {
font-weight: 500 !important;
}
td {
line-height:2em;
padding:0;
}
tbody td {
color: var(--theme-color-text) !important;
}
[class*="scheme_"].sidebar & {
tbody td {
color: var(--theme-color-alter_text) !important;
}
}
tbody td a {
display:block;
position:relative;
font-weight:400;
@include border-box;
}
tbody td a:hover {
color: var(--theme-color-text_link);
}
[class*="scheme_"].sidebar & {
tbody td a:hover {
color: var(--theme-color-alter_link);
}
}
tbody td a:after {
content: ' ';
@include abs-cb(4px);
@include square(3px);
@include transition-bg-color;
background-color: var(--theme-color-text_link);
}
[class*="scheme_"].sidebar & {
tbody td a:after {
background-color: var(--theme-color-alter_link);
}
}
td#today {
position:relative;
z-index:2;
color: var(--theme-color-inverse_link) !important;
}
td#today a {
color: var(--theme-color-inverse_link);
}
td#today a:hover {
color: var(--theme-color-inverse_hover);
opacity: 0.8;
}
td#today:before {
content:' ';
@include abs-cc(-1);
@include square(1.9em);
background-color: var(--theme-color-text_link);
}
[class*="scheme_"].sidebar & {
td#today:before {
background-color: var(--theme-color-alter_link);
}
}
td#today a:after {
background-color: var(--theme-color-inverse_link);
}
td#today a:hover:after {
background-color: var(--theme-color-inverse_hover);
}
tfoot {
position:relative;
top: 0.6em;
}
tfoot td {
text-transform: none !important;
}
.wp-calendar-nav {
@include flex;
@include flex-direction(row);
@include flex-justify-content(space-between);
}
td#prev,
.wp-calendar-nav-prev {
text-align:left;
overflow:hidden;
}
td#next,
.wp-calendar-nav-next {
text-align:right;
overflow:hidden;
}
td#prev a,
td#next a,
.wp-calendar-nav a {
position:relative;
color: var(--theme-color-text_link);
}
[class*="scheme_"].sidebar & {
#prev a,
#next a,
.wp-calendar-nav a {
color: var(--theme-color-alter_link);
}
}
#prev a:hover,
#prev a:focus,
#next a:hover,
#next a:focus,
.wp-calendar-nav a:hover,
.wp-calendar-nav a:focus {
color: var(--theme-color-text_hover);
}
[class*="scheme_"].sidebar & {
#prev a:hover,
#prev a:focus,
#next a:hover,
#next a:focus,
.wp-calendar-nav a:hover,
.wp-calendar-nav a:focus {
color: var(--theme-color-alter_hover);
}
}
td#prev a,
.wp-calendar-nav-prev a {
padding-left: 0.6em;
}
td#next a,
.wp-calendar-nav-next a {
padding-right: 0.6em;
}
td#prev a:before,
td#next a:before,
.wp-calendar-nav a:before {
@include abs-lt(5px, 4px);
@include box(1em, 1em, 1em);
display:inline-block;
text-align: center;
background-color: var(--theme-color-bg_color);
}
[class*="scheme_"].sidebar &,
[class*="scheme_"].footer_wrap & {
td#prev a,
td#next a,
.wp-calendar-nav a {
color: var(--theme-color-text_link);
&:hover {
color: var(--theme-color-text_hover);
}
}
}
[class*="scheme_"].sidebar &,
[class*="scheme_"].footer_wrap & {
td#prev a:before,
td#next a:before,
.wp-calendar-nav a:before {
background-color: var(--theme-color-alter_bg_color);
}
}
td#prev a:before,
.wp-calendar-nav-prev a:before {
content: '\E837';
font-family:$theme_icons;
}
td#next a:before,
.wp-calendar-nav-next a:before {
content: '\E836';
font-family:$theme_icons;
left: auto;
right: 5px;
}
}
.wp-block-calendar table caption,
.wp-block-calendar table tbody {
color: var(--theme-color-text_dark);
}
/* Widget: Categories */
.widget_product_categories li,
.widget_categories li {
color: var(--theme-color-text_dark);
}
[class*="scheme_"].sidebar .widget_product_categories li,
[class*="scheme_"].sidebar .widget_categories li {
color: var(--theme-color-alter_dark);
}
/* Widget: Recent Posts */
.widget_recent_entries .post-date {
display: inline-block;
margin-left: 0.5em;
color: var(--theme-color-text_light);
}
[class*="scheme_"].widget_recent_entries .post-date {
color: var(--theme-color-alter_light);
}
/* Widgets: WP Search, WooCommerce Products Search and bbPress Forums Search */
.wc-block-product-search .wc-block-product-search__fields,
.widget_search form.search-form,
.woocommerce.widget_product_search form,
.widget_display_search form,
#bbpress-forums #bbp-search-form {
width: 100%;
overflow: hidden;
position: relative;
padding-bottom: 1px;
}
.wc-block-product-search input.wc-block-product-search__field {
line-height: 1.5em;
}
.wc-block-product-search .wc-block-product-search__label {
margin-bottom: 8px;
display: inline-block;
}
.wc-block-product-search .wc-block-product-search__fields:after,
.widget_search form.search-form:after,
.woocommerce.widget_product_search form:after,
.widget_display_search form:after,
#bbpress-forums #bbp-search-form:after {
content: '\E9B6';
font-family: $theme_icons;
display: block;
@include abs-lt(1.1em, 50%, 0);
margin-top: -0.45em;
@include square(1em);
pointer-events: none;
cursor: pointer;
@include transition-all;
color: var(--theme-color-input_text);
}
.wc-block-product-search .wc-block-product-search__fields:hover:after,
.widget_search form.search-form:hover:after,
.woocommerce.widget_product_search form:hover:after,
.widget_display_search form:hover:after,
#bbpress-forums #bbp-search-form:hover:after {
color: var(--theme-color-input_dark);
}
.wc-block-product-search input.wc-block-product-search__field,
.widget_search .search-field,
.woocommerce.widget_product_search .search_field,
.widget_display_search #bbp_search,
#bbpress-forums #bbp-search-form #bbp_search {
width:100%;
padding: 0.77em 1.2em;
padding-left: 3em !important;
@include border-box;
@include border-radius(0);
background-color: transparent !important;
border-width: 1px;
border-style: solid;
margin-top: 1px;
}
.wc-block-product-search button.wc-block-product-search__button,
.widget_search input.search-submit,
.woocommerce.widget_product_search .search_button,
.widget_display_search #bbp_search_submit,
#bbpress-forums #bbp-search-form #bbp_search_submit {
display: block;
text-indent: -1000px;
@include abs-lt;
@include box(3em, 100% !important);
padding: 0 !important;
margin: 0 !important;
border: none !important;
background: none !important;
cursor: pointer;
@include box-shadow(none !important);
}
/* WP Search */
.wp-block-search {
.wp-block-search__label {
margin-bottom: 8px;
display: inline-block;
}
input.wp-block-search__input {
max-height: 50px;
padding: 0.75em 1.2em;
border-width: 1px;
border-style: solid;
@include border-radius(0);
border-color: var(--theme-color-input_bd_color);
&:focus {
@include theme_field_colors_hover;
}
}
button.wp-block-search__button {
padding: 5px 20px 6px !important;
border: none;
color: var(--theme-color-inverse_link);
background-color: var(--theme-color-text_link);
&:hover {
color: var(--theme-color-inverse_link);
background-color: var(--theme-color-text_hover);
}
&.has-icon {
fill: var(--theme-color-inverse_link);
padding: 0 !important;
margin-left: 5px;
overflow: hidden;
width: 50px;
min-width: 50px;
height: 50px;
line-height: 50px;
text-align: center;
justify-content: center;
#search-icon {
display: inline-block;
}
}
}
&.wp-block-search__button-inside {
.wp-block-search__inside-wrapper {
border-color: var(--theme-color-input_bd_color);
@include border-radius(0);
}
.wp-block-search__inside-wrapper input.wp-block-search__input {
border-radius: 0;
border: none;
padding: 0 0 0 1em;
min-height: 42px;
}
.wp-block-search__inside-wrapper button.wp-block-search__button.has-icon {
width: 42px;
min-width: 42px;
height: 42px;
line-height: 42px;
margin-left: 1em;
}
}
}
/* Widget: RSS */
.wp-block-rss,
.widget_rss {
.widget_title {
a {
display:inline-block;
margin-right:6px;
}
a:first-child:before {
content:'\e8ed';
font-family:$theme_icons;
display: inline-block;
font-size:0.9em;
}
a:first-child {
color: var(--theme-color-text_link);
}
a:first-child:hover {
color: var(--theme-color-text_hover);
}
img {
display:none;
}
}
.wp-block-rss__item-author,
.wp-block-rss__item-publish-date {
color: inherit;
font-size: 1em;
}
.wp-block-rss__item-publish-date,
.rss-date {
color: var(--theme-color-text_light);
}
ul > li:before {
display:none;
}
li + li {
margin-top: 1em;
}
}
[class*="scheme_"].sidebar .widget_rss {
.wp-block-rss__item-publish-date,
.rss-date {
color: var(--theme-color-alter_light);
}
a {
color: var(--theme-color-alter_dark);
}
a:hover {
color: var(--theme-color-alter_link);
}
.widget_title {
a:first-child {
color: var(--theme-color-alter_link);
}
a:first-child:hover {
color: var(--theme-color-alter_hover);
}
}
}
/* Widget WP Block Socials */
.widget ul.wp-block-social-links {
padding-left: 0;
li + li {
margin-top: 0;
}
> li a:first-child:before {
display: none;
}
}
/* Widgets: WP Tag Cloud and WooCommerce Tag Cloud */
.wp-block-tag-cloud,
.widget_product_tag_cloud,
.widget_tag_cloud {
overflow:visible;
letter-spacing: -5px;
}
.wp-block-tag-cloud a,
.sc_edd_details .downloads_page_tags .downloads_page_data > a,
.widget_product_tag_cloud a,
.widget_tag_cloud a {
border: 1px solid var(--theme-color-bd_color);
color: var(--theme-color-text);
display: inline-block;
float: none;
@include font(13px !important, 17px, 400);
letter-spacing: 0;
margin: 0 5px 5px 0;
@include border-radius(0);
padding: 6px 16px;
text-transform: none;
background-color: var(--theme-color-bg_color);
&:hover {
color: var(--theme-color-text_link) !important;
}
}
[class*="scheme_"].footer_wrap,
[class*="scheme_"].sidebar {
.wp-block-tag-cloud a,
.sc_edd_details .downloads_page_tags .downloads_page_data > a,
.widget_product_tag_cloud a,
.widget_tag_cloud a {
color: var(--theme-color-alter_text);
border-color: var(--theme-color-alter_bd_color);
background-color: var(--theme-color-alter_bg_color);
&:hover {
color: var(--theme-color-alter_link) !important;
}
}
}
/* Widget: Instagram Feed */
#sb_instagram {
padding-bottom: 0 !important;
#sbi_images {
padding: 0;
}
}
#sb_instagram .sbi_header_text {
padding-top: 0 !important;
margin-top:-2px;
}
#sb_instagram .sb_instagram_header {
padding: 0 !important;
margin-bottom:0.5em !important;
}
.footer_fullwidth #sb_instagram .sb_instagram_header {
float:none;
text-align:center;
overflow:hidden;
}
.footer_fullwidth #sb_instagram .sb_instagram_header > a {
float:none;
display:inline-block;
overflow:hidden;
}
#sb_instagram .sb_instagram_header h3 {
font-size: 1.2308em;
line-height:1.5em;
}
#sb_instagram .sb_instagram_header p {
font-size: 1em;
line-height:1.5em;
}
#sb_instagram #sbi_load {
margin-top:0.5em;
}
.no_load #sbi_load {
display: none;
}
#sb_instagram .sbi_photo {
position: relative;
opacity: 1 !important;
&:before {
content: '';
display: block;
@include abs-cc();
width: 100%;
height: 100%;
background-color: rgba(0,0,0, 0);
@include transition-all(0.4s);
}
&:hover:before {
background-color: rgba(0,0,0, 0.2);
}
}
/* Widget: Instagram */
ul.instagram-pics {
margin-right: -5px;
}
ul.instagram-pics li {
float: left;
padding: 0 5px 5px 0;
margin:0;
overflow: hidden;
@include box(33.3333%, auto);
@include border-box;
}
.column-1_3 ul.instagram-pics li {
width: 25%;
}
.column-1_2 ul.instagram-pics li {
width: 20%;
}
.column-1_1 ul.instagram-pics li {
width: 16.6666%;
}
ul.instagram-pics li:before {
display:none;
}
/* Widget: About Me */
.widget_aboutme {
.aboutme_username {
@include font(19px, 1.5em);
}
.aboutme_description {
@include font(17px, 1.5em);
}
.aboutme_avatar + .aboutme_username {
margin-top: 0.7em;
}
.aboutme_avatar + .aboutme_description,
.aboutme_username + .aboutme_description {
margin-top: 0.3em;
}
}
/* Widget: Audio */
.widget_audio {
.widget_title {
margin-top: 0;
margin-bottom: 0;
}
.widget_title + .widget_subtitle {
margin-top: 0.5em;
@include font(17px, 1.3em);
}
.widget_title + .trx_addons_audio_wrap,
.widget_subtitle + .trx_addons_audio_wrap {
margin-top: 1.5em;
}
}
/* Widget: Video List */
.trx_addons_video_list_video_wrap .trx_addons_video_player .video_frame .wp-video {
width: unset !important;
}
.trx_addons_video_list_video_wrap .trx_addons_video_list_title_wrap a,
.trx_addons_video_list_video_wrap .trx_addons_video_list_title_wrap a:hover,
.trx_addons_video_list_video_wrap .trx_addons_video_list_title_wrap a:focus,
.trx_addons_video_list_video_wrap .trx_addons_video_list_title_wrap .trx_addons_video_list_meta,
.trx_addons_video_list_video_wrap .trx_addons_video_list_title_wrap .trx_addons_video_list_meta .post_meta_item,
.trx_addons_video_list_video_wrap .trx_addons_video_list_title_wrap .trx_addons_video_list_meta .post_meta_item:after,
.trx_addons_video_list_video_wrap .trx_addons_video_list_title_wrap .trx_addons_video_list_meta .post_meta_item .post_author_name,
.trx_addons_video_list_video_wrap .trx_addons_video_list_title_wrap .trx_addons_video_list_meta .post_meta_item:hover .post_author_name,
.trx_addons_video_list_video_wrap .trx_addons_video_list_title_wrap .trx_addons_video_list_meta .post_meta_item:focus .post_author_name {
color: #fff;
}
.trx_addons_video_list_video_wrap .trx_addons_video_list_title_wrap .trx_addons_video_list_meta,
.trx_addons_video_list_video_wrap .trx_addons_video_list_title_wrap .trx_addons_video_list_subtitle {
@include font(16px, 1.5em, 400);
}
.trx_addons_video_list_video_wrap .trx_addons_video_list_title_wrap .trx_addons_video_list_title + .trx_addons_video_list_meta,
.trx_addons_video_list_video_wrap .trx_addons_video_list_title_wrap .trx_addons_video_list_subtitle + .trx_addons_video_list_title {
margin-top: 5px;
}
.trx_addons_video_list_controller_wrap {
scrollbar-width: thin;
&::-webkit-scrollbar {
width: 7px;
}
&::-webkit-scrollbar-track {
background: var(--theme-color-text_dark_008);
}
&::-webkit-scrollbar-thumb {
background: var(--theme-color-text_dark_015);
}
.trx_addons_video_list_controller_bottom & {
&::-webkit-scrollbar {
height: 7px;
}
}
.trx_addons_video_list_controller_item {
background-color: var(--theme-color-alter_bg_color);
&:hover {
background-color: var(--theme-color-alter_bg_hover);
}
}
.trx_addons_video_list_controller_item_active {
background-color: var(--theme-color-alter_bg_hover);
}
.trx_addons_video_list_image {
.trx_addons_video_list_image_label {
@include font(10px, 14px, 500);
letter-spacing: 0.2px;
}
}
.trx_addons_video_list_title + .trx_addons_video_list_meta {
margin-top: 6px;
}
.trx_addons_video_list_title {
@include font(1.1em, 1.3em);
}
.trx_addons_video_list_subtitle {
@include font(13px, '', 500);
letter-spacing: 1.1px;
text-transform: uppercase;
a {
color: var(--theme-color-text_dark);
&:hover {
color: var(--theme-color-text_dark);
}
}
}
.trx_addons_video_list_meta {
@include font(14px, 1.5em, 400);
color: var(--theme-color-text_light);
}
}
/* Widget: Gallery */
.widget_media_gallery {
.gallery-item {
margin-bottom: 10px;
}
}
/* Agree privacy policy */
:where(.trx_addons_popup_form_field_agree, .comments_i_agree_privacy_policy) {
label {
color: var(--theme-color-text_light);
}
input[type="checkbox"] + label a {
color: inherit;
border-color: var(--theme-color-text_light);
&:hover {
color: var(--theme-color-text_dark);
border-color: var(--theme-color-text_dark);
}
}
}
/* The GDPR Framework */
.gdpr-terms-container {
clear: both;
margin: 1em 0;
}
// Cookie popup
.cc-window.cc-theme- {
.cc-header {
margin-right: 7px;
}
.cc-close {
top: 0;
right: 0;
padding: 7px;
}
}
/* WP GDPR Compliance and others */
.wpgdprc {
color: inherit;
}
table.wpgdprc-table {
margin-bottom: 2em;
}
div.wpgdprc .wpgdprc-checkbox {
display: inline;
}
#gdpr_woo_consent_field input[type="checkbox"],
.gdpr-terms-container input[type="checkbox"],
.tinv-wishlist .tinvwl-table-manage-list .product-cb input[type="checkbox"],
.wpgdprc-checkbox label input[type="checkbox"] {
position: static !important;
clip: auto;
width: 0;
-webkit-appearance: none;
-moz-appearance: none;
}
.gdpr-terms-container input[type="checkbox"],
.tinv-wishlist .tinvwl-table-manage-list .product-cb input[type="checkbox"] {
position: absolute !important;
}
#gdpr_woo_consent_field label,
.gdpr-terms-container,
.comment-form .wpgdprc-checkbox label,
.wpgdprc-checkbox label {
font-weight: inherit;
position: relative;
font-size: 14px;
padding-left: 1.8em;
padding-bottom: 0 !important;
line-height: 22px;
display: inline-block;
vertical-align: top;
color: var(--theme-color-text_light);
a {
color: inherit;
border-bottom: 1px solid var(--theme-color-text_light);
line-height: 1em;
display: inline-block;
@include transition-all(0.3s);
&:hover {
color: var(--theme-color-text_dark);
border-color: var(--theme-color-text_dark);
}
}
}
#gdpr_woo_consent_field label {
color: var(--theme-color-text_light) !important;
}
.comment-form-cookies-consent label {
color: var(--theme-color-text_light);
}
#gdpr_woo_consent_field input[type="checkbox"]:before,
.gdpr-terms-container input[type="checkbox"]:before,
.tinv-wishlist .tinvwl-table-manage-list .product-cb input[type="checkbox"]:before,
.wpgdprc-checkbox label input[type="checkbox"]:before {
content: '';
font-family: $theme_icons;
font-size: 7px;
display: block;
text-align: center;
border: 1px solid var(--theme-color-bd_color);
color: var(--theme-color-text_dark);
@include box(16px, 16px, 15px);
@include abs-lt(0, 0.45em);
@include border-box;
@include border-radius(4px);
@include transition-all(0.3s);
cursor: pointer;
}
.gdpr-terms-container {
padding-left: 25px;
input[type="checkbox"]:before {
left: -25px;
top: 0.4em;
}
}
.tinv-wishlist .tinvwl-table-manage-list .product-cb input[type="checkbox"]:before {
left: -8px;
top: -8px;
margin: 0;
}
#gdpr_woo_consent_field input[type="checkbox"]:hover:before,
.gdpr-terms-container input[type="checkbox"]:hover:before,
.tinv-wishlist .tinvwl-table-manage-list .product-cb input[type="checkbox"]:hover:before,
.wpgdprc-checkbox label input[type="checkbox"]:hover:before {
border-color: var(--theme-color-text_dark);
}
#gdpr_woo_consent_field input[type="checkbox"]:checked:before,
.gdpr-terms-container input[type="checkbox"]:checked:before,
.tinv-wishlist .tinvwl-table-manage-list .product-cb input[type="checkbox"]:checked:before,
.wpgdprc-checkbox label input[type="checkbox"]:checked:before {
content: '\e9f6';
}
/* Touch screen device style goes here */
@media (hover: none) and (pointer: coarse) {
.single-format-gallery .post_header_wrap_in_header {
overflow: hidden;
}
}
/* 10. Footer areas
-------------------------------------------------------------- */
.footer_wrap {
position: relative;
}
[class*="scheme_"].footer_wrap,
.footer_wrap [class*="scheme_"].vc_row {
background-color: var(--theme-color-alter_bg_color);
color: var(--theme-color-alter_text);
}
.footer_default .sc_layouts_row_type_normal {
padding: 3em 0;
}
.footer_default.footer_wrap .sc_layouts_row .sc_layouts_item,
.footer_default.footer_wrap .sc_layouts_row .widget {
margin-top: 1.5em !important;
margin-bottom: 1.5em !important;
}
/* Footer widgets */
[class*="scheme_"].footer_wrap .widget,
[class*="scheme_"].footer_wrap .sc_content .wpb_column,
.footer_wrap [class*="scheme_"].vc_row .widget,
.footer_wrap [class*="scheme_"].vc_row .sc_content .wpb_column {
border-color: var(--theme-color-alter_bd_color);
}
[class*="scheme_"].footer_wrap h1, [class*="scheme_"].footer_wrap h2, [class*="scheme_"].footer_wrap h3,
[class*="scheme_"].footer_wrap h4, [class*="scheme_"].footer_wrap h5, [class*="scheme_"].footer_wrap h6,
[class*="scheme_"].footer_wrap h1 a, [class*="scheme_"].footer_wrap h2 a, [class*="scheme_"].footer_wrap h3 a,
[class*="scheme_"].footer_wrap h4 a, [class*="scheme_"].footer_wrap h5 a, [class*="scheme_"].footer_wrap h6 a,
.footer_wrap [class*="scheme_"].vc_row h1, .footer_wrap [class*="scheme_"].vc_row h2, .footer_wrap [class*="scheme_"].vc_row h3,
.footer_wrap [class*="scheme_"].vc_row h4, .footer_wrap [class*="scheme_"].vc_row h5, .footer_wrap [class*="scheme_"].vc_row h6,
.footer_wrap [class*="scheme_"].vc_row h1 a, .footer_wrap [class*="scheme_"].vc_row h2 a, .footer_wrap [class*="scheme_"].vc_row h3 a,
.footer_wrap [class*="scheme_"].vc_row h4 a, .footer_wrap [class*="scheme_"].vc_row h5 a, .footer_wrap [class*="scheme_"].vc_row h6 a {
color: var(--theme-color-alter_dark);
}
[class*="scheme_"].footer_wrap h1 a:hover, [class*="scheme_"].footer_wrap h2 a:hover, [class*="scheme_"].footer_wrap h3 a:hover,
[class*="scheme_"].footer_wrap h4 a:hover, [class*="scheme_"].footer_wrap h5 a:hover, [class*="scheme_"].footer_wrap h6 a:hover,
.footer_wrap [class*="scheme_"].vc_row h1 a:hover, .footer_wrap [class*="scheme_"].vc_row h2 a:hover, .footer_wrap [class*="scheme_"].vc_row h3 a:hover,
.footer_wrap [class*="scheme_"].vc_row h4 a:hover, .footer_wrap [class*="scheme_"].vc_row h5 a:hover, .footer_wrap [class*="scheme_"].vc_row h6 a:hover {
color: var(--theme-color-alter_link);
}
[class*="scheme_"].footer_wrap a,
.footer_wrap [class*="scheme_"].vc_row a {
color: var(--theme-color-alter_dark);
}
[class*="scheme_"].footer_wrap a:hover,
.footer_wrap [class*="scheme_"].vc_row a:hover {
color: var(--theme-color-alter_link);
}
.footer_wrap p {
margin: 0;
}
.footer_wrap .widget[class*="column-"] {
margin: 1.5em 0;
}
.footer_wrap .vc_col-sm-4 .widget li {
display:inline-block;
width: 45%;
margin-right:3%;
vertical-align:top;
}
.footer_wrap .vc_col-sm-4 .widget li li {
display:block;
width: 100%;
margin-right:0;
}
.footer_wrap .footer_fullwidth {
overflow:hidden;
}
.footer_wrap .widget_title,
.footer_wrap .widgettitle {
text-align:left;
}
.footer_wrap .footer_fullwidth .widget_title,
.footer_wrap .footer_fullwidth .widgettitle {
text-align:center;
margin-bottom:1.5em;
}
/* Footer logo */
.footer_logo_inner {
padding:4em 0;
overflow:hidden;
text-align:center;
position:relative;
border-color: var(--theme-color-alter_bd_color);
}
.footer_widgets_wrap + .footer_logo_wrap .footer_logo_inner {
border-top-width: 1px;
border-top-style: solid;
}
.footer_logo_inner:after {
content:' ';
@include abs-lb(50%, 0);
@include box(1px, 3em);
background-color: var(--theme-color-alter_text);
}
.trx_addons_absent .footer_logo_inner {
padding:1em 0;
}
.trx_addons_absent .footer_logo_inner:after {
display: none;
}
.footer_logo_inner img {
max-width:25%;
}
.logo_footer_text {
@include font(3.3333em, 1em);
letter-spacing:6px;
margin:0;
}
.logo_footer_image + .logo_footer_text {
margin:0.63em 0 2em;
}
/* Socials in the default footer */
.footer_socials_inner {
padding:2em 0 3em;
text-align:center;
}
.footer_socials_inner .social_item .social_icon {
color: var(--theme-color-alter_text);
}
.footer_socials_inner .social_item:hover .social_icon {
color: var(--theme-color-alter_dark);
}
/* Posts in widgets */
[class*="scheme_"].footer_wrap .post_meta,
[class*="scheme_"].footer_wrap .post_meta_item,
[class*="scheme_"].footer_wrap .post_meta_item:after,
[class*="scheme_"].footer_wrap .post_meta_item:hover:after,
[class*="scheme_"].footer_wrap .post_meta .vc_inline-link,
[class*="scheme_"].footer_wrap .post_meta .vc_inline-link:after,
[class*="scheme_"].footer_wrap .post_meta .vc_inline-link:hover:after,
[class*="scheme_"].footer_wrap .post_meta_item a,
[class*="scheme_"].footer_wrap .post_info .post_info_item,
[class*="scheme_"].footer_wrap .post_info .post_info_item a,
[class*="scheme_"].footer_wrap .post_info_counters .post_meta_item {
color: var(--theme-color-alter_light);
}
[class*="scheme_"].footer_wrap .post_date a:hover,
[class*="scheme_"].footer_wrap a.post_meta_item:hover,
[class*="scheme_"].footer_wrap .post_meta_item a:hover,
[class*="scheme_"].footer_wrap .post_meta .vc_inline-link:hover,
[class*="scheme_"].footer_wrap .post_info .post_info_item a:hover,
[class*="scheme_"].footer_wrap .post_info_counters .post_meta_item:hover {
color: var(--theme-color-alter_dark);
}
[class*="scheme_"].footer_wrap .post_item .post_title a:hover {
color: var(--theme-color-alter_link);
}
[class*="scheme_"].footer_wrap .post_meta_item.post_categories,
[class*="scheme_"].footer_wrap .post_meta_item.post_categories a {
color: var(--theme-color-alter_link);
}
[class*="scheme_"].footer_wrap .post_meta_item.post_categories a:hover {
color: var(--theme-color-alter_hover);
}
[class*="scheme_"].footer_wrap .socials_share.socials_type_drop .social_items {
background-color: var(--theme-color-alter_bg_color);
}
[class*="scheme_"].footer_wrap .socials_share.socials_type_drop .social_items,
[class*="scheme_"].footer_wrap .socials_share.socials_type_drop .social_items:before {
background-color: var(--theme-color-alter_bg_color);
border-color: var(--theme-color-alter_bd_color);
color: var(--theme-color-alter_light);
}
/* Menu in the default footer */
.footer_menu_inner {
padding:2em 0;
text-align:center;
}
.menu_footer_nav_area > ul,
.footer_wrap .sc_layouts_menu > ul {
padding:0;
margin:0;
list-style-type:none;
}
.menu_footer_nav_area > ul > li,
.footer_wrap .sc_layouts_menu > ul > li {
display:inline-block;
vertical-align: baseline;
font-size: 18px;
font-weight: 600;
z-index: auto !important;
> a {
font-weight: 600;
}
}
.footer_wrap .sc_layouts_row_type_narrow .sc_layouts_menu > ul > li {
font-size: 17px;
}
.menu_footer_nav_area > ul > li > a,
.footer_wrap .sc_layouts_menu > ul > li > a {
padding: 0.5em 1em;
display: inline-block;
}
.mobile_layout .menu_footer_nav_area > ul > li > a,
.mobile_layout .footer_wrap .sc_layouts_menu > ul > li > a {
padding: 0.5em 1em;
}
.footer_wrap .sc_layouts_row_type_narrow .sc_layouts_column_align_left,
.footer_wrap .sc_layouts_row_type_compact .sc_layouts_column_align_left {
.elementor-widget-wrap .sc_layouts_item:first-child {
.sc_layouts_menu:not(.menu_hover_zoom_line) > ul > li:first-child > a {
padding-left: 0 !important;
}
}
}
.footer_wrap .sc_layouts_row_type_narrow .sc_layouts_column_align_right,
.footer_wrap .sc_layouts_row_type_compact .sc_layouts_column_align_right {
.elementor-widget-wrap .sc_layouts_item:first-child {
.sc_layouts_menu:not(.menu_hover_zoom_line) > ul > li:last-child > a {
padding-right: 0 !important;
}
}
}
.menu_footer_nav_area > ul > li ul,
.footer_wrap .sc_layouts_menu > ul > li ul {
top: auto;
bottom: 3em;
}
.menu_footer_nav_area > ul > li ul ul,
.footer_wrap .sc_layouts_menu > ul > li ul ul {
top: auto;
bottom: -1.4em;
margin-left: 2px;
}
.menu_footer_nav_area > ul > li ul ul.submenu_left,
.footer_wrap .sc_layouts_menu > ul > li ul ul.submenu_left {
margin-left: -2px;
}
.menu_footer_nav_area > ul > li ul > li,
.menu_footer_nav_area > ul > li ul > li > a,
.footer_wrap .sc_layouts_menu > ul > li ul > li,
.footer_wrap .sc_layouts_menu > ul > li ul > li > a {
font-size: inherit;
}
.menu_footer_nav_area > ul > li ul > li > a,
.footer_wrap .sc_layouts_menu > ul > li ul > li > a {
display:block;
}
.menu_footer_nav_area ul li a {
color: var(--theme-color-alter_dark);
}
.menu_footer_nav_area ul li a:hover {
color: var(--theme-color-alter_link);
}
/* Copyright area in the default footer */
.footer_widgets_wrap + .footer_copyright_wrap .footer_copyright_inner,
.footer_logo_wrap + .footer_copyright_wrap .footer_copyright_inner,
.footer_socials_wrap + .footer_copyright_wrap .footer_copyright_inner,
.footer_menu_wrap + .footer_copyright_wrap .footer_copyright_inner {
border-top-width: 1px;
border-top-style: solid;
}
.footer_copyright_inner {
font-size: 1em;
padding: 1.5em 0;
overflow:hidden;
text-align:center;
background-color: var(--theme-color-bg_color);
border-color: var(--theme-color-bd_color);
color: var(--theme-color-text_dark);
}
.footer_copyright_wrap p {
margin:0;
}
.footer_copyright_inner a {
color: var(--theme-color-text_dark);
}
.footer_copyright_inner a:hover {
color: var(--theme-color-text_link);
}
.footer_copyright_inner .copyright_text {
color: var(--theme-color-text);
}
/* 11. Utils
-------------------------------------------------------------- */
/* Customizer message */
.detailx_customizer_message {
padding: 2em;
margin:0 auto;
max-width:60%;
background-color: #f3e6ce;
color:#996600;
border-left: 3px solid #666600;
}
.detailx_customizer_message b {
color: #333300;
}
/* Debug window */
#debug_log {
@include fixed-lt(0, 0, 1000000);
display:block;
width:100%;
background:rgba(0,0,0,0.8);
color:#ffffff;
}
.admin-bar #debug_log {
top:32px;
}
#debug_log_close {
@include abs-rt(0, -6px);
@include square(20px);
font-size:18px;
font-weight:bold;
cursor:pointer;
}
#debug_log_content {
@include font(12px, 15px);
max-height:66px;
padding:16px 16px 6px;
overflow:auto;
word-wrap:normal;
white-space:pre-line;
}
/* 12. Registration and Login popups
-------------------------------------------------------------- */
.popup_wrap {
@include abs-rt(0, 3.3333em);
width: 37.5em;
padding: 3em 2.5em 2em;
display:none;
}
.popup_registration {
right: -5.5em;
}
.popup_wrap .popup_close {
display:block;
font-size:1.25em;
@include square(1em);
@include abs-rt;
margin:0.5em 0.5em 0 0;
color: #cccccc;
border: 2px solid #ebebeb;
background-color:#f4f7f9;
}
.popup_wrap .popup_close:hover {
color: #909090;
border: 2px solid #cccccc;
background-color:#ffffff;
}
.popup_wrap .popup_close:before {
content:'\e8ac';
font-family:$theme_icons;
line-height:1em;
padding:0 !important;
margin:0 !important;
}
.popup_wrap .form_wrap {
position:relative;
overflow:hidden;
}
.popup_wrap .form_left {
float: left;
padding-right: 2.5em;
width: 54%;
border-right: 1px solid #e0e0e0;
@include border-box;
}
.popup_wrap .form_right {
float: right;
padding-left: 2.5em;
width: 45%;
@include border-box;
}
.popup_wrap.popup_registration .form_left {
width: 50%;
padding-right: 5px;
border-right: none;
}
.popup_wrap.popup_registration .form_right {
width: 50%;
padding-left: 5px;
}
.popup_wrap .popup_form_field {
margin-bottom:0.625em;
}
.popup_wrap input[type="text"],
.popup_wrap input[type="email"],
.popup_wrap input[type="url"],
.popup_wrap input[type="password"] {
width:100%;
border: 2px solid #ebebeb;
background-color:#fafafa;
}
.popup_wrap input:not([type="submit"]):focus {
background-color:#ffffff;
}
.popup_wrap .popup_form_field.iconed_field {
position:relative;
}
.popup_wrap .popup_form_field.iconed_field:before {
@include abs-rt(8px, 10px);
margin-right:0;
color:#c9c9c9;
width:1em;
}
.popup_wrap .popup_form_field.iconed_field input {
padding-right:30px;
}
.popup_wrap .popup_form_field .forgot_password {
float: right;
line-height: 1.5em;
}
.popup_wrap .popup_form_field.submit_field {
padding:1em 0 4px 4px;
}
.popup_wrap .popup_form_field .submit_button {
width:100%;
}
.popup_wrap .login_socials_title {
color:#222222;
@include font(1.5em, 1.3em);
margin-bottom:0.5em;
}
.popup_wrap .login_socials_problem {
line-height:1.3em;
}
.popup_wrap .popup_form_field.remember_field {
margin-top: 1.2em;
}
/* 13. Third part plugins
------------------------------------------------------------------------------------ */
/* WPBakery PageBuilder */
.wpb_row,
.wpb_text_column,
.wpb_content_element,
ul.wpb_thumbnails-fluid > li,
.last_toggle_el_margin,
.wpb_button {
margin-bottom:0 !important;
}
.sc_gap .vc_row {
margin-left:0;
margin-right:0;
}
.sc_gap .vc_column_container {
padding-left:0;
padding-right:0;
}
h1 .wpb_text_column p,
h2 .wpb_text_column p,
h3 .wpb_text_column p,
h4 .wpb_text_column p,
h5 .wpb_text_column p,
h6 .wpb_text_column p {
padding-bottom:0 !important;
}
.top_panel > .vc_row > .wpb_column { z-index: 10; }
.top_panel > .vc_row:nth-child(2) > .wpb_column { z-index: 9; }
.top_panel > .vc_row:nth-child(3) > .wpb_column { z-index: 8; }
.top_panel > .vc_row:nth-child(4) > .wpb_column { z-index: 7; }
.top_panel > .vc_row:nth-child(5) > .wpb_column { z-index: 6; }
.top_panel > .vc_row:nth-child(6) > .wpb_column { z-index: 5; }
.top_panel > .vc_row:nth-child(7) > .wpb_column { z-index: 4; }
.top_panel > .vc_row:nth-child(8) > .wpb_column { z-index: 3; }
.top_panel > .vc_row:nth-child(9) > .wpb_column { z-index: 2; }
.top_panel > .vc_row:nth-child(10) > .wpb_column { z-index:1; }
.post_item_single .post_edit .vc_inline-link {
display:none;
}
/* Google conversion */
iframe[name="google_conversion_frame"] { height:1px; min-height:0; display:none; }
/* mfp */
.mfp-bg {
z-index: 200001;
background-color: var(--theme-color-alter_bg_color_07);
}
.mfp-wrap {
z-index: 200002;
}
.mfp-arrow {
background-color: transparent !important;
}
.mfp-image-holder .mfp-close,
.mfp-iframe-holder .mfp-close {
right: -20px;
padding:0;
width: 44px;
text-align:center;
color: var(--theme-color-text);
background: none !important;
}
.mfp-close-btn-in .mfp-close {
color: var(--theme-color-text);
}
.mfp-image-holder .mfp-close:hover,
.mfp-iframe-holder .mfp-close:hover,
.mfp-close-btn-in .mfp-close:hover {
color: var(--theme-color-text_dark);
}
.mfp-figure img.mfp-img {
padding-bottom: 0;
max-height: 75vh;
}
.mfp-figure figcaption {
background-color: var(--theme-color-alter_bg_color);
}
.mfp-title, .mfp-counter {
color: var(--theme-color-alter_dark);
}
/* Scroll button on the RevSlider */
.theme_scroll_down {
display:inline-block;
text-align:center;
cursor:pointer;
text-transform:uppercase;
@include font(11px !important, 15px !important);
letter-spacing: 2px;
}
.theme_scroll_down:after {
content: '\e938';
font-family:$theme_icons;
@include font(16px !important, 30px !important);
display:block;
text-align:center;
}
.theme_scroll_down:hover {
@include animation(squat 0.5s 1 cubic-bezier(0.2, -0.8, 0.6, -1.2));
}
/* Other */
.no-content {
height: 0;
}
/* Post More Link */
.post-more-link {
position: relative;
display: inline-block;
top: auto;
left: auto;
height: auto;
width: auto;
@include font(14px, 21px, 700);
text-transform: uppercase;
letter-spacing: 1.4px;
color: var(--theme-color-text_dark);
z-index: 1;
overflow: hidden;
&:active,
&:hover {
color: var(--theme-color-text_dark);
}
.link-text {
position: relative;
margin-right: 0;
display: inline-block;
vertical-align: middle;
text-indent: -110px;
visibility: hidden;
opacity: 0;
white-space: nowrap;
@include transition(visibility .4s ease, margin-right .4s ease-out, text-indent .5s ease-out, color .4s ease, opacity .4s ease);
will-change: visibility, margin-right, text-indent, color, opacity;
}
.more-link-icon {
position: relative;
display: inline-block;
vertical-align: middle;
overflow: hidden;
@include square(1.4em);
&:before {
@include font(11px, inherit, 400, inherit);
content: '\E9A4';
font-family: $theme_icons;
display: inline-block;
vertical-align: top;
color: currentColor;
}
}
&:hover .link-text {
opacity: 1;
text-indent: 0;
margin-right: 6px;
visibility: visible;
@include transition(visibility .4s ease, margin-right .3s ease-out, text-indent .4s ease-out, color .4s ease, opacity .4s ease);
}
}
/* Instagram */
#sb_instagram[data-shortcode-atts*="feedOne"],
#sb_instagram.feedOne {
#sbi_load {
margin: 0;
}
.sbi_follow_btn {
margin: 0 !important;
@include abs-cc();
a {
margin: 0;
padding: 15px 25px;
@include border-radius(0);
font-size: 14px;
line-height: 21px;
font-weight: 500;
letter-spacing: 1.4px;
text-transform: uppercase;
background: #ffffff !important;
@include box-shadow(none !important);
color: #071021;
position: relative;
&:before {
font-family: $theme_icons;
font-size: 18px;
font-weight: 400;
content: '\e87e';
margin: 0 3px 0 0;
display: inline-block;
position: relative;
bottom: -1px;
}
}
.fa,
svg {
margin-bottom: -1px;
margin-right: 9px;
margin-left: 2px;
font-size: 17px;
font-weight: 400;
display: none;
}
}
}
#sb_instagram[data-shortcode-atts*="feedTwo"],
#sb_instagram.feedTwo {
#sbi_load {
margin: 0;
}
.sbi_follow_btn {
margin: 0 !important;
@include abs-cc();
a {
margin: 0;
padding: 0 15px;
@include border-radius(58px);
font-size: 13px;
font-weight: 500;
letter-spacing: 0.8px;
text-transform: uppercase;
background: #ffffff !important;
@include box-shadow(none !important);
color: #071021;
height: 102px;
min-width: 102px;
line-height: 102px;
text-align: center;
vertical-align: middle;
> span {
display: none;
}
}
.fa,
svg {
font-size: 24px;
font-weight: 400;
margin: 6px;
vertical-align: middle;
color: #A5A6AA;
}
}
}
#sb_instagram[data-shortcode-atts*="feedExtra"],
#sb_instagram.feedExtra {
#sbi_load {
margin: 0;
}
.sbi_photo {
opacity: 1 !important;
&:before {
display: none !important;
}
}
.sbi_follow_btn {
margin: 0 !important;
@include abs-cc();
a {
margin: 0;
padding: 0;
font-size: 13px;
font-weight: 500;
letter-spacing: 0.8px;
text-transform: uppercase;
background: none !important;
@include box-shadow(none !important);
color: #071021;
line-height: 20px;
text-align: center;
vertical-align: middle;
> span {
display: none;
}
}
.fa,
svg {
font-size: 42px;
font-weight: 400;
margin: 6px;
vertical-align: middle;
color: #ffffff;
}
}
}
/* Layouts Compact */
.sc_layouts_row_type_compact {
.sc_layouts_item input[type="text"] {
@include font(16px, 1.5em, 400);
}
/* icons */
.sc_layouts_item_icon + .sc_layouts_item_details {
margin-left: 0.7em;
}
.sc_layouts_item_icon {
line-height: 1.1em;
font-size: 24px;
font-weight: 400;
}
.elementor-icon {
font-size: 21px;
}
.search_wrap .search_submit {
font-size: 24px;
}
.sc_layouts_iconed_text:not(.sc_layouts_menu_mobile_button):not(.sc_layouts_menu_mobile_button_burger) {
.sc_layouts_iconed_text_link {
.sc_layouts_iconed_text_icon {
font-size: 20px;
width: 39px;
height: 39px;
line-height: 39px;
text-align: center;
@include border-radius(50%);
background-color: var(--theme-color-text_link3);
color: var(--theme-color-inverse_link) !important;
}
}
.sc_layouts_item_details {
font-size: 22px;
font-weight: 400;
}
}
/* mobile button */
.sc_layouts_menu_mobile_button,
.sc_layouts_menu_mobile_button_burger {
.sc_layouts_item_icon {
font-size: 16px;
&:before {
font-family: $theme_icons;
content: '\e9d7';
}
}
}
/* socials */
.sc_socials.sc_socials_default .socials_wrap {
margin-bottom: 0;
}
.sc_socials.sc_socials_default .socials_wrap .social_item {
margin: 0 10px 0 0;
.social_icon {
display: block;
width: 42px;
height: 42px;
line-height: 40px;
font-size: 16px;
border: none;
}
}
/* Cart */
.sc_layouts_cart {
line-height: 1;
.sc_layouts_cart_icon {
&:before {
position: relative;
font-family: $theme_icons;
content: '\e9f4';
}
}
.sc_layouts_cart_items_short {
font-size: 10px;
font-weight: 500;
min-width: 15px;
min-height: 15px;
line-height: 15px;
text-align: center;
padding: 0 2px;
top: auto;
bottom: -3px;
right: -6px;
@include transform(none);
}
}
/* Title */
.sc_layouts_title_caption {
font-size: 57px;
line-height: 1em;
}
}
/* Layouts Narrow */
.sc_layouts_row_type_narrow {
font-size: 13px;
line-height: 18px;
font-weight: 400;
/* icon */
.sc_layouts_item_icon + .sc_layouts_item_details {
margin-left: 0.7em;
}
.sc_layouts_item_icon {
line-height: 1em;
font-size: 16px;
font-weight: 400;
}
/* socials */
.sc_socials.sc_socials_default .socials_wrap {
margin-bottom: 0;
}
.sc_socials.sc_socials_default .socials_wrap .social_item,
.sc_socials.sc_socials_default .socials_wrap:not([class*="socials_type_"]) .social_item {
margin: 0 10px 0 0;
.social_icon {
display: block;
width: 38px;
height: 38px;
line-height: 38px;
font-size: 15px;
border: none;
}
}
}
/* Layouts panel inner */
.sc_layouts_panel_inner {
padding: 55px 35px 40px;
> .elementor,
.elementor-section-wrap,
.elementor-inner,
.elementor-section.elementor-section-height-full {
height: 100%;
min-height: auto;
}
.elementor-section.elementor-section-height-full > .elementor-container {
height: 100%;
}
/* socials */
.sc_socials.sc_socials_default {
.socials_wrap .social_item {
margin-right: 28px;
.social_icon {
width: 25px;
height: 25px;
line-height: 22px;
font-size: 18px;
text-align: center;
border: none;
@include border-radius(0);
}
}
&.sc_align_left .socials_wrap {
margin-left: -5px;
}
}
.sc_socials.sc_socials_icons_names {
&.sc_align_left {
margin-left: -8px;
}
&.sc_align_right {
margin-right: -8px;
}
.socials_wrap .social_item {
+ .social_item {
margin-top: 25px;
}
&:hover {
.social_name,
.social_icon {
color: var(--theme-color-text);
}
}
}
}
}
.sc_layouts_panel_hide_content.sc_layouts_panel_opened {
background-color: transparent;
}
/* Socials Names */
.sc_socials.sc_socials_icons_names {
.socials_wrap .social_item {
color: var(--theme-color-text_dark);
display: block;
text-align: inherit;
margin: 0;
.social_icon {
width: 2em;
height: 2em;
line-height: 2em;
position: relative;
display: inline-block;
vertical-align: middle;
background: none !important;
+ .social_name {
display: inline-block;
vertical-align: middle;
margin: 0 0 0 14px;
font-size: 20px;
line-height: 24px;
font-weight: 500;
}
}
&:hover {
.social_name,
.social_icon {
color: var(--theme-color-text);
}
}
}
}
/* Menu */
.menu_hover_color_line > ul > li:not(.menu-collapse).menu-item-has-children > a:before,
.menu_hover_color_line > ul > li:not(.menu-collapse).menu-item-has-children > a:after {
right: 0.9em !important;
}
.menu_hover_path_line > ul > li:not(.menu-collapse) > a:after {
display: inline-block !important;
}
.menu_hover_path_line.sc_layouts_menu_dir_vertical.sc_layouts_submenu_popup .sc_layouts_menu_nav > li.menu-item-has-children > a,
.menu_hover_path_line.sc_layouts_menu_dir_vertical.sc_layouts_submenu_popup .sc_layouts_menu_nav > li > a {
padding: 0.25em;
}
.menu_hover_path_line.sc_layouts_menu_dir_vertical > ul > li:not(.menu-collapse):before {
display: inline-block !important;
}
.sc_layouts_menu_nav {
> li > a,
> li.menu-item-has-children > a {
padding: 0.7em;
}
> li[class*="icon-"] > a,
> li.menu-item-has-children[class*="icon-"] > a {
padding-left: 2em;
}
> li[class*="icon-"]:before {
padding: 1.05em 0;
color: var(--theme-color-text_dark);
}
> li.menu-item-has-children > a:after {
display: none;
}
> li > ul {
top: 5.7em;
left: -0.7em;
}
/* columns menu */
> li[class*="columns-"] {
> ul ul {
margin-right: 5px;
}
> ul.sub-menu {
padding: 2.3em 4.3em;
}
li li > a {
padding: 0.65em 0;
}
li li[class*="icon-"]:before {
left: 0;
}
li li[class*="icon-"] > a {
padding-left: 1.6em;
}
> ul > li[class*="icon-"] > a {
padding-left: 1.2em;
}
> ul > li[class*="icon-"]:before {
top: 17px;
left: 0;
@include transform(none);
}
li.menu-item-has-children {
> a {
padding: 0.65em 0;
@include font(19px !important, 1.5em !important, 500 !important);
color: var(--theme-color-extra_dark) !important;
}
> a:hover,
&.sfHover > a {
color: var(--theme-color-extra_dark) !important;
}
}
}
/* Columns Menu in Collapse */
li.menu-collapse li[class*="columns-"] li.menu-item-has-children > a {
@include font(inherit !important, 1.5em !important, 500 !important);
color: var(--theme-color-extra_dark) !important;
> span {
font-size: 1.1em;
}
}
li.menu-collapse li[class*="columns-"] li.menu-item-has-children > a:hover,
li.menu-collapse li[class*="columns-"] li.menu-item-has-children.sfHover > a {
color: var(--theme-color-extra_dark) !important;
}
/* Stretch window */
> li[class*="columns-"][class*="trx_addons_stretch_window"] {
> ul {
padding-top: 6.3em;
padding-bottom: 6.3em;
}
li > a,
li.menu-item-has-children > a {
padding: 0.65em 0;
}
> ul > li[class*="icon-"] > a {
padding-left: 1.2em;
}
> ul > li[class*="icon-"]:before {
top: 17px;
left: 0;
@include transform(none);
}
li[class*="icon-"] > a {
padding-left: 1.6em;
}
li[class*="icon-"]:before {
left: 0;
}
}
> li[class*="columns-"].trx_addons_stretch_window {
> ul {
padding-left: 7.6em;
padding-right: 7.6em;
}
}
/* Stretch window boxed */
> li[class*="columns-"].trx_addons_stretch_window_boxed {
> ul {
padding-left: 0;
padding-right: 0;
}
}
body.body_style_fullwide & > li[class*="columns-"] {
> ul {
padding-left: var(--theme-var-page_fullwide_extra);
padding-right: var(--theme-var-page_fullwide_extra);
}
}
}
/* sub zoom line */
.menu_hover_zoom_line .sc_layouts_menu_nav {
li li:not(.menu-collapse) > a > span {
display: inline-block;
padding: 0;
word-break: break-word;
@include transition(padding-left .2s ease);
}
li li:not(.menu-collapse) > a > span:after {
content: "";
display: block;
position: relative;
z-index: 1;
top: auto;
bottom: -5px;
left: 0;
@include transform(none);
width: 0;
height: 1px;
@include transition(width 0.2s ease);
background-color: var(--theme-color-extra_hover);
}
li li:not(.menu-collapse) > a:hover > span:after,
li li:not(.menu-collapse).sfHover > a > span:after,
li li:not(.menu-collapse).current-menu-item > a > span:after,
li li:not(.menu-collapse).current-menu-parent > a > span:after,
li li:not(.menu-collapse).current-menu-ancestor > a > span:after {
width: 100%;
}
li li:not(.menu-collapse) > a:hover > span,
li li:not(.menu-collapse).sfHover > a > span,
li li:not(.menu-collapse).current-menu-item > a > span,
li li:not(.menu-collapse).current-menu-parent > a > span,
li li:not(.menu-collapse).current-menu-ancestor > a > span {
padding-left: 9px;
}
/* columns menu */
li[class*="columns-"] li.menu-item-has-children > a > span {
padding-left: 0;
}
li[class*="columns-"] li.menu-item-has-children > a > span:after {
display: none;
}
}
.sc_layouts_menu_popup .sc_layouts_menu_nav > li.menu-item-has-children > a:after,
.sc_layouts_menu_nav li li.menu-item-has-children > a:after {
font-family: $theme_icons;
content: '\e836';
font-weight: normal;
position: absolute;
z-index: 1;
top: 0.5em;
right: 1.35em;
font-size: 19px;
}
.sc_layouts_menu_popup .sc_layouts_menu_nav,
.sc_layouts_menu_nav > li ul:not(.sc_item_filters_tabs) {
width: 15em;
padding: 1em 0;
}
.sc_layouts_menu_popup .sc_layouts_menu_nav,
.sc_layouts_menu_popup .sc_layouts_menu_nav > li > ul,
.sc_layouts_menu_nav > li > ul ul {
left: 15em;
top: -1em;
margin: 0 0 0 4px;
}
.sc_layouts_menu_nav > li > ul ul.submenu_left {
left: -15em;
margin: 0 0 0 -4px;
}
.sc_layouts_menu_nav > li > ul ul.sc_layouts_submenu.submenu_left {
left: auto;
right: 15.1428em;
margin: 0;
}
.sc_layouts_menu_popup .sc_layouts_menu_nav > li > a,
.sc_layouts_menu_nav > li li > a {
padding: 0.65em 1.6em;
}
.sc_layouts_menu_popup .sc_layouts_menu_nav > li.menu-item-has-children > a,
.sc_layouts_menu_nav li li.menu-item-has-children > a {
padding-right: 2.2em;
}
/* Vertical Menus */
.sc_layouts_menu_dir_vertical .sc_layouts_menu_nav li.menu-item-has-children > a > .open_child_menu {
display: none;
@include abs-rt(0, 0, 2);
bottom: 0;
width: 2.2em;
}
/* Vertical dropdown */
.sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown {
display: block;
.sc_layouts_menu_nav {
font-size: 24px;
line-height: 1.4em;
> li.menu-item-has-children > a,
> li > a {
padding: 0.3em 0;
}
> li.menu-item-has-children > a {
padding-right: 1.2em !important;
}
li.menu-item-has-children > a > .open_child_menu {
display: block !important;
position: absolute;
z-index: 2;
top: 0;
right: 0;
bottom: 0;
width: 1.2em;
text-align: right;
line-height: 1.8em;
&:before {
content:'\e9df';
font-family:$theme_icons;
font-size: 9px;
font-weight: 400;
margin-right: 1px;
}
}
> li > ul {
font-size: 18px;
line-height: 1.4em;
font-weight: 400;
}
li.menu-item-has-children > a:after {
display: none;
}
/* sub */
> li ul,
> li:last-child ul {
margin: 0 0 0 10px;
padding: 11px 0;
li.menu-item-has-children > a > .open_child_menu {
width: 1.2em;
line-height: 1.9em;
}
}
> li li > a {
color: var(--theme-color-text_dark) !important;
}
> li li > a:hover,
> li li.current-menu-item > a,
> li li.current-menu-parent > a,
> li li.current-menu-ancestor > a {
color: var(--theme-color-text_link) !important;
}
> li ul li > a,
> li:last-child ul li > a {
padding: 0.4em 0;
}
> li ul li.menu-item-has-children > a,
> li:last-child ul li.menu-item-has-children > a {
padding-right: 1.5em;
}
}
}
/* Vertical Popup */
.sc_layouts_menu_dir_vertical.sc_layouts_submenu_popup {
.sc_layouts_menu_nav {
> li.menu-item-has-children > a,
> li > a {
padding: 0.25em 0;
}
> li.menu-item-has-children > a:after {
display: inline-block;
}
}
}
.sc_layouts_panel_inner {
.elementor-section.elementor-section-height-full {
.sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown {
overflow-y: scroll;
max-height: 50vh;
}
.sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown { -ms-overflow-style: none; } /* hide scrollbar Explorer */
.sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown { scrollbar-width: none; } /* hide scrollbar FireFox */
.sc_layouts_menu_dir_vertical.sc_layouts_submenu_dropdown::-webkit-scrollbar { width: 0; } /* hide scrollbar Chrome */
}
}
/* Sticky Socials */
.sticky_socials_wrap {
position: fixed;
top: 50%;
z-index: 8001;
@include box(auto, auto);
@include flex;
/* Sticky Socials Style "Default" */
&.sticky_socials_default {
left: 55px;
max-height: 300px;
@include transform(translateY(-50%));
@include flex-direction(column);
@include flex-wrap(wrap);
@include flex-justify-content(center);
@include flex-align-items(center);
@include border-box;
.social_item {
display: inline-block;
margin: 4px;
@include transition(none);
.social_icon {
padding: 1px;
display: inline-block;
text-align: center;
@include box(2.5em, 2.5em, 2.5em);
@include border-radius(50%);
border: 1px solid;
color: var(--theme-color-text_dark);
background-color: transparent;
border-color: var(--theme-color-text_dark_02);
will-change: color;
@include transition(color .2s ease-out);
&.icon-twitter-new {
font-size: 82%;
}
}
&:hover .social_icon {
color: var(--theme-color-text_link);
}
}
}
/* Sticky Socials Style "Modern" */
&.sticky_socials_modern {
left: 56px;
width: 505px;
@include flex-direction(row);
@include flex-justify-content(center);
@include flex-align-items(center);
@include flex-wrap(wrap);
@include transform-origin(0 50%);
@include transform(rotate(-90deg) translate(-50%, 50%));
@include border-box;
.social_item {
margin-right: 22px;
margin-left: 22px;
line-height: 30px;
@include flex;
@include flex-align-items(center);
color: var(--theme-color-text_dark);
&:hover {
color: var(--theme-color-text_link);
}
.social_name {
@include font(14px, '', 500);
}
.social_icon {
@include font(16px, '', 400);
}
.social_icon + .social_name {
margin-left: 10px;
}
}
}
}
/* Hotspot */
@keyframes AniMy {
0% {
-webkit-transform: scale(0);
transform: scale(0);
}
80% {
-webkit-transform: scale(1);
transform: scale(1);
@include box-shadow(0 0 0 10px var(--theme-color-text_link_02));
background-color: var(--theme-color-text_link_02);
}
100% {
-webkit-transform: scale(1);
transform: scale(1);
@include box-shadow(0 0 0 10px rgba(255,255,255,0));
background-color: rgba(255,255,255,0);
}
}
.wrap_svl_center {
line-height: 0;
}
.point_style {
cursor: pointer;
}
.point_style .pins_animation {
border: none;
@include box-shadow(0 0 0 10px var(--theme-color-text_link_02));
}
.pins_animation.ihotspot_pulse {
-moz-animation: AniMy 1.5s infinite !important;
-webkit-animation: AniMy 1.5s infinite !important;
animation: AniMy 1.5s infinite !important;
}
#powerTip {
padding: 9px 40px 12px;
@include box-sizing(border-box);
@include border-radius(0 !important);
background-color: var(--theme-color-inverse_dark) !important;
color: #ffffff !important;
.box_view_html {
font-size: 16px;
line-height: 20px;
font-weight: 600;
text-transform: uppercase;
a {
color: #ffffff !important;
opacity: 0.8;
&:hover {
opacity: 1;
}
}
p {
margin: 0;
+ p {
margin-top: 5px;
}
}
}
&.n {
margin-bottom: 15px;
}
&.n:before {
border-top: 10px solid var(--theme-color-inverse_dark);
bottom: -7px;
}
&.ne:before,
&.nw:before {
border-top: 10px solid var(--theme-color-inverse_dark);
}
&.se:before,
&.sw:before {
border-bottom: 10px solid var(--theme-color-inverse_dark);
}
&.s:before {
border-bottom: 10px solid var(--theme-color-inverse_dark);
}
&.e:before {
border-right: 10px solid var(--theme-color-inverse_dark);
}
&.w:before {
border-left: 10px solid var(--theme-color-inverse_dark);
}
&.n:before,
&.s:before {
border-right: 8px solid transparent;
border-left: 8px solid transparent;
margin-left: -8px;
}
}
/* BG */
.sc_testimonials_hover {
.sc_testimonials_item:after {
background-image:url(../images/testimonials-bg.png);
}
}
/* Advanced Popups */
.adp-popup {
@include box-shadow(0 3px 46px rgba(0,0,0,0.1));
@include transform(translateZ(1000px));
}
.adp-popup-type-content .adp-popup-content {
@include box-sizing(border-box);
padding: 0;
}
.adp-popup-inner > p {
margin: 0 !important;
}
.adp-popup .adp-popup-close {
cursor: pointer;
color: #A5A6AA !important;
&:hover {
color: #A5A6AA !important;
}
&:before {
@include transform(rotate(0deg));
font-size: 19px;
content:'\e9e1';
font-family:$theme_icons;
@include transition-all(0.3s);
display: block;
width: 22px;
height: 22px;
line-height: 22px;
text-align: center;
will-change: transform;
color: #A5A6AA !important;
}
&:hover:before {
@include transform(rotate(180deg));
color: #A5A6AA !important;
}
}
.ua_firefox .adp-popup .adp-popup-close:before {
transform-origin: 50% 52%;
}
.adp-popup.adp-popup-open[data-light-close="true"] .adp-popup-close {
outline: none;
color: #dddddd !important;
}
/* location center */
.adp-popup.adp-popup-location-center {
top: 50%;
transform: translateY(-50%) translateZ(1000px);
right: 0;
left: 0;
margin: 0 auto;
}
/* box */
.adp-popup-type-notification-box {
.adp-popup-close:hover,
.adp-popup-close {
color: var(--theme-color-inverse_dark) !important;
&:before {
color: var(--theme-color-inverse_dark) !important;
}
}
.adp-popup-text {
padding: 51px 0 0 0;
text-align: center;
font-size: 14px;
line-height: 1.4em;
color: var(--theme-color-inverse_dark);
position: relative;
&:before {
position: absolute;
left: 0;
top: 0;
width: 100%;
text-align: center;
display: block;
font-size: 36px;
line-height: 1em;
content:'\ea0a';
font-family:$theme_icons;
}
}
.adp-popup-button {
margin: 20px auto 0;
display: block;
width: calc(100% - 18px);
@include border-radius(0);
font-size: 12px;
font-weight: 700;
line-height: 14px;
letter-spacing: 1.5px;
text-indent: 0;
text-transform: uppercase;
padding: 15px;
@include box-sizing(border-box);
text-align: center;
background-color: #23201E;
color: #ffffff;
cursor: pointer;
@include box-shadow(none);
&:hover,
&:focus {
background-color: var(--theme-color-text_link);
}
}
}
/* bar */
.adp-popup-type-notification-bar {
.adp-popup-close:hover,
.adp-popup-close {
color: var(--theme-color-inverse_dark) !important;
&:before {
color: var(--theme-color-inverse_dark) !important;
}
}
.adp-popup-text {
padding: 0 20px 0 0;
text-align: center;
font-size: 14px;
line-height: 1.4em;
color: var(--theme-color-inverse_dark);
position: relative;
&:before {
display: inline-block;
font-size: 28px;
line-height: 0;
content:'\ea0a';
font-family:$theme_icons;
margin: -3px 22px 0 0;
vertical-align: middle;
}
}
.adp-popup-button {
margin-left: 1.8rem;
display: inline-block;
@include border-radius(0);
font-size: 12px;
font-weight: 700;
line-height: 14px;
letter-spacing: 1.5px;
text-indent: 0;
text-transform: uppercase;
padding: 12px 31px;
@include box-sizing(border-box);
text-align: center;
background-color: #23201E;
color: #ffffff;
cursor: pointer;
@include box-shadow(none);
&:hover,
&:focus {
background-color: var(--theme-color-text_link);
}
}
}
/* LatePoint */
select[id^="booking_custom_fields_"] {
visibility: visible;
-webkit-appearance: auto;
}
.latepoint-step-content .os-form-select-group .select_container:before,
.latepoint-step-content .os-form-select-group .select_container:after {
display: none;
}
.latepoint-book-button {
@include theme_button_filled;
@include box-shadow(0 7px 25px var(--theme-color-text_link_02));
@include transition-all(0.3s);
&:focus,
&:hover {
@include theme_button_colors_hover;
@include box-shadow(0 7px 25px var(--theme-color-text_link_02));
}
}
.latepoint-w .latepoint-booking-form-element .latepoint-summary-w h3.summary-header {
padding-right: 29px;
}
.latepoint-w .latepoint-booking-form-element.latepoint-color-black h1, .latepoint-w .latepoint-booking-form-element.latepoint-color-black h2, .latepoint-w .latepoint-booking-form-element.latepoint-color-black h3, .latepoint-w .latepoint-booking-form-element.latepoint-color-black h4, .latepoint-w .latepoint-booking-form-element.latepoint-color-black h5 {
color: #222733;
}
.latepoint-w .latepoint-booking-form-element.latepoint-color-black .os-items .os-item > .os-item-i:hover {
border-color: #222733;
}
/* twentytwenty */
.twentytwenty-wrapper {
.twentytwenty-overlay {
background: none;
&:hover {
background: none;
}
.twentytwenty-before-label {
left: 0;
}
.twentytwenty-after-label {
right: 0;
}
.twentytwenty-before-label,
.twentytwenty-after-label {
background: #ffffff;
color: #000;
opacity: 1;
font-size: 14px;
line-height: 16px;
font-weight: 400;
height: auto;
width: auto;
bottom: 0;
padding: 8px 20px;
@include border-radius(0);
letter-spacing: 0;
@include transition-all(0.3s);
}
}
&:hover .twentytwenty-overlay,
.twentytwenty-overlay:hover {
.twentytwenty-before-label,
.twentytwenty-after-label {
opacity: 0;
}
}
&.twentytwenty-horizontal .twentytwenty-handle:after,
&.twentytwenty-horizontal .twentytwenty-handle:before {
display: none;
}
.twentytwenty-handle {
@include border-radius(50%);
@include box-shadow(none);
width: 66px;
height: 66px;
line-height: 66px;
border: none;
background: #ffffff;
margin-left: -33px;
margin-top: -33px;
text-align: center;
.twentytwenty-left-arrow,
.twentytwenty-right-arrow {
border: none !important;
width: 20px;
line-height: 20px;
height: 20px;
position: absolute;
top: 50%;
font-size: 15px;
margin-top: -10px;
}
.twentytwenty-left-arrow {
left: 50%;
margin-left: -20px;
}
.twentytwenty-right-arrow {
right: 50%;
margin-right: -20px;
}
.twentytwenty-left-arrow:before {
content: '\e92a';
font-family: $theme_icons;
display: inline-block;
color: #000;
}
.twentytwenty-right-arrow:before {
content: '\e92b';
font-family: $theme_icons;
display: inline-block;
color: #000;
}
}
&.twentytwenty-vertical {
.twentytwenty-handle {
.twentytwenty-down-arrow,
.twentytwenty-up-arrow {
border: none !important;
width: 20px;
line-height: 20px;
height: 20px;
position: absolute;
top: 50%;
font-size: 15px;
margin-top: -20px;
}
.twentytwenty-down-arrow {
margin-top: 0;
margin-bottom: -20px;
top: auto;
bottom: 50%;
}
.twentytwenty-down-arrow,
.twentytwenty-up-arrow {
left: 50%;
margin-left: -10px;
}
.twentytwenty-down-arrow:before {
content: '\E929';
font-family: $theme_icons;
display: inline-block;
color: #000;
}
.twentytwenty-up-arrow:before {
content: '\E92C';
font-family: $theme_icons;
display: inline-block;
color: #000;
}
}
.twentytwenty-before-label {
top: 0;
left: 0;
bottom: auto;
right: auto;
}
.twentytwenty-after-label {
bottom: 0;
left: 0;
top: auto;
right: auto;
}
.twentytwenty-handle:before,
.twentytwenty-handle:after {
display: none;
}
}
}
/* Demo */
.position-abs-lc {
@include abs-lc();
}
.round-square .elementor-button {
width: 101px;
height: 101px;
line-height: 100px;
padding: 0;
}
.round-square-2 .elementor-button-link {
overflow: hidden;
}
.round-square-2 .elementor-button {
width: 193px;
height: 193px;
line-height: 193px !important;
padding: 0;
}
.form-position-abs {
@include abs-cc();
}
.sc_title_default .extra_bg {
display: inline-block;
padding: 0 5px;
}
.VanillaTiltHover img {
pointer-events:none;
}
.cursor-pointer {
cursor: pointer;
}
.right_bar g,
#Right_Bar g {
stroke: var(--theme-color-text_dark);
}
.social_icon .icon-twitter-new {
font-size: 88%;
}
.size-around .elementor-icon {
padding: 10px;
}
.no-margin {
margin: 0 !important;
}
/* for single team col */
.left_shift {
z-index: 5;
margin: 0 0 0 -160px;
width: calc(100% + 160px) !important;
}
/* Add custom styles for default button ( with custom class ) */
.custom_icon_btn {
&.elementor-widget-button {
.elementor-button {
font-size: 14px;
font-weight: 700;
line-height: 21px;
text-transform: uppercase;
padding: 0;
background-color: transparent;
letter-spacing: 1px;
.elementor-button-content-wrapper {
line-height: 4.22rem;
.elementor-button-icon {
border: 1px solid var(--theme-color-text_dark_05);
font-size: 16px;
width: 4.22rem;
height: 4.22rem;
line-height: 4.8rem;
text-align: center;
justify-content: center;
@include border-radius(50%);
svg {
height: inherit;
}
}
}
}
&.elementor-align-right {
.elementor-button {
.elementor-button-content-wrapper {
.elementor-button-icon {
margin-left: 30px;
}
}
}
}
}
}
/* for service single */
.extra_tiny_spacer {
height: 8px !important;
}
.tiny_spacer {
height: 13px !important;
}
.small_spacer {
height: 40px !important;
}
/* Change padding in slider when you use layout as slide */
.small_padding {
.slider_container {
.slide_content {
padding: 0;
}
.slider-slide {
padding-left: 15px;
padding-right: 15px;
}
}
.body_style_fullscreen & {
.slider-slide {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
}
/* Remove padding in slider when you use layout as slide */
.remove_padding {
.slider_container .slide_content {
padding: 0;
}
}
/* simple_text_link */
.simple_text_link {
&.underline_anim {
color: var(--theme-color-text_dark) !important;
font-size: 14px !important;
font-weight: 700 !important;
letter-spacing: 1px !important;
padding-bottom: 13px !important;
background-image: linear-gradient(to right, currentColor 0%, currentColor 100%);
background-position: 0 100%;
background-repeat: no-repeat;
-webkit-background-size: 0 1px;
background-size: 0 1px;
@include box-sizing(border-box);
}
&.underline_anim.underline_do_hover {
animation: underline_hover_on2 .8s cubic-bezier(0.25, 0.8, 0.25, 1) both;
}
&.underline_anim.underline_do_hover:hover {
animation: underline_hover_off2 .8s cubic-bezier(0.25, 0.8, 0.25, 1) both;
}
}
@-webkit-keyframes underline_hover_on2 {
0%
{
-webkit-background-size: 0 2px;
background-size: 0 2px;
}
100%
{
-webkit-background-size: 100% 2px;
background-size: 100% 2px;
}
}
@keyframes underline_hover_on2 {
0%
{
-webkit-background-size: 0 2px;
background-size: 0 2px;
}
100%
{
-webkit-background-size: 100% 2px;
background-size: 100% 2px;
}
}
@-webkit-keyframes underline_hover_off2 {
0%
{
-webkit-background-size: 100% 2px;
background-size: 100% 2px;
}
100%
{
-webkit-background-size: 0 2px;
background-size: 0 2px;
}
}
@keyframes underline_hover_off2 {
0%
{
-webkit-background-size: 100% 2px;
background-size: 100% 2px;
}
100%
{
-webkit-background-size: 0 2px;
background-size: 0 2px;
}
}
.button_bg_icon_color,
.button_bg_icon_color_2 {
.icon-envelope-2:before {
margin: -1px -3px 0 0;
}
&.sc_button_simple.sc_button_icon_left .sc_button_icon {
margin-right: 0.8em;
}
.sc_button_icon {
background-color: var(--theme-color-bg_color);
border: none !important;
font-size: 18px !important;
}
}
.button_bg_icon_color_2 {
overflow: visible;
.sc_button_icon {
background-color: var(--theme-color-alter_bg_color);
@include box-shadow(0 0 6px rgba(0,0,0, .03));
}
}
.button_alter2_icon_color {
overflow: visible;
&.sc_button_simple.sc_button_icon_left .sc_button_icon {
margin-right: 0.8em;
}
.sc_button_icon {
@include box-shadow(0 0 0 4px rgba(234,234,234,0.2));
color: var(--theme-color-text_link2);
}
}
.extra-size-skills {
.sc_skills_counter_alter .sc_skills_total {
font-size: 130px;
letter-spacing: 1px;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.sc_skills_counter_alter .sc_skills_item_title {
font-size: 18px;
font-weight: 600;
text-transform: uppercase;
color: #C5A48E;
margin-top: 0 !important;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
}
/* color for menu in footer */
.footer_wrap .extra_menu_in_footer .sc_layouts_menu > ul > li > a {
font-size: 16px;
font-weight: 600;
color: var(--theme-color-text_dark) !important;
&:before {
color: var(--theme-color-text_dark) !important;
}
}
// Add custom styles for elements on Clients page and shortcodes
.alter_clients {
.widget_slider {
.slider_container {
.slider-slide {
background-color: #ffffff;
img {
opacity: 0.2;
transition: 0.3s;
}
&:hover {
img {
opacity: 1;
}
}
}
}
}
}
.awards_slider {
.widget_slider .slider_type_images .slider-slide {
@include box-sizing(border-box);
padding: 20px 60px;
min-height: 200px;
background-color: #ffffff;
border: 1px solid var(--theme-color-bd_color);
.slide_info {
@include transition-all(0.3s);
text-shadow: none;
position: absolute;
left: 0;
top: 0;
justify-content: center;
flex-direction: column;
align-items: center;
height: 100%;
width: 100%;
@include flex;
opacity: 0;
.slide_title {
margin: 0 0 7px 0;
font-size: 19px;
font-weight: 600;
color: #222733 !important;
}
.slide_cats {
font-size: 16px;
font-weight: 600;
color: #7A7E83 !important;
}
}
.slide_overlay {
background: none;
border: 1px solid #E5E5E5;
left: 0;
right: 0;
top: 0;
bottom: 0;
@include box-sizing(border-box);
}
img {
will-change: transform;
margin-bottom: 5px;
opacity: 1;
@include transition-all(0.3s);
}
&:hover {
box-shadow: 0 0 15px 3px var(--theme-color-text_dark_005);
transition: 0.3s ease;
.slide_info {
opacity: 1;
}
img {
opacity: 0;
}
}
}
.slider_container {
padding: 20px;
margin: -20px;
}
}
/* Custom styles for header( inner section absolute, layout title full height ) */
.header_fullscreen {
height: 100vh !important;
&:before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100vh;
background-color: #000;
opacity: 0.4;
z-index: 1;
pointer-events: none;
}
.elementor-widget-trx_sc_layouts_title {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
.sc_layouts_title {
min-height: 100vh;
}
}
}
.no-inner-padding .slider_container .slide_content {
padding: 0 !important;
}
.line-height-0 .elementor-grid-item,
.line-height-0 .elementor-icon-wrapper {
line-height: 0 !important;
}
body.with_bg_canvas .page_content_wrap {
background-color: transparent;
}
.up-translateZ {
@include transform(translateZ(500px));
}
.up-translateZ-wrap .elementor-column-wrap,
.up-translateZ-wrap .elementor-widget-wrap {
@include transform(translateZ(0))
}
.up-translateZ-elem {
@include transform(translateZ(20px));
}
.up-translateZ-elem-front {
@include transform(translateZ(200px));
}
body:not(.elementor-editor-active) {
.no-title img {
pointer-events:none;
}
}
.play_center {
.elementor-icon-wrapper {
line-height: 0;
}
}
.play_center .icon-play:before {
letter-spacing: -3px;
}
.play_center .elementor-icon i,
.play_center .elementor-icon svg {
left: 2px;
}
.extra_view_button {
.sc_button_wrap .sc_button {
margin-bottom: 15px;
}
.sc_button_wrap {
margin-bottom: -15px;
}
}
.extra-icon-padding {
.sc_icons_fill .sc_icons_item {
padding: 3em 2.2em;
}
.sc_icons_fill .sc_icons_icon + .sc_icons_item_details,
.sc_icons_fill .sc_icons_image + .sc_icons_item_details {
margin-top: 1.6em;
}
.sc_icons_item_title {
font-size: 24px;
}
.sc_icons_fill .sc_icons_item .sc_icons_item_description {
font-size: 17px;
}
}
.shop-nav-slider-custom .widget_slider .slider_container.slider_controls_side .slider_controls_wrap > a {
background-color: transparent;
color: var(--theme-color-text);
&:before {
font-size: 22px;
}
&.slider_prev {
margin-left: 0;
&:before {
content: '\e837';
}
}
&.slider_next {
margin-right: 0;
&:before {
content: '\e836';
}
}
&:hover {
color: var(--theme-color-text_dark);
background-color: transparent;
}
}
.extra-big-title .sc_item_title {
@include font(5.167em, 1em, 600);
letter-spacing: -3.3px;
> .trx_addons_text_gradient {
padding-right: 2px;
padding-left: 2px;
}
}
/* BG Canvas */
.bg_canvas {
//background-color: var(--theme-color-bg_color) !important;
}
/* Autofill Off */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
outline: none;
caret-color: #ffffff;
-webkit-text-fill-color: var(--theme-color-input_text);
@include box-shadow(0 0 0 1000px transparent inset);
@include transition(background-color 5000s ease-in-out 0s !important);
background: transparent;
filter: none;
}
/* Latepoint */
.latepoint-w.latepoint-with-summary:not(.latepoint-hide-side-panel).latepoint-summary-is-open.show-summary-on-mobile .latepoint-summary-w,
.latepoint-w.latepoint-with-summary.latepoint-summary-is-open.show-summary-on-mobile .latepoint-summary-w {
z-index: 10000;
}
@media (min-width: 479px) and (max-width:767px) {
.latepoint-w .latepoint-booking-form-element .latepoint-side-panel {
display: none;
}
.latepoint-w .latepoint-summary-w {
display: none !important;
}
.latepoint-w .latepoint-booking-form-element .latepoint-form-w {
max-width: 100%;
}
}
@media (max-width:479px) {
.os-dates-w {
margin: 0 -0.5%;
}
.latepoint-w .latepoint-booking-form-element .os-monthly-calendar-days,
.latepoint-w .latepoint-booking-form-element .os-weekdays {
grid-gap: 10px;
}
.latepoint-w.latepoint-shortcode-booking-form .latepoint-booking-form-element {
margin: 0;
}
.latepoint-w .latepoint-booking-form-element .os-items .os-item .os-item-i .os-item-img-w {
flex: 0 0 40px;
height: 40px;
margin-right: 10px;
}
.latepoint-w .latepoint-booking-form-element .os-items .os-item .os-item-i .os-item-price-w {
padding-left: 10px;
}
.latepoint-w .latepoint-booking-form-element .os-items .os-item .os-item-i .os-item-name-w .os-item-name {
font-size: 15px;
}
.latepoint-w .latepoint-booking-form-element .os-items .os-item .os-item-i .os-item-price-w .os-item-price {
font-size: 16px;
}
.latepoint-w .latepoint-booking-form-element .latepoint-form-w .latepoint-footer .latepoint-btn {
padding: 8px;
}
.latepoint-w .latepoint-booking-form-element .latepoint-form-w .latepoint-heading-w .os-heading-text {
font-size: 16px;
}
.latepoint-w .latepoint-booking-form-element .os-items.os-as-grid .os-item .os-item-i {
padding: 8px;
}
.latepoint-w .latepoint-booking-form-element .os-items.os-as-grid .os-item .os-item-i .os-item-img-w.os-with-avatar {
padding: 4px 5px 15px;
}
.latepoint-w .latepoint-booking-form-element .os-items.os-as-grid .os-item .os-item-i .os-item-name-w {
padding-top: 5px;
}
.latepoint-w .latepoint-booking-form-element .os-items .os-item .os-item-i .os-item-name-w .os-item-name {
font-size: 14px;
}
.latepoint-w .latepoint-booking-form-element .os-items .os-item-details-btn {
bottom: -7px;
}
.os-current-month-label-w .os-current-month-label {
font-size: 16px;
}
.os-monthly-calendar-days .os-day {
font-size: 13px;
}
.latepoint-booking-form-element .os-step-tabs .os-step-tab.active {
font-size: 14px;
}
.latepoint-booking-form-element .os-step-tabs {
height: auto;
}
.latepoint-w .os-form-group.os-form-textfield-group textarea.os-form-control, .latepoint-w .os-form-group.os-form-textfield-group select.os-form-control, .latepoint-w .os-form-group.os-form-textfield-group input[type="password"].os-form-control, .latepoint-w .os-form-group.os-form-textfield-group input[type="email"].os-form-control, .latepoint-w .os-form-group.os-form-textfield-group input[type="number"].os-form-control, .latepoint-w .os-form-group.os-form-textfield-group input[type="text"].os-form-control {
font-size: 14px !important;
}
}
/* Backstage */
.backstage-customizer-access-wrapper .backstage-customizer-access-button {
font-size: 15px;
font-weight: 400;
background-color: var(--theme-color-text_link);
@include transition-all(0.3s);
&:hover {
background-color: var(--theme-color-text_hover);
}
a {
padding: 6px 14px;
}
}
// rotate-hover
.rotate-hover.elementor-view-framed .elementor-icon {
border-color: var(--theme-color-bd_color);
fill: var(--theme-color-text_dark);
svg {
@include transform(rotateZ(0));
@include transition-all(0.3s);
}
}
.sc_cover:hover + .elementor-container .rotate-hover.elementor-view-framed .elementor-icon,
.rotate-hover.elementor-view-framed .elementor-icon:hover {
border-color: var(--theme-color-text_dark);
svg {
@include transform(rotateZ(-45deg));
}
}
// num-hover
.num-hover,
.num-hover * {
color: var(--theme-color-text);
@include transition-all(0.3s);
.sc_cover:hover + .elementor-container & {
color: var(--theme-color-text_link);
}
}
// hover-color-text
.hover-color-text,
.hover-color-text * {
color: var(--theme-color-text_dark);
@include transition-all(0.3s);
.sc_cover:hover + .elementor-container & {
color: var(--theme-color-text);
}
}
// rotate-hover-2
.rotate-hover-2 .elementor-icon svg {
@include transition-all(0.3s);
@include transform(rotateZ(0));
fill: var(--theme-color-text_dark);
}
.sc_cover:hover + .elementor-container .rotate-hover-2 .elementor-icon,
.rotate-hover-2 .elementor-icon:hover {
svg {
@include transform(rotateZ(45deg));
fill: var(--theme-color-text_link);
}
}
// divider-hover
.divider-hover .elementor-divider-separator {
@include transition-all(0.3s);
}
.sc_cover:hover + [class*="elementor-"] .divider-hover .elementor-divider-separator,
.divider-hover:hover .elementor-divider-separator {
border-color: var(--theme-color-text_link) !important;
}
// Timetable style
.timetable-style {
.elementor-widget-heading .elementor-widget-container {
height: 100%;
padding: 6px;
@include flex();
@include flex-direction(column);
@include flex-justify-content(center);
background-color: var(--theme-color-alter_bg_color);
}
.elementor-heading-title {
@include font(14px, 1.3em, 400);
}
@media #{$media_sm} {
.elementor-widget-heading {
height: auto !important;
}
}
}
.nowrap {
white-space: nowrap;
}
/* Tags Ticker */
.tags_ticker {
.trx_addons_bg_text {
.trx_addons_bg_text_char {
font-family: var(--theme-font-h5_font-family);
text-transform: uppercase;
.tag {
margin-right: 8px;
padding: 14px 30px 15px;
color: var(--theme-color-alter_dark);
background-color: var(--theme-color-alter_bg_color);
@include border-radius(0);
@media #{$media_md} {
padding: 9px 20px 10px !important;
}
}
}
}
}